globuswebcomponents 1.7.0 → 1.7.2

package/dist/collection/collection-manifest.json

@@ -15,6 +15,8 @@
     "components/gb-btn/gb-btn.js",
     "components/gb-button/gb-button.js",
     "components/gb-button-close/gb-button-close.js",
+    "components/gb-button-group/gb-button-group.js",
+    "components/gb-button-group-base/gb-button-group-base.js",
     "components/gb-card-icon/gb-card-icon.js",
     "components/gb-carousel-arrow/gb-carousel-arrow.js",
     "components/gb-checkbox/gb-checkbox.js",
@@ -42,6 +44,7 @@
     "components/gb-help-dropdown/gb-help-dropdown.js",
     "components/gb-help-tooltip/gb-help-tooltip.js",
     "components/gb-horizontal-tabs/gb-horizontal-tabs.js",
+    "components/gb-icon-button-base/gb-icon-button-base.js",
     "components/gb-input-dropdown/gb-input-dropdown.js",
     "components/gb-input-dropdown-menu-item/gb-input-dropdown-menu-item.js",
     "components/gb-input-field/gb-input-field.js",
@@ -75,6 +78,7 @@
     "components/gb-tag-close/gb-tag-close.js",
     "components/gb-tag-count/gb-tag-count.js",
     "components/gb-textarea-input-field/gb-textarea-input-field.js",
+    "components/gb-theme-tab/gb-theme-tab.js",
     "components/gb-toast/gb-toast.js",
     "components/gb-toast-button/gb-toast-button.js",
     "components/gb-toggle/gb-toggle.js",

package/dist/collection/components/gb-action-panel/gb-action-panel.js

@@ -68,8 +68,20 @@ export class GbActionPanel {
             }
         }
     }
+    onPreviousButtonClicked() {
+        this.previousButtonClicked.emit();
+    }
+    onSaveAsDraft() {
+        this.saveAsDraft.emit();
+    }
+    onSubmitClicked() {
+        this.submitButtonClicked.emit();
+    }
+    onNextButtonClicked() {
+        this.nextButtonClicked.emit();
+    }
     render() {
-        return (h("div", { key: '261365bc7335b8c581aa15b571b37bffd613b8d2', class: "action_panel_div" }, this.type === 'decision_panel' && (h("div", { key: '9585713835aa44f4128744201d5ecc360e219f9b', class: "panel_content" }, h("div", { key: '30375e17b225d8c97212f9a08cf8821c05a6362b', class: "left_action" }, this.showCloseButton && h("gb-button-close", { key: '3cfcbe5a5630d0505c5da18d8191b343476b7190', size: "md", color: "primary" }), this.showSelectedRows && h("slot", { key: '883ff7fa3690727c36bbb071b2db166ddcdb153c', name: "selected_rows" }), this.showCheckbox && (h("gb-checkbox", { key: '3089c1838e387970bd0db3ff474f17b86c984de0', size: "md", state: StateEnum.Default, type: "checkbox", text: true, "supporting-text": false, onCheckboxClicked: this.onCheckboxClicked.bind(this) }, h("slot", { key: 'c97acb1c6df7507a884734b08f661e9a8ca2ece0', name: "label", slot: "label" })))), h("div", { key: '5432ae92feaa3c1199a27a76084401858169edfc', class: "right_action" }, this.firstButton && (h("gb-button", { key: 'eff645df797fa34a50e78e9a03b57913508028e7', size: "xl", state: this.firstButtonState, hierarchy: "primary", icon: "default", "icon-leading": this.firstButtonIconLeading ? true : false, "icon-trailing": this.firstButtonIconTrailing ? true : false, "icon-leading-swap": this.firstButtonIconLeading, "icon-trailing-swap": this.firstButtonIconTrailing, onClick: () => this.onFirstButtonClicked() }, h("p", { key: '1dc531bcf1e71e7b4590e8a442dfbf0e62551260' }, this.firstButtonText))), this.secondButton && (h("gb-button", { key: '9de85d8c1919c747ff72f7aa36c4e9ffd5ae0540', size: "xl", state: this.secondButtonState, hierarchy: "secondary_color", icon: "default", "icon-leading": this.secondButtonIconLeading ? true : false, "icon-trailing": this.secondButtonIconTrailing ? true : false, "icon-leading-swap": this.secondButtonIconLeading, "icon-trailing-swap": this.secondButtonIconTrailing, onClick: () => this.onSecondButtonClicked() }, h("p", { key: 'ada777a4d1b47a43d332c1cc67716f4c8710379d' }, this.secondButtonText))), this.thirdButton && (h("gb-button", { key: '2423d3735b4b08278a49684557a3df13c3c5174d', size: "xl", state: this.thirdButtonState, hierarchy: "secondary_gray", icon: "default", "icon-leading": this.thirdButtonIconLeading ? true : false, "icon-trailing": this.thirdButtonIconTrailing ? true : false, "icon-leading-swap": this.thirdButtonIconLeading, "icon-trailing-swap": this.thirdButtonIconTrailing, onClick: () => this.onThirdButtonClicked() }, h("p", { key: 'c4d6f6bf22595bf2054aad488bfe484e2d3ca926' }, this.thirdButtonText)))))), this.type === 'form_control' && (h("div", { key: '3a2e2c87a3d2ee741f909aa61161ade635cb7427', class: "panel_content" }, h("div", { key: '3b2d5a6775e5fac97609244e12be2cc0314a6209', class: "actions" }, h("gb-button", { key: 'ed4952619e8ebc2d12488037e617566b17abe63e', size: "xl", state: this.previousButtonState, hierarchy: "secondary_gray", icon: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg" }, h("p", { key: '3a2dbbdd76b8ca3f3a10faf9f9c2ce214d8786a9' }, "Previous")), h("div", { key: 'f910802e9af719fda0e26e03e6e648aed307e0ae', class: "right" }, h("gb-button", { key: '37b560fa554ccdf403cef482e9d2cc0b266ea515', size: "xl", hierarchy: "secondary_color", icon: "default" }, h("p", { key: '046baef3471bd1f5d6cd2358bde30863bc66e6c8' }, "Save as draft")), this.showSubmitButton ? (h("gb-button", { size: "xl", hierarchy: "primary", icon: "default" }, h("p", null, this.submitButtonText))) : (h("gb-button", { size: "xl", hierarchy: "primary", icon: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg" }, h("p", null, "Next")))))))));
+        return (h("div", { key: '11acbecf3b3fad9b7d86a0272b7dada6a1d57d91', class: "action_panel_div" }, this.type === 'decision_panel' && (h("div", { key: 'bcfbcafb870c4a081c394beb35111c8d2bf285af', class: "panel_content" }, h("div", { key: '04b73b6cca4e088cfc16c3a30c27788ba983df65', class: "left_action" }, this.showCloseButton && h("gb-button-close", { key: 'a544c001d9d95b9303c011f56af080f8069e283c', size: "md", color: "primary" }), this.showSelectedRows && h("slot", { key: 'f46f5cd60c9104e473fcd629c91b2fd5cf1e5848', name: "selected_rows" }), this.showCheckbox && (h("gb-checkbox", { key: '9c3c85521f9e9a7705be30bd973d443d77dd0920', size: "md", state: StateEnum.Default, type: "checkbox", text: true, "supporting-text": false, onCheckboxClicked: this.onCheckboxClicked.bind(this) }, h("slot", { key: '883572130fb51c96a3d74e47d19ffcafad820ae8', name: "label", slot: "label" })))), h("div", { key: '62c4e3f7e7fde076993ba7a2e32ed3d1a8b263b8', class: "right_action" }, this.firstButton && (h("gb-button", { key: '3a60c01a8cff7c2427ae9c1fb5cbff94a33b69ef', size: "xl", state: this.firstButtonState, hierarchy: "primary", icon: "default", "icon-leading": this.firstButtonIconLeading ? true : false, "icon-trailing": this.firstButtonIconTrailing ? true : false, "icon-leading-swap": this.firstButtonIconLeading, "icon-trailing-swap": this.firstButtonIconTrailing, onClick: () => this.onFirstButtonClicked() }, h("p", { key: 'eacbb64042017556fb64481342946f403c3415ce' }, this.firstButtonText))), this.secondButton && (h("gb-button", { key: '1508f74235c3b62f169e955ff7748e53649581e2', size: "xl", state: this.secondButtonState, hierarchy: "secondary_color", icon: "default", "icon-leading": this.secondButtonIconLeading ? true : false, "icon-trailing": this.secondButtonIconTrailing ? true : false, "icon-leading-swap": this.secondButtonIconLeading, "icon-trailing-swap": this.secondButtonIconTrailing, onClick: () => this.onSecondButtonClicked() }, h("p", { key: 'f3b0441100880d5c4150dd1a9b743e074d919002' }, this.secondButtonText))), this.thirdButton && (h("gb-button", { key: '5e39138ede09bb9e479a734feecbdb3a079ad24a', size: "xl", state: this.thirdButtonState, hierarchy: "secondary_gray", icon: "default", "icon-leading": this.thirdButtonIconLeading ? true : false, "icon-trailing": this.thirdButtonIconTrailing ? true : false, "icon-leading-swap": this.thirdButtonIconLeading, "icon-trailing-swap": this.thirdButtonIconTrailing, onClick: () => this.onThirdButtonClicked() }, h("p", { key: 'e47f8a06ec522abc434d3497c881b91746acfac7' }, this.thirdButtonText)))))), this.type === 'form_control' && (h("div", { key: '83a898efe97e2b5e6a0c7b4d54ced4d8de39e0a8', class: "panel_content" }, h("div", { key: 'f198d03e108f676fb49d30ce4bde542f02280b5a', class: "actions" }, h("gb-button", { key: '0fa72fe83b97a9b4a15e84bcb1b80797a62c069e', size: "xl", state: this.previousButtonState, hierarchy: "secondary_gray", icon: "default", "icon-leading": true, "icon-leading-swap": "assets/arrow-left-02.svg", onClick: () => this.onPreviousButtonClicked() }, h("p", { key: '7e345a747ed9a5c17a2a63213fe64bab1d9fbf1f' }, "Previous")), h("div", { key: '5c302a0d568ab324dfe965e022e60dba5c561456', class: "right" }, h("gb-button", { key: 'bada19dca83ad8f2e95e767ba5ebb1fa7f451f56', size: "xl", hierarchy: "secondary_color", icon: "default", onClick: () => this.onSaveAsDraft() }, h("p", { key: '5d3631e23d7d15f31509d65090daa79516774210' }, "Save as draft")), this.showSubmitButton ? (h("gb-button", { size: "xl", hierarchy: "primary", icon: "default", onClick: () => this.onSubmitClicked() }, h("p", null, this.submitButtonText))) : (h("gb-button", { size: "xl", hierarchy: "primary", icon: "default", "icon-trailing": true, "icon-trailing-swap": "assets/arrow-right-02.svg", onClick: () => this.onNextButtonClicked() }, h("p", null, "Next")))))))));
     }
     static get is() { return "gb-action-panel"; }
     static get encapsulation() { return "shadow"; }
@@ -597,6 +609,66 @@ export class GbActionPanel {
                     "resolved": "void",
                     "references": {}
                 }
+            }, {
+                "method": "previousButtonClicked",
+                "name": "previousButtonClicked",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }, {
+                "method": "saveAsDraft",
+                "name": "saveAsDraft",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }, {
+                "method": "submitButtonClicked",
+                "name": "submitButtonClicked",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }, {
+                "method": "nextButtonClicked",
+                "name": "nextButtonClicked",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
             }, {
                 "method": "checkboxClicked",
                 "name": "checkboxClicked",

package/dist/collection/components/gb-action-panel/gb-action-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"gb-action-panel.js","sourceRoot":"","sources":["../../../src/components/gb-action-panel/gb-action-panel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Prop, State, h } from '@stencil/core';\r\nimport { StateEnum, StateType } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-action-panel',\r\n  styleUrl: 'gb-action-panel.css',\r\n  shadow: true,\r\n})\r\nexport class GbActionPanel {\r\n  @Prop() type!: 'decision_panel' | 'form_control';\r\n  @Prop() showCloseButton: boolean = false;\r\n  @Prop() showSelectedRows: boolean = false;\r\n  @Prop() showCheckbox: boolean = false;\r\n  @Prop() firstButton: boolean = false;\r\n  @Prop() firstButtonIconLeading: string = '';\r\n  @Prop() firstButtonIconTrailing: string = '';\r\n  @Prop() secondButton: boolean = false;\r\n  @Prop() secondButtonIconLeading: string = '';\r\n  @Prop() secondButtonIconTrailing: string = '';\r\n  @Prop() thirdButton: boolean = false;\r\n  @Prop() thirdButtonIconLeading: string = '';\r\n  @Prop() thirdButtonIconTrailing: string = '';\r\n  @Prop() showSubmitButton: boolean = false;\r\n  @Prop() firstButtonText: string = '';\r\n  @Prop() secondButtonText: string = '';\r\n  @Prop() thirdButtonText: string = '';\r\n  @Prop() firstButtonState: StateType;\r\n  @Prop() secondButtonState: StateType;\r\n  @Prop() thirdButtonState: StateType;\r\n  @Prop() previousButtonState: StateType;\r\n  @Prop() submitButtonText: string = '';\r\n  @State() checked: any = false;\r\n  @Event() firstButtonClicked: EventEmitter<void>;\r\n  @Event() secondButtonClicked: EventEmitter<void>;\r\n  @Event() thirdButtonClicked: EventEmitter<void>;\r\n  @Event() checkboxClicked: EventEmitter<void>;\r\n  @Element() el: HTMLElement;\r\n\r\n  componentDidLoad() {\r\n    const selectedRows = this.el.querySelector('[slot=\"selected_rows\"]');\r\n    const label = this.el.querySelector('[slot=\"label\"]');\r\n\r\n    if (selectedRows) {\r\n      selectedRows.classList.add('text-md-medium');\r\n    }\r\n\r\n    if (label) {\r\n      label.classList.add('text-md-medium');\r\n    }\r\n  }\r\n\r\n  onCheckboxClicked(event) {\r\n    this.checked = event.detail;\r\n    this.checkboxClicked.emit(this.checked);\r\n  }\r\n\r\n  onFirstButtonClicked() {\r\n    if (this.firstButtonState === 'default') {\r\n      if (this.showCheckbox) {\r\n        this.firstButtonClicked.emit(this.checked);\r\n      } else {\r\n        this.firstButtonClicked.emit();\r\n      }\r\n    } else {\r\n      return;\r\n    }\r\n  }\r\n\r\n  onSecondButtonClicked() {\r\n    if (this.secondButtonState === 'default') {\r\n      if (this.showCheckbox) {\r\n        this.secondButtonClicked.emit(this.checked);\r\n      } else {\r\n        this.secondButtonClicked.emit();\r\n      }\r\n    }\r\n  }\r\n\r\n  onThirdButtonClicked() {\r\n    if (this.thirdButtonState === 'default') {\r\n      if (this.showCheckbox) {\r\n        this.thirdButtonClicked.emit(this.checked);\r\n      } else {\r\n        this.thirdButtonClicked.emit();\r\n      }\r\n    }\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"action_panel_div\">\r\n        {this.type === 'decision_panel' && (\r\n          <div class=\"panel_content\">\r\n            <div class=\"left_action\">\r\n              {this.showCloseButton && <gb-button-close size=\"md\" color=\"primary\"></gb-button-close>}\r\n              {this.showSelectedRows && <slot name=\"selected_rows\"></slot>}\r\n              {this.showCheckbox && (\r\n                <gb-checkbox size=\"md\" state={StateEnum.Default} type=\"checkbox\" text={true} supporting-text={false} onCheckboxClicked={this.onCheckboxClicked.bind(this)}>\r\n                  <slot name=\"label\" slot=\"label\"></slot>\r\n                </gb-checkbox>\r\n              )}\r\n            </div>\r\n            <div class=\"right_action\">\r\n              {this.firstButton && (\r\n                <gb-button\r\n                  size=\"xl\"\r\n                  state={this.firstButtonState}\r\n                  hierarchy=\"primary\"\r\n                  icon=\"default\"\r\n                  icon-leading={this.firstButtonIconLeading ? true : false}\r\n                  icon-trailing={this.firstButtonIconTrailing ? true : false}\r\n                  icon-leading-swap={this.firstButtonIconLeading}\r\n                  icon-trailing-swap={this.firstButtonIconTrailing}\r\n                  onClick={() => this.onFirstButtonClicked()}\r\n                >\r\n                  <p>{this.firstButtonText}</p>\r\n                </gb-button>\r\n              )}\r\n              {this.secondButton && (\r\n                <gb-button\r\n                  size=\"xl\"\r\n                  state={this.secondButtonState}\r\n                  hierarchy=\"secondary_color\"\r\n                  icon=\"default\"\r\n                  icon-leading={this.secondButtonIconLeading ? true : false}\r\n                  icon-trailing={this.secondButtonIconTrailing ? true : false}\r\n                  icon-leading-swap={this.secondButtonIconLeading}\r\n                  icon-trailing-swap={this.secondButtonIconTrailing}\r\n                  onClick={() => this.onSecondButtonClicked()}\r\n                >\r\n                  <p>{this.secondButtonText}</p>\r\n                </gb-button>\r\n              )}\r\n              {this.thirdButton && (\r\n                <gb-button\r\n                  size=\"xl\"\r\n                  state={this.thirdButtonState}\r\n                  hierarchy=\"secondary_gray\"\r\n                  icon=\"default\"\r\n                  icon-leading={this.thirdButtonIconLeading ? true : false}\r\n                  icon-trailing={this.thirdButtonIconTrailing ? true : false}\r\n                  icon-leading-swap={this.thirdButtonIconLeading}\r\n                  icon-trailing-swap={this.thirdButtonIconTrailing}\r\n                  onClick={() => this.onThirdButtonClicked()}\r\n                >\r\n                  <p>{this.thirdButtonText}</p>\r\n                </gb-button>\r\n              )}\r\n            </div>\r\n          </div>\r\n        )}\r\n        {this.type === 'form_control' && (\r\n          <div class=\"panel_content\">\r\n            <div class=\"actions\">\r\n              <gb-button size=\"xl\" state={this.previousButtonState} hierarchy=\"secondary_gray\" icon=\"default\" icon-leading={true} icon-leading-swap=\"assets/arrow-left-02.svg\">\r\n                <p>Previous</p>\r\n              </gb-button>\r\n              <div class=\"right\">\r\n                <gb-button size=\"xl\" hierarchy=\"secondary_color\" icon=\"default\">\r\n                  <p>Save as draft</p>\r\n                </gb-button>\r\n                {this.showSubmitButton ? (\r\n                  <gb-button size=\"xl\" hierarchy=\"primary\" icon=\"default\">\r\n                    <p>{this.submitButtonText}</p>\r\n                  </gb-button>\r\n                ) : (\r\n                  <gb-button size=\"xl\" hierarchy=\"primary\" icon=\"default\" icon-trailing={true} icon-trailing-swap=\"assets/arrow-right-02.svg\">\r\n                    <p>Next</p>\r\n                  </gb-button>\r\n                )}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"gb-action-panel.js","sourceRoot":"","sources":["../../../src/components/gb-action-panel/gb-action-panel.tsx"],"names":[],"mappings":"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CACD,CACb,CACG,CACF,CACF,CACP,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Event, EventEmitter, Prop, State, h } from '@stencil/core';\r\nimport { StateEnum, StateType } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-action-panel',\r\n  styleUrl: 'gb-action-panel.css',\r\n  shadow: true,\r\n})\r\nexport class GbActionPanel {\r\n  @Prop() type!: 'decision_panel' | 'form_control';\r\n  @Prop() showCloseButton: boolean = false;\r\n  @Prop() showSelectedRows: boolean = false;\r\n  @Prop() showCheckbox: boolean = false;\r\n  @Prop() firstButton: boolean = false;\r\n  @Prop() firstButtonIconLeading: string = '';\r\n  @Prop() firstButtonIconTrailing: string = '';\r\n  @Prop() secondButton: boolean = false;\r\n  @Prop() secondButtonIconLeading: string = '';\r\n  @Prop() secondButtonIconTrailing: string = '';\r\n  @Prop() thirdButton: boolean = false;\r\n  @Prop() thirdButtonIconLeading: string = '';\r\n  @Prop() thirdButtonIconTrailing: string = '';\r\n  @Prop() showSubmitButton: boolean = false;\r\n  @Prop() firstButtonText: string = '';\r\n  @Prop() secondButtonText: string = '';\r\n  @Prop() thirdButtonText: string = '';\r\n  @Prop() firstButtonState: StateType;\r\n  @Prop() secondButtonState: StateType;\r\n  @Prop() thirdButtonState: StateType;\r\n  @Prop() previousButtonState: StateType;\r\n  @Prop() submitButtonText: string = '';\r\n  @State() checked: any = false;\r\n  @Event() firstButtonClicked: EventEmitter<void>;\r\n  @Event() secondButtonClicked: EventEmitter<void>;\r\n  @Event() thirdButtonClicked: EventEmitter<void>;\r\n  @Event() previousButtonClicked: EventEmitter<void>;\r\n  @Event() saveAsDraft: EventEmitter<void>;\r\n  @Event() submitButtonClicked: EventEmitter<void>;\r\n  @Event() nextButtonClicked: EventEmitter<void>;\r\n  @Event() checkboxClicked: EventEmitter<void>;\r\n  @Element() el: HTMLElement;\r\n\r\n  componentDidLoad() {\r\n    const selectedRows = this.el.querySelector('[slot=\"selected_rows\"]');\r\n    const label = this.el.querySelector('[slot=\"label\"]');\r\n\r\n    if (selectedRows) {\r\n      selectedRows.classList.add('text-md-medium');\r\n    }\r\n\r\n    if (label) {\r\n      label.classList.add('text-md-medium');\r\n    }\r\n  }\r\n\r\n  onCheckboxClicked(event) {\r\n    this.checked = event.detail;\r\n    this.checkboxClicked.emit(this.checked);\r\n  }\r\n\r\n  onFirstButtonClicked() {\r\n    if (this.firstButtonState === 'default') {\r\n      if (this.showCheckbox) {\r\n        this.firstButtonClicked.emit(this.checked);\r\n      } else {\r\n        this.firstButtonClicked.emit();\r\n      }\r\n    } else {\r\n      return;\r\n    }\r\n  }\r\n\r\n  onSecondButtonClicked() {\r\n    if (this.secondButtonState === 'default') {\r\n      if (this.showCheckbox) {\r\n        this.secondButtonClicked.emit(this.checked);\r\n      } else {\r\n        this.secondButtonClicked.emit();\r\n      }\r\n    }\r\n  }\r\n\r\n  onThirdButtonClicked() {\r\n    if (this.thirdButtonState === 'default') {\r\n      if (this.showCheckbox) {\r\n        this.thirdButtonClicked.emit(this.checked);\r\n      } else {\r\n        this.thirdButtonClicked.emit();\r\n      }\r\n    }\r\n  }\r\n\r\n  onPreviousButtonClicked() {\r\n    this.previousButtonClicked.emit();\r\n  }\r\n\r\n  onSaveAsDraft() {\r\n    this.saveAsDraft.emit();\r\n  }\r\n\r\n  onSubmitClicked() {\r\n    this.submitButtonClicked.emit();\r\n  }\r\n\r\n  onNextButtonClicked() {\r\n    this.nextButtonClicked.emit();\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"action_panel_div\">\r\n        {this.type === 'decision_panel' && (\r\n          <div class=\"panel_content\">\r\n            <div class=\"left_action\">\r\n              {this.showCloseButton && <gb-button-close size=\"md\" color=\"primary\"></gb-button-close>}\r\n              {this.showSelectedRows && <slot name=\"selected_rows\"></slot>}\r\n              {this.showCheckbox && (\r\n                <gb-checkbox size=\"md\" state={StateEnum.Default} type=\"checkbox\" text={true} supporting-text={false} onCheckboxClicked={this.onCheckboxClicked.bind(this)}>\r\n                  <slot name=\"label\" slot=\"label\"></slot>\r\n                </gb-checkbox>\r\n              )}\r\n            </div>\r\n            <div class=\"right_action\">\r\n              {this.firstButton && (\r\n                <gb-button\r\n                  size=\"xl\"\r\n                  state={this.firstButtonState}\r\n                  hierarchy=\"primary\"\r\n                  icon=\"default\"\r\n                  icon-leading={this.firstButtonIconLeading ? true : false}\r\n                  icon-trailing={this.firstButtonIconTrailing ? true : false}\r\n                  icon-leading-swap={this.firstButtonIconLeading}\r\n                  icon-trailing-swap={this.firstButtonIconTrailing}\r\n                  onClick={() => this.onFirstButtonClicked()}\r\n                >\r\n                  <p>{this.firstButtonText}</p>\r\n                </gb-button>\r\n              )}\r\n              {this.secondButton && (\r\n                <gb-button\r\n                  size=\"xl\"\r\n                  state={this.secondButtonState}\r\n                  hierarchy=\"secondary_color\"\r\n                  icon=\"default\"\r\n                  icon-leading={this.secondButtonIconLeading ? true : false}\r\n                  icon-trailing={this.secondButtonIconTrailing ? true : false}\r\n                  icon-leading-swap={this.secondButtonIconLeading}\r\n                  icon-trailing-swap={this.secondButtonIconTrailing}\r\n                  onClick={() => this.onSecondButtonClicked()}\r\n                >\r\n                  <p>{this.secondButtonText}</p>\r\n                </gb-button>\r\n              )}\r\n              {this.thirdButton && (\r\n                <gb-button\r\n                  size=\"xl\"\r\n                  state={this.thirdButtonState}\r\n                  hierarchy=\"secondary_gray\"\r\n                  icon=\"default\"\r\n                  icon-leading={this.thirdButtonIconLeading ? true : false}\r\n                  icon-trailing={this.thirdButtonIconTrailing ? true : false}\r\n                  icon-leading-swap={this.thirdButtonIconLeading}\r\n                  icon-trailing-swap={this.thirdButtonIconTrailing}\r\n                  onClick={() => this.onThirdButtonClicked()}\r\n                >\r\n                  <p>{this.thirdButtonText}</p>\r\n                </gb-button>\r\n              )}\r\n            </div>\r\n          </div>\r\n        )}\r\n        {this.type === 'form_control' && (\r\n          <div class=\"panel_content\">\r\n            <div class=\"actions\">\r\n              <gb-button\r\n                size=\"xl\"\r\n                state={this.previousButtonState}\r\n                hierarchy=\"secondary_gray\"\r\n                icon=\"default\"\r\n                icon-leading={true}\r\n                icon-leading-swap=\"assets/arrow-left-02.svg\"\r\n                onClick={() => this.onPreviousButtonClicked()}\r\n              >\r\n                <p>Previous</p>\r\n              </gb-button>\r\n              <div class=\"right\">\r\n                <gb-button size=\"xl\" hierarchy=\"secondary_color\" icon=\"default\" onClick={() => this.onSaveAsDraft()}>\r\n                  <p>Save as draft</p>\r\n                </gb-button>\r\n                {this.showSubmitButton ? (\r\n                  <gb-button size=\"xl\" hierarchy=\"primary\" icon=\"default\" onClick={() => this.onSubmitClicked()}>\r\n                    <p>{this.submitButtonText}</p>\r\n                  </gb-button>\r\n                ) : (\r\n                  <gb-button\r\n                    size=\"xl\"\r\n                    hierarchy=\"primary\"\r\n                    icon=\"default\"\r\n                    icon-trailing={true}\r\n                    icon-trailing-swap=\"assets/arrow-right-02.svg\"\r\n                    onClick={() => this.onNextButtonClicked()}\r\n                  >\r\n                    <p>Next</p>\r\n                  </gb-button>\r\n                )}\r\n              </div>\r\n            </div>\r\n          </div>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/gb-button/readme.md

@@ -17,7 +17,7 @@
 | `iconTrailing`           | `icon-trailing`      |             | `boolean`                                                                                                                  | `false`     |
 | `iconTrailingSwap`       | `icon-trailing-swap` |             | `string`                                                                                                                   | `undefined` |
 | `size` _(required)_      | `size`               |             | `"lg" \| "md" \| "profile_lg" \| "profile_md" \| "profile_sm" \| "sm" \| "xl" \| "xl2" \| "xl3" \| "xl4" \| "xs" \| "xxs"` | `undefined` |
-| `state`                  | `state`              |             | `"default" \| "disabled"`                                                                                                  | `undefined` |
+| `state`                  | `state`              |             | `"applied" \| "default" \| "disabled"`                                                                                     | `undefined` |
 
 
 ## Dependencies
@@ -30,6 +30,7 @@
  - [gb-detail-cell](../gb-detail-cell)
  - [gb-file-upload](../gb-file-upload)
  - [gb-file-upload-item-base](../gb-file-upload-item-base)
+ - [gb-filter-button](../gb-filter-button)
  - [gb-input-field](../gb-input-field)
  - [gb-notification-pane](../gb-notification-pane)
  - [gb-pagination](../gb-pagination)
@@ -45,6 +46,7 @@ graph TD;
   gb-detail-cell --> gb-button
   gb-file-upload --> gb-button
   gb-file-upload-item-base --> gb-button
+  gb-filter-button --> gb-button
   gb-input-field --> gb-button
   gb-notification-pane --> gb-button
   gb-pagination --> gb-button

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

@@ -0,0 +1,10 @@
+.button_group_wrapper {
+  display: inline-flex;
+  align-items: flex-start;
+  width: fit-content;
+  height: fit-content;
+  border-radius: 0.5rem;
+  border: 1px solid var(--color-border-subtle, #cdd5df);
+  box-shadow: var(--shadow-xs);
+  overflow: hidden;
+}

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

@@ -0,0 +1,131 @@
+import { h } from "@stencil/core";
+export class GbButtonGroup {
+    constructor() {
+        this.items = [
+        // { label: 'Male', current: true, icon: 'assets/calendar-02.svg' },
+        // { label: 'Female', current: false, icon: 'assets/calendar-02.svg' },
+        // { label: 'Hi', current: false, icon: 'assets/calendar-02.svg' },
+        // { label: 'Gideon', current: false, icon: 'assets/calendar-02.svg' },
+        // { label: 'Emmanuel', current: false, icon: 'assets/calendar-02.svg' },
+        ];
+        this.value = '';
+        this.internalItems = [];
+        this.selectedValues = '';
+    }
+    componentWillLoad() {
+        this.internalItems = [...this.items];
+    }
+    handleSelect(index) {
+        const selectedValue = this.internalItems[index].label;
+        this.internalItems = this.internalItems.map((item, i) => (Object.assign(Object.assign({}, item), { current: i === index })));
+        // this.selectedValues = selectedValue;
+        this.valueChange.emit(selectedValue);
+    }
+    render() {
+        return (h("div", { key: '2df3c48b76663e13ff3a52f791781dffd79f8eeb', class: "button_group_wrapper" }, this.internalItems.map((item, index) => (h("gb-button-group-base", { key: index, state: "default", icon: this.icon, label: item.label, current: item.current, onClick: () => this.handleSelect(index), "icon-src": item.icon })))));
+    }
+    static get is() { return "gb-button-group"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["gb-button-group.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["gb-button-group.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "items": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "{ label: string; current?: boolean; icon?: string }[]",
+                    "resolved": "{ label: string; current?: boolean; icon?: string; }[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[\r\n    // { label: 'Male', current: true, icon: 'assets/calendar-02.svg' },\r\n    // { label: 'Female', current: false, icon: 'assets/calendar-02.svg' },\r\n    // { label: 'Hi', current: false, icon: 'assets/calendar-02.svg' },\r\n    // { label: 'Gideon', current: false, icon: 'assets/calendar-02.svg' },\r\n    // { label: 'Emmanuel', current: false, icon: 'assets/calendar-02.svg' },\r\n  ]"
+            },
+            "value": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string | string[]",
+                    "resolved": "string | string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "value",
+                "reflect": false,
+                "defaultValue": "''"
+            },
+            "icon": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "ButtonGroupTypes",
+                    "resolved": "\"checkbox\" | \"dot\" | \"false\" | \"leading\" | \"only\"",
+                    "references": {
+                        "ButtonGroupTypes": {
+                            "location": "import",
+                            "path": "../../models/reusableModels",
+                            "id": "src/models/reusableModels.ts::ButtonGroupTypes"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "icon",
+                "reflect": false
+            }
+        };
+    }
+    static get states() {
+        return {
+            "internalItems": {},
+            "selectedValues": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "valueChange",
+                "name": "valueChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "string | string[]",
+                    "resolved": "string | string[]",
+                    "references": {}
+                }
+            }];
+    }
+}
+//# sourceMappingURL=gb-button-group.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"gb-button-group.js","sourceRoot":"","sources":["../../../src/components/gb-button-group/gb-button-group.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAQ/E,MAAM,OAAO,aAAa;IAL1B;QAMU,UAAK,GAA0D;QACrE,oEAAoE;QACpE,uEAAuE;QACvE,mEAAmE;QACnE,uEAAuE;QACvE,yEAAyE;SAC1E,CAAC;QACuB,UAAK,GAAsB,EAAE,CAAC;QAE9C,kBAAa,GAA0D,EAAE,CAAC;QAC1E,mBAAc,GAAW,EAAE,CAAC;KAoCtC;IAjCC,iBAAiB;QACf,IAAI,CAAC,aAAa,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC;IACvC,CAAC;IAED,YAAY,CAAC,KAAa;QACxB,MAAM,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC;QAEtD,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,iCACpD,IAAI,KACP,OAAO,EAAE,CAAC,KAAK,KAAK,IACpB,CAAC,CAAC;QAEJ,uCAAuC;QACvC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;IACvC,CAAC;IAED,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,sBAAsB,IAC9B,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CACvC,4BACE,GAAG,EAAE,KAAK,EACV,KAAK,EAAC,SAAS,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,cAC7B,IAAI,CAAC,IAAI,GACG,CACzB,CAAC,CACE,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Event, EventEmitter, Prop, State, h } from '@stencil/core';\r\nimport { ButtonGroupTypes } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-button-group',\r\n  styleUrl: 'gb-button-group.css',\r\n  shadow: true,\r\n})\r\nexport class GbButtonGroup {\r\n  @Prop() items: { label: string; current?: boolean; icon?: string }[] = [\r\n    // { label: 'Male', current: true, icon: 'assets/calendar-02.svg' },\r\n    // { label: 'Female', current: false, icon: 'assets/calendar-02.svg' },\r\n    // { label: 'Hi', current: false, icon: 'assets/calendar-02.svg' },\r\n    // { label: 'Gideon', current: false, icon: 'assets/calendar-02.svg' },\r\n    // { label: 'Emmanuel', current: false, icon: 'assets/calendar-02.svg' },\r\n  ];\r\n  @Prop({ mutable: true }) value: string | string[] = '';\r\n  @Prop() icon: ButtonGroupTypes;\r\n  @State() internalItems: { label: string; current?: boolean; icon?: string }[] = [];\r\n  @State() selectedValues: string = '';\r\n  @Event() valueChange: EventEmitter<string | string[]>;\r\n\r\n  componentWillLoad() {\r\n    this.internalItems = [...this.items];\r\n  }\r\n\r\n  handleSelect(index: number) {\r\n    const selectedValue = this.internalItems[index].label;\r\n\r\n    this.internalItems = this.internalItems.map((item, i) => ({\r\n      ...item,\r\n      current: i === index,\r\n    }));\r\n\r\n    // this.selectedValues = selectedValue;\r\n    this.valueChange.emit(selectedValue);\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"button_group_wrapper\">\r\n        {this.internalItems.map((item, index) => (\r\n          <gb-button-group-base\r\n            key={index}\r\n            state=\"default\"\r\n            icon={this.icon}\r\n            label={item.label}\r\n            current={item.current}\r\n            onClick={() => this.handleSelect(index)}\r\n            icon-src={item.icon}\r\n          ></gb-button-group-base>\r\n        ))}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}