globuswebcomponents 2.14.1 → 2.14.3

package/dist/components/{p-Cg6JI0Rl.js → p-Dg4_wWPZ.js}

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment } from './p-C9dqTMUJ.js';
 import { d as defineCustomElement$5 } from './p-BZK13bX8.js';
 import { d as defineCustomElement$4 } from './p-CQNbD8w1.js';
-import { d as defineCustomElement$3 } from './p-DFgUMHPG.js';
+import { d as defineCustomElement$3 } from './p-DUaQzOE2.js';
 import { d as defineCustomElement$2 } from './p-BGbrZd6N.js';
 import { d as defineCustomElement$1 } from './p-DU0nscLU.js';
 
@@ -169,6 +169,6 @@ function defineCustomElement() {
 defineCustomElement();
 
 export { GbFilterModal as G, defineCustomElement as d };
-//# sourceMappingURL=p-Cg6JI0Rl.js.map
+//# sourceMappingURL=p-Dg4_wWPZ.js.map
 
-//# sourceMappingURL=p-Cg6JI0Rl.js.map
+//# sourceMappingURL=p-Dg4_wWPZ.js.map

package/dist/components/{p-Cg6JI0Rl.js.map → p-Dg4_wWPZ.js.map}

@@ -1 +1 @@
-{"file":"p-Cg6JI0Rl.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-filter-modal/gb-filter-modal.css?tag=gb-filter-modal&encapsulation=shadow","src/components/gb-filter-modal/gb-filter-modal.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n.filter_modal_wrapper {\r\n  background-color: white;\r\n  width: 27.5rem;\r\n  height: 100vh;\r\n  display: flex;\r\n  flex-direction: column;\r\n  border-radius: var(--rounded-none);\r\n  background: var(--color-surface, #ffffff);\r\n  box-shadow: var(--shadow-sm);\r\n}\r\n\r\n.filter_modal_header {\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  align-items: flex-start;\r\n  align-self: stretch;\r\n  border-bottom: 1px solid var(--color-border-subtler, #e3e8ef);\r\n  position: relative;\r\n}\r\n\r\n.filter_modal_content {\r\n  display: flex;\r\n  padding: var(--spacing-5) var(--spacing-6) var(--spacing-5) var(--spacing-16);\r\n  align-items: flex-start;\r\n  gap: 1rem;\r\n  align-self: stretch;\r\n}\r\n\r\n.title {\r\n  color: var(--color-text-bold, #202939);\r\n}\r\n\r\n.close_button {\r\n  position: absolute;\r\n  left: 1rem;\r\n  bottom: 0.5rem;\r\n}\r\n\r\n.filter_content_container {\r\n  flex: 1 0 0;\r\n  justify-content: center;\r\n  align-items: flex-start;\r\n  gap: 0.5rem;\r\n  align-self: stretch;\r\n}\r\n\r\n.filter_content {\r\n  display: flex;\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n  padding: var(--spacing-4) 1.5rem;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  gap: var(--spacing-6);\r\n  flex: 1 0 0;\r\n}\r\n\r\n.label{\r\n  color: var(--color-text, #4B5565);\r\n}\r\n\r\n.date_range {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  gap: var(--spacing-2);\r\n  align-self: stretch;\r\n}\r\n\r\n.date_pickers {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  gap: var(--spacing-1);\r\n  align-self: stretch;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.field {\r\n  width: 100%;\r\n}\r\n\r\n.filter_modal_actions {\r\n  position: absolute;\r\n  bottom: 0;\r\n  width: 100%;\r\n  display: flex;\r\n  padding: var(--spacing-none) 0 0 0;\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  align-items: flex-start;\r\n  align-self: stretch;\r\n  border-top: 1px solid var(--color-border-subtler, #e3e8ef);\r\n}\r\n\r\n.modal_actions_content {\r\n  display: flex;\r\n  padding: var(--spacing-4) var(--spacing-6);\r\n  align-items: center;\r\n  gap: var(--spacing-5);\r\n  align-self: stretch;\r\n}\r\n\r\n.btn {\r\n  width: 100%;\r\n}\r\n","import { Component, Prop, State, Event, EventEmitter, h, Fragment } from '@stencil/core';\r\nimport { FilterConfig } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-filter-modal',\r\n  styleUrl: 'gb-filter-modal.css',\r\n  shadow: true,\r\n})\r\nexport class GbFilterModal {\r\n  @Prop() filterConfig?: FilterConfig;\r\n  @State() formValues: Record<string, any> = {};\r\n  @State() renderKey = 0;\r\n  @Event() applyFilters: EventEmitter<Record<string, any>>;\r\n  @Event() clearFilters: EventEmitter<void>;\r\n  @Event({ bubbles: true, composed: true }) close: EventEmitter<void>;\r\n\r\n  componentWillLoad() {\r\n    if (this.filterConfig) {\r\n      const applied = this.filterConfig.appliedValues || {};\r\n\r\n      this.formValues = {\r\n        ...(this.filterConfig.initialValues || {}),\r\n        ...applied, // applied values win over defaults\r\n      };\r\n    }\r\n\r\n    // console.log(this.formValues);\r\n  }\r\n\r\n  handleFieldChange(key: string, value: any) {\r\n    if (value instanceof CustomEvent) {\r\n      value = value.detail ?? null;\r\n    }\r\n\r\n    const field = this.filterConfig.fields.find(f => f.key === key);\r\n\r\n    if (field && field.tag === 'gb-input-dropdown') {\r\n      value = Array.isArray(value) ? value : value != null ? [value] : [];\r\n    }\r\n\r\n    if (value === null || value === undefined || value === '' || (Array.isArray(value) && value.length === 0)) {\r\n      const { [key]: _, ...rest } = this.formValues;\r\n      this.formValues = rest;\r\n      return;\r\n    }\r\n\r\n    this.formValues = {\r\n      ...this.formValues,\r\n      [key]: value,\r\n    };\r\n  }\r\n\r\n  handleClearClick() {\r\n    const resetValues = { ...(this.filterConfig.initialValues || {}) };\r\n\r\n    this.filterConfig.fields.forEach(field => {\r\n      if (field.tag === 'gb-date-picker') {\r\n        const keys = field.key as { start: string; end: string };\r\n        resetValues[keys.start] = null;\r\n        resetValues[keys.end] = null;\r\n      } else {\r\n        // use field.default if defined, otherwise check if the field expects an array\r\n        const isArrayField = field.props?.type === 'tags' || Array.isArray(field.default);\r\n        resetValues[field.key as string] = field.default ?? (isArrayField ? [] : null);\r\n      }\r\n    });\r\n\r\n    this.formValues = resetValues;\r\n    this.renderKey++;\r\n    this.clearFilters.emit();\r\n  }\r\n\r\n  handleApplyClick() {\r\n    const { pageNumber, pageSize, ...filters } = this.formValues;\r\n    // console.log({\r\n    //   filters,\r\n    //   pagination: {\r\n    //     pageNumber: pageNumber ?? 1,\r\n    //     pageSize: pageSize ?? 10,\r\n    //   },\r\n    // });\r\n\r\n    this.applyFilters.emit({\r\n      filters,\r\n      pagination: {\r\n        pageNumber: pageNumber ?? 1,\r\n        pageSize: pageSize ?? 10,\r\n      },\r\n    });\r\n  }\r\n\r\n  capitalize(str: string) {\r\n    return str.charAt(0).toUpperCase() + str.slice(1);\r\n  }\r\n\r\n  emitCloseEvent() {\r\n    this.close.emit();\r\n  }\r\n\r\n  render() {\r\n    if (!this.filterConfig) {\r\n      return (\r\n        <div class=\"filter_modal_wrapper\">\r\n          <div class=\"filter_modal_header\">\r\n            <div class=\"filter_modal_content\">\r\n              <gb-button-close size=\"sm\" color=\"gray\" class=\"close_button\" onClick={() => this.emitCloseEvent()}></gb-button-close>\r\n              <p class=\"title display-xs-semi-bold\">Filter</p>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      );\r\n    }\r\n    \r\n    return (\r\n      <div class=\"filter_modal_wrapper\">\r\n        <div class=\"filter_modal_header\">\r\n          <div class=\"filter_modal_content\">\r\n            <gb-button-close size=\"sm\" color=\"gray\" class=\"close_button\" onClick={() => this.emitCloseEvent()}></gb-button-close>\r\n            <p class=\"title display-xs-semi-bold\">{this.filterConfig ? this.filterConfig.title : 'Filter'}</p>\r\n          </div>\r\n        </div>\r\n        <div class=\"filter_content_container\">\r\n          <div class=\"filter_content\" key={this.renderKey}>\r\n            {/* {this.filterConfig.enableDateRange && (\r\n              <div class=\"date_range\">\r\n                <p class=\"label text-sm-medium\">{this.filterConfig.dateRangeLabel || 'Period'}</p>\r\n                <div class=\"date_pickers\">\r\n                  <gb-date-picker\r\n                    placeholder=\"dd-mm-yy\"\r\n                    full-width=\"true\"\r\n                    twentyfour-hr=\"true\"\r\n                    mode=\"single\"\r\n                    format=\"d-m-y\"\r\n                    show-months=\"1\"\r\n                    onDateChange={e => this.handleFieldChange('startDate', e)}\r\n                  ></gb-date-picker>\r\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n                    <path d=\"M2.5 12L21.5002 12\" stroke=\"var(--color-icon-subtle ,#697586)\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                  </svg>\r\n                  <gb-date-picker\r\n                    placeholder=\"dd-mm-yy\"\r\n                    full-width=\"true\"\r\n                    twentyfour-hr=\"true\"\r\n                    mode=\"single\"\r\n                    format=\"d-m-y\"\r\n                    show-months=\"1\"\r\n                    dropdown-alignment=\"right\"\r\n                    onDateChange={e => this.handleFieldChange('endDate', e)}\r\n                  ></gb-date-picker>\r\n                </div>\r\n              </div>\r\n            )} */}\r\n            {this.filterConfig.fields && (\r\n              <>\r\n                {this.filterConfig.fields.map(field => {\r\n                  if (field.tag === 'gb-date-picker') {\r\n                    const keys = field.key as { start: string; end: string };\r\n\r\n                    return (\r\n                      <div class=\"date_range\">\r\n                        <p class=\"label text-sm-medium\">{field.label}</p>\r\n                        <div class=\"date_pickers\">\r\n                          <gb-date-picker\r\n                            placeholder=\"dd-mm-yy\"\r\n                            full-width=\"true\"\r\n                            mode=\"single\"\r\n                            format=\"d-m-y\"\r\n                            show-months=\"1\"\r\n                            value={this.formValues[keys.start]}\r\n                            onDateChange={e => this.handleFieldChange(keys.start, e)}\r\n                          ></gb-date-picker>\r\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n                            <path d=\"M2.5 12L21.5002 12\" stroke=\"var(--color-icon-subtle, #697586)\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                          </svg>\r\n                          <gb-date-picker\r\n                            placeholder=\"dd-mm-yy\"\r\n                            full-width=\"true\"\r\n                            mode=\"single\"\r\n                            format=\"d-m-y\"\r\n                            show-months=\"1\"\r\n                            dropdown-alignment=\"right\"\r\n                            value={this.formValues[keys.end]}\r\n                            onDateChange={e => this.handleFieldChange(keys.end, e)}\r\n                          ></gb-date-picker>\r\n                        </div>\r\n                      </div>\r\n                    );\r\n                  }\r\n\r\n                  const Tag = field.tag;\r\n                  const key = field.key as string;\r\n                  const currentValue = this.formValues[key];\r\n                  const valueProp =\r\n                    currentValue != null\r\n                      ? field.tag === 'gb-slider'\r\n                        ? { leftControl: currentValue.left, rightControl: currentValue.right }\r\n                        : field.tag === 'gb-input-dropdown'\r\n                          ? { value: Array.isArray(currentValue) ? currentValue : [currentValue] } // ← coerce here\r\n                          : { value: currentValue }\r\n                      : {};\r\n\r\n                  const eventHandler = {\r\n                    [`on${this.capitalize(field.event as string)}`]: (e: CustomEvent) => this.handleFieldChange(key, e.detail),\r\n                  };\r\n\r\n                  return (\r\n                    <div class=\"field\">\r\n                      <Tag {...field.props} {...valueProp} {...eventHandler} />\r\n                    </div>\r\n                  );\r\n                })}\r\n              </>\r\n            )}\r\n          </div>\r\n        </div>\r\n        <div class=\"filter_modal_actions\">\r\n          <div class=\"modal_actions_content\">\r\n            <div class=\"btn\">\r\n              <gb-button size=\"xl\" hierarchy=\"secondary_gray\" icon=\"default\" onClick={() => this.handleClearClick()}>\r\n                <p>Clear filter</p>\r\n              </gb-button>\r\n            </div>\r\n            <div class=\"btn\">\r\n              <gb-button size=\"xl\" hierarchy=\"primary\" icon=\"default\" onClick={() => this.handleApplyClick()}>\r\n                <p>Apply</p>\r\n              </gb-button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"version":3}
+{"file":"p-Dg4_wWPZ.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-filter-modal/gb-filter-modal.css?tag=gb-filter-modal&encapsulation=shadow","src/components/gb-filter-modal/gb-filter-modal.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n.filter_modal_wrapper {\r\n  background-color: white;\r\n  width: 27.5rem;\r\n  height: 100vh;\r\n  display: flex;\r\n  flex-direction: column;\r\n  border-radius: var(--rounded-none);\r\n  background: var(--color-surface, #ffffff);\r\n  box-shadow: var(--shadow-sm);\r\n}\r\n\r\n.filter_modal_header {\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  align-items: flex-start;\r\n  align-self: stretch;\r\n  border-bottom: 1px solid var(--color-border-subtler, #e3e8ef);\r\n  position: relative;\r\n}\r\n\r\n.filter_modal_content {\r\n  display: flex;\r\n  padding: var(--spacing-5) var(--spacing-6) var(--spacing-5) var(--spacing-16);\r\n  align-items: flex-start;\r\n  gap: 1rem;\r\n  align-self: stretch;\r\n}\r\n\r\n.title {\r\n  color: var(--color-text-bold, #202939);\r\n}\r\n\r\n.close_button {\r\n  position: absolute;\r\n  left: 1rem;\r\n  bottom: 0.5rem;\r\n}\r\n\r\n.filter_content_container {\r\n  flex: 1 0 0;\r\n  justify-content: center;\r\n  align-items: flex-start;\r\n  gap: 0.5rem;\r\n  align-self: stretch;\r\n}\r\n\r\n.filter_content {\r\n  display: flex;\r\n  width: 100%;\r\n  box-sizing: border-box;\r\n  padding: var(--spacing-4) 1.5rem;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  gap: var(--spacing-6);\r\n  flex: 1 0 0;\r\n}\r\n\r\n.label{\r\n  color: var(--color-text, #4B5565);\r\n}\r\n\r\n.date_range {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  gap: var(--spacing-2);\r\n  align-self: stretch;\r\n}\r\n\r\n.date_pickers {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  gap: var(--spacing-1);\r\n  align-self: stretch;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.field {\r\n  width: 100%;\r\n}\r\n\r\n.filter_modal_actions {\r\n  position: absolute;\r\n  bottom: 0;\r\n  width: 100%;\r\n  display: flex;\r\n  padding: var(--spacing-none) 0 0 0;\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  align-items: flex-start;\r\n  align-self: stretch;\r\n  border-top: 1px solid var(--color-border-subtler, #e3e8ef);\r\n}\r\n\r\n.modal_actions_content {\r\n  display: flex;\r\n  padding: var(--spacing-4) var(--spacing-6);\r\n  align-items: center;\r\n  gap: var(--spacing-5);\r\n  align-self: stretch;\r\n}\r\n\r\n.btn {\r\n  width: 100%;\r\n}\r\n","import { Component, Prop, State, Event, EventEmitter, h, Fragment } from '@stencil/core';\r\nimport { FilterConfig } from '../../models/reusableModels';\r\n\r\n@Component({\r\n  tag: 'gb-filter-modal',\r\n  styleUrl: 'gb-filter-modal.css',\r\n  shadow: true,\r\n})\r\nexport class GbFilterModal {\r\n  @Prop() filterConfig?: FilterConfig;\r\n  @State() formValues: Record<string, any> = {};\r\n  @State() renderKey = 0;\r\n  @Event() applyFilters: EventEmitter<Record<string, any>>;\r\n  @Event() clearFilters: EventEmitter<void>;\r\n  @Event({ bubbles: true, composed: true }) close: EventEmitter<void>;\r\n\r\n  componentWillLoad() {\r\n    if (this.filterConfig) {\r\n      const applied = this.filterConfig.appliedValues || {};\r\n\r\n      this.formValues = {\r\n        ...(this.filterConfig.initialValues || {}),\r\n        ...applied, // applied values win over defaults\r\n      };\r\n    }\r\n\r\n    // console.log(this.formValues);\r\n  }\r\n\r\n  handleFieldChange(key: string, value: any) {\r\n    if (value instanceof CustomEvent) {\r\n      value = value.detail ?? null;\r\n    }\r\n\r\n    const field = this.filterConfig.fields.find(f => f.key === key);\r\n\r\n    if (field && field.tag === 'gb-input-dropdown') {\r\n      value = Array.isArray(value) ? value : value != null ? [value] : [];\r\n    }\r\n\r\n    if (value === null || value === undefined || value === '' || (Array.isArray(value) && value.length === 0)) {\r\n      const { [key]: _, ...rest } = this.formValues;\r\n      this.formValues = rest;\r\n      return;\r\n    }\r\n\r\n    this.formValues = {\r\n      ...this.formValues,\r\n      [key]: value,\r\n    };\r\n  }\r\n\r\n  handleClearClick() {\r\n    const resetValues = { ...(this.filterConfig.initialValues || {}) };\r\n\r\n    this.filterConfig.fields.forEach(field => {\r\n      if (field.tag === 'gb-date-picker') {\r\n        const keys = field.key as { start: string; end: string };\r\n        resetValues[keys.start] = null;\r\n        resetValues[keys.end] = null;\r\n      } else {\r\n        // use field.default if defined, otherwise check if the field expects an array\r\n        const isArrayField = field.props?.type === 'tags' || Array.isArray(field.default);\r\n        resetValues[field.key as string] = field.default ?? (isArrayField ? [] : null);\r\n      }\r\n    });\r\n\r\n    this.formValues = resetValues;\r\n    this.renderKey++;\r\n    this.clearFilters.emit();\r\n  }\r\n\r\n  handleApplyClick() {\r\n    const { pageNumber, pageSize, ...filters } = this.formValues;\r\n    // console.log({\r\n    //   filters,\r\n    //   pagination: {\r\n    //     pageNumber: pageNumber ?? 1,\r\n    //     pageSize: pageSize ?? 10,\r\n    //   },\r\n    // });\r\n\r\n    this.applyFilters.emit({\r\n      filters,\r\n      pagination: {\r\n        pageNumber: pageNumber ?? 1,\r\n        pageSize: pageSize ?? 10,\r\n      },\r\n    });\r\n  }\r\n\r\n  capitalize(str: string) {\r\n    return str.charAt(0).toUpperCase() + str.slice(1);\r\n  }\r\n\r\n  emitCloseEvent() {\r\n    this.close.emit();\r\n  }\r\n\r\n  render() {\r\n    if (!this.filterConfig) {\r\n      return (\r\n        <div class=\"filter_modal_wrapper\">\r\n          <div class=\"filter_modal_header\">\r\n            <div class=\"filter_modal_content\">\r\n              <gb-button-close size=\"sm\" color=\"gray\" class=\"close_button\" onClick={() => this.emitCloseEvent()}></gb-button-close>\r\n              <p class=\"title display-xs-semi-bold\">Filter</p>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      );\r\n    }\r\n    \r\n    return (\r\n      <div class=\"filter_modal_wrapper\">\r\n        <div class=\"filter_modal_header\">\r\n          <div class=\"filter_modal_content\">\r\n            <gb-button-close size=\"sm\" color=\"gray\" class=\"close_button\" onClick={() => this.emitCloseEvent()}></gb-button-close>\r\n            <p class=\"title display-xs-semi-bold\">{this.filterConfig ? this.filterConfig.title : 'Filter'}</p>\r\n          </div>\r\n        </div>\r\n        <div class=\"filter_content_container\">\r\n          <div class=\"filter_content\" key={this.renderKey}>\r\n            {/* {this.filterConfig.enableDateRange && (\r\n              <div class=\"date_range\">\r\n                <p class=\"label text-sm-medium\">{this.filterConfig.dateRangeLabel || 'Period'}</p>\r\n                <div class=\"date_pickers\">\r\n                  <gb-date-picker\r\n                    placeholder=\"dd-mm-yy\"\r\n                    full-width=\"true\"\r\n                    twentyfour-hr=\"true\"\r\n                    mode=\"single\"\r\n                    format=\"d-m-y\"\r\n                    show-months=\"1\"\r\n                    onDateChange={e => this.handleFieldChange('startDate', e)}\r\n                  ></gb-date-picker>\r\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n                    <path d=\"M2.5 12L21.5002 12\" stroke=\"var(--color-icon-subtle ,#697586)\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                  </svg>\r\n                  <gb-date-picker\r\n                    placeholder=\"dd-mm-yy\"\r\n                    full-width=\"true\"\r\n                    twentyfour-hr=\"true\"\r\n                    mode=\"single\"\r\n                    format=\"d-m-y\"\r\n                    show-months=\"1\"\r\n                    dropdown-alignment=\"right\"\r\n                    onDateChange={e => this.handleFieldChange('endDate', e)}\r\n                  ></gb-date-picker>\r\n                </div>\r\n              </div>\r\n            )} */}\r\n            {this.filterConfig.fields && (\r\n              <>\r\n                {this.filterConfig.fields.map(field => {\r\n                  if (field.tag === 'gb-date-picker') {\r\n                    const keys = field.key as { start: string; end: string };\r\n\r\n                    return (\r\n                      <div class=\"date_range\">\r\n                        <p class=\"label text-sm-medium\">{field.label}</p>\r\n                        <div class=\"date_pickers\">\r\n                          <gb-date-picker\r\n                            placeholder=\"dd-mm-yy\"\r\n                            full-width=\"true\"\r\n                            mode=\"single\"\r\n                            format=\"d-m-y\"\r\n                            show-months=\"1\"\r\n                            value={this.formValues[keys.start]}\r\n                            onDateChange={e => this.handleFieldChange(keys.start, e)}\r\n                          ></gb-date-picker>\r\n                          <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n                            <path d=\"M2.5 12L21.5002 12\" stroke=\"var(--color-icon-subtle, #697586)\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                          </svg>\r\n                          <gb-date-picker\r\n                            placeholder=\"dd-mm-yy\"\r\n                            full-width=\"true\"\r\n                            mode=\"single\"\r\n                            format=\"d-m-y\"\r\n                            show-months=\"1\"\r\n                            dropdown-alignment=\"right\"\r\n                            value={this.formValues[keys.end]}\r\n                            onDateChange={e => this.handleFieldChange(keys.end, e)}\r\n                          ></gb-date-picker>\r\n                        </div>\r\n                      </div>\r\n                    );\r\n                  }\r\n\r\n                  const Tag = field.tag;\r\n                  const key = field.key as string;\r\n                  const currentValue = this.formValues[key];\r\n                  const valueProp =\r\n                    currentValue != null\r\n                      ? field.tag === 'gb-slider'\r\n                        ? { leftControl: currentValue.left, rightControl: currentValue.right }\r\n                        : field.tag === 'gb-input-dropdown'\r\n                          ? { value: Array.isArray(currentValue) ? currentValue : [currentValue] } // ← coerce here\r\n                          : { value: currentValue }\r\n                      : {};\r\n\r\n                  const eventHandler = {\r\n                    [`on${this.capitalize(field.event as string)}`]: (e: CustomEvent) => this.handleFieldChange(key, e.detail),\r\n                  };\r\n\r\n                  return (\r\n                    <div class=\"field\">\r\n                      <Tag {...field.props} {...valueProp} {...eventHandler} />\r\n                    </div>\r\n                  );\r\n                })}\r\n              </>\r\n            )}\r\n          </div>\r\n        </div>\r\n        <div class=\"filter_modal_actions\">\r\n          <div class=\"modal_actions_content\">\r\n            <div class=\"btn\">\r\n              <gb-button size=\"xl\" hierarchy=\"secondary_gray\" icon=\"default\" onClick={() => this.handleClearClick()}>\r\n                <p>Clear filter</p>\r\n              </gb-button>\r\n            </div>\r\n            <div class=\"btn\">\r\n              <gb-button size=\"xl\" hierarchy=\"primary\" icon=\"default\" onClick={() => this.handleApplyClick()}>\r\n                <p>Apply</p>\r\n              </gb-button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"],"version":3}

package/dist/components/{p-D56vtcwn.js → p-ie7-QxuX.js}

@@ -1,5 +1,4 @@
 import { p as proxyCustomElement, H, c as createEvent, g as getAssetPath, h, F as Fragment } from './p-C9dqTMUJ.js';
-import { g as getIconPath } from './p-BxJPybuU.js';
 import { d as defineCustomElement$6 } from './p-CU3ZI38Z.js';
 import { d as defineCustomElement$5 } from './p-gltZ7LwG.js';
 import { d as defineCustomElement$4 } from './p-zeV1rDFJ.js';
@@ -29,7 +28,7 @@ const GbSimpleSideBarItem = /*@__PURE__*/ proxyCustomElement(class GbSimpleSideB
         this.internalIcon = '';
     }
     async loadIcon(iconName) {
-        const iconPath = getAssetPath(getIconPath(iconName, 'duotone', 'rounded'));
+        const iconPath = getAssetPath(iconName);
         const response = await fetch(iconPath);
         const svg = await response.text();
         const parser = new DOMParser();
@@ -82,11 +81,11 @@ const GbSimpleSideBarItem = /*@__PURE__*/ proxyCustomElement(class GbSimpleSideB
         this.sideBarItemClicked.emit();
     }
     render() {
-        return (h("div", { key: 'c2da3aa24ec37f7b4c6f2377cb94dd65b613b4d5', class: `side_bar_item_container`, onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, h("div", { key: '5c641e821451a60064bcee6122a2aeda04dde04d', class: `nav_item_base ${this.state} ${this.type} ${this.category}` }, this.state === 'active' && h("div", { key: '3400c3f3be900b795a8f308bd2bb07b09ee888ca', class: `bar ${this.category}` }), h("div", { key: '3635ffd2c1330640d8bb2748552ee6cdefa4dbf4', class: "content" }, this.icon && h("div", { key: 'a8b2bc011c4e36d98623f05afe33119291ac37fd', class: `icon ${this.state} ${this.category}`, innerHTML: this.leadingIconSvg }), this.type === 'full_with_label' && (h("p", { key: 'af9643d602d3949720dc0487839addcedf9f7ab9', class: `label_text ${this.category} ${this.state} ${this.state === 'active' ? 'text-md-semi-bold' : 'text-md-medium'}` }, this.label))), this.type === 'full_with_label' && (h(Fragment, null, this.showBadge && (h("gb-badge", { key: '847f1c181afea9cf739e3f873e4d7a4bec655c53', size: "sm", type: "pill_outline", color: this.state === 'active' ? 'information' : 'gray' }, h("p", { key: '8a16e30a197b0f7bfc0f0e7bf4ea5463e82520fc' }, "10"))), this.showSecondaryIcon && (h(Fragment, null, this.subMenu ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", class: `arrow_icon ${this.state}` }, h("path", { d: "M6.00003 4C6.00003 4 9.99999 6.94596 10 8.00003C10 9.05411 6 12 6 12", stroke: this.category === 'plain_background' && this.state === 'active'
+        return (h("div", { key: '6bd98598fcebacb5a4a1335a1f7561b7412dfcf1', class: `side_bar_item_container`, onMouseEnter: () => (this.showTooltip = true), onMouseLeave: () => (this.showTooltip = false) }, h("div", { key: '800baa4c53a92ffaff1870a2915db0d7125d62fa', class: `nav_item_base ${this.state} ${this.type} ${this.category}` }, this.state === 'active' && h("div", { key: '8e810398c33e97ba1541d347e9aa1f344c89cd4d', class: `bar ${this.category}` }), h("div", { key: '93bed5e20dc7662916c383ad9f25363c00f91555', class: "content" }, this.icon && h("div", { key: 'f1f8ec46f01a5b6f2c3e98d32ba63145c31bf248', class: `icon ${this.state} ${this.category}`, innerHTML: this.leadingIconSvg }), this.type === 'full_with_label' && (h("p", { key: '9656caeed1f68c47967cf2aa5ec69807c3303738', class: `label_text ${this.category} ${this.state} ${this.state === 'active' ? 'text-md-semi-bold' : 'text-md-medium'}` }, this.label))), this.type === 'full_with_label' && (h(Fragment, null, this.showBadge && (h("gb-badge", { key: '6c3330f13b9be4820c9af9efa4d9c6afd738919e', size: "sm", type: "pill_outline", color: this.state === 'active' ? 'information' : 'gray' }, h("p", { key: '60e889361662c24380d202ffcef85e1b08937989' }, "10"))), this.showSecondaryIcon && (h(Fragment, null, this.subMenu ? (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", class: `arrow_icon ${this.state}` }, h("path", { d: "M6.00003 4C6.00003 4 9.99999 6.94596 10 8.00003C10 9.05411 6 12 6 12", stroke: this.category === 'plain_background' && this.state === 'active'
                 ? 'var(--color-icon-information-bold, #042F59)'
                 : this.category === 'colored_background' && this.state === 'active'
                     ? 'var(--base-white, #ffffff)'
-                    : 'var(--color-icon, #4B5565)', "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))) : (h("div", { class: `secondary_icon ${this.state} ${this.category}`, innerHTML: this.secondaryIconSvg }))))))), this.type === 'icon_only' && this.showTooltip && (h("gb-tooltip", { key: '13de39057ceb936a55e587af7622ff422f51fc69', "show-arrow": true, arrow: "left", class: "tooltip" }, h("p", { key: '647da44941b91dbd1b9ecd77b5d55355b4a92172', slot: "label" }, this.label)))));
+                    : 'var(--color-icon, #4B5565)', "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))) : (h("div", { class: `secondary_icon ${this.state} ${this.category}`, innerHTML: this.secondaryIconSvg }))))))), this.type === 'icon_only' && this.showTooltip && (h("gb-tooltip", { key: '066115790701ae990071c4d5008a5f838691ba74', "show-arrow": true, arrow: "left", class: "tooltip" }, h("p", { key: 'b0c85cc3c51022d328aaf9bbb4309328a7a98157', slot: "label" }, this.label)))));
     }
     get el() { return this; }
     static get watchers() { return {
@@ -156,6 +155,6 @@ function defineCustomElement() {
 defineCustomElement();
 
 export { GbSimpleSideBarItem as G, defineCustomElement as d };
-//# sourceMappingURL=p-D56vtcwn.js.map
+//# sourceMappingURL=p-ie7-QxuX.js.map
 
-//# sourceMappingURL=p-D56vtcwn.js.map
+//# sourceMappingURL=p-ie7-QxuX.js.map

package/dist/components/p-ie7-QxuX.js.map

@@ -0,0 +1 @@
+{"file":"p-ie7-QxuX.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-simple-side-bar-item/gb-simple-side-bar-item.css?tag=gb-simple-side-bar-item&encapsulation=shadow","src/components/gb-simple-side-bar-item/gb-simple-side-bar-item.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n:host {\r\n  position: relative;\r\n}\r\n\r\n.side_bar_item_container {\r\n  padding: 0 var(--spacing-4);\r\n}\r\n\r\n.nav_item_base.icon_only {\r\n  width: fit-content;\r\n}\r\n\r\n.nav_item_base {\r\n  display: flex;\r\n  padding: var(--spacing-2) var(--spacing-3);\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  gap: 0.5rem;\r\n  align-self: stretch;\r\n  border-radius: var(--rounded-sm);\r\n  cursor: pointer;\r\n  position: relative;\r\n  flex-grow: 1;\r\n}\r\n\r\n.content {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 0.75rem;\r\n  flex-grow: 1;\r\n  max-width: 100%;\r\n}\r\n\r\n.bar {\r\n  position: absolute;\r\n  left: 0rem;\r\n  width: 0.25rem;\r\n  height: 1.25rem;\r\n}\r\n\r\n.bar.plain_background {\r\n  border-radius: var(--rounded-full);\r\n  background: var(--color-border-brandRed, #E21B2E);\r\n}\r\n\r\n.bar.colored_background {\r\n  border-radius: var(--rounded-full);\r\n  background: var(--base-white, #FFFFFF);\r\n}\r\n\r\n.icon svg {\r\n  display: flex;\r\n  align-items: center;\r\n  width: 1.5rem;\r\n  height: 1.5rem;\r\n}\r\n\r\n.secondary_icon svg{\r\n  display: flex;\r\n  align-items: center;\r\n  width: 1rem;\r\n  height: 1rem;\r\n}\r\n\r\n.label_text {\r\n  max-width: 100%;\r\n  overflow-x: hidden;\r\n  overflow-y: none;\r\n  white-space: nowrap;\r\n  text-overflow: ellipsis;\r\n  scrollbar-width: none;\r\n}\r\n\r\n.label_text::-webkit-scrollbar {\r\n  display: none;\r\n}\r\n\r\n/* State and Category Styles */\r\n.nav_item_base.plain_background.default,\r\n.nav_item_base.colored_background.default {\r\n  background: transparent;\r\n}\r\n\r\n.nav_item_base.plain_background.active {\r\n  background: var(--color-background-information-subtler, #c8e0f9);\r\n}\r\n\r\n.nav_item_base.default.plain_background:hover {\r\n  background: var(--color-background-gray-subtler, #eef2f6);\r\n}\r\n\r\n.nav_item_base.colored_background.active {\r\n  background: var(--blue-800, #042f59);\r\n}\r\n\r\n.nav_item_base.default.colored_background:hover {\r\n  background: rgba(33, 44, 101, 0.4);\r\n}\r\n\r\n.label_text.plain_background.default {\r\n  color: var(--color-text, #4b5565);\r\n}\r\n\r\n.label_text.plain_background.active {\r\n  color: var(--color-text-information-bold, #042f59);\r\n}\r\n\r\n.label_text.colored_background {\r\n  color: var(--base-white, #ffffff);\r\n}\r\n\r\n/* Icon Color Styles */\r\n.icon.plain_background.default path[stroke] {\r\n  stroke: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.plain_background.default path[fill] {\r\n  fill: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.plain_background.active path[stroke] {\r\n  stroke: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.active path[fill] {\r\n  fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.default path#Icon[stroke] {\r\n  stroke: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.plain_background.default path#Icon[fill] {\r\n  fill: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.plain_background.active path#Icon[stroke] {\r\n  stroke: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.active path#Icon[fill] {\r\n  fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.active path#Accent[stroke] {\r\n  stroke: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.active path#Accent[fill] {\r\n  fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.plain_background.default circle[stroke] {\r\n  stroke: var(--color-icon, #4b5565);\r\n}\r\n\r\n.icon.plain_background.active circle[fill] {\r\n  fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.icon.colored_background.default path[stroke] {\r\n  stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.default path[fill] {\r\n  fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.active path[stroke] {\r\n  stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.active path[fill] {\r\n  fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background path#Icon[stroke] {\r\n  stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background path#Icon[fill] {\r\n  fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.active path#Accent[stroke] {\r\n  stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.active path#Accent[fill] {\r\n  fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background circle[stroke] {\r\n  stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background circle[fill] {\r\n  fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.active circle[stroke] {\r\n  stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.icon.colored_background.active circle[fill] {\r\n  fill: var(--base-white, #ffffff);\r\n}\r\n\r\n/* .icon.plain_background.default path[fill],\r\n.icon.colored_background.default path[fill],\r\n.icon.plain_background.default circle[fill],\r\n.icon.colored_background.default circle[fill] {\r\n  fill: transparent;\r\n} */\r\n\r\n.icon.plain_background.default path.has_opacity,\r\n.icon.plain_background.default g.has_opacity,\r\n.icon.plain_background.default circle.has_opacity,\r\n.icon.colored_background.default path.has_opacity,\r\n.icon.colored_background.default g.has_opacity,\r\n.icon.colored_background.default circle.has_opacity {\r\n  opacity: 0;\r\n} \r\n\r\n.icon.plain_background.active path.has_opacity,\r\n.icon.plain_background.active g.has_opacity,\r\n.icon.plain_background.active circle.has_opacity,\r\n.icon.colored_background.active path.has_opacity,\r\n.icon.colored_background.active g.has_opacity,\r\n.icon.colored_background.active circle.has_opacity {\r\n  opacity: 0.5;\r\n}\r\n\r\n/* .icon.plain_background.default path[fill].has_opacity,\r\n.icon.plain_background.default g.has_opacity,\r\n.icon.colored_background.default path[fill].has_opacity,\r\n.icon.colored_background.default g.has_opacity{\r\n  fill: transparent;\r\n} */\r\n\r\n.secondary_icon.plain_background.default path[stroke] {\r\n  stroke: var(--color-icon, #4b5565);\r\n}\r\n\r\n.secondary_icon.plain_background.default path[fill] {\r\n  fill: var(--color-icon, #4b5565);\r\n}\r\n\r\n.secondary_icon.plain_background.active path[stroke] {\r\n  stroke: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.secondary_icon.plain_background.active path[fill] {\r\n  fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.secondary_icon.plain_background.default path#Icon[stroke] {\r\n  stroke: var(--color-icon, #4b5565);\r\n}\r\n\r\n.secondary_icon.plain_background.default path#Icon[fill] {\r\n  fill: var(--color-icon, #4b5565);\r\n}\r\n\r\n.secondary_icon.plain_background.active path#Icon[stroke] {\r\n  stroke: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.secondary_icon.plain_background.active path#Icon[fill] {\r\n  fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.secondary_icon.plain_background.active path#Accent[stroke] {\r\n  stroke: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.secondary_icon.plain_background.active path#Accent[fill] {\r\n  fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.secondary_icon.plain_background.default circle[stroke] {\r\n  stroke: var(--color-icon, #4b5565);\r\n}\r\n  \r\n.secondary_icon.plain_background.active circle[fill] {\r\n  fill: var(--color-icon-information-bold, #042f59);\r\n}\r\n\r\n.secondary_icon.colored_background.default path[stroke] {\r\n  stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.secondary_icon.colored_background.default path[fill] {\r\n  fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.secondary_icon.colored_background.active path[stroke] {\r\n  stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.secondary_icon.colored_background.active path[fill] {\r\n  fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.secondary_icon.colored_background path#Icon[stroke] {\r\n  stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.secondary_icon.colored_background path#Icon[fill] {\r\n  fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.secondary_icon.colored_background.active path#Accent[stroke] {\r\n  stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.secondary_icon.colored_background.active path#Accent[fill] {\r\n  fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.secondary_icon.colored_background circle[stroke] {\r\n  stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.secondary_icon.colored_background circle[fill] {\r\n  fill: var(--base-white, #ffffff);\r\n}\r\n\r\n.secondary_icon.colored_background.active circle[stroke] {\r\n  stroke: var(--base-white, #ffffff);\r\n}\r\n\r\n.secondary_icon.colored_background.active circle[fill] {\r\n  fill: var(--base-white, #ffffff);\r\n}\r\n\r\n/* Arrow Color Styles */\r\n.arrow_icon.active{\r\n  transform: rotate(90deg);\r\n}\r\n\r\n.tooltip {\r\n  position: absolute;\r\n  top: 0.2rem;\r\n  left: 4.3rem;\r\n}\r\n","import { Component, h, Prop, Fragment, getAssetPath, State, Event, EventEmitter, Element, Watch } from \"@stencil/core\";\r\nimport { GeneralBackgroundCategories } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n  tag: 'gb-simple-side-bar-item',\r\n  styleUrl: 'gb-simple-side-bar-item.css',\r\n  shadow: true,\r\n})\r\nexport class GbSimpleSideBarItem {\r\n  @Prop() state: 'default' | 'active';\r\n  @Prop() type: 'full_with_label' | 'icon_only';\r\n  @Prop() label: string = '';\r\n  @Prop() icon: string = '';\r\n  @Prop() secondaryIcon: string = '';\r\n  @Prop() category: GeneralBackgroundCategories;\r\n  @Prop() showSecondaryIcon: boolean = false;\r\n  @Prop() showBadge: boolean = false;\r\n  @Prop({ mutable: true }) showTooltip: boolean = false;\r\n  @Prop() subMenu: boolean = false;\r\n  @State() leadingIconSvg: string = '';\r\n  @State() secondaryIconSvg: string = '';\r\n  @State() internalIcon: string = '';\r\n  @Event() sideBarItemClicked: EventEmitter<void>;\r\n  @Element() el: HTMLElement;\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\r\n    const parser = new DOMParser();\r\n    const svgDoc = parser.parseFromString(svg, 'image/svg+xml');\r\n    const svgElement = svgDoc.documentElement;\r\n\r\n    // Add `has-opacity` class to all elements that have an opacity attribute\r\n    const elementsWithOpacity = svgElement.querySelectorAll('[opacity]');\r\n    elementsWithOpacity.forEach(el => {\r\n      el.classList.add('has_opacity');\r\n    });\r\n\r\n    const gWithOpacity = svgElement.querySelectorAll('g[opacity]');\r\n\r\n    gWithOpacity.forEach(g => {\r\n      g.classList.add('has_opacity');\r\n    });\r\n\r\n    // Serialize and store\r\n    const modifiedSvg = svgElement.outerHTML;\r\n    // console.log(modifiedSvg)\r\n    this.leadingIconSvg = modifiedSvg;\r\n  }\r\n\r\n  async loadSecondaryIcon(iconName: string) {\r\n    const iconPath = getAssetPath(`${iconName}`);\r\n    const response = await fetch(iconPath);\r\n    const svg = await response.text();\r\n\r\n    const parser = new DOMParser();\r\n    const svgDoc = parser.parseFromString(svg, 'image/svg+xml');\r\n    const svgElement = svgDoc.documentElement;\r\n\r\n    // Add `has-opacity` class to all elements that have an opacity attribute\r\n    const elementsWithOpacity = svgElement.querySelectorAll('[opacity]');\r\n    elementsWithOpacity.forEach(el => {\r\n      el.classList.add('has_opacity');\r\n    });\r\n\r\n    const gWithOpacity = svgElement.querySelectorAll('g[opacity]');\r\n\r\n    gWithOpacity.forEach(g => {\r\n      g.classList.add('has_opacity');\r\n    });\r\n\r\n    // Serialize and store\r\n    const modifiedSvg = svgElement.outerHTML;\r\n    // console.log(modifiedSvg)\r\n    this.secondaryIconSvg = modifiedSvg;\r\n  }\r\n\r\n  @Watch('icon')\r\n  updateSidebarIcon(newValue: string, _oldValue: string) {\r\n    this.internalIcon = newValue;\r\n  }\r\n\r\n  componentWillLoad() {\r\n    this.loadIcon(this.icon);\r\n    this.loadSecondaryIcon(this.secondaryIcon);\r\n\r\n    this.internalIcon = this.icon;\r\n  }\r\n\r\n  onSideBarItemClicked() {\r\n    this.sideBarItemClicked.emit();\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <div class={`side_bar_item_container`} onMouseEnter={() => (this.showTooltip = true)} onMouseLeave={() => (this.showTooltip = false)}>\r\n        <div class={`nav_item_base ${this.state} ${this.type} ${this.category}`}>\r\n          {this.state === 'active' && <div class={`bar ${this.category}`}></div>}\r\n          <div class=\"content\">\r\n            {this.icon && <div class={`icon ${this.state} ${this.category}`} innerHTML={this.leadingIconSvg}></div>}\r\n            {this.type === 'full_with_label' && (\r\n              <p class={`label_text ${this.category} ${this.state} ${this.state === 'active' ? 'text-md-semi-bold' : 'text-md-medium'}`}>{this.label}</p>\r\n            )}\r\n          </div>\r\n          {this.type === 'full_with_label' && (\r\n            <>\r\n              {this.showBadge && (\r\n                <gb-badge size=\"sm\" type=\"pill_outline\" color={this.state === 'active' ? 'information' : 'gray'}>\r\n                  <p>10</p>\r\n                </gb-badge>\r\n              )}\r\n              {this.showSecondaryIcon && (\r\n                <>\r\n                  {this.subMenu ? (\r\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" class={`arrow_icon ${this.state}`}>\r\n                      <path\r\n                        d=\"M6.00003 4C6.00003 4 9.99999 6.94596 10 8.00003C10 9.05411 6 12 6 12\"\r\n                        stroke={\r\n                          this.category === 'plain_background' && this.state === 'active'\r\n                            ? 'var(--color-icon-information-bold, #042F59)'\r\n                            : this.category === 'colored_background' && this.state === 'active'\r\n                            ? 'var(--base-white, #ffffff)'\r\n                            : 'var(--color-icon, #4B5565)'\r\n                        }\r\n                        stroke-width=\"1.5\"\r\n                        stroke-linecap=\"round\"\r\n                        stroke-linejoin=\"round\"\r\n                      />\r\n                    </svg>\r\n                  ) : (\r\n                    <div class={`secondary_icon ${this.state} ${this.category}`} innerHTML={this.secondaryIconSvg}></div>\r\n                  )}\r\n                </>\r\n              )}\r\n            </>\r\n          )}\r\n        </div>\r\n        {this.type === 'icon_only' && this.showTooltip && (\r\n          <gb-tooltip show-arrow={true} arrow=\"left\" class=\"tooltip\">\r\n            <p slot=\"label\">{this.label}</p>\r\n          </gb-tooltip>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}"],"version":3}

package/dist/docs.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2026-04-24T15:06:37",
+  "timestamp": "2026-05-11T10:51:32",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.38.3",
@@ -9614,10 +9614,10 @@
           "docsTags": [
             {
               "name": "default",
-              "text": "true"
+              "text": "false"
             }
           ],
-          "default": "true",
+          "default": "false",
           "values": [
             {
               "type": "boolean"