globuswebcomponents 2.5.3 → 2.5.4

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

@@ -81,10 +81,10 @@ const GbPagination = class {
         this.pageItemSelected.emit({ pageSize: this.selectedPageSize, pageNumber: this.currentPage });
     }
     render() {
-        return (index.h("div", { key: 'd26fb25bb13a80678e0db1d86ce9ebbcd4c14d47', class: `pagination_div ${this.type} ${this.breakpoint}` }, this.type === 'page_default' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("gb-button", { key: '0f222f6139273fd91b29b26c411e4aeeea7e93dc', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: 'b9ca066e0b76ccbe3019c5e0101edc6b37765ba7' }, "Previous")), index.h("div", { key: 'c62d0f89eb952ca763313c063ba60b24c5b13279', class: "pagination_numbers" }, this.internalTotalPages <= 5 &&
-            this.pages.map(page => (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage === page ? 'active' : 'default', onClick: () => this.setCurrentPage(page) }, index.h("p", { slot: "page_number" }, page)))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-number-base", { key: '3403c21a24526416354ca8a2b52afffd9afa5bd8', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(1) }, index.h("p", { key: '898f2c6f6da59841b9da62d862234f66d7bc9de5', slot: "page_number" }, "1")), index.h("gb-pagination-number-base", { key: '81cec68d6d751227e3cc8206d7ab7b97a53320b5', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(2) }, index.h("p", { key: '89301d180a56ed87201629e8aca6d4f756e6a720', slot: "page_number" }, "2")), index.h("gb-pagination-number-base", { key: '7414c27c60251972082034e83226e968653e1262', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => this.setCurrentPage(3) }, index.h("p", { key: '8175dbfe7b7c7c2566a057625d9b109940a84b72', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '2dd458c2b6115dd7607efc96d3343df63b687efe', shape: this.shape }, index.h("p", { key: '2161d6a74eb9f44ae7ee3653bc69a25d4ef456aa', slot: "page_number" }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '6ea3e5b24c3c9238b2dffe8c0de89599d74ac5a1', shape: this.shape, state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages - 2) }, index.h("p", { key: 'a4c4bc846b2ff449466e4e4b193a461acd30ab50', slot: "page_number" }, this.internalTotalPages - 2)), index.h("gb-pagination-number-base", { key: '6a12d72a63e3bbb2fe7cc1a7aada891282ded19e', shape: this.shape, state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages - 1) }, index.h("p", { key: 'd43c21519aa0504662867732e19e1be7c5244cba', slot: "page_number" }, this.internalTotalPages - 1)), index.h("gb-pagination-number-base", { key: '80c020e99b09d72265e018217dffb1976c96b7a9', shape: this.shape, state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages) }, index.h("p", { key: 'ca6d6c168f2ba22892187dcd4d5a22e89f45c785', slot: "page_number" }, this.internalTotalPages))))), index.h("gb-button", { key: '240c6538b859a22b007eec279c22af12c7dce512', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '404feb7b0a3329147115cee46ca717ef677a916c' }, "Next")))), this.type === 'page_minimal_center_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("gb-button", { key: 'a7dc2929b8d80cd5a8f2bb6efba1e207d16b9597', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: 'daea428019f8a656fdbd147a2952786626861551' }, "Previous")), index.h("div", { key: '764da849c75fb59763b5ee3144e91db0658c5455', class: "pagination_numbers" }, this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.internalTotalPages <= 5 &&
-            this.pages.map(page => (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage === page ? 'active' : 'default', onClick: () => this.setCurrentPage(page) }, index.h("p", { slot: "page_number" }, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-number-base", { key: '918b3a14773a3c6f9b6a246ee8510982b51648d6', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(1) }, index.h("p", { key: '827dd51737574e416d8c6842e9d76fef4ec7551c', slot: "page_number" }, "1")), index.h("gb-pagination-number-base", { key: 'e16262ee48f27d2552f20e7376ecbaeb75406464', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(2) }, index.h("p", { key: 'dc61c3bc57a57141e325a70b75be3a58587ade31', slot: "page_number" }, "2")), index.h("gb-pagination-number-base", { key: '7faf8a6409afbcc3669c92161d17fd0fbec3229b', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => this.setCurrentPage(3) }, index.h("p", { key: 'd8c81ac14ba5b8f2013946cd0dbdfd48424b5285', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: 'adb46ceb9c2cf8d741316444c7496ab6ecaa5d60', shape: this.shape }, index.h("p", { key: 'a7255296779ebb7d7ba68226133410c9d6a4e327', slot: "page_number" }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: 'a0f36fa844f81fa046023cece6f8a1b6228ab583', shape: this.shape, state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages - 2) }, index.h("p", { key: 'b8598d7a4c3ee05e1c2b10573ebd4b1d2b9f7062', slot: "page_number" }, this.internalTotalPages - 2)), index.h("gb-pagination-number-base", { key: '92d9a006984b31a74156eeb6e0cc9b49defe0724', shape: this.shape, state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages - 1) }, index.h("p", { key: 'c9ea13b26b216b0f9601d32e5e3543ba4c5f1121', slot: "page_number" }, this.internalTotalPages - 1)), index.h("gb-pagination-number-base", { key: '323dd28637c86f12155e41364a39b1020e385bfb', shape: this.shape, state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages) }, index.h("p", { key: '6ddd478c9bb569944ff6b94489a20470ad93c19f', slot: "page_number" }, this.internalTotalPages))))), index.h("gb-button", { key: 'fe4df0c639d4639d94523f2b9ca14bde1adf3994', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: 'a30b67f0663c6088533a2698a023e0aa0f1dad0b' }, "Next")))), this.type === 'card_default' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: 'aeb228190f1e5d6ff2dfaad69c34ad1e0f5dffdf', class: "pagination_entries" }, index.h("div", { key: '0ec8c9cf1434dad199c9c00bfff5aaa54fb9ecd9', class: "entries_text" }, index.h("p", { key: '4896da7a234b05b8ae2f0f42af5938d11899053b', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: 'fa391f959ce6b04888710b3732149f4515089660', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: '06c45fd7b4edc5ff0b99caa845b3d40e85fb7a90', 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: '54c1ba7f70f5d51f6e1b527f300e3b781cf23802', class: "pagination_numbers" }, this.internalTotalPages <= 5 &&
-            this.pages.map(page => (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage === page ? 'active' : 'default', onClick: () => this.setCurrentPage(page) }, index.h("p", { slot: "page_number" }, page)))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-number-base", { key: 'b9a6d451779264f0d0502e9509eaaf8cadad99a3', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(1) }, index.h("p", { key: '4cf456ba8e95997450719e413fec9911cbf51913', slot: "page_number" }, "1")), index.h("gb-pagination-number-base", { key: '657c5169bc431eb9a0555b9cf5707a6983529b4d', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(2) }, index.h("p", { key: '7ede2c750cbea4baf60b3c4c4da855a419879014', slot: "page_number" }, "2")), index.h("gb-pagination-number-base", { key: '34a5722abdf76ea98041cb95a9244a6944c4d817', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => this.setCurrentPage(3) }, index.h("p", { key: '3237842826cd034864f8c9110c8720ab51ff43cf', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '91a048122a40ac1d1c95eb39beafd27a37eccf21', shape: this.shape, state: "default" }, index.h("p", { key: '3f02ae825fcd9fde1b697cf54c32c1386611bed3', slot: "page_number" }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '712c9b5d974af19fb7a8640856ef9900f2c205e2', shape: this.shape, state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages - 2) }, index.h("p", { key: '2ddade6601b31eed8d727d72fd1fad7674f422ab', slot: "page_number" }, this.internalTotalPages - 2)), index.h("gb-pagination-number-base", { key: '9d02a81fa69dadac7f2a6e7e0d993451d87460a6', shape: this.shape, state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages - 1) }, index.h("p", { key: 'f60bff6530fb969a435b90fa035c3f29becd2c72', slot: "page_number" }, this.internalTotalPages - 1)), index.h("gb-pagination-number-base", { key: 'a7a1c2ad93fa583deddf024b83fddcfa2a9bdfe4', shape: this.shape, state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages) }, index.h("p", { key: '1205d2c3d341bf9b72c693e129037e55bb3dc8fb', slot: "page_number" }, this.internalTotalPages))))), index.h("div", { key: '6b899e5430d8153e22f1dbbc62d7d18ad9d3bb7c', class: "pagination_btns" }, index.h("gb-button", { key: 'bb6514e759d4d8f21b8d5ea247e975e8d0ee7e9e', size: "sm", hierarchy: "secondary_gray", icon: "only", state: this.totalPages === 1 && this.currentPage === 1 ? 'disabled' : this.currentPage === 1 ? 'disabled' : 'default', "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("gb-button", { key: '88c56e3677068fe24342837ee3d2c0ed929eb175', size: "sm", hierarchy: "secondary_gray", icon: "only", state: this.currentPage === this.internalTotalPages ? 'disabled' : this.currentPage === 1 && this.totalPages === 1 ? 'disabled' : '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: 'a5037c461ef09e992eef8a1c5bed9bcba2f6917d', class: "pagination_entries" }, index.h("div", { key: '240056ba83dee49fb4ef25a2574adffd5092adcc', class: "entries_text" }, index.h("p", { key: '22439d60166a97b2dd7890a5ac39e046eefe2238', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: 'a5e873497ad2480c81720c7516ae9b7fc5aee7f6', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: '1d9fbad92f4d7812a0b26f9cd04bbc34e99c5226', 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: '80730bb39d041fd15679d07fd63a1fe698b43554', class: "page_number_text" }, index.h("p", { key: '54a363387c402e4a53cd8940f320879eaeaf4075', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("div", { key: '3425476edd807d7fac4a54fdd1aa7c92ddf92f17', class: "pagination_btns" }, index.h("gb-button", { key: 'eef9137b6f52a8ba6cfb52c83571a635aa64a749', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '94979acbbdebcfc8e28b829a265a62999376a127' }, "Previous")), index.h("gb-button", { key: '33970a36959833e21d72900727ea9fe1b996042e', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: 'e31aa99219071dba7524834fa720b7dc8de04e06' }, "Next"))))), this.type === 'card_minimal_left_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: '2163a737f5e7a2cfc446099c43ac641481f5e7ad', class: "pagination_btns" }, index.h("gb-button", { key: '224780947303dce5130759d4914cc4885dd72c34', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '4a086e03581a77737e07d88d6e3081966c2ab6c5' }, "Previous")), index.h("gb-button", { key: '0b8d82995da11685de03e9ddd03742d0baff637e', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: 'dd090c2e4095beb4b9582cb91ea48d2dffa99001' }, "Next"))), index.h("div", { key: '2bf5c343698dcb56a5d1b9d031d5a01bb97a64ed', class: "page_number_text" }, index.h("p", { key: 'f3207ca7ed5ac04ef34e0b77bb5ce84aada107b5', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("div", { key: 'd2b7bfd752ae9460fa5870e33669058d932522ff', class: "pagination_entries" }, index.h("div", { key: 'cfc700dd6f985728a5200fbde9813bdb1cb1f856', class: "entries_text" }, index.h("p", { key: 'bdaa5f3591fdf65990a7657d4d2870f7b58a6e83', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: '82029789996b3dc19be37679a68ac2b994605dca', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: '13e6168f299a91235c9b9448dcea9f6f17fa9ad5', 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: '7ba44eed6808319432fee9c88cf1b0b9747baffd', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '1a41dd889766f6d031ca18d8578cc2d0fc288744' }, "Previous")), index.h("div", { key: '57071433d9f83aaa946bcdbac36bb0cff3e49780', class: "page_number_text" }, index.h("p", { key: '5d17cf9e9b32220ee85a0cb46beb9156ee9369d0', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: '981a271a77603738df466b2f861f17b4ffe61af9', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '7afdeede9b359003489e4c943f93d307295098b0' }, "Next")))), this.type === 'card_button_group_right_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: 'd56ef1fae7474f44dd717cee0ac01742b1529363', class: "pagination_entries" }, index.h("div", { key: '854b0d719f1ec1029eaca0f9cb92606bcc5bfe74', class: "entries_text" }, index.h("p", { key: '6fd575a91d963c373b86e2e20d3c579084f4f01b', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: 'c3606894cd7f1bbfa1adf1d8ed92f5ca949f08fb', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: '41ed08ca24ded8169aaf1f3a8c27418d26af6e64', 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: '6ef69f78a26ec52f4fa9ac115e3ce3c57d60a4c1', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '22d4fef0ea1aba3c5158a542515198f6a6524975', icon: "leading", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '6bf69f19c9a05b581423f62d38398d040e41579a' }, "Previous")), this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.pages.map(page => (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage === page ? 'active' : 'default', onClick: () => (this.currentPage = page) }, index.h("p", null, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-button-group-base", { key: '00943d717137729fa840d0ace333f1c2c18e4d8d', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '62647321bbb3e58081e490ecf2b102ae51153e7b' }, "1")), index.h("gb-pagination-button-group-base", { key: '02966701ed5e5340ae01bf2e3f4426c32d58e5b2', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: '7b76b93e7a5b9f42db236ba0b49d812e3a6524d3' }, "2")), index.h("gb-pagination-button-group-base", { key: '4460c8a9e13108f37de1ae145e337ae7647d7e5d', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: '6c577d523ede6cf4be9354c96f1fb8862e3f78f5' }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '6a1f5603a3112ce4a97e4b8b15cc8e787e8c74c0', icon: "false" }, index.h("p", { key: '0802d72807809e82ed1222deeaf14230afae3ac2' }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '8f35038d0bbd5764582abfeb59c1781fc1137d78', icon: "false", state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 2) }, index.h("p", { key: '71b16152392480ac86896a480b72cebcaeb195c6' }, this.internalTotalPages - 2)), index.h("gb-pagination-button-group-base", { key: '18c72b78dc6acbcb7df44e0dd9e76096746a60a3', icon: "false", state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 1) }, index.h("p", { key: '61cc6a338f85006aab20db6f347a5f6ee49233f4' }, this.internalTotalPages - 1)), index.h("gb-pagination-button-group-base", { key: '1cb8d44c40e9a214eb9c7ad490d02dc47d9258cb', icon: "false", state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages) }, index.h("p", { key: '994ddf17868dc9be8e2f9d988da6623db15b19ed' }, this.internalTotalPages)))), index.h("gb-pagination-button-group-base", { key: '8929aafd99fc3a0ce5799bcd3dae2aac30d34b47', icon: "trailing", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '5cb629cae2d4b913bc1d917b5a67b4f7f2b3a892' }, "Next"))))), this.type === 'card_button_group_left_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: 'e9e06a78c7ac96697bfba8163bec2150f078898b', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '7d52b5095bd38aaf8d480f6c4e7d34fa8a3d5df8', icon: "leading", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: 'f1fdc4c4a24ee1adf66c09ee0f37ca5e8f324d71' }, "Previous")), this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.pages.map(page => (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage === page ? 'active' : 'default', onClick: () => (this.currentPage = page) }, index.h("p", null, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-button-group-base", { key: 'e1ca462270a4ded631ead2bc7709d374e6025a34', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '0701a58d6764ac4444beb234a0dd5fbf67cf3180' }, "1")), index.h("gb-pagination-button-group-base", { key: '3c0bdcb6306487aef426828ea125d1e25ae852a5', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: '4f9fc7ab6a0e1f3f5634f92f7473a110a9c241e5' }, "2")), index.h("gb-pagination-button-group-base", { key: '90453d0b7c557985540ed6784500a5529f9e298c', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: '7c9a01e0a94d6dacdd6e256f94b0dab57b8aa818' }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '76cd637ed4b68ba908fba9e8d92befc59148b4d4', icon: "false" }, index.h("p", { key: '91257f380311c8066caaf4aeb64c9abd45094220' }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '91553afbdbfa5c569d32f95eee80cf802fea1242', icon: "false", state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 2) }, index.h("p", { key: '9a7dc5f869f11b0ff00fe545e65272d526ddfd96' }, this.internalTotalPages - 2)), index.h("gb-pagination-button-group-base", { key: '78f0b614834ed3df33084977c987f711fb67834c', icon: "false", state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 1) }, index.h("p", { key: '0ccd533e9eac89d73d4498908de8ac789e4273ea' }, this.internalTotalPages - 1)), index.h("gb-pagination-button-group-base", { key: '3efcb72c11de658922f1a74a675594209f645287', icon: "false", state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages) }, index.h("p", { key: '2b6e671f8de305ea300c3fbe1d937c41d81f14db' }, this.internalTotalPages)))), index.h("gb-pagination-button-group-base", { key: '9a1bcb8542459a01ef01c1c627378373c299f143', icon: "trailing", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: 'af07b68f3daf83a97f1172cd23552a6205f4edc7' }, "Next"))), index.h("div", { key: 'f774bfdf97a215c15585a0b04b6ee314d5e68ac1', class: "pagination_entries" }, index.h("div", { key: '742df9780b1c6e981152af520fb3f479f47ac373', class: "entries_text" }, index.h("p", { key: '7245d29426ba627a6013c5a943d3ffbb2c56eedf', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: '6a0f86dddda8d6befe4100e1090039f81023a57b', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: 'd98f8ae3aba044475726b1645cab6b8b2bd15f65', 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: '51b66dd5b451b56063fe9ab652e8f4b6f80ee462', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '988e9528d747b7156887ebc70e210dfc71ffc9ce', icon: "leading", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: 'd806fb1989892ad7b4f4c605a719f6d19a958d50' }, "Previous")), this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.pages.map(page => (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage === page ? 'active' : 'default', onClick: () => (this.currentPage = page) }, index.h("p", null, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-button-group-base", { key: 'dd9d5cd8c6102b540cb4c42a278d61aae194a68b', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '1208dd8e8de248612c685360f3718d56f29288f6' }, "1")), index.h("gb-pagination-button-group-base", { key: '4ad7bb018df28d1d6bde90dcbc23a9b8673d1613', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: 'c6f5eb802428e6a3b162e7cdb936117a3e2d66b7' }, "2")), index.h("gb-pagination-button-group-base", { key: 'e6ddd5c588b3a78f9f74505237a7a1dfff37be8f', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: '4eda0336ca12ef1f445baa1e67d0145a359efa34' }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'b4bad752d2d4ae0a111f4d5810adc1a468eaa4eb', icon: "false" }, index.h("p", { key: 'bf8b7deac270b6eb5699489546f56759e4e5522d' }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '4deb745196d5ee3c5542e02936dac78e3d8fb83e', icon: "false", state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 2) }, index.h("p", { key: '3c6a0a5c0a045bc2e245557ce0a4916c5ac31a35' }, this.internalTotalPages - 2)), index.h("gb-pagination-button-group-base", { key: 'b313d2daa5b857ce3694b2dc3db7dba700b72fc4', icon: "false", state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 1) }, index.h("p", { key: '3cf4f97e90967b2a9cd511d9a0dfb6bcd305af7d' }, this.internalTotalPages - 1)), index.h("gb-pagination-button-group-base", { key: '21fc1000ac59d412e10229970d5460c1aea439f3', icon: "false", state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages) }, index.h("p", { key: 'd9e78ede516d630bc460a787a673d4a538d65dac' }, this.internalTotalPages)))), index.h("gb-pagination-button-group-base", { key: '30fce53e01aad073a63940c49943aef6f38d81ee', icon: "trailing", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '01f9d48199e6fd77455e0a599ac671646ccfa17d' }, "Next"))))), this.type === 'page_default' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: '4c70aa7e552ac1b5a3d966f3de63afb8963f10e0', 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: '9987fced013715adf19bd900aa01af3f45e2efbe', class: "page_number_text" }, index.h("p", { key: '53c55f255d67567adfe7bf96dc2e5c6f21c2665f', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: 'd80feb9f60eb70d4a56169c6f2f73f9fc8b1b857', 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: '4692c42b37f225d8cd58355451339961467501a0', 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: '0a8f786ef6a3aa5608bfb9784b57026a13b9c3bf', class: "page_number_text" }, index.h("p", { key: 'b8b4b344af3579002d28e5c93d1da716556877f1', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: 'aa59689916c745da82535644335404bfc9b7b8a9', 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: 'c4a3b6c08e69b1899bb365924a5337c6687cf152', 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: 'a5490db3ac923f994b6527caffc74f9d87a311e8', class: "page_number_text" }, index.h("p", { key: '5081d97ffdcdd7b24df5df936d4659ad7e575ead', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: '175be66d0ad331222c2086c085ea0355bbf9b478', 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: '7b7bc6307331770df2bc87ef3ee5a6ed32070e4e', 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: '9b79d1f5fa0f1efec8588c485cd5121280a359aa', class: "page_number_text" }, index.h("p", { key: 'c0a341355a0eee3dfa6026926c2e70c368a4367b', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: 'c57135bd0cd4fd4e8a14249b66760a2de587bf2c', 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: 'b2734e899647ad7f0a55c2c89189edc0bc593add', 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: '1cb4698c38b36a67e1fdbc47dffe590fee35f197', class: "page_number_text" }, index.h("p", { key: 'e4d5335980c953bf7aa6c3010220f20c0b559f40', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: '68371cc38a302c3f099a4dbbc5cda73ec0a77b6b', 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: '7626fd11c0ad7f6ada45f88a852973961bb7afdd', 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: '2664461a88c8fde10758c61db6909d6ffd733183', class: "page_number_text" }, index.h("p", { key: 'c087b93875b7a4ac39d1c9a6b0da440890f03361', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: '054a8e233ce5848cff29b3c38dd7929d94957bfb', 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: '71f6f36c096404c4bc629f53e027148646168f73', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '0ba930d5df7796e5629e4406c0db85f24efc1f12', icon: "only", "icon-src": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.pages.map(page => (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage === page ? 'active' : 'default', onClick: () => (this.currentPage = page) }, index.h("p", null, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-button-group-base", { key: '567b0d04166454e855a580f3c6b297695340c746', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: 'ef0a65b45d7b3ca8503a755072a23f32b587efc8' }, "1")), index.h("gb-pagination-button-group-base", { key: '8a9ebde03f9beb3cf74a6591fca7ef791e3bfc93', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: 'aa063f5a042e8589ca90a16631a120029c48f519' }, "2")), index.h("gb-pagination-button-group-base", { key: '48cf3b8fb51b36f9edecb7767ea536f208e571a9', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: 'f3b0498dfa1c40820d8da94905c8e2db8464c336' }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'e55e72f12a3201144eb2c75f902bb05864ae32c8', icon: "false" }, index.h("p", { key: '5407595b9c573048a7045afd53a7b2a187e4a4d9' }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '5347165fef93d78247ecba2b7b0b96436fd29e9d', icon: "false", state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 2) }, index.h("p", { key: '2ee7aeb2129603e61d9d96198bda6711fc60865e' }, this.internalTotalPages - 2)), index.h("gb-pagination-button-group-base", { key: '1d8813bf49dd653a0811be6e0991b8ee5a2faab0', icon: "false", state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 1) }, index.h("p", { key: 'e7513ae0709209c3852b182b21f5feaec8655333' }, this.internalTotalPages - 1)), index.h("gb-pagination-button-group-base", { key: 'f952cfdcd26450e2aadab525063554dedeb036a7', icon: "false", state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages) }, index.h("p", { key: '2542b4e9dc2c30075d0c1f481f0d918fa748968e' }, this.internalTotalPages)))), index.h("gb-pagination-button-group-base", { key: 'c428b29854fa3f45dc3e6674207961e3052a88f7', 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: 'dc96761309835d98b80fc9f9eebdec5cbd06cad8', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '07dcfc2d7f26828b25d70814002fd069f20460b3', icon: "only", "icon-src": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.pages.map(page => (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage === page ? 'active' : 'default', onClick: () => (this.currentPage = page) }, index.h("p", null, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-button-group-base", { key: '20bb9a7e0447389444a81faf05c5a637b4d74a6a', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '70d375c065597ee2203b94094e990fe131e66165' }, "1")), index.h("gb-pagination-button-group-base", { key: '98fc99bbb503b21b405a8beaf979a450e3431155', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: '3c7e23311a68c4610023e62d20fc8e3163d93275' }, "2")), index.h("gb-pagination-button-group-base", { key: 'eee27ba249b2f1a438092ade216285ce6358a146', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: 'df4126ffaa4c8a792529552b5e0db5c098b735e7' }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '182892ae81f655b95d33101e5a1625074837060c', icon: "false" }, index.h("p", { key: 'bc7485df0949a74c0e1229ee8377fcd746b9c397' }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '5fcff99f68bbb3573e828c42b0838a970e5cf7ce', icon: "false", state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 2) }, index.h("p", { key: 'c8fbcc68526cfa8bf3888326a27fa2c91f2c73b4' }, this.internalTotalPages - 2)), index.h("gb-pagination-button-group-base", { key: '7faaf5067941d0f0a601d008883ee01d313e26d2', icon: "false", state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 1) }, index.h("p", { key: 'dd26f72d5647fe900f9148a2103ea3d6d613f9c2' }, this.internalTotalPages - 1)), index.h("gb-pagination-button-group-base", { key: '6f47bbb11048dde49084349c581f8e5b629dde71', icon: "false", state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages) }, index.h("p", { key: '8b870a59462167671353c41e97dac15779235d95' }, this.internalTotalPages)))), index.h("gb-pagination-button-group-base", { key: '9c44ca980bf2eb32ea03fa5558edee45f78300f1', 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: 'a87c476354525643fe5f3aa06dbb9254d7da7609', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '302500f70ce492740f740ab4988db3271394a6f7', icon: "only", "icon-src": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.pages.map(page => (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage === page ? 'active' : 'default', onClick: () => (this.currentPage = page) }, index.h("p", null, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-button-group-base", { key: 'd9eaf61c9dc276101e89d990edfb7482ff80cfa6', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '2bf351c30ec83ff92d636eefc6d9a60950a25bd6' }, "1")), index.h("gb-pagination-button-group-base", { key: '1d1424f5ae078fe1434f2a02a53ed18b01bd4889', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: '4c4ec68b89211a55503941da6ee0ae7c529fae06' }, "2")), index.h("gb-pagination-button-group-base", { key: '78fce522a3df81376ff26b105294dcd12f274b47', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: '9fcf9f3b343308223d5b7fc270c7f755def6637f' }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '6a2a48b7ee2e92d8d976b066456754111c37bdd4', icon: "false" }, index.h("p", { key: '9d9599588343ffb074e0418730bddf804d78e5ea' }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'ab0a36b2259db088c7db17a70dba12ae0dfde77e', icon: "false", state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 2) }, index.h("p", { key: '5ff26a72680aff8f3ef930bbaf62771b5338a2fa' }, this.internalTotalPages - 2)), index.h("gb-pagination-button-group-base", { key: 'e4ae0e538d32c2ae0387c4f2df436bb9b27035bd', icon: "false", state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 1) }, index.h("p", { key: '4b569dd180cbf64bea282bb49fdcf4c31e187054' }, this.internalTotalPages - 1)), index.h("gb-pagination-button-group-base", { key: 'cbc6e292f03db90b0ca9cff7e231cfabe719ea90', icon: "false", state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages) }, index.h("p", { key: '711c293ad3497d1c0b7cff43a9465ca7a3bc5d35' }, this.internalTotalPages)))), index.h("gb-pagination-button-group-base", { key: 'fe59716d5accd19c3e2bca74697504403a37c5cb', icon: "only", "icon-src": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() })))));
+        return (index.h("div", { key: '2e739946e28d0fd2ecedb0ec6519f263381d1e4d', class: `pagination_div ${this.type} ${this.breakpoint}` }, this.type === 'page_default' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("gb-button", { key: '0a8f1b031384d7610c47c986f6e0d2ad03e5cdd8', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '644c4b42772f1ac93e8f204ff437e3f35fb9e44f' }, "Previous")), index.h("div", { key: '95a046377ad59a13def1adb54f20b59f94fdd23a', class: "pagination_numbers" }, this.internalTotalPages <= 5 &&
+            this.pages.map(page => (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage === page ? 'active' : 'default', onClick: () => this.setCurrentPage(page) }, index.h("p", { slot: "page_number" }, page)))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-number-base", { key: '0f8347f56ee08cc6e6258f281c1477be66b2d179', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(1) }, index.h("p", { key: 'fa5a0ae518ad6823d50e4579329fd5fc0bf67f90', slot: "page_number" }, "1")), index.h("gb-pagination-number-base", { key: '54f8e8f3dafa8ace7e7d58ca03607aacb264274a', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(2) }, index.h("p", { key: '854937cc0cb305964fd6c240ddff40628f81eeff', slot: "page_number" }, "2")), index.h("gb-pagination-number-base", { key: 'a1b6ee8d63fbd0168a12b2382570d922a696c8a1', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => this.setCurrentPage(3) }, index.h("p", { key: '082c63175ad873b91db0657d081e4df90358cd3e', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '3dd8092b6ff3c0760f8f1e10cffbbd71c0d80db7', shape: this.shape }, index.h("p", { key: '75a6d5945ac64b9e77c9bc0997c214a9a84d30b8', slot: "page_number" }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '5b735077b74183de4885a1c8049c6fe88815495e', shape: this.shape, state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages - 2) }, index.h("p", { key: '763ecf697830c67b79dae1f8fa07b3e22ce60918', slot: "page_number" }, this.internalTotalPages - 2)), index.h("gb-pagination-number-base", { key: 'b56067e320a8f22fdd528b1ad172356ad835e740', shape: this.shape, state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages - 1) }, index.h("p", { key: '8f347df5c41f98055c91448cbfc16724955f3290', slot: "page_number" }, this.internalTotalPages - 1)), index.h("gb-pagination-number-base", { key: '585d3515aad3de69b3c93d7488116d591c2ecc50', shape: this.shape, state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages) }, index.h("p", { key: '808f7fd8420749f432f39ffeb4f256260e0d8b69', slot: "page_number" }, this.internalTotalPages))))), index.h("gb-button", { key: 'b490f011b8b6fc5d5c9478b337bf59e7f4b1e63d', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: 'ce0c458908cb85c6a74a72fd6ad4e690be389b38' }, "Next")))), this.type === 'page_minimal_center_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("gb-button", { key: '3eab606106f40e3fbfbc2c822b90f217ad43ccbd', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '3e6770922c1b61b7962be197136cfd00c662de08' }, "Previous")), index.h("div", { key: '7e44f2c82cd94778bf78bf33bfa5324a760549e9', class: "pagination_numbers" }, this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.internalTotalPages <= 5 &&
+            this.pages.map(page => (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage === page ? 'active' : 'default', onClick: () => this.setCurrentPage(page) }, index.h("p", { slot: "page_number" }, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-number-base", { key: '75a097e3b533838c1461eebcea2a4e8c6efbd7e8', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(1) }, index.h("p", { key: '8369e9123c626fdde36e2e69cb933ffc4343f843', slot: "page_number" }, "1")), index.h("gb-pagination-number-base", { key: 'd97bee5bdb7166d05ec5feddd9628b086d2042a4', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(2) }, index.h("p", { key: 'aaa79de1202644437b1ea21b53944b991bffb100', slot: "page_number" }, "2")), index.h("gb-pagination-number-base", { key: 'dd38f79f30b6b06620857ef2982080c6a6469827', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => this.setCurrentPage(3) }, index.h("p", { key: '608a3b6c6e98d911f37b495b234e21f44319d3e9', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '3007cdef0b0cd8dcbd971331668121906681a1fa', shape: this.shape }, index.h("p", { key: '40a7ae999898248b2431205ca63e15c324095bd0', slot: "page_number" }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '110dd8886fb9a30029b8f158f0ea2236307e0dba', shape: this.shape, state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages - 2) }, index.h("p", { key: 'c5b2fc0f047c13f0841617e2c3552ea814e5c280', slot: "page_number" }, this.internalTotalPages - 2)), index.h("gb-pagination-number-base", { key: '40722f9a1a1a298c531967d854235675ba45cf7f', shape: this.shape, state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages - 1) }, index.h("p", { key: '82dd18c33a42bc8d3bb6a3eb6d8d653277c0fe65', slot: "page_number" }, this.internalTotalPages - 1)), index.h("gb-pagination-number-base", { key: 'e36f72f731adb20a81f3370f38d5dfeb392b3526', shape: this.shape, state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages) }, index.h("p", { key: '07a2af68d5fbfd911490c9bf731cd834a22487b4', slot: "page_number" }, this.internalTotalPages))))), index.h("gb-button", { key: 'cdd2f16679da1443d9b1878514bec57eaed5c227', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '392e9578873b1c5aa9661ecf5b787849b91cc45e' }, "Next")))), this.type === 'card_default' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: 'f7cfe362121d10eff563423f107b862bf61bc9bf', class: "pagination_entries" }, index.h("div", { key: 'b2d1b9e06b229a33229c97b2c2163bae85ccda9f', class: "entries_text" }, index.h("p", { key: '0147a762176b34feb06fbb6e3d4485f8400b12b9', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: '1d8e7314a836c5dca9fe0f9b049a165ca959185b', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: 'f5b18c61e2e645398867881b4d96f29d345e986c', 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: '66bb46ddbc8211163757aac4ec2385a84f000337', class: "pagination_numbers" }, this.internalTotalPages <= 5 &&
+            this.pages.map(page => (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage === page ? 'active' : 'default', onClick: () => this.setCurrentPage(page) }, index.h("p", { slot: "page_number" }, page)))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-number-base", { key: 'e14a6c6ac585842897625d6beb126c1345bee083', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(1) }, index.h("p", { key: '08a69b6cdcdce9acdc381b032559bf5ff537ada2', slot: "page_number" }, "1")), index.h("gb-pagination-number-base", { key: '877ea6a6e3dd2f97d0b5f4e7f10532933be4d336', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(2) }, index.h("p", { key: 'd2f9d17a6fa8b9170272ce7fed20d27f306ad4da', slot: "page_number" }, "2")), index.h("gb-pagination-number-base", { key: 'a85c84445f5c7b16d37b00113bf038f2b956286f', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => this.setCurrentPage(3) }, index.h("p", { key: 'c1c257d3934ab282276d7c386297fe1408f30830', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: 'b115cad858085aaf039b03b6fedffea9b3ab79b5', shape: this.shape, state: "default" }, index.h("p", { key: '75568fed7739e67dd71e6510f2246bd991598aa1', slot: "page_number" }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", { slot: "page_number" }, this.currentPage))) : null, index.h("gb-pagination-number-base", { key: '12aee49166e40246ae9d3ca5a14094867b7a1242', shape: this.shape, state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages - 2) }, index.h("p", { key: 'ec8cc01d5e5429541e7bce0dc803f6c45eb3405b', slot: "page_number" }, this.internalTotalPages - 2)), index.h("gb-pagination-number-base", { key: 'fd4028798761bfde83a880c8ca01fd6719a9cfed', shape: this.shape, state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages - 1) }, index.h("p", { key: 'd43fadb3647f63bda1d2cf05ee2787302e851dec', slot: "page_number" }, this.internalTotalPages - 1)), index.h("gb-pagination-number-base", { key: 'ceed9ecf364dc6ccc8c1def5ac57de7aabd72b96', shape: this.shape, state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => this.setCurrentPage(this.internalTotalPages) }, index.h("p", { key: '52456d700b9b84e2b448c02a6f25fefed6994885', slot: "page_number" }, this.internalTotalPages))))), index.h("div", { key: '4255ce30f334a6abb0b4c56ca77e68760fe6d2dd', class: "pagination_btns" }, index.h("gb-button", { key: 'dac609d493ca9edc7c7d42099dbfa10d51060e85', size: "sm", hierarchy: "secondary_gray", icon: "only", state: this.totalPages === 1 && this.currentPage === 1 ? 'disabled' : this.currentPage === 1 ? 'disabled' : 'default', "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), index.h("gb-button", { key: '9b48071f8cd05ebfffcd217aab7764fb225a7fa2', size: "sm", hierarchy: "secondary_gray", icon: "only", state: this.currentPage === this.internalTotalPages ? 'disabled' : this.currentPage === 1 && this.totalPages === 1 ? 'disabled' : '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: '8d0c157455dd1356b5b71b851a843803674f3566', class: "pagination_entries" }, index.h("div", { key: 'bca4e23ecd21fd15cf5a1c93bafe199246f696ac', class: "entries_text" }, index.h("p", { key: 'ba854a4c090ffba656b14204ea4843f4a6de0ec8', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: 'e2d796b15ec39b35288cbb371dc6b38197004a9b', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: 'f1fde13b69c02ec341063d79e4708f1e378b3857', 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: '5ea37f7289c87e9408060543100f21dc45e87be7', class: "page_number_text" }, index.h("p", { key: '91a5a55af744e903f7e083300e694c0b34401260', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("div", { key: '9a43b1e86d98db0c3a3bcf589a6531557cb4827f', class: "pagination_btns" }, index.h("gb-button", { key: '4444d528b4b8e6c5ce421ee509747ac7e9d81719', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: '83ed3a447e9ba6fa607942c8e6e58e734f45ff0a' }, "Previous")), index.h("gb-button", { key: '20d0967e38edc6fdac27eea3fff32b738186fd06', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '0fe1a3bc7c5f00e2d7b1e0cce0c0e9435c9604c5' }, "Next"))))), this.type === 'card_minimal_left_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: '19a51a221c3156ef5a514ecde17cb8012d123ad7', class: "pagination_btns" }, index.h("gb-button", { key: '9bc85e364b741e0a6aaa6dddf2b5887248ac745e', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: 'fc258e9f19e7cde135b03bc345053689bd724bf8' }, "Previous")), index.h("gb-button", { key: '04488f3a0e4715184df7a568d948b13ffe192a52', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: 'ac152503722b166db4e0bb978e5b85fff5fd978f' }, "Next"))), index.h("div", { key: 'ca91732b0365367faced24e8044f76b7e44e9032', class: "page_number_text" }, index.h("p", { key: '3af069678aaa1305634bed4d11ae49efe7e7f464', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("div", { key: 'd8b5e5a7683ae837e67362f79673ed1d75974e5a', class: "pagination_entries" }, index.h("div", { key: '7c856dcd073b4b2f888616a166002bc8c9095a82', class: "entries_text" }, index.h("p", { key: '9870da50315883ba18c4d6c2c88d7305aa4aab35', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: '6919c654dc5e2f9a2ae0f1d7d6506d2a53e872c2', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: '7b9301a1e0d52f9fea3180968f034a4aeda03269', 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: 'c78e30246f784150122007d4cebb3f912005b4a6', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: 'c6f904f9d14afbeaac46a1012fff4faaaa381e51' }, "Previous")), index.h("div", { key: '919c6fddc8db965693003015817a3808ccf62722', class: "page_number_text" }, index.h("p", { key: 'e0ed08f2e091ef46bb835ef6c494931c297992e6', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: '9d034b79ac741097b83944f90755b4fcf6c4cd36', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '53f762142d187265dffdbac42b50559e1bc07c88' }, "Next")))), this.type === 'card_button_group_right_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: '17719692a635522df0c29ad1635aa5d6818d50d3', class: "pagination_entries" }, index.h("div", { key: '93553b2b7165009329e4f09b5ea98a1df7d88193', class: "entries_text" }, index.h("p", { key: 'a4e24ecba5016d3d3f4aca95fd5b55d0191804e1', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: '157f7b7af5f50080b199dead714801a4c7930d3f', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: 'b19629a339c26d6afb6ade7415e839b71faa7797', 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: 'e1c5ac96ffac6c684a4031c9538dcf0ea9022a8c', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '53214666f9c4fb71ebf1c877379542be586403f3', icon: "leading", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: 'aecbbdcc99bb1518765c473049bd43c914200389' }, "Previous")), this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.pages.map(page => (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage === page ? 'active' : 'default', onClick: () => (this.currentPage = page) }, index.h("p", null, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-button-group-base", { key: '467654367f74da49ef425edd0ee48d27e861a321', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '7b7612d6f308b7602dbe6cd25e3d8455811582ec' }, "1")), index.h("gb-pagination-button-group-base", { key: '1a3e61a445b74ecea91502074bd4895f9b41fd23', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: '862f159aa2bfeddcb5d4d455e902faaede98291d' }, "2")), index.h("gb-pagination-button-group-base", { key: '4fa3f62e0b253c18475dd5bd620ecab92805f46b', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: '39dfbd609a6eec840eb474ed934b2cbf41b4bac1' }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'c905dcf00822a0bd6e0f144f7e52624c205eec1d', icon: "false" }, index.h("p", { key: 'ef4a07397ac700256eae98b18fa5b0963ff28ce2' }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'ed50171bd7cf55bae3cb24e1506e616ca4fae929', icon: "false", state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 2) }, index.h("p", { key: '8801b172ebfc8eae37bea1b33bfabf32d21a3aa6' }, this.internalTotalPages - 2)), index.h("gb-pagination-button-group-base", { key: '830c51f45df1511885229dc51fdda016ccd020cb', icon: "false", state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 1) }, index.h("p", { key: '167939bca1a442b1542c86bea7528b5fc84fe887' }, this.internalTotalPages - 1)), index.h("gb-pagination-button-group-base", { key: 'afb0ccccdd5e888c38a5ed5910f304af824925d7', icon: "false", state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages) }, index.h("p", { key: 'd6223f4853abba0c85caa6e8315e1e8fc37bd6a1' }, this.internalTotalPages)))), index.h("gb-pagination-button-group-base", { key: 'bc800d549ef591fc8141b6785788fb665b1c59c2', icon: "trailing", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '15b42060cbe5b1a6474fbb71b265a68a4866e804' }, "Next"))))), this.type === 'card_button_group_left_aligned' && this.breakpoint === 'desktop' && (index.h(index.Fragment, null, index.h("div", { key: '8a2b29e3cf8f7dc8dc531dbf80baf71c8ae4e416', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '4ce7e24cba635f3f341be9d66ccee1cc3c68c145', icon: "leading", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: 'ed5567a3258203d5bac0901f8f621089bdf548f9' }, "Previous")), this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.pages.map(page => (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage === page ? 'active' : 'default', onClick: () => (this.currentPage = page) }, index.h("p", null, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-button-group-base", { key: '12d42b949cce6deea840e3e9a8f326a904ad7936', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '3fc87ac81e80ee01dbfc3224478061d3131e99f0' }, "1")), index.h("gb-pagination-button-group-base", { key: 'a3273df7f4c089fb19d3b454637f590d47328f89', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: '53f03d42797f9f35593ce59c9257c2646cd4572e' }, "2")), index.h("gb-pagination-button-group-base", { key: '833d0cbf671295b99d8235d6e464fb99973dcd73', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: '4a8f97c8effa07824163dd1c90652fced1799634' }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'bd4b6d4631180aafc3a2e9533386920575115a7d', icon: "false" }, index.h("p", { key: '788acafb24e4222d86e824e8565c5fd9ae64902f' }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '84fe2d4935e45ebacc523e8d81c5d355eb1da826', icon: "false", state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 2) }, index.h("p", { key: '79d55c5fc2e26caafbdba9c635126d9e7ba26595' }, this.internalTotalPages - 2)), index.h("gb-pagination-button-group-base", { key: '5491cb4e21344296b41dd06e734a5e5efe917995', icon: "false", state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 1) }, index.h("p", { key: '412614211b45e9f64d030d52f1c0c461064a78c7' }, this.internalTotalPages - 1)), index.h("gb-pagination-button-group-base", { key: 'cbc2cbdfe9ab14f452631d120335a93c800155cf', icon: "false", state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages) }, index.h("p", { key: '6c9bbe39bcb9c47c8cf2ea6d0c747a1d2dec9195' }, this.internalTotalPages)))), index.h("gb-pagination-button-group-base", { key: '4fd9d45e8518011b03573c2c880a90d7fe652f3a', icon: "trailing", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '2299ef1eb5a21349cb3fd472034fce14105f53ab' }, "Next"))), index.h("div", { key: 'dc1a64b9f02c6e82d7ab328fec42ef4562d635f6', class: "pagination_entries" }, index.h("div", { key: '13832fb8fa88f5ded2e82d4e39df9350c5a3b34e', class: "entries_text" }, index.h("p", { key: '7d2510939eb80a18e9d6f5f4efdd36f7b1e0bccf', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), index.h("div", { key: '861a2d6ea835bc3875facdf80c28a4ea19932e75', class: `entries_dropdown` }, index.h("gb-input-dropdown", { key: 'c9478543efb044aa8cd2c5ab2bb1894d4620eea1', 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: 'c615e174b3d0edbf67ce350db442dbd47f9d5938', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: 'd37ecc8e1edeac1dc12240e0476ac00909337f83', icon: "leading", onClick: () => this.onPreviousButtonClicked() }, index.h("p", { key: 'd46c6c5dae31da5a98984d46eae61b1c4bbba4f2' }, "Previous")), this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.pages.map(page => (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage === page ? 'active' : 'default', onClick: () => (this.currentPage = page) }, index.h("p", null, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-button-group-base", { key: 'c6744db6cbaea9a31e89362a227e7de878b9709f', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '56a75bc952b0ce65462be99be1fdd89465b4d692' }, "1")), index.h("gb-pagination-button-group-base", { key: 'b90988941ff76ad911cdf641aeb26920329bea9e', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: '46417b3867e169e492de9a1a2e5669eb587e8ed0' }, "2")), index.h("gb-pagination-button-group-base", { key: '0b00a7ab35033874b8467d1ac9281c29dd6afa35', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: '713d7f6ae6222a00115c918ac871dd02c4b9069a' }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '3b5fb3dd51c70e52102c50f0260bfc288b2d3d61', icon: "false" }, index.h("p", { key: '786d59b8b0f9eb0717019d72110d6ee97e3c7fa7' }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '61c5832c974a8157e65417368e349aea8961cd34', icon: "false", state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 2) }, index.h("p", { key: '056df889266ee408c7425514ad0a425da786deb5' }, this.internalTotalPages - 2)), index.h("gb-pagination-button-group-base", { key: 'd95117ef4f4c2883e2481d1cccfd45b1bd63ef6d', icon: "false", state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 1) }, index.h("p", { key: 'a99d96349bbb68b3728be7da4461caf28585d65b' }, this.internalTotalPages - 1)), index.h("gb-pagination-button-group-base", { key: '25c886e19b593147c8d2769370ef874166989cb9', icon: "false", state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages) }, index.h("p", { key: '588cc467178dd7f7443337b8c1e6b29eae19d55a' }, this.internalTotalPages)))), index.h("gb-pagination-button-group-base", { key: 'eae9b224f6b0c072069a9ea01df37969660cf9d9', icon: "trailing", onClick: () => this.onNextButtonClicked() }, index.h("p", { key: '07ba9ed5380a980b301d14dbb0ee2c3772e39f97' }, "Next"))))), this.type === 'page_default' && this.breakpoint === 'mobile' && (index.h(index.Fragment, null, index.h("gb-button", { key: '1afc013ae7d32e649242a0719c8a6bb1a1cfd130', 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: 'cb35a663e2b277034a1501fbbeb9f2ef15c85a94', class: "page_number_text" }, index.h("p", { key: '1a2590590f7f41c51aecc33b948c403b8952b3b3', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: 'ca09d787ae0e9c0610a1fb84ce048bc7069ecba3', 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: '21f170bdf9fb55212f7b91ec68333458aaed943b', 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: 'bb5d760baeea266d069d0b2252661459a87545d5', class: "page_number_text" }, index.h("p", { key: 'b2f87221e67ce4cdfa4d830dd8d351f115fe47fa', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: 'f03a420593ad3e1130f003860d0c8e53d89094c0', 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: '782518ef30a8ecb80b5daf4861fc0badce032364', 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: '06d9781935f15609d350042659d99e7442d82086', class: "page_number_text" }, index.h("p", { key: 'f64777539e21d79147bec02d8e6ca4dfa492f7f0', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: '8fb0d718411f43b1eba9541939a0d4e83642d767', 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: 'b9a88ec0998e100e55e824044e600f52759bc794', 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: 'f3f8d51c2cc553819d4a89f7307913106b151d41', class: "page_number_text" }, index.h("p", { key: 'a7b0e902710a324ed6d84001a5367fc40f49ca60', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: '7cf3612bf240ebf786f44f6b3a8786b6995c9015', 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: 'd65b9a26438f8a8355713981ddc5f2e3f36e93b3', 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: 'fd44ea53758be794de34865f88ecc5d821b51014', class: "page_number_text" }, index.h("p", { key: '1adcb44b2fe2052b216e50e308517afb6f80076e', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: '5937edd805b68e33e46911cb7d69c7ed812c03e8', 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: '2cf02b121ea8fa12e55897ea5c4b36c1e64310a9', 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: '5d45fc67851ce2ab7c7433fb54b7c1c282ccae6f', class: "page_number_text" }, index.h("p", { key: '4b4a00d72df7e1ae858bfb56c45639a44f9cb0dd', class: "page_numbers text-sm-medium" }, "Page ", this.currentPage, " of ", this.internalTotalPages)), index.h("gb-button", { key: 'ec2595d5403413de87fc2c962406e01ea636b352', 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: 'b0e07820abf075d2f4be6a359352be433461a02d', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '8393a57bffbc9883ba3085f7721054333cf838a7', icon: "only", "icon-src": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.pages.map(page => (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage === page ? 'active' : 'default', onClick: () => (this.currentPage = page) }, index.h("p", null, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-button-group-base", { key: '9d0b9f760b439c27d3c63266fe1eba6ea286d629', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '9cf710e1281b106d835f83dc2bf913251067f00e' }, "1")), index.h("gb-pagination-button-group-base", { key: '909895906ff078ae436cbdcb9a6a08017c85772f', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: 'b8ea4848723e01fea2df134d9d6835be02ab173f' }, "2")), index.h("gb-pagination-button-group-base", { key: 'ecf8007292127ce4b455f46f23559313525784fd', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: 'c039c41cfde598f6f3176eb762cff3ffca3bb423' }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'c8f358ed6efc0ca22b8089c58fe5c09b9e256e04', icon: "false" }, index.h("p", { key: '714200da9cd0059d4b9c2f1ec76b68af65c39f98' }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '7377ad90e52a06b517367a033d89b57426b9ce32', icon: "false", state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 2) }, index.h("p", { key: '82d857c746f8f50d60573c1b53dfaea1abf3e60c' }, this.internalTotalPages - 2)), index.h("gb-pagination-button-group-base", { key: '78e11e826c1999bbd82ea29a869035387c726d3d', icon: "false", state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 1) }, index.h("p", { key: '03e57f656e9462236a0e0357a6c1336c1bb025dd' }, this.internalTotalPages - 1)), index.h("gb-pagination-button-group-base", { key: 'b98b858a8bc0ce51f627f13ca328537c57049b9c', icon: "false", state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages) }, index.h("p", { key: 'a64d560bfb62860bd203757df71dc4031d5ebbaa' }, this.internalTotalPages)))), index.h("gb-pagination-button-group-base", { key: '2973655c50c3f9ce79fde39954ae81f25445ab2d', 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: '6199388212abf0f1ebc6f15a59b4b947fa4cc9b7', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '6b4a0904ae6f7a9e3ffd483f5baff48f193984f8', icon: "only", "icon-src": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.pages.map(page => (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage === page ? 'active' : 'default', onClick: () => (this.currentPage = page) }, index.h("p", null, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-button-group-base", { key: '0f704e58775153805cfd5027f3fbe99e7a96a601', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '10f1e38e07442878cbff96ddb554b0bb1934d570' }, "1")), index.h("gb-pagination-button-group-base", { key: '7db5d4735f5144981d81fced0119a2eb08c4b693', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: 'ca19e077b54ed1d6effd65a0acea0be593ef3484' }, "2")), index.h("gb-pagination-button-group-base", { key: '9f202eb8923e933ed237419ae591c49869b9de25', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: 'c4e82f56ad68bbfee637494c2c183f576924304d' }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: '50559248ea5780c74825dcc432fd9796082422c7', icon: "false" }, index.h("p", { key: 'c2197bbab385a1071e9dc48cd96c94f9dd6d4b06' }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'c5a44392a42c6784806cd5c584939ee06b7b1bff', icon: "false", state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 2) }, index.h("p", { key: 'd600201b6509dbe92aac20abe8d9934ab746ad96' }, this.internalTotalPages - 2)), index.h("gb-pagination-button-group-base", { key: 'f9dd07611e2033e7f88925a4469b12b8fb62e77f', icon: "false", state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 1) }, index.h("p", { key: '0a84605026fb84cbdb98b72722ae9e32627c0de4' }, this.internalTotalPages - 1)), index.h("gb-pagination-button-group-base", { key: '4aedd1bc99dc0f8f080c96fc8c1c1680e8ec61a2', icon: "false", state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages) }, index.h("p", { key: '76b0ca70ab2e6999ac7a49b2cc5da985897b3782' }, this.internalTotalPages)))), index.h("gb-pagination-button-group-base", { key: 'd26c3b19834cfc8a781543253102e3a4036d00fc', 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: '68619d5ddf6ce9780f0dcbc02857009d96d55c4b', class: "pagination_button_group" }, index.h("gb-pagination-button-group-base", { key: '9531f9fa7f617e2b078c4f5d839badd0c1aa0ee4', icon: "only", "icon-src": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), this.internalTotalPages <= 5 && (index.h(index.Fragment, null, this.pages.map(page => (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage === page ? 'active' : 'default', onClick: () => (this.currentPage = page) }, index.h("p", null, page)))))), this.internalTotalPages >= 6 && (index.h(index.Fragment, null, index.h("gb-pagination-button-group-base", { key: '4f3819b980b008d634b5c53575f61715076de837', icon: "false", state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, index.h("p", { key: '706cb41d793b4281ce0c5dfb69afac8841ab3b88' }, "1")), index.h("gb-pagination-button-group-base", { key: 'ce15876479b71962e3d5d3a103240a31edf68246', icon: "false", state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, index.h("p", { key: '13a5b3c05e189f76a48d047b5a67fb2b223f3f7f' }, "2")), index.h("gb-pagination-button-group-base", { key: '4684d561de36f9b198be3aaec77c4f798a766e2b', icon: "false", state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, index.h("p", { key: 'd23abd59f662d74faf3c50cc3f7f3b91887bc65b' }, "3")), this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > 3 && this.currentPage <= this.internalTotalPages / 2 ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'd7d35b16d9bb308c45c96d682913a1544ee5db27', icon: "false" }, index.h("p", { key: '964d40a23529d5aa4891e26f0ea117cd784114d3' }, "...")), this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages - 2 ? (index.h("gb-pagination-button-group-base", { icon: "false", state: this.currentPage > this.internalTotalPages / 2 && this.currentPage < this.internalTotalPages ? 'active' : 'default' }, index.h("p", null, this.currentPage))) : null, index.h("gb-pagination-button-group-base", { key: 'd3b7d1f1f8e98f3ede2b3ac2aa6ead3076622aa5', icon: "false", state: this.currentPage === this.internalTotalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 2) }, index.h("p", { key: '92c7620ccd2997a94355009849cae6a8f4a35ea7' }, this.internalTotalPages - 2)), index.h("gb-pagination-button-group-base", { key: 'acbbd0c2390a5f64bb3fff439ae5616e6f960447', icon: "false", state: this.currentPage === this.internalTotalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages - 1) }, index.h("p", { key: '2e90723aacd59cfdc74b46f460d8ded61ccaf911' }, this.internalTotalPages - 1)), index.h("gb-pagination-button-group-base", { key: 'f93997d3db5eadd16af2c8abb53b5e97721ec218', icon: "false", state: this.currentPage === this.internalTotalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.internalTotalPages) }, index.h("p", { key: '8b9a1de825c773abef6df36676f4b351159d2e3d' }, this.internalTotalPages)))), index.h("gb-pagination-button-group-base", { key: '4397802255af151918d2807ffb2a467f7330c119', icon: "only", "icon-src": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() })))));
     }
     static get watchers() { return {
         "totalPages": ["onTotalPagesChange"]

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

@@ -0,0 +1,22 @@
+'use strict';
+
+var index = require('./index-CmQuD5Lz.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  /* gray color palette  */\r\n  --gray-25: #f9fafb;\r\n  --gray-50: #f6f8fa;\r\n  --gray-100: #eef2f6;\r\n  --gray-200: #e3e8ef;\r\n  --gray-300: #cdd5df;\r\n  --gray-400: #808c9e;\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  /* 0% opacity */\r\n  /* White */\r\n  --white-opacity0: rgba(255, 255, 255, 0);\r\n\r\n  /* Gray */\r\n  --gray25-opacity0: rgba(249, 250, 251, 0);\r\n  --gray900-opacity0: rgba(18, 25, 38, 0);\r\n  --gray950-opacity0: rgba(13, 18, 28, 0);\r\n\r\n  /* 20% opacity */\r\n  /* White */\r\n  --white-opacity20: rgba(255, 255, 255, 0.2);\r\n\r\n  /* Dark Blue */\r\n  --darkBlue200-opacity20: rgba(181, 185, 204, 0.2);\r\n  --darkBlue500-opacity20: rgba(33, 44, 101, 0.2);\r\n\r\n  /* Gray */\r\n  --gray25-opacity20: rgba(249, 250, 251, 0.2);\r\n  --gray900-opacity20: rgba(18, 25, 38, 0.2);\r\n  --gray950-opacity20: rgba(13, 18, 28, 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  /* 50% opacity */\r\n  /* White */\r\n  --white-opacity50: rgba(255, 255, 255, 0.5);\r\n\r\n  /* Gray */\r\n  --gray25-opacity50: rgba(249, 250, 251, 0.5);\r\n  --gray900-opacity50: rgba(18, 25, 38, 0.5);\r\n  --gray950-opacity50: rgba(13, 18, 28, 0.5);\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  /* 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  /* 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  /* -------------------------------------------------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-300);\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-400);\r\n  }\r\n\r\n  [data-theme='light'] {\r\n    --color-text-disabled: var(--gray-400);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-text-disabled: var(--gray-500);\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-100);\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-200);\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  [data-theme='dark'] {\r\n    --color-text-warning: var(--warning-300);\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(--lightBlue-800);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-text-discovery-bold: var(--lightBlue-100);\r\n  }\r\n\r\n  [data-theme='light'] {\r\n    --color-text-discovery: var(--lightBlue-800);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-text-discovery: var(--lightBlue-100);\r\n  }\r\n\r\n  [data-theme='light'] {\r\n    --color-text-discovery-subtle: var(--lightBlue-400);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-text-discovery-subtle: var(--lightBlue-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  /* --------------Link color--------------- */\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(--lightBlue-600);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-link-visited: var(--lightBlue-300);\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-300);\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-400);\r\n  }\r\n\r\n  [data-theme='light'] {\r\n    --color-icon-disabled: var(--gray-400);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-icon-disabled: var(--gray-500);\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(--lightBlue-800);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-icon-discovery-bold: var(--lightBlue-100);\r\n  }\r\n\r\n  [data-theme='light'] {\r\n    --color-icon-discovery: var(--lightBlue-600);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-icon-discovery: var(--lightBlue-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(--lightBlue-800);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-border-discovery-bold: var(--lightBlue-100);\r\n  }\r\n\r\n  [data-theme='light'] {\r\n    --color-border-discovery: var(--lightBlue-600);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-border-discovery: var(--lightBlue-300);\r\n  }\r\n\r\n  [data-theme='light'] {\r\n    --color-border-discovery-subtle: var(--lightBlue-200);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-border-discovery-subtle: var(--lightBlue-800);\r\n  }\r\n\r\n  [data-theme='light'] {\r\n    --color-border-discovery-subtler: var(--lightBlue-100);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-border-discovery-subtler: var(--lightBlue-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  /* 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-btn-disabled: var(--gray-100);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-background-btn-disabled: var(--gray-700);\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-950);\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  /* ----------------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  /* ----------------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    [data-theme='light'] {\r\n    --color-skeleton-bold: var(--gray-300);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-skeleton-bold: var(--gray-700);\r\n  }\r\n\r\n  /* ----------------Surface Color --------------- */\r\n  [data-theme='light'] {\r\n    --color-surface-bold: var(--gray-50);\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  /* ----------------Transparent Color --------------- */\r\n  [data-theme='light'] {\r\n    --color-surface-transparent50: var(--white-opacity50);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-surface-transparent50: var(--gray900-opacity50);\r\n  }\r\n\r\n  [data-theme='light'] {\r\n    --color-surface-transparent20: var(--white-opacity20);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-surface-transparent20: var(--gray900-opacity20);\r\n  }\r\n\r\n  [data-theme='light'] {\r\n    --color-surface-transparent-full: var(--white-opacity0);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-surface-transparent-full: var(--gray900-opacity0);\r\n  }\r\n\r\n  [data-theme='light'] {\r\n    --color-surface-bold-transparent50: var(--gray25-opacity50);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-surface-bold-transparent50: var(--gray950-opacity50);\r\n  }\r\n\r\n  [data-theme='light'] {\r\n    --color-surface-bold-transparent20: var(--gray25-opacity20);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-surface-bold-transparent20: var(--gray950-opacity20);\r\n  }\r\n\r\n  [data-theme='light'] {\r\n    --color-surface-bold-transparent-full: var(--gray25-opacity0);\r\n  }\r\n\r\n  [data-theme='dark'] {\r\n    --color-surface-bold-transparent-full: var(--gray950-opacity0);\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.1), 0px 1px 2px 0px rgba(16, 24, 40, 0.06);\r\n  --shadow-md: 0px 4px 8px -2px rgba(16, 24, 40, 0.1), 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/* -----------------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: 2rem;\r\n  --font-line-height-t-lg: 1.875rem;\r\n  --font-line-height-t-md: 1.688rem;\r\n  --font-line-height-t-sm: 1.5rem;\r\n  --font-line-height-t-xs: 1.25rem;\r\n  --font-line-height-t-xxs: 1.125rem;\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\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 GbProgressBar = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.showLabel = false;
+    }
+    render() {
+        const progressValue = Math.min(Math.max(this.progress, 0), 100);
+        return (index.h("div", { key: '69e313bd11a9e5778913a7eab12655054b99e7e9', class: `progress_bar_container ${this.labelPosition}` }, index.h("div", { key: 'e993307ed89d5c6df173ff9ae4fca8685527a0f7', class: "progress_bar" }, index.h("div", { key: '6341576575348c6603e0efb552efcb45acc89dd1', class: "progress_fill", style: { width: `${progressValue}%` } })), index.h(index.Fragment, null, this.showLabel && (index.h("div", { key: '67d294d2386c26fac3fa23e5048879efd1f64390', class: `label ${this.labelPosition}` }, this.labelPosition === 'right' && index.h("span", { key: '53228130197d369ea9bbdd1fd79e4de4d55e484f', class: `text-sm-medium` }, progressValue, "%"), this.labelPosition === 'bottom' && index.h("span", { key: 'a29fc64d5a60a989e6b1f12f983e68a4186b7aa1', class: `text-sm-medium` }, progressValue, "%"), this.labelPosition === 'top_floating' && (index.h("gb-tooltip", { key: 'b9814ba42ff334a675388d202317fe3e0f55c550', class: `top_tooltip`, arrow: "none", style: { marginLeft: `${(progressValue - 6.5).toString()}%` } }, index.h("p", { key: '9e98fdb693004c8d85828cb5edcc7d7219ed82fa', slot: "main_text", class: "text-xs-semi-bold" }, progressValue, "%"))), this.labelPosition === 'bottom_floating' && (index.h("gb-tooltip", { key: 'b2e1dc16ba64bb0f1ccfee2aaef5f571ec739895', class: `bottom_tooltip`, arrow: "none", style: { marginLeft: `${(progressValue - 59.5).toString()}%` } }, index.h("p", { key: '7af4aa8c52c5103a0b35ce069c0c7d2385fb17e3', slot: "main_text", class: "text-xs-semi-bold" }, progressValue, "%"))))))));
+    }
+};
+GbProgressBar.style = gbProgressBarCss;
+
+exports.gb_progress_bar = GbProgressBar;
+//# sourceMappingURL=gb-progress-bar.entry.cjs.js.map
+
+//# 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,g3pEAAg3pE;;MCO53pE,aAAa,GAAA,MAAA;AAL1B,IAAA,WAAA,CAAA,OAAA,EAAA;;AAOU,QAAA,IAAS,CAAA,SAAA,GAAY,KAAK;AAoCnC;IAjCC,MAAM,GAAA;AACJ,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,CAAC;AAE/D,QAAA,QACEA,kEAAK,KAAK,EAAE,0BAA0B,IAAI,CAAC,aAAa,CAAA,CAAE,EAAA,EACxDA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,cAAc,EAAA,EACvBA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,eAAe,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,CAAA,EAAG,aAAa,CAAA,CAAA,CAAG,EAAE,GAAQ,CACpE,EACNA,OAAA,CAAAC,cAAA,EAAA,IAAA,EACG,IAAI,CAAC,SAAS,KACbD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,CAAA,MAAA,EAAS,IAAI,CAAC,aAAa,CAAE,CAAA,EAAA,EACtC,IAAI,CAAC,aAAa,KAAK,OAAO,IAAIA,OAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAgB,cAAA,CAAA,EAAA,EAAG,aAAa,EAAS,GAAA,CAAA,EACxF,IAAI,CAAC,aAAa,KAAK,QAAQ,IAAIA,OAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAA,cAAA,CAAgB,EAAA,EAAG,aAAa,EAAS,GAAA,CAAA,EACzF,IAAI,CAAC,aAAa,KAAK,cAAc,KACpCA,OAAY,CAAA,YAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAA,WAAA,CAAa,EAAE,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,CAAA,EAAG,CAAC,aAAa,GAAG,GAAG,EAAE,QAAQ,EAAE,CAAA,CAAA,CAAG,EAAE,EAAA,EAC1GA,OAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,mBAAmB,EAAA,EAC1C,aAAa,EACZ,GAAA,CAAA,CACO,CACd,EACA,IAAI,CAAC,aAAa,KAAK,iBAAiB,KACvCA,OAAY,CAAA,YAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAgB,cAAA,CAAA,EAAE,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,CAAG,EAAA,CAAC,aAAa,GAAG,IAAI,EAAE,QAAQ,EAAE,CAAG,CAAA,CAAA,EAAE,EAAA,EAC9GA,OAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,mBAAmB,EAAA,EAC1C,aAAa,EACZ,GAAA,CAAA,CACO,CACd,CACG,CACP,CACA,CACC;;;;;;;","names":["h","Fragment"],"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-bar.entry.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gb-progress-bar.entry.cjs.js","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}"],"names":["h","Fragment"],"mappings":";;;;AAAA,MAAM,gBAAgB,GAAG,g3pEAAg3pE;;MCO53pE,aAAa,GAAA,MAAA;AAL1B,IAAA,WAAA,CAAA,OAAA,EAAA;;AAOU,QAAA,IAAS,CAAA,SAAA,GAAY,KAAK;AAoCnC;IAjCC,MAAM,GAAA;AACJ,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,CAAC;AAE/D,QAAA,QACEA,kEAAK,KAAK,EAAE,0BAA0B,IAAI,CAAC,aAAa,CAAA,CAAE,EAAA,EACxDA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,cAAc,EAAA,EACvBA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,eAAe,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,CAAA,EAAG,aAAa,CAAA,CAAA,CAAG,EAAE,GAAQ,CACpE,EACNA,OAAA,CAAAC,cAAA,EAAA,IAAA,EACG,IAAI,CAAC,SAAS,KACbD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,CAAA,MAAA,EAAS,IAAI,CAAC,aAAa,CAAE,CAAA,EAAA,EACtC,IAAI,CAAC,aAAa,KAAK,OAAO,IAAIA,OAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAgB,cAAA,CAAA,EAAA,EAAG,aAAa,EAAS,GAAA,CAAA,EACxF,IAAI,CAAC,aAAa,KAAK,QAAQ,IAAIA,OAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAA,cAAA,CAAgB,EAAA,EAAG,aAAa,EAAS,GAAA,CAAA,EACzF,IAAI,CAAC,aAAa,KAAK,cAAc,KACpCA,OAAY,CAAA,YAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAA,WAAA,CAAa,EAAE,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,CAAA,EAAG,CAAC,aAAa,GAAG,GAAG,EAAE,QAAQ,EAAE,CAAA,CAAA,CAAG,EAAE,EAAA,EAC1GA,OAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,mBAAmB,EAAA,EAC1C,aAAa,EACZ,GAAA,CAAA,CACO,CACd,EACA,IAAI,CAAC,aAAa,KAAK,iBAAiB,KACvCA,OAAY,CAAA,YAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAgB,cAAA,CAAA,EAAE,KAAK,EAAC,MAAM,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,CAAG,EAAA,CAAC,aAAa,GAAG,IAAI,EAAE,QAAQ,EAAE,CAAG,CAAA,CAAA,EAAE,EAAA,EAC9GA,OAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,IAAI,EAAC,WAAW,EAAC,KAAK,EAAC,mBAAmB,EAAA,EAC1C,aAAa,EACZ,GAAA,CAAA,CACO,CACd,CACG,CACP,CACA,CACC;;;;;;;"}

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

@@ -34,7 +34,7 @@ const GbProgressCircle = class {
         }
     }
     render() {
-        return (index.h("div", { key: '27382a7b838241ffd08f351b3451bb9bdd09077c', class: "gauge" }, index.h("div", { key: '246e21d6411ccb1892886709f0dcba0502618f3e', class: "arc", ref: el => (this.arcElement = el) }), index.h("div", { key: 'b8621302eaf7696f19d49444f9ee30ab04215771', class: "mask" }), this.label && (index.h("div", { key: '7f0ff02ddb094888bddcb918031d1f27b4fbb45d', class: "label", ref: el => (this.labelElement = el) }, index.h("p", { key: '6f81be641f0203a7d044b78add4d6513f16911cd', class: "display-lg-semi-bold" }, `${this.progress}%`)))));
+        return (index.h("div", { key: 'b611508e9cbcb12de8d169c35868ab08a6adc34e', class: "gauge" }, index.h("div", { key: 'c64d3a2facb06aac19f089f65145fdf4577814e8', class: "arc", ref: el => (this.arcElement = el) }), index.h("div", { key: '384765a9cd0e7cc4f037f7a356c3029134fcde77', class: "mask" }), this.label && (index.h("div", { key: 'd6dad29c90bf462b55b2d6047ae8b2132b3ff747', class: "label", ref: el => (this.labelElement = el) }, index.h("p", { key: '404fd15a104c7e514513983515dffd266927c105', class: "display-lg-semi-bold" }, `${this.progress}%`)))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/gb-quick-action-card.cjs.entry.js

@@ -11,7 +11,7 @@ const GbQuickActionCard = class {
         this.label = '';
     }
     render() {
-        return (index.h("div", { key: 'ad3f6090d55788343cae503e09b01fed63511e60', class: "quick_action_div" }, index.h("gb-card-icon", { key: 'ba558c8c3ce0627c8692bffb83c3dabcb312b64e', size: "sm", color: this.color, icon: this.icon }), index.h("p", { key: 'cb6481b6e3f49eb497c5f32ef9f8c4b1ebc5bb7e', class: "label text-xs-medium" }, this.label)));
+        return (index.h("div", { key: '436e26442b2c74b0126bf9b36391e46d0be685cb', class: "quick_action_div" }, index.h("gb-card-icon", { key: '5d89ad683676387c25968fee5777094eaeaa801c', size: "sm", color: this.color, icon: this.icon }), index.h("p", { key: 'a3322df3633ac924a7097167614327173935f019', class: "label text-xs-medium" }, this.label)));
     }
 };
 GbQuickActionCard.style = gbQuickActionCardCss;

package/dist/cjs/gb-quick-action-icon.cjs.entry.js

@@ -12,7 +12,7 @@ const GbQuickActionIcon = class {
         this.isHovered = false;
     }
     render() {
-        return (index.h("div", { key: '8e19e8dbd3f1087fc7a952ea8559101aa0719f87', class: "quick_action_icon_div", onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false) }, index.h("gb-card-icon", { key: '8a2511f31ee5fbf308f8f9f9ab0044096bfd9a6b', size: "sm", color: this.isHovered ? 'cyan' : 'blue', icon: this.icon }), index.h("p", { key: '74789cdda310bd6c7328fb19ffd8f17fdc16a131', class: "label text-xs-medium" }, this.label)));
+        return (index.h("div", { key: '2d0e5b4a3e71cde8d9f316ac91b13e5e034024de', class: "quick_action_icon_div", onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false) }, index.h("gb-card-icon", { key: 'b6c0f051e56aefc0ba7e8a636bfcc2342ce7a87d', size: "sm", color: this.isHovered ? 'cyan' : 'blue', icon: this.icon }), index.h("p", { key: '151cec093ddd8471bb22a606ef3c601176d76f97', class: "label text-xs-medium" }, this.label)));
     }
 };
 GbQuickActionIcon.style = gbQuickActionIconCss;

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

@@ -11,7 +11,7 @@ const GbScrollbar = class {
         this.length = '25%';
     }
     render() {
-        return (index.h("div", { key: '1e999cf628808c12f98d1dd141dca73085c69ec3', class: "scrollbar-container" }, index.h("div", { key: '27f265868baa135a4b0da1958fc626e9f143cee3', class: "scrollbar", style: { height: this.length } }, index.h("slot", { key: '63768a92aa1d11a5aac2b10a70e8690807573800' }))));
+        return (index.h("div", { key: 'cb2d88342ed4fb31e756a7efaf3fcdc82b1a3203', class: "scrollbar-container" }, index.h("div", { key: '5d9c1fedeb95acb4124dde6bb9ed5c533f07f97a', class: "scrollbar", style: { height: this.length } }, index.h("slot", { key: 'a73a6966f5170bd93c2fdd40477e441d02256630' }))));
     }
 };
 GbScrollbar.style = gbScrollbarCss;