npm - globuswebcomponents - Versions diffs - 0.7.9 → 0.8.0 - Mend

globuswebcomponents 0.7.9 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (314) hide show

package/dist/collection/components/gb-input-dropdown/gb-input-dropdown.js CHANGED Viewed

@@ -177,15 +177,15 @@ export class GbInputDropdown {
     }
     render() {
         return [
-            h("div", { key: '57edecd764c0d2c1340ae375d43fb76cc4cffad0', class: `input_dropdown_container ${this.type === 'tags' ? 'tag' : ''}`, onClick: () => this.toggleDropdown() }, h("div", { key: '1a34a4a64bf899380c715ee3245ade6b48bb8a1a', class: `input_with_label` }, this.showLabel && (h("p", { key: '7bd87f6e29436a52621ce3194cc61bea8577f4cf', class: "text-sm-regular", style: { color: '#4B5565' } }, this.label.charAt(0).toUpperCase() + this.label.slice(1).toLowerCase())), h("div", { key: 'f66ea18c26007ca0f102f9afeb7e1b71af5c11a9', class: `input_dropdown_div ${this.size} ${this.state} ${this.type === 'tags' ? 'tag' : ''}` }, this.type === 'icon_leading' && (h("svg", { key: '16bbce3dc7391d49d1909f7a2b8ff1972e31b239', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'b04976e25ecaebc67b5ba4ae5eb8d367ad4dfe37', d: "M5.48131 12.9013C4.30234 13.6033 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3333 6.32572 18.3333H13.6743C14.9621 18.3333 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6033 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#697586", "stroke-width": "1.66667" }), h("path", { key: '87c1a2e84deba31ef986ab0642564a6a4d30e54c', d: "M13.75 5.41667C13.75 7.48774 12.0711 9.16667 10 9.16667C7.92893 9.16667 6.25 7.48774 6.25 5.41667C6.25 3.3456 7.92893 1.66667 10 1.66667C12.0711 1.66667 13.75 3.3456 13.75 5.41667Z", stroke: "#697586", "stroke-width": "1.66667" }))), this.type === 'avatar_leading' && (h(Fragment, null, this.state === 'default' && (h("svg", { key: 'b2ff6f2ad501801111a7c9b4d9b285a7bbe864b2', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '12b42e2bd7b6f19f099f9915a75a36531d95adfb', d: "M5.48131 12.9013C4.30234 13.6033 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3333 6.32572 18.3333H13.6743C14.9621 18.3333 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6033 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#4B5565", "stroke-width": "1.66667" }), h("path", { key: '6a4b241271e6a4c65c4cdc33265d954522be66a2', d: "M13.75 5.41666C13.75 7.48772 12.0711 9.16666 10 9.16666C7.92893 9.16666 6.25 7.48772 6.25 5.41666C6.25 3.34559 7.92893 1.66666 10 1.66666C12.0711 1.66666 13.75 3.34559 13.75 5.41666Z", stroke: "#4B5565", "stroke-width": "1.66667" }))), this.state === 'filled' && (h("gb-avatar", { key: '22a4374d3945137ac7787a39b95f108300a1268e', size: "xs", text: this.text, color: this.color, "show-border": this.showBorder }, h("h1", { key: 'a0b72143fa9c7f94cac96382851eb0f71ca8ea05', slot: "initials" }, this.selectedItem.name.split(' ').map(part => part.charAt(0).toUpperCase())))))), this.showLeadingIcon && h(Fragment, null, this.type === 'search' || this.type === 'tags' ? h("div", { class: `icon`, innerHTML: this.leadingIconSvg }) : null), this.type === 'dot_leading' && (h("svg", { key: '2750782db73d641637b8ce1bcadb1ae78db21b7d', xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", class: `dot ${this.size}` }, h("circle", { key: '26aa5529c2136c02c72a8256d623dfdbdcb9c836', cx: "5", cy: "5", r: "4", fill: "#079455" }))), h("div", { key: '42d8c5eb3881f855346f37f3109261080a4f9ac3', class: "placeholder" }, h(Fragment, null, this.state === 'default' && (h(Fragment, null, this.placeholder && (h("p", { key: '209195ea3b0bd35878eb284a3bcdc363f14a1267', class: "text-md-regular", style: { color: '#CDD5DF' } }, this.placeholder)))), this.state === 'filled' && (h(Fragment, null, h("div", { key: '9f4547009d644a7ea0b499b09b3626245a095878', class: `content` }, h("div", { key: 'c0f1f845e475e05bdb868b4bd3cb873936b51146', class: `text text-md-regular ${this.type === 'tags' ? 'tag' : ''}`, style: { color: '#4B5565' } }, this.type === 'tags' && (h(Fragment, null, this.selectedItems.map((item, index) => {
+            h("div", { key: 'da5f16d3d3b6666cf179644e23ecda6803fc7b4f', class: `input_dropdown_container ${this.type === 'tags' ? 'tag' : ''}`, onClick: () => this.toggleDropdown() }, h("div", { key: 'd9dba5400497d66406dea4557fc02936f2ebed83', class: `input_with_label` }, this.showLabel && (h("p", { key: 'aeabebb9b86883761ad2f84bcaef64885664d3f0', class: "text-sm-regular", style: { color: '#4B5565' } }, this.label.charAt(0).toUpperCase() + this.label.slice(1).toLowerCase())), h("div", { key: '90d83b59286f5decdbbd6d2d21207ec3eb05da02', class: `input_dropdown_div ${this.size} ${this.state} ${this.type === 'tags' ? 'tag' : ''}` }, this.type === 'icon_leading' && (h("svg", { key: '1ecd8c3c2a6fe3a1eb24567337a53401bbd7482a', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '93e149a8085a72a76d48906defd272b05acc97b5', d: "M5.48131 12.9013C4.30234 13.6033 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3333 6.32572 18.3333H13.6743C14.9621 18.3333 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6033 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#697586", "stroke-width": "1.66667" }), h("path", { key: 'e1c1c1fab69a2570f3d3eb03f608d33ad0f5971a', d: "M13.75 5.41667C13.75 7.48774 12.0711 9.16667 10 9.16667C7.92893 9.16667 6.25 7.48774 6.25 5.41667C6.25 3.3456 7.92893 1.66667 10 1.66667C12.0711 1.66667 13.75 3.3456 13.75 5.41667Z", stroke: "#697586", "stroke-width": "1.66667" }))), this.type === 'avatar_leading' && (h(Fragment, null, this.state === 'default' && (h("svg", { key: 'feda2e4d1e70530a1c236be1d656ae905cee2f23', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '92cb7ab010485eb201a6f24fac1b39825a2faca2', d: "M5.48131 12.9013C4.30234 13.6033 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3333 6.32572 18.3333H13.6743C14.9621 18.3333 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6033 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#4B5565", "stroke-width": "1.66667" }), h("path", { key: 'a146bebf8ad32976a30ce8afdeff1ca5c0856c73', d: "M13.75 5.41666C13.75 7.48772 12.0711 9.16666 10 9.16666C7.92893 9.16666 6.25 7.48772 6.25 5.41666C6.25 3.34559 7.92893 1.66666 10 1.66666C12.0711 1.66666 13.75 3.34559 13.75 5.41666Z", stroke: "#4B5565", "stroke-width": "1.66667" }))), this.state === 'filled' && (h("gb-avatar", { key: 'b3e5f962a02717ad1de20e7aafd862993d4f76b6', size: "xs", text: this.text, color: this.color, "show-border": this.showBorder }, h("h1", { key: '691c30c2705534aeb6c6a7bd24008aa94315f4cd', slot: "initials" }, this.selectedItem.name.split(' ').map(part => part.charAt(0).toUpperCase())))))), this.showLeadingIcon && h(Fragment, null, this.type === 'search' || this.type === 'tags' ? h("div", { class: `icon`, innerHTML: this.leadingIconSvg }) : null), this.type === 'dot_leading' && (h("svg", { key: '1f8e3cbde06cf6fcde7018c844e905518f2d1104', xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", class: `dot ${this.size}` }, h("circle", { key: '112d2a6023315073b3184ccc02b1f13685f1bc27', cx: "5", cy: "5", r: "4", fill: "#079455" }))), h("div", { key: '14a540969a2100b5047eec7b73d0ad7fce35f41f', class: "placeholder" }, h(Fragment, null, this.state === 'default' && (h(Fragment, null, this.placeholder && (h("p", { key: 'a68363778294e1703f6a76bd84a5d9c4857d1fc7', class: "text-md-regular", style: { color: '#CDD5DF' } }, this.placeholder)))), this.state === 'filled' && (h(Fragment, null, h("div", { key: '103070614fd005f006d37a0637c2e0bc587e9977', class: `content` }, h("div", { key: 'ba2b670d9cd6cf4107c02d442e620f12df262e94', class: `text text-md-regular ${this.type === 'tags' ? 'tag' : ''}`, style: { color: '#4B5565' } }, this.type === 'tags' && (h(Fragment, null, this.selectedItems.map((item, index) => {
                 {
                     typeof item === 'object' ? (h("div", { class: "added_tag" }, h("gb-tag", { size: "sm", icon: !this.icon ? 'avatar' : this.icon, action: "X_close", key: index, onClick: () => this.handleTagRemove(item) }, h("p", { class: "text-xs-medium" }, item.name.split(' ')[0]), h("h1", { slot: "initials", class: "text-xxs-semi-bold" }, item.name.split(' ').map(part => part.charAt(0).toUpperCase()))))) : ((console.log(item),
                         (h("div", { class: "added_tag" }, h("gb-tag", { size: "sm", icon: "avatar", action: "X_close", key: index, onClick: () => this.handleTagRemove(item) }, h("p", { class: "text-xs-medium" }, item))))));
                 }
-            })))), this.supportingText && (h("div", { key: '12a5a7a97be35fd54c658fa2be10d207080b5133', class: "supporting_text text-sm-regular", style: { color: '#697586' } }, this.type === 'tags'
+            })))), this.supportingText && (h("div", { key: '2402c36c7697c774c42b532997ef53c512dc41f2', class: "supporting_text text-sm-regular", style: { color: '#697586' } }, this.type === 'tags'
                 ? this.selectedItems.map(item => item.username).join(', ') // For multiple selections
-                : this.selectedItem.username))))))), this.showHelpIcon && (h("div", { key: 'f2e095111e3a029f90c8776c226655dd201da43c', class: `help_icon` }, h("gb-help-tooltip", { key: '17043b56f1dceed08c1e1396889243556aa228e2', "show-supporting-text": true }, h("slot", { key: '0969f825553e4a8f340b04801029590df8973165', name: "tooltip_label", slot: "label" }), h("slot", { key: '9bdf38f89b2c062b6f06e2d178f83ba21a9f0bb4', name: "tooltip_supporting_text", slot: "supporting_text" })))), this.type !== 'search' && (h("div", { key: '7d486401bf3640e3b40192777c2b57cc42336185', class: `dropdown_icon ${this.dropdownOpen ? 'opened' : ''}` }, h("svg", { key: '6a5d7abfdce85c1ac8e0fda066602e7a7df30933', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `${this.state}` }, h("path", { key: 'a535964818bf614ea11e150f07a686ae5bb197af', d: "M15 7.50004C15 7.50004 11.3176 12.5 9.99996 12.5C8.68237 12.5 5 7.5 5 7.5", stroke: "#697586", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), this.showHintText && (h("p", { key: 'b7713e1e0ed6d75ab3d091c6e7a8420a03e04944', class: "text-sm-regular", style: { color: '#697586' } }, this.hintText))),
-            h(Fragment, null, this.dropdownOpen && (h("div", { key: 'bbf327874b48b04e1b91be36988e319dca76f12f', class: `dropdown_menu ${this.menuPosition}`, ref: el => (this.dropdownRef = el) }, this.type === 'tags' ? (h(Fragment, null, this.selectedItems.map(item => (h("gb-input-dropdown-menu-item", { type: this.type === 'search' ? 'checkbox' : this.type === 'tags' ? 'checkbox' : this.type, state: StateEnum.Default, "supporting-text": this.supportingText, selected: this.isItemSelected(item), onClick: () => this.handleItemSelect(item) }, h("p", { slot: "name" }, item.name), h("p", { slot: "supporting_text" }, "@", item.username)))), this.unselectedItems.map(item => (h("gb-input-dropdown-menu-item", { type: this.type === 'search' ? 'checkbox' : this.type === 'tags' ? 'checkbox' : this.type, state: StateEnum.Default, "supporting-text": this.supportingText, selected: this.isItemSelected(item), onClick: () => this.handleItemSelect(item) }, h("p", { slot: "name" }, item.name), h("p", { slot: "supporting_text" }, "@", item.username)))))) : (h(Fragment, null, this.items.map(item => (h("gb-input-dropdown-menu-item", { type: this.type === 'search' ? 'checkbox' : this.type === 'tags' ? 'checkbox' : this.type, state: StateEnum.Default, "supporting-text": this.supportingText, selected: this.isItemSelected(item), color: this.color, onClick: () => this.handleItemSelect(item) }, typeof item === 'object' ? (h(Fragment, null, h("p", { slot: "name" }, item.name), h("h1", { slot: "initials" }, item.name.split(' ').map(part => part.charAt(0).toUpperCase())), h("p", { slot: "supporting_text" }, "@", item.username))) : (typeof item === 'string' && (console.log(item), (h("p", { slot: "name" }, item)))))))))))),
+                : this.selectedItem.username))))))), this.showHelpIcon && (h("div", { key: '647887bbefb5d4179d849fa7f13f3f7837eb7db9', class: `help_icon` }, h("gb-help-tooltip", { key: '01dc1c73a40b22e330d1df5cf927643a03b056ab', "show-supporting-text": true }, h("slot", { key: 'c5b8f90a61ba2d4936943dc6af3e82bbf9fb2392', name: "tooltip_label", slot: "label" }), h("slot", { key: '11df149da8d47170cc875d496866e91357f7c911', name: "tooltip_supporting_text", slot: "supporting_text" })))), this.type !== 'search' && (h("div", { key: 'c292ebaffb56c120463ee50f4101eb57b678d1f6', class: `dropdown_icon ${this.dropdownOpen ? 'opened' : ''}` }, h("svg", { key: '282d6a1efa8e5faf95de592afb2a836fa8147160', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `${this.state}` }, h("path", { key: '986b5e57e9fcbc73060111f0c58e11bc745e03ea', d: "M15 7.50004C15 7.50004 11.3176 12.5 9.99996 12.5C8.68237 12.5 5 7.5 5 7.5", stroke: "#697586", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), this.showHintText && (h("p", { key: '1aa77f0152d3b33f20e73547f6d6d7276540fc62', class: "text-sm-regular", style: { color: '#697586' } }, this.hintText))),
+            h(Fragment, null, this.dropdownOpen && (h("div", { key: '0688b0095ccf8d98526fe632a694c1a44d7123ad', class: `dropdown_menu ${this.menuPosition}`, ref: el => (this.dropdownRef = el) }, this.type === 'tags' ? (h(Fragment, null, this.selectedItems.map(item => (h("gb-input-dropdown-menu-item", { type: this.type === 'search' ? 'checkbox' : this.type === 'tags' ? 'checkbox' : this.type, state: StateEnum.Default, "supporting-text": this.supportingText, selected: this.isItemSelected(item), onClick: () => this.handleItemSelect(item) }, h("p", { slot: "name" }, item.name), h("p", { slot: "supporting_text" }, "@", item.username)))), this.unselectedItems.map(item => (h("gb-input-dropdown-menu-item", { type: this.type === 'search' ? 'checkbox' : this.type === 'tags' ? 'checkbox' : this.type, state: StateEnum.Default, "supporting-text": this.supportingText, selected: this.isItemSelected(item), onClick: () => this.handleItemSelect(item) }, h("p", { slot: "name" }, item.name), h("p", { slot: "supporting_text" }, "@", item.username)))))) : (h(Fragment, null, this.items.map(item => (h("gb-input-dropdown-menu-item", { type: this.type === 'search' ? 'checkbox' : this.type === 'tags' ? 'checkbox' : this.type, state: StateEnum.Default, "supporting-text": this.supportingText, selected: this.isItemSelected(item), color: this.color, onClick: () => this.handleItemSelect(item) }, typeof item === 'object' ? (h(Fragment, null, h("p", { slot: "name" }, item.name), h("h1", { slot: "initials" }, item.name.split(' ').map(part => part.charAt(0).toUpperCase())), h("p", { slot: "supporting_text" }, "@", item.username))) : (typeof item === 'string' && (console.log(item), (h("p", { slot: "name" }, item)))))))))))),
         ];
     }
     static get is() { return "gb-input-dropdown"; }

package/dist/collection/components/gb-input-dropdown-menu-item/gb-input-dropdown-menu-item.js CHANGED Viewed

@@ -24,13 +24,13 @@ export class GbInputDropdownMenuItem {
     render() {
         return (
         // <div class="dropdown-container" onClick={() => (this.selected = !this.selected)}>
-        h("div", { key: '94611cdb068835c3c5d3f89831dbda04133b2358', class: "dropdown-container" }, h("div", { key: 'f6844f31dd059bfe50341772249892c491e9440c', class: {
+        h("div", { key: 'd797ff86e3c9870ae596e5feb5e43224239ac981', class: "dropdown-container" }, h("div", { key: '02d483312ab9aaafe04b253dbcd22c96df3adfe0', class: {
                 'dropdown-item': true,
                 'selected': this.selected,
                 'disabled': this.state === 'disabled',
                 'checkbox': this.type === 'checkbox',
                 [this.type]: true,
-            }, role: "option", "aria-selected": this.selected ? 'true' : 'false', "aria-disabled": this.state === 'disabled' ? 'true' : 'false' }, h("div", { key: 'a7d45fbf64fbd92928a289e3720353930ce429f3', class: "content" }, this.type === 'icon_leading' && (h("svg", { key: '93f50746397beb707d2fbfd78cf6b6a9e7bb72a9', id: "icon", xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '00e596d26045adeeec5f4cf40d6ddf5847473215', d: "M5.48131 12.9013C4.30234 13.6034 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3334 6.32572 18.3334H13.6743C14.9621 18.3334 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6034 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#4B5565", "stroke-width": "1.5" }), h("path", { key: '3630fe731575d12aca9f2d519d95857b7c0e4f8b', d: "M13.75 5.41669C13.75 7.48776 12.0711 9.16669 10 9.16669C7.92893 9.16669 6.25 7.48776 6.25 5.41669C6.25 3.34562 7.92893 1.66669 10 1.66669C12.0711 1.66669 13.75 3.34562 13.75 5.41669Z", stroke: "#4B5565", "stroke-width": "1.5" }))), this.type === 'avatar_leading' && (h("gb-avatar", { key: 'e1e3b687b5ac24b5c2dd0999e28039f901a742cc', class: "avatar-icon", size: "xs", color: this.color, text: true }, h("slot", { key: '5a61104cced529a85ee802029d3eec89aa06549c', name: "initials", slot: "initials" }))), this.type === 'dot_leading' && (h(Fragment, null, this.state === 'default' ? (h("svg", { id: "icon", xmlns: "http://www.w3.org/2000/svg", width: "10px", height: "10px", viewBox: "0 0 10 10", fill: "none" }, h("circle", { cx: "5", cy: "5", r: "4", fill: "#17B26A" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none" }, h("circle", { cx: "5", cy: "5", r: "4", fill: "#EEF2F6" }))))), this.type === 'checkbox' && h("gb-checkbox", { key: '8f488f39b17b23b8bb28fb4fc1bab4143572ae84', class: "checkbox", size: "md", type: "checkbox", state: this.state, checked: this.selected }), h("slot", { key: '7789dfeaf1773e0da48c96d5d3ed4be7545b3e42', name: "name" }), this.supportingText && (h("span", { key: '55a2959ab38ca47f94625f2e63846f94f8a13467' }, h("slot", { key: 'a73b39dcf6be4eb8e2dbb2454e1763018187f24a', name: "supporting_text" })))), this.selected && this.type !== 'checkbox' && (h("div", { key: '6eb032747fb0a22822cc5a8523933c4c4d503072', class: `tick` }, this.state !== 'disabled' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `tick ${this.state}` }, h("path", { d: "M4.16669 12.0834C4.16669 12.0834 5.41669 12.0834 7.08335 15C7.08335 15 11.7157 7.36115 15.8334 5.83337", stroke: "#075DB2", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { d: "M4.16669 12.0834C4.16669 12.0834 5.41669 12.0834 7.08335 15C7.08335 15 11.7157 7.36115 15.8334 5.83337", stroke: "#CDD5DF", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))));
+            }, role: "option", "aria-selected": this.selected ? 'true' : 'false', "aria-disabled": this.state === 'disabled' ? 'true' : 'false' }, h("div", { key: '53770184654221e6fc46fd9a6a7fb2c82ce6f6ae', class: "content" }, this.type === 'icon_leading' && (h("svg", { key: 'b5fca9edcee5f586a5df54f9d9522572903852d8', id: "icon", xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'fa3516d1a8462925c7ae08d2383046be729269be', d: "M5.48131 12.9013C4.30234 13.6034 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3334 6.32572 18.3334H13.6743C14.9621 18.3334 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6034 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#4B5565", "stroke-width": "1.5" }), h("path", { key: '18957d4de044f10617d8b60a974a3244f2f52f74', d: "M13.75 5.41669C13.75 7.48776 12.0711 9.16669 10 9.16669C7.92893 9.16669 6.25 7.48776 6.25 5.41669C6.25 3.34562 7.92893 1.66669 10 1.66669C12.0711 1.66669 13.75 3.34562 13.75 5.41669Z", stroke: "#4B5565", "stroke-width": "1.5" }))), this.type === 'avatar_leading' && (h("gb-avatar", { key: '83125e9735581fd521051ee8847ecd30bc82dfe7', class: "avatar-icon", size: "xs", color: this.color, text: true }, h("slot", { key: '336b608b83efb239153628e5434d192d4c73b3f5', name: "initials", slot: "initials" }))), this.type === 'dot_leading' && (h(Fragment, null, this.state === 'default' ? (h("svg", { id: "icon", xmlns: "http://www.w3.org/2000/svg", width: "10px", height: "10px", viewBox: "0 0 10 10", fill: "none" }, h("circle", { cx: "5", cy: "5", r: "4", fill: "#17B26A" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none" }, h("circle", { cx: "5", cy: "5", r: "4", fill: "#EEF2F6" }))))), this.type === 'checkbox' && h("gb-checkbox", { key: '68614505f4abaa77eef2ce2aaf63aa75f1773262', class: "checkbox", size: "md", type: "checkbox", state: this.state, checked: this.selected }), h("slot", { key: '0be9673e29b994e5d7225750d24d0a3dbc31e0b1', name: "name" }), this.supportingText && (h("span", { key: '973b421e0846f1bf75832b27793894366a2b9a8b' }, h("slot", { key: 'e80691a1f0a5ed33884dc82e3daea2ede803fb2f', name: "supporting_text" })))), this.selected && this.type !== 'checkbox' && (h("div", { key: 'b5bd7421dca7cffc84f1f6b5f3d4c01c74f4b3b0', class: `tick` }, this.state !== 'disabled' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `tick ${this.state}` }, h("path", { d: "M4.16669 12.0834C4.16669 12.0834 5.41669 12.0834 7.08335 15C7.08335 15 11.7157 7.36115 15.8334 5.83337", stroke: "#075DB2", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { d: "M4.16669 12.0834C4.16669 12.0834 5.41669 12.0834 7.08335 15C7.08335 15 11.7157 7.36115 15.8334 5.83337", stroke: "#CDD5DF", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))));
     }
     static get is() { return "gb-input-dropdown-menu-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-input-field/gb-input-field.js CHANGED Viewed

@@ -102,21 +102,21 @@ export class GbInputField {
         document.removeEventListener('click', this.handleClickOutside);
     }
     render() {
-        return (h("div", { key: '589179d7f676c2dc6708d80849e82d49eae06fe7', class: `input_container` }, h("div", { key: '928e39082068c5e28f818915cbde4ecddf8e7f33', class: `input_with_label` }, this.showLabel && h("p", { key: 'e4e58e4770ed5574c8bdd6e31f8abd1b51281158', class: "label text-sm-medium" }, this.label.charAt(0).toUpperCase() + this.label.slice(1).toLowerCase()), this.type === 'default' && [
-            h("div", { key: '8c89946d7aa50e59c00b4ecc78ed1cca6a676da4', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("input", { key: '71f1406e648e7a1339b6ff2ded9a27c36a427ff4', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), h(Fragment, null, this.showValidation && (h("svg", { key: 'ad21ef93384801313f1f3efc24e9c8b8bef72fc4', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: "tick" }, h("path", { key: '0bae70238418144e38bf4d96ee8eb72dcd58203b', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: '623ef7f3980d093691eaf486ab6d542ace589097', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))),
+        return (h("div", { key: '9c3eea3741615c486bfe7b15099531f27b1a0c8d', class: `input_container` }, h("div", { key: 'b67842268bf88493c5d60574133319ef8ef1426b', class: `input_with_label` }, this.showLabel && h("p", { key: '185e6cb1e200c8ae1a428c15a1052a839bea7286', class: "label text-sm-medium" }, this.label.charAt(0).toUpperCase() + this.label.slice(1).toLowerCase()), this.type === 'default' && [
+            h("div", { key: '9a7290654f226a7308fdcb87cf6ac984529fac59', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("input", { key: 'ceaa9072c23eb6c41fda373d7990fc5745421feb', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), h(Fragment, null, this.showValidation && (h("svg", { key: 'feaa3e129dec5b2fec8d8d2f0f9ae0442d580021', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: "tick" }, h("path", { key: '3268f74179dc60828d7474d6405122af5fadd18c', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: '206b9e2325a677af49a3904bb3b169762a525d74', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))),
         ], this.type === 'icon_leading' && [
-            h("div", { key: 'f3953feaeca307fb388ea110492c1f92680406fa', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: '6935413cc08468ab7f2796a8b9a3587aabce06cf', class: `icon ${this.size} ${this.state}`, innerHTML: this.leadingIconSvg }), h("input", { key: '56a183d4b46ea79cd0f086d5aab159c182217f8a', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event), ref: el => (this.inputRef = el) }), h(Fragment, null, this.showValidation && !this.destructive && (h("svg", { key: 'b635349aa84d58c106c9994b435755737d705fb7', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: "tick" }, h("path", { key: 'e36779668666e2c2ee0429d7cc042e7d522eb679', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: '675c1a097e5185bc7f326c2d65c906ed4826560f', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), this.showCloseButton && !this.destructive && (h("gb-button", { key: '738c0cdd53d5a9198a5eb06a8390b31db6740fc1', size: "sm", hierarchy: "tertiary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/cancel-01.svg", onClick: () => this.clearInput() })))),
+            h("div", { key: '2c41ca2429cbeb62bfc8269a225fe26e57ecd727', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: '1f8741422a8e3929110141843918d5b11c94f5b2', class: `icon ${this.size} ${this.state}`, innerHTML: this.leadingIconSvg }), h("input", { key: '1c41f3d6d4f7000c76556db689e92c1e5fe3a2e8', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event), ref: el => (this.inputRef = el) }), h(Fragment, null, this.showValidation && !this.destructive && (h("svg", { key: '4fbf0fd635541aff28365ba99f43c847cf1187bd', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: "tick" }, h("path", { key: 'bea22dd8ed6ae6a4cbf6df2c578f692a7aedcc46', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: '80dbe8e0a5b1cc8f83ae9f7fe38aadc645f389d4', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), this.showCloseButton && !this.destructive && (h("gb-button", { key: '21a8b2a7d12ebbf7a1fccf1370ce53db5a6fe81f', size: "sm", hierarchy: "tertiary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/cancel-01.svg", onClick: () => this.clearInput() })))),
         ], this.type === 'leading_dropdown' && [
-            h("div", { key: 'b15f356f3e7e87273687f9c5f065a49ba9db1fc0', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: 'c0c6b0a273daa5419e071d4a6ab954f95964f0d9', class: `leading_dropdown_dropdown`, onClick: () => (this.showDropdown = !this.showDropdown) }, h("div", { key: 'c55e73adbb4de53cc6ea53d65123fd810a4b63c9', class: `country_icon` }, h("img", { key: '161a848bb41d3864b5c48980ee7790ef00621375', src: "build/assets/NG.svg", alt: "" })), h("div", { key: '7a05b7619c3e9d65ea850ec89a964cdc5d28d8a4', class: `dropdown_text` }, h("p", { key: 'd1c4427423c5003a1acb9ec97a115924c73e1952', class: "text-md-regular", style: { color: 'var(--color-text, #4B5565)' } }, this.selectedItem)), h("div", { key: 'ce5590652fd2d7bf122ff81cb2a6e11e39b16b73', class: `dropdown_arrow` }, h("svg", { key: '959d1694cc9649aea55a3bd05c07653319e2d588', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'f58cda80f7487152532cc722ba623a3d9de5f18b', d: "M15 7.50004C15 7.50004 11.3176 12.5 9.99996 12.5C8.68237 12.5 5 7.5 5 7.5", stroke: "#4B5565", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("div", { key: '774c825c58659e21455feac964c5b1e7786ee225', class: `leading_dropdown_text_input` }, h("input", { key: '7d1b483b379d960d41e2cbea2d33585c22b2f551', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), this.showValidation && !this.destructive && (h("svg", { key: '520642bd026ea8eadd908a91e93d07e5f45bab83', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'b7257c57318cc27945d6382fe910fa207bebd113', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: '867f490ab4cdda00c4ecea3c6b1164a6acd9d4e8', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))),
-            h(Fragment, null, this.showDropdown && (h("div", { key: 'fab68e9eb41c1d484d7688829fba8f88269f8881', class: `dropdown_menu ${this.type} ${this.size}`, ref: el => (this.dropdownRef = el) }, this.options.map(option => (h("gb-input-dropdown-menu-item", { type: "default", state: StateEnum.Default, selected: this.isItemSelected(option), onClick: () => this.handleItemSelect(option) }, h("p", { slot: "name" }, option))))))),
+            h("div", { key: '171a205b9c1ee53505f1730ee746e4df85c33759', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: 'c67ce8040cd53d0f1eff9aa41fe682e165d18a2a', class: `leading_dropdown_dropdown`, onClick: () => (this.showDropdown = !this.showDropdown) }, h("div", { key: 'facdf05a1c8ef42decfee229d465d6118cfd508c', class: `country_icon` }, h("img", { key: '0fc70b3953614736e41b89ed4d586536e1290e5d', src: "build/assets/NG.svg", alt: "" })), h("div", { key: 'f3b5aeaf6a5388ad145cc5e8537758f322dc3a0a', class: `dropdown_text` }, h("p", { key: 'e22137eeba7110fdfd4557c6e9afaf62d5bf95b7', class: "text-md-regular", style: { color: 'var(--color-text, #4B5565)' } }, this.selectedItem)), h("div", { key: 'a88fb80d52d83d5569f8825e90adcd8a2cfd428b', class: `dropdown_arrow` }, h("svg", { key: '156a22215d7d7f54dd0d31bb2441dcee8a91f694', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'd951c3a1c099f0ceba06ae52844ed169662bb1dd', d: "M15 7.50004C15 7.50004 11.3176 12.5 9.99996 12.5C8.68237 12.5 5 7.5 5 7.5", stroke: "#4B5565", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("div", { key: 'bbbee7e97555d01d3cef484d11689f5bfbbdf176', class: `leading_dropdown_text_input` }, h("input", { key: 'cb52e997d71bd1b55ac85847604bfb47745f00c0', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), this.showValidation && !this.destructive && (h("svg", { key: '6eed156691e1c4b5f04a596a76ff90fee01ca4f9', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'c863a2b56ebe7a6e0098c867af59f263c0799ba1', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: '4ee54ba1694c6b8fb8a118cd43fcc40de66450ca', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))),
+            h(Fragment, null, this.showDropdown && (h("div", { key: 'b4eac887f00816e0107efba4f24da2a632b0cd85', class: `dropdown_menu ${this.type} ${this.size}`, ref: el => (this.dropdownRef = el) }, this.options.map(option => (h("gb-input-dropdown-menu-item", { type: "default", state: StateEnum.Default, selected: this.isItemSelected(option), onClick: () => this.handleItemSelect(option) }, h("p", { slot: "name" }, option))))))),
         ], this.type === 'trailing_dropdown' && [
-            h("div", { key: '65103fcba27ff04b6ceb755d6ccba48b94ffa92f', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: '580c1cea2a77ad3739d9bcdbf8e4e589574d0b57', class: `trailing_dropdown_content` }, h("p", { key: 'e08b5239c25cd55e2fd3894eb3db6d549e903418', class: "text-md-regular", style: { color: 'var(--color-text, #4B5565)' } }, "$"), h("input", { key: 'de2c10dc04cfe5eeb02d9bcfc73f3d64d92b593a', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), this.showHelpIcon && (h("div", { key: 'c0a1e40469b567c2eac1de19aeb4bb7b50195f34', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), h("div", { key: '27a16a76ae506fb1206acac9cf694aa638d14065', class: `trailing_dropdown_dropdown`, onClick: () => (this.showDropdown = !this.showDropdown) }, h("div", { key: 'f15426870e4c0b6625ccdf00808de41195c2a7ea', class: `dropdown_text` }, h("p", { key: 'ed5c85c14a443e2bfc633370f7da1b5cab2b52c0', class: "text-md-regular", style: { color: 'var(--color-text, #4B5565)' } }, this.selectedItem)), h("div", { key: 'a02e22e155ca55aa2229d6b704a0d4815ae7fed1', class: `dropdown_arrow` }, h("svg", { key: '9efdb969557df0efbcb60e05d79263a0a80733a3', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '0d63e5bad326266fa6cc718293644f13a7eb2039', d: "M15 7.50004C15 7.50004 11.3176 12.5 9.99996 12.5C8.68237 12.5 5 7.5 5 7.5", stroke: "#4B5565", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" }))))),
-            h(Fragment, null, this.showDropdown && (h("div", { key: 'ea02544608f72f09ec3d92795ecdb1e351712be9', class: `dropdown_menu ${this.type} ${this.size}`, ref: el => (this.dropdownRef = el) }, this.options.map(option => (h("gb-input-dropdown-menu-item", { type: "default", state: StateEnum.Default, selected: this.isItemSelected(option), onClick: () => this.handleItemSelect(option) }, h("p", { slot: "name" }, option))))))),
+            h("div", { key: '2f1681baa734466386afb45acab58bcc44622f94', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: '51b6b1a67d30000b7dbc4b996a16a44f8cf31f2a', class: `trailing_dropdown_content` }, h("p", { key: '2db2da2c44a6cdca02a76f9ef787ce3291f6c10d', class: "text-md-regular", style: { color: 'var(--color-text, #4B5565)' } }, "$"), h("input", { key: '4ee10a1af613789f35536acb05e8992907bf41fc', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), this.showHelpIcon && (h("div", { key: '6e7cde3b181de63ef39dd926a317531a7a9f7c68', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), h("div", { key: '35cf72526f1a5d96509cc3f2afd54372090627e0', class: `trailing_dropdown_dropdown`, onClick: () => (this.showDropdown = !this.showDropdown) }, h("div", { key: '8d351ae90786adbca00ecf5467acd8b7aa934398', class: `dropdown_text` }, h("p", { key: '6e0dda13bf1a86194168ab45f362a0f0210d8005', class: "text-md-regular", style: { color: 'var(--color-text, #4B5565)' } }, this.selectedItem)), h("div", { key: '3e863f04aa6bb002705f3c304f20fd75200be556', class: `dropdown_arrow` }, h("svg", { key: 'f58d96c91e7f997e2596d8ae8500fa318993c27d', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '4919d2f6f7c39dee118f674cb5724fc55ad39e97', d: "M15 7.50004C15 7.50004 11.3176 12.5 9.99996 12.5C8.68237 12.5 5 7.5 5 7.5", stroke: "#4B5565", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" }))))),
+            h(Fragment, null, this.showDropdown && (h("div", { key: 'e09a737e2d0a124bcf61b420d19a1184ceada00c', class: `dropdown_menu ${this.type} ${this.size}`, ref: el => (this.dropdownRef = el) }, this.options.map(option => (h("gb-input-dropdown-menu-item", { type: "default", state: StateEnum.Default, selected: this.isItemSelected(option), onClick: () => this.handleItemSelect(option) }, h("p", { slot: "name" }, option))))))),
         ], this.type === 'leading_text' && [
-            h("div", { key: '55e9e9bf46e730d1035e18b8d61895590dd91c6f', class: "leading_text_input" }, h("div", { key: 'ee9d149cee752a3d04c134d047da7d8dd86fe6ac', class: `add_on` }, h("p", { key: '6b4cb7d937fb3117fe97af0cd12f19fe6c156144', class: `text-md-regular`, style: { color: this.state === 'disabled' ? 'var(--color-text-disabled, #CDD5DF)' : 'var(--color-text, #4B5565)' } }, "http://")), h("div", { key: '2c3554e72ffa664e2f7d1320a3bb217e965cd4f4', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("input", { key: '54deef466eddf5af9e31c2a84758c1befb837b63', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), this.showValidation && !this.destructive && (h("svg", { key: 'a676c5dbd329520e01c81f798248aba5f7d1f0d2', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'ff9469369c15182841b1c3bb2b5ffc08248ecf02', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: 'fb0dfc46049be5952e6a459c2ddd3feef5152fe9', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))),
-        ], this.type === 'payment_input' && (h("div", { key: '2f0b661a4773feba3c091f7aa213bdc9620837fd', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("svg", { key: '58e8e570efbd836c93ee6dc6416c642131cccc69', xmlns: "http://www.w3.org/2000/svg", width: "23", height: "14", viewBox: "0 0 23 14", fill: "none" }, h("path", { key: 'e1460961412a96bcd6bcd4e3ed0bc4b571a04f09', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.179 11.8294C9.99493 12.8275 8.45902 13.43 6.78069 13.43C3.03582 13.43 0 10.4303 0 6.72997C0 3.02966 3.03582 0.0299683 6.78069 0.0299683C8.45902 0.0299683 9.99493 0.632466 11.179 1.63051C12.363 0.632466 13.8989 0.0299683 15.5773 0.0299683C19.3221 0.0299683 22.358 3.02966 22.358 6.72997C22.358 10.4303 19.3221 13.43 15.5773 13.43C13.8989 13.43 12.363 12.8275 11.179 11.8294Z", fill: "#ED0006" }), h("path", { key: '6b8b3399b39cac49da24ec502318b0af0b643f51', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.179 11.8294C12.6369 10.6005 13.5614 8.77192 13.5614 6.72997C13.5614 4.68801 12.6369 2.85941 11.179 1.63051C12.363 0.632465 13.8989 0.0299683 15.5772 0.0299683C19.3221 0.0299683 22.3579 3.02966 22.3579 6.72997C22.3579 10.4303 19.3221 13.43 15.5772 13.43C13.8989 13.43 12.363 12.8275 11.179 11.8294Z", fill: "#F9A000" }), h("path", { key: 'b5a355549db49f3aa1edf9208db77ac8f9c2ef23', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.179 11.8294C12.6369 10.6005 13.5614 8.77193 13.5614 6.72999C13.5614 4.68805 12.6369 2.85946 11.179 1.63055C9.72109 2.85946 8.79663 4.68805 8.79663 6.72999C8.79663 8.77193 9.72109 10.6005 11.179 11.8294Z", fill: "#FF5E00" })), h("input", { key: '79d90631bdfdb617848fd06b5a992310d60cbe71', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), h(Fragment, null, this.showValidation && !this.destructive && (h("svg", { key: 'e984f7be384bf68c6d9138e0889d2e7a8974d08a', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '32c54a7fb8c8df66490ae426eedb191956778121', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: '68ab65c1756f3a0e214e46b4d863ad8faa885896', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" })))))))), this.type === 'trailing_button' && (h("div", { key: 'ae2b653e37ee157dc0e450eb71a37b47804aaa6a', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: 'fb3273fec17e3d9a2353db26d115d5c231ddcaaf', class: `trailing_button_text_input ${this.size}` }, h("input", { key: '1f3e14066cf4cf496e71d51ade5b51c7e971b264', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event), ref: el => (this.inputRef = el) }), this.showValidation && !this.destructive && (h("svg", { key: 'b45f9479bab1faa36b2632f971b5976f132ec745', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '911c521e5c71e6a6c62fa6bcd07067bf617265b6', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: '08f4f5e7f2d6845851f993fc1a3d3e88a7b8c4c3', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), h("gb-button", { key: '720e6864de64ab70cf41e0024f7b702e4d67cbbc', size: "lg", hierarchy: "tertiary_gray", icon: "only", state: this.state === 'disabled' ? 'disabled' : 'default', "icon-leading": true, "icon-leading-swap": "assets/copy-01.svg", onClick: () => this.copyToClipboard() }))), this.type === 'password' && (h("div", { key: '0230c2cd12de29b98247e5635c098c9555bc93c7', class: `password_input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: '0b19acd72dc5ec8266345c88f60fb6f82c3275d8', class: `password_content` }, h("input", { key: '0f7bc43490b22ca945de707eaf7d557d2d1680fb', class: `content text-md-regular ${this.type} ${this.state}`, type: this.isPasswordVisible ? 'text' : 'password', placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), this.showValidation && !this.destructive && (h("svg", { key: 'b575c00a650958a75266b3d0d03e4097f7ff1116', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'ed0721beffb9550481982dec94d6af52ee7b1c0f', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: 'ec0fbb1cf3022375d52a4a48fb37bea1a3d315d0', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), h("div", { key: 'cddd112503bc5d56fd4e3bef29651f6e9b813d07', class: `dropdown` }, h("gb-password-button", { key: '4d4fa4e15640d0b707af6cd264525830fc54e512', onClick: () => this.togglePasswordVisibility() })))), this.type === 'password_icon_leading' && (h("div", { key: 'fa2e2085d43ab259e3d51413abbf7983078ffe85', class: `password_icon_leading_input input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: '98763251f5340c3a48272ca79fc406ff03aaaddb', class: `password_icon_leading_content` }, h("svg", { key: 'f07d223980b9cf87f8117870298b9cc4e4ede739', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '0b3a47243211ca0d449623ff99f7a99303c2782b', d: "M12.0759 12.1667C11.6617 12.1667 11.3259 12.5025 11.3259 12.9167C11.3259 13.3309 11.6617 13.6667 12.0759 13.6667V12.1667ZM12.0833 13.6667C12.4976 13.6667 12.8333 13.3309 12.8333 12.9167C12.8333 12.5025 12.4976 12.1667 12.0833 12.1667V13.6667ZM7.91668 12.1667C7.50246 12.1667 7.16668 12.5025 7.16668 12.9167C7.16668 13.3309 7.50246 13.6667 7.91668 13.6667V12.1667ZM7.92415 13.6667C8.33836 13.6667 8.67415 13.3309 8.67415 12.9167C8.67415 12.5025 8.33836 12.1667 7.92415 12.1667V13.6667ZM16.4435 10.1294L17.1868 10.0293L16.4435 10.1294ZM13.7003 7.58258L13.7347 6.83337L13.7003 7.58258ZM13.7003 18.2508L13.7347 19L13.7003 18.2508ZM16.4435 15.704L15.7002 15.6039L16.4435 15.704ZM6.29973 7.58258L6.33417 8.33179L6.29973 7.58258ZM3.55652 10.1294L2.81323 10.0293L3.55652 10.1294ZM6.29973 18.2508L6.33417 17.5015L6.29973 18.2508ZM3.55652 15.704L4.29981 15.6039L3.55652 15.704ZM5.50001 7.5C5.50001 7.91422 5.8358 8.25 6.25001 8.25C6.66422 8.25 7.00001 7.91422 7.00001 7.5H5.50001ZM13 7.5C13 7.91422 13.3358 8.25 13.75 8.25C14.1642 8.25 14.5 7.91422 14.5 7.5H13ZM12.0759 13.6667H12.0833V12.1667H12.0759V13.6667ZM7.91668 13.6667H7.92415V12.1667H7.91668V13.6667ZM10 17.5833C8.69057 17.5833 7.50287 17.5553 6.33417 17.5015L6.26528 19C7.45761 19.0548 8.66829 19.0833 10 19.0833V17.5833ZM13.6659 17.5015C12.4972 17.5553 11.3094 17.5833 10 17.5833V19.0833C11.3317 19.0833 12.5424 19.0548 13.7347 19L13.6659 17.5015ZM17.1868 15.804C17.3105 14.8853 17.4167 13.9152 17.4167 12.9167H15.9167C15.9167 13.8142 15.8211 14.7058 15.7002 15.6039L17.1868 15.804ZM17.4167 12.9167C17.4167 11.9181 17.3105 10.948 17.1868 10.0293L15.7002 10.2295C15.8211 11.1275 15.9167 12.0192 15.9167 12.9167H17.4167ZM10 8.25C11.3095 8.25 12.4972 8.27806 13.6659 8.33179L13.7347 6.83337C12.5424 6.77856 11.3317 6.75 10 6.75V8.25ZM6.33417 8.33179C7.50287 8.27806 8.69057 8.25 10 8.25V6.75C8.66829 6.75 7.45761 6.77856 6.26528 6.83337L6.33417 8.33179ZM2.81323 10.0293C2.68953 10.948 2.58334 11.9181 2.58334 12.9167H4.08334C4.08334 12.0192 4.1789 11.1275 4.29981 10.2295L2.81323 10.0293ZM2.58334 12.9167C2.58334 13.9152 2.68953 14.8853 2.81323 15.804L4.29981 15.6039C4.1789 14.7058 4.08334 13.8142 4.08334 12.9167H2.58334ZM17.1868 10.0293C16.9527 8.29067 15.5122 6.91509 13.7347 6.83337L13.6659 8.33179C14.6943 8.37907 15.5595 9.18437 15.7002 10.2295L17.1868 10.0293ZM13.7347 19C15.5122 18.9183 16.9527 17.5427 17.1868 15.804L15.7002 15.6039C15.5595 16.649 14.6943 17.4543 13.6659 17.5015L13.7347 19ZM6.26528 6.83337C4.48781 6.91508 3.04732 8.29067 2.81323 10.0293L4.29981 10.2295C4.44052 9.18437 5.30576 8.37907 6.33417 8.33179L6.26528 6.83337ZM6.33417 17.5015C5.30576 17.4543 4.44052 16.649 4.29981 15.6039L2.81323 15.804C3.04732 17.5427 4.48782 18.9183 6.26528 19L6.33417 17.5015ZM7.00001 7.5V5.41667H5.50001V7.5H7.00001ZM13 5.41667V7.5H14.5V5.41667H13ZM10 2.41667C11.6569 2.41667 13 3.75981 13 5.41667H14.5C14.5 2.93139 12.4853 0.916668 10 0.916668V2.41667ZM7.00001 5.41667C7.00001 3.75981 8.34316 2.41667 10 2.41667V0.916668C7.51473 0.916668 5.50001 2.93139 5.50001 5.41667H7.00001Z", fill: "#4B5565" })), h("input", { key: 'f09694d90277a05f5d45470946d390f05ac6db23', class: `content text-md-regular ${this.type} ${this.state}`, type: this.isPasswordVisible ? 'text' : 'password', placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) })), this.showValidation && !this.destructive && (h("svg", { key: '5f082c799174412c3c179e91c75a7fbcc3c38db6', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'de470d828c4f7f3936b0755eb8f35e3e63e267fc', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: 'c853fc54646f0259b3274f1c4f4df01a152e0fa2', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), h("gb-password-button", { key: '48493479d2eb2eafdb66e40814b74c4da51b111d', onClick: () => this.togglePasswordVisibility() }))), this.type === 'count' && [
-            h("div", { key: '25754ab18d869a3d55c0eaf840e74d8784bf7b4c', class: `count_input` }, h("div", { key: 'e1b61c17a86f47416e49ee57c35185e23cd041cf', class: `count_text_input ${this.destructive ? 'destructive' : ''} ${this.state}` }, h("input", { key: 'cf70897f59eac03bd90266d90623455f310948f0', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), this.showHelpIcon && (h("div", { key: 'e7f956f17dc3195cc0a25e3074ca9e6bcf617729', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), h("div", { key: 'd454f0da78f79ab3ebf5d3bb98edcf68a34ffb14', class: `action ${this.state}` }, h("gb-button", { key: '5edd08fd253cbec7ae151e5f44bebb16f7d628e8', size: "xl", state: this.state === 'disabled' ? 'disabled' : 'default', hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/minus_sign.svg" }), h("hr", { key: 'c27a313c63ec530400ba2cf7514232ab78230dbb' }), h("gb-button", { key: 'f7efe6886ceaed846760511607736efbea6fface', size: "xl", state: this.state === 'disabled' ? 'disabled' : 'default', hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/plus_sign.svg" }))),
-        ], this.type === 'tags' && (h("div", { key: 'e8b18752ff0b777b9d807f0256cb0170f79c55c8', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: 'ba9698ae1413ea62ac3f280d6950b9f05c7b71ca', class: `tags_display` }), h("input", { key: '472522d50e8c361b2c82b44c154d7deb485f47f0', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) })))), this.showHintText && h("p", { key: '920623153c8508120ec1b015987c1081ca99520c', class: "hint_text text-sm-regular" }, this.hintText)));
+            h("div", { key: '2243098a8fca1c8a5fee0afc948f9343cb33222f', class: "leading_text_input" }, h("div", { key: 'a22955dc085ca5f34ddedb8a70336a3545c830db', class: `add_on` }, h("p", { key: 'dc645e50829b0c753a2a3269ffa7a0b2b01d30f7', class: `text-md-regular`, style: { color: this.state === 'disabled' ? 'var(--color-text-disabled, #CDD5DF)' : 'var(--color-text, #4B5565)' } }, "http://")), h("div", { key: '44f003871d5d56083d2dc94689cc13de9a19971d', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("input", { key: 'e7a1809b625a2faafa47e0988563e0eb566f58cf', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), this.showValidation && !this.destructive && (h("svg", { key: 'c626bd2d121d4f528dc6b07d3ded24d920c12868', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '8a2ba783ff47fa557e611b39fdb3060e55cfa559', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: 'c50062e9bc38516b47099d53a2a341ed5ec1ebf3', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))))),
+        ], this.type === 'payment_input' && (h("div", { key: '8a998dbeed2c704a72014313cc4d6b520427ae7d', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("svg", { key: 'bfbfc6ca005a4c57b63dd5cf05e7c731df7dbd2b', xmlns: "http://www.w3.org/2000/svg", width: "23", height: "14", viewBox: "0 0 23 14", fill: "none" }, h("path", { key: '9438026f5a9f4bc88a9621d02f28be2b013a4abe', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.179 11.8294C9.99493 12.8275 8.45902 13.43 6.78069 13.43C3.03582 13.43 0 10.4303 0 6.72997C0 3.02966 3.03582 0.0299683 6.78069 0.0299683C8.45902 0.0299683 9.99493 0.632466 11.179 1.63051C12.363 0.632466 13.8989 0.0299683 15.5773 0.0299683C19.3221 0.0299683 22.358 3.02966 22.358 6.72997C22.358 10.4303 19.3221 13.43 15.5773 13.43C13.8989 13.43 12.363 12.8275 11.179 11.8294Z", fill: "#ED0006" }), h("path", { key: '393ad7fd4bdb9e881d8c987775db43b43986dc3a', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.179 11.8294C12.6369 10.6005 13.5614 8.77192 13.5614 6.72997C13.5614 4.68801 12.6369 2.85941 11.179 1.63051C12.363 0.632465 13.8989 0.0299683 15.5772 0.0299683C19.3221 0.0299683 22.3579 3.02966 22.3579 6.72997C22.3579 10.4303 19.3221 13.43 15.5772 13.43C13.8989 13.43 12.363 12.8275 11.179 11.8294Z", fill: "#F9A000" }), h("path", { key: '701c74014cb6539b84852a1d79f8dcb7ea4e8d8f', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.179 11.8294C12.6369 10.6005 13.5614 8.77193 13.5614 6.72999C13.5614 4.68805 12.6369 2.85946 11.179 1.63055C9.72109 2.85946 8.79663 4.68805 8.79663 6.72999C8.79663 8.77193 9.72109 10.6005 11.179 11.8294Z", fill: "#FF5E00" })), h("input", { key: '4726ca4ac15d1d09aa8d051af82d7a0f7d609377', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), h(Fragment, null, this.showValidation && !this.destructive && (h("svg", { key: '9c98aae4c702dabafa5a6cafa7b1f871a981de78', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '9a9ab0639c22126d190346a11a0eae6ba338daba', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: '9d1b4029a2a78488322871c8af17e9a33f31a8b7', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" })))))))), this.type === 'trailing_button' && (h("div", { key: '1f44b5581ffb7eab0a6f301a14cddb8dd6f19cf1', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: '986de799db179d2cb81cd72f1a5bbac58f132d23', class: `trailing_button_text_input ${this.size}` }, h("input", { key: '13098e356502a68d179b742f1e2d6a0a000a233b', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event), ref: el => (this.inputRef = el) }), this.showValidation && !this.destructive && (h("svg", { key: 'd65f86e1ab85f0d62161bcff439b8177be40fa12', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '9a5b1a7feffdca80c38a0e1810bd215ac7f9873e', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: '68c846ac400c9fd08d88316e88f53448bf79f7f3', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), h("gb-button", { key: '5b55bd7438c06911fd596cd89102b5339257a2d4', size: "lg", hierarchy: "tertiary_gray", icon: "only", state: this.state === 'disabled' ? 'disabled' : 'default', "icon-leading": true, "icon-leading-swap": "assets/copy-01.svg", onClick: () => this.copyToClipboard() }))), this.type === 'password' && (h("div", { key: '9c88965d8ca3b56c517a6a8a62599c249d28ff7e', class: `password_input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: '0da01789b892b78f43e319ffe0d1ecca0d6df499', class: `password_content` }, h("input", { key: '141a29382bbd6212cc61ded3b61a7827a9c28fb5', class: `content text-md-regular ${this.type} ${this.state}`, type: this.isPasswordVisible ? 'text' : 'password', placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), this.showValidation && !this.destructive && (h("svg", { key: 'f33cd7122618045e66f4475437ef02bf44a47d65', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'dea12e7dbb70dcf6591d4157c5936912231de1e0', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: '7bc2b8b95aa39ce24b6609ad541e887639dc944c', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), h("div", { key: '84acf397b263de57e48bfb22e6004c489e04c65c', class: `dropdown` }, h("gb-password-button", { key: 'd11bb7c0f2542c5a171893fd790004620d7e4dd6', onClick: () => this.togglePasswordVisibility() })))), this.type === 'password_icon_leading' && (h("div", { key: '65b177e46b96e24c58cbc22923d222ba689a0380', class: `password_icon_leading_input input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: '18eb462cbfb31d2e7319eb9f11c04ddf95d473c9', class: `password_icon_leading_content` }, h("svg", { key: '31c52fe972c7133ca11d6166329bb81fa22fc549', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '31673b4928adb01d3f3b90735ec8f2d61f7f3197', d: "M12.0759 12.1667C11.6617 12.1667 11.3259 12.5025 11.3259 12.9167C11.3259 13.3309 11.6617 13.6667 12.0759 13.6667V12.1667ZM12.0833 13.6667C12.4976 13.6667 12.8333 13.3309 12.8333 12.9167C12.8333 12.5025 12.4976 12.1667 12.0833 12.1667V13.6667ZM7.91668 12.1667C7.50246 12.1667 7.16668 12.5025 7.16668 12.9167C7.16668 13.3309 7.50246 13.6667 7.91668 13.6667V12.1667ZM7.92415 13.6667C8.33836 13.6667 8.67415 13.3309 8.67415 12.9167C8.67415 12.5025 8.33836 12.1667 7.92415 12.1667V13.6667ZM16.4435 10.1294L17.1868 10.0293L16.4435 10.1294ZM13.7003 7.58258L13.7347 6.83337L13.7003 7.58258ZM13.7003 18.2508L13.7347 19L13.7003 18.2508ZM16.4435 15.704L15.7002 15.6039L16.4435 15.704ZM6.29973 7.58258L6.33417 8.33179L6.29973 7.58258ZM3.55652 10.1294L2.81323 10.0293L3.55652 10.1294ZM6.29973 18.2508L6.33417 17.5015L6.29973 18.2508ZM3.55652 15.704L4.29981 15.6039L3.55652 15.704ZM5.50001 7.5C5.50001 7.91422 5.8358 8.25 6.25001 8.25C6.66422 8.25 7.00001 7.91422 7.00001 7.5H5.50001ZM13 7.5C13 7.91422 13.3358 8.25 13.75 8.25C14.1642 8.25 14.5 7.91422 14.5 7.5H13ZM12.0759 13.6667H12.0833V12.1667H12.0759V13.6667ZM7.91668 13.6667H7.92415V12.1667H7.91668V13.6667ZM10 17.5833C8.69057 17.5833 7.50287 17.5553 6.33417 17.5015L6.26528 19C7.45761 19.0548 8.66829 19.0833 10 19.0833V17.5833ZM13.6659 17.5015C12.4972 17.5553 11.3094 17.5833 10 17.5833V19.0833C11.3317 19.0833 12.5424 19.0548 13.7347 19L13.6659 17.5015ZM17.1868 15.804C17.3105 14.8853 17.4167 13.9152 17.4167 12.9167H15.9167C15.9167 13.8142 15.8211 14.7058 15.7002 15.6039L17.1868 15.804ZM17.4167 12.9167C17.4167 11.9181 17.3105 10.948 17.1868 10.0293L15.7002 10.2295C15.8211 11.1275 15.9167 12.0192 15.9167 12.9167H17.4167ZM10 8.25C11.3095 8.25 12.4972 8.27806 13.6659 8.33179L13.7347 6.83337C12.5424 6.77856 11.3317 6.75 10 6.75V8.25ZM6.33417 8.33179C7.50287 8.27806 8.69057 8.25 10 8.25V6.75C8.66829 6.75 7.45761 6.77856 6.26528 6.83337L6.33417 8.33179ZM2.81323 10.0293C2.68953 10.948 2.58334 11.9181 2.58334 12.9167H4.08334C4.08334 12.0192 4.1789 11.1275 4.29981 10.2295L2.81323 10.0293ZM2.58334 12.9167C2.58334 13.9152 2.68953 14.8853 2.81323 15.804L4.29981 15.6039C4.1789 14.7058 4.08334 13.8142 4.08334 12.9167H2.58334ZM17.1868 10.0293C16.9527 8.29067 15.5122 6.91509 13.7347 6.83337L13.6659 8.33179C14.6943 8.37907 15.5595 9.18437 15.7002 10.2295L17.1868 10.0293ZM13.7347 19C15.5122 18.9183 16.9527 17.5427 17.1868 15.804L15.7002 15.6039C15.5595 16.649 14.6943 17.4543 13.6659 17.5015L13.7347 19ZM6.26528 6.83337C4.48781 6.91508 3.04732 8.29067 2.81323 10.0293L4.29981 10.2295C4.44052 9.18437 5.30576 8.37907 6.33417 8.33179L6.26528 6.83337ZM6.33417 17.5015C5.30576 17.4543 4.44052 16.649 4.29981 15.6039L2.81323 15.804C3.04732 17.5427 4.48782 18.9183 6.26528 19L6.33417 17.5015ZM7.00001 7.5V5.41667H5.50001V7.5H7.00001ZM13 5.41667V7.5H14.5V5.41667H13ZM10 2.41667C11.6569 2.41667 13 3.75981 13 5.41667H14.5C14.5 2.93139 12.4853 0.916668 10 0.916668V2.41667ZM7.00001 5.41667C7.00001 3.75981 8.34316 2.41667 10 2.41667V0.916668C7.51473 0.916668 5.50001 2.93139 5.50001 5.41667H7.00001Z", fill: "#4B5565" })), h("input", { key: 'ea43c3234132795cc3940536a97ac22c6278392e', class: `content text-md-regular ${this.type} ${this.state}`, type: this.isPasswordVisible ? 'text' : 'password', placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) })), this.showValidation && !this.destructive && (h("svg", { key: 'a258c801be317c2b459cacc951c87b2f914902f8', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'e270bb0e464c493d2a1631c433fb38e8dfe65a88', d: "M4.16675 12.0833C4.16675 12.0833 5.41675 12.0833 7.08341 15C7.08341 15 11.7158 7.36112 15.8334 5.83334", stroke: "#079455", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.showHelpIcon && (h("div", { key: '81cb6acb8535613a19e860a021f3b261f267eb04', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), h("gb-password-button", { key: '385475300919e69677bccf46d580937aa50b5c9f', onClick: () => this.togglePasswordVisibility() }))), this.type === 'count' && [
+            h("div", { key: '79e21e283ce36392133c9cfd981812e56c30dc49', class: `count_input` }, h("div", { key: '539370f5950aac8ff4f1eb8adcf759405e735d0f', class: `count_text_input ${this.destructive ? 'destructive' : ''} ${this.state}` }, h("input", { key: '348d7c28f8bbe0bf7d405ea0778029dd2ea53545', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) }), this.showHelpIcon && (h("div", { key: '3462cefa08d5213c7d3bef94d76995b5ca167abe', class: `help_circle` }, !this.destructive ? (h("gb-help-tooltip", { "show-supporting-text": true }, h("slot", { name: "tooltip_label", slot: "label" }), h("slot", { name: "tooltip_supporting_text", slot: "supporting_text" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { d: "M7.99458 10H8.00057M7.99992 8.00001V5.33334M14.6666 8.00001C14.6666 11.6819 11.6818 14.6667 7.99992 14.6667C4.31802 14.6667 1.33325 11.6819 1.33325 8.00001C1.33325 4.31811 4.31802 1.33334 7.99992 1.33334C11.6818 1.33334 14.6666 4.31811 14.6666 8.00001Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), h("div", { key: 'aa1bb302c53ca6746ce927e82ee47be31559fc05', class: `action ${this.state}` }, h("gb-button", { key: 'b08d2196a672dbe7fd969093fb683698ae614f59', size: "xl", state: this.state === 'disabled' ? 'disabled' : 'default', hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/minus_sign.svg" }), h("hr", { key: '6bc13bdcfd3df0d3fc16f6fef24d3198cebce628' }), h("gb-button", { key: 'df06e7e3e9a7ece4f91872d30ba1850fb00ddb77', size: "xl", state: this.state === 'disabled' ? 'disabled' : 'default', hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/plus_sign.svg" }))),
+        ], this.type === 'tags' && (h("div", { key: '644cfed6c55babca75d7fddc889a2a0f59caa256', class: `input ${this.type} ${this.size} ${this.state} ${this.destructive ? 'destructive' : ''}` }, h("div", { key: '5af7240eb83ffb591846cce65d28009dd25581ae', class: `tags_display` }), h("input", { key: 'e253aae82d5e9ed154ed3105615115eb5ccda2c5', class: `content text-md-regular ${this.type} ${this.state}`, type: "text", placeholder: this.placeholder ? this.placeholder : '', onInput: event => this.handleInput(event) })))), this.showHintText && h("p", { key: '8d348400e438a0925be442a57788d29fe5804e18', class: "hint_text text-sm-regular" }, this.hintText)));
     }
     static get is() { return "gb-input-field"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-megainput-field-base/gb-megainput-field.js CHANGED Viewed

@@ -16,10 +16,10 @@ export class GbMegaInputField {
         }
     }
     render() {
-        return (h("div", { key: '30337e42a07643ce78fd9f2e5295abbe5de37d74', class: {
+        return (h("div", { key: 'fa75c4df030a353f9356ec6a7d027e4dd5d44bd5', class: {
                 [this.size]: true,
                 disabled: this.state === 'disabled'
-            } }, h("input", { key: 'b2d55cdee54e0500e8d1589b4bf98ea77cc80fde', class: {
+            } }, h("input", { key: '5053849cbc5a7176b997f36f2d0fcd7e6fdf7312', class: {
                 [this.size]: true,
                 disabled: this.state === 'disabled'
             }, type: "number", min: "0", max: "1", placeholder: "0", value: this.inputValue, onInput: (event) => this.handleInput(event) })));

package/dist/collection/components/gb-notification-content/gb-notification-content.css CHANGED Viewed

@@ -2667,16 +2667,16 @@
     align-items: flex-start;
     gap: var(--spacing-2);
     border-radius: var(--rounded-none);
-    border-bottom: 0.6px solid #e3e8ef;
+    border-bottom: 0.6px solid var(--color-border-subtler, #E3E8EF);
 }
 .notification_container:hover {
-    background-color: #E4F0FC;
+    background-color: var(--color-background-information-subtlest, #E4F0FC);
 }
 .icon img {
-    fill: #075DB2;
-    stroke: #075DB2 ;
+    fill: var(--color-icon-selected, #075DB2);
+    stroke: var(--color-icon-selected, #075DB2);
 }
 label{
@@ -2711,7 +2711,7 @@ label{
 .supporting_text {
     padding-left: 28px;
-    color:#4B5565;
+    color:var(--color-text, #4B5565);
     overflow: hidden;
     text-overflow: ellipsis;
 }

package/dist/collection/components/gb-notification-content/gb-notification-content.js CHANGED Viewed

@@ -8,7 +8,7 @@ export class GbNotificationContent {
     }
     render() {
         const iconSrc = getAssetPath(`${this.icon}`);
-        return (h("div", { key: '3d917877f608431a748f56679dddafa8c23c18e5', class: "notification_container" }, h("div", { key: '2eb8e0d25cb6bf15ff567ba466c6121f08b91712', class: "notification_title" }, this.icon && (h("div", { key: '48f403ffa588a7d1ca43fc669454379ddda85e1b', class: "icon" }, h("img", { key: '8c23934353411e5df24b53e5ea95013f2c96fb1a', src: iconSrc, alt: "Icon" }))), h("label", { key: '4eb02d36238dd6d1d200d7ce0dac622cfe88319e' }, this.label), h("span", { key: 'f86defe938f9824ccfcac7e82a082c6b725581f4', class: "time" }, this.time)), h("div", { key: '15818cd9071193b7c9ed1e7e7cf4e88ca779999e', class: "supporting_text" }, h("p", { key: 'f1bf8041404810cd2e42b9a95e52a6e2a661a4af', class: "text-sm-regular" }, this.supportingText))));
+        return (h("div", { key: '653eab29f5a3981479170239baabb521c5425cc5', class: "notification_container" }, h("div", { key: 'cb8d5fbaacd08907764eff6814e2824f6e06192a', class: "notification_title" }, this.icon && (h("div", { key: '88b77ffc28a741543c873a2fe199b972c49df9b5', class: "icon" }, h("img", { key: '32e53da55ac36249b93ab3b24d3d8e65760b6a08', src: iconSrc, alt: "Icon" }))), h("label", { key: '1a036d0b6039bbc8f391c667cfa49d02b5fc547f' }, this.label), h("span", { key: 'b042641af9ed9566292bdcbb7eeed56a559e71f1', class: "time" }, this.time)), h("div", { key: '352c1754f00694fde1070726ef3fdf776954fea5', class: "supporting_text" }, h("p", { key: 'ca7aa60ff04a3f70be094dfbf8354daeffb826e0', class: "text-sm-regular" }, this.supportingText))));
     }
     static get is() { return "gb-notification-content"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-notification-pane/gb-notification-pane.css CHANGED Viewed

@@ -2696,7 +2696,7 @@
 ::-webkit-scrollbar-thumb{
     width: 0.5rem;
     height: 11.75rem;
-    border: 0.25rem solid #FFF;
+    border: 0.25rem solid var(--color-background-card, #FFFFFF);
     border-radius: 0.5rem;
     background: var(--color-border-subtle, #CDD5DF);
 }

package/dist/collection/components/gb-notification-pane/gb-notification-pane.js CHANGED Viewed

@@ -50,10 +50,10 @@ export class GbNotificationPane {
     render() {
         const patternSrc = getAssetPath(`assets/notification_background_pattern.svg`);
         const illustrationSrc = getAssetPath(`assets/notification_illustration.svg`);
-        return (h("div", { key: 'c20a38006614197a653d165ba3851517313faa1b', class: "notification_pane_div" }, this.state === 'empty' && [
-            h("div", { key: 'a1314f0fbfddac4f12849bb72ae4b5c2731fedcd', class: `container` }, h("div", { key: 'd84e02e7e26a90a65fe95211c8bf6d62532dec42', class: "frame" }, h("img", { key: 'ac86e76dfa452a688965e40a5a44db961f8f10b7', src: patternSrc, alt: "", class: "empty_state_pattern" }), h("div", { key: '8576a4731f72c3c7435374bf9ba757efdb664175', class: "empty_state" }, h("div", { key: '4853cf6b975f968840287cb897a628f8e546ee4e', class: "content" }, h("img", { key: 'f13009e8c6836364cfd6d241c6f5ee25891f3aec', src: illustrationSrc, alt: "bell-icon", class: "bell_icon" }), h("div", { key: '81e4251ea7d9505d82cfcb4f5915acc9133a5036', class: "text" }, h("slot", { key: 'e85f8c681e86fa20d31cd61cdb428197b448a866', name: "label" }), h("slot", { key: '32257227ce164371cf79dd0d560adceb960175a9', name: "supporting_text" })))))),
-            h("div", { key: '842a7ce4e940a227dae906b1d35bd138309e87e2', class: `button` }, h("gb-button", { key: '50766c7cafe746260686197d29d80e9f0e696b2e', size: "sm", hierarchy: "tertiary_color", icon: "default", state: "disabled", "icon-leading": true, "icon-leading-swap": "assets/blush_brush.svg" }, h("p", { key: 'd16b0a167602a868ac577ebcdf0baeca5e2b7623' }, "Mark all as read"))),
-        ], this.state === 'notification_dropdown' && (h("div", { key: 'fd4775b20c94a7eee3eb119e387bcfdbb4e70ebe', class: "notification_dropdown" }, h("div", { key: 'cd194dd322a36f1d4a50cd657f952022dec90ffa', class: `content_wrapper` }, this.notifications.map(notification => (h("gb-notification-content", { label: notification.label, time: notification.time, "supporting-text": notification.desc, icon: this.icon })))), h("gb-button", { key: '70af84a1d87b4bb3d3374add17e2f6c57e59fc02', size: "sm", hierarchy: "tertiary_color", icon: "default", "icon-leading": true, "icon-leading-swap": "assets/blush_brush.svg" }, h("p", { key: 'c92d97cd7a32017a250f920ec3e94171be96ac88' }, "Mark all as read"))))));
+        return (h("div", { key: '28ec4b730241290191a0af2deacaa989e1f2851a', class: "notification_pane_div" }, this.state === 'empty' && [
+            h("div", { key: '3a5537eb27212d6ab4a42e49fd25d0c469a062ca', class: `container` }, h("div", { key: '257e50822926de00e665ff9988b56dde4f39df55', class: "frame" }, h("img", { key: '7cf8680e285025b203a970f7485465776f329f8f', src: patternSrc, alt: "", class: "empty_state_pattern" }), h("div", { key: '945896e42a00c9277cadee3f3a66bdc92002a4e2', class: "empty_state" }, h("div", { key: '658c614c36c3cc25769c5403fba7396e80c67b3d', class: "content" }, h("img", { key: '6e418dcf47bb5c60db5d340e82fd0e161a9dbfad', src: illustrationSrc, alt: "bell-icon", class: "bell_icon" }), h("div", { key: '1c45c09cab5c3639e2089cccd06dd32fceec2ea4', class: "text" }, h("slot", { key: 'd9e841a634bee5dd863266196200469498d0b576', name: "label" }), h("slot", { key: '212a4a259b64fa961cb7f4c3f67c9200c9d5f223', name: "supporting_text" })))))),
+            h("div", { key: '422493440cddc7ecb49cca4b013d9c4121bf83dc', class: `button` }, h("gb-button", { key: '340af60b4390891589207f4ec958b4fff70e1398', size: "sm", hierarchy: "tertiary_color", icon: "default", state: "disabled", "icon-leading": true, "icon-leading-swap": "assets/blush_brush.svg" }, h("p", { key: '99c2e431daaf290449335e8fee47f31d2d9891b3' }, "Mark all as read"))),
+        ], this.state === 'notification_dropdown' && (h("div", { key: '98a79b9b719b07fe529b2bcd3a4074c1086d25be', class: "notification_dropdown" }, h("div", { key: 'fc4194b94c05c522e99bfb5170d27f9c26ef81a6', class: `content_wrapper` }, this.notifications.map(notification => (h("gb-notification-content", { label: notification.label, time: notification.time, "supporting-text": notification.desc, icon: this.icon })))), h("gb-button", { key: 'a4537b4cc9c12d471499452706983f71019eb1e5', size: "sm", hierarchy: "tertiary_color", icon: "default", "icon-leading": true, "icon-leading-swap": "assets/blush_brush.svg" }, h("p", { key: '22e38a4faa32157f86e70d020d5a6876fb5ae8bf' }, "Mark all as read"))))));
     }
     static get is() { return "gb-notification-pane"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-pagination/gb-pagination.js CHANGED Viewed

@@ -19,7 +19,7 @@ export class GbPagination {
         }
     }
     render() {
-        return (h("div", { key: '4b6dbc6e1406257b2ca50e7221712b8d6d1989be', class: `pagination_div ${this.type} ${this.breakpoint}` }, this.type === 'page_default' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: '5ef4a71f70f5fe6794d5e670bb82799e53cf0ea0', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, h("p", { key: 'e75b2901b1e2d397bfcba221647c351d765a7a08' }, "Previous")), h("div", { key: '2f0eb2508ed68d4091501a8cce0cc1815e77f62b', class: "pagination_numbers" }, h("gb-pagination-number-base", { key: '56c034828a61d8ec5cb64cc0826d87005bb168f1', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default' }, h("p", { key: 'f0a6daf64cb86d7782229e48cb516e8c72b7d9a0', slot: "page_number" }, "1")), h("gb-pagination-number-base", { key: '63fbfdb43a4c03ae4efdfc237a3440135dd26a15', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default' }, h("p", { key: '25eeaa7c24acefe0bf7097d246fafbbb28f4aa6a', slot: "page_number" }, "2")), h("gb-pagination-number-base", { key: '7f84648e2b2bea5abe4d2428e61d7d9d1a4dec56', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default' }, h("p", { key: '835b7ea63dda17b4a0f6850f1df9ae058a970149', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, h("p", { slot: "page_number" }, this.currentPage))) : null, h("gb-pagination-number-base", { key: '7f0f0568a1c14a81ab51df4c5a23e8b6eab85d63', shape: this.shape }, h("p", { key: '0e55f75e90ec30e82a487f18c3a7e32098d8dfc6', slot: "page_number" }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, h("p", { slot: "page_number" }, this.currentPage))) : null, h("gb-pagination-number-base", { key: '6c441129d49013ffd0a9bc3d0b34f99dca5c5ea9', shape: this.shape, state: this.currentPage === this.totalPages - 2 ? 'active' : 'default' }, h("p", { key: '06ebbd5d049db1a12df1217956bce8cfcfd1dee1', slot: "page_number" }, this.totalPages - 2)), h("gb-pagination-number-base", { key: 'a1e1bcec5215518005cff59d3c38ce1db8986f19', shape: this.shape, state: this.currentPage === this.totalPages - 1 ? 'active' : 'default' }, h("p", { key: '6f2ecbef4d4ac3e29e12cf88c40c203c071bac09', slot: "page_number" }, this.totalPages - 1)), h("gb-pagination-number-base", { key: '27b1302606e6d93b5ed10b0342f68586b5243a4f', shape: this.shape, state: this.currentPage === this.totalPages ? 'active' : 'default' }, h("p", { key: '35ab63a65d1bbcb131ac9c7b664c80f61fc78873', slot: "page_number" }, this.totalPages))), h("gb-button", { key: '59a464f1f513575a2dd0867ce5ef17923b47dfa1', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, h("p", { key: '925fc08ba2f2119c40340f805529ecb41ed55119' }, "Next")))), this.type === 'page_minimal_center_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: '3ee26c6fcf2abda6085f86cc81ad9c204086fe29', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, h("p", { key: 'a322b61641d4c759065db3b202b6a089303e5afa' }, "Previous")), h("div", { key: '67ef29de31d54b2cce710a22db329dc0d661face', class: "pagination_numbers" }, h("gb-pagination-number-base", { key: '2b7167d742fcd57f6d300987d8737b9ca5ff8b27', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default' }, h("p", { key: 'b815d8f65aeba294d6506b8b28fbdd4312b86214', slot: "page_number" }, "1")), h("gb-pagination-number-base", { key: '19d64f9459e187e1eda37d424a4f6001659656bf', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default' }, h("p", { key: '4ce60bd66416fddbce418091f75bc541a1303a0d', slot: "page_number" }, "2")), h("gb-pagination-number-base", { key: '178dc42e7a9a9f8b54ba54b1dd932c502d209539', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default' }, h("p", { key: '314a6f73e183a5106a33bd1389bd76c3832ae400', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, h("p", { slot: "page_number" }, this.currentPage))) : null, h("gb-pagination-number-base", { key: 'e2fb4e0e3f165ff99a60ab369c46fcb325a2067a', shape: this.shape }, h("p", { key: '0256c07881ae537a43c2b9f3e66154c752b7d966', slot: "page_number" }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, h("p", { slot: "page_number" }, this.currentPage))) : null, h("gb-pagination-number-base", { key: '0c57cf379a20a8fde117cacf9069f997b719de5c', shape: this.shape, state: this.currentPage === this.totalPages - 2 ? 'active' : 'default' }, h("p", { key: '45b34d9058c2b14cecc2896b19ba9180a1b363ce', slot: "page_number" }, this.totalPages - 2)), h("gb-pagination-number-base", { key: '5eaf5666c91e74669ceb11884dee1e82d02d465f', shape: this.shape, state: this.currentPage === this.totalPages - 1 ? 'active' : 'default' }, h("p", { key: '6c40c039f5db4f65b0739dc57133040017ce2119', slot: "page_number" }, this.totalPages - 1)), h("gb-pagination-number-base", { key: 'ed1e4cc47f91125e45616636bba31a07b8587f5f', shape: this.shape, state: this.currentPage === this.totalPages ? 'active' : 'default' }, h("p", { key: '849c0b8f5cc64b58ec9bd8c961b27bec36c99766', slot: "page_number" }, this.totalPages))), h("gb-button", { key: 'f5d64626c9b8e7ab92cc37eee6aa2cb29f4dec95', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, h("p", { key: '5423e861328ce7d747e6592ae9138bea70fc469e' }, "Next")))), this.type === 'card_default' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: 'b5e2a14be249c87c5704716bf86031a0839acfe7', class: "entries" }, h("div", { key: 'dd34bea503058172e1565be9080f3e1ca060a572', class: "entries_text" }, h("p", { key: '287650835321b151b86ba579115cc8586afa144f', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), h("div", { key: 'fb86d92bbea71f1e57cf2ae3b66d4c30132684b9', class: `entries_dropdown` }, h("gb-input-dropdown", { key: 'cd5f544c9fc8e208dd96a70a8a512947fecbfe36', type: "default", state: "default", size: "sm", "show-label": false, "show-hint-text": false, "show-supporting-text": false, "show-hep-icon": false, items: [5, 10, 20, 50, 80], "menu-position": "top" }))), h("div", { key: '0d6c10f355b01847a70acd04fe0590c90e6d2de1', class: "pagination_numbers" }, h("gb-pagination-number-base", { key: '46d6d7ff12fad70c98498c28b9f5913e10bd666e', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, h("p", { key: 'b07267512e1b2d0e1e06a4b514fe9c520b5afe39', slot: "page_number" }, "1")), h("gb-pagination-number-base", { key: 'e672d3f5b2f9b3a455fc9011032b2c8f33961177', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, h("p", { key: '72ba7d18dc8c2ddfb364a038ef570b48c45271b2', slot: "page_number" }, "2")), h("gb-pagination-number-base", { key: 'a770ad2b2d5075eaf8a03c8bc476d2f25a45be8b', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, h("p", { key: 'bd063a981a254da8eb44674e7db3e56641fda964', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, h("p", { slot: "page_number" }, this.currentPage))) : null, h("gb-pagination-number-base", { key: 'afadaf0d1a22a06b042820a5c22ad528b2a8e163', shape: this.shape }, h("p", { key: 'd1f6dd097d9406de08e37561840d7442eb209768', slot: "page_number" }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, h("p", { slot: "page_number" }, this.currentPage))) : null, h("gb-pagination-number-base", { key: '31fa7cbe8f6e4050ce4c697b38bef03ef9e4c368', shape: this.shape, state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 2) }, h("p", { key: '57cb67f8ba70b2827bb07ec135f95a2e0391d610', slot: "page_number" }, this.totalPages - 2)), h("gb-pagination-number-base", { key: '0e934e333347c4106808d954a92bcf17ee15afd4', shape: this.shape, state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 1) }, h("p", { key: '2011a84a8ca9349da1968c32c45fcd7e6cf06ba3', slot: "page_number" }, this.totalPages - 1)), h("gb-pagination-number-base", { key: '0cd553fea82817e8a739432f79465fe9abf39cc8', shape: this.shape, state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages) }, h("p", { key: 'a1ec937ceba341fabc02966ad160715a64464111', slot: "page_number" }, this.totalPages))), h("div", { key: '5dc26022e3a0d6e1680ccecd542ba689ed5ea677', class: "buttons" }, h("gb-button", { key: '393b6a0489ea83fe8d8bae3864a5be6524e6f196', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), h("gb-button", { key: 'aa6e0e7015dd3f8873576ebf2e6f380a6b882713', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() })))), this.type === 'card_minimal_right_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: '7c7af3da6d943be86cd64da219f56ce622348fb8', class: "entries" }, h("div", { key: 'e6255e53a2f84e5e13cc2d6719e71f3697359a10', class: "entries_text" }, h("p", { key: '70ea1e81cd4ea16f7d7863f8a7443a9522aac9f1', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), h("div", { key: '900d5149042dd7b848ccc6d62f7d6796992a0293', class: `entries_dropdown` }, h("gb-input-dropdown", { key: '09592c40ee254137d1eeaaaf83fcdc28225cde3c', 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" }))), h("div", { key: 'b4a93cc5cf669677938d6f8e4556c8d2165e14ff', class: "page_number_text" }, h("p", { key: 'e46abdb1cbbf79fff9f0cf2e1205c211e0787e77', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), h("div", { key: 'fc0e8ecd3012c0a79cf881825eede7e42cb5ee17', class: "buttons" }, h("gb-button", { key: '2afea3362a9b348adc3e7359911e9a4c4625c7d8', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, h("p", { key: '00e7ccbb221c420352f3c6727551d7877dbe1802' }, "Previous")), h("gb-button", { key: '3135fd1574628a7cab1754c75680061017c2fca6', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, h("p", { key: '05553c0b56ef24e9837c0290ed227da992973e46' }, "Next"))))), this.type === 'card_minimal_left_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: 'ae20c56d881600f74c853b9afcdf1bb483e7f09d', class: "buttons" }, h("gb-button", { key: 'ebe5dd331331a8f30d6f664595ab68ba5a8a2423', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, h("p", { key: '36fdd3197699b74e8ca5bdb3c13ed0e978e5a573' }, "Previous")), h("gb-button", { key: '35d067a8e580e2ba407fe95af244e564221aef76', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, h("p", { key: 'f93ae0a8714580d122d9ca77ebe8294a0c0d6876' }, "Next"))), h("div", { key: '3f7144c7c9a5f2d89e5748d6d22b25c82c7aa652', class: "page_number_text" }, h("p", { key: '9c0879cd926290c3f01c5701860aaed86d3dcb2c', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), h("div", { key: '33bcc7cfac280efe8deb5b7389a057484d4cb4a8', class: "entries" }, h("div", { key: '0c3a7e76a3fb96a718f9358602bf39b3ead3ebd9', class: "entries_text" }, h("p", { key: 'ec77555830a32330f669db71c290b06555ee307c', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), h("div", { key: '08e7b212df398748c8cc741cf4b1e1f7e7c77824', class: `entries_dropdown` }, h("gb-input-dropdown", { key: '5db3781ca9700d7b2fa03498cccea8de9fc81a2f', 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" }))))), this.type === 'card_minimal_center_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: 'b69bee8d13b4c0bf43ef18808b73a931ea56214c', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, h("p", { key: '13694fcf300e2f50c0f7e7ed11248e6ae0509098' }, "Previous")), h("div", { key: 'c63f6e4d6afb4dc31c93100178a23cacd8d4b215', class: "page_number_text" }, h("p", { key: '8d298e4d011b40c91453da9d315c2ad374c637c8', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), h("gb-button", { key: '715f265e48acf0d7c22d6228045c51a69acba7e1', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, h("p", { key: '0d53a018b8a7fe2332479d9bcee28286b34f557b' }, "Next")))), this.type === 'page_default' && this.breakpoint === 'mobile' && (h(Fragment, null, h("gb-button", { key: 'c903c9416e6c7b3b589d32c5ab50351757c82aef', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }), h("div", { key: '8a05e56c0f6b3e7828a98ed8303c16e628e6f6ac', class: "page_number_text" }, h("p", { key: '091c452bc44d928ad34c3fb82ffadb488cb0ec01', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), h("gb-button", { key: '4f9d3db25cf09430f3dcc9ac76e533ec962cd014', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg" })))));
+        return (h("div", { key: '236e299f0140a13732af963e8171abdc5e9f0edb', class: `pagination_div ${this.type} ${this.breakpoint}` }, this.type === 'page_default' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: '464fc14575ef5d4b5fc5e0ca342c64be170d871e', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, h("p", { key: '2b1bb562864958b62e5a1910998199e7b0be9eeb' }, "Previous")), h("div", { key: 'ff2388c5b6ee5fffadc6372ab97945bab9c96c61', class: "pagination_numbers" }, h("gb-pagination-number-base", { key: '1f17f330c1600fe4e5c14da66cc83de6a94431e8', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default' }, h("p", { key: '02093a840bdfdfc567063771c88fb533cabe62c2', slot: "page_number" }, "1")), h("gb-pagination-number-base", { key: '7d83d8e04704238b9c268053184b54e1de7201b9', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default' }, h("p", { key: 'bb7c348633334558a8aff9919cd925e96ccd268f', slot: "page_number" }, "2")), h("gb-pagination-number-base", { key: 'd0667d0183fc4903f31bb18d2576b30a89e47866', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default' }, h("p", { key: 'fab5b76f5243fb5dbc24323eb5b36978ae93db23', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, h("p", { slot: "page_number" }, this.currentPage))) : null, h("gb-pagination-number-base", { key: '981ee003b3fcc1636933001d1ef1554ea7d22236', shape: this.shape }, h("p", { key: 'ef7a76ec43885f7dfa2874bd038527b2de55cebc', slot: "page_number" }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, h("p", { slot: "page_number" }, this.currentPage))) : null, h("gb-pagination-number-base", { key: '9255f2eb09306423ed9f74a958120bcf0d826cd4', shape: this.shape, state: this.currentPage === this.totalPages - 2 ? 'active' : 'default' }, h("p", { key: 'b6dd411a4a76a24571e15a550d2171cbd10a215e', slot: "page_number" }, this.totalPages - 2)), h("gb-pagination-number-base", { key: '1ce1d1528b32deaaa700f9ede55c724cdd595f4a', shape: this.shape, state: this.currentPage === this.totalPages - 1 ? 'active' : 'default' }, h("p", { key: '14b9eb56d4c3c57188cfe90027c03620053428b4', slot: "page_number" }, this.totalPages - 1)), h("gb-pagination-number-base", { key: '2ee8d4549ffcf97cacbd1329973a941066a45ceb', shape: this.shape, state: this.currentPage === this.totalPages ? 'active' : 'default' }, h("p", { key: 'b4bbfa0f75303d28cb900ad7ee14221326e8283e', slot: "page_number" }, this.totalPages))), h("gb-button", { key: '32ca8069657756cc39ce2f8c13a26df4b5b9c60e', size: "sm", hierarchy: "tertiary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, h("p", { key: '8efb3bb4a2b305e93071dceb799cb39a7d4a50e9' }, "Next")))), this.type === 'page_minimal_center_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: 'fca887d4afd58404088369db953a8989d88878d4', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, h("p", { key: '84d7a51ff948a0ecc6d8302bb7b15aced2a2599f' }, "Previous")), h("div", { key: 'b5eb3112923b80303dce42f70f94afd02d078d57', class: "pagination_numbers" }, h("gb-pagination-number-base", { key: '52487257ddd745fb53cd184fe1641c12b6a27fc3', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default' }, h("p", { key: 'a62fab17fcd330a972b053a13b15f39da8823a9f', slot: "page_number" }, "1")), h("gb-pagination-number-base", { key: '55ccd48379e12a004cf8d7c2bd3e8efc36259050', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default' }, h("p", { key: '26e2b5e08169e87ba069750881714ce370971463', slot: "page_number" }, "2")), h("gb-pagination-number-base", { key: 'c3f49dbdb43e9cb2159e24f4695eada8f0e63400', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default' }, h("p", { key: '212f6302aa822fc5cb0146bd87922e2071de0e91', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, h("p", { slot: "page_number" }, this.currentPage))) : null, h("gb-pagination-number-base", { key: '8a732279429dd3684725a156ac42fc115a7299c6', shape: this.shape }, h("p", { key: 'd5977ed0bb620633b65c2d107f86bcbf7ff38119', slot: "page_number" }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, h("p", { slot: "page_number" }, this.currentPage))) : null, h("gb-pagination-number-base", { key: 'ac36463912680c61b6e7b6da231c12203fd7f520', shape: this.shape, state: this.currentPage === this.totalPages - 2 ? 'active' : 'default' }, h("p", { key: '6ee5567575f8edb3826332b5b442abfa02166028', slot: "page_number" }, this.totalPages - 2)), h("gb-pagination-number-base", { key: '7cf4651889b6630678e2b4a273959fbcd2e577e4', shape: this.shape, state: this.currentPage === this.totalPages - 1 ? 'active' : 'default' }, h("p", { key: '9340c8424c12652b020a28699c396069d619f230', slot: "page_number" }, this.totalPages - 1)), h("gb-pagination-number-base", { key: 'c78e5e5b9f31bad99b5cb4abdde137fc0662a75b', shape: this.shape, state: this.currentPage === this.totalPages ? 'active' : 'default' }, h("p", { key: 'edc2a0ed3c5e7e4249b0997872ce114aa666b2a4', slot: "page_number" }, this.totalPages))), h("gb-button", { key: '3f6fbba89b88b4aee27d7b820203e4a13ba27b7b', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, h("p", { key: 'e01a8c3276a40693f6ed4cda3a3086da6c445d48' }, "Next")))), this.type === 'card_default' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: '2c624dfbf7c743f90ac64473baec917b81bdb47e', class: "entries" }, h("div", { key: 'a30041e8705655c8befd0d577719d6b5517f3bf1', class: "entries_text" }, h("p", { key: '9d882cd596978fd6ee76f23b2a770744f46f43cc', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), h("div", { key: 'ddfa7e4cdd36b44ae0d1d2b5df874e61d3337758', class: `entries_dropdown` }, h("gb-input-dropdown", { key: '2c2f933100a2a79fe9bb93c82e9cf541a23e11f3', type: "default", state: "default", size: "sm", "show-label": false, "show-hint-text": false, "show-supporting-text": false, "show-hep-icon": false, items: [5, 10, 20, 50, 80], "menu-position": "top" }))), h("div", { key: 'ce5ffd59b237b2ea7b1be6b34fe5cd1e4eba647d', class: "pagination_numbers" }, h("gb-pagination-number-base", { key: 'b99f1375b6a3a002ed609fede6e7c3594d69c94e', shape: this.shape, state: this.currentPage === 1 ? 'active' : 'default', onClick: () => (this.currentPage = 1) }, h("p", { key: '63759c213b060de695480fa421e8cf6562c0c7d4', slot: "page_number" }, "1")), h("gb-pagination-number-base", { key: '513a7c26242ffe3b77f6d4ec8085f68ab241ae55', shape: this.shape, state: this.currentPage === 2 ? 'active' : 'default', onClick: () => (this.currentPage = 2) }, h("p", { key: '5877f4bc1fa9646211ac1c259bfe0fe60cde8924', slot: "page_number" }, "2")), h("gb-pagination-number-base", { key: 'db2d6b09c9a7c4a532ed778f2fd8a6bb739510f6', shape: this.shape, state: this.currentPage === 3 ? 'active' : 'default', onClick: () => (this.currentPage = 3) }, h("p", { key: '12bee73762576efaf16e5e892ba6d411231aba51', slot: "page_number" }, "3")), this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? (h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > 3 && this.currentPage <= this.totalPages / 2 ? 'active' : 'default' }, h("p", { slot: "page_number" }, this.currentPage))) : null, h("gb-pagination-number-base", { key: 'e41a559cd0eed9c8fe5433dced08e9440331cfe4', shape: this.shape }, h("p", { key: '27db59f9cfda627a9620c42741d68959e6b7a9d8', slot: "page_number" }, "...")), this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages - 2 ? (h("gb-pagination-number-base", { shape: this.shape, state: this.currentPage > this.totalPages / 2 && this.currentPage < this.totalPages ? 'active' : 'default' }, h("p", { slot: "page_number" }, this.currentPage))) : null, h("gb-pagination-number-base", { key: '8494908c4544faed97236cf865d1aa5ccadee082', shape: this.shape, state: this.currentPage === this.totalPages - 2 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 2) }, h("p", { key: '15050ec1de635bdd68c8dcb006ca180420bc5d06', slot: "page_number" }, this.totalPages - 2)), h("gb-pagination-number-base", { key: 'fc7bcd537610fbbb3aaab0e8e9e395acfbbce4ea', shape: this.shape, state: this.currentPage === this.totalPages - 1 ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages - 1) }, h("p", { key: 'd8c4cffc733bf5bc23670af91e2a4be8154d576f', slot: "page_number" }, this.totalPages - 1)), h("gb-pagination-number-base", { key: 'e8181021e41c1930e2e52b931130af7df7110aeb', shape: this.shape, state: this.currentPage === this.totalPages ? 'active' : 'default', onClick: () => (this.currentPage = this.totalPages) }, h("p", { key: '1c3626553c75bec46a7f8a7ef658afce8fb8f82e', slot: "page_number" }, this.totalPages))), h("div", { key: 'f9fc1462d389583eb84a4f7591401337210e3694', class: "buttons" }, h("gb-button", { key: '8d37b32afde9fdc4d7700b8044ba258a27bea23b', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }), h("gb-button", { key: '85c16d818c2a47d43bdcc5abc69a870087b5f1f3', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() })))), this.type === 'card_minimal_right_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: '4e4e416536650bbca8742948e57c32e06025b860', class: "entries" }, h("div", { key: 'e2bee0db1a3517f4a94bbfa5b709ee7a376f5cad', class: "entries_text" }, h("p", { key: '344efc4a19f6e34e30b8c244fd3d36d84668f52e', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), h("div", { key: '08e9cdb5eabc9d30ff1bcd3d88af325fab8847ef', class: `entries_dropdown` }, h("gb-input-dropdown", { key: 'd2d1ab3288bf42050f1f379c7a2d8a0a6c94d296', 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" }))), h("div", { key: 'ed95e8afc6308af702da516acdd8123917b789b3', class: "page_number_text" }, h("p", { key: '6c6f5d00c09447dc1c3f82c5a701e0f55c784bb7', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), h("div", { key: 'a54e4ede8e73805347beb09b763e0f9d7206b33e', class: "buttons" }, h("gb-button", { key: '6e49ed807b313d4753a4cfad6109ae1eab6d6d07', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, h("p", { key: 'bf0dede9108c2f90d2266b17aa81c4331d65eb02' }, "Previous")), h("gb-button", { key: '4546b4b3f07bb43dd12bda03ef0fa926e8f68cf4', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, h("p", { key: 'ee3277e6be68143ccefec32be0a8637ed1a6c901' }, "Next"))))), this.type === 'card_minimal_left_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("div", { key: 'cdd940aad93ca3c8bf704c65a0f34c1b459fad83', class: "buttons" }, h("gb-button", { key: '367b72695b36f1e1b40cb4c068e67f112140a77d', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, h("p", { key: 'eb89f3b2507d8e66426289cb9ab2fbfd32a541db' }, "Previous")), h("gb-button", { key: '18885f571169db4c5b1970d10ed346eaf9a15c7b', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, h("p", { key: '2a0e36ff201a4f8e1e39742a6bc2538ce1a62908' }, "Next"))), h("div", { key: 'a60760e6a9afa93a3142e54da4b58a8b086e1265', class: "page_number_text" }, h("p", { key: '675d3a8872452a8ebc3fb0ba528bf7a6b18c10aa', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), h("div", { key: 'b6839bf01033e5dc65e5d9bbe7f4651d9ba897ec', class: "entries" }, h("div", { key: 'b271760f6a1eee9e45498ac9247fc0f6b6ed4d57', class: "entries_text" }, h("p", { key: 'e7e2b6398cd2c57781f1ca36c502d754737fbb20', class: `text-sm-medium`, style: { color: 'var(--color-text, #4B5565)' } }, "Entries")), h("div", { key: '2f8f19b91874507dcd65855b2b1565f04929c7c1', class: `entries_dropdown` }, h("gb-input-dropdown", { key: 'b4e9021a5112e8a8a97fc8084c5f9fd0ab28a043', 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" }))))), this.type === 'card_minimal_center_aligned' && this.breakpoint === 'desktop' && (h(Fragment, null, h("gb-button", { key: 'c4e3602567a9b9359c566532cb9cc654be2e1772', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onPreviousButtonClicked() }, h("p", { key: '6e4186a02c17b022077114a39f53392b56b478ea' }, "Previous")), h("div", { key: 'f0cd357b4e5a6c8ac07306a3ea4885b548001a40', class: "page_number_text" }, h("p", { key: '7f9e4765124bba8d3c6884145659bd990b59e643', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), h("gb-button", { key: '6d34bd2bb459532daa531a312082c33a371368f5', size: "sm", hierarchy: "secondary_gray", icon: "default", state: "default", onClick: () => this.onNextButtonClicked() }, h("p", { key: 'afea7c38e14cf44a19de9c225a53a427c173f031' }, "Next")))), this.type === 'page_default' && this.breakpoint === 'mobile' && (h(Fragment, null, h("gb-button", { key: 'de7f000ded60191336b062223189e3fd82110909', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }), h("div", { key: 'ffd7a5e6694b83147453c66cc28ab8a75ecf5151', class: "page_number_text" }, h("p", { key: '6d5e6171a69d934157f16ee014edf5605f263b59', class: "text-sm-medium" }, "Page ", this.currentPage, " of ", this.totalPages)), h("gb-button", { key: 'b3e34f295cf55d5f79aa7bdcd6cc0bda79e1969e', size: "sm", hierarchy: "secondary_gray", icon: "only", state: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-right-02.svg" })))));
     }
     static get is() { return "gb-pagination"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-pagination-button-group-base/gb-pagination-button-group-base.js CHANGED Viewed

@@ -12,7 +12,7 @@ export class GbPaginationButtonGroupBase {
         }
     }
     render() {
-        return (h("div", { key: '6a05216df3414633a93aa6d55133f099f7e868cb', class: `button_base_div ${this.icon}` }, this.icon === 'false' && h("slot", { key: '06b4a94d64c84810d3cf7f7f7b683fb14c537315' }), this.icon === 'leading' && (h(Fragment, null, h("svg", { key: '352879247f64bd89d0622ba28d9a27aefc1dc5d7', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'fa62fb523f38fd43be8d013cdc2f949b709d9494', d: "M3.33325 9.99981H16.6666M3.33325 9.99981C3.33326 11.0978 7.49975 14.1667 7.49975 14.1667M3.33325 9.99981C3.33324 8.90182 7.49978 5.83334 7.49978 5.83334", stroke: "#4B5565", "stroke-width": "1.67", "stroke-linecap": "round", "stroke-linejoin": "round" })), h("slot", { key: '7b97318709ef72cf3808e343d3b023f7f41acf76' }))), this.icon === 'trailing' && (h(Fragment, null, h("slot", { key: '83ff4e2671b3de21871b76f43897f4573c07862c' }), this.iconTrailing && (h("svg", { key: '47941974f2de555622f9705037802bfe40bfaa71', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '3298bb5ce92a2d7dd5c1496b062b12dca07a1963', d: "M16.6668 9.99984H3.3335M16.6668 9.99984C16.6668 11.0978 12.5003 14.1667 12.5003 14.1667M16.6668 9.99984C16.6669 8.90185 12.5002 5.83337 12.5002 5.83337", stroke: "#4B5565", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))))));
+        return (h("div", { key: '489f11e972ef14a91e05313ecda393679d30c2de', class: `button_base_div ${this.icon}` }, this.icon === 'false' && h("slot", { key: '7ced1da9efe1168890640c16b1ab27da9e408bb6' }), this.icon === 'leading' && (h(Fragment, null, h("svg", { key: '9e48196b2db028ee325be6327314ad47514a41db', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '7918f392d59dc3cd3ccb08b1573ea785d1496236', d: "M3.33325 9.99981H16.6666M3.33325 9.99981C3.33326 11.0978 7.49975 14.1667 7.49975 14.1667M3.33325 9.99981C3.33324 8.90182 7.49978 5.83334 7.49978 5.83334", stroke: "#4B5565", "stroke-width": "1.67", "stroke-linecap": "round", "stroke-linejoin": "round" })), h("slot", { key: '92ca57746c76e728cbd22e2f61f59204fdcf8b7b' }))), this.icon === 'trailing' && (h(Fragment, null, h("slot", { key: 'cbc78baed4892729a0e9f987f933c65a428b8071' }), this.iconTrailing && (h("svg", { key: '0a9d13bc05213c1d9b1f8eb325a48ecf972e36cd', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '1131fa2ca4d40d148788ab963dd28c0732885f01', d: "M16.6668 9.99984H3.3335M16.6668 9.99984C16.6668 11.0978 12.5003 14.1667 12.5003 14.1667M16.6668 9.99984C16.6669 8.90185 12.5002 5.83337 12.5002 5.83337", stroke: "#4B5565", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))))));
     }
     static get is() { return "gb-pagination-button-group-base"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-pagination-dot-indicator/gb-pagination-dot-indicator.js CHANGED Viewed

@@ -6,7 +6,7 @@ export class GbPaginationDotIndicator {
         this.size = undefined;
     }
     render() {
-        return h("div", { key: 'b25e8048311f294966825aa45fb3917bb54c10c4', class: `dot_indicator_div
+        return h("div", { key: '5ec90d59ad876c6a990a8a6adff17fb2bd5fe724', class: `dot_indicator_div
       ${this.type} ${this.current ? 'current' : ''}
       ${this.size}` });
     }

package/dist/collection/components/gb-pagination-number-base/gb-pagination-number-base.js CHANGED Viewed

@@ -11,7 +11,7 @@ export class GbPaginationNumberBase {
         }
     }
     render() {
-        return (h("div", { key: '39273fc53abd4caa2356a9e8b594b6b033879329', class: `page_number_base ${this.shape} ${this.state}` }, h("slot", { key: 'ffc823fcd4bfeb50d7e42a601519e261bcfdaddd', name: "page_number" })));
+        return (h("div", { key: '41646231e0db537ff5c528a5386686573c030625', class: `page_number_base ${this.shape} ${this.state}` }, h("slot", { key: '83013eee15749f18819c22d5985afc946dbe633e', name: "page_number" })));
     }
     static get is() { return "gb-pagination-number-base"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-password-button/gb-password-button.js CHANGED Viewed

@@ -8,7 +8,7 @@ export class GbPasswordButton {
         this.isPasswordVisible = !this.isPasswordVisible;
     }
     render() {
-        return (h("div", { key: '71521b6c8444ff4ef953e057f243a31e05773ff3' }, h("gb-btn", { key: 'eab321b89bcbde3d10d539021fd25c0f585fcbf9', size: "sm", hierarchy: "link_gray", state: "default", onClick: () => this.togglePasswordVisibility() }, this.isPasswordVisible ? (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "default", state: this.state }, h("p", null, "HIDE"))) : (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "default", state: this.state }, h("p", null, "SHOW"))))));
+        return (h("div", { key: 'abe0084d747a9d1e8c17456355a8b44a8aebf58c' }, h("gb-btn", { key: '6fe8504636611b52c3cabe3f268823633f0d0ef2', size: "sm", hierarchy: "link_gray", state: "default", onClick: () => this.togglePasswordVisibility() }, this.isPasswordVisible ? (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "default", state: this.state }, h("p", null, "HIDE"))) : (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "default", state: this.state }, h("p", null, "SHOW"))))));
     }
     static get is() { return "gb-password-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-progress-bar/gb-progress-bar.js CHANGED Viewed

@@ -8,7 +8,7 @@ export class GbProgressBar {
     }
     render() {
         const progressValue = Math.min(Math.max(this.progress, 0), 100);
-        return (h("div", { key: 'a0eea48def33b36cd63b799cc507b26886b497c3', class: `progress_bar_container ${this.labelPosition}` }, h("div", { key: '851782fed21dcdcbbb72e643e2a398d58ee177b2', class: "progress_bar" }, h("div", { key: 'b0b2de9c0bca942427eddd93ec9bbc410c8ed8c3', class: "progress_fill", style: { width: `${progressValue}%` } })), h(Fragment, null, this.showLabel && (h("div", { key: '82152baec03795dbd37457359f8ea7bcd7d0569a', class: `label ${this.labelPosition}` }, this.labelPosition === 'right' && h("span", { key: '7109891348a806a1e69d10306cab49f6b1f1997a', class: `text-sm-medium` }, progressValue, "%"), this.labelPosition === 'bottom' && h("span", { key: '57c9ac94c008a303c104202e445086faad08de9a', class: `text-sm-medium` }, progressValue, "%"), this.labelPosition === 'top_floating' && (h("gb-tooltip", { key: '4d47c664bd4411507d23eec1991fb3ff02da2d8a', class: `top_tooltip`, arrow: "none", style: { marginLeft: `${(progressValue - 6.5).toString()}%` } }, h("p", { key: 'de1373be41d25bfaf9926855e8e1aaa867ab0b03', slot: "main_text", class: "text-xs-semi-bold" }, progressValue, "%"))), this.labelPosition === 'bottom_floating' && (h("gb-tooltip", { key: 'fc9c0a522f4c0a4da3890e5a10ba06812d091b03', class: `bottom_tooltip`, arrow: "none", style: { marginLeft: `${(progressValue - 59.5).toString()}%` } }, h("p", { key: 'ce7cc948667e6a794bf1f6e9e1c05cf64baee51b', slot: "main_text", class: "text-xs-semi-bold" }, progressValue, "%"))))))));
+        return (h("div", { key: 'e062e4d26c1122b2705bf90cc3aa96a701cad2d3', class: `progress_bar_container ${this.labelPosition}` }, h("div", { key: 'd0d1c2a02417b0bb8ad74aaba5473469607a0057', class: "progress_bar" }, h("div", { key: '60c31314f3e4b06f07ab2d1102824840ede11fa5', class: "progress_fill", style: { width: `${progressValue}%` } })), h(Fragment, null, this.showLabel && (h("div", { key: 'acc2abb5af3f72bf81767c5f4abc0bcf0ef43e6d', class: `label ${this.labelPosition}` }, this.labelPosition === 'right' && h("span", { key: 'f2caf9ae7181afbfb7135a5e26cd39a2b2147f41', class: `text-sm-medium` }, progressValue, "%"), this.labelPosition === 'bottom' && h("span", { key: '391c99a9273a08838adde34a2503a899a06576a0', class: `text-sm-medium` }, progressValue, "%"), this.labelPosition === 'top_floating' && (h("gb-tooltip", { key: '2b694324852efa3fb7c83b7dffd08ce3afccefa0', class: `top_tooltip`, arrow: "none", style: { marginLeft: `${(progressValue - 6.5).toString()}%` } }, h("p", { key: '208f1db5127d45a9b1870e76850522a151f033b5', slot: "main_text", class: "text-xs-semi-bold" }, progressValue, "%"))), this.labelPosition === 'bottom_floating' && (h("gb-tooltip", { key: 'aa997d353159724983eadc2ee9bb45c78ffa0d7a', class: `bottom_tooltip`, arrow: "none", style: { marginLeft: `${(progressValue - 59.5).toString()}%` } }, h("p", { key: '001a3b22ab25618ca14a36f386f8feb3df1a5150', slot: "main_text", class: "text-xs-semi-bold" }, progressValue, "%"))))))));
     }
     static get is() { return "gb-progress-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-progress-circle/gb-progress-circle.js CHANGED Viewed

@@ -30,7 +30,7 @@ export class GbProgressCircle {
         }
     }
     render() {
-        return (h("div", { key: 'd672d14a6511824b6fa1b1e0e12d152c43519e8b', class: "gauge" }, h("div", { key: 'afd56458454600bfe0cb43c1975d7f17aa6c503b', class: "arc", ref: el => (this.arcElement = el) }), h("div", { key: 'e01881cffc2b5a2cb3a3ed632eefdf3ccf5c3fb2', class: "mask" }), this.label && (h("div", { key: '66ad211688621ba753d8eabcb8530a40205695a5', class: "label", ref: el => (this.labelElement = el) }, h("p", { key: '1b063e29a20133e5bd9618efc915aedb457082aa', class: "display-lg-semi-bold" }, `${this.progress}%`)))));
+        return (h("div", { key: '1f1926f017dd4c7fc3dbd8b1d237aa82be33b814', class: "gauge" }, h("div", { key: '6fd795bc54dbb93b11ec7c2ccf9be93fa9bbef05', class: "arc", ref: el => (this.arcElement = el) }), h("div", { key: '5b67f69b1628f5e0e820740ed7b8c4009cdbba0c', class: "mask" }), this.label && (h("div", { key: 'd097d5016cd5c0d89b2309d9a3e03e1e819d7417', class: "label", ref: el => (this.labelElement = el) }, h("p", { key: '6df1dcdd1584c3743b29e389e42cb794bf77f518', class: "display-lg-semi-bold" }, `${this.progress}%`)))));
     }
     static get is() { return "gb-progress-circle"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-rich-text/gb-rich-text.js CHANGED Viewed

@@ -15,7 +15,7 @@ export class GbRichText {
             destructive: this.destructive,
             disabled: this.state === 'disabled'
         };
-        return (h("div", { key: '1b1f6593384ffea62f996e90284b1b2afedd55a4', class: classes }, h("div", { key: 'dd27d4e3f767f30b1355ef28eb8906789b97aecd', class: "input-with-label" }, h("label", { key: '2a71a0c2fc85783e8a4b857a529448782719e63e' }, this.label), h("div", { key: 'c0eb40a1eb0a32e06a0781a717df2ded242af168', class: "input-container" }, h("div", { key: '426a0adf6907548048346a264a9b44113b8856f8', class: "toolbar-container" }, h("gb-wysiwyg-toolbar", { key: '66f11a5ea3d4967870cbe4159e47d23059497bf4', breakpoint: "desktop", bold: true, italic: true, h1: true, h2: true, quote: true, link: true, image: true, bulletList: true, numberList: true })), this.destructive && (h("span", { key: '5975842484ee36f6d7668d931fcc4647e7de4e5d', class: "error-icon" }, h("svg", { key: 'ef82e1e2ec10bb1af03ba796857cf9774c666ecd', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { key: 'f677847750d256d331ed1242c53469f529267599', d: "M7.99483 10H8.00081M8.00016 8V5.33333M14.6668 8C14.6668 11.6819 11.6821 14.6667 8.00016 14.6667C4.31826 14.6667 1.3335 11.6819 1.3335 8C1.3335 4.3181 4.31826 1.33333 8.00016 1.33333C11.6821 1.33333 14.6668 4.3181 14.6668 8Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("div", { key: '9ec0e436530c086cff086410a5e917fec46b8094', class: "text-container" }, h("textarea", { key: '3a309ad1d2d4944930464ff82d86524ab84eb8cb' }, this.showPlaceholder && (h("div", { key: '364aed505ca340050898ed085a09fd40d544a34f' }, this.placeholder)))))), this.showHintText && (h("div", { key: '9c7b29e6c846c369adec09cfdd84690ac325e4a6', class: "hint-text" }, this.hintText))));
+        return (h("div", { key: 'b611e450383ed409a85a4c1dad7d6d8d2d147ebb', class: classes }, h("div", { key: '55b4e56302e904a4a5f7293f04733d070c95245e', class: "input-with-label" }, h("label", { key: '43f068d02c6bb5538d1bf40b781da5201ae253da' }, this.label), h("div", { key: '1b6ea94d7db77dadfac215696654377001d42a0d', class: "input-container" }, h("div", { key: '62a1f95d7969ec2e9ec0a214d05596bf7eb4ed0e', class: "toolbar-container" }, h("gb-wysiwyg-toolbar", { key: '4efc24f4eac0e3db92986ed0e8f049bc1b652f44', breakpoint: "desktop", bold: true, italic: true, h1: true, h2: true, quote: true, link: true, image: true, bulletList: true, numberList: true })), this.destructive && (h("span", { key: 'd5dc49a80d931886070e1ba238d40e87e38e0479', class: "error-icon" }, h("svg", { key: 'a6c04922d4add2846d8371070804ec294c251f75', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { key: '7e19ec15142df9fd3bc7871e7a0a9736fbaf1bfe', d: "M7.99483 10H8.00081M8.00016 8V5.33333M14.6668 8C14.6668 11.6819 11.6821 14.6667 8.00016 14.6667C4.31826 14.6667 1.3335 11.6819 1.3335 8C1.3335 4.3181 4.31826 1.33333 8.00016 1.33333C11.6821 1.33333 14.6668 4.3181 14.6668 8Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("div", { key: 'f078ee1694399de48f26fdad518da362d361ab02', class: "text-container" }, h("textarea", { key: '38c42af1b85c56d6b4167462d390360478a29fa4' }, this.showPlaceholder && (h("div", { key: '6ea9fefd977312a67ee81d604587889b9e8e3cd4' }, this.placeholder)))))), this.showHintText && (h("div", { key: 'f9c086f94b5d8f491088147971b8ff0de895fcd2', class: "hint-text" }, this.hintText))));
     }
     static get is() { return "gb-rich-text"; }
     static get encapsulation() { return "shadow"; }