Fixed trimmed address not showing in address-table (#273)

* Fixed addresses not showing

* Fix issue with trimWrapperVisible

* Fixed unlockPanelFooter styles

* Updated Trim

* Updated Trim

* Updated changelog

---------

Co-authored-by: Gavrila Andrei <andrei.gavrila@multiversx.com>

Author: iuliacimpeanu

CHANGELOG.md

@@ -7,6 +7,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+- [Fixed trimmed address not showing in address-table](https://github.com/multiversx/mx-sdk-dapp-ui/pull/273)
 - [Added minimize/maximize action for toasts](https://github.com/multiversx/mx-sdk-dapp-ui/pull/272)
 - [Eslint and prettierrc fixes](https://github.com/multiversx/mx-sdk-dapp-ui/pull/270)
 - [Refactored sign transactions panel internal components](https://github.com/multiversx/mx-sdk-dapp-ui/pull/267)

src/common/Trim/trim.styles.ts

@@ -4,7 +4,7 @@ export default {
     trimFull: 'trim-full mvx:text-transparent mvx:absolute mvx:leading-5',
     trimFullVisible: 'trim-full-visible mvx:!text-inherit mvx:relative mvx:leading-5',
     trimWrapper: 'trim-wrapper mvx:hidden',
-    trimWrapperVisible: 'trim-wrapper-visible mvx:overflow-hidden mvx:max-w-full mvx:flex',
+    trimWrapperVisible: 'trim-wrapper-visible mvx:overflow-hidden mvx:max-w-full mvx:!flex',
     trimEllipsisWrapper: 'trim-ellipsis-wrapper mvx:block mvx:flex-shrink-0 mvx:pointer-events-none mvx:select-none',
     trimEllipsis: 'trim-ellipsis mvx:block mvx:leading-5',
     trimLeftWrapper: 'trim-left-wrapper mvx:flex-shrink mvx:text-ellipsis mvx:overflow-hidden mvx:text-left mvx:text-[1px]',

src/components/common/button/button.tsx

@@ -18,6 +18,10 @@ export class Button {
   @Prop() size?: `${ButtonSizeEnum}` = 'large';
   @Prop() variant?: `${ButtonVariantEnum}` = 'primary';
 
+  private handleClick = (event: MouseEvent) => {
+    this.buttonClick.emit(event);
+  };
+
   render() {
     return (
       <ButtonComponent
@@ -26,6 +30,7 @@ export class Button {
         disabled={this.disabled}
         size={this.size}
         variant={this.variant}
+        onClick={this.handleClick}
       >
         <slot />
       </ButtonComponent>

src/components/functional/unlock-panel/components/UnlockPanelFooter/unlockPanelFooter.styles.ts

@@ -1,7 +1,7 @@
 // prettier-ignore
 export default {
     unlockButton: 'unlock-panel-footer-icon mvx:text-primary mvx:w-4 mvx:h-auto mvx:hidden mvx:xs:flex mvx:ml-auto mvx:mt-auto',
-    unlockPanelFooter: 'unlock-panel-footer mvx:mt-auto mvx:flex mvx:cursor-pointer mvx:relative mvx:p-6 mvx:z-1 mvx:rounded-2xl mvx:overflow-hidden mvx:border mvx:border-outline mvx:bg-emphasize mvx:shadow-[0px_-8px_12px_12px_surface] group',
+    unlockPanelFooter: 'unlock-panel-footer mvx:mt-auto mvx:flex mvx:cursor-pointer mvx:relative mvx:p-6 mvx:z-1 mvx:rounded-2xl mvx:border mvx:border-outline mvx:bg-emphasize mvx:shadow-[0px_-8px_12px_12px_surface] group',
     unlockPanelFooterImage: 'unlock-panel-footer-image mvx:pointer-events-none mvx:-mt-8 mvx:mr-12 mvx:-mb-8 mvx:-ml-20 mvx:hidden mvx:max-h-48 mvx:xs:flex',
     unlockPanelFooterWrapper: 'unlock-panel-footer-wrapper mvx:flex mvx:flex-col mvx:transition-all mvx:duration-200 mvx:gap-2 mvx:flex-1 mvx:ease-in-out mvx:xs:gap-4 group-hover:mvx:opacity-75',
     unlockPanelFooterTitle: 'unlock-panel-footer-title mvx:font-medium mvx:leading-none mvx:text-base mvx:text-primary mvx:xs:pt-4 mvx:xs:text-xl',

src/components/functional/unlock-panel/unlock-panel.types.ts

@@ -1,4 +1,4 @@
-import type { IProviderBase } from 'components';
+import { IProviderBase } from "types/provider.types";
 
 // Extend the Window interface globally to include custom properties
 export interface ExtendedWindow extends Window {