@nova-design-system/nova-webcomponents 3.20.0 → 3.21.0

package/dist/esm/nv-iconbutton_2.entry.js

@@ -55,6 +55,11 @@ const NvIconbutton = class {
          * Sets the shape of the button. Choose between square and rounded.
          */
         this.shape = 'square';
+        /**
+         * Use this to make the button skip-able when users navigate with the keyboard.
+         * The button remains clickable but won’t be reached via the Tab key.
+         */
+        this.disableTabindex = false;
         //#endregion PROPERTIES
         /****************************************************************************/
         //#region METHODS
@@ -120,7 +125,7 @@ const NvIconbutton = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '5590d5f6378669a2f74ce93d33ac14c86f435523', role: "button", type: this.type, tabindex: "0", disabled: this.disabled ? true : undefined, class: clsx('root', `size-${this.size}`, `emphasis-${this.emphasis}`, this.loading && 'loading', `shape-${this.shape}`), onClick: this.handleClick }, this.loading && h("nv-loader", { key: 'f88ed8a8b579d15318f419c8072a4c14e56990ce', size: this.size }), !this.loading && h("nv-icon", { key: '12b3fc9818014ea93237e8037ce2d90ee214517a', name: this.name, size: this.size }), h("slot", { key: '97e130b7caf544954f3168866429ed7633e46301' })));
+        return (h(Host, { key: 'f3d9a8c4f5f3b549595b1a4b8eecddae89b23909', role: "button", type: this.type, tabindex: this.disableTabindex ? -1 : 0, disabled: this.disabled ? true : undefined, class: clsx('root', `size-${this.size}`, `emphasis-${this.emphasis}`, this.loading && 'loading', `shape-${this.shape}`), onClick: this.handleClick }, this.loading && h("nv-loader", { key: '9f25f8a2c72279f1ad4c92ed6e17341e4b43f26e', size: this.size }), !this.loading && h("nv-icon", { key: 'aa0d10482d4dded8f6680afe066c3c8d781160ef', name: this.name, size: this.size }), h("slot", { key: 'dc2a1ca7305ae4b14924d7acb79286596e5b358f' })));
     }
     static get formAssociated() { return true; }
     get el() { return getElement(this); }

package/dist/esm/nv-iconbutton_2.entry.js.map

@@ -1 +1 @@
-{"file":"nv-iconbutton.nv-loader.entry.js","mappings":";;;AAAA,MAAM,eAAe,GAAG,4uJAA4uJ,CAAC;AACrwJ,2BAAe,eAAe;;MC6BjB,YAAY;IAPzB;;;;;;;;;;;;;;;;QAoBW,SAAI,GAAoB,IAAI,CAAC;;;;;;QAQ7B,aAAQ,GAAwB,MAAM,CAAC;;;;;;;;QAUhD,YAAO,GAAY,KAAK,CAAC;;;;QAMzB,aAAQ,GAAY,KAAK,CAAC;;;;;QAOjB,WAAM,GAAY,KAAK,CAAC;;;;;;QAgBxB,SAAI,GAAoB,QAAQ,CAAC;;;;QAMjC,UAAK,GAAyB,QAAQ,CAAC;;;;;;;;;;QAYxC,gBAAW,GAAG,CAAC,KAAY;;YACjC,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACjB,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,OAAO;aACR;YAED,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;gBAC1B,MAAA,MAAA,IAAI,CAAC,SAAS,0CAAE,IAAI,0CAAE,aAAa,EAAE,CAAC;aACvC;YACD,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,EAAE;gBACzB,MAAA,MAAA,IAAI,CAAC,SAAS,0CAAE,IAAI,0CAAE,KAAK,EAAE,CAAC;aAC/B;SACF,CAAC;KAgFH;;;;IAzEC,mBAAmB,CAAC,OAAgB;QAClC,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;QACvB,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC;KACzB;IAGD,oBAAoB,CAAC,QAAiB;QACpC,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC;SAC9B;aAAM;YACL,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;SAC1B;KACF;;;;IAOD,aAAa,CAAC,KAAoB;QAChC,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE;YAC9C,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC;SACjB;KACF;IAGD,gBAAgB,CAAC,KAAiB;QAChC,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC;YAAE,OAAO;QACrC,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC;KACjB;;;;IAMD,iBAAiB;QACf,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC;SAC9B;KACF;;;;IAMD,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,IAAI,EAAC,QAAQ,EACb,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAC,GAAG,EACZ,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,SAAS,EAC1C,KAAK,EAAE,IAAI,CACT,MAAM,EACN,QAAQ,IAAI,CAAC,IAAI,EAAE,EACnB,YAAY,IAAI,CAAC,QAAQ,EAAE,EAC3B,IAAI,CAAC,OAAO,IAAI,SAAS,EACzB,SAAS,IAAI,CAAC,KAAK,EAAE,CACtB,EACD,OAAO,EAAE,IAAI,CAAC,WAAW,IAExB,IAAI,CAAC,OAAO,IAAI,kEAAW,IAAI,EAAE,IAAI,CAAC,IAAI,GAAc,EAExD,CAAC,IAAI,CAAC,OAAO,IAAI,gEAAS,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,EAE/D,8DAAa,CACR,EACP;KACH;;;;;;;;;;ACrMH,MAAM,WAAW,GAAG,qoHAAqoH,CAAC;AAC1pH,uBAAe,WAAW;;MCSb,QAAQ;IALrB;;;;;;;;;QAeW,SAAI,GAAuB,IAAI,CAAC;KA2B1C;;;;;IAZC,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,KAAK,EAAE,IAAI,CACT,IAAI,CAAC,IAAI,IAAI,QAAQ,IAAI,CAAC,IAAI,EAAE,EAChC,IAAI,CAAC,KAAK,IAAI,SAAS,IAAI,CAAC,KAAK,EAAE,CACpC,GACK,EACR;KACH;;;;;;","names":[],"sources":["src/components/nv-iconbutton/nv-iconbutton.scss?tag=nv-iconbutton","src/components/nv-iconbutton/nv-iconbutton.tsx","src/components/nv-loader/nv-loader.scss?tag=nv-loader","src/components/nv-loader/nv-loader.tsx"],"sourcesContent":["@use \"sass:map\";\n@import \"../../styles/focus-ring\";\n\n/* Variants */\n$button-sizes: (\"xs\", \"sm\", \"md\", \"lg\");\n$button-emphasis: (\"high\", \"medium\", \"low\", \"lower\");\n\n/* Define maps for size-related variables */\n$button-icon-button-padding: (\n  \"xs\": var(--button-xs-icon-button-padding),\n  \"sm\": var(--button-sm-icon-button-padding),\n  \"md\": var(--button-md-icon-button-padding),\n  \"lg\": var(--button-lg-icon-button-padding)\n);\n\n$button-gap: (\n  \"xs\": var(--button-xs-gap),\n  \"sm\": var(--button-sm-gap),\n  \"md\": var(--button-md-gap),\n  \"lg\": var(--button-lg-gap)\n);\n\n$button-border-radius: (\n  \"xs\": var(--button-xs-border-radius),\n  \"sm\": var(--button-sm-border-radius),\n  \"md\": var(--button-md-border-radius),\n  \"lg\": var(--button-lg-border-radius)\n);\n\n$button-line-height: (\n  \"xs\": var(--button-xs-line-height),\n  \"sm\": var(--button-sm-line-height),\n  \"md\": var(--button-md-line-height),\n  \"lg\": var(--button-lg-line-height)\n);\n\n$button-font-size: (\n  \"xs\": var(--button-xs-font-size),\n  \"sm\": var(--button-sm-font-size),\n  \"md\": var(--button-md-font-size),\n  \"lg\": var(--button-lg-font-size)\n);\n\n/* Define maps for emphasis-related variables */\n$components-button-background: (\n  \"high\": var(--components-button-high-background),\n  \"medium\": var(--components-button-medium-background),\n  \"low\": var(--components-button-low-background),\n  \"lower\": var(--components-button-lower-background)\n);\n\n$components-button-border: (\n  \"high\": var(--components-button-high-border),\n  \"medium\": var(--components-button-medium-border),\n  \"low\": var(--components-button-low-border),\n  \"lower\": var(--components-button-lower-border)\n);\n\n$components-button-text: (\n  \"high\": var(--components-button-high-text),\n  \"medium\": var(--components-button-medium-text),\n  \"low\": var(--components-button-low-text),\n  \"lower\": var(--components-button-lower-text)\n);\n\n$components-button-background-hover: (\n  \"high\": var(--components-button-high-background-hover),\n  \"medium\": var(--components-button-medium-background-hover),\n  \"low\": var(--components-button-low-background-hover),\n  \"lower\": var(--components-button-lower-background-hover)\n);\n\n$components-button-text-hover: (\n  \"high\": var(--components-button-high-text-hover),\n  \"medium\": var(--components-button-medium-text-hover),\n  \"low\": var(--components-button-low-text-hover),\n  \"lower\": var(--components-button-lower-text-hover)\n);\n\n$components-button-icon: (\n  \"high\": var(--components-button-high-icon),\n  \"medium\": var(--components-button-medium-icon),\n  \"low\": var(--components-button-low-icon),\n  \"lower\": var(--components-button-lower-icon)\n);\n\n@mixin root-styles() {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  font-style: normal;\n  font-weight: var(--font-weight-medium-emphasis);\n  font-family: var(--font-family-default), var(--font-family-fallback), sans-serif;\n  transition: background-color 150ms ease-out;\n  height: fit-content;\n  width: fit-content;\n}\n\n@mixin size-styles($size) {\n  padding: map.get($button-icon-button-padding, $size);\n  gap: map.get($button-gap, $size);\n  border-radius: map.get($button-border-radius, $size);\n  line-height: map.get($button-line-height, $size);\n  font-size: map.get($button-font-size, $size);\n}\n\n@mixin emphasis-styles($emphasis) {\n  background: map.get($components-button-background, $emphasis);\n  border: 1px solid map.get($components-button-border, $emphasis);\n  color: map.get($components-button-text, $emphasis);\n\n  &:hover {\n    background: map.get($components-button-background-hover, $emphasis);\n    color: map.get($components-button-text-hover, $emphasis);\n  }\n\n  @include focus-ring();\n\n  &:disabled {\n    background: map.get($components-button-background, $emphasis);\n    color: map.get($components-button-text, $emphasis);\n    opacity: 0.5;\n    cursor: not-allowed;\n    box-shadow: none;\n  }\n\n  & nv-icon > svg {\n    color: map.get($components-button-icon, $emphasis);\n  }\n}\n\nnv-iconbutton {\n  &.root {\n    @include root-styles();\n  }\n\n  @each $size in $button-sizes {\n    &.size-#{$size} {\n      @include size-styles($size);\n    }\n  }\n\n  @each $emphasis in $button-emphasis {\n    &.emphasis-#{$emphasis} {\n      @include emphasis-styles($emphasis);\n    }\n  }\n\n  &.loading {\n    [slot=\"leading-icon\"] {\n      display: none;\n    }\n  }\n\n  &.shape-rounded {\n    border-radius: var(--radius-rounded-full);\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  AttachInternals,\n  Element,\n  Watch,\n  Listen,\n} from '@stencil/core';\nimport clsx from 'clsx';\n\nimport {\n  ButtonSize,\n  ButtonEmphasis,\n  ButtonType,\n  IconButtonShape,\n} from '../../utils/constants';\nimport { IconName } from '../nv-icon/nv-icons';\n\n/**\n * @slot default - Content of the button.\n */\n@Component({\n  tag: 'nv-iconbutton',\n  shadow: false,\n  formAssociated: true,\n  styleUrl: 'nv-iconbutton.scss',\n  scoped: false,\n})\nexport class NvIconbutton {\n  @AttachInternals() internals: ElementInternals;\n  @Element() el: HTMLNvIconbuttonElement;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Determines how large or small the button appears, allowing for\n   * customization of the button's dimensions to fit different design\n   * specifications and user needs.\n   */\n  @Prop({ reflect: true })\n  readonly size: `${ButtonSize}` = 'md';\n\n  /**\n   * Adjusts the button’s emphasis to make it more or less visually prominent\n   * to users. Use this to draw attention to important actions or reduce focus\n   * on less critical ones.\n   */\n  @Prop({ reflect: true })\n  readonly emphasis: `${ButtonEmphasis}` = 'high';\n\n  /**\n   * Set this to true to show a spinner on the button, letting users know that\n   * their action is being processed. It helps improve user experience by\n   * indicating ongoing activities. The icon is not displayed when the button\n   * is loading. Also, the button is disabled. If you want to disable the\n   * button, it is not possible. It is automatically disabled when loading.\n   */\n  @Prop({ reflect: true, mutable: true })\n  loading: boolean = false;\n\n  /**\n   * Disables the button, preventing user interaction.\n   */\n  @Prop({ mutable: true, reflect: true })\n  disabled: boolean = false;\n\n  /**\n   * Makes the button look active when it’s within a compatible component\n   * like a button group.\n   */\n  @Prop({ reflect: true })\n  readonly active: boolean = false;\n\n  /**\n   * Choose the icon you want to display. This also sets the aria-label for\n   * improved accessibility, helping users who rely on screen readers.\n   * The icon is not displayed when the button is loading.\n   */\n  @Prop({ reflect: true })\n  readonly name: `${IconName}` | string;\n\n  /**\n   * Sets the button type to control its function in forms. Use 'submit' to send\n   * form data, 'reset' to clear the form, or 'button' for a standard button\n   * that doesn’t interact with form submission by default.\n   */\n  @Prop({ reflect: true })\n  readonly type: `${ButtonType}` = 'button';\n\n  /**\n   * Sets the shape of the button. Choose between square and rounded.\n   */\n  @Prop({ reflect: true })\n  readonly shape: `${IconButtonShape}` = 'square';\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Handles form-related actions when the button is clicked.\n   * - Submits the form if the button type is 'submit'.\n   * - Resets the form if the button type is 'reset'.\n   * @param {Event} event - The click event.\n   */\n  private handleClick = (event: Event) => {\n    if (this.disabled) {\n      event.preventDefault();\n      return;\n    }\n\n    if (this.type === 'submit') {\n      this.internals?.form?.requestSubmit();\n    }\n    if (this.type === 'reset') {\n      this.internals?.form?.reset();\n    }\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  @Watch('loading')\n  handleLoadingChange(loading: boolean) {\n    this.loading = loading;\n    this.disabled = loading;\n  }\n\n  @Watch('disabled')\n  handleDisabledChange(disabled: boolean) {\n    if (this.loading) {\n      this.disabled = this.loading;\n    } else {\n      this.disabled = disabled;\n    }\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region EVENTS\n\n  @Listen('keydown', { passive: false })\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      this.el.click();\n    }\n  }\n\n  @Listen('touchstart', { passive: false })\n  handleTouchStart(event: TouchEvent) {\n    if (event.touches.length > 1) return;\n    event.preventDefault();\n    this.el.click();\n  }\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    if (this.loading) {\n      this.disabled = this.loading;\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        role=\"button\"\n        type={this.type}\n        tabindex=\"0\"\n        disabled={this.disabled ? true : undefined}\n        class={clsx(\n          'root',\n          `size-${this.size}`,\n          `emphasis-${this.emphasis}`,\n          this.loading && 'loading',\n          `shape-${this.shape}`,\n        )}\n        onClick={this.handleClick}\n      >\n        {this.loading && <nv-loader size={this.size}></nv-loader>}\n\n        {!this.loading && <nv-icon name={this.name} size={this.size} />}\n\n        <slot></slot>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n","@use \"sass:map\";\n\n/* Variants */\n$loader-sizes: (\"xs\", \"sm\", \"md\", \"lg\", \"xl\");\n$loader-color: (\"brand\", \"white\");\n\n/* Define maps for color-related variables */\n$components-loader-background: (\n  \"brand\": var(--components-loader-brand-background),\n  \"white\": var(--components-loader-white-background)\n);\n\n$components-loader-foreground: (\n  \"brand\": var(--components-loader-brand-foreground),\n  \"white\": var(--components-loader-white-foreground)\n);\n\n/* Define maps for size-related variables */\n$components-loader-size: (\n  \"xs\": var(--loader-size-xs),\n  \"sm\": var(--loader-size-sm),\n  \"md\": var(--loader-size-md),\n  \"lg\": var(--loader-size-lg),\n  \"xl\": var(--loader-size-xl)\n);\n\n@mixin root-styles() {\n  display: inline-block;\n  position: relative;\n  aspect-ratio: 1 / 1;\n  border-radius: 9999px;\n  color: inherit;\n}\n\n@mixin size-styles($size) {\n  $loader-size: map.get($components-loader-size, $size);\n  $border-size: calc($loader-size / 10);\n\n  width: $loader-size;\n  height: $loader-size;\n\n  &::before,\n  &::after {\n    content: \" \";\n    position: absolute;\n    top: 0;\n    left: 0;\n    border-radius: inherit;\n    width: 100%;\n    height: 100%;\n  }\n\n  &::before {\n    content: \" \";\n    border: $border-size solid;\n    opacity: 0.3;\n  }\n\n  &::after {\n    content: \" \";\n    border-top: $border-size solid transparent;\n    border-left: $border-size solid transparent;\n    border-right: $border-size solid transparent;\n    border-bottom: $border-size solid;\n    animation: rotation 1s linear infinite;\n  }\n}\n\n@mixin color-styles($color) {\n  &::before {\n    border-color: map.get($components-loader-background, $color);\n    opacity: 1;\n  }\n\n  &::after {\n    border-bottom-color: map.get($components-loader-foreground, $color);\n  }\n}\n\n@keyframes rotation {\n  0% {\n    transform: rotate(0deg);\n  }\n\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\nnv-loader {\n  @include root-styles();\n\n  @each $size in $loader-sizes {\n    &.size-#{$size} {\n      @include size-styles($size);\n    }\n  }\n\n  @each $color in $loader-color {\n    &.color-#{$color} {\n      @include color-styles($color);\n    }\n  }\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\nimport { SemanticSizes, LoaderColors } from '../../utils/constants';\n\n@Component({\n  tag: 'nv-loader',\n  styleUrl: 'nv-loader.scss',\n  shadow: false,\n})\nexport class NvLoader {\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Choose the size of the loader to best fit your application’s needs, whether\n   * it’s a small spinner for subtle loading indicators or a large one for more\n   * prominent displays.\n   */\n  @Prop({ reflect: true })\n  readonly size: `${SemanticSizes}` = 'md';\n\n  /**\n   * Choose the color of the loader. Options are primary and white to keep the\n   * design consistent and ensure the loader stands out or blends in\n   * appropriately with your application’s interface.\n   */\n  @Prop({ reflect: true })\n  readonly color: `${LoaderColors}`;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region RENDER\n\n  /* <slot> empty to force rendering change */\n  render() {\n    return (\n      <Host\n        class={clsx(\n          this.size && `size-${this.size}`,\n          this.color && `color-${this.color}`,\n        )}\n      ></Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}
+{"file":"nv-iconbutton.nv-loader.entry.js","mappings":"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","names":[],"sources":["src/components/nv-iconbutton/nv-iconbutton.scss?tag=nv-iconbutton","src/components/nv-iconbutton/nv-iconbutton.tsx","src/components/nv-loader/nv-loader.scss?tag=nv-loader","src/components/nv-loader/nv-loader.tsx"],"sourcesContent":["@use \"sass:map\";\n@import \"../../styles/focus-ring\";\n\n/* Variants */\n$button-sizes: (\"xs\", \"sm\", \"md\", \"lg\");\n$button-emphasis: (\"high\", \"medium\", \"low\", \"lower\");\n\n/* Define maps for size-related variables */\n$button-icon-button-padding: (\n  \"xs\": var(--button-xs-icon-button-padding),\n  \"sm\": var(--button-sm-icon-button-padding),\n  \"md\": var(--button-md-icon-button-padding),\n  \"lg\": var(--button-lg-icon-button-padding)\n);\n\n$button-gap: (\n  \"xs\": var(--button-xs-gap),\n  \"sm\": var(--button-sm-gap),\n  \"md\": var(--button-md-gap),\n  \"lg\": var(--button-lg-gap)\n);\n\n$button-border-radius: (\n  \"xs\": var(--button-xs-border-radius),\n  \"sm\": var(--button-sm-border-radius),\n  \"md\": var(--button-md-border-radius),\n  \"lg\": var(--button-lg-border-radius)\n);\n\n$button-line-height: (\n  \"xs\": var(--button-xs-line-height),\n  \"sm\": var(--button-sm-line-height),\n  \"md\": var(--button-md-line-height),\n  \"lg\": var(--button-lg-line-height)\n);\n\n$button-font-size: (\n  \"xs\": var(--button-xs-font-size),\n  \"sm\": var(--button-sm-font-size),\n  \"md\": var(--button-md-font-size),\n  \"lg\": var(--button-lg-font-size)\n);\n\n/* Define maps for emphasis-related variables */\n$components-button-background: (\n  \"high\": var(--components-button-high-background),\n  \"medium\": var(--components-button-medium-background),\n  \"low\": var(--components-button-low-background),\n  \"lower\": var(--components-button-lower-background)\n);\n\n$components-button-border: (\n  \"high\": var(--components-button-high-border),\n  \"medium\": var(--components-button-medium-border),\n  \"low\": var(--components-button-low-border),\n  \"lower\": var(--components-button-lower-border)\n);\n\n$components-button-text: (\n  \"high\": var(--components-button-high-text),\n  \"medium\": var(--components-button-medium-text),\n  \"low\": var(--components-button-low-text),\n  \"lower\": var(--components-button-lower-text)\n);\n\n$components-button-background-hover: (\n  \"high\": var(--components-button-high-background-hover),\n  \"medium\": var(--components-button-medium-background-hover),\n  \"low\": var(--components-button-low-background-hover),\n  \"lower\": var(--components-button-lower-background-hover)\n);\n\n$components-button-text-hover: (\n  \"high\": var(--components-button-high-text-hover),\n  \"medium\": var(--components-button-medium-text-hover),\n  \"low\": var(--components-button-low-text-hover),\n  \"lower\": var(--components-button-lower-text-hover)\n);\n\n$components-button-icon: (\n  \"high\": var(--components-button-high-icon),\n  \"medium\": var(--components-button-medium-icon),\n  \"low\": var(--components-button-low-icon),\n  \"lower\": var(--components-button-lower-icon)\n);\n\n@mixin root-styles() {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  font-style: normal;\n  font-weight: var(--font-weight-medium-emphasis);\n  font-family: var(--font-family-default), var(--font-family-fallback), sans-serif;\n  transition: background-color 150ms ease-out;\n  height: fit-content;\n  width: fit-content;\n}\n\n@mixin size-styles($size) {\n  padding: map.get($button-icon-button-padding, $size);\n  gap: map.get($button-gap, $size);\n  border-radius: map.get($button-border-radius, $size);\n  line-height: map.get($button-line-height, $size);\n  font-size: map.get($button-font-size, $size);\n}\n\n@mixin emphasis-styles($emphasis) {\n  background: map.get($components-button-background, $emphasis);\n  border: 1px solid map.get($components-button-border, $emphasis);\n  color: map.get($components-button-text, $emphasis);\n\n  &:hover {\n    background: map.get($components-button-background-hover, $emphasis);\n    color: map.get($components-button-text-hover, $emphasis);\n  }\n\n  @include focus-ring();\n\n  &:disabled {\n    background: map.get($components-button-background, $emphasis);\n    color: map.get($components-button-text, $emphasis);\n    opacity: 0.5;\n    cursor: not-allowed;\n    box-shadow: none;\n  }\n\n  & nv-icon > svg {\n    color: map.get($components-button-icon, $emphasis);\n  }\n}\n\nnv-iconbutton {\n  &.root {\n    @include root-styles();\n  }\n\n  @each $size in $button-sizes {\n    &.size-#{$size} {\n      @include size-styles($size);\n    }\n  }\n\n  @each $emphasis in $button-emphasis {\n    &.emphasis-#{$emphasis} {\n      @include emphasis-styles($emphasis);\n    }\n  }\n\n  &.loading {\n    [slot=\"leading-icon\"] {\n      display: none;\n    }\n  }\n\n  &.shape-rounded {\n    border-radius: var(--radius-rounded-full);\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  AttachInternals,\n  Element,\n  Watch,\n  Listen,\n} from '@stencil/core';\nimport clsx from 'clsx';\n\nimport {\n  ButtonSize,\n  ButtonEmphasis,\n  ButtonType,\n  IconButtonShape,\n} from '../../utils/constants';\nimport { IconName } from '../nv-icon/nv-icons';\n\n/**\n * @slot default - Content of the button.\n */\n@Component({\n  tag: 'nv-iconbutton',\n  shadow: false,\n  formAssociated: true,\n  styleUrl: 'nv-iconbutton.scss',\n  scoped: false,\n})\nexport class NvIconbutton {\n  @AttachInternals() internals: ElementInternals;\n  @Element() el: HTMLNvIconbuttonElement;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Determines how large or small the button appears, allowing for\n   * customization of the button's dimensions to fit different design\n   * specifications and user needs.\n   */\n  @Prop({ reflect: true })\n  readonly size: `${ButtonSize}` = 'md';\n\n  /**\n   * Adjusts the button’s emphasis to make it more or less visually prominent\n   * to users. Use this to draw attention to important actions or reduce focus\n   * on less critical ones.\n   */\n  @Prop({ reflect: true })\n  readonly emphasis: `${ButtonEmphasis}` = 'high';\n\n  /**\n   * Set this to true to show a spinner on the button, letting users know that\n   * their action is being processed. It helps improve user experience by\n   * indicating ongoing activities. The icon is not displayed when the button\n   * is loading. Also, the button is disabled. If you want to disable the\n   * button, it is not possible. It is automatically disabled when loading.\n   */\n  @Prop({ reflect: true, mutable: true })\n  loading: boolean = false;\n\n  /**\n   * Disables the button, preventing user interaction.\n   */\n  @Prop({ mutable: true, reflect: true })\n  disabled: boolean = false;\n\n  /**\n   * Makes the button look active when it’s within a compatible component\n   * like a button group.\n   */\n  @Prop({ reflect: true })\n  readonly active: boolean = false;\n\n  /**\n   * Choose the icon you want to display. This also sets the aria-label for\n   * improved accessibility, helping users who rely on screen readers.\n   * The icon is not displayed when the button is loading.\n   */\n  @Prop({ reflect: true })\n  readonly name: `${IconName}` | string;\n\n  /**\n   * Sets the button type to control its function in forms. Use 'submit' to send\n   * form data, 'reset' to clear the form, or 'button' for a standard button\n   * that doesn’t interact with form submission by default.\n   */\n  @Prop({ reflect: true })\n  readonly type: `${ButtonType}` = 'button';\n\n  /**\n   * Sets the shape of the button. Choose between square and rounded.\n   */\n  @Prop({ reflect: true })\n  readonly shape: `${IconButtonShape}` = 'square';\n\n  /**\n   * Use this to make the button skip-able when users navigate with the keyboard.\n   * The button remains clickable but won’t be reached via the Tab key.\n   */\n  @Prop({ reflect: true })\n  readonly disableTabindex: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Handles form-related actions when the button is clicked.\n   * - Submits the form if the button type is 'submit'.\n   * - Resets the form if the button type is 'reset'.\n   * @param {Event} event - The click event.\n   */\n  private handleClick = (event: Event) => {\n    if (this.disabled) {\n      event.preventDefault();\n      return;\n    }\n\n    if (this.type === 'submit') {\n      this.internals?.form?.requestSubmit();\n    }\n    if (this.type === 'reset') {\n      this.internals?.form?.reset();\n    }\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  @Watch('loading')\n  handleLoadingChange(loading: boolean) {\n    this.loading = loading;\n    this.disabled = loading;\n  }\n\n  @Watch('disabled')\n  handleDisabledChange(disabled: boolean) {\n    if (this.loading) {\n      this.disabled = this.loading;\n    } else {\n      this.disabled = disabled;\n    }\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region EVENTS\n\n  @Listen('keydown', { passive: false })\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      this.el.click();\n    }\n  }\n\n  @Listen('touchstart', { passive: false })\n  handleTouchStart(event: TouchEvent) {\n    if (event.touches.length > 1) return;\n    event.preventDefault();\n    this.el.click();\n  }\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    if (this.loading) {\n      this.disabled = this.loading;\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        role=\"button\"\n        type={this.type}\n        tabindex={this.disableTabindex ? -1 : 0}\n        disabled={this.disabled ? true : undefined}\n        class={clsx(\n          'root',\n          `size-${this.size}`,\n          `emphasis-${this.emphasis}`,\n          this.loading && 'loading',\n          `shape-${this.shape}`,\n        )}\n        onClick={this.handleClick}\n      >\n        {this.loading && <nv-loader size={this.size}></nv-loader>}\n\n        {!this.loading && <nv-icon name={this.name} size={this.size} />}\n\n        <slot></slot>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n","@use \"sass:map\";\n\n/* Variants */\n$loader-sizes: (\"xs\", \"sm\", \"md\", \"lg\", \"xl\");\n$loader-color: (\"brand\", \"white\");\n\n/* Define maps for color-related variables */\n$components-loader-background: (\n  \"brand\": var(--components-loader-brand-background),\n  \"white\": var(--components-loader-white-background)\n);\n\n$components-loader-foreground: (\n  \"brand\": var(--components-loader-brand-foreground),\n  \"white\": var(--components-loader-white-foreground)\n);\n\n/* Define maps for size-related variables */\n$components-loader-size: (\n  \"xs\": var(--loader-size-xs),\n  \"sm\": var(--loader-size-sm),\n  \"md\": var(--loader-size-md),\n  \"lg\": var(--loader-size-lg),\n  \"xl\": var(--loader-size-xl)\n);\n\n@mixin root-styles() {\n  display: inline-block;\n  position: relative;\n  aspect-ratio: 1 / 1;\n  border-radius: 9999px;\n  color: inherit;\n}\n\n@mixin size-styles($size) {\n  $loader-size: map.get($components-loader-size, $size);\n  $border-size: calc($loader-size / 10);\n\n  width: $loader-size;\n  height: $loader-size;\n\n  &::before,\n  &::after {\n    content: \" \";\n    position: absolute;\n    top: 0;\n    left: 0;\n    border-radius: inherit;\n    width: 100%;\n    height: 100%;\n  }\n\n  &::before {\n    content: \" \";\n    border: $border-size solid;\n    opacity: 0.3;\n  }\n\n  &::after {\n    content: \" \";\n    border-top: $border-size solid transparent;\n    border-left: $border-size solid transparent;\n    border-right: $border-size solid transparent;\n    border-bottom: $border-size solid;\n    animation: rotation 1s linear infinite;\n  }\n}\n\n@mixin color-styles($color) {\n  &::before {\n    border-color: map.get($components-loader-background, $color);\n    opacity: 1;\n  }\n\n  &::after {\n    border-bottom-color: map.get($components-loader-foreground, $color);\n  }\n}\n\n@keyframes rotation {\n  0% {\n    transform: rotate(0deg);\n  }\n\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\nnv-loader {\n  @include root-styles();\n\n  @each $size in $loader-sizes {\n    &.size-#{$size} {\n      @include size-styles($size);\n    }\n  }\n\n  @each $color in $loader-color {\n    &.color-#{$color} {\n      @include color-styles($color);\n    }\n  }\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\nimport { SemanticSizes, LoaderColors } from '../../utils/constants';\n\n@Component({\n  tag: 'nv-loader',\n  styleUrl: 'nv-loader.scss',\n  shadow: false,\n})\nexport class NvLoader {\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Choose the size of the loader to best fit your application’s needs, whether\n   * it’s a small spinner for subtle loading indicators or a large one for more\n   * prominent displays.\n   */\n  @Prop({ reflect: true })\n  readonly size: `${SemanticSizes}` = 'md';\n\n  /**\n   * Choose the color of the loader. Options are primary and white to keep the\n   * design consistent and ensure the loader stands out or blends in\n   * appropriately with your application’s interface.\n   */\n  @Prop({ reflect: true })\n  readonly color: `${LoaderColors}`;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region RENDER\n\n  /* <slot> empty to force rendering change */\n  render() {\n    return (\n      <Host\n        class={clsx(\n          this.size && `size-${this.size}`,\n          this.color && `color-${this.color}`,\n        )}\n      ></Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}

package/dist/esm/nv-tableheader.entry.js

@@ -0,0 +1,73 @@
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-dc2723f3.js';
+
+const nvTableheaderCss = "nv-tableheader{display:inline-flex;width:100%;align-items:center;gap:var(--spacing-2)}nv-tableheader:focus-visible{border-radius:var(--radius-rounded-sm)}nv-tableheader:focus-visible:focus,nv-tableheader:focus-visible:focus-within{outline:none}nv-tableheader:focus-visible:focus-visible,nv-tableheader:focus-visible:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-tableheader nv-iconbutton{transition:transform 120ms ease, opacity 120ms ease}nv-tableheader nv-iconbutton svg{transition:transform 240ms ease}nv-tableheader nv-iconbutton.is-none{opacity:0.5}nv-tableheader nv-iconbutton.is-desc svg{transform:rotate(180deg)}";
+const NvTableheaderStyle0 = nvTableheaderCss;
+
+const NvTableheader = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.sortDirectionChanged = createEvent(this, "sortDirectionChanged", 7);
+        /****************************************************************************/
+        //#region PROPERTIES
+        /**
+         * Will render the header as sortable with the corresponding icon button.
+         * Allows the header to be tabbed, and trigger sorting via click or keyboard
+         * navigation
+         */
+        this.sortable = false;
+        /**
+         * The current sort direction of the header. Will be 'none' if the header is
+         * not sortable or if the sort direction is not set.
+         */
+        this.sortDirection = 'none';
+    }
+    //#endregion PROPERTIES
+    /****************************************************************************/
+    //#region METHODS
+    cycleSortDirection(e) {
+        if (!this.sortable)
+            return;
+        e === null || e === void 0 ? void 0 : e.preventDefault();
+        const next = {
+            none: 'asc',
+            asc: 'desc',
+            desc: 'none',
+        };
+        this.sortDirection = next[this.sortDirection];
+        this.sortDirectionChanged.emit(this.sortDirection);
+    }
+    handleKeyDown(event) {
+        if (!this.sortable)
+            return;
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            this.cycleSortDirection();
+        }
+    }
+    get ariaSort() {
+        const sortMap = {
+            none: 'none',
+            asc: 'ascending',
+            desc: 'descending',
+        };
+        if (!this.sortable)
+            return sortMap.none;
+        return sortMap[this.sortDirection];
+    }
+    //#endregion EVENTS
+    /****************************************************************************/
+    //#region RENDER
+    render() {
+        return (h(Host, { key: 'ff2fc290253d468d2d139afdc708b012258b3f31', role: "columnheader", "aria-sort": this.ariaSort, tabindex: this.sortable ? 0 : undefined, onKeyDown: this.handleKeyDown.bind(this), onClick: this.cycleSortDirection.bind(this) }, h("slot", { key: '3c70c590cc33ca2d722dbc3313c9e10583bfa631' }), this.sortable && (h("span", { key: '219a872d53157545302495cec6844d55b5026e00', class: "sort-icon-wrap", "aria-hidden": "true" }, h("nv-iconbutton", { key: 'd39698493a8504bb7e2af6fa52ac4c548b91bf40', disableTabindex: true, name: "arrow-up", size: "xs", emphasis: this.sortDirection === 'none' ? 'lower' : 'low',
+            // prevent mousedown from selecting text
+            onMouseDown: (e) => e.preventDefault(), class: {
+                'is-none': this.sortDirection === 'none',
+                'is-desc': this.sortDirection === 'desc',
+            } })))));
+    }
+};
+NvTableheader.style = NvTableheaderStyle0;
+
+export { NvTableheader as nv_tableheader };
+
+//# sourceMappingURL=nv-tableheader.entry.js.map

package/dist/esm/nv-tableheader.entry.js.map

@@ -0,0 +1 @@
+{"file":"nv-tableheader.entry.js","mappings":";;AAAA,MAAM,gBAAgB,GAAG,ytBAAytB,CAAC;AACnvB,4BAAe,gBAAgB;;MCSlB,aAAa;IAL1B;;;;;;;;;;QAeW,aAAQ,GAAY,KAAK,CAAC;;;;;QAOnC,kBAAa,GAA4B,MAAM,CAAC;KA2FjD;;;;IArFS,kBAAkB,CAAC,CAAS;QAClC,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC3B,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,cAAc,EAAE,CAAC;QAEpB,MAAM,IAAI,GAAG;YACX,IAAI,EAAE,KAAK;YACX,GAAG,EAAE,MAAM;YACX,IAAI,EAAE,MAAM;SACJ,CAAC;QAEX,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QAC9C,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;KACpD;IAEO,aAAa,CAAC,KAAoB;QACxC,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC3B,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE;YAC9C,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,kBAAkB,EAAE,CAAC;SAC3B;KACF;IAED,IAAI,QAAQ;QACV,MAAM,OAAO,GAAG;YACd,IAAI,EAAE,MAAM;YACZ,GAAG,EAAE,WAAW;YAChB,IAAI,EAAE,YAAY;SACV,CAAC;QAEX,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,OAAO,OAAO,CAAC,IAAI,CAAC;QACxC,OAAO,OAAO,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;KACpC;;;;IAuBD,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,IAAI,EAAC,cAAc,eACR,IAAI,CAAC,QAAQ,EACxB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,CAAC,GAAG,SAAS,EACvC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,EACxC,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,IAE3C,8DAAa,EAEZ,IAAI,CAAC,QAAQ,KACZ,6DAAM,KAAK,EAAC,gBAAgB,iBAAa,MAAM,IAC7C,sEACE,eAAe,QACf,IAAI,EAAC,UAAU,EACf,IAAI,EAAC,IAAI,EACT,QAAQ,EAAE,IAAI,CAAC,aAAa,KAAK,MAAM,GAAG,OAAO,GAAG,KAAK;;YAEzD,WAAW,EAAE,CAAC,CAAa,KAAK,CAAC,CAAC,cAAc,EAAE,EAClD,KAAK,EAAE;gBACL,SAAS,EAAE,IAAI,CAAC,aAAa,KAAK,MAAM;gBACxC,SAAS,EAAE,IAAI,CAAC,aAAa,KAAK,MAAM;aACzC,GACD,CACG,CACR,CACI,EACP;KACH;;;;;;","names":[],"sources":["src/components/nv-tableheader/nv-tableheader.scss?tag=nv-tableheader","src/components/nv-tableheader/nv-tableheader.tsx"],"sourcesContent":["// include focus ring\n@import \"../../styles/focus-ring\";\n\n@mixin root-styles() {\n  display: inline-flex;\n  width: 100%;\n  align-items: center;\n  gap: var(--spacing-2);\n}\n\n@mixin focus-styles() {\n  @include focus-ring();\n  border-radius: var(--radius-rounded-sm);\n}\n\n@mixin nv-icon-styles() {\n  transition: transform 120ms ease, opacity 120ms ease;\n  svg {\n    transition: transform 240ms ease;\n  }\n  &.is-none { opacity: .5; }\n  &.is-desc {\n    svg {\n      transform: rotate(180deg);\n    }\n  }\n}\n\nnv-tableheader {\n  @include root-styles();\n\n  &:focus-visible {\n    @include focus-styles();\n  }\n\n  nv-iconbutton {\n    @include nv-icon-styles();\n  }\n}","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\n\n/**\n * @slot default - Child content of the component.\n */\n@Component({\n  tag: 'nv-tableheader',\n  styleUrl: 'nv-tableheader.scss',\n  shadow: false,\n})\nexport class NvTableheader {\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Will render the header as sortable with the corresponding icon button.\n   * Allows the header to be tabbed, and trigger sorting via click or keyboard\n   * navigation\n   */\n  @Prop({ reflect: true })\n  readonly sortable: boolean = false;\n\n  /**\n   * The current sort direction of the header. Will be 'none' if the header is\n   * not sortable or if the sort direction is not set.\n   */\n  @Prop({ reflect: true, mutable: true })\n  sortDirection: 'none' | 'asc' | 'desc' = 'none';\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  private cycleSortDirection(e?: Event) {\n    if (!this.sortable) return;\n    e?.preventDefault();\n\n    const next = {\n      none: 'asc',\n      asc: 'desc',\n      desc: 'none',\n    } as const;\n\n    this.sortDirection = next[this.sortDirection];\n    this.sortDirectionChanged.emit(this.sortDirection);\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    if (!this.sortable) return;\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      this.cycleSortDirection();\n    }\n  }\n\n  get ariaSort() {\n    const sortMap = {\n      none: 'none',\n      asc: 'ascending',\n      desc: 'descending',\n    } as const;\n\n    if (!this.sortable) return sortMap.none;\n    return sortMap[this.sortDirection];\n  }\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region WATCHERS\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Event emitted when the sort direction changes. Payload is the new sort\n   * direction.\n   */\n  @Event()\n  sortDirectionChanged: EventEmitter<string>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        role=\"columnheader\"\n        aria-sort={this.ariaSort}\n        tabindex={this.sortable ? 0 : undefined}\n        onKeyDown={this.handleKeyDown.bind(this)}\n        onClick={this.cycleSortDirection.bind(this)}\n      >\n        <slot></slot>\n\n        {this.sortable && (\n          <span class=\"sort-icon-wrap\" aria-hidden=\"true\">\n            <nv-iconbutton\n              disableTabindex\n              name=\"arrow-up\"\n              size=\"xs\"\n              emphasis={this.sortDirection === 'none' ? 'lower' : 'low'}\n              // prevent mousedown from selecting text\n              onMouseDown={(e: MouseEvent) => e.preventDefault()}\n              class={{\n                'is-none': this.sortDirection === 'none',\n                'is-desc': this.sortDirection === 'desc',\n              }}\n            />\n          </span>\n        )}\n      </Host>\n    );\n  }\n  // #endregion RENDER\n}\n"],"version":3}

package/dist/esm/nv-toggle.entry.js

@@ -62,8 +62,8 @@ const NvToggle = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '65222149af4edb9f8fd2da7efe9a01e15dec4722', class: clsx(this.labelPlacement === 'before' && 'label-placement-before') }, h("div", { key: '7edd5587281b5610269f1ac09826ce379abfae24', class: "input-container" }, h("input", { key: '30d3db3cbdc263259a5ba1bf8e637225c4db3b4a', type: "checkbox", id: this.inputId, name: this.name, autocomplete: "off", value: this.value, checked: Boolean(this.checked), disabled: this.disabled || this.readonly, readonly: this.readonly })), h("div", { key: 'a8a6d3c2774560b7d43cda75882d90cc564f4c54', class: "text-container" }, (this.label || this.el.querySelector('[slot="label"]')) && (h("label", { key: 'fe980a07df4901081fda42df758236da0b8a11d0', htmlFor: this.inputId, class: clsx(this.hideLabel && 'visually-hidden') }, h("slot", { key: '723cec5914c6c0bed7e14e61e2f64e83c8e8b7b8', name: "label" }, this.label))), (this.description ||
-            this.el.querySelector('[slot="description"]')) && (h("div", { key: 'f811065ed06f0816d8f0f1f65d4c659cbde3f683', class: "description" }, h("slot", { key: '541946e3f33a315bf667999c30a44fd93fc5f07f', name: "description" }, this.description))))));
+        return (h(Host, { key: '8e5b801ed4263b02b9b00628e94de448986eca98', class: clsx(this.labelPlacement === 'before' && 'label-placement-before') }, h("div", { key: 'b25ed406fae37d41f1c1fbe4234ded3f94db14b0', class: "input-container" }, h("input", { key: '5a98b81705597f2a115517b6031289ee9be54bda', type: "checkbox", id: this.inputId, name: this.name, autocomplete: "off", value: this.value, checked: Boolean(this.checked), disabled: this.disabled || this.readonly, readonly: this.readonly })), h("div", { key: '89366dfe5c0106d7e28a858745941f0358220ce7', class: "text-container" }, (this.label || this.el.querySelector('[slot="label"]')) && (h("label", { key: '3f0192378adbd8d5d5f5f5684d1e929462d7832b', htmlFor: this.inputId, class: clsx(this.hideLabel && 'visually-hidden') }, h("slot", { key: 'ee95958740e62af025bc4a456fe1b9f12b9aac71', name: "label" }, this.label))), (this.description ||
+            this.el.querySelector('[slot="description"]')) && (h("div", { key: 'eee5a91ccbe1eed1d2ce41c0ce08cf8b49440501', class: "description" }, h("slot", { key: 'a925c57db61229d032412e315ff1f738a479b090', name: "description" }, this.description))))));
     }
     static get formAssociated() { return true; }
     get el() { return getElement(this); }

package/dist/esm/nv-togglebutton.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-dc2723f3.js';
 
-const nvTogglebuttonCss = "nv-togglebutton{display:inline-flex;justify-content:center;align-items:center}nv-togglebutton:focus-visible,nv-togglebutton:has(:focus-visible){z-index:1}nv-togglebutton[size=xs]{padding:var(--button-xs-padding-y) var(--button-xs-padding-x);gap:var(--button-xs-gap);border-radius:var(--button-xs-border-radius);line-height:var(--button-xs-line-height);font-size:var(--button-xs-font-size);padding-top:calc(var(--togglegroup-xs-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-xs-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-xs-button-radius));border-width:0}nv-togglebutton[size=xs] nv-icon>svg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-togglebutton[size=sm]{padding:var(--button-sm-padding-y) var(--button-sm-padding-x);gap:var(--button-sm-gap);border-radius:var(--button-sm-border-radius);line-height:var(--button-sm-line-height);font-size:var(--button-sm-font-size);padding-top:calc(var(--togglegroup-sm-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-sm-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-sm-button-radius));border-width:0}nv-togglebutton[size=sm] nv-icon>svg{width:var(--spacing-4);height:var(--spacing-4);stroke-width:1.5px}nv-togglebutton[size=md]{padding:var(--button-md-padding-y) var(--button-md-padding-x);gap:var(--button-md-gap);border-radius:var(--button-md-border-radius);line-height:var(--button-md-line-height);font-size:var(--button-md-font-size);padding-top:calc(var(--togglegroup-md-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-md-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-md-button-radius));border-width:0}nv-togglebutton[size=md] nv-icon>svg{width:var(--spacing-5);height:var(--spacing-5);stroke-width:1.6px}nv-togglebutton[size=lg]{padding:var(--button-lg-padding-y) var(--button-lg-padding-x);gap:var(--button-lg-gap);border-radius:var(--button-lg-border-radius);line-height:var(--button-lg-line-height);font-size:var(--button-lg-font-size);padding-top:calc(var(--togglegroup-lg-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-lg-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-lg-button-radius));border-width:0}nv-togglebutton[size=lg] nv-icon>svg{width:var(--spacing-6);height:var(--spacing-6);stroke-width:1.8px}nv-togglebutton[emphasis=high]{background:var(--components-button-low-background);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text)}nv-togglebutton[emphasis=high]:hover{background:var(--components-button-low-background-hover);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text-hover)}nv-togglebutton[emphasis=high]:active{background:var(--components-button-low-background-active);border:1px solid var(--components-button-low-border-active);color:var(--components-button-low-text-active)}nv-togglebutton[emphasis=high]:focus,nv-togglebutton[emphasis=high]:focus-within{outline:none}nv-togglebutton[emphasis=high]:focus-visible,nv-togglebutton[emphasis=high]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-togglebutton[emphasis=high]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-togglebutton[emphasis=high][active]:not([active=false]){background:var(--components-button-low-background-active);border:1px solid var(--components-button-low-border-active);color:var(--components-button-low-text-active)}nv-togglebutton[emphasis=low]{background:var(--components-button-lower-background);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text)}nv-togglebutton[emphasis=low]:hover{background:var(--components-button-lower-background-hover);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text-hover)}nv-togglebutton[emphasis=low]:active{background:var(--components-button-lower-background-active);border:1px solid var(--components-button-lower-border-active);color:var(--components-button-lower-text-active)}nv-togglebutton[emphasis=low]:focus,nv-togglebutton[emphasis=low]:focus-within{outline:none}nv-togglebutton[emphasis=low]:focus-visible,nv-togglebutton[emphasis=low]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-togglebutton[emphasis=low]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-togglebutton[emphasis=low][active]:not([active=false]),nv-togglebutton[emphasis=low]:active{background:var(--components-button-lower-background-hover);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text-hover)}";
+const nvTogglebuttonCss = "nv-togglebutton{display:inline-flex;justify-content:center;align-items:center}nv-togglebutton:focus-visible,nv-togglebutton:has(:focus-visible){z-index:1}nv-togglebutton[size=xs]{padding:var(--button-xs-padding-y) var(--button-xs-padding-x);gap:var(--button-xs-gap);border-radius:var(--button-xs-border-radius);line-height:var(--button-xs-line-height);height:var(--button-xs-height);font-size:var(--button-xs-font-size);padding-top:calc(var(--togglegroup-xs-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-xs-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-xs-button-radius));border-width:0}nv-togglebutton[size=xs] nv-icon>svg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-togglebutton[size=sm]{padding:var(--button-sm-padding-y) var(--button-sm-padding-x);gap:var(--button-sm-gap);border-radius:var(--button-sm-border-radius);line-height:var(--button-sm-line-height);height:var(--button-sm-height);font-size:var(--button-sm-font-size);padding-top:calc(var(--togglegroup-sm-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-sm-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-sm-button-radius));border-width:0}nv-togglebutton[size=sm] nv-icon>svg{width:var(--spacing-4);height:var(--spacing-4);stroke-width:1.5px}nv-togglebutton[size=md]{padding:var(--button-md-padding-y) var(--button-md-padding-x);gap:var(--button-md-gap);border-radius:var(--button-md-border-radius);line-height:var(--button-md-line-height);height:var(--button-md-height);font-size:var(--button-md-font-size);padding-top:calc(var(--togglegroup-md-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-md-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-md-button-radius));border-width:0}nv-togglebutton[size=md] nv-icon>svg{width:var(--spacing-5);height:var(--spacing-5);stroke-width:1.6px}nv-togglebutton[size=lg]{padding:var(--button-lg-padding-y) var(--button-lg-padding-x);gap:var(--button-lg-gap);border-radius:var(--button-lg-border-radius);line-height:var(--button-lg-line-height);height:var(--button-lg-height);font-size:var(--button-lg-font-size);padding-top:calc(var(--togglegroup-lg-button-padding-y) - 1px);padding-bottom:calc(var(--togglegroup-lg-button-padding-y) - 1px);border-radius:calc(var(--togglegroup-lg-button-radius));border-width:0}nv-togglebutton[size=lg] nv-icon>svg{width:var(--spacing-6);height:var(--spacing-6);stroke-width:1.8px}nv-togglebutton[emphasis=high]{background:var(--components-button-low-background);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text)}nv-togglebutton[emphasis=high]:hover{background:var(--components-button-low-background-hover);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text-hover)}nv-togglebutton[emphasis=high]:active{background:var(--components-button-low-background-active);border:1px solid var(--components-button-low-border-active);color:var(--components-button-low-text-active)}nv-togglebutton[emphasis=high]:focus,nv-togglebutton[emphasis=high]:focus-within{outline:none}nv-togglebutton[emphasis=high]:focus-visible,nv-togglebutton[emphasis=high]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-togglebutton[emphasis=high]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-togglebutton[emphasis=high][active]:not([active=false]){background:var(--components-button-low-background-active);border:1px solid var(--components-button-low-border-active);color:var(--components-button-low-text-active)}nv-togglebutton[emphasis=low]{background:var(--components-button-lower-background);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text)}nv-togglebutton[emphasis=low]:hover{background:var(--components-button-lower-background-hover);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text-hover)}nv-togglebutton[emphasis=low]:active{background:var(--components-button-lower-background-active);border:1px solid var(--components-button-lower-border-active);color:var(--components-button-lower-text-active)}nv-togglebutton[emphasis=low]:focus,nv-togglebutton[emphasis=low]:focus-within{outline:none}nv-togglebutton[emphasis=low]:focus-visible,nv-togglebutton[emphasis=low]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-togglebutton[emphasis=low]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-togglebutton[emphasis=low][active]:not([active=false]),nv-togglebutton[emphasis=low]:active{background:var(--components-button-lower-background-hover);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text-hover)}";
 const NvTogglebuttonStyle0 = nvTogglebuttonCss;
 
 const NvTogglebutton = class {
@@ -44,7 +44,7 @@ const NvTogglebutton = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'c4b698b1fb80f0dcca5d7a77bc20d22db1cbf538', role: "button", tabindex: "0", "aria-pressed": String(this.active), onClick: this.handleClick }, h("slot", { key: '605385f07f32b989685983cfd1a082525741fba4' })));
+        return (h(Host, { key: 'a36d2ac3ed287145dae1812e8488313e7509b979', role: "button", tabindex: "0", "aria-pressed": String(this.active), onClick: this.handleClick }, h("slot", { key: '463f95e6e68148d94047e8b71c99c449dccffbd6' })));
     }
 };
 NvTogglebutton.style = NvTogglebuttonStyle0;

package/dist/esm/nv-togglebutton.entry.js.map

@@ -1 +1 @@
-{"file":"nv-togglebutton.entry.js","mappings":";;AAAA,MAAM,iBAAiB,GAAG,+rJAA+rJ,CAAC;AAC1tJ,6BAAe,iBAAiB;;MCUnB,cAAc;IAL3B;;;;;;;;;;QAeW,SAAI,GAA0B,IAAI,CAAC;;;;QAanC,aAAQ,GAAY,KAAK,CAAC;;;;;QAO1B,WAAM,GAAY,KAAK,CAAC;;;;QAMxB,aAAQ,GAA8B,MAAM,CAAC;;;;QAM9C,gBAAW,GAAG;YACpB,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAE1B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC;gBAChB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,MAAM,EAAE,IAAI,CAAC,MAAM;aACpB,CAAC,CAAC;SACJ,CAAC;KAiCH;;;;IAbC,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAC,GAAG,kBACE,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,EACjC,OAAO,EAAE,IAAI,CAAC,WAAW,IAEzB,8DAAa,CACR,EACP;KACH;;;;;;","names":[],"sources":["src/components/nv-togglebutton/styles/nv-togglebutton.scss?tag=nv-togglebutton","src/components/nv-togglebutton/nv-togglebutton.tsx"],"sourcesContent":["@use \"./mixins\" as *;\n\nnv-togglebutton {\n  @include root-styles();\n\n  @each $size in $sizes {\n    &[size=\"#{$size}\"] {\n        @include button-size-styles($size);\n        @include togglegroup-button-size-styles($size);\n    }\n  }\n\n  &[emphasis=\"high\"] {\n    @include button-emphasis-styles('low');\n    &[active]:not([active=\"false\"]) {\n      @include button-active-styles('low');\n    }\n  }\n  &[emphasis=\"low\"] {\n    @include button-emphasis-styles('lower');\n    &[active]:not([active=\"false\"]), &:active {\n      @include button-hover-styles('lower');\n    }\n  }\n}\n","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\nimport { ToggleButtonEmphasis, ToggleButtonSize } from '../../utils/constants';\n\n/**\n * @slot default - Child content of the toggle button.\n */\n@Component({\n  tag: 'nv-togglebutton',\n  styleUrl: 'styles/nv-togglebutton.scss',\n  shadow: false,\n})\nexport class NvTogglebutton {\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Determines how large or small the togglebutton appears, allowing for\n   * customization of the togglebutton's dimensions to fit different design\n   * specifications and user needs.\n   */\n  @Prop({ reflect: true })\n  readonly size: `${ToggleButtonSize}` = 'md';\n\n  /**\n   * The value to associated with the button when selected in a\n   * Togglebuttongroup.\n   */\n  @Prop({ reflect: true })\n  readonly value: string;\n\n  /**\n   * Prevents all interaction, rendering the toggle in a non-interactive state.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Whether the button is active or not. Will not toggle automatically but\n   * needs to be controlled externally.\n   */\n  @Prop({ reflect: true })\n  readonly active: boolean = false;\n\n  /**\n   * Make it more or less visually prominent to users.\n   */\n  @Prop({ reflect: true })\n  readonly emphasis: `${ToggleButtonEmphasis}` = 'high';\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  private handleClick = () => {\n    if (this.disabled) return;\n\n    this.toggled.emit({\n      value: this.value,\n      active: this.active,\n    });\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emitted when the button is toggled.\n   */\n  @Event({ eventName: 'toggled' })\n  toggled: EventEmitter<{\n    /** The value associated with the button. */\n    value: string;\n    /** If the button is active when clicked. */\n    active: boolean;\n  }>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region RENDER\n  render() {\n    return (\n      <Host\n        role=\"button\"\n        tabindex=\"0\"\n        aria-pressed={String(this.active)}\n        onClick={this.handleClick}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n  // #endregion RENDER\n}\n"],"version":3}
+{"file":"nv-togglebutton.entry.js","mappings":";;AAAA,MAAM,iBAAiB,GAAG,2zJAA2zJ,CAAC;AACt1J,6BAAe,iBAAiB;;MCUnB,cAAc;IAL3B;;;;;;;;;;QAeW,SAAI,GAA0B,IAAI,CAAC;;;;QAanC,aAAQ,GAAY,KAAK,CAAC;;;;;QAO1B,WAAM,GAAY,KAAK,CAAC;;;;QAMxB,aAAQ,GAA8B,MAAM,CAAC;;;;QAM9C,gBAAW,GAAG;YACpB,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAE1B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC;gBAChB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,MAAM,EAAE,IAAI,CAAC,MAAM;aACpB,CAAC,CAAC;SACJ,CAAC;KAiCH;;;;IAbC,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAC,GAAG,kBACE,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,EACjC,OAAO,EAAE,IAAI,CAAC,WAAW,IAEzB,8DAAa,CACR,EACP;KACH;;;;;;","names":[],"sources":["src/components/nv-togglebutton/styles/nv-togglebutton.scss?tag=nv-togglebutton","src/components/nv-togglebutton/nv-togglebutton.tsx"],"sourcesContent":["@use \"./mixins\" as *;\n\nnv-togglebutton {\n  @include root-styles();\n\n  @each $size in $sizes {\n    &[size=\"#{$size}\"] {\n        @include button-size-styles($size);\n        @include togglegroup-button-size-styles($size);\n    }\n  }\n\n  &[emphasis=\"high\"] {\n    @include button-emphasis-styles('low');\n    &[active]:not([active=\"false\"]) {\n      @include button-active-styles('low');\n    }\n  }\n  &[emphasis=\"low\"] {\n    @include button-emphasis-styles('lower');\n    &[active]:not([active=\"false\"]), &:active {\n      @include button-hover-styles('lower');\n    }\n  }\n}\n","import { Component, Host, h, Prop, Event, EventEmitter } from '@stencil/core';\nimport { ToggleButtonEmphasis, ToggleButtonSize } from '../../utils/constants';\n\n/**\n * @slot default - Child content of the toggle button.\n */\n@Component({\n  tag: 'nv-togglebutton',\n  styleUrl: 'styles/nv-togglebutton.scss',\n  shadow: false,\n})\nexport class NvTogglebutton {\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Determines how large or small the togglebutton appears, allowing for\n   * customization of the togglebutton's dimensions to fit different design\n   * specifications and user needs.\n   */\n  @Prop({ reflect: true })\n  readonly size: `${ToggleButtonSize}` = 'md';\n\n  /**\n   * The value to associated with the button when selected in a\n   * Togglebuttongroup.\n   */\n  @Prop({ reflect: true })\n  readonly value: string;\n\n  /**\n   * Prevents all interaction, rendering the toggle in a non-interactive state.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Whether the button is active or not. Will not toggle automatically but\n   * needs to be controlled externally.\n   */\n  @Prop({ reflect: true })\n  readonly active: boolean = false;\n\n  /**\n   * Make it more or less visually prominent to users.\n   */\n  @Prop({ reflect: true })\n  readonly emphasis: `${ToggleButtonEmphasis}` = 'high';\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  private handleClick = () => {\n    if (this.disabled) return;\n\n    this.toggled.emit({\n      value: this.value,\n      active: this.active,\n    });\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emitted when the button is toggled.\n   */\n  @Event({ eventName: 'toggled' })\n  toggled: EventEmitter<{\n    /** The value associated with the button. */\n    value: string;\n    /** If the button is active when clicked. */\n    active: boolean;\n  }>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region RENDER\n  render() {\n    return (\n      <Host\n        role=\"button\"\n        tabindex=\"0\"\n        aria-pressed={String(this.active)}\n        onClick={this.handleClick}\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n  // #endregion RENDER\n}\n"],"version":3}

package/dist/esm/nv-togglebuttongroup.entry.js

@@ -152,7 +152,7 @@ const NvTogglebuttongroup = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'ab91ff1817e3388508ed1da7a9ed57a79cf8c4bc' }, h("slot", { key: '4a3280db78c1f0cd120a0cb32d95eabaf69995a6' })));
+        return (h(Host, { key: '02b7814ffceeaa875edcbce4ebdd6465b24abf62' }, h("slot", { key: '89c9387a50ec0c1c660e490b66742be96e6f6b3e' })));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/nv-tooltip.entry.js

@@ -42,7 +42,7 @@ const NvTooltip = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'c2fdcd47be909554e31a3a7d77cd94dcb07c0d6e' }, h("slot", { key: '2305f6b7175d0ba84819351f60f2a4d76d117df9' }), h("nv-popover", { key: 'e388730b5858671d08981c6bbf72588a5084edbf', triggerMode: "hover", hasArrow: true, placement: this.placement, strategy: this.strategy, triggerElement: this.triggerElement, groupName: 'tooltip', enterDelay: this.enterDelay }, h("p", { key: '73f548a1c822f7c6d5a97bb4ef8da0d335cf049e', slot: "content" }, this.message), h("slot", { key: 'abb7a2dfa6a327122732802a867c5d4057fd1616', name: "content" }))));
+        return (h(Host, { key: '2ec10db6ad78e1637696e383069caf3fc8919587' }, h("slot", { key: '0df02ac8d76de82ae25ec3d9c73ef18cd6eee4d8' }), h("nv-popover", { key: '1ed0766ed0c3d43952be2be0dbafd94f07ec44b3', triggerMode: "hover", hasArrow: true, placement: this.placement, strategy: this.strategy, triggerElement: this.triggerElement, groupName: 'tooltip', enterDelay: this.enterDelay }, h("p", { key: 'bd44fba212d86969688bdf3e00a711f152500952', slot: "content" }, this.message), h("slot", { key: '31f2c47d800e4bd057c7475de931e11542eb5208', name: "content" }))));
     }
     get el() { return getElement(this); }
 };

package/dist/native/index.esm.js

@@ -1,2 +1,2 @@
-export{a as ButtonEmphasis,B as ButtonSize,b as ButtonType,C as CUSTOM_DAY_NAMES,i as CUSTOM_MONTH_NAMES,D as DeprecatedSemanticColors,F as FeedbackColors,G as GlobalFilterPosition,I as IconButtonShape,e as LabelPlacement,L as LoaderColors,c as NotificationEmphasis,N as NotificationPosition,S as SemanticSizes,h as SortingPossibility,f as TextInputAutocomplete,g as TimeType,T as ToggleButtonEmphasis,d as ToggleButtonSize,W as WEEK_ABBREVIATIONS}from"./p-51602221.js";export{e as eventUtils}from"./p-d429a343.js";export{u as uriUtils}from"./p-7e58e7d1.js";import{u as o}from"./p-3cd7a66f.js";import{u as r}from"./p-a271e3be.js";import{u as t}from"./p-4697bd56.js";import{u as l}from"./p-c7401a7d.js";import{t as s,p as n}from"./p-a52cd849.js";import"./p-42ea6b74.js";function p(e){const o=new Proxy({},{get(e,o){return o}});return e(o)}const m=Object.freeze({__proto__:null,nameof:p});function w(e,o){if(!e||!o)return false;return e.toLowerCase().startsWith(o.toLowerCase())}const k=Object.freeze({__proto__:null,startsWithIgnoreCase:w});const y=Object.freeze({__proto__:null,useCollapse:o,useFade:r,useGrow:t,useSlide:l,timeline:s,parallel:n});const v=["access-point-off","access-point","accessible","activity","address-book","adjustments-horizontal","adjustments-up","adjustments","affiliate","air-conditioning","alert-circle","alert-square-rounded","alert-triangle","align-center","align-left","align-right","app-window","apps","archive","areas","arrow-back-up","arrow-back","arrow-down-left","arrow-down-right","arrow-down","arrow-forward-up","arrow-forward","arrow-left","arrow-right","arrow-up-left","arrow-up-right","arrow-up","arrows-diagonal","arrows-exchange","arrows-maximize","arrows-minimize","arrows-move","aspect-ratio","atom","ban","basket","battery-1","battery-2","battery-3","battery-4","battery-automotive","battery-charging","battery-eco","battery-off","battery","bell-bolt","bell-off","bell-ringing","bell","bike","bluetooth-connected","bluetooth-off","bluetooth","bolt-off","bolt","book","bookmark-off","bookmark","bookmarks","box-align-top","box-multiple","brand-facebook","brand-instagram","brand-linkedin","brand-x","brand-youtube","briefcase","brightness-down","brightness-up","browser-check","browser-plus","browser-x","browser","brush","building-bank","building-factory","building-lighthouse","building-store","building","bulb-off","bulb","cake","calendar-time","calendar","camera-off","camera","car-crane","car","caravan","cash-banknote","cash","cast","cell","charging-pile","chart-arcs","chart-area-line","chart-area","chart-arrows-vertical","chart-arrows","chart-bar","chart-bubble","chart-circles","chart-donut","chart-dots","chart-line","chart-pie","chart-radar","check","checkbox","checklist","checks","chevron-down","chevron-left","chevron-right","chevron-top","chevrons-left","chevrons-right","circle-caret-right","circle-check","circle-x","circuit-alternate","circuit-ground-digital","clipboard-check","clipboard-list","clipboard-plus","clipboard-text","clipboard-x","clipboard","clock-edit","clock","cloud-data-connection","cloud-download","cloud-rain","cloud-snow","cloud-upload","cloud","collapse-close","collapse-open","color-picker","color-swatch","columns-1","columns-2","columns-3","compass","contract","cookie","copy","cpu","crane","credit-card","crop","cross","crown","currency-bitcoin","currency-dollar","currency-ethereum","currency-euro","cut","dashboard","database","device-desktop","device-floppy","device-gamepad","device-laptop","device-mobile-rotated","device-mobile","device-tablet","device-watch","devices","dialpad","direction-horizontal","direction-sign","direction","discount","door-enter","door-exit","door-off","dots-vertical","dots","download","drone","droplet-filled","droplet-half","droplet","droplets","edit","empty","engine","equal-not","eraser-off","eraser","external-link","eye-off","eye","face-id","feather","file-alert","file-analytics","file-check","file-code","file-download","file-export","file-horizontal","file-import","file-plus","file-search","file-text-bookmark","file-text","file-type-bmp","file-type-css","file-type-csv","file-type-doc","file-type-html","file-type-jpg","file-type-js","file-type-pdf","file-type-png","file-type-ppt","file-type-xls","file-type-xml","file-type-zip","file-upload","file-x","file-zip","file","files-off","files","filter-off","filter-sort","filter","fingerprint","fire-extinguisher","flag","flame","flip-horizontal","flip-vertical","folder-minus","folder-off","folder-plus","folder-x","folder","folders","frame","gas-station","gauge-off","gauge","gift","git-branch-delete","git-branch","git-cherry-pick","git-commit","git-compare","git-fork","git-merge","git-pull-request-closed","git-pull-request-draft","git-pull-request","gps","grid-dots","grip-horizontal","grip-vertical","hand-stop","hand-waving","hash","haze","headphones-off","headphones","headset","heart-off","heart","heartbeat","helicopter","helmet-swopp","helmet","help","history","home","hourglass-empty","hourglass-high","hourglass-low","hourglass-off","hourglass","inbox","info-circle","keyboard-hide","keyboard-show","keyboard","layout-board-split","layout-dashboard","layout-grid","layout-sidebar-left-collapse","layout-sidebar-left-expand","layout-sidebar-right-collapse","layout-sidebar-right-expand","layout","leaf","lifebuoy","link","list-search","list","loader","location","lock-off","lock-open","lock","login","logout","mail-forward","mail-opened","mail","map-pin-2","map-pin-off","map-pin","map","master-data","menu","message-dots","message-off","message","messages","microphone-off","microphone","minus","mist","moon","motorbike","mouse","movie","network","news","note","notebook","notes","offshore-station","package","palette","paperclip","pencil","phone-call","phone-calling","phone-check","phone-incoming","phone-off","phone-outgoing","phone","photo-off","photo","pig","pin","pinned-off","pinned","plane-off","plane","plant","player-pause","player-play","player-skip-back","player-skip-forward","player-stop","player-track-next","player-track-prev","plug-connected","plug","plus","power-ac","power-dc","power","presentation-analytics","presentation","printer","propeller","published","puzzle-2","puzzle","pylon","qrcode","quotes-open","quotes","radar","radio","radioactive","receipt-dollar","receipt-euro","receipt","recharging","recycle","refresh-alert","refresh-off","refresh","repeat-once","repeat","replace","report-analytics","report-medical","report-search","report","ripple-off","ripple","rocket","rotate-2","rotate-clockwise-2","rotate-clockwise","rotate-dot","rotate","router","ruler-measure","sailboat","satellite","scale","school","scissors","scooter-electric","screenshot","search","seeding","select","selector","send","server","settings","shape","share-2","share","shield-check","shield-lock","shield-off","shield-x","shield","ship-off","ship","shopping-cart","slash","smart-home","snowflake","solar-panel","sort-ascending-letters","sort-ascending-numbers","sort-descending-letters","sort-descending-numbers","spacing-horizontal","spacing-vertical","sparkles","speakerphone","stack","stairs","star","sun","sunrise","sunset","switch-horizontal","switch-vertical","table","tag","tank-empty-fill","tank-full-fill","tank-medium-fill","temperature-off","temperature","template","terminal","text-size","text","thumb-down","thumb-up","ticket","timeline","tir","tool","tools","train","trash-off","trash","tree","trees","truck-delivery","truck","umbrella","unlink","upload","user-circle","user-exclamation","user-minus","user-off","user-plus","user-worker","user","users","versions","video-minus","video-off","video-plus","video","volume-2","volume-3","volume","wallet","wand","wave","waves","wifi-off","wifi","wind-direction","wind","windmill","wood","world-code","world","writing","x","zoom-reset"];export{y as animations,m as classUtils,v as iconNames,k as stringUtils};
+export{a as ButtonEmphasis,B as ButtonSize,b as ButtonType,C as CUSTOM_DAY_NAMES,i as CUSTOM_MONTH_NAMES,D as DeprecatedSemanticColors,F as FeedbackColors,G as GlobalFilterPosition,I as IconButtonShape,e as LabelPlacement,L as LoaderColors,c as NotificationEmphasis,N as NotificationPosition,S as SemanticSizes,h as SortingPossibility,f as TextInputAutocomplete,g as TimeType,T as ToggleButtonEmphasis,d as ToggleButtonSize,W as WEEK_ABBREVIATIONS}from"./p-51602221.js";export{e as eventUtils}from"./p-d429a343.js";export{u as uriUtils}from"./p-7e58e7d1.js";import{u as o}from"./p-3cd7a66f.js";import{u as r}from"./p-a271e3be.js";import{u as t}from"./p-4697bd56.js";import{u as l}from"./p-c7401a7d.js";import{t as s,p as n}from"./p-a52cd849.js";import"./p-42ea6b74.js";function p(e){const o=new Proxy({},{get(e,o){return o}});return e(o)}const m=Object.freeze({__proto__:null,nameof:p});function w(e,o){if(!e||!o)return false;return e.toLowerCase().startsWith(o.toLowerCase())}const k=Object.freeze({__proto__:null,startsWithIgnoreCase:w});const y=Object.freeze({__proto__:null,useCollapse:o,useFade:r,useGrow:t,useSlide:l,timeline:s,parallel:n});const v=["access-point-off","access-point","accessible","activity","address-book","adjustments-horizontal","adjustments-up","adjustments","affiliate","air-conditioning","alert-circle","alert-square-rounded","alert-triangle","align-center","align-left","align-right","app-window","apps","archive","areas","arrow-back-up","arrow-back","arrow-down-left","arrow-down-right","arrow-down","arrow-forward-up","arrow-forward","arrow-left","arrow-right","arrow-up-left","arrow-up-right","arrow-up","arrows-diagonal","arrows-exchange","arrows-maximize","arrows-minimize","arrows-move","aspect-ratio","atom","ban","basket","battery-1","battery-2","battery-3","battery-4","battery-automotive","battery-charging","battery-eco","battery-off","battery","bell-bolt","bell-off","bell-ringing","bell","bike","bluetooth-connected","bluetooth-off","bluetooth","bolt-off","bolt","book","bookmark-off","bookmark","bookmarks","box-align-top","box-multiple","brand-facebook","brand-instagram","brand-linkedin","brand-x","brand-youtube","briefcase","brightness-down","brightness-up","browser-check","browser-plus","browser-x","browser","brush","building-bank","building-factory","building-lighthouse","building-store","building","bulb-off","bulb","cake","calendar-time","calendar","camera-off","camera","car-crane","car","caravan","cash-banknote","cash","cast","cell","charging-pile","chart-arcs","chart-area-line","chart-area","chart-arrows-vertical","chart-arrows","chart-bar","chart-bubble","chart-circles","chart-donut","chart-dots","chart-line","chart-pie","chart-radar","check","checkbox","checklist","checks","chevron-down","chevron-left","chevron-right","chevron-top","chevrons-left","chevrons-right","circle-caret-right","circle-check","circle-x","circuit-alternate","circuit-ground-digital","clipboard-check","clipboard-list","clipboard-plus","clipboard-text","clipboard-x","clipboard","clock-edit","clock","cloud-data-connection","cloud-download","cloud-rain","cloud-snow","cloud-upload","cloud","color-picker","color-swatch","columns-1","columns-2","columns-3","compass","contract","cookie","copy","cpu","crane","credit-card","crop","cross","crown","currency-bitcoin","currency-dollar","currency-ethereum","currency-euro","cut","dashboard","database","device-desktop","device-floppy","device-gamepad","device-laptop","device-mobile-rotated","device-mobile","device-tablet","device-watch","devices","dialpad","direction-horizontal","direction-sign","direction","discount","door-enter","door-exit","door-off","dots-vertical","dots","download","drone","droplet-filled","droplet-half","droplet","droplets","edit","empty","engine","equal-not","eraser-off","eraser","external-link","eye-off","eye","face-id","feather","file-alert","file-analytics","file-check","file-code","file-download","file-export","file-horizontal","file-import","file-plus","file-search","file-text-bookmark","file-text","file-type-bmp","file-type-css","file-type-csv","file-type-doc","file-type-html","file-type-jpg","file-type-js","file-type-pdf","file-type-png","file-type-ppt","file-type-xls","file-type-xml","file-type-zip","file-upload","file-x","file-zip","file","files-off","files","filter-off","filter-sort","filter","fingerprint","fire-extinguisher","flag","flame","flip-horizontal","flip-vertical","folder-minus","folder-off","folder-plus","folder-x","folder","folders","frame","gas-station","gauge-off","gauge","gift","git-branch-delete","git-branch","git-cherry-pick","git-commit","git-compare","git-fork","git-merge","git-pull-request-closed","git-pull-request-draft","git-pull-request","gps","grid-dots","grip-horizontal","grip-vertical","hand-stop","hand-waving","hash","haze","headphones-off","headphones","headset","heart-off","heart","heartbeat","helicopter","helmet-swopp","helmet","help","history","home","hourglass-empty","hourglass-high","hourglass-low","hourglass-off","hourglass","inbox","info-circle","keyboard-hide","keyboard-show","keyboard","layout-board-split","layout-dashboard","layout-grid","layout-sidebar-left-collapse","layout-sidebar-left-expand","layout-sidebar-right-collapse","layout-sidebar-right-expand","layout","leaf","lifebuoy","link","list-search","list","loader","location","lock-off","lock-open","lock","login","logout","mail-forward","mail-opened","mail","map-pin-2","map-pin-off","map-pin","map","master-data","menu","message-dots","message-off","message","messages","microphone-off","microphone","minus","mist","moon","motorbike","mouse","movie","network","news","note","notebook","notes","offshore-station","package","palette","paperclip","pencil","phone-call","phone-calling","phone-check","phone-incoming","phone-off","phone-outgoing","phone","photo-off","photo","pig","pin","pinned-off","pinned","plane-off","plane","plant","player-pause","player-play","player-skip-back","player-skip-forward","player-stop","player-track-next","player-track-prev","plug-connected","plug","plus","power-ac","power-dc","power","presentation-analytics","presentation","printer","propeller","published","puzzle-2","puzzle","pylon","qrcode","quotes-open","quotes","radar","radio","radioactive","receipt-dollar","receipt-euro","receipt","recharging","recycle","refresh-alert","refresh-off","refresh","repeat-once","repeat","replace","report-analytics","report-medical","report-search","report","ripple-off","ripple","rocket","rotate-2","rotate-clockwise-2","rotate-clockwise","rotate-dot","rotate","router","ruler-measure","sailboat","satellite","scale","school","scissors","scooter-electric","screenshot","search","seeding","select","selector","send","server","settings","shape","share-2","share","shield-check","shield-lock","shield-off","shield-x","shield","ship-off","ship","shopping-cart","sitemap","slash","smart-home","snowflake","solar-panel","sort-ascending-letters","sort-ascending-numbers","sort-descending-letters","sort-descending-numbers","spacing-horizontal","spacing-vertical","sparkles","speakerphone","stack","stairs","star","sun","sunrise","sunset","switch-horizontal","switch-vertical","table","tag","tank-empty-fill","tank-full-fill","tank-medium-fill","temperature-off","temperature","template","terminal","text-size","text","thumb-down","thumb-up","ticket","timeline","tir","tool","tools","train","trash-off","trash","tree","trees","truck-delivery","truck","umbrella","unlink","upload","user-circle","user-exclamation","user-minus","user-off","user-plus","user-worker","user","users","versions","video-minus","video-off","video-plus","video","volume-2","volume-3","volume","wallet","wand","wave","waves","wifi-off","wifi","wind-direction","wind","windmill","wood","world-code","world","writing","x","zoom-reset"];export{y as animations,m as classUtils,v as iconNames,k as stringUtils};
 //# sourceMappingURL=index.esm.js.map

package/dist/native/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"names":["nameof","key","proxy","Proxy","get","_target","prop","startsWithIgnoreCase","str","prefix","toLowerCase","startsWith","iconNames"],"sources":["src/utils/class.utils.ts","src/utils/string.utils.ts","src/components/nv-icon/nv-icons.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n\n/**\n * Get the name of a property in an object or class instance.\n * @param {function} key The key of the property.\n * @returns {string} The name of the property.\n */\nexport function nameof<T>(key: (x: T) => any): string {\n  const proxy = new Proxy(\n    {},\n    {\n      get(_target, prop) {\n        return prop;\n      },\n    },\n  );\n  return key(proxy as T);\n}\n","/**\n * Checks if a string starts with a given prefix, ignoring case.\n * @param {string} str - The string to check.\n * @param {string} prefix - The prefix to check for.\n * @returns {boolean} - True if the string starts with the prefix, ignoring case.\n * @example startsWithIgnoreCase('Hello, world!', 'hello') // true\n * @example startsWithIgnoreCase('Hello, world!', 'world') // false\n */\nexport function startsWithIgnoreCase(str?: string, prefix?: string): boolean {\n  if (!str || !prefix) return false;\n\n  return str.toLowerCase().startsWith(prefix.toLowerCase());\n}\n","/** Available icons */\n\nexport const iconNames = [\n  'access-point-off',\n  'access-point',\n  'accessible',\n  'activity',\n  'address-book',\n  'adjustments-horizontal',\n  'adjustments-up',\n  'adjustments',\n  'affiliate',\n  'air-conditioning',\n  'alert-circle',\n  'alert-square-rounded',\n  'alert-triangle',\n  'align-center',\n  'align-left',\n  'align-right',\n  'app-window',\n  'apps',\n  'archive',\n  'areas',\n  'arrow-back-up',\n  'arrow-back',\n  'arrow-down-left',\n  'arrow-down-right',\n  'arrow-down',\n  'arrow-forward-up',\n  'arrow-forward',\n  'arrow-left',\n  'arrow-right',\n  'arrow-up-left',\n  'arrow-up-right',\n  'arrow-up',\n  'arrows-diagonal',\n  'arrows-exchange',\n  'arrows-maximize',\n  'arrows-minimize',\n  'arrows-move',\n  'aspect-ratio',\n  'atom',\n  'ban',\n  'basket',\n  'battery-1',\n  'battery-2',\n  'battery-3',\n  'battery-4',\n  'battery-automotive',\n  'battery-charging',\n  'battery-eco',\n  'battery-off',\n  'battery',\n  'bell-bolt',\n  'bell-off',\n  'bell-ringing',\n  'bell',\n  'bike',\n  'bluetooth-connected',\n  'bluetooth-off',\n  'bluetooth',\n  'bolt-off',\n  'bolt',\n  'book',\n  'bookmark-off',\n  'bookmark',\n  'bookmarks',\n  'box-align-top',\n  'box-multiple',\n  'brand-facebook',\n  'brand-instagram',\n  'brand-linkedin',\n  'brand-x',\n  'brand-youtube',\n  'briefcase',\n  'brightness-down',\n  'brightness-up',\n  'browser-check',\n  'browser-plus',\n  'browser-x',\n  'browser',\n  'brush',\n  'building-bank',\n  'building-factory',\n  'building-lighthouse',\n  'building-store',\n  'building',\n  'bulb-off',\n  'bulb',\n  'cake',\n  'calendar-time',\n  'calendar',\n  'camera-off',\n  'camera',\n  'car-crane',\n  'car',\n  'caravan',\n  'cash-banknote',\n  'cash',\n  'cast',\n  'cell',\n  'charging-pile',\n  'chart-arcs',\n  'chart-area-line',\n  'chart-area',\n  'chart-arrows-vertical',\n  'chart-arrows',\n  'chart-bar',\n  'chart-bubble',\n  'chart-circles',\n  'chart-donut',\n  'chart-dots',\n  'chart-line',\n  'chart-pie',\n  'chart-radar',\n  'check',\n  'checkbox',\n  'checklist',\n  'checks',\n  'chevron-down',\n  'chevron-left',\n  'chevron-right',\n  'chevron-top',\n  'chevrons-left',\n  'chevrons-right',\n  'circle-caret-right',\n  'circle-check',\n  'circle-x',\n  'circuit-alternate',\n  'circuit-ground-digital',\n  'clipboard-check',\n  'clipboard-list',\n  'clipboard-plus',\n  'clipboard-text',\n  'clipboard-x',\n  'clipboard',\n  'clock-edit',\n  'clock',\n  'cloud-data-connection',\n  'cloud-download',\n  'cloud-rain',\n  'cloud-snow',\n  'cloud-upload',\n  'cloud',\n  'collapse-close',\n  'collapse-open',\n  'color-picker',\n  'color-swatch',\n  'columns-1',\n  'columns-2',\n  'columns-3',\n  'compass',\n  'contract',\n  'cookie',\n  'copy',\n  'cpu',\n  'crane',\n  'credit-card',\n  'crop',\n  'cross',\n  'crown',\n  'currency-bitcoin',\n  'currency-dollar',\n  'currency-ethereum',\n  'currency-euro',\n  'cut',\n  'dashboard',\n  'database',\n  'device-desktop',\n  'device-floppy',\n  'device-gamepad',\n  'device-laptop',\n  'device-mobile-rotated',\n  'device-mobile',\n  'device-tablet',\n  'device-watch',\n  'devices',\n  'dialpad',\n  'direction-horizontal',\n  'direction-sign',\n  'direction',\n  'discount',\n  'door-enter',\n  'door-exit',\n  'door-off',\n  'dots-vertical',\n  'dots',\n  'download',\n  'drone',\n  'droplet-filled',\n  'droplet-half',\n  'droplet',\n  'droplets',\n  'edit',\n  'empty',\n  'engine',\n  'equal-not',\n  'eraser-off',\n  'eraser',\n  'external-link',\n  'eye-off',\n  'eye',\n  'face-id',\n  'feather',\n  'file-alert',\n  'file-analytics',\n  'file-check',\n  'file-code',\n  'file-download',\n  'file-export',\n  'file-horizontal',\n  'file-import',\n  'file-plus',\n  'file-search',\n  'file-text-bookmark',\n  'file-text',\n  'file-type-bmp',\n  'file-type-css',\n  'file-type-csv',\n  'file-type-doc',\n  'file-type-html',\n  'file-type-jpg',\n  'file-type-js',\n  'file-type-pdf',\n  'file-type-png',\n  'file-type-ppt',\n  'file-type-xls',\n  'file-type-xml',\n  'file-type-zip',\n  'file-upload',\n  'file-x',\n  'file-zip',\n  'file',\n  'files-off',\n  'files',\n  'filter-off',\n  'filter-sort',\n  'filter',\n  'fingerprint',\n  'fire-extinguisher',\n  'flag',\n  'flame',\n  'flip-horizontal',\n  'flip-vertical',\n  'folder-minus',\n  'folder-off',\n  'folder-plus',\n  'folder-x',\n  'folder',\n  'folders',\n  'frame',\n  'gas-station',\n  'gauge-off',\n  'gauge',\n  'gift',\n  'git-branch-delete',\n  'git-branch',\n  'git-cherry-pick',\n  'git-commit',\n  'git-compare',\n  'git-fork',\n  'git-merge',\n  'git-pull-request-closed',\n  'git-pull-request-draft',\n  'git-pull-request',\n  'gps',\n  'grid-dots',\n  'grip-horizontal',\n  'grip-vertical',\n  'hand-stop',\n  'hand-waving',\n  'hash',\n  'haze',\n  'headphones-off',\n  'headphones',\n  'headset',\n  'heart-off',\n  'heart',\n  'heartbeat',\n  'helicopter',\n  'helmet-swopp',\n  'helmet',\n  'help',\n  'history',\n  'home',\n  'hourglass-empty',\n  'hourglass-high',\n  'hourglass-low',\n  'hourglass-off',\n  'hourglass',\n  'inbox',\n  'info-circle',\n  'keyboard-hide',\n  'keyboard-show',\n  'keyboard',\n  'layout-board-split',\n  'layout-dashboard',\n  'layout-grid',\n  'layout-sidebar-left-collapse',\n  'layout-sidebar-left-expand',\n  'layout-sidebar-right-collapse',\n  'layout-sidebar-right-expand',\n  'layout',\n  'leaf',\n  'lifebuoy',\n  'link',\n  'list-search',\n  'list',\n  'loader',\n  'location',\n  'lock-off',\n  'lock-open',\n  'lock',\n  'login',\n  'logout',\n  'mail-forward',\n  'mail-opened',\n  'mail',\n  'map-pin-2',\n  'map-pin-off',\n  'map-pin',\n  'map',\n  'master-data',\n  'menu',\n  'message-dots',\n  'message-off',\n  'message',\n  'messages',\n  'microphone-off',\n  'microphone',\n  'minus',\n  'mist',\n  'moon',\n  'motorbike',\n  'mouse',\n  'movie',\n  'network',\n  'news',\n  'note',\n  'notebook',\n  'notes',\n  'offshore-station',\n  'package',\n  'palette',\n  'paperclip',\n  'pencil',\n  'phone-call',\n  'phone-calling',\n  'phone-check',\n  'phone-incoming',\n  'phone-off',\n  'phone-outgoing',\n  'phone',\n  'photo-off',\n  'photo',\n  'pig',\n  'pin',\n  'pinned-off',\n  'pinned',\n  'plane-off',\n  'plane',\n  'plant',\n  'player-pause',\n  'player-play',\n  'player-skip-back',\n  'player-skip-forward',\n  'player-stop',\n  'player-track-next',\n  'player-track-prev',\n  'plug-connected',\n  'plug',\n  'plus',\n  'power-ac',\n  'power-dc',\n  'power',\n  'presentation-analytics',\n  'presentation',\n  'printer',\n  'propeller',\n  'published',\n  'puzzle-2',\n  'puzzle',\n  'pylon',\n  'qrcode',\n  'quotes-open',\n  'quotes',\n  'radar',\n  'radio',\n  'radioactive',\n  'receipt-dollar',\n  'receipt-euro',\n  'receipt',\n  'recharging',\n  'recycle',\n  'refresh-alert',\n  'refresh-off',\n  'refresh',\n  'repeat-once',\n  'repeat',\n  'replace',\n  'report-analytics',\n  'report-medical',\n  'report-search',\n  'report',\n  'ripple-off',\n  'ripple',\n  'rocket',\n  'rotate-2',\n  'rotate-clockwise-2',\n  'rotate-clockwise',\n  'rotate-dot',\n  'rotate',\n  'router',\n  'ruler-measure',\n  'sailboat',\n  'satellite',\n  'scale',\n  'school',\n  'scissors',\n  'scooter-electric',\n  'screenshot',\n  'search',\n  'seeding',\n  'select',\n  'selector',\n  'send',\n  'server',\n  'settings',\n  'shape',\n  'share-2',\n  'share',\n  'shield-check',\n  'shield-lock',\n  'shield-off',\n  'shield-x',\n  'shield',\n  'ship-off',\n  'ship',\n  'shopping-cart',\n  'slash',\n  'smart-home',\n  'snowflake',\n  'solar-panel',\n  'sort-ascending-letters',\n  'sort-ascending-numbers',\n  'sort-descending-letters',\n  'sort-descending-numbers',\n  'spacing-horizontal',\n  'spacing-vertical',\n  'sparkles',\n  'speakerphone',\n  'stack',\n  'stairs',\n  'star',\n  'sun',\n  'sunrise',\n  'sunset',\n  'switch-horizontal',\n  'switch-vertical',\n  'table',\n  'tag',\n  'tank-empty-fill',\n  'tank-full-fill',\n  'tank-medium-fill',\n  'temperature-off',\n  'temperature',\n  'template',\n  'terminal',\n  'text-size',\n  'text',\n  'thumb-down',\n  'thumb-up',\n  'ticket',\n  'timeline',\n  'tir',\n  'tool',\n  'tools',\n  'train',\n  'trash-off',\n  'trash',\n  'tree',\n  'trees',\n  'truck-delivery',\n  'truck',\n  'umbrella',\n  'unlink',\n  'upload',\n  'user-circle',\n  'user-exclamation',\n  'user-minus',\n  'user-off',\n  'user-plus',\n  'user-worker',\n  'user',\n  'users',\n  'versions',\n  'video-minus',\n  'video-off',\n  'video-plus',\n  'video',\n  'volume-2',\n  'volume-3',\n  'volume',\n  'wallet',\n  'wand',\n  'wave',\n  'waves',\n  'wifi-off',\n  'wifi',\n  'wind-direction',\n  'wind',\n  'windmill',\n  'wood',\n  'world-code',\n  'world',\n  'writing',\n  'x',\n  'zoom-reset',\n] as const;\nexport type IconName = (typeof iconNames)[number];\n"],"mappings":"0wBAOgBA,EAAUC,GACxB,MAAMC,EAAQ,IAAIC,MAChB,GACA,CACE,GAAAC,CAAIC,EAASC,GACX,OAAOA,C,IAIb,OAAOL,EAAIC,EACb,C,0DCTgBK,EAAqBC,EAAcC,GACjD,IAAKD,IAAQC,EAAQ,OAAO,MAE5B,OAAOD,EAAIE,cAAcC,WAAWF,EAAOC,cAC7C,C,gLCVaE,EAAY,CACvB,mBACA,eACA,aACA,WACA,eACA,yBACA,iBACA,cACA,YACA,mBACA,eACA,uBACA,iBACA,eACA,aACA,cACA,aACA,OACA,UACA,QACA,gBACA,aACA,kBACA,mBACA,aACA,mBACA,gBACA,aACA,cACA,gBACA,iBACA,WACA,kBACA,kBACA,kBACA,kBACA,cACA,eACA,OACA,MACA,SACA,YACA,YACA,YACA,YACA,qBACA,mBACA,cACA,cACA,UACA,YACA,WACA,eACA,OACA,OACA,sBACA,gBACA,YACA,WACA,OACA,OACA,eACA,WACA,YACA,gBACA,eACA,iBACA,kBACA,iBACA,UACA,gBACA,YACA,kBACA,gBACA,gBACA,eACA,YACA,UACA,QACA,gBACA,mBACA,sBACA,iBACA,WACA,WACA,OACA,OACA,gBACA,WACA,aACA,SACA,YACA,MACA,UACA,gBACA,OACA,OACA,OACA,gBACA,aACA,kBACA,aACA,wBACA,eACA,YACA,eACA,gBACA,cACA,aACA,aACA,YACA,cACA,QACA,WACA,YACA,SACA,eACA,eACA,gBACA,cACA,gBACA,iBACA,qBACA,eACA,WACA,oBACA,yBACA,kBACA,iBACA,iBACA,iBACA,cACA,YACA,aACA,QACA,wBACA,iBACA,aACA,aACA,eACA,QACA,iBACA,gBACA,eACA,eACA,YACA,YACA,YACA,UACA,WACA,SACA,OACA,MACA,QACA,cACA,OACA,QACA,QACA,mBACA,kBACA,oBACA,gBACA,MACA,YACA,WACA,iBACA,gBACA,iBACA,gBACA,wBACA,gBACA,gBACA,eACA,UACA,UACA,uBACA,iBACA,YACA,WACA,aACA,YACA,WACA,gBACA,OACA,WACA,QACA,iBACA,eACA,UACA,WACA,OACA,QACA,SACA,YACA,aACA,SACA,gBACA,UACA,MACA,UACA,UACA,aACA,iBACA,aACA,YACA,gBACA,cACA,kBACA,cACA,YACA,cACA,qBACA,YACA,gBACA,gBACA,gBACA,gBACA,iBACA,gBACA,eACA,gBACA,gBACA,gBACA,gBACA,gBACA,gBACA,cACA,SACA,WACA,OACA,YACA,QACA,aACA,cACA,SACA,cACA,oBACA,OACA,QACA,kBACA,gBACA,eACA,aACA,cACA,WACA,SACA,UACA,QACA,cACA,YACA,QACA,OACA,oBACA,aACA,kBACA,aACA,cACA,WACA,YACA,0BACA,yBACA,mBACA,MACA,YACA,kBACA,gBACA,YACA,cACA,OACA,OACA,iBACA,aACA,UACA,YACA,QACA,YACA,aACA,eACA,SACA,OACA,UACA,OACA,kBACA,iBACA,gBACA,gBACA,YACA,QACA,cACA,gBACA,gBACA,WACA,qBACA,mBACA,cACA,+BACA,6BACA,gCACA,8BACA,SACA,OACA,WACA,OACA,cACA,OACA,SACA,WACA,WACA,YACA,OACA,QACA,SACA,eACA,cACA,OACA,YACA,cACA,UACA,MACA,cACA,OACA,eACA,cACA,UACA,WACA,iBACA,aACA,QACA,OACA,OACA,YACA,QACA,QACA,UACA,OACA,OACA,WACA,QACA,mBACA,UACA,UACA,YACA,SACA,aACA,gBACA,cACA,iBACA,YACA,iBACA,QACA,YACA,QACA,MACA,MACA,aACA,SACA,YACA,QACA,QACA,eACA,cACA,mBACA,sBACA,cACA,oBACA,oBACA,iBACA,OACA,OACA,WACA,WACA,QACA,yBACA,eACA,UACA,YACA,YACA,WACA,SACA,QACA,SACA,cACA,SACA,QACA,QACA,cACA,iBACA,eACA,UACA,aACA,UACA,gBACA,cACA,UACA,cACA,SACA,UACA,mBACA,iBACA,gBACA,SACA,aACA,SACA,SACA,WACA,qBACA,mBACA,aACA,SACA,SACA,gBACA,WACA,YACA,QACA,SACA,WACA,mBACA,aACA,SACA,UACA,SACA,WACA,OACA,SACA,WACA,QACA,UACA,QACA,eACA,cACA,aACA,WACA,SACA,WACA,OACA,gBACA,QACA,aACA,YACA,cACA,yBACA,yBACA,0BACA,0BACA,qBACA,mBACA,WACA,eACA,QACA,SACA,OACA,MACA,UACA,SACA,oBACA,kBACA,QACA,MACA,kBACA,iBACA,mBACA,kBACA,cACA,WACA,WACA,YACA,OACA,aACA,WACA,SACA,WACA,MACA,OACA,QACA,QACA,YACA,QACA,OACA,QACA,iBACA,QACA,WACA,SACA,SACA,cACA,mBACA,aACA,WACA,YACA,cACA,OACA,QACA,WACA,cACA,YACA,aACA,QACA,WACA,WACA,SACA,SACA,OACA,OACA,QACA,WACA,OACA,iBACA,OACA,WACA,OACA,aACA,QACA,UACA,IACA,qB","ignoreList":[]}
+{"version":3,"names":["nameof","key","proxy","Proxy","get","_target","prop","startsWithIgnoreCase","str","prefix","toLowerCase","startsWith","iconNames"],"sources":["src/utils/class.utils.ts","src/utils/string.utils.ts","src/components/nv-icon/nv-icons.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n\n/**\n * Get the name of a property in an object or class instance.\n * @param {function} key The key of the property.\n * @returns {string} The name of the property.\n */\nexport function nameof<T>(key: (x: T) => any): string {\n  const proxy = new Proxy(\n    {},\n    {\n      get(_target, prop) {\n        return prop;\n      },\n    },\n  );\n  return key(proxy as T);\n}\n","/**\n * Checks if a string starts with a given prefix, ignoring case.\n * @param {string} str - The string to check.\n * @param {string} prefix - The prefix to check for.\n * @returns {boolean} - True if the string starts with the prefix, ignoring case.\n * @example startsWithIgnoreCase('Hello, world!', 'hello') // true\n * @example startsWithIgnoreCase('Hello, world!', 'world') // false\n */\nexport function startsWithIgnoreCase(str?: string, prefix?: string): boolean {\n  if (!str || !prefix) return false;\n\n  return str.toLowerCase().startsWith(prefix.toLowerCase());\n}\n","/** Available icons */\n\nexport const iconNames = [\n  'access-point-off',\n  'access-point',\n  'accessible',\n  'activity',\n  'address-book',\n  'adjustments-horizontal',\n  'adjustments-up',\n  'adjustments',\n  'affiliate',\n  'air-conditioning',\n  'alert-circle',\n  'alert-square-rounded',\n  'alert-triangle',\n  'align-center',\n  'align-left',\n  'align-right',\n  'app-window',\n  'apps',\n  'archive',\n  'areas',\n  'arrow-back-up',\n  'arrow-back',\n  'arrow-down-left',\n  'arrow-down-right',\n  'arrow-down',\n  'arrow-forward-up',\n  'arrow-forward',\n  'arrow-left',\n  'arrow-right',\n  'arrow-up-left',\n  'arrow-up-right',\n  'arrow-up',\n  'arrows-diagonal',\n  'arrows-exchange',\n  'arrows-maximize',\n  'arrows-minimize',\n  'arrows-move',\n  'aspect-ratio',\n  'atom',\n  'ban',\n  'basket',\n  'battery-1',\n  'battery-2',\n  'battery-3',\n  'battery-4',\n  'battery-automotive',\n  'battery-charging',\n  'battery-eco',\n  'battery-off',\n  'battery',\n  'bell-bolt',\n  'bell-off',\n  'bell-ringing',\n  'bell',\n  'bike',\n  'bluetooth-connected',\n  'bluetooth-off',\n  'bluetooth',\n  'bolt-off',\n  'bolt',\n  'book',\n  'bookmark-off',\n  'bookmark',\n  'bookmarks',\n  'box-align-top',\n  'box-multiple',\n  'brand-facebook',\n  'brand-instagram',\n  'brand-linkedin',\n  'brand-x',\n  'brand-youtube',\n  'briefcase',\n  'brightness-down',\n  'brightness-up',\n  'browser-check',\n  'browser-plus',\n  'browser-x',\n  'browser',\n  'brush',\n  'building-bank',\n  'building-factory',\n  'building-lighthouse',\n  'building-store',\n  'building',\n  'bulb-off',\n  'bulb',\n  'cake',\n  'calendar-time',\n  'calendar',\n  'camera-off',\n  'camera',\n  'car-crane',\n  'car',\n  'caravan',\n  'cash-banknote',\n  'cash',\n  'cast',\n  'cell',\n  'charging-pile',\n  'chart-arcs',\n  'chart-area-line',\n  'chart-area',\n  'chart-arrows-vertical',\n  'chart-arrows',\n  'chart-bar',\n  'chart-bubble',\n  'chart-circles',\n  'chart-donut',\n  'chart-dots',\n  'chart-line',\n  'chart-pie',\n  'chart-radar',\n  'check',\n  'checkbox',\n  'checklist',\n  'checks',\n  'chevron-down',\n  'chevron-left',\n  'chevron-right',\n  'chevron-top',\n  'chevrons-left',\n  'chevrons-right',\n  'circle-caret-right',\n  'circle-check',\n  'circle-x',\n  'circuit-alternate',\n  'circuit-ground-digital',\n  'clipboard-check',\n  'clipboard-list',\n  'clipboard-plus',\n  'clipboard-text',\n  'clipboard-x',\n  'clipboard',\n  'clock-edit',\n  'clock',\n  'cloud-data-connection',\n  'cloud-download',\n  'cloud-rain',\n  'cloud-snow',\n  'cloud-upload',\n  'cloud',\n  'color-picker',\n  'color-swatch',\n  'columns-1',\n  'columns-2',\n  'columns-3',\n  'compass',\n  'contract',\n  'cookie',\n  'copy',\n  'cpu',\n  'crane',\n  'credit-card',\n  'crop',\n  'cross',\n  'crown',\n  'currency-bitcoin',\n  'currency-dollar',\n  'currency-ethereum',\n  'currency-euro',\n  'cut',\n  'dashboard',\n  'database',\n  'device-desktop',\n  'device-floppy',\n  'device-gamepad',\n  'device-laptop',\n  'device-mobile-rotated',\n  'device-mobile',\n  'device-tablet',\n  'device-watch',\n  'devices',\n  'dialpad',\n  'direction-horizontal',\n  'direction-sign',\n  'direction',\n  'discount',\n  'door-enter',\n  'door-exit',\n  'door-off',\n  'dots-vertical',\n  'dots',\n  'download',\n  'drone',\n  'droplet-filled',\n  'droplet-half',\n  'droplet',\n  'droplets',\n  'edit',\n  'empty',\n  'engine',\n  'equal-not',\n  'eraser-off',\n  'eraser',\n  'external-link',\n  'eye-off',\n  'eye',\n  'face-id',\n  'feather',\n  'file-alert',\n  'file-analytics',\n  'file-check',\n  'file-code',\n  'file-download',\n  'file-export',\n  'file-horizontal',\n  'file-import',\n  'file-plus',\n  'file-search',\n  'file-text-bookmark',\n  'file-text',\n  'file-type-bmp',\n  'file-type-css',\n  'file-type-csv',\n  'file-type-doc',\n  'file-type-html',\n  'file-type-jpg',\n  'file-type-js',\n  'file-type-pdf',\n  'file-type-png',\n  'file-type-ppt',\n  'file-type-xls',\n  'file-type-xml',\n  'file-type-zip',\n  'file-upload',\n  'file-x',\n  'file-zip',\n  'file',\n  'files-off',\n  'files',\n  'filter-off',\n  'filter-sort',\n  'filter',\n  'fingerprint',\n  'fire-extinguisher',\n  'flag',\n  'flame',\n  'flip-horizontal',\n  'flip-vertical',\n  'folder-minus',\n  'folder-off',\n  'folder-plus',\n  'folder-x',\n  'folder',\n  'folders',\n  'frame',\n  'gas-station',\n  'gauge-off',\n  'gauge',\n  'gift',\n  'git-branch-delete',\n  'git-branch',\n  'git-cherry-pick',\n  'git-commit',\n  'git-compare',\n  'git-fork',\n  'git-merge',\n  'git-pull-request-closed',\n  'git-pull-request-draft',\n  'git-pull-request',\n  'gps',\n  'grid-dots',\n  'grip-horizontal',\n  'grip-vertical',\n  'hand-stop',\n  'hand-waving',\n  'hash',\n  'haze',\n  'headphones-off',\n  'headphones',\n  'headset',\n  'heart-off',\n  'heart',\n  'heartbeat',\n  'helicopter',\n  'helmet-swopp',\n  'helmet',\n  'help',\n  'history',\n  'home',\n  'hourglass-empty',\n  'hourglass-high',\n  'hourglass-low',\n  'hourglass-off',\n  'hourglass',\n  'inbox',\n  'info-circle',\n  'keyboard-hide',\n  'keyboard-show',\n  'keyboard',\n  'layout-board-split',\n  'layout-dashboard',\n  'layout-grid',\n  'layout-sidebar-left-collapse',\n  'layout-sidebar-left-expand',\n  'layout-sidebar-right-collapse',\n  'layout-sidebar-right-expand',\n  'layout',\n  'leaf',\n  'lifebuoy',\n  'link',\n  'list-search',\n  'list',\n  'loader',\n  'location',\n  'lock-off',\n  'lock-open',\n  'lock',\n  'login',\n  'logout',\n  'mail-forward',\n  'mail-opened',\n  'mail',\n  'map-pin-2',\n  'map-pin-off',\n  'map-pin',\n  'map',\n  'master-data',\n  'menu',\n  'message-dots',\n  'message-off',\n  'message',\n  'messages',\n  'microphone-off',\n  'microphone',\n  'minus',\n  'mist',\n  'moon',\n  'motorbike',\n  'mouse',\n  'movie',\n  'network',\n  'news',\n  'note',\n  'notebook',\n  'notes',\n  'offshore-station',\n  'package',\n  'palette',\n  'paperclip',\n  'pencil',\n  'phone-call',\n  'phone-calling',\n  'phone-check',\n  'phone-incoming',\n  'phone-off',\n  'phone-outgoing',\n  'phone',\n  'photo-off',\n  'photo',\n  'pig',\n  'pin',\n  'pinned-off',\n  'pinned',\n  'plane-off',\n  'plane',\n  'plant',\n  'player-pause',\n  'player-play',\n  'player-skip-back',\n  'player-skip-forward',\n  'player-stop',\n  'player-track-next',\n  'player-track-prev',\n  'plug-connected',\n  'plug',\n  'plus',\n  'power-ac',\n  'power-dc',\n  'power',\n  'presentation-analytics',\n  'presentation',\n  'printer',\n  'propeller',\n  'published',\n  'puzzle-2',\n  'puzzle',\n  'pylon',\n  'qrcode',\n  'quotes-open',\n  'quotes',\n  'radar',\n  'radio',\n  'radioactive',\n  'receipt-dollar',\n  'receipt-euro',\n  'receipt',\n  'recharging',\n  'recycle',\n  'refresh-alert',\n  'refresh-off',\n  'refresh',\n  'repeat-once',\n  'repeat',\n  'replace',\n  'report-analytics',\n  'report-medical',\n  'report-search',\n  'report',\n  'ripple-off',\n  'ripple',\n  'rocket',\n  'rotate-2',\n  'rotate-clockwise-2',\n  'rotate-clockwise',\n  'rotate-dot',\n  'rotate',\n  'router',\n  'ruler-measure',\n  'sailboat',\n  'satellite',\n  'scale',\n  'school',\n  'scissors',\n  'scooter-electric',\n  'screenshot',\n  'search',\n  'seeding',\n  'select',\n  'selector',\n  'send',\n  'server',\n  'settings',\n  'shape',\n  'share-2',\n  'share',\n  'shield-check',\n  'shield-lock',\n  'shield-off',\n  'shield-x',\n  'shield',\n  'ship-off',\n  'ship',\n  'shopping-cart',\n  'sitemap',\n  'slash',\n  'smart-home',\n  'snowflake',\n  'solar-panel',\n  'sort-ascending-letters',\n  'sort-ascending-numbers',\n  'sort-descending-letters',\n  'sort-descending-numbers',\n  'spacing-horizontal',\n  'spacing-vertical',\n  'sparkles',\n  'speakerphone',\n  'stack',\n  'stairs',\n  'star',\n  'sun',\n  'sunrise',\n  'sunset',\n  'switch-horizontal',\n  'switch-vertical',\n  'table',\n  'tag',\n  'tank-empty-fill',\n  'tank-full-fill',\n  'tank-medium-fill',\n  'temperature-off',\n  'temperature',\n  'template',\n  'terminal',\n  'text-size',\n  'text',\n  'thumb-down',\n  'thumb-up',\n  'ticket',\n  'timeline',\n  'tir',\n  'tool',\n  'tools',\n  'train',\n  'trash-off',\n  'trash',\n  'tree',\n  'trees',\n  'truck-delivery',\n  'truck',\n  'umbrella',\n  'unlink',\n  'upload',\n  'user-circle',\n  'user-exclamation',\n  'user-minus',\n  'user-off',\n  'user-plus',\n  'user-worker',\n  'user',\n  'users',\n  'versions',\n  'video-minus',\n  'video-off',\n  'video-plus',\n  'video',\n  'volume-2',\n  'volume-3',\n  'volume',\n  'wallet',\n  'wand',\n  'wave',\n  'waves',\n  'wifi-off',\n  'wifi',\n  'wind-direction',\n  'wind',\n  'windmill',\n  'wood',\n  'world-code',\n  'world',\n  'writing',\n  'x',\n  'zoom-reset',\n] as const;\nexport type IconName = (typeof iconNames)[number];\n"],"mappings":"0wBAOgBA,EAAUC,GACxB,MAAMC,EAAQ,IAAIC,MAChB,GACA,CACE,GAAAC,CAAIC,EAASC,GACX,OAAOA,C,IAIb,OAAOL,EAAIC,EACb,C,0DCTgBK,EAAqBC,EAAcC,GACjD,IAAKD,IAAQC,EAAQ,OAAO,MAE5B,OAAOD,EAAIE,cAAcC,WAAWF,EAAOC,cAC7C,C,gLCVaE,EAAY,CACvB,mBACA,eACA,aACA,WACA,eACA,yBACA,iBACA,cACA,YACA,mBACA,eACA,uBACA,iBACA,eACA,aACA,cACA,aACA,OACA,UACA,QACA,gBACA,aACA,kBACA,mBACA,aACA,mBACA,gBACA,aACA,cACA,gBACA,iBACA,WACA,kBACA,kBACA,kBACA,kBACA,cACA,eACA,OACA,MACA,SACA,YACA,YACA,YACA,YACA,qBACA,mBACA,cACA,cACA,UACA,YACA,WACA,eACA,OACA,OACA,sBACA,gBACA,YACA,WACA,OACA,OACA,eACA,WACA,YACA,gBACA,eACA,iBACA,kBACA,iBACA,UACA,gBACA,YACA,kBACA,gBACA,gBACA,eACA,YACA,UACA,QACA,gBACA,mBACA,sBACA,iBACA,WACA,WACA,OACA,OACA,gBACA,WACA,aACA,SACA,YACA,MACA,UACA,gBACA,OACA,OACA,OACA,gBACA,aACA,kBACA,aACA,wBACA,eACA,YACA,eACA,gBACA,cACA,aACA,aACA,YACA,cACA,QACA,WACA,YACA,SACA,eACA,eACA,gBACA,cACA,gBACA,iBACA,qBACA,eACA,WACA,oBACA,yBACA,kBACA,iBACA,iBACA,iBACA,cACA,YACA,aACA,QACA,wBACA,iBACA,aACA,aACA,eACA,QACA,eACA,eACA,YACA,YACA,YACA,UACA,WACA,SACA,OACA,MACA,QACA,cACA,OACA,QACA,QACA,mBACA,kBACA,oBACA,gBACA,MACA,YACA,WACA,iBACA,gBACA,iBACA,gBACA,wBACA,gBACA,gBACA,eACA,UACA,UACA,uBACA,iBACA,YACA,WACA,aACA,YACA,WACA,gBACA,OACA,WACA,QACA,iBACA,eACA,UACA,WACA,OACA,QACA,SACA,YACA,aACA,SACA,gBACA,UACA,MACA,UACA,UACA,aACA,iBACA,aACA,YACA,gBACA,cACA,kBACA,cACA,YACA,cACA,qBACA,YACA,gBACA,gBACA,gBACA,gBACA,iBACA,gBACA,eACA,gBACA,gBACA,gBACA,gBACA,gBACA,gBACA,cACA,SACA,WACA,OACA,YACA,QACA,aACA,cACA,SACA,cACA,oBACA,OACA,QACA,kBACA,gBACA,eACA,aACA,cACA,WACA,SACA,UACA,QACA,cACA,YACA,QACA,OACA,oBACA,aACA,kBACA,aACA,cACA,WACA,YACA,0BACA,yBACA,mBACA,MACA,YACA,kBACA,gBACA,YACA,cACA,OACA,OACA,iBACA,aACA,UACA,YACA,QACA,YACA,aACA,eACA,SACA,OACA,UACA,OACA,kBACA,iBACA,gBACA,gBACA,YACA,QACA,cACA,gBACA,gBACA,WACA,qBACA,mBACA,cACA,+BACA,6BACA,gCACA,8BACA,SACA,OACA,WACA,OACA,cACA,OACA,SACA,WACA,WACA,YACA,OACA,QACA,SACA,eACA,cACA,OACA,YACA,cACA,UACA,MACA,cACA,OACA,eACA,cACA,UACA,WACA,iBACA,aACA,QACA,OACA,OACA,YACA,QACA,QACA,UACA,OACA,OACA,WACA,QACA,mBACA,UACA,UACA,YACA,SACA,aACA,gBACA,cACA,iBACA,YACA,iBACA,QACA,YACA,QACA,MACA,MACA,aACA,SACA,YACA,QACA,QACA,eACA,cACA,mBACA,sBACA,cACA,oBACA,oBACA,iBACA,OACA,OACA,WACA,WACA,QACA,yBACA,eACA,UACA,YACA,YACA,WACA,SACA,QACA,SACA,cACA,SACA,QACA,QACA,cACA,iBACA,eACA,UACA,aACA,UACA,gBACA,cACA,UACA,cACA,SACA,UACA,mBACA,iBACA,gBACA,SACA,aACA,SACA,SACA,WACA,qBACA,mBACA,aACA,SACA,SACA,gBACA,WACA,YACA,QACA,SACA,WACA,mBACA,aACA,SACA,UACA,SACA,WACA,OACA,SACA,WACA,QACA,UACA,QACA,eACA,cACA,aACA,WACA,SACA,WACA,OACA,gBACA,UACA,QACA,aACA,YACA,cACA,yBACA,yBACA,0BACA,0BACA,qBACA,mBACA,WACA,eACA,QACA,SACA,OACA,MACA,UACA,SACA,oBACA,kBACA,QACA,MACA,kBACA,iBACA,mBACA,kBACA,cACA,WACA,WACA,YACA,OACA,aACA,WACA,SACA,WACA,MACA,OACA,QACA,QACA,YACA,QACA,OACA,QACA,iBACA,QACA,WACA,SACA,SACA,cACA,mBACA,aACA,WACA,YACA,cACA,OACA,QACA,WACA,cACA,YACA,aACA,QACA,WACA,WACA,SACA,SACA,OACA,OACA,QACA,WACA,OACA,iBACA,OACA,WACA,OACA,aACA,QACA,UACA,IACA,qB","ignoreList":[]}