@db-ux/wc-core-components 1.1.0 → 1.2.0

package/dist/esm/db-radio.entry.js

@@ -1,12 +1,12 @@
-import { r as registerInstance, c as createEvent, h } from './index-5be50117.js';
-import { u as uuid, c as cls, j as getHideProp } from './index-7d31752e.js';
+import { r as registerInstance, c as createEvent, h } from './index-D-D8lQAG.js';
+import { u as uuid, j as getHideProp, c as cls } from './index-BJJmGwiD.js';
 
 const DBRadio = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.onChange = createEvent(this, "onChange", 7);
-        this.onBlur = createEvent(this, "onBlur", 7);
-        this.onFocus = createEvent(this, "onFocus", 7);
+        this.onChange = createEvent(this, "onChange");
+        this.onBlur = createEvent(this, "onBlur");
+        this.onFocus = createEvent(this, "onFocus");
         this.initialized = false;
         this._id = undefined;
     }
@@ -66,24 +66,34 @@ const DBRadio = class {
             }
         }
     }
+    watch0Fn() {
+        if (this.checked && this.initialized && this._ref) {
+            this._ref.checked = true;
+        }
+    }
+    watch0() {
+        this.watch0Fn();
+    }
     componentDidLoad() {
         var _a;
         this.enableAttributePassing(this._ref, "db-radio");
         this.initialized = true;
         this._id = (_a = this.id) !== null && _a !== void 0 ? _a : `radio-${uuid()}`;
-    }
-    componentDidUpdate() {
-        if (this.checked && this.initialized && this._ref) {
-            this._ref.checked = true;
-        }
+        this.watch0Fn();
     }
     render() {
-        return (h("label", { key: 'cf284d1056ea238ee9172220c34bc818fa0f5216', class: cls("db-radio", this.className), "data-size": this.size, "data-hide-label": getHideProp(this.showLabel), htmlFor: this._id }, h("input", { key: '0c43cd33933fdfc52557a82c13e96f8c182183f6', type: "radio", "aria-invalid": this.validation === "invalid", "data-custom-validity": this.validation, ref: (el) => {
+        return (h("label", { key: 'd69abe49b0c384cd232235f09272cb93b3ee1d30', class: cls("db-radio", this.className), "data-size": this.size, "data-hide-label": getHideProp(this.showLabel), htmlFor: this._id }, h("input", { key: 'e6c822b38c510cfef316de994c674005f8274370', type: "radio", "aria-invalid": this.validation === "invalid", "data-custom-validity": this.validation, ref: (el) => {
                 this._ref = el;
             }, id: this._id, name: this.name, checked: this.checked, disabled: this.disabled, "aria-describedby": this.describedbyid, value: this.value, required: this.required, onChange: (event) => this.handleChange(event), onBlur: (event) => this.handleBlur(event), onFocus: (event) => this.handleFocus(event) }), this.label ? this.label : h("slot", null)));
     }
+    static get watchers() { return {
+        "initialized": ["watch0"],
+        "_ref": ["watch0"],
+        "checked": ["watch0"]
+    }; }
 };
 
 export { DBRadio as db_radio };
+//# sourceMappingURL=db-radio.entry.js.map
 
 //# sourceMappingURL=db-radio.entry.js.map

package/dist/esm/db-radio.entry.js.map

@@ -1 +1 @@
-{"file":"db-radio.entry.js","mappings":"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","names":[],"sources":["src/components/radio/radio.tsx"],"sourcesContent":["import { DBRadioProps, DBRadioState } from \"./model\";\nimport { cls, getHideProp, uuid } from \"../../utils\";\nimport { ChangeEvent, InteractionEvent } from \"../../shared/model\";\nimport {\n  handleFrameworkEventAngular,\n  handleFrameworkEventVue,\n} from \"../../utils/form-components\";\n\nimport { Component, h, Fragment, Event, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n  tag: \"db-radio\",\n})\nexport class DBRadio {\n  private _ref!: HTMLInputElement | null;\n  @Prop() id: DBRadioProps[\"id\"];\n  @Prop() checked: DBRadioProps[\"checked\"];\n  @Event() onChange: any;\n  @Prop() change: DBRadioProps[\"change\"];\n  @Event() onBlur: any;\n  @Prop() blur: DBRadioProps[\"blur\"];\n  @Event() onFocus: any;\n  @Prop() focus: DBRadioProps[\"focus\"];\n  @Prop() size: DBRadioProps[\"size\"];\n  @Prop() showLabel: DBRadioProps[\"showLabel\"];\n  @Prop({attribute: \"classname\"}) className: DBRadioProps[\"className\"];\n  @Prop() validation: DBRadioProps[\"validation\"];\n  @Prop() name: DBRadioProps[\"name\"];\n  @Prop() disabled: DBRadioProps[\"disabled\"];\n  @Prop() describedbyid: DBRadioProps[\"describedbyid\"];\n  @Prop() value: DBRadioProps[\"value\"];\n  @Prop() required: DBRadioProps[\"required\"];\n  @Prop() label: DBRadioProps[\"label\"];\n\n  @State() initialized = false;\n  @State() _id = undefined;\n\n  handleChange(event: ChangeEvent<HTMLInputElement>) {\n    if (this.onChange) {\n      this.onChange.emit(event);\n    }\n    if (this.change) {\n      this.change(event);\n    }\n  }\n  handleBlur(event: InteractionEvent<HTMLInputElement>) {\n    if (this.onBlur) {\n      this.onBlur.emit(event);\n    }\n    if (this.blur) {\n      this.blur(event);\n    }\n  }\n  handleFocus(event: InteractionEvent<HTMLInputElement>) {\n    if (this.onFocus) {\n      this.onFocus.emit(event);\n    }\n    if (this.focus) {\n      this.focus(event);\n    }\n  }\n\n  /**\n   * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n   * @param element  the ref for the component\n   * @param customElementSelector  the custom element like `my-component`\n   */\n  private enableAttributePassing(\n    element: HTMLInputElement | null,\n    customElementSelector: string\n  ) {\n    const parent = element?.closest(customElementSelector);\n    if (element && parent) {\n      const attributes = parent.attributes;\n      for (let i = 0; i < attributes.length; i++) {\n        const attr = attributes.item(i);\n        if (\n          attr &&\n          (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n        ) {\n          element.setAttribute(attr.name, attr.value);\n          parent.removeAttribute(attr.name);\n        }\n        if (attr && attr.name === \"class\") {\n          const isWebComponent = attr.value.includes(\"hydrated\");\n          const value = attr.value.replace(\"hydrated\", \"\").trim();\n          const currentClass = element.getAttribute(\"class\");\n          element.setAttribute(\n            attr.name,\n            `${currentClass ? `${currentClass} ` : \"\"}${value}`\n          );\n          if (isWebComponent) {\n            // Stencil is using this class for lazy loading component\n            parent.setAttribute(\"class\", \"hydrated\");\n          } else {\n            parent.removeAttribute(attr.name);\n          }\n        }\n      }\n    }\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-radio\");\n    this.initialized = true;\n    this._id = this.id ?? `radio-${uuid()}`;\n  }\n\n  componentDidUpdate() {\n    if (this.checked && this.initialized && this._ref) {\n      this._ref.checked = true;\n    }\n  }\n\n  render() {\n    return (\n      <label\n        class={cls(\"db-radio\", this.className)}\n        data-size={this.size}\n        data-hide-label={getHideProp(this.showLabel)}\n        htmlFor={this._id}\n      >\n        <input\n          type=\"radio\"\n          aria-invalid={this.validation === \"invalid\"}\n          data-custom-validity={this.validation}\n          ref={(el: any) => {\n            this._ref = el;\n          }}\n          id={this._id}\n          name={this.name}\n          checked={this.checked}\n          disabled={this.disabled}\n          aria-describedby={this.describedbyid}\n          value={this.value}\n          required={this.required}\n          onChange={(event) => this.handleChange(event)}\n          onBlur={(event) => this.handleBlur(event)}\n          onFocus={(event) => this.handleFocus(event)}\n        />\n        {this.label ? this.label : <slot></slot>}\n      </label>\n    );\n  }\n}\n"],"version":3}
+{"version":3,"file":"db-radio.entry.js","sources":["src/components/radio/radio.tsx"],"sourcesContent":["import { DBRadioProps, DBRadioState } from \"./model\";\nimport { cls, getHideProp, uuid } from \"../../utils\";\nimport { ChangeEvent, InteractionEvent } from \"../../shared/model\";\nimport {\n  handleFrameworkEventAngular,\n  handleFrameworkEventVue,\n} from \"../../utils/form-components\";\n\nimport {\n  Component,\n  h,\n  Fragment,\n  Watch,\n  Event,\n  Prop,\n  State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n  tag: \"db-radio\",\n})\nexport class DBRadio {\n  private _ref!: HTMLInputElement | null;\n  @Prop() id: DBRadioProps[\"id\"];\n  @Prop() checked: DBRadioProps[\"checked\"];\n  @Event() onChange: any;\n  @Prop() change: DBRadioProps[\"change\"];\n  @Event() onBlur: any;\n  @Prop() blur: DBRadioProps[\"blur\"];\n  @Event() onFocus: any;\n  @Prop() focus: DBRadioProps[\"focus\"];\n  @Prop() size: DBRadioProps[\"size\"];\n  @Prop() showLabel: DBRadioProps[\"showLabel\"];\n  @Prop({attribute: \"classname\"}) className: DBRadioProps[\"className\"];\n  @Prop() validation: DBRadioProps[\"validation\"];\n  @Prop() name: DBRadioProps[\"name\"];\n  @Prop() disabled: DBRadioProps[\"disabled\"];\n  @Prop() describedbyid: DBRadioProps[\"describedbyid\"];\n  @Prop() value: DBRadioProps[\"value\"];\n  @Prop() required: DBRadioProps[\"required\"];\n  @Prop() label: DBRadioProps[\"label\"];\n\n  @State() initialized = false;\n  @State() _id = undefined;\n\n  handleChange(event: ChangeEvent<HTMLInputElement>) {\n    if (this.onChange) {\n      this.onChange.emit(event);\n    }\n    if (this.change) {\n      this.change(event);\n    }\n  }\n  handleBlur(event: InteractionEvent<HTMLInputElement>) {\n    if (this.onBlur) {\n      this.onBlur.emit(event);\n    }\n    if (this.blur) {\n      this.blur(event);\n    }\n  }\n  handleFocus(event: InteractionEvent<HTMLInputElement>) {\n    if (this.onFocus) {\n      this.onFocus.emit(event);\n    }\n    if (this.focus) {\n      this.focus(event);\n    }\n  }\n\n  /**\n   * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n   * @param element  the ref for the component\n   * @param customElementSelector  the custom element like `my-component`\n   */\n  private enableAttributePassing(\n    element: HTMLInputElement | null,\n    customElementSelector: string\n  ) {\n    const parent = element?.closest(customElementSelector);\n    if (element && parent) {\n      const attributes = parent.attributes;\n      for (let i = 0; i < attributes.length; i++) {\n        const attr = attributes.item(i);\n        if (\n          attr &&\n          (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n        ) {\n          element.setAttribute(attr.name, attr.value);\n          parent.removeAttribute(attr.name);\n        }\n        if (attr && attr.name === \"class\") {\n          const isWebComponent = attr.value.includes(\"hydrated\");\n          const value = attr.value.replace(\"hydrated\", \"\").trim();\n          const currentClass = element.getAttribute(\"class\");\n          element.setAttribute(\n            attr.name,\n            `${currentClass ? `${currentClass} ` : \"\"}${value}`\n          );\n          if (isWebComponent) {\n            // Stencil is using this class for lazy loading component\n            parent.setAttribute(\"class\", \"hydrated\");\n          } else {\n            parent.removeAttribute(attr.name);\n          }\n        }\n      }\n    }\n  }\n\n  watch0Fn() {\n    if (this.checked && this.initialized && this._ref) {\n      this._ref.checked = true;\n    }\n  }\n\n  @Watch(\"initialized\")\n  @Watch(\"_ref\")\n  @Watch(\"checked\")\n  watch0() {\n    this.watch0Fn();\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-radio\");\n    this.initialized = true;\n    this._id = this.id ?? `radio-${uuid()}`;\n    this.watch0Fn();\n  }\n\n  render() {\n    return (\n      <label\n        class={cls(\"db-radio\", this.className)}\n        data-size={this.size}\n        data-hide-label={getHideProp(this.showLabel)}\n        htmlFor={this._id}\n      >\n        <input\n          type=\"radio\"\n          aria-invalid={this.validation === \"invalid\"}\n          data-custom-validity={this.validation}\n          ref={(el: any) => {\n            this._ref = el;\n          }}\n          id={this._id}\n          name={this.name}\n          checked={this.checked}\n          disabled={this.disabled}\n          aria-describedby={this.describedbyid}\n          value={this.value}\n          required={this.required}\n          onChange={(event) => this.handleChange(event)}\n          onBlur={(event) => this.handleBlur(event)}\n          onFocus={(event) => this.handleFocus(event)}\n        />\n        {this.label ? this.label : <slot></slot>}\n      </label>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/db-section.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, h } from './index-5be50117.js';
-import { u as uuid, c as cls } from './index-7d31752e.js';
-import { D as DEFAULT_ID } from './constants-745cf8d7.js';
+import { r as registerInstance, h } from './index-D-D8lQAG.js';
+import { u as uuid, c as cls } from './index-BJJmGwiD.js';
+import { D as DEFAULT_ID } from './constants-CNj9Jn9q.js';
 
 const DBSection = class {
     constructor(hostRef) {
@@ -51,5 +51,6 @@ const DBSection = class {
 };
 
 export { DBSection as db_section };
+//# sourceMappingURL=db-section.entry.js.map
 
 //# sourceMappingURL=db-section.entry.js.map

package/dist/esm/db-section.entry.js.map

@@ -1 +1 @@
-{"file":"db-section.entry.js","mappings":";;;;MAca,SAAS;IAHrB;;QAUU,QAAG,GAAG,UAAU,CAAC;KA8D3B;;;;;;IAvDS,sBAAsB,CAC5B,OAA2B,EAC3B,qBAA6B;QAE7B,MAAM,MAAM,GAAG,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,CAAC,qBAAqB,CAAC,CAAC;QACvD,IAAI,OAAO,IAAI,MAAM,EAAE;YACrB,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;YACrC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,UAAU,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBAC1C,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;gBAChC,IACE,IAAI;qBACH,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,EAChE;oBACA,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;oBAC5C,MAAM,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;iBACnC;gBACD,IAAI,IAAI,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;oBACjC,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC;oBACvD,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC;oBACxD,MAAM,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;oBACnD,OAAO,CAAC,YAAY,CAClB,IAAI,CAAC,IAAI,EACT,GAAG,YAAY,GAAG,GAAG,YAAY,GAAG,GAAG,EAAE,GAAG,KAAK,EAAE,CACpD,CAAC;oBACF,IAAI,cAAc,EAAE;;wBAElB,MAAM,CAAC,YAAY,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC;qBAC1C;yBAAM;wBACL,MAAM,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;qBACnC;iBACF;aACF;SACF;KACF;IAED,gBAAgB;QACd,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC;QACrD,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,EAAE,IAAI,UAAU,GAAG,IAAI,EAAE,CAAC;KAC3C;IAED,MAAM;QACJ,QACE,gEACE,KAAK,EAAE,GAAG,CAAC,YAAY,EAAE,IAAI,CAAC,SAAS,CAAC,EACxC,GAAG,EAAE,CAAC,EAAO;gBACX,IAAI,CAAC,IAAI,GAAG,EAAE,CAAC;aAChB,EACD,EAAE,EAAE,IAAI,CAAC,GAAG,kBACE,IAAI,CAAC,OAAO,IAAI,QAAQ,gBAC1B,IAAI,CAAC,KAAK,IAEtB,8DAAa,CACL,EACV;KACH;;;;;","names":[],"sources":["src/components/section/section.tsx"],"sourcesContent":["import { DBSectionProps, DBSectionState } from \"./model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DEFAULT_ID } from \"../../shared/constants\";\n\nimport { Component, h, Fragment, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n  tag: \"db-section\",\n})\nexport class DBSection {\n  private _ref!: HTMLDivElement | null;\n  @Prop() id: DBSectionProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBSectionProps[\"className\"];\n  @Prop() spacing: DBSectionProps[\"spacing\"];\n  @Prop() width: DBSectionProps[\"width\"];\n\n  @State() _id = DEFAULT_ID;\n\n  /**\n   * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n   * @param element  the ref for the component\n   * @param customElementSelector  the custom element like `my-component`\n   */\n  private enableAttributePassing(\n    element: HTMLElement | null,\n    customElementSelector: string\n  ) {\n    const parent = element?.closest(customElementSelector);\n    if (element && parent) {\n      const attributes = parent.attributes;\n      for (let i = 0; i < attributes.length; i++) {\n        const attr = attributes.item(i);\n        if (\n          attr &&\n          (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n        ) {\n          element.setAttribute(attr.name, attr.value);\n          parent.removeAttribute(attr.name);\n        }\n        if (attr && attr.name === \"class\") {\n          const isWebComponent = attr.value.includes(\"hydrated\");\n          const value = attr.value.replace(\"hydrated\", \"\").trim();\n          const currentClass = element.getAttribute(\"class\");\n          element.setAttribute(\n            attr.name,\n            `${currentClass ? `${currentClass} ` : \"\"}${value}`\n          );\n          if (isWebComponent) {\n            // Stencil is using this class for lazy loading component\n            parent.setAttribute(\"class\", \"hydrated\");\n          } else {\n            parent.removeAttribute(attr.name);\n          }\n        }\n      }\n    }\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-section\");\n    this._id = this.id || \"section-\" + uuid();\n  }\n\n  render() {\n    return (\n      <section\n        class={cls(\"db-section\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this._id}\n        data-spacing={this.spacing || \"medium\"}\n        data-width={this.width}\n      >\n        <slot></slot>\n      </section>\n    );\n  }\n}\n"],"version":3}
+{"version":3,"file":"db-section.entry.js","sources":["src/components/section/section.tsx"],"sourcesContent":["import { DBSectionProps, DBSectionState } from \"./model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DEFAULT_ID } from \"../../shared/constants\";\n\nimport { Component, h, Fragment, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n  tag: \"db-section\",\n})\nexport class DBSection {\n  private _ref!: HTMLDivElement | null;\n  @Prop() id: DBSectionProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBSectionProps[\"className\"];\n  @Prop() spacing: DBSectionProps[\"spacing\"];\n  @Prop() width: DBSectionProps[\"width\"];\n\n  @State() _id = DEFAULT_ID;\n\n  /**\n   * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n   * @param element  the ref for the component\n   * @param customElementSelector  the custom element like `my-component`\n   */\n  private enableAttributePassing(\n    element: HTMLElement | null,\n    customElementSelector: string\n  ) {\n    const parent = element?.closest(customElementSelector);\n    if (element && parent) {\n      const attributes = parent.attributes;\n      for (let i = 0; i < attributes.length; i++) {\n        const attr = attributes.item(i);\n        if (\n          attr &&\n          (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n        ) {\n          element.setAttribute(attr.name, attr.value);\n          parent.removeAttribute(attr.name);\n        }\n        if (attr && attr.name === \"class\") {\n          const isWebComponent = attr.value.includes(\"hydrated\");\n          const value = attr.value.replace(\"hydrated\", \"\").trim();\n          const currentClass = element.getAttribute(\"class\");\n          element.setAttribute(\n            attr.name,\n            `${currentClass ? `${currentClass} ` : \"\"}${value}`\n          );\n          if (isWebComponent) {\n            // Stencil is using this class for lazy loading component\n            parent.setAttribute(\"class\", \"hydrated\");\n          } else {\n            parent.removeAttribute(attr.name);\n          }\n        }\n      }\n    }\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-section\");\n    this._id = this.id || \"section-\" + uuid();\n  }\n\n  render() {\n    return (\n      <section\n        class={cls(\"db-section\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this._id}\n        data-spacing={this.spacing || \"medium\"}\n        data-width={this.width}\n      >\n        <slot></slot>\n      </section>\n    );\n  }\n}\n"],"names":[],"mappings":";;;;MAca,SAAS,GAAA,MAAA;AAHrB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAUU,QAAA,IAAG,CAAA,GAAA,GAAG,UAAU;AA8D1B;AA5DC;;;;AAIG;IACK,sBAAsB,CAC5B,OAA2B,EAC3B,qBAA6B,EAAA;QAE7B,MAAM,MAAM,GAAG,OAAO,KAAA,IAAA,IAAP,OAAO,KAAA,MAAA,GAAA,MAAA,GAAP,OAAO,CAAE,OAAO,CAAC,qBAAqB,CAAC;AACtD,QAAA,IAAI,OAAO,IAAI,MAAM,EAAE;AACrB,YAAA,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU;AACpC,YAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,UAAU,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBAC1C,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC;AAC/B,gBAAA,IACE,IAAI;AACJ,qBAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,EAChE;oBACA,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC;AAC3C,oBAAA,MAAM,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC;;gBAEnC,IAAI,IAAI,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;oBACjC,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,UAAU,CAAC;AACtD,oBAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,IAAI,EAAE;oBACvD,MAAM,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC;oBAClD,OAAO,CAAC,YAAY,CAClB,IAAI,CAAC,IAAI,EACT,CAAG,EAAA,YAAY,GAAG,CAAG,EAAA,YAAY,CAAG,CAAA,CAAA,GAAG,EAAE,CAAG,EAAA,KAAK,CAAE,CAAA,CACpD;oBACD,IAAI,cAAc,EAAE;;AAElB,wBAAA,MAAM,CAAC,YAAY,CAAC,OAAO,EAAE,UAAU,CAAC;;yBACnC;AACL,wBAAA,MAAM,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC;;;;;;IAO3C,gBAAgB,GAAA;QACd,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,EAAE,YAAY,CAAC;QACpD,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,EAAE,IAAI,UAAU,GAAG,IAAI,EAAE;;IAG3C,MAAM,GAAA;QACJ,QACE,CACE,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,GAAG,CAAC,YAAY,EAAE,IAAI,CAAC,SAAS,CAAC,EACxC,GAAG,EAAE,CAAC,EAAO,KAAI;AACf,gBAAA,IAAI,CAAC,IAAI,GAAG,EAAE;AAChB,aAAC,EACD,EAAE,EAAE,IAAI,CAAC,GAAG,EAAA,cAAA,EACE,IAAI,CAAC,OAAO,IAAI,QAAQ,EAC1B,YAAA,EAAA,IAAI,CAAC,KAAK,EAAA,EAEtB,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACL;;;;;;"}

package/dist/esm/db-select.entry.js

@@ -1,15 +1,15 @@
-import { r as registerInstance, c as createEvent, h, F as Fragment } from './index-5be50117.js';
-import { e as hasVoiceOver, f as delay, s as stringPropVisible, u as uuid, c as cls, j as getHideProp } from './index-7d31752e.js';
-import { i as DEFAULT_INVALID_MESSAGE, h as DEFAULT_VALID_MESSAGE, c as DEFAULT_MESSAGE_ID_SUFFIX, d as DEFAULT_VALID_MESSAGE_ID_SUFFIX, e as DEFAULT_INVALID_MESSAGE_ID_SUFFIX, f as DEFAULT_PLACEHOLDER_ID_SUFFIX, a as DEFAULT_LABEL } from './constants-745cf8d7.js';
+import { r as registerInstance, c as createEvent, h, F as Fragment } from './index-D-D8lQAG.js';
+import { e as hasVoiceOver, f as delay, s as stringPropVisible, u as uuid, j as getHideProp, c as cls } from './index-BJJmGwiD.js';
+import { i as DEFAULT_INVALID_MESSAGE, h as DEFAULT_VALID_MESSAGE, d as DEFAULT_VALID_MESSAGE_ID_SUFFIX, e as DEFAULT_INVALID_MESSAGE_ID_SUFFIX, c as DEFAULT_MESSAGE_ID_SUFFIX, f as DEFAULT_PLACEHOLDER_ID_SUFFIX, a as DEFAULT_LABEL } from './constants-CNj9Jn9q.js';
 
 const DBSelect = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.onClick = createEvent(this, "onClick", 7);
-        this.onInput = createEvent(this, "onInput", 7);
-        this.onChange = createEvent(this, "onChange", 7);
-        this.onBlur = createEvent(this, "onBlur", 7);
-        this.onFocus = createEvent(this, "onFocus", 7);
+        this.onClick = createEvent(this, "onClick");
+        this.onInput = createEvent(this, "onInput");
+        this.onChange = createEvent(this, "onChange");
+        this.onBlur = createEvent(this, "onBlur");
+        this.onFocus = createEvent(this, "onFocus");
         this._id = undefined;
         this._messageId = undefined;
         this._validMessageId = undefined;
@@ -117,18 +117,7 @@ const DBSelect = class {
             }
         }
     }
-    componentDidLoad() {
-        var _a;
-        this.enableAttributePassing(this._ref, "db-select");
-        this.initialized = true;
-        const mId = (_a = this.id) !== null && _a !== void 0 ? _a : `select-${uuid()}`;
-        this._id = mId;
-        this._messageId = mId + DEFAULT_MESSAGE_ID_SUFFIX;
-        this._validMessageId = mId + DEFAULT_VALID_MESSAGE_ID_SUFFIX;
-        this._invalidMessageId = mId + DEFAULT_INVALID_MESSAGE_ID_SUFFIX;
-        this._placeholderId = mId + DEFAULT_PLACEHOLDER_ID_SUFFIX;
-    }
-    componentDidUpdate() {
+    watch0Fn() {
         if (this._id && this.initialized) {
             const messageId = this._id + DEFAULT_MESSAGE_ID_SUFFIX;
             const placeholderId = this._id + DEFAULT_PLACEHOLDER_ID_SUFFIX;
@@ -144,23 +133,50 @@ const DBSelect = class {
             }
             this.initialized = false;
         }
+    }
+    watch0() {
+        this.watch0Fn();
+    }
+    watch1Fn() {
         this._value = this.value;
     }
+    watch1() {
+        this.watch1Fn();
+    }
+    componentDidLoad() {
+        var _a;
+        this.enableAttributePassing(this._ref, "db-select");
+        this.initialized = true;
+        const mId = (_a = this.id) !== null && _a !== void 0 ? _a : `select-${uuid()}`;
+        this._id = mId;
+        this._messageId = mId + DEFAULT_MESSAGE_ID_SUFFIX;
+        this._validMessageId = mId + DEFAULT_VALID_MESSAGE_ID_SUFFIX;
+        this._invalidMessageId = mId + DEFAULT_INVALID_MESSAGE_ID_SUFFIX;
+        this._placeholderId = mId + DEFAULT_PLACEHOLDER_ID_SUFFIX;
+        this.watch0Fn();
+        this.watch1Fn();
+    }
     render() {
         var _a, _b, _c, _d, _e, _f, _g, _h;
-        return (h("div", { key: '1c026d87264bbb7476188faed638bdff983b7257', class: cls("db-select", this.className), "data-variant": this.variant, "data-hide-label": getHideProp(this.showLabel), "data-icon": this.icon, "data-hide-icon": getHideProp(this.showIcon) }, h("label", { key: '6e05a86b0f2c78603141e9de2573e2c494924301', htmlFor: this._id }, (_a = this.label) !== null && _a !== void 0 ? _a : DEFAULT_LABEL), h("select", { key: 'd3c4e34efd818c04def64f755bb3958205e54250', "aria-invalid": this.validation === "invalid", "data-custom-validity": this.validation, ref: (el) => {
+        return (h("div", { key: '3e2f8100054cfc22a0e1d682d460ea3f9cf81443', class: cls("db-select", this.className), "data-variant": this.variant, "data-hide-label": getHideProp(this.showLabel), "data-icon": this.icon, "data-hide-icon": getHideProp(this.showIcon) }, h("label", { key: '0d897551a95f80ecfbd5be6236a41ca10dfdb619', htmlFor: this._id }, (_a = this.label) !== null && _a !== void 0 ? _a : DEFAULT_LABEL), h("select", { key: 'fee1db015bc2b03511c94bbc987e397ed328aab5', "aria-invalid": this.validation === "invalid", "data-custom-validity": this.validation, ref: (el) => {
                 this._ref = el;
             }, required: this.required, disabled: this.disabled, id: this._id, name: this.name, size: this.size,
             /* @ts-ignore */
-            value: (_b = this.value) !== null && _b !== void 0 ? _b : this._value, autocomplete: this.autocomplete, onInput: (event) => this.handleInput(event), onClick: (event) => this.handleClick(event), onChange: (event) => this.handleChange(event), onBlur: (event) => this.handleBlur(event), onFocus: (event) => this.handleFocus(event), "aria-describedby": this._descByIds }, h("option", { key: 'c6244178d81b998d7e25322b2dfca86d384f7df7', hidden: true }), this.options
+            value: (_b = this.value) !== null && _b !== void 0 ? _b : this._value, autocomplete: this.autocomplete, onInput: (event) => this.handleInput(event), onClick: (event) => this.handleClick(event), onChange: (event) => this.handleChange(event), onBlur: (event) => this.handleBlur(event), onFocus: (event) => this.handleFocus(event), "aria-describedby": this._descByIds }, h("option", { key: '2e7cfe544df6850ca4ca6c95c51d7050f726a4f0', hidden: true }), this.options
             ? (_c = this.options) === null || _c === void 0 ? void 0 : _c.map((option) => {
                 var _a;
                 return (h(Fragment, null, option.options ? (h("optgroup", { label: this.getOptionLabel(option) }, (_a = option.options) === null || _a === void 0 ? void 0 : _a.map((optgroupOption) => (h("option", { key: optgroupOption.value.toString(), value: optgroupOption.value, selected: optgroupOption.selected, disabled: optgroupOption.disabled }, this.getOptionLabel(optgroupOption)))))) : null, !option.options ? (h("option", { value: option.value, disabled: option.disabled, selected: option.selected }, this.getOptionLabel(option))) : null));
             })
-            : null, h("slot", { key: '62937996853419228ae5738e077d4598b8691b0e' })), h("span", { key: '928d88490be50b727a7c47c54ad5fcc94b01f081', id: this._placeholderId }, (_d = this.placeholder) !== null && _d !== void 0 ? _d : this.label), stringPropVisible(this.message, this.showMessage) ? (h("db-infotext", { size: "small", icon: this.messageIcon, id: this._messageId }, this.message)) : null, h("db-infotext", { key: 'a4a0dbbc17cca2f44ac5800de5180a7c14638c5a', size: "small", semantic: "successful", id: this._validMessageId }, (_e = this.validMessage) !== null && _e !== void 0 ? _e : DEFAULT_VALID_MESSAGE), h("db-infotext", { key: '2ba1ac947180675feddc7a1567aa9c68cf5ca319', size: "small", semantic: "critical", id: this._invalidMessageId }, (_h = (_f = this.invalidMessage) !== null && _f !== void 0 ? _f : (_g = this._ref) === null || _g === void 0 ? void 0 : _g.validationMessage) !== null && _h !== void 0 ? _h : DEFAULT_INVALID_MESSAGE), h("span", { key: '2fc22ca7ad620da602ea173665e7fee349bd6f98', "data-visually-hidden": "true", role: "status" }, this._voiceOverFallback)));
+            : null, h("slot", { key: 'c814b0354472e8462a14776d167f22bcd9cce13f' })), h("span", { key: '4f9a5cfad912fa3cf98566d3a3fc0ebf904ba7eb', id: this._placeholderId }, (_d = this.placeholder) !== null && _d !== void 0 ? _d : this.label), stringPropVisible(this.message, this.showMessage) ? (h("db-infotext", { size: "small", icon: this.messageIcon, id: this._messageId }, this.message)) : null, h("db-infotext", { key: 'c0ddd46e0d1c568bed1ff4e626d4ef5875922642', size: "small", semantic: "successful", id: this._validMessageId }, (_e = this.validMessage) !== null && _e !== void 0 ? _e : DEFAULT_VALID_MESSAGE), h("db-infotext", { key: 'ac550d2b60a7c65e2d4c8661aa8f8acacfcd29e1', size: "small", semantic: "critical", id: this._invalidMessageId }, (_h = (_f = this.invalidMessage) !== null && _f !== void 0 ? _f : (_g = this._ref) === null || _g === void 0 ? void 0 : _g.validationMessage) !== null && _h !== void 0 ? _h : DEFAULT_INVALID_MESSAGE), h("span", { key: 'f6c75ffdf9d062273054a8733621c403aa24591c', "data-visually-hidden": "true", role: "status" }, this._voiceOverFallback)));
     }
+    static get watchers() { return {
+        "_id": ["watch0"],
+        "initialized": ["watch0"],
+        "value": ["watch1"]
+    }; }
 };
 
 export { DBSelect as db_select };
+//# sourceMappingURL=db-select.entry.js.map
 
 //# sourceMappingURL=db-select.entry.js.map

package/dist/esm/db-select.entry.js.map

@@ -1 +1 @@
-{"file":"db-select.entry.js","mappings":"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","names":[],"sources":["src/components/select/select.tsx"],"sourcesContent":["import { DBSelectOptionType, DBSelectProps, DBSelectState } from \"./model\";\nimport {\n  cls,\n  delay,\n  getHideProp,\n  hasVoiceOver,\n  stringPropVisible,\n  uuid,\n} from \"../../utils\";\nimport {\n  DEFAULT_INVALID_MESSAGE,\n  DEFAULT_INVALID_MESSAGE_ID_SUFFIX,\n  DEFAULT_LABEL,\n  DEFAULT_MESSAGE_ID_SUFFIX,\n  DEFAULT_PLACEHOLDER_ID_SUFFIX,\n  DEFAULT_VALID_MESSAGE,\n  DEFAULT_VALID_MESSAGE_ID_SUFFIX,\n} from \"../../shared/constants\";\nimport { DBInfotext } from \"../infotext/infotext\";\nimport {\n  ChangeEvent,\n  ClickEvent,\n  InputEvent,\n  InteractionEvent,\n} from \"../../shared/model\";\nimport {\n  handleFrameworkEventAngular,\n  handleFrameworkEventVue,\n} from \"../../utils/form-components\";\n\nimport { Component, h, Fragment, Event, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n  tag: \"db-select\",\n})\nexport class DBSelect {\n  private _ref!: HTMLSelectElement | null;\n  @Prop() id: DBSelectProps[\"id\"];\n  @Prop() message: DBSelectProps[\"message\"];\n  @Prop() showMessage: DBSelectProps[\"showMessage\"];\n  @Prop() value: DBSelectProps[\"value\"];\n  @Event() onClick: any;\n  @Event() onInput: any;\n  @Prop() input: DBSelectProps[\"input\"];\n  @Event() onChange: any;\n  @Prop() change: DBSelectProps[\"change\"];\n  @Prop() validation: DBSelectProps[\"validation\"];\n  @Prop() invalidMessage: DBSelectProps[\"invalidMessage\"];\n  @Prop() required: DBSelectProps[\"required\"];\n  @Prop() validMessage: DBSelectProps[\"validMessage\"];\n  @Event() onBlur: any;\n  @Prop() blur: DBSelectProps[\"blur\"];\n  @Event() onFocus: any;\n  @Prop() focus: DBSelectProps[\"focus\"];\n  @Prop({attribute: \"classname\"}) className: DBSelectProps[\"className\"];\n  @Prop() variant: DBSelectProps[\"variant\"];\n  @Prop() showLabel: DBSelectProps[\"showLabel\"];\n  @Prop() icon: DBSelectProps[\"icon\"];\n  @Prop() showIcon: DBSelectProps[\"showIcon\"];\n  @Prop() label: DBSelectProps[\"label\"];\n  @Prop() disabled: DBSelectProps[\"disabled\"];\n  @Prop() name: DBSelectProps[\"name\"];\n  @Prop() size: DBSelectProps[\"size\"];\n  @Prop() autocomplete: DBSelectProps[\"autocomplete\"];\n  @Prop() options: DBSelectProps[\"options\"];\n\n  @Prop() placeholder: DBSelectProps[\"placeholder\"];\n  @Prop() messageIcon: DBSelectProps[\"messageIcon\"];\n  @State() _id = undefined;\n  @State() _messageId = undefined;\n  @State() _validMessageId = undefined;\n  @State() _invalidMessageId = undefined;\n  @State() _placeholderId = \"\";\n  @State() _descByIds = \"\";\n  @State() _value = \"\";\n  @State() initialized = false;\n  @State() _voiceOverFallback = \"\";\n\n  handleClick(event: ClickEvent<HTMLSelectElement>) {\n    if (this.onClick) {\n      this.onClick.emit(event);\n    }\n  }\n  handleInput(event: InputEvent<HTMLSelectElement>) {\n    if (this.onInput) {\n      this.onInput.emit(event);\n    }\n    if (this.input) {\n      this.input(event);\n    }\n  }\n  handleChange(event: ChangeEvent<HTMLSelectElement>) {\n    if (this.onChange) {\n      this.onChange.emit(event);\n    }\n    if (this.change) {\n      this.change(event);\n    }\n    /* For a11y reasons we need to map the correct message with the select */\n    if (!this._ref?.validity.valid || this.validation === \"invalid\") {\n      this._descByIds = this._invalidMessageId;\n      if (hasVoiceOver()) {\n        this._voiceOverFallback =\n          this.invalidMessage ??\n          this._ref?.validationMessage ??\n          DEFAULT_INVALID_MESSAGE;\n        delay(() => (this._voiceOverFallback = \"\"), 1000);\n      }\n    } else if (\n      this.validation === \"valid\" ||\n      (this._ref?.validity.valid && this.required)\n    ) {\n      this._descByIds = this._validMessageId;\n      if (hasVoiceOver()) {\n        this._voiceOverFallback = this.validMessage ?? DEFAULT_VALID_MESSAGE;\n        delay(() => (this._voiceOverFallback = \"\"), 1000);\n      }\n    } else if (stringPropVisible(this.message, this.showMessage)) {\n      this._descByIds = this._messageId;\n    } else {\n      this._descByIds = this._placeholderId;\n    }\n  }\n  handleBlur(event: InteractionEvent<HTMLSelectElement>) {\n    if (this.onBlur) {\n      this.onBlur.emit(event);\n    }\n    if (this.blur) {\n      this.blur(event);\n    }\n  }\n  handleFocus(event: InteractionEvent<HTMLSelectElement>) {\n    if (this.onFocus) {\n      this.onFocus.emit(event);\n    }\n    if (this.focus) {\n      this.focus(event);\n    }\n  }\n  getOptionLabel(option: DBSelectOptionType) {\n    return option.label ?? option.value.toString();\n  }\n\n  /**\n   * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n   * @param element  the ref for the component\n   * @param customElementSelector  the custom element like `my-component`\n   */\n  private enableAttributePassing(\n    element: HTMLSelectElement | null,\n    customElementSelector: string\n  ) {\n    const parent = element?.closest(customElementSelector);\n    if (element && parent) {\n      const attributes = parent.attributes;\n      for (let i = 0; i < attributes.length; i++) {\n        const attr = attributes.item(i);\n        if (\n          attr &&\n          (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n        ) {\n          element.setAttribute(attr.name, attr.value);\n          parent.removeAttribute(attr.name);\n        }\n        if (attr && attr.name === \"class\") {\n          const isWebComponent = attr.value.includes(\"hydrated\");\n          const value = attr.value.replace(\"hydrated\", \"\").trim();\n          const currentClass = element.getAttribute(\"class\");\n          element.setAttribute(\n            attr.name,\n            `${currentClass ? `${currentClass} ` : \"\"}${value}`\n          );\n          if (isWebComponent) {\n            // Stencil is using this class for lazy loading component\n            parent.setAttribute(\"class\", \"hydrated\");\n          } else {\n            parent.removeAttribute(attr.name);\n          }\n        }\n      }\n    }\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-select\");\n    this.initialized = true;\n    const mId = this.id ?? `select-${uuid()}`;\n    this._id = mId;\n    this._messageId = mId + DEFAULT_MESSAGE_ID_SUFFIX;\n    this._validMessageId = mId + DEFAULT_VALID_MESSAGE_ID_SUFFIX;\n    this._invalidMessageId = mId + DEFAULT_INVALID_MESSAGE_ID_SUFFIX;\n    this._placeholderId = mId + DEFAULT_PLACEHOLDER_ID_SUFFIX;\n  }\n\n  componentDidUpdate() {\n    if (this._id && this.initialized) {\n      const messageId = this._id + DEFAULT_MESSAGE_ID_SUFFIX;\n      const placeholderId = this._id + DEFAULT_PLACEHOLDER_ID_SUFFIX;\n      this._messageId = messageId;\n      this._validMessageId = this._id + DEFAULT_VALID_MESSAGE_ID_SUFFIX;\n      this._invalidMessageId = this._id + DEFAULT_INVALID_MESSAGE_ID_SUFFIX;\n      this._placeholderId = placeholderId;\n      if (stringPropVisible(this.message, this.showMessage)) {\n        this._descByIds = messageId;\n      } else {\n        this._descByIds = placeholderId;\n      }\n      this.initialized = false;\n    }\n    this._value = this.value;\n  }\n\n  render() {\n    return (\n      <div\n        class={cls(\"db-select\", this.className)}\n        data-variant={this.variant}\n        data-hide-label={getHideProp(this.showLabel)}\n        data-icon={this.icon}\n        data-hide-icon={getHideProp(this.showIcon)}\n      >\n        <label htmlFor={this._id}>{this.label ?? DEFAULT_LABEL}</label>\n        <select\n          aria-invalid={this.validation === \"invalid\"}\n          data-custom-validity={this.validation}\n          ref={(el: any) => {\n            this._ref = el;\n          }}\n          required={this.required}\n          disabled={this.disabled}\n          id={this._id}\n          name={this.name}\n          size={this.size}\n          /* @ts-ignore */\nvalue={this.value ?? this._value}\n          autocomplete={this.autocomplete}\n          onInput={(event) => this.handleInput(event)}\n          onClick={(event) => this.handleClick(event)}\n          onChange={(event) => this.handleChange(event)}\n          onBlur={(event) => this.handleBlur(event)}\n          onFocus={(event) => this.handleFocus(event)}\n          aria-describedby={this._descByIds}\n        >\n          <option hidden={true}></option>\n          {this.options\n            ? this.options?.map((option) => (\n                <Fragment>\n                  {option.options ? (\n                    <optgroup label={this.getOptionLabel(option)}>\n                      {option.options?.map((optgroupOption) => (\n                        <option\n                          key={optgroupOption.value.toString()}\n                          value={optgroupOption.value}\n                          selected={optgroupOption.selected}\n                          disabled={optgroupOption.disabled}\n                        >\n                          {this.getOptionLabel(optgroupOption)}\n                        </option>\n                      ))}\n                    </optgroup>\n                  ) : null}\n                  {!option.options ? (\n                    <option\n                      value={option.value}\n                      disabled={option.disabled}\n                      selected={option.selected}\n                    >\n                      {this.getOptionLabel(option)}\n                    </option>\n                  ) : null}\n                </Fragment>\n              ))\n            : null}\n          <slot></slot>\n        </select>\n        <span id={this._placeholderId}>{this.placeholder ?? this.label}</span>\n        {stringPropVisible(this.message, this.showMessage) ? (\n          <db-infotext\n            size=\"small\"\n            icon={this.messageIcon}\n            id={this._messageId}\n          >\n            {this.message}\n          </db-infotext>\n        ) : null}\n        <db-infotext\n          size=\"small\"\n          semantic=\"successful\"\n          id={this._validMessageId}\n        >\n          {this.validMessage ?? DEFAULT_VALID_MESSAGE}\n        </db-infotext>\n        <db-infotext\n          size=\"small\"\n          semantic=\"critical\"\n          id={this._invalidMessageId}\n        >\n          {this.invalidMessage ??\n            this._ref?.validationMessage ??\n            DEFAULT_INVALID_MESSAGE}\n        </db-infotext>\n        <span data-visually-hidden=\"true\" role=\"status\">\n          {this._voiceOverFallback}\n        </span>\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"version":3,"file":"db-select.entry.js","sources":["src/components/select/select.tsx"],"sourcesContent":["import { DBSelectOptionType, DBSelectProps, DBSelectState } from \"./model\";\nimport {\n  cls,\n  delay,\n  getHideProp,\n  hasVoiceOver,\n  stringPropVisible,\n  uuid,\n} from \"../../utils\";\nimport {\n  DEFAULT_INVALID_MESSAGE,\n  DEFAULT_INVALID_MESSAGE_ID_SUFFIX,\n  DEFAULT_LABEL,\n  DEFAULT_MESSAGE_ID_SUFFIX,\n  DEFAULT_PLACEHOLDER_ID_SUFFIX,\n  DEFAULT_VALID_MESSAGE,\n  DEFAULT_VALID_MESSAGE_ID_SUFFIX,\n} from \"../../shared/constants\";\nimport { DBInfotext } from \"../infotext/infotext\";\nimport {\n  ChangeEvent,\n  ClickEvent,\n  InputEvent,\n  InteractionEvent,\n} from \"../../shared/model\";\nimport {\n  handleFrameworkEventAngular,\n  handleFrameworkEventVue,\n} from \"../../utils/form-components\";\n\nimport {\n  Component,\n  h,\n  Fragment,\n  Watch,\n  Event,\n  Prop,\n  State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n  tag: \"db-select\",\n})\nexport class DBSelect {\n  private _ref!: HTMLSelectElement | null;\n  @Prop() id: DBSelectProps[\"id\"];\n  @Prop() message: DBSelectProps[\"message\"];\n  @Prop() showMessage: DBSelectProps[\"showMessage\"];\n  @Prop() value: DBSelectProps[\"value\"];\n  @Event() onClick: any;\n  @Event() onInput: any;\n  @Prop() input: DBSelectProps[\"input\"];\n  @Event() onChange: any;\n  @Prop() change: DBSelectProps[\"change\"];\n  @Prop() validation: DBSelectProps[\"validation\"];\n  @Prop() invalidMessage: DBSelectProps[\"invalidMessage\"];\n  @Prop() required: DBSelectProps[\"required\"];\n  @Prop() validMessage: DBSelectProps[\"validMessage\"];\n  @Event() onBlur: any;\n  @Prop() blur: DBSelectProps[\"blur\"];\n  @Event() onFocus: any;\n  @Prop() focus: DBSelectProps[\"focus\"];\n  @Prop({attribute: \"classname\"}) className: DBSelectProps[\"className\"];\n  @Prop() variant: DBSelectProps[\"variant\"];\n  @Prop() showLabel: DBSelectProps[\"showLabel\"];\n  @Prop() icon: DBSelectProps[\"icon\"];\n  @Prop() showIcon: DBSelectProps[\"showIcon\"];\n  @Prop() label: DBSelectProps[\"label\"];\n  @Prop() disabled: DBSelectProps[\"disabled\"];\n  @Prop() name: DBSelectProps[\"name\"];\n  @Prop() size: DBSelectProps[\"size\"];\n  @Prop() autocomplete: DBSelectProps[\"autocomplete\"];\n  @Prop() options: DBSelectProps[\"options\"];\n\n  @Prop() placeholder: DBSelectProps[\"placeholder\"];\n  @Prop() messageIcon: DBSelectProps[\"messageIcon\"];\n  @State() _id = undefined;\n  @State() _messageId = undefined;\n  @State() _validMessageId = undefined;\n  @State() _invalidMessageId = undefined;\n  @State() _placeholderId = \"\";\n  @State() _descByIds = \"\";\n  @State() _value = \"\";\n  @State() initialized = false;\n  @State() _voiceOverFallback = \"\";\n\n  handleClick(event: ClickEvent<HTMLSelectElement>) {\n    if (this.onClick) {\n      this.onClick.emit(event);\n    }\n  }\n  handleInput(event: InputEvent<HTMLSelectElement>) {\n    if (this.onInput) {\n      this.onInput.emit(event);\n    }\n    if (this.input) {\n      this.input(event);\n    }\n  }\n  handleChange(event: ChangeEvent<HTMLSelectElement>) {\n    if (this.onChange) {\n      this.onChange.emit(event);\n    }\n    if (this.change) {\n      this.change(event);\n    }\n    /* For a11y reasons we need to map the correct message with the select */\n    if (!this._ref?.validity.valid || this.validation === \"invalid\") {\n      this._descByIds = this._invalidMessageId;\n      if (hasVoiceOver()) {\n        this._voiceOverFallback =\n          this.invalidMessage ??\n          this._ref?.validationMessage ??\n          DEFAULT_INVALID_MESSAGE;\n        delay(() => (this._voiceOverFallback = \"\"), 1000);\n      }\n    } else if (\n      this.validation === \"valid\" ||\n      (this._ref?.validity.valid && this.required)\n    ) {\n      this._descByIds = this._validMessageId;\n      if (hasVoiceOver()) {\n        this._voiceOverFallback = this.validMessage ?? DEFAULT_VALID_MESSAGE;\n        delay(() => (this._voiceOverFallback = \"\"), 1000);\n      }\n    } else if (stringPropVisible(this.message, this.showMessage)) {\n      this._descByIds = this._messageId;\n    } else {\n      this._descByIds = this._placeholderId;\n    }\n  }\n  handleBlur(event: InteractionEvent<HTMLSelectElement>) {\n    if (this.onBlur) {\n      this.onBlur.emit(event);\n    }\n    if (this.blur) {\n      this.blur(event);\n    }\n  }\n  handleFocus(event: InteractionEvent<HTMLSelectElement>) {\n    if (this.onFocus) {\n      this.onFocus.emit(event);\n    }\n    if (this.focus) {\n      this.focus(event);\n    }\n  }\n  getOptionLabel(option: DBSelectOptionType) {\n    return option.label ?? option.value.toString();\n  }\n\n  /**\n   * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n   * @param element  the ref for the component\n   * @param customElementSelector  the custom element like `my-component`\n   */\n  private enableAttributePassing(\n    element: HTMLSelectElement | null,\n    customElementSelector: string\n  ) {\n    const parent = element?.closest(customElementSelector);\n    if (element && parent) {\n      const attributes = parent.attributes;\n      for (let i = 0; i < attributes.length; i++) {\n        const attr = attributes.item(i);\n        if (\n          attr &&\n          (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n        ) {\n          element.setAttribute(attr.name, attr.value);\n          parent.removeAttribute(attr.name);\n        }\n        if (attr && attr.name === \"class\") {\n          const isWebComponent = attr.value.includes(\"hydrated\");\n          const value = attr.value.replace(\"hydrated\", \"\").trim();\n          const currentClass = element.getAttribute(\"class\");\n          element.setAttribute(\n            attr.name,\n            `${currentClass ? `${currentClass} ` : \"\"}${value}`\n          );\n          if (isWebComponent) {\n            // Stencil is using this class for lazy loading component\n            parent.setAttribute(\"class\", \"hydrated\");\n          } else {\n            parent.removeAttribute(attr.name);\n          }\n        }\n      }\n    }\n  }\n\n  watch0Fn() {\n    if (this._id && this.initialized) {\n      const messageId = this._id + DEFAULT_MESSAGE_ID_SUFFIX;\n      const placeholderId = this._id + DEFAULT_PLACEHOLDER_ID_SUFFIX;\n      this._messageId = messageId;\n      this._validMessageId = this._id + DEFAULT_VALID_MESSAGE_ID_SUFFIX;\n      this._invalidMessageId = this._id + DEFAULT_INVALID_MESSAGE_ID_SUFFIX;\n      this._placeholderId = placeholderId;\n      if (stringPropVisible(this.message, this.showMessage)) {\n        this._descByIds = messageId;\n      } else {\n        this._descByIds = placeholderId;\n      }\n      this.initialized = false;\n    }\n  }\n\n  @Watch(\"_id\")\n  @Watch(\"initialized\")\n  watch0() {\n    this.watch0Fn();\n  }\n\n  watch1Fn() {\n    this._value = this.value;\n  }\n\n  @Watch(\"value\")\n  watch1() {\n    this.watch1Fn();\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-select\");\n    this.initialized = true;\n    const mId = this.id ?? `select-${uuid()}`;\n    this._id = mId;\n    this._messageId = mId + DEFAULT_MESSAGE_ID_SUFFIX;\n    this._validMessageId = mId + DEFAULT_VALID_MESSAGE_ID_SUFFIX;\n    this._invalidMessageId = mId + DEFAULT_INVALID_MESSAGE_ID_SUFFIX;\n    this._placeholderId = mId + DEFAULT_PLACEHOLDER_ID_SUFFIX;\n    this.watch0Fn();\n    this.watch1Fn();\n  }\n\n  render() {\n    return (\n      <div\n        class={cls(\"db-select\", this.className)}\n        data-variant={this.variant}\n        data-hide-label={getHideProp(this.showLabel)}\n        data-icon={this.icon}\n        data-hide-icon={getHideProp(this.showIcon)}\n      >\n        <label htmlFor={this._id}>{this.label ?? DEFAULT_LABEL}</label>\n        <select\n          aria-invalid={this.validation === \"invalid\"}\n          data-custom-validity={this.validation}\n          ref={(el: any) => {\n            this._ref = el;\n          }}\n          required={this.required}\n          disabled={this.disabled}\n          id={this._id}\n          name={this.name}\n          size={this.size}\n          /* @ts-ignore */\nvalue={this.value ?? this._value}\n          autocomplete={this.autocomplete}\n          onInput={(event) => this.handleInput(event)}\n          onClick={(event) => this.handleClick(event)}\n          onChange={(event) => this.handleChange(event)}\n          onBlur={(event) => this.handleBlur(event)}\n          onFocus={(event) => this.handleFocus(event)}\n          aria-describedby={this._descByIds}\n        >\n          <option hidden={true}></option>\n          {this.options\n            ? this.options?.map((option) => (\n                <Fragment>\n                  {option.options ? (\n                    <optgroup label={this.getOptionLabel(option)}>\n                      {option.options?.map((optgroupOption) => (\n                        <option\n                          key={optgroupOption.value.toString()}\n                          value={optgroupOption.value}\n                          selected={optgroupOption.selected}\n                          disabled={optgroupOption.disabled}\n                        >\n                          {this.getOptionLabel(optgroupOption)}\n                        </option>\n                      ))}\n                    </optgroup>\n                  ) : null}\n                  {!option.options ? (\n                    <option\n                      value={option.value}\n                      disabled={option.disabled}\n                      selected={option.selected}\n                    >\n                      {this.getOptionLabel(option)}\n                    </option>\n                  ) : null}\n                </Fragment>\n              ))\n            : null}\n          <slot></slot>\n        </select>\n        <span id={this._placeholderId}>{this.placeholder ?? this.label}</span>\n        {stringPropVisible(this.message, this.showMessage) ? (\n          <db-infotext\n            size=\"small\"\n            icon={this.messageIcon}\n            id={this._messageId}\n          >\n            {this.message}\n          </db-infotext>\n        ) : null}\n        <db-infotext\n          size=\"small\"\n          semantic=\"successful\"\n          id={this._validMessageId}\n        >\n          {this.validMessage ?? DEFAULT_VALID_MESSAGE}\n        </db-infotext>\n        <db-infotext\n          size=\"small\"\n          semantic=\"critical\"\n          id={this._invalidMessageId}\n        >\n          {this.invalidMessage ??\n            this._ref?.validationMessage ??\n            DEFAULT_INVALID_MESSAGE}\n        </db-infotext>\n        <span data-visually-hidden=\"true\" role=\"status\">\n          {this._voiceOverFallback}\n        </span>\n      </div>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/db-stack.entry.js

@@ -1,5 +1,5 @@
-import { r as registerInstance, h } from './index-5be50117.js';
-import { c as cls, g as getBooleanAsString } from './index-7d31752e.js';
+import { r as registerInstance, h } from './index-D-D8lQAG.js';
+import { g as getBooleanAsString, c as cls } from './index-BJJmGwiD.js';
 
 const DBStack = class {
     constructor(hostRef) {
@@ -48,5 +48,6 @@ const DBStack = class {
 };
 
 export { DBStack as db_stack };
+//# sourceMappingURL=db-stack.entry.js.map
 
 //# sourceMappingURL=db-stack.entry.js.map

package/dist/esm/db-stack.entry.js.map

@@ -1 +1 @@
-{"file":"db-stack.entry.js","mappings":";;;MAaa,OAAO;;;;;;;;;IAiBV,sBAAsB,CAC5B,OAA2B,EAC3B,qBAA6B;QAE7B,MAAM,MAAM,GAAG,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,CAAC,qBAAqB,CAAC,CAAC;QACvD,IAAI,OAAO,IAAI,MAAM,EAAE;YACrB,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU,CAAC;YACrC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,UAAU,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBAC1C,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;gBAChC,IACE,IAAI;qBACH,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,EAChE;oBACA,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;oBAC5C,MAAM,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;iBACnC;gBACD,IAAI,IAAI,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;oBACjC,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC;oBACvD,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC;oBACxD,MAAM,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;oBACnD,OAAO,CAAC,YAAY,CAClB,IAAI,CAAC,IAAI,EACT,GAAG,YAAY,GAAG,GAAG,YAAY,GAAG,GAAG,EAAE,GAAG,KAAK,EAAE,CACpD,CAAC;oBACF,IAAI,cAAc,EAAE;;wBAElB,MAAM,CAAC,YAAY,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC;qBAC1C;yBAAM;wBACL,MAAM,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;qBACnC;iBACF;aACF;SACF;KACF;IAED,gBAAgB;QACd,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;KACpD;IAED,MAAM;QACJ,QACE,4DACE,KAAK,EAAE,GAAG,CAAC,UAAU,EAAE,IAAI,CAAC,SAAS,CAAC,EACtC,GAAG,EAAE,CAAC,EAAO;gBACX,IAAI,CAAC,IAAI,GAAG,EAAE,CAAC;aAChB,EACD,EAAE,EAAE,IAAI,CAAC,EAAE,cACD,IAAI,CAAC,GAAG,kBACJ,IAAI,CAAC,OAAO,oBACV,IAAI,CAAC,SAAS,oBACd,IAAI,CAAC,SAAS,0BACR,IAAI,CAAC,cAAc,eAC9B,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,IAExC,8DAAa,CACT,EACN;KACH;;;;;","names":[],"sources":["src/components/stack/stack.tsx"],"sourcesContent":["import { DBStackProps, DBStackState } from \"./model\";\nimport { cls, getBooleanAsString } from \"../../utils\";\n\nimport { Component, h, Fragment, Prop } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n  tag: \"db-stack\",\n})\nexport class DBStack {\n  private _ref!: HTMLDivElement | null;\n  @Prop() id: DBStackProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBStackProps[\"className\"];\n  @Prop() gap: DBStackProps[\"gap\"];\n  @Prop() variant: DBStackProps[\"variant\"];\n  @Prop() direction: DBStackProps[\"direction\"];\n  @Prop() alignment: DBStackProps[\"alignment\"];\n  @Prop() justifyContent: DBStackProps[\"justifyContent\"];\n  @Prop() wrap: DBStackProps[\"wrap\"];\n\n\n  /**\n   * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n   * @param element  the ref for the component\n   * @param customElementSelector  the custom element like `my-component`\n   */\n  private enableAttributePassing(\n    element: HTMLElement | null,\n    customElementSelector: string\n  ) {\n    const parent = element?.closest(customElementSelector);\n    if (element && parent) {\n      const attributes = parent.attributes;\n      for (let i = 0; i < attributes.length; i++) {\n        const attr = attributes.item(i);\n        if (\n          attr &&\n          (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n        ) {\n          element.setAttribute(attr.name, attr.value);\n          parent.removeAttribute(attr.name);\n        }\n        if (attr && attr.name === \"class\") {\n          const isWebComponent = attr.value.includes(\"hydrated\");\n          const value = attr.value.replace(\"hydrated\", \"\").trim();\n          const currentClass = element.getAttribute(\"class\");\n          element.setAttribute(\n            attr.name,\n            `${currentClass ? `${currentClass} ` : \"\"}${value}`\n          );\n          if (isWebComponent) {\n            // Stencil is using this class for lazy loading component\n            parent.setAttribute(\"class\", \"hydrated\");\n          } else {\n            parent.removeAttribute(attr.name);\n          }\n        }\n      }\n    }\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-stack\");\n  }\n\n  render() {\n    return (\n      <div\n        class={cls(\"db-stack\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        data-gap={this.gap}\n        data-variant={this.variant}\n        data-direction={this.direction}\n        data-alignment={this.alignment}\n        data-justify-content={this.justifyContent}\n        data-wrap={getBooleanAsString(this.wrap)}\n      >\n        <slot></slot>\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"version":3,"file":"db-stack.entry.js","sources":["src/components/stack/stack.tsx"],"sourcesContent":["import { DBStackProps, DBStackState } from \"./model\";\nimport { cls, getBooleanAsString } from \"../../utils\";\n\nimport { Component, h, Fragment, Prop } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n  tag: \"db-stack\",\n})\nexport class DBStack {\n  private _ref!: HTMLDivElement | null;\n  @Prop() id: DBStackProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBStackProps[\"className\"];\n  @Prop() gap: DBStackProps[\"gap\"];\n  @Prop() variant: DBStackProps[\"variant\"];\n  @Prop() direction: DBStackProps[\"direction\"];\n  @Prop() alignment: DBStackProps[\"alignment\"];\n  @Prop() justifyContent: DBStackProps[\"justifyContent\"];\n  @Prop() wrap: DBStackProps[\"wrap\"];\n\n\n  /**\n   * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n   * @param element  the ref for the component\n   * @param customElementSelector  the custom element like `my-component`\n   */\n  private enableAttributePassing(\n    element: HTMLElement | null,\n    customElementSelector: string\n  ) {\n    const parent = element?.closest(customElementSelector);\n    if (element && parent) {\n      const attributes = parent.attributes;\n      for (let i = 0; i < attributes.length; i++) {\n        const attr = attributes.item(i);\n        if (\n          attr &&\n          (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n        ) {\n          element.setAttribute(attr.name, attr.value);\n          parent.removeAttribute(attr.name);\n        }\n        if (attr && attr.name === \"class\") {\n          const isWebComponent = attr.value.includes(\"hydrated\");\n          const value = attr.value.replace(\"hydrated\", \"\").trim();\n          const currentClass = element.getAttribute(\"class\");\n          element.setAttribute(\n            attr.name,\n            `${currentClass ? `${currentClass} ` : \"\"}${value}`\n          );\n          if (isWebComponent) {\n            // Stencil is using this class for lazy loading component\n            parent.setAttribute(\"class\", \"hydrated\");\n          } else {\n            parent.removeAttribute(attr.name);\n          }\n        }\n      }\n    }\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-stack\");\n  }\n\n  render() {\n    return (\n      <div\n        class={cls(\"db-stack\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        data-gap={this.gap}\n        data-variant={this.variant}\n        data-direction={this.direction}\n        data-alignment={this.alignment}\n        data-justify-content={this.justifyContent}\n        data-wrap={getBooleanAsString(this.wrap)}\n      >\n        <slot></slot>\n      </div>\n    );\n  }\n}\n"],"names":[],"mappings":";;;MAaa,OAAO,GAAA,MAAA;;;;AAYlB;;;;AAIG;IACK,sBAAsB,CAC5B,OAA2B,EAC3B,qBAA6B,EAAA;QAE7B,MAAM,MAAM,GAAG,OAAO,KAAA,IAAA,IAAP,OAAO,KAAA,MAAA,GAAA,MAAA,GAAP,OAAO,CAAE,OAAO,CAAC,qBAAqB,CAAC;AACtD,QAAA,IAAI,OAAO,IAAI,MAAM,EAAE;AACrB,YAAA,MAAM,UAAU,GAAG,MAAM,CAAC,UAAU;AACpC,YAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,UAAU,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;gBAC1C,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC;AAC/B,gBAAA,IACE,IAAI;AACJ,qBAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,EAChE;oBACA,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC;AAC3C,oBAAA,MAAM,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC;;gBAEnC,IAAI,IAAI,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;oBACjC,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,UAAU,CAAC;AACtD,oBAAA,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,IAAI,EAAE;oBACvD,MAAM,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC;oBAClD,OAAO,CAAC,YAAY,CAClB,IAAI,CAAC,IAAI,EACT,CAAG,EAAA,YAAY,GAAG,CAAG,EAAA,YAAY,CAAG,CAAA,CAAA,GAAG,EAAE,CAAG,EAAA,KAAK,CAAE,CAAA,CACpD;oBACD,IAAI,cAAc,EAAE;;AAElB,wBAAA,MAAM,CAAC,YAAY,CAAC,OAAO,EAAE,UAAU,CAAC;;yBACnC;AACL,wBAAA,MAAM,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC;;;;;;IAO3C,gBAAgB,GAAA;QACd,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,EAAE,UAAU,CAAC;;IAGpD,MAAM,GAAA;QACJ,QACE,CACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,GAAG,CAAC,UAAU,EAAE,IAAI,CAAC,SAAS,CAAC,EACtC,GAAG,EAAE,CAAC,EAAO,KAAI;AACf,gBAAA,IAAI,CAAC,IAAI,GAAG,EAAE;aACf,EACD,EAAE,EAAE,IAAI,CAAC,EAAE,EAAA,UAAA,EACD,IAAI,CAAC,GAAG,EAAA,cAAA,EACJ,IAAI,CAAC,OAAO,EACV,gBAAA,EAAA,IAAI,CAAC,SAAS,EACd,gBAAA,EAAA,IAAI,CAAC,SAAS,0BACR,IAAI,CAAC,cAAc,EAAA,WAAA,EAC9B,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAA,EAExC,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT;;;;;;"}

package/dist/esm/db-switch.entry.js

@@ -1,12 +1,12 @@
-import { r as registerInstance, c as createEvent, h } from './index-5be50117.js';
-import { u as uuid, g as getBooleanAsString, c as cls, j as getHideProp } from './index-7d31752e.js';
+import { r as registerInstance, c as createEvent, h } from './index-D-D8lQAG.js';
+import { u as uuid, g as getBooleanAsString, j as getHideProp, c as cls } from './index-BJJmGwiD.js';
 
 const DBSwitch = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.onChange = createEvent(this, "onChange", 7);
-        this.onBlur = createEvent(this, "onBlur", 7);
-        this.onFocus = createEvent(this, "onFocus", 7);
+        this.onChange = createEvent(this, "onChange");
+        this.onBlur = createEvent(this, "onBlur");
+        this.onFocus = createEvent(this, "onFocus");
         this._id = undefined;
         this._checked = false;
     }
@@ -69,23 +69,31 @@ const DBSwitch = class {
             }
         }
     }
+    watch0Fn() {
+        if (this.checked !== undefined && this.checked !== null) {
+            this._checked = !!this.checked;
+        }
+    }
+    watch0() {
+        this.watch0Fn();
+    }
     componentDidLoad() {
         var _a;
         this.enableAttributePassing(this._ref, "db-switch");
         this._id = (_a = this.id) !== null && _a !== void 0 ? _a : `switch-${uuid()}`;
-    }
-    componentDidUpdate() {
-        if (this.checked !== undefined && this.checked !== null) {
-            this._checked = !!this.checked;
-        }
+        this.watch0Fn();
     }
     render() {
-        return (h("label", { key: '1c301648d509c8d67d02cb96e89b4aed178a648a', class: cls("db-switch", this.className), "data-visual-aid": getBooleanAsString(this.visualAid), "data-size": this.size, "data-hide-label": getHideProp(this.showLabel), "data-emphasis": this.emphasis, htmlFor: this._id }, h("input", { key: '5d5fc24b58aa99e4aaeb83cabe533381c5477528', type: "checkbox", role: "switch", id: this._id, "aria-checked": getBooleanAsString(this._checked), ref: (el) => {
+        return (h("label", { key: 'c63a332044dbee87f648ff1e3ace039cf3dcfecd', class: cls("db-switch", this.className), "data-visual-aid": getBooleanAsString(this.visualAid), "data-size": this.size, "data-hide-label": getHideProp(this.showLabel), "data-emphasis": this.emphasis, htmlFor: this._id }, h("input", { key: '5b9a05962ebab359a84c8c23be52357dfd77df99', type: "checkbox", role: "switch", id: this._id, "aria-checked": getBooleanAsString(this._checked), ref: (el) => {
                 this._ref = el;
             }, checked: this.checked, value: this.value, disabled: this.disabled, "aria-describedby": this.describedbyid, "aria-invalid": this.validation === "invalid", "data-custom-validity": this.validation, name: this.name, required: this.required, "data-aid-icon": this.icon, "data-aid-icon-after": this.iconAfter, onChange: (event) => this.handleChange(event), onBlur: (event) => this.handleBlur(event), onFocus: (event) => this.handleFocus(event) }), this.label ? this.label : h("slot", null)));
     }
+    static get watchers() { return {
+        "checked": ["watch0"]
+    }; }
 };
 
 export { DBSwitch as db_switch };
+//# sourceMappingURL=db-switch.entry.js.map
 
 //# sourceMappingURL=db-switch.entry.js.map

package/dist/esm/db-switch.entry.js.map

@@ -1 +1 @@
-{"file":"db-switch.entry.js","mappings":"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","names":[],"sources":["src/components/switch/switch.tsx"],"sourcesContent":["import { DBSwitchProps, DBSwitchState } from \"./model\";\nimport { cls, getBooleanAsString, getHideProp, uuid } from \"../../utils\";\nimport { ChangeEvent, InteractionEvent } from \"../../shared/model\";\nimport {\n  handleFrameworkEventAngular,\n  handleFrameworkEventVue,\n} from \"../../utils/form-components\";\n\nimport { Component, h, Fragment, Event, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n  tag: \"db-switch\",\n})\nexport class DBSwitch {\n  private _ref!: HTMLInputElement | null;\n  @Prop() id: DBSwitchProps[\"id\"];\n  @Prop() checked: DBSwitchProps[\"checked\"];\n  @Event() onChange: any;\n  @Prop() change: DBSwitchProps[\"change\"];\n  @Event() onBlur: any;\n  @Prop() blur: DBSwitchProps[\"blur\"];\n  @Event() onFocus: any;\n  @Prop() focus: DBSwitchProps[\"focus\"];\n  @Prop() visualAid: DBSwitchProps[\"visualAid\"];\n  @Prop() size: DBSwitchProps[\"size\"];\n  @Prop() showLabel: DBSwitchProps[\"showLabel\"];\n  @Prop() emphasis: DBSwitchProps[\"emphasis\"];\n  @Prop({attribute: \"classname\"}) className: DBSwitchProps[\"className\"];\n  @Prop() value: DBSwitchProps[\"value\"];\n  @Prop() disabled: DBSwitchProps[\"disabled\"];\n  @Prop() describedbyid: DBSwitchProps[\"describedbyid\"];\n  @Prop() validation: DBSwitchProps[\"validation\"];\n  @Prop() name: DBSwitchProps[\"name\"];\n  @Prop() required: DBSwitchProps[\"required\"];\n  @Prop() icon: DBSwitchProps[\"icon\"];\n  @Prop() iconAfter: DBSwitchProps[\"iconAfter\"];\n  @Prop() label: DBSwitchProps[\"label\"];\n\n  @State() _id = undefined;\n  @State() _checked = false;\n\n  handleChange(event: ChangeEvent<HTMLInputElement>) {\n    if (this.onChange) {\n      this.onChange.emit(event);\n    }\n    if (this.change) {\n      this.change(event);\n    }\n\n    // We have different ts types in different frameworks, so we need to use any here\n    this._checked = (event.target as any)?.[\"checked\"];\n  }\n  handleBlur(event: InteractionEvent<HTMLInputElement>) {\n    if (this.onBlur) {\n      this.onBlur.emit(event);\n    }\n    if (this.blur) {\n      this.blur(event);\n    }\n  }\n  handleFocus(event: InteractionEvent<HTMLInputElement>) {\n    if (this.onFocus) {\n      this.onFocus.emit(event);\n    }\n    if (this.focus) {\n      this.focus(event);\n    }\n  }\n\n  /**\n   * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n   * @param element  the ref for the component\n   * @param customElementSelector  the custom element like `my-component`\n   */\n  private enableAttributePassing(\n    element: HTMLInputElement | null,\n    customElementSelector: string\n  ) {\n    const parent = element?.closest(customElementSelector);\n    if (element && parent) {\n      const attributes = parent.attributes;\n      for (let i = 0; i < attributes.length; i++) {\n        const attr = attributes.item(i);\n        if (\n          attr &&\n          (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n        ) {\n          element.setAttribute(attr.name, attr.value);\n          parent.removeAttribute(attr.name);\n        }\n        if (attr && attr.name === \"class\") {\n          const isWebComponent = attr.value.includes(\"hydrated\");\n          const value = attr.value.replace(\"hydrated\", \"\").trim();\n          const currentClass = element.getAttribute(\"class\");\n          element.setAttribute(\n            attr.name,\n            `${currentClass ? `${currentClass} ` : \"\"}${value}`\n          );\n          if (isWebComponent) {\n            // Stencil is using this class for lazy loading component\n            parent.setAttribute(\"class\", \"hydrated\");\n          } else {\n            parent.removeAttribute(attr.name);\n          }\n        }\n      }\n    }\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-switch\");\n    this._id = this.id ?? `switch-${uuid()}`;\n  }\n\n  componentDidUpdate() {\n    if (this.checked !== undefined && this.checked !== null) {\n      this._checked = !!this.checked;\n    }\n  }\n\n  render() {\n    return (\n      <label\n        class={cls(\"db-switch\", this.className)}\n        data-visual-aid={getBooleanAsString(this.visualAid)}\n        data-size={this.size}\n        data-hide-label={getHideProp(this.showLabel)}\n        data-emphasis={this.emphasis}\n        htmlFor={this._id}\n      >\n        <input\n          type=\"checkbox\"\n          role=\"switch\"\n          id={this._id}\n          aria-checked={getBooleanAsString(this._checked)}\n          ref={(el: any) => {\n            this._ref = el;\n          }}\n          checked={this.checked}\n          value={this.value}\n          disabled={this.disabled}\n          aria-describedby={this.describedbyid}\n          aria-invalid={this.validation === \"invalid\"}\n          data-custom-validity={this.validation}\n          name={this.name}\n          required={this.required}\n          data-aid-icon={this.icon}\n          data-aid-icon-after={this.iconAfter}\n          onChange={(event) => this.handleChange(event)}\n          onBlur={(event) => this.handleBlur(event)}\n          onFocus={(event) => this.handleFocus(event)}\n        />\n        {this.label ? this.label : <slot></slot>}\n      </label>\n    );\n  }\n}\n"],"version":3}
+{"version":3,"file":"db-switch.entry.js","sources":["src/components/switch/switch.tsx"],"sourcesContent":["import { DBSwitchProps, DBSwitchState } from \"./model\";\nimport { cls, getBooleanAsString, getHideProp, uuid } from \"../../utils\";\nimport { ChangeEvent, InteractionEvent } from \"../../shared/model\";\nimport {\n  handleFrameworkEventAngular,\n  handleFrameworkEventVue,\n} from \"../../utils/form-components\";\n\nimport {\n  Component,\n  h,\n  Fragment,\n  Watch,\n  Event,\n  Prop,\n  State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n  tag: \"db-switch\",\n})\nexport class DBSwitch {\n  private _ref!: HTMLInputElement | null;\n  @Prop() id: DBSwitchProps[\"id\"];\n  @Prop() checked: DBSwitchProps[\"checked\"];\n  @Event() onChange: any;\n  @Prop() change: DBSwitchProps[\"change\"];\n  @Event() onBlur: any;\n  @Prop() blur: DBSwitchProps[\"blur\"];\n  @Event() onFocus: any;\n  @Prop() focus: DBSwitchProps[\"focus\"];\n  @Prop() visualAid: DBSwitchProps[\"visualAid\"];\n  @Prop() size: DBSwitchProps[\"size\"];\n  @Prop() showLabel: DBSwitchProps[\"showLabel\"];\n  @Prop() emphasis: DBSwitchProps[\"emphasis\"];\n  @Prop({attribute: \"classname\"}) className: DBSwitchProps[\"className\"];\n  @Prop() value: DBSwitchProps[\"value\"];\n  @Prop() disabled: DBSwitchProps[\"disabled\"];\n  @Prop() describedbyid: DBSwitchProps[\"describedbyid\"];\n  @Prop() validation: DBSwitchProps[\"validation\"];\n  @Prop() name: DBSwitchProps[\"name\"];\n  @Prop() required: DBSwitchProps[\"required\"];\n  @Prop() icon: DBSwitchProps[\"icon\"];\n  @Prop() iconAfter: DBSwitchProps[\"iconAfter\"];\n  @Prop() label: DBSwitchProps[\"label\"];\n\n  @State() _id = undefined;\n  @State() _checked = false;\n\n  handleChange(event: ChangeEvent<HTMLInputElement>) {\n    if (this.onChange) {\n      this.onChange.emit(event);\n    }\n    if (this.change) {\n      this.change(event);\n    }\n\n    // We have different ts types in different frameworks, so we need to use any here\n    this._checked = (event.target as any)?.[\"checked\"];\n  }\n  handleBlur(event: InteractionEvent<HTMLInputElement>) {\n    if (this.onBlur) {\n      this.onBlur.emit(event);\n    }\n    if (this.blur) {\n      this.blur(event);\n    }\n  }\n  handleFocus(event: InteractionEvent<HTMLInputElement>) {\n    if (this.onFocus) {\n      this.onFocus.emit(event);\n    }\n    if (this.focus) {\n      this.focus(event);\n    }\n  }\n\n  /**\n   * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n   * @param element  the ref for the component\n   * @param customElementSelector  the custom element like `my-component`\n   */\n  private enableAttributePassing(\n    element: HTMLInputElement | null,\n    customElementSelector: string\n  ) {\n    const parent = element?.closest(customElementSelector);\n    if (element && parent) {\n      const attributes = parent.attributes;\n      for (let i = 0; i < attributes.length; i++) {\n        const attr = attributes.item(i);\n        if (\n          attr &&\n          (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n        ) {\n          element.setAttribute(attr.name, attr.value);\n          parent.removeAttribute(attr.name);\n        }\n        if (attr && attr.name === \"class\") {\n          const isWebComponent = attr.value.includes(\"hydrated\");\n          const value = attr.value.replace(\"hydrated\", \"\").trim();\n          const currentClass = element.getAttribute(\"class\");\n          element.setAttribute(\n            attr.name,\n            `${currentClass ? `${currentClass} ` : \"\"}${value}`\n          );\n          if (isWebComponent) {\n            // Stencil is using this class for lazy loading component\n            parent.setAttribute(\"class\", \"hydrated\");\n          } else {\n            parent.removeAttribute(attr.name);\n          }\n        }\n      }\n    }\n  }\n\n  watch0Fn() {\n    if (this.checked !== undefined && this.checked !== null) {\n      this._checked = !!this.checked;\n    }\n  }\n\n  @Watch(\"checked\")\n  watch0() {\n    this.watch0Fn();\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-switch\");\n    this._id = this.id ?? `switch-${uuid()}`;\n    this.watch0Fn();\n  }\n\n  render() {\n    return (\n      <label\n        class={cls(\"db-switch\", this.className)}\n        data-visual-aid={getBooleanAsString(this.visualAid)}\n        data-size={this.size}\n        data-hide-label={getHideProp(this.showLabel)}\n        data-emphasis={this.emphasis}\n        htmlFor={this._id}\n      >\n        <input\n          type=\"checkbox\"\n          role=\"switch\"\n          id={this._id}\n          aria-checked={getBooleanAsString(this._checked)}\n          ref={(el: any) => {\n            this._ref = el;\n          }}\n          checked={this.checked}\n          value={this.value}\n          disabled={this.disabled}\n          aria-describedby={this.describedbyid}\n          aria-invalid={this.validation === \"invalid\"}\n          data-custom-validity={this.validation}\n          name={this.name}\n          required={this.required}\n          data-aid-icon={this.icon}\n          data-aid-icon-after={this.iconAfter}\n          onChange={(event) => this.handleChange(event)}\n          onBlur={(event) => this.handleBlur(event)}\n          onFocus={(event) => this.handleFocus(event)}\n        />\n        {this.label ? this.label : <slot></slot>}\n      </label>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/db-tab-item.db-tab-list.db-tab-panel.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"db-tab-item.db-tab-list.db-tab-panel.entry.js","sources":["src/components/tab-item/tab-item.tsx","src/components/tab-list/tab-list.tsx","src/components/tab-panel/tab-panel.tsx"],"sourcesContent":["import type { DBTabItemProps, DBTabItemState } from \"./model\";\nimport { cls, getBooleanAsString, getHideProp } from \"../../utils\";\nimport {\n  handleFrameworkEventAngular,\n  handleFrameworkEventVue,\n} from \"../../utils/form-components\";\n\nimport {\n  Component,\n  h,\n  Fragment,\n  Watch,\n  Event,\n  Prop,\n  State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n  tag: \"db-tab-item\",\n})\nexport class DBTabItem {\n  private _ref!: HTMLInputElement | null;\n  @Prop() active: DBTabItemProps[\"active\"];\n  @Event() onChange: any;\n  @Prop() change: DBTabItemProps[\"change\"];\n  @Prop({attribute: \"classname\"}) className: DBTabItemProps[\"className\"];\n  @Prop() id: DBTabItemProps[\"id\"];\n  @Prop() icon: DBTabItemProps[\"icon\"];\n  @Prop() iconAfter: DBTabItemProps[\"iconAfter\"];\n  @Prop() showIcon: DBTabItemProps[\"showIcon\"];\n  @Prop() noText: DBTabItemProps[\"noText\"];\n  @Prop() disabled: DBTabItemProps[\"disabled\"];\n  @Prop() controls: DBTabItemProps[\"controls\"];\n  @Prop() checked: DBTabItemProps[\"checked\"];\n  @Prop() label: DBTabItemProps[\"label\"];\n\n  @State() initialized = false;\n  @State() _selected = false;\n\n  handleChange(event: any) {\n    if (this.onChange) {\n      this.onChange.emit(event);\n    }\n    if (this.change) {\n      this.change(event);\n    }\n\n    // We have different ts types in different frameworks, so we need to use any here\n\n    const selected = (event.target as any)?.[\"checked\"];\n    this._selected = getBooleanAsString(selected);\n  }\n\n  /**\n   * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n   * @param element  the ref for the component\n   * @param customElementSelector  the custom element like `my-component`\n   */\n  private enableAttributePassing(\n    element: HTMLElement | null,\n    customElementSelector: string\n  ) {\n    const parent = element?.closest(customElementSelector);\n    if (element && parent) {\n      const attributes = parent.attributes;\n      for (let i = 0; i < attributes.length; i++) {\n        const attr = attributes.item(i);\n        if (\n          attr &&\n          (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n        ) {\n          element.setAttribute(attr.name, attr.value);\n          parent.removeAttribute(attr.name);\n        }\n        if (attr && attr.name === \"class\") {\n          const isWebComponent = attr.value.includes(\"hydrated\");\n          const value = attr.value.replace(\"hydrated\", \"\").trim();\n          const currentClass = element.getAttribute(\"class\");\n          element.setAttribute(\n            attr.name,\n            `${currentClass ? `${currentClass} ` : \"\"}${value}`\n          );\n          if (isWebComponent) {\n            // Stencil is using this class for lazy loading component\n            parent.setAttribute(\"class\", \"hydrated\");\n          } else {\n            parent.removeAttribute(attr.name);\n          }\n        }\n      }\n    }\n  }\n\n  watch0Fn() {\n    if (this.active && this.initialized && this._ref) {\n      this._ref.click();\n      this.initialized = false;\n    }\n  }\n\n  @Watch(\"_ref\")\n  @Watch(\"initialized\")\n  watch0() {\n    this.watch0Fn();\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-tab-item\");\n    this.initialized = true;\n    this.watch0Fn();\n  }\n\n  render() {\n    return (\n      <li class={cls(\"db-tab-item\", this.className)} role=\"none\">\n        <label\n          htmlFor={this.id}\n          data-icon={this.icon}\n          data-icon-after={this.iconAfter}\n          data-hide-icon={getHideProp(this.showIcon)}\n          data-hide-icon-after={getHideProp(this.showIcon)}\n          data-no-text={this.noText}\n        >\n          <input\n            type=\"radio\"\n            role=\"tab\"\n            disabled={this.disabled}\n            aria-selected={this._selected}\n            aria-controls={this.controls}\n            checked={this.checked}\n            ref={(el: any) => {\n              this._ref = el;\n            }}\n            id={this.id}\n            onChange={(event) => this.handleChange(event)}\n          />\n          {this.label ? this.label : null}\n          <slot></slot>\n        </label>\n      </li>\n    );\n  }\n}\n","import { DBTabListProps, DBTabListState } from \"./model\";\nimport { cls, uuid } from \"../../utils\";\nimport { DEFAULT_ID } from \"../../shared/constants\";\n\nimport { Component, h, Fragment, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n  tag: \"db-tab-list\",\n})\nexport class DBTabList {\n  private _ref!: HTMLDivElement | null;\n  @Prop() id: DBTabListProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBTabListProps[\"className\"];\n\n  @State() _id = DEFAULT_ID;\n\n  /**\n   * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n   * @param element  the ref for the component\n   * @param customElementSelector  the custom element like `my-component`\n   */\n  private enableAttributePassing(\n    element: HTMLElement | null,\n    customElementSelector: string\n  ) {\n    const parent = element?.closest(customElementSelector);\n    if (element && parent) {\n      const attributes = parent.attributes;\n      for (let i = 0; i < attributes.length; i++) {\n        const attr = attributes.item(i);\n        if (\n          attr &&\n          (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n        ) {\n          element.setAttribute(attr.name, attr.value);\n          parent.removeAttribute(attr.name);\n        }\n        if (attr && attr.name === \"class\") {\n          const isWebComponent = attr.value.includes(\"hydrated\");\n          const value = attr.value.replace(\"hydrated\", \"\").trim();\n          const currentClass = element.getAttribute(\"class\");\n          element.setAttribute(\n            attr.name,\n            `${currentClass ? `${currentClass} ` : \"\"}${value}`\n          );\n          if (isWebComponent) {\n            // Stencil is using this class for lazy loading component\n            parent.setAttribute(\"class\", \"hydrated\");\n          } else {\n            parent.removeAttribute(attr.name);\n          }\n        }\n      }\n    }\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-tab-list\");\n    this._id = this.id || \"tab-list-\" + uuid();\n  }\n\n  render() {\n    return (\n      <div\n        class={cls(\"db-tab-list\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this._id}\n      >\n        <ul role=\"tablist\">\n          <slot></slot>\n        </ul>\n      </div>\n    );\n  }\n}\n","import { DBTabPanelProps, DBTabPanelState } from \"./model\";\nimport { cls } from \"../../utils\";\n\nimport { Component, h, Fragment, Prop } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n\n */\n @Component({\n  tag: \"db-tab-panel\",\n})\nexport class DBTabPanel {\n  private _ref!: HTMLDivElement | null;\n  @Prop({attribute: \"classname\"}) className: DBTabPanelProps[\"className\"];\n  @Prop() id: DBTabPanelProps[\"id\"];\n  @Prop() labelledBy: DBTabPanelProps[\"labelledBy\"];\n  @Prop() content: DBTabPanelProps[\"content\"];\n\n\n  /**\n   * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.\n   * @param element  the ref for the component\n   * @param customElementSelector  the custom element like `my-component`\n   */\n  private enableAttributePassing(\n    element: HTMLElement | null,\n    customElementSelector: string\n  ) {\n    const parent = element?.closest(customElementSelector);\n    if (element && parent) {\n      const attributes = parent.attributes;\n      for (let i = 0; i < attributes.length; i++) {\n        const attr = attributes.item(i);\n        if (\n          attr &&\n          (attr.name.startsWith(\"data-\") || attr.name.startsWith(\"aria-\"))\n        ) {\n          element.setAttribute(attr.name, attr.value);\n          parent.removeAttribute(attr.name);\n        }\n        if (attr && attr.name === \"class\") {\n          const isWebComponent = attr.value.includes(\"hydrated\");\n          const value = attr.value.replace(\"hydrated\", \"\").trim();\n          const currentClass = element.getAttribute(\"class\");\n          element.setAttribute(\n            attr.name,\n            `${currentClass ? `${currentClass} ` : \"\"}${value}`\n          );\n          if (isWebComponent) {\n            // Stencil is using this class for lazy loading component\n            parent.setAttribute(\"class\", \"hydrated\");\n          } else {\n            parent.removeAttribute(attr.name);\n          }\n        }\n      }\n    }\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-tab-panel\");\n  }\n\n  render() {\n    return (\n      <section\n        class={cls(\"db-tab-panel\", this.className)}\n        role=\"tabpanel\"\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        aria-labelledby={this.labelledBy}\n      >\n        {this.content ? this.content : null}\n        <slot></slot>\n      </section>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/db-tab-item_3.entry.js

@@ -1,11 +1,11 @@
-import { r as registerInstance, c as createEvent, h } from './index-5be50117.js';
-import { g as getBooleanAsString, j as getHideProp, c as cls, u as uuid } from './index-7d31752e.js';
-import { D as DEFAULT_ID } from './constants-745cf8d7.js';
+import { r as registerInstance, c as createEvent, h } from './index-D-D8lQAG.js';
+import { g as getBooleanAsString, j as getHideProp, c as cls, u as uuid } from './index-BJJmGwiD.js';
+import { D as DEFAULT_ID } from './constants-CNj9Jn9q.js';
 
 const DBTabItem = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.onChange = createEvent(this, "onChange", 7);
+        this.onChange = createEvent(this, "onChange");
         this.initialized = false;
         this._selected = false;
     }
@@ -53,21 +53,29 @@ const DBTabItem = class {
             }
         }
     }
-    componentDidLoad() {
-        this.enableAttributePassing(this._ref, "db-tab-item");
-        this.initialized = true;
-    }
-    componentDidUpdate() {
+    watch0Fn() {
         if (this.active && this.initialized && this._ref) {
             this._ref.click();
             this.initialized = false;
         }
     }
+    watch0() {
+        this.watch0Fn();
+    }
+    componentDidLoad() {
+        this.enableAttributePassing(this._ref, "db-tab-item");
+        this.initialized = true;
+        this.watch0Fn();
+    }
     render() {
-        return (h("li", { key: 'b74836903d6f4fb378dfefe400c4ee90e87e81b6', class: cls("db-tab-item", this.className), role: "none" }, h("label", { key: 'd54e0cdf202b70a2184ad29adac3a5b7aac1cce0', htmlFor: this.id, "data-icon": this.icon, "data-icon-after": this.iconAfter, "data-hide-icon": getHideProp(this.showIcon), "data-hide-icon-after": getHideProp(this.showIcon), "data-no-text": this.noText }, h("input", { key: '40dc63d4f0c756b8900917f0d216d005874303a2', type: "radio", role: "tab", disabled: this.disabled, "aria-selected": this._selected, "aria-controls": this.controls, checked: this.checked, ref: (el) => {
+        return (h("li", { key: 'd0b4aa3cc63c20c3ca1c6e8b988baa2053094cf0', class: cls("db-tab-item", this.className), role: "none" }, h("label", { key: '2202177cd76e682a3bbb5d08516cc6ce60fca1cf', htmlFor: this.id, "data-icon": this.icon, "data-icon-after": this.iconAfter, "data-hide-icon": getHideProp(this.showIcon), "data-hide-icon-after": getHideProp(this.showIcon), "data-no-text": this.noText }, h("input", { key: '0ad9f2eebc5294546206a989dcdd62f3f0a9937c', type: "radio", role: "tab", disabled: this.disabled, "aria-selected": this._selected, "aria-controls": this.controls, checked: this.checked, ref: (el) => {
                 this._ref = el;
-            }, id: this.id, onChange: (event) => this.handleChange(event) }), this.label ? this.label : null, h("slot", { key: '3ef8b94926e52b17980f663487887b41f03f6b10' }))));
+            }, id: this.id, onChange: (event) => this.handleChange(event) }), this.label ? this.label : null, h("slot", { key: '785dff862d5181b7202d27d22c69e40208571aea' }))));
     }
+    static get watchers() { return {
+        "_ref": ["watch0"],
+        "initialized": ["watch0"]
+    }; }
 };
 
 const DBTabList = class {
@@ -165,5 +173,6 @@ const DBTabPanel = class {
 };
 
 export { DBTabItem as db_tab_item, DBTabList as db_tab_list, DBTabPanel as db_tab_panel };
+//# sourceMappingURL=db-tab-item.db-tab-list.db-tab-panel.entry.js.map
 
 //# sourceMappingURL=db-tab-item_3.entry.js.map