@db-ux/wc-core-components 2.0.0-0-custom-select-16b8cce → 2.0.0

package/dist/cjs/db-navigation-item.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"db-navigation-item.entry.cjs.js","mappings":"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","names":["uuid","isEventTargetNavigationItem","delay","NavigationItemSafeTriangle","h","cls","getHideProp","getBooleanAsString","Fragment","DEFAULT_BACK"],"sources":["src/components/navigation-item/navigation-item.tsx"],"sourcesContent":["import { DBNavigationItemProps, DBNavigationItemState } from \"./model\";\nimport { DBButton } from \"../button/button\";\nimport { cls, delay, getBooleanAsString, getHideProp, uuid } from \"../../utils\";\nimport {\n  isEventTargetNavigationItem,\n  NavigationItemSafeTriangle,\n} from \"../../utils/navigation\";\nimport { DEFAULT_BACK } from \"../../shared/constants\";\nimport { ClickEvent } from \"../../shared/model\";\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 * @slot subNavigation - TODO: Add description for slotSubNavigation\n */\n @Component({\n  tag: \"db-navigation-item\",\n})\nexport class DBNavigationItem {\n  private _ref!: HTMLLIElement | null;\n  @Prop() subNavigationExpanded: DBNavigationItemProps[\"subNavigationExpanded\"];\n  @Event() onClick: any;\n  @Prop() id: DBNavigationItemProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBNavigationItemProps[\"className\"];\n  @Prop() width: DBNavigationItemProps[\"width\"];\n  @Prop() icon: DBNavigationItemProps[\"icon\"];\n  @Prop() showIcon: DBNavigationItemProps[\"showIcon\"];\n  @Prop() active: DBNavigationItemProps[\"active\"];\n  @Prop() disabled: DBNavigationItemProps[\"disabled\"];\n  @Prop() text: DBNavigationItemProps[\"text\"];\n\n  @Prop() backButtonId: DBNavigationItemProps[\"backButtonId\"];\n  @Prop() backButtonText: DBNavigationItemProps[\"backButtonText\"];\n  @State() initialized = false;\n  @State() hasAreaPopup = false;\n  @State() hasSubNavigation = true;\n  @State() isSubNavigationExpanded = false;\n  @State() autoClose = false;\n  @State() subNavigationId = \"sub-navigation-\" + uuid();\n  @State() navigationItemSafeTriangle = undefined;\n\n  handleNavigationItemClick(event: unknown) {\n    if (isEventTargetNavigationItem(event)) {\n      this.autoClose = true;\n      delay(() => {\n        this.autoClose = false;\n      }, 300);\n    }\n  }\n  handleClick(event: ClickEvent<HTMLButtonElement>) {\n    if (this.onClick) {\n      this.onClick.emit(event);\n    }\n    if (this.hasAreaPopup) {\n      this.isSubNavigationExpanded = true;\n    }\n  }\n  handleBackClick(event: ClickEvent<HTMLButtonElement>) {\n    event.stopPropagation();\n    this.isSubNavigationExpanded = false;\n  }\n  updateSubNavigationState() {\n    if (this.initialized && document && this.subNavigationId) {\n      const subNavigationSlot = document?.getElementById(\n        this.subNavigationId\n      ) as HTMLMenuElement;\n      if (subNavigationSlot) {\n        if (subNavigationSlot.children?.length > 0) {\n          this.hasAreaPopup = true;\n          if (!this.navigationItemSafeTriangle) {\n            this.navigationItemSafeTriangle = new NavigationItemSafeTriangle(\n              this._ref,\n              subNavigationSlot\n            );\n          }\n        } else {\n          this.hasSubNavigation = false;\n        }\n      }\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: 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.subNavigationExpanded !== undefined) {\n      this.isSubNavigationExpanded = !!this.subNavigationExpanded;\n    }\n  }\n\n  @Watch(\"subNavigationExpanded\")\n  watch0() {\n    this.watch0Fn();\n  }\n\n  watch1Fn() {\n    this.updateSubNavigationState();\n  }\n\n  @Watch(\"initialized\")\n  watch1() {\n    this.watch1Fn();\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-navigation-item\");\n    this.initialized = true;\n    this.watch0Fn();\n    this.watch1Fn();\n  }\n\n  render() {\n    return (\n      <li\n        class={cls(\"db-navigation-item\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        onMouseOver={() => this.navigationItemSafeTriangle?.enableFollow()}\n        onMouseLeave={() => this.navigationItemSafeTriangle?.disableFollow()}\n        onMouseMove={(event) =>\n          this.navigationItemSafeTriangle?.followByMouseEvent(event)\n        }\n        data-width={this.width}\n        data-icon={this.icon}\n        data-hide-icon={getHideProp(this.showIcon)}\n        data-active={this.active}\n        aria-disabled={getBooleanAsString(this.disabled)}\n      >\n        {!this.hasSubNavigation ? this.text ? this.text : <slot></slot> : null}\n        {this.hasSubNavigation ? (\n          <Fragment>\n            <button\n              class=\"db-navigation-item-expand-button\"\n              aria-haspopup={this.hasAreaPopup}\n              aria-expanded={this.isSubNavigationExpanded}\n              disabled={this.disabled}\n              onClick={(event) => this.handleClick(event)}\n            >\n              {this.text ? this.text : <slot></slot>}\n            </button>\n            <menu\n              class=\"db-sub-navigation\"\n              data-auto-close={this.autoClose}\n              id={this.subNavigationId}\n              onClick={(event) => this.handleNavigationItemClick(event)}\n            >\n              {this.hasAreaPopup ? (\n                <div class=\"db-mobile-navigation-back\">\n                  <db-button\n                    icon=\"arrow_left\"\n                    variant=\"ghost\"\n                    id={this.backButtonId}\n                    onClick={(event) => this.handleBackClick(event)}\n                  >\n                    {this.backButtonText ?? DEFAULT_BACK}\n                  </db-button>\n                </div>\n              ) : null}\n              <slot name=\"subNavigation\"></slot>\n            </menu>\n          </Fragment>\n        ) : null}\n      </li>\n    );\n  }\n}\n"],"version":3}
+{"file":"db-navigation-item.entry.cjs.js","mappings":"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","names":["uuid","isEventTargetNavigationItem","delay","getBoolean","NavigationItemSafeTriangle","h","cls","getHideProp","getBooleanAsString","Fragment","DEFAULT_BACK"],"sources":["src/components/navigation-item/navigation-item.tsx"],"sourcesContent":["import { DBNavigationItemProps, DBNavigationItemState } from \"./model\";\nimport { DBButton } from \"../button/button\";\nimport {\n  cls,\n  delay,\n  getBoolean,\n  getBooleanAsString,\n  getHideProp,\n  uuid,\n} from \"../../utils\";\nimport {\n  isEventTargetNavigationItem,\n  NavigationItemSafeTriangle,\n} from \"../../utils/navigation\";\nimport { DEFAULT_BACK } from \"../../shared/constants\";\nimport { ClickEvent } from \"../../shared/model\";\n\nimport {\n  Component,\n  h,\n  Fragment,\n  Watch,\n  Event,\n  EventEmitter,\n  Prop,\n  State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot subNavigation - TODO: Add description for slotSubNavigation\n */\n @Component({\n  tag: \"db-navigation-item\",\n})\nexport class DBNavigationItem {\n  private _ref!: HTMLLIElement | any;\n  @Prop() subNavigationExpanded: DBNavigationItemProps[\"subNavigationExpanded\"];\n  @Event() click: EventEmitter<\n    Parameters<Required<DBNavigationItemProps>[\"onClick\"]>[number]\n  > | void;\n  @Prop() id: DBNavigationItemProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBNavigationItemProps[\"className\"];\n  @Prop() width: DBNavigationItemProps[\"width\"];\n  @Prop() icon: DBNavigationItemProps[\"icon\"];\n  @Prop() showIcon: DBNavigationItemProps[\"showIcon\"];\n  @Prop() active: DBNavigationItemProps[\"active\"];\n  @Prop() disabled: DBNavigationItemProps[\"disabled\"];\n  @Prop() text: DBNavigationItemProps[\"text\"];\n  @Prop() backButtonId: DBNavigationItemProps[\"backButtonId\"];\n  @Prop() backButtonText: DBNavigationItemProps[\"backButtonText\"];\n  @State() initialized = false;\n  @State() hasAreaPopup = false;\n  @State() hasSubNavigation = true;\n  @State() isSubNavigationExpanded = false;\n  @State() autoClose = false;\n  @State() subNavigationId = \"sub-navigation-\" + uuid();\n  @State() navigationItemSafeTriangle = undefined;\n\n  handleNavigationItemClick(event: unknown) {\n    if (isEventTargetNavigationItem(event)) {\n      this.autoClose = true;\n      delay(() => {\n        this.autoClose = false;\n      }, 300);\n    }\n  }\n  handleClick(event: ClickEvent<HTMLButtonElement> | any) {\n    if (this.click) {\n      this.click.emit(event);\n    }\n    if (this.hasAreaPopup) {\n      this.isSubNavigationExpanded = true;\n    }\n  }\n  handleBackClick(event: ClickEvent<HTMLButtonElement> | any) {\n    event.stopPropagation();\n    this.isSubNavigationExpanded = false;\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.subNavigationExpanded !== undefined) {\n      this.isSubNavigationExpanded = !!getBoolean(\n        this.subNavigationExpanded,\n        \"subNavigationExpanded\"\n      );\n    }\n  }\n\n  @Watch(\"subNavigationExpanded\")\n  watch0() {\n    this.watch0Fn();\n  }\n\n  watch1Fn() {\n    if (this.initialized && this._ref) {\n      const subNavigationSlot = this._ref.querySelector(\"menu\");\n      if (subNavigationSlot) {\n        if (subNavigationSlot.children?.length > 0) {\n          this.hasAreaPopup = true;\n          if (!this.navigationItemSafeTriangle) {\n            this.navigationItemSafeTriangle = new NavigationItemSafeTriangle(\n              this._ref,\n              subNavigationSlot\n            );\n          }\n        } else {\n          this.hasSubNavigation = false;\n        }\n      }\n    }\n  }\n\n  @Watch(\"initialized\")\n  @Watch(\"_ref\")\n  watch1() {\n    this.watch1Fn();\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-navigation-item\");\n    this.initialized = true;\n    this.watch0Fn();\n    this.watch1Fn();\n  }\n\n  render() {\n    return (\n      <li\n        class={cls(\"db-navigation-item\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        onMouseOver={() => this.navigationItemSafeTriangle?.enableFollow()}\n        onMouseLeave={() => this.navigationItemSafeTriangle?.disableFollow()}\n        onMouseMove={(event) =>\n          this.navigationItemSafeTriangle?.followByMouseEvent(event)\n        }\n        data-width={this.width}\n        data-icon={this.icon}\n        data-hide-icon={getHideProp(this.showIcon)}\n        data-active={this.active}\n        aria-disabled={getBooleanAsString(this.disabled)}\n      >\n        {!this.hasSubNavigation ? this.text ? this.text : <slot></slot> : null}\n        {this.hasSubNavigation ? (\n          <Fragment>\n            <button\n              class=\"db-navigation-item-expand-button\"\n              aria-haspopup={this.hasAreaPopup}\n              aria-expanded={this.isSubNavigationExpanded}\n              disabled={getBoolean(this.disabled, \"disabled\")}\n              onClick={(event) => this.handleClick(event)}\n            >\n              {this.text ? this.text : <slot></slot>}\n            </button>\n            <menu\n              class=\"db-sub-navigation\"\n              data-auto-close={this.autoClose}\n              id={this.subNavigationId}\n              onClick={(event) => this.handleNavigationItemClick(event)}\n            >\n              {this.hasAreaPopup ? (\n                <div class=\"db-mobile-navigation-back\">\n                  <db-button\n                    icon=\"arrow_left\"\n                    variant=\"ghost\"\n                    id={this.backButtonId}\n                    onClick={(event) => this.handleBackClick(event)}\n                  >\n                    {this.backButtonText ?? DEFAULT_BACK}\n                  </db-button>\n                </div>\n              ) : null}\n              <slot name=\"subNavigation\"></slot>\n            </menu>\n          </Fragment>\n        ) : null}\n      </li>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/db-navigation-item.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"db-navigation-item.entry.cjs.js","sources":["src/components/navigation-item/navigation-item.tsx"],"sourcesContent":["import { DBNavigationItemProps, DBNavigationItemState } from \"./model\";\nimport { DBButton } from \"../button/button\";\nimport { cls, delay, getBooleanAsString, getHideProp, uuid } from \"../../utils\";\nimport {\n  isEventTargetNavigationItem,\n  NavigationItemSafeTriangle,\n} from \"../../utils/navigation\";\nimport { DEFAULT_BACK } from \"../../shared/constants\";\nimport { ClickEvent } from \"../../shared/model\";\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 * @slot subNavigation - TODO: Add description for slotSubNavigation\n */\n @Component({\n  tag: \"db-navigation-item\",\n})\nexport class DBNavigationItem {\n  private _ref!: HTMLLIElement | null;\n  @Prop() subNavigationExpanded: DBNavigationItemProps[\"subNavigationExpanded\"];\n  @Event() onClick: any;\n  @Prop() id: DBNavigationItemProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBNavigationItemProps[\"className\"];\n  @Prop() width: DBNavigationItemProps[\"width\"];\n  @Prop() icon: DBNavigationItemProps[\"icon\"];\n  @Prop() showIcon: DBNavigationItemProps[\"showIcon\"];\n  @Prop() active: DBNavigationItemProps[\"active\"];\n  @Prop() disabled: DBNavigationItemProps[\"disabled\"];\n  @Prop() text: DBNavigationItemProps[\"text\"];\n\n  @Prop() backButtonId: DBNavigationItemProps[\"backButtonId\"];\n  @Prop() backButtonText: DBNavigationItemProps[\"backButtonText\"];\n  @State() initialized = false;\n  @State() hasAreaPopup = false;\n  @State() hasSubNavigation = true;\n  @State() isSubNavigationExpanded = false;\n  @State() autoClose = false;\n  @State() subNavigationId = \"sub-navigation-\" + uuid();\n  @State() navigationItemSafeTriangle = undefined;\n\n  handleNavigationItemClick(event: unknown) {\n    if (isEventTargetNavigationItem(event)) {\n      this.autoClose = true;\n      delay(() => {\n        this.autoClose = false;\n      }, 300);\n    }\n  }\n  handleClick(event: ClickEvent<HTMLButtonElement>) {\n    if (this.onClick) {\n      this.onClick.emit(event);\n    }\n    if (this.hasAreaPopup) {\n      this.isSubNavigationExpanded = true;\n    }\n  }\n  handleBackClick(event: ClickEvent<HTMLButtonElement>) {\n    event.stopPropagation();\n    this.isSubNavigationExpanded = false;\n  }\n  updateSubNavigationState() {\n    if (this.initialized && document && this.subNavigationId) {\n      const subNavigationSlot = document?.getElementById(\n        this.subNavigationId\n      ) as HTMLMenuElement;\n      if (subNavigationSlot) {\n        if (subNavigationSlot.children?.length > 0) {\n          this.hasAreaPopup = true;\n          if (!this.navigationItemSafeTriangle) {\n            this.navigationItemSafeTriangle = new NavigationItemSafeTriangle(\n              this._ref,\n              subNavigationSlot\n            );\n          }\n        } else {\n          this.hasSubNavigation = false;\n        }\n      }\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: 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.subNavigationExpanded !== undefined) {\n      this.isSubNavigationExpanded = !!this.subNavigationExpanded;\n    }\n  }\n\n  @Watch(\"subNavigationExpanded\")\n  watch0() {\n    this.watch0Fn();\n  }\n\n  watch1Fn() {\n    this.updateSubNavigationState();\n  }\n\n  @Watch(\"initialized\")\n  watch1() {\n    this.watch1Fn();\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-navigation-item\");\n    this.initialized = true;\n    this.watch0Fn();\n    this.watch1Fn();\n  }\n\n  render() {\n    return (\n      <li\n        class={cls(\"db-navigation-item\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        onMouseOver={() => this.navigationItemSafeTriangle?.enableFollow()}\n        onMouseLeave={() => this.navigationItemSafeTriangle?.disableFollow()}\n        onMouseMove={(event) =>\n          this.navigationItemSafeTriangle?.followByMouseEvent(event)\n        }\n        data-width={this.width}\n        data-icon={this.icon}\n        data-hide-icon={getHideProp(this.showIcon)}\n        data-active={this.active}\n        aria-disabled={getBooleanAsString(this.disabled)}\n      >\n        {!this.hasSubNavigation ? this.text ? this.text : <slot></slot> : null}\n        {this.hasSubNavigation ? (\n          <Fragment>\n            <button\n              class=\"db-navigation-item-expand-button\"\n              aria-haspopup={this.hasAreaPopup}\n              aria-expanded={this.isSubNavigationExpanded}\n              disabled={this.disabled}\n              onClick={(event) => this.handleClick(event)}\n            >\n              {this.text ? this.text : <slot></slot>}\n            </button>\n            <menu\n              class=\"db-sub-navigation\"\n              data-auto-close={this.autoClose}\n              id={this.subNavigationId}\n              onClick={(event) => this.handleNavigationItemClick(event)}\n            >\n              {this.hasAreaPopup ? (\n                <div class=\"db-mobile-navigation-back\">\n                  <db-button\n                    icon=\"arrow_left\"\n                    variant=\"ghost\"\n                    id={this.backButtonId}\n                    onClick={(event) => this.handleBackClick(event)}\n                  >\n                    {this.backButtonText ?? DEFAULT_BACK}\n                  </db-button>\n                </div>\n              ) : null}\n              <slot name=\"subNavigation\"></slot>\n            </menu>\n          </Fragment>\n        ) : null}\n      </li>\n    );\n  }\n}\n"],"names":["uuid","isEventTargetNavigationItem","delay","NavigationItemSafeTriangle","h","cls","getHideProp","getBooleanAsString","Fragment","DEFAULT_BACK"],"mappings":"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"}
+{"version":3,"file":"db-navigation-item.entry.cjs.js","sources":["src/components/navigation-item/navigation-item.tsx"],"sourcesContent":["import { DBNavigationItemProps, DBNavigationItemState } from \"./model\";\nimport { DBButton } from \"../button/button\";\nimport {\n  cls,\n  delay,\n  getBoolean,\n  getBooleanAsString,\n  getHideProp,\n  uuid,\n} from \"../../utils\";\nimport {\n  isEventTargetNavigationItem,\n  NavigationItemSafeTriangle,\n} from \"../../utils/navigation\";\nimport { DEFAULT_BACK } from \"../../shared/constants\";\nimport { ClickEvent } from \"../../shared/model\";\n\nimport {\n  Component,\n  h,\n  Fragment,\n  Watch,\n  Event,\n  EventEmitter,\n  Prop,\n  State,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot subNavigation - TODO: Add description for slotSubNavigation\n */\n @Component({\n  tag: \"db-navigation-item\",\n})\nexport class DBNavigationItem {\n  private _ref!: HTMLLIElement | any;\n  @Prop() subNavigationExpanded: DBNavigationItemProps[\"subNavigationExpanded\"];\n  @Event() click: EventEmitter<\n    Parameters<Required<DBNavigationItemProps>[\"onClick\"]>[number]\n  > | void;\n  @Prop() id: DBNavigationItemProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBNavigationItemProps[\"className\"];\n  @Prop() width: DBNavigationItemProps[\"width\"];\n  @Prop() icon: DBNavigationItemProps[\"icon\"];\n  @Prop() showIcon: DBNavigationItemProps[\"showIcon\"];\n  @Prop() active: DBNavigationItemProps[\"active\"];\n  @Prop() disabled: DBNavigationItemProps[\"disabled\"];\n  @Prop() text: DBNavigationItemProps[\"text\"];\n  @Prop() backButtonId: DBNavigationItemProps[\"backButtonId\"];\n  @Prop() backButtonText: DBNavigationItemProps[\"backButtonText\"];\n  @State() initialized = false;\n  @State() hasAreaPopup = false;\n  @State() hasSubNavigation = true;\n  @State() isSubNavigationExpanded = false;\n  @State() autoClose = false;\n  @State() subNavigationId = \"sub-navigation-\" + uuid();\n  @State() navigationItemSafeTriangle = undefined;\n\n  handleNavigationItemClick(event: unknown) {\n    if (isEventTargetNavigationItem(event)) {\n      this.autoClose = true;\n      delay(() => {\n        this.autoClose = false;\n      }, 300);\n    }\n  }\n  handleClick(event: ClickEvent<HTMLButtonElement> | any) {\n    if (this.click) {\n      this.click.emit(event);\n    }\n    if (this.hasAreaPopup) {\n      this.isSubNavigationExpanded = true;\n    }\n  }\n  handleBackClick(event: ClickEvent<HTMLButtonElement> | any) {\n    event.stopPropagation();\n    this.isSubNavigationExpanded = false;\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.subNavigationExpanded !== undefined) {\n      this.isSubNavigationExpanded = !!getBoolean(\n        this.subNavigationExpanded,\n        \"subNavigationExpanded\"\n      );\n    }\n  }\n\n  @Watch(\"subNavigationExpanded\")\n  watch0() {\n    this.watch0Fn();\n  }\n\n  watch1Fn() {\n    if (this.initialized && this._ref) {\n      const subNavigationSlot = this._ref.querySelector(\"menu\");\n      if (subNavigationSlot) {\n        if (subNavigationSlot.children?.length > 0) {\n          this.hasAreaPopup = true;\n          if (!this.navigationItemSafeTriangle) {\n            this.navigationItemSafeTriangle = new NavigationItemSafeTriangle(\n              this._ref,\n              subNavigationSlot\n            );\n          }\n        } else {\n          this.hasSubNavigation = false;\n        }\n      }\n    }\n  }\n\n  @Watch(\"initialized\")\n  @Watch(\"_ref\")\n  watch1() {\n    this.watch1Fn();\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-navigation-item\");\n    this.initialized = true;\n    this.watch0Fn();\n    this.watch1Fn();\n  }\n\n  render() {\n    return (\n      <li\n        class={cls(\"db-navigation-item\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        onMouseOver={() => this.navigationItemSafeTriangle?.enableFollow()}\n        onMouseLeave={() => this.navigationItemSafeTriangle?.disableFollow()}\n        onMouseMove={(event) =>\n          this.navigationItemSafeTriangle?.followByMouseEvent(event)\n        }\n        data-width={this.width}\n        data-icon={this.icon}\n        data-hide-icon={getHideProp(this.showIcon)}\n        data-active={this.active}\n        aria-disabled={getBooleanAsString(this.disabled)}\n      >\n        {!this.hasSubNavigation ? this.text ? this.text : <slot></slot> : null}\n        {this.hasSubNavigation ? (\n          <Fragment>\n            <button\n              class=\"db-navigation-item-expand-button\"\n              aria-haspopup={this.hasAreaPopup}\n              aria-expanded={this.isSubNavigationExpanded}\n              disabled={getBoolean(this.disabled, \"disabled\")}\n              onClick={(event) => this.handleClick(event)}\n            >\n              {this.text ? this.text : <slot></slot>}\n            </button>\n            <menu\n              class=\"db-sub-navigation\"\n              data-auto-close={this.autoClose}\n              id={this.subNavigationId}\n              onClick={(event) => this.handleNavigationItemClick(event)}\n            >\n              {this.hasAreaPopup ? (\n                <div class=\"db-mobile-navigation-back\">\n                  <db-button\n                    icon=\"arrow_left\"\n                    variant=\"ghost\"\n                    id={this.backButtonId}\n                    onClick={(event) => this.handleBackClick(event)}\n                  >\n                    {this.backButtonText ?? DEFAULT_BACK}\n                  </db-button>\n                </div>\n              ) : null}\n              <slot name=\"subNavigation\"></slot>\n            </menu>\n          </Fragment>\n        ) : null}\n      </li>\n    );\n  }\n}\n"],"names":["uuid","isEventTargetNavigationItem","delay","getBoolean","NavigationItemSafeTriangle","h","cls","getHideProp","getBooleanAsString","Fragment","DEFAULT_BACK"],"mappings":"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"}

package/dist/cjs/db-navigation.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-DBEtsnky.js');
-var index$1 = require('./index-DeqKGVDx.js');
+var index = require('./index-w2CAlvjJ.js');
+var index$1 = require('./index-9h8KqOUd.js');
 var constants = require('./constants-CTtyzyuo.js');
 
 const DBNavigation = class {
@@ -46,9 +46,9 @@ const DBNavigation = class {
         this._id = this.id || "navigation-" + index$1.uuid();
     }
     render() {
-        return (index.h("nav", { key: '4591f1348a2d7fceafc4ad0fbd6ebc768b819af1', class: index$1.cls("db-navigation", this.className), ref: (el) => {
+        return (index.h("nav", { key: 'b424275cf683b12041b18bb29221823428ac834d', class: index$1.cls("db-navigation", this.className), ref: (el) => {
                 this._ref = el;
-            }, id: this._id, "aria-labelledby": this.labelledBy }, index.h("menu", { key: 'ade607816e1b561f5c74eb18ea7dbbef7d8e0d93' }, index.h("slot", { key: '02578f17abb1eb0513aa2663b5617427eaa291c5' }))));
+            }, id: this._id, "aria-labelledby": this.labelledBy }, index.h("menu", { key: '377ad094719dbf47db6a0bc44e71eb94c0da168b' }, index.h("slot", { key: 'd4bbf0fdae9800e79bc13e82e9f94b898c09a16f' }))));
     }
 };
 

package/dist/cjs/db-navigation.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"db-navigation.entry.cjs.js","mappings":";;;;;;MAca,YAAY,GAAA,MAAA;AAHxB,IAAA,WAAA,CAAA,OAAA,EAAA;;AASU,QAAA,IAAG,CAAA,GAAA,GAAGA,oBAAU;AA+D1B;AA7DC;;;;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,eAAe,CAAC;QACvD,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,EAAE,IAAI,aAAa,GAAGC,YAAI,EAAE;;IAG9C,MAAM,GAAA;QACJ,QACEC,OACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAEC,WAAG,CAAC,eAAe,EAAE,IAAI,CAAC,SAAS,CAAC,EAC3C,GAAG,EAAE,CAAC,EAAO,KAAI;AACf,gBAAA,IAAI,CAAC,IAAI,GAAG,EAAE;AAChB,aAAC,EACD,EAAE,EAAE,IAAI,CAAC,GAAG,EAAA,iBAAA,EACK,IAAI,CAAC,UAAU,EAAA,EAEhCD,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACEA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR,CACH;;;;;;","names":["DEFAULT_ID","uuid","h","cls"],"sources":["src/components/navigation/navigation.tsx"],"sourcesContent":["import { DBNavigationProps, DBNavigationState } 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-navigation\",\n})\nexport class DBNavigation {\n  private _ref!: HTMLDivElement | null;\n  @Prop() id: DBNavigationProps[\"id\"];\n  @Prop() labelledBy: DBNavigationProps[\"labelledBy\"];\n  @Prop({attribute: \"classname\"}) className: DBNavigationProps[\"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-navigation\");\n    this._id = this.id || \"navigation-\" + uuid();\n  }\n\n  render() {\n    return (\n      <nav\n        class={cls(\"db-navigation\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this._id}\n        aria-labelledby={this.labelledBy}\n      >\n        <menu>\n          <slot></slot>\n        </menu>\n      </nav>\n    );\n  }\n}\n"],"version":3}
+{"file":"db-navigation.entry.cjs.js","mappings":";;;;;;MAca,YAAY,GAAA,MAAA;AAHxB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAQU,QAAA,IAAG,CAAA,GAAA,GAAGA,oBAAU;AA+D1B;AA7DC;;;;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,eAAe,CAAC;QACvD,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,EAAE,IAAI,aAAa,GAAGC,YAAI,EAAE;;IAG9C,MAAM,GAAA;QACJ,QACEC,OACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAEC,WAAG,CAAC,eAAe,EAAE,IAAI,CAAC,SAAS,CAAC,EAC3C,GAAG,EAAE,CAAC,EAAO,KAAI;AACf,gBAAA,IAAI,CAAC,IAAI,GAAG,EAAE;AAChB,aAAC,EACD,EAAE,EAAE,IAAI,CAAC,GAAG,EAAA,iBAAA,EACK,IAAI,CAAC,UAAU,EAAA,EAEhCD,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACEA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR,CACH;;;;;;","names":["DEFAULT_ID","uuid","h","cls"],"sources":["src/components/navigation/navigation.tsx"],"sourcesContent":["import { DBNavigationProps, DBNavigationState } 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-navigation\",\n})\nexport class DBNavigation {\n  private _ref!: HTMLDivElement | any;\n  @Prop() id: DBNavigationProps[\"id\"];\n  @Prop() labelledBy: DBNavigationProps[\"labelledBy\"];\n  @Prop({attribute: \"classname\"}) className: DBNavigationProps[\"className\"];\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-navigation\");\n    this._id = this.id || \"navigation-\" + uuid();\n  }\n\n  render() {\n    return (\n      <nav\n        class={cls(\"db-navigation\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this._id}\n        aria-labelledby={this.labelledBy}\n      >\n        <menu>\n          <slot></slot>\n        </menu>\n      </nav>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/db-navigation.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"db-navigation.entry.cjs.js","sources":["src/components/navigation/navigation.tsx"],"sourcesContent":["import { DBNavigationProps, DBNavigationState } 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-navigation\",\n})\nexport class DBNavigation {\n  private _ref!: HTMLDivElement | null;\n  @Prop() id: DBNavigationProps[\"id\"];\n  @Prop() labelledBy: DBNavigationProps[\"labelledBy\"];\n  @Prop({attribute: \"classname\"}) className: DBNavigationProps[\"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-navigation\");\n    this._id = this.id || \"navigation-\" + uuid();\n  }\n\n  render() {\n    return (\n      <nav\n        class={cls(\"db-navigation\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this._id}\n        aria-labelledby={this.labelledBy}\n      >\n        <menu>\n          <slot></slot>\n        </menu>\n      </nav>\n    );\n  }\n}\n"],"names":["DEFAULT_ID","uuid","h","cls"],"mappings":";;;;;;MAca,YAAY,GAAA,MAAA;AAHxB,IAAA,WAAA,CAAA,OAAA,EAAA;;AASU,QAAA,IAAG,CAAA,GAAA,GAAGA,oBAAU;AA+D1B;AA7DC;;;;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,eAAe,CAAC;QACvD,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,EAAE,IAAI,aAAa,GAAGC,YAAI,EAAE;;IAG9C,MAAM,GAAA;QACJ,QACEC,OACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAEC,WAAG,CAAC,eAAe,EAAE,IAAI,CAAC,SAAS,CAAC,EAC3C,GAAG,EAAE,CAAC,EAAO,KAAI;AACf,gBAAA,IAAI,CAAC,IAAI,GAAG,EAAE;AAChB,aAAC,EACD,EAAE,EAAE,IAAI,CAAC,GAAG,EAAA,iBAAA,EACK,IAAI,CAAC,UAAU,EAAA,EAEhCD,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACEA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR,CACH;;;;;;"}
+{"version":3,"file":"db-navigation.entry.cjs.js","sources":["src/components/navigation/navigation.tsx"],"sourcesContent":["import { DBNavigationProps, DBNavigationState } 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-navigation\",\n})\nexport class DBNavigation {\n  private _ref!: HTMLDivElement | any;\n  @Prop() id: DBNavigationProps[\"id\"];\n  @Prop() labelledBy: DBNavigationProps[\"labelledBy\"];\n  @Prop({attribute: \"classname\"}) className: DBNavigationProps[\"className\"];\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-navigation\");\n    this._id = this.id || \"navigation-\" + uuid();\n  }\n\n  render() {\n    return (\n      <nav\n        class={cls(\"db-navigation\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this._id}\n        aria-labelledby={this.labelledBy}\n      >\n        <menu>\n          <slot></slot>\n        </menu>\n      </nav>\n    );\n  }\n}\n"],"names":["DEFAULT_ID","uuid","h","cls"],"mappings":";;;;;;MAca,YAAY,GAAA,MAAA;AAHxB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAQU,QAAA,IAAG,CAAA,GAAA,GAAGA,oBAAU;AA+D1B;AA7DC;;;;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,eAAe,CAAC;QACvD,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,EAAE,IAAI,aAAa,GAAGC,YAAI,EAAE;;IAG9C,MAAM,GAAA;QACJ,QACEC,OACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAEC,WAAG,CAAC,eAAe,EAAE,IAAI,CAAC,SAAS,CAAC,EAC3C,GAAG,EAAE,CAAC,EAAO,KAAI;AACf,gBAAA,IAAI,CAAC,IAAI,GAAG,EAAE;AAChB,aAAC,EACD,EAAE,EAAE,IAAI,CAAC,GAAG,EAAA,iBAAA,EACK,IAAI,CAAC,UAAU,EAAA,EAEhCD,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACEA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR,CACH;;;;;;"}

package/dist/cjs/db-notification.cjs.entry.js

@@ -1,17 +1,17 @@
 'use strict';
 
-var index = require('./index-DBEtsnky.js');
+var index = require('./index-w2CAlvjJ.js');
 var constants = require('./constants-CTtyzyuo.js');
-var index$1 = require('./index-DeqKGVDx.js');
+var index$1 = require('./index-9h8KqOUd.js');
 
 const DBNotification = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.onClose = index.createEvent(this, "onClose");
+        this.close = index.createEvent(this, "close");
     }
     handleClose(event) {
-        if (this.onClose) {
-            this.onClose.emit();
+        if (this.close) {
+            this.close.emit(event);
         }
     }
     /**
@@ -51,9 +51,9 @@ const DBNotification = class {
     }
     render() {
         var _a;
-        return (index.h("article", { key: '687caef11f1936276ea751c770a202132d7ff823', class: index$1.cls("db-notification", this.className), ref: (el) => {
+        return (index.h("article", { key: '8414ca3cc8174665ead2bbb3909ab284e2ed10a7', class: index$1.cls("db-notification", this.className), ref: (el) => {
                 this._ref = el;
-            }, id: this.id, "aria-live": this.ariaLive, "data-semantic": this.semantic, "data-variant": this.variant, "data-icon": this.icon, "data-hide-icon": index$1.getHideProp(this.showIcon), "data-link-variant": this.linkVariant }, index.h("slot", { key: '8b8fe272272196ebf585a0b3166c27fdf8a81c0a', name: "image" }), index$1.stringPropVisible(this.headline, this.showHeadline) ? (index.h("header", null, this.headline)) : null, index.h("p", { key: '57f127bde56e0ea9ecebf371f2119c4b5b6c0e50' }, this.text ? this.text : index.h("slot", null)), index$1.stringPropVisible(this.timestamp, this.showTimestamp) ? (index.h("span", null, this.timestamp)) : null, index.h("slot", { key: 'ab7ddf6617b5df95984d2d7dc21ef6dd517981fc', name: "link" }), this.closeable ? (index.h("db-button", { icon: "cross", variant: "ghost", size: "small", id: this.closeButtonId, noText: true, onClick: (event) => this.handleClose(event) }, (_a = this.closeButtonText) !== null && _a !== void 0 ? _a : constants.DEFAULT_CLOSE_BUTTON)) : null));
+            }, id: this.id, "aria-live": this.ariaLive, "data-semantic": this.semantic, "data-variant": this.variant, "data-icon": this.icon, "data-hide-icon": index$1.getHideProp(this.showIcon), "data-link-variant": this.linkVariant }, index.h("slot", { key: '3dd88ff01aeb1df74303758c5b640d29e48fe1a2', name: "image" }), index$1.stringPropVisible(this.headline, this.showHeadline) ? (index.h("header", null, this.headline)) : null, index.h("p", { key: 'b511ed5d3edf911738e64ee1f5fa0191d6417c9d' }, this.text ? this.text : index.h("slot", null)), index$1.stringPropVisible(this.timestamp, this.showTimestamp) ? (index.h("span", null, this.timestamp)) : null, index.h("slot", { key: '9387333f08d42da3bfddf96c6ccab00f314631de', name: "link" }), index$1.getBoolean(this.closeable, "closeable") ? (index.h("db-button", { icon: "cross", variant: "ghost", size: "small", id: this.closeButtonId, noText: true, onClick: (event) => this.handleClose(event) }, (_a = this.closeButtonText) !== null && _a !== void 0 ? _a : constants.DEFAULT_CLOSE_BUTTON)) : null));
     }
 };
 

package/dist/cjs/db-notification.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"db-notification.entry.cjs.js","mappings":"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","names":["h","cls","getHideProp","stringPropVisible","DEFAULT_CLOSE_BUTTON"],"sources":["src/components/notification/notification.tsx"],"sourcesContent":["import { DBNotificationProps, DBNotificationState } from \"./model\";\nimport { DBButton } from \"../button/button\";\nimport { DEFAULT_CLOSE_BUTTON } from \"../../shared/constants\";\nimport { cls, getHideProp, stringPropVisible } from \"../../utils\";\nimport { ClickEvent } from \"../../shared/model\";\n\nimport { Component, h, Fragment, Event, Prop } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot image - TODO: Add description for slotImage\n * @slot link - TODO: Add description for slotLink\n */\n @Component({\n  tag: \"db-notification\",\n})\nexport class DBNotification {\n  private _ref!: HTMLDivElement | null;\n  @Event() onClose: any;\n  @Prop() id: DBNotificationProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBNotificationProps[\"className\"];\n  @Prop() ariaLive: DBNotificationProps[\"ariaLive\"];\n  @Prop() semantic: DBNotificationProps[\"semantic\"];\n  @Prop() variant: DBNotificationProps[\"variant\"];\n  @Prop() icon: DBNotificationProps[\"icon\"];\n  @Prop() showIcon: DBNotificationProps[\"showIcon\"];\n  @Prop() linkVariant: DBNotificationProps[\"linkVariant\"];\n  @Prop() headline: DBNotificationProps[\"headline\"];\n  @Prop() showHeadline: DBNotificationProps[\"showHeadline\"];\n  @Prop() text: DBNotificationProps[\"text\"];\n\n  @Prop() timestamp: DBNotificationProps[\"timestamp\"];\n  @Prop() showTimestamp: DBNotificationProps[\"showTimestamp\"];\n  @Prop() closeable: DBNotificationProps[\"closeable\"];\n  @Prop() closeButtonId: DBNotificationProps[\"closeButtonId\"];\n  @Prop() closeButtonText: DBNotificationProps[\"closeButtonText\"];\n\n  handleClose(event: ClickEvent<HTMLButtonElement>) {\n    if (this.onClose) {\n      this.onClose.emit();\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: 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-notification\");\n  }\n\n  render() {\n    return (\n      <article\n        class={cls(\"db-notification\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        aria-live={this.ariaLive}\n        data-semantic={this.semantic}\n        data-variant={this.variant}\n        data-icon={this.icon}\n        data-hide-icon={getHideProp(this.showIcon)}\n        data-link-variant={this.linkVariant}\n      >\n        <slot name=\"image\"></slot>\n        {stringPropVisible(this.headline, this.showHeadline) ? (\n          <header>{this.headline}</header>\n        ) : null}\n        <p>{this.text ? this.text : <slot></slot>}</p>\n        {stringPropVisible(this.timestamp, this.showTimestamp) ? (\n          <span>{this.timestamp}</span>\n        ) : null}\n        <slot name=\"link\"></slot>\n        {this.closeable ? (\n          <db-button\n            icon=\"cross\"\n            variant=\"ghost\"\n            size=\"small\"\n            id={this.closeButtonId}\n            noText={true}\n            onClick={(event) => this.handleClose(event)}\n          >\n            {this.closeButtonText ?? DEFAULT_CLOSE_BUTTON}\n          </db-button>\n        ) : null}\n      </article>\n    );\n  }\n}\n"],"version":3}
+{"file":"db-notification.entry.cjs.js","mappings":"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","names":["h","cls","getHideProp","stringPropVisible","getBoolean","DEFAULT_CLOSE_BUTTON"],"sources":["src/components/notification/notification.tsx"],"sourcesContent":["import { DBNotificationProps, DBNotificationState } from \"./model\";\nimport { DBButton } from \"../button/button\";\nimport { DEFAULT_CLOSE_BUTTON } from \"../../shared/constants\";\nimport { cls, getBoolean, getHideProp, stringPropVisible } from \"../../utils\";\nimport { ClickEvent } from \"../../shared/model\";\n\nimport {\n  Component,\n  h,\n  Fragment,\n  Event,\n  EventEmitter,\n  Prop,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot image - TODO: Add description for slotImage\n * @slot link - TODO: Add description for slotLink\n */\n @Component({\n  tag: \"db-notification\",\n})\nexport class DBNotification {\n  private _ref!: HTMLDivElement | any;\n  @Event() close: EventEmitter<\n    Parameters<Required<DBNotificationProps>[\"onClose\"]>[number]\n  > | void;\n  @Prop() id: DBNotificationProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBNotificationProps[\"className\"];\n  @Prop() ariaLive: DBNotificationProps[\"ariaLive\"];\n  @Prop() semantic: DBNotificationProps[\"semantic\"];\n  @Prop() variant: DBNotificationProps[\"variant\"];\n  @Prop() icon: DBNotificationProps[\"icon\"];\n  @Prop() showIcon: DBNotificationProps[\"showIcon\"];\n  @Prop() linkVariant: DBNotificationProps[\"linkVariant\"];\n  @Prop() headline: DBNotificationProps[\"headline\"];\n  @Prop() showHeadline: DBNotificationProps[\"showHeadline\"];\n  @Prop() text: DBNotificationProps[\"text\"];\n  @Prop() timestamp: DBNotificationProps[\"timestamp\"];\n  @Prop() showTimestamp: DBNotificationProps[\"showTimestamp\"];\n  @Prop() closeable: DBNotificationProps[\"closeable\"];\n  @Prop() closeButtonId: DBNotificationProps[\"closeButtonId\"];\n  @Prop() closeButtonText: DBNotificationProps[\"closeButtonText\"];\n\n  handleClose(event: ClickEvent<HTMLButtonElement> | any) {\n    if (this.close) {\n      this.close.emit(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: 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-notification\");\n  }\n\n  render() {\n    return (\n      <article\n        class={cls(\"db-notification\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        aria-live={this.ariaLive}\n        data-semantic={this.semantic}\n        data-variant={this.variant}\n        data-icon={this.icon}\n        data-hide-icon={getHideProp(this.showIcon)}\n        data-link-variant={this.linkVariant}\n      >\n        <slot name=\"image\"></slot>\n        {stringPropVisible(this.headline, this.showHeadline) ? (\n          <header>{this.headline}</header>\n        ) : null}\n        <p>{this.text ? this.text : <slot></slot>}</p>\n        {stringPropVisible(this.timestamp, this.showTimestamp) ? (\n          <span>{this.timestamp}</span>\n        ) : null}\n        <slot name=\"link\"></slot>\n        {getBoolean(this.closeable, \"closeable\") ? (\n          <db-button\n            icon=\"cross\"\n            variant=\"ghost\"\n            size=\"small\"\n            id={this.closeButtonId}\n            noText={true}\n            onClick={(event) => this.handleClose(event)}\n          >\n            {this.closeButtonText ?? DEFAULT_CLOSE_BUTTON}\n          </db-button>\n        ) : null}\n      </article>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/db-notification.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"db-notification.entry.cjs.js","sources":["src/components/notification/notification.tsx"],"sourcesContent":["import { DBNotificationProps, DBNotificationState } from \"./model\";\nimport { DBButton } from \"../button/button\";\nimport { DEFAULT_CLOSE_BUTTON } from \"../../shared/constants\";\nimport { cls, getHideProp, stringPropVisible } from \"../../utils\";\nimport { ClickEvent } from \"../../shared/model\";\n\nimport { Component, h, Fragment, Event, Prop } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot image - TODO: Add description for slotImage\n * @slot link - TODO: Add description for slotLink\n */\n @Component({\n  tag: \"db-notification\",\n})\nexport class DBNotification {\n  private _ref!: HTMLDivElement | null;\n  @Event() onClose: any;\n  @Prop() id: DBNotificationProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBNotificationProps[\"className\"];\n  @Prop() ariaLive: DBNotificationProps[\"ariaLive\"];\n  @Prop() semantic: DBNotificationProps[\"semantic\"];\n  @Prop() variant: DBNotificationProps[\"variant\"];\n  @Prop() icon: DBNotificationProps[\"icon\"];\n  @Prop() showIcon: DBNotificationProps[\"showIcon\"];\n  @Prop() linkVariant: DBNotificationProps[\"linkVariant\"];\n  @Prop() headline: DBNotificationProps[\"headline\"];\n  @Prop() showHeadline: DBNotificationProps[\"showHeadline\"];\n  @Prop() text: DBNotificationProps[\"text\"];\n\n  @Prop() timestamp: DBNotificationProps[\"timestamp\"];\n  @Prop() showTimestamp: DBNotificationProps[\"showTimestamp\"];\n  @Prop() closeable: DBNotificationProps[\"closeable\"];\n  @Prop() closeButtonId: DBNotificationProps[\"closeButtonId\"];\n  @Prop() closeButtonText: DBNotificationProps[\"closeButtonText\"];\n\n  handleClose(event: ClickEvent<HTMLButtonElement>) {\n    if (this.onClose) {\n      this.onClose.emit();\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: 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-notification\");\n  }\n\n  render() {\n    return (\n      <article\n        class={cls(\"db-notification\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        aria-live={this.ariaLive}\n        data-semantic={this.semantic}\n        data-variant={this.variant}\n        data-icon={this.icon}\n        data-hide-icon={getHideProp(this.showIcon)}\n        data-link-variant={this.linkVariant}\n      >\n        <slot name=\"image\"></slot>\n        {stringPropVisible(this.headline, this.showHeadline) ? (\n          <header>{this.headline}</header>\n        ) : null}\n        <p>{this.text ? this.text : <slot></slot>}</p>\n        {stringPropVisible(this.timestamp, this.showTimestamp) ? (\n          <span>{this.timestamp}</span>\n        ) : null}\n        <slot name=\"link\"></slot>\n        {this.closeable ? (\n          <db-button\n            icon=\"cross\"\n            variant=\"ghost\"\n            size=\"small\"\n            id={this.closeButtonId}\n            noText={true}\n            onClick={(event) => this.handleClose(event)}\n          >\n            {this.closeButtonText ?? DEFAULT_CLOSE_BUTTON}\n          </db-button>\n        ) : null}\n      </article>\n    );\n  }\n}\n"],"names":["h","cls","getHideProp","stringPropVisible","DEFAULT_CLOSE_BUTTON"],"mappings":"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"}
+{"version":3,"file":"db-notification.entry.cjs.js","sources":["src/components/notification/notification.tsx"],"sourcesContent":["import { DBNotificationProps, DBNotificationState } from \"./model\";\nimport { DBButton } from \"../button/button\";\nimport { DEFAULT_CLOSE_BUTTON } from \"../../shared/constants\";\nimport { cls, getBoolean, getHideProp, stringPropVisible } from \"../../utils\";\nimport { ClickEvent } from \"../../shared/model\";\n\nimport {\n  Component,\n  h,\n  Fragment,\n  Event,\n  EventEmitter,\n  Prop,\n} from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot image - TODO: Add description for slotImage\n * @slot link - TODO: Add description for slotLink\n */\n @Component({\n  tag: \"db-notification\",\n})\nexport class DBNotification {\n  private _ref!: HTMLDivElement | any;\n  @Event() close: EventEmitter<\n    Parameters<Required<DBNotificationProps>[\"onClose\"]>[number]\n  > | void;\n  @Prop() id: DBNotificationProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBNotificationProps[\"className\"];\n  @Prop() ariaLive: DBNotificationProps[\"ariaLive\"];\n  @Prop() semantic: DBNotificationProps[\"semantic\"];\n  @Prop() variant: DBNotificationProps[\"variant\"];\n  @Prop() icon: DBNotificationProps[\"icon\"];\n  @Prop() showIcon: DBNotificationProps[\"showIcon\"];\n  @Prop() linkVariant: DBNotificationProps[\"linkVariant\"];\n  @Prop() headline: DBNotificationProps[\"headline\"];\n  @Prop() showHeadline: DBNotificationProps[\"showHeadline\"];\n  @Prop() text: DBNotificationProps[\"text\"];\n  @Prop() timestamp: DBNotificationProps[\"timestamp\"];\n  @Prop() showTimestamp: DBNotificationProps[\"showTimestamp\"];\n  @Prop() closeable: DBNotificationProps[\"closeable\"];\n  @Prop() closeButtonId: DBNotificationProps[\"closeButtonId\"];\n  @Prop() closeButtonText: DBNotificationProps[\"closeButtonText\"];\n\n  handleClose(event: ClickEvent<HTMLButtonElement> | any) {\n    if (this.close) {\n      this.close.emit(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: 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-notification\");\n  }\n\n  render() {\n    return (\n      <article\n        class={cls(\"db-notification\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        aria-live={this.ariaLive}\n        data-semantic={this.semantic}\n        data-variant={this.variant}\n        data-icon={this.icon}\n        data-hide-icon={getHideProp(this.showIcon)}\n        data-link-variant={this.linkVariant}\n      >\n        <slot name=\"image\"></slot>\n        {stringPropVisible(this.headline, this.showHeadline) ? (\n          <header>{this.headline}</header>\n        ) : null}\n        <p>{this.text ? this.text : <slot></slot>}</p>\n        {stringPropVisible(this.timestamp, this.showTimestamp) ? (\n          <span>{this.timestamp}</span>\n        ) : null}\n        <slot name=\"link\"></slot>\n        {getBoolean(this.closeable, \"closeable\") ? (\n          <db-button\n            icon=\"cross\"\n            variant=\"ghost\"\n            size=\"small\"\n            id={this.closeButtonId}\n            noText={true}\n            onClick={(event) => this.handleClose(event)}\n          >\n            {this.closeButtonText ?? DEFAULT_CLOSE_BUTTON}\n          </db-button>\n        ) : null}\n      </article>\n    );\n  }\n}\n"],"names":["h","cls","getHideProp","stringPropVisible","getBoolean","DEFAULT_CLOSE_BUTTON"],"mappings":"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"}

package/dist/cjs/db-page.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-DBEtsnky.js');
-var index$1 = require('./index-DeqKGVDx.js');
+var index = require('./index-w2CAlvjJ.js');
+var index$1 = require('./index-9h8KqOUd.js');
 
 const DBPage = class {
     constructor(hostRef) {
@@ -60,9 +60,9 @@ const DBPage = class {
         }
     }
     render() {
-        return (index.h("div", { key: 'e84efdbed5836db872f261cc1ac3c2606153e6d6', class: index$1.cls("db-page", this.className), ref: (el) => {
+        return (index.h("div", { key: 'c94b9840013c227ce38cfe21391d287fc0a89f6c', class: index$1.cls("db-page", this.className), ref: (el) => {
                 this._ref = el;
-            }, id: this.id, "data-variant": this.variant, "data-fade-in": this.fadeIn, "data-fonts-loaded": index$1.getBooleanAsString(this.fontsLoaded) }, index.h("slot", { key: 'fff9d9902cc83f706932d233195d30c9096f8c14', name: "header" }), index.h("main", { key: '1c78d658ffe24c528e5cd431c9156fb19d10ce0d', class: index$1.cls("db-main", this.mainClass) }, index.h("slot", { key: 'd7124b497f131fac36e66da44add93a0504eed0c' })), index.h("slot", { key: '765db6c7b9981063e05c97b983558f357081c6be', name: "footer" })));
+            }, id: this.id, "data-variant": this.variant, "data-fade-in": index$1.getBooleanAsString(this.fadeIn), "data-fonts-loaded": index$1.getBooleanAsString(this.fontsLoaded) }, index.h("slot", { key: '2f8142be3eb631f6af14ef1ff561699d18facb5e', name: "header" }), index.h("main", { key: '7cfc82fa914ef92140b93d5ce265a33129f5ed37', class: index$1.cls("db-main", this.mainClass) }, index.h("slot", { key: '1db431f209c21045733755fdac9c1930bad30eb7' })), index.h("slot", { key: 'da7861f0d5edd4cf76a117b615771b8660d13026', name: "footer" })));
     }
 };
 

package/dist/cjs/db-page.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"db-page.entry.cjs.js","mappings":";;;;;MAca,MAAM,GAAA,MAAA;AAHlB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAYU,QAAA,IAAW,CAAA,WAAA,GAAG,KAAK;AAmF7B;AAjFC;;;;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,SAAS,CAAC;AACjD,QAAA,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,CAAC,MAAM;AAC/B,QAAA,IAAI,QAAQ,IAAI,IAAI,CAAC,MAAM,EAAE;YAC3B,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,MAAK;AAC7B,gBAAA,IAAI,CAAC,WAAW,GAAG,IAAI;AACzB,aAAC,CAAC;;aACG;AACL,YAAA,IAAI,CAAC,WAAW,GAAG,IAAI;;;IAG3B,oBAAoB,GAAA;QAClB,IACE,OAAO,MAAM,KAAK,WAAW;YAC7B,QAAQ,CAAC,eAAe,CAAC,SAAS,CAAC,QAAQ,CAAC,kBAAkB,CAAC,EAC/D;;YAEA,QAAQ,CAAC,eAAe,CAAC,SAAS,CAAC,MAAM,CAAC,kBAAkB,CAAC;;;IAIjE,MAAM,GAAA;QACJ,QACEA,OACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAEC,WAAG,CAAC,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,EACrC,GAAG,EAAE,CAAC,EAAO,KAAI;AACf,gBAAA,IAAI,CAAC,IAAI,GAAG,EAAE;aACf,EACD,EAAE,EAAE,IAAI,CAAC,EAAE,EAAA,cAAA,EACG,IAAI,CAAC,OAAO,kBACZ,IAAI,CAAC,MAAM,EACN,mBAAA,EAAAC,0BAAkB,CAAC,IAAI,CAAC,WAAW,CAAC,EAAA,EAEvDF,OAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAQ,CAAA,EAC3BA,OAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAEC,WAAG,CAAC,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,EAAA,EACzCD,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACR,EACPA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,QAAQ,EAAQ,CAAA,CACvB;;;;;;","names":["h","cls","getBooleanAsString"],"sources":["src/components/page/page.tsx"],"sourcesContent":["import { DBPageProps, DBPageState } from \"./model\";\nimport { cls, getBooleanAsString } from \"../../utils\";\n\nimport { Component, h, Fragment, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot header - TODO: Add description for slotHeader\n * @slot footer - TODO: Add description for slotFooter\n */\n @Component({\n  tag: \"db-page\",\n})\nexport class DBPage {\n  private _ref!: HTMLDivElement | null;\n  @Prop() fadeIn: DBPageProps[\"fadeIn\"];\n  @Prop() documentOverflow: DBPageProps[\"documentOverflow\"];\n  @Prop() variant: DBPageProps[\"variant\"];\n  @Prop() id: DBPageProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBPageProps[\"className\"];\n  @Prop() mainClass: DBPageProps[\"mainClass\"];\n\n  @State() fontsLoaded = false;\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-page\");\n    this.fontsLoaded = !this.fadeIn;\n    if (document && this.fadeIn) {\n      document.fonts.ready.then(() => {\n        this.fontsLoaded = true;\n      });\n    } else {\n      this.fontsLoaded = true;\n    }\n  }\n  disconnectedCallback() {\n    if (\n      typeof window !== \"undefined\" &&\n      document.documentElement.classList.contains(\"db-page-document\")\n    ) {\n      // remove document styles set by this\n      document.documentElement.classList.remove(\"db-page-document\");\n    }\n  }\n\n  render() {\n    return (\n      <div\n        class={cls(\"db-page\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        data-variant={this.variant}\n        data-fade-in={this.fadeIn}\n        data-fonts-loaded={getBooleanAsString(this.fontsLoaded)}\n      >\n        <slot name=\"header\"></slot>\n        <main class={cls(\"db-main\", this.mainClass)}>\n          <slot></slot>\n        </main>\n        <slot name=\"footer\"></slot>\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"db-page.entry.cjs.js","mappings":"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","names":["h","cls","getBooleanAsString"],"sources":["src/components/page/page.tsx"],"sourcesContent":["import { DBPageProps, DBPageState } from \"./model\";\nimport { cls, getBooleanAsString } from \"../../utils\";\n\nimport { Component, h, Fragment, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot header - TODO: Add description for slotHeader\n * @slot footer - TODO: Add description for slotFooter\n */\n @Component({\n  tag: \"db-page\",\n})\nexport class DBPage {\n  private _ref!: HTMLDivElement | any;\n  @Prop() fadeIn: DBPageProps[\"fadeIn\"];\n  @Prop() documentOverflow: DBPageProps[\"documentOverflow\"];\n  @Prop() variant: DBPageProps[\"variant\"];\n  @Prop() id: DBPageProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBPageProps[\"className\"];\n  @Prop() mainClass: DBPageProps[\"mainClass\"];\n  @State() fontsLoaded = false;\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-page\");\n    this.fontsLoaded = !this.fadeIn;\n    if (document && this.fadeIn) {\n      document.fonts.ready.then(() => {\n        this.fontsLoaded = true;\n      });\n    } else {\n      this.fontsLoaded = true;\n    }\n  }\n  disconnectedCallback() {\n    if (\n      typeof window !== \"undefined\" &&\n      document.documentElement.classList.contains(\"db-page-document\")\n    ) {\n      // remove document styles set by this\n      document.documentElement.classList.remove(\"db-page-document\");\n    }\n  }\n\n  render() {\n    return (\n      <div\n        class={cls(\"db-page\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        data-variant={this.variant}\n        data-fade-in={getBooleanAsString(this.fadeIn)}\n        data-fonts-loaded={getBooleanAsString(this.fontsLoaded)}\n      >\n        <slot name=\"header\"></slot>\n        <main class={cls(\"db-main\", this.mainClass)}>\n          <slot></slot>\n        </main>\n        <slot name=\"footer\"></slot>\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/db-page.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"db-page.entry.cjs.js","sources":["src/components/page/page.tsx"],"sourcesContent":["import { DBPageProps, DBPageState } from \"./model\";\nimport { cls, getBooleanAsString } from \"../../utils\";\n\nimport { Component, h, Fragment, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot header - TODO: Add description for slotHeader\n * @slot footer - TODO: Add description for slotFooter\n */\n @Component({\n  tag: \"db-page\",\n})\nexport class DBPage {\n  private _ref!: HTMLDivElement | null;\n  @Prop() fadeIn: DBPageProps[\"fadeIn\"];\n  @Prop() documentOverflow: DBPageProps[\"documentOverflow\"];\n  @Prop() variant: DBPageProps[\"variant\"];\n  @Prop() id: DBPageProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBPageProps[\"className\"];\n  @Prop() mainClass: DBPageProps[\"mainClass\"];\n\n  @State() fontsLoaded = false;\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-page\");\n    this.fontsLoaded = !this.fadeIn;\n    if (document && this.fadeIn) {\n      document.fonts.ready.then(() => {\n        this.fontsLoaded = true;\n      });\n    } else {\n      this.fontsLoaded = true;\n    }\n  }\n  disconnectedCallback() {\n    if (\n      typeof window !== \"undefined\" &&\n      document.documentElement.classList.contains(\"db-page-document\")\n    ) {\n      // remove document styles set by this\n      document.documentElement.classList.remove(\"db-page-document\");\n    }\n  }\n\n  render() {\n    return (\n      <div\n        class={cls(\"db-page\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        data-variant={this.variant}\n        data-fade-in={this.fadeIn}\n        data-fonts-loaded={getBooleanAsString(this.fontsLoaded)}\n      >\n        <slot name=\"header\"></slot>\n        <main class={cls(\"db-main\", this.mainClass)}>\n          <slot></slot>\n        </main>\n        <slot name=\"footer\"></slot>\n      </div>\n    );\n  }\n}\n"],"names":["h","cls","getBooleanAsString"],"mappings":"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"}
+{"version":3,"file":"db-page.entry.cjs.js","sources":["src/components/page/page.tsx"],"sourcesContent":["import { DBPageProps, DBPageState } from \"./model\";\nimport { cls, getBooleanAsString } from \"../../utils\";\n\nimport { Component, h, Fragment, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot header - TODO: Add description for slotHeader\n * @slot footer - TODO: Add description for slotFooter\n */\n @Component({\n  tag: \"db-page\",\n})\nexport class DBPage {\n  private _ref!: HTMLDivElement | any;\n  @Prop() fadeIn: DBPageProps[\"fadeIn\"];\n  @Prop() documentOverflow: DBPageProps[\"documentOverflow\"];\n  @Prop() variant: DBPageProps[\"variant\"];\n  @Prop() id: DBPageProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBPageProps[\"className\"];\n  @Prop() mainClass: DBPageProps[\"mainClass\"];\n  @State() fontsLoaded = false;\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-page\");\n    this.fontsLoaded = !this.fadeIn;\n    if (document && this.fadeIn) {\n      document.fonts.ready.then(() => {\n        this.fontsLoaded = true;\n      });\n    } else {\n      this.fontsLoaded = true;\n    }\n  }\n  disconnectedCallback() {\n    if (\n      typeof window !== \"undefined\" &&\n      document.documentElement.classList.contains(\"db-page-document\")\n    ) {\n      // remove document styles set by this\n      document.documentElement.classList.remove(\"db-page-document\");\n    }\n  }\n\n  render() {\n    return (\n      <div\n        class={cls(\"db-page\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        data-variant={this.variant}\n        data-fade-in={getBooleanAsString(this.fadeIn)}\n        data-fonts-loaded={getBooleanAsString(this.fontsLoaded)}\n      >\n        <slot name=\"header\"></slot>\n        <main class={cls(\"db-main\", this.mainClass)}>\n          <slot></slot>\n        </main>\n        <slot name=\"footer\"></slot>\n      </div>\n    );\n  }\n}\n"],"names":["h","cls","getBooleanAsString"],"mappings":"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"}

package/dist/cjs/db-popover.cjs.entry.js

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-DBEtsnky.js');
-var index$1 = require('./index-DeqKGVDx.js');
+var index = require('./index-w2CAlvjJ.js');
+var index$1 = require('./index-9h8KqOUd.js');
 
 const DBPopover = class {
     constructor(hostRef) {
@@ -110,9 +110,9 @@ const DBPopover = class {
     }
     render() {
         var _a;
-        return (index.h("div", { key: '266a99bdc9c4e255642180c6775f55e6cb8f91c1', class: index$1.cls("db-popover", this.className), ref: (el) => {
+        return (index.h("div", { key: 'dd9a109cf9822c400063e906005cb7e4a0d77246', class: index$1.cls("db-popover", this.className), ref: (el) => {
                 this._ref = el;
-            }, id: this.id, onFocus: () => this.handleAutoPlacement(), onBlur: (event) => this.handleLeave(event), onMouseEnter: () => this.handleAutoPlacement(), onMouseLeave: (event) => this.handleLeave(event) }, index.h("slot", { key: '2e440979745c2c4b0a1026ae1c4556d8d27c5998', name: "trigger" }), index.h("article", { key: 'ac109522faf4e778db2969c5e4e9bdeaf16c6595', class: "db-popover-content", "data-spacing": this.spacing, "data-gap": index$1.getBooleanAsString(this.gap), "data-animation": index$1.getBooleanAsString((_a = this.animation) !== null && _a !== void 0 ? _a : true), "data-open": this.open, "data-delay": this.delay, "data-width": this.width, "data-placement": this.placement }, index.h("slot", { key: '8b4b1d8c324eff9a7ac5db2a742c11dfe25d68fb' }))));
+            }, id: this.id, onFocus: () => this.handleAutoPlacement(), onBlur: (event) => this.handleLeave(event), onMouseEnter: () => this.handleAutoPlacement(), onMouseLeave: (event) => this.handleLeave(event) }, index.h("slot", { key: '464ed37c74a82835b651477c0037755787d5a589', name: "trigger" }), index.h("article", { key: '6aaa12138b4a48fa29778beb48394ed32f95b0bf', class: "db-popover-content", "data-spacing": this.spacing, "data-gap": index$1.getBooleanAsString(this.gap), "data-animation": index$1.getBooleanAsString((_a = this.animation) !== null && _a !== void 0 ? _a : true), "data-open": index$1.getBooleanAsString(this.open), "data-delay": this.delay, "data-width": this.width, "data-placement": this.placement }, index.h("slot", { key: 'c0e8fdce2d08f6f7614a6fefc9372d3b506fe2a4' }))));
     }
     static get watchers() { return {
         "_ref": ["watch0", "watch1"],

package/dist/cjs/db-popover.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"db-popover.entry.cjs.js","mappings":"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","names":["handleDataOutside","h","cls","getBooleanAsString"],"sources":["src/components/popover/popover.tsx"],"sourcesContent":["import { DBPopoverProps, DBPopoverState } from \"./model\";\nimport { cls, getBooleanAsString, handleDataOutside } from \"../../utils\";\n\nimport { Component, h, Fragment, Watch, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot trigger - TODO: Add description for slotTrigger\n */\n @Component({\n  tag: \"db-popover\",\n})\nexport class DBPopover {\n  private _ref!: HTMLDivElement | null;\n  @Prop() id: DBPopoverProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBPopoverProps[\"className\"];\n  @Prop() spacing: DBPopoverProps[\"spacing\"];\n  @Prop() gap: DBPopoverProps[\"gap\"];\n  @Prop() animation: DBPopoverProps[\"animation\"];\n  @Prop() open: DBPopoverProps[\"open\"];\n  @Prop() delay: DBPopoverProps[\"delay\"];\n  @Prop() width: DBPopoverProps[\"width\"];\n  @Prop() placement: DBPopoverProps[\"placement\"];\n\n  @State() initialized = false;\n  @State() isExpanded = false;\n\n  handleAutoPlacement() {\n    this.isExpanded = true;\n    if (!this._ref) return;\n    const article = this._ref.querySelector(\"article\");\n    if (!article) return;\n    handleDataOutside(article);\n  }\n  handleLeave(event: any) {\n    const element = event.target as HTMLElement;\n    const parent = element.parentNode;\n    if (\n      !parent ||\n      (element.parentNode.querySelector(\":focus\") !== element &&\n        element.parentNode.querySelector(\":focus-within\") !== element &&\n        element.parentNode.querySelector(\":hover\") !== element)\n    ) {\n      this.isExpanded = false;\n    }\n  }\n  getTrigger() {\n    if (this._ref) {\n      const children: Element[] = Array.from(this._ref.children);\n      if (children.length >= 2) {\n        const firstChild = children[0];\n        if (firstChild.tagName.includes(\"-\")) {\n          // this is a workaround for custom angular components\n          return firstChild.children?.length > 0\n            ? firstChild.children[0]\n            : null;\n        } else {\n          return firstChild;\n        }\n      }\n    }\n    return null;\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._ref && this.initialized) {\n      const child = this.getTrigger();\n      if (child) {\n        child.ariaHasPopup = \"true\";\n      }\n      this.initialized = false;\n    }\n  }\n\n  @Watch(\"_ref\")\n  @Watch(\"initialized\")\n  watch0() {\n    this.watch0Fn();\n  }\n\n  watch1Fn() {\n    if (this._ref) {\n      const child = this.getTrigger();\n      if (child) {\n        child.ariaExpanded = Boolean(this.isExpanded).toString();\n      }\n    }\n  }\n\n  @Watch(\"_ref\")\n  @Watch(\"isExpanded\")\n  watch1() {\n    this.watch1Fn();\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-popover\");\n    this.initialized = true;\n    this.watch0Fn();\n    this.watch1Fn();\n  }\n\n  render() {\n    return (\n      <div\n        class={cls(\"db-popover\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        onFocus={() => this.handleAutoPlacement()}\n        onBlur={(event) => this.handleLeave(event)}\n        onMouseEnter={() => this.handleAutoPlacement()}\n        onMouseLeave={(event) => this.handleLeave(event)}\n      >\n        <slot name=\"trigger\"></slot>\n        <article\n          class=\"db-popover-content\"\n          data-spacing={this.spacing}\n          data-gap={getBooleanAsString(this.gap)}\n          data-animation={getBooleanAsString(this.animation ?? true)}\n          data-open={this.open}\n          data-delay={this.delay}\n          data-width={this.width}\n          data-placement={this.placement}\n        >\n          <slot></slot>\n        </article>\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"db-popover.entry.cjs.js","mappings":";;;;;MAaa,SAAS,GAAA,MAAA;AAHrB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAcU,QAAA,IAAW,CAAA,WAAA,GAAG,KAAK;AACnB,QAAA,IAAU,CAAA,UAAA,GAAG,KAAK;AAkJ5B;IAhJC,mBAAmB,GAAA;AACjB,QAAA,IAAI,CAAC,UAAU,GAAG,IAAI;QACtB,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE;QAChB,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC;AAClD,QAAA,IAAI,CAAC,OAAO;YAAE;QACdA,yBAAiB,CAAC,OAAO,CAAC;;AAE5B,IAAA,WAAW,CAAC,KAAU,EAAA;AACpB,QAAA,MAAM,OAAO,GAAG,KAAK,CAAC,MAAqB;AAC3C,QAAA,MAAM,MAAM,GAAG,OAAO,CAAC,UAAU;AACjC,QAAA,IACE,CAAC,MAAM;aACN,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,QAAQ,CAAC,KAAK,OAAO;gBACrD,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,eAAe,CAAC,KAAK,OAAO;gBAC7D,OAAO,CAAC,UAAU,CAAC,aAAa,CAAC,QAAQ,CAAC,KAAK,OAAO,CAAC,EACzD;AACA,YAAA,IAAI,CAAC,UAAU,GAAG,KAAK;;;IAG3B,UAAU,GAAA;;AACR,QAAA,IAAI,IAAI,CAAC,IAAI,EAAE;AACb,YAAA,MAAM,QAAQ,GAAc,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;AAC1D,YAAA,IAAI,QAAQ,CAAC,MAAM,IAAI,CAAC,EAAE;AACxB,gBAAA,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC;gBAC9B,IAAI,UAAU,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;;AAEpC,oBAAA,OAAO,CAAA,MAAA,UAAU,CAAC,QAAQ,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,MAAM,IAAG;AACnC,0BAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;0BACrB,IAAI;;qBACH;AACL,oBAAA,OAAO,UAAU;;;;AAIvB,QAAA,OAAO,IAAI;;AAGb;;;;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,QAAQ,GAAA;QACN,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,WAAW,EAAE;AACjC,YAAA,MAAM,KAAK,GAAG,IAAI,CAAC,UAAU,EAAE;YAC/B,IAAI,KAAK,EAAE;AACT,gBAAA,KAAK,CAAC,YAAY,GAAG,MAAM;;AAE7B,YAAA,IAAI,CAAC,WAAW,GAAG,KAAK;;;IAM5B,MAAM,GAAA;QACJ,IAAI,CAAC,QAAQ,EAAE;;IAGjB,QAAQ,GAAA;AACN,QAAA,IAAI,IAAI,CAAC,IAAI,EAAE;AACb,YAAA,MAAM,KAAK,GAAG,IAAI,CAAC,UAAU,EAAE;YAC/B,IAAI,KAAK,EAAE;AACT,gBAAA,KAAK,CAAC,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,QAAQ,EAAE;;;;IAO9D,MAAM,GAAA;QACJ,IAAI,CAAC,QAAQ,EAAE;;IAGjB,gBAAgB,GAAA;QACd,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,IAAI,EAAE,YAAY,CAAC;AACpD,QAAA,IAAI,CAAC,WAAW,GAAG,IAAI;QACvB,IAAI,CAAC,QAAQ,EAAE;QACf,IAAI,CAAC,QAAQ,EAAE;;IAGjB,MAAM,GAAA;;QACJ,QACEC,OACE,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAEC,WAAG,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,EAAE,EACX,OAAO,EAAE,MAAM,IAAI,CAAC,mBAAmB,EAAE,EACzC,MAAM,EAAE,CAAC,KAAK,KAAK,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,EAC1C,YAAY,EAAE,MAAM,IAAI,CAAC,mBAAmB,EAAE,EAC9C,YAAY,EAAE,CAAC,KAAK,KAAK,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,EAAA,EAEhDD,OAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,SAAS,EAAQ,CAAA,EAC5BA,OAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,oBAAoB,kBACZ,IAAI,CAAC,OAAO,EAChB,UAAA,EAAAE,0BAAkB,CAAC,IAAI,CAAC,GAAG,CAAC,EAAA,gBAAA,EACtBA,0BAAkB,CAAC,CAAA,EAAA,GAAA,IAAI,CAAC,SAAS,MAAI,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAA,IAAI,CAAC,EAC/C,WAAA,EAAAA,0BAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAA,YAAA,EAC5B,IAAI,CAAC,KAAK,gBACV,IAAI,CAAC,KAAK,EACN,gBAAA,EAAA,IAAI,CAAC,SAAS,EAAA,EAE9BF,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACL,CACN;;;;;;;;;;;","names":["handleDataOutside","h","cls","getBooleanAsString"],"sources":["src/components/popover/popover.tsx"],"sourcesContent":["import { DBPopoverProps, DBPopoverState } from \"./model\";\nimport { cls, getBooleanAsString, handleDataOutside } from \"../../utils\";\n\nimport { Component, h, Fragment, Watch, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot trigger - TODO: Add description for slotTrigger\n */\n @Component({\n  tag: \"db-popover\",\n})\nexport class DBPopover {\n  private _ref!: HTMLDivElement | any;\n  @Prop() id: DBPopoverProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBPopoverProps[\"className\"];\n  @Prop() spacing: DBPopoverProps[\"spacing\"];\n  @Prop() gap: DBPopoverProps[\"gap\"];\n  @Prop() animation: DBPopoverProps[\"animation\"];\n  @Prop() open: DBPopoverProps[\"open\"];\n  @Prop() delay: DBPopoverProps[\"delay\"];\n  @Prop() width: DBPopoverProps[\"width\"];\n  @Prop() placement: DBPopoverProps[\"placement\"];\n  @State() initialized = false;\n  @State() isExpanded = false;\n\n  handleAutoPlacement() {\n    this.isExpanded = true;\n    if (!this._ref) return;\n    const article = this._ref.querySelector(\"article\");\n    if (!article) return;\n    handleDataOutside(article);\n  }\n  handleLeave(event: any) {\n    const element = event.target as HTMLElement;\n    const parent = element.parentNode;\n    if (\n      !parent ||\n      (element.parentNode.querySelector(\":focus\") !== element &&\n        element.parentNode.querySelector(\":focus-within\") !== element &&\n        element.parentNode.querySelector(\":hover\") !== element)\n    ) {\n      this.isExpanded = false;\n    }\n  }\n  getTrigger() {\n    if (this._ref) {\n      const children: Element[] = Array.from(this._ref.children);\n      if (children.length >= 2) {\n        const firstChild = children[0];\n        if (firstChild.tagName.includes(\"-\")) {\n          // this is a workaround for custom angular components\n          return firstChild.children?.length > 0\n            ? firstChild.children[0]\n            : null;\n        } else {\n          return firstChild;\n        }\n      }\n    }\n    return null;\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._ref && this.initialized) {\n      const child = this.getTrigger();\n      if (child) {\n        child.ariaHasPopup = \"true\";\n      }\n      this.initialized = false;\n    }\n  }\n\n  @Watch(\"_ref\")\n  @Watch(\"initialized\")\n  watch0() {\n    this.watch0Fn();\n  }\n\n  watch1Fn() {\n    if (this._ref) {\n      const child = this.getTrigger();\n      if (child) {\n        child.ariaExpanded = Boolean(this.isExpanded).toString();\n      }\n    }\n  }\n\n  @Watch(\"_ref\")\n  @Watch(\"isExpanded\")\n  watch1() {\n    this.watch1Fn();\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-popover\");\n    this.initialized = true;\n    this.watch0Fn();\n    this.watch1Fn();\n  }\n\n  render() {\n    return (\n      <div\n        class={cls(\"db-popover\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        onFocus={() => this.handleAutoPlacement()}\n        onBlur={(event) => this.handleLeave(event)}\n        onMouseEnter={() => this.handleAutoPlacement()}\n        onMouseLeave={(event) => this.handleLeave(event)}\n      >\n        <slot name=\"trigger\"></slot>\n        <article\n          class=\"db-popover-content\"\n          data-spacing={this.spacing}\n          data-gap={getBooleanAsString(this.gap)}\n          data-animation={getBooleanAsString(this.animation ?? true)}\n          data-open={getBooleanAsString(this.open)}\n          data-delay={this.delay}\n          data-width={this.width}\n          data-placement={this.placement}\n        >\n          <slot></slot>\n        </article>\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/db-popover.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"db-popover.entry.cjs.js","sources":["src/components/popover/popover.tsx"],"sourcesContent":["import { DBPopoverProps, DBPopoverState } from \"./model\";\nimport { cls, getBooleanAsString, handleDataOutside } from \"../../utils\";\n\nimport { Component, h, Fragment, Watch, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot trigger - TODO: Add description for slotTrigger\n */\n @Component({\n  tag: \"db-popover\",\n})\nexport class DBPopover {\n  private _ref!: HTMLDivElement | null;\n  @Prop() id: DBPopoverProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBPopoverProps[\"className\"];\n  @Prop() spacing: DBPopoverProps[\"spacing\"];\n  @Prop() gap: DBPopoverProps[\"gap\"];\n  @Prop() animation: DBPopoverProps[\"animation\"];\n  @Prop() open: DBPopoverProps[\"open\"];\n  @Prop() delay: DBPopoverProps[\"delay\"];\n  @Prop() width: DBPopoverProps[\"width\"];\n  @Prop() placement: DBPopoverProps[\"placement\"];\n\n  @State() initialized = false;\n  @State() isExpanded = false;\n\n  handleAutoPlacement() {\n    this.isExpanded = true;\n    if (!this._ref) return;\n    const article = this._ref.querySelector(\"article\");\n    if (!article) return;\n    handleDataOutside(article);\n  }\n  handleLeave(event: any) {\n    const element = event.target as HTMLElement;\n    const parent = element.parentNode;\n    if (\n      !parent ||\n      (element.parentNode.querySelector(\":focus\") !== element &&\n        element.parentNode.querySelector(\":focus-within\") !== element &&\n        element.parentNode.querySelector(\":hover\") !== element)\n    ) {\n      this.isExpanded = false;\n    }\n  }\n  getTrigger() {\n    if (this._ref) {\n      const children: Element[] = Array.from(this._ref.children);\n      if (children.length >= 2) {\n        const firstChild = children[0];\n        if (firstChild.tagName.includes(\"-\")) {\n          // this is a workaround for custom angular components\n          return firstChild.children?.length > 0\n            ? firstChild.children[0]\n            : null;\n        } else {\n          return firstChild;\n        }\n      }\n    }\n    return null;\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._ref && this.initialized) {\n      const child = this.getTrigger();\n      if (child) {\n        child.ariaHasPopup = \"true\";\n      }\n      this.initialized = false;\n    }\n  }\n\n  @Watch(\"_ref\")\n  @Watch(\"initialized\")\n  watch0() {\n    this.watch0Fn();\n  }\n\n  watch1Fn() {\n    if (this._ref) {\n      const child = this.getTrigger();\n      if (child) {\n        child.ariaExpanded = Boolean(this.isExpanded).toString();\n      }\n    }\n  }\n\n  @Watch(\"_ref\")\n  @Watch(\"isExpanded\")\n  watch1() {\n    this.watch1Fn();\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-popover\");\n    this.initialized = true;\n    this.watch0Fn();\n    this.watch1Fn();\n  }\n\n  render() {\n    return (\n      <div\n        class={cls(\"db-popover\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        onFocus={() => this.handleAutoPlacement()}\n        onBlur={(event) => this.handleLeave(event)}\n        onMouseEnter={() => this.handleAutoPlacement()}\n        onMouseLeave={(event) => this.handleLeave(event)}\n      >\n        <slot name=\"trigger\"></slot>\n        <article\n          class=\"db-popover-content\"\n          data-spacing={this.spacing}\n          data-gap={getBooleanAsString(this.gap)}\n          data-animation={getBooleanAsString(this.animation ?? true)}\n          data-open={this.open}\n          data-delay={this.delay}\n          data-width={this.width}\n          data-placement={this.placement}\n        >\n          <slot></slot>\n        </article>\n      </div>\n    );\n  }\n}\n"],"names":["handleDataOutside","h","cls","getBooleanAsString"],"mappings":"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"}
+{"version":3,"file":"db-popover.entry.cjs.js","sources":["src/components/popover/popover.tsx"],"sourcesContent":["import { DBPopoverProps, DBPopoverState } from \"./model\";\nimport { cls, getBooleanAsString, handleDataOutside } from \"../../utils\";\n\nimport { Component, h, Fragment, Watch, Prop, State } from \"@stencil/core\";\n\n\n/**\n * @slot children - This is a default/unnamed slot\n * @slot trigger - TODO: Add description for slotTrigger\n */\n @Component({\n  tag: \"db-popover\",\n})\nexport class DBPopover {\n  private _ref!: HTMLDivElement | any;\n  @Prop() id: DBPopoverProps[\"id\"];\n  @Prop({attribute: \"classname\"}) className: DBPopoverProps[\"className\"];\n  @Prop() spacing: DBPopoverProps[\"spacing\"];\n  @Prop() gap: DBPopoverProps[\"gap\"];\n  @Prop() animation: DBPopoverProps[\"animation\"];\n  @Prop() open: DBPopoverProps[\"open\"];\n  @Prop() delay: DBPopoverProps[\"delay\"];\n  @Prop() width: DBPopoverProps[\"width\"];\n  @Prop() placement: DBPopoverProps[\"placement\"];\n  @State() initialized = false;\n  @State() isExpanded = false;\n\n  handleAutoPlacement() {\n    this.isExpanded = true;\n    if (!this._ref) return;\n    const article = this._ref.querySelector(\"article\");\n    if (!article) return;\n    handleDataOutside(article);\n  }\n  handleLeave(event: any) {\n    const element = event.target as HTMLElement;\n    const parent = element.parentNode;\n    if (\n      !parent ||\n      (element.parentNode.querySelector(\":focus\") !== element &&\n        element.parentNode.querySelector(\":focus-within\") !== element &&\n        element.parentNode.querySelector(\":hover\") !== element)\n    ) {\n      this.isExpanded = false;\n    }\n  }\n  getTrigger() {\n    if (this._ref) {\n      const children: Element[] = Array.from(this._ref.children);\n      if (children.length >= 2) {\n        const firstChild = children[0];\n        if (firstChild.tagName.includes(\"-\")) {\n          // this is a workaround for custom angular components\n          return firstChild.children?.length > 0\n            ? firstChild.children[0]\n            : null;\n        } else {\n          return firstChild;\n        }\n      }\n    }\n    return null;\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._ref && this.initialized) {\n      const child = this.getTrigger();\n      if (child) {\n        child.ariaHasPopup = \"true\";\n      }\n      this.initialized = false;\n    }\n  }\n\n  @Watch(\"_ref\")\n  @Watch(\"initialized\")\n  watch0() {\n    this.watch0Fn();\n  }\n\n  watch1Fn() {\n    if (this._ref) {\n      const child = this.getTrigger();\n      if (child) {\n        child.ariaExpanded = Boolean(this.isExpanded).toString();\n      }\n    }\n  }\n\n  @Watch(\"_ref\")\n  @Watch(\"isExpanded\")\n  watch1() {\n    this.watch1Fn();\n  }\n\n  componentDidLoad() {\n    this.enableAttributePassing(this._ref, \"db-popover\");\n    this.initialized = true;\n    this.watch0Fn();\n    this.watch1Fn();\n  }\n\n  render() {\n    return (\n      <div\n        class={cls(\"db-popover\", this.className)}\n        ref={(el: any) => {\n          this._ref = el;\n        }}\n        id={this.id}\n        onFocus={() => this.handleAutoPlacement()}\n        onBlur={(event) => this.handleLeave(event)}\n        onMouseEnter={() => this.handleAutoPlacement()}\n        onMouseLeave={(event) => this.handleLeave(event)}\n      >\n        <slot name=\"trigger\"></slot>\n        <article\n          class=\"db-popover-content\"\n          data-spacing={this.spacing}\n          data-gap={getBooleanAsString(this.gap)}\n          data-animation={getBooleanAsString(this.animation ?? true)}\n          data-open={getBooleanAsString(this.open)}\n          data-delay={this.delay}\n          data-width={this.width}\n          data-placement={this.placement}\n        >\n          <slot></slot>\n        </article>\n      </div>\n    );\n  }\n}\n"],"names":["handleDataOutside","h","cls","getBooleanAsString"],"mappings":"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"}