globuswebcomponents 0.3.5 → 0.3.6

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

@@ -0,0 +1,287 @@
+import { h } from "@stencil/core";
+export class GbHorizontalTabs {
+    constructor() {
+        this.type = undefined;
+        this.size = undefined;
+        this.fullWidth = false;
+        this.breakpoint = undefined;
+        this.thirdTab = false;
+        this.fourthTab = false;
+        this.fifthTab = false;
+        this.sixthTab = false;
+        this.seventhTab = false;
+        this.eigthTab = false;
+        this.ninthTab = false;
+        this.tenthTab = false;
+        this.firstClicked = false;
+        this.secondClicked = false;
+    }
+    componentWillLoad() {
+        this.firstClicked = true;
+    }
+    firstTabClicked() {
+        this.firstClicked = true;
+        this.secondClicked = false;
+    }
+    secondTabClicked() {
+        this.firstClicked = false;
+        this.secondClicked = true;
+    }
+    render() {
+        return (h("div", { key: '8d2797e140a2c694b04d8658e6ea787d0d48f2e2', class: `horizontal_tab_div ${this.type} ${this.breakpoint} ${this.fullWidth ? 'full_width' : ''}` }, h("gb-tab-button-base", { key: 'bb687e913237cbc5067fea33a99016775f402112', size: this.size, "full-width": this.fullWidth, type: this.type, onClick: () => (this.firstTabClicked(), console.log(this.firstClicked)), current: this.firstClicked }, h("slot", { key: 'da8c7bc909c4f864b2f79076134b17f3586e1a78', name: "first_tab", slot: "name" })), h("gb-tab-button-base", { key: '023bbd79e5a1cd62bbaffd19ba376a993281c1f4', size: this.size, "full-width": this.fullWidth, type: this.type, onClick: () => this.secondTabClicked(), current: this.secondClicked }, h("slot", { key: '9a2fe853f86cd110b3229912c57efc888897f554', name: "second_tab", slot: "name" })), this.thirdTab && (h("gb-tab-button-base", { key: '5a432c0a28dbaed7b36d5261f586f60b102719c8', size: this.size, "full-width": this.fullWidth, type: this.type }, h("slot", { key: 'fc84cc0bd022a1184c617af4284e047a77ee742e', name: "third_tab", slot: "name" }))), this.fourthTab && (h("gb-tab-button-base", { key: 'c31dbc661fefbc8c1f7bde51c95dacd2ef5e8454', size: this.size, "full-width": this.fullWidth, type: this.type }, h("slot", { key: '9c1cb2a81590d4a5a188560fd189cb6aeae84c6d', name: "fourth_tab", slot: "name" })))));
+    }
+    static get is() { return "gb-horizontal-tabs"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["gb-horizontal-tabs.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["gb-horizontal-tabs.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "TabTypes",
+                    "resolved": "\"button_gray\" | \"button_primary\" | \"button_white\" | \"button_white_border\" | \"line\" | \"rounded_button_white_border\" | \"underline\" | \"underline_filled\"",
+                    "references": {
+                        "TabTypes": {
+                            "location": "import",
+                            "path": "../../models/reusableModels",
+                            "id": "src/models/reusableModels.ts::TabTypes"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "type",
+                "reflect": false
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "GeneralSizes",
+                    "resolved": "\"lg\" | \"md\" | \"profile_lg\" | \"profile_md\" | \"profile_sm\" | \"sm\" | \"xl\" | \"xl2\" | \"xl3\" | \"xl4\" | \"xs\" | \"xxs\"",
+                    "references": {
+                        "GeneralSizes": {
+                            "location": "import",
+                            "path": "../../models/reusableModels",
+                            "id": "src/models/reusableModels.ts::GeneralSizes"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "size",
+                "reflect": false
+            },
+            "fullWidth": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "full-width",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "breakpoint": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "BreakPoints",
+                    "resolved": "\"desktop\" | \"mobile\"",
+                    "references": {
+                        "BreakPoints": {
+                            "location": "import",
+                            "path": "../../models/reusableModels",
+                            "id": "src/models/reusableModels.ts::BreakPoints"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "breakpoint",
+                "reflect": false
+            },
+            "thirdTab": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "third-tab",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "fourthTab": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "fourth-tab",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "fifthTab": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "fifth-tab",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "sixthTab": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "sixth-tab",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "seventhTab": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "seventh-tab",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "eigthTab": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "eigth-tab",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "ninthTab": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "ninth-tab",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "tenthTab": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "tenth-tab",
+                "reflect": false,
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "firstClicked": {},
+            "secondClicked": {}
+        };
+    }
+}
+//# sourceMappingURL=gb-horizontal-tabs.js.map

package/dist/collection/components/gb-horizontal-tabs/gb-horizontal-tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gb-horizontal-tabs.js","sourceRoot":"","sources":["../../../src/components/gb-horizontal-tabs/gb-horizontal-tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAQ1D,MAAM,OAAO,gBAAgB;;;;yBAGE,KAAK;;wBAEN,KAAK;yBACJ,KAAK;wBACN,KAAK;wBACL,KAAK;0BACH,KAAK;wBACP,KAAK;wBACL,KAAK;wBACL,KAAK;4BACA,KAAK;6BACJ,KAAK;;IAEvC,iBAAiB;QACf,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;IAC3B,CAAC;IAED,eAAe;QACb,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;QACzB,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;IAC7B,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;QAC1B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC;IAC5B,CAAC;IAED,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAE,sBAAsB,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE;YACpG,2EACE,IAAI,EAAE,IAAI,CAAC,IAAI,gBACH,IAAI,CAAC,SAAS,EAC1B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,eAAe,EAAE,EAAE,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,EACvE,OAAO,EAAE,IAAI,CAAC,YAAY;gBAE1B,6DAAM,IAAI,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,GAAQ,CACvB;YACrB,2EAAoB,IAAI,EAAE,IAAI,CAAC,IAAI,gBAAc,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,aAAa;gBACnJ,6DAAM,IAAI,EAAC,YAAY,EAAC,IAAI,EAAC,MAAM,GAAQ,CACxB;YACpB,IAAI,CAAC,QAAQ,IAAI,CAChB,2EAAoB,IAAI,EAAE,IAAI,CAAC,IAAI,gBAAc,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI;gBAC9E,6DAAM,IAAI,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,GAAQ,CACvB,CACtB;YACA,IAAI,CAAC,SAAS,IAAI,CACjB,2EAAoB,IAAI,EAAE,IAAI,CAAC,IAAI,gBAAc,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI;gBAC9E,6DAAM,IAAI,EAAC,YAAY,EAAC,IAAI,EAAC,MAAM,GAAQ,CACxB,CACtB,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, State, h } from \"@stencil/core\";\r\nimport { BreakPoints, GeneralSizes, TabTypes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n  tag: 'gb-horizontal-tabs',\r\n  styleUrl: 'gb-horizontal-tabs.css',\r\n  shadow: true,\r\n})\r\nexport class GbHorizontalTabs {\r\n  @Prop() type: TabTypes;\r\n  @Prop() size: GeneralSizes;\r\n  @Prop() fullWidth: boolean = false;\r\n  @Prop() breakpoint: BreakPoints;\r\n  @Prop() thirdTab: boolean = false;\r\n  @Prop() fourthTab: boolean = false;\r\n  @Prop() fifthTab: boolean = false;\r\n  @Prop() sixthTab: boolean = false;\r\n  @Prop() seventhTab: boolean = false;\r\n  @Prop() eigthTab: boolean = false;\r\n  @Prop() ninthTab: boolean = false;\r\n  @Prop() tenthTab: boolean = false;\r\n  @State() firstClicked: boolean = false;\r\n  @State() secondClicked: boolean = false;\r\n\r\n  componentWillLoad() {\r\n    this.firstClicked = true;\r\n  }\r\n\r\n  firstTabClicked() {\r\n    this.firstClicked = true;\r\n    this.secondClicked = false;\r\n  }\r\n\r\n  secondTabClicked() {\r\n    this.firstClicked = false;\r\n    this.secondClicked = true;\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class={`horizontal_tab_div ${this.type} ${this.breakpoint} ${this.fullWidth ? 'full_width' : ''}`}>\r\n        <gb-tab-button-base\r\n          size={this.size}\r\n          full-width={this.fullWidth}\r\n          type={this.type}\r\n          onClick={() => (this.firstTabClicked(), console.log(this.firstClicked))}\r\n          current={this.firstClicked}\r\n        >\r\n          <slot name=\"first_tab\" slot=\"name\"></slot>\r\n        </gb-tab-button-base>\r\n        <gb-tab-button-base size={this.size} full-width={this.fullWidth} type={this.type} onClick={() => this.secondTabClicked()} current={this.secondClicked}>\r\n          <slot name=\"second_tab\" slot=\"name\"></slot>\r\n        </gb-tab-button-base>\r\n        {this.thirdTab && (\r\n          <gb-tab-button-base size={this.size} full-width={this.fullWidth} type={this.type}>\r\n            <slot name=\"third_tab\" slot=\"name\"></slot>\r\n          </gb-tab-button-base>\r\n        )}\r\n        {this.fourthTab && (\r\n          <gb-tab-button-base size={this.size} full-width={this.fullWidth} type={this.type}>\r\n            <slot name=\"fourth_tab\" slot=\"name\"></slot>\r\n          </gb-tab-button-base>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}"]}

package/dist/collection/components/gb-input-dropdown/gb-input-dropdown.css

@@ -75,10 +75,19 @@
     --success-900: #074d31;
     --success-950: #053321;
 
-    /* opacity color palette  */
+    /* ------------------------------------------opacity color palette--------------------------------------  */
+    /* 20% opacity */
     --darkBlue200-opacity20: rgba(181, 185, 204, 0.2);
     --darkBlue500-opacity20: rgba(33, 44, 101, 0.2);
 
+    /* 30% opacity */
+    --darkBlue200-opacity30: rgba(181, 185, 204, 0.3);
+    --darkBlue500-opacity30: rgba(33, 44, 101, 0.3);
+
+    /* 40% opacity */
+    --darkBlue200-opacity40: rgba(181, 185, 204, 0.4);
+    --darkBlue500-opacity40: rgba(33, 44, 101, 0.4);
+
 
     /* ------------------------------------------Secondary Color------------------------------------------- */
     /* blueLight color palete */
@@ -250,6 +259,14 @@
         --color-text-warning-bold: var(--warning-100);
     }
 
+    [data-theme="light"] {
+        --color-text-warning-subtle: var(--warning-500);
+    }
+
+    [data-theme="dark"] {
+        --color-text-warning-subtle: var(--warning-400);
+    }
+
     [data-theme="light"] {
         --color-text-sucess: var(--success-600);
     }
@@ -282,6 +299,14 @@
         --color-text-discovery-bold: var(--blueLight-100);
     }
 
+    [data-theme="light"] {
+        --color-text-discovery-subtle: var(--blueLight-400);
+    }
+
+    [data-theme="dark"] {
+        --color-text-discovery-subtle: var(--blueLight-100);
+    }
+
     [data-theme="light"] {
         --color-text-information: var(--blue-600);
     }
@@ -298,6 +323,14 @@
         --color-text-information-bold: var(--blue-100);
     }
 
+    [data-theme="light"] {
+        --color-text-information-subtle: var(--blue-500);
+    }
+
+    [data-theme="dark"] {
+        --color-text-information-subtle: var(--blue-400);
+    }
+
     [data-theme="light"] {
         --color-text-purple: var(--purple-600);
     }
@@ -314,6 +347,30 @@
         --color-text-purple-bold: var(--purple-100);
     }
 
+    [data-theme="light"] {
+        --color-text-purple-subtle: var(--purple-500);
+    }
+
+    [data-theme="dark"] {
+        --color-text-purple-subtle: var(--purple-400);
+    }
+
+    [data-theme="light"] {
+        --color-text-pink: var(--purple-600);
+    }
+
+    [data-theme="dark"] {
+        --color-text-pink: var(--purple-300);
+    }
+
+    [data-theme="light"] {
+        --color-text-pink-subtle: var(--purple-500);
+    }
+
+    [data-theme="dark"] {
+        --color-text-pink-subtle: var(--purple-400);
+    }
+
 
     /* --------------Link color--------------- */
 
@@ -1244,6 +1301,22 @@
         --color-blanket: var(--darkBlue200-opacity20);
     }
 
+    [data-theme="light"] {
+        --color-blanket-subtle: var(--darkBlue500-opacity30);
+    }
+
+    [data-theme="dark"] {
+        --color-blanket-subtle: var(--darkBlue200-opacity30);
+    }
+
+    [data-theme="light"] {
+        --color-blanket-subtler: var(--darkBlue500-opacity40);
+    }
+
+    [data-theme="dark"] {
+        --color-blanket-subtler: var(--darkBlue200-opacity40);
+    }
+
 
 
     /* ----------------Skeleton Color --------------- */

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

@@ -22,7 +22,7 @@ export class GbInputDropdown {
         }
     }
     render() {
-        return (h("div", { key: '69b020a6ecb958fcd62ffd2c75029937e94687e7', class: `input_dropdown_container` }, this.showLabel && (h("p", { key: '8c6805543d2872cf1f1043b4715177f09b98eb87', class: "text-sm-regular", style: { color: '#4B5565' } }, this.label)), h("div", { key: '5acf3f83cd50560baa24c830fa49e3a6542da91f', class: `input_dropdown_div ${this.size} ${this.state}` }, this.type === 'icon_leading' && (h("svg", { key: '1cef6b17620ec10baf5a7713b968d38f696414e1', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'ec986bfb6f1b211725a3863e1829c75fc1e0d2ee', d: "M5.48131 12.9013C4.30234 13.6033 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3333 6.32572 18.3333H13.6743C14.9621 18.3333 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6033 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#697586", "stroke-width": "1.66667" }), h("path", { key: '0949c4925392b01be45beeaf88545a0f55141102', d: "M13.75 5.41667C13.75 7.48774 12.0711 9.16667 10 9.16667C7.92893 9.16667 6.25 7.48774 6.25 5.41667C6.25 3.3456 7.92893 1.66667 10 1.66667C12.0711 1.66667 13.75 3.3456 13.75 5.41667Z", stroke: "#697586", "stroke-width": "1.66667" }))), this.type === 'avatar_leading' && h("gb-avatar", { key: '92d7bcbc1e5fb9b383afc3f53eb024ccc72c20df', size: "xs" }), this.type === 'search' && (h("svg", { key: '891499040c21b4a0acb8f3a08d73fcf5b07954be', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: 'aef205e8bd9e8a8f27aa83b807db9da69079b845', d: "M14.5833 14.5833L18.3333 18.3333M16.6667 9.16667C16.6667 5.02454 13.3088 1.66667 9.16667 1.66667C5.02454 1.66667 1.66667 5.02454 1.66667 9.16667C1.66667 13.3088 5.02454 16.6667 9.16667 16.6667C13.3088 16.6667 16.6667 13.3088 16.6667 9.16667Z", stroke: "#697586", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.type === 'dot_leading' && (h("svg", { key: '698fffc7abc0cf1bd49f1a76457067514aa6fe15', xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", class: `dot ${this.size}` }, h("circle", { key: 'af88f910dc6e9dc3e4fa6ca420d5aa010ad58d5c', cx: "5", cy: "5", r: "4", fill: "#079455" }))), h("div", { key: 'df71322d7c663751fb5ba208bba38b3be3cc7abd', class: "placeholder" }, h(Fragment, null, this.state === 'default' && (h(Fragment, null, this.showPlaceholder && (h("p", { key: '84b101aa5f4c4e4cc8c2466a56912ac8018897b4', class: "text-md-regular", style: { color: '#CDD5DF' } }, "Select team member")))), this.state === 'filled' && (h(Fragment, null, h("div", { key: 'e2d068850cd008c280ccc0664f917157b7841336', class: "content" }, h("div", { key: 'cc3265b43289fc8f57a1723af6d61dca66d80a72', class: "text text-md-regular", style: { color: '#4B5565' } }, "Olivia Rhye"), h("div", { key: 'a44da433edc0d89f5dd55d4174d005497bcf1c23', class: "supporting_text text-sm-regular", style: { color: '#697586' } }, "@olivia")))))), this.showHelpIcon && (h("div", { key: '362418292c01852e484d83c7f52045e4f640c511', class: `help_icon` }, h("svg", { key: '029823c261ecefc75ea542c6869aed03c9553413', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { key: 'cceb93e269c5d1f9cd2837daf86192500887b316', d: "M6.66665 6C6.66665 5.26362 7.2636 4.66667 7.99998 4.66667C8.73636 4.66667 9.33331 5.26362 9.33331 6C9.33331 6.26543 9.25575 6.51275 9.12205 6.72053C8.72358 7.33978 7.99998 7.93029 7.99998 8.66667V9M7.99464 11.3333H8.00063M14.6666 8C14.6666 11.6819 11.6819 14.6667 7.99998 14.6667C4.31808 14.6667 1.33331 11.6819 1.33331 8C1.33331 4.3181 4.31808 1.33333 7.99998 1.33333C11.6819 1.33333 14.6666 4.3181 14.6666 8Z", stroke: "#697586", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("div", { key: 'af51c718044ba926f76d4a35eff187c72ecc422c', class: "dropdown_icon" }, h("svg", { key: 'fa3272176860271b4a9d51f33ac145fa93fe95da', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `${this.state}` }, h("path", { key: 'ed583e9717b2e31700afc33f1c8cc7ba15971fcc', d: "M15 7.50004C15 7.50004 11.3176 12.5 9.99996 12.5C8.68237 12.5 5 7.5 5 7.5", stroke: "#697586", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" })))), this.showHintText && (h("p", { key: '2149ce6cda154f88b8dca772db0cdcb1d585a835', class: "text-sm-regular", style: { color: '#697586' } }, this.hintText))));
+        return (h("div", { key: '9250d7e212ea3a7d3948256fa15c2c31039567eb', class: `input_dropdown_container` }, this.showLabel && (h("p", { key: '28376a82cf3243693efcaa6b5e31a4b96d8d636b', class: "text-sm-regular", style: { color: '#4B5565' } }, this.label)), h("div", { key: '368836dd24658778323928ceb0c0c3a30257014b', class: `input_dropdown_div ${this.size} ${this.state}` }, this.type === 'icon_leading' && (h("svg", { key: '8ed64e55b11c7e110f8eba48ffa913718d654054', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '01dc08b4b662b47a54d4fc0fa29600679ef55b4d', d: "M5.48131 12.9013C4.30234 13.6033 1.21114 15.0368 3.09388 16.8305C4.01359 17.7067 5.03791 18.3333 6.32572 18.3333H13.6743C14.9621 18.3333 15.9864 17.7067 16.9061 16.8305C18.7889 15.0368 15.6977 13.6033 14.5187 12.9013C11.754 11.2551 8.24599 11.2551 5.48131 12.9013Z", stroke: "#697586", "stroke-width": "1.66667" }), h("path", { key: '342d8208ef7c33f1f2e5b9e1a2f45630ae6214c5', d: "M13.75 5.41667C13.75 7.48774 12.0711 9.16667 10 9.16667C7.92893 9.16667 6.25 7.48774 6.25 5.41667C6.25 3.3456 7.92893 1.66667 10 1.66667C12.0711 1.66667 13.75 3.3456 13.75 5.41667Z", stroke: "#697586", "stroke-width": "1.66667" }))), this.type === 'avatar_leading' && h("gb-avatar", { key: '2085c600b2316a2a2a3870c9dbca808a6ecc53aa', size: "xs" }), this.type === 'search' && (h("svg", { key: '60cfc12aedb9d8b51e17fa14286060ed5650f80f', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" }, h("path", { key: '571c379bc17d3d303fa9fd3f787dab058a338067', d: "M14.5833 14.5833L18.3333 18.3333M16.6667 9.16667C16.6667 5.02454 13.3088 1.66667 9.16667 1.66667C5.02454 1.66667 1.66667 5.02454 1.66667 9.16667C1.66667 13.3088 5.02454 16.6667 9.16667 16.6667C13.3088 16.6667 16.6667 13.3088 16.6667 9.16667Z", stroke: "#697586", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.type === 'dot_leading' && (h("svg", { key: '6494abc72980d8a2d8cc538dd4a96c0212ba5d62', xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", class: `dot ${this.size}` }, h("circle", { key: 'dc1e6b9218528e11a206fb0365ed483ac787e013', cx: "5", cy: "5", r: "4", fill: "#079455" }))), h("div", { key: 'ea040f31ff1d3a3703b7fe009afc3efe59b4440a', class: "placeholder" }, h(Fragment, null, this.state === 'default' && (h(Fragment, null, this.showPlaceholder && (h("p", { key: '6eedb3e63fce53d759c6273cf76c91eaddddab47', class: "text-md-regular", style: { color: '#CDD5DF' } }, "Select team member")))), this.state === 'filled' && (h(Fragment, null, h("div", { key: '474f9d3b01ec787213e8d0dbcfb1f56f9745065c', class: "content" }, h("div", { key: '2cc8a37096cfd5aae843b429c748d88a2d9404c5', class: "text text-md-regular", style: { color: '#4B5565' } }, "Olivia Rhye"), h("div", { key: '4a1fc1ecfa949eace7debd1fdebc77fe6f4a9d7e', class: "supporting_text text-sm-regular", style: { color: '#697586' } }, "@olivia")))))), this.showHelpIcon && (h("div", { key: '9bae961979b4b874270fb82e87965b4947edf668', class: `help_icon` }, h("svg", { key: '18b1ec120ffc289f04d1df92be1c7d9669d663de', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { key: 'd2eb8ccb7ee678c0a46b9fa55913d128d72567a8', d: "M6.66665 6C6.66665 5.26362 7.2636 4.66667 7.99998 4.66667C8.73636 4.66667 9.33331 5.26362 9.33331 6C9.33331 6.26543 9.25575 6.51275 9.12205 6.72053C8.72358 7.33978 7.99998 7.93029 7.99998 8.66667V9M7.99464 11.3333H8.00063M14.6666 8C14.6666 11.6819 11.6819 14.6667 7.99998 14.6667C4.31808 14.6667 1.33331 11.6819 1.33331 8C1.33331 4.3181 4.31808 1.33333 7.99998 1.33333C11.6819 1.33333 14.6666 4.3181 14.6666 8Z", stroke: "#697586", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), h("div", { key: '97f0e4b66ef08d78675f512a88781ee16c369b7a', class: "dropdown_icon" }, h("svg", { key: '5a5c951c2b4346718aec0ca30e41ba9cf403fb66', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `${this.state}` }, h("path", { key: 'a3774b20923a5ca5e17f35d917f886c537211ac7', d: "M15 7.50004C15 7.50004 11.3176 12.5 9.99996 12.5C8.68237 12.5 5 7.5 5 7.5", stroke: "#697586", "stroke-width": "1.66667", "stroke-linecap": "round", "stroke-linejoin": "round" })))), this.showHintText && (h("p", { key: '1cfce3d104f643ca60ad27df1f78554fb59367f4', class: "text-sm-regular", style: { color: '#697586' } }, this.hintText))));
     }
     static get is() { return "gb-input-dropdown"; }
     static get encapsulation() { return "shadow"; }
@@ -77,7 +77,7 @@ export class GbInputDropdown {
                 "mutable": false,
                 "complexType": {
                     "original": "GeneralSizes",
-                    "resolved": "\"lg\" | \"md\" | \"profile_lg\" | \"profile_md\" | \"profile_sm\" | \"sm\" | \"xl\" | \"xl2\" | \"xl3\" | \"xl4\" | \"xs\"",
+                    "resolved": "\"lg\" | \"md\" | \"profile_lg\" | \"profile_md\" | \"profile_sm\" | \"sm\" | \"xl\" | \"xl2\" | \"xl3\" | \"xl4\" | \"xs\" | \"xxs\"",
                     "references": {
                         "GeneralSizes": {
                             "location": "import",