globuswebcomponents 2.8.9 → 2.8.10

package/dist/collection/components/gb-tab-button-base/gb-tab-button-base.js.map

@@ -1 +1 @@
-{"version":3,"file":"gb-tab-button-base.js","sourceRoot":"","sources":["../../../src/components/gb-tab-button-base/gb-tab-button-base.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Prop, h } from \"@stencil/core\";\r\nimport { GeneralSizes, TabTypes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n  tag: 'gb-tab-button-base',\r\n  styleUrl: 'gb-tab-button-base.css',\r\n  shadow: true,\r\n})\r\nexport class GbTabButtonBase {\r\n  @Prop() current: boolean = false;\r\n  @Prop() size: GeneralSizes;\r\n  @Prop() fullWidth: boolean = false;\r\n  @Prop() badge: boolean = false;\r\n  @Prop() type: TabTypes;\r\n  @Prop() tabName: string = '';\r\n  @Prop() alignment: 'horizontal' | 'vertical';\r\n  @Element() el: HTMLElement;\r\n  @Event() tabClicked: EventEmitter<void>;\r\n\r\n  getTextClasses() {\r\n    switch (this.size) {\r\n      case 'sm':\r\n        return 'text-sm-medium';\r\n      case 'md':\r\n        return 'text-md-medium';\r\n    }\r\n  }\r\n\r\n  getCurrentTextClasses() {\r\n    switch (this.size) {\r\n      case 'sm':\r\n        return 'text-sm-semi-bold';\r\n      case 'md':\r\n        return 'text-md-semi-bold';\r\n    }\r\n  }\r\n\r\n  getCountTextClasses() {\r\n    switch (this.size) {\r\n      case 'sm':\r\n        return 'text-xs-medium';\r\n      case 'md':\r\n        return 'text-sm-medium';\r\n    }\r\n  }\r\n\r\n  componentDidLoad() {\r\n    const tabCount = this.el.querySelector('[slot=\"count\"]');\r\n\r\n    if(tabCount) {\r\n        tabCount.classList.add(this.getCountTextClasses());\r\n    }\r\n  }\r\n\r\n  handleClick() {\r\n    this.tabClicked.emit();\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div \r\n      class={`tab_button_div ${this.type}\r\n      ${this.current ? 'current' : ''} \r\n      ${this.fullWidth ? 'full_width' : ''} \r\n      ${this.size}\r\n      ${this.alignment}`} \r\n      onClick={() => this.handleClick()}\r\n      >\r\n        <p class={`tab_name ${!this.current ? 'tab_text' : ''} ${this.current ? this.getCurrentTextClasses() : this.getTextClasses()}`}>{this.tabName}</p>\r\n        {this.badge && (\r\n          <gb-badge\r\n            size=\"sm\"\r\n            type=\"pill_color\"\r\n            color={\r\n              this.current && this.type === 'button_primary'\r\n                ? 'information'\r\n                : this.current && this.type === 'underline'\r\n                ? 'information'\r\n                : this.current && this.type === 'underline_filled'\r\n                ? 'information'\r\n                :\r\n                this.current && this.type === 'line'\r\n                ? 'information'\r\n                : 'gray'\r\n            }\r\n          >\r\n            <slot name=\"count\"></slot>\r\n          </gb-badge>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}"]}
+{"version":3,"file":"gb-tab-button-base.js","sourceRoot":"","sources":["../../../src/components/gb-tab-button-base/gb-tab-button-base.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAQjF,MAAM,OAAO,eAAe;IAL5B;QAMU,YAAO,GAAY,KAAK,CAAC;QAEzB,cAAS,GAAY,KAAK,CAAC;QAC3B,UAAK,GAAY,KAAK,CAAC;QAEvB,YAAO,GAAW,EAAE,CAAC;KAqE9B;IAhEC,cAAc;QACZ,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;YAClB,KAAK,IAAI;gBACP,OAAO,gBAAgB,CAAC;YAC1B,KAAK,IAAI;gBACP,OAAO,gBAAgB,CAAC;QAC5B,CAAC;IACH,CAAC;IAED,qBAAqB;QACnB,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;YAClB,KAAK,IAAI;gBACP,OAAO,mBAAmB,CAAC;YAC7B,KAAK,IAAI;gBACP,OAAO,mBAAmB,CAAC;QAC/B,CAAC;IACH,CAAC;IAED,mBAAmB;QACjB,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;YAClB,KAAK,IAAI;gBACP,OAAO,gBAAgB,CAAC;YAC1B,KAAK,IAAI;gBACP,OAAO,gBAAgB,CAAC;QAC5B,CAAC;IACH,CAAC;IAED,gBAAgB;QACd,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;QAEzD,IAAG,QAAQ,EAAE,CAAC;YACV,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,mBAAmB,EAAE,CAAC,CAAC;QACvD,CAAC;IACH,CAAC;IAED,WAAW;QACT,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;IACzB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,4DACA,KAAK,EAAE,kBAAkB,IAAI,CAAC,IAAI;QAChC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;QAC7B,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE;QAClC,IAAI,CAAC,IAAI;QACT,IAAI,CAAC,SAAS,EAAE,EAClB,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,EAAE;YAE/B,0DAAG,KAAK,EAAE,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,qBAAqB,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,EAAE,EAAE,IAAG,IAAI,CAAC,OAAO,CAAK;YACjJ,IAAI,CAAC,KAAK,IAAI,CACb,iEACE,IAAI,EAAC,IAAI,EACT,IAAI,EAAC,YAAY,EACjB,KAAK,EACH,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,MAAM;gBAGvC,6DAAM,IAAI,EAAC,OAAO,GAAQ,CACjB,CACZ,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Event, EventEmitter, Prop, h } from \"@stencil/core\";\r\nimport { GeneralSizes, TabTypes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n  tag: 'gb-tab-button-base',\r\n  styleUrl: 'gb-tab-button-base.css',\r\n  shadow: true,\r\n})\r\nexport class GbTabButtonBase {\r\n  @Prop() current: boolean = false;\r\n  @Prop() size: GeneralSizes;\r\n  @Prop() fullWidth: boolean = false;\r\n  @Prop() badge: boolean = false;\r\n  @Prop() type: TabTypes;\r\n  @Prop() tabName: string = '';\r\n  @Prop() alignment: 'horizontal' | 'vertical';\r\n  @Element() el: HTMLElement;\r\n  @Event() tabClicked: EventEmitter<void>;\r\n\r\n  getTextClasses() {\r\n    switch (this.size) {\r\n      case 'sm':\r\n        return 'text-sm-medium';\r\n      case 'md':\r\n        return 'text-md-medium';\r\n    }\r\n  }\r\n\r\n  getCurrentTextClasses() {\r\n    switch (this.size) {\r\n      case 'sm':\r\n        return 'text-sm-semi-bold';\r\n      case 'md':\r\n        return 'text-md-semi-bold';\r\n    }\r\n  }\r\n\r\n  getCountTextClasses() {\r\n    switch (this.size) {\r\n      case 'sm':\r\n        return 'text-xs-medium';\r\n      case 'md':\r\n        return 'text-sm-medium';\r\n    }\r\n  }\r\n\r\n  componentDidLoad() {\r\n    const tabCount = this.el.querySelector('[slot=\"count\"]');\r\n\r\n    if(tabCount) {\r\n        tabCount.classList.add(this.getCountTextClasses());\r\n    }\r\n  }\r\n\r\n  handleClick() {\r\n    this.tabClicked.emit();\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div \r\n      class={`tab_button_div ${this.type}\r\n      ${this.current ? 'current' : ''} \r\n      ${this.fullWidth ? 'full_width' : ''} \r\n      ${this.size}\r\n      ${this.alignment}`} \r\n      onClick={() => this.handleClick()}\r\n      >\r\n        <p class={`tab_name ${!this.current ? 'tab_text' : ''} ${this.current ? this.getCurrentTextClasses() : this.getTextClasses()}`}>{this.tabName}</p>\r\n        {this.badge && (\r\n          <gb-badge\r\n            size=\"sm\"\r\n            type=\"pill_color\"\r\n            color={\r\n              this.current ? 'information' : 'gray'\r\n            }\r\n          >\r\n            <slot name=\"count\"></slot>\r\n          </gb-badge>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}"]}

package/dist/collection/components/gb-table-cell/gb-table-cell.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class GbTableCell {
     render() {
-        return (h("div", { key: 'b91c537b65a94fefa8abd656a638909dae1b3cbe', class: "table_cell_div" }));
+        return (h("div", { key: 'b020105edf240aa0ab1c69435236bbe0810da619', class: "table_cell_div" }));
     }
     static get is() { return "gb-table-cell"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-table-header/gb-table-header.css

@@ -2866,7 +2866,7 @@
 
 /* Breakpoints (Responsiveness) */
 /* Mobile */
-@media (max-width: 700px) {
+@media (max-width: 550px) {
   .table_header_content {
     flex-direction: column;
     align-items: flex-start;
@@ -2883,12 +2883,12 @@
     width: 100%;
     align-items: flex-start;
   }
-}
 
-@media (max-width: 390px) {
-  .date_filters {
-    display: flex;
+  .table_header_div{
     flex-direction: column;
+  }
+
+  .date_filters {
     width: 100%;
   }
 
@@ -2897,4 +2897,16 @@
     width: 100%;
     max-width: none;
   }
+
+  .input_field{
+    max-width: none;
+  }
+}
+
+@media (max-width: 390px) {
+  .date_filters {
+    display: flex;
+    width: 100%;
+  }
+
 }

package/dist/collection/components/gb-table-header/gb-table-header.js

@@ -53,13 +53,14 @@ export class GbTableHeader {
         this.width = window.innerWidth;
         this.showExportDropdown = false;
         this.isDatePickerShown = false;
+        this.isDatePickerFullWidth = false;
         this.isMobile = this.width < 768;
     }
     componentDidLoad() {
         document.addEventListener('click', this.handleClickOutside);
     }
     componentWillLoad() {
-        this.updateButtonIcon(); // Set initial variant
+        this.updateParameters(); // Set initial variant
         window.addEventListener('resize', this.handleResize);
         this.dateItems.unshift('Custom');
     }
@@ -79,10 +80,11 @@ export class GbTableHeader {
     }
     handleResize() {
         this.width = window.innerWidth;
-        this.updateButtonIcon();
+        this.updateParameters();
     }
-    updateButtonIcon() {
+    updateParameters() {
         this.buttonIcon = this.width < 1007 ? 'only' : 'default';
+        this.isDatePickerFullWidth = this.width <= 700 ? true : false;
     }
     emitValue(inputValue) {
         this.inputValueChanged.emit(inputValue);
@@ -107,9 +109,10 @@ export class GbTableHeader {
     }
     disconnectedCallback() {
         document.removeEventListener('click', this.handleClickOutside);
+        window.removeEventListener('resize', this.handleResize);
     }
     render() {
-        return (h("div", { key: 'a5ea3b0b8d45ef21e4f6e9f6517f5792c243c922', class: "table_header_div" }, this.tableHeading && h("p", { key: 'f4d94649f5998561fc5ce8417dc6231fef107b88', class: "table_heading text-lg-semi-bold" }, this.tableHeadingLabel), this.showDateFilter && (h("div", { key: 'a7fe9aa5a81609635b4c9c8aca2345e47b06127a', class: "date_filters" }, h("div", { key: '5b3a0c7126dacbcb31358744a8c811bea46c72ec', class: "date_input" }, h("gb-date-picker", { key: '90f8942f34a82f8646b58d1999680bae63c59d25', mode: this.mode, disabled: this.datePickerDisabled, format: this.format, "icon-position": this.datePickerIconPosition, placeholder: this.datePickerPlaceholder, "dropdown-alignment": this.datePickerDropdownPosition, "enable-time": this.enableTime, "no-calendar": this.noCalendar, "twentyfour-hr": this.twentyfourHr, "show-months": this.showMonths, onDateChange: this.emitDateSelected.bind(this) })))), h("div", { key: '7cae5b252f3068d914f6bb180765bc674c56b55a', class: `actions ${!this.showDateFilter && !this.tableHeading ? 'full_width' : ''}` }, this.showSearch && (h("div", { key: '3c60578a612fbf7e93eb62fd88663888ee5646e1', class: "input_field" }, h("gb-input-field", { key: '86ad5a51b02eed929985c57ec295e0c851445614', size: "sm", type: "icon_leading", "icon-swap": "assets/search-01.svg", placeholder: "Search", "enable-cancel-button-function": true, onInputValueChanged: this.emitValue.bind(this) }))), h("div", { key: '3b7644b2bdbbbdc156047f2de1babddf46b37c0f', class: "action" }, this.showLayoutToggle && h("gb-button-group", { key: 'beeb640345365ce2c7651b4546dbcf95eafcef0d', items: this.items, icon: "only", onOptionChange: this.onLayoutButtonClicked.bind(this) }), this.showColumnOptions && (h("gb-button", { key: 'af47c4fdffe5a70cd8cebecc380b08d92d26f281', size: "md", hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/column-insert.svg" }, h("p", { key: 'a0ed02ad6d24f586fadd6d13fa44f706b4b7fc23' }, "Columns"))), this.showFilter && (h("gb-filter-button", { key: '8c29ba1e6f1f2c69b63a46db56c325b18c98e3a1', state: this.filterState, "icon-only": this.width <= 1007 ? true : false, onClick: () => this.onFilterButtonClicked() }, h("p", { key: 'acef789f388e68ef461188d08b7312dbdc8cad86', slot: "filter_count" }, this.filterCount))), this.showExport && (h("div", { key: '51d42de5c5aad733b8c70cc9e4cd27b300a87fca', class: "export" }, h("gb-button", { key: '4ee7db13fc0aa4532512263091a0132ba828b938', size: "md", state: this.exportButtonState, hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/file-export.svg", "icon-trailing": this.width <= 1007 ? false : true, "icon-trailing-swap": "assets/arrow-down-01.svg", onClick: () => this.toggleDropdown() }, h("p", { key: '0961c6aa2e3b3fb315849ba157dce3adf736300e' }, "Export")), this.showExportDropdown && (h("gb-export-dropdown", { key: 'c25c2e5e192e58fe8be42892c265982d4b5e510c', ref: el => (this.exportDropdown = el), "show-entire-data": this.showEntireData, "pdf-state": this.pdfState, "csv-state": this.csvState, onExportClicked: () => this.emitSelection.bind(this), class: `dropdown ${this.exportDropdownPosition}` })))), this.showRefreshButton && (h("div", { key: '310cceb71011b8f5b109d9e5edef7d7d16f57593', class: "refresh_button" }, h("gb-button", { key: '91d16c425060f47e9487fe7753065f9234155296', size: "md", hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/refresh.svg", onClick: () => this.onRefreshButtonClicked() })))))));
+        return (h("div", { key: '555356bd6c1a077b435a43c002d735e2703d5c46', class: "table_header_div" }, this.tableHeading && h("p", { key: 'ac7f4f5c5def466b85e855ed82b0517c60baf75b', class: "table_heading text-lg-semi-bold" }, this.tableHeadingLabel), this.showDateFilter && (h("div", { key: '8da552a7dd13e1773c7f45fd0380730cedd3f1ff', class: "date_filters" }, h("div", { key: '642b770bf788e08dc08bdc81ab69fb7bc74f90ab', class: "date_input" }, h("gb-date-picker", { key: '54c3f491cb8e12e0f24208fb4e12f95323ef4ce4', mode: this.mode, disabled: this.datePickerDisabled, format: this.format, "icon-position": this.datePickerIconPosition, placeholder: this.datePickerPlaceholder, "dropdown-alignment": this.datePickerDropdownPosition, "enable-time": this.enableTime, "no-calendar": this.noCalendar, "twentyfour-hr": this.twentyfourHr, "show-months": this.showMonths, "full-width": this.isDatePickerFullWidth, onDateChange: this.emitDateSelected.bind(this) })))), h("div", { key: '3493dc438154c9aec451a2d94222d1c62a7072fa', class: `actions ${!this.showDateFilter && !this.tableHeading ? 'full_width' : ''}` }, this.showSearch && (h("div", { key: 'e91ac1210935fa31afe3fbaac43c641c988652fe', class: "input_field" }, h("gb-input-field", { key: 'a1cf3d669b608cd0bfb5dbb5859aa937f715b8c9', size: "sm", type: "icon_leading", "icon-swap": "assets/search-01.svg", placeholder: "Search", "enable-cancel-button-function": true, onInputValueChanged: this.emitValue.bind(this) }))), h("div", { key: '61eef1cc59800399d62e51966ee111c999f85b18', class: "action" }, this.showLayoutToggle && h("gb-button-group", { key: '78fe92060bd99b0a4e6270613adbd7dad6b53fc5', items: this.items, icon: "only", onOptionChange: this.onLayoutButtonClicked.bind(this) }), this.showColumnOptions && (h("gb-button", { key: '1cd671400c397e9e6c6c630d7addcc5f394f60cb', size: "md", hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/column-insert.svg" }, h("p", { key: '488eed36d9f4ea099bd0d5eac6d947e8cde45dd4' }, "Columns"))), this.showFilter && (h("gb-filter-button", { key: 'd09c1b1d2ad3ef0daee043dbafe363dd6740b42e', state: this.filterState, "icon-only": this.width <= 1007 ? true : false, onClick: () => this.onFilterButtonClicked() }, h("p", { key: '8a2881743157dd1cdbe62c055c286c5afc0e2384', slot: "filter_count" }, this.filterCount))), this.showExport && (h("div", { key: '2ede0e616e35ee6d731ed27506a2810fbb03a5c7', class: "export" }, h("gb-button", { key: '9aeb1e48c2c5c3c64ae61bbb28fff2706eb1d9a5', size: "md", state: this.exportButtonState, hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/file-export.svg", "icon-trailing": this.width <= 1007 ? false : true, "icon-trailing-swap": "assets/arrow-down-01.svg", onClick: () => this.toggleDropdown() }, h("p", { key: '11667621bfda6d6c39e4c28b9e3a50654c4adb9b' }, "Export")), this.showExportDropdown && (h("gb-export-dropdown", { key: '6d3935bced33e008291c3795cd010fe7a417b293', ref: el => (this.exportDropdown = el), "show-entire-data": this.showEntireData, "pdf-state": this.pdfState, "csv-state": this.csvState, onExportClicked: () => this.emitSelection.bind(this), class: `dropdown ${this.exportDropdownPosition}` })))), this.showRefreshButton && (h("div", { key: '78d5b872922e9115c7ed493ba06766df47b274ce', class: "refresh_button" }, h("gb-button", { key: '50edc18ab64e576ae342b5e0e35ce0358fc70bf5', size: "md", hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/refresh.svg", onClick: () => this.onRefreshButtonClicked() })))))));
     }
     static get is() { return "gb-table-header"; }
     static get encapsulation() { return "shadow"; }
@@ -712,7 +715,8 @@ export class GbTableHeader {
             "width": {},
             "buttonIcon": {},
             "showExportDropdown": {},
-            "isDatePickerShown": {}
+            "isDatePickerShown": {},
+            "isDatePickerFullWidth": {}
         };
     }
     static get events() {

package/dist/collection/components/gb-table-header/gb-table-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"gb-table-header.js","sourceRoot":"","sources":["../../../src/components/gb-table-header/gb-table-header.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Listen, Prop, State, h } from '@stencil/core';\r\nimport { CloseButtonPositions, StateEnum, StateType } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-table-header',\r\n  styleUrl: 'gb-table-header.css',\r\n  shadow: true,\r\n})\r\nexport class GbTableHeader {\r\n  @Prop() showFilter: boolean = false;\r\n  @Prop() showColumnOptions: boolean = false;\r\n  @Prop() tableHeading: boolean = true;\r\n  @Prop() showSearch: boolean = false;\r\n  @Prop() showExport: boolean = false;\r\n  @Prop() showRefreshButton: boolean = false;\r\n  @Prop() tableHeadingLabel: string = '';\r\n  @Prop() showLayoutToggle: boolean = false;\r\n  @Prop() filterState: StateType;\r\n  @Prop() filterCount: number = 0;\r\n  @Prop() showEntireData: boolean = false;\r\n  @Prop() exportButtonState: StateType = 'default';\r\n  @Prop() pdfState: StateEnum = StateEnum.Default;\r\n  @Prop() csvState: StateEnum = StateEnum.Default;\r\n  @Prop() showDateFilter: boolean = false;\r\n  @State() items = [\r\n    { label: 'grid', current: false, icon: 'assets/grid-view.svg' },\r\n    { label: 'list', current: true, icon: 'assets/left-to-right-list-dash.svg' },\r\n  ];\r\n  @Prop() dateItems: any[] = [\r\n    // { name: 'Mock Item A iusbrviubw vwiuhvw vwiurhvwr vwoiuh', username: 1 },\r\n    // { name: 'Mock Item B', username: 3 },\r\n    // { name: 'Mock Item C', username: 3 },\r\n    // { name: 'Mock Item D', username: 3 },\r\n    // { name: 'Mock Item E', username: 3 },\r\n    // 45,\r\n    // 50,\r\n    // 20,\r\n    // 25,\r\n    // 90,\r\n    // 92,\r\n    // 53,\r\n    // 'Activated',\r\n    // 'Deactivated',\r\n    // 'John Doe',\r\n    // 'John smith',\r\n    // 'Jane leo'\r\n  ];\r\n  @Prop() mode: 'single' | 'range' = 'single';\r\n  @Prop() format: string = 'M j, Y';\r\n  @Prop() datePickerDisabled: boolean = false;\r\n  @Prop() datePickerPlaceholder: string = 'Start date - end date';\r\n  @Prop() datePickerIconPosition: CloseButtonPositions = 'left';\r\n  @Prop() datePickerDropdownPosition: CloseButtonPositions = 'right';\r\n  @Prop() exportDropdownPosition: CloseButtonPositions = 'right';\r\n  @Prop() enableTime: boolean = false;\r\n  @Prop() noCalendar: boolean = false;\r\n  @Prop() twentyfourHr: boolean = false;\r\n  @Prop() showMonths: number = 2;\r\n  @State() width: number = window.innerWidth;\r\n  @State() buttonIcon: 'default' | 'only';\r\n  @State() showExportDropdown: boolean = false;\r\n  @State() isDatePickerShown: boolean = false;\r\n  @Event() inputValueChanged: EventEmitter<void>;\r\n  @Event() filterButtonClicked: EventEmitter<void>;\r\n  @Event() exportClicked: EventEmitter<void>;\r\n  @Event() refreshButtonClicked: EventEmitter<void>;\r\n  @Event() layoutButtonClicked: EventEmitter<string>;\r\n  @Event() dateChange: EventEmitter<string | string[]>;\r\n  @Element() el: HTMLElement;\r\n\r\n  exportDropdown!: HTMLElement;\r\n\r\n  isMobile = this.width < 768;\r\n\r\n  componentDidLoad() {\r\n    document.addEventListener('click', this.handleClickOutside);\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.updateButtonIcon(); // Set initial variant\r\n    window.addEventListener('resize', this.handleResize);\r\n    this.dateItems.unshift('Custom');\r\n  }\r\n\r\n  extractDropdownItemSelected(item) {\r\n    if (item.detail === 'Custom') {\r\n      this.isDatePickerShown = true;\r\n    } else {\r\n      this.isDatePickerShown = false;\r\n    }\r\n  }\r\n\r\n  emitDateSelected(date) {\r\n    this.dateChange.emit(date.detail);\r\n  }\r\n\r\n  toggleDropdown() {\r\n    this.showExportDropdown = !this.showExportDropdown;\r\n  }\r\n\r\n  @Listen('resize', { target: 'window' })\r\n  handleResize() {\r\n    this.width = window.innerWidth;\r\n    this.updateButtonIcon();\r\n  }\r\n\r\n  private updateButtonIcon() {\r\n    this.buttonIcon = this.width < 1007 ? 'only' : 'default';\r\n  }\r\n\r\n  emitValue(inputValue) {\r\n    this.inputValueChanged.emit(inputValue);\r\n  }\r\n\r\n  onFilterButtonClicked() {\r\n    this.filterButtonClicked.emit();\r\n  }\r\n\r\n  emitSelection(selection) {\r\n    this.exportClicked.emit(selection);\r\n  }\r\n\r\n  onRefreshButtonClicked() {\r\n    this.refreshButtonClicked.emit();\r\n  }\r\n\r\n  onLayoutButtonClicked(layout) {\r\n    // console.log(layout.detail)\r\n    this.layoutButtonClicked.emit(layout.detail);\r\n  }\r\n\r\n  @Listen('click', { target: 'document' })\r\n  handleClickOutside(event: MouseEvent) {\r\n    if (this.showExportDropdown && !this.el.contains(event.target as Node)) {\r\n      this.showExportDropdown = false;\r\n    }\r\n  }\r\n\r\n  disconnectedCallback() {\r\n    document.removeEventListener('click', this.handleClickOutside);\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"table_header_div\">\r\n        {this.tableHeading && <p class=\"table_heading text-lg-semi-bold\">{this.tableHeadingLabel}</p>}\r\n        {this.showDateFilter && (\r\n          <div class=\"date_filters\">\r\n            {/* <div class=\"date_dropdown\">\r\n              <gb-input-dropdown\r\n                show-placeholder=\"true\"\r\n                placeholder=\"Select a period\"\r\n                size=\"sm\"\r\n                state=\"default\"\r\n                type=\"icon_leading\"\r\n                color=\"blue\"\r\n                show-leading-icon=\"true\"\r\n                leading-icon=\"assets/calendar-02.svg\"\r\n                menu-position=\"bottom\"\r\n                icon=\"false\"\r\n                items={this.dateItems}\r\n                onDropdownItemSelected={this.extractDropdownIt1emSelected.bind(this)}\r\n              >\r\n                <h1 slot=\"initials\">EK</h1>\r\n                <p slot=\"tooltip_label\">This is a label</p>\r\n                <p slot=\"tooltip_supporting_text\">This is a supporting text for the tooltip</p>\r\n              </gb-input-dropdown>\r\n            </div> */}\r\n            <div class=\"date_input\">\r\n              <gb-date-picker\r\n                mode={this.mode}\r\n                disabled={this.datePickerDisabled}\r\n                format={this.format}\r\n                icon-position={this.datePickerIconPosition}\r\n                placeholder={this.datePickerPlaceholder}\r\n                dropdown-alignment={this.datePickerDropdownPosition}\r\n                enable-time={this.enableTime}\r\n                no-calendar={this.noCalendar}\r\n                twentyfour-hr={this.twentyfourHr}\r\n                show-months={this.showMonths}\r\n                onDateChange={this.emitDateSelected.bind(this)}\r\n              ></gb-date-picker>\r\n            </div>\r\n          </div>\r\n        )}\r\n        <div class={`actions ${!this.showDateFilter && !this.tableHeading ? 'full_width' : ''}`}>\r\n          {this.showSearch && (\r\n            <div class=\"input_field\">\r\n              <gb-input-field\r\n                size=\"sm\"\r\n                type=\"icon_leading\"\r\n                icon-swap=\"assets/search-01.svg\"\r\n                placeholder=\"Search\"\r\n                enable-cancel-button-function={true}\r\n                onInputValueChanged={this.emitValue.bind(this)}\r\n              ></gb-input-field>\r\n            </div>\r\n          )}\r\n          <div class=\"action\">\r\n            {this.showLayoutToggle && <gb-button-group items={this.items} icon=\"only\" onOptionChange={this.onLayoutButtonClicked.bind(this)}></gb-button-group>}\r\n            {this.showColumnOptions && (\r\n              <gb-button size=\"md\" hierarchy=\"secondary_gray\" icon={this.width <= 1007 ? 'only' : 'default'} icon-leading={true} icon-leading-swap=\"assets/column-insert.svg\">\r\n                <p>Columns</p>\r\n              </gb-button>\r\n            )}\r\n            {this.showFilter && (\r\n              <gb-filter-button state={this.filterState} icon-only={this.width <= 1007 ? true : false} onClick={() => this.onFilterButtonClicked()}>\r\n                <p slot=\"filter_count\">{this.filterCount}</p>\r\n              </gb-filter-button>\r\n            )}\r\n            {this.showExport && (\r\n              <div class=\"export\">\r\n                <gb-button\r\n                  size=\"md\"\r\n                  state={this.exportButtonState}\r\n                  hierarchy=\"secondary_gray\"\r\n                  icon={this.width <= 1007 ? 'only' : 'default'}\r\n                  icon-leading={true}\r\n                  icon-leading-swap=\"assets/file-export.svg\"\r\n                  icon-trailing={this.width <= 1007 ? false : true}\r\n                  icon-trailing-swap=\"assets/arrow-down-01.svg\"\r\n                  onClick={() => this.toggleDropdown()}\r\n                >\r\n                  <p>Export</p>\r\n                </gb-button>\r\n                {this.showExportDropdown && (\r\n                  <gb-export-dropdown\r\n                    ref={el => (this.exportDropdown = el)}\r\n                    show-entire-data={this.showEntireData}\r\n                    pdf-state={this.pdfState}\r\n                    csv-state={this.csvState}\r\n                    onExportClicked={() => this.emitSelection.bind(this)}\r\n                    class={`dropdown ${this.exportDropdownPosition}`}\r\n                  ></gb-export-dropdown>\r\n                )}\r\n              </div>\r\n            )}\r\n            {this.showRefreshButton && (\r\n              <div class=\"refresh_button\">\r\n                <gb-button\r\n                  size=\"md\"\r\n                  hierarchy=\"secondary_gray\"\r\n                  icon={this.width <= 1007 ? 'only' : 'default'}\r\n                  icon-leading={true}\r\n                  icon-leading-swap=\"assets/refresh.svg\"\r\n                  onClick={() => this.onRefreshButtonClicked()}\r\n                ></gb-button>\r\n              </div>\r\n            )}\r\n          </div>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"gb-table-header.js","sourceRoot":"","sources":["../../../src/components/gb-table-header/gb-table-header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAChG,OAAO,EAAwB,SAAS,EAAa,MAAM,6BAA6B,CAAC;AAOzF,MAAM,OAAO,aAAa;IAL1B;QAMU,eAAU,GAAY,KAAK,CAAC;QAC5B,sBAAiB,GAAY,KAAK,CAAC;QACnC,iBAAY,GAAY,IAAI,CAAC;QAC7B,eAAU,GAAY,KAAK,CAAC;QAC5B,eAAU,GAAY,KAAK,CAAC;QAC5B,sBAAiB,GAAY,KAAK,CAAC;QACnC,sBAAiB,GAAW,EAAE,CAAC;QAC/B,qBAAgB,GAAY,KAAK,CAAC;QAElC,gBAAW,GAAW,CAAC,CAAC;QACxB,mBAAc,GAAY,KAAK,CAAC;QAChC,sBAAiB,GAAc,SAAS,CAAC;QACzC,aAAQ,GAAc,SAAS,CAAC,OAAO,CAAC;QACxC,aAAQ,GAAc,SAAS,CAAC,OAAO,CAAC;QACxC,mBAAc,GAAY,KAAK,CAAC;QAC/B,UAAK,GAAG;YACf,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,sBAAsB,EAAE;YAC/D,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,oCAAoC,EAAE;SAC7E,CAAC;QACM,cAAS,GAAU;QACzB,4EAA4E;QAC5E,wCAAwC;QACxC,wCAAwC;QACxC,wCAAwC;QACxC,wCAAwC;QACxC,MAAM;QACN,MAAM;QACN,MAAM;QACN,MAAM;QACN,MAAM;QACN,MAAM;QACN,MAAM;QACN,eAAe;QACf,iBAAiB;QACjB,cAAc;QACd,gBAAgB;QAChB,aAAa;SACd,CAAC;QACM,SAAI,GAAuB,QAAQ,CAAC;QACpC,WAAM,GAAW,QAAQ,CAAC;QAC1B,uBAAkB,GAAY,KAAK,CAAC;QACpC,0BAAqB,GAAW,uBAAuB,CAAC;QACxD,2BAAsB,GAAyB,MAAM,CAAC;QACtD,+BAA0B,GAAyB,OAAO,CAAC;QAC3D,2BAAsB,GAAyB,OAAO,CAAC;QACvD,eAAU,GAAY,KAAK,CAAC;QAC5B,eAAU,GAAY,KAAK,CAAC;QAC5B,iBAAY,GAAY,KAAK,CAAC;QAC9B,eAAU,GAAW,CAAC,CAAC;QACtB,UAAK,GAAW,MAAM,CAAC,UAAU,CAAC;QAElC,uBAAkB,GAAY,KAAK,CAAC;QACpC,sBAAiB,GAAY,KAAK,CAAC;QACnC,0BAAqB,GAAY,KAAK,CAAC;QAWhD,aAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,GAAG,CAAC;KAyL7B;IAvLC,gBAAgB;QACd,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;IAC9D,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC,sBAAsB;QAC/C,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;QACrD,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IACnC,CAAC;IAED,2BAA2B,CAAC,IAAI;QAC9B,IAAI,IAAI,CAAC,MAAM,KAAK,QAAQ,EAAE,CAAC;YAC7B,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC;QAChC,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC;QACjC,CAAC;IACH,CAAC;IAED,gBAAgB,CAAC,IAAI;QACnB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IACpC,CAAC;IAED,cAAc;QACZ,IAAI,CAAC,kBAAkB,GAAG,CAAC,IAAI,CAAC,kBAAkB,CAAC;IACrD,CAAC;IAGD,YAAY;QACV,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC;QAC/B,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAC1B,CAAC;IAEO,gBAAgB;QACtB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC;QACzD,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,KAAK,IAAI,GAAG,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAChE,CAAC;IAED,SAAS,CAAC,UAAU;QAClB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IAC1C,CAAC;IAED,qBAAqB;QACnB,IAAI,CAAC,mBAAmB,CAAC,IAAI,EAAE,CAAC;IAClC,CAAC;IAED,aAAa,CAAC,SAAS;QACrB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IACrC,CAAC;IAED,sBAAsB;QACpB,IAAI,CAAC,oBAAoB,CAAC,IAAI,EAAE,CAAC;IACnC,CAAC;IAED,qBAAqB,CAAC,MAAM;QAC1B,6BAA6B;QAC7B,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;IAC/C,CAAC;IAGD,kBAAkB,CAAC,KAAiB;QAClC,IAAI,IAAI,CAAC,kBAAkB,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,EAAE,CAAC;YACvE,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;QAClC,CAAC;IACH,CAAC;IAED,oBAAoB;QAClB,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAC/D,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;IAC1D,CAAC;IAED,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,kBAAkB;YAC1B,IAAI,CAAC,YAAY,IAAI,0DAAG,KAAK,EAAC,iCAAiC,IAAE,IAAI,CAAC,iBAAiB,CAAK;YAC5F,IAAI,CAAC,cAAc,IAAI,CACtB,4DAAK,KAAK,EAAC,cAAc;gBAqBvB,4DAAK,KAAK,EAAC,YAAY;oBACrB,uEACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,kBAAkB,EACjC,MAAM,EAAE,IAAI,CAAC,MAAM,mBACJ,IAAI,CAAC,sBAAsB,EAC1C,WAAW,EAAE,IAAI,CAAC,qBAAqB,wBACnB,IAAI,CAAC,0BAA0B,iBACtC,IAAI,CAAC,UAAU,iBACf,IAAI,CAAC,UAAU,mBACb,IAAI,CAAC,YAAY,iBACnB,IAAI,CAAC,UAAU,gBAChB,IAAI,CAAC,qBAAqB,EACtC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,GAC9B,CACd,CACF,CACP;YACD,4DAAK,KAAK,EAAE,WAAW,CAAC,IAAI,CAAC,cAAc,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE;gBACpF,IAAI,CAAC,UAAU,IAAI,CAClB,4DAAK,KAAK,EAAC,aAAa;oBACtB,uEACE,IAAI,EAAC,IAAI,EACT,IAAI,EAAC,cAAc,eACT,sBAAsB,EAChC,WAAW,EAAC,QAAQ,mCACW,IAAI,EACnC,mBAAmB,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,GAC9B,CACd,CACP;gBACD,4DAAK,KAAK,EAAC,QAAQ;oBAChB,IAAI,CAAC,gBAAgB,IAAI,wEAAiB,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,EAAC,MAAM,EAAC,cAAc,EAAE,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,GAAoB;oBAClJ,IAAI,CAAC,iBAAiB,IAAI,CACzB,kEAAW,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,kBAAgB,IAAI,uBAAoB,0BAA0B;wBAC7J,sEAAc,CACJ,CACb;oBACA,IAAI,CAAC,UAAU,IAAI,CAClB,yEAAkB,KAAK,EAAE,IAAI,CAAC,WAAW,eAAa,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,qBAAqB,EAAE;wBAClI,0DAAG,IAAI,EAAC,cAAc,IAAE,IAAI,CAAC,WAAW,CAAK,CAC5B,CACpB;oBACA,IAAI,CAAC,UAAU,IAAI,CAClB,4DAAK,KAAK,EAAC,QAAQ;wBACjB,kEACE,IAAI,EAAC,IAAI,EACT,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAC7B,SAAS,EAAC,gBAAgB,EAC1B,IAAI,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,kBAC/B,IAAI,uBACA,wBAAwB,mBAC3B,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,wBAC7B,0BAA0B,EAC7C,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,cAAc,EAAE;4BAEpC,qEAAa,CACH;wBACX,IAAI,CAAC,kBAAkB,IAAI,CAC1B,2EACE,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC,sBACnB,IAAI,CAAC,cAAc,eAC1B,IAAI,CAAC,QAAQ,eACb,IAAI,CAAC,QAAQ,EACxB,eAAe,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,EACpD,KAAK,EAAE,YAAY,IAAI,CAAC,sBAAsB,EAAE,GAC5B,CACvB,CACG,CACP;oBACA,IAAI,CAAC,iBAAiB,IAAI,CACzB,4DAAK,KAAK,EAAC,gBAAgB;wBACzB,kEACE,IAAI,EAAC,IAAI,EACT,SAAS,EAAC,gBAAgB,EAC1B,IAAI,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,kBAC/B,IAAI,uBACA,oBAAoB,EACtC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,sBAAsB,EAAE,GACjC,CACT,CACP,CACG,CACF,CACF,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Event, EventEmitter, Listen, Prop, State, h } from '@stencil/core';\r\nimport { CloseButtonPositions, StateEnum, StateType } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-table-header',\r\n  styleUrl: 'gb-table-header.css',\r\n  shadow: true,\r\n})\r\nexport class GbTableHeader {\r\n  @Prop() showFilter: boolean = false;\r\n  @Prop() showColumnOptions: boolean = false;\r\n  @Prop() tableHeading: boolean = true;\r\n  @Prop() showSearch: boolean = false;\r\n  @Prop() showExport: boolean = false;\r\n  @Prop() showRefreshButton: boolean = false;\r\n  @Prop() tableHeadingLabel: string = '';\r\n  @Prop() showLayoutToggle: boolean = false;\r\n  @Prop() filterState: StateType;\r\n  @Prop() filterCount: number = 0;\r\n  @Prop() showEntireData: boolean = false;\r\n  @Prop() exportButtonState: StateType = 'default';\r\n  @Prop() pdfState: StateEnum = StateEnum.Default;\r\n  @Prop() csvState: StateEnum = StateEnum.Default;\r\n  @Prop() showDateFilter: boolean = false;\r\n  @State() items = [\r\n    { label: 'grid', current: false, icon: 'assets/grid-view.svg' },\r\n    { label: 'list', current: true, icon: 'assets/left-to-right-list-dash.svg' },\r\n  ];\r\n  @Prop() dateItems: any[] = [\r\n    // { name: 'Mock Item A iusbrviubw vwiuhvw vwiurhvwr vwoiuh', username: 1 },\r\n    // { name: 'Mock Item B', username: 3 },\r\n    // { name: 'Mock Item C', username: 3 },\r\n    // { name: 'Mock Item D', username: 3 },\r\n    // { name: 'Mock Item E', username: 3 },\r\n    // 45,\r\n    // 50,\r\n    // 20,\r\n    // 25,\r\n    // 90,\r\n    // 92,\r\n    // 53,\r\n    // 'Activated',\r\n    // 'Deactivated',\r\n    // 'John Doe',\r\n    // 'John smith',\r\n    // 'Jane leo'\r\n  ];\r\n  @Prop() mode: 'single' | 'range' = 'single';\r\n  @Prop() format: string = 'M j, Y';\r\n  @Prop() datePickerDisabled: boolean = false;\r\n  @Prop() datePickerPlaceholder: string = 'Start date - end date';\r\n  @Prop() datePickerIconPosition: CloseButtonPositions = 'left';\r\n  @Prop() datePickerDropdownPosition: CloseButtonPositions = 'right';\r\n  @Prop() exportDropdownPosition: CloseButtonPositions = 'right';\r\n  @Prop() enableTime: boolean = false;\r\n  @Prop() noCalendar: boolean = false;\r\n  @Prop() twentyfourHr: boolean = false;\r\n  @Prop() showMonths: number = 2;\r\n  @State() width: number = window.innerWidth;\r\n  @State() buttonIcon: 'default' | 'only';\r\n  @State() showExportDropdown: boolean = false;\r\n  @State() isDatePickerShown: boolean = false;\r\n  @State() isDatePickerFullWidth: boolean = false;\r\n  @Event() inputValueChanged: EventEmitter<void>;\r\n  @Event() filterButtonClicked: EventEmitter<void>;\r\n  @Event() exportClicked: EventEmitter<void>;\r\n  @Event() refreshButtonClicked: EventEmitter<void>;\r\n  @Event() layoutButtonClicked: EventEmitter<string>;\r\n  @Event() dateChange: EventEmitter<string | string[]>;\r\n  @Element() el: HTMLElement;\r\n\r\n  exportDropdown!: HTMLElement;\r\n\r\n  isMobile = this.width < 768;\r\n\r\n  componentDidLoad() {\r\n    document.addEventListener('click', this.handleClickOutside);\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.updateParameters(); // Set initial variant\r\n    window.addEventListener('resize', this.handleResize);\r\n    this.dateItems.unshift('Custom');\r\n  }\r\n\r\n  extractDropdownItemSelected(item) {\r\n    if (item.detail === 'Custom') {\r\n      this.isDatePickerShown = true;\r\n    } else {\r\n      this.isDatePickerShown = false;\r\n    }\r\n  }\r\n\r\n  emitDateSelected(date) {\r\n    this.dateChange.emit(date.detail);\r\n  }\r\n\r\n  toggleDropdown() {\r\n    this.showExportDropdown = !this.showExportDropdown;\r\n  }\r\n\r\n  @Listen('resize', { target: 'window' })\r\n  handleResize() {\r\n    this.width = window.innerWidth;\r\n    this.updateParameters();\r\n  }\r\n\r\n  private updateParameters() {\r\n    this.buttonIcon = this.width < 1007 ? 'only' : 'default';\r\n    this.isDatePickerFullWidth = this.width <= 700 ? true : false;\r\n  }\r\n\r\n  emitValue(inputValue) {\r\n    this.inputValueChanged.emit(inputValue);\r\n  }\r\n\r\n  onFilterButtonClicked() {\r\n    this.filterButtonClicked.emit();\r\n  }\r\n\r\n  emitSelection(selection) {\r\n    this.exportClicked.emit(selection);\r\n  }\r\n\r\n  onRefreshButtonClicked() {\r\n    this.refreshButtonClicked.emit();\r\n  }\r\n\r\n  onLayoutButtonClicked(layout) {\r\n    // console.log(layout.detail)\r\n    this.layoutButtonClicked.emit(layout.detail);\r\n  }\r\n\r\n  @Listen('click', { target: 'document' })\r\n  handleClickOutside(event: MouseEvent) {\r\n    if (this.showExportDropdown && !this.el.contains(event.target as Node)) {\r\n      this.showExportDropdown = false;\r\n    }\r\n  }\r\n\r\n  disconnectedCallback() {\r\n    document.removeEventListener('click', this.handleClickOutside);\r\n    window.removeEventListener('resize', this.handleResize);\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"table_header_div\">\r\n        {this.tableHeading && <p class=\"table_heading text-lg-semi-bold\">{this.tableHeadingLabel}</p>}\r\n        {this.showDateFilter && (\r\n          <div class=\"date_filters\">\r\n            {/* <div class=\"date_dropdown\">\r\n              <gb-input-dropdown\r\n                show-placeholder=\"true\"\r\n                placeholder=\"Select a period\"\r\n                size=\"sm\"\r\n                state=\"default\"\r\n                type=\"icon_leading\"\r\n                color=\"blue\"\r\n                show-leading-icon=\"true\"\r\n                leading-icon=\"assets/calendar-02.svg\"\r\n                menu-position=\"bottom\"\r\n                icon=\"false\"\r\n                items={this.dateItems}\r\n                onDropdownItemSelected={this.extractDropdownIt1emSelected.bind(this)}\r\n              >\r\n                <h1 slot=\"initials\">EK</h1>\r\n                <p slot=\"tooltip_label\">This is a label</p>\r\n                <p slot=\"tooltip_supporting_text\">This is a supporting text for the tooltip</p>\r\n              </gb-input-dropdown>\r\n            </div> */}\r\n            <div class=\"date_input\">\r\n              <gb-date-picker\r\n                mode={this.mode}\r\n                disabled={this.datePickerDisabled}\r\n                format={this.format}\r\n                icon-position={this.datePickerIconPosition}\r\n                placeholder={this.datePickerPlaceholder}\r\n                dropdown-alignment={this.datePickerDropdownPosition}\r\n                enable-time={this.enableTime}\r\n                no-calendar={this.noCalendar}\r\n                twentyfour-hr={this.twentyfourHr}\r\n                show-months={this.showMonths}\r\n                full-width={this.isDatePickerFullWidth}\r\n                onDateChange={this.emitDateSelected.bind(this)}\r\n              ></gb-date-picker>\r\n            </div>\r\n          </div>\r\n        )}\r\n        <div class={`actions ${!this.showDateFilter && !this.tableHeading ? 'full_width' : ''}`}>\r\n          {this.showSearch && (\r\n            <div class=\"input_field\">\r\n              <gb-input-field\r\n                size=\"sm\"\r\n                type=\"icon_leading\"\r\n                icon-swap=\"assets/search-01.svg\"\r\n                placeholder=\"Search\"\r\n                enable-cancel-button-function={true}\r\n                onInputValueChanged={this.emitValue.bind(this)}\r\n              ></gb-input-field>\r\n            </div>\r\n          )}\r\n          <div class=\"action\">\r\n            {this.showLayoutToggle && <gb-button-group items={this.items} icon=\"only\" onOptionChange={this.onLayoutButtonClicked.bind(this)}></gb-button-group>}\r\n            {this.showColumnOptions && (\r\n              <gb-button size=\"md\" hierarchy=\"secondary_gray\" icon={this.width <= 1007 ? 'only' : 'default'} icon-leading={true} icon-leading-swap=\"assets/column-insert.svg\">\r\n                <p>Columns</p>\r\n              </gb-button>\r\n            )}\r\n            {this.showFilter && (\r\n              <gb-filter-button state={this.filterState} icon-only={this.width <= 1007 ? true : false} onClick={() => this.onFilterButtonClicked()}>\r\n                <p slot=\"filter_count\">{this.filterCount}</p>\r\n              </gb-filter-button>\r\n            )}\r\n            {this.showExport && (\r\n              <div class=\"export\">\r\n                <gb-button\r\n                  size=\"md\"\r\n                  state={this.exportButtonState}\r\n                  hierarchy=\"secondary_gray\"\r\n                  icon={this.width <= 1007 ? 'only' : 'default'}\r\n                  icon-leading={true}\r\n                  icon-leading-swap=\"assets/file-export.svg\"\r\n                  icon-trailing={this.width <= 1007 ? false : true}\r\n                  icon-trailing-swap=\"assets/arrow-down-01.svg\"\r\n                  onClick={() => this.toggleDropdown()}\r\n                >\r\n                  <p>Export</p>\r\n                </gb-button>\r\n                {this.showExportDropdown && (\r\n                  <gb-export-dropdown\r\n                    ref={el => (this.exportDropdown = el)}\r\n                    show-entire-data={this.showEntireData}\r\n                    pdf-state={this.pdfState}\r\n                    csv-state={this.csvState}\r\n                    onExportClicked={() => this.emitSelection.bind(this)}\r\n                    class={`dropdown ${this.exportDropdownPosition}`}\r\n                  ></gb-export-dropdown>\r\n                )}\r\n              </div>\r\n            )}\r\n            {this.showRefreshButton && (\r\n              <div class=\"refresh_button\">\r\n                <gb-button\r\n                  size=\"md\"\r\n                  hierarchy=\"secondary_gray\"\r\n                  icon={this.width <= 1007 ? 'only' : 'default'}\r\n                  icon-leading={true}\r\n                  icon-leading-swap=\"assets/refresh.svg\"\r\n                  onClick={() => this.onRefreshButtonClicked()}\r\n                ></gb-button>\r\n              </div>\r\n            )}\r\n          </div>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/gb-tag/gb-tag.js

@@ -22,7 +22,7 @@ export class GbTag {
     }
     render() {
         const flagSwap = getAssetPath(`${this.flagSwap}`);
-        return (h("div", { key: 'c0e7682acf8b08f6db5d854dd8893f1e5a150301', class: `container ${this.size} ${this.action}` }, h("div", { key: '7ece1477b461406f2976e407766b3413eb115f39', class: `content ${this.size}` }, this.checkbox && h("gb-tag-checkbox", { key: 'c78249555da25e85d3e788a131c469ae986ea710', size: this.size }), this.icon === 'false' && h(Fragment, null), this.icon === 'country' && (h("div", { key: 'bc5ee3ef313fe3b6f3e98d5a18dc3621bdf4a301', class: "icon left-icon" }, h("img", { key: 'df58c910551201df491992e24979a53d314d4cd8', src: flagSwap, alt: "Country Icon" }))), this.icon === 'avatar' && (h("gb-avatar", { key: '3a0c2b52bb33b5f3cf30b8f0c63d8c006c6148d5', class: "avatar-icon", size: "xxs", "status-icon": "false", text: false, color: "gray" }, h("slot", { key: '7fa914457dbc7a507be3da1f58d5258030d20086', name: "image", slot: "image" }))), this.icon === 'dot' && (h("svg", { key: '75419330469f243ada051f35166798a0b39c46df', xmlns: "http://www.w3.org/2000/svg", width: "8", height: "8", viewBox: "0 0 8 8", fill: "none" }, h("circle", { key: '43d628f566fe71a98f739dc84f4eda962aefc37e', cx: "4", cy: "4", r: "3", fill: "#17B26A" }))), h("div", { key: 'f85185df6d5154ce5f3420d1f67ecde10198426c', class: "label" }, h("slot", { key: '68889fecefe4f586891adf2a22cad50bb8e6a0df' })), this.action === 'count' && (h("gb-tag-count", { key: 'e98a53407de5ec0586c735978b8bf325b9ef5741', size: this.size }, h("slot", { key: 'bd054b4364c757c5ba0f134c143b930b04ead471', slot: "count", name: "count" })))), this.action === 'X_close' && h("gb-tag-close", { key: 'a4e5ee33e6aca18b9fca1459151ac0aa5ea2e0e8', size: this.size, onClick: () => this.onTagClose() })));
+        return (h("div", { key: '33b76f8d1ec5159ada3aaf77d981880b415e8ce4', class: `container ${this.size} ${this.action}` }, h("div", { key: 'fb63f12b60410f76a7b3c7c9a0401c73bdad7899', class: `content ${this.size}` }, this.checkbox && h("gb-tag-checkbox", { key: '6a64f9ee342d5f44723eb0f2b12e285009a80202', size: this.size }), this.icon === 'false' && h(Fragment, null), this.icon === 'country' && (h("div", { key: 'b069819c181ad7bb1d3a099575f5b80f97ac6618', class: "icon left-icon" }, h("img", { key: '67773bf27310a8f86740c3d97829ef0e47108ceb', src: flagSwap, alt: "Country Icon" }))), this.icon === 'avatar' && (h("gb-avatar", { key: 'a811e0ef65f7448e81eb4b0e7bdcdc5e60e72b68', class: "avatar-icon", size: "xxs", "status-icon": "false", text: false, color: "gray" }, h("slot", { key: '0c35e8a1a0ce6e4050d859f39ac4a848d262e65a', name: "image", slot: "image" }))), this.icon === 'dot' && (h("svg", { key: '778357bea975096f8efb6be423d5dfdc093fbfad', xmlns: "http://www.w3.org/2000/svg", width: "8", height: "8", viewBox: "0 0 8 8", fill: "none" }, h("circle", { key: '9d4aa673410ee89180dfdcc0cae59737f1e036c0', cx: "4", cy: "4", r: "3", fill: "#17B26A" }))), h("div", { key: '98a2ee8f5f3050771cfcbaff16f7760612761180', class: "label" }, h("slot", { key: '419ded3ec089df75a3b848f5a65943099139a7c2' })), this.action === 'count' && (h("gb-tag-count", { key: '71dd4f3259a6967686f5f7494333acea04a2bca7', size: this.size }, h("slot", { key: 'f3210f12b3ddcff56f3d41160de8a0dbe740841e', slot: "count", name: "count" })))), this.action === 'X_close' && h("gb-tag-close", { key: '70dbed58ffcc81011933c5c14721ef360de71619', size: this.size, onClick: () => this.onTagClose() })));
     }
     static get is() { return "gb-tag"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-tag-checkbox/gb-tag-checkbox.js

@@ -6,7 +6,7 @@ export class GbTagCheckbox {
         this.disabled = false;
     }
     render() {
-        return (h("label", { key: '05711e9f8dd7b3c0be4be433a04c5ba427067cf4', class: `checkbox-container ${this.size} ${this.disabled ? 'disabled' : ''}` }, h("input", { key: '65b6c701401580b11557aef928d8d5d3ce665237', type: "checkbox", checked: this.checked, disabled: this.disabled }), h("span", { key: 'edee16c4dfeddbb66243e6fbc7a0e884a50831d8', class: `custom-checkbox ${this.size}` }, h("svg", { key: 'e90b505c359bd9902626a9d596cdb7b6304d591d', class: "checkmark", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 12 12", fill: "none" }, h("path", { key: '92fdf9531710921282b591c054604047bb4fef33', d: "M2.5 7.25C2.5 7.25 3.25 7.25 4.25 9C4.25 9 7.02941 4.41667 9.5 3.5", stroke: "white", "stroke-width": "1.71429", "stroke-linecap": "round", "stroke-linejoin": "round" })))));
+        return (h("label", { key: '0a11dc171b29d56084453b88f58f27b2be158e5a', class: `checkbox-container ${this.size} ${this.disabled ? 'disabled' : ''}` }, h("input", { key: '13537c4a4a9f7943c9d4199d078e08a7a2346153', type: "checkbox", checked: this.checked, disabled: this.disabled }), h("span", { key: 'b290156fcd9940493118c7223bdf0f9d95c61701', class: `custom-checkbox ${this.size}` }, h("svg", { key: 'c1bbb5c7e2b871c73fced1bff292d8a19eaf8c7b', class: "checkmark", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 12 12", fill: "none" }, h("path", { key: 'a6479ac8a7b37c78a9598bc23eab35792d6edf23', d: "M2.5 7.25C2.5 7.25 3.25 7.25 4.25 9C4.25 9 7.02941 4.41667 9.5 3.5", stroke: "white", "stroke-width": "1.71429", "stroke-linecap": "round", "stroke-linejoin": "round" })))));
     }
     static get is() { return "gb-tag-checkbox"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-tag-close/gb-tag-close.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class GbTagClose {
     render() {
-        return (h("div", { key: 'dec3b8ee4ad44581ac2d86717a6bb8a962074d35', class: this.size }, h("svg", { key: '62bcbb8e5737d036ff62ba50c0e87d9870bbcab0', xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none" }, h("path", { key: '5c239e7de354166b761077c187203140beae0c21', d: "M7.91683 2.08328L2.0835 7.91662M2.0835 2.08328L7.91683 7.91662", stroke: "#4B5565", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))));
+        return (h("div", { key: '76f2b21eae38c2071dba03cb82ce11e3f96ab295', class: this.size }, h("svg", { key: 'bbcabacf398ffe528f95558b3b1407afe80aecae', xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none" }, h("path", { key: 'd917921a80fe35a4faa02c1d38b23e679e4816d6', d: "M7.91683 2.08328L2.0835 7.91662M2.0835 2.08328L7.91683 7.91662", stroke: "#4B5565", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))));
     }
     static get is() { return "gb-tag-close"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-tag-count/gb-tag-count.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class GbTagCount {
     render() {
-        return (h("div", { key: '3ce4d2a69b2aa198319f4037485171ba861a7bfe', class: this.size }, h("slot", { key: '5c10d6cfadc364d74c76ee1435ac4cbbdb6546b6', name: "count" })));
+        return (h("div", { key: 'bebe0e26c111b53bfcb25ca80a6aa21f37a7a947', class: this.size }, h("slot", { key: '0bd0fca4bff5668330f59359da738541c6695d3e', name: "count" })));
     }
     static get is() { return "gb-tag-count"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-textarea-input-field/gb-textarea-input-field.css

@@ -2891,8 +2891,8 @@
     color: var(--color-text-subtle, #697586);
 }
 
-.hint_text.destructive{
-    color: var(--color-border-danger, #B51726);
+.error_text{
+    color: var(--color-text-danger, #B51726);
 }
 
 .dropdown_menu{

package/dist/collection/components/gb-textarea-input-field/gb-textarea-input-field.js

@@ -203,12 +203,12 @@ export class GbTextareaInputField {
         }
     }
     render() {
-        return (h("div", { key: 'a53e765e2ca07c10f403726035f8b21721b93354', class: "textarea_container" }, h("div", { key: '91c5d41aef3942e1b506efed4e389a18f9d71b27', class: "input_with_label" }, this.showLabel && h("p", { key: '2a2dfefca6bc6164dbed39d44e791d476e8a3670', class: `label text-sm-medium` }, this.label), this.type === 'default' && (h("textarea", { key: 'e875951824e7855e01734b30d9c2ebd526c09de8', ref: el => (this.textarea = el), onInput: () => this.handleInput(), onFocus: () => this.handleInputFocus(), class: `textarea default_textarea ${this.state} ${this.destructive ? 'destructive' : ''}`, placeholder: this.placeholderText, value: this.inputValue })), this.type === 'tags' && (h("div", { key: 'f8f096bd28fd14c1b18a350b314634481b33e679', class: "textarea_tags" }, h("div", { key: '54003c04bee1fcdcacab60fc5c609700f284cba6', class: `textarea ${this.type} ${this.state} ${this.destructive ? 'destructive' : ''}`, onClick: () => this.handleWrapperClick() }, h("div", { key: '0cf27a5849dc2647ce9bdb686cb16ba9326c301c', class: `results_display ${this.state === 'disabled' ? 'disabled' : ''}`, ref: el => (this.resultsDisplayElement = el) }, this.value.length === 0 ? (h(Fragment, null, this.selectedItems.map((item, index) => (h(Fragment, null, typeof item === 'object' ? (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(index) }, h("p", { class: "text-xs-medium" }, item.objectName.split(' ')[0]), h("h1", { slot: "initials", class: "text-xxs-semi-bold" }, item.objectName
+        return (h("div", { key: '79a01e9fb836119ad8caa66161154d056fc7638a', class: "textarea_container" }, h("div", { key: '4222a91d13c89c45058776b580f1db1b52c65eb3', class: "input_with_label" }, this.showLabel && h("p", { key: '2b9ba3f8814fbc471d7148cb067f196f3c304e13', class: `label text-sm-medium` }, this.label), this.type === 'default' && (h("textarea", { key: 'f93b109f870956c7df197a79573749a13ded1078', ref: el => (this.textarea = el), onInput: () => this.handleInput(), onFocus: () => this.handleInputFocus(), class: `textarea default_textarea ${this.state} ${this.destructive ? 'destructive' : ''}`, placeholder: this.placeholderText, value: this.inputValue })), this.type === 'tags' && (h("div", { key: '63b4c2889f9c03205519a2be8c4aa43f1c2b9612', class: "textarea_tags" }, h("div", { key: 'd43d29a43a53d7883812bb8275288dc95889b2c0', class: `textarea ${this.type} ${this.state} ${this.destructive ? 'destructive' : ''}`, onClick: () => this.handleWrapperClick() }, h("div", { key: '7a446ef4b26d28f8905dc193810b820fb31a465d', class: `results_display ${this.state === 'disabled' ? 'disabled' : ''}`, ref: el => (this.resultsDisplayElement = el) }, this.value.length === 0 ? (h(Fragment, null, this.selectedItems.map((item, index) => (h(Fragment, null, typeof item === 'object' ? (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(index) }, h("p", { class: "text-xs-medium" }, item.objectName.split(' ')[0]), h("h1", { slot: "initials", class: "text-xxs-semi-bold" }, item.objectName
             .split(' ')
             .map(part => part.charAt(0).toUpperCase())
-            .join(''))))) : (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(index) }, h("p", { class: "text-xs-medium" }, item))))))))) : (h(Fragment, null, this.value.map((val, index) => (h(Fragment, null, typeof val === 'object' ? (h("gb-tag", { size: "sm", action: "X_close", icon: this.icon ? this.icon : 'avatar', onClick: () => this.handleTagRemove(index), key: index }, h("h1", { class: "text-xxs-semi-bold", slot: "initials" }, val.objectName.split(' ').map(part => part.charAt(0).toUpperCase())), h("p", null, val.objectName.split(' ')[0]))) : (h("gb-tag", { size: "sm", action: "X_close", icon: this.icon ? this.icon : 'avatar', onClick: () => this.handleTagRemove(index), key: index }, h("p", null, val)))))))), h("span", { key: 'e43cbb536ba80941f10d57318efae0806f39e375', class: "hidden-span", ref: el => (this.hiddenSpan = el) }, this.inputValue || '  '), h("div", { key: 'e728b7d149409e8992b667fac9bc19919491239a', class: "input_field" }, h("input", { key: '9014127c49118115d60aff1834f15e8f32590651', id: this.idOfInput, class: `input_like text-md-regular ${this.state}`, type: "text",
+            .join(''))))) : (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(index) }, h("p", { class: "text-xs-medium" }, item))))))))) : (h(Fragment, null, this.value.map((val, index) => (h(Fragment, null, typeof val === 'object' ? (h("gb-tag", { size: "sm", action: "X_close", icon: this.icon ? this.icon : 'avatar', onClick: () => this.handleTagRemove(index), key: index }, h("h1", { class: "text-xxs-semi-bold", slot: "initials" }, val.objectName.split(' ').map(part => part.charAt(0).toUpperCase())), h("p", null, val.objectName.split(' ')[0]))) : (h("gb-tag", { size: "sm", action: "X_close", icon: this.icon ? this.icon : 'avatar', onClick: () => this.handleTagRemove(index), key: index }, h("p", null, val)))))))), h("span", { key: '1a856b78ecca95143194b148e1ad8d4c410362f9', class: "hidden-span", ref: el => (this.hiddenSpan = el) }, this.inputValue || '  '), h("div", { key: 'f3af2bd6dc67aa52b5d845dec6fd61ac988e76cf', class: "input_field" }, h("input", { key: '82eede659477bf88855ee7789c0e116a3279ae95', id: this.idOfInput, class: `input_like text-md-regular ${this.state}`, type: "text",
             // placeholder={this.placeholderText}
-            value: this.inputValue, readOnly: this.isReadOnly, ref: el => (this.inputElement = el), onBlur: () => this.emitInputValue() }))), this.destructive && (h("div", { key: '8eb43cf70aac571c8fb2ca4e9d02ed860fe4c422', class: "help_icon" }, h("svg", { key: 'cdb52fdbf48b9eb8999a5276cc9fd138810501c4', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { key: '1d66c6cc7c1ab2d1f5d7400d4e669c0c618cdeb8', d: "M7.9947 10H8.00069M8.00004 8.00004V5.33337M14.6667 8.00004C14.6667 11.6819 11.6819 14.6667 8.00004 14.6667C4.31814 14.6667 1.33337 11.6819 1.33337 8.00004C1.33337 4.31814 4.31814 1.33337 8.00004 1.33337C11.6819 1.33337 14.6667 4.31814 14.6667 8.00004Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), this.show && (h("div", { key: 'c317e2e27fede5b383d33318a8af31f665cbc35e', class: `dropdown_menu` }, this.results.map(item => (h("gb-input-dropdown-menu-item", { type: "checkbox", "supporting-text": true, state: StateEnum.Default, onClick: () => this.selectDropdownItem(item), selected: this.isTagItemSelected(item) }, typeof item === 'object'
+            value: this.inputValue, readOnly: this.isReadOnly, ref: el => (this.inputElement = el), onBlur: () => this.emitInputValue() }))), this.destructive && (h("div", { key: '27ae695313cd04b690bb3cb43d6171782a0cb195', class: "help_icon" }, h("svg", { key: '6047c75dc3928ac6ec430aa0c8d22d586c8014f8', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { key: '48b309627daea08eea27cc62e371f3530a8fc07f', d: "M7.9947 10H8.00069M8.00004 8.00004V5.33337M14.6667 8.00004C14.6667 11.6819 11.6819 14.6667 8.00004 14.6667C4.31814 14.6667 1.33337 11.6819 1.33337 8.00004C1.33337 4.31814 4.31814 1.33337 8.00004 1.33337C11.6819 1.33337 14.6667 4.31814 14.6667 8.00004Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), this.show && (h("div", { key: 'c44f057ed719cd11e9d3c53f66d22d4156a82062', class: `dropdown_menu` }, this.results.map(item => (h("gb-input-dropdown-menu-item", { type: "checkbox", "supporting-text": true, state: StateEnum.Default, onClick: () => this.selectDropdownItem(item), selected: this.isTagItemSelected(item) }, typeof item === 'object'
             ? [h("p", { slot: "name" }, item.objectName), h("p", { slot: "supporting_text" }, item.objectValue)]
             : typeof item !== 'object' && h("p", { slot: "name" }, item))))))))), this.showHintText && h(Fragment, null, !this.destructive ? h("p", { class: "hint_text text-sm-regular" }, this.hintText) : h("p", { class: "error_text text-sm-regular" }, this.errorText))));
     }

package/dist/collection/components/gb-theme-tab/gb-theme-tab.js

@@ -18,7 +18,7 @@ export class GbThemeTab {
         const systemIconSrc = getAssetPath(`assets/laptop.svg`);
         const sunSrc = getAssetPath(`assets/sun-02.svg`);
         const moonSrc = getAssetPath(`assets/moon-02.svg`);
-        return (h("div", { key: 'c427fa786ae5e86a970054a8033a8f7afff96b10', class: `theme_tab_div` }, h("div", { key: 'a6f0d6b5217b5fc8030dd1074423dcb87a80d629', class: "tab" }, h("gb-icon-button-base", { key: '9a3619c2caddf6031e8a43728b8c9abc229b8eee', current: this.currentActiveTab === 'system' ? true : false, icon: systemIconSrc, label: "System", onClick: () => this.tabClicked('system') })), h("div", { key: '5ea9bf788af13fd3a2d6ac9e88d42132dbc93a90', class: "tab" }, h("gb-icon-button-base", { key: 'c635cc9eee21f5d63e6d606274311db3c289f15c', current: this.currentActiveTab === 'light' ? true : false, icon: sunSrc, label: "Light", onClick: () => this.tabClicked('light') })), h("div", { key: '36d4bb65a55b3f6f16b7004f4b18a89d0f219823', class: "tab" }, h("gb-icon-button-base", { key: 'ff23a3b442aa481947b9bfe83f50c402aacb2595', current: this.currentActiveTab === 'dark' ? true : false, icon: moonSrc, label: "Dark", onClick: () => this.tabClicked('dark') }))));
+        return (h("div", { key: '3fed4d3fe860b68de4eda39d40e12860d2b1387b', class: `theme_tab_div` }, h("div", { key: '5da01eb7b871e8325611017acacea103d33190af', class: "tab" }, h("gb-icon-button-base", { key: '055e65f1cabb4de2531915b7449db153fb3b0fb2', current: this.currentActiveTab === 'system' ? true : false, icon: systemIconSrc, label: "System", onClick: () => this.tabClicked('system') })), h("div", { key: 'c7120b73fe57eceb405a031266b21220329753b8', class: "tab" }, h("gb-icon-button-base", { key: 'fb7909df1602ac41a85bff8687c574d78b5101fd', current: this.currentActiveTab === 'light' ? true : false, icon: sunSrc, label: "Light", onClick: () => this.tabClicked('light') })), h("div", { key: '97102947f999687e087b30a1af1ca0ce8a9f8c90', class: "tab" }, h("gb-icon-button-base", { key: 'b04d73c76a87b686c668cb6046dd0add9bcf32fc', current: this.currentActiveTab === 'dark' ? true : false, icon: moonSrc, label: "Dark", onClick: () => this.tabClicked('dark') }))));
     }
     static get is() { return "gb-theme-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-toast/gb-toast.js

@@ -21,7 +21,7 @@ export class GbToast {
         this.close.emit();
     }
     render() {
-        return (h("div", { key: 'ac84f8a81f656e2ea2413847f57b5fb6695e2e46', class: `toast_div ${this.internalColor} ${this.size} ${this.breakpoint}` }, this.size === 'floating' && (h(Fragment, null, h("div", { key: '6af99a2ce6da31abf7f1dde204a7d0f720a08a4a', class: `icon_container` }, this.internalColor === 'success' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "29", viewBox: "0 0 28 29", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { opacity: "0.4", d: "M14.0666 2.24988H14.0665H13.9331H13.9331C11.3773 2.24986 9.36985 2.24985 7.80253 2.46057C6.19643 2.67651 4.92213 3.12805 3.9209 4.12928C2.91967 5.13051 2.46813 6.40481 2.2522 8.01091C2.04148 9.57822 2.04149 11.5857 2.0415 14.1415V14.1415V14.2749V14.2749C2.04149 16.8307 2.04148 18.8382 2.2522 20.4055C2.46813 22.0116 2.91967 23.2859 3.9209 24.2871C4.92213 25.2884 6.19643 25.7399 7.80253 25.9559C9.36985 26.1666 11.3773 26.1666 13.9331 26.1665H14.0665C16.6223 26.1666 18.6298 26.1666 20.1971 25.9559C21.8032 25.7399 23.0775 25.2884 24.0788 24.2871C25.08 23.2859 25.5315 22.0116 25.7475 20.4055C25.9582 18.8382 25.9582 16.8308 25.9582 14.2749V14.1415C25.9582 11.5857 25.9582 9.57822 25.7475 8.01091C25.5315 6.40481 25.08 5.13051 24.0788 4.12928C23.0775 3.12805 21.8032 2.67651 20.1971 2.46057C18.6298 2.24985 16.6224 2.24986 14.0666 2.24988Z", fill: "var(--color-icon-success, #079455)" }), h("path", { d: "M19.2265 11.1487C19.7918 10.8396 19.9995 10.1307 19.6903 9.56536C19.3811 9.00004 18.6722 8.79238 18.1069 9.10154C15.9735 10.2683 14.2094 12.5199 13.0232 14.3362C12.5849 15.0074 12.2104 15.6429 11.9108 16.1812C11.6313 15.9101 11.3545 15.6747 11.1069 15.479C10.783 15.2228 10.4915 15.0208 10.2789 14.8816L9.91136 14.6534C9.35166 14.3342 8.63915 14.5291 8.31994 15.0888C8.0008 15.6484 8.19559 16.3607 8.75499 16.68L9.00033 16.8335C9.16695 16.9426 9.40042 17.1043 9.6598 17.3093C10.1936 17.7314 10.7696 18.2846 11.1321 18.8907C11.3546 19.2626 11.7649 19.4806 12.1977 19.4567C12.6303 19.4328 13.0142 19.1708 13.1944 18.7769L13.309 18.5372C13.388 18.3756 13.5063 18.1396 13.6603 17.8487C13.9689 17.2657 14.4176 16.4684 14.9769 15.612C16.1241 13.8554 17.6266 12.0237 19.2265 11.1487Z", fill: "var(--color-icon-success, #079455)" }))) : this.color === 'error' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "29", viewBox: "0 0 28 29", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { opacity: "0.4", d: "M14.0665 2.49945C16.6224 2.49944 18.6298 2.49942 20.1971 2.71014C21.8032 2.92608 23.0775 3.37762 24.0788 4.37885C25.08 5.38008 25.5315 6.65438 25.7475 8.26048C25.9582 9.82779 25.9582 11.8352 25.9582 14.391V14.3911V14.5245V14.5245C25.9582 17.0803 25.9582 19.0878 25.7475 20.6551C25.5315 22.2612 25.08 23.5355 24.0788 24.5367C23.0775 25.538 21.8032 25.9895 20.1971 26.2054C18.6298 26.4161 16.6224 26.4161 14.0666 26.4161H14.0665H13.9331H13.9331C11.3773 26.4161 9.36984 26.4161 7.80253 26.2054C6.19643 25.9895 4.92213 25.538 3.9209 24.5367C2.91967 23.5355 2.46813 22.2612 2.2522 20.6551C2.04148 19.0878 2.04149 17.0803 2.0415 14.5245V14.3911C2.04149 11.8353 2.04148 9.8278 2.2522 8.26048C2.46813 6.65438 2.91967 5.38008 3.9209 4.37885C4.92213 3.37762 6.19643 2.92608 7.80253 2.71014C9.36985 2.49942 11.3773 2.49944 13.9331 2.49945H14.0665Z", fill: "var(--color-icon-danger, #B51726)" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.8335 19.7075C12.8335 19.0632 13.3535 18.5409 13.9949 18.5409H14.0054C14.6468 18.5409 15.1668 19.0632 15.1668 19.7075C15.1668 20.3519 14.6468 20.8742 14.0054 20.8742H13.9949C13.3535 20.8742 12.8335 20.3519 12.8335 19.7075Z", fill: "var(--color-icon-danger, #B51726)" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M14.0003 16.2075C13.356 16.2075 12.8336 15.6852 12.8336 15.0409L12.8336 10.3742C12.8336 9.72985 13.356 9.20752 14.0003 9.20752C14.6446 9.20752 15.167 9.72985 15.167 10.3742L15.167 15.0409C15.167 15.6852 14.6446 16.2075 14.0003 16.2075Z", fill: "var(--color-icon-danger, #B51726)" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "28", viewBox: "0 0 28 28", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { opacity: "0.4", d: "M14.0667 2.04163C16.6225 2.04161 18.63 2.0416 20.1973 2.25232C21.8034 2.46825 23.0777 2.91979 24.079 3.92102C25.0802 4.92226 25.5317 6.19655 25.7477 7.80265C25.9584 9.36996 25.9584 11.3774 25.9584 13.9332V13.9333V14.0667V14.0667C25.9584 16.6225 25.9584 18.63 25.7477 20.1973C25.5317 21.8034 25.0802 23.0777 24.079 24.0789C23.0777 25.0801 21.8034 25.5317 20.1973 25.7476C18.63 25.9583 16.6226 25.9583 14.0668 25.9583H14.0667H13.9333H13.9333C11.3775 25.9583 9.37003 25.9583 7.80271 25.7476C6.19661 25.5317 4.92232 25.0801 3.92109 24.0789C2.91985 23.0777 2.46831 21.8034 2.25238 20.1973C2.04166 18.6299 2.04167 16.6225 2.04169 14.0667V13.9333C2.04167 11.3774 2.04166 9.36997 2.25238 7.80265C2.46831 6.19655 2.91985 4.92226 3.92109 3.92102C4.92232 2.91979 6.19661 2.46825 7.80271 2.25232C9.37003 2.0416 11.3775 2.04161 13.9333 2.04163H14.0667Z", fill: "var(--color-icon, #4B5565)" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.6289 12.2818C13.9171 12.3206 14.3158 12.4243 14.6541 12.7626C14.9924 13.101 15.0962 13.4997 15.1349 13.7879C15.167 14.0266 15.1669 14.3043 15.1667 14.5375C15.1667 14.553 15.1667 14.5683 15.1667 14.5834V19.2501C15.1667 19.8944 14.6444 20.4167 14 20.4167C13.3557 20.4167 12.8334 19.8944 12.8334 19.2501V14.5834C12.189 14.5834 11.6667 14.0611 11.6667 13.4167C11.6667 12.7724 12.189 12.2501 12.8334 12.2501C12.8485 12.2501 12.8638 12.2501 12.8793 12.2501C13.1125 12.2499 13.3901 12.2497 13.6289 12.2818Z", fill: "var(--color-icon, #4B5565)" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.8333 8.75004C12.8333 8.10571 13.3533 7.58337 13.9947 7.58337H14.0051C14.6466 7.58337 15.1666 8.10571 15.1666 8.75004C15.1666 9.39437 14.6466 9.91671 14.0051 9.91671H13.9947C13.3533 9.91671 12.8333 9.39437 12.8333 8.75004Z", fill: "var(--color-icon, #4B5565)" })))), h("div", { key: '7437fa936635ad68e02a8528a33d6c9b5f626cc8', class: `content ${this.size} ${this.actions ? ' actions' : ''}` }, h("div", { key: '1d1ee85b0db969924a37a7cef9938d86b5b6c607', class: `text ${!this.supportingText ? 'no_supporting_text' : ''} ${this.size}` }, h("p", { key: '9e00c9b738a21328f2238ac4f27c6c1066d26228', class: `text-md-semi-bold main_text_${this.internalColor}` }, this.mainText), this.showSupportingText && h("p", { key: 'd2b733f566495188c3d1c79dfa783150163fc7bf', class: `text-sm-regular supporting_text_${this.internalColor}` }, this.supportingText)), this.actions && (h("div", { key: '972c2a99b2dd963af25139c9ee277b3e1cc10b1b', class: `actions ${this.size} ${!this.showSupportingText ? 'only_actions' : ''}` }, this.color === 'default' ? (h(Fragment, null, this.secondActionText && (h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_gray" }, h("p", null, this.secondActionText))), this.firstActionText && (h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_color" }, h("p", null, this.firstActionText))))) : (h(Fragment, null, this.secondActionText && (h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, this.secondActionText))), this.firstActionText && (h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, this.firstActionText)))))))), this.xCloseButton && (h("gb-button-close", { key: 'd0779394519648a09dc9e6dcde12a58526788156', size: "sm", color: this.internalColor === 'default' ? 'gray' : this.internalColor === 'gray' ? 'gray' : this.internalColor, class: `close_button ${this.size}`, onClick: () => this.closeToast() })))), this.size === 'full_width' && (h("div", { key: '7347a47461305c55a9c922cebf710384f7288198', class: `container ${this.breakpoint}` }, h("div", { key: '09a21fc9b704c2de666615b10351b95c10c79ef1', class: `full_width_content ${this.breakpoint}` }, h("div", { key: '27eed0a6c557c108e71c4c1cadc6bccf85ee0cd3', class: `inner_content ${this.breakpoint}` }, h("div", { key: '44ac91015aedfdee0ce157cb8700b2773a45d5e8', class: `icon_container` }, h("svg", { key: 'a6268903d96d59d738444fc4db32d6bb4ff8cae4', xmlns: "http://www.w3.org/2000/svg", width: "28", height: "28", viewBox: "0 0 28 28", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { key: '9955144dacf88fbcdfcd8a996c11461834b78f15', opacity: "0.4", d: "M14.0667 2.04163C16.6225 2.04161 18.63 2.0416 20.1973 2.25232C21.8034 2.46825 23.0777 2.91979 24.079 3.92102C25.0802 4.92226 25.5317 6.19655 25.7477 7.80265C25.9584 9.36996 25.9584 11.3774 25.9584 13.9332V13.9333V14.0667V14.0667C25.9584 16.6225 25.9584 18.63 25.7477 20.1973C25.5317 21.8034 25.0802 23.0777 24.079 24.0789C23.0777 25.0801 21.8034 25.5317 20.1973 25.7476C18.63 25.9583 16.6226 25.9583 14.0668 25.9583H14.0667H13.9333H13.9333C11.3775 25.9583 9.37003 25.9583 7.80271 25.7476C6.19661 25.5317 4.92232 25.0801 3.92109 24.0789C2.91985 23.0777 2.46831 21.8034 2.25238 20.1973C2.04166 18.6299 2.04167 16.6225 2.04169 14.0667V13.9333C2.04167 11.3774 2.04166 9.36997 2.25238 7.80265C2.46831 6.19655 2.91985 4.92226 3.92109 3.92102C4.92232 2.91979 6.19661 2.46825 7.80271 2.25232C9.37003 2.0416 11.3775 2.04161 13.9333 2.04163H14.0667Z", fill: "#4B5565" }), h("path", { key: 'ce0897bd3ac1026790c151f9c2a886456404b2ce', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.6289 12.2818C13.9171 12.3206 14.3158 12.4243 14.6541 12.7626C14.9924 13.101 15.0962 13.4997 15.1349 13.7879C15.167 14.0266 15.1669 14.3043 15.1667 14.5375C15.1667 14.553 15.1667 14.5683 15.1667 14.5834V19.2501C15.1667 19.8944 14.6444 20.4167 14 20.4167C13.3557 20.4167 12.8334 19.8944 12.8334 19.2501V14.5834C12.189 14.5834 11.6667 14.0611 11.6667 13.4167C11.6667 12.7724 12.189 12.2501 12.8334 12.2501C12.8485 12.2501 12.8638 12.2501 12.8793 12.2501C13.1125 12.2499 13.3901 12.2497 13.6289 12.2818Z", fill: "#4B5565" }), h("path", { key: '0c579b19422e7e2c6f6dc53b80289368a0af0bf8', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.8333 8.75004C12.8333 8.10571 13.3533 7.58337 13.9947 7.58337H14.0051C14.6466 7.58337 15.1666 8.10571 15.1666 8.75004C15.1666 9.39437 14.6466 9.91671 14.0051 9.91671H13.9947C13.3533 9.91671 12.8333 9.39437 12.8333 8.75004Z", fill: "#4B5565" }))), h("div", { key: '9874c5193a9644b32958c092d9ae0c8f2d82c7db', class: `text ${this.size} ${this.breakpoint}` }, h("p", { key: '934c8ce36801f8d3e979d67b319b5e2d8768b3c3', class: `text-sm-semi-bold main_text_${this.internalColor}` }, this.mainText), this.showSupportingText && h("p", { key: '664e872e359fac428232ddac6c3a3c50b01e3c19', class: `text-xs-regular supporting_text_${this.internalColor}` }, this.supportingText))), this.actions && (h("div", { key: '1da0690cdbd2a50f090c457fb432db9402c5cda4', class: `actions ${this.size} ${this.breakpoint} ${!this.showSupportingText ? 'only_actions' : ''}` }, this.color === 'default' ? (h(Fragment, null, this.secondActionText && (h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_gray" }, h("p", null, this.secondActionText))), this.firstActionText && (h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_color" }, h("p", null, this.firstActionText))))) : (h(Fragment, null, this.secondActionText && (h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, this.secondActionText))), this.firstActionText && (h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, this.firstActionText))))))), this.xCloseButton && (h("gb-button-close", { key: '8a063b59eedd8cd23850f0a9e50852c27de8de86', size: "sm", color: this.internalColor === 'default' ? 'gray' : this.internalColor === 'gray' ? 'gray' : this.internalColor, class: `close_button ${this.breakpoint}`, onClick: () => this.closeToast() })))))));
+        return (h("div", { key: '76f9f7b46edee1de5ebe56ad98cb0076e3f6a71c', class: `toast_div ${this.internalColor} ${this.size} ${this.breakpoint}` }, this.size === 'floating' && (h(Fragment, null, h("div", { key: '7ca0d88ab20481b88cd959c09631bb99c331769c', class: `icon_container` }, this.internalColor === 'success' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "29", viewBox: "0 0 28 29", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { opacity: "0.4", d: "M14.0666 2.24988H14.0665H13.9331H13.9331C11.3773 2.24986 9.36985 2.24985 7.80253 2.46057C6.19643 2.67651 4.92213 3.12805 3.9209 4.12928C2.91967 5.13051 2.46813 6.40481 2.2522 8.01091C2.04148 9.57822 2.04149 11.5857 2.0415 14.1415V14.1415V14.2749V14.2749C2.04149 16.8307 2.04148 18.8382 2.2522 20.4055C2.46813 22.0116 2.91967 23.2859 3.9209 24.2871C4.92213 25.2884 6.19643 25.7399 7.80253 25.9559C9.36985 26.1666 11.3773 26.1666 13.9331 26.1665H14.0665C16.6223 26.1666 18.6298 26.1666 20.1971 25.9559C21.8032 25.7399 23.0775 25.2884 24.0788 24.2871C25.08 23.2859 25.5315 22.0116 25.7475 20.4055C25.9582 18.8382 25.9582 16.8308 25.9582 14.2749V14.1415C25.9582 11.5857 25.9582 9.57822 25.7475 8.01091C25.5315 6.40481 25.08 5.13051 24.0788 4.12928C23.0775 3.12805 21.8032 2.67651 20.1971 2.46057C18.6298 2.24985 16.6224 2.24986 14.0666 2.24988Z", fill: "var(--color-icon-success, #079455)" }), h("path", { d: "M19.2265 11.1487C19.7918 10.8396 19.9995 10.1307 19.6903 9.56536C19.3811 9.00004 18.6722 8.79238 18.1069 9.10154C15.9735 10.2683 14.2094 12.5199 13.0232 14.3362C12.5849 15.0074 12.2104 15.6429 11.9108 16.1812C11.6313 15.9101 11.3545 15.6747 11.1069 15.479C10.783 15.2228 10.4915 15.0208 10.2789 14.8816L9.91136 14.6534C9.35166 14.3342 8.63915 14.5291 8.31994 15.0888C8.0008 15.6484 8.19559 16.3607 8.75499 16.68L9.00033 16.8335C9.16695 16.9426 9.40042 17.1043 9.6598 17.3093C10.1936 17.7314 10.7696 18.2846 11.1321 18.8907C11.3546 19.2626 11.7649 19.4806 12.1977 19.4567C12.6303 19.4328 13.0142 19.1708 13.1944 18.7769L13.309 18.5372C13.388 18.3756 13.5063 18.1396 13.6603 17.8487C13.9689 17.2657 14.4176 16.4684 14.9769 15.612C16.1241 13.8554 17.6266 12.0237 19.2265 11.1487Z", fill: "var(--color-icon-success, #079455)" }))) : this.color === 'error' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "29", viewBox: "0 0 28 29", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { opacity: "0.4", d: "M14.0665 2.49945C16.6224 2.49944 18.6298 2.49942 20.1971 2.71014C21.8032 2.92608 23.0775 3.37762 24.0788 4.37885C25.08 5.38008 25.5315 6.65438 25.7475 8.26048C25.9582 9.82779 25.9582 11.8352 25.9582 14.391V14.3911V14.5245V14.5245C25.9582 17.0803 25.9582 19.0878 25.7475 20.6551C25.5315 22.2612 25.08 23.5355 24.0788 24.5367C23.0775 25.538 21.8032 25.9895 20.1971 26.2054C18.6298 26.4161 16.6224 26.4161 14.0666 26.4161H14.0665H13.9331H13.9331C11.3773 26.4161 9.36984 26.4161 7.80253 26.2054C6.19643 25.9895 4.92213 25.538 3.9209 24.5367C2.91967 23.5355 2.46813 22.2612 2.2522 20.6551C2.04148 19.0878 2.04149 17.0803 2.0415 14.5245V14.3911C2.04149 11.8353 2.04148 9.8278 2.2522 8.26048C2.46813 6.65438 2.91967 5.38008 3.9209 4.37885C4.92213 3.37762 6.19643 2.92608 7.80253 2.71014C9.36985 2.49942 11.3773 2.49944 13.9331 2.49945H14.0665Z", fill: "var(--color-icon-danger, #B51726)" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.8335 19.7075C12.8335 19.0632 13.3535 18.5409 13.9949 18.5409H14.0054C14.6468 18.5409 15.1668 19.0632 15.1668 19.7075C15.1668 20.3519 14.6468 20.8742 14.0054 20.8742H13.9949C13.3535 20.8742 12.8335 20.3519 12.8335 19.7075Z", fill: "var(--color-icon-danger, #B51726)" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M14.0003 16.2075C13.356 16.2075 12.8336 15.6852 12.8336 15.0409L12.8336 10.3742C12.8336 9.72985 13.356 9.20752 14.0003 9.20752C14.6446 9.20752 15.167 9.72985 15.167 10.3742L15.167 15.0409C15.167 15.6852 14.6446 16.2075 14.0003 16.2075Z", fill: "var(--color-icon-danger, #B51726)" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "28", viewBox: "0 0 28 28", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { opacity: "0.4", d: "M14.0667 2.04163C16.6225 2.04161 18.63 2.0416 20.1973 2.25232C21.8034 2.46825 23.0777 2.91979 24.079 3.92102C25.0802 4.92226 25.5317 6.19655 25.7477 7.80265C25.9584 9.36996 25.9584 11.3774 25.9584 13.9332V13.9333V14.0667V14.0667C25.9584 16.6225 25.9584 18.63 25.7477 20.1973C25.5317 21.8034 25.0802 23.0777 24.079 24.0789C23.0777 25.0801 21.8034 25.5317 20.1973 25.7476C18.63 25.9583 16.6226 25.9583 14.0668 25.9583H14.0667H13.9333H13.9333C11.3775 25.9583 9.37003 25.9583 7.80271 25.7476C6.19661 25.5317 4.92232 25.0801 3.92109 24.0789C2.91985 23.0777 2.46831 21.8034 2.25238 20.1973C2.04166 18.6299 2.04167 16.6225 2.04169 14.0667V13.9333C2.04167 11.3774 2.04166 9.36997 2.25238 7.80265C2.46831 6.19655 2.91985 4.92226 3.92109 3.92102C4.92232 2.91979 6.19661 2.46825 7.80271 2.25232C9.37003 2.0416 11.3775 2.04161 13.9333 2.04163H14.0667Z", fill: "var(--color-icon, #4B5565)" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.6289 12.2818C13.9171 12.3206 14.3158 12.4243 14.6541 12.7626C14.9924 13.101 15.0962 13.4997 15.1349 13.7879C15.167 14.0266 15.1669 14.3043 15.1667 14.5375C15.1667 14.553 15.1667 14.5683 15.1667 14.5834V19.2501C15.1667 19.8944 14.6444 20.4167 14 20.4167C13.3557 20.4167 12.8334 19.8944 12.8334 19.2501V14.5834C12.189 14.5834 11.6667 14.0611 11.6667 13.4167C11.6667 12.7724 12.189 12.2501 12.8334 12.2501C12.8485 12.2501 12.8638 12.2501 12.8793 12.2501C13.1125 12.2499 13.3901 12.2497 13.6289 12.2818Z", fill: "var(--color-icon, #4B5565)" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.8333 8.75004C12.8333 8.10571 13.3533 7.58337 13.9947 7.58337H14.0051C14.6466 7.58337 15.1666 8.10571 15.1666 8.75004C15.1666 9.39437 14.6466 9.91671 14.0051 9.91671H13.9947C13.3533 9.91671 12.8333 9.39437 12.8333 8.75004Z", fill: "var(--color-icon, #4B5565)" })))), h("div", { key: '6619814d6ce516bea3b31c710c4b52e406518ee6', class: `content ${this.size} ${this.actions ? ' actions' : ''}` }, h("div", { key: 'ca7df5c59e25c1353a4535b8e8a93b3773da5db1', class: `text ${!this.supportingText ? 'no_supporting_text' : ''} ${this.size}` }, h("p", { key: '207cb8351485ab40e95d9a57a03340aa705a30fe', class: `text-md-semi-bold main_text_${this.internalColor}` }, this.mainText), this.showSupportingText && h("p", { key: '08f3183f6d2332fa85b43a88bbe79dde296af114', class: `text-sm-regular supporting_text_${this.internalColor}` }, this.supportingText)), this.actions && (h("div", { key: '13cf3266137f9f0824068b789c127ca7d1aeb42c', class: `actions ${this.size} ${!this.showSupportingText ? 'only_actions' : ''}` }, this.color === 'default' ? (h(Fragment, null, this.secondActionText && (h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_gray" }, h("p", null, this.secondActionText))), this.firstActionText && (h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_color" }, h("p", null, this.firstActionText))))) : (h(Fragment, null, this.secondActionText && (h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, this.secondActionText))), this.firstActionText && (h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, this.firstActionText)))))))), this.xCloseButton && (h("gb-button-close", { key: '90d5e02f57fba437e09fdbfd5edc2b9da888fa87', size: "sm", color: this.internalColor === 'default' ? 'gray' : this.internalColor === 'gray' ? 'gray' : this.internalColor, class: `close_button ${this.size}`, onClick: () => this.closeToast() })))), this.size === 'full_width' && (h("div", { key: '3ba604364a743b41dcb8a23d1bb92ceceb78609f', class: `container ${this.breakpoint}` }, h("div", { key: '18572f54c12834c956c490374a0d901f88cbb05f', class: `full_width_content ${this.breakpoint}` }, h("div", { key: '82999f0e2a917590719b9335b4d74fd31d6f2995', class: `inner_content ${this.breakpoint}` }, h("div", { key: 'b2c9910464aebd5539a84e08d37a6cd1e11aee60', class: `icon_container` }, h("svg", { key: '8ec62a8215dfea26839ed57e1d72bf3d5798ee2a', xmlns: "http://www.w3.org/2000/svg", width: "28", height: "28", viewBox: "0 0 28 28", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { key: '2eb12f5a073b61733896c570a8a12778df8a3fbb', opacity: "0.4", d: "M14.0667 2.04163C16.6225 2.04161 18.63 2.0416 20.1973 2.25232C21.8034 2.46825 23.0777 2.91979 24.079 3.92102C25.0802 4.92226 25.5317 6.19655 25.7477 7.80265C25.9584 9.36996 25.9584 11.3774 25.9584 13.9332V13.9333V14.0667V14.0667C25.9584 16.6225 25.9584 18.63 25.7477 20.1973C25.5317 21.8034 25.0802 23.0777 24.079 24.0789C23.0777 25.0801 21.8034 25.5317 20.1973 25.7476C18.63 25.9583 16.6226 25.9583 14.0668 25.9583H14.0667H13.9333H13.9333C11.3775 25.9583 9.37003 25.9583 7.80271 25.7476C6.19661 25.5317 4.92232 25.0801 3.92109 24.0789C2.91985 23.0777 2.46831 21.8034 2.25238 20.1973C2.04166 18.6299 2.04167 16.6225 2.04169 14.0667V13.9333C2.04167 11.3774 2.04166 9.36997 2.25238 7.80265C2.46831 6.19655 2.91985 4.92226 3.92109 3.92102C4.92232 2.91979 6.19661 2.46825 7.80271 2.25232C9.37003 2.0416 11.3775 2.04161 13.9333 2.04163H14.0667Z", fill: "#4B5565" }), h("path", { key: '271818fdf5777dd0b48021f6341fa28feda9dc8a', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.6289 12.2818C13.9171 12.3206 14.3158 12.4243 14.6541 12.7626C14.9924 13.101 15.0962 13.4997 15.1349 13.7879C15.167 14.0266 15.1669 14.3043 15.1667 14.5375C15.1667 14.553 15.1667 14.5683 15.1667 14.5834V19.2501C15.1667 19.8944 14.6444 20.4167 14 20.4167C13.3557 20.4167 12.8334 19.8944 12.8334 19.2501V14.5834C12.189 14.5834 11.6667 14.0611 11.6667 13.4167C11.6667 12.7724 12.189 12.2501 12.8334 12.2501C12.8485 12.2501 12.8638 12.2501 12.8793 12.2501C13.1125 12.2499 13.3901 12.2497 13.6289 12.2818Z", fill: "#4B5565" }), h("path", { key: '687fcd2c66f29fcf1cbd4229d1c58aea4db290da', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.8333 8.75004C12.8333 8.10571 13.3533 7.58337 13.9947 7.58337H14.0051C14.6466 7.58337 15.1666 8.10571 15.1666 8.75004C15.1666 9.39437 14.6466 9.91671 14.0051 9.91671H13.9947C13.3533 9.91671 12.8333 9.39437 12.8333 8.75004Z", fill: "#4B5565" }))), h("div", { key: 'c8856d1435c72b72269aec12ec877e018ebb83a3', class: `text ${this.size} ${this.breakpoint}` }, h("p", { key: '75d76bbf52a35f6f6c2545e1a676fcfd24d3ad75', class: `text-sm-semi-bold main_text_${this.internalColor}` }, this.mainText), this.showSupportingText && h("p", { key: 'e171d15e5c352e1a6d94df43fbee34722ef86627', class: `text-xs-regular supporting_text_${this.internalColor}` }, this.supportingText))), this.actions && (h("div", { key: '0c95514989f7e4911aa7026ee7609dfab3985ccf', class: `actions ${this.size} ${this.breakpoint} ${!this.showSupportingText ? 'only_actions' : ''}` }, this.color === 'default' ? (h(Fragment, null, this.secondActionText && (h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_gray" }, h("p", null, this.secondActionText))), this.firstActionText && (h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_color" }, h("p", null, this.firstActionText))))) : (h(Fragment, null, this.secondActionText && (h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, this.secondActionText))), this.firstActionText && (h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, this.firstActionText))))))), this.xCloseButton && (h("gb-button-close", { key: '4dacd7226185525d45c50455c2be5b56dd63b72b', size: "sm", color: this.internalColor === 'default' ? 'gray' : this.internalColor === 'gray' ? 'gray' : this.internalColor, class: `close_button ${this.breakpoint}`, onClick: () => this.closeToast() })))))));
     }
     static get is() { return "gb-toast"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-toast-button/gb-toast-button.js

@@ -5,7 +5,7 @@ export class GbToastButton {
         slottedContent.classList.add('text-sm-semi-bold');
     }
     render() {
-        return (h("div", { key: '948fdccef01bca7d033ab3795b6cdb8aee2911f1', class: `toast_button ${this.state} ${this.color}` }, h("slot", { key: 'a178322a750beee4c6ff1b29f0e844bde18b3cc7' })));
+        return (h("div", { key: 'b5a6a781a149394b5dc0a60e7dccc5beb528f4a7', class: `toast_button ${this.state} ${this.color}` }, h("slot", { key: 'b8cbe92a5b0011bfdf8dd5b0616a8f2d850d7e18' })));
     }
     static get is() { return "gb-toast-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-toggle/gb-toggle.js

@@ -42,7 +42,7 @@ export class GbToggle {
         }
     }
     render() {
-        return (h("div", { key: 'f48c523c9478c6de1104c37fdf4031d4b15ff8f1', class: `toggle_div ${this.size}` }, this.position === 'left' && (h(Fragment, null, this.text && (h("div", { key: 'bcddb9ab84101a28a0497e541cab8a7c82c96b9e', class: "text" }, h("slot", { key: '9cd10deefad0481698d78ad3117fec2bb02dbfef', name: "main_text" }), this.supportingText && h("slot", { key: '17b53cdc8c6bf2491986c8a40e5b87724d7c55bc', name: "supporting_text" }))))), h("div", { key: '9d4a41358a2bd1201ffaee35ba36fe1b6240af88', class: "toggle_base" }, h("gb-toggle-base", { key: '1bd72bee022eee947e9783bfb0fc61003bba9a96', size: this.size, state: this.state, pressed: this.pressed, onToggleClicked: this.onToggle.bind(this) })), this.position === 'right' && (h(Fragment, null, this.text && (h("div", { key: '0e71e907a653330e25a1cf35f4cf8163d3dea483', class: "text" }, h("slot", { key: '3fb0da3875bd1b37fe0b58cb93047aa6b808e3b2', name: "main_text" }), this.supportingText && h("slot", { key: '50fdc19557bf057a08413a9af4c4ec8729f8f158', name: "supporting_text" })))))));
+        return (h("div", { key: '1c4bc72c94c0b4ff4df362ba902f0a83a90bb0ec', class: `toggle_div ${this.size}` }, this.position === 'left' && (h(Fragment, null, this.text && (h("div", { key: '0f5dd650884bbdbc07ff973a598fbecf93463e71', class: "text" }, h("slot", { key: '37025270488c6897d1e73a1f3f1746f0e7f58c53', name: "main_text" }), this.supportingText && h("slot", { key: '3ef71efa89ddedbdbe09f961ace50c5ad25934e0', name: "supporting_text" }))))), h("div", { key: '57d25abb0973a4ef44d280e9acc979413d1db3db', class: "toggle_base" }, h("gb-toggle-base", { key: '4a47d4d9706f6e94062bc0740fb00e3bab3616d7', size: this.size, state: this.state, pressed: this.pressed, onToggleClicked: this.onToggle.bind(this) })), this.position === 'right' && (h(Fragment, null, this.text && (h("div", { key: 'f593f23780d32f572c1b8dd3fbe7f2232f14c1fc', class: "text" }, h("slot", { key: '363ba47720b042b802b146a2dc160dc22b955cab', name: "main_text" }), this.supportingText && h("slot", { key: 'c1932e85554e21fcdb052ffd089a22de6114f027', name: "supporting_text" })))))));
     }
     static get is() { return "gb-toggle"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-toggle-base/gb-toggle-base.js

@@ -11,8 +11,8 @@ export class GbToggleBase {
     }
     render() {
         return [
-            h("input", { key: '923c556c8d4eb1cafb91106449b7407657b37cf2', type: "checkbox", id: "customCheckbox", class: `${this.pressed ? 'pressed' : ''}`, readonly: true }),
-            h("label", { key: 'b07495bcf72ffa78667f24a9d3c149ac83a280e9', onClick: () => this.handleToggleClick(), class: `${this.size} ${this.state} ${this.pressed ? 'pressed' : ''}`, htmlFor: "customCheckbox" }, this.pressed && this.state === 'default' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", class: `default_checked_svg ${this.size}` }, h("path", { d: "M2.08325 6.04167C2.08325 6.04167 2.70825 6.04167 3.54159 7.5C3.54159 7.5 5.85776 3.68056 7.91659 2.91667", stroke: "#075DB2", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))) : this.pressed && this.state === 'disabled' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", class: `disabled_checked_svg ${this.size}` }, h("path", { d: "M2.08325 6.04167C2.08325 6.04167 2.70825 6.04167 3.54159 7.5C3.54159 7.5 5.85776 3.68056 7.91659 2.91667", stroke: "#E3E8EF", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))) : null),
+            h("input", { key: '05be1d5bc703020c932dc1aca44576cb665550b9', type: "checkbox", id: "customCheckbox", class: `${this.pressed ? 'pressed' : ''}`, readonly: true }),
+            h("label", { key: '349854ab7d06f6288b395076f7dcd3601b368299', onClick: () => this.handleToggleClick(), class: `${this.size} ${this.state} ${this.pressed ? 'pressed' : ''}`, htmlFor: "customCheckbox" }, this.pressed && this.state === 'default' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", class: `default_checked_svg ${this.size}` }, h("path", { d: "M2.08325 6.04167C2.08325 6.04167 2.70825 6.04167 3.54159 7.5C3.54159 7.5 5.85776 3.68056 7.91659 2.91667", stroke: "#075DB2", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))) : this.pressed && this.state === 'disabled' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", class: `disabled_checked_svg ${this.size}` }, h("path", { d: "M2.08325 6.04167C2.08325 6.04167 2.70825 6.04167 3.54159 7.5C3.54159 7.5 5.85776 3.68056 7.91659 2.91667", stroke: "#E3E8EF", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))) : null),
         ];
     }
     static get is() { return "gb-toggle-base"; }

package/dist/collection/components/gb-token-field-compact/gb-token-field-compact.js

@@ -5,7 +5,7 @@ export class GbTokenFieldCompact {
         this.supportingText = '';
     }
     render() {
-        return (h("div", { key: 'ee99da596eab48f6371e9cb17cb07315de71e0c4', class: this.size }, h("div", { key: 'd650b0cc62ef0b4b186acc106554724d885fbf7c', class: "input_with_label" }, this.showLabel && h("label", { key: '4d9fcf3337df58b00eb920de3084528e8a4e0fa5' }, this.label), h("input", { key: '3fb0af5e139b20b750a801c5dcb2ba1d98b804c8', class: "token_input", type: "text", placeholder: '--------', maxLength: this.digits })), this.showSupportingText && h("p", { key: '3eca9b1a4ddfb034fa9b13c595b829505313b6b1' }, this.supportingText)));
+        return (h("div", { key: '4c94929da3c6d415ed7749bf31e9bcd4c826ee2d', class: this.size }, h("div", { key: 'ea3929bfcba513f6a01daf1a1346ebdcf57eeaa0', class: "input_with_label" }, this.showLabel && h("label", { key: '7200142eb0bf4e48c3c60deb6e0cfc9d2698cbe7' }, this.label), h("input", { key: '427eabb4d1a1a807952c1b6263ffc18dfd6611a8', class: "token_input", type: "text", placeholder: '--------', maxLength: this.digits })), this.showSupportingText && h("p", { key: '5756e759ea3eceb1e4410fa870714937ab94b604' }, this.supportingText)));
     }
     static get is() { return "gb-token-field-compact"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-token-field-compressed/gb-token-field-compressed.js

@@ -5,11 +5,11 @@ export class GbTokenFieldCompressed {
         this.hintText = '';
     }
     render() {
-        return (h("div", { key: 'e003527204fcd36b18974e4cbe0f419416a2f6ae', class: {
+        return (h("div", { key: '9b16edf0eb4065e2ec3c93bf7251591c72edfb34', class: {
                 container: true,
                 [this.size]: true,
                 [this.digits]: true,
-            } }, h("div", { key: 'cc6b6d21aa3cc77cb948678920d47f9b21ea9fb4', class: "input-with-label" }, this.showLabel && (h("label", { key: 'dfbb3a9c620a4460c9598b3745b35c7b04ee7727', class: "text-sm-medium", style: { color: 'var(--color-text, #4B5565)' } }, this.label)), this.digits === 4 && (h("div", { key: '909f60e46b9575fa8119b7059b287d3fd5b25b25', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: 'bc11396a75486ecc2583c454b2948a6d46620c94', size: this.size }), h("gb-mega-input-field-base", { key: '7d8b18f80565ffed3fcf609ebe9c98d4470ebf56', size: this.size }), h("gb-mega-input-field-base", { key: '185249653464b069ca207848773969789dfdf711', size: this.size }), h("gb-mega-input-field-base", { key: '45bfc70f7d70aa372cf34864d82754d1e917c45b', size: this.size }))), this.digits === 6 && (h("div", { key: 'a4e51303fd09ca4953380573f03df4bddaa20d7f', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: 'c6b55b699bd886431919b8c486c22aaee7146d46', size: this.size }), h("gb-mega-input-field-base", { key: '210d7d8c5d4cc028e52740cd97c2bb8d8fd630d6', size: this.size }), h("gb-mega-input-field-base", { key: 'da1c1bbf5e6a2e24ecbc8a804b2aca85c24c5ddd', size: this.size }), h("p", { key: 'c3a285fc05585d3753a69f2a54d77be4729966cc', class: "line display-sm-bold" }, "-"), h("gb-mega-input-field-base", { key: 'e96fba5ba025241a395a4d9f64ea6aaaac016cbb', size: this.size }), h("gb-mega-input-field-base", { key: '1bc2768c559e88a1f0926f3baefb8344ec390ce5', size: this.size }), h("gb-mega-input-field-base", { key: '3d000b5bf9e2aaf3cec709ac9584f7b05f43c4a3', size: this.size }))), this.digits === 8 && (h("div", { key: '2e0f4a17e4b17b04c837dec18f6a972e56f9fcd5', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: 'e3d3dbb394f258a91361846dabec617223f6b221', size: this.size }), h("gb-mega-input-field-base", { key: '4274469601ed11ee010fbf8427eb7cec7236b5f5', size: this.size }), h("gb-mega-input-field-base", { key: '141df1dc3d67d90f9e3294249b12b1f9d8ae0540', size: this.size }), h("gb-mega-input-field-base", { key: 'e4680050b3bf1283bde1dcd49921929ac7615c02', size: this.size }), h("p", { key: 'd4c00f4d6732166b5756e1e3b41c156f976f07e2', class: "line display-sm-bold" }, "-"), h("gb-mega-input-field-base", { key: 'ee8ba6643342b1939146673abf43325a1d8f7dc0', size: this.size }), h("gb-mega-input-field-base", { key: 'ab05e3565c042c6fa8e05d05337acc414855f876', size: this.size }), h("gb-mega-input-field-base", { key: 'b58f00781259c9b13ad61b0bf31e3cfb6dc1ca3b', size: this.size }), h("gb-mega-input-field-base", { key: '7656ee7a3b331265d3c25f97c803a4ce38a60a34', size: this.size })))), this.showHintText && (h("div", { key: '14ed682d6670e81ee651b52f19a3147f110c0239', class: "text-sm-regular", style: { color: 'var(--color-text-subtle, #697586)' } }, this.hintText))));
+            } }, h("div", { key: '4ade896564aea714dafcb89cd76806414ae27c20', class: "input-with-label" }, this.showLabel && (h("label", { key: '930dd92b17bb1eddf3da07a3a3603d5bf3dd2b6c', class: "text-sm-medium", style: { color: 'var(--color-text, #4B5565)' } }, this.label)), this.digits === 4 && (h("div", { key: '2b9bed93684a6bf4c4bdac56b7d850e68ae44bcb', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: 'f8d4725bf1df8ffd9d94029832b019b3ab270755', size: this.size }), h("gb-mega-input-field-base", { key: '8a7cf6e393ce89c7d2d085be68797bfe6b628e05', size: this.size }), h("gb-mega-input-field-base", { key: 'b83197d0a55aca454ea2562ec98c283f43479941', size: this.size }), h("gb-mega-input-field-base", { key: '4043e5bc4c6dc8abf3c7ca6f268d8500b191ec11', size: this.size }))), this.digits === 6 && (h("div", { key: '5349d789b6d2f12e35c0a3b48b99a593c3ff732a', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: 'f8f43866dd5f373a08424904124e76c6c25192d4', size: this.size }), h("gb-mega-input-field-base", { key: '08ce5408dfc8c2d5356bd0035082e1d425b714d8', size: this.size }), h("gb-mega-input-field-base", { key: '83a47106346176941040e2339de5e440a194d6f9', size: this.size }), h("p", { key: 'b8b3469e1beaa837e97c26fa5a26a8a8eecf154d', class: "line display-sm-bold" }, "-"), h("gb-mega-input-field-base", { key: 'c785c164a349e7efc97823cf450d56ff00c48bb1', size: this.size }), h("gb-mega-input-field-base", { key: 'e8503c4824509ece910c49e09bb4f69cf1d2e490', size: this.size }), h("gb-mega-input-field-base", { key: 'ce8d663542a7ea146953ca6ecc362ebbd3a26df3', size: this.size }))), this.digits === 8 && (h("div", { key: '2749415f8c8b0eea5e38f34340576f8095275184', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: 'c66e7fb25601ea8d558a45816172059cd67f3cec', size: this.size }), h("gb-mega-input-field-base", { key: '627c6ad6f00ef7a64cc662d988f1f13a5dc10ebb', size: this.size }), h("gb-mega-input-field-base", { key: '675fc642daa2dad7c980ae9c0bdb4b14cdfcca7d', size: this.size }), h("gb-mega-input-field-base", { key: 'b131439a3f46acbae0252104f5484ea8b657500d', size: this.size }), h("p", { key: '2750429a57190afa9d699a59fc914e495264a55e', class: "line display-sm-bold" }, "-"), h("gb-mega-input-field-base", { key: 'da9c1d447b882ed52c020e068e85b0ba12763a41', size: this.size }), h("gb-mega-input-field-base", { key: 'f10f27e6a0e4fcde59083f3b7db8ed032bc9d4cd', size: this.size }), h("gb-mega-input-field-base", { key: '34eb934537d1653b07d310df298512851c3444cc', size: this.size }), h("gb-mega-input-field-base", { key: '43562ac7051ccd63078be250416764b245f5857a', size: this.size })))), this.showHintText && (h("div", { key: '4774637e6177b675ed313c19bd91e5a70131c041', class: "text-sm-regular", style: { color: 'var(--color-text-subtle, #697586)' } }, this.hintText))));
     }
     static get is() { return "gb-token-field-compressed"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-tooltip/gb-tooltip.js

@@ -26,7 +26,7 @@ export class GbTooltip {
         return this.showArrow ? `arrow ${this.arrow}` : '';
     }
     render() {
-        return (h("div", { key: '117582ee5bd01c6f4904135c6237679c7df07765', class: "tooltip_container" }, h("div", { key: 'd02733b3be68966b7ea7d8081e967a594592ad3f', class: "tooltip" }, this.showArrow && h("div", { key: '1f895de7f90a272c6242b1ca54035e8fcf54da58', class: this.getArrowClass() }), h("div", { key: '44def761802fa57fc22d08904947dc6350bb190e', class: "tooltip_content" }, h("slot", { key: '3172394116f138cfa882a0bdbde3b45c9f3c1620', name: "label" }), this.showSupportingText && h("slot", { key: '2e5ccdb56253b5d1da0f3bd5fd9cdc8c60770b20', name: "supporting_text" })))));
+        return (h("div", { key: '4cd966350e255ffff34941b5ee13feee07b2fc51', class: "tooltip_container" }, h("div", { key: 'facda91012321f5fb09fe87a80a51aaa8d79c311', class: "tooltip" }, this.showArrow && h("div", { key: '6c8d2b615e08080259c94abc44855ee11d479111', class: this.getArrowClass() }), h("div", { key: 'bd407f93c304df9b108dc6b4af916493a9cce603', class: "tooltip_content" }, h("slot", { key: 'cff2d310ae4047ac09283af0a4ed4859df9ce25a', name: "label" }), this.showSupportingText && h("slot", { key: '4b5eeec61aad3e10dc012d0bdde4307606b1ab80', name: "supporting_text" })))));
     }
     static get is() { return "gb-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-vertical-tabs/gb-vertical-tabs.js

@@ -25,7 +25,7 @@ export class GbVerticalTabs {
         this.tabItemClicked.emit({ index, label });
     }
     render() {
-        return (h("div", { key: 'fb9957c0be1795b23b86414f7dfb581c56bb9de9', class: `vertical_tab_div` }, this.internalTabs.map((tab, index) => (h("gb-tab-button-base", { size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": tab.name, current: this.activeIndex === index, onClick: () => this.handleTabClick(index, tab.name), alignment: "vertical" })))));
+        return (h("div", { key: '3b4d372d8f6b8cb3b897238317208aa9c66d68f5', class: `vertical_tab_div` }, this.internalTabs.map((tab, index) => (h("gb-tab-button-base", { size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": tab.name, current: this.activeIndex === index, onClick: () => this.handleTabClick(index, tab.name), alignment: "vertical" })))));
     }
     static get is() { return "gb-vertical-tabs"; }
     static get encapsulation() { return "shadow"; }