globuswebcomponents 2.8.7 → 2.8.8

package/dist/esm/gb-nav-bar-sidemenu.entry.js

@@ -1,75 +0,0 @@
-import { r as registerInstance, c as createEvent, d as getAssetPath, h, a as getElement } from './index-BwHeoi2W.js';
-
-const gbNavBarSidemenuCss = ".nav_bar_wrapper{display:flex;width:17.5rem;height:100%;padding:var(--spacing-6) var(--spacing-7);flex-direction:column;justify-content:space-between;align-items:flex-start;border-right:1px solid var(--color-border-subtler, #e3e8ef);background:var(--color-surface, #ffffff);box-sizing:border-box}.vertical_tabs{width:100%}.wrapper{display:flex;padding:var(--spacing-4) var(--spacing-5) var(--spacing-5) var(--spacing-5);flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--spacing-4);align-self:stretch;border-radius:var(--rounded-sm);border:1px solid var(--color-border-subtler, #e3e8ef);background:var(--color-background-gray-subtlest, #f6f8fa);position:relative;height:auto;overflow:hidden}.wrapper_pattern{position:absolute;top:0;left:0;width:100%;height:100%;mix-blend-mode:multiply}::slotted([slot='application_name']){color:var(--color-text-information-bold, #042f59) !important}.application_icon path[stroke]{stroke:var(--color-icon-information-bold, #042F59)}.application_icon path[fill]{fill:var(--color-icon-information-bold, #042F59)}";
-
-const GbNavBarSidemenu = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.navBarItemClicked = createEvent(this, "navBarItemClicked");
-        this.applicationName = '';
-        this.applicationIcon = '';
-        this.activeIndex = 0;
-        this.tabs = [
-        // {
-        //   name: 'Accounts',
-        //   index: 0,
-        // },
-        // {
-        //   name: 'Transaction history lite',
-        //   index: 1,
-        // },
-        // {
-        //   name: 'TPP report',
-        //   index: 1,
-        // },
-        // {
-        //   name: 'Check dump history',
-        //   index: 1,
-        // },
-        ];
-        this.leadingIconSvg = '';
-    }
-    async loadIcon(iconName) {
-        const iconPath = getAssetPath(`${iconName}`);
-        const response = await fetch(iconPath);
-        const svg = await response.text();
-        this.leadingIconSvg = svg;
-    }
-    onTabItemClicked(event) {
-        this.navBarItemClicked.emit(event.detail);
-    }
-    componentWillLoad() {
-        this.loadIcon(this.applicationIcon);
-    }
-    componentDidLoad() {
-        const applicationName = this.el.querySelector('[slot="application_name"]');
-        if (applicationName) {
-            applicationName.classList.add('text-lg-bold');
-        }
-    }
-    render() {
-        const patternSrc = getAssetPath(`assets/pattern_wrapper.svg`);
-        // return (
-        //   <div class="top_bar_sidemenu_div">
-        //     <div class="vertical_tabs_div">
-        //       <gb-vertical-tabs size="md" tabs={this.tabs} type="button_primary" active-index={this.activeIndex} onTabItemClicked={this.onTabItemClicked.bind(this)}></gb-vertical-tabs>
-        //     </div>
-        //     <div class="wrapper">
-        //       <div class="wrapper_pattern">
-        //         <img src={patternSrc} alt="" />
-        //       </div>
-        //       <div class={`application_icon`} innerHTML={this.leadingIconSvg}></div>
-        //       <div class="application_name">
-        //         <slot name="application_name"></slot>
-        //       </div>
-        //     </div>
-        //   </div>
-        // );
-        return (h("div", { key: 'a83290e664d21af5b152ab0c02f71b531086e25d', class: "nav_bar_wrapper" }, h("gb-vertical-tabs", { key: 'aa5c02e355926f157f0329710f30879102240d49', class: "vertical_tabs", size: "sm", tabs: this.tabs, type: "button_primary", "active-index": this.activeIndex, onTabItemClicked: this.onTabItemClicked.bind(this) }), h("div", { key: 'd4f0e991c81467f3daa72c3b21f29829f0636ec9', class: "wrapper" }, h("div", { key: '8a55adff086f57fa0b0740f19a8a775aaad51abf', class: "wrapper_pattern" }, h("img", { key: '3bfd9ea69d129a651b8953b26509b2b2a4d727f2', src: patternSrc, alt: "" })), h("div", { key: '898d276ab8667832c84595401430f01c469b7685', class: `application_icon`, innerHTML: this.leadingIconSvg }), h("slot", { key: '45ac2c3362dc47f438307f29ea1bde8440db6e6a', name: "application_name" }))));
-    }
-    get el() { return getElement(this); }
-};
-GbNavBarSidemenu.style = gbNavBarSidemenuCss;
-
-export { GbNavBarSidemenu as gb_nav_bar_sidemenu };
-//# sourceMappingURL=gb-nav-bar-sidemenu.entry.js.map

package/dist/esm/gb-nav-bar-sidemenu.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"gb-nav-bar-sidemenu.entry.js","sources":["src/components/gb-nav-bar-sidemenu/gb-nav-bar-sidemenu.css?tag=gb-nav-bar-sidemenu&encapsulation=shadow","src/components/gb-nav-bar-sidemenu/gb-nav-bar-sidemenu.tsx"],"sourcesContent":[".nav_bar_wrapper {\r\n  display: flex;\r\n  width: 17.5rem;\r\n  height: 100%;\r\n  padding: var(--spacing-6) var(--spacing-7);\r\n  flex-direction: column;\r\n  justify-content: space-between;\r\n  align-items: flex-start;\r\n  border-right: 1px solid var(--color-border-subtler, #e3e8ef);\r\n  background: var(--color-surface, #ffffff);\r\n  box-sizing: border-box;\r\n}\r\n\r\n.vertical_tabs {\r\n  width: 100%;\r\n}\r\n\r\n.wrapper {\r\n  display: flex;\r\n  padding: var(--spacing-4) var(--spacing-5) var(--spacing-5) var(--spacing-5);\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  align-items: flex-start;\r\n  gap: var(--spacing-4);\r\n  align-self: stretch;\r\n  border-radius: var(--rounded-sm);\r\n  border: 1px solid var(--color-border-subtler, #e3e8ef);\r\n  background: var(--color-background-gray-subtlest, #f6f8fa);\r\n  position: relative;\r\n  height: auto;\r\n  overflow: hidden;\r\n}\r\n\r\n.wrapper_pattern {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  mix-blend-mode: multiply;\r\n}\r\n\r\n::slotted([slot='application_name']) {\r\n  color: var(--color-text-information-bold, #042f59) !important;\r\n}\r\n\r\n.application_icon path[stroke]{\r\n  stroke: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.application_icon path[fill]{\r\n  fill: var(--color-icon-information-bold, #042F59);\r\n}","import { Component, Element, Event, EventEmitter, Prop, State, getAssetPath, h } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'gb-nav-bar-sidemenu',\r\n  styleUrl: 'gb-nav-bar-sidemenu.css',\r\n  shadow: true,\r\n})\r\nexport class GbNavBarSidemenu {\r\n  @Prop() applicationName: string = '';\r\n  @Prop() applicationIcon: string = '';\r\n  @Prop() activeIndex: number = 0;\r\n  @Prop() tabs: { name: string; index: number }[] = [\r\n    // {\r\n    //   name: 'Accounts',\r\n    //   index: 0,\r\n    // },\r\n    // {\r\n    //   name: 'Transaction history lite',\r\n    //   index: 1,\r\n    // },\r\n    // {\r\n    //   name: 'TPP report',\r\n    //   index: 1,\r\n    // },\r\n    // {\r\n    //   name: 'Check dump history',\r\n    //   index: 1,\r\n    // },\r\n  ];\r\n  @State() leadingIconSvg: string = '';\r\n  @Element() el: HTMLElement;\r\n  @Event() navBarItemClicked: EventEmitter<void>;\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  onTabItemClicked(event) {\r\n    this.navBarItemClicked.emit(event.detail);\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.loadIcon(this.applicationIcon);\r\n  }\r\n\r\n  componentDidLoad() {\r\n    const applicationName = this.el.querySelector('[slot=\"application_name\"]');\r\n\r\n    if (applicationName) {\r\n      applicationName.classList.add('text-lg-bold');\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const patternSrc = getAssetPath(`assets/pattern_wrapper.svg`);\r\n\r\n    // return (\r\n    //   <div class=\"top_bar_sidemenu_div\">\r\n    //     <div class=\"vertical_tabs_div\">\r\n    //       <gb-vertical-tabs size=\"md\" tabs={this.tabs} type=\"button_primary\" active-index={this.activeIndex} onTabItemClicked={this.onTabItemClicked.bind(this)}></gb-vertical-tabs>\r\n    //     </div>\r\n    //     <div class=\"wrapper\">\r\n    //       <div class=\"wrapper_pattern\">\r\n    //         <img src={patternSrc} alt=\"\" />\r\n    //       </div>\r\n    //       <div class={`application_icon`} innerHTML={this.leadingIconSvg}></div>\r\n    //       <div class=\"application_name\">\r\n    //         <slot name=\"application_name\"></slot>\r\n    //       </div>\r\n    //     </div>\r\n    //   </div>\r\n    // );\r\n\r\n    return (\r\n      <div class=\"nav_bar_wrapper\">\r\n        <gb-vertical-tabs\r\n          class=\"vertical_tabs\"\r\n          size=\"sm\"\r\n          tabs={this.tabs}\r\n          type=\"button_primary\"\r\n          active-index={this.activeIndex}\r\n          onTabItemClicked={this.onTabItemClicked.bind(this)}\r\n        ></gb-vertical-tabs>\r\n        <div class=\"wrapper\">\r\n          <div class=\"wrapper_pattern\">\r\n            <img src={patternSrc} alt=\"\" />\r\n          </div>\r\n          <div class={`application_icon`} innerHTML={this.leadingIconSvg}></div>\r\n          <slot name=\"application_name\"></slot>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,mBAAmB,GAAG,ijCAAijC;;MCOhkC,gBAAgB,GAAA,MAAA;AAL7B,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAMU,QAAA,IAAe,CAAA,eAAA,GAAW,EAAE;AAC5B,QAAA,IAAe,CAAA,eAAA,GAAW,EAAE;AAC5B,QAAA,IAAW,CAAA,WAAA,GAAW,CAAC;QACvB,IAAA,CAAA,IAAI,GAAsC;;;;;;;;;;;;;;;;;SAiBjD;AACQ,QAAA,IAAc,CAAA,cAAA,GAAW,EAAE;AAmErC;IA/DC,MAAM,QAAQ,CAAC,QAAgB,EAAA;QAC7B,MAAM,QAAQ,GAAG,YAAY,CAAC,GAAG,QAAQ,CAAA,CAAE,CAAC;AAC5C,QAAA,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,QAAQ,CAAC;AACtC,QAAA,MAAM,GAAG,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE;AACjC,QAAA,IAAI,CAAC,cAAc,GAAG,GAAG;;AAG3B,IAAA,gBAAgB,CAAC,KAAK,EAAA;QACpB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;;IAG3C,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,eAAe,CAAC;;IAGrC,gBAAgB,GAAA;QACd,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,2BAA2B,CAAC;QAE1E,IAAI,eAAe,EAAE;AACnB,YAAA,eAAe,CAAC,SAAS,CAAC,GAAG,CAAC,cAAc,CAAC;;;IAIjD,MAAM,GAAA;AACJ,QAAA,MAAM,UAAU,GAAG,YAAY,CAAC,CAAA,0BAAA,CAA4B,CAAC;;;;;;;;;;;;;;;;;AAmB7D,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,iBAAiB,EAAA,EAC1B,CAAA,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,eAAe,EACrB,IAAI,EAAC,IAAI,EACT,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAC,gBAAgB,EAAA,cAAA,EACP,IAAI,CAAC,WAAW,EAC9B,gBAAgB,EAAE,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,EAChC,CAAA,EACpB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EAClB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,EAC1B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,UAAU,EAAE,GAAG,EAAC,EAAE,GAAG,CAC3B,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAkB,gBAAA,CAAA,EAAE,SAAS,EAAE,IAAI,CAAC,cAAc,EAAQ,CAAA,EACtE,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,kBAAkB,GAAQ,CACjC,CACF;;;;;;;;"}

package/dist/esm/gb-vertical-tabs.entry.js

@@ -1,42 +0,0 @@
-import { r as registerInstance, c as createEvent, h } from './index-BwHeoi2W.js';
-
-const gbVerticalTabsCss = ".vertical_tab_div{display:flex;flex-direction:column;gap:var(--spacing-1);width:100%}";
-
-const GbVerticalTabs = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.tabItemClicked = createEvent(this, "tabItemClicked");
-        this.activeIndex = 0;
-        this.tabs = [
-        // {
-        //   name: 'Hiiii',
-        //   index: 0,
-        // },
-        // {
-        //   name: 'There',
-        //   index: 1,
-        // },
-        ];
-        this.internalTabs = [...this.tabs];
-    }
-    onTabsChanged(newTabs) {
-        this.internalTabs = newTabs;
-    }
-    componentWillLoad() {
-        this.internalTabs = this.tabs;
-    }
-    async handleTabClick(index, label) {
-        this.activeIndex = index;
-        this.tabItemClicked.emit({ index, label });
-    }
-    render() {
-        return (h("div", { key: '4683768faaacb14cd18c3bf3fb6a1e0d109e76cf', class: `vertical_tab_div` }, this.internalTabs.map((tab, index) => (h("gb-tab-button-base", { size: this.size, type: this.type === 'button_gray_border' ? 'button_white' : this.type, "tab-name": tab.name, current: this.activeIndex === index, onClick: () => this.handleTabClick(index, tab.name), alignment: "vertical" })))));
-    }
-    static get watchers() { return {
-        "tabs": ["onTabsChanged"]
-    }; }
-};
-GbVerticalTabs.style = gbVerticalTabsCss;
-
-export { GbVerticalTabs as gb_vertical_tabs };
-//# sourceMappingURL=gb-vertical-tabs.entry.js.map

package/dist/esm/gb-vertical-tabs.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"gb-vertical-tabs.entry.js","sources":["src/components/gb-vertical-tabs/gb-vertical-tabs.css?tag=gb-vertical-tabs&encapsulation=shadow","src/components/gb-vertical-tabs/gb-vertical-tabs.tsx"],"sourcesContent":[".vertical_tab_div{\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: var(--spacing-1);\r\n    width: 100%;\r\n}","import { Component, Event, EventEmitter, Prop, State, Watch, h } from '@stencil/core';\r\nimport { GeneralSizes, TabTypes } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-vertical-tabs',\r\n  styleUrl: 'gb-vertical-tabs.css',\r\n  shadow: true,\r\n})\r\nexport class GbVerticalTabs {\r\n  @Prop() size: GeneralSizes;\r\n  @Prop() type: TabTypes;\r\n  @Prop({ mutable: true }) activeIndex: number = 0;\r\n  @Prop() tabs: { name: string; index: number }[] = [\r\n    // {\r\n    //   name: 'Hiiii',\r\n    //   index: 0,\r\n    // },\r\n    // {\r\n    //   name: 'There',\r\n    //   index: 1,\r\n    // },\r\n  ];\r\n  @State() internalTabs: { name: string; index: number }[] = [...this.tabs];\r\n  @Event() tabItemClicked: EventEmitter<{ index: number; label: string }>;\r\n\r\n  @Watch('tabs')\r\n  onTabsChanged(newTabs: { name: string; index: number }[]) {\r\n    this.internalTabs = newTabs;\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.internalTabs = this.tabs;\r\n  }\r\n\r\n  async handleTabClick(index: number, label: string) {\r\n    this.activeIndex = index;\r\n    this.tabItemClicked.emit({ index, label });\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class={`vertical_tab_div`}>\r\n        {this.internalTabs.map((tab, index) => (\r\n          <gb-tab-button-base\r\n            size={this.size}\r\n            type={this.type === 'button_gray_border' ? 'button_white' : this.type}\r\n            tab-name={tab.name}\r\n            current={this.activeIndex === index}\r\n            onClick={() => this.handleTabClick(index, tab.name)}\r\n            alignment=\"vertical\"\r\n          ></gb-tab-button-base>\r\n        ))}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,iBAAiB,GAAG,uFAAuF;;MCQpG,cAAc,GAAA,MAAA;AAL3B,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAQ2B,QAAA,IAAW,CAAA,WAAA,GAAW,CAAC;QACxC,IAAA,CAAA,IAAI,GAAsC;;;;;;;;;SASjD;QACQ,IAAA,CAAA,YAAY,GAAsC,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;AAiC1E;AA7BC,IAAA,aAAa,CAAC,OAA0C,EAAA;AACtD,QAAA,IAAI,CAAC,YAAY,GAAG,OAAO;;IAG7B,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,IAAI;;AAG/B,IAAA,MAAM,cAAc,CAAC,KAAa,EAAE,KAAa,EAAA;AAC/C,QAAA,IAAI,CAAC,WAAW,GAAG,KAAK;QACxB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC;;IAG5C,MAAM,GAAA;QACJ,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAA,gBAAA,CAAkB,IAC3B,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,MAChC,CAAA,CAAA,oBAAA,EAAA,EACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,KAAK,oBAAoB,GAAG,cAAc,GAAG,IAAI,CAAC,IAAI,EAAA,UAAA,EAC3D,GAAG,CAAC,IAAI,EAClB,OAAO,EAAE,IAAI,CAAC,WAAW,KAAK,KAAK,EACnC,OAAO,EAAE,MAAM,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,GAAG,CAAC,IAAI,CAAC,EACnD,SAAS,EAAC,UAAU,EAAA,CACA,CACvB,CAAC,CACE;;;;;;;;;;"}

package/dist/globuscomponents/gb-nav-bar-sidemenu.entry.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"gb-nav-bar-sidemenu.entry.esm.js","sources":["src/components/gb-nav-bar-sidemenu/gb-nav-bar-sidemenu.css?tag=gb-nav-bar-sidemenu&encapsulation=shadow","src/components/gb-nav-bar-sidemenu/gb-nav-bar-sidemenu.tsx"],"sourcesContent":[".nav_bar_wrapper {\r\n  display: flex;\r\n  width: 17.5rem;\r\n  height: 100%;\r\n  padding: var(--spacing-6) var(--spacing-7);\r\n  flex-direction: column;\r\n  justify-content: space-between;\r\n  align-items: flex-start;\r\n  border-right: 1px solid var(--color-border-subtler, #e3e8ef);\r\n  background: var(--color-surface, #ffffff);\r\n  box-sizing: border-box;\r\n}\r\n\r\n.vertical_tabs {\r\n  width: 100%;\r\n}\r\n\r\n.wrapper {\r\n  display: flex;\r\n  padding: var(--spacing-4) var(--spacing-5) var(--spacing-5) var(--spacing-5);\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  align-items: flex-start;\r\n  gap: var(--spacing-4);\r\n  align-self: stretch;\r\n  border-radius: var(--rounded-sm);\r\n  border: 1px solid var(--color-border-subtler, #e3e8ef);\r\n  background: var(--color-background-gray-subtlest, #f6f8fa);\r\n  position: relative;\r\n  height: auto;\r\n  overflow: hidden;\r\n}\r\n\r\n.wrapper_pattern {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  mix-blend-mode: multiply;\r\n}\r\n\r\n::slotted([slot='application_name']) {\r\n  color: var(--color-text-information-bold, #042f59) !important;\r\n}\r\n\r\n.application_icon path[stroke]{\r\n  stroke: var(--color-icon-information-bold, #042F59);\r\n}\r\n\r\n.application_icon path[fill]{\r\n  fill: var(--color-icon-information-bold, #042F59);\r\n}","import { Component, Element, Event, EventEmitter, Prop, State, getAssetPath, h } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'gb-nav-bar-sidemenu',\r\n  styleUrl: 'gb-nav-bar-sidemenu.css',\r\n  shadow: true,\r\n})\r\nexport class GbNavBarSidemenu {\r\n  @Prop() applicationName: string = '';\r\n  @Prop() applicationIcon: string = '';\r\n  @Prop() activeIndex: number = 0;\r\n  @Prop() tabs: { name: string; index: number }[] = [\r\n    // {\r\n    //   name: 'Accounts',\r\n    //   index: 0,\r\n    // },\r\n    // {\r\n    //   name: 'Transaction history lite',\r\n    //   index: 1,\r\n    // },\r\n    // {\r\n    //   name: 'TPP report',\r\n    //   index: 1,\r\n    // },\r\n    // {\r\n    //   name: 'Check dump history',\r\n    //   index: 1,\r\n    // },\r\n  ];\r\n  @State() leadingIconSvg: string = '';\r\n  @Element() el: HTMLElement;\r\n  @Event() navBarItemClicked: EventEmitter<void>;\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  onTabItemClicked(event) {\r\n    this.navBarItemClicked.emit(event.detail);\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.loadIcon(this.applicationIcon);\r\n  }\r\n\r\n  componentDidLoad() {\r\n    const applicationName = this.el.querySelector('[slot=\"application_name\"]');\r\n\r\n    if (applicationName) {\r\n      applicationName.classList.add('text-lg-bold');\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const patternSrc = getAssetPath(`assets/pattern_wrapper.svg`);\r\n\r\n    // return (\r\n    //   <div class=\"top_bar_sidemenu_div\">\r\n    //     <div class=\"vertical_tabs_div\">\r\n    //       <gb-vertical-tabs size=\"md\" tabs={this.tabs} type=\"button_primary\" active-index={this.activeIndex} onTabItemClicked={this.onTabItemClicked.bind(this)}></gb-vertical-tabs>\r\n    //     </div>\r\n    //     <div class=\"wrapper\">\r\n    //       <div class=\"wrapper_pattern\">\r\n    //         <img src={patternSrc} alt=\"\" />\r\n    //       </div>\r\n    //       <div class={`application_icon`} innerHTML={this.leadingIconSvg}></div>\r\n    //       <div class=\"application_name\">\r\n    //         <slot name=\"application_name\"></slot>\r\n    //       </div>\r\n    //     </div>\r\n    //   </div>\r\n    // );\r\n\r\n    return (\r\n      <div class=\"nav_bar_wrapper\">\r\n        <gb-vertical-tabs\r\n          class=\"vertical_tabs\"\r\n          size=\"sm\"\r\n          tabs={this.tabs}\r\n          type=\"button_primary\"\r\n          active-index={this.activeIndex}\r\n          onTabItemClicked={this.onTabItemClicked.bind(this)}\r\n        ></gb-vertical-tabs>\r\n        <div class=\"wrapper\">\r\n          <div class=\"wrapper_pattern\">\r\n            <img src={patternSrc} alt=\"\" />\r\n          </div>\r\n          <div class={`application_icon`} innerHTML={this.leadingIconSvg}></div>\r\n          <slot name=\"application_name\"></slot>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,mBAAmB,GAAG,ijCAAijC;;MCOhkC,gBAAgB,GAAA,MAAA;AAL7B,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAMU,QAAA,IAAe,CAAA,eAAA,GAAW,EAAE;AAC5B,QAAA,IAAe,CAAA,eAAA,GAAW,EAAE;AAC5B,QAAA,IAAW,CAAA,WAAA,GAAW,CAAC;QACvB,IAAA,CAAA,IAAI,GAAsC;;;;;;;;;;;;;;;;;SAiBjD;AACQ,QAAA,IAAc,CAAA,cAAA,GAAW,EAAE;AAmErC;IA/DC,MAAM,QAAQ,CAAC,QAAgB,EAAA;QAC7B,MAAM,QAAQ,GAAG,YAAY,CAAC,GAAG,QAAQ,CAAA,CAAE,CAAC;AAC5C,QAAA,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,QAAQ,CAAC;AACtC,QAAA,MAAM,GAAG,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE;AACjC,QAAA,IAAI,CAAC,cAAc,GAAG,GAAG;;AAG3B,IAAA,gBAAgB,CAAC,KAAK,EAAA;QACpB,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;;IAG3C,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,eAAe,CAAC;;IAGrC,gBAAgB,GAAA;QACd,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,2BAA2B,CAAC;QAE1E,IAAI,eAAe,EAAE;AACnB,YAAA,eAAe,CAAC,SAAS,CAAC,GAAG,CAAC,cAAc,CAAC;;;IAIjD,MAAM,GAAA;AACJ,QAAA,MAAM,UAAU,GAAG,YAAY,CAAC,CAAA,0BAAA,CAA4B,CAAC;;;;;;;;;;;;;;;;;AAmB7D,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,iBAAiB,EAAA,EAC1B,CAAA,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,eAAe,EACrB,IAAI,EAAC,IAAI,EACT,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAC,gBAAgB,EAAA,cAAA,EACP,IAAI,CAAC,WAAW,EAC9B,gBAAgB,EAAE,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,EAChC,CAAA,EACpB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EAClB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,EAC1B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,GAAG,EAAE,UAAU,EAAE,GAAG,EAAC,EAAE,GAAG,CAC3B,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAkB,gBAAA,CAAA,EAAE,SAAS,EAAE,IAAI,CAAC,cAAc,EAAQ,CAAA,EACtE,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,kBAAkB,GAAQ,CACjC,CACF;;;;;;;;"}

package/dist/globuscomponents/gb-vertical-tabs.entry.esm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"gb-vertical-tabs.entry.esm.js","sources":["src/components/gb-vertical-tabs/gb-vertical-tabs.css?tag=gb-vertical-tabs&encapsulation=shadow","src/components/gb-vertical-tabs/gb-vertical-tabs.tsx"],"sourcesContent":[".vertical_tab_div{\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: var(--spacing-1);\r\n    width: 100%;\r\n}","import { Component, Event, EventEmitter, Prop, State, Watch, h } from '@stencil/core';\r\nimport { GeneralSizes, TabTypes } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-vertical-tabs',\r\n  styleUrl: 'gb-vertical-tabs.css',\r\n  shadow: true,\r\n})\r\nexport class GbVerticalTabs {\r\n  @Prop() size: GeneralSizes;\r\n  @Prop() type: TabTypes;\r\n  @Prop({ mutable: true }) activeIndex: number = 0;\r\n  @Prop() tabs: { name: string; index: number }[] = [\r\n    // {\r\n    //   name: 'Hiiii',\r\n    //   index: 0,\r\n    // },\r\n    // {\r\n    //   name: 'There',\r\n    //   index: 1,\r\n    // },\r\n  ];\r\n  @State() internalTabs: { name: string; index: number }[] = [...this.tabs];\r\n  @Event() tabItemClicked: EventEmitter<{ index: number; label: string }>;\r\n\r\n  @Watch('tabs')\r\n  onTabsChanged(newTabs: { name: string; index: number }[]) {\r\n    this.internalTabs = newTabs;\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.internalTabs = this.tabs;\r\n  }\r\n\r\n  async handleTabClick(index: number, label: string) {\r\n    this.activeIndex = index;\r\n    this.tabItemClicked.emit({ index, label });\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class={`vertical_tab_div`}>\r\n        {this.internalTabs.map((tab, index) => (\r\n          <gb-tab-button-base\r\n            size={this.size}\r\n            type={this.type === 'button_gray_border' ? 'button_white' : this.type}\r\n            tab-name={tab.name}\r\n            current={this.activeIndex === index}\r\n            onClick={() => this.handleTabClick(index, tab.name)}\r\n            alignment=\"vertical\"\r\n          ></gb-tab-button-base>\r\n        ))}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"names":[],"mappings":";;AAAA,MAAM,iBAAiB,GAAG,uFAAuF;;MCQpG,cAAc,GAAA,MAAA;AAL3B,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAQ2B,QAAA,IAAW,CAAA,WAAA,GAAW,CAAC;QACxC,IAAA,CAAA,IAAI,GAAsC;;;;;;;;;SASjD;QACQ,IAAA,CAAA,YAAY,GAAsC,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;AAiC1E;AA7BC,IAAA,aAAa,CAAC,OAA0C,EAAA;AACtD,QAAA,IAAI,CAAC,YAAY,GAAG,OAAO;;IAG7B,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,IAAI;;AAG/B,IAAA,MAAM,cAAc,CAAC,KAAa,EAAE,KAAa,EAAA;AAC/C,QAAA,IAAI,CAAC,WAAW,GAAG,KAAK;QACxB,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC;;IAG5C,MAAM,GAAA;QACJ,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,CAAA,gBAAA,CAAkB,IAC3B,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,MAChC,CAAA,CAAA,oBAAA,EAAA,EACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,KAAK,oBAAoB,GAAG,cAAc,GAAG,IAAI,CAAC,IAAI,EAAA,UAAA,EAC3D,GAAG,CAAC,IAAI,EAClB,OAAO,EAAE,IAAI,CAAC,WAAW,KAAK,KAAK,EACnC,OAAO,EAAE,MAAM,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,GAAG,CAAC,IAAI,CAAC,EACnD,SAAS,EAAC,UAAU,EAAA,CACA,CACvB,CAAC,CACE;;;;;;;;;;"}

package/dist/globuscomponents/p-0d6377ae.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as s}from"./p-BwHeoi2W.js";const a=".vertical_tab_div{display:flex;flex-direction:column;gap:var(--spacing-1);width:100%}";const e=class{constructor(s){t(this,s);this.tabItemClicked=i(this,"tabItemClicked");this.activeIndex=0;this.tabs=[];this.internalTabs=[...this.tabs]}onTabsChanged(t){this.internalTabs=t}componentWillLoad(){this.internalTabs=this.tabs}async handleTabClick(t,i){this.activeIndex=t;this.tabItemClicked.emit({index:t,label:i})}render(){return s("div",{key:"4683768faaacb14cd18c3bf3fb6a1e0d109e76cf",class:`vertical_tab_div`},this.internalTabs.map(((t,i)=>s("gb-tab-button-base",{size:this.size,type:this.type==="button_gray_border"?"button_white":this.type,"tab-name":t.name,current:this.activeIndex===i,onClick:()=>this.handleTabClick(i,t.name),alignment:"vertical"}))))}static get watchers(){return{tabs:["onTabsChanged"]}}};e.style=a;export{e as gb_vertical_tabs};
-//# sourceMappingURL=p-0d6377ae.entry.js.map

package/dist/globuscomponents/p-0d6377ae.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["registerInstance","createEvent","h","gbVerticalTabsCss","GbVerticalTabs","constructor","hostRef","this","tabItemClicked","activeIndex","tabs","internalTabs","onTabsChanged","newTabs","componentWillLoad","handleTabClick","index","label","emit","render","key","class","map","tab","size","type","name","current","onClick","alignment","watchers","style"],"sources":["0"],"mappings":"YAAcA,OAAuBC,OAAaC,MAAS,kBAE3D,MAAMC,EAAoB,wFAE1B,MAAMC,EAAiB,MACnB,WAAAC,CAAYC,GACRN,EAAiBO,KAAMD,GACvBC,KAAKC,eAAiBP,EAAYM,KAAM,kBACxCA,KAAKE,YAAc,EACnBF,KAAKG,KAAO,GAUZH,KAAKI,aAAe,IAAIJ,KAAKG,KACjC,CACA,aAAAE,CAAcC,GACVN,KAAKI,aAAeE,CACxB,CACA,iBAAAC,GACIP,KAAKI,aAAeJ,KAAKG,IAC7B,CACA,oBAAMK,CAAeC,EAAOC,GACxBV,KAAKE,YAAcO,EACnBT,KAAKC,eAAeU,KAAK,CAAEF,QAAOC,SACtC,CACA,MAAAE,GACI,OAAQjB,EAAE,MAAO,CAAEkB,IAAK,2CAA4CC,MAAO,oBAAsBd,KAAKI,aAAaW,KAAI,CAACC,EAAKP,IAAWd,EAAE,qBAAsB,CAAEsB,KAAMjB,KAAKiB,KAAMC,KAAMlB,KAAKkB,OAAS,qBAAuB,eAAiBlB,KAAKkB,KAAM,WAAYF,EAAIG,KAAMC,QAASpB,KAAKE,cAAgBO,EAAOY,QAAS,IAAMrB,KAAKQ,eAAeC,EAAOO,EAAIG,MAAOG,UAAW,eACzX,CACA,mBAAWC,GAAa,MAAO,CAC3BpB,KAAQ,CAAC,iBACV,GAEPN,EAAe2B,MAAQ5B,SAEdC","ignoreList":[]}