globuswebcomponents 1.1.7 → 1.1.8

package/dist/cjs/gb-pagination-dot-group.cjs.entry.js

@@ -16,7 +16,7 @@ const GbPaginationDotGroup = class {
         this.framed = false;
     }
     render() {
-        return (index.h("div", { key: 'ec2b9fd812222f72eee15f14c2431f0c7540ac17', class: "dot_group_div" }, index.h("div", { key: '7a966f37f59263e979ad78a1d8b0657feb3370bb' })));
+        return (index.h("div", { key: '3c39af9fde5ee347678e9062bdad5e700c4f6051', class: "dot_group_div" }, index.h("div", { key: '6f27d32f1d898fdb7457878218332c4da9495c3b' })));
     }
 };
 GbPaginationDotGroup.style = GbPaginationDotGroupStyle0;

package/dist/cjs/gb-pagination-dot-indicator.cjs.entry.js

@@ -15,7 +15,7 @@ const GbPaginationDotIndicator = class {
         this.size = undefined;
     }
     render() {
-        return (index.h("div", { key: '8ede0df12569374c05ba93b3d50a2630d998b277', class: `dot_indicator_div 
+        return (index.h("div", { key: 'e4895de7c962b1e520463ee2f47b2cad23d401e0', class: `dot_indicator_div 
       ${this.type} ${this.current ? 'current' : ''} 
       ${this.size}` }));
     }

package/dist/cjs/gb-pagination.cjs.entry.js

@@ -45,7 +45,7 @@ const GbPagination = class {
         this.pageItemSelected.emit({ pageSize: this.selectedPageSize, pageNumber: this.currentPage });
     }
     render() {
-        return (index.h("div", { key: 'baf4f6e7051e6471faec9e7dc2380ec9e5bd064e', class: `pagination_div ${this.type} ${this.breakpoint}` }, this.type === 'page_default' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("gb-button", { key: '727fd1241c6e8d4ba6e2816e37bf184fe462a2b7', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, index.h("p", { key: '376579b512fd0808bef1ec3fad843754f168777b' }, "Previous")), index.h("div", { key: 'bb9ed4d3dfb6075891f86649f63c9e27a4e22f33', class: "pagination_numbers" }, index.h("gb-pagination-number-base", { key: '7b2c0d2cfedb2c022ba7ffb11f6d6270e43b16ee', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(1) }, index.h("p", { key: 'e71f29f4012c92bb5b085ce9d26af1a1f8520bda', slot: "page_number" }, "1")), index.h("gb-pagination-number-base", { key: '27dd3b25ae03cca4fdaf6fb1d8b341b5b136bd57', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(2) }, index.h("p", { key: 'ab7059c7001be959050b46d13f28209fbc5a040f', slot: "page_number" }, "2")), index.h("gb-pagination-number-base", { key: 'e791daced6899a3530ce2d34071f3239cce4311c', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => this.setCurrentPage(3) }, index.h("p", { key: 'e8cdaed925b8da3f1363cf0d9025605f4c25484d', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: 'fd144bbbec64ccf17e69ed84d1dd2f82c8a07202', shape: this.shape }, index.h("p", { key: '0befa244840d9984d7fde39a77469410ac1948b2', slot: "page_number" }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '57e14ba5f9c9ff0e0298655603bcee6a257aa380', shape: this.shape, state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages - 2) }, index.h("p", { key: 'c0e01f9c7ff3a2ee6bcf24a7770d4f4614168386', slot: "page_number" }, this.totalPages - 2)), index.h("gb-pagination-number-base", { key: '504aff6b784deb9fbd219b24532e873f682361b1', shape: this.shape, state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages - 1) }, index.h("p", { key: '40560503865c5399b4d314542801d324e73bc4cb', slot: "page_number" }, this.totalPages - 1)), index.h("gb-pagination-number-base", { key: 'e808e4dc1ed4792dd9b2134f5040f7a619106c42', shape: this.shape, state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages) }, index.h("p", { key: 'e1d83eed6dace8c85f3a4100b8c4dfb195085d8a', slot: "page_number" }, this.totalPages))), index.h("gb-button", { key: 'f91846c0a4e72d2ce62c3b7672793b9ae46023f2', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, index.h("p", { key: '0a9446695d0cb86061d4d87f9cad959091874eb8' }, "Next")))), this.type === 'page_minimal_center_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("gb-button", { key: '3394d9c3641bfa44a083d89f838cd238e1c81e8d', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, index.h("p", { key: '9edb788d46b2f7531b94286921fa334365cb4ec2' }, "Previous")), index.h("div", { key: '9d8af6853c16b2e89fe48c8eae40138bae52c041', class: "pagination_numbers" }, index.h("gb-pagination-number-base", { key: 'a52dbead7827d760490edea136b4f8625a9849f6', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(1) }, index.h("p", { key: 'd51763247b7cf6b4cfdf3b9caadd706df79b04d0', slot: "page_number" }, "1")), index.h("gb-pagination-number-base", { key: '6a6c3af046159f764fac9c401ac4c2c1cefb06f0', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(2) }, index.h("p", { key: 'd15a6e2fc9e66b9f64711a6c0f7390d3bd5bcf03', slot: "page_number" }, "2")), index.h("gb-pagination-number-base", { key: '1b98f531d779e0efd8737804f14c2159e73f8dee', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => this.setCurrentPage(3) }, index.h("p", { key: '644acfef93a7a2911f00ff5860d368a4d0fa87dd', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '4c8f908be4877a09a364f246e585e89c59722562', shape: this.shape }, index.h("p", { key: '4e4ea0b7c3f7cf78872bcf277aef522b3e89108b', slot: "page_number" }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: 'a89c23539c92330d9137f83cf4ce709406b2f680', shape: this.shape, state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages - 2) }, index.h("p", { key: '3f65e233af5e10a3419cc4569be9a1199e69a743', slot: "page_number" }, this.totalPages - 2)), index.h("gb-pagination-number-base", { key: 'aac89061677ea4b88c048d6cb3f9bb4bda0bbb7e', shape: this.shape, state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages - 1) }, index.h("p", { key: 'd337e39de639d4410e08202e2e8963dbac0bbfd6', slot: "page_number" }, this.totalPages - 1)), index.h("gb-pagination-number-base", { key: '3680201944960f8ea2e0e44572ee24b920bd2139', shape: this.shape, state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages) }, index.h("p", { key: '808c7ad9d64e90020151925f807a3cd986899de1', slot: "page_number" }, this.totalPages))), index.h("gb-button", { key: '7d4795e8fb4baff335a2af773c0e7ee5d985ae25', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, index.h("p", { key: '9c72e0f02914eb6bc8d0f7a0db1fcf689e7b8438' }, "Next")))), this.type === 'card_default' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: '998156c0be45b0cfa2905e603173666ab1f51277', class: "pagination_entries" }, index.h("div", { key: '7fd68275b500aed20ed4fd898d77d7902d89857c', class: "entries_text" }, index.h("p", { key: '3f852d6e3f3a1e4177d240a8560ed145f408f351', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: 'd297fcde9c787637e4f226e7e85d7a509093f938', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: '5f42aa3ea6269acc98a4aa39739d44bf73c9a646', type: "default", state: "default", size: "sm", "show-label": false, "show-hint-text": false, "show-supporting-text": false, "show-help-icon": false, items: this.entries, "menu-position": "top", onDropdownItemSelected: this.handlePageSizeSelect.bind(this), value: this.defaultSelected }))), index.h("div", { key: '40ec1103ecd90fb644b2eabca4430049868e9d2c', class: "pagination_numbers" }, index.h("gb-pagination-number-base", { key: '9733911a0281fb15f1abdaddc967238dabd7d813', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(1) }, index.h("p", { key: '83595113675a3f1c5ad5df4a7d6bbc62b06a645b', slot: "page_number" }, "1")), index.h("gb-pagination-number-base", { key: 'c376919520285f368de81144b7f1db724763999a', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(2) }, index.h("p", { key: '563a517951afe1409dfb27d0665e447f5434dd44', slot: "page_number" }, "2")), index.h("gb-pagination-number-base", { key: '0b8ecba62b86ab0c6743419ddb326b073a41bc16', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => this.setCurrentPage(3) }, index.h("p", { key: '0889b7111593dc0fef671d69f5d3a8c3fcb4b72f', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '1f714fe833875b2d781e5fad8c5e3d373e927cb9', shape: this.shape, state: "default" }, index.h("p", { key: 'ba8b9b86f4ae88fa7b3071c05baeba1cb156d86b', slot: "page_number" }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '4e2cfaa1f85a562a1f163ce91958605c463e8bdb', shape: this.shape, state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages - 2) }, index.h("p", { key: '29fa1f4e96cabf8581fc2c7837da66a8a3aa93b6', slot: "page_number" }, this.totalPages - 2)), index.h("gb-pagination-number-base", { key: '8e3df2433a545e5172085844400bc64b77e39ec1', shape: this.shape, state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages - 1) }, index.h("p", { key: 'e4d7d5742ffde0984d7766b90b0e3a73080eac6e', slot: "page_number" }, this.totalPages - 1)), index.h("gb-pagination-number-base", { key: 'c9a96d57f307999ff6dc6609f5559858ed07d80a', shape: this.shape, state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages) }, index.h("p", { key: '6ef85456602cbb0ae1b59c3009b048399a6d4bc6', slot: "page_number" }, this.totalPages))), index.h("div", { key: '79c8888876713d5468335afc3ebcca41ed709615', class: "pagination_btns" }, index.h("gb-button", { key: '6942016b093b2a5be8ba9b075c70c4b3d92337c9', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("gb-button", { key: '0da45ea24a0ea7045547aeade0723c79d5570cd1', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() })))), this.type === 'card_minimal_right_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: 'b87d691c3807806d90acc84eeae2dd44a0d90d0f', class: "pagination_entries" }, index.h("div", { key: '1be17d80875f5c531e7836395cdd12f5fc3b2af5', class: "entries_text" }, index.h("p", { key: '742d06103a630f0f6a1330b7b6fca1e0de93127e', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: 'b1ad026cd6085e45ffdf379b9ad54b9aa1af649c', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: '049bf46246f3dce55acab1c36f1f7030f7c4bd4a', type: "default", state: 'default', size: "sm", "show-label": false, "show-hint-text": false, "show-supporting-text": false, "show-hep-icon": false, items: this.entries, "menu-position": "top", onDropdownItemSelected: this.handlePageSizeSelect.bind(this), value: this.defaultSelected }))), index.h("div", { key: 'a5dd94b4eb1bbbe7cf084f02fd16ff506bcee3e0', class: "page_number_text" }, index.h("p", { key: 'f240a4b8bf3619fa019a9ebc7284c8d57d07514c', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("div", { key: 'e1dd2440305bc5c9739f5a2552bb706241b8548c', class: "pagination_btns" }, index.h("gb-button", { key: '0b0617648801414d0e52c487d30b0552b675b043', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: 'c059ce96c033a82676dc10d5dfe86a2e43c92abd' }, "Previous")), index.h("gb-button", { key: '7693681187756fab202cafd7296c3a119f8d8826', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '0e07bc3dc1f96f11689af5d95f791818b5894764' }, "Next"))))), this.type === 'card_minimal_left_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: '5e571980aa2a7de9828da0fbe774223dc01253d9', class: "pagination_btns" }, index.h("gb-button", { key: 'cbdf01f3e19032009e1856302debcd44ecee4d1f', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '7c8d00f9e39ebdd55cefafc56c185ec4412fe7dd' }, "Previous")), index.h("gb-button", { key: '1373c3a2cf8c34ce9a311e917dc06840dc174c2a', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '6bdfb6d8c6efbdc9e1dd7fa2fd2bf39316d70618' }, "Next"))), index.h("div", { key: '7eec7e10c96d9da35cb96b3e3fda6dc123b54e8c', class: "page_number_text" }, index.h("p", { key: '3a63418c3e6f14bc70eb317e3f5c9ab0a008c582', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("div", { key: '658eb6ee2c9d6e51c36592e9a38872718fa8f2a9', class: "pagination_entries" }, index.h("div", { key: '85ea0e1f531d67226f0f29b9f29944d774323e11', class: "entries_text" }, index.h("p", { key: 'f6212361d5829c68ae78a2b53457a567f19ea6a8', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: '2c8450a9c8ff15d26624db51dfb97a25403bef0f', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: '51bbcdfc210fa3bcd4faf3a06a6062325914696f', type: "default", state: 'default', size: "sm", "show-label": false, "show-hint-text": false, "show-supporting-text": false, "show-hep-icon": false, items: this.entries, "menu-position": "top", onDropdownItemSelected: this.handlePageSizeSelect.bind(this), value: this.defaultSelected }))))), this.type === 'card_minimal_center_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("gb-button", { key: '8d3f14a6db194b554ece059bb8ea2ad1e8b2d498', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '255ea339eacf87e48c0e0d4e78428141b9699564' }, "Previous")), index.h("div", { key: 'da4ef682fa23b114da60119cb02ff5c4a8870893', class: "page_number_text" }, index.h("p", { key: 'c1ad27b54bed47837c26d8ee54b78d92da60129a', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: '8280c0d13c2a81a75fc679e69b15477030023d02', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '6725fcbb408bf1c5f7d5f4f1474d90953f665c9d' }, "Next")))), this.type === 'card_button_group_right_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: '359c3796f74b898ef8e70868826fbd6258f62d93', class: "pagination_entries" }, index.h("div", { key: '533d8e33cad4e6111749f48b7b818549e4baecc1', class: "entries_text" }, index.h("p", { key: '9f67b80ce80bfd3f07a12274f90b50e5dd01d8f2', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: '448a7b8e600c448957345cca470af54bb5d277e3', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: 'f06e064c60c2f7e731b0adcf1cb80a4b4118dcee', type: "default", state: 'default', size: "sm", "show-label": false, "show-hint-text": false, "show-supporting-text": false, "show-hep-icon": false, items: this.entries, "menu-position": "top", onDropdownItemSelected: this.handlePageSizeSelect.bind(this), value: this.defaultSelected }))), index.h("div", { key: 'd8f678ea755cbf114386e72a7fdc7fb1601483a5', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: 'ba2ce107b19dabb80ce8cb123af4240cda1f30b2', icon: "leading", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '840a695aeae0863028f38eb73a0bf9e336a8bd9f' }, "Previous")), index.h("div", { key: '1e389ef2c9d20fa435ce894030d2c185f76c7cc0', class: "btn_group" }, index.h("gb-pagination-button-group-base", { key: '939f0a1904fcde30ce03345c200499a367f1d6b3', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: 'dd575a58b05da5277f71141ddb7634baf4e69b85' }, "1"))), index.h("gb-pagination-button-group-base", { key: '29fbd76eb5876ec4e6bf25e7e6eb81d5eb7dc905', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: 'a4f0d1704de74f26f31881b6e668a5405ad199be' }, "2")), index.h("gb-pagination-button-group-base", { key: '56c3f38a46ae5f7d7e6bb682efc40b0ac4a04527', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: '2e108744c07f576175bbd28cf2ce4e4f0fefd7b4' }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '45fa1b26dbb8bb85089dd3d6c76f1dbddbe6fcdc', icon: "false" }, index.h("p", { key: 'ae53051b93dac331f76e569e3d6a66773ea53a2c' }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '2978f36822a8a913ebcbad28fb2c69314a7ecf45', icon: "false", state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 2) }, index.h("p", { key: '63e98dd2d7f28def637ced35e5fc5d17b13e32e4' }, this.totalPages - 2)), index.h("gb-pagination-button-group-base", { key: '1078820df125fca255a4bed6c3a91f018fdb7b9d', icon: "false", state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 1) }, index.h("p", { key: 'e287ac9976ea0d56f1ac56e6fa0c159a8aba5b22' }, this.totalPages - 1)), index.h("gb-pagination-button-group-base", { key: 'c4c13902d641df147b90a423cbfce4a523ac89a4', icon: "false", state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages) }, index.h("p", { key: '42850bfa66760dce7c83d605c4b6f23bc91128ec' }, this.totalPages)), index.h("gb-pagination-button-group-base", { key: 'c20176b9161e5e064712cecec4dcf05a3ac8d4c9', icon: "trailing", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '42ea8a1fc987a4eb44759f9ef2f604013d0029ac' }, "Next"))))), this.type === 'card_button_group_left_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: '0058d50622e1576c4a3ba32f12f94b1687b7d696', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '5f63084b2d1d644db1c7c68833806415d9ca1939', icon: "leading", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '25049aff18c18c6d2f5b5109cd65671aef0d3ab6' }, "Previous")), index.h("div", { key: '5a4f93e97ee50631a9c2b48b9fb44aa5e7bec942', class: "btn_group" }, index.h("gb-pagination-button-group-base", { key: '2aeddb91c77c9f04d82e26586bc5e56cb62e8482', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: 'bf1fffeba875e42fb2a497785cbffcb12234ba38' }, "1"))), index.h("gb-pagination-button-group-base", { key: '89565e6f611b703b5621e4c724794a412f4e6a89', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: '69da90ed0d07c0ba3ca63f676cc621f6a6d9fdf1' }, "2")), index.h("gb-pagination-button-group-base", { key: 'f6aff0b1e026afe6b9a60318d0fa52ef02001888', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: 'b8cb056e5a0dbe21829be22840cb9fe685af5abb' }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'e195a7b17c56e4cac48f8ecb4cf39e83392bf859', icon: "false" }, index.h("p", { key: '3fb9d3c3fc0d1de69577336daa60c032f357f7b7' }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '0fb403528fafa8b874da60a947dd98b06fccc670', icon: "false", state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 2) }, index.h("p", { key: '52f361313920533ac3d23e97fc397ca23e57d746' }, this.totalPages - 2)), index.h("gb-pagination-button-group-base", { key: 'fec08bc492dfbeb16eca189eb2bb0f7e260e127a', icon: "false", state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 1) }, index.h("p", { key: 'c34ef5349a03a5a078de6f12a83878dc3a964614' }, this.totalPages - 1)), index.h("gb-pagination-button-group-base", { key: 'b5699f5ee30a96eba64c7d71ef3aabff17f930a2', icon: "false", state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages) }, index.h("p", { key: '2499b92b8210afdd586d145407a668d67ee393d8' }, this.totalPages)), index.h("gb-pagination-button-group-base", { key: 'fb9b6d6e08074d3082b6e8871f1bdfb8edcf049e', icon: "trailing", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: 'af0b7a25097759db9e53fc5b953d1b8c81bea105' }, "Next"))), index.h("div", { key: '5a70cec7f6aab10dedcfa1a1bb06ea46dcb7e88f', class: "pagination_entries" }, index.h("div", { key: '13f58004bb91578eb36a3e71b6b9dd968d85279d', class: "entries_text" }, index.h("p", { key: 'be1df2ed620940fc3d348ce4025082b6fbc765de', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: '8765386ee117516dae0eed2362d595c59fd57484', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: 'b5b5e76d4c724761cda7fef4d80de74f62760fde', type: "default", state: 'default', size: "sm", "show-label": false, "show-hint-text": false, "show-supporting-text": false, "show-hep-icon": false, items: this.entries, "menu-position": "top", onDropdownItemSelected: this.handlePageSizeSelect.bind(this), value: this.defaultSelected }))))), this.type === 'card_button_group_center_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: 'bf75a0b80016345ea8bb8540d5480afc2b5cb48d', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '702bab02ab03a5ad1ce49ce377716a82a315d192', icon: "leading", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '8d60ca898772cfee490f6ced8e51c09e11e2cc3d' }, "Previous")), index.h("div", { key: '1aa6bf74075ac0cee0d64d49a6d7a1185f683f83', class: "btn_group" }, index.h("gb-pagination-button-group-base", { key: '28835a77188dd3296ce59ab49515a020d7e6a1bd', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '7769fffa4f1a352f3512c155da067bf6720aa005' }, "1"))), index.h("gb-pagination-button-group-base", { key: '8e7eb2b4b2d2e88a496ab78f4e5f5568af420b4f', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: '370dab76a9221d68e659252a3099574713f991ad' }, "2")), index.h("gb-pagination-button-group-base", { key: '66237234c68ce347a3fcba2393dc47e59c4fe475', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: 'e5357d7ae214b744cff0b9bd44feb9734acfd944' }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '75e8783af68a6aac0f4f3761d5f7225229b84d27', icon: "false" }, index.h("p", { key: 'ce222f6c649392fe1240e33bdfa2f22c13262bc6' }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '565d826bec2ea9ec6736896a2db8b675367be2da', icon: "false", state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 2) }, index.h("p", { key: 'a621fd827e3092201faca8c831ed6c63c7cd356e' }, this.totalPages - 2)), index.h("gb-pagination-button-group-base", { key: 'bc882e1e2d01f654f1ff0570f4d1074f3bc09492', icon: "false", state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 1) }, index.h("p", { key: 'c12489d54b579e91fae3f67da641c701a90b69b0' }, this.totalPages - 1)), index.h("gb-pagination-button-group-base", { key: 'e707f02156364cf50a75a560ff8742e9d2e4dd4d', icon: "false", state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages) }, index.h("p", { key: '8d05ad36af4b56ef2737da648e6e9de9df5fd1f8' }, this.totalPages)), index.h("gb-pagination-button-group-base", { key: 'adc8241b0672e595da609c1c0a02a0211fcaf252', icon: "trailing", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '6e6058242e914e4abfe68b4bf5c1f38767099979' }, "Next"))))), this.type === 'page_default' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: 'dc4eccff0409a967bd6ee297e728f647c2f2b887', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: '57ca517b306fb7ba317038c9a03e00b84cb27cbe', class: "page_number_text" }, index.h("p", { key: 'a142ca41427ba56589c2896406e1c6be86f0740b', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: 'aad30f2bf1fa8ff886fa692637bd6ec525dc1d50', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'page_minimal_center_aligned' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: 'b40d49595980ea6c5752d46f7be19ddceae51b29', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: 'f46636ab271be85ae320607a6b4558e1091d1781', class: "page_number_text" }, index.h("p", { key: '2b8aab33a589365d54edca4794e50db315d9fa02', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: '0048ad149ed4d5dd88ba9a7a4957c8bffa5d0a71', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_default' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: '6c116802430f9a68b882063b959cd6213f79c82e', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: 'be6754ecc7cdb0385e3d47d9146b3f15254dcd86', class: "page_number_text" }, index.h("p", { key: 'aed82e00ef6d63733340725eb197431206f8fc60', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: '0eedd4b594361edd6ef92ce304885d9d047ebabb', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_minimal_right_aligned' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: 'fb8ebe358cd55dfcd4788d5d789e3dfe41d92934', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: '66da2f92925dc55952133b025ff0446470b3613f', class: "page_number_text" }, index.h("p", { key: 'f08c8e781a129524bbcab598b637f369e24b54ed', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: '62495378679a5445a3b32e2917ce93352000ceeb', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_minimal_left_aligned' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: '6d6a989cca989ed4b226135e67eeb76ca08f12df', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: '8426ecfe0409afde203180102c225d8622dea0af', class: "page_number_text" }, index.h("p", { key: 'adabcb7acba8c1e6aaaff47d3f95ddede8baa059', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: '2e5e9eef612e65e813ddbbd6daecc814c6e418d0', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_minimal_center_aligned' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: 'b90206cf1b6a81c2a86a3122b29bdc0b244de83f', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: '3a74626afc1eab5280447cebad06218b0c267403', class: "page_number_text" }, index.h("p", { key: 'a9057500660ed00544cdeb81825032b1b2afce5c', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: 'd9291557f789b0723b7d9820a809e59c85b7c328', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_button_group_right_aligned' && this.breakpoint === 'mobile' && (index.h("div", { key: 'e90da5b4fe18cc8d80e6f6efdad689573714e86b', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: 'aba7d4def14e15ddef1b5db713e39b8d4923b489', icon: "only", "icon-src": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: 'a9045790aedde3854214506464ebc00ed3dd7afa', class: "btn_group" }, index.h("gb-pagination-button-group-base", { key: '7d98142cb771b8c5473359b3f702c65f526d5810', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: 'ca3f503249a0cd7ece7c7e0bae82fd9065dc30b1' }, "1"))), index.h("gb-pagination-button-group-base", { key: '2c118fcadd04b74135d0211c77de2d7020c32894', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: '90a09b82954ce7e8b31236908e89f39bb57efe7f' }, "2")), this.currentPage > 2 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 2 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'eed3cf3b4a591f457c9425e239859d41ec63fad2', icon: "false" }, index.h("p", { key: 'f36f342cbc254560b4d090e2aa1e912d42d5d0e2' }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage <= this.totalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.totalPages / 2 && this.currentPage <= this.totalPages - 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'd2d2a76bca752032aeda5bfda8bc7b3f992dc0ed', icon: "false", state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 1) }, index.h("p", { key: 'a1f449e869bacbd46102551f5c45a0c35257dc4f' }, this.totalPages - 1)), index.h("gb-pagination-button-group-base", { key: '53f1529fa2ba86c0f04d88465ee8e665e9cc52f8', icon: "false", state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages) }, index.h("p", { key: '3fb5845c75772015a1506f9f9c73758cd1f16230' }, this.totalPages)), index.h("gb-pagination-button-group-base", { key: '7d918f43f5177e1c5d89096dd6ed245ff30f9597', icon: "only", "icon-src": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_button_group_left_aligned' && this.breakpoint === 'mobile' && (index.h("div", { key: 'b96a8960167e8ba40f68dbc1851221226a913f30', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: 'c4232a8e9c34087b20eee190af1393e5621a7c14', icon: "only", "icon-src": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: 'fb5ea10d09119dd1a9f71c5c839cf2789e248027', class: "btn_group" }, index.h("gb-pagination-button-group-base", { key: 'e5edf6e596bcc2716f6a7da587cf8abae95d7e75', icon: "false", state: "active" }, index.h("p", { key: '154fca73a2302301c7293aa755b3ec81dbf4f563' }, "1"))), index.h("gb-pagination-button-group-base", { key: '7df052be1b0765e5386b3a56e47b8ccc4cfec075', icon: "false" }, index.h("p", { key: 'af169294b67dba868100787c33369e7414d2826d' }, "2")), index.h("gb-pagination-button-group-base", { key: '6a5984da3ef24da46641dd8a6d6c5fadb2539bef', icon: "false" }, index.h("p", { key: 'e6ece64886c33b738ffbb29975ebe9beff5e03f5' }, "...")), index.h("gb-pagination-button-group-base", { key: '4c060e4dce64defac6768100e243c032c0890b42', icon: "false" }, index.h("p", { key: 'ab1a1b44bb1fc4ba1d786683838836cb1b501474' }, "9")), index.h("gb-pagination-button-group-base", { key: '981d14355d7693de83f0b0661a0f1147f79924af', icon: "false" }, index.h("p", { key: '481e2947c096d8534ac3caf972e93c3d236e8015' }, "10")), index.h("gb-pagination-button-group-base", { key: '32e1c0d9cacea04283914bb378d110d394f5fb2c', icon: "only", "icon-src": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_button_group_center_aligned' && this.breakpoint === 'mobile' && (index.h("div", { key: 'e2ce633d1e2d3b8926c4bb291e1d17183b7281db', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '7fc0cac27c432c65965e6ce94c932de6fa907fc3', icon: "only", "icon-src": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: 'c565a61d1edc43d60f56905a79bfce1bedbdbe65', class: "btn_group" }, index.h("gb-pagination-button-group-base", { key: 'a36762cd48abc882a7cc43e12ae0cd1517fe219c', icon: "false", state: "active" }, index.h("p", { key: '1946e75a03d0a0f22165c2f4023cdf2168558a60' }, "1"))), index.h("gb-pagination-button-group-base", { key: '96dff69d9c5a5cded925b2f17c671a595d8c6784', icon: "false" }, index.h("p", { key: 'a6a22bfca2e4f8e59bae9679c81e7ea25fc45627' }, "2")), index.h("gb-pagination-button-group-base", { key: 'c3bcb9398c782a91ab1e2a1bf47d611e2da06178', icon: "false" }, index.h("p", { key: '715f139d0ec8cb0f33394ab4ecec9894153f3b84' }, "...")), index.h("gb-pagination-button-group-base", { key: 'dc95bcbb5bdde52810e2bbf4c793304ee23ab82d', icon: "false" }, index.h("p", { key: '359eb385ef16e9b569be84025b2ed33fa5de0d4e' }, "9")), index.h("gb-pagination-button-group-base", { key: 'f19909dd58d5f1f28f1852f736a75e259257ffa0', icon: "false" }, index.h("p", { key: '6a0f6f72dda071e99c04ea167b7d0bb1a3c7c380' }, "10")), index.h("gb-pagination-button-group-base", { key: '9bf66bc400bee63d432f9b24b53456de59f59c80', icon: "only", "icon-src": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() })))));
+        return (index.h("div", { key: 'af29cef04268edffb53e1e3e5efeced5aacccfa7', class: `pagination_div ${this.type} ${this.breakpoint}` }, this.type === 'page_default' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("gb-button", { key: 'ec73a7913885f5f75202a0731da343b75614da28', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, index.h("p", { key: 'e5ecbd006854cbbbc5ade79bdca00dd7af1089a8' }, "Previous")), index.h("div", { key: 'e8bdc9e50caa6412655d52f971d413e5fc64438f', class: "pagination_numbers" }, index.h("gb-pagination-number-base", { key: '68d6cca5e2d60b29f2123a5ba508dff1a2e52e64', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(1) }, index.h("p", { key: '7ed3b14261dc88dfd67cc4c302c686d88389ece3', slot: "page_number" }, "1")), index.h("gb-pagination-number-base", { key: '2baa5eb792cb9a99a2d82cc7b91cc6b70e926fc6', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(2) }, index.h("p", { key: '7675a45eb55d913749f8b65b1448cf578a6bb526', slot: "page_number" }, "2")), index.h("gb-pagination-number-base", { key: '85c1779f0afcc70ec45a8dca78f54d251e11f04f', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => this.setCurrentPage(3) }, index.h("p", { key: '4b50dc266b7f52453066459838d93f8db8e8d708', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '1ef632af3e209c671433af09fbdfd76b05f40773', shape: this.shape }, index.h("p", { key: '7c79a683eabe9d8b96305aa499c9f27999b6bdc6', slot: "page_number" }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '93c0327782ebc254df23582808346903a9728cb1', shape: this.shape, state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages - 2) }, index.h("p", { key: 'b69ad8bf345312ef43579237c848e07c84ffca18', slot: "page_number" }, this.totalPages - 2)), index.h("gb-pagination-number-base", { key: 'afaffb2f8aa223a97013965ddd200c3b873a4874', shape: this.shape, state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages - 1) }, index.h("p", { key: 'e4642363d172eed7551fcdb0506e2250afd2f207', slot: "page_number" }, this.totalPages - 1)), index.h("gb-pagination-number-base", { key: '7614e12138be4e24a9220c0935a13167782c7dca', shape: this.shape, state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages) }, index.h("p", { key: 'f99b1e33a2c715a92d4b04d0f65cfe1b044323a3', slot: "page_number" }, this.totalPages))), index.h("gb-button", { key: '2e063015b4a884f6d29d88adba64891d53bd1a52', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, index.h("p", { key: '1aa3d06b95bb6cf2720d3fb51308eb52dedb34d2' }, "Next")))), this.type === 'page_minimal_center_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("gb-button", { key: '46e97f58f9d9bf901edd74cd71d7347233653799', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, index.h("p", { key: '946769631c48121ddf50bf91413acdbc19e1b382' }, "Previous")), index.h("div", { key: 'c1ab83c5b02b5c28f9efd615b3cc740a17ae9523', class: "pagination_numbers" }, index.h("gb-pagination-number-base", { key: '0902a66510fe67fd430970b8b8b7ce971b1d062c', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(1) }, index.h("p", { key: '1e6e62754534d312c2ad9599c30242d106ff2dac', slot: "page_number" }, "1")), index.h("gb-pagination-number-base", { key: '3ca718ab9b4a6b091e03ed50a043d98f56822ebd', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(2) }, index.h("p", { key: '98208487eae2f987a3716b5771b9935f2ca60a2f', slot: "page_number" }, "2")), index.h("gb-pagination-number-base", { key: '1e04d58c53f4b5da0991277e8330f43925bc1872', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => this.setCurrentPage(3) }, index.h("p", { key: '6bc2eb7d2c0be4a0b5b5ad546658241a16184383', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: 'e1c2cf870adb907b0e3e947c76b30d72e1020368', shape: this.shape }, index.h("p", { key: '991ac2a1b85c9d306e793edbe71be03f10110448', slot: "page_number" }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '094936c0ee31d929936880435560478a5b450e7a', shape: this.shape, state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages - 2) }, index.h("p", { key: '4f09812d0a78e2dc4fc8d76a9af20708c3a8d33a', slot: "page_number" }, this.totalPages - 2)), index.h("gb-pagination-number-base", { key: '4af6859cb4c1ef5b6ab6f3787460da621d74df00', shape: this.shape, state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages - 1) }, index.h("p", { key: 'b4508c2da046b859bd5270e9c6a09a3941556cc4', slot: "page_number" }, this.totalPages - 1)), index.h("gb-pagination-number-base", { key: 'd78dcf7e3c6580d36d1f235a092b5e28a8d56e12', shape: this.shape, state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages) }, index.h("p", { key: 'a73f1be2da5264ffdc238734f65cce34f260e739', slot: "page_number" }, this.totalPages))), index.h("gb-button", { key: 'dfeebfc138b9c172cb5ec916d9c36d8edf80977a', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, index.h("p", { key: '9ab21d8033949d67b1537e5b62b7f521cc72c661' }, "Next")))), this.type === 'card_default' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: 'ca3002945ee685ce64316d89e4d685039d74e10f', class: "pagination_entries" }, index.h("div", { key: 'cb67f49d84de1eb4406c1ab39d53c33e8200a0ff', class: "entries_text" }, index.h("p", { key: '62d6de4628a3f2ee6874d1f6e7296f4f39c44a44', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: '0b372c2c67d36a7ce8a913549ddf758dc1a9c040', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: 'b2501dae577d276af219d0d0d183c3336f1b9e81', type: "default", state: "default", size: "sm", "show-label": false, "show-hint-text": false, "show-supporting-text": false, "show-help-icon": false, items: this.entries, "menu-position": "top", onDropdownItemSelected: this.handlePageSizeSelect.bind(this), value: this.defaultSelected }))), index.h("div", { key: 'c90b2d2b975f3fd74bef39fd63895d072d0ea3d2', class: "pagination_numbers" }, index.h("gb-pagination-number-base", { key: 'ec94e427e47ac58217165cff84e06fccc7112ef4', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(1) }, index.h("p", { key: 'e1fc77af437d8d19e045fd052efa24b37a1487d3', slot: "page_number" }, "1")), index.h("gb-pagination-number-base", { key: 'ca8dd8e07994389cff7028be6a166eefddacd5dd', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(2) }, index.h("p", { key: '048406c08565e5a74ee1bdb925dd811d866934ef', slot: "page_number" }, "2")), index.h("gb-pagination-number-base", { key: 'd62ab10c2fff23938f294f37ce97cb2bf9a6eccc', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => this.setCurrentPage(3) }, index.h("p", { key: 'daea714330cd780a695bf7fab73afef2e0d9a291', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '9942c363fe157cecafef3012c15cbfe16ffe1c76', shape: this.shape, state: "default" }, index.h("p", { key: '41d51b9f1c1f1d99811505729c3b0543ffc92dad', slot: "page_number" }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '28f77247ad4acef32f1ae3d879f8805ca574030e', shape: this.shape, state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages - 2) }, index.h("p", { key: 'df3619e64004a5f7118b2bece1d6c1075e6b239d', slot: "page_number" }, this.totalPages - 2)), index.h("gb-pagination-number-base", { key: 'd1e46ec14ea5120581aa3c53491a568d9cb2ab71', shape: this.shape, state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages - 1) }, index.h("p", { key: 'bac5063c50a553d0fa8010e80c94e02a64392a74', slot: "page_number" }, this.totalPages - 1)), index.h("gb-pagination-number-base", { key: 'aaf1c097b8298011dc8afee2eabc2332e4746074', shape: this.shape, state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => this.setCurrentPage(this.totalPages) }, index.h("p", { key: 'c1556ac1013cdbfcf99c976edb57b0f295e3fcd0', slot: "page_number" }, this.totalPages))), index.h("div", { key: '9d07e7c17fb379a5b74a5dc2504ef6595f1208a7', class: "pagination_btns" }, index.h("gb-button", { key: 'f3f892a497a8fcabbe0cc420fe72b0244b85b729', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("gb-button", { key: 'b6e6c74c5340e75b235402f81d34a674ebc82184', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() })))), this.type === 'card_minimal_right_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: '8ddbaa8428089d3279020d173e2e09d2b7e1efa3', class: "pagination_entries" }, index.h("div", { key: 'a08d044e6f8fe86423a53f6b63f79199565229d9', class: "entries_text" }, index.h("p", { key: '6a1dec4ab8c3a3ee7a49e1cc977cd983f0515912', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: '192a4638c6549fd0149dbe636c2d4a25c258773b', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: 'f24e100fe7a0c6fc78292bd9be079939e7a6fcf0', type: "default", state: 'default', size: "sm", "show-label": false, "show-hint-text": false, "show-supporting-text": false, "show-hep-icon": false, items: this.entries, "menu-position": "top", onDropdownItemSelected: this.handlePageSizeSelect.bind(this), value: this.defaultSelected }))), index.h("div", { key: '88d27d2858e8dd68318013ae644e0ea3b9096c72', class: "page_number_text" }, index.h("p", { key: '01495982d916b01b22fae1910a264817f20fd35c', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("div", { key: '3479d4fb3428965a38d508c7c1ab81348a39b037', class: "pagination_btns" }, index.h("gb-button", { key: 'ba7efb50d15f431a4a4942b36e07b1ac5c88e056', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: 'eedccced68554a3415d42488b61e6028ed27fe77' }, "Previous")), index.h("gb-button", { key: '17cde5ca001fab382ca28326c85e9730114a5912', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '12c00df5c723d2eaa1e40d3d45df2fa8101e45a9' }, "Next"))))), this.type === 'card_minimal_left_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: 'ca9be67195dddacbace4c6ee17d0c9b5f4b288fd', class: "pagination_btns" }, index.h("gb-button", { key: 'c092c0fcf152a54caace99b68e0343b590caf978', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '67446262125006ae6a83af3630a62cdff89f0452' }, "Previous")), index.h("gb-button", { key: '076538e4856956bbb7577f1339ea071d1f1ba4d2', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: 'e1095537c0a4208b6518ad3c340b1ddf6722c1b7' }, "Next"))), index.h("div", { key: '0f0ef4f47cf909b85e1bf7cf7d880ff4cb1ed176', class: "page_number_text" }, index.h("p", { key: 'c475019e6f6e42d8ce7256ee85ebc89a8582a8d5', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("div", { key: '3b03d605b4afe2d78413f6a84a60c2712fb80da1', class: "pagination_entries" }, index.h("div", { key: 'e3142bedd606c2e0f31070dea38ea0af6399a4e4', class: "entries_text" }, index.h("p", { key: 'a8bf373dbeb987309576e0ad3966b17954db7afb', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: '7ab6e1d5c18614a4f0b363871e1158035f10f8b6', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: '49ae27732347ed3de1e6eec048310461c6c869b3', type: "default", state: 'default', size: "sm", "show-label": false, "show-hint-text": false, "show-supporting-text": false, "show-hep-icon": false, items: this.entries, "menu-position": "top", onDropdownItemSelected: this.handlePageSizeSelect.bind(this), value: this.defaultSelected }))))), this.type === 'card_minimal_center_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("gb-button", { key: '46e60da1ed9062ce75d589162cc0c23e462f3698', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '4bcfce367d7686cea6bc236b22df47e9931a4b12' }, "Previous")), index.h("div", { key: '453b63b7237062eeef1c236110a5f1af8f581df4', class: "page_number_text" }, index.h("p", { key: 'b1eae46926d80541fa473628e92dbb640d738082', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: '4ca9ecdd27788461af45e836cb498e1517caa87c', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '287fb5493b80f7eafd96e3ff76e988a31afd22c5' }, "Next")))), this.type === 'card_button_group_right_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: 'a0b1012e48dc21a1dbe46e5bf9627b80a63c0da7', class: "pagination_entries" }, index.h("div", { key: '2312828cbab9b641e83272be5ee79b020740f1b4', class: "entries_text" }, index.h("p", { key: '22a807dbf4c8fd8282d72f3da8846f768e8505de', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: '8b512fe822aa0144da5618520b225b3fe9f9593c', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: 'e9ed418218ef21cd2a978757676451eee5979995', type: "default", state: 'default', size: "sm", "show-label": false, "show-hint-text": false, "show-supporting-text": false, "show-hep-icon": false, items: this.entries, "menu-position": "top", onDropdownItemSelected: this.handlePageSizeSelect.bind(this), value: this.defaultSelected }))), index.h("div", { key: '6d8efbd2d714397ef7f85ce63dd0664fe34a5b85', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '5f53327717dd3e3963cc57036da6b34dc4626434', icon: "leading", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '5edf942202d73b0b22321b7ecc497d2a96d52e1c' }, "Previous")), index.h("div", { key: 'fdb2127ac94515f9603fd65a5f283c96dceb270a', class: "btn_group" }, index.h("gb-pagination-button-group-base", { key: 'bd5c6ab07df90ccecba892f85b1e496cb66140f4', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: 'dab694288d5e1afbf86fbfd9f2d0ed079e981a3c' }, "1"))), index.h("gb-pagination-button-group-base", { key: '60e781b70f08011e01517f810adc5e1584f609bc', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: '938e1dae33ccb4df85111234b5ae6c0d9350ae76' }, "2")), index.h("gb-pagination-button-group-base", { key: '50e2bc0210cd3f910cbd0ffafd20c03227f4502b', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: 'd1d5484d05620ed2bef65f818662e8e8637e1006' }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '93b05dea70624f650e4dc0165580d46a40ee4520', icon: "false" }, index.h("p", { key: 'f16a06894215e87f65c236482c6401db9077c880' }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '942f42bf36aa9bab6ea4d5150dd9e130de178aaf', icon: "false", state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 2) }, index.h("p", { key: 'e017c95b04262d970f4974f70768d2d16a198ad9' }, this.totalPages - 2)), index.h("gb-pagination-button-group-base", { key: '95ca88e528df7e733867a2c594e135c40c16c4ed', icon: "false", state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 1) }, index.h("p", { key: '680df9a467468f97451df0a6200a9e42a45f5b84' }, this.totalPages - 1)), index.h("gb-pagination-button-group-base", { key: 'f2343d8e130330ab2206d484c9a966593d404f22', icon: "false", state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages) }, index.h("p", { key: '5dacf30cd4f918204547dff50edf81096b9974b0' }, this.totalPages)), index.h("gb-pagination-button-group-base", { key: 'bb2883b46e7dbffc8bb8a9e4bec2491065fffe19', icon: "trailing", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: 'ab2dd73b7179d5705b873ff3e46c687f877c4ae9' }, "Next"))))), this.type === 'card_button_group_left_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: '43a954109a06eb1b0501f287b92c7b742a6ebc62', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '6d40e7d49851fa4cb8804cb776108451bd9f007b', icon: "leading", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '5023c9566bdfb25fc6ee9c4819f168860b4a1684' }, "Previous")), index.h("div", { key: '4008318b463990a1cdf8ca975961088e9af6a312', class: "btn_group" }, index.h("gb-pagination-button-group-base", { key: '404097c2e4478efe202c09e11ef7046c51e1d733', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '9e0e41e11f5ffe472e561ea06dba30a9c5c77b4b' }, "1"))), index.h("gb-pagination-button-group-base", { key: '5a77f8080adfba4cfde1973ede71d0fec1d18ab0', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: 'e7adb8897887c6f3135dbd640c4fa0f70d332abf' }, "2")), index.h("gb-pagination-button-group-base", { key: 'e4da644637fb0f038b744eca45cca0fe04adda68', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: 'd893ce10d253eb35b7a6477dfa18e393dc87adaa' }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'b8808c6ff4e819df1f0ae2ac5e3b28f316ca9e12', icon: "false" }, index.h("p", { key: 'e356954fcff5fc66a14663f5f430e79e2e8ac562' }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'b80f1196f9f32d795200f02a057bf4393590fa69', icon: "false", state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 2) }, index.h("p", { key: 'a22f72cb978a2e152681637d408d831086299cb4' }, this.totalPages - 2)), index.h("gb-pagination-button-group-base", { key: '909f474b4f705d8344413e87ccd6ac86a0bf124a', icon: "false", state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 1) }, index.h("p", { key: 'bced7024c9b3532780550deda63e177d315499fd' }, this.totalPages - 1)), index.h("gb-pagination-button-group-base", { key: '4219877c268c51ebfa1b5677070be0fdcb2225e0', icon: "false", state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages) }, index.h("p", { key: '3113c87f8e139dc8ca6c49342803394d02d68132' }, this.totalPages)), index.h("gb-pagination-button-group-base", { key: '458fcd9873910f09c14b816b9babc6d48b644ce9', icon: "trailing", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '9f02e1d7714dbe5131dae3f7a4488aa63b82cbff' }, "Next"))), index.h("div", { key: 'a00ce9390ddbb77f5c772ce48879d6449e511fb1', class: "pagination_entries" }, index.h("div", { key: 'b26d48fe5493dda904b48c03141884494a30a7e5', class: "entries_text" }, index.h("p", { key: '6cf5e53b15cd3b4bd35cfef05f60938a23906538', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: 'f87423d3de439c474b3d53bf55e92e5d9b2ce5d9', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: 'ae4ae60ec51c0361fa698e4010d79ce189b4330b', type: "default", state: 'default', size: "sm", "show-label": false, "show-hint-text": false, "show-supporting-text": false, "show-hep-icon": false, items: this.entries, "menu-position": "top", onDropdownItemSelected: this.handlePageSizeSelect.bind(this), value: this.defaultSelected }))))), this.type === 'card_button_group_center_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: 'e6232ba776e096f2d70b16e66841e013bc7914ae', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '89317c3d833e69755159c1236ba38969037981cc', icon: "leading", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '706343f4b2b2f5102a46a46aeda6ce4206093d97' }, "Previous")), index.h("div", { key: '892143ceaa10306825575db12e7562a9943f0924', class: "btn_group" }, index.h("gb-pagination-button-group-base", { key: 'f5ff1f723892e3d563ac6a5754e8a54c3e953b6e', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '39efb74dfe7f78df342ca16f36bb493f7ea47c5f' }, "1"))), index.h("gb-pagination-button-group-base", { key: 'ea8e0864fb180834df1ef2179d8cb058b2caa2ad', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: 'acfe4aa144a544ba12c67c159ff4398f2252d5ae' }, "2")), index.h("gb-pagination-button-group-base", { key: '713d3fda7396169950de128dbc62e42c533dc07c', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: '9f6cdb91d87a3620f3e986e91fa39e9b372bcd27' }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'dda54c063f62c8906ba5bb5ab9ddef7fdb3e439a', icon: "false" }, index.h("p", { key: '9f59e0140e06c997ce641402d8400a23aecb8df4' }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '0c5581d2a401163ad833af9058b0293ca212dbf7', icon: "false", state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 2) }, index.h("p", { key: '8c2ac05196c017db6e5716b1b8a3e6f059bf69d0' }, this.totalPages - 2)), index.h("gb-pagination-button-group-base", { key: '3fc871778986da29a80f0e4f954a109f3ac481ae', icon: "false", state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 1) }, index.h("p", { key: '2cfa17e6a925fb909e4d54ace8dd16c1632bb4af' }, this.totalPages - 1)), index.h("gb-pagination-button-group-base", { key: 'b5637e88ffbfb066839dd92b137be6e6a353a04c', icon: "false", state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages) }, index.h("p", { key: '19f13cd862e95e6ee02e20c6d85536e2697a906e' }, this.totalPages)), index.h("gb-pagination-button-group-base", { key: '66753ddb7c7ddc053020c617aeaf177fcc5b627c', icon: "trailing", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: 'cdc83b03ef3adb4b93586cec926fb4dff54aa389' }, "Next"))))), this.type === 'page_default' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: '7f7e046345b3d557e8df5d76759c30a1a7145470', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: 'e34246e0571c0ef95b08926fec6d570000d4fdbc', class: "page_number_text" }, index.h("p", { key: 'ebe105c124c402af0b3f53346cb55ede4e89acb9', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: 'ec9304ef9b36899d758d8c60bf36830c9508a4c8', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'page_minimal_center_aligned' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: 'b1ab7b1ec726f73f46e343f29e263583786eefdf', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: '745c561319b4f4a6827a26cd6020b9810159b4be', class: "page_number_text" }, index.h("p", { key: 'ea092fa00c507bfeeca0894496d9c8efb657a3e8', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: '32ab8f3e33dd78e737cb72ac286cd3ee1950cf69', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_default' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: '4dae257d1a4a9d9e6d0bb399d16a8b639581bea7', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: '45874c7c3fab1a6365c810bb8d8ac2d8a4f33e50', class: "page_number_text" }, index.h("p", { key: 'ebfd4788963647b372d5706aa3925f568febdf20', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: '8c113271ca62ef3f666529dd9c1f2c839845c332', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_minimal_right_aligned' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: 'fa8ff7a3ac85d446f4ac3d7958000e2c9c53a322', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: '86eb83fa66c56185cb47f0c84b6c641caf5de09f', class: "page_number_text" }, index.h("p", { key: '09074c1906d7aeed44798ebcbf8f73d330d58f8f', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: '19bf15a3598f17acbdb6dd6644a12ff59adee583', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_minimal_left_aligned' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: 'aa8802d0eb2f7212fceb8385f98d78014b46e97e', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: '99b019f8eb1df544b7b566a85ae38109db8f94e6', class: "page_number_text" }, index.h("p", { key: '2cb9847249980a78550a25d26d7f2b3ddbabadb0', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: '0a54d739022c489216cb9fe98dbd4137f968a27a', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_minimal_center_aligned' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: '16e0612579c81b0c9eb268ad6950fdc1d8dc94e7', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: '769ba7b6408549de5c67945ca8f852a6cc8ca96a', class: "page_number_text" }, index.h("p", { key: '832db75a66732b5ae94bf65be1de474b2c567a9c', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), index.h("gb-button", { key: '6325140e02fcc543aeb78d8b89731cee7d7962a0', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_button_group_right_aligned' && this.breakpoint === 'mobile' && (index.h("div", { key: '412c5d9910561579c28c5bb6f5d2262baae0ccea', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '13b6e423a1654c036e344df252e1985b3e45fc50', icon: "only", "icon-src": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: '9de53130599e7e51ba266d263cfdcc1db36fc47f', class: "btn_group" }, index.h("gb-pagination-button-group-base", { key: '845ee3d2987aa2ce62217bbda43aa0a078ee9ce0', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '5b5385c3984c43e6ca8c529670cf87547c63b1a8' }, "1"))), index.h("gb-pagination-button-group-base", { key: 'd80c55ed29751fc291a34ca4e7f4333c1b3bcad7', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: '1cc4cb5f94ca8c1030f9a2fd6856ecc233f0a9ec' }, "2")), this.currentPage > 2 && this.currentPage <= this.totalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 2 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '5358373716d4419bffbbbb540c17de41472ee323', icon: "false" }, index.h("p", { key: '6ae4b52065c7009a95525f26ffe2dadcca1584bc' }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage <= this.totalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.totalPages / 2 && this.currentPage <= this.totalPages - 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '48c9e526827077dc14571c1fa53c7ae8479de292', icon: "false", state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 1) }, index.h("p", { key: 'd15e5bbf846a8f091d0477478cd342db9f4d5eb7' }, this.totalPages - 1)), index.h("gb-pagination-button-group-base", { key: '577001f41b79323d11e56ee4564bb70bc04dac76', icon: "false", state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages) }, index.h("p", { key: 'ab4af90f03232803be7ef05251ebea3ab512d4a3' }, this.totalPages)), index.h("gb-pagination-button-group-base", { key: 'fdc680df990b330a02ee32d8524077a585bab3e0', icon: "only", "icon-src": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_button_group_left_aligned' && this.breakpoint === 'mobile' && (index.h("div", { key: 'd07c9f0cd791de79b049a38d584590d519011344', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '7451e674a8452a0f1ea8c168ad481f2594f02783', icon: "only", "icon-src": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: 'c462f6a40e9abe00fb51e3e54c098322bf6e3a69', class: "btn_group" }, index.h("gb-pagination-button-group-base", { key: '7b91a662fd28d4f62b844fb60cb4939b9c071a81', icon: "false", state: "active" }, index.h("p", { key: '9fb3eeba06c95d6161db407971b278a4e98ce527' }, "1"))), index.h("gb-pagination-button-group-base", { key: 'beafca187c117a7c292de0ef84fb1bc07d3cd9ac', icon: "false" }, index.h("p", { key: 'fa91c8f1c10a240f5d4b9c040d8d54de2fdeded9' }, "2")), index.h("gb-pagination-button-group-base", { key: 'b3da51ed45ae9ec8084e63e61425d9764f0b17b9', icon: "false" }, index.h("p", { key: '3422d830ed1a9af349d613894e5a23e03962dab0' }, "...")), index.h("gb-pagination-button-group-base", { key: '682057bc912561bcfc0091e4fca3b165e073e83f', icon: "false" }, index.h("p", { key: 'a1a787a3fd055d0f6ab4cb726c3425838aa06801' }, "9")), index.h("gb-pagination-button-group-base", { key: '8419c5f550a8a328769f3c4b15f33e1261023e67', icon: "false" }, index.h("p", { key: 'af71414e67a01f41bee40f38f0253595b307737c' }, "10")), index.h("gb-pagination-button-group-base", { key: 'bba52f3d2a9238e90aafd36ccc20445001701161', icon: "only", "icon-src": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }))), this.type === 'card_button_group_center_aligned' && this.breakpoint === 'mobile' && (index.h("div", { key: '92ce450ffa26481fe11c754353b13fed8adf695e', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '49277754ee7df3f383a4c1eafc3c6bfba9c63e03', icon: "only", "icon-src": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("div", { key: 'bea606e97fbbcf1c83c5025737e931b84edc120e', class: "btn_group" }, index.h("gb-pagination-button-group-base", { key: '9476b7cef962c4dd846ca684465d6b9606ea6a0e', icon: "false", state: "active" }, index.h("p", { key: 'e596d9d3ae68515cd7ccac0d04b6dd81f33cbd36' }, "1"))), index.h("gb-pagination-button-group-base", { key: '471cd32b8941cf340f0592868c9dd3220afe15e4', icon: "false" }, index.h("p", { key: 'a4ed8bae229782c08187ff6939c2d8c82fb28ebb' }, "2")), index.h("gb-pagination-button-group-base", { key: 'b80d9b225f9fab995d5329997cfb6911d95c76bb', icon: "false" }, index.h("p", { key: '24408677bfb0d3113f350dffe616d2716b503b45' }, "...")), index.h("gb-pagination-button-group-base", { key: '9915358667129f7f6aff2dfcdc58cf692855c27c', icon: "false" }, index.h("p", { key: '1de7a566d68ed462a76c359e9f9d254f94514acd' }, "9")), index.h("gb-pagination-button-group-base", { key: '825490a0e1275d4494b3e616ca62df9dae88c809', icon: "false" }, index.h("p", { key: 'c258ae38d4e77338d5e87a116f9714393e7b9b66' }, "10")), index.h("gb-pagination-button-group-base", { key: '541f5bc5d54082e2bb97fd41e461078b68c8a4eb', icon: "only", "icon-src": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() })))));
     }
 };
 GbPagination.style = GbPaginationStyle0;

package/dist/cjs/gb-progress-bar.cjs.entry.js

@@ -0,0 +1,26 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-a9259aac.js');
+
+const gbProgressBarCss = "/* @import 'tailwind.css'; */\r\n\r\n:root {\r\n    /* --------------------------------------Primary Colors--------------------------------------------- */\r\n    /* base color palette */\r\n    --base-white: #fff;\r\n    --base-black: #000;\r\n\r\n\r\n    /* gray color palette  */\r\n    --gray-25: #fcfcfd;\r\n    --gray-50: #f6f8fa;\r\n    --gray-100: #eef2f6;\r\n    --gray-200: #e3e8ef;\r\n    --gray-300: #cdd5df;\r\n    --gray-400: #9aa4b2;\r\n    --gray-500: #697586;\r\n    --gray-600: #4b5565;\r\n    --gray-700: #364152;\r\n    --gray-800: #202939;\r\n    --gray-900: #121926;\r\n    --gray-950: #0D121C;\r\n\r\n    /* brand dark blue color palette */\r\n    --brandDarkBlue-25: #F9F9FB;\r\n    --brandDarkBlue-50: #edeef3;\r\n    --brandDarkBlue-100: #d3d5e0;\r\n    --brandDarkBlue-200: #b5b9cc;\r\n    --brandDarkBlue-300: #9095b2;\r\n    --brandDarkBlue-400: #464f7f;\r\n    --brandDarkBlue-500: #212c65;\r\n    --brandDarkBlue-600: #1e285c;\r\n    --brandDarkBlue-700: #1c2554;\r\n    --brandDarkBlue-800: #161d43;\r\n    --brandDarkBlue-900: #0b0f22;\r\n    --brandDarkBlue-950: #070914;\r\n\r\n    /* brand red color palette */\r\n    --brandRed-25: #fffbfa;\r\n    --brandRed-50: #fef1f2;\r\n    --brandRed-100: #fde3e5;\r\n    --brandRed-200: #f9b4ba;\r\n    --brandRed-300: #f68e98;\r\n    --brandRed-400: #f36976;\r\n    --brandRed-500: #e21b2e;\r\n    --brandRed-600: #cc1a2a;\r\n    --brandRed-700: #b51726;\r\n    --brandRed-800: #8c121d;\r\n    --brandRed-900: #680d16;\r\n    --brandRed-950: #3f080d;\r\n\r\n    /* warning color palette */\r\n    --warning-25: #fffcf5;\r\n    --warning-50: #fffaeb;\r\n    --warning-100: #fef0c7;\r\n    --warning-200: #fedf89;\r\n    --warning-300: #fec84b;\r\n    --warning-400: #fdb022;\r\n    --warning-500: #f79009;\r\n    --warning-600: #dc6803;\r\n    --warning-700: #b54708;\r\n    --warning-800: #93370d;\r\n    --warning-900: #7A2e0e;\r\n    --warning-950: #4e1d09;\r\n\r\n    /* success color palette  */\r\n    --success-25: #f6fef9;\r\n    --success-50: #ecfdf3;\r\n    --success-100: #dcfaeb;\r\n    --success-200: #a9efc5;\r\n    --success-300: #75e0a7;\r\n    --success-400: #47cd89;\r\n    --success-500: #17b26a;\r\n    --success-600: #079455;\r\n    --success-700: #067647;\r\n    --success-800: #085d3a;\r\n    --success-900: #074d31;\r\n    --success-950: #053321;\r\n\r\n    /* ------------------------------------------opacity color palette--------------------------------------  */\r\n    /* 20% opacity */\r\n    --darkBlue200-opacity20: rgba(181, 185, 204, 0.2);\r\n    --darkBlue500-opacity20: rgba(33, 44, 101, 0.2);\r\n\r\n    /* 30% opacity */\r\n    --darkBlue200-opacity30: rgba(181, 185, 204, 0.3);\r\n    --darkBlue500-opacity30: rgba(33, 44, 101, 0.3);\r\n\r\n    /* 40% opacity */\r\n    --darkBlue200-opacity40: rgba(181, 185, 204, 0.4);\r\n    --darkBlue500-opacity40: rgba(33, 44, 101, 0.4);\r\n\r\n\r\n    /* ------------------------------------------Secondary Color------------------------------------------- */\r\n    /* blueLight color palete */\r\n    --lightBlue-25: #F5FBFF;\r\n    --lightBlue-50: #F0F9FF;\r\n    --lightBlue-100: #E0F2FE;\r\n    --lightBlue-200: #B9E6FE;\r\n    --lightBlue-300: #7CD4FD;\r\n    --lightBlue-400: #7CD4FD;\r\n    --lightBlue-500: #0BA5EC;\r\n    --lightBlue-600: #0086C9;\r\n    --lightBlue-700: #026AA2;\r\n    --lightBlue-800: #065986;\r\n    --lightBlue-900: #0B4A6F;\r\n    --lightBlue-950: #062C41;\r\n   \r\n\r\n    /* blue color palette */\r\n    --blue-25: #ECF5FE;\r\n    --blue-50: #E4F0FC;\r\n    --blue-100: #C8E0F9;\r\n    --blue-200: #9AC7F4;\r\n    --blue-300: #6AA9E7;\r\n    --blue-400: #378FE6;\r\n    --blue-500: #075DB2;\r\n    --blue-600: #064E94;\r\n    --blue-700: #053E77;\r\n    --blue-800: #042F59;\r\n    --blue-900: #022445;\r\n    --blue-950: #021D37;\r\n\r\n    /* Purple color palete */\r\n    --purple-25: #FAFAFF;\r\n    --purple-50: #F4F3FF;\r\n    --purple-100: #EBE9FE;\r\n    --purple-200: #D9D6FE;\r\n    --purple-300: #BDB4FE;\r\n    --purple-400: #9B8AFB;\r\n    --purple-500: #7A5AF8;\r\n    --purple-600: #6938EF;\r\n    --purple-700: #5925DC;\r\n    --purple-800: #4A1FB8;\r\n    --purple-900: #3E1C96;\r\n    --purple-950: #27115F;\r\n\r\n\r\n    /* pink color palette */\r\n    --pink-25: #FEF6FB;\r\n    --pink-50: #FDF2FA;\r\n    --pink-100: #FCE7F6;\r\n    --pink-200: #FCCEEE;\r\n    --pink-300: #FAA7E0;\r\n    --pink-400: #F670C7;\r\n    --pink-500: #EE46BC;\r\n    --pink-600: #DD2590;\r\n    --pink-700: #C11574;\r\n    --pink-800: #9E165F;\r\n    --pink-900: #851651;\r\n    --pink-950: #4E0D30;\r\n\r\n\r\n\r\n    /* -------------------------------------------------Token---------------------------------------------- */\r\n\r\n    /* -----------Text Color----------- */\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-bold: var(--gray-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-bold: var(--gray-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text: var(--gray-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text: var(--gray-400);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-subtle: var(--gray-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-subtle: var(--gray-500);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-disabled: var(--gray-300);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-disabled: var(--gray-700);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-inverse: var(--base-white);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-inverse: var(--base-black);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-brandDarkBlue: var(--brandDarkBlue-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-brandDarkBlue: var(--brandDarkBlue-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-brandRed: var(--brandRed-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-brandRed: var(--brandRed-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-selected: var(--blue-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-selected: var(--blue-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-danger-bold: var(--brandRed-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-danger-bold: var(--brandRed-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-danger: var(--brandRed-700);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-danger: var(--brandRed-700);\r\n    }\r\n\r\n     [data-theme=\"light\"] {\r\n        --color-text-danger-subtle: var(--brandRed-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-danger-subtle: var(--brandRed-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-danger-inverse: var(--base-white);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-danger-inverse: var(--brandRed-950);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-warning-bold: var(--warning-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-warning-bold: var(--warning-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-warning: var(--warning-600);\r\n    }\r\n\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-warning: var(--warning-300);\r\n    }\r\n\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-warning-subtle: var(--warning-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-warning-subtle: var(--warning-400);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-success-bold: var(--success-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-success-bold: var(--success-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-success: var(--success-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-success: var(--success-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-success-subtle: var(--success-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-success-subtle: var(--success-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-discovery-bold: var(--blueLight-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-discovery-bold: var(--blueLight-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-discovery: var(--blueLight-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-discovery: var(--blueLight-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-discovery-subtle: var(--blueLight-400);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-discovery-subtle: var(--blueLight-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-information-bold: var(--blue-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-information-bold: var(--blue-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-information: var(--blue-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-information: var(--blue-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-information-subtle: var(--blue-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-information-subtle: var(--blue-400);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-purple-bold: var(--purple-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-purple-bold: var(--purple-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-purple: var(--purple-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-purple: var(--purple-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-purple-subtle: var(--purple-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-purple-subtle: var(--purple-400);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-pink-bold: var(--pink-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-pink-bold: var(--pink-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-pink: var(--pink-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-pink: var(--pink-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-text-pink-subtle: var(--pink-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-text-pink-subtle: var(--pink-400);\r\n    }\r\n\r\n\r\n    /* --------------Link color--------------- */\r\n\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-link: var(--blue-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-link: var(--blue-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-link-pressed: var(--blue-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-link-pressed: var(--blue-600);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-link-visited: var(--blueLight-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-link-visited: var(--blueLight-300);\r\n    }\r\n\r\n\r\n    /* --------------Icon color--------------- */\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-bold: var(--gray-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-bold: var(--gray-100);\r\n    }\r\n    \r\n    [data-theme=\"light\"] {\r\n        --color-icon: var(--gray-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon: var(--gray-400);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-subtle: var(--gray-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-subtle: var(--gray-500);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-disabled: var(--gray-300);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-disabled: var(--gray-700);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-inverse: var(--base-white);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-inverse: var(--gray-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-brandDarkBlue: var(--brandDarkBlue-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-brandDarkBlue: var(--brandDarkBlue-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-brandRed: var(--brandRed-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-brandRed: var(--brandRed-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-selected: var(--blue-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-selected: var(--blue-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-danger-bold: var(--brandRed-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-danger-bold: var(--brandRed-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-danger: var(--brandRed-700);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-danger: var(--brandRed-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-danger-inverse: var(--base-white);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-danger-inverse: var(--brandRed-950);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-warning-bold: var(--warning-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-warning-bold: var(--warning-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-warning: var(--warning-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-warning: var(--warning-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-success-bold: var(--success-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-success-bold: var(--success-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-success: var(--success-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-success: var(--success-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-discovery-bold: var(--blueLight-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-discovery-bold: var(--blueLight-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-discovery: var(--blueLight-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-discovery: var(--blueLight-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-information-bold: var(--blue-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-information-bold: var(--blue-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-information: var(--blue-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-information: var(--blue-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-purple-bold: var(--purple-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-purple-bold: var(--purple-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-purple: var(--purple-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-purple: var(--purple-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-pink-bold: var(--pink-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-pink-bold: var(--pink-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-icon-pink: var(--pink-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-icon-pink: var(--pink-300);\r\n    }\r\n\r\n    /* ----------------Border Color --------------- */\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-bold: var(--gray-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-bold: var(--gray-400);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border: var(--gray-400);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border: var(--gray-500);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-subtle: var(--gray-300);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-subtle: var(--gray-700);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-subtler: var(--gray-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-subtler: var(--gray-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-disabled: var(--gray-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-disabled: var(--gray-700);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-inverse: var(--base-white);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-inverse: var(--gray-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-input: var(--gray-300);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-input: var(--gray-600);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-focus: var(--gray-400);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-focus: var(--blue-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-selected: var(--blue-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-selected: var(--blue-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-brandDarkBlue: var(--brandDarkBlue-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-brandDarkBlue: var(--brandDarkBlue-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-brandRed: var(--brandRed-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-brandRed: var(--brandRed-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-danger-bold: var(--brandRed-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-danger-bold: var(--brandRed-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-danger: var(--brandRed-700);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-danger: var(--brandRed-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-danger-subtle: var(--brandRed-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-danger-subtle: var(--brandRed-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-danger-subtler: var(--brandRed-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-danger-subtler: var(--brandRed-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-warning-bold: var(--warning-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-warning-bold: var(--warning-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-warning: var(--warning-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-warning: var(--warning-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-warning-subtle: var(--warning-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-warning-subtle: var(--warning-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-warning-subtler: var(--warning-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-warning-subtler: var(--warning-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-success-bold: var(--success-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-success-bold: var(--success-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-success: var(--success-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-success: var(--success-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-success-subtle: var(--success-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-success-subtle: var(--success-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-success-subtler: var(--success-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-success-subtler: var(--success-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-discovery-bold: var(--blueLight-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-discovery-bold: var(--blueLight-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-discovery: var(--blueLight-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-discovery: var(--blueLight-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-discovery-subtle: var(--blueLight-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-discovery-subtle: var(--blueLight-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-discovery-subtler: var(--blueLight-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-discovery-subtler: var(--blueLight-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-information-bold: var(--blue-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-information-bold: var(--blue-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-information: var(--blue-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-information: var(--blue-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-information-subtle: var(--blue-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-information-subtle: var(--blue-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-information-subtler: var(--blue-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-information-subtler: var(--blue-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-purple-bold: var(--purple-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-purple-bold: var(--purple-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-purple: var(--purple-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-purple: var(--purple-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-purple-subtle: var(--purple-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-purple-subtle: var(--purple-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-purple-subtler: var(--purple-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-purple-subtler: var(--purple-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-pink-bold: var(--pink-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-pink-bold: var(--pink-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-pink: var(--pink-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-pink: var(--pink-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-pink-subtle: var(--pink-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-pink-subtle: var(--pink-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-border-pink-subtler: var(--pink-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-border-pink-subtler: var(--pink-900);\r\n    }\r\n\r\n\r\n\r\n    /* Emmanuel Kadiri starts from background color */\r\n\r\n    /* ----------------Background Color --------------- */\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-card-bold: var(--gray-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-card-bold: var(--gray-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-card: var(--base-white);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-card: var(--gray-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-input: var(--gray-400);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-input: var(--gray-950);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-disabled: var(--gray-50);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-disabled: var(--gray-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-selected: var(--blue-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-selected: var(--blue-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-brandDarkblue: var(--brandDarkBlue-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-brandDarkblue: var(--brandDarkBlue-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-brandRed: var(--brandRed-500);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-brandRed: var(--brandRed-300);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-brandRed-hover: var(--brandRed-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-brandRed-hover: var(--brandRed-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-brandRed-pressed: var(--brandRed-700);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-brandRed-pressed: var(--brandRed-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-gray-bold: var(--gray-400);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-gray-bold: var(--gray-500);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-gray: var(--gray-300);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-gray: var(--gray-600);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-gray-subtle: var(--gray-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-gray-subtle: var(--gray-700);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-gray-subtler: var(--gray-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-gray-subtler: var(--gray-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-gray-subtlest: var(--gray-50);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-gray-subtlest: var(--gray-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-danger-bold: var(--brandRed-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-danger-bold: var(--brandRed-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-danger: var(--brandRed-700);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-danger: var(--brandRed-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-danger-subtle: var(--brandRed-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-danger-subtle: var(--brandRed-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-danger-subtler: var(--brandRed-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-danger-subtler: var(--brandRed-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-danger-subtlest: var(--brandRed-50);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-danger-subtlest: var(--brandRed-950);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-warning-bold: var(--warning-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-warning-bold: var(--warning-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-warning: var(--warning-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-warning: var(--warning-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-warning-subtle: var(--warning-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-warning-subtle: var(--warning-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-warning-subtler: var(--warning-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-warning-subtler: var(--warning-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-warning-subtlest: var(--warning-50);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-warning-subtlest: var(--warning-950);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-success-bold: var(--success-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-success-bold: var(--success-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-success: var(--success-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-success: var(--success-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-success-subtle: var(--success-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-success-subtle: var(--success-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-success-subtler: var(--success-100); \r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-success-subtler: var(--success-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-success-subtlest: var(--success-50);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-success-subtlest: var(--success-950);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-discovery-bold: var(--lightBlue-800)\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-discovery-bold: var(--lightBlue-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-discovery: var(--lightBlue-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-discovery: var(--lightBlue-200);\r\n    }\r\n\r\n    [data-theme=\"light\"]{\r\n        --color-background-discovery-subtle: var(--lightBlue-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-discovery-subtle: var(--lightBlue-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-discovery-subtler: var(--lightBlue-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-discovery-subtler: var(--lightBlue-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-discovery-subtlest: var(--lightBlue-50);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-discovery-subtlest: var(--lightBlue-950);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-information-bold: var(--blue-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-information-bold: var(--blue-100)\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-information: var(--blue-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-information: var(--blue-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-information-subtle: var(--blue-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-information-subtle: var(--blue-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-information-subtler: var(--blue-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-information-subtler: var(--blue-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-information-subtlest: var(--blue-50);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-information-subtlest: var(--blue-950);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-purple-bold: var(--purple-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-purple-bold: var(--blue-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-purple: var(--purple-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-purple: var(--blue-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-purple-subtle: var(--purple-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-purple-subtle: var(--purple-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-purple-subtler: var(--purple-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-purple-subtler: var(--purple-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-purple-subtlest: var(--purple-50);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-purple-subtlest: var(--purple-950);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-pink-bold: var(--pink-800);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-pink-bold: var(--pink-100);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-pink: var(--pink-600);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-pink: var(--pink-200);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-pink-subtle: var(--pink-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-pink-subtle: var(--pink-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-pink-subtler: var(--pink-100);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-pink-subtler: var(--pink-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-background-pink-subtlest: var(--purple-50);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-background-pink-subtlest: var(--pink-950);\r\n    }\r\n\r\n\r\n\r\n    /* ----------------Blanket Color --------------- */\r\n    [data-theme=\"light\"] {\r\n        --color-blanket: var(--darkBlue500-opacity20);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-blanket: var(--darkBlue200-opacity20);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-blanket-subtle: var(--darkBlue500-opacity30);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-blanket-subtle: var(--darkBlue200-opacity30);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-blanket-subtler: var(--darkBlue500-opacity40);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-blanket-subtler: var(--darkBlue200-opacity40);\r\n    }\r\n\r\n\r\n\r\n    /* ----------------Skeleton Color --------------- */\r\n    [data-theme=\"light\"] {\r\n        --color-skeleton: var(--gray-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-skeleton: var(--gray-800);\r\n    }\r\n\r\n\r\n\r\n    /* ----------------Surface Color --------------- */\r\n    [data-theme=\"light\"] {\r\n        --color-surface-bold: var(--gray-25);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-surface-bold: var(--gray-950);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-surface: var(--base-white);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-surface: var(--gray-900);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-surface-hovered: var(--gray-100); \r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-surface-hovered: var(--gray-800);\r\n    }\r\n\r\n    [data-theme=\"light\"] {\r\n        --color-surface-pressed: var(--gray-200);\r\n    }\r\n\r\n    [data-theme=\"dark\"] {\r\n        --color-surface-pressed: var(--gray-700);\r\n    }\r\n}\r\n\r\n/* -----------------Shadow and Blur----------------- */\r\n:root{\r\n    --shadow-xs: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\r\n    --shadow-sm: 0px 1px 3px 0px rgba(16, 24, 40, 0.10), 0px 1px 2px 0px rgba(16, 24, 40, 0.06);\r\n    --shadow-md: 0px 4px 8px -2px rgba(16, 24, 40, 0.10), 0px 2px 4px -2px rgba(16, 24, 40, 0.06);\r\n    --shadow-lg: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03);\r\n    --shadow-xl: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03);\r\n    --shadow-2xl: 0px 24px 48px -12px rgba(16, 24, 40, 0.18);   \r\n    --shadow-3xl: 0px 32px 64px -12px rgba(16, 24, 40, 0.14);\r\n\r\n    --blur-sm: blur(4px);\r\n    --blur-md: blur(8px);\r\n    --blur-lg: blur(12px);\r\n    --blur-xl: blur(20px);\r\n}\r\n\r\n.shadow-xs{\r\n    box-shadow: var(--shadow-xs);\r\n}\r\n\r\n.shadow-sm{\r\n    box-shadow: var(--shadow-sm);\r\n}\r\n\r\n.shadow-md{\r\n    box-shadow: var(--shadow-md);\r\n}\r\n\r\n.shadow-lg{\r\n    box-shadow: var(--shadow-lg);\r\n}\r\n\r\n.shadow-xl{\r\n    box-shadow: var(--shadow-xl);\r\n}\r\n\r\n.shadow-2xl{\r\n    box-shadow: var(--shadow-2xl);\r\n}\r\n\r\n.shadow-3xl{\r\n    box-shadow: var(--shadow-3xl);\r\n}\r\n\r\n.blur-sm{\r\n    backdrop-filter: var(--blur-sm);\r\n}\r\n\r\n.blur-md{\r\n    backdrop-filter: var(--blur-md);\r\n}\r\n\r\n.blur-lg{\r\n    backdrop-filter: var(--blur-lg);\r\n}\r\n\r\n.blur-xl{\r\n    backdrop-filter: var(--blur-xl);\r\n}\r\n\r\n\r\n/* -----------------Gradients----------------- */\r\n:root{\r\n    /* Gray Gradients */\r\n    /* --gray-gradient-600: linear-gradient(); */\r\n    --gradient-gray-600-to-500-90d: linear-gradient(90deg, var(--gray-600), var(--gray-500));\r\n    --gradient-gray-700-to-600-45d: linear-gradient(45deg, var(--gray-700), var(--gray-600));\r\n    --gradient-gray-800-to-600-45d: linear-gradient(45deg, var(--gray-800), var(--gray-600));\r\n    --gradient-gray-800-to-600-90d: linear-gradient(90deg, var(--gray-800), var(--gray-600));\r\n    --gradient-gray-800-to-700265-d: linear-gradient(26.5deg, var(--gray-800), var(--gray-700));\r\n    --gradient-gray-900-to-600-45d: linear-gradient(45deg, var(--gray-900), var(--gray-600));\r\n\r\n    /* Brand Dark Blue Gradients */\r\n    --gradient-darkBlue-500-to-400-90d: linear-gradient(90deg, var(--brandDarkBlue-500), var(--brandDarkBlue-400));\r\n    --gradient-darkBlue-700-to-500-45d: linear-gradient(45deg, var(--brandDarkBlue-700), var(--brandDarkBlue-500));\r\n    --gradient-darkBlue-700-to-400-45d: linear-gradient(45deg, var(--brandDarkBlue-700), var(--brandDarkBlue-400));\r\n    --gradient-darkBlue-800-to-500-90d: linear-gradient(90deg, var(--brandDarkBlue-800), var(--brandDarkBlue-500));\r\n    --gradient-darkBlue-800-to-600265-d: linear-gradient(26.5deg, var(--brandDarkBlue-800), var(--brandDarkBlue-600));\r\n    --gradient-darkBlue-900-to-600-45d: linear-gradient(45deg, var(--brandDarkBlue-900), var(--brandDarkBlue-600));\r\n\r\n    /* Brand Red Gradients */\r\n    --gradient-red-500-to-400-90d: linear-gradient(90deg, var(--brandRed-600), var(--brandRed-400));\r\n    --gradient-red-700-to-500-45d: linear-gradient(45deg, var(--brandRed-700), var(--brandRed-500));\r\n    --gradient-red-700-to-400-45d: linear-gradient(45deg, var(--brandRed-700), var(--brandRed-400));\r\n    --gradient-red-800-to-500-90d: linear-gradient(90deg, var(--brandRed-800), var(--brandRed-500));\r\n    --gradient-red-800-to-600265-d: linear-gradient(26.5deg, var(--brandRed-800), var(--brandRed-600));\r\n    --gradient-red-900-to-600-45d: linear-gradient(45deg, var(--brandRed-900), var(--brandRed-600));\r\n\r\n    /* Blue Gradients */\r\n    --gradient-blue-500-to-400-90d: linear-gradient(90deg, var(--blue-500), var(--blue-400));\r\n    --gradient-blue-700-to-500-45d: linear-gradient(45deg, var(--blue-700), var(--blue-500));\r\n    --gradient-blue-700-to-400-45d: linear-gradient(45deg, var(--blue-700), var(--blue-400));\r\n    --gradient-blue-800-to-500-90d: linear-gradient(90deg, var(--blue-800), var(--blue-500));\r\n    --gradient-blue-800-to-600265-d: linear-gradient(26.5deg, var(--blue-800), var(--blue-600));\r\n    --gradient-blue-900-to-600-45d: linear-gradient(45deg, var(--blue-900), var(--blue-600));\r\n}\r\n\r\n.gradient-gray-600-to-500-90d {\r\n    background: var(--gradient-gray-600-to-500-90d);\r\n}\r\n\r\n.gradient-gray-700-to-600-45d {\r\n    background: var(--gradient-gray-700-to-600-45d);\r\n}\r\n\r\n.gradient-gray-800-to-600-45d {\r\n    background: var(--gradient-gray-800-to-600-45d);\r\n}\r\n\r\n.gradient-gray-800-to-600-90d {\r\n    background: var(--gradient-gray-800-to-600-90d);\r\n}\r\n\r\n.gradient-gray-800-to-700265-d {\r\n    background: var(--gradient-gray-800-to-700265-d);\r\n}\r\n\r\n.gradient-gray-900-to-600-45d {\r\n    background: var(--gradient-gray-900-to-600-45d);\r\n}\r\n\r\n.gradient-darkBlue-500-to-400-90d{\r\n    background: var(--gradient-darkBlue-500-to-400-90d);\r\n}\r\n\r\n.gradient-darkBlue-700-to-500-45d{\r\n    background: var(--gradient-darkBlue-700-to-500-45d);\r\n}\r\n\r\n.gradient-darkBlue-700-to-400-45d{\r\n    background: var(--gradient-darkBlue-700-to-400-45d);\r\n}\r\n\r\n.gradient-darkBlue-800-to-500-90d{\r\n    background: var(--gradient-darkBlue-800-to-500-90d);\r\n}\r\n\r\n.gradient-darkBlue-800-to-600265-d{\r\n    background: var(--gradient-darkBlue-800-to-600265-d);\r\n}\r\n\r\n.gradient-darkBlue-900-to-600-45d{\r\n    background: var(--gradient-darkBlue-900-to-600-45d);\r\n}\r\n\r\n.gradient-red-500-to-400-90d{\r\n    background: var(--gradient-red-500-to-400-90d);\r\n}\r\n\r\n.gradient-red-700-to-500-45d{\r\n    background: var(--gradient-red-700-to-500-45d);\r\n}\r\n\r\n.gradient-red-700-to-400-45d{\r\n    background: var(--gradient-red-700-to-400-45d);\r\n}\r\n\r\n.gradient-red-800-to-500-90d{\r\n    background: var(--gradient-red-800-to-500-90d);\r\n}\r\n\r\n.gradient-red-800-to-600265-d{\r\n    background: var(--gradient-red-800-to-600265-d);\r\n}\r\n\r\n.gradient-red-900-to-600-45d{\r\n    background: var(--gradient-red-900-to-600-45d);\r\n}\r\n\r\n.gradient-blue-500-to-400-90d{\r\n    background: var(--gradient-blue-500-to-400-90d);\r\n}\r\n\r\n.gradient-blue-700-to-500-45d{\r\n    background: var(--gradient-blue-700-to-500-45d);\r\n}\r\n\r\n.gradient-blue-700-to-400-45d{\r\n    background: var(--gradient-blue-700-to-400-45d);\r\n}\r\n\r\n.gradient-blue-800-to-500-90d{\r\n    background: var(--gradient-blue-800-to-500-90d);\r\n}\r\n\r\n.gradient-blue-800-to-600265-d{\r\n    background: var(--gradient-blue-800-to-600265-d);\r\n}\r\n\r\n.gradient-blue-900-to-600-45d{\r\n    background: var(--gradient-blue-900-to-600-45d);\r\n}\r\n\r\n/* Spacing Styles */\r\n:root{\r\n    /* Positive spacing */\r\n    --spacing-none: 0rem;\r\n    --spacing-half: 0.125rem;\r\n    --spacing-1: 0.25rem;\r\n    --spacing-2: 0.5rem;\r\n    --spacing-3: 0.75rem;\r\n    --spacing-4: 1rem;\r\n    --spacing-5: 1.25rem;\r\n    --spacing-6: 1.5rem;\r\n    --spacing-7: 2rem;\r\n    --spacing-8: 2.5rem;\r\n    --spacing-12: 3rem;\r\n    --spacing-16: 4rem;\r\n    --spacing-20: 5rem;\r\n    --spacing-24: 6rem;\r\n    --spacing-32: 8rem;\r\n    --spacing-40: 10rem;\r\n    --spacing-48: 12rem;\r\n    --spacing-56: 14rem;\r\n    --spacing-64: 16rem;\r\n\r\n    /* Negative spacing */\r\n\r\n    --spacing-negative-half: -0.125rem;\r\n    --spacing-negative-1: -0.25rem;\r\n    --spacing-negative-2: -0.5rem;\r\n    --spacing-negative-3: -0.75rem;\r\n    --spacing-negative-4: -1rem;\r\n    --spacing-negative-5: -1.25rem;\r\n    --spacing-negative-6: -1.5rem;\r\n    --spacing-negative-7: -2rem;\r\n\r\n    /* Radius  */\r\n    --rounded-none: 0rem;\r\n    --rounded-xs: 0.25rem;\r\n    --rounded-sm: 0.5rem;\r\n    --rounded-md: 0.75rem;\r\n    --rounded-lg: 1rem;\r\n    --rounded-xl: 1.5rem;\r\n    --rounded-2xl: 2rem;\r\n    --rounded-full: 62.438rem;\r\n}\r\n\r\n/* Typography Styles */\r\n@import url('https://fonts.googleapis.com/css2?family=Sora&display=swap');\r\n\r\n:root{\r\n    /* Font Sizes */\r\n    --font-size-d-2xl: 4.5rem;\r\n    --font-size-d-xl: 3.75rem;\r\n    --font-size-d-lg: 3rem;\r\n    --font-size-d-md: 2.25rem;\r\n    --font-size-d-sm: 1.875rem;\r\n    --font-size-d-xs: 1.5rem;\r\n    --font-size-t-xl: 1.25rem;\r\n    --font-size-t-lg: 1.125rem;\r\n    --font-size-t-md: 1rem;\r\n    --font-size-t-sm: 0.875rem;\r\n    --font-size-t-xs: 0.75rem;\r\n    --font-size-t-xxs: 0.625rem;\r\n\r\n    /* Font Weights */\r\n    --font-weight-bold: 700;\r\n    --font-weight-semi-bold: 600;\r\n    --font-weight-medium: 500;\r\n    --font-weight-regular: 400; \r\n\r\n    /* Line Heights */\r\n    --font-line-height-d-2xl: 5rem;\r\n    --font-line-height-d-xl: 4.25rem;\r\n    --font-line-height-d-lg: 3.75rem;\r\n    --font-line-height-d-md: 2.75rem;\r\n    --font-line-height-d-sm: 2.375rem;   \r\n    --font-line-height-d-xs: 2rem;   \r\n    --font-line-height-t-xl: 1.875rem;\r\n    --font-line-height-t-lg: 1.688rem;\r\n    --font-line-height-t-md: 1.5rem;\r\n    --font-line-height-t-sm: 1.313rem;\r\n    --font-line-height-t-xs: 1.125rem;\r\n    --font-line-height-t-xxs: 0.938rem;\r\n\r\n    /* Letter Spacings */\r\n    --font-letter-spacing-d-2xl: -0.09rem;\r\n    --font-letter-spacing-d-xl: -0.075rem;\r\n    --font-letter-spacing-d-lg: -0.075rem;\r\n    --font-letter-spacing-d-md: -0.045rem;\r\n    --font-letter-spacing-d-sm: 0;\r\n    --font-letter-spacing-d-xs: 0;\r\n    --font-letter-spacing-d-xxs: 0;\r\n\r\n    /* Font Families */\r\n    --font-family-title: 'Sora';\r\n    --font-family-body: 'Sora';\r\n}\r\n\r\n/* Media queries for medium screens (tablet) */\r\n@media (max-width: 1199px) {\r\n    :root{\r\n        /* Font Sizes */\r\n        --font-size-d-2xl: 3.75rem;\r\n        --font-size-d-xl: 3.5rem;\r\n        --font-size-d-lg: 2.75rem;\r\n        --font-size-d-md: 2.25rem;\r\n        --font-size-d-sm: 1.875rem;\r\n        --font-size-d-xs: 1.5rem;\r\n\r\n        /* Line Heights */\r\n        --font-line-height-d-2xl: 4.25rem;\r\n        --font-line-height-d-xl: 3.75rem;\r\n        --font-line-height-d-lg: 2.4375rem;\r\n        --font-line-height-d-md: 2.75rem;\r\n        --font-line-height-d-sm: 2.375rem;\r\n        --font-line-height-d-xs: 2rem;\r\n\r\n        /* Letter Spacings */\r\n        --font-letter-spacing-2xl: -0.075rem;\r\n        --font-letter-spacing-xl: -0.065rem;\r\n        --font-letter-spacing-lg: -0.045rem;\r\n        --font-letter-spacing-md: -0.045rem;\r\n        --font-letter-spacing-sm: 0rem;\r\n        --font-letter-spacing-xs: 0rem;\r\n    }\r\n}\r\n\r\n/* Media queries for smaller screens (mobile) */\r\n@media (max-width: 743px) {\r\n    :root{\r\n        /* Font Sizes */\r\n        --font-size-d-2xl: 3rem;\r\n        --font-size-d-xl: 2.5rem;\r\n        --font-size-d-lg: 2rem;\r\n        --font-size-d-md: 1.75rem;\r\n        --font-size-d-sm: 1.5rem;\r\n        --font-size-d-xs: 1.25rem;\r\n\r\n        /* Line Heights */\r\n        --font-line-height-d-2xl: 3.375rem;\r\n        --font-line-height-d-xl: 2.875rem;\r\n        --font-line-height-d-lg: 2.5rem;\r\n        --font-line-height-d-md: 2.1375rem;\r\n        --font-line-height-d-sm: 2rem;\r\n        --font-line-height-d-xs: 1.75rem;\r\n\r\n        /* Letter Spacings */\r\n        --font-letter-spacing-2xl: -0.06rem;\r\n        --font-letter-spacing-xl: -0.05rem;\r\n        --font-letter-spacing-lg: -0.045rem;\r\n        --font-letter-spacing-md: 0rem;\r\n        --font-letter-spacing-sm: 0rem;\r\n        --font-letter-spacing-xs: 0rem;\r\n    }\r\n}\r\n\r\n.display-2xl-bold{\r\n    font-family: var(--font-family-title);\r\n    font-size: var(--font-size-d-2xl);\r\n    font-weight: var(--font-weight-bold);\r\n    line-height: var(--font-line-height-d-2xl);\r\n    letter-spacing: var(--font-letter-spacing-d-2xl);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.display-2xl-bold::before,\r\n.display-2xl-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.display-2xl-bold::before{\r\n    margin-bottom: -0.135em;\r\n}\r\n\r\n.display-2xl-bold::after{\r\n    margin-top: -0.205em;\r\n}\r\n\r\n.display-2xl-semi-bold{\r\n    font-family: var(--font-family-title);\r\n    font-size: var(--font-size-d-2xl);\r\n    font-weight: var(--font-weight-semi-bold);\r\n    line-height: var(--font-line-height-d-2xl);\r\n    letter-spacing: var(--font-letter-spacing-d-2xl);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.display-2xl-semi-bold::before,\r\n.display-2xl-semi-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.display-2xl-semi-bold::before{\r\n    margin-bottom: -0.135em;\r\n}\r\n\r\n.display-2xl-semi-bold::after{\r\n    margin-top: -0.205em;\r\n}\r\n\r\n.display-xl-bold{\r\n    font-family: var(--font-family-title);\r\n    font-size: var(--font-size-d-xl);\r\n    font-weight: var(--font-weight-bold);\r\n    line-height: var(--font-line-height-d-xl);\r\n    letter-spacing: var(--font-letter-spacing-d-xl);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.display-xl-bold::before,\r\n.display-xl-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.display-xl-bold::before{\r\n    margin-bottom: -0.145em;\r\n}\r\n\r\n.display-xl-bold::after{\r\n    margin-top: -0.215em;\r\n}\r\n\r\n.display-xl-semi-bold{\r\n    font-family: var(--font-family-title);\r\n    font-size: var(--font-size-d-xl);\r\n    font-weight: var(--font-weight-semi-bold);\r\n    line-height: var(--font-line-height-d-xl);\r\n    letter-spacing: var(--font-letter-spacing-d-xl);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.display-xl-semi-bold::before,\r\n.display-xl-semi-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.display-xl-semi-bold::before{\r\n    margin-bottom: -0.145em;\r\n}\r\n\r\n.display-xl-semi-bold::after{\r\n    margin-top: -0.215em;\r\n}\r\n\r\n.display-lg-bold{\r\n    font-family: var(--font-family-title);\r\n    font-size: var(--font-size-d-lg);\r\n    font-weight: var(--font-weight-bold);\r\n    line-height: var(--font-line-height-d-lg);\r\n    letter-spacing: var(--font-letter-spacing-d-lg);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.display-lg-bold::before,\r\n.display-lg-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.display-lg-bold::before{\r\n    margin-bottom: -0.015em;\r\n}\r\n\r\n.display-lg-bold::after{\r\n    margin-top: -0.095em;\r\n}\r\n\r\n.display-lg-semi-bold{\r\n    font-family: var(--font-family-title);\r\n    font-size: var(--font-size-d-lg);\r\n    font-weight: var(--font-weight-semi-bold);\r\n    line-height: var(--font-line-height-d-lg);\r\n    letter-spacing: var(--font-letter-spacing-d-lg);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.display-lg-semi-bold::before,\r\n.display-lg-semi-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.display-lg-semi-bold::before{\r\n    margin-bottom: -0.015em;\r\n}\r\n\r\n.display-lg-semi-bold::after{\r\n    margin-top: -0.095em;\r\n}\r\n\r\n.display-md-bold{\r\n    font-family: var(--font-family-title);\r\n    font-size: var(--font-size-d-md);\r\n    font-weight: var(--font-weight-bold);\r\n    line-height: var(--font-line-height-d-md);\r\n    letter-spacing: var(--font-letter-spacing-d-md);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.display-md-bold::before,\r\n.display-md-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.display-md-bold::before{\r\n    margin-bottom: -0.195em;\r\n}\r\n\r\n.display-md-bold::after{\r\n    margin-top: -0.255em;\r\n}\r\n\r\n.display-md-semi-bold{\r\n    font-family: var(--font-family-title);\r\n    font-size: var(--font-size-d-md);\r\n    font-weight: var(--font-weight-semi-bold);\r\n    line-height: var(--font-line-height-d-md);\r\n    letter-spacing: var(--font-letter-spacing-d-md);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.display-md-semi-bold::before,\r\n.display-md-semi-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.display-md-semi-bold::before{\r\n    margin-bottom: -0.195em;\r\n}\r\n\r\n.display-md-semi-bold::after{\r\n    margin-top: -0.255em;\r\n}\r\n\r\n.display-sm-bold{\r\n    font-family: var(--font-family-title);\r\n    font-size: var(--font-size-d-sm);\r\n    font-weight: var(--font-weight-bold);\r\n    line-height: var(--font-line-height-d-sm);\r\n    letter-spacing: var(--font-letter-spacing-d-sm);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.display-sm-bold::before,\r\n.display-sm-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.display-sm-bold::before{\r\n    margin-bottom: -0.195em;\r\n}\r\n\r\n.display-sm-bold::after{\r\n    margin-top: -0.255em;\r\n}\r\n\r\n.display-sm-semi-bold{\r\n    font-family: var(--font-family-title);\r\n    font-size: var(--font-size-d-sm);\r\n    font-weight: var(--font-weight-semi-bold);\r\n    line-height: var(--font-line-height-d-sm);\r\n    letter-spacing: var(--font-letter-spacing-d-sm);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.display-sm-semi-bold::before,\r\n.display-sm-semi-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.display-sm-semi-bold::before{\r\n    margin-bottom: -0.195em;\r\n}\r\n\r\n.display-sm-semi-bold::after{\r\n    margin-top: -0.255em;\r\n}\r\n\r\n.display-xs-bold{\r\n    font-family: var(--font-family-title);\r\n    font-size: var(--font-size-d-xs);\r\n    font-weight: var(--font-weight-bold);\r\n    line-height: var(--font-line-height-d-xs);\r\n    letter-spacing: var(--font-letter-spacing-d-xs);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.display-xs-bold::before,\r\n.display-xs-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.display-xs-bold::before{\r\n    margin-bottom: -0.199em;\r\n}\r\n\r\n.display-xs-bold::after{\r\n    margin-top: -0.195em; /* Continue from here */\r\n}\r\n\r\n.display-xs-semi-bold{\r\n    font-family: var(--font-family-title);\r\n    font-size: var(--font-size-d-xs);\r\n    font-weight: var(--font-weight-semi-bold);\r\n    line-height: var(--font-line-height-d-xs);\r\n    letter-spacing: var(--font-letter-spacing-d-xs);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.display-xs-semi-bold::before,\r\n.display-xs-semi-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.display-xs-semi-bold::before{\r\n    margin-bottom: -0.259em;\r\n}\r\n\r\n.display-xs-semi-bold::after{\r\n    margin-top: -0.295em;\r\n}\r\n\r\n.text-xl-bold{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-xl);\r\n    font-weight: var(--font-weight-bold);\r\n    line-height: var(--font-line-height-t-xl);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-xl-bold::before,\r\n.text-xl-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-xl-bold::before{\r\n    margin-bottom: -0.329em;\r\n}\r\n\r\n.text-xl-bold::after{\r\n    margin-top: -0.359em;\r\n}\r\n\r\n.text-xl-semi-bold{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-xl);\r\n    font-weight: var(--font-weight-semi-bold);\r\n    line-height: var(--font-line-height-t-xl);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-xl-semi-bold::before,\r\n.text-xl-semi-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-xl-semi-bold::before{\r\n    margin-bottom: -0.329em;\r\n}\r\n\r\n.text-xl-semi-bold::after{\r\n    margin-top: -0.359em;\r\n}\r\n\r\n.text-xl-medium{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-xl);\r\n    font-weight: var(--font-weight-medium);\r\n    line-height: var(--font-line-height-t-xl);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-xl-medium::before,\r\n.text-xl-medium::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-xl-medium::before{\r\n    margin-bottom: -0.339em;\r\n}\r\n\r\n.text-xl-medium::after{\r\n    margin-top: -0.399em;\r\n}\r\n\r\n.text-xl-regular{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-xl);\r\n    font-weight: var(--font-weight-regular);\r\n    line-height: var(--font-line-height-t-xl);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-xl-regular::before,\r\n.text-xl-regular::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-xl-regular::before{\r\n    margin-bottom: -0.339em;\r\n}\r\n\r\n.text-xl-regular::after{\r\n    margin-top: -0.399em;\r\n}\r\n\r\n.text-lg-bold{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-lg);\r\n    font-weight: var(--font-weight-bold);\r\n    line-height: var(--font-line-height-t-lg);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-lg-bold::before,\r\n.text-lg-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-lg-bold::before{\r\n    margin-bottom: -0.339em;\r\n}\r\n\r\n.text-lg-bold::after{\r\n    margin-top: -0.399em;\r\n}\r\n\r\n.text-lg-semi-bold{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-lg);\r\n    font-weight: var(--font-weight-semi-bold);\r\n    line-height: var(--font-line-height-t-lg);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-lg-semi-bold::before,\r\n.text-lg-semi-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-lg-semi-bold::before{\r\n    margin-bottom: -0.339em;\r\n}\r\n\r\n.text-lg-semi-bold::after{\r\n    margin-top: -0.399em;\r\n}\r\n\r\n.text-lg-medium{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-lg);\r\n    font-weight: var(--font-weight-medium);\r\n    line-height: var(--font-line-height-t-lg);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-lg-medium::before,\r\n.text-lg-medium::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-lg-medium::before{\r\n    margin-bottom: -0.349em;\r\n}\r\n\r\n.text-lg-medium::after{\r\n    margin-top: -0.389em;\r\n}\r\n\r\n.text-lg-regular{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-lg);\r\n    font-weight: var(--font-weight-regular);\r\n    line-height: var(--font-line-height-t-lg);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-lg-regular::before,\r\n.text-lg-regular::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-lg-regular::before{\r\n    margin-bottom: -0.349em;\r\n}\r\n\r\n.text-lg-regular::after{\r\n    margin-top: -0.389em;\r\n}\r\n\r\n.text-md-bold{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-md);\r\n    font-weight: var(--font-weight-bold);\r\n    line-height: var(--font-line-height-t-md);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-md-bold::before,\r\n.text-md-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-md-bold::before{\r\n    margin-bottom: -0.349em;\r\n}\r\n\r\n.text-md-bold::after{\r\n    margin-top: -0.389em;\r\n}\r\n\r\n.text-md-semi-bold{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-md);\r\n    font-weight: var(--font-weight-semi-bold);\r\n    line-height: var(--font-line-height-t-md);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-md-semi-bold::before,\r\n.text-md-semi-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-md-semi-bold::before{\r\n    margin-bottom: -0.349em;\r\n}\r\n\r\n.text-md-semi-bold::after{\r\n    margin-top: -0.389em;\r\n}\r\n\r\n.text-md-medium{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-md);\r\n    font-weight: var(--font-weight-medium);\r\n    line-height: var(--font-line-height-t-md);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-md-medium::before,\r\n.text-md-medium::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-md-medium::before{\r\n    margin-bottom: -0.349em;\r\n}\r\n\r\n.text-md-medium::after{\r\n    margin-top: -0.389em;\r\n}\r\n\r\n.text-md-regular{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-md);\r\n    font-weight: var(--font-weight-regular);\r\n    line-height: var(--font-line-height-t-md);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-md-regular::before,\r\n.text-md-regular::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-md-regular::before{\r\n    margin-bottom: -0.349em;\r\n}\r\n\r\n.text-md-regular::after{\r\n    margin-top: -0.389em;\r\n}\r\n\r\n.text-sm-bold{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-sm);\r\n    font-weight: var(--font-weight-bold);\r\n    line-height: var(--font-line-height-t-sm);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-sm-bold::before,\r\n.text-sm-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-sm-bold::before{\r\n    margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-bold::after{\r\n    margin-top: -0.349em;\r\n}\r\n\r\n.text-sm-semi-bold{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-sm);\r\n    font-weight: var(--font-weight-semi-bold);\r\n    line-height: var(--font-line-height-t-sm);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-sm-semi-bold::before,\r\n.text-sm-semi-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-sm-semi-bold::before{\r\n    margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-semi-bold::after{\r\n    margin-top: -0.349em;\r\n}\r\n\r\n.text-sm-medium{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-sm);\r\n    font-weight: var(--font-weight-medium);\r\n    line-height: var(--font-line-height-t-sm);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    position: relative;\r\n    display: inline-block;\r\n}\r\n\r\n.text-sm-medium::before,\r\n.text-sm-medium::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-sm-medium::before{\r\n    margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-medium::after{\r\n    margin-top: -0.299em;\r\n}\r\n\r\n.text-sm-regular{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-sm);\r\n    font-weight: var(--font-weight-regular);\r\n    line-height: var(--font-line-height-t-sm);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    position: relative;\r\n    display: inline-block;\r\n}\r\n\r\n.text-sm-regular::before,\r\n.text-sm-regular::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-sm-regular::before{\r\n    margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-regular::after{\r\n    margin-top: -0.299em;\r\n}\r\n\r\n.text-xs-bold{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-xs);\r\n    font-weight: var(--font-weight-bold);\r\n    line-height: var(--font-line-height-t-xs);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-xs-bold::before,\r\n.text-xs-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-xs-bold::before{\r\n    margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xs-bold::after{\r\n    margin-top: -0.416em;\r\n}\r\n\r\n.text-xs-semi-bold{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-xs);\r\n    font-weight: var(--font-weight-semi-bold);\r\n    line-height: var(--font-line-height-t-xs);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-xs-semi-bold::before,\r\n.text-xs-semi-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-xs-semi-bold::before{\r\n    margin-bottom: -0.321em;\r\n}\r\n\r\n.text-xs-semi-bold::after{\r\n    margin-top: -0.416em;\r\n}\r\n\r\n.text-xs-medium{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-xs);\r\n    font-weight: var(--font-weight-medium);\r\n    line-height: var(--font-line-height-t-xs);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-xs-medium::before,\r\n.text-xs-medium::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-xs-medium::before{\r\n    margin-bottom: -0.285em;\r\n}\r\n\r\n.text-xs-medium::after{\r\n    margin-top: -0.396em;\r\n}\r\n\r\n.text-xs-regular{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-xs);\r\n    font-weight: var(--font-weight-regular);\r\n    line-height: var(--font-line-height-t-xs);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-xs-regular::before,\r\n.text-xs-regular::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-xs-regular::before{\r\n    margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xs-regular::after{\r\n    margin-top: -0.396em;\r\n}\r\n\r\n.text-xxs-bold{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-xxs);\r\n    font-weight: var(--font-weight-bold);\r\n    line-height: var(--font-line-height-t-xxs);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-xxs-bold::before,\r\n.text-xxs-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-xxs-bold::before{\r\n    margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xxs-bold::after{\r\n    margin-top: -0.416em;\r\n}\r\n\r\n.text-xxs-semi-bold{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-xxs);\r\n    font-weight: var(--font-weight-semi-bold);\r\n    line-height: var(--font-line-height-t-xxs);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-xxs-semi-bold::before,\r\n.text-xxs-semi-bold::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-xxs-semi-bold::before{\r\n    margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xxs-semi-bold::after{\r\n    margin-top: -0.416em;\r\n}\r\n\r\n.text-xxs-medium{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-xxs);\r\n    font-weight: var(--font-weight-medium);\r\n    line-height: var(--font-line-height-t-xxs);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-xxs-medium::before,\r\n.text-xxs-medium::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-xxs-medium::before{\r\n    margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xxs-medium::after{\r\n    margin-top: -0.416em;\r\n}\r\n\r\n.text-xxs-regular{\r\n    font-family: var(--font-family-body);\r\n    font-size: var(--font-size-t-xxs);\r\n    font-weight: var(--font-weight-regular);\r\n    line-height: var(--font-line-height-t-xxs);\r\n    margin: var(--spacing-none);\r\n    padding: var(--spacing-none);\r\n    display: inline-block;\r\n    position: relative;\r\n}\r\n\r\n.text-xxs-regular::before,\r\n.text-xxs-regular::after{\r\n    content: \"\";\r\n    display: table;\r\n}\r\n\r\n.text-xxs-regular::before{\r\n    margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xxs-regular::after{\r\n    margin-top: -0.416em;\r\n}\r\n\r\n:host{\r\n  display: block;\r\n  width: 100%;\r\n}\r\n\r\n.progress_bar_container {\r\n  background-color: transparent;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--spacing-3);\r\n  width: 100%;\r\n  height: fit-content;\r\n  position: relative;\r\n}\r\n\r\n.progress_bar {\r\n  position: relative;\r\n  height: 0.4rem;\r\n  width: 100%;\r\n  background: var(--color-border-subtler, #e3e8ef);\r\n  border-radius: var(--rounded-xs);\r\n}\r\n\r\n.progress_fill {\r\n  position: absolute;\r\n  height: 100%;\r\n  width: 0%;\r\n  background: var(--color-border-selected, #075db2);\r\n  border-radius: 15px;\r\n  transition: width 0.5s ease-in-out;\r\n}\r\n\r\n.label {\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n\r\nspan {\r\n  color: var(--color-text, #4B5565);\r\n}\r\n\r\n/* Label Position Styles */\r\n.progress_bar_container.right {\r\n  flex-direction: row;\r\n  gap: var(--spacing-3);\r\n}\r\n\r\n.progress_bar_container.bottom,\r\n.progress_bar_container.bottom_floating {\r\n  flex-direction: column;\r\n  gap: var(--spacing-2);\r\n}\r\n\r\n.progress_bar_container.top_floating {\r\n  flex-direction: column-reverse;\r\n  gap: var(--spacing-2);\r\n}\r\n\r\n.label.bottom {\r\n  align-self: flex-end;\r\n}\r\n\r\n.label.top_floating {\r\n  align-self: flex-start;\r\n}\r\n\r\n.top_tooltip {\r\n  position: absolute;\r\n  top: -2.2rem;\r\n}\r\n\r\n.bottom_tooltip {\r\n  position: absolute;\r\n  top: 1rem;\r\n}\r\n\r\n.text-sm-medium {\r\n  font-family: var(--font-family-body);\r\n  font-size: var(--font-size-t-sm);\r\n  font-weight: var(--font-weight-medium);\r\n  line-height: var(--font-line-height-t-sm);\r\n  margin: var(--spacing-none);\r\n  padding: var(--spacing-none);\r\n  position: relative;\r\n  display: inline-block;\r\n}\r\n\r\n.text-sm-medium::before,\r\n.text-sm-medium::after {\r\n  content: '';\r\n  display: table;\r\n}\r\n\r\n.text-sm-medium::before {\r\n  margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-medium::after {\r\n  margin-top: -0.299em;\r\n}\r\n\r\n.text-xs-semi-bold {\r\n  font-family: var(--font-family-body);\r\n  font-size: var(--font-size-t-xs);\r\n  font-weight: var(--font-weight-semi-bold);\r\n  line-height: var(--font-line-height-t-xs);\r\n  margin: var(--spacing-none);\r\n  padding: var(--spacing-none);\r\n  display: inline-block;\r\n  position: relative;\r\n}\r\n\r\n.text-xs-semi-bold::before,\r\n.text-xs-semi-bold::after {\r\n  content: '';\r\n  display: table;\r\n}\r\n\r\n.text-xs-semi-bold::before {\r\n  margin-bottom: -0.321em;\r\n}\r\n\r\n.text-xs-semi-bold::after {\r\n  margin-top: -0.416em;\r\n}\r\n";
+const GbProgressBarStyle0 = gbProgressBarCss;
+
+const GbProgressBar = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.progress = undefined;
+        this.showLabel = false;
+        this.labelPosition = undefined;
+    }
+    render() {
+        const progressValue = Math.min(Math.max(this.progress, 0), 100);
+        return (index.h("div", { key: '486262bb065c65566d3bd2d7d5dc510271311ed2', class: `progress_bar_container ${this.labelPosition}` }, index.h("div", { key: 'cd30d824c4e46e120e03003e38163c481b3d6a16', class: "progress_bar" }, index.h("div", { key: '0a91008a8619553460e7dd46d4b45ec2a7241c5c', class: "progress_fill", style: { width: `${progressValue}%` } })), index.h(index.Fragment, null, this.showLabel && (index.h("div", { key: '85ea3fdaf615ac1395d0183436e8c8e2c5647a89', class: `label ${this.labelPosition}` }, this.labelPosition === 'right' && index.h("span", { key: '7b4ca37e9526315de32081fe349c2ca5e0910fb5', class: `text-sm-medium` }, progressValue, "%"), this.labelPosition === 'bottom' && index.h("span", { key: 'bcc3e7b8f41b5364549d80130e1f4e498a741dad', class: `text-sm-medium` }, progressValue, "%"), this.labelPosition === 'top_floating' && (index.h("gb-tooltip", { key: 'ab6a5e824bc84666eeb1317874d92f17e36f1f3f', class: `top_tooltip`, arrow: "none", style: { marginLeft: `${(progressValue - 6.5).toString()}%` } }, index.h("p", { key: 'c3a623614d2f5f6801504f207857627865ce3b6f', slot: "main_text", class: "text-xs-semi-bold" }, progressValue, "%"))), this.labelPosition === 'bottom_floating' && (index.h("gb-tooltip", { key: '1f12c93a631e47b4acb199f4e388c0eae73e0b49', class: `bottom_tooltip`, arrow: "none", style: { marginLeft: `${(progressValue - 59.5).toString()}%` } }, index.h("p", { key: '6cf085dccf40af20da027ac8582ab342fbf75730', slot: "main_text", class: "text-xs-semi-bold" }, progressValue, "%"))))))));
+    }
+};
+GbProgressBar.style = GbProgressBarStyle0;
+
+exports.gb_progress_bar = GbProgressBar;
+
+//# sourceMappingURL=gb-progress-bar.cjs.entry.js.map

package/dist/cjs/gb-progress-bar.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"gb-progress-bar.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,gBAAgB,GAAG,yiuEAAyiuE,CAAC;AACnkuE,4BAAe,gBAAgB;;MCMlB,aAAa;;;;yBAEK,KAAK;;;IAGlC,MAAM;QACJ,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;QAEhE,QACEA,kEAAK,KAAK,EAAE,0BAA0B,IAAI,CAAC,aAAa,EAAE,IACxDA,kEAAK,KAAK,EAAC,cAAc,IACvBA,kEAAK,KAAK,EAAC,eAAe,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,aAAa,GAAG,EAAE,GAAQ,CACpE,EACNA,8BACG,IAAI,CAAC,SAAS,KACbA,kEAAK,KAAK,EAAE,SAAS,IAAI,CAAC,aAAa,EAAE,IACtC,IAAI,CAAC,aAAa,KAAK,OAAO,IAAIA,mEAAM,KAAK,EAAE,gBAAgB,IAAG,aAAa,MAAS,EACxF,IAAI,CAAC,aAAa,KAAK,QAAQ,IAAIA,mEAAM,KAAK,EAAE,gBAAgB,IAAG,aAAa,MAAS,EACzF,IAAI,CAAC,aAAa,KAAK,cAAc,KACpCA,yEAAY,KAAK,EAAE,aAAa,EAAE,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,GAAG,CAAC,aAAa,GAAG,GAAG,EAAE,QAAQ,EAAE,GAAG,EAAE,IAC1GA,gEAAG,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,mBAAmB,IAC1C,aAAa,MACZ,CACO,CACd,EACA,IAAI,CAAC,aAAa,KAAK,iBAAiB,KACvCA,yEAAY,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,GAAG,CAAC,aAAa,GAAG,IAAI,EAAE,QAAQ,EAAE,GAAG,EAAE,IAC9GA,gEAAG,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,mBAAmB,IAC1C,aAAa,MACZ,CACO,CACd,CACG,CACP,CACA,CACC,EACN;KACH;;;;;;","names":["h"],"sources":["src/components/gb-progress-bar/gb-progress-bar.css?tag=gb-progress-bar&encapsulation=shadow","src/components/gb-progress-bar/gb-progress-bar.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n:host{\r\n  display: block;\r\n  width: 100%;\r\n}\r\n\r\n.progress_bar_container {\r\n  background-color: transparent;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: var(--spacing-3);\r\n  width: 100%;\r\n  height: fit-content;\r\n  position: relative;\r\n}\r\n\r\n.progress_bar {\r\n  position: relative;\r\n  height: 0.4rem;\r\n  width: 100%;\r\n  background: var(--color-border-subtler, #e3e8ef);\r\n  border-radius: var(--rounded-xs);\r\n}\r\n\r\n.progress_fill {\r\n  position: absolute;\r\n  height: 100%;\r\n  width: 0%;\r\n  background: var(--color-border-selected, #075db2);\r\n  border-radius: 15px;\r\n  transition: width 0.5s ease-in-out;\r\n}\r\n\r\n.label {\r\n  display: flex;\r\n  align-items: center;\r\n}\r\n\r\nspan {\r\n  color: var(--color-text, #4B5565);\r\n}\r\n\r\n/* Label Position Styles */\r\n.progress_bar_container.right {\r\n  flex-direction: row;\r\n  gap: var(--spacing-3);\r\n}\r\n\r\n.progress_bar_container.bottom,\r\n.progress_bar_container.bottom_floating {\r\n  flex-direction: column;\r\n  gap: var(--spacing-2);\r\n}\r\n\r\n.progress_bar_container.top_floating {\r\n  flex-direction: column-reverse;\r\n  gap: var(--spacing-2);\r\n}\r\n\r\n.label.bottom {\r\n  align-self: flex-end;\r\n}\r\n\r\n.label.top_floating {\r\n  align-self: flex-start;\r\n}\r\n\r\n.top_tooltip {\r\n  position: absolute;\r\n  top: -2.2rem;\r\n}\r\n\r\n.bottom_tooltip {\r\n  position: absolute;\r\n  top: 1rem;\r\n}\r\n\r\n.text-sm-medium {\r\n  font-family: var(--font-family-body);\r\n  font-size: var(--font-size-t-sm);\r\n  font-weight: var(--font-weight-medium);\r\n  line-height: var(--font-line-height-t-sm);\r\n  margin: var(--spacing-none);\r\n  padding: var(--spacing-none);\r\n  position: relative;\r\n  display: inline-block;\r\n}\r\n\r\n.text-sm-medium::before,\r\n.text-sm-medium::after {\r\n  content: '';\r\n  display: table;\r\n}\r\n\r\n.text-sm-medium::before {\r\n  margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-medium::after {\r\n  margin-top: -0.299em;\r\n}\r\n\r\n.text-xs-semi-bold {\r\n  font-family: var(--font-family-body);\r\n  font-size: var(--font-size-t-xs);\r\n  font-weight: var(--font-weight-semi-bold);\r\n  line-height: var(--font-line-height-t-xs);\r\n  margin: var(--spacing-none);\r\n  padding: var(--spacing-none);\r\n  display: inline-block;\r\n  position: relative;\r\n}\r\n\r\n.text-xs-semi-bold::before,\r\n.text-xs-semi-bold::after {\r\n  content: '';\r\n  display: table;\r\n}\r\n\r\n.text-xs-semi-bold::before {\r\n  margin-bottom: -0.321em;\r\n}\r\n\r\n.text-xs-semi-bold::after {\r\n  margin-top: -0.416em;\r\n}\r\n","import { Component, Prop, h, Fragment } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'gb-progress-bar',\r\n  styleUrl: 'gb-progress-bar.css',\r\n  shadow: true,\r\n})\r\nexport class GbProgressBar {\r\n  @Prop() progress: number;\r\n  @Prop() showLabel: boolean = false;\r\n  @Prop() labelPosition: 'right' | 'bottom' | 'top_floating' | 'bottom_floating';\r\n\r\n  render() {\r\n    const progressValue = Math.min(Math.max(this.progress, 0), 100);\r\n\r\n    return (\r\n      <div class={`progress_bar_container ${this.labelPosition}`}>\r\n        <div class=\"progress_bar\">\r\n          <div class=\"progress_fill\" style={{ width: `${progressValue}%` }}></div>\r\n        </div>\r\n        <>\r\n          {this.showLabel && (\r\n            <div class={`label ${this.labelPosition}`}>\r\n              {this.labelPosition === 'right' && <span class={`text-sm-medium`}>{progressValue}%</span>}\r\n              {this.labelPosition === 'bottom' && <span class={`text-sm-medium`}>{progressValue}%</span>}\r\n              {this.labelPosition === 'top_floating' && (\r\n                <gb-tooltip class={`top_tooltip`} arrow=\"none\" style={{ marginLeft: `${(progressValue - 6.5).toString()}%` }}>\r\n                  <p slot=\"main_text\" class=\"text-xs-semi-bold\">\r\n                    {progressValue}%\r\n                  </p>\r\n                </gb-tooltip>\r\n              )}\r\n              {this.labelPosition === 'bottom_floating' && (\r\n                <gb-tooltip class={`bottom_tooltip`} arrow=\"none\" style={{ marginLeft: `${(progressValue - 59.5).toString()}%` }}>\r\n                  <p slot=\"main_text\" class=\"text-xs-semi-bold\">\r\n                    {progressValue}%\r\n                  </p>\r\n                </gb-tooltip>\r\n              )}\r\n            </div>\r\n          )}\r\n        </>\r\n      </div>\r\n    );\r\n  }\r\n}"],"version":3}

package/dist/cjs/gb-progress-circle.cjs.entry.js

@@ -39,7 +39,7 @@ const GbProgressCircle = class {
         }
     }
     render() {
-        return (index.h("div", { key: 'e4ca3f761370b229318bf13081c74467fe0fe8b7', class: "gauge" }, index.h("div", { key: 'f1149aea6047b74d0724578d1cf5d1b3c7fb6925', class: "arc", ref: el => (this.arcElement = el) }), index.h("div", { key: '16ab516c3b914631383c2d94bfb15c49473126fb', class: "mask" }), this.label && (index.h("div", { key: 'ef3594c29aab0d2f3437f2323839f7b2eab356d8', class: "label", ref: el => (this.labelElement = el) }, index.h("p", { key: 'e6211744aa625c78703b2426421cd6c0ef2c0832', class: "display-lg-semi-bold" }, `${this.progress}%`)))));
+        return (index.h("div", { key: 'e25e436e7267e130f2b6bba33c4ec8b374fae331', class: "gauge" }, index.h("div", { key: 'df082f02193fe4a3aa7c47b853765a1c80f142f2', class: "arc", ref: el => (this.arcElement = el) }), index.h("div", { key: '6ee43d472202149733e344e6544c1d6368164819', class: "mask" }), this.label && (index.h("div", { key: '20f44725f381e80aef7ba25bbf730ee2121c54ae', class: "label", ref: el => (this.labelElement = el) }, index.h("p", { key: 'a1eb2f2e84279b38b6c8a7b369789905ab9ab490', class: "display-lg-semi-bold" }, `${this.progress}%`)))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/gb-scrollbar.cjs.entry.js

@@ -13,7 +13,7 @@ const GbScrollbar = class {
         this.length = '25%';
     }
     render() {
-        return (index.h("div", { key: 'b766c90f046d51e79340a62485e7bb1eb12e69eb', class: "scrollbar-container" }, index.h("div", { key: '02e8023caa748d209e2c2a80cf7bfeb1cc86b486', class: "scrollbar", style: { height: this.length } }, index.h("slot", { key: '14941f710aec653451c356a45c42708bad895537' }))));
+        return (index.h("div", { key: 'c99768c63b62dd106a6806a03803b67084684849', class: "scrollbar-container" }, index.h("div", { key: '0e48903b93f7562d4a987f88827eb685f3c495a9', class: "scrollbar", style: { height: this.length } }, index.h("slot", { key: '3372e1547b8bc9feac5679bcce0f1b2a11dbc309' }))));
     }
 };
 GbScrollbar.style = GbScrollbarStyle0;

package/dist/cjs/gb-sidebar.cjs.entry.js

@@ -112,7 +112,7 @@ const GbSidebar = class {
         const logoSrc = index.getAssetPath(`assets/globus_bank_logo.svg`);
         const blueLogoSrc = index.getAssetPath(`assets/globus_bank_logo_blue.svg`);
         const whiteLogoSrc = index.getAssetPath(`assets/globus_bank_logo_white.svg`);
-        return (index.h(index.Fragment, null, this.type === 'simple' && (index.h("div", { key: '852d13e4c07b235f5cc12edf4a34f27b6506076d', class: `simple_sidebar_div ${this.state} ${this.category}` }, this.category === 'colored_background' && (index.h("div", { key: 'f1fd031a600edc7cea66e5ef5407fd615b7e8335', class: "pattern" }, index.h("img", { key: '6c145c35b4d838ef11a797a36ed9acf06a047566', src: patternSrc, alt: "" }))), index.h("div", { key: '0e9caad8f3489e1ea58f75f89e14df4a07b79f24', class: "nav" }, index.h("div", { key: 'ea86c650bbecd935a39969735caada1064f53c2f', class: `sidebar_header ${this.state}` }, index.h("div", { key: 'ea8342996257cfb3c4ab575765f9a3962bfc54b7', class: `logo_and_name ${this.state}` }, this.state === 'expanded' && index.h(index.Fragment, null, this.category === 'plain_background' ? index.h("img", { src: blueLogoSrc }) : index.h("img", { src: whiteLogoSrc })), this.state === 'collapsed' && index.h("img", { key: '25ea5f54869a5f7ceabfe628a1729015aaf0bb3f', src: logoSrc, alt: "" })), index.h("div", { key: 'e559071c7fa452ce8dbdb8595d3a5c45c65007f1', class: `collapse_button ${this.state}` }, index.h("gb-collapse-button", { key: 'd1d2e257d15dc73030e9ac2e197842439bc8195a', color: this.category === 'plain_background' ? 'gray' : 'white', action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), index.h("div", { key: '6da7b93f509850bd3fa9387f4607ef4c922ef11e', class: "navigation" }, index.h("div", { key: '08c6c6db906b5bd3ec53e53925c2a260af7dbb9d', class: "item" }, index.h("gb-simple-side-bar-item", { key: '29014333facf2b748f034eec5f626a454f7fc55d', state: this.activeIndex === 0 ? 'active' : 'default', icon: this.firstItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(0), label: this.firstItemLabel }), index.h("gb-simple-side-bar-item", { key: 'd68e6bdf08289a37170d6cb8bc845d4ba59fe638', state: this.activeIndex === 1 ? 'active' : 'default', icon: this.secondItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(1), label: this.secondItemLabel }), this.thirdItemLabel && (index.h("gb-simple-side-bar-item", { key: '37059f65400f59c763486ab0abdc45fed84311b0', state: this.activeIndex === 2 ? 'active' : 'default', icon: this.thirdItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(2), label: this.thirdItemLabel })), this.fourthItemLabel && (index.h("gb-simple-side-bar-item", { key: '373bbf3703bc9f3c328eca65c57793673bbfd475', state: this.activeIndex === 3 ? 'active' : 'default', icon: this.fourthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(3), label: this.fourthItemLabel })), this.fifthItemLabel && (index.h("gb-simple-side-bar-item", { key: '28cbd2c7a5d920cfc7a7ba6e1a00abfc9d4b1db0', state: this.activeIndex === 4 ? 'active' : 'default', icon: this.fifthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(4), label: this.fifthItemLabel })))), this.showSecondCategory && (index.h("div", { key: 'fb7e6322de6eac13e28ba8dc822e784e5ff96d5f', class: "navigation" }, index.h("div", { key: '048be0b9ed0da838ff70be4f6c3654aad03c71be', class: "item" }, this.sixthItemLabel && (index.h("gb-simple-side-bar-item", { key: '03880e6fe742c44bba4772707818eb3d255211f0', state: this.activeIndex === 5 ? 'active' : 'default', icon: this.sixthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(5), label: this.sixthItemLabel })), this.seventhItemLabel && (index.h("gb-simple-side-bar-item", { key: 'f77932f05f01e96dac633e660f7f6bb445c183c4', state: this.activeIndex === 6 ? 'active' : 'default', icon: this.seventhItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(6), label: this.seventhItemLabel })), this.eighthItemLabel && (index.h("gb-simple-side-bar-item", { key: '0a72c7522cb9cd79454559bc9694591374cfd911', state: this.activeIndex === 7 ? 'active' : 'default', icon: this.eighthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(7), label: this.eighthItemLabel })), this.ninthItemLabel && (index.h("gb-simple-side-bar-item", { key: '4ce273bda87c153e708c79bc3f8b6b50d082a994', state: this.activeIndex === 8 ? 'active' : 'default', icon: this.ninthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(8), label: this.ninthItemLabel })), this.tenthItemLabel && (index.h("gb-simple-side-bar-item", { key: 'e7985cf973ae73b69e3da8c70b806ab1383798a5', state: this.activeIndex === 9 ? 'active' : 'default', icon: this.tenthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(9), label: this.tenthItemLabel })))))), this.state === 'expanded' && (index.h("div", { key: 'b038df914aab31d57d20e955bd1c7aa706f79584', class: "application_name" }, index.h("div", { key: 'fd8227bcc2e6880e5d40a78715cc9b58bcc1d9a7', class: `wrapper ${this.category}` }, this.category === 'plain_background' && (index.h("div", { key: 'b6b29a3f24c2932cf1213dc875b3a0968f088cb8', class: "application_name_pattern" }, index.h("img", { key: '1abb87fada0b90182604ce993af07ae2618cc02c', src: patternSrc, alt: "" }))), index.h("div", { key: '49cfc95748320ba299452aa488aefcf51986923e', class: `application_icon ${this.category}`, innerHTML: this.leadingIconSvg }), index.h("span", { key: 'd6f2099c255bfe86ac271687eee2fbf21d26d023', class: textClass }, index.h("slot", { key: '81e00bc3cd726318054538ef5a1363ca93da0757', name: "application_name" }))))))), this.type === 'complex' && (index.h("div", { key: 'd06da7f6383064bb1479032bd05c65fd8b9d2138', class: `sidebar_and_nav ${this.state}` }, index.h("div", { key: 'e9546a33dd0a1658b612cf61ab97d708ccd4b760', class: "nav_div" }, index.h("div", { key: '56c54acac0601da5df5b62b55abe8ebd65b64e6d', class: "logo_and_button" }, this.state === 'expanded' && index.h("img", { key: '005f8c2f5196e5ab60f25f721cbc377d393aa9a5', src: blueLogoSrc }), this.state === 'collapsed' && index.h("img", { key: 'a4a37368f1de059c501ad342ca8e66eb730a5c05', src: logoSrc, alt: "" }), index.h("gb-collapse-button", { key: 'bc75487b629c8168f527f5c78a86d9b3bd2b3420', color: "gray", action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), index.h("div", { key: '4164d5026c426c680a644e6a9448ebbd2a8673e0', class: "complex_sidebar_div" }, index.h("div", { key: 'd8833772b894dff2e4e907ef11d9d9a4eb8de077', class: `primary_side_menu ${this.category} ${this.navItemStyle}` }, this.category === 'colored_background' && (index.h("div", { key: '8592c5954537d8539d50c4ffb91d591047f463ee', class: "pattern" }, index.h("img", { key: '4f0cb99f8d7cbeeb2be128145f03f5aded6e8d8b', src: patternSrc, alt: "" }))), index.h("div", { key: '554a8525b16bcfcfd6527dd8aae1e08a6a7c0fa7', class: "primary_side_menu_container" }, Object.keys(this.complexSidebarData).map((primaryItem, index$1) => (index.h("gb-complex-primary-side-bar-item", { key: `${index$1}`, label: primaryItem, category: this.category, "item-style": this.navItemStyle, icon: this.complexSidebarData[primaryItem].icon, state: this.activePrimaryItem === primaryItem ? 'active' : 'default', onClick: () => this.handlePrimaryClick(primaryItem, index$1) }))))), index.h("div", { key: 'e7e4c00e0403e285da970759abb8df8eb42d1b6f', class: `secondary_side_menu ${this.category} ${this.state}` }, index.h("div", { key: '7802d821930b3f8807c67be0fc03ebf73595e9dd', class: "sside_menu" }, this.complexSidebarData[this.activePrimaryItem].items.map((secondaryItem, index$1) => (index.h("gb-complex-secondary-side-bar-item", { key: `${this.activePrimaryItem}-${index$1}`, type: this.state === 'expanded' ? 'full_with_label' : 'icon_only', label: secondaryItem.label, category: this.category, icon: secondaryItem.icon, state: this.activeSecondaryItem === secondaryItem.label ? 'active' : 'default', onClick: () => this.handleSecondaryClick(secondaryItem.label, index$1) }))))))))));
+        return (index.h(index.Fragment, null, this.type === 'simple' && (index.h("div", { key: '0625390955fc3884d6704a48ae5816f5d5dbd962', class: `simple_sidebar_div ${this.state} ${this.category}` }, this.category === 'colored_background' && (index.h("div", { key: 'd99b7c8f0f17655a765443983654eca9c44f2097', class: "pattern" }, index.h("img", { key: 'a33202e9aac07beb39150d80b5db9baaab61dc91', src: patternSrc, alt: "" }))), index.h("div", { key: '26f9626e509d66204ba6e46d9c1fb320b44f451a', class: "nav" }, index.h("div", { key: 'dca1edfb82fc67ae35dfd181e37119d524464996', class: `sidebar_header ${this.state}` }, index.h("div", { key: 'e4a7bcc84b7f9294047666d6b7384571ccae7fa8', class: `logo_and_name ${this.state}` }, this.state === 'expanded' && index.h(index.Fragment, null, this.category === 'plain_background' ? index.h("img", { src: blueLogoSrc }) : index.h("img", { src: whiteLogoSrc })), this.state === 'collapsed' && index.h("img", { key: 'a3ac8c8686f4946a9ba22dfe965a1d839a28f18f', src: logoSrc, alt: "" })), index.h("div", { key: '5bddc3e50b8f17459aaf55d36e9b88f13a180bd7', class: `collapse_button ${this.state}` }, index.h("gb-collapse-button", { key: 'dd2b9e2488200a797ee6103c2f57d857f3273ca0', color: this.category === 'plain_background' ? 'gray' : 'white', action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), index.h("div", { key: '0b5656609996d01fda2f0f22136c240a697ffa2a', class: "navigation" }, index.h("div", { key: '768be8394d8b819f26c8409b9efcaf048eddc876', class: "item" }, index.h("gb-simple-side-bar-item", { key: '5ec00e32eed04c440b10d4c95ffc92a09009a095', state: this.activeIndex === 0 ? 'active' : 'default', icon: this.firstItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(0), label: this.firstItemLabel }), index.h("gb-simple-side-bar-item", { key: '6f43f28de09f00e5bb3617a79cdfd8dc6bfd06ff', state: this.activeIndex === 1 ? 'active' : 'default', icon: this.secondItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(1), label: this.secondItemLabel }), this.thirdItemLabel && (index.h("gb-simple-side-bar-item", { key: '56e83311195690c4a03dd25d0c912e449f96ad29', state: this.activeIndex === 2 ? 'active' : 'default', icon: this.thirdItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(2), label: this.thirdItemLabel })), this.fourthItemLabel && (index.h("gb-simple-side-bar-item", { key: '4b6c22619ad25e4e2dee501733f188cc19ff7d4d', state: this.activeIndex === 3 ? 'active' : 'default', icon: this.fourthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(3), label: this.fourthItemLabel })), this.fifthItemLabel && (index.h("gb-simple-side-bar-item", { key: '77acdac42bb391e8f49cdb8e23fee0cb0aa92741', state: this.activeIndex === 4 ? 'active' : 'default', icon: this.fifthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(4), label: this.fifthItemLabel })))), this.showSecondCategory && (index.h("div", { key: 'a430126b542a234a0a06e6ff6ae0ebc57fdd9889', class: "navigation" }, index.h("div", { key: 'cd9b3719177a7cbaf45c4b8a591ac91a7f995aa2', class: "item" }, this.sixthItemLabel && (index.h("gb-simple-side-bar-item", { key: 'c5b210741c6633848e0f4d0e27713b4cb645e96d', state: this.activeIndex === 5 ? 'active' : 'default', icon: this.sixthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(5), label: this.sixthItemLabel })), this.seventhItemLabel && (index.h("gb-simple-side-bar-item", { key: 'd54f5719659905376d713692c4a6863cd528ec1a', state: this.activeIndex === 6 ? 'active' : 'default', icon: this.seventhItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(6), label: this.seventhItemLabel })), this.eighthItemLabel && (index.h("gb-simple-side-bar-item", { key: 'e5d155803e6ccb45641b5040dc3d66dde73d8ab3', state: this.activeIndex === 7 ? 'active' : 'default', icon: this.eighthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(7), label: this.eighthItemLabel })), this.ninthItemLabel && (index.h("gb-simple-side-bar-item", { key: 'f6f16cf2e6b299e196ad0cd41e551fde7a0390f7', state: this.activeIndex === 8 ? 'active' : 'default', icon: this.ninthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(8), label: this.ninthItemLabel })), this.tenthItemLabel && (index.h("gb-simple-side-bar-item", { key: '75942a796d2175d1ce314bfc37e3e9bfe701e321', state: this.activeIndex === 9 ? 'active' : 'default', icon: this.tenthItemIcon, category: this.category, type: this.state === 'collapsed' ? 'icon_only' : 'full_with_label', onClick: () => this.sideBarItemClicked(9), label: this.tenthItemLabel })))))), this.state === 'expanded' && (index.h("div", { key: 'b359af1852ec7856a51787a614b16f99637b85b1', class: "application_name" }, index.h("div", { key: '623910755e7154fb06a023680e9a614a327343ae', class: `wrapper ${this.category}` }, this.category === 'plain_background' && (index.h("div", { key: 'a2d243cef8c3b786e58ce3fcf4d1b5f1d4c61ce8', class: "application_name_pattern" }, index.h("img", { key: '5564bc933a49b53d283af9e20202e3cff40c74d1', src: patternSrc, alt: "" }))), index.h("div", { key: 'f29321aaf7b9b513de79d1a958e370c97e6cac4e', class: `application_icon ${this.category}`, innerHTML: this.leadingIconSvg }), index.h("span", { key: '17551a679c4bc3373ff1650a8b38a4d052011f8d', class: textClass }, index.h("slot", { key: 'e1a60393941fab7a45c9602e5bc2f335657203f5', name: "application_name" }))))))), this.type === 'complex' && (index.h("div", { key: '7d3f671805c4d05f99ec871d20ff3de127eb2b32', class: `sidebar_and_nav ${this.state}` }, index.h("div", { key: '52f0ef7c4377cd3b64864cbba34721108acdd340', class: "nav_div" }, index.h("div", { key: 'cf7b2fd088d316a270129dd8835ec8d7a017d544', class: "logo_and_button" }, this.state === 'expanded' && index.h("img", { key: '8a0fac9ef0027374660ccdcceaafcd9cbbd4644e', src: blueLogoSrc }), this.state === 'collapsed' && index.h("img", { key: '8f2c40d33e8c93b302074818b270d9263fcfdf88', src: logoSrc, alt: "" }), index.h("gb-collapse-button", { key: '3f36792c179f78990a62a33a7815787ffa99d283', color: "gray", action: this.state === 'collapsed' ? 'expand' : 'collapse', onClick: () => (this.state === 'collapsed' ? this.expandSideBar() : this.collapseSideBar()) }))), index.h("div", { key: '6468e00b175f17ed05d5d24d4949354d2d321221', class: "complex_sidebar_div" }, index.h("div", { key: 'bcffce87fc1ccd507016a9953fccfcbb7b27a511', class: `primary_side_menu ${this.category} ${this.navItemStyle}` }, this.category === 'colored_background' && (index.h("div", { key: '4706ba8467c0a28d2555f070f3b92dbb18320219', class: "pattern" }, index.h("img", { key: 'f20bc0c92364050a0b2e95060eddad40dd6d2b73', src: patternSrc, alt: "" }))), index.h("div", { key: '4dfff9b84d3c0e9b4fe0110a2b1978c624c67d7e', class: "primary_side_menu_container" }, Object.keys(this.complexSidebarData).map((primaryItem, index$1) => (index.h("gb-complex-primary-side-bar-item", { key: `${index$1}`, label: primaryItem, category: this.category, "item-style": this.navItemStyle, icon: this.complexSidebarData[primaryItem].icon, state: this.activePrimaryItem === primaryItem ? 'active' : 'default', onClick: () => this.handlePrimaryClick(primaryItem, index$1) }))))), index.h("div", { key: 'df017f591fc439eaa92f2d338b1f2af08c35b2f8', class: `secondary_side_menu ${this.category} ${this.state}` }, index.h("div", { key: '56ac74c6a9ab5f827d10e968a19dde8241b1ad8d', class: "sside_menu" }, this.complexSidebarData[this.activePrimaryItem].items.map((secondaryItem, index$1) => (index.h("gb-complex-secondary-side-bar-item", { key: `${this.activePrimaryItem}-${index$1}`, type: this.state === 'expanded' ? 'full_with_label' : 'icon_only', label: secondaryItem.label, category: this.category, icon: secondaryItem.icon, state: this.activeSecondaryItem === secondaryItem.label ? 'active' : 'default', onClick: () => this.handleSecondaryClick(secondaryItem.label, index$1) }))))))))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/gb-slider-control-handle.cjs.entry.js

@@ -28,7 +28,7 @@ const GbSliderControlHandle = class {
         this.isFocused = false;
     }
     render() {
-        return (index.h("div", { key: '23687e83cb5c4398405cf6661271336cd843b68a', class: `thumb-container ${this.type} ${this.isHovered ? 'hover' : ''} ${this.isFocused ? 'focused' : ''}`, onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), onFocus: () => this.handleFocus(), onBlur: () => this.handleBlur(), tabindex: "0" }, this.type === 'tooltip' && (index.h("div", { key: '7c2d2bb8275c34fc74da76f3c053186f0ea54b6f', class: "tooltip-container" }, index.h("gb-tooltip", { key: 'a6da2a30d5d50c9345d7a83933d5a836d030e73d', "show-arrow": false, arrow: "none", "show-supporting-text": false }, index.h("p", { key: 'ddb20391fdd221da6f8da437dd9b395696aec267', class: "text-xs-semi-bold", slot: "label" }, this.value)))), this.type === 'text' && (index.h("div", { key: '546704b74e126608b6d9d633922542e0827ed749', class: "thumb-label" }, index.h("p", { key: '0a32d53fdea89b45c5f4ba66b91bd2ef361c5159', class: "thumb_label text-md-medium" }, this.value)))));
+        return (index.h("div", { key: '970e8fc86e8f36e119bdd305bf9d3d7cef072692', class: `thumb-container ${this.type} ${this.isHovered ? 'hover' : ''} ${this.isFocused ? 'focused' : ''}`, onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), onFocus: () => this.handleFocus(), onBlur: () => this.handleBlur(), tabindex: "0" }, this.type === 'tooltip' && (index.h("div", { key: '1748497b3e01b54857898d601be13d2ebbe616a5', class: "tooltip-container" }, index.h("gb-tooltip", { key: 'daac1e3aca7f14f2c94ddae1f763e8a699e415fa', "show-arrow": false, arrow: "none", "show-supporting-text": false }, index.h("p", { key: 'c805cb0cff6dc0f16fb824a9e882bcd5d0ce04c8', class: "text-xs-semi-bold", slot: "label" }, this.value)))), this.type === 'text' && (index.h("div", { key: 'f3836a8d404022c86e4b22908c0eedc70a3dc28c', class: "thumb-label" }, index.h("p", { key: '2a5a14fb91bbff68902de9c252dd3e40d7867801', class: "thumb_label text-md-medium" }, this.value)))));
     }
 };
 GbSliderControlHandle.style = GbSliderControlHandleStyle0;

package/dist/cjs/gb-slider.cjs.entry.js

@@ -85,7 +85,7 @@ const GbSlider = class {
         return this.unitPosition === 'left' ? `${this.unit}${value}` : `${value}${this.unit}`;
     }
     render() {
-        return (index.h("div", { key: '95d965c436db557331511480d8197af74525f9fa', class: "slider-container", ref: el => (this.containerEl = el) }, index.h("div", { key: 'fb252234a7a61af7ae8cc99a2e1dd82eabc5da48', class: "track", ref: el => (this.trackEl = el) }), index.h("gb-slider-control-handle", { key: '0df1ca17e1c9c1e9e4e2089ad350b1163db64a22', class: "left", value: this.formatValue(this.leftValue), type: this.label === 'false' ? '' : this.label === 'bottom' ? 'text' : this.label === 'top_floating' ? 'tooltip' : null, style: { left: `${((this.leftValue - this.min) / (this.max - this.min)) * 100}%` }, onMouseDown: e => this.handleMouseDown(e, 'left') }), index.h("gb-slider-control-handle", { key: 'bb8297600c9478abc5b816e83cb8d22ae1849d1e', class: "right", value: this.formatValue(this.rightValue), type: this.label === 'false' ? '' : this.label === 'bottom' ? 'text' : this.label === 'top_floating' ? 'tooltip' : null, style: { left: `${((this.rightValue - this.min) / (this.max - this.min)) * 100}%` }, onMouseDown: e => this.handleMouseDown(e, 'right') })));
+        return (index.h("div", { key: '7aae45cbc10b9b8e24c6a0c4298ca2acc243d95d', class: "slider-container", ref: el => (this.containerEl = el) }, index.h("div", { key: 'cebf73d5417ec821046ed885523537e1d72370f2', class: "track", ref: el => (this.trackEl = el) }), index.h("gb-slider-control-handle", { key: '2c119b62a10956a4c794641f3158f0ed44441f28', class: "left", value: this.formatValue(this.leftValue), type: this.label === 'false' ? '' : this.label === 'bottom' ? 'text' : this.label === 'top_floating' ? 'tooltip' : null, style: { left: `${((this.leftValue - this.min) / (this.max - this.min)) * 100}%` }, onMouseDown: e => this.handleMouseDown(e, 'left') }), index.h("gb-slider-control-handle", { key: '259a9422e62b3ebb192d114fb288a7e7490e46b4', class: "right", value: this.formatValue(this.rightValue), type: this.label === 'false' ? '' : this.label === 'bottom' ? 'text' : this.label === 'top_floating' ? 'tooltip' : null, style: { left: `${((this.rightValue - this.min) / (this.max - this.min)) * 100}%` }, onMouseDown: e => this.handleMouseDown(e, 'right') })));
     }
     get el() { return index.getElement(this); }
 };