@progressio_resources/gravity-design-system 3.7.3 → 3.7.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1133,11 +1133,11 @@ class GravityDropdownListDisplayComponent {
1133
1133
  this.loadItems();
1134
1134
  }
1135
1135
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityDropdownListDisplayComponent, deps: [{ token: GravityDropdownManagerService }, { token: FilterByPipe }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
1136
- 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", fiatRate: "fiatRate", label: "label", size: "size", width: "width" }, outputs: { selectedItemsResponse: "response" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, providers: [FilterByPipe], viewQueries: [{ propertyName: "watch", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "containerRef", first: true, predicate: ["containerRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [attr.data-cy]=\"cypressTag? 'currencyDropdown_' + cypressTag : null\" class=\"gravity-input-field {{size}} {{width}}-width {{getStatus()}}\"\n [class.has-value]=\"selectedItems.length > 0\"\n (mouseenter)=\"selectedItem ? selectedItem.isHovered = true : null\"\n (mouseleave)=\"selectedItem ? selectedItem.isHovered = false : null\"\n (click)=\"toggleDropdown()\">\n\n <div class=\"value\">\n\n <div class=\"dropdown-label\" [class.floating]=\"selectedItems.length > 0\">\n <span class=\"hr-label sm-bold\" *ngIf=\"label && selectedItems.length > 0\">{{label}}</span>\n </div>\n\n <div *ngIf=\"selectedItems.length == 0\" class=\"placeholder hr-label md-regular\">{{ placeholder }}</div>\n <div *ngIf=\"selectedItems.length > 0\" class=\"selected-value\">\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: isReadonly || selectedItem.isHovered ? 'primary' : (getStatus() === 'selected' ? 'secondary' : 'primary')}\">\n </gravity-currency-display-v2>\n </div>\n </div>\n\n <gravity-icon class=\"right\" [iconName]=\"dropdownOpened ? 'arrow-up': 'arrow-down'\" [iconSize]=\"'sm-12'\"\n *ngIf=\"!isReadonly\"/>\n\n <div class=\"dropdown-panel\" (click)=\"$event.stopPropagation()\" *ngIf=\"dropdownOpened\"\n [attr.data-cy]=\"'currencyDropdown_panel'\">\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]=\"'currencyDropdown_searchInput'\" #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\" #containerRef>\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\" [attr.data-cy]=\"'currencyDropdown_currencyId'+item.currency_id\">\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 (mouseenter)=\"subItem.isHovered = true\" (mouseleave)=\"subItem.isHovered = false\">\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(subItem) || subItem.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 }} <span *ngIf=\"fiatRate\"> | \u2248 {{fiatRate.amount}} {{fiatRate.iso}} </span></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}.scrollbar-sm::-webkit-scrollbar,.dropdown-panel .items-container::-webkit-scrollbar{width:4px;height:4px}.scrollbar-sm::-webkit-scrollbar-track,.dropdown-panel .items-container::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb,.dropdown-panel .items-container::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb:hover,.dropdown-panel .items-container::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}.scrollbar-md::-webkit-scrollbar{width:8px;height:8px}.scrollbar-md::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}:host{display:block;--dropdown-cd-field-input-width: 350px}.gravity-input-field{margin-top:25px;display:flex;cursor:pointer;padding:1rem 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 .value{width:100%}.dropdown-label{position:absolute;top:50%;left:0;transform:translateY(-50%);pointer-events:none;opacity:0;transition:all .3s ease}.gravity-input-field.has-value .dropdown-label{top:-25px;transform:translateY(0);opacity:1}.placeholder{transition:opacity .15s ease}.gravity-input-field.has-value .placeholder{opacity:0}.selected-value{transition:transform .3s ease}.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: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: i2$1.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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.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: ["cypressTag", "disabled", "type", "currency"] }] }); }
1136
+ 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", fiatRate: "fiatRate", label: "label", size: "size", width: "width" }, outputs: { selectedItemsResponse: "response" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, providers: [FilterByPipe], viewQueries: [{ propertyName: "watch", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "containerRef", first: true, predicate: ["containerRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div [attr.data-cy]=\"cypressTag? 'currencyDropdown_' + cypressTag : null\" class=\"gravity-input-field {{size}} {{width}}-width {{getStatus()}}\"\n [class.has-value]=\"selectedItems.length > 0\"\n (mouseenter)=\"selectedItem ? selectedItem.isHovered = true : null\"\n (mouseleave)=\"selectedItem ? selectedItem.isHovered = false : null\"\n (click)=\"toggleDropdown()\">\n\n <div class=\"value\">\n\n <div class=\"dropdown-label\" [class.floating]=\"selectedItems.length > 0\">\n <span class=\"hr-label sm-bold\" *ngIf=\"label && selectedItems.length > 0\">{{label}}</span>\n </div>\n\n <div *ngIf=\"selectedItems.length == 0\" class=\"placeholder hr-label md-regular\">{{ placeholder }}</div>\n <div *ngIf=\"selectedItems.length > 0\" class=\"selected-value\">\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: isReadonly || selectedItem.isHovered ? 'primary' : (getStatus() === 'selected' ? 'secondary' : 'primary')}\">\n </gravity-currency-display-v2>\n </div>\n </div>\n\n <gravity-icon class=\"right\" [iconName]=\"dropdownOpened ? 'arrow-up': 'arrow-down'\" [iconSize]=\"'sm-12'\"\n *ngIf=\"!isReadonly\"/>\n\n <div class=\"dropdown-panel\" (click)=\"$event.stopPropagation()\" *ngIf=\"dropdownOpened\"\n [attr.data-cy]=\"'currencyDropdown_panel'\">\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]=\"'currencyDropdown_searchInput'\" #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\" #containerRef>\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\" [attr.data-cy]=\"'currencyDropdown_currencyId'+item.currency_id\">\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 (mouseenter)=\"subItem.isHovered = true\" (mouseleave)=\"subItem.isHovered = false\">\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(subItem) || subItem.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 wallet-balance-text\">{{ currentLang == 'es' ? 'Saldo de cartera' : 'Wallet balance' }}\n : {{ selectedItem.balance_amount }} {{ selectedItem.balance_currency }} <span *ngIf=\"fiatRate\"> | \u2248 {{fiatRate.amount}} {{fiatRate.iso}} </span></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}.scrollbar-sm::-webkit-scrollbar,.dropdown-panel .items-container::-webkit-scrollbar{width:4px;height:4px}.scrollbar-sm::-webkit-scrollbar-track,.dropdown-panel .items-container::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb,.dropdown-panel .items-container::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb:hover,.dropdown-panel .items-container::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}.scrollbar-md::-webkit-scrollbar{width:8px;height:8px}.scrollbar-md::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}:host{display:block;--dropdown-cd-field-input-width: 350px}.gravity-input-field{margin-top:25px;display:flex;cursor:pointer;padding:1rem 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 .value{width:100%}.dropdown-label{position:absolute;top:50%;left:0;transform:translateY(-50%);pointer-events:none;opacity:0;transition:all .3s ease}.gravity-input-field.has-value .dropdown-label{top:-25px;transform:translateY(0);opacity:1}.placeholder{transition:opacity .15s ease;background-color:transparent;opacity:1}.gravity-input-field.has-value .placeholder{opacity:0}.selected-value{transition:transform .3s ease}.gravity-input-field.md{--dropdown-margin: 8px;--dropdown-items-padding: 6px;--text-field-input-field-content: 15px;--dropdown-cd-field-input-height: 58px;--dropdown-cd-items-container-height: 502px}.gravity-input-field.md.standard-width{--dropdown-cd-field-input-width: 350px}.gravity-input-field.md.full-width{--dropdown-cd-field-input-width: 100%}.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:10px;position:absolute}.wallet-balance-info{text-align:end;margin-top:12px;margin-right:12px}.wallet-balance-text{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px}.wallet-balance-text span{white-space:nowrap}.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: i2$1.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: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.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: ["cypressTag", "disabled", "type", "currency"] }] }); }
1137
1137
  }
1138
1138
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityDropdownListDisplayComponent, decorators: [{
1139
1139
  type: Component,
1140
- args: [{ selector: 'gravity-dropdown-list-display', providers: [FilterByPipe], template: "<div [attr.data-cy]=\"cypressTag? 'currencyDropdown_' + cypressTag : null\" class=\"gravity-input-field {{size}} {{width}}-width {{getStatus()}}\"\n [class.has-value]=\"selectedItems.length > 0\"\n (mouseenter)=\"selectedItem ? selectedItem.isHovered = true : null\"\n (mouseleave)=\"selectedItem ? selectedItem.isHovered = false : null\"\n (click)=\"toggleDropdown()\">\n\n <div class=\"value\">\n\n <div class=\"dropdown-label\" [class.floating]=\"selectedItems.length > 0\">\n <span class=\"hr-label sm-bold\" *ngIf=\"label && selectedItems.length > 0\">{{label}}</span>\n </div>\n\n <div *ngIf=\"selectedItems.length == 0\" class=\"placeholder hr-label md-regular\">{{ placeholder }}</div>\n <div *ngIf=\"selectedItems.length > 0\" class=\"selected-value\">\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: isReadonly || selectedItem.isHovered ? 'primary' : (getStatus() === 'selected' ? 'secondary' : 'primary')}\">\n </gravity-currency-display-v2>\n </div>\n </div>\n\n <gravity-icon class=\"right\" [iconName]=\"dropdownOpened ? 'arrow-up': 'arrow-down'\" [iconSize]=\"'sm-12'\"\n *ngIf=\"!isReadonly\"/>\n\n <div class=\"dropdown-panel\" (click)=\"$event.stopPropagation()\" *ngIf=\"dropdownOpened\"\n [attr.data-cy]=\"'currencyDropdown_panel'\">\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]=\"'currencyDropdown_searchInput'\" #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\" #containerRef>\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\" [attr.data-cy]=\"'currencyDropdown_currencyId'+item.currency_id\">\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 (mouseenter)=\"subItem.isHovered = true\" (mouseleave)=\"subItem.isHovered = false\">\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(subItem) || subItem.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 }} <span *ngIf=\"fiatRate\"> | \u2248 {{fiatRate.amount}} {{fiatRate.iso}} </span></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}.scrollbar-sm::-webkit-scrollbar,.dropdown-panel .items-container::-webkit-scrollbar{width:4px;height:4px}.scrollbar-sm::-webkit-scrollbar-track,.dropdown-panel .items-container::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb,.dropdown-panel .items-container::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb:hover,.dropdown-panel .items-container::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}.scrollbar-md::-webkit-scrollbar{width:8px;height:8px}.scrollbar-md::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}:host{display:block;--dropdown-cd-field-input-width: 350px}.gravity-input-field{margin-top:25px;display:flex;cursor:pointer;padding:1rem 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 .value{width:100%}.dropdown-label{position:absolute;top:50%;left:0;transform:translateY(-50%);pointer-events:none;opacity:0;transition:all .3s ease}.gravity-input-field.has-value .dropdown-label{top:-25px;transform:translateY(0);opacity:1}.placeholder{transition:opacity .15s ease}.gravity-input-field.has-value .placeholder{opacity:0}.selected-value{transition:transform .3s ease}.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: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"] }]
1140
+ args: [{ selector: 'gravity-dropdown-list-display', providers: [FilterByPipe], template: "<div [attr.data-cy]=\"cypressTag? 'currencyDropdown_' + cypressTag : null\" class=\"gravity-input-field {{size}} {{width}}-width {{getStatus()}}\"\n [class.has-value]=\"selectedItems.length > 0\"\n (mouseenter)=\"selectedItem ? selectedItem.isHovered = true : null\"\n (mouseleave)=\"selectedItem ? selectedItem.isHovered = false : null\"\n (click)=\"toggleDropdown()\">\n\n <div class=\"value\">\n\n <div class=\"dropdown-label\" [class.floating]=\"selectedItems.length > 0\">\n <span class=\"hr-label sm-bold\" *ngIf=\"label && selectedItems.length > 0\">{{label}}</span>\n </div>\n\n <div *ngIf=\"selectedItems.length == 0\" class=\"placeholder hr-label md-regular\">{{ placeholder }}</div>\n <div *ngIf=\"selectedItems.length > 0\" class=\"selected-value\">\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: isReadonly || selectedItem.isHovered ? 'primary' : (getStatus() === 'selected' ? 'secondary' : 'primary')}\">\n </gravity-currency-display-v2>\n </div>\n </div>\n\n <gravity-icon class=\"right\" [iconName]=\"dropdownOpened ? 'arrow-up': 'arrow-down'\" [iconSize]=\"'sm-12'\"\n *ngIf=\"!isReadonly\"/>\n\n <div class=\"dropdown-panel\" (click)=\"$event.stopPropagation()\" *ngIf=\"dropdownOpened\"\n [attr.data-cy]=\"'currencyDropdown_panel'\">\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]=\"'currencyDropdown_searchInput'\" #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\" #containerRef>\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\" [attr.data-cy]=\"'currencyDropdown_currencyId'+item.currency_id\">\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 (mouseenter)=\"subItem.isHovered = true\" (mouseleave)=\"subItem.isHovered = false\">\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(subItem) || subItem.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 wallet-balance-text\">{{ currentLang == 'es' ? 'Saldo de cartera' : 'Wallet balance' }}\n : {{ selectedItem.balance_amount }} {{ selectedItem.balance_currency }} <span *ngIf=\"fiatRate\"> | \u2248 {{fiatRate.amount}} {{fiatRate.iso}} </span></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}.scrollbar-sm::-webkit-scrollbar,.dropdown-panel .items-container::-webkit-scrollbar{width:4px;height:4px}.scrollbar-sm::-webkit-scrollbar-track,.dropdown-panel .items-container::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb,.dropdown-panel .items-container::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb:hover,.dropdown-panel .items-container::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}.scrollbar-md::-webkit-scrollbar{width:8px;height:8px}.scrollbar-md::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}:host{display:block;--dropdown-cd-field-input-width: 350px}.gravity-input-field{margin-top:25px;display:flex;cursor:pointer;padding:1rem 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 .value{width:100%}.dropdown-label{position:absolute;top:50%;left:0;transform:translateY(-50%);pointer-events:none;opacity:0;transition:all .3s ease}.gravity-input-field.has-value .dropdown-label{top:-25px;transform:translateY(0);opacity:1}.placeholder{transition:opacity .15s ease;background-color:transparent;opacity:1}.gravity-input-field.has-value .placeholder{opacity:0}.selected-value{transition:transform .3s ease}.gravity-input-field.md{--dropdown-margin: 8px;--dropdown-items-padding: 6px;--text-field-input-field-content: 15px;--dropdown-cd-field-input-height: 58px;--dropdown-cd-items-container-height: 502px}.gravity-input-field.md.standard-width{--dropdown-cd-field-input-width: 350px}.gravity-input-field.md.full-width{--dropdown-cd-field-input-width: 100%}.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:10px;position:absolute}.wallet-balance-info{text-align:end;margin-top:12px;margin-right:12px}.wallet-balance-text{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px}.wallet-balance-text span{white-space:nowrap}.no-results{cursor:default!important}\n"] }]
1141
1141
  }], ctorParameters: function () { return [{ type: GravityDropdownManagerService }, { type: FilterByPipe }, { type: i0.ElementRef }]; }, propDecorators: { selectedItemsResponse: [{
1142
1142
  type: Output,
1143
1143
  args: ['response']
@@ -8035,11 +8035,11 @@ class GravityPaginationComponent {
8035
8035
  });
8036
8036
  }
8037
8037
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8038
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityPaginationComponent, selector: "gravity-pagination", inputs: { currentLang: "currentLang", cypressTag: "cypressTag", totalItems: "totalItems", itemsPerPage: "itemsPerPage", currentPage: "currentPage", type: "type", showPageCount: "showPageCount", showArrowDots: "showArrowDots" }, outputs: { pageChanged: "pageChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"gravity-pagination-container\" [attr.data-cy]=\"cypressTag ? 'pagination_' + cypressTag : null\">\n <!-- First -->\n <div class=\"paginator-button-container\" (click)=\"changePage(1)\" [attr.data-cy]=\"'pagination_firstButton'\"\n *ngIf=\"type != 'dots' && currentPage != 1 && totalPages > 5 || type == 'page-count'\">\n <gravity-icon [iconName]=\"'chevron-double-left'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'First' : 'Primero' }}</p>\n </div>\n\n <!-- Back -->\n <div class=\"paginator-button-container\" [class.disabled]=\"currentPage === 1\" [attr.data-cy]=\"'pagination_backButton'\"\n (click)=\"changePage(currentPage - 1)\" *ngIf=\"showArrowDots\">\n <gravity-icon [iconName]=\"'arrow-left'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'Back' : 'Atr\u00E1s' }}</p>\n </div>\n\n <!-- Numbers and Ellipsis -->\n <ng-container *ngIf=\"type == 'full' || type == 'compact'\">\n <ng-container *ngFor=\"let p of pages\">\n <div class=\"paginator-button-container\"\n [class.no-click]=\"p.toString() == '...'\"\n [class.pressed]=\"currentPage === p\"\n (click)=\"changePage(p)\" [attr.data-cy]=\"'pagination_page' +p+ 'Button'\">\n <p class=\"hr-body sm-regular\">{{ p }}</p>\n </div>\n </ng-container>\n </ng-container>\n\n <!-- Page count -->\n <div class=\"paginator-button-container no-click\" *ngIf=\"type === 'page-count' && showPageCount\">\n <p class=\"hr-body sm-regular\">{{ currentPage + (currentLang == 'en' ? ' of ' : ' de ') + totalPages }}</p>\n </div>\n\n <!-- Dots -->\n <div class=\"dots-container\" *ngIf=\"type === 'dots'\">\n <ng-container *ngFor=\"let p of pages\">\n <div class=\"dot\"\n [class.pressed]=\"currentPage === p\"\n (click)=\"changePage(p)\" [attr.data-cy]=\"'pagination_page' +p+ 'DotsButton'\"></div>\n </ng-container>\n </div>\n\n <!-- Next -->\n <div class=\"paginator-button-container\" [class.disabled]=\"currentPage === totalPages\"\n [attr.data-cy]=\"'pagination_nextButton'\"\n (click)=\"changePage(currentPage + 1)\" *ngIf=\"showArrowDots\">\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'Next' : 'Siguiente' }}</p>\n <gravity-icon [iconName]=\"'arrow-right'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n </div>\n\n <!-- Last -->\n <div class=\"paginator-button-container\" (click)=\"changePage(totalPages)\" [attr.data-cy]=\"'pagination_lastButton'\"\n *ngIf=\"type != 'dots' && currentPage !== totalPages && totalPages > 5 || type == 'page-count'\">\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'Last' : '\u00DAltimo' }}</p>\n <gravity-icon [iconName]=\"'chevron-double-right'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n </div>\n</div>\n", styles: [":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}.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}.gravity-pagination-container{display:flex;align-items:center}.gravity-pagination-container .paginator-button-container{--paginator-button-text-color: var(--on-bg-button-pressed-tertiary);display:flex;height:32px;padding:10px 12px;justify-content:center;align-items:center;gap:var(--gravity-spacing-xxs);cursor:pointer;border-radius:.3125rem;background-color:var(--paginator-button-background-color)}.gravity-pagination-container .paginator-button-container p{color:var(--paginator-button-text-color)}.gravity-pagination-container .paginator-button-container:not(.disabled):not(.pressed):not(.no-click):hover,.gravity-pagination-container .paginator-button-container.hover{--paginator-button-background-color: var(--bg-button-active-tertiary);--paginator-button-text-color: var(--on-bg-button-pressed-tertiary)}.gravity-pagination-container .paginator-button-container:not(.disabled).pressed{--paginator-button-background-color: var(--bg-button-pressed-primary);--paginator-button-text-color: var(--on-bg-button-pressed-primary)}.gravity-pagination-container .paginator-button-container.disabled{--paginator-button-text-color: var(--on-bg-disabled);cursor:default!important}.gravity-pagination-container .paginator-button-container.no-click{cursor:default!important}.dots-container{display:flex;padding:8px;align-items:center;gap:8px}.dots-container .dot{width:8px;height:8px;border-radius:99px;background-color:var(--on-bg-button-pressed-secondary);opacity:.3;cursor:pointer;transition:opacity .5s,background-color .5s,width .5s;transition-delay:.5s,.5s,0s}.dots-container .dot.pressed{opacity:1;background-color:var(--cta-primary);width:24px;transition-delay:0s}\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: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
8038
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityPaginationComponent, selector: "gravity-pagination", inputs: { currentLang: "currentLang", cypressTag: "cypressTag", totalItems: "totalItems", itemsPerPage: "itemsPerPage", currentPage: "currentPage", type: "type", showPageCount: "showPageCount", showArrowDots: "showArrowDots" }, outputs: { pageChanged: "pageChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"gravity-pagination-container\" [attr.data-cy]=\"cypressTag ? 'pagination_' + cypressTag : null\">\n <!-- First -->\n <div class=\"paginator-button-container\" (click)=\"changePage(1)\" [attr.data-cy]=\"'pagination_firstButton'\"\n *ngIf=\"type != 'dots' && currentPage != 1 && totalPages > 5 || type == 'page-count'\" [class.disabled]=\"currentPage === 1\">\n <gravity-icon [iconName]=\"'chevron-double-left'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'First' : 'Primero' }}</p>\n </div>\n\n <!-- Back -->\n <div class=\"paginator-button-container\" [class.disabled]=\"currentPage === 1\" [attr.data-cy]=\"'pagination_backButton'\"\n (click)=\"changePage(currentPage - 1)\" *ngIf=\"showArrowDots\">\n <gravity-icon [iconName]=\"'arrow-left'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'Back' : 'Atr\u00E1s' }}</p>\n </div>\n\n <!-- Numbers and Ellipsis -->\n <ng-container *ngIf=\"type == 'full' || type == 'compact'\">\n <ng-container *ngFor=\"let p of pages\">\n <div class=\"paginator-button-container\"\n [class.no-click]=\"p.toString() == '...'\"\n [class.pressed]=\"currentPage === p\"\n (click)=\"changePage(p)\" [attr.data-cy]=\"'pagination_page' +p+ 'Button'\">\n <p class=\"hr-body sm-regular\">{{ p }}</p>\n </div>\n </ng-container>\n </ng-container>\n\n <!-- Page count -->\n <div class=\"paginator-button-container no-click\" *ngIf=\"type === 'page-count' && showPageCount\">\n <p class=\"hr-body sm-regular\">{{ currentPage + (currentLang == 'en' ? ' of ' : ' de ') + totalPages }}</p>\n </div>\n\n <!-- Dots -->\n <div class=\"dots-container\" *ngIf=\"type === 'dots'\">\n <ng-container *ngFor=\"let p of pages\">\n <div class=\"dot\"\n [class.pressed]=\"currentPage === p\"\n (click)=\"changePage(p)\" [attr.data-cy]=\"'pagination_page' +p+ 'DotsButton'\"></div>\n </ng-container>\n </div>\n\n <!-- Next -->\n <div class=\"paginator-button-container\" [class.disabled]=\"currentPage === totalPages\"\n [attr.data-cy]=\"'pagination_nextButton'\"\n (click)=\"changePage(currentPage + 1)\" *ngIf=\"showArrowDots\">\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'Next' : 'Siguiente' }}</p>\n <gravity-icon [iconName]=\"'arrow-right'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n </div>\n\n <!-- Last -->\n <div class=\"paginator-button-container\" (click)=\"changePage(totalPages)\" [attr.data-cy]=\"'pagination_lastButton'\"\n *ngIf=\"type != 'dots' && currentPage !== totalPages && totalPages > 5 || type == 'page-count'\" [class.disabled]=\"currentPage === totalPages\">\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'Last' : '\u00DAltimo' }}</p>\n <gravity-icon [iconName]=\"'chevron-double-right'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n </div>\n</div>\n", styles: [":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}.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}.gravity-pagination-container{display:flex;align-items:center}.gravity-pagination-container .paginator-button-container{--paginator-button-text-color: var(--on-bg-button-pressed-tertiary);display:flex;height:32px;padding:10px 12px;justify-content:center;align-items:center;gap:var(--gravity-spacing-xxs);cursor:pointer;border-radius:.3125rem;background-color:var(--paginator-button-background-color)}.gravity-pagination-container .paginator-button-container p{color:var(--paginator-button-text-color)}.gravity-pagination-container .paginator-button-container:not(.disabled):not(.pressed):not(.no-click):hover,.gravity-pagination-container .paginator-button-container.hover{--paginator-button-background-color: var(--bg-button-active-tertiary);--paginator-button-text-color: var(--on-bg-button-pressed-tertiary)}.gravity-pagination-container .paginator-button-container:not(.disabled).pressed{--paginator-button-background-color: var(--bg-button-pressed-primary);--paginator-button-text-color: var(--on-bg-button-pressed-primary)}.gravity-pagination-container .paginator-button-container.disabled{--paginator-button-text-color: var(--on-bg-disabled);cursor:default!important}.gravity-pagination-container .paginator-button-container.no-click{cursor:default!important}.dots-container{display:flex;padding:8px;align-items:center;gap:8px}.dots-container .dot{width:8px;height:8px;border-radius:99px;background-color:var(--on-bg-button-pressed-secondary);opacity:.3;cursor:pointer;transition:opacity .5s,background-color .5s,width .5s;transition-delay:.5s,.5s,0s}.dots-container .dot.pressed{opacity:1;background-color:var(--cta-primary);width:24px;transition-delay:0s}\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: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
8039
8039
  }
8040
8040
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityPaginationComponent, decorators: [{
8041
8041
  type: Component,
8042
- args: [{ selector: 'gravity-pagination', template: "<div class=\"gravity-pagination-container\" [attr.data-cy]=\"cypressTag ? 'pagination_' + cypressTag : null\">\n <!-- First -->\n <div class=\"paginator-button-container\" (click)=\"changePage(1)\" [attr.data-cy]=\"'pagination_firstButton'\"\n *ngIf=\"type != 'dots' && currentPage != 1 && totalPages > 5 || type == 'page-count'\">\n <gravity-icon [iconName]=\"'chevron-double-left'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'First' : 'Primero' }}</p>\n </div>\n\n <!-- Back -->\n <div class=\"paginator-button-container\" [class.disabled]=\"currentPage === 1\" [attr.data-cy]=\"'pagination_backButton'\"\n (click)=\"changePage(currentPage - 1)\" *ngIf=\"showArrowDots\">\n <gravity-icon [iconName]=\"'arrow-left'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'Back' : 'Atr\u00E1s' }}</p>\n </div>\n\n <!-- Numbers and Ellipsis -->\n <ng-container *ngIf=\"type == 'full' || type == 'compact'\">\n <ng-container *ngFor=\"let p of pages\">\n <div class=\"paginator-button-container\"\n [class.no-click]=\"p.toString() == '...'\"\n [class.pressed]=\"currentPage === p\"\n (click)=\"changePage(p)\" [attr.data-cy]=\"'pagination_page' +p+ 'Button'\">\n <p class=\"hr-body sm-regular\">{{ p }}</p>\n </div>\n </ng-container>\n </ng-container>\n\n <!-- Page count -->\n <div class=\"paginator-button-container no-click\" *ngIf=\"type === 'page-count' && showPageCount\">\n <p class=\"hr-body sm-regular\">{{ currentPage + (currentLang == 'en' ? ' of ' : ' de ') + totalPages }}</p>\n </div>\n\n <!-- Dots -->\n <div class=\"dots-container\" *ngIf=\"type === 'dots'\">\n <ng-container *ngFor=\"let p of pages\">\n <div class=\"dot\"\n [class.pressed]=\"currentPage === p\"\n (click)=\"changePage(p)\" [attr.data-cy]=\"'pagination_page' +p+ 'DotsButton'\"></div>\n </ng-container>\n </div>\n\n <!-- Next -->\n <div class=\"paginator-button-container\" [class.disabled]=\"currentPage === totalPages\"\n [attr.data-cy]=\"'pagination_nextButton'\"\n (click)=\"changePage(currentPage + 1)\" *ngIf=\"showArrowDots\">\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'Next' : 'Siguiente' }}</p>\n <gravity-icon [iconName]=\"'arrow-right'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n </div>\n\n <!-- Last -->\n <div class=\"paginator-button-container\" (click)=\"changePage(totalPages)\" [attr.data-cy]=\"'pagination_lastButton'\"\n *ngIf=\"type != 'dots' && currentPage !== totalPages && totalPages > 5 || type == 'page-count'\">\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'Last' : '\u00DAltimo' }}</p>\n <gravity-icon [iconName]=\"'chevron-double-right'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n </div>\n</div>\n", styles: [":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}.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}.gravity-pagination-container{display:flex;align-items:center}.gravity-pagination-container .paginator-button-container{--paginator-button-text-color: var(--on-bg-button-pressed-tertiary);display:flex;height:32px;padding:10px 12px;justify-content:center;align-items:center;gap:var(--gravity-spacing-xxs);cursor:pointer;border-radius:.3125rem;background-color:var(--paginator-button-background-color)}.gravity-pagination-container .paginator-button-container p{color:var(--paginator-button-text-color)}.gravity-pagination-container .paginator-button-container:not(.disabled):not(.pressed):not(.no-click):hover,.gravity-pagination-container .paginator-button-container.hover{--paginator-button-background-color: var(--bg-button-active-tertiary);--paginator-button-text-color: var(--on-bg-button-pressed-tertiary)}.gravity-pagination-container .paginator-button-container:not(.disabled).pressed{--paginator-button-background-color: var(--bg-button-pressed-primary);--paginator-button-text-color: var(--on-bg-button-pressed-primary)}.gravity-pagination-container .paginator-button-container.disabled{--paginator-button-text-color: var(--on-bg-disabled);cursor:default!important}.gravity-pagination-container .paginator-button-container.no-click{cursor:default!important}.dots-container{display:flex;padding:8px;align-items:center;gap:8px}.dots-container .dot{width:8px;height:8px;border-radius:99px;background-color:var(--on-bg-button-pressed-secondary);opacity:.3;cursor:pointer;transition:opacity .5s,background-color .5s,width .5s;transition-delay:.5s,.5s,0s}.dots-container .dot.pressed{opacity:1;background-color:var(--cta-primary);width:24px;transition-delay:0s}\n"] }]
8042
+ args: [{ selector: 'gravity-pagination', template: "<div class=\"gravity-pagination-container\" [attr.data-cy]=\"cypressTag ? 'pagination_' + cypressTag : null\">\n <!-- First -->\n <div class=\"paginator-button-container\" (click)=\"changePage(1)\" [attr.data-cy]=\"'pagination_firstButton'\"\n *ngIf=\"type != 'dots' && currentPage != 1 && totalPages > 5 || type == 'page-count'\" [class.disabled]=\"currentPage === 1\">\n <gravity-icon [iconName]=\"'chevron-double-left'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'First' : 'Primero' }}</p>\n </div>\n\n <!-- Back -->\n <div class=\"paginator-button-container\" [class.disabled]=\"currentPage === 1\" [attr.data-cy]=\"'pagination_backButton'\"\n (click)=\"changePage(currentPage - 1)\" *ngIf=\"showArrowDots\">\n <gravity-icon [iconName]=\"'arrow-left'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'Back' : 'Atr\u00E1s' }}</p>\n </div>\n\n <!-- Numbers and Ellipsis -->\n <ng-container *ngIf=\"type == 'full' || type == 'compact'\">\n <ng-container *ngFor=\"let p of pages\">\n <div class=\"paginator-button-container\"\n [class.no-click]=\"p.toString() == '...'\"\n [class.pressed]=\"currentPage === p\"\n (click)=\"changePage(p)\" [attr.data-cy]=\"'pagination_page' +p+ 'Button'\">\n <p class=\"hr-body sm-regular\">{{ p }}</p>\n </div>\n </ng-container>\n </ng-container>\n\n <!-- Page count -->\n <div class=\"paginator-button-container no-click\" *ngIf=\"type === 'page-count' && showPageCount\">\n <p class=\"hr-body sm-regular\">{{ currentPage + (currentLang == 'en' ? ' of ' : ' de ') + totalPages }}</p>\n </div>\n\n <!-- Dots -->\n <div class=\"dots-container\" *ngIf=\"type === 'dots'\">\n <ng-container *ngFor=\"let p of pages\">\n <div class=\"dot\"\n [class.pressed]=\"currentPage === p\"\n (click)=\"changePage(p)\" [attr.data-cy]=\"'pagination_page' +p+ 'DotsButton'\"></div>\n </ng-container>\n </div>\n\n <!-- Next -->\n <div class=\"paginator-button-container\" [class.disabled]=\"currentPage === totalPages\"\n [attr.data-cy]=\"'pagination_nextButton'\"\n (click)=\"changePage(currentPage + 1)\" *ngIf=\"showArrowDots\">\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'Next' : 'Siguiente' }}</p>\n <gravity-icon [iconName]=\"'arrow-right'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n </div>\n\n <!-- Last -->\n <div class=\"paginator-button-container\" (click)=\"changePage(totalPages)\" [attr.data-cy]=\"'pagination_lastButton'\"\n *ngIf=\"type != 'dots' && currentPage !== totalPages && totalPages > 5 || type == 'page-count'\" [class.disabled]=\"currentPage === totalPages\">\n <p class=\"hr-body sm-regular\" *ngIf=\"type == 'full'\">{{ currentLang == 'en' ? 'Last' : '\u00DAltimo' }}</p>\n <gravity-icon [iconName]=\"'chevron-double-right'\" [iconSize]=\"'sm-12'\"\n [style.--icon-color]=\"'var(--paginator-button-text-color)'\"></gravity-icon>\n </div>\n</div>\n", styles: [":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}.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}.gravity-pagination-container{display:flex;align-items:center}.gravity-pagination-container .paginator-button-container{--paginator-button-text-color: var(--on-bg-button-pressed-tertiary);display:flex;height:32px;padding:10px 12px;justify-content:center;align-items:center;gap:var(--gravity-spacing-xxs);cursor:pointer;border-radius:.3125rem;background-color:var(--paginator-button-background-color)}.gravity-pagination-container .paginator-button-container p{color:var(--paginator-button-text-color)}.gravity-pagination-container .paginator-button-container:not(.disabled):not(.pressed):not(.no-click):hover,.gravity-pagination-container .paginator-button-container.hover{--paginator-button-background-color: var(--bg-button-active-tertiary);--paginator-button-text-color: var(--on-bg-button-pressed-tertiary)}.gravity-pagination-container .paginator-button-container:not(.disabled).pressed{--paginator-button-background-color: var(--bg-button-pressed-primary);--paginator-button-text-color: var(--on-bg-button-pressed-primary)}.gravity-pagination-container .paginator-button-container.disabled{--paginator-button-text-color: var(--on-bg-disabled);cursor:default!important}.gravity-pagination-container .paginator-button-container.no-click{cursor:default!important}.dots-container{display:flex;padding:8px;align-items:center;gap:8px}.dots-container .dot{width:8px;height:8px;border-radius:99px;background-color:var(--on-bg-button-pressed-secondary);opacity:.3;cursor:pointer;transition:opacity .5s,background-color .5s,width .5s;transition-delay:.5s,.5s,0s}.dots-container .dot.pressed{opacity:1;background-color:var(--cta-primary);width:24px;transition-delay:0s}\n"] }]
8043
8043
  }], propDecorators: { currentLang: [{
8044
8044
  type: Input
8045
8045
  }], cypressTag: [{
@@ -8104,17 +8104,19 @@ class GravityCurrencyDropdownShortComponent {
8104
8104
  }
8105
8105
  }
8106
8106
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityCurrencyDropdownShortComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8107
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityCurrencyDropdownShortComponent, selector: "gravity-currency-dropdown-short", inputs: { size: "size", readonly: "readonly", disabled: "disabled", showFlag: "showFlag", config: "config" }, outputs: { onClick: "onClick" }, host: { listeners: { "document:mousedown": "onDocumentMouseDown($event)" } }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["currencyDropdownShortTrigger"], descendants: true, static: true }, { propertyName: "panelRef", first: true, predicate: ["currencyDropdownShortPanel"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"currency-dropdown-short\" [ngClass]=\"size\" [class.readonly]=\"readonly || !config.items\" [class.disabled]=\"disabled\" #currencyDropdownShortTrigger>\n\n <!--Header-->\n <div class=\"header-item\" (click)=\"onTriggerClick($event)\" *ngIf=\"selectedItem\">\n <gravity-currency *ngIf=\"showFlag\" [size]=\"'xs-12'\" [currency]=\"{currency_id: selectedItem.currency_id}\"\n [disabled]=\"disabled\"></gravity-currency>\n <span class=\"hr-body sm-regular\">{{selectedItem.currency_iso}}</span>\n <gravity-icon *ngIf=\"!readonly && config.items\" [iconSize]=\"'sm-12'\" [iconName]=\"dropdownOpen ?'arrow-up' : 'arrow-down'\"/>\n\n </div>\n\n <!--Panel-->\n <div class=\"currency-short-dropdown-panel\" [ngClass]=\"size\" *ngIf=\"dropdownOpen && config.items\" #currencyDropdownShortPanel>\n <div *ngFor=\"let item of config.items\" class=\"panel-item\" (click)=\"onItemSelect(item, $event)\">\n <gravity-currency *ngIf=\"showFlag\" [size]=\"'xs-12'\" [currency]=\"{currency_id: item.currency_id}\"\n [disabled]=\"disabled\"></gravity-currency>\n <span class=\"hr-body sm-regular\">{{item.currency_iso}}</span>\n </div>\n </div>\n</div>\n", styles: [":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}.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}.scrollbar-sm::-webkit-scrollbar,.currency-short-dropdown-panel::-webkit-scrollbar{width:4px;height:4px}.scrollbar-sm::-webkit-scrollbar-track,.currency-short-dropdown-panel::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb,.currency-short-dropdown-panel::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb:hover,.currency-short-dropdown-panel::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}.scrollbar-md::-webkit-scrollbar{width:8px;height:8px}.scrollbar-md::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}.currency-dropdown-short{position:relative;width:-moz-fit-content;width:fit-content}.currency-dropdown-short .header-item{border-radius:1px;border:1px solid transparent;display:flex;width:-moz-fit-content;width:fit-content;gap:2px;align-items:center;padding:var(--currency-short-padding)}.currency-dropdown-short:not(.readonly):not(.disabled) .header-item{cursor:pointer;background-color:var(--surface-primary)}.currency-dropdown-short:not(.readonly):not(.disabled) .header-item:hover{border-color:var(--surface-primary);background-color:transparent}.currency-dropdown-short:not(.readonly):not(.disabled) .header-item:active{border-color:var(--text-primary);background-color:transparent}.currency-dropdown-short.readonly .header-item,.currency-dropdown-short.disabled .header-item{cursor:default;background-color:transparent}.currency-dropdown-short.disabled .header-item span{color:var(--on-bg-disabled)}.currency-dropdown-short.disabled .header-item gravity-icon{--icon-color: var(--on-bg-disabled)}.currency-short-dropdown-panel{width:-moz-fit-content;width:fit-content;position:absolute;border:1px solid var(--surface-primary);background-color:var(--surface-secondary);border-radius:.3125rem;z-index:1;top:100%;left:50%;transform:translate(-50%) translate(0);margin-top:4px;max-height:200px;overflow:auto}.currency-short-dropdown-panel .panel-item{display:flex;gap:2px;padding:var(--currency-short-panel-adding);align-items:center}.currency-short-dropdown-panel .panel-item:hover{background-color:var(--surface-primary);cursor:pointer}.currency-short-dropdown-panel .panel-item:active{background-color:var(--bg-menu-button-pressed-primary)}.currency-short-dropdown-panel .panel-item:not(:last-child){border-bottom:1px solid var(--surface-primary)}.sm{--currency-short-padding: .25rem;--currency-short-panel-adding: .5rem}.md{--currency-short-padding: .5rem 1rem;--currency-short-panel-adding: .5rem 1rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "component", type: GravityCurrencyComponent, selector: "gravity-currency", inputs: ["cypressTag", "disabled", "size", "currency", "showLayers"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
8107
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityCurrencyDropdownShortComponent, selector: "gravity-currency-dropdown-short", inputs: { cypressTag: "cypressTag", size: "size", readonly: "readonly", disabled: "disabled", showFlag: "showFlag", config: "config" }, outputs: { onClick: "onClick" }, host: { listeners: { "document:mousedown": "onDocumentMouseDown($event)" } }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["currencyDropdownShortTrigger"], descendants: true, static: true }, { propertyName: "panelRef", first: true, predicate: ["currencyDropdownShortPanel"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"currency-dropdown-short\" [ngClass]=\"size\" [class.readonly]=\"readonly || !config.items\"\n [class.disabled]=\"disabled\" #currencyDropdownShortTrigger>\n\n <!--Header-->\n <div class=\"header-item\" (click)=\"onTriggerClick($event)\" *ngIf=\"selectedItem\"\n [attr.data-cy]=\"cypressTag ? 'currencyDropdownShort_'+cypressTag : null\">\n <gravity-currency *ngIf=\"showFlag\" [size]=\"'xs-12'\" [currency]=\"{currency_id: selectedItem.currency_id}\"\n [disabled]=\"disabled\"/>\n <span class=\"hr-body sm-regular\">{{ selectedItem.currency_iso }}</span>\n <gravity-icon *ngIf=\"!readonly && config.items\" [iconSize]=\"'sm-12'\"\n [iconName]=\"dropdownOpen ?'arrow-up' : 'arrow-down'\"/>\n\n </div>\n\n <!--Panel-->\n <div class=\"currency-short-dropdown-panel\" [ngClass]=\"size\" *ngIf=\"dropdownOpen && config.items\"\n #currencyDropdownShortPanel>\n <div *ngFor=\"let item of config.items\" class=\"panel-item\"\n [attr.data-cy]=\"'currencyDropdownShort_item'+item.currency_iso\" (click)=\"onItemSelect(item, $event)\">\n <gravity-currency *ngIf=\"showFlag\" [size]=\"'xs-12'\" [currency]=\"{currency_id: item.currency_id}\"\n [disabled]=\"disabled\"/>\n <span class=\"hr-body sm-regular\">{{ item.currency_iso }}</span>\n </div>\n </div>\n</div>\n", styles: [":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}.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}.scrollbar-sm::-webkit-scrollbar,.currency-short-dropdown-panel::-webkit-scrollbar{width:4px;height:4px}.scrollbar-sm::-webkit-scrollbar-track,.currency-short-dropdown-panel::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb,.currency-short-dropdown-panel::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb:hover,.currency-short-dropdown-panel::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}.scrollbar-md::-webkit-scrollbar{width:8px;height:8px}.scrollbar-md::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}.currency-dropdown-short{position:relative;width:-moz-fit-content;width:fit-content}.currency-dropdown-short .header-item{border-radius:1px;border:1px solid transparent;display:flex;width:-moz-fit-content;width:fit-content;gap:2px;align-items:center;padding:var(--currency-short-padding)}.currency-dropdown-short:not(.readonly):not(.disabled) .header-item{cursor:pointer;background-color:var(--surface-primary)}.currency-dropdown-short:not(.readonly):not(.disabled) .header-item:hover{border-color:var(--surface-primary);background-color:transparent}.currency-dropdown-short:not(.readonly):not(.disabled) .header-item:active{border-color:var(--text-primary);background-color:transparent}.currency-dropdown-short.readonly .header-item,.currency-dropdown-short.disabled .header-item{cursor:default;background-color:transparent}.currency-dropdown-short.disabled .header-item span{color:var(--on-bg-disabled)}.currency-dropdown-short.disabled .header-item gravity-icon{--icon-color: var(--on-bg-disabled)}.currency-short-dropdown-panel{width:-moz-fit-content;width:fit-content;position:absolute;border:1px solid var(--surface-primary);background-color:var(--surface-secondary);border-radius:.3125rem;z-index:1;top:100%;left:50%;transform:translate(-50%) translate(0);margin-top:4px;max-height:200px;overflow:auto}.currency-short-dropdown-panel .panel-item{display:flex;gap:2px;padding:var(--currency-short-panel-adding);align-items:center}.currency-short-dropdown-panel .panel-item:hover{background-color:var(--surface-primary);cursor:pointer}.currency-short-dropdown-panel .panel-item:active{background-color:var(--bg-menu-button-pressed-primary)}.currency-short-dropdown-panel .panel-item:not(:last-child){border-bottom:1px solid var(--surface-primary)}.sm{--currency-short-padding: .25rem;--currency-short-panel-adding: .5rem}.md{--currency-short-padding: .5rem 1rem;--currency-short-panel-adding: .5rem 1rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "component", type: GravityCurrencyComponent, selector: "gravity-currency", inputs: ["cypressTag", "disabled", "size", "currency", "showLayers"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }] }); }
8108
8108
  }
8109
8109
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityCurrencyDropdownShortComponent, decorators: [{
8110
8110
  type: Component,
8111
- args: [{ selector: 'gravity-currency-dropdown-short', template: "<div class=\"currency-dropdown-short\" [ngClass]=\"size\" [class.readonly]=\"readonly || !config.items\" [class.disabled]=\"disabled\" #currencyDropdownShortTrigger>\n\n <!--Header-->\n <div class=\"header-item\" (click)=\"onTriggerClick($event)\" *ngIf=\"selectedItem\">\n <gravity-currency *ngIf=\"showFlag\" [size]=\"'xs-12'\" [currency]=\"{currency_id: selectedItem.currency_id}\"\n [disabled]=\"disabled\"></gravity-currency>\n <span class=\"hr-body sm-regular\">{{selectedItem.currency_iso}}</span>\n <gravity-icon *ngIf=\"!readonly && config.items\" [iconSize]=\"'sm-12'\" [iconName]=\"dropdownOpen ?'arrow-up' : 'arrow-down'\"/>\n\n </div>\n\n <!--Panel-->\n <div class=\"currency-short-dropdown-panel\" [ngClass]=\"size\" *ngIf=\"dropdownOpen && config.items\" #currencyDropdownShortPanel>\n <div *ngFor=\"let item of config.items\" class=\"panel-item\" (click)=\"onItemSelect(item, $event)\">\n <gravity-currency *ngIf=\"showFlag\" [size]=\"'xs-12'\" [currency]=\"{currency_id: item.currency_id}\"\n [disabled]=\"disabled\"></gravity-currency>\n <span class=\"hr-body sm-regular\">{{item.currency_iso}}</span>\n </div>\n </div>\n</div>\n", styles: [":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}.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}.scrollbar-sm::-webkit-scrollbar,.currency-short-dropdown-panel::-webkit-scrollbar{width:4px;height:4px}.scrollbar-sm::-webkit-scrollbar-track,.currency-short-dropdown-panel::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb,.currency-short-dropdown-panel::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb:hover,.currency-short-dropdown-panel::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}.scrollbar-md::-webkit-scrollbar{width:8px;height:8px}.scrollbar-md::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}.currency-dropdown-short{position:relative;width:-moz-fit-content;width:fit-content}.currency-dropdown-short .header-item{border-radius:1px;border:1px solid transparent;display:flex;width:-moz-fit-content;width:fit-content;gap:2px;align-items:center;padding:var(--currency-short-padding)}.currency-dropdown-short:not(.readonly):not(.disabled) .header-item{cursor:pointer;background-color:var(--surface-primary)}.currency-dropdown-short:not(.readonly):not(.disabled) .header-item:hover{border-color:var(--surface-primary);background-color:transparent}.currency-dropdown-short:not(.readonly):not(.disabled) .header-item:active{border-color:var(--text-primary);background-color:transparent}.currency-dropdown-short.readonly .header-item,.currency-dropdown-short.disabled .header-item{cursor:default;background-color:transparent}.currency-dropdown-short.disabled .header-item span{color:var(--on-bg-disabled)}.currency-dropdown-short.disabled .header-item gravity-icon{--icon-color: var(--on-bg-disabled)}.currency-short-dropdown-panel{width:-moz-fit-content;width:fit-content;position:absolute;border:1px solid var(--surface-primary);background-color:var(--surface-secondary);border-radius:.3125rem;z-index:1;top:100%;left:50%;transform:translate(-50%) translate(0);margin-top:4px;max-height:200px;overflow:auto}.currency-short-dropdown-panel .panel-item{display:flex;gap:2px;padding:var(--currency-short-panel-adding);align-items:center}.currency-short-dropdown-panel .panel-item:hover{background-color:var(--surface-primary);cursor:pointer}.currency-short-dropdown-panel .panel-item:active{background-color:var(--bg-menu-button-pressed-primary)}.currency-short-dropdown-panel .panel-item:not(:last-child){border-bottom:1px solid var(--surface-primary)}.sm{--currency-short-padding: .25rem;--currency-short-panel-adding: .5rem}.md{--currency-short-padding: .5rem 1rem;--currency-short-panel-adding: .5rem 1rem}\n"] }]
8111
+ args: [{ selector: 'gravity-currency-dropdown-short', template: "<div class=\"currency-dropdown-short\" [ngClass]=\"size\" [class.readonly]=\"readonly || !config.items\"\n [class.disabled]=\"disabled\" #currencyDropdownShortTrigger>\n\n <!--Header-->\n <div class=\"header-item\" (click)=\"onTriggerClick($event)\" *ngIf=\"selectedItem\"\n [attr.data-cy]=\"cypressTag ? 'currencyDropdownShort_'+cypressTag : null\">\n <gravity-currency *ngIf=\"showFlag\" [size]=\"'xs-12'\" [currency]=\"{currency_id: selectedItem.currency_id}\"\n [disabled]=\"disabled\"/>\n <span class=\"hr-body sm-regular\">{{ selectedItem.currency_iso }}</span>\n <gravity-icon *ngIf=\"!readonly && config.items\" [iconSize]=\"'sm-12'\"\n [iconName]=\"dropdownOpen ?'arrow-up' : 'arrow-down'\"/>\n\n </div>\n\n <!--Panel-->\n <div class=\"currency-short-dropdown-panel\" [ngClass]=\"size\" *ngIf=\"dropdownOpen && config.items\"\n #currencyDropdownShortPanel>\n <div *ngFor=\"let item of config.items\" class=\"panel-item\"\n [attr.data-cy]=\"'currencyDropdownShort_item'+item.currency_iso\" (click)=\"onItemSelect(item, $event)\">\n <gravity-currency *ngIf=\"showFlag\" [size]=\"'xs-12'\" [currency]=\"{currency_id: item.currency_id}\"\n [disabled]=\"disabled\"/>\n <span class=\"hr-body sm-regular\">{{ item.currency_iso }}</span>\n </div>\n </div>\n</div>\n", styles: [":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}.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}.scrollbar-sm::-webkit-scrollbar,.currency-short-dropdown-panel::-webkit-scrollbar{width:4px;height:4px}.scrollbar-sm::-webkit-scrollbar-track,.currency-short-dropdown-panel::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb,.currency-short-dropdown-panel::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-sm::-webkit-scrollbar-thumb:hover,.currency-short-dropdown-panel::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}.scrollbar-md::-webkit-scrollbar{width:8px;height:8px}.scrollbar-md::-webkit-scrollbar-track{background-color:var(--surface-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb{background-color:var(--placeholder-empty-enabled-primary);border-radius:5px}.scrollbar-md::-webkit-scrollbar-thumb:hover{background-color:var(--line-empty-enabled-primary)}.currency-dropdown-short{position:relative;width:-moz-fit-content;width:fit-content}.currency-dropdown-short .header-item{border-radius:1px;border:1px solid transparent;display:flex;width:-moz-fit-content;width:fit-content;gap:2px;align-items:center;padding:var(--currency-short-padding)}.currency-dropdown-short:not(.readonly):not(.disabled) .header-item{cursor:pointer;background-color:var(--surface-primary)}.currency-dropdown-short:not(.readonly):not(.disabled) .header-item:hover{border-color:var(--surface-primary);background-color:transparent}.currency-dropdown-short:not(.readonly):not(.disabled) .header-item:active{border-color:var(--text-primary);background-color:transparent}.currency-dropdown-short.readonly .header-item,.currency-dropdown-short.disabled .header-item{cursor:default;background-color:transparent}.currency-dropdown-short.disabled .header-item span{color:var(--on-bg-disabled)}.currency-dropdown-short.disabled .header-item gravity-icon{--icon-color: var(--on-bg-disabled)}.currency-short-dropdown-panel{width:-moz-fit-content;width:fit-content;position:absolute;border:1px solid var(--surface-primary);background-color:var(--surface-secondary);border-radius:.3125rem;z-index:1;top:100%;left:50%;transform:translate(-50%) translate(0);margin-top:4px;max-height:200px;overflow:auto}.currency-short-dropdown-panel .panel-item{display:flex;gap:2px;padding:var(--currency-short-panel-adding);align-items:center}.currency-short-dropdown-panel .panel-item:hover{background-color:var(--surface-primary);cursor:pointer}.currency-short-dropdown-panel .panel-item:active{background-color:var(--bg-menu-button-pressed-primary)}.currency-short-dropdown-panel .panel-item:not(:last-child){border-bottom:1px solid var(--surface-primary)}.sm{--currency-short-padding: .25rem;--currency-short-panel-adding: .5rem}.md{--currency-short-padding: .5rem 1rem;--currency-short-panel-adding: .5rem 1rem}\n"] }]
8112
8112
  }], propDecorators: { triggerRef: [{
8113
8113
  type: ViewChild,
8114
8114
  args: ['currencyDropdownShortTrigger', { static: true }]
8115
8115
  }], panelRef: [{
8116
8116
  type: ViewChild,
8117
8117
  args: ['currencyDropdownShortPanel', { static: true }]
8118
+ }], cypressTag: [{
8119
+ type: Input
8118
8120
  }], size: [{
8119
8121
  type: Input
8120
8122
  }], readonly: [{
@@ -8134,11 +8136,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
8134
8136
 
8135
8137
  class GravityTextFieldAmountOnlyComponent {
8136
8138
  constructor() {
8137
- // Configuration
8138
8139
  this.priority = 'crypto';
8139
8140
  this.fiatCurrenciesSize = 'sm';
8140
8141
  this.rateDirection = 'CRYPTO_TO_FIAT';
8141
8142
  this.state = null;
8143
+ this.width = 'standard';
8142
8144
  // UI State inputs
8143
8145
  this.disabled = false;
8144
8146
  this.readonly = false;
@@ -8240,13 +8242,23 @@ class GravityTextFieldAmountOnlyComponent {
8240
8242
  this.inputValue = '' + value;
8241
8243
  this.calculateValues();
8242
8244
  }
8245
+ //Clean component
8246
+ reset(priority = 'crypto') {
8247
+ this.priority = priority;
8248
+ this.inputValue = '';
8249
+ this.valueFiat = '';
8250
+ this.valueCrypto = '';
8251
+ this.state = null;
8252
+ }
8243
8253
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityTextFieldAmountOnlyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8244
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityTextFieldAmountOnlyComponent, selector: "gravity-text-field-amount-only", inputs: { priority: "priority", placeholder: "placeholder", fiatCurrencies: "fiatCurrencies", fiatCurrenciesSize: "fiatCurrenciesSize", cryptoCurrency: "cryptoCurrency", rate: "rate", rateDirection: "rateDirection", state: "state", disabled: "disabled", readonly: "readonly" }, outputs: { swapCurrenciesFlag: "swapCurrenciesFlag", changeFiat: "changeFiat", amountValues: "amountValues" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"amount-only-text-field {{state ? state : null}}\" [class.disabled]=\"disabled\">\n\n <!--Switch-->\n <gravity-icon-button (clickOnIcon)=\"swapCurrencies()\" [icon]=\"'swaps'\" *ngIf=\"!readonly\"\n [cypressTag]=\"'swapCurrencies'\" [size]=\"'sm'\"\n [supportText]=\"disabled ? null : priority == 'crypto' ? 'Enter the amount in fiat' : 'Enter the amount in crypto'\"\n [type]=\"'primary'\" [state]=\"disabled ? 'disabled' : 'active'\"/>\n\n <div class=\"amounts\" [class.filled]=\"inputValue\" [class.readonly]=\"readonly\">\n\n <!--Enter amount row-->\n <div class=\"enter-amount amount-row\">\n <label class=\"floating-label hr-label sm-regular\">\n {{ placeholder }}\n </label>\n\n <input class=\"hr-label md-regular\" [disabled]=\"disabled\" [readonly]=\"readonly\" (input)=\"calculateValues()\"\n [attr.data-cy]=\"'textFieldAmount_input'\" [(ngModel)]=\"inputValue\" placeholder=\"{{placeholder}}\"\n type=\"number\">\n\n <ng-container *ngIf=\"priority == 'fiat'\">\n <gravity-currency-dropdown-short [size]=\"fiatCurrenciesSize\" [disabled]=\"disabled\" (onClick)=\"updateFiatCurrency($event)\"\n [config]=\"fiatCurrencies\"/>\n </ng-container>\n <ng-container *ngIf=\"priority == 'crypto'\">\n <p class=\"hr-body sm-regular\" [class.gravity-padding-inline-xxs]=\"fiatCurrenciesSize == 'sm'\" [class.gravity-padding-inline-sm]=\"fiatCurrenciesSize == 'md'\">{{cryptoCurrency.currency_iso}}</p>\n </ng-container>\n </div>\n\n <hr>\n\n <!--Equivalence row-->\n <div class=\"equivalence amount-row\">\n <p class=\"hr-body sm-regular\">\n \u2248 {{ priority == 'crypto' ? valueFiat : valueCrypto}}\n </p>\n\n <ng-container *ngIf=\"priority == 'crypto'\">\n <gravity-currency-dropdown-short [size]=\"fiatCurrenciesSize\" [readonly]=\"true\" [disabled]=\"disabled\"\n [config]=\"fiatCurrencies\"/>\n </ng-container>\n <ng-container *ngIf=\"priority == 'fiat'\">\n <p class=\"hr-body sm-regular\" [class.gravity-padding-inline-xxs]=\"fiatCurrenciesSize == 'sm'\" [class.gravity-padding-inline-sm]=\"fiatCurrenciesSize == 'md'\">{{cryptoCurrency.currency_iso}}</p>\n </ng-container>\n </div>\n </div>\n</div>", 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}.amount-only-text-field{align-items:center;display:flex;gap:8px;width:-moz-fit-content;width:fit-content}.amount-only-text-field.disabled .amounts{pointer-events:none}.amount-only-text-field.disabled .amounts .enter-amount input:disabled{color:var(--on-bg-disabled);cursor:not-allowed;background-color:transparent}.amount-only-text-field.disabled .amounts .enter-amount input:disabled::placeholder{color:var(--on-bg-disabled)}.amount-only-text-field.disabled .amounts .enter-amount .floating-label{color:var(--on-bg-disabled)}.amount-only-text-field.disabled .amounts hr{border-top-color:var(--on-bg-disabled)}.amount-only-text-field.disabled .amounts .enter-amount p,.amount-only-text-field.disabled .amounts .equivalence p{color:var(--on-bg-disabled)}.amount-only-text-field.positive .amounts hr{border-color:var(--positive-primary)}.amount-only-text-field.negative .amounts hr{border-color:var(--negative-primary)}.amount-row{height:30px;align-items:center;display:flex;justify-content:space-between}.amounts{padding:6px;width:310px}.amounts:hover .enter-amount input{color:var(--text-primary)}.amounts:hover .enter-amount input::placeholder{color:var(--text-primary)}.amounts:not(.readonly):focus-within .enter-amount .floating-label{opacity:1;transform:translateY(-12px)}.amounts:not(.readonly):focus-within .enter-amount input::placeholder{opacity:0}.amounts:not(.readonly):focus-within hr{border-color:var(--line-full-enabled-typing-primary)}.amounts .enter-amount{margin-top:12px;position:relative}.amounts .enter-amount .floating-label{position:absolute;top:0;left:0;opacity:0;transform:translateY(10px);pointer-events:none;color:var(--text-primary);transition:all .15s ease}.amounts .enter-amount input{width:100%;border:none;outline:none;color:var(--placeholder-empty-enabled-primary)}.amounts .enter-amount input::placeholder{color:var(--placeholder-empty-enabled-primary)}.amounts .enter-amount input[type=number]{-moz-appearance:textfield}.amounts .enter-amount input[type=number]::-webkit-outer-spin-button,.amounts .enter-amount input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.amounts hr{border:none;border-top:1px solid var(--line-empty-enabled-primary);margin:4px 0;opacity:1;transition:border-color .15s ease}.amounts.filled .enter-amount .floating-label{opacity:1;transform:translateY(-12px)}.amounts.filled .enter-amount input{color:var(--text-primary)}.amounts.filled .enter-amount input::placeholder{opacity:0}.amounts.filled hr{border-color:var(--line-full-enabled-typing-primary)}.amounts.readonly{cursor:default}.amounts.readonly .enter-amount input{color:var(--text-primary);cursor:default}.amounts.readonly .enter-amount input::placeholder{color:var(--text-primary)}.amounts.readonly .enter-amount .floating-label{color:var(--text-secondary)}.amounts.readonly hr{border-top-color:var(--line-empty-enabled-readonly)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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: i2$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: GravityCurrencyDropdownShortComponent, selector: "gravity-currency-dropdown-short", inputs: ["size", "readonly", "disabled", "showFlag", "config"], outputs: ["onClick"] }, { kind: "component", type: GravityIconButtonComponent, selector: "gravity-icon-button", inputs: ["cypressTag", "icon", "supportText", "variant", "size", "type", "state", "badge"], outputs: ["clickOnIcon"] }] }); }
8254
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityTextFieldAmountOnlyComponent, selector: "gravity-text-field-amount-only", inputs: { cypressTag: "cypressTag", priority: "priority", placeholder: "placeholder", fiatCurrencies: "fiatCurrencies", fiatCurrenciesSize: "fiatCurrenciesSize", cryptoCurrency: "cryptoCurrency", rate: "rate", rateDirection: "rateDirection", state: "state", width: "width", disabled: "disabled", readonly: "readonly" }, outputs: { swapCurrenciesFlag: "swapCurrenciesFlag", changeFiat: "changeFiat", amountValues: "amountValues" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"amount-only-text-field {{state ? state : null}}\" [class.disabled]=\"disabled\"\n [attr.data-cy]=\"cypressTag ? 'textFieldAmount_'+cypressTag : null\" [class.standard-width]=\"width === 'standard'\"\n [class.full-width]=\"width === 'full'\">\n\n <!--Switch-->\n <gravity-icon-button (clickOnIcon)=\"swapCurrencies()\" [icon]=\"'swaps'\" *ngIf=\"!readonly\"\n [cypressTag]=\"'swapCurrencies'\" [size]=\"'sm'\"\n [supportText]=\"disabled ? null : priority == 'crypto' ? 'Enter the amount in fiat' : 'Enter the amount in crypto'\"\n [type]=\"'primary'\" [state]=\"disabled ? 'disabled' : 'active'\"/>\n\n <div class=\"amounts\" [class.filled]=\"inputValue\" [class.readonly]=\"readonly\">\n\n <!--Enter amount row-->\n <div class=\"enter-amount amount-row\">\n <label class=\"floating-label hr-label sm-regular\">\n {{ placeholder }}\n </label>\n\n <input class=\"hr-label md-regular\" [disabled]=\"disabled\" [readonly]=\"readonly\" (input)=\"calculateValues()\"\n [attr.data-cy]=\"'textFieldAmount_input'\" [(ngModel)]=\"inputValue\" placeholder=\"{{placeholder}}\"\n type=\"number\">\n\n <ng-container *ngIf=\"priority == 'fiat'\">\n <gravity-currency-dropdown-short [size]=\"fiatCurrenciesSize\" [disabled]=\"disabled\"\n (onClick)=\"updateFiatCurrency($event)\" [cypressTag]=\"'amountFiat'\"\n [config]=\"fiatCurrencies\"/>\n </ng-container>\n <ng-container *ngIf=\"priority == 'crypto'\">\n <p class=\"hr-body sm-regular\" [class.gravity-padding-inline-xxs]=\"fiatCurrenciesSize == 'sm'\"\n [class.gravity-padding-inline-sm]=\"fiatCurrenciesSize == 'md'\">{{ cryptoCurrency.currency_iso }}</p>\n </ng-container>\n </div>\n\n <hr>\n\n <!--Equivalence row-->\n <div class=\"equivalence amount-row\">\n <p class=\"hr-body sm-regular\">\n \u2248 {{ priority == 'crypto' ? valueFiat : valueCrypto }}\n </p>\n\n <ng-container *ngIf=\"priority == 'crypto'\">\n <gravity-currency-dropdown-short [size]=\"fiatCurrenciesSize\" [readonly]=\"true\" [disabled]=\"disabled\"\n [config]=\"fiatCurrencies\"/>\n </ng-container>\n <ng-container *ngIf=\"priority == 'fiat'\">\n <p class=\"hr-body sm-regular\" [class.gravity-padding-inline-xxs]=\"fiatCurrenciesSize == 'sm'\"\n [class.gravity-padding-inline-sm]=\"fiatCurrenciesSize == 'md'\">{{ cryptoCurrency.currency_iso }}</p>\n </ng-container>\n </div>\n </div>\n</div>", 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}.amount-only-text-field{align-items:center;display:flex;gap:8px;width:-moz-fit-content;width:fit-content}.amount-only-text-field.standard-width .amounts{width:310px}.amount-only-text-field.full-width,.amount-only-text-field.full-width .amounts{width:100%}.amount-only-text-field.disabled .amounts{pointer-events:none}.amount-only-text-field.disabled .amounts .enter-amount input:disabled{color:var(--on-bg-disabled);cursor:not-allowed;background-color:transparent}.amount-only-text-field.disabled .amounts .enter-amount input:disabled::placeholder{color:var(--on-bg-disabled)}.amount-only-text-field.disabled .amounts .enter-amount .floating-label{color:var(--on-bg-disabled)}.amount-only-text-field.disabled .amounts hr{border-top-color:var(--on-bg-disabled)}.amount-only-text-field.disabled .amounts .enter-amount p,.amount-only-text-field.disabled .amounts .equivalence p{color:var(--on-bg-disabled)}.amount-only-text-field.positive .amounts hr{border-color:var(--positive-primary)}.amount-only-text-field.negative .amounts hr{border-color:var(--negative-primary)}.amount-row{height:30px;align-items:center;display:flex;justify-content:space-between}.amounts{padding:6px;width:100%}.amounts:hover .enter-amount input{color:var(--text-primary)}.amounts:hover .enter-amount input::placeholder{color:var(--text-primary)}.amounts:not(.readonly):focus-within .enter-amount .floating-label{opacity:1;transform:translateY(-12px)}.amounts:not(.readonly):focus-within .enter-amount input::placeholder{opacity:0}.amounts:not(.readonly):focus-within hr{border-color:var(--line-full-enabled-typing-primary)}.amounts .enter-amount{margin-top:12px;position:relative}.amounts .enter-amount .floating-label{position:absolute;top:0;left:0;opacity:0;transform:translateY(10px);pointer-events:none;color:var(--text-primary);transition:all .15s ease}.amounts .enter-amount input{width:100%;border:none;outline:none;color:var(--placeholder-empty-enabled-primary)}.amounts .enter-amount input::placeholder{color:var(--placeholder-empty-enabled-primary)}.amounts .enter-amount input[type=number]{-moz-appearance:textfield}.amounts .enter-amount input[type=number]::-webkit-outer-spin-button,.amounts .enter-amount input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.amounts hr{border:none;border-top:1px solid var(--line-empty-enabled-primary);margin:4px 0;opacity:1;transition:border-color .15s ease}.amounts.filled .enter-amount .floating-label{opacity:1;transform:translateY(-12px)}.amounts.filled .enter-amount input{color:var(--text-primary)}.amounts.filled .enter-amount input::placeholder{opacity:0}.amounts.filled hr{border-color:var(--line-full-enabled-typing-primary)}.amounts.readonly{cursor:default}.amounts.readonly .enter-amount input{color:var(--text-primary);cursor:default}.amounts.readonly .enter-amount input::placeholder{color:var(--text-primary)}.amounts.readonly .enter-amount .floating-label{color:var(--text-secondary)}.amounts.readonly hr{border-top-color:var(--line-empty-enabled-readonly)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.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: i2$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: GravityCurrencyDropdownShortComponent, selector: "gravity-currency-dropdown-short", inputs: ["cypressTag", "size", "readonly", "disabled", "showFlag", "config"], outputs: ["onClick"] }, { kind: "component", type: GravityIconButtonComponent, selector: "gravity-icon-button", inputs: ["cypressTag", "icon", "supportText", "variant", "size", "type", "state", "badge"], outputs: ["clickOnIcon"] }] }); }
8245
8255
  }
8246
8256
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityTextFieldAmountOnlyComponent, decorators: [{
8247
8257
  type: Component,
8248
- args: [{ selector: 'gravity-text-field-amount-only', template: "<div class=\"amount-only-text-field {{state ? state : null}}\" [class.disabled]=\"disabled\">\n\n <!--Switch-->\n <gravity-icon-button (clickOnIcon)=\"swapCurrencies()\" [icon]=\"'swaps'\" *ngIf=\"!readonly\"\n [cypressTag]=\"'swapCurrencies'\" [size]=\"'sm'\"\n [supportText]=\"disabled ? null : priority == 'crypto' ? 'Enter the amount in fiat' : 'Enter the amount in crypto'\"\n [type]=\"'primary'\" [state]=\"disabled ? 'disabled' : 'active'\"/>\n\n <div class=\"amounts\" [class.filled]=\"inputValue\" [class.readonly]=\"readonly\">\n\n <!--Enter amount row-->\n <div class=\"enter-amount amount-row\">\n <label class=\"floating-label hr-label sm-regular\">\n {{ placeholder }}\n </label>\n\n <input class=\"hr-label md-regular\" [disabled]=\"disabled\" [readonly]=\"readonly\" (input)=\"calculateValues()\"\n [attr.data-cy]=\"'textFieldAmount_input'\" [(ngModel)]=\"inputValue\" placeholder=\"{{placeholder}}\"\n type=\"number\">\n\n <ng-container *ngIf=\"priority == 'fiat'\">\n <gravity-currency-dropdown-short [size]=\"fiatCurrenciesSize\" [disabled]=\"disabled\" (onClick)=\"updateFiatCurrency($event)\"\n [config]=\"fiatCurrencies\"/>\n </ng-container>\n <ng-container *ngIf=\"priority == 'crypto'\">\n <p class=\"hr-body sm-regular\" [class.gravity-padding-inline-xxs]=\"fiatCurrenciesSize == 'sm'\" [class.gravity-padding-inline-sm]=\"fiatCurrenciesSize == 'md'\">{{cryptoCurrency.currency_iso}}</p>\n </ng-container>\n </div>\n\n <hr>\n\n <!--Equivalence row-->\n <div class=\"equivalence amount-row\">\n <p class=\"hr-body sm-regular\">\n \u2248 {{ priority == 'crypto' ? valueFiat : valueCrypto}}\n </p>\n\n <ng-container *ngIf=\"priority == 'crypto'\">\n <gravity-currency-dropdown-short [size]=\"fiatCurrenciesSize\" [readonly]=\"true\" [disabled]=\"disabled\"\n [config]=\"fiatCurrencies\"/>\n </ng-container>\n <ng-container *ngIf=\"priority == 'fiat'\">\n <p class=\"hr-body sm-regular\" [class.gravity-padding-inline-xxs]=\"fiatCurrenciesSize == 'sm'\" [class.gravity-padding-inline-sm]=\"fiatCurrenciesSize == 'md'\">{{cryptoCurrency.currency_iso}}</p>\n </ng-container>\n </div>\n </div>\n</div>", 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}.amount-only-text-field{align-items:center;display:flex;gap:8px;width:-moz-fit-content;width:fit-content}.amount-only-text-field.disabled .amounts{pointer-events:none}.amount-only-text-field.disabled .amounts .enter-amount input:disabled{color:var(--on-bg-disabled);cursor:not-allowed;background-color:transparent}.amount-only-text-field.disabled .amounts .enter-amount input:disabled::placeholder{color:var(--on-bg-disabled)}.amount-only-text-field.disabled .amounts .enter-amount .floating-label{color:var(--on-bg-disabled)}.amount-only-text-field.disabled .amounts hr{border-top-color:var(--on-bg-disabled)}.amount-only-text-field.disabled .amounts .enter-amount p,.amount-only-text-field.disabled .amounts .equivalence p{color:var(--on-bg-disabled)}.amount-only-text-field.positive .amounts hr{border-color:var(--positive-primary)}.amount-only-text-field.negative .amounts hr{border-color:var(--negative-primary)}.amount-row{height:30px;align-items:center;display:flex;justify-content:space-between}.amounts{padding:6px;width:310px}.amounts:hover .enter-amount input{color:var(--text-primary)}.amounts:hover .enter-amount input::placeholder{color:var(--text-primary)}.amounts:not(.readonly):focus-within .enter-amount .floating-label{opacity:1;transform:translateY(-12px)}.amounts:not(.readonly):focus-within .enter-amount input::placeholder{opacity:0}.amounts:not(.readonly):focus-within hr{border-color:var(--line-full-enabled-typing-primary)}.amounts .enter-amount{margin-top:12px;position:relative}.amounts .enter-amount .floating-label{position:absolute;top:0;left:0;opacity:0;transform:translateY(10px);pointer-events:none;color:var(--text-primary);transition:all .15s ease}.amounts .enter-amount input{width:100%;border:none;outline:none;color:var(--placeholder-empty-enabled-primary)}.amounts .enter-amount input::placeholder{color:var(--placeholder-empty-enabled-primary)}.amounts .enter-amount input[type=number]{-moz-appearance:textfield}.amounts .enter-amount input[type=number]::-webkit-outer-spin-button,.amounts .enter-amount input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.amounts hr{border:none;border-top:1px solid var(--line-empty-enabled-primary);margin:4px 0;opacity:1;transition:border-color .15s ease}.amounts.filled .enter-amount .floating-label{opacity:1;transform:translateY(-12px)}.amounts.filled .enter-amount input{color:var(--text-primary)}.amounts.filled .enter-amount input::placeholder{opacity:0}.amounts.filled hr{border-color:var(--line-full-enabled-typing-primary)}.amounts.readonly{cursor:default}.amounts.readonly .enter-amount input{color:var(--text-primary);cursor:default}.amounts.readonly .enter-amount input::placeholder{color:var(--text-primary)}.amounts.readonly .enter-amount .floating-label{color:var(--text-secondary)}.amounts.readonly hr{border-top-color:var(--line-empty-enabled-readonly)}\n"] }]
8249
- }], propDecorators: { priority: [{
8258
+ args: [{ selector: 'gravity-text-field-amount-only', template: "<div class=\"amount-only-text-field {{state ? state : null}}\" [class.disabled]=\"disabled\"\n [attr.data-cy]=\"cypressTag ? 'textFieldAmount_'+cypressTag : null\" [class.standard-width]=\"width === 'standard'\"\n [class.full-width]=\"width === 'full'\">\n\n <!--Switch-->\n <gravity-icon-button (clickOnIcon)=\"swapCurrencies()\" [icon]=\"'swaps'\" *ngIf=\"!readonly\"\n [cypressTag]=\"'swapCurrencies'\" [size]=\"'sm'\"\n [supportText]=\"disabled ? null : priority == 'crypto' ? 'Enter the amount in fiat' : 'Enter the amount in crypto'\"\n [type]=\"'primary'\" [state]=\"disabled ? 'disabled' : 'active'\"/>\n\n <div class=\"amounts\" [class.filled]=\"inputValue\" [class.readonly]=\"readonly\">\n\n <!--Enter amount row-->\n <div class=\"enter-amount amount-row\">\n <label class=\"floating-label hr-label sm-regular\">\n {{ placeholder }}\n </label>\n\n <input class=\"hr-label md-regular\" [disabled]=\"disabled\" [readonly]=\"readonly\" (input)=\"calculateValues()\"\n [attr.data-cy]=\"'textFieldAmount_input'\" [(ngModel)]=\"inputValue\" placeholder=\"{{placeholder}}\"\n type=\"number\">\n\n <ng-container *ngIf=\"priority == 'fiat'\">\n <gravity-currency-dropdown-short [size]=\"fiatCurrenciesSize\" [disabled]=\"disabled\"\n (onClick)=\"updateFiatCurrency($event)\" [cypressTag]=\"'amountFiat'\"\n [config]=\"fiatCurrencies\"/>\n </ng-container>\n <ng-container *ngIf=\"priority == 'crypto'\">\n <p class=\"hr-body sm-regular\" [class.gravity-padding-inline-xxs]=\"fiatCurrenciesSize == 'sm'\"\n [class.gravity-padding-inline-sm]=\"fiatCurrenciesSize == 'md'\">{{ cryptoCurrency.currency_iso }}</p>\n </ng-container>\n </div>\n\n <hr>\n\n <!--Equivalence row-->\n <div class=\"equivalence amount-row\">\n <p class=\"hr-body sm-regular\">\n \u2248 {{ priority == 'crypto' ? valueFiat : valueCrypto }}\n </p>\n\n <ng-container *ngIf=\"priority == 'crypto'\">\n <gravity-currency-dropdown-short [size]=\"fiatCurrenciesSize\" [readonly]=\"true\" [disabled]=\"disabled\"\n [config]=\"fiatCurrencies\"/>\n </ng-container>\n <ng-container *ngIf=\"priority == 'fiat'\">\n <p class=\"hr-body sm-regular\" [class.gravity-padding-inline-xxs]=\"fiatCurrenciesSize == 'sm'\"\n [class.gravity-padding-inline-sm]=\"fiatCurrenciesSize == 'md'\">{{ cryptoCurrency.currency_iso }}</p>\n </ng-container>\n </div>\n </div>\n</div>", 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}.amount-only-text-field{align-items:center;display:flex;gap:8px;width:-moz-fit-content;width:fit-content}.amount-only-text-field.standard-width .amounts{width:310px}.amount-only-text-field.full-width,.amount-only-text-field.full-width .amounts{width:100%}.amount-only-text-field.disabled .amounts{pointer-events:none}.amount-only-text-field.disabled .amounts .enter-amount input:disabled{color:var(--on-bg-disabled);cursor:not-allowed;background-color:transparent}.amount-only-text-field.disabled .amounts .enter-amount input:disabled::placeholder{color:var(--on-bg-disabled)}.amount-only-text-field.disabled .amounts .enter-amount .floating-label{color:var(--on-bg-disabled)}.amount-only-text-field.disabled .amounts hr{border-top-color:var(--on-bg-disabled)}.amount-only-text-field.disabled .amounts .enter-amount p,.amount-only-text-field.disabled .amounts .equivalence p{color:var(--on-bg-disabled)}.amount-only-text-field.positive .amounts hr{border-color:var(--positive-primary)}.amount-only-text-field.negative .amounts hr{border-color:var(--negative-primary)}.amount-row{height:30px;align-items:center;display:flex;justify-content:space-between}.amounts{padding:6px;width:100%}.amounts:hover .enter-amount input{color:var(--text-primary)}.amounts:hover .enter-amount input::placeholder{color:var(--text-primary)}.amounts:not(.readonly):focus-within .enter-amount .floating-label{opacity:1;transform:translateY(-12px)}.amounts:not(.readonly):focus-within .enter-amount input::placeholder{opacity:0}.amounts:not(.readonly):focus-within hr{border-color:var(--line-full-enabled-typing-primary)}.amounts .enter-amount{margin-top:12px;position:relative}.amounts .enter-amount .floating-label{position:absolute;top:0;left:0;opacity:0;transform:translateY(10px);pointer-events:none;color:var(--text-primary);transition:all .15s ease}.amounts .enter-amount input{width:100%;border:none;outline:none;color:var(--placeholder-empty-enabled-primary)}.amounts .enter-amount input::placeholder{color:var(--placeholder-empty-enabled-primary)}.amounts .enter-amount input[type=number]{-moz-appearance:textfield}.amounts .enter-amount input[type=number]::-webkit-outer-spin-button,.amounts .enter-amount input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.amounts hr{border:none;border-top:1px solid var(--line-empty-enabled-primary);margin:4px 0;opacity:1;transition:border-color .15s ease}.amounts.filled .enter-amount .floating-label{opacity:1;transform:translateY(-12px)}.amounts.filled .enter-amount input{color:var(--text-primary)}.amounts.filled .enter-amount input::placeholder{opacity:0}.amounts.filled hr{border-color:var(--line-full-enabled-typing-primary)}.amounts.readonly{cursor:default}.amounts.readonly .enter-amount input{color:var(--text-primary);cursor:default}.amounts.readonly .enter-amount input::placeholder{color:var(--text-primary)}.amounts.readonly .enter-amount .floating-label{color:var(--text-secondary)}.amounts.readonly hr{border-top-color:var(--line-empty-enabled-readonly)}\n"] }]
8259
+ }], propDecorators: { cypressTag: [{
8260
+ type: Input
8261
+ }], priority: [{
8250
8262
  type: Input
8251
8263
  }], placeholder: [{
8252
8264
  type: Input
@@ -8262,6 +8274,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
8262
8274
  type: Input
8263
8275
  }], state: [{
8264
8276
  type: Input
8277
+ }], width: [{
8278
+ type: Input
8265
8279
  }], disabled: [{
8266
8280
  type: Input
8267
8281
  }], readonly: [{
@@ -8293,11 +8307,11 @@ class GravityTooltipContainerComponent {
8293
8307
  this.actionButton.emit();
8294
8308
  }
8295
8309
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityTooltipContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8296
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityTooltipContainerComponent, selector: "gravity-tooltip-container", inputs: { cypressTag: "cypressTag", tooltipBanner: "tooltipBanner", tooltipSimple: "tooltipSimple" }, outputs: { closeBanner: "closeBanner", actionButton: "actionButton" }, ngImport: i0, template: "<!--Tooltip Banner-->\n<div class=\"gravity-tooltip-container banner\" *ngIf=\"tooltipBanner\">\n <div class=\"top-container\" *ngIf=\"currentBanner?.imageUrl\"\n [ngStyle]=\"{ 'background-image': currentBanner.imageUrl ? 'url(' + currentBanner.imageUrl + ')' : 'none' }\">\n <div class=\"actions-container\">\n <gravity-status-indicator *ngIf=\"currentBanner.actionContent\" [size]=\"'sm'\"\n [text]=\"currentBanner.actionContent.text\"\n [icon]=\"currentBanner.actionContent.icon\"\n [status]=\"currentBanner.actionContent.status\"></gravity-status-indicator>\n <gravity-icon-button class=\"close-icon\" [icon]=\"'unsuccess'\" [type]=\"'secondary'\" (click)=\"closeBannerTooltip()\"></gravity-icon-button>\n </div>\n </div>\n\n <div class=\"bottom-container\">\n <div class=\"body\">\n <div class=\"header\">\n <div class=\"title\">\n <gravity-icon *ngIf=\"currentBanner.header.icon\" [iconName]=\"currentBanner.header.icon\"\n [iconSize]=\"'md-16'\"></gravity-icon>\n <p class=\"hr-title md-bold\" *ngIf=\"currentBanner.header.title\" [innerHTML]=\"currentBanner.header.title\"></p>\n <gravity-icon-button *ngIf=\"!currentBanner.imageUrl\" [icon]=\"'unsuccess'\"\n [type]=\"'primary'\" (click)=\"closeBannerTooltip()\"></gravity-icon-button>\n </div>\n <p class=\"hr-body sm-regular subtitle\" *ngIf=\"currentBanner.header.subtitle\"\n [innerHTML]=\"currentBanner.header.subtitle\"></p>\n </div>\n <hr class=\"divider\">\n <p class=\"hr-body sm-regular\" *ngIf=\"currentBanner.body\" [innerHTML]=\"currentBanner.body\"></p>\n </div>\n\n <gravity-button *ngIf=\"currentBanner.button\" [type]=\"currentBanner.button.type\" [size]=\"'sm'\"\n [iconName]=\"currentBanner.button.icon\" (click)=\"actionButtonClicked()\"\n [iconPosition]=\"currentBanner.button.iconPosition\">{{ currentBanner.button.text }}\n </gravity-button>\n\n <gravity-pagination *ngIf=\"tooltipBanner.length > 1\" [totalItems]=\"tooltipBanner.length\" [itemsPerPage]=\"1\"\n [currentPage]=\"currentPage\"\n [type]=\"'dots'\" (pageChanged)=\"changePage($event)\"></gravity-pagination>\n </div>\n</div>\n\n<!--Tooltip Simple-->\n<div class=\"gravity-tooltip-container simple\" *ngIf=\"tooltipSimple\">\n <p class=\"hr-body sm-bold\" *ngIf=\"tooltipSimple?.title\" [innerHTML]=\"tooltipSimple?.title\"></p>\n <p class=\"hr-body sm-regular\" *ngIf=\"tooltipSimple?.text\" [innerHTML]=\"tooltipSimple?.text\"></p>\n</div>", styles: [":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}.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}.gravity-tooltip-container{display:flex;flex-direction:column;border-radius:.3125rem;background:var(--color-surface-surface-secondary, #FFF);box-shadow:0 4px 10px #151c2938}.gravity-tooltip-container.banner{width:400px;min-width:400px;max-width:600px}.gravity-tooltip-container.simple{padding:var(--gravity-spacing-xs);justify-content:center;align-items:flex-start;gap:var(--gravity-spacing-xs);width:-moz-fit-content;width:fit-content}.top-container{height:229px;width:100%;border-radius:5px 5px 0 0;background-repeat:no-repeat;background-size:cover;background-position:center}.top-container .actions-container{display:flex;padding:var(--gravity-spacing-sm);justify-content:space-between;align-items:center;align-self:stretch}.top-container .actions-container .close-icon{margin-left:auto}.bottom-container{display:flex;padding:var(--gravity-spacing-md) var(--gravity-spacing-sm);flex-direction:column;align-items:flex-start;gap:var(--gravity-spacing-md);align-self:stretch}.bottom-container .body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--gravity-spacing-sm);align-self:stretch}.bottom-container .body .header{display:flex;flex-direction:column;gap:var(--gravity-spacing-xs);width:100%}.bottom-container .body .header .title{display:flex;gap:var(--gravity-spacing-xs);align-items:baseline}.bottom-container .body .header .title p{width:100%}.bottom-container .body .header .subtitle{margin-left:var(--gravity-spacing-md)}.bottom-container .body hr.divider{width:100%;border:none;border-top:1px solid var(--cta-primary)}.bottom-container gravity-button{margin-left:auto}.bottom-container gravity-pagination{width:-moz-fit-content;width:fit-content;display:block;margin-inline:auto}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: GravityButtonComponent, selector: "gravity-button", inputs: ["cypressTag", "disabled", "iconName", "isLoading", "showContent", "size", "iconPosition", "customState", "type"] }, { kind: "component", type: GravityIconButtonComponent, selector: "gravity-icon-button", inputs: ["cypressTag", "icon", "supportText", "variant", "size", "type", "state", "badge"], outputs: ["clickOnIcon"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }, { kind: "component", type: GravityStatusIndicatorComponent, selector: "gravity-status-indicator", inputs: ["icon", "text", "cypressTag", "size", "type", "status"] }, { kind: "component", type: GravityPaginationComponent, selector: "gravity-pagination", inputs: ["currentLang", "cypressTag", "totalItems", "itemsPerPage", "currentPage", "type", "showPageCount", "showArrowDots"], outputs: ["pageChanged"] }] }); }
8310
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityTooltipContainerComponent, selector: "gravity-tooltip-container", inputs: { cypressTag: "cypressTag", tooltipBanner: "tooltipBanner", tooltipSimple: "tooltipSimple" }, outputs: { closeBanner: "closeBanner", actionButton: "actionButton" }, ngImport: i0, template: "<!--Tooltip Banner-->\n<div class=\"gravity-tooltip-container banner\" *ngIf=\"tooltipBanner\">\n <div class=\"top-container\" *ngIf=\"currentBanner?.imageUrl\"\n [ngStyle]=\"{ 'background-image': currentBanner.imageUrl ? 'url(' + currentBanner.imageUrl + ')' : 'none' }\">\n <div class=\"actions-container\">\n <gravity-status-indicator *ngIf=\"currentBanner.actionContent\" [size]=\"'sm'\"\n [text]=\"currentBanner.actionContent.text\"\n [icon]=\"currentBanner.actionContent.icon\"\n [status]=\"currentBanner.actionContent.status\"></gravity-status-indicator>\n <gravity-icon-button class=\"close-icon\" [icon]=\"'unsuccess'\" [type]=\"'secondary'\" (click)=\"closeBannerTooltip()\"></gravity-icon-button>\n </div>\n </div>\n\n <div class=\"bottom-container\">\n <div class=\"body\">\n <div class=\"header\">\n <div class=\"title\">\n <gravity-icon *ngIf=\"currentBanner.header.icon\" [iconName]=\"currentBanner.header.icon\"\n [iconSize]=\"'md-16'\"></gravity-icon>\n <p class=\"hr-title md-bold\" *ngIf=\"currentBanner.header.title\" [innerHTML]=\"currentBanner.header.title\"></p>\n <gravity-icon-button *ngIf=\"!currentBanner.imageUrl\" [icon]=\"'unsuccess'\"\n [type]=\"'primary'\" (click)=\"closeBannerTooltip()\"></gravity-icon-button>\n </div>\n <p class=\"hr-body sm-regular subtitle\" *ngIf=\"currentBanner.header.subtitle\"\n [innerHTML]=\"currentBanner.header.subtitle\"></p>\n </div>\n <hr class=\"divider\">\n <p class=\"hr-body sm-regular\" *ngIf=\"currentBanner.body\" [innerHTML]=\"currentBanner.body\"></p>\n </div>\n\n <gravity-button *ngIf=\"currentBanner.button\" [type]=\"currentBanner.button.type\" [size]=\"'sm'\"\n [iconName]=\"currentBanner.button.icon\" (click)=\"actionButtonClicked()\"\n [iconPosition]=\"currentBanner.button.iconPosition\">{{ currentBanner.button.text }}\n </gravity-button>\n\n <gravity-pagination *ngIf=\"tooltipBanner.length > 1\" [totalItems]=\"tooltipBanner.length\" [itemsPerPage]=\"1\"\n [currentPage]=\"currentPage\"\n [type]=\"'dots'\" (pageChanged)=\"changePage($event)\"></gravity-pagination>\n </div>\n</div>\n\n<!--Tooltip Simple-->\n<div class=\"gravity-tooltip-container simple\" *ngIf=\"tooltipSimple\">\n <p class=\"hr-body sm-bold\" *ngIf=\"tooltipSimple?.title\" [innerHTML]=\"tooltipSimple?.title\"></p>\n <p class=\"hr-body sm-regular\" *ngIf=\"tooltipSimple?.text\" [innerHTML]=\"tooltipSimple?.text\"></p>\n</div>", styles: [":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}.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}.gravity-tooltip-container{display:flex;flex-direction:column;border-radius:.3125rem;background:var(--bg-tooltip-primary, #FFF);box-shadow:0 4px 10px #151c2938}.gravity-tooltip-container.banner{width:400px;min-width:400px;max-width:600px}.gravity-tooltip-container.simple{padding:var(--gravity-spacing-xs);justify-content:center;align-items:flex-start;gap:var(--gravity-spacing-xs);width:-moz-fit-content;width:fit-content}.top-container{height:229px;width:100%;border-radius:5px 5px 0 0;background-repeat:no-repeat;background-size:cover;background-position:center}.top-container .actions-container{display:flex;padding:var(--gravity-spacing-sm);justify-content:space-between;align-items:center;align-self:stretch}.top-container .actions-container .close-icon{margin-left:auto}.bottom-container{display:flex;padding:var(--gravity-spacing-md) var(--gravity-spacing-sm);flex-direction:column;align-items:flex-start;gap:var(--gravity-spacing-md);align-self:stretch}.bottom-container .body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--gravity-spacing-sm);align-self:stretch}.bottom-container .body .header{display:flex;flex-direction:column;gap:var(--gravity-spacing-xs);width:100%}.bottom-container .body .header .title{display:flex;gap:var(--gravity-spacing-xs);align-items:baseline}.bottom-container .body .header .title p{width:100%}.bottom-container .body .header .subtitle{margin-left:var(--gravity-spacing-md)}.bottom-container .body hr.divider{width:100%;border:none;border-top:1px solid var(--cta-primary)}.bottom-container gravity-button{margin-left:auto}.bottom-container gravity-pagination{width:-moz-fit-content;width:fit-content;display:block;margin-inline:auto}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: GravityButtonComponent, selector: "gravity-button", inputs: ["cypressTag", "disabled", "iconName", "isLoading", "showContent", "size", "iconPosition", "customState", "type"] }, { kind: "component", type: GravityIconButtonComponent, selector: "gravity-icon-button", inputs: ["cypressTag", "icon", "supportText", "variant", "size", "type", "state", "badge"], outputs: ["clickOnIcon"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "iconSize", "hoverIcon", "size", "isCoin"] }, { kind: "component", type: GravityStatusIndicatorComponent, selector: "gravity-status-indicator", inputs: ["icon", "text", "cypressTag", "size", "type", "status"] }, { kind: "component", type: GravityPaginationComponent, selector: "gravity-pagination", inputs: ["currentLang", "cypressTag", "totalItems", "itemsPerPage", "currentPage", "type", "showPageCount", "showArrowDots"], outputs: ["pageChanged"] }] }); }
8297
8311
  }
8298
8312
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityTooltipContainerComponent, decorators: [{
8299
8313
  type: Component,
8300
- args: [{ selector: 'gravity-tooltip-container', template: "<!--Tooltip Banner-->\n<div class=\"gravity-tooltip-container banner\" *ngIf=\"tooltipBanner\">\n <div class=\"top-container\" *ngIf=\"currentBanner?.imageUrl\"\n [ngStyle]=\"{ 'background-image': currentBanner.imageUrl ? 'url(' + currentBanner.imageUrl + ')' : 'none' }\">\n <div class=\"actions-container\">\n <gravity-status-indicator *ngIf=\"currentBanner.actionContent\" [size]=\"'sm'\"\n [text]=\"currentBanner.actionContent.text\"\n [icon]=\"currentBanner.actionContent.icon\"\n [status]=\"currentBanner.actionContent.status\"></gravity-status-indicator>\n <gravity-icon-button class=\"close-icon\" [icon]=\"'unsuccess'\" [type]=\"'secondary'\" (click)=\"closeBannerTooltip()\"></gravity-icon-button>\n </div>\n </div>\n\n <div class=\"bottom-container\">\n <div class=\"body\">\n <div class=\"header\">\n <div class=\"title\">\n <gravity-icon *ngIf=\"currentBanner.header.icon\" [iconName]=\"currentBanner.header.icon\"\n [iconSize]=\"'md-16'\"></gravity-icon>\n <p class=\"hr-title md-bold\" *ngIf=\"currentBanner.header.title\" [innerHTML]=\"currentBanner.header.title\"></p>\n <gravity-icon-button *ngIf=\"!currentBanner.imageUrl\" [icon]=\"'unsuccess'\"\n [type]=\"'primary'\" (click)=\"closeBannerTooltip()\"></gravity-icon-button>\n </div>\n <p class=\"hr-body sm-regular subtitle\" *ngIf=\"currentBanner.header.subtitle\"\n [innerHTML]=\"currentBanner.header.subtitle\"></p>\n </div>\n <hr class=\"divider\">\n <p class=\"hr-body sm-regular\" *ngIf=\"currentBanner.body\" [innerHTML]=\"currentBanner.body\"></p>\n </div>\n\n <gravity-button *ngIf=\"currentBanner.button\" [type]=\"currentBanner.button.type\" [size]=\"'sm'\"\n [iconName]=\"currentBanner.button.icon\" (click)=\"actionButtonClicked()\"\n [iconPosition]=\"currentBanner.button.iconPosition\">{{ currentBanner.button.text }}\n </gravity-button>\n\n <gravity-pagination *ngIf=\"tooltipBanner.length > 1\" [totalItems]=\"tooltipBanner.length\" [itemsPerPage]=\"1\"\n [currentPage]=\"currentPage\"\n [type]=\"'dots'\" (pageChanged)=\"changePage($event)\"></gravity-pagination>\n </div>\n</div>\n\n<!--Tooltip Simple-->\n<div class=\"gravity-tooltip-container simple\" *ngIf=\"tooltipSimple\">\n <p class=\"hr-body sm-bold\" *ngIf=\"tooltipSimple?.title\" [innerHTML]=\"tooltipSimple?.title\"></p>\n <p class=\"hr-body sm-regular\" *ngIf=\"tooltipSimple?.text\" [innerHTML]=\"tooltipSimple?.text\"></p>\n</div>", styles: [":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}.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}.gravity-tooltip-container{display:flex;flex-direction:column;border-radius:.3125rem;background:var(--color-surface-surface-secondary, #FFF);box-shadow:0 4px 10px #151c2938}.gravity-tooltip-container.banner{width:400px;min-width:400px;max-width:600px}.gravity-tooltip-container.simple{padding:var(--gravity-spacing-xs);justify-content:center;align-items:flex-start;gap:var(--gravity-spacing-xs);width:-moz-fit-content;width:fit-content}.top-container{height:229px;width:100%;border-radius:5px 5px 0 0;background-repeat:no-repeat;background-size:cover;background-position:center}.top-container .actions-container{display:flex;padding:var(--gravity-spacing-sm);justify-content:space-between;align-items:center;align-self:stretch}.top-container .actions-container .close-icon{margin-left:auto}.bottom-container{display:flex;padding:var(--gravity-spacing-md) var(--gravity-spacing-sm);flex-direction:column;align-items:flex-start;gap:var(--gravity-spacing-md);align-self:stretch}.bottom-container .body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--gravity-spacing-sm);align-self:stretch}.bottom-container .body .header{display:flex;flex-direction:column;gap:var(--gravity-spacing-xs);width:100%}.bottom-container .body .header .title{display:flex;gap:var(--gravity-spacing-xs);align-items:baseline}.bottom-container .body .header .title p{width:100%}.bottom-container .body .header .subtitle{margin-left:var(--gravity-spacing-md)}.bottom-container .body hr.divider{width:100%;border:none;border-top:1px solid var(--cta-primary)}.bottom-container gravity-button{margin-left:auto}.bottom-container gravity-pagination{width:-moz-fit-content;width:fit-content;display:block;margin-inline:auto}\n"] }]
8314
+ args: [{ selector: 'gravity-tooltip-container', template: "<!--Tooltip Banner-->\n<div class=\"gravity-tooltip-container banner\" *ngIf=\"tooltipBanner\">\n <div class=\"top-container\" *ngIf=\"currentBanner?.imageUrl\"\n [ngStyle]=\"{ 'background-image': currentBanner.imageUrl ? 'url(' + currentBanner.imageUrl + ')' : 'none' }\">\n <div class=\"actions-container\">\n <gravity-status-indicator *ngIf=\"currentBanner.actionContent\" [size]=\"'sm'\"\n [text]=\"currentBanner.actionContent.text\"\n [icon]=\"currentBanner.actionContent.icon\"\n [status]=\"currentBanner.actionContent.status\"></gravity-status-indicator>\n <gravity-icon-button class=\"close-icon\" [icon]=\"'unsuccess'\" [type]=\"'secondary'\" (click)=\"closeBannerTooltip()\"></gravity-icon-button>\n </div>\n </div>\n\n <div class=\"bottom-container\">\n <div class=\"body\">\n <div class=\"header\">\n <div class=\"title\">\n <gravity-icon *ngIf=\"currentBanner.header.icon\" [iconName]=\"currentBanner.header.icon\"\n [iconSize]=\"'md-16'\"></gravity-icon>\n <p class=\"hr-title md-bold\" *ngIf=\"currentBanner.header.title\" [innerHTML]=\"currentBanner.header.title\"></p>\n <gravity-icon-button *ngIf=\"!currentBanner.imageUrl\" [icon]=\"'unsuccess'\"\n [type]=\"'primary'\" (click)=\"closeBannerTooltip()\"></gravity-icon-button>\n </div>\n <p class=\"hr-body sm-regular subtitle\" *ngIf=\"currentBanner.header.subtitle\"\n [innerHTML]=\"currentBanner.header.subtitle\"></p>\n </div>\n <hr class=\"divider\">\n <p class=\"hr-body sm-regular\" *ngIf=\"currentBanner.body\" [innerHTML]=\"currentBanner.body\"></p>\n </div>\n\n <gravity-button *ngIf=\"currentBanner.button\" [type]=\"currentBanner.button.type\" [size]=\"'sm'\"\n [iconName]=\"currentBanner.button.icon\" (click)=\"actionButtonClicked()\"\n [iconPosition]=\"currentBanner.button.iconPosition\">{{ currentBanner.button.text }}\n </gravity-button>\n\n <gravity-pagination *ngIf=\"tooltipBanner.length > 1\" [totalItems]=\"tooltipBanner.length\" [itemsPerPage]=\"1\"\n [currentPage]=\"currentPage\"\n [type]=\"'dots'\" (pageChanged)=\"changePage($event)\"></gravity-pagination>\n </div>\n</div>\n\n<!--Tooltip Simple-->\n<div class=\"gravity-tooltip-container simple\" *ngIf=\"tooltipSimple\">\n <p class=\"hr-body sm-bold\" *ngIf=\"tooltipSimple?.title\" [innerHTML]=\"tooltipSimple?.title\"></p>\n <p class=\"hr-body sm-regular\" *ngIf=\"tooltipSimple?.text\" [innerHTML]=\"tooltipSimple?.text\"></p>\n</div>", styles: [":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}.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}.gravity-tooltip-container{display:flex;flex-direction:column;border-radius:.3125rem;background:var(--bg-tooltip-primary, #FFF);box-shadow:0 4px 10px #151c2938}.gravity-tooltip-container.banner{width:400px;min-width:400px;max-width:600px}.gravity-tooltip-container.simple{padding:var(--gravity-spacing-xs);justify-content:center;align-items:flex-start;gap:var(--gravity-spacing-xs);width:-moz-fit-content;width:fit-content}.top-container{height:229px;width:100%;border-radius:5px 5px 0 0;background-repeat:no-repeat;background-size:cover;background-position:center}.top-container .actions-container{display:flex;padding:var(--gravity-spacing-sm);justify-content:space-between;align-items:center;align-self:stretch}.top-container .actions-container .close-icon{margin-left:auto}.bottom-container{display:flex;padding:var(--gravity-spacing-md) var(--gravity-spacing-sm);flex-direction:column;align-items:flex-start;gap:var(--gravity-spacing-md);align-self:stretch}.bottom-container .body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--gravity-spacing-sm);align-self:stretch}.bottom-container .body .header{display:flex;flex-direction:column;gap:var(--gravity-spacing-xs);width:100%}.bottom-container .body .header .title{display:flex;gap:var(--gravity-spacing-xs);align-items:baseline}.bottom-container .body .header .title p{width:100%}.bottom-container .body .header .subtitle{margin-left:var(--gravity-spacing-md)}.bottom-container .body hr.divider{width:100%;border:none;border-top:1px solid var(--cta-primary)}.bottom-container gravity-button{margin-left:auto}.bottom-container gravity-pagination{width:-moz-fit-content;width:fit-content;display:block;margin-inline:auto}\n"] }]
8301
8315
  }], propDecorators: { cypressTag: [{
8302
8316
  type: Input
8303
8317
  }], tooltipBanner: [{