@progressio_resources/gravity-design-system 3.3.41 → 3.3.43

package/fesm2022/progressio_resources-gravity-design-system.mjs

@@ -402,11 +402,11 @@ class GravityCurrencyDisplayV2Component {
         this.type = 'full';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityCurrencyDisplayV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityCurrencyDisplayV2Component, selector: "gravity-currency-display-v2", inputs: { disabled: "disabled", type: "type", currency: "currency" }, ngImport: i0, template: "<section class=\"gravity-currency-display\">\n    <gravity-currency *ngIf=\"type === 'full'\"\n        [disabled]=\"disabled\" [size]=\"'md-24'\"\n        [currency]=\"{ currency_id: currency.currency_id}\">\n    </gravity-currency>\n\n    <section class=\"currency-info {{type}}\" [class.disabled]=\"disabled\">\n        <div class=\"iso-and-network\">\n            <div class=\"currency-iso\">\n                <gravity-currency *ngIf=\"type !== 'full'\"\n                    [disabled]=\"disabled\" [size]=\"'sm-16'\"\n                    [currency]=\"{ currency_id: currency.currency_id}\" >\n                </gravity-currency>\n\n                <span class=\"hr-body sm-bold\">{{currency.currency_iso}}</span>\n            </div>\n\n            <gravity-network-pill *ngIf=\"type !== 'fiat-short' && (currency?.network_iso && currency?.network_id)\"\n                [disabled]=\"disabled\"\n                [type]=\"currency?.pill_type\"\n                [network]=\"{ iso: currency?.network_iso, id: currency?.network_id }\" >\n            </gravity-network-pill>\n        </div>\n\n        <span *ngIf=\"!type.startsWith('short')\" class=\"hr-body sm-regular\">{{currency?.currency_name}}</span>\n    </section>\n</section>\n", styles: [".gravity-currency-display{display:flex;align-items:center;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info .iso-and-network{display:flex;align-items:center;gap:var(--gravity-spacing-xxxs)}.gravity-currency-display .currency-info .iso-and-network .currency-iso{display:flex;align-items:center;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info span{height:9px;line-height:9px;width:max-content}.gravity-currency-display .currency-info.short-vrt .iso-and-network{flex-direction:column;align-items:flex-start;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info.fiat-short{align-items:center;flex-direction:row}.gravity-currency-display .currency-info.fiat-short span{margin-top:var(--gravity-spacing-xxxs)}.gravity-currency-display .currency-info.disabled span{color:var(--on-bg-disabled)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GravityCurrencyComponent, selector: "gravity-currency", inputs: ["cypressTag", "disabled", "size", "currency", "showLayers"] }, { kind: "component", type: GravityNetworkPillComponent, selector: "gravity-network-pill", inputs: ["cypressTag", "disabled", "showNetworkIcon", "network", "type"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityCurrencyDisplayV2Component, selector: "gravity-currency-display-v2", inputs: { disabled: "disabled", type: "type", currency: "currency" }, ngImport: i0, template: "<section class=\"gravity-currency-display\">\n    <gravity-currency *ngIf=\"type === 'full'\"\n        [disabled]=\"disabled\" [size]=\"'md-24'\"\n        [currency]=\"{ currency_id: currency.currency_id}\">\n    </gravity-currency>\n\n    <section class=\"currency-info {{type}}\" [class.disabled]=\"disabled\">\n        <div class=\"iso-and-network\">\n            <div class=\"currency-iso\">\n                <gravity-currency *ngIf=\"type !== 'full'\"\n                    [disabled]=\"disabled\" [size]=\"'sm-16'\"\n                    [currency]=\"{ currency_id: currency.currency_id}\" >\n                </gravity-currency>\n\n                <span class=\"hr-body sm-bold\">{{currency.currency_iso}}</span>\n            </div>\n\n            <gravity-network-pill *ngIf=\"type !== 'fiat-short' && (currency?.network_iso && currency?.network_id)\"\n                [disabled]=\"disabled\"\n                [type]=\"currency?.pill_type || 'primary'\"\n                [network]=\"{ iso: currency?.network_iso, id: currency?.network_id }\" >\n            </gravity-network-pill>\n        </div>\n\n        <span *ngIf=\"!type.startsWith('short')\" class=\"hr-body sm-regular\">{{currency?.currency_name}}</span>\n    </section>\n</section>\n", styles: [".gravity-currency-display{display:flex;align-items:center;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info .iso-and-network{display:flex;align-items:center;gap:var(--gravity-spacing-xxxs)}.gravity-currency-display .currency-info .iso-and-network .currency-iso{display:flex;align-items:center;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info span{height:9px;line-height:9px;width:max-content}.gravity-currency-display .currency-info.short-vrt .iso-and-network{flex-direction:column;align-items:flex-start;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info.fiat-short{align-items:center;flex-direction:row}.gravity-currency-display .currency-info.fiat-short span{margin-top:var(--gravity-spacing-xxxs)}.gravity-currency-display .currency-info.disabled span{color:var(--on-bg-disabled)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GravityCurrencyComponent, selector: "gravity-currency", inputs: ["cypressTag", "disabled", "size", "currency", "showLayers"] }, { kind: "component", type: GravityNetworkPillComponent, selector: "gravity-network-pill", inputs: ["cypressTag", "disabled", "showNetworkIcon", "network", "type"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityCurrencyDisplayV2Component, decorators: [{
             type: Component,
-            args: [{ selector: 'gravity-currency-display-v2', template: "<section class=\"gravity-currency-display\">\n    <gravity-currency *ngIf=\"type === 'full'\"\n        [disabled]=\"disabled\" [size]=\"'md-24'\"\n        [currency]=\"{ currency_id: currency.currency_id}\">\n    </gravity-currency>\n\n    <section class=\"currency-info {{type}}\" [class.disabled]=\"disabled\">\n        <div class=\"iso-and-network\">\n            <div class=\"currency-iso\">\n                <gravity-currency *ngIf=\"type !== 'full'\"\n                    [disabled]=\"disabled\" [size]=\"'sm-16'\"\n                    [currency]=\"{ currency_id: currency.currency_id}\" >\n                </gravity-currency>\n\n                <span class=\"hr-body sm-bold\">{{currency.currency_iso}}</span>\n            </div>\n\n            <gravity-network-pill *ngIf=\"type !== 'fiat-short' && (currency?.network_iso && currency?.network_id)\"\n                [disabled]=\"disabled\"\n                [type]=\"currency?.pill_type\"\n                [network]=\"{ iso: currency?.network_iso, id: currency?.network_id }\" >\n            </gravity-network-pill>\n        </div>\n\n        <span *ngIf=\"!type.startsWith('short')\" class=\"hr-body sm-regular\">{{currency?.currency_name}}</span>\n    </section>\n</section>\n", styles: [".gravity-currency-display{display:flex;align-items:center;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info .iso-and-network{display:flex;align-items:center;gap:var(--gravity-spacing-xxxs)}.gravity-currency-display .currency-info .iso-and-network .currency-iso{display:flex;align-items:center;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info span{height:9px;line-height:9px;width:max-content}.gravity-currency-display .currency-info.short-vrt .iso-and-network{flex-direction:column;align-items:flex-start;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info.fiat-short{align-items:center;flex-direction:row}.gravity-currency-display .currency-info.fiat-short span{margin-top:var(--gravity-spacing-xxxs)}.gravity-currency-display .currency-info.disabled span{color:var(--on-bg-disabled)}\n"] }]
+            args: [{ selector: 'gravity-currency-display-v2', template: "<section class=\"gravity-currency-display\">\n    <gravity-currency *ngIf=\"type === 'full'\"\n        [disabled]=\"disabled\" [size]=\"'md-24'\"\n        [currency]=\"{ currency_id: currency.currency_id}\">\n    </gravity-currency>\n\n    <section class=\"currency-info {{type}}\" [class.disabled]=\"disabled\">\n        <div class=\"iso-and-network\">\n            <div class=\"currency-iso\">\n                <gravity-currency *ngIf=\"type !== 'full'\"\n                    [disabled]=\"disabled\" [size]=\"'sm-16'\"\n                    [currency]=\"{ currency_id: currency.currency_id}\" >\n                </gravity-currency>\n\n                <span class=\"hr-body sm-bold\">{{currency.currency_iso}}</span>\n            </div>\n\n            <gravity-network-pill *ngIf=\"type !== 'fiat-short' && (currency?.network_iso && currency?.network_id)\"\n                [disabled]=\"disabled\"\n                [type]=\"currency?.pill_type || 'primary'\"\n                [network]=\"{ iso: currency?.network_iso, id: currency?.network_id }\" >\n            </gravity-network-pill>\n        </div>\n\n        <span *ngIf=\"!type.startsWith('short')\" class=\"hr-body sm-regular\">{{currency?.currency_name}}</span>\n    </section>\n</section>\n", styles: [".gravity-currency-display{display:flex;align-items:center;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info .iso-and-network{display:flex;align-items:center;gap:var(--gravity-spacing-xxxs)}.gravity-currency-display .currency-info .iso-and-network .currency-iso{display:flex;align-items:center;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info span{height:9px;line-height:9px;width:max-content}.gravity-currency-display .currency-info.short-vrt .iso-and-network{flex-direction:column;align-items:flex-start;gap:var(--gravity-spacing-xxs)}.gravity-currency-display .currency-info.fiat-short{align-items:center;flex-direction:row}.gravity-currency-display .currency-info.fiat-short span{margin-top:var(--gravity-spacing-xxxs)}.gravity-currency-display .currency-info.disabled span{color:var(--on-bg-disabled)}\n"] }]
         }], propDecorators: { disabled: [{
                 type: Input
             }], type: [{
@@ -447,8 +447,8 @@ class GravityDropdownListComponent {
         this.isoConfig = 'iso';
         this.availableOptions = [];
         this.dropdownOpened = false;
-        this.networkConfig = null;
         this.openChildrenMap = new Map();
+        this.networkConfig = null;
     }
     ngOnChanges(changes) {
         if (changes['items']?.currentValue) {
@@ -898,16 +898,20 @@ class GravityDropdownListDisplayComponent {
         // Size and Width
         this.size = 'md';
         this.width = 'standard';
+        this.isHovered = false;
         this.availableOptions = [];
         this.dropdownOpened = false;
         this.searchText = '';
         this.selectedItems = [];
     }
-    ngOnInit() {
-        this.loadItems();
-        this.availableOptions = this.items;
-        if (this.defaultSelectedItemIndex != null) {
-            this.selectItem(this.items[this.defaultSelectedItemIndex]);
+    ngOnChanges(changes) {
+        if (changes['items'] && changes['items'].currentValue) {
+            this.availableOptions = [...changes['items'].currentValue];
+            this.loadItems();
+            if (this.defaultSelectedItemIndex != null && this.items[this.defaultSelectedItemIndex]) {
+                this.selectedItem = this.items[this.defaultSelectedItemIndex];
+                this.selectedItems = [this.selectedItem];
+            }
         }
     }
     loadItems() {
@@ -945,7 +949,8 @@ class GravityDropdownListDisplayComponent {
                     this.selectedItemsResponse.emit(this.selectedItems[0]);
                 }
                 this.searchText = '';
-                this.availableOptions = this.items;
+                this.availableOptions = [...this.items];
+                this.loadItems();
             }
         }
     }
@@ -970,12 +975,18 @@ class GravityDropdownListDisplayComponent {
             this.availableOptions = this.items;
         }
     }
+    onMouseEnter() {
+        this.isHovered = true;
+    }
+    onMouseLeave() {
+        this.isHovered = false;
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityDropdownListDisplayComponent, deps: [{ token: FilterByPipe }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityDropdownListDisplayComponent, selector: "gravity-dropdown-list-display", inputs: { cypressTag: "cypressTag", placeholder: "placeholder", currentLang: "currentLang", isReadonly: "isReadonly", isDisabled: "isDisabled", customValues: "customValues", disableSearch: "disableSearch", defaultSelectedItemIndex: "defaultSelectedItemIndex", items: "items", size: "size", width: "width" }, outputs: { selectedItemsResponse: "response" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, providers: [FilterByPipe], viewQueries: [{ propertyName: "watch", first: true, predicate: ["searchInput"], descendants: true }], ngImport: i0, template: "<div [attr.data-cy]=\"cypressTag\" class=\"gravity-input-field {{size}} {{width}}-width {{getStatus()}}\"\n     (click)=\"toggleDropdown()\">\n\n    <p class=\"hr-label {{size}}-regular value\">\n        <ng-container *ngIf=\"selectedItems.length == 0\">{{ placeholder }}</ng-container>\n        <ng-container *ngIf=\"selectedItems.length > 0\">\n            <gravity-currency-display-v2\n                [currency]=\"{currency_name: this.selectedItem.currency_name,\n                            currency_id: this.selectedItem.currency_id, currency_iso: this.selectedItem.currency_iso,\n                            network_id: this.selectedItem.network_id, network_iso: this.selectedItem.network_iso}\">\n            </gravity-currency-display-v2>\n        </ng-container>\n    </p>\n\n    <gravity-icon class=\"right\" [iconName]=\"dropdownOpened ? 'arrow-up': 'arrow-down'\" [iconSize]=\"'md-16'\"\n                  *ngIf=\"!isReadonly\"></gravity-icon>\n    <div class=\"dropdown-panel\" (click)=\"$event.stopPropagation()\" *ngIf=\"dropdownOpened\"\n         [attr.data-cy]=\"cypressTag + '_panel'\">\n\n        <div class=\"search-input\" [class.disabled]=\"disableSearch\">\n            <gravity-icon [style.--icon-color]=\"disableSearch ? 'var(--on-bg-disabled)' : null\"\n                          class=\"search-icon\" [iconName]=\"'search'\" [iconSize]=\"'sm-12'\">\n            </gravity-icon>\n            <input autocomplete=\"off\" class=\"hr-label {{size}}-regular\" (input)=\"filterItems()\"\n                   [attr.data-cy]=\"cypressTag + '_search_input'\" #searchInput [disabled]=\"disableSearch\"\n                   [(ngModel)]=\"searchText\" placeholder=\"{{currentLang == 'es' ? 'Buscar moneda' : 'Search currency'}}\">\n            <gravity-icon class=\"pointer reset-icon\" (click)=\"searchText = ''; filterItems()\" [iconName]=\"'unsuccess'\"\n                          [iconSize]=\"'sm-12'\" *ngIf=\"searchText?.length > 0\">\n            </gravity-icon>\n        </div>\n\n        <div class=\"items-container\">\n            <div class=\"items\">\n                <div class=\"item-container\" *ngFor=\"let item of availableOptions\" [class.expanded]=\"item.is_expanded\">\n                    <div class=\"hr-label item {{size}}-regular pointer\" [class.disabled]=\"item?.disabled\"\n                         [class.selected]=\"item.sub_items?.length > 0 ? null : checkIfSelected(item)\"\n                         (click)=\"item.sub_items?.length > 0 ? item.is_expanded = !item.is_expanded : selectItem(item)\">\n\n                        <gravity-currency-display-v2\n                            [disabled]=\"item?.disabled\"\n                            [currency]=\"{ currency_name: item.currency_name,\n                                        currency_iso: item.currency_iso, currency_id: item.currency_id,\n                                        network_id: item.network_id, network_iso: item.network_iso}\">\n                        </gravity-currency-display-v2>\n\n                        <span *ngIf=\"!item.sub_items\" class=\"hr-body sm-regular gravity-margin-right-sm currency-info\">\n                            {{ item?.balance_amount }} {{ item?.balance_currency }}\n                        </span>\n\n                        <gravity-icon *ngIf=\"item.sub_items?.length > 0 && item?.disabled !== true\" class=\"pointer expand-icon\"\n                                      [iconSize]=\"'sm-12'\" [iconName]=\"item.is_expanded ? 'arrow-up' : 'arrow-down'\">\n                        </gravity-icon>\n                    </div>\n\n                    <ng-container *ngIf=\"item.is_expanded && item.sub_items\">\n                        <div class=\"hr-label item {{size}}-regular pointer\" *ngFor=\"let subItem of item.sub_items\"\n                             [class.selected]=\"checkIfSelected(subItem)\" (click)=\"selectItem(subItem)\" [class.disabled]=\"subItem?.disabled\">\n\n                            <div class=\"subitem-line\"></div>\n                            <gravity-currency-display-v2\n                                [disabled]=\"subItem?.disabled\"\n                                [currency]=\"{ currency_name: subItem.currency_name,\n                                            currency_iso: subItem.currency_iso, currency_id: subItem.currency_id,\n                                            network_id: subItem.network_id, network_iso: subItem.network_iso}\" >\n                            </gravity-currency-display-v2>\n\n                            <span class=\"hr-body sm-regular gravity-margin-right-sm currency-info\">\n                                {{ subItem.balance_amount }} {{ subItem.balance_currency }}\n                            </span>\n                        </div>\n                    </ng-container>\n                </div>\n\n                <div class=\"hr-label item {{size}}-bold no-results\" *ngIf=\"availableOptions.length === 0\">\n                    {{ currentLang == 'es' ? 'Sin resultados' : 'No results' }}\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n\n<div class=\"wallet-balance-info\" *ngIf=\"selectedItems.length > 0\">\n    <p class=\"hr-label sm-regular\">{{ currentLang == 'es' ? 'Saldo de cartera' : 'Wallet balance' }}\n        : {{ this.selectedItem.balance_amount }} {{ this.selectedItem.balance_currency }}</p>\n</div>\n\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}:root{--gravity-spacing-none: 0;--gravity-spacing-xxxs: .125rem;--gravity-spacing-xxs: .25rem;--gravity-spacing-xs: .5rem;--gravity-spacing-sm: 1rem;--gravity-spacing-md: 1.5rem;--gravity-spacing-lg: 2rem;--gravity-spacing-xl: 2.5rem;--gravity-spacing-xxl: 3rem;--gravity-spacing-xxxl: 4rem;--gravity-spacing-xxxxl: 6rem;--gravity-spacing-xxxxxl: 12rem}.gravity-padding-none{padding:0!important}.gravity-padding-top-none{padding-top:0!important}.gravity-padding-bottom-none{padding-bottom:0!important}.gravity-padding-left-none{padding-left:0!important}.gravity-padding-right-none{padding-right:0!important}.gravity-padding-block-none{padding-block:0!important}.gravity-padding-inline-none{padding-inline:0!important}.gravity-padding-xxs{padding:.25rem!important}.gravity-padding-top-xxs{padding-top:.25rem!important}.gravity-padding-bottom-xxs{padding-bottom:.25rem!important}.gravity-padding-left-xxs{padding-left:.25rem!important}.gravity-padding-right-xxs{padding-right:.25rem!important}.gravity-padding-block-xxs{padding-block:.25rem!important}.gravity-padding-inline-xxs{padding-inline:.25rem!important}.gravity-padding-xs{padding:.5rem!important}.gravity-padding-top-xs{padding-top:.5rem!important}.gravity-padding-bottom-xs{padding-bottom:.5rem!important}.gravity-padding-left-xs{padding-left:.5rem!important}.gravity-padding-right-xs{padding-right:.5rem!important}.gravity-padding-block-xs{padding-block:.5rem!important}.gravity-padding-inline-xs{padding-inline:.5rem!important}.gravity-padding-sm{padding:1rem!important}.gravity-padding-top-sm{padding-top:1rem!important}.gravity-padding-bottom-sm{padding-bottom:1rem!important}.gravity-padding-left-sm{padding-left:1rem!important}.gravity-padding-right-sm{padding-right:1rem!important}.gravity-padding-block-sm{padding-block:1rem!important}.gravity-padding-inline-sm{padding-inline:1rem!important}.gravity-padding-md{padding:1.5rem!important}.gravity-padding-top-md{padding-top:1.5rem!important}.gravity-padding-bottom-md{padding-bottom:1.5rem!important}.gravity-padding-left-md{padding-left:1.5rem!important}.gravity-padding-right-md{padding-right:1.5rem!important}.gravity-padding-block-md{padding-block:1.5rem!important}.gravity-padding-inline-md{padding-inline:1.5rem!important}.gravity-padding-lg{padding:2rem!important}.gravity-padding-top-lg{padding-top:2rem!important}.gravity-padding-bottom-lg{padding-bottom:2rem!important}.gravity-padding-left-lg{padding-left:2rem!important}.gravity-padding-right-lg{padding-right:2rem!important}.gravity-padding-block-lg{padding-block:2rem!important}.gravity-padding-inline-lg{padding-inline:2rem!important}.gravity-padding-xl{padding:2.5rem!important}.gravity-padding-top-xl{padding-top:2.5rem!important}.gravity-padding-bottom-xl{padding-bottom:2.5rem!important}.gravity-padding-left-xl{padding-left:2.5rem!important}.gravity-padding-right-xl{padding-right:2.5rem!important}.gravity-padding-block-xl{padding-block:2.5rem!important}.gravity-padding-inline-xl{padding-inline:2.5rem!important}.gravity-padding-xxl{padding:3rem!important}.gravity-padding-top-xxl{padding-top:3rem!important}.gravity-padding-bottom-xxl{padding-bottom:3rem!important}.gravity-padding-left-xxl{padding-left:3rem!important}.gravity-padding-right-xxl{padding-right:3rem!important}.gravity-padding-block-xxl{padding-block:3rem!important}.gravity-padding-inline-xxl{padding-inline:3rem!important}.gravity-padding-xxxl{padding:4rem!important}.gravity-padding-top-xxxl{padding-top:4rem!important}.gravity-padding-bottom-xxxl{padding-bottom:4rem!important}.gravity-padding-left-xxxl{padding-left:4rem!important}.gravity-padding-right-xxxl{padding-right:4rem!important}.gravity-padding-block-xxxl{padding-block:4rem!important}.gravity-padding-inline-xxxl{padding-inline:4rem!important}.gravity-padding-xxxxl{padding:6rem!important}.gravity-padding-top-xxxxl{padding-top:6rem!important}.gravity-padding-bottom-xxxxl{padding-bottom:6rem!important}.gravity-padding-left-xxxxl{padding-left:6rem!important}.gravity-padding-right-xxxxl{padding-right:6rem!important}.gravity-padding-block-xxxxl{padding-block:6rem!important}.gravity-padding-inline-xxxxl{padding-inline:6rem!important}.gravity-padding-xxxxxl{padding:12rem!important}.gravity-padding-top-xxxxxl{padding-top:12rem!important}.gravity-padding-bottom-xxxxxl{padding-bottom:12rem!important}.gravity-padding-left-xxxxxl{padding-left:12rem!important}.gravity-padding-right-xxxxxl{padding-right:12rem!important}.gravity-padding-block-xxxxxl{padding-block:12rem!important}.gravity-padding-inline-xxxxxl{padding-inline:12rem!important}.gravity-margin-none{margin:0!important}.gravity-margin-top-none{margin-top:0!important}.gravity-margin-bottom-none{margin-bottom:0!important}.gravity-margin-left-none{margin-left:0!important}.gravity-margin-right-none{margin-right:0!important}.gravity-margin-block-none{margin-block:0!important}.gravity-margin-inline-none{margin-inline:0!important}.gravity-margin-xxs{margin:.25rem!important}.gravity-margin-top-xxs{margin-top:.25rem!important}.gravity-margin-bottom-xxs{margin-bottom:.25rem!important}.gravity-margin-left-xxs{margin-left:.25rem!important}.gravity-margin-right-xxs{margin-right:.25rem!important}.gravity-margin-block-xxs{margin-block:.25rem!important}.gravity-margin-inline-xxs{margin-inline:.25rem!important}.gravity-margin-xs{margin:.5rem!important}.gravity-margin-top-xs{margin-top:.5rem!important}.gravity-margin-bottom-xs{margin-bottom:.5rem!important}.gravity-margin-left-xs{margin-left:.5rem!important}.gravity-margin-right-xs{margin-right:.5rem!important}.gravity-margin-block-xs{margin-block:.5rem!important}.gravity-margin-inline-xs{margin-inline:.5rem!important}.gravity-margin-sm{margin:1rem!important}.gravity-margin-top-sm{margin-top:1rem!important}.gravity-margin-bottom-sm{margin-bottom:1rem!important}.gravity-margin-left-sm{margin-left:1rem!important}.gravity-margin-right-sm{margin-right:1rem!important}.gravity-margin-block-sm{margin-block:1rem!important}.gravity-margin-inline-sm{margin-inline:1rem!important}.gravity-margin-md{margin:1.5rem!important}.gravity-margin-top-md{margin-top:1.5rem!important}.gravity-margin-bottom-md{margin-bottom:1.5rem!important}.gravity-margin-left-md{margin-left:1.5rem!important}.gravity-margin-right-md{margin-right:1.5rem!important}.gravity-margin-block-md{margin-block:1.5rem!important}.gravity-margin-inline-md{margin-inline:1.5rem!important}.gravity-margin-lg{margin:2rem!important}.gravity-margin-top-lg{margin-top:2rem!important}.gravity-margin-bottom-lg{margin-bottom:2rem!important}.gravity-margin-left-lg{margin-left:2rem!important}.gravity-margin-right-lg{margin-right:2rem!important}.gravity-margin-block-lg{margin-block:2rem!important}.gravity-margin-inline-lg{margin-inline:2rem!important}.gravity-margin-xl{margin:2.5rem!important}.gravity-margin-top-xl{margin-top:2.5rem!important}.gravity-margin-bottom-xl{margin-bottom:2.5rem!important}.gravity-margin-left-xl{margin-left:2.5rem!important}.gravity-margin-right-xl{margin-right:2.5rem!important}.gravity-margin-block-xl{margin-block:2.5rem!important}.gravity-margin-inline-xl{margin-inline:2.5rem!important}.gravity-margin-xxl{margin:3rem!important}.gravity-margin-top-xxl{margin-top:3rem!important}.gravity-margin-bottom-xxl{margin-bottom:3rem!important}.gravity-margin-left-xxl{margin-left:3rem!important}.gravity-margin-right-xxl{margin-right:3rem!important}.gravity-margin-block-xxl{margin-block:3rem!important}.gravity-margin-inline-xxl{margin-inline:3rem!important}.gravity-margin-xxxl{margin:4rem!important}.gravity-margin-top-xxxl{margin-top:4rem!important}.gravity-margin-bottom-xxxl{margin-bottom:4rem!important}.gravity-margin-left-xxxl{margin-left:4rem!important}.gravity-margin-right-xxxl{margin-right:4rem!important}.gravity-margin-block-xxxl{margin-block:4rem!important}.gravity-margin-inline-xxxl{margin-inline:4rem!important}.gravity-margin-xxxxl{margin:6rem!important}.gravity-margin-top-xxxxl{margin-top:6rem!important}.gravity-margin-bottom-xxxxl{margin-bottom:6rem!important}.gravity-margin-left-xxxxl{margin-left:6rem!important}.gravity-margin-right-xxxxl{margin-right:6rem!important}.gravity-margin-block-xxxxl{margin-block:6rem!important}.gravity-margin-inline-xxxxl{margin-inline:6rem!important}.gravity-margin-xxxxxl{margin:12rem!important}.gravity-margin-top-xxxxxl{margin-top:12rem!important}.gravity-margin-bottom-xxxxxl{margin-bottom:12rem!important}.gravity-margin-left-xxxxxl{margin-left:12rem!important}.gravity-margin-right-xxxxxl{margin-right:12rem!important}.gravity-margin-block-xxxxxl{margin-block:12rem!important}.gravity-margin-inline-xxxxxl{margin-inline:12rem!important}:host{display:block;--dropdown-cd-field-input-width: 350px}.gravity-input-field{display:flex;cursor:pointer;padding:10px 12px;position:relative;align-items:center;border-radius:.3125rem;width:var(--dropdown-cd-field-input-width);height:var(--dropdown-cd-field-input-height);--text-field-input-field-border-width: .5px;color:var(--text-field-input-field-content-color);background-color:var(--text-field-input-field-background-color);border:var(--text-field-input-field-border-width) solid var(--text-field-input-field-border-color)}.gravity-input-field gravity-icon{--icon-width: var(--text-field-input-field-content);--icon-height: var(--text-field-input-field-content);--icon-color: var(--text-field-input-field-icon-color)}.gravity-input-field gravity-icon.pointer{cursor:pointer}.gravity-input-field gravity-icon.right{margin-right:var(--icon-margin)}.gravity-input-field p.value{width:100%}.gravity-input-field.md{--dropdown-margin: 8px;--dropdown-items-padding: 6px;--text-field-input-field-content: 15px}.gravity-input-field.md.standard-width{--dropdown-cd-field-input-width: 350px;--dropdown-cd-field-input-height: 58px;--dropdown-cd-items-container-height: 502px}.gravity-input-field.closed{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-dropdown-list-dc-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field.open{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field.disabled{cursor:default;pointer-events:none;--text-field-input-field-border-width: 1px;--text-field-input-field-icon-color: var(--on-bg-disabled);--text-field-input-field-content-color: var(--on-bg-disabled);--text-field-input-field-border-color: var(--outline-disabled)}.gravity-input-field.selected{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--icon-active-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-dropdown-list-dc-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field.selected ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary{background-color:var(--surface-secondary)}.gravity-input-field.readonly{cursor:initial;--text-field-input-field-border-width: 1px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--placeholder-full-enabled-pressed-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field:not(.readonly):hover{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field:not(.readonly):hover ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary{background-color:var(--surface-primary)}.dropdown-panel{left:-2px;z-index:5;cursor:initial;position:absolute;width:var(--dropdown-cd-field-input-width);border-radius:.3125rem;top:calc(100% + var(--dropdown-margin));background-color:var(--bg-field-full-enabled-primary);border:1px solid var(--outline-dropdown-list-dc-primary)}.dropdown-panel .search-input{display:flex;padding:12px;align-items:center;border-bottom:1px solid var(--outline-field-full-enabled-pressed-primary)}.dropdown-panel .search-input search-input:focus-within{border-bottom:1px solid var(--text-primary)}.dropdown-panel .search-input.disabled{border-bottom:1px solid var(--outline-disabled)}.dropdown-panel .search-input gravity-icon.search-icon{margin-right:.5rem}.dropdown-panel .search-input gravity-icon.reset-icon{margin-left:.5rem}.dropdown-panel .search-input input{margin:0;padding:0;width:100%;border:none;outline:none;border-radius:0;background-color:transparent;color:var(--input-text-full-enabled-primary)}.dropdown-panel .search-input input::placeholder{color:var(--placeholder-empty-enabled-primary)}.dropdown-panel .items-container{overflow:auto;margin:var(--dropdown-margin) 0;max-height:var(--dropdown-cd-items-container-height)}.dropdown-panel .items-container .items{width:100%;display:flex;flex-direction:column;gap:var(--gravity-spacing-xxs);padding:0 var(--dropdown-items-padding);max-height:var(--dropdown-cd-items-container-height)}.dropdown-panel .items-container .items .item-container.expanded{display:grid;gap:var(--gravity-spacing-xxs);border-bottom:1px solid var(--bg-disabled)}.dropdown-panel .items-container .items .item-container .item{height:60px;display:flex;cursor:pointer;position:relative;white-space:nowrap;align-items:center;justify-content:space-between;padding:.75rem var(--gravity-spacing-sm);color:var(--label-text-full-enabled-primary)}.dropdown-panel .items-container .items .item-container .item .expand-icon{position:absolute;top:var(--gravity-spacing-md);right:var(--gravity-spacing-sm)}.dropdown-panel .items-container .items .item-container .item .subitem-line{top:-18px;height:40px;position:absolute;border-left:1px solid var(--on-bg-disabled);left:calc(var(--gravity-spacing-md) + var(--gravity-spacing-xxs))}.dropdown-panel .items-container .items .item-container .item:hover:not(.no-results):not(.disabled),.dropdown-panel .items-container .items .item-container .item.selected{border-radius:.3125rem;color:var(--on-bg-menu-button-active-primary);background-color:var(--bg-menu-button-hover-primary)}.dropdown-panel .items-container .items .item-container .item:hover:not(.no-results):not(.disabled) ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary,.dropdown-panel .items-container .items .item-container .item.selected ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary{background-color:var(--surface-secondary)!important}.dropdown-panel .items-container .items .item-container .item.disabled{cursor:default;pointer-events:none}.dropdown-panel .items-container .items .item-container .item.disabled .currency-info{color:var(--on-bg-disabled)}.dropdown-panel .items-container .items .item-container .item .currency-info{right:0;bottom:13px;position:absolute}.wallet-balance-info{text-align:end;margin-top:12px;margin-right:12px;width:calc(var(--dropdown-cd-field-input-width) - 12px)}.no-results{cursor:default!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }, { kind: "component", type: GravityCurrencyDisplayV2Component, selector: "gravity-currency-display-v2", inputs: ["disabled", "type", "currency"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityDropdownListDisplayComponent, selector: "gravity-dropdown-list-display", inputs: { cypressTag: "cypressTag", placeholder: "placeholder", currentLang: "currentLang", isReadonly: "isReadonly", isDisabled: "isDisabled", customValues: "customValues", disableSearch: "disableSearch", defaultSelectedItemIndex: "defaultSelectedItemIndex", items: "items", size: "size", width: "width" }, outputs: { selectedItemsResponse: "response" }, host: { listeners: { "document:click": "onDocumentClick($event)", "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()" } }, providers: [FilterByPipe], viewQueries: [{ propertyName: "watch", first: true, predicate: ["searchInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [attr.data-cy]=\"cypressTag\" class=\"gravity-input-field {{size}} {{width}}-width {{getStatus()}}\"\n     (click)=\"toggleDropdown()\">\n\n    <p class=\"hr-label {{size}}-regular value\">\n        <ng-container *ngIf=\"selectedItems.length == 0\">{{ placeholder }}</ng-container>\n        <ng-container *ngIf=\"selectedItems.length > 0\">\n            <gravity-currency-display-v2\n                [currency]=\"{ currency_name: selectedItem.currency_name,\n                              currency_id: selectedItem.currency_id, currency_iso: selectedItem.currency_iso,\n                              network_id: selectedItem.network_id, network_iso: selectedItem.network_iso,\n                              pill_type: (getStatus() === 'selected' && !isHovered) ? 'secondary' : 'primary'}\">\n            </gravity-currency-display-v2>\n        </ng-container>\n    </p>\n\n    <gravity-icon class=\"right\" [iconName]=\"dropdownOpened ? 'arrow-up': 'arrow-down'\" [iconSize]=\"'md-16'\"\n                  *ngIf=\"!isReadonly\"></gravity-icon>\n    <div class=\"dropdown-panel\" (click)=\"$event.stopPropagation()\" *ngIf=\"dropdownOpened\"\n         [attr.data-cy]=\"cypressTag + '_panel'\">\n\n        <div class=\"search-input\" [class.disabled]=\"disableSearch\">\n            <gravity-icon [style.--icon-color]=\"disableSearch ? 'var(--on-bg-disabled)' : null\"\n                          class=\"search-icon\" [iconName]=\"'search'\" [iconSize]=\"'sm-12'\">\n            </gravity-icon>\n            <input autocomplete=\"off\" class=\"hr-label {{size}}-regular\" (input)=\"filterItems()\"\n                   [attr.data-cy]=\"cypressTag + '_search_input'\" #searchInput [disabled]=\"disableSearch\"\n                   [(ngModel)]=\"searchText\" placeholder=\"{{currentLang == 'es' ? 'Buscar moneda' : 'Search currency'}}\">\n            <gravity-icon class=\"pointer reset-icon\" (click)=\"searchText = ''; filterItems()\" [iconName]=\"'unsuccess'\"\n                          [iconSize]=\"'sm-12'\" *ngIf=\"searchText?.length > 0\">\n            </gravity-icon>\n        </div>\n\n        <div class=\"items-container\">\n            <div class=\"items\">\n                <div class=\"item-container\" *ngFor=\"let item of availableOptions\" [class.expanded]=\"item.is_expanded\">\n                    <div class=\"hr-label item {{size}}-regular pointer\" [class.disabled]=\"item?.disabled\"\n                         [class.selected]=\"item.sub_items?.length > 0 ? null : checkIfSelected(item)\"\n                         (click)=\"item.sub_items?.length > 0 ? item.is_expanded = !item.is_expanded : selectItem(item)\"\n                         (mouseenter)=\"item.isHovered = true\" (mouseleave)=\"item.isHovered = false\">\n\n                        <gravity-currency-display-v2\n                            [disabled]=\"item?.disabled\"\n                            [currency]=\"{ currency_name: item.currency_name,\n                                          currency_iso: item.currency_iso, currency_id: item.currency_id,\n                                          network_id: item.network_id, network_iso: item.network_iso,\n                                          pill_type: (checkIfSelected(item) || item.isHovered) ? 'secondary' : 'primary' }\">\n                        </gravity-currency-display-v2>\n\n                        <span *ngIf=\"!item.sub_items\" class=\"hr-body sm-regular gravity-margin-right-sm currency-info\">\n                            {{ item?.balance_amount }} {{ item?.balance_currency }}\n                        </span>\n\n                        <gravity-icon *ngIf=\"item.sub_items?.length > 0 && item?.disabled !== true\" class=\"pointer expand-icon\"\n                                      [iconSize]=\"'sm-12'\" [iconName]=\"item.is_expanded ? 'arrow-up' : 'arrow-down'\">\n                        </gravity-icon>\n                    </div>\n\n                    <ng-container *ngIf=\"item.is_expanded && item.sub_items\">\n                        <div class=\"hr-label item {{size}}-regular pointer\" *ngFor=\"let subItem of item.sub_items\"\n                             [class.selected]=\"checkIfSelected(subItem)\" (click)=\"selectItem(subItem)\" [class.disabled]=\"subItem?.disabled\">\n\n                            <div class=\"subitem-line\"></div>\n                            <gravity-currency-display-v2\n                                [disabled]=\"subItem?.disabled\"\n                                [currency]=\"{ currency_name: subItem.currency_name,\n                                              currency_iso: subItem.currency_iso, currency_id: subItem.currency_id,\n                                              network_id: subItem.network_id, network_iso: subItem.network_iso,\n                                              pill_type: (checkIfSelected(item) || item.isHovered) ? 'secondary' : 'primary' }\" >\n                            </gravity-currency-display-v2>\n\n                            <span class=\"hr-body sm-regular gravity-margin-right-sm currency-info\">\n                                {{ subItem.balance_amount }} {{ subItem.balance_currency }}\n                            </span>\n                        </div>\n                    </ng-container>\n                </div>\n\n                <div class=\"hr-label item {{size}}-bold no-results\" *ngIf=\"availableOptions.length === 0\">\n                    {{ currentLang == 'es' ? 'Sin resultados' : 'No results' }}\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n\n<div class=\"wallet-balance-info\" *ngIf=\"selectedItems.length > 0\">\n    <p class=\"hr-label sm-regular\">{{ currentLang == 'es' ? 'Saldo de cartera' : 'Wallet balance' }}\n        : {{ selectedItem.balance_amount }} {{ selectedItem.balance_currency }}</p>\n</div>\n\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}:root{--gravity-spacing-none: 0;--gravity-spacing-xxxs: .125rem;--gravity-spacing-xxs: .25rem;--gravity-spacing-xs: .5rem;--gravity-spacing-sm: 1rem;--gravity-spacing-md: 1.5rem;--gravity-spacing-lg: 2rem;--gravity-spacing-xl: 2.5rem;--gravity-spacing-xxl: 3rem;--gravity-spacing-xxxl: 4rem;--gravity-spacing-xxxxl: 6rem;--gravity-spacing-xxxxxl: 12rem}.gravity-padding-none{padding:0!important}.gravity-padding-top-none{padding-top:0!important}.gravity-padding-bottom-none{padding-bottom:0!important}.gravity-padding-left-none{padding-left:0!important}.gravity-padding-right-none{padding-right:0!important}.gravity-padding-block-none{padding-block:0!important}.gravity-padding-inline-none{padding-inline:0!important}.gravity-padding-xxs{padding:.25rem!important}.gravity-padding-top-xxs{padding-top:.25rem!important}.gravity-padding-bottom-xxs{padding-bottom:.25rem!important}.gravity-padding-left-xxs{padding-left:.25rem!important}.gravity-padding-right-xxs{padding-right:.25rem!important}.gravity-padding-block-xxs{padding-block:.25rem!important}.gravity-padding-inline-xxs{padding-inline:.25rem!important}.gravity-padding-xs{padding:.5rem!important}.gravity-padding-top-xs{padding-top:.5rem!important}.gravity-padding-bottom-xs{padding-bottom:.5rem!important}.gravity-padding-left-xs{padding-left:.5rem!important}.gravity-padding-right-xs{padding-right:.5rem!important}.gravity-padding-block-xs{padding-block:.5rem!important}.gravity-padding-inline-xs{padding-inline:.5rem!important}.gravity-padding-sm{padding:1rem!important}.gravity-padding-top-sm{padding-top:1rem!important}.gravity-padding-bottom-sm{padding-bottom:1rem!important}.gravity-padding-left-sm{padding-left:1rem!important}.gravity-padding-right-sm{padding-right:1rem!important}.gravity-padding-block-sm{padding-block:1rem!important}.gravity-padding-inline-sm{padding-inline:1rem!important}.gravity-padding-md{padding:1.5rem!important}.gravity-padding-top-md{padding-top:1.5rem!important}.gravity-padding-bottom-md{padding-bottom:1.5rem!important}.gravity-padding-left-md{padding-left:1.5rem!important}.gravity-padding-right-md{padding-right:1.5rem!important}.gravity-padding-block-md{padding-block:1.5rem!important}.gravity-padding-inline-md{padding-inline:1.5rem!important}.gravity-padding-lg{padding:2rem!important}.gravity-padding-top-lg{padding-top:2rem!important}.gravity-padding-bottom-lg{padding-bottom:2rem!important}.gravity-padding-left-lg{padding-left:2rem!important}.gravity-padding-right-lg{padding-right:2rem!important}.gravity-padding-block-lg{padding-block:2rem!important}.gravity-padding-inline-lg{padding-inline:2rem!important}.gravity-padding-xl{padding:2.5rem!important}.gravity-padding-top-xl{padding-top:2.5rem!important}.gravity-padding-bottom-xl{padding-bottom:2.5rem!important}.gravity-padding-left-xl{padding-left:2.5rem!important}.gravity-padding-right-xl{padding-right:2.5rem!important}.gravity-padding-block-xl{padding-block:2.5rem!important}.gravity-padding-inline-xl{padding-inline:2.5rem!important}.gravity-padding-xxl{padding:3rem!important}.gravity-padding-top-xxl{padding-top:3rem!important}.gravity-padding-bottom-xxl{padding-bottom:3rem!important}.gravity-padding-left-xxl{padding-left:3rem!important}.gravity-padding-right-xxl{padding-right:3rem!important}.gravity-padding-block-xxl{padding-block:3rem!important}.gravity-padding-inline-xxl{padding-inline:3rem!important}.gravity-padding-xxxl{padding:4rem!important}.gravity-padding-top-xxxl{padding-top:4rem!important}.gravity-padding-bottom-xxxl{padding-bottom:4rem!important}.gravity-padding-left-xxxl{padding-left:4rem!important}.gravity-padding-right-xxxl{padding-right:4rem!important}.gravity-padding-block-xxxl{padding-block:4rem!important}.gravity-padding-inline-xxxl{padding-inline:4rem!important}.gravity-padding-xxxxl{padding:6rem!important}.gravity-padding-top-xxxxl{padding-top:6rem!important}.gravity-padding-bottom-xxxxl{padding-bottom:6rem!important}.gravity-padding-left-xxxxl{padding-left:6rem!important}.gravity-padding-right-xxxxl{padding-right:6rem!important}.gravity-padding-block-xxxxl{padding-block:6rem!important}.gravity-padding-inline-xxxxl{padding-inline:6rem!important}.gravity-padding-xxxxxl{padding:12rem!important}.gravity-padding-top-xxxxxl{padding-top:12rem!important}.gravity-padding-bottom-xxxxxl{padding-bottom:12rem!important}.gravity-padding-left-xxxxxl{padding-left:12rem!important}.gravity-padding-right-xxxxxl{padding-right:12rem!important}.gravity-padding-block-xxxxxl{padding-block:12rem!important}.gravity-padding-inline-xxxxxl{padding-inline:12rem!important}.gravity-margin-none{margin:0!important}.gravity-margin-top-none{margin-top:0!important}.gravity-margin-bottom-none{margin-bottom:0!important}.gravity-margin-left-none{margin-left:0!important}.gravity-margin-right-none{margin-right:0!important}.gravity-margin-block-none{margin-block:0!important}.gravity-margin-inline-none{margin-inline:0!important}.gravity-margin-xxs{margin:.25rem!important}.gravity-margin-top-xxs{margin-top:.25rem!important}.gravity-margin-bottom-xxs{margin-bottom:.25rem!important}.gravity-margin-left-xxs{margin-left:.25rem!important}.gravity-margin-right-xxs{margin-right:.25rem!important}.gravity-margin-block-xxs{margin-block:.25rem!important}.gravity-margin-inline-xxs{margin-inline:.25rem!important}.gravity-margin-xs{margin:.5rem!important}.gravity-margin-top-xs{margin-top:.5rem!important}.gravity-margin-bottom-xs{margin-bottom:.5rem!important}.gravity-margin-left-xs{margin-left:.5rem!important}.gravity-margin-right-xs{margin-right:.5rem!important}.gravity-margin-block-xs{margin-block:.5rem!important}.gravity-margin-inline-xs{margin-inline:.5rem!important}.gravity-margin-sm{margin:1rem!important}.gravity-margin-top-sm{margin-top:1rem!important}.gravity-margin-bottom-sm{margin-bottom:1rem!important}.gravity-margin-left-sm{margin-left:1rem!important}.gravity-margin-right-sm{margin-right:1rem!important}.gravity-margin-block-sm{margin-block:1rem!important}.gravity-margin-inline-sm{margin-inline:1rem!important}.gravity-margin-md{margin:1.5rem!important}.gravity-margin-top-md{margin-top:1.5rem!important}.gravity-margin-bottom-md{margin-bottom:1.5rem!important}.gravity-margin-left-md{margin-left:1.5rem!important}.gravity-margin-right-md{margin-right:1.5rem!important}.gravity-margin-block-md{margin-block:1.5rem!important}.gravity-margin-inline-md{margin-inline:1.5rem!important}.gravity-margin-lg{margin:2rem!important}.gravity-margin-top-lg{margin-top:2rem!important}.gravity-margin-bottom-lg{margin-bottom:2rem!important}.gravity-margin-left-lg{margin-left:2rem!important}.gravity-margin-right-lg{margin-right:2rem!important}.gravity-margin-block-lg{margin-block:2rem!important}.gravity-margin-inline-lg{margin-inline:2rem!important}.gravity-margin-xl{margin:2.5rem!important}.gravity-margin-top-xl{margin-top:2.5rem!important}.gravity-margin-bottom-xl{margin-bottom:2.5rem!important}.gravity-margin-left-xl{margin-left:2.5rem!important}.gravity-margin-right-xl{margin-right:2.5rem!important}.gravity-margin-block-xl{margin-block:2.5rem!important}.gravity-margin-inline-xl{margin-inline:2.5rem!important}.gravity-margin-xxl{margin:3rem!important}.gravity-margin-top-xxl{margin-top:3rem!important}.gravity-margin-bottom-xxl{margin-bottom:3rem!important}.gravity-margin-left-xxl{margin-left:3rem!important}.gravity-margin-right-xxl{margin-right:3rem!important}.gravity-margin-block-xxl{margin-block:3rem!important}.gravity-margin-inline-xxl{margin-inline:3rem!important}.gravity-margin-xxxl{margin:4rem!important}.gravity-margin-top-xxxl{margin-top:4rem!important}.gravity-margin-bottom-xxxl{margin-bottom:4rem!important}.gravity-margin-left-xxxl{margin-left:4rem!important}.gravity-margin-right-xxxl{margin-right:4rem!important}.gravity-margin-block-xxxl{margin-block:4rem!important}.gravity-margin-inline-xxxl{margin-inline:4rem!important}.gravity-margin-xxxxl{margin:6rem!important}.gravity-margin-top-xxxxl{margin-top:6rem!important}.gravity-margin-bottom-xxxxl{margin-bottom:6rem!important}.gravity-margin-left-xxxxl{margin-left:6rem!important}.gravity-margin-right-xxxxl{margin-right:6rem!important}.gravity-margin-block-xxxxl{margin-block:6rem!important}.gravity-margin-inline-xxxxl{margin-inline:6rem!important}.gravity-margin-xxxxxl{margin:12rem!important}.gravity-margin-top-xxxxxl{margin-top:12rem!important}.gravity-margin-bottom-xxxxxl{margin-bottom:12rem!important}.gravity-margin-left-xxxxxl{margin-left:12rem!important}.gravity-margin-right-xxxxxl{margin-right:12rem!important}.gravity-margin-block-xxxxxl{margin-block:12rem!important}.gravity-margin-inline-xxxxxl{margin-inline:12rem!important}:host{display:block;--dropdown-cd-field-input-width: 350px}.gravity-input-field{display:flex;cursor:pointer;padding:10px 12px;position:relative;align-items:center;border-radius:.3125rem;width:var(--dropdown-cd-field-input-width);height:var(--dropdown-cd-field-input-height);--text-field-input-field-border-width: .5px;color:var(--text-field-input-field-content-color);background-color:var(--text-field-input-field-background-color);border:var(--text-field-input-field-border-width) solid var(--text-field-input-field-border-color)}.gravity-input-field gravity-icon{--icon-width: var(--text-field-input-field-content);--icon-height: var(--text-field-input-field-content);--icon-color: var(--text-field-input-field-icon-color)}.gravity-input-field gravity-icon.pointer{cursor:pointer}.gravity-input-field gravity-icon.right{margin-right:var(--icon-margin)}.gravity-input-field p.value{width:100%}.gravity-input-field.md{--dropdown-margin: 8px;--dropdown-items-padding: 6px;--text-field-input-field-content: 15px}.gravity-input-field.md.standard-width{--dropdown-cd-field-input-width: 350px;--dropdown-cd-field-input-height: 58px;--dropdown-cd-items-container-height: 502px}.gravity-input-field.closed{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-dropdown-list-dc-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field.open{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field.disabled{cursor:default;pointer-events:none;--text-field-input-field-border-width: 1px;--text-field-input-field-icon-color: var(--on-bg-disabled);--text-field-input-field-content-color: var(--on-bg-disabled);--text-field-input-field-border-color: var(--outline-disabled)}.gravity-input-field.selected{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--icon-active-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-dropdown-list-dc-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field.selected ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary{background-color:var(--surface-secondary)}.gravity-input-field.readonly{cursor:initial;--text-field-input-field-border-width: 1px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--placeholder-full-enabled-pressed-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field:not(.readonly):hover{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field:not(.readonly):hover ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary{background-color:var(--surface-primary)}.dropdown-panel{left:-2px;z-index:5;cursor:initial;position:absolute;width:var(--dropdown-cd-field-input-width);border-radius:.3125rem;top:calc(100% + var(--dropdown-margin));background-color:var(--bg-field-full-enabled-primary);border:1px solid var(--outline-dropdown-list-dc-primary)}.dropdown-panel .search-input{display:flex;padding:12px;align-items:center;border-bottom:1px solid var(--outline-field-full-enabled-pressed-primary)}.dropdown-panel .search-input search-input:focus-within{border-bottom:1px solid var(--text-primary)}.dropdown-panel .search-input.disabled{border-bottom:1px solid var(--outline-disabled)}.dropdown-panel .search-input gravity-icon.search-icon{margin-right:.5rem}.dropdown-panel .search-input gravity-icon.reset-icon{margin-left:.5rem}.dropdown-panel .search-input input{margin:0;padding:0;width:100%;border:none;outline:none;border-radius:0;background-color:transparent;color:var(--input-text-full-enabled-primary)}.dropdown-panel .search-input input::placeholder{color:var(--placeholder-empty-enabled-primary)}.dropdown-panel .items-container{overflow:auto;scrollbar-width:none;margin:var(--dropdown-margin) 0;max-height:var(--dropdown-cd-items-container-height)}.dropdown-panel .items-container .items{width:100%;display:flex;flex-direction:column;gap:var(--gravity-spacing-xxs);padding:0 var(--dropdown-items-padding);max-height:var(--dropdown-cd-items-container-height)}.dropdown-panel .items-container .items .item-container.expanded{display:grid;gap:var(--gravity-spacing-xxs);border-bottom:1px solid var(--bg-disabled)}.dropdown-panel .items-container .items .item-container .item{height:60px;display:flex;cursor:pointer;position:relative;white-space:nowrap;align-items:center;justify-content:space-between;padding:.75rem var(--gravity-spacing-sm);color:var(--label-text-full-enabled-primary)}.dropdown-panel .items-container .items .item-container .item .expand-icon{position:absolute;top:var(--gravity-spacing-md);right:var(--gravity-spacing-sm)}.dropdown-panel .items-container .items .item-container .item .subitem-line{top:-18px;height:40px;position:absolute;border-left:1px solid var(--on-bg-disabled);left:calc(var(--gravity-spacing-md) + var(--gravity-spacing-xxs))}.dropdown-panel .items-container .items .item-container .item:hover:not(.no-results):not(.disabled),.dropdown-panel .items-container .items .item-container .item.selected{border-radius:.3125rem;color:var(--on-bg-menu-button-active-primary);background-color:var(--bg-menu-button-hover-primary)}.dropdown-panel .items-container .items .item-container .item:hover:not(.no-results):not(.disabled) ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary,.dropdown-panel .items-container .items .item-container .item.selected ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary{background-color:var(--surface-secondary)!important}.dropdown-panel .items-container .items .item-container .item.disabled{cursor:default;pointer-events:none}.dropdown-panel .items-container .items .item-container .item.disabled .currency-info{color:var(--on-bg-disabled)}.dropdown-panel .items-container .items .item-container .item .currency-info{right:0;bottom:10px;position:absolute}.wallet-balance-info{text-align:end;margin-top:12px;margin-right:12px;width:calc(var(--dropdown-cd-field-input-width) - 12px)}.no-results{cursor:default!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }, { kind: "component", type: GravityCurrencyDisplayV2Component, selector: "gravity-currency-display-v2", inputs: ["disabled", "type", "currency"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityDropdownListDisplayComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'gravity-dropdown-list-display', providers: [FilterByPipe], template: "<div [attr.data-cy]=\"cypressTag\" class=\"gravity-input-field {{size}} {{width}}-width {{getStatus()}}\"\n     (click)=\"toggleDropdown()\">\n\n    <p class=\"hr-label {{size}}-regular value\">\n        <ng-container *ngIf=\"selectedItems.length == 0\">{{ placeholder }}</ng-container>\n        <ng-container *ngIf=\"selectedItems.length > 0\">\n            <gravity-currency-display-v2\n                [currency]=\"{currency_name: this.selectedItem.currency_name,\n                            currency_id: this.selectedItem.currency_id, currency_iso: this.selectedItem.currency_iso,\n                            network_id: this.selectedItem.network_id, network_iso: this.selectedItem.network_iso}\">\n            </gravity-currency-display-v2>\n        </ng-container>\n    </p>\n\n    <gravity-icon class=\"right\" [iconName]=\"dropdownOpened ? 'arrow-up': 'arrow-down'\" [iconSize]=\"'md-16'\"\n                  *ngIf=\"!isReadonly\"></gravity-icon>\n    <div class=\"dropdown-panel\" (click)=\"$event.stopPropagation()\" *ngIf=\"dropdownOpened\"\n         [attr.data-cy]=\"cypressTag + '_panel'\">\n\n        <div class=\"search-input\" [class.disabled]=\"disableSearch\">\n            <gravity-icon [style.--icon-color]=\"disableSearch ? 'var(--on-bg-disabled)' : null\"\n                          class=\"search-icon\" [iconName]=\"'search'\" [iconSize]=\"'sm-12'\">\n            </gravity-icon>\n            <input autocomplete=\"off\" class=\"hr-label {{size}}-regular\" (input)=\"filterItems()\"\n                   [attr.data-cy]=\"cypressTag + '_search_input'\" #searchInput [disabled]=\"disableSearch\"\n                   [(ngModel)]=\"searchText\" placeholder=\"{{currentLang == 'es' ? 'Buscar moneda' : 'Search currency'}}\">\n            <gravity-icon class=\"pointer reset-icon\" (click)=\"searchText = ''; filterItems()\" [iconName]=\"'unsuccess'\"\n                          [iconSize]=\"'sm-12'\" *ngIf=\"searchText?.length > 0\">\n            </gravity-icon>\n        </div>\n\n        <div class=\"items-container\">\n            <div class=\"items\">\n                <div class=\"item-container\" *ngFor=\"let item of availableOptions\" [class.expanded]=\"item.is_expanded\">\n                    <div class=\"hr-label item {{size}}-regular pointer\" [class.disabled]=\"item?.disabled\"\n                         [class.selected]=\"item.sub_items?.length > 0 ? null : checkIfSelected(item)\"\n                         (click)=\"item.sub_items?.length > 0 ? item.is_expanded = !item.is_expanded : selectItem(item)\">\n\n                        <gravity-currency-display-v2\n                            [disabled]=\"item?.disabled\"\n                            [currency]=\"{ currency_name: item.currency_name,\n                                        currency_iso: item.currency_iso, currency_id: item.currency_id,\n                                        network_id: item.network_id, network_iso: item.network_iso}\">\n                        </gravity-currency-display-v2>\n\n                        <span *ngIf=\"!item.sub_items\" class=\"hr-body sm-regular gravity-margin-right-sm currency-info\">\n                            {{ item?.balance_amount }} {{ item?.balance_currency }}\n                        </span>\n\n                        <gravity-icon *ngIf=\"item.sub_items?.length > 0 && item?.disabled !== true\" class=\"pointer expand-icon\"\n                                      [iconSize]=\"'sm-12'\" [iconName]=\"item.is_expanded ? 'arrow-up' : 'arrow-down'\">\n                        </gravity-icon>\n                    </div>\n\n                    <ng-container *ngIf=\"item.is_expanded && item.sub_items\">\n                        <div class=\"hr-label item {{size}}-regular pointer\" *ngFor=\"let subItem of item.sub_items\"\n                             [class.selected]=\"checkIfSelected(subItem)\" (click)=\"selectItem(subItem)\" [class.disabled]=\"subItem?.disabled\">\n\n                            <div class=\"subitem-line\"></div>\n                            <gravity-currency-display-v2\n                                [disabled]=\"subItem?.disabled\"\n                                [currency]=\"{ currency_name: subItem.currency_name,\n                                            currency_iso: subItem.currency_iso, currency_id: subItem.currency_id,\n                                            network_id: subItem.network_id, network_iso: subItem.network_iso}\" >\n                            </gravity-currency-display-v2>\n\n                            <span class=\"hr-body sm-regular gravity-margin-right-sm currency-info\">\n                                {{ subItem.balance_amount }} {{ subItem.balance_currency }}\n                            </span>\n                        </div>\n                    </ng-container>\n                </div>\n\n                <div class=\"hr-label item {{size}}-bold no-results\" *ngIf=\"availableOptions.length === 0\">\n                    {{ currentLang == 'es' ? 'Sin resultados' : 'No results' }}\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n\n<div class=\"wallet-balance-info\" *ngIf=\"selectedItems.length > 0\">\n    <p class=\"hr-label sm-regular\">{{ currentLang == 'es' ? 'Saldo de cartera' : 'Wallet balance' }}\n        : {{ this.selectedItem.balance_amount }} {{ this.selectedItem.balance_currency }}</p>\n</div>\n\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}:root{--gravity-spacing-none: 0;--gravity-spacing-xxxs: .125rem;--gravity-spacing-xxs: .25rem;--gravity-spacing-xs: .5rem;--gravity-spacing-sm: 1rem;--gravity-spacing-md: 1.5rem;--gravity-spacing-lg: 2rem;--gravity-spacing-xl: 2.5rem;--gravity-spacing-xxl: 3rem;--gravity-spacing-xxxl: 4rem;--gravity-spacing-xxxxl: 6rem;--gravity-spacing-xxxxxl: 12rem}.gravity-padding-none{padding:0!important}.gravity-padding-top-none{padding-top:0!important}.gravity-padding-bottom-none{padding-bottom:0!important}.gravity-padding-left-none{padding-left:0!important}.gravity-padding-right-none{padding-right:0!important}.gravity-padding-block-none{padding-block:0!important}.gravity-padding-inline-none{padding-inline:0!important}.gravity-padding-xxs{padding:.25rem!important}.gravity-padding-top-xxs{padding-top:.25rem!important}.gravity-padding-bottom-xxs{padding-bottom:.25rem!important}.gravity-padding-left-xxs{padding-left:.25rem!important}.gravity-padding-right-xxs{padding-right:.25rem!important}.gravity-padding-block-xxs{padding-block:.25rem!important}.gravity-padding-inline-xxs{padding-inline:.25rem!important}.gravity-padding-xs{padding:.5rem!important}.gravity-padding-top-xs{padding-top:.5rem!important}.gravity-padding-bottom-xs{padding-bottom:.5rem!important}.gravity-padding-left-xs{padding-left:.5rem!important}.gravity-padding-right-xs{padding-right:.5rem!important}.gravity-padding-block-xs{padding-block:.5rem!important}.gravity-padding-inline-xs{padding-inline:.5rem!important}.gravity-padding-sm{padding:1rem!important}.gravity-padding-top-sm{padding-top:1rem!important}.gravity-padding-bottom-sm{padding-bottom:1rem!important}.gravity-padding-left-sm{padding-left:1rem!important}.gravity-padding-right-sm{padding-right:1rem!important}.gravity-padding-block-sm{padding-block:1rem!important}.gravity-padding-inline-sm{padding-inline:1rem!important}.gravity-padding-md{padding:1.5rem!important}.gravity-padding-top-md{padding-top:1.5rem!important}.gravity-padding-bottom-md{padding-bottom:1.5rem!important}.gravity-padding-left-md{padding-left:1.5rem!important}.gravity-padding-right-md{padding-right:1.5rem!important}.gravity-padding-block-md{padding-block:1.5rem!important}.gravity-padding-inline-md{padding-inline:1.5rem!important}.gravity-padding-lg{padding:2rem!important}.gravity-padding-top-lg{padding-top:2rem!important}.gravity-padding-bottom-lg{padding-bottom:2rem!important}.gravity-padding-left-lg{padding-left:2rem!important}.gravity-padding-right-lg{padding-right:2rem!important}.gravity-padding-block-lg{padding-block:2rem!important}.gravity-padding-inline-lg{padding-inline:2rem!important}.gravity-padding-xl{padding:2.5rem!important}.gravity-padding-top-xl{padding-top:2.5rem!important}.gravity-padding-bottom-xl{padding-bottom:2.5rem!important}.gravity-padding-left-xl{padding-left:2.5rem!important}.gravity-padding-right-xl{padding-right:2.5rem!important}.gravity-padding-block-xl{padding-block:2.5rem!important}.gravity-padding-inline-xl{padding-inline:2.5rem!important}.gravity-padding-xxl{padding:3rem!important}.gravity-padding-top-xxl{padding-top:3rem!important}.gravity-padding-bottom-xxl{padding-bottom:3rem!important}.gravity-padding-left-xxl{padding-left:3rem!important}.gravity-padding-right-xxl{padding-right:3rem!important}.gravity-padding-block-xxl{padding-block:3rem!important}.gravity-padding-inline-xxl{padding-inline:3rem!important}.gravity-padding-xxxl{padding:4rem!important}.gravity-padding-top-xxxl{padding-top:4rem!important}.gravity-padding-bottom-xxxl{padding-bottom:4rem!important}.gravity-padding-left-xxxl{padding-left:4rem!important}.gravity-padding-right-xxxl{padding-right:4rem!important}.gravity-padding-block-xxxl{padding-block:4rem!important}.gravity-padding-inline-xxxl{padding-inline:4rem!important}.gravity-padding-xxxxl{padding:6rem!important}.gravity-padding-top-xxxxl{padding-top:6rem!important}.gravity-padding-bottom-xxxxl{padding-bottom:6rem!important}.gravity-padding-left-xxxxl{padding-left:6rem!important}.gravity-padding-right-xxxxl{padding-right:6rem!important}.gravity-padding-block-xxxxl{padding-block:6rem!important}.gravity-padding-inline-xxxxl{padding-inline:6rem!important}.gravity-padding-xxxxxl{padding:12rem!important}.gravity-padding-top-xxxxxl{padding-top:12rem!important}.gravity-padding-bottom-xxxxxl{padding-bottom:12rem!important}.gravity-padding-left-xxxxxl{padding-left:12rem!important}.gravity-padding-right-xxxxxl{padding-right:12rem!important}.gravity-padding-block-xxxxxl{padding-block:12rem!important}.gravity-padding-inline-xxxxxl{padding-inline:12rem!important}.gravity-margin-none{margin:0!important}.gravity-margin-top-none{margin-top:0!important}.gravity-margin-bottom-none{margin-bottom:0!important}.gravity-margin-left-none{margin-left:0!important}.gravity-margin-right-none{margin-right:0!important}.gravity-margin-block-none{margin-block:0!important}.gravity-margin-inline-none{margin-inline:0!important}.gravity-margin-xxs{margin:.25rem!important}.gravity-margin-top-xxs{margin-top:.25rem!important}.gravity-margin-bottom-xxs{margin-bottom:.25rem!important}.gravity-margin-left-xxs{margin-left:.25rem!important}.gravity-margin-right-xxs{margin-right:.25rem!important}.gravity-margin-block-xxs{margin-block:.25rem!important}.gravity-margin-inline-xxs{margin-inline:.25rem!important}.gravity-margin-xs{margin:.5rem!important}.gravity-margin-top-xs{margin-top:.5rem!important}.gravity-margin-bottom-xs{margin-bottom:.5rem!important}.gravity-margin-left-xs{margin-left:.5rem!important}.gravity-margin-right-xs{margin-right:.5rem!important}.gravity-margin-block-xs{margin-block:.5rem!important}.gravity-margin-inline-xs{margin-inline:.5rem!important}.gravity-margin-sm{margin:1rem!important}.gravity-margin-top-sm{margin-top:1rem!important}.gravity-margin-bottom-sm{margin-bottom:1rem!important}.gravity-margin-left-sm{margin-left:1rem!important}.gravity-margin-right-sm{margin-right:1rem!important}.gravity-margin-block-sm{margin-block:1rem!important}.gravity-margin-inline-sm{margin-inline:1rem!important}.gravity-margin-md{margin:1.5rem!important}.gravity-margin-top-md{margin-top:1.5rem!important}.gravity-margin-bottom-md{margin-bottom:1.5rem!important}.gravity-margin-left-md{margin-left:1.5rem!important}.gravity-margin-right-md{margin-right:1.5rem!important}.gravity-margin-block-md{margin-block:1.5rem!important}.gravity-margin-inline-md{margin-inline:1.5rem!important}.gravity-margin-lg{margin:2rem!important}.gravity-margin-top-lg{margin-top:2rem!important}.gravity-margin-bottom-lg{margin-bottom:2rem!important}.gravity-margin-left-lg{margin-left:2rem!important}.gravity-margin-right-lg{margin-right:2rem!important}.gravity-margin-block-lg{margin-block:2rem!important}.gravity-margin-inline-lg{margin-inline:2rem!important}.gravity-margin-xl{margin:2.5rem!important}.gravity-margin-top-xl{margin-top:2.5rem!important}.gravity-margin-bottom-xl{margin-bottom:2.5rem!important}.gravity-margin-left-xl{margin-left:2.5rem!important}.gravity-margin-right-xl{margin-right:2.5rem!important}.gravity-margin-block-xl{margin-block:2.5rem!important}.gravity-margin-inline-xl{margin-inline:2.5rem!important}.gravity-margin-xxl{margin:3rem!important}.gravity-margin-top-xxl{margin-top:3rem!important}.gravity-margin-bottom-xxl{margin-bottom:3rem!important}.gravity-margin-left-xxl{margin-left:3rem!important}.gravity-margin-right-xxl{margin-right:3rem!important}.gravity-margin-block-xxl{margin-block:3rem!important}.gravity-margin-inline-xxl{margin-inline:3rem!important}.gravity-margin-xxxl{margin:4rem!important}.gravity-margin-top-xxxl{margin-top:4rem!important}.gravity-margin-bottom-xxxl{margin-bottom:4rem!important}.gravity-margin-left-xxxl{margin-left:4rem!important}.gravity-margin-right-xxxl{margin-right:4rem!important}.gravity-margin-block-xxxl{margin-block:4rem!important}.gravity-margin-inline-xxxl{margin-inline:4rem!important}.gravity-margin-xxxxl{margin:6rem!important}.gravity-margin-top-xxxxl{margin-top:6rem!important}.gravity-margin-bottom-xxxxl{margin-bottom:6rem!important}.gravity-margin-left-xxxxl{margin-left:6rem!important}.gravity-margin-right-xxxxl{margin-right:6rem!important}.gravity-margin-block-xxxxl{margin-block:6rem!important}.gravity-margin-inline-xxxxl{margin-inline:6rem!important}.gravity-margin-xxxxxl{margin:12rem!important}.gravity-margin-top-xxxxxl{margin-top:12rem!important}.gravity-margin-bottom-xxxxxl{margin-bottom:12rem!important}.gravity-margin-left-xxxxxl{margin-left:12rem!important}.gravity-margin-right-xxxxxl{margin-right:12rem!important}.gravity-margin-block-xxxxxl{margin-block:12rem!important}.gravity-margin-inline-xxxxxl{margin-inline:12rem!important}:host{display:block;--dropdown-cd-field-input-width: 350px}.gravity-input-field{display:flex;cursor:pointer;padding:10px 12px;position:relative;align-items:center;border-radius:.3125rem;width:var(--dropdown-cd-field-input-width);height:var(--dropdown-cd-field-input-height);--text-field-input-field-border-width: .5px;color:var(--text-field-input-field-content-color);background-color:var(--text-field-input-field-background-color);border:var(--text-field-input-field-border-width) solid var(--text-field-input-field-border-color)}.gravity-input-field gravity-icon{--icon-width: var(--text-field-input-field-content);--icon-height: var(--text-field-input-field-content);--icon-color: var(--text-field-input-field-icon-color)}.gravity-input-field gravity-icon.pointer{cursor:pointer}.gravity-input-field gravity-icon.right{margin-right:var(--icon-margin)}.gravity-input-field p.value{width:100%}.gravity-input-field.md{--dropdown-margin: 8px;--dropdown-items-padding: 6px;--text-field-input-field-content: 15px}.gravity-input-field.md.standard-width{--dropdown-cd-field-input-width: 350px;--dropdown-cd-field-input-height: 58px;--dropdown-cd-items-container-height: 502px}.gravity-input-field.closed{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-dropdown-list-dc-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field.open{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field.disabled{cursor:default;pointer-events:none;--text-field-input-field-border-width: 1px;--text-field-input-field-icon-color: var(--on-bg-disabled);--text-field-input-field-content-color: var(--on-bg-disabled);--text-field-input-field-border-color: var(--outline-disabled)}.gravity-input-field.selected{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--icon-active-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-dropdown-list-dc-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field.selected ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary{background-color:var(--surface-secondary)}.gravity-input-field.readonly{cursor:initial;--text-field-input-field-border-width: 1px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--placeholder-full-enabled-pressed-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field:not(.readonly):hover{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field:not(.readonly):hover ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary{background-color:var(--surface-primary)}.dropdown-panel{left:-2px;z-index:5;cursor:initial;position:absolute;width:var(--dropdown-cd-field-input-width);border-radius:.3125rem;top:calc(100% + var(--dropdown-margin));background-color:var(--bg-field-full-enabled-primary);border:1px solid var(--outline-dropdown-list-dc-primary)}.dropdown-panel .search-input{display:flex;padding:12px;align-items:center;border-bottom:1px solid var(--outline-field-full-enabled-pressed-primary)}.dropdown-panel .search-input search-input:focus-within{border-bottom:1px solid var(--text-primary)}.dropdown-panel .search-input.disabled{border-bottom:1px solid var(--outline-disabled)}.dropdown-panel .search-input gravity-icon.search-icon{margin-right:.5rem}.dropdown-panel .search-input gravity-icon.reset-icon{margin-left:.5rem}.dropdown-panel .search-input input{margin:0;padding:0;width:100%;border:none;outline:none;border-radius:0;background-color:transparent;color:var(--input-text-full-enabled-primary)}.dropdown-panel .search-input input::placeholder{color:var(--placeholder-empty-enabled-primary)}.dropdown-panel .items-container{overflow:auto;margin:var(--dropdown-margin) 0;max-height:var(--dropdown-cd-items-container-height)}.dropdown-panel .items-container .items{width:100%;display:flex;flex-direction:column;gap:var(--gravity-spacing-xxs);padding:0 var(--dropdown-items-padding);max-height:var(--dropdown-cd-items-container-height)}.dropdown-panel .items-container .items .item-container.expanded{display:grid;gap:var(--gravity-spacing-xxs);border-bottom:1px solid var(--bg-disabled)}.dropdown-panel .items-container .items .item-container .item{height:60px;display:flex;cursor:pointer;position:relative;white-space:nowrap;align-items:center;justify-content:space-between;padding:.75rem var(--gravity-spacing-sm);color:var(--label-text-full-enabled-primary)}.dropdown-panel .items-container .items .item-container .item .expand-icon{position:absolute;top:var(--gravity-spacing-md);right:var(--gravity-spacing-sm)}.dropdown-panel .items-container .items .item-container .item .subitem-line{top:-18px;height:40px;position:absolute;border-left:1px solid var(--on-bg-disabled);left:calc(var(--gravity-spacing-md) + var(--gravity-spacing-xxs))}.dropdown-panel .items-container .items .item-container .item:hover:not(.no-results):not(.disabled),.dropdown-panel .items-container .items .item-container .item.selected{border-radius:.3125rem;color:var(--on-bg-menu-button-active-primary);background-color:var(--bg-menu-button-hover-primary)}.dropdown-panel .items-container .items .item-container .item:hover:not(.no-results):not(.disabled) ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary,.dropdown-panel .items-container .items .item-container .item.selected ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary{background-color:var(--surface-secondary)!important}.dropdown-panel .items-container .items .item-container .item.disabled{cursor:default;pointer-events:none}.dropdown-panel .items-container .items .item-container .item.disabled .currency-info{color:var(--on-bg-disabled)}.dropdown-panel .items-container .items .item-container .item .currency-info{right:0;bottom:13px;position:absolute}.wallet-balance-info{text-align:end;margin-top:12px;margin-right:12px;width:calc(var(--dropdown-cd-field-input-width) - 12px)}.no-results{cursor:default!important}\n"] }]
+            args: [{ selector: 'gravity-dropdown-list-display', providers: [FilterByPipe], template: "<div [attr.data-cy]=\"cypressTag\" class=\"gravity-input-field {{size}} {{width}}-width {{getStatus()}}\"\n     (click)=\"toggleDropdown()\">\n\n    <p class=\"hr-label {{size}}-regular value\">\n        <ng-container *ngIf=\"selectedItems.length == 0\">{{ placeholder }}</ng-container>\n        <ng-container *ngIf=\"selectedItems.length > 0\">\n            <gravity-currency-display-v2\n                [currency]=\"{ currency_name: selectedItem.currency_name,\n                              currency_id: selectedItem.currency_id, currency_iso: selectedItem.currency_iso,\n                              network_id: selectedItem.network_id, network_iso: selectedItem.network_iso,\n                              pill_type: (getStatus() === 'selected' && !isHovered) ? 'secondary' : 'primary'}\">\n            </gravity-currency-display-v2>\n        </ng-container>\n    </p>\n\n    <gravity-icon class=\"right\" [iconName]=\"dropdownOpened ? 'arrow-up': 'arrow-down'\" [iconSize]=\"'md-16'\"\n                  *ngIf=\"!isReadonly\"></gravity-icon>\n    <div class=\"dropdown-panel\" (click)=\"$event.stopPropagation()\" *ngIf=\"dropdownOpened\"\n         [attr.data-cy]=\"cypressTag + '_panel'\">\n\n        <div class=\"search-input\" [class.disabled]=\"disableSearch\">\n            <gravity-icon [style.--icon-color]=\"disableSearch ? 'var(--on-bg-disabled)' : null\"\n                          class=\"search-icon\" [iconName]=\"'search'\" [iconSize]=\"'sm-12'\">\n            </gravity-icon>\n            <input autocomplete=\"off\" class=\"hr-label {{size}}-regular\" (input)=\"filterItems()\"\n                   [attr.data-cy]=\"cypressTag + '_search_input'\" #searchInput [disabled]=\"disableSearch\"\n                   [(ngModel)]=\"searchText\" placeholder=\"{{currentLang == 'es' ? 'Buscar moneda' : 'Search currency'}}\">\n            <gravity-icon class=\"pointer reset-icon\" (click)=\"searchText = ''; filterItems()\" [iconName]=\"'unsuccess'\"\n                          [iconSize]=\"'sm-12'\" *ngIf=\"searchText?.length > 0\">\n            </gravity-icon>\n        </div>\n\n        <div class=\"items-container\">\n            <div class=\"items\">\n                <div class=\"item-container\" *ngFor=\"let item of availableOptions\" [class.expanded]=\"item.is_expanded\">\n                    <div class=\"hr-label item {{size}}-regular pointer\" [class.disabled]=\"item?.disabled\"\n                         [class.selected]=\"item.sub_items?.length > 0 ? null : checkIfSelected(item)\"\n                         (click)=\"item.sub_items?.length > 0 ? item.is_expanded = !item.is_expanded : selectItem(item)\"\n                         (mouseenter)=\"item.isHovered = true\" (mouseleave)=\"item.isHovered = false\">\n\n                        <gravity-currency-display-v2\n                            [disabled]=\"item?.disabled\"\n                            [currency]=\"{ currency_name: item.currency_name,\n                                          currency_iso: item.currency_iso, currency_id: item.currency_id,\n                                          network_id: item.network_id, network_iso: item.network_iso,\n                                          pill_type: (checkIfSelected(item) || item.isHovered) ? 'secondary' : 'primary' }\">\n                        </gravity-currency-display-v2>\n\n                        <span *ngIf=\"!item.sub_items\" class=\"hr-body sm-regular gravity-margin-right-sm currency-info\">\n                            {{ item?.balance_amount }} {{ item?.balance_currency }}\n                        </span>\n\n                        <gravity-icon *ngIf=\"item.sub_items?.length > 0 && item?.disabled !== true\" class=\"pointer expand-icon\"\n                                      [iconSize]=\"'sm-12'\" [iconName]=\"item.is_expanded ? 'arrow-up' : 'arrow-down'\">\n                        </gravity-icon>\n                    </div>\n\n                    <ng-container *ngIf=\"item.is_expanded && item.sub_items\">\n                        <div class=\"hr-label item {{size}}-regular pointer\" *ngFor=\"let subItem of item.sub_items\"\n                             [class.selected]=\"checkIfSelected(subItem)\" (click)=\"selectItem(subItem)\" [class.disabled]=\"subItem?.disabled\">\n\n                            <div class=\"subitem-line\"></div>\n                            <gravity-currency-display-v2\n                                [disabled]=\"subItem?.disabled\"\n                                [currency]=\"{ currency_name: subItem.currency_name,\n                                              currency_iso: subItem.currency_iso, currency_id: subItem.currency_id,\n                                              network_id: subItem.network_id, network_iso: subItem.network_iso,\n                                              pill_type: (checkIfSelected(item) || item.isHovered) ? 'secondary' : 'primary' }\" >\n                            </gravity-currency-display-v2>\n\n                            <span class=\"hr-body sm-regular gravity-margin-right-sm currency-info\">\n                                {{ subItem.balance_amount }} {{ subItem.balance_currency }}\n                            </span>\n                        </div>\n                    </ng-container>\n                </div>\n\n                <div class=\"hr-label item {{size}}-bold no-results\" *ngIf=\"availableOptions.length === 0\">\n                    {{ currentLang == 'es' ? 'Sin resultados' : 'No results' }}\n                </div>\n            </div>\n        </div>\n    </div>\n</div>\n\n<div class=\"wallet-balance-info\" *ngIf=\"selectedItems.length > 0\">\n    <p class=\"hr-label sm-regular\">{{ currentLang == 'es' ? 'Saldo de cartera' : 'Wallet balance' }}\n        : {{ selectedItem.balance_amount }} {{ selectedItem.balance_currency }}</p>\n</div>\n\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:6.25rem}:root{--gravity-spacing-none: 0;--gravity-spacing-xxxs: .125rem;--gravity-spacing-xxs: .25rem;--gravity-spacing-xs: .5rem;--gravity-spacing-sm: 1rem;--gravity-spacing-md: 1.5rem;--gravity-spacing-lg: 2rem;--gravity-spacing-xl: 2.5rem;--gravity-spacing-xxl: 3rem;--gravity-spacing-xxxl: 4rem;--gravity-spacing-xxxxl: 6rem;--gravity-spacing-xxxxxl: 12rem}.gravity-padding-none{padding:0!important}.gravity-padding-top-none{padding-top:0!important}.gravity-padding-bottom-none{padding-bottom:0!important}.gravity-padding-left-none{padding-left:0!important}.gravity-padding-right-none{padding-right:0!important}.gravity-padding-block-none{padding-block:0!important}.gravity-padding-inline-none{padding-inline:0!important}.gravity-padding-xxs{padding:.25rem!important}.gravity-padding-top-xxs{padding-top:.25rem!important}.gravity-padding-bottom-xxs{padding-bottom:.25rem!important}.gravity-padding-left-xxs{padding-left:.25rem!important}.gravity-padding-right-xxs{padding-right:.25rem!important}.gravity-padding-block-xxs{padding-block:.25rem!important}.gravity-padding-inline-xxs{padding-inline:.25rem!important}.gravity-padding-xs{padding:.5rem!important}.gravity-padding-top-xs{padding-top:.5rem!important}.gravity-padding-bottom-xs{padding-bottom:.5rem!important}.gravity-padding-left-xs{padding-left:.5rem!important}.gravity-padding-right-xs{padding-right:.5rem!important}.gravity-padding-block-xs{padding-block:.5rem!important}.gravity-padding-inline-xs{padding-inline:.5rem!important}.gravity-padding-sm{padding:1rem!important}.gravity-padding-top-sm{padding-top:1rem!important}.gravity-padding-bottom-sm{padding-bottom:1rem!important}.gravity-padding-left-sm{padding-left:1rem!important}.gravity-padding-right-sm{padding-right:1rem!important}.gravity-padding-block-sm{padding-block:1rem!important}.gravity-padding-inline-sm{padding-inline:1rem!important}.gravity-padding-md{padding:1.5rem!important}.gravity-padding-top-md{padding-top:1.5rem!important}.gravity-padding-bottom-md{padding-bottom:1.5rem!important}.gravity-padding-left-md{padding-left:1.5rem!important}.gravity-padding-right-md{padding-right:1.5rem!important}.gravity-padding-block-md{padding-block:1.5rem!important}.gravity-padding-inline-md{padding-inline:1.5rem!important}.gravity-padding-lg{padding:2rem!important}.gravity-padding-top-lg{padding-top:2rem!important}.gravity-padding-bottom-lg{padding-bottom:2rem!important}.gravity-padding-left-lg{padding-left:2rem!important}.gravity-padding-right-lg{padding-right:2rem!important}.gravity-padding-block-lg{padding-block:2rem!important}.gravity-padding-inline-lg{padding-inline:2rem!important}.gravity-padding-xl{padding:2.5rem!important}.gravity-padding-top-xl{padding-top:2.5rem!important}.gravity-padding-bottom-xl{padding-bottom:2.5rem!important}.gravity-padding-left-xl{padding-left:2.5rem!important}.gravity-padding-right-xl{padding-right:2.5rem!important}.gravity-padding-block-xl{padding-block:2.5rem!important}.gravity-padding-inline-xl{padding-inline:2.5rem!important}.gravity-padding-xxl{padding:3rem!important}.gravity-padding-top-xxl{padding-top:3rem!important}.gravity-padding-bottom-xxl{padding-bottom:3rem!important}.gravity-padding-left-xxl{padding-left:3rem!important}.gravity-padding-right-xxl{padding-right:3rem!important}.gravity-padding-block-xxl{padding-block:3rem!important}.gravity-padding-inline-xxl{padding-inline:3rem!important}.gravity-padding-xxxl{padding:4rem!important}.gravity-padding-top-xxxl{padding-top:4rem!important}.gravity-padding-bottom-xxxl{padding-bottom:4rem!important}.gravity-padding-left-xxxl{padding-left:4rem!important}.gravity-padding-right-xxxl{padding-right:4rem!important}.gravity-padding-block-xxxl{padding-block:4rem!important}.gravity-padding-inline-xxxl{padding-inline:4rem!important}.gravity-padding-xxxxl{padding:6rem!important}.gravity-padding-top-xxxxl{padding-top:6rem!important}.gravity-padding-bottom-xxxxl{padding-bottom:6rem!important}.gravity-padding-left-xxxxl{padding-left:6rem!important}.gravity-padding-right-xxxxl{padding-right:6rem!important}.gravity-padding-block-xxxxl{padding-block:6rem!important}.gravity-padding-inline-xxxxl{padding-inline:6rem!important}.gravity-padding-xxxxxl{padding:12rem!important}.gravity-padding-top-xxxxxl{padding-top:12rem!important}.gravity-padding-bottom-xxxxxl{padding-bottom:12rem!important}.gravity-padding-left-xxxxxl{padding-left:12rem!important}.gravity-padding-right-xxxxxl{padding-right:12rem!important}.gravity-padding-block-xxxxxl{padding-block:12rem!important}.gravity-padding-inline-xxxxxl{padding-inline:12rem!important}.gravity-margin-none{margin:0!important}.gravity-margin-top-none{margin-top:0!important}.gravity-margin-bottom-none{margin-bottom:0!important}.gravity-margin-left-none{margin-left:0!important}.gravity-margin-right-none{margin-right:0!important}.gravity-margin-block-none{margin-block:0!important}.gravity-margin-inline-none{margin-inline:0!important}.gravity-margin-xxs{margin:.25rem!important}.gravity-margin-top-xxs{margin-top:.25rem!important}.gravity-margin-bottom-xxs{margin-bottom:.25rem!important}.gravity-margin-left-xxs{margin-left:.25rem!important}.gravity-margin-right-xxs{margin-right:.25rem!important}.gravity-margin-block-xxs{margin-block:.25rem!important}.gravity-margin-inline-xxs{margin-inline:.25rem!important}.gravity-margin-xs{margin:.5rem!important}.gravity-margin-top-xs{margin-top:.5rem!important}.gravity-margin-bottom-xs{margin-bottom:.5rem!important}.gravity-margin-left-xs{margin-left:.5rem!important}.gravity-margin-right-xs{margin-right:.5rem!important}.gravity-margin-block-xs{margin-block:.5rem!important}.gravity-margin-inline-xs{margin-inline:.5rem!important}.gravity-margin-sm{margin:1rem!important}.gravity-margin-top-sm{margin-top:1rem!important}.gravity-margin-bottom-sm{margin-bottom:1rem!important}.gravity-margin-left-sm{margin-left:1rem!important}.gravity-margin-right-sm{margin-right:1rem!important}.gravity-margin-block-sm{margin-block:1rem!important}.gravity-margin-inline-sm{margin-inline:1rem!important}.gravity-margin-md{margin:1.5rem!important}.gravity-margin-top-md{margin-top:1.5rem!important}.gravity-margin-bottom-md{margin-bottom:1.5rem!important}.gravity-margin-left-md{margin-left:1.5rem!important}.gravity-margin-right-md{margin-right:1.5rem!important}.gravity-margin-block-md{margin-block:1.5rem!important}.gravity-margin-inline-md{margin-inline:1.5rem!important}.gravity-margin-lg{margin:2rem!important}.gravity-margin-top-lg{margin-top:2rem!important}.gravity-margin-bottom-lg{margin-bottom:2rem!important}.gravity-margin-left-lg{margin-left:2rem!important}.gravity-margin-right-lg{margin-right:2rem!important}.gravity-margin-block-lg{margin-block:2rem!important}.gravity-margin-inline-lg{margin-inline:2rem!important}.gravity-margin-xl{margin:2.5rem!important}.gravity-margin-top-xl{margin-top:2.5rem!important}.gravity-margin-bottom-xl{margin-bottom:2.5rem!important}.gravity-margin-left-xl{margin-left:2.5rem!important}.gravity-margin-right-xl{margin-right:2.5rem!important}.gravity-margin-block-xl{margin-block:2.5rem!important}.gravity-margin-inline-xl{margin-inline:2.5rem!important}.gravity-margin-xxl{margin:3rem!important}.gravity-margin-top-xxl{margin-top:3rem!important}.gravity-margin-bottom-xxl{margin-bottom:3rem!important}.gravity-margin-left-xxl{margin-left:3rem!important}.gravity-margin-right-xxl{margin-right:3rem!important}.gravity-margin-block-xxl{margin-block:3rem!important}.gravity-margin-inline-xxl{margin-inline:3rem!important}.gravity-margin-xxxl{margin:4rem!important}.gravity-margin-top-xxxl{margin-top:4rem!important}.gravity-margin-bottom-xxxl{margin-bottom:4rem!important}.gravity-margin-left-xxxl{margin-left:4rem!important}.gravity-margin-right-xxxl{margin-right:4rem!important}.gravity-margin-block-xxxl{margin-block:4rem!important}.gravity-margin-inline-xxxl{margin-inline:4rem!important}.gravity-margin-xxxxl{margin:6rem!important}.gravity-margin-top-xxxxl{margin-top:6rem!important}.gravity-margin-bottom-xxxxl{margin-bottom:6rem!important}.gravity-margin-left-xxxxl{margin-left:6rem!important}.gravity-margin-right-xxxxl{margin-right:6rem!important}.gravity-margin-block-xxxxl{margin-block:6rem!important}.gravity-margin-inline-xxxxl{margin-inline:6rem!important}.gravity-margin-xxxxxl{margin:12rem!important}.gravity-margin-top-xxxxxl{margin-top:12rem!important}.gravity-margin-bottom-xxxxxl{margin-bottom:12rem!important}.gravity-margin-left-xxxxxl{margin-left:12rem!important}.gravity-margin-right-xxxxxl{margin-right:12rem!important}.gravity-margin-block-xxxxxl{margin-block:12rem!important}.gravity-margin-inline-xxxxxl{margin-inline:12rem!important}:host{display:block;--dropdown-cd-field-input-width: 350px}.gravity-input-field{display:flex;cursor:pointer;padding:10px 12px;position:relative;align-items:center;border-radius:.3125rem;width:var(--dropdown-cd-field-input-width);height:var(--dropdown-cd-field-input-height);--text-field-input-field-border-width: .5px;color:var(--text-field-input-field-content-color);background-color:var(--text-field-input-field-background-color);border:var(--text-field-input-field-border-width) solid var(--text-field-input-field-border-color)}.gravity-input-field gravity-icon{--icon-width: var(--text-field-input-field-content);--icon-height: var(--text-field-input-field-content);--icon-color: var(--text-field-input-field-icon-color)}.gravity-input-field gravity-icon.pointer{cursor:pointer}.gravity-input-field gravity-icon.right{margin-right:var(--icon-margin)}.gravity-input-field p.value{width:100%}.gravity-input-field.md{--dropdown-margin: 8px;--dropdown-items-padding: 6px;--text-field-input-field-content: 15px}.gravity-input-field.md.standard-width{--dropdown-cd-field-input-width: 350px;--dropdown-cd-field-input-height: 58px;--dropdown-cd-items-container-height: 502px}.gravity-input-field.closed{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-dropdown-list-dc-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field.open{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field.disabled{cursor:default;pointer-events:none;--text-field-input-field-border-width: 1px;--text-field-input-field-icon-color: var(--on-bg-disabled);--text-field-input-field-content-color: var(--on-bg-disabled);--text-field-input-field-border-color: var(--outline-disabled)}.gravity-input-field.selected{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--icon-active-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-dropdown-list-dc-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field.selected ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary{background-color:var(--surface-secondary)}.gravity-input-field.readonly{cursor:initial;--text-field-input-field-border-width: 1px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-border-color: var(--placeholder-full-enabled-pressed-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field:not(.readonly):hover{--text-field-input-field-border-width: 2px;--text-field-input-field-icon-color: var(--label-text-empty-enabled-primary);--text-field-input-field-border-color: var(--outline-dropdown-list-dc-primary);--text-field-input-field-background-color: var(--bg-field-empty-enabled-primary);--text-field-input-field-content-color: var(--placeholder-full-enabled-pressed-primary)}.gravity-input-field:not(.readonly):hover ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary{background-color:var(--surface-primary)}.dropdown-panel{left:-2px;z-index:5;cursor:initial;position:absolute;width:var(--dropdown-cd-field-input-width);border-radius:.3125rem;top:calc(100% + var(--dropdown-margin));background-color:var(--bg-field-full-enabled-primary);border:1px solid var(--outline-dropdown-list-dc-primary)}.dropdown-panel .search-input{display:flex;padding:12px;align-items:center;border-bottom:1px solid var(--outline-field-full-enabled-pressed-primary)}.dropdown-panel .search-input search-input:focus-within{border-bottom:1px solid var(--text-primary)}.dropdown-panel .search-input.disabled{border-bottom:1px solid var(--outline-disabled)}.dropdown-panel .search-input gravity-icon.search-icon{margin-right:.5rem}.dropdown-panel .search-input gravity-icon.reset-icon{margin-left:.5rem}.dropdown-panel .search-input input{margin:0;padding:0;width:100%;border:none;outline:none;border-radius:0;background-color:transparent;color:var(--input-text-full-enabled-primary)}.dropdown-panel .search-input input::placeholder{color:var(--placeholder-empty-enabled-primary)}.dropdown-panel .items-container{overflow:auto;scrollbar-width:none;margin:var(--dropdown-margin) 0;max-height:var(--dropdown-cd-items-container-height)}.dropdown-panel .items-container .items{width:100%;display:flex;flex-direction:column;gap:var(--gravity-spacing-xxs);padding:0 var(--dropdown-items-padding);max-height:var(--dropdown-cd-items-container-height)}.dropdown-panel .items-container .items .item-container.expanded{display:grid;gap:var(--gravity-spacing-xxs);border-bottom:1px solid var(--bg-disabled)}.dropdown-panel .items-container .items .item-container .item{height:60px;display:flex;cursor:pointer;position:relative;white-space:nowrap;align-items:center;justify-content:space-between;padding:.75rem var(--gravity-spacing-sm);color:var(--label-text-full-enabled-primary)}.dropdown-panel .items-container .items .item-container .item .expand-icon{position:absolute;top:var(--gravity-spacing-md);right:var(--gravity-spacing-sm)}.dropdown-panel .items-container .items .item-container .item .subitem-line{top:-18px;height:40px;position:absolute;border-left:1px solid var(--on-bg-disabled);left:calc(var(--gravity-spacing-md) + var(--gravity-spacing-xxs))}.dropdown-panel .items-container .items .item-container .item:hover:not(.no-results):not(.disabled),.dropdown-panel .items-container .items .item-container .item.selected{border-radius:.3125rem;color:var(--on-bg-menu-button-active-primary);background-color:var(--bg-menu-button-hover-primary)}.dropdown-panel .items-container .items .item-container .item:hover:not(.no-results):not(.disabled) ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary,.dropdown-panel .items-container .items .item-container .item.selected ::ng-deep gravity-currency-display gravity-network-pill .gravity-network-pill.primary{background-color:var(--surface-secondary)!important}.dropdown-panel .items-container .items .item-container .item.disabled{cursor:default;pointer-events:none}.dropdown-panel .items-container .items .item-container .item.disabled .currency-info{color:var(--on-bg-disabled)}.dropdown-panel .items-container .items .item-container .item .currency-info{right:0;bottom:10px;position:absolute}.wallet-balance-info{text-align:end;margin-top:12px;margin-right:12px;width:calc(var(--dropdown-cd-field-input-width) - 12px)}.no-results{cursor:default!important}\n"] }]
         }], ctorParameters: function () { return [{ type: FilterByPipe }, { type: i0.ElementRef }]; }, propDecorators: { selectedItemsResponse: [{
                 type: Output,
                 args: ['response']
@@ -1007,6 +1018,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
             }], onDocumentClick: [{
                 type: HostListener,
                 args: ['document:click', ['$event']]
+            }], onMouseEnter: [{
+                type: HostListener,
+                args: ['mouseenter']
+            }], onMouseLeave: [{
+                type: HostListener,
+                args: ['mouseleave']
             }] } });
 
 class GravityTextFieldComponent {