globuswebcomponents 2.2.1 → 2.2.2

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

@@ -40,7 +40,7 @@ export class GbStepBase {
         this.internalState = newValue;
     }
     render() {
-        return (h(Fragment, null, this.type === 'text_line' && (h(Fragment, null, h("div", { key: 'd197cda8967dc47f67fee38c93abe30cb6fa73b5', class: `bar ${this.size} ${this.status} ${this.internalState}` }), this.showContent && (h("div", { key: '209c916094fa952cf3b07eff5facb1898d6f89b2', class: `text_line_div ${this.size} ${this.status} ${this.internalState}` }, h("div", { key: '5c805d6726442f8ffe71185a876fd73ceb8846d8', class: `text_line_div_content` }, h("p", { key: '20ca0f49896437eb010fae0db2e4a384e40f288d', class: `text_line_label text-sm-semi-bold ${this.status} ${this.internalState}` }, this.label), this.showSupportingText && h("p", { key: '4977400f42bf67931c2895525fa0a29e239043ee', class: `text_line_text text-xs-regular ${this.status} ${this.internalState}` }, this.supportingText)))))), this.type === 'icon_only' && (h("div", { key: 'd4fb9636a2f2e88e06c776024dc8b2fad4b54e7f', class: `icon_only_div ${this.status} ${this.internalState} ${this.size}` }, this.status !== 'complete' && h("div", { key: 'f2c5769d286e3deceaa11470d3937144e8b84116', class: `dot ${this.status} ${this.internalState} ${this.size}` }), this.status === 'complete' && (h("svg", { key: 'a49d1cb3cb41f2bfff6723f2edeedb48d46a80b7', xmlns: "http://www.w3.org/2000/svg", width: "12", height: "10", viewBox: "0 0 12 10", fill: "none", class: `tick ${this.status} ${this.internalState} ${this.size}` }, h("path", { key: '952a0b17a6dcdeaace0c0ff533792a0a06789291', d: "M1 6.45455C1 6.45455 2.07143 6.45455 3.5 9C3.5 9 7.47059 2.33333 11 1", stroke: "#075DB2", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), this.type === 'icon_left' && (h("div", { key: '971edae2fddee1b0386b831bed2461a44addbb2b', class: `icon_left_div ${this.size}` }, h("div", { key: 'd6814c9efcf56e9fd9630d4fd0c8b1e4fafe6d46', class: "connector_wrap" }, h("div", { key: '62f20a42b689dc0b733693e4ae1871e421eb8399', class: `icon_only_div ${this.status} ${this.internalState} ${this.size}` }, this.status !== 'complete' && h("div", { key: '09b77f392d830fdfb7408c421a7ce7be96d6411e', class: `dot ${this.status} ${this.internalState} ${this.size}` }), this.status === 'complete' && (h("svg", { key: '22d8d7528472560b45d001cf49dc9b90452c90d1', xmlns: "http://www.w3.org/2000/svg", width: "12", height: "10", viewBox: "0 0 12 10", fill: "none", class: `tick ${this.status} ${this.internalState} ${this.size}` }, h("path", { key: '20bc5d226c395a9868484bb8c3c10f70465704a5', d: "M1 6.45455C1 6.45455 2.07143 6.45455 3.5 9C3.5 9 7.47059 2.33333 11 1", stroke: "#075DB2", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), this.connector && (h("div", { key: 'ac08c6d5b4596095d13e58abde396a01f931903a', class: "connector_div" }, h("div", { key: '58eb090ad3b2fcb7c2bcea42ca1d0d08c1a94b68', class: `icon_left_connector ${this.internalState} ${this.status}` })))), h("div", { key: 'dfd500500d90d40530d4f80a8e012855a6e34d0b', class: "icon_left_text" }, h("p", { key: '7d6c6f4da8212997146bbdf5dcbc49f363cbab8d', class: `text_line_label text-sm-semi-bold ${this.status} ${this.internalState}` }, this.label), h("p", { key: '402e14cadbb5f8f3099c038d5156c41ccae9d684', class: `text_line_text text-xs-regular ${this.status} ${this.internalState}` }, this.supportingText)))), this.type === 'icon_top' && (h("div", { key: '0058feab3ef09691c06111aeb2d7666696dff16e', class: `icon_top_div ${this.size}` }, h("div", { key: 'b2694b111ded7c66557cee64c874d65161509358', class: "step_icon_div" }, h("div", { key: 'b0ed79c575c6b2c98e5c816b958904f2c3fe1949', class: "step_icon" }, h("div", { key: '719401ee837e076038e22a5c1e46a38e09cbb377', class: `icon_only_div ${this.status} ${this.internalState} ${this.size}` }, this.status !== 'complete' && h("div", { key: 'c00555b55fb6bc29e0cd4d3c029b8cac15380caa', class: `dot ${this.status} ${this.internalState} ${this.size}` }), this.status === 'complete' && (h("svg", { key: '90635691a01b9ecfa289fad10814fa2da4918601', xmlns: "http://www.w3.org/2000/svg", width: "12", height: "10", viewBox: "0 0 12 10", fill: "none", class: `tick ${this.status} ${this.internalState} ${this.size}` }, h("path", { key: '78f78478e446201a432ced1fa6edbb8214ae984d', d: "M1 6.45455C1 6.45455 2.07143 6.45455 3.5 9C3.5 9 7.47059 2.33333 11 1", stroke: "#075DB2", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), this.connector && (h("div", { key: 'd18478afc3a5517574f6a7d73d5aec5674ebe28b', class: "connector_div" }, h("div", { key: '6ace46d99cf6818a5d5603db62cac2978680fa65', class: `icon_top_connector ${this.internalState} ${this.status}` }))))), h("div", { key: 'f33fe99fadb710b5e360d39f23b4b6d05ec840db', class: "icon_top_content" }, h("p", { key: '9190515cdcd656c37bbd2f5e171daa9cd09d38ce', class: `text_line_label text-sm-semi-bold ${this.status} ${this.internalState}` }, this.label), h("p", { key: 'f40cf800bef991de3ba45cf4ce9f947907f813a1', class: `text_line_text text-xs-regular ${this.status} ${this.internalState}` }, this.supportingText)))), this.type === 'featured_icon_left' && (h("div", { key: '96895d62af946e5fc26fdcf2947a822713d7796d', class: "featured_icon_left_div" }, h("div", { key: '8bd885e322470f6c5eac395bf45cf515f2ad54f5', class: "connector_wrap" }, h("gb-featured-icon", { key: '01f832f432780897884edd8c57f67cfad2638b35', size: this.size, icon: "assets/user.svg", destructive: this.internalState === 'destructive' ? true : false }), h("div", { key: 'f76dfcfd6d6c0b53bc522ad68e145dbf0627f998', class: "connector_div" }, h("div", { key: 'ba0cc3fa367b4d84ed339d882557f24c76ce8438', class: `featured_icon_left_connector ${this.size} ${this.internalState} ${this.status}` }))), h("div", { key: '3a18113a42d0c599a473651059eec897645f95ef', class: "featured_icon_left_content" }, h("p", { key: 'ae53fe14e9c91733446fea7406590c751ac64435', class: `featured_icon_left_label ${this.featuredIconLeftLabelClasses()} ${this.status} ${this.internalState}` }, this.label), h("p", { key: 'e2769ad2e665216813413fcf3d6c40514a9c6b2c', class: `featured_icon_left_text ${this.featuredIconLeftTextClasses()} ${this.status} ${this.internalState}` }, this.supportingText))))));
+        return (h(Fragment, null, this.type === 'text_line' && (h(Fragment, null, h("div", { key: '740dc4801f0797ec8ecad283c22d19da3f443d4a', class: `bar ${this.size} ${this.status} ${this.internalState}` }), this.showContent && (h("div", { key: '457abae51e5b12a0ecf4ff265afd8be0f652fb5c', class: `text_line_div ${this.size} ${this.status} ${this.internalState}` }, h("div", { key: 'a2b6772e1bc50ba8fb0c5d45a935d178d3ce82f7', class: `text_line_div_content` }, h("p", { key: '624d48d4b3830af54b883ba2d148b572a8e5201a', class: `text_line_label text-sm-semi-bold ${this.status} ${this.internalState}` }, this.label), this.showSupportingText && h("p", { key: 'b771ab4c25ab171750aead7b50ad8654777562ad', class: `text_line_text text-xs-regular ${this.status} ${this.internalState}` }, this.supportingText)))))), this.type === 'icon_only' && (h("div", { key: 'ffe30584e5dba7fbf2048afdfd510fc2edd8ed7d', class: `icon_only_div ${this.status} ${this.internalState} ${this.size}` }, this.status !== 'complete' && h("div", { key: '92be937ea333a0c3469664ca56df24555939f80e', class: `dot ${this.status} ${this.internalState} ${this.size}` }), this.status === 'complete' && (h("svg", { key: 'dd1b26aa90480cb3396cd51b5082f6bfb3bc84e8', xmlns: "http://www.w3.org/2000/svg", width: "12", height: "10", viewBox: "0 0 12 10", fill: "none", class: `tick ${this.status} ${this.internalState} ${this.size}` }, h("path", { key: '9537cdd02ed8d2634718c8ef6474eb46dcac105d', d: "M1 6.45455C1 6.45455 2.07143 6.45455 3.5 9C3.5 9 7.47059 2.33333 11 1", stroke: "#075DB2", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), this.type === 'icon_left' && (h("div", { key: 'bef8371581aa435b3c43f3ebc38d50a4818490ec', class: `icon_left_div ${this.size}` }, h("div", { key: '4a63f37169c7c96667c6d4364df290d7fba5c5a0', class: "connector_wrap" }, h("div", { key: '13fd2afa47c8eedcf1f400e3be946306234dc299', class: `icon_only_div ${this.status} ${this.internalState} ${this.size}` }, this.status !== 'complete' && h("div", { key: 'a151cf9f27426f8988a17dca9ccbc294978ea649', class: `dot ${this.status} ${this.internalState} ${this.size}` }), this.status === 'complete' && (h("svg", { key: '3637e467790167a8d0f620ac7e6645622f2295b5', xmlns: "http://www.w3.org/2000/svg", width: "12", height: "10", viewBox: "0 0 12 10", fill: "none", class: `tick ${this.status} ${this.internalState} ${this.size}` }, h("path", { key: 'c94500b4a1f43985c8f773541008e2cb7eaa4f45', d: "M1 6.45455C1 6.45455 2.07143 6.45455 3.5 9C3.5 9 7.47059 2.33333 11 1", stroke: "#075DB2", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), this.connector && (h("div", { key: 'e571dfbc9744f60980846bc931394d2122511564', class: "connector_div" }, h("div", { key: '03b7623b0af10d31b41cff5a770b88f0162503cf', class: `icon_left_connector ${this.internalState} ${this.status}` })))), h("div", { key: '113236c2edb895c887420875a677fe0612e73c8c', class: "icon_left_text" }, h("p", { key: '7d764601aa5b403c97976b3770933275956ff70e', class: `text_line_label text-sm-semi-bold ${this.status} ${this.internalState}` }, this.label), h("p", { key: '173abdcff03f1f56dedfa5492a782b4faa35eb43', class: `text_line_text text-xs-regular ${this.status} ${this.internalState}` }, this.supportingText)))), this.type === 'icon_top' && (h("div", { key: 'fa3afae3b8306e6d1d0c63ca27b07030860ded93', class: `icon_top_div ${this.size}` }, h("div", { key: 'e2167c4f72d84b0892752ab3e6cd36bc2803fd86', class: "step_icon_div" }, h("div", { key: 'f2a2df821abaa459d43be910a5f31b437f0d7d09', class: "step_icon" }, h("div", { key: '030b82b1b1b0b193a10ee88c4f8985e2de7dc359', class: `icon_only_div ${this.status} ${this.internalState} ${this.size}` }, this.status !== 'complete' && h("div", { key: 'c7ae25a281e734f1489595c5e4d050a4a978502c', class: `dot ${this.status} ${this.internalState} ${this.size}` }), this.status === 'complete' && (h("svg", { key: '81314ae1c409c76bb6d6c43e9a3cb959cc2a5490', xmlns: "http://www.w3.org/2000/svg", width: "12", height: "10", viewBox: "0 0 12 10", fill: "none", class: `tick ${this.status} ${this.internalState} ${this.size}` }, h("path", { key: 'e76448163aaa3795b11396b5d09d256e984063a8', d: "M1 6.45455C1 6.45455 2.07143 6.45455 3.5 9C3.5 9 7.47059 2.33333 11 1", stroke: "#075DB2", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))), this.connector && (h("div", { key: '08067a49a2bc64899244a9835930800ffe8cd908', class: "connector_div" }, h("div", { key: '2ac1e867588f7176de5cb445d3af4058d18108af', class: `icon_top_connector ${this.internalState} ${this.status}` }))))), h("div", { key: '997de370fa21f45e1f8e4933bcdae9de6a8c89bb', class: "icon_top_content" }, h("p", { key: 'dfda37dce570c00590d45ad84b2605f399681374', class: `text_line_label text-sm-semi-bold ${this.status} ${this.internalState}` }, this.label), h("p", { key: '069eb616f7f52fbc9d538d0a9e6e65d998ad4d2d', class: `text_line_text text-xs-regular ${this.status} ${this.internalState}` }, this.supportingText)))), this.type === 'featured_icon_left' && (h("div", { key: '0ecda441bb31658c4c374c361b5f25ad1f9c056f', class: "featured_icon_left_div" }, h("div", { key: '2898d2b545356f23df6db3d13de3adf4ddcdb941', class: "connector_wrap" }, h("gb-featured-icon", { key: '4aca2a97b98035929f9c0456a32da9cc77dd76fa', size: this.size, icon: "assets/user.svg", destructive: this.internalState === 'destructive' ? true : false }), h("div", { key: '1e82d1b0a7f8fea7f672e154c27c706f33aa83d7', class: "connector_div" }, h("div", { key: '16fe87ffc442ad5770a4433706703ec29cff6883', class: `featured_icon_left_connector ${this.size} ${this.internalState} ${this.status}` }))), h("div", { key: '98115b004fc62f908f2b296cd4357458f6bdcf9a', class: "featured_icon_left_content" }, h("p", { key: '8dadfc517a4c82e8bdcbca7f6a1201d0b95e30c3', class: `featured_icon_left_label ${this.featuredIconLeftLabelClasses()} ${this.status} ${this.internalState}` }, this.label), h("p", { key: '836a4dcc8512927507c3790dc9b733aeeeae8f0d', class: `featured_icon_left_text ${this.featuredIconLeftTextClasses()} ${this.status} ${this.internalState}` }, this.supportingText))))));
     }
     static get is() { return "gb-step-base"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-stepper-horizontal-icons-centered/gb-stepper-horizontal-icons-centered.js

@@ -18,7 +18,7 @@ export class GbStepperHorizontalIconsCentered {
         this.connector = false;
     }
     render() {
-        return (h(Fragment, null, this.type === 'icon' && (h("div", { key: 'a26dd4962ef0b857b2e1045c29c36588156f2d87', class: "icons_centered_div" }, this.breakpoint === 'desktop' && (h("div", { key: '5acbb218ee8c9e34690a3e9f5dd39ab66e064cac', class: "step_div" }, this.steps.map((step, index) => (h(Fragment, null, h("gb-step-base", { size: this.size, type: "icon_top", state: step.state, status: step.status, connector: index === this.steps.length - 1 ? false : true, label: step.label, "supporting-text": step.supportingText })))))), this.breakpoint === 'mobile' && (h(Fragment, null, this.steps.map((step, index) => (h(Fragment, null, h("gb-step-base", { size: this.size, type: "icon_left", state: step.state, status: step.status, connector: index === this.steps.length - 1 ? false : true, label: step.label, "supporting-text": step.supportingText }))))))))));
+        return (h(Fragment, null, this.type === 'icon' && (h("div", { key: '602135ea7fcec8bd3da9238869c5f740eec72b29', class: "icons_centered_div" }, this.breakpoint === 'desktop' && (h("div", { key: '3798a00cabc36885cac6850e8ecdf387190317c4', class: "step_div" }, this.steps.map((step, index) => (h(Fragment, null, h("gb-step-base", { size: this.size, type: "icon_top", state: step.state, status: step.status, connector: index === this.steps.length - 1 ? false : true, label: step.label, "supporting-text": step.supportingText })))))), this.breakpoint === 'mobile' && (h(Fragment, null, this.steps.map((step, index) => (h(Fragment, null, h("gb-step-base", { size: this.size, type: "icon_left", state: step.state, status: step.status, connector: index === this.steps.length - 1 ? false : true, label: step.label, "supporting-text": step.supportingText }))))))))));
     }
     static get is() { return "gb-stepper-horizontal-icons-centered"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-stepper-horizontal-line-with-text/gb-stepper-horizontal-line-with-text.js

@@ -41,7 +41,7 @@ export class GbStepperHorizontalLineWithText {
         this.showSupportingText = this.width < 768 ? false : true;
     }
     render() {
-        return (h("div", { key: '8ef3ed2f540e32459f55b1bf6d583e2573d5cce6', class: "text_with_line" }, this.internalSteps.map(step => (h("gb-step-base", { size: this.size, type: "text_line", state: step.state, status: step.status, label: step.label, "supporting-text": step.supportingText, "show-content": this.showContent, "show-supporting-text": this.showSupportingText })))));
+        return (h("div", { key: '6a786a75a71ef8499c0cd51dbfa69aaa46b01a30', class: "text_with_line" }, this.internalSteps.map(step => (h("gb-step-base", { size: this.size, type: "text_line", state: step.state, status: step.status, label: step.label, "supporting-text": step.supportingText, "show-content": this.showContent, "show-supporting-text": this.showSupportingText })))));
     }
     static get is() { return "gb-stepper-horizontal-line-with-text"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-stepper-vertical-icons-with-text/gb-stepper-vertical-icons-with-text.js

@@ -31,7 +31,7 @@ export class GbstepperVerticalIconsWithText {
         this.stepClicked.emit(index);
     }
     render() {
-        return (h("div", { key: 'd107dfa18be1bdf521a1b51d07b9071ab3d540d8', class: "vertical_stepper_div" }, this.type === 'icon' && (h(Fragment, null, this.internalSteps.map((step, index) => (h("gb-step-base", { size: this.size, type: "icon_left", state: step.state, status: step.status, connector: index === this.steps.length - 1 ? false : this.connector, label: step.label, "supporting-text": step.supportingText, onClick: () => this.emitIndex(index) })))))));
+        return (h("div", { key: '9f63e70bdf8c0f0f2bc894d0f1b0de22de2c82db', class: "vertical_stepper_div" }, this.type === 'icon' && (h(Fragment, null, this.internalSteps.map((step, index) => (h("gb-step-base", { size: this.size, type: "icon_left", state: step.state, status: step.status, connector: index === this.steps.length - 1 ? false : this.connector, label: step.label, "supporting-text": step.supportingText, onClick: () => this.emitIndex(index) })))))));
     }
     static get is() { return "gb-stepper-vertical-icons-with-text"; }
     static get encapsulation() { return "shadow"; }

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

@@ -40,11 +40,11 @@ export class GbTabButtonBase {
         this.tabClicked.emit();
     }
     render() {
-        return (h("div", { key: '34be43b8efdeb58d8155face3ac4af6d7c4ecc2f', class: `tab_button_div ${this.type}
+        return (h("div", { key: 'af4a1702a26876a4c2af082bdf4183f1c93393ba', class: `tab_button_div ${this.type}
       ${this.current ? 'current' : ''} 
       ${this.fullWidth ? 'full_width' : ''} 
       ${this.size}
-      ${this.alignment}`, onClick: () => this.handleClick() }, h("p", { key: '1263ee5f5b0a17eac836af60eafcb6768d53db0e', class: `${!this.current ? 'tab_text' : ''} ${this.current ? this.getCurrentTextClasses() : this.getTextClasses()}` }, this.tabName), this.badge && (h("gb-badge", { key: '71408630cec8590d7e9a21d3606bc49801790a35', size: "sm", type: "pill_color", color: this.current && this.type === 'button_primary'
+      ${this.alignment}`, onClick: () => this.handleClick() }, h("p", { key: '4906a16848070c4b0f2bf39c7eaf242623a5a741', class: `${!this.current ? 'tab_text' : ''} ${this.current ? this.getCurrentTextClasses() : this.getTextClasses()}` }, this.tabName), this.badge && (h("gb-badge", { key: '07701728e16f980dfd591c412c563f493dbbec1f', size: "sm", type: "pill_color", color: this.current && this.type === 'button_primary'
                 ? 'information'
                 : this.current && this.type === 'underline'
                     ? 'information'
@@ -53,7 +53,7 @@ export class GbTabButtonBase {
                         :
                             this.current && this.type === 'line'
                                 ? 'information'
-                                : 'gray' }, h("slot", { key: '7cd11ad5d9ab361dc5a1a6a2a20218d17aa82614', name: "count" })))));
+                                : 'gray' }, h("slot", { key: '1e843025e5fae4137f54830e102646be85b64208', name: "count" })))));
     }
     static get is() { return "gb-tab-button-base"; }
     static get encapsulation() { return "shadow"; }

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

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

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

@@ -49,7 +49,7 @@ export class GbTableHeader {
         this.layoutButtonClicked.emit(layout.detail);
     }
     render() {
-        return (h("div", { key: 'f7ff615fb56cfc63d28ebe7298f3cf39a45c2567', class: "table_header_div" }, h("div", { key: 'a48558b3a56bf4d4c121a63023c4b5278e1efb0d', class: "table_header_content" }, this.tableHeading && h("p", { key: '407e52d49ec6ca94b32e7198360e08c61f3597eb', class: "text-lg-semi-bold" }, this.tableHeadingLabel), h("div", { key: '67333a518344ec866ef9b8396ccb5c10d6226442', class: "actions" }, this.showSearch && (h("div", { key: 'd7153b126fcc6dbf06c2a46b1be80d255b5d5d00', class: "input_field" }, h("gb-input-field", { key: '850de6da9c2a5c1358a04dfb3e7d4b88b5fde643', size: "sm", type: "icon_leading", "icon-swap": "assets/search-01.svg", placeholder: "Search", onInputValueChanged: this.emitValue.bind(this) }))), h("div", { key: '659aff878a1b1cb1cc283d2791ca15b2f4e795c4', class: "action" }, this.showLayoutToggle && h("gb-button-group", { key: '5938c21796b6344daba70f171abea8ca8cc37926', items: this.items, icon: "only", onOptionChange: this.onLayoutButtonClicked.bind(this) }), this.showColumnOptions && (h("gb-button", { key: '97e09dfb78bb849a69eb4b57bbae9ab4a3ec7db9', size: "md", hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/column-insert.svg" }, h("p", { key: '6009d0cc583696bf530e530a5cae8e72a8a0627d' }, "Columns"))), this.showFilter && (h("gb-filter-button", { key: '10e46aa92155a8e4c169ddab6b2effab9865d856', state: this.filterState, "icon-only": this.width <= 1007 ? true : false, onClick: () => this.onFilterButtonClicked() }, h("p", { key: '5440579fe1da02931e7f1892a55220ce60e4dc66', slot: "filter_count" }, this.filterCount))), this.showExport && (h("div", { key: 'c8d8ac99115cba74214d46f112b6746854f86c6d', class: "export" }, h("gb-button", { key: 'fdb95243097a5cb63aa3d13ba796fa925bee8a27', size: "md", hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/file-export.svg", "icon-trailing": this.width <= 1007 ? false : true, "icon-trailing-swap": "assets/arrow-down-01.svg", onClick: () => this.toggleDropdown() }, h("p", { key: 'e916d98b768f4ee47914e91b08b522ca49c82aba' }, "Export")), this.showExportDropdown && (h("gb-export-dropdown", { key: '4e2f1a35b153169a08751172ec5eaa0305c769d8', "show-entire-data": this.showEntireData, onExportClicked: () => this.emitSelection.bind(this), class: "dropdown" })))), this.showRefreshButton && (h("div", { key: 'e1701e7762b8cf4d480861470996ad4e9f217b0a', class: "refresh_button" }, h("gb-button", { key: '0509d41e3c49c7acfe4ea1e12e854fd518762185', size: "md", hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/refresh.svg", onClick: () => this.onRefreshButtonClicked() }))))))));
+        return (h("div", { key: '2a34efe6f2c0fbc9942c008096a0226b7ccc71aa', class: "table_header_div" }, h("div", { key: '392f77318718d5cd91065868f168c06d80fb30fb', class: "table_header_content" }, this.tableHeading && h("p", { key: '245ffc7dec84db2bc3684e570bc45a022ff7ddba', class: "text-lg-semi-bold" }, this.tableHeadingLabel), h("div", { key: '2d894a62dc08532420c9eb90d7e279daaacbb21b', class: "actions" }, this.showSearch && (h("div", { key: '0f47e39c1a9704faa71d9678410f79bc93902e0b', class: "input_field" }, h("gb-input-field", { key: '19c239a6aa1bfa8a4205b6cd2e3a2377d1bf1985', size: "sm", type: "icon_leading", "icon-swap": "assets/search-01.svg", placeholder: "Search", onInputValueChanged: this.emitValue.bind(this) }))), h("div", { key: 'ccc4ed4bf1c1e5174273eddb5562804638d0fb16', class: "action" }, this.showLayoutToggle && h("gb-button-group", { key: 'f765412156eece81eedfb2258e00ca12c0776003', items: this.items, icon: "only", onOptionChange: this.onLayoutButtonClicked.bind(this) }), this.showColumnOptions && (h("gb-button", { key: 'cdd9caf925ae9199e9f016de43d3a75801674199', size: "md", hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/column-insert.svg" }, h("p", { key: '10a43933e3b58bd7b8fdd9ab16ce767f4092be9b' }, "Columns"))), this.showFilter && (h("gb-filter-button", { key: '7e06d30d27457314c84a765812d5a162163288b3', state: this.filterState, "icon-only": this.width <= 1007 ? true : false, onClick: () => this.onFilterButtonClicked() }, h("p", { key: 'c889145dde5665b16c45ea79e772e299627a0741', slot: "filter_count" }, this.filterCount))), this.showExport && (h("div", { key: '825c2820c839025fc0e65fdec7f28096dec7f081', class: "export" }, h("gb-button", { key: 'ce4368ceeb469572efc247d4c99fc20d5c0d0bdd', size: "md", hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/file-export.svg", "icon-trailing": this.width <= 1007 ? false : true, "icon-trailing-swap": "assets/arrow-down-01.svg", onClick: () => this.toggleDropdown() }, h("p", { key: '4291642c72400f79d7dd6b36039da3298e9d881f' }, "Export")), this.showExportDropdown && (h("gb-export-dropdown", { key: '4958d88c3994eee68b13ac6e3900ce5479e97429', "show-entire-data": this.showEntireData, onExportClicked: () => this.emitSelection.bind(this), class: "dropdown" })))), this.showRefreshButton && (h("div", { key: '230b75fad9b91fb4c70ef30009c36a6ada2957d4', class: "refresh_button" }, h("gb-button", { key: '94a9cc865946a74acf5b4d2ccb0738607578da39', size: "md", hierarchy: "secondary_gray", icon: this.width <= 1007 ? 'only' : 'default', "icon-leading": true, "icon-leading-swap": "assets/refresh.svg", onClick: () => this.onRefreshButtonClicked() }))))))));
     }
     static get is() { return "gb-table-header"; }
     static get encapsulation() { return "shadow"; }

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

@@ -22,7 +22,7 @@ export class GbTag {
     }
     render() {
         const flagSwap = getAssetPath(`${this.flagSwap}`);
-        return (h("div", { key: '81e0e5b53ff1c441e3a28f668d6872da4a26bc4c', class: `container ${this.size}` }, h("div", { key: '52dd5d71e37a412635a62d197e02f01e9e7a37c3', class: `content ${this.size}` }, this.checkbox && h("gb-tag-checkbox", { key: '4966386c36cd21b3fd88213792fca9c42ad4223a', size: this.size }), this.icon === 'false' && h(Fragment, null), this.icon === 'country' && (h("div", { key: '0759827f0e4fc92f70513edf89db8fe9026e4f02', class: "icon left-icon" }, h("img", { key: 'aa3421d70806db594e69b47a9f6fbc87c586cb73', src: flagSwap, alt: "Country Icon" }))), this.icon === 'avatar' && (h("gb-avatar", { key: '6a5be186c24c05beef35116059624f6ed1167c93', class: "avatar-icon", size: "xxs", "status-icon": "false", text: true, color: "gray" }, h("slot", { key: 'ceb5f89d267d43ce8698cd002e78419906770d48', name: "initials", slot: "initials" }))), this.icon === 'dot' && (h("svg", { key: 'b22bc132872e3520c13ad70104f0151659b91a66', xmlns: "http://www.w3.org/2000/svg", width: "8", height: "8", viewBox: "0 0 8 8", fill: "none" }, h("circle", { key: 'f035fbd07c06da2e7e237ab1ed0fee78d5a67f88', cx: "4", cy: "4", r: "3", fill: "#17B26A" }))), h("div", { key: '098f601365dbe87a08230704e4d7577942774507', class: "label" }, h("slot", { key: 'a8ad31524b402b5a861c069682c8f15a4f44ec2e' })), this.action === 'count' && (h("gb-tag-count", { key: '84b2f2f58ec63990d453cfc81c51c5938b5fec57', size: this.size }, h("slot", { key: 'b8f8c930403c20c22189c3d8ca10f64867b89f70', slot: "count", name: "count" })))), this.action === 'X_close' && h("gb-tag-close", { key: '6f3cb30c1e7b5380d31e12742c84e03cfbce1ed2', size: this.size, onClick: () => this.onTagClose() })));
+        return (h("div", { key: '8f30b6cfd652faa71b8e462d683fe05388b7ae71', class: `container ${this.size}` }, h("div", { key: 'dfa6b2d35e2324bec0a796a3bf41202f06350337', class: `content ${this.size}` }, this.checkbox && h("gb-tag-checkbox", { key: '75a665f325bdd61323a04132bd5c6c93118d13c2', size: this.size }), this.icon === 'false' && h(Fragment, null), this.icon === 'country' && (h("div", { key: 'ffa9647bcd5b563b7dc65cd7e429d822f0bdc5bb', class: "icon left-icon" }, h("img", { key: '19c71bd620d85049406a39ac2f4428f792964609', src: flagSwap, alt: "Country Icon" }))), this.icon === 'avatar' && (h("gb-avatar", { key: 'eeae354cdafe6e2e1857ae17156e4623acfcb16d', class: "avatar-icon", size: "xxs", "status-icon": "false", text: true, color: "gray" }, h("slot", { key: '571ad4a5e26707da8348319433dcf1a3a0447b97', name: "initials", slot: "initials" }))), this.icon === 'dot' && (h("svg", { key: 'ca3c0827f295b295afaa65af2299f24b2f13cf78', xmlns: "http://www.w3.org/2000/svg", width: "8", height: "8", viewBox: "0 0 8 8", fill: "none" }, h("circle", { key: '5affe6c9042d134d98ad53330e9f0916a3fa6e5c', cx: "4", cy: "4", r: "3", fill: "#17B26A" }))), h("div", { key: '947d7c45adb793f436c451d51b519e22f259a40d', class: "label" }, h("slot", { key: 'b43c132f13e3388c441314dbb65de6a967c33c33' })), this.action === 'count' && (h("gb-tag-count", { key: '884ae1b50d7f3b316cdae8c70cfe7e8cf526a240', size: this.size }, h("slot", { key: '174eeeb4537e1e12aee647fa204f9cc8607d497d', slot: "count", name: "count" })))), this.action === 'X_close' && h("gb-tag-close", { key: '524ca504950e5bb99cb0828bcfed9d719c14de1c', size: this.size, onClick: () => this.onTagClose() })));
     }
     static get is() { return "gb-tag"; }
     static get encapsulation() { return "shadow"; }

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

@@ -6,7 +6,7 @@ export class GbTagCheckbox {
         this.disabled = false;
     }
     render() {
-        return (h("label", { key: '2ade0b66d324223a610273616eba74da5ad77eaa', class: `checkbox-container ${this.size} ${this.disabled ? 'disabled' : ''}` }, h("input", { key: '13d683458f6204de8b496ca5330e6b9c652eb7d4', type: "checkbox", checked: this.checked, disabled: this.disabled }), h("span", { key: '41e3d9fadc486921e9588543b6ee080bd337ff7c', class: `custom-checkbox ${this.size}` }, h("svg", { key: '4e5e6f6a206bd252a23da0f37f67d54c86371535', class: "checkmark", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 12 12", fill: "none" }, h("path", { key: '4d12110daeb6bdd396b7092a4abf72cb0ddc2cc1', d: "M2.5 7.25C2.5 7.25 3.25 7.25 4.25 9C4.25 9 7.02941 4.41667 9.5 3.5", stroke: "white", "stroke-width": "1.71429", "stroke-linecap": "round", "stroke-linejoin": "round" })))));
+        return (h("label", { key: '863b87de199f6266845138bb3f986880f560a5af', class: `checkbox-container ${this.size} ${this.disabled ? 'disabled' : ''}` }, h("input", { key: '6a29d6eb1dd48c16bd6f11154eee747eca2a300f', type: "checkbox", checked: this.checked, disabled: this.disabled }), h("span", { key: '51dc32583b065dce879f2753b7ff74ed153f45d8', class: `custom-checkbox ${this.size}` }, h("svg", { key: '4b2f1c37c4407bbe5bd0605c152cc2e9ea26342d', class: "checkmark", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 12 12", fill: "none" }, h("path", { key: 'd85472f5e44d68a94a350faa90cb35689be0e6c5', d: "M2.5 7.25C2.5 7.25 3.25 7.25 4.25 9C4.25 9 7.02941 4.41667 9.5 3.5", stroke: "white", "stroke-width": "1.71429", "stroke-linecap": "round", "stroke-linejoin": "round" })))));
     }
     static get is() { return "gb-tag-checkbox"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class GbTagClose {
     render() {
-        return (h("div", { key: '95597d9fe1d91f914f36a2d6c9504d9704566980', class: this.size }, h("svg", { key: '96c1e0fb4c7e9475f13a612994cd0b80fc5d0ebc', xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none" }, h("path", { key: 'c051e031584127ce05074a928c82dfd11b6f3c50', d: "M7.91683 2.08328L2.0835 7.91662M2.0835 2.08328L7.91683 7.91662", stroke: "#4B5565", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))));
+        return (h("div", { key: '7346137c01828efa01cef6fb407013f3a316ea72', class: this.size }, h("svg", { key: 'ef5377fd00aaacd0f029922881df2a0e7b363af5', xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none" }, h("path", { key: '0feb8ffb10afa1b5052a07091b45e298170575ed', d: "M7.91683 2.08328L2.0835 7.91662M2.0835 2.08328L7.91683 7.91662", stroke: "#4B5565", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))));
     }
     static get is() { return "gb-tag-close"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class GbTagCount {
     render() {
-        return (h("div", { key: '20822b230d55da7d6a0440e742be32c0a56692e9', class: this.size }, h("slot", { key: '27357d7922ea867d341f8e6e7813aaeaaf9e2247', name: "count" })));
+        return (h("div", { key: 'c50a261fb4ffe579568072f06972d7b78913efb0', class: this.size }, h("slot", { key: 'ad903ea750e1c276011056e91708a32d3b4aa8df', name: "count" })));
     }
     static get is() { return "gb-tag-count"; }
     static get encapsulation() { return "shadow"; }

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

@@ -186,14 +186,14 @@ export class GbTextareaInputField {
         }
     }
     render() {
-        return (h("div", { key: '0866bbc9c09e77315ce46f5f305339926acfd48a', class: "textarea_container" }, h("div", { key: '086f48fa064a5f1d2cf90c83a26620a95bd51cf5', class: "input_with_label" }, this.showLabel && h("p", { key: 'f13124e869f095684911b8a913540167ed2c119e', class: `label text-sm-medium` }, this.label), this.type === 'default' && (h("textarea", { key: '2a99a46d34f40f2b8a6f049552c662d101a2f981', ref: el => (this.textarea = el), onInput: () => this.handleInput(), class: `textarea default_textarea ${this.state} ${this.destructive ? 'destructive' : ''}`, placeholder: this.placeholderText, value: this.inputValue })), this.type === 'tags' && (h("div", { key: 'd2d48d15b01f29ebe2e9fac3f358c1e980665680', class: "textarea_tags" }, h("div", { key: '8c3ed6812fc2ecbf2cc2a610aa41053649cf5a40', class: `textarea ${this.type} ${this.state} ${this.destructive ? 'destructive' : ''}`, onClick: () => this.handleWrapperClick() }, h("div", { key: '9f66aed63f57c6ec417b2114c9e8907f85fb1130', class: `results_display ${this.state === 'disabled' ? 'disabled' : ''}`, ref: el => (this.resultsDisplayElement = el) }, this.value.length === 0 ? (h(Fragment, null, this.selectedItems.map((item, index) => (h(Fragment, null, typeof item === 'object' ? (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(index) }, h("p", { class: "text-xs-medium" }, item.objectName.split(' ')[0]), h("h1", { slot: "initials", class: "text-xxs-semi-bold" }, item.objectName
+        return (h("div", { key: '4dbafa4c41ef61f1e59c15f2c15c7cb11b285786', class: "textarea_container" }, h("div", { key: '5baf9bf9d73faf28380c3a47e3687295ef21cc73', class: "input_with_label" }, this.showLabel && h("p", { key: '96099fc0aa6c756bd691d3047653af583753e78b', class: `label text-sm-medium` }, this.label), this.type === 'default' && (h("textarea", { key: 'eeae81df53f5598dc7476e34084021f1e0156f46', ref: el => (this.textarea = el), onInput: () => this.handleInput(), class: `textarea default_textarea ${this.state} ${this.destructive ? 'destructive' : ''}`, placeholder: this.placeholderText, value: this.inputValue })), this.type === 'tags' && (h("div", { key: 'fa85a3d8a33aa142e9622e0a3569430a4a17ebfa', class: "textarea_tags" }, h("div", { key: '4845585d46e07fd87fc06f7c7884f80ee828cf0e', class: `textarea ${this.type} ${this.state} ${this.destructive ? 'destructive' : ''}`, onClick: () => this.handleWrapperClick() }, h("div", { key: 'e862c52a0675cda40874d351c8faae4781d7825a', class: `results_display ${this.state === 'disabled' ? 'disabled' : ''}`, ref: el => (this.resultsDisplayElement = el) }, this.value.length === 0 ? (h(Fragment, null, this.selectedItems.map((item, index) => (h(Fragment, null, typeof item === 'object' ? (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(index) }, h("p", { class: "text-xs-medium" }, item.objectName.split(' ')[0]), h("h1", { slot: "initials", class: "text-xxs-semi-bold" }, item.objectName
             .split(' ')
             .map(part => part.charAt(0).toUpperCase())
-            .join(''))))) : (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(index) }, h("p", { class: "text-xs-medium" }, item))))))))) : (h(Fragment, null, this.value.map((val, index) => (h(Fragment, null, typeof val === 'object' ? (h("gb-tag", { size: "sm", action: "X_close", icon: this.icon ? this.icon : 'avatar', onClick: () => this.handleTagRemove(index), key: index }, h("h1", { class: "text-xxs-semi-bold", slot: "initials" }, val.objectName.split(' ').map(part => part.charAt(0).toUpperCase())), h("p", null, val.objectName.split(' ')[0]))) : (h("gb-tag", { size: "sm", action: "X_close", icon: this.icon ? this.icon : 'avatar', onClick: () => this.handleTagRemove(index), key: index }, h("p", null, val)))))))), h("span", { key: '3ea59361073388582082c5a8a19eec9c2426abde', class: "hidden-span", ref: el => (this.hiddenSpan = el) }, this.inputValue || '  '), h("div", { key: 'c8d456920e458f0f8ca55cfd6c94589f96cf24bf', class: "input_field" }, h("input", { key: '8102429a04da1d6c05e7e924f850e4a9b636cf3a', id: this.idOfInput, class: `input_like text-md-regular ${this.state}`, type: "text",
+            .join(''))))) : (h("div", { class: "added_tag", key: index }, h("gb-tag", { size: "sm", icon: this.icon ? this.icon : 'avatar', action: "X_close", onClick: () => this.handleTagRemove(index) }, h("p", { class: "text-xs-medium" }, item))))))))) : (h(Fragment, null, this.value.map((val, index) => (h(Fragment, null, typeof val === 'object' ? (h("gb-tag", { size: "sm", action: "X_close", icon: this.icon ? this.icon : 'avatar', onClick: () => this.handleTagRemove(index), key: index }, h("h1", { class: "text-xxs-semi-bold", slot: "initials" }, val.objectName.split(' ').map(part => part.charAt(0).toUpperCase())), h("p", null, val.objectName.split(' ')[0]))) : (h("gb-tag", { size: "sm", action: "X_close", icon: this.icon ? this.icon : 'avatar', onClick: () => this.handleTagRemove(index), key: index }, h("p", null, val)))))))), h("span", { key: '072bdd1faa641aedee3f877150fd90cc1f7b5778', class: "hidden-span", ref: el => (this.hiddenSpan = el) }, this.inputValue || '  '), h("div", { key: '80f1ad69bbf64da67e22dd1ba94df24c86c3b2f7', class: "input_field" }, h("input", { key: 'f8fcac8ec87ee02362ac8c5bc806930f44d68a0e', id: this.idOfInput, class: `input_like text-md-regular ${this.state}`, type: "text",
             // placeholder={this.placeholderText}
-            value: this.inputValue, readOnly: this.isReadOnly, ref: el => (this.inputElement = el), onBlur: () => this.emitInputValue() }))), this.destructive && (h("div", { key: '80143c20d85cdf96837397f1bf3d2da64ade0da0', class: "help_icon" }, h("svg", { key: '916ffce2c1dcbf7dbb0b468a8516f9d9208ade74', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { key: '47121f72b98c8b7bffde9a861c253913b69137a0', d: "M7.9947 10H8.00069M8.00004 8.00004V5.33337M14.6667 8.00004C14.6667 11.6819 11.6819 14.6667 8.00004 14.6667C4.31814 14.6667 1.33337 11.6819 1.33337 8.00004C1.33337 4.31814 4.31814 1.33337 8.00004 1.33337C11.6819 1.33337 14.6667 4.31814 14.6667 8.00004Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), this.show && (h("div", { key: '151f92add10f11832588e99bebe6aa6e8998e31d', class: `dropdown_menu` }, this.results.map(item => (h("gb-input-dropdown-menu-item", { type: "checkbox", "supporting-text": true, state: StateEnum.Default, onClick: () => this.selectDropdownItem(item), selected: this.isTagItemSelected(item) }, typeof item === 'object'
+            value: this.inputValue, readOnly: this.isReadOnly, ref: el => (this.inputElement = el), onBlur: () => this.emitInputValue() }))), this.destructive && (h("div", { key: '2564bb1b2e1e1928ff5c7b54f8a44e3c74ead669', class: "help_icon" }, h("svg", { key: '3423e5bc2fb51458e471dd22f168beb5d8fd16f2', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { key: '30287b53edcf857546e5d51db4ffb53b72ded559', d: "M7.9947 10H8.00069M8.00004 8.00004V5.33337M14.6667 8.00004C14.6667 11.6819 11.6819 14.6667 8.00004 14.6667C4.31814 14.6667 1.33337 11.6819 1.33337 8.00004C1.33337 4.31814 4.31814 1.33337 8.00004 1.33337C11.6819 1.33337 14.6667 4.31814 14.6667 8.00004Z", stroke: "#B51726", "stroke-width": "1.33333", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), this.show && (h("div", { key: '1c7c3b59eed8f344fa0173bab4489d62b6692b3b', class: `dropdown_menu` }, this.results.map(item => (h("gb-input-dropdown-menu-item", { type: "checkbox", "supporting-text": true, state: StateEnum.Default, onClick: () => this.selectDropdownItem(item), selected: this.isTagItemSelected(item) }, typeof item === 'object'
             ? [h("p", { slot: "name" }, item.objectName), h("p", { slot: "supporting_text" }, item.objectValue)]
-            : typeof item !== 'object' && h("p", { slot: "name" }, item))))))))), this.showHintText && h("p", { key: '988c6eec09487fc3a6bf59846ba2be870e0be016', class: `hint_text text-sm-regular ${this.destructive ? 'destructive' : ''}` }, this.hintText)));
+            : typeof item !== 'object' && h("p", { slot: "name" }, item))))))))), this.showHintText && h("p", { key: 'fc10ba34cf901981932d2c9c704d0dc4ab94fdd6', class: `hint_text text-sm-regular ${this.destructive ? 'destructive' : ''}` }, this.hintText)));
     }
     static get is() { return "gb-textarea-input-field"; }
     static get encapsulation() { return "shadow"; }

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

@@ -16,7 +16,7 @@ export class GbThemeTab {
         const systemIconSrc = getAssetPath(`assets/laptop.svg`);
         const sunSrc = getAssetPath(`assets/sun-02.svg`);
         const moonSrc = getAssetPath(`assets/moon-02.svg`);
-        return (h("div", { key: '30ee07d37bbf5c180018db227467d59129d162b6', class: `theme_tab_div` }, h("div", { key: 'ce4d3424a24f49cff1ac708facead837340ada1a', class: "tab" }, h("gb-icon-button-base", { key: '766d1dc5f82ae66584a33a5f8183decd24991027', current: this.currentActiveTab === 'system' ? true : false, icon: systemIconSrc, label: "System", onClick: () => this.tabClicked('system') })), h("div", { key: '3eb3e2fc08fbdf2ac249aba178a21d83b15b7161', class: "tab" }, h("gb-icon-button-base", { key: '8b37b108f157b8c32d85dd451292f0329d533bcc', current: this.currentActiveTab === 'light' ? true : false, icon: sunSrc, label: "Light", onClick: () => this.tabClicked('light') })), h("div", { key: '7528d6d4abd0932028aac74d75f6de4d2c85b918', class: "tab" }, h("gb-icon-button-base", { key: '1e320d87e04b9cc3e64b417868b151a5350e3643', current: this.currentActiveTab === 'dark' ? true : false, icon: moonSrc, label: "Dark", onClick: () => this.tabClicked('dark') }))));
+        return (h("div", { key: 'c1e636f6e4ac46b16a6fbdf1f6528aeba8b549b6', class: `theme_tab_div` }, h("div", { key: 'e12a3d89a56b142719a34fdfde5312b30eb5ad99', class: "tab" }, h("gb-icon-button-base", { key: '38b1b6cfa2214a3da14afd1143e316c7fd71a9ba', current: this.currentActiveTab === 'system' ? true : false, icon: systemIconSrc, label: "System", onClick: () => this.tabClicked('system') })), h("div", { key: 'e1f44a875090767dca932cf1fef06257a1a78377', class: "tab" }, h("gb-icon-button-base", { key: '1f364b90277096b4cd6f3acf91c0f9347adf54b4', current: this.currentActiveTab === 'light' ? true : false, icon: sunSrc, label: "Light", onClick: () => this.tabClicked('light') })), h("div", { key: '2057280eb43b816cec4e4e3ba2a33492b51f9e0e', class: "tab" }, h("gb-icon-button-base", { key: '22e306ebc2f8cd3bc7999c752e219513969b40c5', current: this.currentActiveTab === 'dark' ? true : false, icon: moonSrc, label: "Dark", onClick: () => this.tabClicked('dark') }))));
     }
     static get is() { return "gb-theme-tab"; }
     static get encapsulation() { return "shadow"; }

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

@@ -25,7 +25,7 @@ export class GbToast {
     //   }, 5000);
     // }
     render() {
-        return (h("div", { key: 'ffaf17d459c4cd1751f1217051827022535f56f3', class: `toast_div ${this.internalColor} ${this.size} ${this.breakpoint}` }, this.size === 'floating' && (h(Fragment, null, h("div", { key: 'ed6ea6403e7fd44da459fb18f48673eaffd6b3b8', class: `icon_container` }, this.internalColor === 'success' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "29", viewBox: "0 0 28 29", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { opacity: "0.4", d: "M14.0666 2.24988H14.0665H13.9331H13.9331C11.3773 2.24986 9.36985 2.24985 7.80253 2.46057C6.19643 2.67651 4.92213 3.12805 3.9209 4.12928C2.91967 5.13051 2.46813 6.40481 2.2522 8.01091C2.04148 9.57822 2.04149 11.5857 2.0415 14.1415V14.1415V14.2749V14.2749C2.04149 16.8307 2.04148 18.8382 2.2522 20.4055C2.46813 22.0116 2.91967 23.2859 3.9209 24.2871C4.92213 25.2884 6.19643 25.7399 7.80253 25.9559C9.36985 26.1666 11.3773 26.1666 13.9331 26.1665H14.0665C16.6223 26.1666 18.6298 26.1666 20.1971 25.9559C21.8032 25.7399 23.0775 25.2884 24.0788 24.2871C25.08 23.2859 25.5315 22.0116 25.7475 20.4055C25.9582 18.8382 25.9582 16.8308 25.9582 14.2749V14.1415C25.9582 11.5857 25.9582 9.57822 25.7475 8.01091C25.5315 6.40481 25.08 5.13051 24.0788 4.12928C23.0775 3.12805 21.8032 2.67651 20.1971 2.46057C18.6298 2.24985 16.6224 2.24986 14.0666 2.24988Z", fill: "#079455" }), h("path", { d: "M19.2265 11.1487C19.7918 10.8396 19.9995 10.1307 19.6903 9.56536C19.3811 9.00004 18.6722 8.79238 18.1069 9.10154C15.9735 10.2683 14.2094 12.5199 13.0232 14.3362C12.5849 15.0074 12.2104 15.6429 11.9108 16.1812C11.6313 15.9101 11.3545 15.6747 11.1069 15.479C10.783 15.2228 10.4915 15.0208 10.2789 14.8816L9.91136 14.6534C9.35166 14.3342 8.63915 14.5291 8.31994 15.0888C8.0008 15.6484 8.19559 16.3607 8.75499 16.68L9.00033 16.8335C9.16695 16.9426 9.40042 17.1043 9.6598 17.3093C10.1936 17.7314 10.7696 18.2846 11.1321 18.8907C11.3546 19.2626 11.7649 19.4806 12.1977 19.4567C12.6303 19.4328 13.0142 19.1708 13.1944 18.7769L13.309 18.5372C13.388 18.3756 13.5063 18.1396 13.6603 17.8487C13.9689 17.2657 14.4176 16.4684 14.9769 15.612C16.1241 13.8554 17.6266 12.0237 19.2265 11.1487Z", fill: "#079455" }))) : this.color === 'error' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "29", viewBox: "0 0 28 29", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { opacity: "0.4", d: "M14.0665 2.49945C16.6224 2.49944 18.6298 2.49942 20.1971 2.71014C21.8032 2.92608 23.0775 3.37762 24.0788 4.37885C25.08 5.38008 25.5315 6.65438 25.7475 8.26048C25.9582 9.82779 25.9582 11.8352 25.9582 14.391V14.3911V14.5245V14.5245C25.9582 17.0803 25.9582 19.0878 25.7475 20.6551C25.5315 22.2612 25.08 23.5355 24.0788 24.5367C23.0775 25.538 21.8032 25.9895 20.1971 26.2054C18.6298 26.4161 16.6224 26.4161 14.0666 26.4161H14.0665H13.9331H13.9331C11.3773 26.4161 9.36984 26.4161 7.80253 26.2054C6.19643 25.9895 4.92213 25.538 3.9209 24.5367C2.91967 23.5355 2.46813 22.2612 2.2522 20.6551C2.04148 19.0878 2.04149 17.0803 2.0415 14.5245V14.3911C2.04149 11.8353 2.04148 9.8278 2.2522 8.26048C2.46813 6.65438 2.91967 5.38008 3.9209 4.37885C4.92213 3.37762 6.19643 2.92608 7.80253 2.71014C9.36985 2.49942 11.3773 2.49944 13.9331 2.49945H14.0665Z", fill: "#B51726" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.8335 19.7075C12.8335 19.0632 13.3535 18.5409 13.9949 18.5409H14.0054C14.6468 18.5409 15.1668 19.0632 15.1668 19.7075C15.1668 20.3519 14.6468 20.8742 14.0054 20.8742H13.9949C13.3535 20.8742 12.8335 20.3519 12.8335 19.7075Z", fill: "#B51726" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M14.0003 16.2075C13.356 16.2075 12.8336 15.6852 12.8336 15.0409L12.8336 10.3742C12.8336 9.72985 13.356 9.20752 14.0003 9.20752C14.6446 9.20752 15.167 9.72985 15.167 10.3742L15.167 15.0409C15.167 15.6852 14.6446 16.2075 14.0003 16.2075Z", fill: "#B51726" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "28", viewBox: "0 0 28 28", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { opacity: "0.4", d: "M14.0667 2.04163C16.6225 2.04161 18.63 2.0416 20.1973 2.25232C21.8034 2.46825 23.0777 2.91979 24.079 3.92102C25.0802 4.92226 25.5317 6.19655 25.7477 7.80265C25.9584 9.36996 25.9584 11.3774 25.9584 13.9332V13.9333V14.0667V14.0667C25.9584 16.6225 25.9584 18.63 25.7477 20.1973C25.5317 21.8034 25.0802 23.0777 24.079 24.0789C23.0777 25.0801 21.8034 25.5317 20.1973 25.7476C18.63 25.9583 16.6226 25.9583 14.0668 25.9583H14.0667H13.9333H13.9333C11.3775 25.9583 9.37003 25.9583 7.80271 25.7476C6.19661 25.5317 4.92232 25.0801 3.92109 24.0789C2.91985 23.0777 2.46831 21.8034 2.25238 20.1973C2.04166 18.6299 2.04167 16.6225 2.04169 14.0667V13.9333C2.04167 11.3774 2.04166 9.36997 2.25238 7.80265C2.46831 6.19655 2.91985 4.92226 3.92109 3.92102C4.92232 2.91979 6.19661 2.46825 7.80271 2.25232C9.37003 2.0416 11.3775 2.04161 13.9333 2.04163H14.0667Z", fill: "#4B5565" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.6289 12.2818C13.9171 12.3206 14.3158 12.4243 14.6541 12.7626C14.9924 13.101 15.0962 13.4997 15.1349 13.7879C15.167 14.0266 15.1669 14.3043 15.1667 14.5375C15.1667 14.553 15.1667 14.5683 15.1667 14.5834V19.2501C15.1667 19.8944 14.6444 20.4167 14 20.4167C13.3557 20.4167 12.8334 19.8944 12.8334 19.2501V14.5834C12.189 14.5834 11.6667 14.0611 11.6667 13.4167C11.6667 12.7724 12.189 12.2501 12.8334 12.2501C12.8485 12.2501 12.8638 12.2501 12.8793 12.2501C13.1125 12.2499 13.3901 12.2497 13.6289 12.2818Z", fill: "#4B5565" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.8333 8.75004C12.8333 8.10571 13.3533 7.58337 13.9947 7.58337H14.0051C14.6466 7.58337 15.1666 8.10571 15.1666 8.75004C15.1666 9.39437 14.6466 9.91671 14.0051 9.91671H13.9947C13.3533 9.91671 12.8333 9.39437 12.8333 8.75004Z", fill: "#4B5565" })))), h("div", { key: 'ac9a7d311cb3952e30ce787cced1d6c3c893b110', class: `content ${this.size} ${this.actions ? ' actions' : ''}` }, h("div", { key: 'bf30f33675ee2d18cb6fc4533cfb09182b15390d', class: `text ${this.size}` }, h("p", { key: '97b6dcf277c64ca241382cb50edc2d7785ae7c8d', class: `text-sm-semi-bold main_text_${this.internalColor}` }, this.mainText), this.showSupportingText && h("p", { key: '9122fc2fa08002087918eac77bcb17daf2ed5e1a', class: `text-xs-regular supporting_text_${this.internalColor}` }, this.supportingText)), this.actions && (h("div", { key: '8a13d1bc26b1ebd7ed5a63743812d111d107d97c', class: `actions ${this.size} ${!this.showSupportingText ? 'only_actions' : ''}` }, this.color === 'default' ? (h(Fragment, null, h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_gray" }, h("p", null, "Dismiss")), h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_color" }, h("p", null, "View changes")))) : (h(Fragment, null, h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, "Dismiss")), h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, "View changes"))))))), h("gb-button-close", { key: 'c8cfabd475d370c41c5ca5684642b266b1f1b37a', size: "sm", color: this.internalColor === 'default' ? 'gray' : this.internalColor === 'gray' ? 'gray' : this.internalColor, class: `close_button ${this.size}`, onClick: () => this.closeToast() }))), this.size === 'full_width' && (h("div", { key: 'f2f709c6d7aca5278d5358b44a3c2b743de8e68f', class: `container ${this.breakpoint}` }, h("div", { key: '3861da85181338b279e43f98f22e848bb729d307', class: `full_width_content ${this.breakpoint}` }, h("div", { key: '2524e7cc77dcc3a352c9ee615a4907e68847d8e2', class: `inner_content ${this.breakpoint}` }, h("div", { key: '5c82a6876958c042fcd34f9daa1c2e63c39f9b27', class: `icon_container` }, h("svg", { key: '1682e2c5b20715c03e37d136dee08ccc43d3cf2a', xmlns: "http://www.w3.org/2000/svg", width: "28", height: "28", viewBox: "0 0 28 28", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { key: 'e7c42a206c25774e02267dfefce4d8690f9113e4', opacity: "0.4", d: "M14.0667 2.04163C16.6225 2.04161 18.63 2.0416 20.1973 2.25232C21.8034 2.46825 23.0777 2.91979 24.079 3.92102C25.0802 4.92226 25.5317 6.19655 25.7477 7.80265C25.9584 9.36996 25.9584 11.3774 25.9584 13.9332V13.9333V14.0667V14.0667C25.9584 16.6225 25.9584 18.63 25.7477 20.1973C25.5317 21.8034 25.0802 23.0777 24.079 24.0789C23.0777 25.0801 21.8034 25.5317 20.1973 25.7476C18.63 25.9583 16.6226 25.9583 14.0668 25.9583H14.0667H13.9333H13.9333C11.3775 25.9583 9.37003 25.9583 7.80271 25.7476C6.19661 25.5317 4.92232 25.0801 3.92109 24.0789C2.91985 23.0777 2.46831 21.8034 2.25238 20.1973C2.04166 18.6299 2.04167 16.6225 2.04169 14.0667V13.9333C2.04167 11.3774 2.04166 9.36997 2.25238 7.80265C2.46831 6.19655 2.91985 4.92226 3.92109 3.92102C4.92232 2.91979 6.19661 2.46825 7.80271 2.25232C9.37003 2.0416 11.3775 2.04161 13.9333 2.04163H14.0667Z", fill: "#4B5565" }), h("path", { key: '3480201e07e1440c819f967541ddceb72e3bb4b8', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.6289 12.2818C13.9171 12.3206 14.3158 12.4243 14.6541 12.7626C14.9924 13.101 15.0962 13.4997 15.1349 13.7879C15.167 14.0266 15.1669 14.3043 15.1667 14.5375C15.1667 14.553 15.1667 14.5683 15.1667 14.5834V19.2501C15.1667 19.8944 14.6444 20.4167 14 20.4167C13.3557 20.4167 12.8334 19.8944 12.8334 19.2501V14.5834C12.189 14.5834 11.6667 14.0611 11.6667 13.4167C11.6667 12.7724 12.189 12.2501 12.8334 12.2501C12.8485 12.2501 12.8638 12.2501 12.8793 12.2501C13.1125 12.2499 13.3901 12.2497 13.6289 12.2818Z", fill: "#4B5565" }), h("path", { key: '33f9cd20a0228402d967781eb500dec000c8dcdb', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.8333 8.75004C12.8333 8.10571 13.3533 7.58337 13.9947 7.58337H14.0051C14.6466 7.58337 15.1666 8.10571 15.1666 8.75004C15.1666 9.39437 14.6466 9.91671 14.0051 9.91671H13.9947C13.3533 9.91671 12.8333 9.39437 12.8333 8.75004Z", fill: "#4B5565" }))), h("div", { key: '54feb2f01e7384b2e843530e27597d0885aae59a', class: `text ${this.size} ${this.breakpoint}` }, h("p", { key: '2f8fb4500bb9ab4e79e77090c07559eefb5e16bb', class: `text-sm-semi-bold main_text_${this.internalColor}` }, this.mainText), this.showSupportingText && h("p", { key: 'dd14d5c17f964fbd396b239f416e6f966182c031', class: `text-xs-regular supporting_text_${this.internalColor}` }, this.supportingText))), this.actions && (h("div", { key: '983a7269f6299c883263e39cf59f876400c4db1a', class: `actions ${this.size} ${this.breakpoint} ${!this.showSupportingText ? 'only_actions' : ''}` }, this.color === 'default' ? (h(Fragment, null, h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_gray" }, h("p", null, "Dismiss")), h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_color" }, h("p", null, "View changes")))) : (h(Fragment, null, h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, "Dismiss")), h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, "View changes")))))), h("gb-button-close", { key: '7024e4900a30af4feb02cff137bfcb41be7b01d4', size: "sm", color: this.internalColor === 'default' ? 'gray' : this.internalColor === 'gray' ? 'gray' : this.internalColor, class: `close_button ${this.breakpoint}`, onClick: () => this.closeToast() }))))));
+        return (h("div", { key: '0132a0efa2b08836c88c3cb66ed1e66c5510ac24', class: `toast_div ${this.internalColor} ${this.size} ${this.breakpoint}` }, this.size === 'floating' && (h(Fragment, null, h("div", { key: '1f0ce05402b9a7df8469bb68ba4bc0567aa9c1a5', class: `icon_container` }, this.internalColor === 'success' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "29", viewBox: "0 0 28 29", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { opacity: "0.4", d: "M14.0666 2.24988H14.0665H13.9331H13.9331C11.3773 2.24986 9.36985 2.24985 7.80253 2.46057C6.19643 2.67651 4.92213 3.12805 3.9209 4.12928C2.91967 5.13051 2.46813 6.40481 2.2522 8.01091C2.04148 9.57822 2.04149 11.5857 2.0415 14.1415V14.1415V14.2749V14.2749C2.04149 16.8307 2.04148 18.8382 2.2522 20.4055C2.46813 22.0116 2.91967 23.2859 3.9209 24.2871C4.92213 25.2884 6.19643 25.7399 7.80253 25.9559C9.36985 26.1666 11.3773 26.1666 13.9331 26.1665H14.0665C16.6223 26.1666 18.6298 26.1666 20.1971 25.9559C21.8032 25.7399 23.0775 25.2884 24.0788 24.2871C25.08 23.2859 25.5315 22.0116 25.7475 20.4055C25.9582 18.8382 25.9582 16.8308 25.9582 14.2749V14.1415C25.9582 11.5857 25.9582 9.57822 25.7475 8.01091C25.5315 6.40481 25.08 5.13051 24.0788 4.12928C23.0775 3.12805 21.8032 2.67651 20.1971 2.46057C18.6298 2.24985 16.6224 2.24986 14.0666 2.24988Z", fill: "#079455" }), h("path", { d: "M19.2265 11.1487C19.7918 10.8396 19.9995 10.1307 19.6903 9.56536C19.3811 9.00004 18.6722 8.79238 18.1069 9.10154C15.9735 10.2683 14.2094 12.5199 13.0232 14.3362C12.5849 15.0074 12.2104 15.6429 11.9108 16.1812C11.6313 15.9101 11.3545 15.6747 11.1069 15.479C10.783 15.2228 10.4915 15.0208 10.2789 14.8816L9.91136 14.6534C9.35166 14.3342 8.63915 14.5291 8.31994 15.0888C8.0008 15.6484 8.19559 16.3607 8.75499 16.68L9.00033 16.8335C9.16695 16.9426 9.40042 17.1043 9.6598 17.3093C10.1936 17.7314 10.7696 18.2846 11.1321 18.8907C11.3546 19.2626 11.7649 19.4806 12.1977 19.4567C12.6303 19.4328 13.0142 19.1708 13.1944 18.7769L13.309 18.5372C13.388 18.3756 13.5063 18.1396 13.6603 17.8487C13.9689 17.2657 14.4176 16.4684 14.9769 15.612C16.1241 13.8554 17.6266 12.0237 19.2265 11.1487Z", fill: "#079455" }))) : this.color === 'error' ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "29", viewBox: "0 0 28 29", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { opacity: "0.4", d: "M14.0665 2.49945C16.6224 2.49944 18.6298 2.49942 20.1971 2.71014C21.8032 2.92608 23.0775 3.37762 24.0788 4.37885C25.08 5.38008 25.5315 6.65438 25.7475 8.26048C25.9582 9.82779 25.9582 11.8352 25.9582 14.391V14.3911V14.5245V14.5245C25.9582 17.0803 25.9582 19.0878 25.7475 20.6551C25.5315 22.2612 25.08 23.5355 24.0788 24.5367C23.0775 25.538 21.8032 25.9895 20.1971 26.2054C18.6298 26.4161 16.6224 26.4161 14.0666 26.4161H14.0665H13.9331H13.9331C11.3773 26.4161 9.36984 26.4161 7.80253 26.2054C6.19643 25.9895 4.92213 25.538 3.9209 24.5367C2.91967 23.5355 2.46813 22.2612 2.2522 20.6551C2.04148 19.0878 2.04149 17.0803 2.0415 14.5245V14.3911C2.04149 11.8353 2.04148 9.8278 2.2522 8.26048C2.46813 6.65438 2.91967 5.38008 3.9209 4.37885C4.92213 3.37762 6.19643 2.92608 7.80253 2.71014C9.36985 2.49942 11.3773 2.49944 13.9331 2.49945H14.0665Z", fill: "#B51726" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.8335 19.7075C12.8335 19.0632 13.3535 18.5409 13.9949 18.5409H14.0054C14.6468 18.5409 15.1668 19.0632 15.1668 19.7075C15.1668 20.3519 14.6468 20.8742 14.0054 20.8742H13.9949C13.3535 20.8742 12.8335 20.3519 12.8335 19.7075Z", fill: "#B51726" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M14.0003 16.2075C13.356 16.2075 12.8336 15.6852 12.8336 15.0409L12.8336 10.3742C12.8336 9.72985 13.356 9.20752 14.0003 9.20752C14.6446 9.20752 15.167 9.72985 15.167 10.3742L15.167 15.0409C15.167 15.6852 14.6446 16.2075 14.0003 16.2075Z", fill: "#B51726" }))) : (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "28", viewBox: "0 0 28 28", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { opacity: "0.4", d: "M14.0667 2.04163C16.6225 2.04161 18.63 2.0416 20.1973 2.25232C21.8034 2.46825 23.0777 2.91979 24.079 3.92102C25.0802 4.92226 25.5317 6.19655 25.7477 7.80265C25.9584 9.36996 25.9584 11.3774 25.9584 13.9332V13.9333V14.0667V14.0667C25.9584 16.6225 25.9584 18.63 25.7477 20.1973C25.5317 21.8034 25.0802 23.0777 24.079 24.0789C23.0777 25.0801 21.8034 25.5317 20.1973 25.7476C18.63 25.9583 16.6226 25.9583 14.0668 25.9583H14.0667H13.9333H13.9333C11.3775 25.9583 9.37003 25.9583 7.80271 25.7476C6.19661 25.5317 4.92232 25.0801 3.92109 24.0789C2.91985 23.0777 2.46831 21.8034 2.25238 20.1973C2.04166 18.6299 2.04167 16.6225 2.04169 14.0667V13.9333C2.04167 11.3774 2.04166 9.36997 2.25238 7.80265C2.46831 6.19655 2.91985 4.92226 3.92109 3.92102C4.92232 2.91979 6.19661 2.46825 7.80271 2.25232C9.37003 2.0416 11.3775 2.04161 13.9333 2.04163H14.0667Z", fill: "#4B5565" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.6289 12.2818C13.9171 12.3206 14.3158 12.4243 14.6541 12.7626C14.9924 13.101 15.0962 13.4997 15.1349 13.7879C15.167 14.0266 15.1669 14.3043 15.1667 14.5375C15.1667 14.553 15.1667 14.5683 15.1667 14.5834V19.2501C15.1667 19.8944 14.6444 20.4167 14 20.4167C13.3557 20.4167 12.8334 19.8944 12.8334 19.2501V14.5834C12.189 14.5834 11.6667 14.0611 11.6667 13.4167C11.6667 12.7724 12.189 12.2501 12.8334 12.2501C12.8485 12.2501 12.8638 12.2501 12.8793 12.2501C13.1125 12.2499 13.3901 12.2497 13.6289 12.2818Z", fill: "#4B5565" }), h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.8333 8.75004C12.8333 8.10571 13.3533 7.58337 13.9947 7.58337H14.0051C14.6466 7.58337 15.1666 8.10571 15.1666 8.75004C15.1666 9.39437 14.6466 9.91671 14.0051 9.91671H13.9947C13.3533 9.91671 12.8333 9.39437 12.8333 8.75004Z", fill: "#4B5565" })))), h("div", { key: '0ca1e8167ed90bdd8d6fa915c667a8d62d8113e3', class: `content ${this.size} ${this.actions ? ' actions' : ''}` }, h("div", { key: '59290b792fe1ad929be4ea13ac85101fb182d84c', class: `text ${this.size}` }, h("p", { key: '0fb92e8cb6ee42a7d7515207318d926bba4d7ab0', class: `text-sm-semi-bold main_text_${this.internalColor}` }, this.mainText), this.showSupportingText && h("p", { key: 'e7e93247db079df983e0d0aba8f9e2d357bba8cd', class: `text-xs-regular supporting_text_${this.internalColor}` }, this.supportingText)), this.actions && (h("div", { key: '9ef9d96c9217c3d48508ab73bcc02c36559a0716', class: `actions ${this.size} ${!this.showSupportingText ? 'only_actions' : ''}` }, this.color === 'default' ? (h(Fragment, null, h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_gray" }, h("p", null, "Dismiss")), h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_color" }, h("p", null, "View changes")))) : (h(Fragment, null, h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, "Dismiss")), h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, "View changes"))))))), h("gb-button-close", { key: '76fdbe5999d878cf0339dffb662cbbeec8792e8c', size: "sm", color: this.internalColor === 'default' ? 'gray' : this.internalColor === 'gray' ? 'gray' : this.internalColor, class: `close_button ${this.size}`, onClick: () => this.closeToast() }))), this.size === 'full_width' && (h("div", { key: 'b3131451257ab545c29b93153f84b5750e7d9a6a', class: `container ${this.breakpoint}` }, h("div", { key: '2713b60562c6625bbe01757b58b6d36eb45e73a9', class: `full_width_content ${this.breakpoint}` }, h("div", { key: 'fb92b7302686726e4313f48e96f9c700990e236b', class: `inner_content ${this.breakpoint}` }, h("div", { key: 'b9d42a6357b6605f73c6511666c77ace7b072403', class: `icon_container` }, h("svg", { key: 'fb506241eb6a729dc3f9a79f14dd6ffa6f7813f3', xmlns: "http://www.w3.org/2000/svg", width: "28", height: "28", viewBox: "0 0 28 28", fill: "none", class: `svg_icon ${this.internalColor}` }, h("path", { key: '32479620bde45ea74f460ab23abe39a99b9c43c6', opacity: "0.4", d: "M14.0667 2.04163C16.6225 2.04161 18.63 2.0416 20.1973 2.25232C21.8034 2.46825 23.0777 2.91979 24.079 3.92102C25.0802 4.92226 25.5317 6.19655 25.7477 7.80265C25.9584 9.36996 25.9584 11.3774 25.9584 13.9332V13.9333V14.0667V14.0667C25.9584 16.6225 25.9584 18.63 25.7477 20.1973C25.5317 21.8034 25.0802 23.0777 24.079 24.0789C23.0777 25.0801 21.8034 25.5317 20.1973 25.7476C18.63 25.9583 16.6226 25.9583 14.0668 25.9583H14.0667H13.9333H13.9333C11.3775 25.9583 9.37003 25.9583 7.80271 25.7476C6.19661 25.5317 4.92232 25.0801 3.92109 24.0789C2.91985 23.0777 2.46831 21.8034 2.25238 20.1973C2.04166 18.6299 2.04167 16.6225 2.04169 14.0667V13.9333C2.04167 11.3774 2.04166 9.36997 2.25238 7.80265C2.46831 6.19655 2.91985 4.92226 3.92109 3.92102C4.92232 2.91979 6.19661 2.46825 7.80271 2.25232C9.37003 2.0416 11.3775 2.04161 13.9333 2.04163H14.0667Z", fill: "#4B5565" }), h("path", { key: '81e31580cf771b1a7806618aff10a7371dd747ad', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M13.6289 12.2818C13.9171 12.3206 14.3158 12.4243 14.6541 12.7626C14.9924 13.101 15.0962 13.4997 15.1349 13.7879C15.167 14.0266 15.1669 14.3043 15.1667 14.5375C15.1667 14.553 15.1667 14.5683 15.1667 14.5834V19.2501C15.1667 19.8944 14.6444 20.4167 14 20.4167C13.3557 20.4167 12.8334 19.8944 12.8334 19.2501V14.5834C12.189 14.5834 11.6667 14.0611 11.6667 13.4167C11.6667 12.7724 12.189 12.2501 12.8334 12.2501C12.8485 12.2501 12.8638 12.2501 12.8793 12.2501C13.1125 12.2499 13.3901 12.2497 13.6289 12.2818Z", fill: "#4B5565" }), h("path", { key: '972422efc0fc6a06d1e2668ec9e515d183ae8285', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.8333 8.75004C12.8333 8.10571 13.3533 7.58337 13.9947 7.58337H14.0051C14.6466 7.58337 15.1666 8.10571 15.1666 8.75004C15.1666 9.39437 14.6466 9.91671 14.0051 9.91671H13.9947C13.3533 9.91671 12.8333 9.39437 12.8333 8.75004Z", fill: "#4B5565" }))), h("div", { key: 'ad6d4821003057dced0259975ff3af17cae1db72', class: `text ${this.size} ${this.breakpoint}` }, h("p", { key: '70aed7d6c0be288fee91a82e81da22bc72d200b1', class: `text-sm-semi-bold main_text_${this.internalColor}` }, this.mainText), this.showSupportingText && h("p", { key: '00724bb77590c608def1a8ef0fc09b1dce650167', class: `text-xs-regular supporting_text_${this.internalColor}` }, this.supportingText))), this.actions && (h("div", { key: 'b28067063844e90799899eb410036c442dbb0bc1', class: `actions ${this.size} ${this.breakpoint} ${!this.showSupportingText ? 'only_actions' : ''}` }, this.color === 'default' ? (h(Fragment, null, h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_gray" }, h("p", null, "Dismiss")), h("gb-button", { size: "sm", icon: "default", state: "default", hierarchy: "link_color" }, h("p", null, "View changes")))) : (h(Fragment, null, h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, "Dismiss")), h("gb-toast-button", { state: StateEnum.Default, color: this.internalColor }, h("p", null, "View changes")))))), h("gb-button-close", { key: '20f3879ea75124d27fa944b875beac8c9029b45a', size: "sm", color: this.internalColor === 'default' ? 'gray' : this.internalColor === 'gray' ? 'gray' : this.internalColor, class: `close_button ${this.breakpoint}`, onClick: () => this.closeToast() }))))));
     }
     static get is() { return "gb-toast"; }
     static get encapsulation() { return "shadow"; }

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

@@ -5,7 +5,7 @@ export class GbToastButton {
         slottedContent.classList.add('text-sm-semi-bold');
     }
     render() {
-        return (h("div", { key: '80df69aad2acb4e4d66c2725bede75369fe61a42', class: `toast_button ${this.state} ${this.color}` }, h("slot", { key: '0567d4fdb3423e897bfcec6d75d030eff73caaf7' })));
+        return (h("div", { key: 'ed52f363505468d0bd98703dc9b73a6ebfc35d87', class: `toast_button ${this.state} ${this.color}` }, h("slot", { key: '01350ec203039e133752b203add694cdb31174ed' })));
     }
     static get is() { return "gb-toast-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -34,7 +34,7 @@ export class GbToggle {
         }
     }
     render() {
-        return (h("div", { key: '6361af7ff370108d1d25f229e7ab6b2f3fad03d1', class: `toggle_div ${this.size}` }, h("div", { key: 'ccc4d4be2a2d6a7a71899d8c9d3098215a036778', class: "toggle_base" }, h("gb-toggle-base", { key: 'e5295f41d2426e5272645ff38ad75c2fe24061d9', size: this.size, state: this.state, pressed: this.pressed })), this.text && (h("div", { key: '645bcb56dba32608a2c4b580a8c6984d69f792c8', class: "text" }, h("slot", { key: '8715841a36b271ca3fe69282273e41e0981beefa', name: "main_text" }), this.supportingText && (h("slot", { key: '3456846e4f58cf189f399a9817b35d9f2c2d0725', name: "supporting_text" }))))));
+        return (h("div", { key: '086549f1c6c6dd3f515633ebec93567b207cc30e', class: `toggle_div ${this.size}` }, h("div", { key: '75708d3ebc0865f20e2f0eb00509aa01e24e4593', class: "toggle_base" }, h("gb-toggle-base", { key: '8265e890bcf73917014ad93dddd053f43499a319', size: this.size, state: this.state, pressed: this.pressed })), this.text && (h("div", { key: 'cc120d875f6f5e58c044f4b6dd650140f66a070e', class: "text" }, h("slot", { key: 'dcdd5e3b8c8794415ee4aafc5152bf0c176b5673', name: "main_text" }), this.supportingText && (h("slot", { key: '18933821bbadab281c6dd7dc448127d8cdc24138', name: "supporting_text" }))))));
     }
     static get is() { return "gb-toggle"; }
     static get encapsulation() { return "shadow"; }

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

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

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

@@ -5,7 +5,7 @@ export class GbTokenFieldCompact {
         this.supportingText = '';
     }
     render() {
-        return (h("div", { key: '5f9ca6e1190c42fc4d51dc60d002c57e1005ca62', class: this.size }, h("div", { key: 'c80fefdd4bd477df41ebae86b6a98bd17c31f081', class: "input-with-label" }, this.showLabel && (h("label", { key: '25fe76928b8ccd43691f5e993f3b8480869c7c6a' }, this.label)), this.digits === 4 && (h("div", { key: 'f2d9e6be6d59df6c2a90cdb040d57382628613be', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: 'ea5fb2c1a11bbf06df573ad01183b038f7d763a6', size: this.size }), h("gb-mega-input-field-base", { key: '1365e2f1bdcc3f5da174eb3581f5d20cc8e1751c', size: this.size }), h("gb-mega-input-field-base", { key: '1fffc4a25df87298c7b1587a0200b4986d476341', size: this.size }), h("gb-mega-input-field-base", { key: 'b84cb73c0fbdda2704b7b96c8cca44298b9848f8', size: this.size }))), this.digits === 6 && (h("div", { key: '4714c625dc8c90e1ec7cc9626c0b04f49c180b67', class: "input-wrapper" }, h("div", { key: '52e784f4afd5fff8a787db88f364759cf7663da5', class: "first=section" }, h("gb-mega-input-field-base", { key: '9868e85a0678fd898d84694c13204dfdd52697a6', size: this.size }), h("gb-mega-input-field-base", { key: '824b4cb12a7f2c60ee6149f6a431da998a87d0dd', size: this.size }), h("gb-mega-input-field-base", { key: 'c7627194ce606bb770a24cdeffebc66ab891174c', size: this.size })), h("div", { key: '256578fd2436ae7a1802b19a4339749959dbdfef', class: "second=section" }, h("gb-mega-input-field-base", { key: '7a07557957386b1c0eef1bb86cebeaffbd464d9a', size: this.size }), h("gb-mega-input-field-base", { key: 'af1ca9c558dda3ee4923af6b12e4ad43e7371e6c', size: this.size }), h("gb-mega-input-field-base", { key: '412b6664c9159580b192111e8363ed0f07e17e0d', size: this.size })))), this.digits === 8 && (h("div", { key: '6ba911157febb5c86956910484885d91b6b6e2c8', class: "input-wrapper" }, h("div", { key: '7c31143e9d39ec378df9ec9e7793ae34a893a1ad', class: "first=section" }, h("gb-mega-input-field-base", { key: '5614a2553a74bd834e07324770b0b939416b96a5', size: this.size }), h("gb-mega-input-field-base", { key: 'd07ef792bf4cef6a6a31eb3cb5c2eec1768e87a9', size: this.size }), h("gb-mega-input-field-base", { key: '9c11b4433ab0ab48674d14afddf8fa73ea3c6f8f', size: this.size }), h("gb-mega-input-field-base", { key: 'cd6dfe9d6f7db158589e907f3aba04e26c8556a4', size: this.size })), h("div", { key: 'd8d3bbb9299a6e2765b9835e44f2a954716a3cae', class: "second=section" }, h("gb-mega-input-field-base", { key: 'ad93484427290968d7cc212e9ac9d25d002c654f', size: this.size }), h("gb-mega-input-field-base", { key: 'a70c9bbe8533758d49821749290e761ff4ee2f87', size: this.size }), h("gb-mega-input-field-base", { key: 'c188c5f6c94d2b767cf9abd826376de366ae7509', size: this.size }), h("gb-mega-input-field-base", { key: '58cc75839aa6d4c889ffa549defd5bffbf6d8839', size: this.size }))))), h("p", { key: '0e2a39116cff212a71fc753b511405a32a8e3b6b' }, this.supportingText)));
+        return (h("div", { key: 'b7278d7a2086f88cad44b96626f0b19a25f1099c', class: this.size }, h("div", { key: 'f375b9867b5fd17ddf6d229c5ae99523fa49c39d', class: "input-with-label" }, this.showLabel && (h("label", { key: '029d228d7fc0ef3970b63b42ea1b94ae14169fc5' }, this.label)), this.digits === 4 && (h("div", { key: 'c3f21c261a7f93035a76e493eadf53fe7c0e1a76', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: '2ce6299e47c202b9d5d8d3f78652911e30813c8f', size: this.size }), h("gb-mega-input-field-base", { key: 'e7a0bbd4867aa8f033a8f545374547289cae2003', size: this.size }), h("gb-mega-input-field-base", { key: 'bd2f8da8a352797bcf8c4dbacc314ae97ab875d4', size: this.size }), h("gb-mega-input-field-base", { key: 'c85940522a4d05723c4250234dee05f5475890b8', size: this.size }))), this.digits === 6 && (h("div", { key: '12257454f81d02ca61647e37b7b9b897c3c14f9f', class: "input-wrapper" }, h("div", { key: '47868f5447bebceaed9e56ddcaa8d08c8ee2dbb3', class: "first=section" }, h("gb-mega-input-field-base", { key: 'fcae49b31e9f03f6eef0d9ed3e3a27c208433284', size: this.size }), h("gb-mega-input-field-base", { key: '530d38aca4daede0af9c9d762d73cdc66859d7ad', size: this.size }), h("gb-mega-input-field-base", { key: 'e0d9fe5d4f8cac686ee1312aa53145e4ff54fd4d', size: this.size })), h("div", { key: '42907478d3124af2565c94b3dd2ce5df7154854b', class: "second=section" }, h("gb-mega-input-field-base", { key: '18397a72ab0faa7f8ae88d72a7d336ddf3edc195', size: this.size }), h("gb-mega-input-field-base", { key: 'e982f71f99ea896ac32f8cfd191ba87e6dcd1efc', size: this.size }), h("gb-mega-input-field-base", { key: 'c4c10d9f79c2a99d4bf0544f0d6302a2d88b56fc', size: this.size })))), this.digits === 8 && (h("div", { key: 'ce3a934d06bc9362c302fbf3462cf1d5a359258c', class: "input-wrapper" }, h("div", { key: '194a97a5c9bb5d76c6a8f1a3d3823b041a8f12ec', class: "first=section" }, h("gb-mega-input-field-base", { key: '87e7ceb551c5609c1e21e3cd8293828b80f46f66', size: this.size }), h("gb-mega-input-field-base", { key: '9e29d50f2f9665f4389c98418e58a0fe1a76080d', size: this.size }), h("gb-mega-input-field-base", { key: 'a5651d3130a91158e7c54ff649eba677895c12d9', size: this.size }), h("gb-mega-input-field-base", { key: '1f667458f5b33cf8fbb75462961b4ab943d7b335', size: this.size })), h("div", { key: 'e27cc9f3b151387f26672faa57032638bb6c4226', class: "second=section" }, h("gb-mega-input-field-base", { key: 'd4f5a1c29aebeac64d26549b1f8011d08d73611e', size: this.size }), h("gb-mega-input-field-base", { key: 'b2feeb56a564f7cac8b5127d280d8c53cba2e47c', size: this.size }), h("gb-mega-input-field-base", { key: '68d51aa6a34c2bff831b792468ed74fc33b5a4dd', size: this.size }), h("gb-mega-input-field-base", { key: 'df3bbceeef320ed2e5c451a3dfed173b9b4a3911', size: this.size }))))), h("p", { key: '9069962c469f80d6980e92307493e2df1dd35e94' }, this.supportingText)));
     }
     static get is() { return "gb-token-field-compact"; }
     static get encapsulation() { return "shadow"; }

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

@@ -5,11 +5,11 @@ export class GbTokenFieldCompressed {
         this.hintText = '';
     }
     render() {
-        return (h("div", { key: '1a4407594907d92159364540f59cbf3412eee78b', class: {
+        return (h("div", { key: '0c6190f80461b5cf88aeead509cdfd7c8e4bbc16', class: {
                 container: true,
                 [this.size]: true,
                 [this.digits]: true,
-            } }, h("div", { key: '9b4d86f4ecb0dd22a752b161e3a2053e8f4e4b5f', class: "input-with-label" }, this.showLabel && (h("label", { key: 'f06c7d489d086489e4335d0627ac588d55f52c54', class: "text-sm-medium", style: { color: 'var(--color-text, #4B5565)' } }, this.label)), this.digits === 4 && (h("div", { key: '6867817572e311841b3f5d9a7afbe90177362704', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: '8150c8f28765c7a171d488c6447a0e17b5405ad6', size: this.size }), h("gb-mega-input-field-base", { key: 'bbe76072b5d8b02e90621fd33822bad05c41fffa', size: this.size }), h("gb-mega-input-field-base", { key: '47f4e6d876e885acf89d4f4a77b5d7861dbddc2b', size: this.size }), h("gb-mega-input-field-base", { key: '5904ce55b34c76779fa09bf98a2662cd194e7f33', size: this.size }))), this.digits === 6 && (h("div", { key: 'aafb103b697fdd071b53316c3008ec28a1a93e36', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: '946d10b722b11246ea1c5b87e2b876c2e4269233', size: this.size }), h("gb-mega-input-field-base", { key: '45c462fbee758adf65eedb1c1539416ec81fe25b', size: this.size }), h("gb-mega-input-field-base", { key: 'f70db54775555e3c95a2dc91c473014f51bcfacd', size: this.size }), h("p", { key: 'a0213b0e2b3749d77a90f009c300b331e242980e', class: "line display-sm-bold" }, "-"), h("gb-mega-input-field-base", { key: 'aa24006fc041a6beb14dfe1e8e2c2b46b16d00ee', size: this.size }), h("gb-mega-input-field-base", { key: '784a48d93797c21fa146e3531817e7d568a3fa5a', size: this.size }), h("gb-mega-input-field-base", { key: 'c4b4d6e40e08ea0b16274b6fff1938bdbe90522b', size: this.size }))), this.digits === 8 && (h("div", { key: 'ded34e21b644944c97f63b2c2aae8c529b613b12', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: 'fb3694c2958be83be5336f4de46b4a0eb57ac7c4', size: this.size }), h("gb-mega-input-field-base", { key: '80788714b908f90b6f1966c2de35f9a5b057d50d', size: this.size }), h("gb-mega-input-field-base", { key: '24550a03518f013144d94a1c93fce3eab161abc5', size: this.size }), h("gb-mega-input-field-base", { key: 'b920db28c7874d2463518282570641a23f84aa57', size: this.size }), h("p", { key: '9d93dedf95a2a1fc80c49c5ce72da17081421ffe', class: "line display-sm-bold" }, "-"), h("gb-mega-input-field-base", { key: '31ac848a7a6bd0a09b7ffdcc36afc41859efd112', size: this.size }), h("gb-mega-input-field-base", { key: 'cd569663145e39ee64cd8da9b2682d239c5bd2ff', size: this.size }), h("gb-mega-input-field-base", { key: 'e91be74338d51e5d21aa28dd3b76bfa033266bd6', size: this.size }), h("gb-mega-input-field-base", { key: 'f764f11ffb38dca01c29cc07c97938205f23e970', size: this.size })))), this.showHintText && (h("div", { key: '215a9f3cdb079be01b3546b31b2f9e4a3e645838', class: "text-sm-regular", style: { color: 'var(--color-text-subtle, #697586)' } }, this.hintText))));
+            } }, h("div", { key: '650fea0b41970ae040922263f9e746757514b9c0', class: "input-with-label" }, this.showLabel && (h("label", { key: 'd188c4ba10fe575cb2b68270e74bda05d3c686ee', class: "text-sm-medium", style: { color: 'var(--color-text, #4B5565)' } }, this.label)), this.digits === 4 && (h("div", { key: '566897dfcb6fafb2fe22909255d7f8db73d80bc5', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: 'd926adb267281f3b8f3cc41b07f5d8ba243ee9c0', size: this.size }), h("gb-mega-input-field-base", { key: '03c691cb6a168b1a3af41193aba7c93c56b03ea3', size: this.size }), h("gb-mega-input-field-base", { key: '1bb2a9ad2b0a3f1f9a175eecd234ea6b4870fd0e', size: this.size }), h("gb-mega-input-field-base", { key: '5dc39c2ee31a2e4179115382c7ae4cb285b4855d', size: this.size }))), this.digits === 6 && (h("div", { key: 'd8019f6419b8bf9d77c16b8c5b93bab1393bd6d6', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: 'ae82804e85190f49c45b3586aa7fc10e21c44589', size: this.size }), h("gb-mega-input-field-base", { key: '8fedec5c15c809ae8482f44529f905ddd917bb87', size: this.size }), h("gb-mega-input-field-base", { key: '1ada91d519570ee18e27f72c80c734c9242305f6', size: this.size }), h("p", { key: '386a898a262a352cb1e41ed75d3434ac051e7719', class: "line display-sm-bold" }, "-"), h("gb-mega-input-field-base", { key: '333fd1f6cea92ee37dda7d18fb604578b1723c4e', size: this.size }), h("gb-mega-input-field-base", { key: '5417360ea7166b692779cb9ebf04df85e7402089', size: this.size }), h("gb-mega-input-field-base", { key: '002e5408f8d777d9f42512fc57e765a6328a1791', size: this.size }))), this.digits === 8 && (h("div", { key: '24786eae40dd9c59041dbe3106523493e7a91414', class: "input-wrapper" }, h("gb-mega-input-field-base", { key: '9610c2b38e7f58d978029c7978a70036c51ac2a2', size: this.size }), h("gb-mega-input-field-base", { key: '0b0a968fb05f7703789a9b626a7a01614225107d', size: this.size }), h("gb-mega-input-field-base", { key: 'a7b1c17aaf6dbe9acd8a0ffc9ee09c6cba5e66a8', size: this.size }), h("gb-mega-input-field-base", { key: '68a0856cea6d4f889c19c6fab8f9bc5bf7e4485d', size: this.size }), h("p", { key: 'eb60fa3c93cb465bc08b5a0dc40ccef8bc2d49bf', class: "line display-sm-bold" }, "-"), h("gb-mega-input-field-base", { key: 'b6ce8fc3c271af563f0f89807656bbd66e9ec22b', size: this.size }), h("gb-mega-input-field-base", { key: '37966c2496b9834902a3e79496d3aa72504df4b6', size: this.size }), h("gb-mega-input-field-base", { key: 'a2ffbf716f6486ac4df207536cc22e8a08705691', size: this.size }), h("gb-mega-input-field-base", { key: 'bb6fef84151c94d91daf8b4e897f938b78f62035', size: this.size })))), this.showHintText && (h("div", { key: 'e23358d1b631d411ea348575e8bf1c29ce3f98fe', class: "text-sm-regular", style: { color: 'var(--color-text-subtle, #697586)' } }, this.hintText))));
     }
     static get is() { return "gb-token-field-compressed"; }
     static get encapsulation() { return "shadow"; }

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

@@ -26,7 +26,7 @@ export class GbTooltip {
         return this.showArrow ? `arrow ${this.arrow}` : '';
     }
     render() {
-        return (h("div", { key: '9b3f4c3ad102b7bf73c4d8186a34bf36f613bb22', class: "tooltip_container" }, h("div", { key: 'e7e22979c3b843d810ce87b584bba647bdb19778', class: "tooltip" }, this.showArrow && h("div", { key: 'c6b85c708a829ea6cc20ce13f9daf09ff140d5ca', class: this.getArrowClass() }), h("div", { key: 'c3162f2313887263c5f61e38b20de15605d86eec', class: "tooltip_content" }, h("slot", { key: 'ddb331d4693012d4237174cfc0f384c3eddef22e', name: "label" }), this.showSupportingText && h("slot", { key: 'd7de102143c71aae93cf2173c49463ce79de198a', name: "supporting_text" })))));
+        return (h("div", { key: '394cadf2fee14a9519e4bc49c60846d77d9db348', class: "tooltip_container" }, h("div", { key: 'e7af8dfd0c6ba4e0316572d44311f21a4cf25903', class: "tooltip" }, this.showArrow && h("div", { key: '8c33b7e196f6ef5ebed83cf3ff8ddee19403fbae', class: this.getArrowClass() }), h("div", { key: 'ba16644ee54b6f3417401473550151a6effdc998', class: "tooltip_content" }, h("slot", { key: '670b7c1f6a87de4f887293c73bd42d1c6246c3f1', name: "label" }), this.showSupportingText && h("slot", { key: '2b18ba41f198bbe6a9a0ad316bf0b242bfd03cdb', name: "supporting_text" })))));
     }
     static get is() { return "gb-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-top-bar/gb-top-bar.js

@@ -30,7 +30,7 @@ export class GbTopBar {
     }
     render() {
         const patternSrc = getAssetPath(`assets/top_bar_pattern.svg`);
-        return (h("div", { key: 'ef9a6c013bb42d1333ea93b3c3f779add0e231ce', class: `top_bar_div ${this.category}` }, this.category === 'colored_background' && (h("div", { key: '5aca90c7ee0864a88f800b7014ca475727f609d4', class: "pattern" }, h("img", { key: 'c20aa61efc632794e85fc83c561e4329da3bb192', src: patternSrc, alt: "" }))), h("div", { key: '4598f0329a018198bff4b061ca7a20604a9afaae', class: "top_bar_content" }, h("div", { key: 'bbbcea0550b58ded8687bf8e5c3fffa22d1edf83', class: "content" }, this.firstTabLabel && (h("gb-top-bar-item", { key: '884b6cce72634566dedbb50ceb3002419f73e262', state: this.activeIndex === 0 ? 'active' : 'default', "icon-only": this.firstTabIconOnly, category: this.category, icon: this.firstTabIcon, label: this.firstTabLabel, onClick: () => this.onTabItemClicked(0) })), this.secondTabLabel && (h("gb-top-bar-item", { key: 'e1842f01e55fbfe0a72c549412bdd306c1b41eea', state: this.activeIndex === 1 ? 'active' : 'default', "icon-only": this.secondTabIconOnly, category: this.category, icon: this.secondTabIcon, label: this.secondTabLabel, onClick: () => this.onTabItemClicked(1) })), this.thirdTabLabel && (h("gb-top-bar-item", { key: 'b6ce4f75b785e5cf3f018626dcae29f6ce881abf', state: this.activeIndex === 2 ? 'active' : 'default', "icon-only": this.thirdTabIconOnly, category: this.category, icon: this.thirdTabIcon, label: this.thirdTabLabel, onClick: () => this.onTabItemClicked(2) })), this.fourthTabLabel && (h("gb-top-bar-item", { key: '464e42a7c36fc82d41679a39c3a8fed118300c3b', state: this.activeIndex === 3 ? 'active' : 'default', "icon-only": this.fourthTabIconOnly, category: this.category, icon: this.fourthTabIcon, label: this.fourthTabLabel, onClick: () => this.onTabItemClicked(3) })), this.fifthTabLabel && (h("gb-top-bar-item", { key: 'f6d42865bf976149cbf524faa86b6c313c5f8aed', state: this.activeIndex === 4 ? 'active' : 'default', "icon-only": this.fifthTabIconOnly, category: this.category, icon: this.fifthTabIcon, label: this.fifthTabLabel, onClick: () => this.onTabItemClicked(4) })), this.sixthTabLabel && (h("gb-top-bar-item", { key: '7b22dc58f90c0bf5c8c76b3647b93795601dd378', state: this.activeIndex === 5 ? 'active' : 'default', "icon-only": this.sixthTabIconOnly, category: this.category, icon: this.sixthTabIcon, label: this.sixthTabLabel, onClick: () => this.onTabItemClicked(5) })), this.seventhTabLabel && (h("gb-top-bar-item", { key: 'cd59ebf480d96178fe21276b4b1e6de627ed0c59', state: this.activeIndex === 6 ? 'active' : 'default', "icon-only": this.seventhTabIconOnly, category: this.category, icon: this.seventhTabIcon, label: this.seventhTabLabel, onClick: () => this.onTabItemClicked(6) }))))));
+        return (h("div", { key: '3d0b73034eef71b1a91259af35a7702a60f62088', class: `top_bar_div ${this.category}` }, this.category === 'colored_background' && (h("div", { key: 'feeaf3f518b3765462d258ea5f54d4556a0bc839', class: "pattern" }, h("img", { key: 'dc5bb72e527004259c064218d02ea8c7c79ff3fb', src: patternSrc, alt: "" }))), h("div", { key: 'ab281cdc28747bca11aaab85f61b9022412b3696', class: "top_bar_content" }, h("div", { key: 'ba50e8c5ae93702c6506c5dca30adace892c2d60', class: "content" }, this.firstTabLabel && (h("gb-top-bar-item", { key: '43dd4841ad480ce698b85aec3d42143e0f4dbbda', state: this.activeIndex === 0 ? 'active' : 'default', "icon-only": this.firstTabIconOnly, category: this.category, icon: this.firstTabIcon, label: this.firstTabLabel, onClick: () => this.onTabItemClicked(0) })), this.secondTabLabel && (h("gb-top-bar-item", { key: '5961299d2516452d851d34a1121b64cbd7a44e2e', state: this.activeIndex === 1 ? 'active' : 'default', "icon-only": this.secondTabIconOnly, category: this.category, icon: this.secondTabIcon, label: this.secondTabLabel, onClick: () => this.onTabItemClicked(1) })), this.thirdTabLabel && (h("gb-top-bar-item", { key: '849806ba861cd2eab0b4b9ad033b634c7e9ea5d8', state: this.activeIndex === 2 ? 'active' : 'default', "icon-only": this.thirdTabIconOnly, category: this.category, icon: this.thirdTabIcon, label: this.thirdTabLabel, onClick: () => this.onTabItemClicked(2) })), this.fourthTabLabel && (h("gb-top-bar-item", { key: '3ccf8373a39d0aa34fa903d3bf422bc6f46dccd4', state: this.activeIndex === 3 ? 'active' : 'default', "icon-only": this.fourthTabIconOnly, category: this.category, icon: this.fourthTabIcon, label: this.fourthTabLabel, onClick: () => this.onTabItemClicked(3) })), this.fifthTabLabel && (h("gb-top-bar-item", { key: '8c7a0b1806dff3dc4b3241b945b9d34d298ed838', state: this.activeIndex === 4 ? 'active' : 'default', "icon-only": this.fifthTabIconOnly, category: this.category, icon: this.fifthTabIcon, label: this.fifthTabLabel, onClick: () => this.onTabItemClicked(4) })), this.sixthTabLabel && (h("gb-top-bar-item", { key: 'd118aeff1ae6b04c6a99e43d1ca11498fc91f34e', state: this.activeIndex === 5 ? 'active' : 'default', "icon-only": this.sixthTabIconOnly, category: this.category, icon: this.sixthTabIcon, label: this.sixthTabLabel, onClick: () => this.onTabItemClicked(5) })), this.seventhTabLabel && (h("gb-top-bar-item", { key: '69bc45f9bb1d6ae97edc5df087758fded442c775', state: this.activeIndex === 6 ? 'active' : 'default', "icon-only": this.seventhTabIconOnly, category: this.category, icon: this.seventhTabIcon, label: this.seventhTabLabel, onClick: () => this.onTabItemClicked(6) }))))));
     }
     static get is() { return "gb-top-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-top-bar-item/gb-top-bar-item.js

@@ -17,7 +17,7 @@ export class GbTopBarItem {
         this.loadIcon(this.icon);
     }
     render() {
-        return (h("div", { key: '8e44937999e1ddebeef73318d806fd30f321c666', class: `top_bar_item_div ${this.category} ${this.state}`, onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, h("div", { key: 'fab5ba28d5da3b85adf3c4a629d5d9349951a73b', class: `top_bar_content` }, h("div", { key: '5e6d55b95fdef50994844a1594a0ff465c2a1131', class: `icon ${this.category} ${this.state}`, innerHTML: this.leadingIconSvg }), !this.iconOnly && (h("div", { key: '1ad6f57b85b6af3c613f4e3ba2519ea49998692f', class: "label" }, h("p", { key: '7285b5ca228428bd56415aaa28882e04756dd3cc', class: `label_text text-md-medium ${this.category} ${this.state}` }, this.label))), this.state === 'active' && this.category === 'colored_background' && h("div", { key: 'a673dffc1691703cf1cad4d7eea35bc3627d6fbc', class: `bar ${this.category}` }), this.state === 'active' && this.category === 'plain_background' && h("div", { key: '601bbeeb60408c33f8e0fdee564a3531344484e1', class: `bar ${this.category}` })), this.iconOnly && this.showTooltip && (h("gb-tooltip", { key: '0d77cbf9e154c342147b77c49e21661f27445718', "show-arrow": true, arrow: "bottom_center", class: "tooltip" }, h("p", { key: '01c1ac401f7367a9a05ea063b1188cff83f9b716', slot: "label" }, this.label)))));
+        return (h("div", { key: 'f6ebf638fa6562f1f95d434969d80eda7c25ba58', class: `top_bar_item_div ${this.category} ${this.state}`, onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, h("div", { key: 'a9be18747b2bc85ccdc119e815ddb1584f41b9c4', class: `top_bar_content` }, h("div", { key: '8bda31d1a4c11e496a495f7e44e0d593231a12db', class: `icon ${this.category} ${this.state}`, innerHTML: this.leadingIconSvg }), !this.iconOnly && (h("div", { key: '0d736fbd0dc603d1f000732f2e950e368149ea56', class: "label" }, h("p", { key: '41ddfdf1b5442239a1f9ef5d74a0e10fb5571c2c', class: `label_text text-md-medium ${this.category} ${this.state}` }, this.label))), this.state === 'active' && this.category === 'colored_background' && h("div", { key: '1f6785e22f320f3ecdb9ebca61050f0b9acd0722', class: `bar ${this.category}` }), this.state === 'active' && this.category === 'plain_background' && h("div", { key: '07182b3df0a4d89ef6e192b5f4efddda64cbd383', class: `bar ${this.category}` })), this.iconOnly && this.showTooltip && (h("gb-tooltip", { key: 'a4a40f076dbe95badbb759020f748b9cce261184', "show-arrow": true, arrow: "bottom_center", class: "tooltip" }, h("p", { key: '639048037d69e05d43178777b9fa1c0116695d18', slot: "label" }, this.label)))));
     }
     static get is() { return "gb-top-bar-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-top-bar-sidemenu/gb-top-bar-sidemenu.js

@@ -31,7 +31,7 @@ export class GbTopBarSidemenu {
     }
     render() {
         const patternSrc = getAssetPath(`assets/pattern_wrapper.svg`);
-        return (h("div", { key: '9dc6dd158b104a7abcec1879df7a06beaf7364ec', class: "top_bar_sidemenu_div" }, h("div", { key: 'f718b515a90913a58a625677dfd54a68a2475c41', class: "vertical_tabs_div" }, h("gb-vertical-tabs", { key: '3c53b7a2e8a2c1fe48d5b10cce531ba76c2d1827', size: "md", "first-tab-name": this.firstTabName, "second-tab-name": this.secondTabName, "third-tab-name": this.thirdTabName, "fourth-tab-name": this.fourthTabName, "fifth-tab-name": this.fifthTabName, type: "button_primary", "active-index": this.activeIndex, onTabItemClicked: this.onTabItemClicked.bind(this) })), h("div", { key: '3213410e1b22bde57b3eb089f509f0a70441a566', class: "wrapper" }, h("div", { key: '681a4e46a82a52d1c707b5a6ffd092373006bbf6', class: "wrapper_pattern" }, h("img", { key: '487039ef092bd21d24f937637f9d1c0c258f8a02', src: patternSrc, alt: "" })), h("div", { key: 'f7aa2ada5ed46ce6bc3085b65493b963c65d123b', class: `application_icon`, innerHTML: this.leadingIconSvg }), h("div", { key: '3098266722f2db2c8686171c7b3824cb9cdc5001', class: "application_name" }, h("slot", { key: 'c90a56021d10305d077d8a4bed09199947d31dcc', name: "application_name" })))));
+        return (h("div", { key: 'aab0f531953634aebe29072f2ff1e1fc76b32958', class: "top_bar_sidemenu_div" }, h("div", { key: '2a41156a6ca2dbe83f5b6cbdac001362e81bd838', class: "vertical_tabs_div" }, h("gb-vertical-tabs", { key: 'ed8ffa05fb7c578c3c683a859f8eb692573f84ea', size: "md", "first-tab-name": this.firstTabName, "second-tab-name": this.secondTabName, "third-tab-name": this.thirdTabName, "fourth-tab-name": this.fourthTabName, "fifth-tab-name": this.fifthTabName, type: "button_primary", "active-index": this.activeIndex, onTabItemClicked: this.onTabItemClicked.bind(this) })), h("div", { key: 'da8d711f663c3a907faff720a9b5c29b61bf4e07', class: "wrapper" }, h("div", { key: '75789c2e24071a8572f88e465fec37d22618e1ad', class: "wrapper_pattern" }, h("img", { key: '8eb2994160bdc4511988190e0d1507977374a9eb', src: patternSrc, alt: "" })), h("div", { key: '4fa2de895493f4be70b3d23d5e992da8e4accb9b', class: `application_icon`, innerHTML: this.leadingIconSvg }), h("div", { key: 'f6b2977baf043b4fc65c62fe751f9547a5e64bb0', class: "application_name" }, h("slot", { key: 'eb632521c96cc907bcd94bad14b287c6e400b2cb', name: "application_name" })))));
     }
     static get is() { return "gb-top-bar-sidemenu"; }
     static get encapsulation() { return "shadow"; }

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

@@ -29,7 +29,7 @@ export class GbVerticalTabs {
         this.tabItemClicked.emit({ index, label });
     }
     render() {
-        return (h("div", { key: 'a6f9d383bc4b34d92bfb0a7f0436e5651fdc34d0', class: `vertical_tab_div` }, h("gb-tab-button-base", { key: 'bdff39985fe32c3ad1fe8c557ebbce275cc6de35', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.firstTabName, current: this.activeIndex === 0, onClick: () => this.handleTabClick(0, this.firstTabName), alignment: "vertical" }), h("gb-tab-button-base", { key: 'fbb30a94e31392ce925079d4d9767d0bb73f7d89', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.secondTabName, current: this.activeIndex === 1, onClick: () => this.handleTabClick(1, this.secondTabName), alignment: "vertical" }), this.thirdTabName && (h("gb-tab-button-base", { key: 'efb17ca50368b298a822fb9a86960e21953b2649', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.thirdTabName, current: this.activeIndex === 2, onClick: () => this.handleTabClick(2, this.thirdTabName), alignment: "vertical" })), this.fourthTabName && (h("gb-tab-button-base", { key: '82ab30ac6c068fe7384e9d16c1a5ad4fe5070a93', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.fourthTabName, current: this.activeIndex === 3, onClick: () => this.handleTabClick(3, this.fourthTabName), alignment: "vertical" })), this.fifthTabName && (h("gb-tab-button-base", { key: 'caffdfdae23e20bbb89a4609e7b5ab2680490e50', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.fifthTabName, current: this.activeIndex === 4, onClick: () => this.handleTabClick(4, this.fifthTabName), alignment: "vertical" })), this.sixthTabName && (h("gb-tab-button-base", { key: 'e106e0515f98c5b20a7b8dba46ea30c73e8e60a1', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.sixthTabName, current: this.activeIndex === 5, onClick: () => this.handleTabClick(5, this.sixthTabName), alignment: "vertical" })), this.seventhTabName && (h("gb-tab-button-base", { key: 'd52163041aa3184832754d154897bff15d84d310', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.seventhTabName, current: this.activeIndex === 6, onClick: () => this.handleTabClick(6, this.seventhTabName), alignment: "vertical" })), this.eighthTabName && (h("gb-tab-button-base", { key: '050aa62793373a3af8eed4e012af0f401b881416', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.eighthTabName, current: this.activeIndex === 7, onClick: () => this.handleTabClick(7, this.eighthTabName), alignment: "vertical" })), this.ninthTabName && (h("gb-tab-button-base", { key: '0c4b6a58402b6872073a0b132a115c3f57fe29d2', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.ninthTabName, current: this.activeIndex === 8, onClick: () => this.handleTabClick(8, this.ninthTabName), alignment: "vertical" })), this.tenthTabName && (h("gb-tab-button-base", { key: 'c8ca0c1add3fd8e86c13b828a6927e42ee1c637b', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.tenthTabName, current: this.activeIndex === 9, onClick: () => this.handleTabClick(9, this.tenthTabName), alignment: "vertical" })), this.eleventhTabName && (h("gb-tab-button-base", { key: '3b9ef736008c83fef9f8fa38455d8f8481fe0911', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.eleventhTabName, current: this.activeIndex === 10, onClick: () => this.handleTabClick(10, this.eleventhTabName), alignment: "vertical" })), this.twelfthTabName && (h("gb-tab-button-base", { key: 'b7e3325e253eacf7ba48e1e51bd4f97d5dc0723e', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.twelfthTabName, current: this.activeIndex === 11, onClick: () => this.handleTabClick(11, this.twelfthTabName), alignment: "vertical" })), this.thirteenthTabName && (h("gb-tab-button-base", { key: 'b4b6cc34bc7b50f9f7669c6e890e9749f2890065', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.thirteenthTabName, current: this.activeIndex === 12, onClick: () => this.handleTabClick(12, this.thirteenthTabName), alignment: "vertical" })), this.fourteenthTabName && (h("gb-tab-button-base", { key: 'f27fb2e8b74706a35e8667c16e579e4f07c4e846', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.fourteenthTabName, current: this.activeIndex === 13, onClick: () => this.handleTabClick(13, this.fourteenthTabName), alignment: "vertical" })), this.fifteenthTabName && (h("gb-tab-button-base", { key: '7823f67c014e94b062480dccd5bee89807e4828f', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.fifteenthTabName, current: this.activeIndex === 14, onClick: () => this.handleTabClick(14, this.fifteenthTabName), alignment: "vertical" })), this.sixteenthTabName && (h("gb-tab-button-base", { key: 'd3e02a23d2e138dee2f8a94153131f80152b3418', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.sixteenthTabName, current: this.activeIndex === 15, onClick: () => this.handleTabClick(15, this.sixteenthTabName), alignment: "vertical" })), this.seventeenthTabName && (h("gb-tab-button-base", { key: '11ba5dad16660acca2511e2ce262f67ff8b6bd06', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.seventeenthTabName, current: this.activeIndex === 16, onClick: () => this.handleTabClick(16, this.seventeenthTabName), alignment: "vertical" })), this.eighteenthTabName && (h("gb-tab-button-base", { key: '4d84d0d093604686b10476a7cff582697b63edba', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.eighteenthTabName, current: this.activeIndex === 17, onClick: () => this.handleTabClick(17, this.eighteenthTabName), alignment: "vertical" })), this.nineteenthTabName && (h("gb-tab-button-base", { key: '25cb120e75c0594db525121dc4e305daf979c6ae', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.nineteenthTabName, current: this.activeIndex === 18, onClick: () => this.handleTabClick(18, this.nineteenthTabName), alignment: "vertical" })), this.twentiethTabName && (h("gb-tab-button-base", { key: '7ec24c8f5758d85835f1b7f23e87aef57eb31cf5', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.twentiethTabName, current: this.activeIndex === 19, onClick: () => this.handleTabClick(19, this.twentiethTabName), alignment: "vertical" }))));
+        return (h("div", { key: '14ed47f495ac629b73c8fdb8a08b9a38e0df9927', class: `vertical_tab_div` }, h("gb-tab-button-base", { key: '9fcd6fe43acaf19270427cca95adc1e1fd4b1807', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.firstTabName, current: this.activeIndex === 0, onClick: () => this.handleTabClick(0, this.firstTabName), alignment: "vertical" }), h("gb-tab-button-base", { key: '0f17ad470786042c6bc03c4887039ff8bc5ca14d', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.secondTabName, current: this.activeIndex === 1, onClick: () => this.handleTabClick(1, this.secondTabName), alignment: "vertical" }), this.thirdTabName && (h("gb-tab-button-base", { key: '077cbe9976d0129530267161ce348401b1d8b270', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.thirdTabName, current: this.activeIndex === 2, onClick: () => this.handleTabClick(2, this.thirdTabName), alignment: "vertical" })), this.fourthTabName && (h("gb-tab-button-base", { key: '4475ea0b0cca035271a53d137e8e24e72c134353', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.fourthTabName, current: this.activeIndex === 3, onClick: () => this.handleTabClick(3, this.fourthTabName), alignment: "vertical" })), this.fifthTabName && (h("gb-tab-button-base", { key: '079f15000b862bae45173d335273a405a5b74909', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.fifthTabName, current: this.activeIndex === 4, onClick: () => this.handleTabClick(4, this.fifthTabName), alignment: "vertical" })), this.sixthTabName && (h("gb-tab-button-base", { key: '607744693eb82269bd61f38ba855da328fa70a87', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.sixthTabName, current: this.activeIndex === 5, onClick: () => this.handleTabClick(5, this.sixthTabName), alignment: "vertical" })), this.seventhTabName && (h("gb-tab-button-base", { key: '17495698867998b91aa1fddcfca443c02d2d3da1', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.seventhTabName, current: this.activeIndex === 6, onClick: () => this.handleTabClick(6, this.seventhTabName), alignment: "vertical" })), this.eighthTabName && (h("gb-tab-button-base", { key: 'db24ded61cc506eeca9614383bd30e80e9f23854', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.eighthTabName, current: this.activeIndex === 7, onClick: () => this.handleTabClick(7, this.eighthTabName), alignment: "vertical" })), this.ninthTabName && (h("gb-tab-button-base", { key: 'fad6525157a1b63d3343db39adf08c086755d83d', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.ninthTabName, current: this.activeIndex === 8, onClick: () => this.handleTabClick(8, this.ninthTabName), alignment: "vertical" })), this.tenthTabName && (h("gb-tab-button-base", { key: 'b89fa928453708cf2e17003da798de0455a1b801', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.tenthTabName, current: this.activeIndex === 9, onClick: () => this.handleTabClick(9, this.tenthTabName), alignment: "vertical" })), this.eleventhTabName && (h("gb-tab-button-base", { key: '3c8b250aff08ba52532d869b4b8b5ab59fb04229', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.eleventhTabName, current: this.activeIndex === 10, onClick: () => this.handleTabClick(10, this.eleventhTabName), alignment: "vertical" })), this.twelfthTabName && (h("gb-tab-button-base", { key: '843121632a6608df6ab7713c368db2b9a74d8b7b', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.twelfthTabName, current: this.activeIndex === 11, onClick: () => this.handleTabClick(11, this.twelfthTabName), alignment: "vertical" })), this.thirteenthTabName && (h("gb-tab-button-base", { key: 'aa92cd6c73f872a5dcb025bc6a4fc34476b20187', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.thirteenthTabName, current: this.activeIndex === 12, onClick: () => this.handleTabClick(12, this.thirteenthTabName), alignment: "vertical" })), this.fourteenthTabName && (h("gb-tab-button-base", { key: 'd3cf21cf3e954c6b8280df172bea66eadb6acff7', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.fourteenthTabName, current: this.activeIndex === 13, onClick: () => this.handleTabClick(13, this.fourteenthTabName), alignment: "vertical" })), this.fifteenthTabName && (h("gb-tab-button-base", { key: '21fbba846e395751560ee23042b449c35e8c5f48', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.fifteenthTabName, current: this.activeIndex === 14, onClick: () => this.handleTabClick(14, this.fifteenthTabName), alignment: "vertical" })), this.sixteenthTabName && (h("gb-tab-button-base", { key: '7626d17df0353fe75a986a7f8ffc0955e751fd83', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.sixteenthTabName, current: this.activeIndex === 15, onClick: () => this.handleTabClick(15, this.sixteenthTabName), alignment: "vertical" })), this.seventeenthTabName && (h("gb-tab-button-base", { key: 'a58caa281a863c16ce7b18b6450bb44bf9a63edd', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.seventeenthTabName, current: this.activeIndex === 16, onClick: () => this.handleTabClick(16, this.seventeenthTabName), alignment: "vertical" })), this.eighteenthTabName && (h("gb-tab-button-base", { key: 'c59d0e461c95c1bc9647363e210b4a21830785f3', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.eighteenthTabName, current: this.activeIndex === 17, onClick: () => this.handleTabClick(17, this.eighteenthTabName), alignment: "vertical" })), this.nineteenthTabName && (h("gb-tab-button-base", { key: 'a1fb92a8b07b33dc14f125be3b91fb090ea0bb79', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.nineteenthTabName, current: this.activeIndex === 18, onClick: () => this.handleTabClick(18, this.nineteenthTabName), alignment: "vertical" })), this.twentiethTabName && (h("gb-tab-button-base", { key: '26f87146b876b8d7242ba29ed5aaacdeecaa6c3f', size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": this.twentiethTabName, current: this.activeIndex === 19, onClick: () => this.handleTabClick(19, this.twentiethTabName), alignment: "vertical" }))));
     }
     static get is() { return "gb-vertical-tabs"; }
     static get encapsulation() { return "shadow"; }