globuswebcomponents 1.5.9 → 1.6.1

package/dist/collection/components/gb-breadcrumbs/gb-breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"gb-breadcrumbs.js","sourceRoot":"","sources":["../../../src/components/gb-breadcrumbs/gb-breadcrumbs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, Prop, h } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'gb-breadcrumbs',\r\n  styleUrl: 'gb-breadcrumbs.css',\r\n  shadow: true,\r\n})\r\nexport class GbBreadcrumbs {\r\n  @Prop() divider: 'chevron' | 'slash';\r\n  @Prop() type: 'text' | 'text_with_line' | 'button_primary' | 'button_gray' | 'button_gray_with_border';\r\n  @Prop() firstLink: boolean = false;\r\n  @Prop() secondLink: boolean = false;\r\n  @Prop() thirdLink: boolean = false;\r\n  @Prop() fourthLink: boolean = false;\r\n  @Prop() fifthLink: boolean = false;\r\n  @Event() linkClicked: EventEmitter<void>;\r\n\r\n  onHomeButtonClicked() {}\r\n\r\n  onLinkClicked(index: number) {\r\n    if(index === 0) {\r\n\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class={`breadcrumbs_div ${this.type}`}>\r\n        <div class={`tabs ${this.type}`}>\r\n          <gb-breadcrumb-button-base\r\n            icon={true}\r\n            type={\r\n              this.type === 'text'\r\n                ? 'text'\r\n                : this.type === 'text_with_line'\r\n                ? 'text'\r\n                : this.type === 'button_primary'\r\n                ? 'buttton_primary'\r\n                : this.type === 'button_gray'\r\n                ? 'button_gray'\r\n                : this.type === 'button_gray_with_border'\r\n                ? 'button_gray'\r\n                : null\r\n            }\r\n            current={false}\r\n            onClick={() => this.onHomeButtonClicked()}\r\n          ></gb-breadcrumb-button-base>\r\n          {this.divider === 'chevron' ? (\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <path d=\"M6.00003 4C6.00003 4 9.99999 6.94596 10 8.00003C10 9.05411 6 12 6 12\" stroke=\"#CDD5DF\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n            </svg>\r\n          ) : (\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n              <path d=\"M5.83325 18.3334L14.1666 1.66669\" stroke=\"#CDD5DF\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n            </svg>\r\n          )}\r\n          {this.firstLink && (\r\n            <gb-breadcrumb-button-base\r\n              icon={false}\r\n              type={\r\n                this.type === 'text'\r\n                  ? 'text'\r\n                  : this.type === 'text_with_line'\r\n                  ? 'text'\r\n                  : this.type === 'button_primary'\r\n                  ? 'buttton_primary'\r\n                  : this.type === 'button_gray'\r\n                  ? 'button_gray'\r\n                  : this.type === 'button_gray_with_border'\r\n                  ? 'button_gray'\r\n                  : null\r\n              }\r\n              current={false}\r\n              label=\"Projects\"\r\n            ></gb-breadcrumb-button-base>\r\n          )}\r\n          {this.divider === 'chevron' ? (\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <path d=\"M6.00003 4C6.00003 4 9.99999 6.94596 10 8.00003C10 9.05411 6 12 6 12\" stroke=\"#CDD5DF\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n            </svg>\r\n          ) : (\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n              <path d=\"M5.83325 18.3334L14.1666 1.66669\" stroke=\"#CDD5DF\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n            </svg>\r\n          )}\r\n          <gb-breadcrumb-button-base\r\n            icon={false}\r\n            type={\r\n              this.type === 'text'\r\n                ? 'text'\r\n                : this.type === 'text_with_line'\r\n                ? 'text'\r\n                : this.type === 'button_primary'\r\n                ? 'buttton_primary'\r\n                : this.type === 'button_gray'\r\n                ? 'button_gray'\r\n                : this.type === 'button_gray_with_border'\r\n                ? 'button_gray'\r\n                : null\r\n            }\r\n            current={false}\r\n            label=\"Projects\"\r\n          ></gb-breadcrumb-button-base>\r\n          {this.divider === 'chevron' ? (\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <path d=\"M6.00003 4C6.00003 4 9.99999 6.94596 10 8.00003C10 9.05411 6 12 6 12\" stroke=\"#CDD5DF\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n            </svg>\r\n          ) : (\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n              <path d=\"M5.83325 18.3334L14.1666 1.66669\" stroke=\"#CDD5DF\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n            </svg>\r\n          )}\r\n          <gb-breadcrumb-button-base\r\n            icon={false}\r\n            type={\r\n              this.type === 'text'\r\n                ? 'text'\r\n                : this.type === 'text_with_line'\r\n                ? 'text'\r\n                : this.type === 'button_primary'\r\n                ? 'buttton_primary'\r\n                : this.type === 'button_gray'\r\n                ? 'button_gray'\r\n                : this.type === 'button_gray_with_border'\r\n                ? 'button_gray'\r\n                : null\r\n            }\r\n            current={false}\r\n            label=\"Projects\"\r\n          ></gb-breadcrumb-button-base>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"gb-breadcrumbs.js","sourceRoot":"","sources":["../../../src/components/gb-breadcrumbs/gb-breadcrumbs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h, Event, EventEmitter, State } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'gb-breadcrumbs',\r\n  styleUrl: 'gb-breadcrumbs.css',\r\n  shadow: true,\r\n})\r\nexport class GbBreadcrumbs {\r\n  @Prop() type: 'text' | 'text_with_line' | 'button_primary' | 'button_gray' | 'button_gray_with_border' = 'text';\r\n  @Prop() divider: 'chevron' | 'slash' = 'chevron';\r\n  @Prop() breadcrumbs: { label: string; id: string; url: string }[] = [\r\n    // { label: 'Projects', id: 'projects' },\r\n    // { label: 'Design System', id: 'design-system' },\r\n    // { label: 'Buttons', id: 'buttons' },\r\n  ];\r\n  @Prop() icon?: string;\r\n  @Event() breadcrumbClicked: EventEmitter<{ id: string; url?: string }>;\r\n  @State() visibleBreadcrumbs: { label: string; id: string; url?: string }[] = [];\r\n\r\n  componentWillLoad() {\r\n    this.visibleBreadcrumbs = [...this.breadcrumbs];\r\n  }\r\n\r\n  private handleBreadcrumbClick(clickedId: string, url: string) {\r\n    const index = this.visibleBreadcrumbs.findIndex(b => b.id === clickedId);\r\n    if (index !== -1) {\r\n      this.visibleBreadcrumbs = this.visibleBreadcrumbs.slice(0, index + 1);\r\n      this.breadcrumbClicked.emit({ id: clickedId, url });\r\n    }\r\n  }\r\n\r\n  private handleHomeClick() {\r\n    this.visibleBreadcrumbs = [];\r\n    this.breadcrumbClicked.emit({ id: 'home' });\r\n  }\r\n\r\n  private renderDivider() {\r\n    return this.divider === 'chevron' ? (\r\n      <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n        <path d=\"M6 4C6 4 10 6.946 10 8C10 9.054 6 12 6 12\" stroke=\"#CDD5DF\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n      </svg>\r\n    ) : (\r\n      <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n        <path d=\"M5.833 18.333L14.167 1.667\" stroke=\"#CDD5DF\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n      </svg>\r\n    );\r\n  }\r\n\r\n  private resolveType() {\r\n    switch (this.type) {\r\n      case 'text':\r\n      case 'text_with_line':\r\n        return 'text';\r\n      case 'button_primary':\r\n        return 'button_primary';\r\n      case 'button_gray':\r\n      case 'button_gray_with_border':\r\n        return 'button_gray';\r\n      default:\r\n        return 'text';\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const btnType = this.resolveType();\r\n\r\n    return (\r\n      <div class={`breadcrumbs_div ${this.type}`}>\r\n        <div class={`tabs ${this.type}`}>\r\n          {/* Home button */}\r\n          <gb-breadcrumb-button-base\r\n            icon={true}\r\n            icon-src={this.icon}\r\n            type={btnType}\r\n            current={this.visibleBreadcrumbs.length === 0}\r\n            onClick={() => this.handleHomeClick()}\r\n          ></gb-breadcrumb-button-base>\r\n\r\n          {this.visibleBreadcrumbs.map((breadcrumb, index) => (\r\n            <div class=\"breadcrumb-item\" key={breadcrumb.id}>\r\n              {this.renderDivider()}\r\n              <gb-breadcrumb-button-base\r\n                icon={false}\r\n                label={breadcrumb.label}\r\n                type={btnType}\r\n                current={index === this.visibleBreadcrumbs.length - 1}\r\n                onClick={() => this.handleBreadcrumbClick(breadcrumb.id, breadcrumb.url)}\r\n              ></gb-breadcrumb-button-base>\r\n            </div>\r\n          ))}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/gb-btn/gb-btn.css

@@ -2891,7 +2891,7 @@ button.link_gray:active{
   color: var(--color-text-bold, #202939);
 }
 
-button.link_gray:active{
+button.link_color:active{
   text-decoration: none;
   color: var(--color-link-pressed, #064E94);
 }
@@ -2961,8 +2961,6 @@ button.link_color.disabled{
 
 .btn_text{
   white-space: nowrap;
-}
-
-.btn_text::first-letter{
-  text-transform: uppercase;
+  display: flex;
+  align-items: center;
 }

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

@@ -65,7 +65,7 @@ export class GbButton {
         return h("div", { class: "icon right-icon", innerHTML: this.trailingIconSvg });
     }
     render() {
-        return (h("button", { key: '438b5cc89efbb323dd23635828f9f70f8f02b3da', class: this.getButtonClasses() }, this.iconLeading && this.icon === 'default' && this.renderLeadingIcon(), this.icon === 'default' && (h("div", { key: '294de2320ac4e3ba0671c345ff1dbcea977aeeb0', class: `btn_text` }, h("slot", { key: 'fcd25debcb05cce554c66456b7853312989dfb21' }))), this.iconTrailing && this.renderTrailingIcon(), this.icon === 'only' && this.renderLeadingIcon()));
+        return (h("button", { key: '7fba478bb4ec5cf7341ef16e12dfbf2be62b04e7', class: this.getButtonClasses() }, this.iconLeading && this.icon === 'default' && this.renderLeadingIcon(), this.icon === 'default' && (h("div", { key: '607972ad9ff3f7ba1cf319b906b48733ba4e2a4e', class: `btn_text` }, h("slot", { key: '85daa13aab8dd9f8b407a025645bb1cc108880af' }))), this.iconTrailing && this.renderTrailingIcon(), this.icon === 'only' && this.renderLeadingIcon()));
     }
     static get is() { return "gb-btn"; }
     static get originalStyleUrls() {

package/dist/collection/components/gb-button/gb-button.css

@@ -2891,7 +2891,7 @@ button.link_gray:active{
   color: var(--color-text-bold, #202939);
 }
 
-button.link_gray:active{
+button.link_color:active{
   text-decoration: none;
   color: var(--color-link-pressed, #064E94);
 }
@@ -2961,4 +2961,10 @@ button.link_color.disabled{
 
 .btn_text{
   white-space: nowrap;
+  display: flex;
+  align-items: center;
+}
+
+.btn_text::first-letter{
+  text-transform: uppercase;
 }

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

@@ -68,7 +68,7 @@ export class GbButton {
         return h("div", { class: "icon right-icon", innerHTML: this.trailingIconSvg });
     }
     render() {
-        return (h("button", { key: '1c77841e69d4a47a5003ba6caba4c10d12a9028d', disabled: this.state === 'disabled', class: this.getButtonClasses() }, this.iconLeading && this.icon === 'default' && this.renderLeadingIcon(), this.icon === 'default' && h("slot", { key: '7556e232cfcf90b2872a3634d0405f7d61ca4574' }), this.iconTrailing && this.renderTrailingIcon(), this.icon === 'only' && this.renderLeadingIcon()));
+        return (h("button", { key: '0616f0dcab44ca4d1de0df7c9c50d5eba8aab10e', disabled: this.state === 'disabled', class: this.getButtonClasses() }, this.iconLeading && this.icon === 'default' && this.renderLeadingIcon(), this.icon === 'default' && h("slot", { key: '833d3b309676f0a71aff32fefe296bb123ae2388' }), this.iconTrailing && this.renderTrailingIcon(), this.icon === 'only' && this.renderLeadingIcon()));
     }
     static get is() { return "gb-button"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class GbButtonClose {
     render() {
-        return (h("div", { key: '3fb6237a0d4c85a0a0447942469ef8a63149a8db', class: `${this.size} ${this.color}` }, h("svg", { key: '22f50f654d3aa4370e24d262b9625618e6b39b88', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", class: `${this.size}` }, h("path", { key: 'e6dec366254590eebdaf5937fc67367afaf69aa6', d: "M19.0005 4.99988L5.00049 18.9999M5.00049 4.99988L19.0005 18.9999", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))));
+        return (h("div", { key: 'f9b037216a499c0e8d634e89c6eea93d19ec7448', class: `${this.size} ${this.color}` }, h("svg", { key: '77478a8766eb80a9be792b3ca030932f16398ea2', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", class: `${this.size}` }, h("path", { key: '92d8b9a142a61c50276da6510e0fa228fb6d395d', d: "M19.0005 4.99988L5.00049 18.9999M5.00049 4.99988L19.0005 18.9999", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))));
     }
     static get is() { return "gb-button-close"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-card-icon/gb-card-icon.css

@@ -2702,7 +2702,18 @@
   background: var(--color-background-card, #ffffff);
 }
 
-.icon {
+.icon_svg {
   width: 1.125rem;
   height: 1.125rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.icon_svg path[stroke]{
+  stroke: var(--color-icon-bold, #202939)
+}
+
+.icon_svg path[fill]{
+  fill: var(--color-icon-bold, #202939)
 }

package/dist/collection/components/gb-card-icon/gb-card-icon.js

@@ -2,10 +2,19 @@ import { getAssetPath, h } from "@stencil/core";
 export class GbCardIcon {
     constructor() {
         this.icon = '';
+        this.leadingIconSvg = '';
+    }
+    async loadIcon(iconName) {
+        const iconPath = getAssetPath(`${iconName}`);
+        const response = await fetch(iconPath);
+        const svg = await response.text();
+        this.leadingIconSvg = svg;
+    }
+    componentWillLoad() {
+        this.loadIcon(this.icon);
     }
     render() {
-        const iconSrc = getAssetPath(this.icon);
-        return (h("div", { key: '0ddeec0af91be69b15cd3a6a9e4d1c67f6dfff3d', class: `card_icon_div ${this.color}` }, h("img", { key: '2db2f8459fe8a00480f699faac8b5208a52deccc', src: iconSrc, class: "icon", alt: "" })));
+        return (h("div", { key: '6317fd91801dd57364c8608ede4c3dc56ec90edb', class: `card_icon_div ${this.color}` }, h("div", { key: '05659a147df5666cd43f31c80e0285c68d3061ec', class: `icon_svg`, innerHTML: this.leadingIconSvg })));
     }
     static get is() { return "gb-card-icon"; }
     static get encapsulation() { return "shadow"; }
@@ -68,5 +77,10 @@ export class GbCardIcon {
             }
         };
     }
+    static get states() {
+        return {
+            "leadingIconSvg": {}
+        };
+    }
 }
 //# sourceMappingURL=gb-card-icon.js.map

package/dist/collection/components/gb-card-icon/gb-card-icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"gb-card-icon.js","sourceRoot":"","sources":["../../../src/components/gb-card-icon/gb-card-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AASjE,MAAM,OAAO,UAAU;IANvB;QAQY,SAAI,GAAW,EAAE,CAAC;KAW7B;IATG,MAAM;QACF,MAAM,OAAO,GAAG,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAExC,OAAO,CACH,4DAAK,KAAK,EAAE,iBAAiB,IAAI,CAAC,KAAK,EAAE;YACrC,4DAAK,GAAG,EAAE,OAAO,EAAE,KAAK,EAAC,MAAM,EAAC,GAAG,EAAC,EAAE,GAAG,CACvC,CACT,CAAA;IACL,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ","sourcesContent":["import { Component, Prop, getAssetPath, h } from \"@stencil/core\";\r\nimport { ColorTypes } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n    tag: 'gb-card-icon',\r\n    styleUrl: 'gb-card-icon.css',\r\n    shadow: true\r\n})\r\n\r\nexport class GbCardIcon {\r\n    @Prop() color: ColorTypes;\r\n    @Prop() icon: string = '';\r\n\r\n    render() {\r\n        const iconSrc = getAssetPath(this.icon);\r\n\r\n        return (\r\n            <div class={`card_icon_div ${this.color}`}>\r\n                <img src={iconSrc} class=\"icon\" alt=\"\" />\r\n            </div>\r\n        )\r\n    }\r\n}"]}
+{"version":3,"file":"gb-card-icon.js","sourceRoot":"","sources":["../../../src/components/gb-card-icon/gb-card-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAQxE,MAAM,OAAO,UAAU;IALvB;QAOU,SAAI,GAAW,EAAE,CAAC;QACjB,mBAAc,GAAW,EAAE,CAAC;KAoBtC;IAlBC,KAAK,CAAC,QAAQ,CAAC,QAAgB;QAC7B,MAAM,QAAQ,GAAG,YAAY,CAAC,GAAG,QAAQ,EAAE,CAAC,CAAC;QAC7C,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,QAAQ,CAAC,CAAC;QACvC,MAAM,GAAG,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;QAClC,IAAI,CAAC,cAAc,GAAG,GAAG,CAAC;IAC5B,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC;IAED,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAE,iBAAiB,IAAI,CAAC,KAAK,EAAE;YACvC,4DAAK,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,IAAI,CAAC,cAAc,GAAQ,CAC1D,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, State, getAssetPath, h } from '@stencil/core';\r\nimport { ColorTypes } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-card-icon',\r\n  styleUrl: 'gb-card-icon.css',\r\n  shadow: true,\r\n})\r\nexport class GbCardIcon {\r\n  @Prop() color: ColorTypes;\r\n  @Prop() icon: string = '';\r\n  @State() leadingIconSvg: string = '';\r\n\r\n  async loadIcon(iconName: string) {\r\n    const iconPath = getAssetPath(`${iconName}`);\r\n    const response = await fetch(iconPath);\r\n    const svg = await response.text();\r\n    this.leadingIconSvg = svg;\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.loadIcon(this.icon);\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class={`card_icon_div ${this.color}`}>\r\n        <div class={`icon_svg`} innerHTML={this.leadingIconSvg}></div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/gb-carousel-arrow/gb-carousel-arrow.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class GbCarouselArrow {
     render() {
-        return (h("div", { key: 'db25974e5af9a4c42a427853ec9ef6374ed7122f', class: `carousel_arrow ${this.size}` }, this.chevron === 'left' && (h("svg", { key: '9267bc4f091a5d7c40e6b7eb3b46c54de0fc150c', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, h("path", { key: 'b5000566a6d5aaa7955553433a9f4c143911e72e', d: "M15 5.99989C15 5.99989 9.00001 10.4188 9 11.9999C8.99999 13.5811 15 17.9999 15 17.9999", stroke: "#202939", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.chevron === 'right' && (h("svg", { key: 'c2728061cb1d39ff2f9714e5bee131ab31d38978', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '223b78a4f5b120f28617f8068c16ebb2280197a2', d: "M9.00005 6C9.00005 6 15 10.4189 15 12C15 13.5812 9 18 9 18", stroke: "#202939", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))));
+        return (h("div", { key: 'e81d856b51283aad5f8aa1aad6c680688e733d7a', class: `carousel_arrow ${this.size}` }, this.chevron === 'left' && (h("svg", { key: '1148484a7c1c767514d8605feb8c2d977978e3e9', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '588632cfd203e7a870dafd1f8304554c6694c601', d: "M15 5.99989C15 5.99989 9.00001 10.4188 9 11.9999C8.99999 13.5811 15 17.9999 15 17.9999", stroke: "#202939", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))), this.chevron === 'right' && (h("svg", { key: 'c838bf5bd90067b25af9be4a08d87d9b9f72edd3', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, h("path", { key: '03a9db61d29fde9f487086ceffd4fe6ab66e45b5', d: "M9.00005 6C9.00005 6 15 10.4189 15 12C15 13.5812 9 18 9 18", stroke: "#202939", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })))));
     }
     static get is() { return "gb-carousel-arrow"; }
     static get originalStyleUrls() {

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

@@ -36,7 +36,7 @@ export class GbCheckbox {
         this.checkboxClicked.emit(event.detail);
     }
     render() {
-        return (h("div", { key: '2870429440caed2e990f9d59f2104781c46ab630', class: `checkbox_div ${this.size} ${this.text ? 'text_class' : ''}` }, h("div", { key: '0e570bba4f8382b05a59e990e15610d24e47c20e', class: `checkbox_base ${!this.supportingText ? 'checkbox_no_supporting_text' : ''}` }, h("gb-checkbox-base", { key: '29efc016d035189f954c5d6859d9d24bfbab4647', size: this.size, type: this.type, state: this.state, indeterminate: this.indeterminate, onCheckboxClicked: this.onCheckboxClicked.bind(this) })), this.text && (h("div", { key: '4c116b99ce028e5057cb6ff904fe2b36423c3064', class: `text ${!this.supportingText ? 'no_supporting_text' : ''}` }, h("slot", { key: 'e05609995ce1b21ae47f23c3b46a30c5de686f74', name: "label" }), this.supportingText && h("slot", { key: '9b1fbf444de60a5591b3a35a5f81df5c1193f3a6', name: "supporting_text" })))));
+        return (h("div", { key: '8d6624d183b4d1588af485a326566f52fe57588a', class: `checkbox_div ${this.size} ${this.text ? 'text_class' : ''}` }, h("div", { key: 'a4a769b0a2122d71bdc2e5b93937d2fa7b989394', class: `checkbox_base ${!this.supportingText ? 'checkbox_no_supporting_text' : ''}` }, h("gb-checkbox-base", { key: 'fb65507e3af67068800d6e27d7cf52b4badf93e6', size: this.size, type: this.type, state: this.state, indeterminate: this.indeterminate, onCheckboxClicked: this.onCheckboxClicked.bind(this) })), this.text && (h("div", { key: '7cfd13a29394a21611d07ee2660ecb818d5b0aba', class: `text ${!this.supportingText ? 'no_supporting_text' : ''}` }, h("slot", { key: '4797b3a14a8eb41ac56ca0c8986a28cffc8f30bb', name: "label" }), this.supportingText && h("slot", { key: 'd54ddcdef92750788d95ed0ee5dc6c0b8116cd38', name: "supporting_text" })))));
     }
     static get is() { return "gb-checkbox"; }
     static get encapsulation() { return "shadow"; }

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

@@ -100,7 +100,7 @@ export class GbCheckboxBase {
         }
     }
     render() {
-        return (h("div", { key: '95a70494f3ff83031d5f4a958065fc827bc21976', class: `checkbox_container ${this.size}`, onClick: () => {
+        return (h("div", { key: 'dba46d9b981ceb4eb7c7cc91dccb3b52dd1279e2', class: `checkbox_container ${this.size}`, onClick: () => {
                 if (this.type === 'checkbox') {
                     return this.toggleCheckboxState();
                 }

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

@@ -5,7 +5,7 @@ export class GbCheckboxGroup {
         this.selected = false;
     }
     render() {
-        return (h("div", { key: '248e3905b4596385a1b828cffa53b7e79096a4d6', class: `checkbox_group` }, h("gb-checkbox-group-item", { key: '79b162b7f1a05bc746e00b58f373b14e16f65f61', size: this.size, type: this.type, breakpoint: this.breakpoint }), h("gb-checkbox-group-item", { key: 'b28671081eab8e2a1a2db823f19a7d843e916d85', size: this.size, type: this.type, breakpoint: this.breakpoint }), h("gb-checkbox-group-item", { key: '47a81fe6c8d7bb75f75f8ae9e946cbd057364716', size: this.size, type: this.type, breakpoint: this.breakpoint }), h("gb-checkbox-group-item", { key: '89c81c729eca4e21cfb65a5cf83307614d8a6aef', size: this.size, type: this.type, breakpoint: this.breakpoint }), h("gb-checkbox-group-item", { key: '2fb1545d1b3c6efc3a6207fd2532b87654093d42', size: this.size, type: this.type, breakpoint: this.breakpoint })));
+        return (h("div", { key: '528a1679fe6341f133014de9f2708cbb762cdc6b', class: `checkbox_group` }, h("gb-checkbox-group-item", { key: '339e513754454baa5fe0e7a8688563ff2c6b0c28', size: this.size, type: this.type, breakpoint: this.breakpoint }), h("gb-checkbox-group-item", { key: '5497fac8e0225f8f24fa58f1d37c6eb610c43c9b', size: this.size, type: this.type, breakpoint: this.breakpoint }), h("gb-checkbox-group-item", { key: '4a1f8233343df620aac4bead5b92bf337d60e01a', size: this.size, type: this.type, breakpoint: this.breakpoint }), h("gb-checkbox-group-item", { key: 'ef121bc1fae5e454a8449aead59586a0d3dc04d9', size: this.size, type: this.type, breakpoint: this.breakpoint }), h("gb-checkbox-group-item", { key: '27ac8dc531ccbd6d007510f1646b9c4af2956347', size: this.size, type: this.type, breakpoint: this.breakpoint })));
     }
     static get is() { return "gb-checkbox-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-checkbox-group-item/gb-checkbox-group-item.js

@@ -82,7 +82,7 @@ export class GbCheckboxGroupItem {
     }
     render() {
         return [
-            h("div", { key: '43f3dcadf217f3849ecca1aad480cf2eabcb8519', class: `checkbox_group_item ${this.size} ${this.state} ${this.selected ? 'selected' : ''} ${this.breakpoint}`, onClick: () => this.toggleSelection() }, h("div", { key: 'a628392cd0dc06013c3e6752d2d45ad82d4ef612', class: "item-content" }, this.renderIcon(), h("div", { key: '34fb87bca07db50a2312fbbd5a599c166c1067d5', class: "text-container" }, h("div", { key: '71373cf427e63780e5774a107969b5640c351842', class: `label-cost ${this.type}` }, h("slot", { key: '8ed37901bb189f283805d3b398698ad2ac038acf', name: "label" }), this.showCost && h("slot", { key: 'fe73f79fdf420cfddfb7e73e6dee3e301ed6be7a', name: "cost" })), this.type === 'payment_icon' ? (h("div", { class: "buttons" }, h("gb-button", { size: this.size, hierarchy: "link_gray", icon: "default", state: this.state }, h("p", null, "Set as default")), h("gb-button", { size: this.size, hierarchy: "link_color", icon: "default", state: this.state }, h("p", null, "Edit")))) : (h("slot", { name: "supporting_text" })))), this.type === 'icon_simple' || this.type === 'avatar' || this.type === 'payment_icon' ? (h("div", { class: `checkbox_container` }, h("gb-checkbox", { type: 'check_circle', size: this.size, state: this.state, checked: this.selected }))) : null),
+            h("div", { key: '953bfb70ebf722f881d0448a9500d92479751942', class: `checkbox_group_item ${this.size} ${this.state} ${this.selected ? 'selected' : ''} ${this.breakpoint}`, onClick: () => this.toggleSelection() }, h("div", { key: 'ac9c9a3d0765e9b7eff9369fc2c6d8b92ea33a82', class: "item-content" }, this.renderIcon(), h("div", { key: 'd8b5df9b9b56cab6dc30c3390ce7d43a90c14c14', class: "text-container" }, h("div", { key: 'b23fdd4f2723735129781ccd9060032e6193d350', class: `label-cost ${this.type}` }, h("slot", { key: 'dd32344461bb69b5038b1167f4c879c0f965fc50', name: "label" }), this.showCost && h("slot", { key: '789b317a2cc42f07fa4e704bb3633f085e433891', name: "cost" })), this.type === 'payment_icon' ? (h("div", { class: "buttons" }, h("gb-button", { size: this.size, hierarchy: "link_gray", icon: "default", state: this.state }, h("p", null, "Set as default")), h("gb-button", { size: this.size, hierarchy: "link_color", icon: "default", state: this.state }, h("p", null, "Edit")))) : (h("slot", { name: "supporting_text" })))), this.type === 'icon_simple' || this.type === 'avatar' || this.type === 'payment_icon' ? (h("div", { class: `checkbox_container` }, h("gb-checkbox", { type: 'check_circle', size: this.size, state: this.state, checked: this.selected }))) : null),
         ];
     }
     static get is() { return "gb-checkbox-group-item"; }

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

@@ -23,9 +23,9 @@ export class GbCollapseButton {
     }
     render() {
         return [
-            h("div", { key: '67095b14b255cbe1bc5b313d9a273ccef131adfc' }, h("div", { key: 'bfb01e6f986555afac64006e309d8ca024bccbcc', class: `collapse_btn ${this.color}`, onClick: this.toggleIcon.bind(this), onMouseOver: () => (this.isHovered = true), onMouseOut: () => (this.isHovered = false) }, this.action === 'collapse' && [
-                h("svg", { key: '64610b3e8b0949aafe38314a7652687f7a2080d4', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `icon ${this.color}` }, h("path", { key: 'a5d112e187d384fd0dedc76bd4975b70dabed8e3', d: "M9.58321 15C9.58321 15 4.58326 11.3176 4.58325 9.99996C4.58324 8.68237 9.58325 5 9.58325 5M15.4165 15C15.4165 15 10.4166 11.3176 10.4166 9.99996C10.4166 8.68237 15.4166 5 15.4166 5", stroke: "#4B5565", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })),
-            ], this.action === 'expand' && (h("svg", { key: '2720de598d9fa8102913fa5304dcd00e4eea8bbf', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `icon ${this.color}` }, h("path", { key: 'e2b0e0bf07a5474361d929293b13f563c813d2ea', d: "M10.4166 15C10.4166 15 15.4166 11.3176 15.4166 9.99996C15.4166 8.68237 10.4166 5 10.4166 5M4.58329 15C4.58329 15 9.58324 11.3176 9.58325 9.99996C9.58326 8.68237 4.58325 5 4.58325 5", stroke: "#4B5565", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), this.isHovered && this.action === 'collapse' ? (h("gb-tooltip", { class: "tooltip", "show-arrow": true, arrow: "left" }, h("p", { slot: "label", class: "text-xs-semi-bold" }, "Collapse"))) : this.isHovered && this.action === 'expand' ? (h("gb-tooltip", { class: "tooltip", "show-arrow": true, arrow: "left" }, h("p", { slot: "label", class: "text-xs-semi-bold" }, "Expand"))) : null),
+            h("div", { key: '8e807763d048c18c45999db5f8ec6c1b35346615' }, h("div", { key: '65b14bf3d9e91b93773b962de915fbee77fbab93', class: `collapse_btn ${this.color}`, onClick: this.toggleIcon.bind(this), onMouseOver: () => (this.isHovered = true), onMouseOut: () => (this.isHovered = false) }, this.action === 'collapse' && [
+                h("svg", { key: '24d7b85119bf663a8bd6139f5071405287d350c0', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `icon ${this.color}` }, h("path", { key: 'd4928dcc5d03414a564b093f5e31a7ef62c87e8f', d: "M9.58321 15C9.58321 15 4.58326 11.3176 4.58325 9.99996C4.58324 8.68237 9.58325 5 9.58325 5M15.4165 15C15.4165 15 10.4166 11.3176 10.4166 9.99996C10.4166 8.68237 15.4166 5 15.4166 5", stroke: "#4B5565", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })),
+            ], this.action === 'expand' && (h("svg", { key: '16cc1c67a068625eb2a6d33c85241df32dead581', xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", class: `icon ${this.color}` }, h("path", { key: 'b300ae63fc5af5dceac1963aeeaccfdd1c748090', d: "M10.4166 15C10.4166 15 15.4166 11.3176 15.4166 9.99996C15.4166 8.68237 10.4166 5 10.4166 5M4.58329 15C4.58329 15 9.58324 11.3176 9.58325 9.99996C9.58326 8.68237 4.58325 5 4.58325 5", stroke: "#4B5565", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))), this.isHovered && this.action === 'collapse' ? (h("gb-tooltip", { class: "tooltip", "show-arrow": true, arrow: "left" }, h("p", { slot: "label", class: "text-xs-semi-bold" }, "Collapse"))) : this.isHovered && this.action === 'expand' ? (h("gb-tooltip", { class: "tooltip", "show-arrow": true, arrow: "left" }, h("p", { slot: "label", class: "text-xs-semi-bold" }, "Expand"))) : null),
         ];
     }
     static get is() { return "gb-collapse-button"; }

package/dist/collection/components/gb-comment/gb-comment.css

@@ -2678,6 +2678,7 @@
   background: var(--color-background-information-subtlest, #E4F0FC);
   box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
   /* transition: 1s ease-in-out; */
+  width: 100%;
 }
 
 .header {

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

@@ -5,30 +5,30 @@ export class GbComment {
         this.noCommentText = 'No comment yet';
         this.noCommentTextSub = 'No reviewer has left a comment yet, you will be notified when a comment drops';
         this.comments = [
-            {
-            // name: 'Prince Ogheneriere',
-            // role: 'Authorizer',
-            // comment: 'This is error and fraud free. I concur',
-            // timestamp: '07-Oct-2024 6:00PM' ,
-            },
-            // {
-            //   name: 'Prince Ogheneriere',
-            //   role: 'Authorizer',
-            //   comment: 'This is error and fraud free. I concur',
-            //   timestamp: '07-Oct-2024 6:00PM',
-            // },
-            // {
-            //   name: 'Prince Ogheneriere',
-            //   role: 'Authorizer',
-            //   comment: 'I concur to the transactions in this call-over',
-            //   timestamp: '07-Oct-2024 6:00PM',
-            // },
-            // {
-            //   name: 'Gideon',
-            //   role: 'Designer',
-            //   comment: 'I concur to the transactions in this call-over',
-            //   timestamp: '07-Nov-2024 6:00PM',
-            // },
+        // {
+        // name: 'Prince Ogheneriere',
+        // role: 'Authorizer',
+        // comment: 'This is error and fraud free. I concur',
+        // timestamp: '07-Oct-2024 6:00PM' ,
+        // },
+        // {
+        //   name: 'Prince Ogheneriere',
+        //   role: 'Authorizer',
+        //   comment: 'This is error and fraud free. I concur',
+        //   timestamp: '07-Oct-2024 6:00PM',
+        // },
+        // {
+        //   name: 'Prince Ogheneriere',
+        //   role: 'Authorizer',
+        //   comment: 'I concur to the transactions in this call-over',
+        //   timestamp: '07-Oct-2024 6:00PM',
+        // },
+        // {
+        //   name: 'Gideon',
+        //   role: 'Designer',
+        //   comment: 'I concur to the transactions in this call-over',
+        //   timestamp: '07-Nov-2024 6:00PM',
+        // },
         ];
     }
     toggleComments() {
@@ -43,7 +43,7 @@ export class GbComment {
         const hasComments = this.comments && this.comments.length > 0;
         const patternSrc = getAssetPath(`assets/background_pattern.svg`);
         const illustrationSrc = getAssetPath(`assets/illustration.svg`);
-        return (h("div", { key: '266c9b9f12289122570fe1d069480d56d06c29dc', class: `comments-container ${!hasComments ? 'no-comments-state' : ''}` }, h("div", { key: 'f2c725cae7bab68b0ed5756d8cd85f0d12e0fe1f', class: `header ${this.state}` }, h("div", { key: 'cc402d1f06f69740414e97185255b9e6886b21d3', class: "title-section" }, h("svg", { key: '99fb8b8b03247a4d48a7fc502a99d7c3841f5edd', width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", class: "info-icon" }, h("path", { key: '76665b980963c51c55fab37dec4f685bb700be3b', opacity: "0.4", d: "M12.0572 1.75C14.2479 1.74999 15.9686 1.74998 17.312 1.93059C18.6886 2.11568 19.7809 2.50271 20.6391 3.36091C21.4973 4.21911 21.8843 5.31137 22.0694 6.68802C22.25 8.03143 22.25 9.7521 22.25 11.9428V11.9428V12.0572V12.0572C22.25 14.2479 22.25 15.9686 22.0694 17.312C21.8843 18.6886 21.4973 19.7809 20.6391 20.6391C19.7809 21.4973 18.6886 21.8843 17.312 22.0694C15.9686 22.25 14.2479 22.25 12.0572 22.25H12.0572H11.9428H11.9428C9.7521 22.25 8.03143 22.25 6.68802 22.0694C5.31137 21.8843 4.21911 21.4973 3.36091 20.6391C2.50271 19.7809 2.11568 18.6886 1.93059 17.312C1.74998 15.9686 1.74999 14.2479 1.75 12.0572V11.9428C1.74999 9.75212 1.74998 8.03144 1.93059 6.68802C2.11568 5.31137 2.50272 4.21911 3.36091 3.36091C4.21911 2.50272 5.31137 2.11568 6.68802 1.93059C8.03144 1.74998 9.75212 1.74999 11.9428 1.75H12.0572Z", fill: "#064E94" }), h("path", { key: '805f2554fd1cf46d95f61ba7d6ceb14b401ebed8', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.6819 10.5273C11.9289 10.5605 12.2707 10.6494 12.5607 10.9394C12.8507 11.2294 12.9396 11.5711 12.9728 11.8182C13.0003 12.0228 13.0001 12.2608 13 12.4606C13 12.474 13 12.4871 13 12.5V16.5C13 17.0523 12.5523 17.5 12 17.5C11.4477 17.5 11 17.0523 11 16.5V12.5C10.4477 12.5 10 12.0523 10 11.5C10 10.9477 10.4477 10.5 11 10.5C11.0129 10.5 11.0261 10.5 11.0394 10.5C11.2393 10.4999 11.4772 10.4997 11.6819 10.5273Z", fill: "#064E94" }), h("path", { key: '341f31b1aefee0ab3a9fc32691dace1b23c76daa', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M10.9999 7.5C10.9999 6.94772 11.4456 6.5 11.9954 6.5H12.0044C12.5542 6.5 12.9999 6.94772 12.9999 7.5C12.9999 8.05228 12.5542 8.5 12.0044 8.5H11.9954C11.4456 8.5 10.9999 8.05228 10.9999 7.5Z", fill: "#064E94" })), h("h2", { key: 'a8d16e9a10fa79f399aa464b70fb3ad750f421a4', class: "text-md-semi-bold heading" }, this.heading)), h("gb-button", { key: '90510cf949ee43c6eacb534699a27c734651582b', size: "sm", hierarchy: "link_color", icon: "default", onClick: () => this.toggleComments() }, this.state === 'expanded' ? h("p", null, "Hide Comments") : h("p", null, "Show Comments"))), this.state === 'expanded' &&
+        return (h("div", { key: '3de7a3ffc935f85f741ab8216249a5b3989508ca', class: `comments-container ${!hasComments ? 'no-comments-state' : ''}` }, h("div", { key: 'bcc9f6ff1c7dcd69369a1f65e5fac8c674c7444c', class: `header ${this.state}` }, h("div", { key: '6d102c9e948126b1e567cf3b2b990e4febad1589', class: "title-section" }, h("svg", { key: '68153d81e89ebd48ebb6894420be1b0d244d1e4c', width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", class: "info-icon" }, h("path", { key: '2a2dc80368eb8a8b15d8a5caf63615d20a3cf53f', opacity: "0.4", d: "M12.0572 1.75C14.2479 1.74999 15.9686 1.74998 17.312 1.93059C18.6886 2.11568 19.7809 2.50271 20.6391 3.36091C21.4973 4.21911 21.8843 5.31137 22.0694 6.68802C22.25 8.03143 22.25 9.7521 22.25 11.9428V11.9428V12.0572V12.0572C22.25 14.2479 22.25 15.9686 22.0694 17.312C21.8843 18.6886 21.4973 19.7809 20.6391 20.6391C19.7809 21.4973 18.6886 21.8843 17.312 22.0694C15.9686 22.25 14.2479 22.25 12.0572 22.25H12.0572H11.9428H11.9428C9.7521 22.25 8.03143 22.25 6.68802 22.0694C5.31137 21.8843 4.21911 21.4973 3.36091 20.6391C2.50271 19.7809 2.11568 18.6886 1.93059 17.312C1.74998 15.9686 1.74999 14.2479 1.75 12.0572V11.9428C1.74999 9.75212 1.74998 8.03144 1.93059 6.68802C2.11568 5.31137 2.50272 4.21911 3.36091 3.36091C4.21911 2.50272 5.31137 2.11568 6.68802 1.93059C8.03144 1.74998 9.75212 1.74999 11.9428 1.75H12.0572Z", fill: "#064E94" }), h("path", { key: '747368ceba0b3d388c5b856c976876b6f91fb062', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.6819 10.5273C11.9289 10.5605 12.2707 10.6494 12.5607 10.9394C12.8507 11.2294 12.9396 11.5711 12.9728 11.8182C13.0003 12.0228 13.0001 12.2608 13 12.4606C13 12.474 13 12.4871 13 12.5V16.5C13 17.0523 12.5523 17.5 12 17.5C11.4477 17.5 11 17.0523 11 16.5V12.5C10.4477 12.5 10 12.0523 10 11.5C10 10.9477 10.4477 10.5 11 10.5C11.0129 10.5 11.0261 10.5 11.0394 10.5C11.2393 10.4999 11.4772 10.4997 11.6819 10.5273Z", fill: "#064E94" }), h("path", { key: '64b611af8e4a9b4819962c025156167236f1fea3', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M10.9999 7.5C10.9999 6.94772 11.4456 6.5 11.9954 6.5H12.0044C12.5542 6.5 12.9999 6.94772 12.9999 7.5C12.9999 8.05228 12.5542 8.5 12.0044 8.5H11.9954C11.4456 8.5 10.9999 8.05228 10.9999 7.5Z", fill: "#064E94" })), h("h2", { key: '6b4ac9767d160b4f4f76a1030dfa0f5dd88a2bc9', class: "text-md-semi-bold heading" }, this.heading)), h("gb-button", { key: '1f2d47132d5b06ffad19d6ed8ba68d375fdacde9', size: "sm", hierarchy: "link_color", icon: "default", onClick: () => this.toggleComments() }, this.state === 'expanded' ? h("p", null, "Hide Comments") : h("p", null, "Show Comments"))), this.state === 'expanded' &&
             (hasComments ? (h("div", { class: "comments-wrapper" }, this.comments.map((comment, index) => (h("gb-comment-item", { key: index, name: comment.name, duty: comment.role, comment: comment.comment, "time-stamp": comment.timeStamp, connector: this.comments.length > 1 && index < this.comments.length - 1 ? true : false }))))) : (h("div", { class: "container" }, h("div", { class: "frame" }, h("img", { src: patternSrc, alt: "", class: "empty_state_pattern" }), h("div", { class: "empty_state" }, h("div", { class: "content" }, h("img", { src: illustrationSrc, alt: "bell-icon", class: "bell_icon" }), h("div", { class: "text" }, h("p", { class: "main-text text-lg-semi-bold" }, this.noCommentText), h("p", { class: "sub-text text-sm-regular" }, this.noCommentTextSub))))))))));
     }
     static get is() { return "gb-comment"; }
@@ -155,7 +155,7 @@ export class GbComment {
                 },
                 "getter": false,
                 "setter": false,
-                "defaultValue": "[\r\n    {\r\n      // name: 'Prince Ogheneriere',\r\n      // role: 'Authorizer',\r\n      // comment: 'This is error and fraud free. I concur',\r\n      // timestamp: '07-Oct-2024 6:00PM' ,\r\n    },\r\n    // {\r\n    //   name: 'Prince Ogheneriere',\r\n    //   role: 'Authorizer',\r\n    //   comment: 'This is error and fraud free. I concur',\r\n    //   timestamp: '07-Oct-2024 6:00PM',\r\n    // },\r\n    // {\r\n    //   name: 'Prince Ogheneriere',\r\n    //   role: 'Authorizer',\r\n    //   comment: 'I concur to the transactions in this call-over',\r\n    //   timestamp: '07-Oct-2024 6:00PM',\r\n    // },\r\n    // {\r\n    //   name: 'Gideon',\r\n    //   role: 'Designer',\r\n    //   comment: 'I concur to the transactions in this call-over',\r\n    //   timestamp: '07-Nov-2024 6:00PM',\r\n    // },\r\n  ]"
+                "defaultValue": "[\r\n    // {\r\n      // name: 'Prince Ogheneriere',\r\n      // role: 'Authorizer',\r\n      // comment: 'This is error and fraud free. I concur',\r\n      // timestamp: '07-Oct-2024 6:00PM' ,\r\n    // },\r\n    // {\r\n    //   name: 'Prince Ogheneriere',\r\n    //   role: 'Authorizer',\r\n    //   comment: 'This is error and fraud free. I concur',\r\n    //   timestamp: '07-Oct-2024 6:00PM',\r\n    // },\r\n    // {\r\n    //   name: 'Prince Ogheneriere',\r\n    //   role: 'Authorizer',\r\n    //   comment: 'I concur to the transactions in this call-over',\r\n    //   timestamp: '07-Oct-2024 6:00PM',\r\n    // },\r\n    // {\r\n    //   name: 'Gideon',\r\n    //   role: 'Designer',\r\n    //   comment: 'I concur to the transactions in this call-over',\r\n    //   timestamp: '07-Nov-2024 6:00PM',\r\n    // },\r\n  ]"
             }
         };
     }

package/dist/collection/components/gb-comment/gb-comment.js.map

@@ -1 +1 @@
-{"version":3,"file":"gb-comment.js","sourceRoot":"","sources":["../../../src/components/gb-comment/gb-comment.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h, getAssetPath } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'gb-comment',\r\n  styleUrl: 'gb-comment.css',\r\n  shadow: true,\r\n})\r\nexport class GbComment {\r\n  @Prop() heading: string = '';\r\n  @Prop({ mutable: true }) state: 'expanded' | 'collapsed';\r\n  @Prop() noCommentText: string = 'No comment yet';\r\n  @Prop() noCommentTextSub: string = 'No reviewer has left a comment yet, you will be notified when a comment drops';\r\n  @Prop() comments: any[] = [\r\n    {\r\n      // name: 'Prince Ogheneriere',\r\n      // role: 'Authorizer',\r\n      // comment: 'This is error and fraud free. I concur',\r\n      // timestamp: '07-Oct-2024 6:00PM' ,\r\n    },\r\n    // {\r\n    //   name: 'Prince Ogheneriere',\r\n    //   role: 'Authorizer',\r\n    //   comment: 'This is error and fraud free. I concur',\r\n    //   timestamp: '07-Oct-2024 6:00PM',\r\n    // },\r\n    // {\r\n    //   name: 'Prince Ogheneriere',\r\n    //   role: 'Authorizer',\r\n    //   comment: 'I concur to the transactions in this call-over',\r\n    //   timestamp: '07-Oct-2024 6:00PM',\r\n    // },\r\n    // {\r\n    //   name: 'Gideon',\r\n    //   role: 'Designer',\r\n    //   comment: 'I concur to the transactions in this call-over',\r\n    //   timestamp: '07-Nov-2024 6:00PM',\r\n    // },\r\n  ];\r\n\r\n  toggleComments() {\r\n    if (this.state === 'expanded') {\r\n      this.state = 'collapsed';\r\n    } else if (this.state === 'collapsed') {\r\n      this.state = 'expanded';\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const hasComments = this.comments && this.comments.length > 0;\r\n    const patternSrc = getAssetPath(`assets/background_pattern.svg`);\r\n    const illustrationSrc = getAssetPath(`assets/illustration.svg`);\r\n\r\n    return (\r\n      <div class={`comments-container ${!hasComments ? 'no-comments-state' : ''}`}>\r\n        <div class={`header ${this.state}`}>\r\n          <div class=\"title-section\">\r\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class=\"info-icon\">\r\n              <path\r\n                opacity=\"0.4\"\r\n                d=\"M12.0572 1.75C14.2479 1.74999 15.9686 1.74998 17.312 1.93059C18.6886 2.11568 19.7809 2.50271 20.6391 3.36091C21.4973 4.21911 21.8843 5.31137 22.0694 6.68802C22.25 8.03143 22.25 9.7521 22.25 11.9428V11.9428V12.0572V12.0572C22.25 14.2479 22.25 15.9686 22.0694 17.312C21.8843 18.6886 21.4973 19.7809 20.6391 20.6391C19.7809 21.4973 18.6886 21.8843 17.312 22.0694C15.9686 22.25 14.2479 22.25 12.0572 22.25H12.0572H11.9428H11.9428C9.7521 22.25 8.03143 22.25 6.68802 22.0694C5.31137 21.8843 4.21911 21.4973 3.36091 20.6391C2.50271 19.7809 2.11568 18.6886 1.93059 17.312C1.74998 15.9686 1.74999 14.2479 1.75 12.0572V11.9428C1.74999 9.75212 1.74998 8.03144 1.93059 6.68802C2.11568 5.31137 2.50272 4.21911 3.36091 3.36091C4.21911 2.50272 5.31137 2.11568 6.68802 1.93059C8.03144 1.74998 9.75212 1.74999 11.9428 1.75H12.0572Z\"\r\n                fill=\"#064E94\"\r\n              />\r\n              <path\r\n                fill-rule=\"evenodd\"\r\n                clip-rule=\"evenodd\"\r\n                d=\"M11.6819 10.5273C11.9289 10.5605 12.2707 10.6494 12.5607 10.9394C12.8507 11.2294 12.9396 11.5711 12.9728 11.8182C13.0003 12.0228 13.0001 12.2608 13 12.4606C13 12.474 13 12.4871 13 12.5V16.5C13 17.0523 12.5523 17.5 12 17.5C11.4477 17.5 11 17.0523 11 16.5V12.5C10.4477 12.5 10 12.0523 10 11.5C10 10.9477 10.4477 10.5 11 10.5C11.0129 10.5 11.0261 10.5 11.0394 10.5C11.2393 10.4999 11.4772 10.4997 11.6819 10.5273Z\"\r\n                fill=\"#064E94\"\r\n              />\r\n              <path\r\n                fill-rule=\"evenodd\"\r\n                clip-rule=\"evenodd\"\r\n                d=\"M10.9999 7.5C10.9999 6.94772 11.4456 6.5 11.9954 6.5H12.0044C12.5542 6.5 12.9999 6.94772 12.9999 7.5C12.9999 8.05228 12.5542 8.5 12.0044 8.5H11.9954C11.4456 8.5 10.9999 8.05228 10.9999 7.5Z\"\r\n                fill=\"#064E94\"\r\n              />\r\n            </svg>\r\n            <h2 class=\"text-md-semi-bold heading\">{this.heading}</h2>\r\n          </div>\r\n\r\n          <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" onClick={() => this.toggleComments()}>\r\n            {this.state === 'expanded' ? <p>Hide Comments</p> : <p>Show Comments</p>}\r\n          </gb-button>\r\n        </div>\r\n\r\n        {this.state === 'expanded' &&\r\n          (hasComments ? (\r\n            <div class=\"comments-wrapper\">\r\n              {this.comments.map((comment, index) => (\r\n                <gb-comment-item\r\n                  key={index}\r\n                  name={comment.name}\r\n                  duty={comment.role}\r\n                  comment={comment.comment}\r\n                  time-stamp={comment.timeStamp}\r\n                  connector={this.comments.length > 1 && index < this.comments.length - 1 ? true : false}\r\n                />\r\n              ))}\r\n            </div>\r\n          ) : (\r\n            <div class=\"container\">\r\n              <div class=\"frame\">\r\n                <img src={patternSrc} alt=\"\" class=\"empty_state_pattern\" />\r\n                <div class=\"empty_state\">\r\n                  <div class=\"content\">\r\n                    <img src={illustrationSrc} alt=\"bell-icon\" class=\"bell_icon\" />\r\n                    <div class=\"text\">\r\n                      <p class=\"main-text text-lg-semi-bold\">{this.noCommentText}</p>\r\n                      <p class=\"sub-text text-sm-regular\">{this.noCommentTextSub}</p>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          ))}\r\n      </div>\r\n    );\r\n  }\r\n}"]}
+{"version":3,"file":"gb-comment.js","sourceRoot":"","sources":["../../../src/components/gb-comment/gb-comment.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h, getAssetPath } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'gb-comment',\r\n  styleUrl: 'gb-comment.css',\r\n  shadow: true,\r\n})\r\nexport class GbComment {\r\n  @Prop() heading: string = '';\r\n  @Prop({ mutable: true }) state: 'expanded' | 'collapsed';\r\n  @Prop() noCommentText: string = 'No comment yet';\r\n  @Prop() noCommentTextSub: string = 'No reviewer has left a comment yet, you will be notified when a comment drops';\r\n  @Prop() comments: any[] = [\r\n    // {\r\n      // name: 'Prince Ogheneriere',\r\n      // role: 'Authorizer',\r\n      // comment: 'This is error and fraud free. I concur',\r\n      // timestamp: '07-Oct-2024 6:00PM' ,\r\n    // },\r\n    // {\r\n    //   name: 'Prince Ogheneriere',\r\n    //   role: 'Authorizer',\r\n    //   comment: 'This is error and fraud free. I concur',\r\n    //   timestamp: '07-Oct-2024 6:00PM',\r\n    // },\r\n    // {\r\n    //   name: 'Prince Ogheneriere',\r\n    //   role: 'Authorizer',\r\n    //   comment: 'I concur to the transactions in this call-over',\r\n    //   timestamp: '07-Oct-2024 6:00PM',\r\n    // },\r\n    // {\r\n    //   name: 'Gideon',\r\n    //   role: 'Designer',\r\n    //   comment: 'I concur to the transactions in this call-over',\r\n    //   timestamp: '07-Nov-2024 6:00PM',\r\n    // },\r\n  ];\r\n\r\n  toggleComments() {\r\n    if (this.state === 'expanded') {\r\n      this.state = 'collapsed';\r\n    } else if (this.state === 'collapsed') {\r\n      this.state = 'expanded';\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const hasComments = this.comments && this.comments.length > 0;\r\n    const patternSrc = getAssetPath(`assets/background_pattern.svg`);\r\n    const illustrationSrc = getAssetPath(`assets/illustration.svg`);\r\n\r\n    return (\r\n      <div class={`comments-container ${!hasComments ? 'no-comments-state' : ''}`}>\r\n        <div class={`header ${this.state}`}>\r\n          <div class=\"title-section\">\r\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" class=\"info-icon\">\r\n              <path\r\n                opacity=\"0.4\"\r\n                d=\"M12.0572 1.75C14.2479 1.74999 15.9686 1.74998 17.312 1.93059C18.6886 2.11568 19.7809 2.50271 20.6391 3.36091C21.4973 4.21911 21.8843 5.31137 22.0694 6.68802C22.25 8.03143 22.25 9.7521 22.25 11.9428V11.9428V12.0572V12.0572C22.25 14.2479 22.25 15.9686 22.0694 17.312C21.8843 18.6886 21.4973 19.7809 20.6391 20.6391C19.7809 21.4973 18.6886 21.8843 17.312 22.0694C15.9686 22.25 14.2479 22.25 12.0572 22.25H12.0572H11.9428H11.9428C9.7521 22.25 8.03143 22.25 6.68802 22.0694C5.31137 21.8843 4.21911 21.4973 3.36091 20.6391C2.50271 19.7809 2.11568 18.6886 1.93059 17.312C1.74998 15.9686 1.74999 14.2479 1.75 12.0572V11.9428C1.74999 9.75212 1.74998 8.03144 1.93059 6.68802C2.11568 5.31137 2.50272 4.21911 3.36091 3.36091C4.21911 2.50272 5.31137 2.11568 6.68802 1.93059C8.03144 1.74998 9.75212 1.74999 11.9428 1.75H12.0572Z\"\r\n                fill=\"#064E94\"\r\n              />\r\n              <path\r\n                fill-rule=\"evenodd\"\r\n                clip-rule=\"evenodd\"\r\n                d=\"M11.6819 10.5273C11.9289 10.5605 12.2707 10.6494 12.5607 10.9394C12.8507 11.2294 12.9396 11.5711 12.9728 11.8182C13.0003 12.0228 13.0001 12.2608 13 12.4606C13 12.474 13 12.4871 13 12.5V16.5C13 17.0523 12.5523 17.5 12 17.5C11.4477 17.5 11 17.0523 11 16.5V12.5C10.4477 12.5 10 12.0523 10 11.5C10 10.9477 10.4477 10.5 11 10.5C11.0129 10.5 11.0261 10.5 11.0394 10.5C11.2393 10.4999 11.4772 10.4997 11.6819 10.5273Z\"\r\n                fill=\"#064E94\"\r\n              />\r\n              <path\r\n                fill-rule=\"evenodd\"\r\n                clip-rule=\"evenodd\"\r\n                d=\"M10.9999 7.5C10.9999 6.94772 11.4456 6.5 11.9954 6.5H12.0044C12.5542 6.5 12.9999 6.94772 12.9999 7.5C12.9999 8.05228 12.5542 8.5 12.0044 8.5H11.9954C11.4456 8.5 10.9999 8.05228 10.9999 7.5Z\"\r\n                fill=\"#064E94\"\r\n              />\r\n            </svg>\r\n            <h2 class=\"text-md-semi-bold heading\">{this.heading}</h2>\r\n          </div>\r\n\r\n          <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" onClick={() => this.toggleComments()}>\r\n            {this.state === 'expanded' ? <p>Hide Comments</p> : <p>Show Comments</p>}\r\n          </gb-button>\r\n        </div>\r\n\r\n        {this.state === 'expanded' &&\r\n          (hasComments ? (\r\n            <div class=\"comments-wrapper\">\r\n              {this.comments.map((comment, index) => (\r\n                <gb-comment-item\r\n                  key={index}\r\n                  name={comment.name}\r\n                  duty={comment.role}\r\n                  comment={comment.comment}\r\n                  time-stamp={comment.timeStamp}\r\n                  connector={this.comments.length > 1 && index < this.comments.length - 1 ? true : false}\r\n                />\r\n              ))}\r\n            </div>\r\n          ) : (\r\n            <div class=\"container\">\r\n              <div class=\"frame\">\r\n                <img src={patternSrc} alt=\"\" class=\"empty_state_pattern\" />\r\n                <div class=\"empty_state\">\r\n                  <div class=\"content\">\r\n                    <img src={illustrationSrc} alt=\"bell-icon\" class=\"bell_icon\" />\r\n                    <div class=\"text\">\r\n                      <p class=\"main-text text-lg-semi-bold\">{this.noCommentText}</p>\r\n                      <p class=\"sub-text text-sm-regular\">{this.noCommentTextSub}</p>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          ))}\r\n      </div>\r\n    );\r\n  }\r\n}"]}

package/dist/collection/components/gb-comment-item/gb-comment-item.js

@@ -12,7 +12,7 @@ export class GbCommentItem {
         return nameAndRole;
     }
     render() {
-        return (h("div", { key: 'db49457257f11dfbc73cb95558e44a60bd653525', class: "comment-item" }, h("div", { key: 'c5983542a084112b2a06a39cb71430898e44472b', class: "left" }, h("div", { key: '347241220596fac2f5e4ee06c2137ebb9acb28cc', class: "comment-bullet" }), this.connector && h("hr", { key: 'f0f104d45d95b4a66c335614806f638be74e1838', class: "line" })), h("div", { key: 'bbfd3feeb66ac974104f04b0964aca7361ea8e54', class: "comment-content" }, h("div", { key: 'a156556990a67d93c423d4f3b962cc444ca3439a', class: "reviewer-info" }, h("p", { key: '63896406e1d4dd8556ef3c88c14aa0ebe0144468', class: "text-sm-semi-bold" }, this.displayNameAndRole())), h("div", { key: 'e39941150a360c1967b2d800b09b818f55f3a44b', class: "comment-text" }, h("p", { key: '3df918143da5e9fc88d122e0f95cca35a2cb803c', class: "text-sm-regular" }, this.comment)), h("div", { key: '6073ef1e474286d4e3f19917a71859ee678e9634', class: "timestamp" }, h("p", { key: '808bbd2588156d8878522e91632fbf9f2db2e827', class: "text-xs-regular" }, this.timeStamp)))));
+        return (h("div", { key: 'ede62eee8b9ac72174f9486d972128f514bc1281', class: "comment-item" }, h("div", { key: '9a98772927b5ce696a75e8914223bb6fb75513e7', class: "left" }, h("div", { key: '589925eae31aa32dc70266301cfa4f23a46cf40c', class: "comment-bullet" }), this.connector && h("hr", { key: '0a94cd4b25d1846a12870c914108a6b98ab137ab', class: "line" })), h("div", { key: '2b7b8a5a0d725e783a263f6cb373e427a0a2a3a5', class: "comment-content" }, h("div", { key: '5f21728c1c5ceb64e9ad87e30f70b7e7f35ba60c', class: "reviewer-info" }, h("p", { key: 'e88cf130f83bf2df1e3177e5720f1eb959cf1d06', class: "text-sm-semi-bold" }, this.displayNameAndRole())), h("div", { key: '27f48e4e77409d5d9b53ff827b93382f21e67765', class: "comment-text" }, h("p", { key: 'e302e23e314bac9590393592a6d7cd35eb473772', class: "text-sm-regular" }, this.comment)), h("div", { key: '4468a0f698b2bf0cafe356479801d9a9d1c45954', class: "timestamp" }, h("p", { key: '3116c0e50bc3e4a4333f1941b7b84615024972e1', class: "text-xs-regular" }, this.timeStamp)))));
     }
     static get is() { return "gb-comment-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-complex-primary-side-bar-item/gb-complex-primary-side-bar-item.js

@@ -22,7 +22,7 @@ export class GbComplexPrimarySideBarItem {
         const whiteBarSrc = getAssetPath(`assets/complex_bar_white.svg`);
         const redCompactBarSrc = getAssetPath(`assets/compact_bar_red.svg`);
         const whiteCompactBarSrc = getAssetPath(`assets/compact_bar_white.svg`);
-        return (h(Fragment, null, this.itemStyle === 'standard' && (h("div", { key: 'b4a87cf3b4f36dee621f8b07d645a25b4393ee2c', class: `container ${this.state} ${this.category}` }, h("div", { key: 'd0a55786fec87fdee8d789d517b47690ae2aa801', class: `wrapper ${this.state} ${this.category}` }, this.state === 'active' && this.category === 'plain_background' && h("img", { key: '55794f95a8b3ea52c2e6e28d27cf39f7ece7a6c0', src: redBarSrc, alt: "", class: "bar" }), this.state === 'active' && this.category === 'colored_background' && h("img", { key: '5d2e02a8a7dc332a70cc06eeb34895344b61bcaf', src: whiteBarSrc, alt: "", class: "bar" }), h("div", { key: '064de8e9a5eda4b08178062e5c0c9895183669ac', class: "icon_container" }, h("div", { key: '3c8dc406b31afd35097ed938ba2b0e4b265f9eeb', class: `icon ${this.state} ${this.category}`, innerHTML: this.leadingIconSvg })), h("p", { key: 'd9cbdb556ab4ab43812c5f4643ce8ccd1d672f79', class: `label_text ${this.state} ${this.category} ${this.state === 'active' ? 'text-xs-semi-bold' : 'text-xs-regular'}` }, this.label)))), this.itemStyle === 'compact' && (h("div", { key: 'c9318d93dcfec2b76c93569f325af49bbac73f07', class: "compact_container" }, h("div", { key: '69b236b9d516222ee8bf17336a6949389597fc95', class: `compact_wrapper ${this.state} ${this.category}`, onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.state === 'active' && this.category === 'plain_background' && h("img", { key: '736739a27b99bf6cc6299b5433b7bae28a1cbcba', src: redCompactBarSrc, alt: "", class: "compact_bar" }), this.state === 'active' && this.category === 'colored_background' && h("img", { key: '164283037a5f0240b87c622095339921536909f1', src: whiteCompactBarSrc, alt: "", class: "compact_bar" }), h("div", { key: 'a76a2f7c55585d9e0b32a765a57c3cfb65d1eb21', class: "compact_icon_container" }, h("div", { key: '99823d3a9ed4cf050bee8ec091c3b3579948ddde', class: `icon ${this.state} ${this.category}`, innerHTML: this.leadingIconSvg })), this.itemStyle === 'compact' && this.showTooltip && (h("gb-tooltip", { key: '936ce0fdf7c392d14551b1f0287e88f34a8b73c5', "show-arrow": true, arrow: "left", class: "tooltip" }, h("p", { key: 'cee78e7f32a55c2a2026650808fe99b685ce6767', slot: "label" }, this.label))))))));
+        return (h(Fragment, null, this.itemStyle === 'standard' && (h("div", { key: 'd4c65d120d6470fd2e9e3feb40f13efd3d34cfbe', class: `container ${this.state} ${this.category}` }, h("div", { key: '197255f6fc7b7e95ad3633bb419babee3119de4b', class: `wrapper ${this.state} ${this.category}` }, this.state === 'active' && this.category === 'plain_background' && h("img", { key: '106a3ff161a51d8e1ddebee3013259e8e0be7ee7', src: redBarSrc, alt: "", class: "bar" }), this.state === 'active' && this.category === 'colored_background' && h("img", { key: '8fbcee27d65003309c4e0c2205f9a626e7e1a756', src: whiteBarSrc, alt: "", class: "bar" }), h("div", { key: '297adc183ba15897d51e35a3d2755b37ed679542', class: "icon_container" }, h("div", { key: 'b91d190bc838929afa53b7a5b708e65fbe0f613c', class: `icon ${this.state} ${this.category}`, innerHTML: this.leadingIconSvg })), h("p", { key: 'e4636af6b758f00fca318e9387ceb5f0a9ae6578', class: `label_text ${this.state} ${this.category} ${this.state === 'active' ? 'text-xs-semi-bold' : 'text-xs-regular'}` }, this.label)))), this.itemStyle === 'compact' && (h("div", { key: 'aac3da937d2db1da169e45122198a7185db17960', class: "compact_container" }, h("div", { key: '2a89a7319b9ee1aeae4d0af0df9b036f134f8816', class: `compact_wrapper ${this.state} ${this.category}`, onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.state === 'active' && this.category === 'plain_background' && h("img", { key: '49f4ab1e93973bc871c686f17c6eac9927a2b3bc', src: redCompactBarSrc, alt: "", class: "compact_bar" }), this.state === 'active' && this.category === 'colored_background' && h("img", { key: '3bd9789c852d863aa41c6fb5818a8663970b9a3f', src: whiteCompactBarSrc, alt: "", class: "compact_bar" }), h("div", { key: '28ab61a8c54c13488db962d5235841024811c37d', class: "compact_icon_container" }, h("div", { key: 'ad45aa6fadbc635e82edfe79b573426359007fb7', class: `icon ${this.state} ${this.category}`, innerHTML: this.leadingIconSvg })), this.itemStyle === 'compact' && this.showTooltip && (h("gb-tooltip", { key: '0cc8331132b3de10d88e3629bae2b15229905045', "show-arrow": true, arrow: "left", class: "tooltip" }, h("p", { key: 'ca77a42e21333fd8682e023ac30b0d0f15354654', slot: "label" }, this.label))))))));
     }
     static get is() { return "gb-complex-primary-side-bar-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-complex-secondary-side-bar-item/gb-complex-secondary-side-bar-item.js

@@ -16,7 +16,7 @@ export class GbComplexSecondarySideBarItem {
         this.loadIcon(this.icon);
     }
     render() {
-        return (h("div", { key: '0751e084095558e2ec6d919c116ef7330566e677', class: `container ${this.type}` }, h("div", { key: 'd93a34e8e1cf65e80df0c69f4379d38319ce5ebf', class: `secondary_side_bar_item_div ${this.state} ${this.type} ${this.category}`, onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, h("div", { key: '10b3e1bd8b48f6dcb09d2a8a52430c8c74366e7a', class: "icon" }, h("div", { key: 'cad55b7fa7abbf15509908b7bb03d3c65cde0a4e', class: "icon_container" }, h("div", { key: '91f0f14a288ffc9a03b21f27966a47d9b8bff7a1', class: `icon ${this.state} ${this.category}`, innerHTML: this.leadingIconSvg }))), this.type === 'full_with_label' && (h("div", { key: '3a2c19c2365dd98eadf29830a28cf76d336b4429', class: "text" }, h("p", { key: 'bbb27ef86b0900af8e6e5b6cb41b7e7308b32b87', class: `label_text ${this.state} ${this.category} ${this.state !== 'active' ? 'text-md-medium' : 'text-md-semi-bold'}` }, this.label))), this.type === 'icon_only' && this.showTooltip && (h("gb-tooltip", { key: '4ae3a6176f550e978ffc58d0aee5bf06d65c6515', "show-arrow": true, arrow: "left", class: "tooltip" }, h("p", { key: 'dc7a893f3ce3e5024e0c774082a2c0bea6c609bb', slot: "label" }, this.label))))));
+        return (h("div", { key: 'e000ec9a0a4df03cb31f7966ca15c2a40ca98432', class: `container ${this.type}` }, h("div", { key: 'd04d2b5a71b72451665ff4caedebeb9f14c0b61b', class: `secondary_side_bar_item_div ${this.state} ${this.type} ${this.category}`, onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, h("div", { key: 'f64935524fe052d87d2da37f2dc8db6b1369fdf3', class: "icon" }, h("div", { key: '5238befb4ef791764edc6eeeae0805867d34c1bf', class: "icon_container" }, h("div", { key: '9ee3bcc9a7cb710de1f571de73b15300541ae67f', class: `icon ${this.state} ${this.category}`, innerHTML: this.leadingIconSvg }))), this.type === 'full_with_label' && (h("div", { key: '5bc9b8ebf76d68f16fb153a19722f278ac406155', class: "text" }, h("p", { key: '7477f3b0664dbcd67a499f770fcee481c3f72e59', class: `label_text ${this.state} ${this.category} ${this.state !== 'active' ? 'text-md-medium' : 'text-md-semi-bold'}` }, this.label))), this.type === 'icon_only' && this.showTooltip && (h("gb-tooltip", { key: 'a5888b5e1d1baa95482e6229725818fb5538e2c6', "show-arrow": true, arrow: "left", class: "tooltip" }, h("p", { key: '15bf30ab507373e2cc4136d13f21183d098d8921', slot: "label" }, this.label))))));
     }
     static get is() { return "gb-complex-secondary-side-bar-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -58,7 +58,7 @@ export class GbDetailCell {
         }
     }
     render() {
-        return (h("div", { key: '7e74d84575af864c34059688a867cc6001236ebb', class: `detail_cell_div ${this.type} ${this.cellStyle}`, onMouseEnter: () => this.onShowCopyButton(), onMouseLeave: () => this.onHideCopyButton() }, this.type === 'information' && this.cellStyle === 'standard' && (h(Fragment, null, h("div", { key: 'f999b8d8cfe77773d607d0c17b51af012e4787ef', class: "info_text_div" }, h("p", { key: '91d66362f99e4d11f97d53baad960a31c969d9f6', class: "label text-sm-regular" }, this.label), h("p", { key: '89ae8c92054499c157a4bb976060db0557f8f0a3', class: "detail text-md-medium", onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.detail), this.showTooltip && (h("gb-tooltip", { key: '50d720d6eec1e4a25e8780493fa6c9cb0d953e22', "show-arrow": false, class: "information_text_tooltip" }, h("p", { key: 'cc2ce40cdb138adb51af8595deef3af5fa2d2e1f', slot: "label" }, this.detail)))), this.showStandardCopyButton && (h("gb-button", { key: 'bdd55060f771cde97738a20437360753ea7aa933', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/copy.svg", onClick: () => this.copyToClipboard() })), this.copied && (h("gb-tooltip", { key: 'e692c25027ec74418938043842381440974590cd', "show-arrow": false, class: "copied_tooltip" }, h("p", { key: '19faf297f803b5b4f9dce8c0aef3595bfd5bc23d', slot: "label" }, "Copied!"))))), this.type === 'document' && this.cellStyle === 'standard' && (h(Fragment, null, h("gb-file-type-icon", { key: '72dd4df06c0d6ec0ab250d8ee19491b9506910ab', "file-style": this.fileStyle, "file-type": this.fileType }), h("div", { key: '77e2244da9c77e5ea18bcdfd24d0fb88cae8aeba', class: "document_text_div" }, h("p", { key: '85918ea65b2ef5d5af224d7d9110b60f10260876', class: "label text-sm-regular" }, this.label), h("p", { key: 'db0004e955a827ccffa5062cc8d7dfc912420324', class: "detail text-md-medium", onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.detail), this.showTooltip && (h("gb-tooltip", { key: 'fd9ec25d277789ecb60d55385219786f4110dac9', "show-arrow": false, class: "document_detail_tooltip" }, h("p", { key: 'e4db22cd78a87d34404871ac0d8d77b3476d7bb8', slot: "label" }, this.detail)))), !this.isDownloaded ? (h(Fragment, null, this.showActionButtons && (h(Fragment, null, this.showViewButton && (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/view.svg", onClick: () => this.onViewButtonClicked() })), this.showDownloadButton && (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/download-03.svg", onClick: () => this.onDownloadButtonClicked() })))))) : (h("gb-tooltip", { "show-arrow": false, class: "downloaded_tooltip" }, h("p", { slot: "label" }, "Downloaded!"))))), this.type === 'status' && this.cellStyle === 'standard' && (h("div", { key: 'a3253e5fe88d79bf604e974483b29ae60d0df352', class: "status_text_div" }, h("p", { key: '6ff6b7cdbfe47f02e12d37c9b9e9479ab0c03331', class: "label text-sm-regular" }, this.label), h("gb-badge", { key: '5419176bdbfefbf274ccfda75e6dfd6e45c64ca4', size: "sm", type: this.badgeType, icon: "dot", color: this.badgeColor }, h("p", { key: '82c14eadac5a664c6b6e59042402bab06be3132e' }, this.badgeLabel)))), this.type === 'information' && this.cellStyle === 'compact' && (h("div", { key: '6d970dcadd8695b6f03bc3254b835874b057f715', class: "compact_info_div" }, h("div", { key: '47311a1f0e627908168203f0ee93263aa44ab731', class: "compact_info_text_div" }, h("div", { key: '1be1915ee9b4a60e9e70b368f5c52d1c3167d71d', class: "compact_label" }, h("p", { key: 'db76967d63f1d7d44dae5ad1907e7b0779b2dc80', class: "label text-sm-regular" }, this.label)), h("div", { key: '4fce47b55448f2e5c820f0daa20a07048fb77cef', class: "compact_detail" }, h("p", { key: 'a34fe91e2cc1bc948d569af495f5ee25e422d9e4', class: "detail_compact_text text-md-medium" }, this.detail), this.copied && (h("gb-tooltip", { key: 'e3551f16f919d1bd448177cf0ab795d49dbe8e3f', "show-arrow": false, class: "compact_copied_tooltip" }, h("p", { key: '688da41f6eb5949d35da52fbe4b6d8d34308a8ff', slot: "label" }, "Copied!")))), this.showCopyButton && (h("gb-button", { key: '1a5e2cdc2f8675bb3f65e8851d861fd22135bdc6', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/copy.svg", onClick: () => this.copyToClipboard() }))))), this.type === 'document' && this.cellStyle === 'compact' && (h("div", { key: 'b73bc78d164c432291922108930d7d10182c7798', class: "compact_doc_div" }, h("gb-file-type-icon", { key: '98c266093c40efb90b26a3b15d3b82bc1c8bb8a8', "file-style": this.fileStyle, "file-type": this.fileType }), h("div", { key: '9a15876dc029fc8269eb80e7755feaa8e358fe75', class: "compact_doc_text_div" }, h("p", { key: 'e058642a0cf190d21b2f1d477190170541a12812', class: "doc_label text-sm-regular" }, this.label), h("div", { key: 'ce524eaf8ab4d0dae2e030dc5b1ba6586e205ab5', class: "compact_doc_detail" }, h("p", { key: '85046506a772e47dd0d22a32122d78e2386b5848', class: "detaill text-md-medium", onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.detail)), this.isDownloaded && (h("gb-tooltip", { key: '20b8999c79d29c101399f4498cc3fe73c0fb01a1', "show-arrow": false, class: "compact_downloaded_tooltip" }, h("p", { key: '15712d1d6bfe295c6a9b3f4dc8fc6e0af10f3320', slot: "label" }, "Downloaded!"))), this.showActionButtons && (h("div", { key: 'da31d614dfeb97771139577bbb4bb18b29fb3e83', class: "button_container" }, this.showViewButton && (h("gb-button", { key: 'f03602cd1f2a3224ebe15e178f47ba64ec3332fb', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/view.svg", onClick: () => this.onViewButtonClicked() })), this.showDownloadButton && (h("gb-button", { key: '6a957850cc474015d6531233abaa0e5cfbd16965', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/download-03.svg", onClick: () => this.onDownloadButtonClicked() }))))))), this.type === 'status' && this.cellStyle === 'compact' && (h("div", { key: 'ad2e949413bb9b2d18cc526ca0e3a273fdd0f0ed', class: "compact_status_div" }, h("div", { key: 'c8c364ba5c100e2306f55029b0f525640090c370', class: "compact_status_text_div" }, h("div", { key: '1f11e151a36f63d853dbae4cd03df0f34103d7b1', class: "compact_label" }, h("p", { key: '2041fe88dd2fe022017996c0bfd656f7dff4bf66', class: "label text-sm-regular" }, this.label)), h("gb-badge", { key: 'd7306a762d2cdd7a5f28e37564d4a4764edff11c', size: "sm", type: this.badgeType, icon: "dot", color: this.badgeColor }, h("p", { key: 'd983c11741492589323ed48b30b31ca79facc5ae' }, this.badgeLabel)))))));
+        return (h("div", { key: 'fe5065bb4a55574a100c24cc3fedb27e5c67d1db', class: `detail_cell_div ${this.type} ${this.cellStyle}`, onMouseEnter: () => this.onShowCopyButton(), onMouseLeave: () => this.onHideCopyButton() }, this.type === 'information' && this.cellStyle === 'standard' && (h(Fragment, null, h("div", { key: '7eae7bae8957d7d0a1cea60104c4438159874c47', class: "info_text_div" }, h("p", { key: 'aff5d855f8be93afdb4334cfb6e2de07ff2f1179', class: "label text-sm-regular" }, this.label), h("p", { key: '9e768974d281e1f72603ba17a72e2e97b183492b', class: "detail text-md-medium", onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.detail), this.showTooltip && (h("gb-tooltip", { key: 'ecdb0b33000d59d8319e2c37ba74a9c6c620dda9', "show-arrow": false, class: "information_text_tooltip" }, h("p", { key: 'ab456106c6a364f2035bfaf2b1053c066edd35de', slot: "label" }, this.detail)))), this.showStandardCopyButton && (h("gb-button", { key: '3292e33d1d229e5364808a140a30ec028b54633f', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/copy.svg", onClick: () => this.copyToClipboard() })), this.copied && (h("gb-tooltip", { key: '2164bab971d7847f03c8ec7854736819c3093de1', "show-arrow": false, class: "copied_tooltip" }, h("p", { key: '32890e840591d86800fb205c9d7e6bfc702c0716', slot: "label" }, "Copied!"))))), this.type === 'document' && this.cellStyle === 'standard' && (h(Fragment, null, h("gb-file-type-icon", { key: '8361677625536fed65f2a6144a6cc9b931408cb4', "file-style": this.fileStyle, "file-type": this.fileType }), h("div", { key: 'e2c4ed3b0fe619fc9efffb6972142d5dddb62003', class: "document_text_div" }, h("p", { key: '065903afd76fd5cf25cf7faa0b9c34f8eb820ffb', class: "label text-sm-regular" }, this.label), h("p", { key: '0d8d3c2eb302a56523e7396f74f0bb83152470f4', class: "detail text-md-medium", onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.detail), this.showTooltip && (h("gb-tooltip", { key: 'd07b4602644216c4620eaa5f0920ab385ebd6abc', "show-arrow": false, class: "document_detail_tooltip" }, h("p", { key: 'f5f338bbfedf9e22f7dff6aa59406b61a7bf5172', slot: "label" }, this.detail)))), !this.isDownloaded ? (h(Fragment, null, this.showActionButtons && (h(Fragment, null, this.showViewButton && (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/view.svg", onClick: () => this.onViewButtonClicked() })), this.showDownloadButton && (h("gb-button", { size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/download-03.svg", onClick: () => this.onDownloadButtonClicked() })))))) : (h("gb-tooltip", { "show-arrow": false, class: "downloaded_tooltip" }, h("p", { slot: "label" }, "Downloaded!"))))), this.type === 'status' && this.cellStyle === 'standard' && (h("div", { key: '757ec88eeee05cf3feb5ac938f54f1893ad42903', class: "status_text_div" }, h("p", { key: 'e7e927824a3cc715e885c007d270dc784aeb1a48', class: "label text-sm-regular" }, this.label), h("gb-badge", { key: 'cf1bdc65a54327686a00d06b234d00a11bbbc901', size: "sm", type: this.badgeType, icon: "dot", color: this.badgeColor }, h("p", { key: 'd8a151f8b83944effbe5c790f5adfb554ca43446' }, this.badgeLabel)))), this.type === 'information' && this.cellStyle === 'compact' && (h("div", { key: '208e53fd00aef78c3e06314debf2e95e12fff47a', class: "compact_info_div" }, h("div", { key: 'c5a109a45d5fd657b3619a0789a7afe615668c16', class: "compact_info_text_div" }, h("div", { key: '19e2ddfbb15e21f94fc8ae67c549bdc5c3997948', class: "compact_label" }, h("p", { key: 'db04333c4b12437e1596c8ea7e2eee41756a9143', class: "label text-sm-regular" }, this.label)), h("div", { key: '9793076cc83f8984d8c99453f487595b23eb69b1', class: "compact_detail" }, h("p", { key: 'fc38217f222d93318f95647d7bf17eff55b889f4', class: "detail_compact_text text-md-medium" }, this.detail), this.copied && (h("gb-tooltip", { key: '7fb7ea20ec08b92c6f3f031d59ab0aa49b4d1445', "show-arrow": false, class: "compact_copied_tooltip" }, h("p", { key: '66641ff872115b1c979d4d46cc3c7b8393c42fc4', slot: "label" }, "Copied!")))), this.showCopyButton && (h("gb-button", { key: '1f414039edabe35c1d1c472465814054ff54fb74', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/copy.svg", onClick: () => this.copyToClipboard() }))))), this.type === 'document' && this.cellStyle === 'compact' && (h("div", { key: 'ba81b3368be9016320ed3d53c0c27f0e3fcb1226', class: "compact_doc_div" }, h("gb-file-type-icon", { key: 'ac8519d24529d9dc37975b7d75773ae28ef0ce52', "file-style": this.fileStyle, "file-type": this.fileType }), h("div", { key: '2d212741d1bc8e33ed69a9b216dc74e2aefa3bee', class: "compact_doc_text_div" }, h("p", { key: 'e349b430c5d051943c9f66d20b5925462578def8', class: "doc_label text-sm-regular" }, this.label), h("div", { key: 'b7916d6f180254dcfa8010477b9d0afde5739805', class: "compact_doc_detail" }, h("p", { key: 'ad147d8d18a7f6ea02bd8295c2316c877fbe856d', class: "detaill text-md-medium", onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, this.detail)), this.isDownloaded && (h("gb-tooltip", { key: '518109a0990e34cd12c20fb68a00997457449b16', "show-arrow": false, class: "compact_downloaded_tooltip" }, h("p", { key: '732e143e9607c30ba7586cc12b0b6da59cfebf03', slot: "label" }, "Downloaded!"))), this.showActionButtons && (h("div", { key: '5ca583ff47cf868cb63dbb24cfd36d65189bf32d', class: "button_container" }, this.showViewButton && (h("gb-button", { key: '72bc43902a7b0b14473803bac74ca4d7ca7d7167', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/view.svg", onClick: () => this.onViewButtonClicked() })), this.showDownloadButton && (h("gb-button", { key: '7fcc53c10916980fe68804237cb6b404620fb46d', size: "sm", hierarchy: "tertiary_gray", icon: "only", "icon-leading": "true", "icon-leading-swap": "assets/download-03.svg", onClick: () => this.onDownloadButtonClicked() }))))))), this.type === 'status' && this.cellStyle === 'compact' && (h("div", { key: 'b133c8c3975c62989b4ebe200a3bb3e1fc19140f', class: "compact_status_div" }, h("div", { key: 'aaec798597bc9298c194d438c3198f9fd96ff094', class: "compact_status_text_div" }, h("div", { key: '08725729fd59242bc3ce45a8d8c0eaf539367a0e', class: "compact_label" }, h("p", { key: 'eb271d5ade4e89f3de6ea56fea4e620692a9cfd2', class: "label text-sm-regular" }, this.label)), h("gb-badge", { key: '9a06b65effddb4c725cfa93c53d1ddc79ae8fb16', size: "sm", type: this.badgeType, icon: "dot", color: this.badgeColor }, h("p", { key: 'c14f2d2e2134b9cb1cec91ddb8fff847335651bf' }, this.badgeLabel)))))));
     }
     static get is() { return "gb-detail-cell"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/gb-dropdown-items-with-shortcut/gb-dropdown-items-with-shortcut.js

@@ -20,7 +20,7 @@ export class GbDropdownShortcut {
         this.loadIcon(this.iconSrc);
     }
     render() {
-        return (h("div", { key: 'f35f357ea88755f6feb3f9ba5f720387a8e9a621', class: "shortcut-container" }, h("div", { key: 'fbbcd8b685cf192587a2322cb39214f9093678b5', class: `shortcut ${this.state === 'disabled' ? 'disabled' : ''} ${this.destructive ? 'destructive' : ''}` }, this.icon && (h("div", { key: '7869fca8ee62b640a61fda6c3dab1608fe208275', class: "icon_div" }, h("div", { key: '019188ee31a6ed4fe18d27dc696eef4f371d7202', class: `icon ${this.state === 'disabled' ? 'disabled' : ''} ${this.destructive ? 'destructive' : ''}`, innerHTML: this.leadingIconSvg }))), this.checkbox && !this.icon && h("gb-checkbox", { key: '3821525aeb0a0876034342dbaeb9d81c3fedf4a3', class: "checkbox", size: "sm", type: "checkbox", state: StateEnum.Default }), h("span", { key: 'f2d722615d963cf40757fbf9fc29710257ae37f4', class: "label_div" }, h("p", { key: '75272effa675901808d5833292c5deafde6d685f', class: `label text-sm-medium ${this.destructive ? 'destructive' : ''}` }, this.label)), this.shortcut && (h("span", { key: '405257a4ce98c726e48d010810e805ee42e36df6', class: "shortcut-icon" }, h("slot", { key: '59e516d2fa86224eb42794660b282ef0018c3bd0' }, "\u2318", this.shortcutIcon))))));
+        return (h("div", { key: '090138618422c564ca1ea094f8aa1ed50b1333db', class: "shortcut-container" }, h("div", { key: '313756e9263d13116af023b92167f403912e6d2f', class: `shortcut ${this.state === 'disabled' ? 'disabled' : ''} ${this.destructive ? 'destructive' : ''}` }, this.icon && (h("div", { key: '426616e563d80db9f063b9bb71915b0fbb724178', class: "icon_div" }, h("div", { key: '9c46f8c588a2bd2ec993733a95054a647a1edaeb', class: `icon ${this.state === 'disabled' ? 'disabled' : ''} ${this.destructive ? 'destructive' : ''}`, innerHTML: this.leadingIconSvg }))), this.checkbox && !this.icon && h("gb-checkbox", { key: 'd8f7e835694463236d254d7973d03cd81eedf9e1', class: "checkbox", size: "sm", type: "checkbox", state: StateEnum.Default }), h("span", { key: '6fbfeff15272e77e25078ef539d45f4a60ebb254', class: "label_div" }, h("p", { key: '9b46171b64ca4081947ea88f620e191ded988996', class: `label text-sm-medium ${this.destructive ? 'destructive' : ''}` }, this.label)), this.shortcut && (h("span", { key: '9b6301e6b333c0966eeb8c017157050ae9a356df', class: "shortcut-icon" }, h("slot", { key: '1885d60728804ba1f488827a01a85ccb737887e4' }, "\u2318", this.shortcutIcon))))));
     }
     static get is() { return "gb-dropdown-items-with-shortcut"; }
     static get encapsulation() { return "shadow"; }