@nova-design-system/nova-webcomponents 3.11.0 → 3.13.0

package/dist/components/{p-a5002d14.js.map → p-1172e9bb.js.map}

@@ -1 +1 @@
-{"file":"p-a5002d14.js","mappings":"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","names":["uuidv4"],"sources":["src/components/nv-fieldcheckbox/nv-fieldcheckbox.scss?tag=nv-fieldcheckbox","src/components/nv-fieldcheckbox/nv-fieldcheckbox.tsx"],"sourcesContent":["@use \"../../styles/utils\" as utils;\n@import '../../styles/focus-ring';\n\n@mixin fieldcheckbox-variables() {\n  --nv-fieldcheckbox-border-default: var(\n    --components-form-field-border-default\n  );\n  --nv-fieldcheckbox-border-hover: var(--components-form-field-border-hover);\n  --nv-fieldcheckbox-border-focus: var(--components-form-field-border-default);\n  --nv-fieldcheckbox-background-default: var(\n    --components-form-field-background-default\n  );\n  --nv-fieldcheckbox-background-checked: var(\n    --components-form-field-background-checked\n  );\n  --nv-fieldcheckbox-background-disabled: var(\n    --components-form-field-background-disabled\n  );\n  --nv-fieldcheckbox-focus-box-shadow: var(--color-focus-brand);\n  --nv-fieldcheckbox-color-checked: var(\n    --components-form-shape-foreground-default\n  );\n  --nv-fieldcheckbox-color-disabled: var(\n    --components-form-shape-foreground-disabled\n  );\n  --nv-fieldcheckbox-outline-color: var(--color-focus-brand);\n}\n\n@mixin fieldcheckbox-error-variables() {\n  --nv-fieldcheckbox-border-default: var(--components-form-field-border-error);\n  --nv-fieldcheckbox-border-hover: var(--nv-fieldcheckbox-border-default);\n  --nv-fieldcheckbox-border-focus: var(--components-form-field-border-error);\n  --nv-fieldcheckbox-focus-box-shadow: var(--color-focus-destructive);\n  --nv-fieldcheckbox-color-disabled: var(\n    --components-form-shape-foreground-disabled-error\n  );\n  --nv-fieldcheckbox-background-checked: var(\n    --components-form-field-background-error\n  );\n  --nv-fieldcheckbox-outline-color: var(--color-focus-destructive);\n}\n\n@mixin root-styles() {\n  display: inline-flex;\n  align-items: flex-start;\n  gap: var(--form-gap-x);\n  position: relative;\n\n  &:not([disabled], [readonly]) {\n    input,\n    label {\n      cursor: pointer;\n    }\n  }\n}\n\n@mixin label-before-styles() {\n  flex-direction: row-reverse;\n}\n\n@mixin label-styles() {\n  align-self: stretch;\n  color: var(--components-form-text-label-default);\n  font-family: 'TT Norms Pro', sans-serif;\n  font-size: var(--form-label-font-size);\n  font-style: normal;\n  font-weight: var(--form-label-font-weight);\n  line-height: var(--form-label-line-height);\n}\n\n@mixin description-styles() {\n  align-self: stretch;\n  color: var(--components-form-text-description-default);\n  font-family: 'TT Norms Pro', sans-serif;\n  font-size: var(--form-description-font-size);\n  font-style: normal;\n  font-weight: var(--form-description-font-weight);\n  line-height: var(--form-description-line-height);\n}\n\n@mixin error-description-styles() {\n  @include description-styles();\n\n  color: var(--components-form-text-description-error);\n}\n\n@mixin text-container-styles() {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  flex: 1 0 0;\n}\n\n@mixin input-container-styles() {\n  position: relative;\n  color: var(--nv-fieldcheckbox-color-checked);\n\n  input[type='checkbox'][readonly] {\n    // TODO: Find a way to use the --components-form-opacity-disabled variable properly, right now it outputs a value of 50px instead of 0.5.\n    opacity: 0.5;\n  }\n\n  &:has(input[type='checkbox']:disabled:not([readonly])) {\n    color: var(--nv-fieldcheckbox-color-disabled);\n  }\n}\n\n@mixin input-styles() {\n  appearance: none;\n  position: relative;\n  display: flex;\n  width: var(--form-checkbox-size);\n  height: var(--form-checkbox-size);\n  flex-direction: column;\n  align-items: flex-start;\n  border-radius: var(--form-checkbox-radius);\n  border-width: var(--form-checkbox-border-width);\n  border-style: solid;\n  border-color: var(--nv-fieldcheckbox-border-default);\n  background: var(--nv-fieldcheckbox-background-default);\n\n  &:hover {\n    border-color: var(--nv-fieldcheckbox-border-hover);\n  }\n\n  &:focus {\n    border-color: var(--nv-fieldcheckbox-border-focus);\n  }\n\n  @include focus-ring(var(--nv-fieldcheckbox-outline-color));\n\n  &:checked,\n  &:indeterminate {\n    background: var(--nv-fieldcheckbox-background-checked);\n    border-color: var(--nv-fieldcheckbox-background-checked);\n  }\n\n  &:disabled:not([readonly]) {\n    background: var(--nv-fieldcheckbox-background-disabled);\n    border-color: var(--nv-fieldcheckbox-border-default);\n  }\n\n  &[readonly] {\n    // TODO: Find a way to use the --components-form-opacity-disabled variable properly, right now it outputs a value of 50px instead of 0.5.\n    opacity: 0.5;\n  }\n}\n\n@mixin icon-styles() {\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  svg {\n    width: var(--form-checkbox-icon-size);\n    height: var(--form-checkbox-icon-size);\n    fill: none;\n    stroke: currentcolor;\n    stroke-width: var(--form-checkbox-icon-stroke);\n    flex-shrink: 0;\n  }\n}\n\nnv-fieldcheckbox {\n  @include fieldcheckbox-variables();\n  @include root-styles();\n\n  &.error > .input-container {\n    @include fieldcheckbox-error-variables();\n  }\n\n  &.label-placement-before {\n    @include label-before-styles();\n  }\n\n  &[disabled]:not([disabled='false']) {\n    // TODO: Find a way to use the --components-form-opacity-disabled variable properly, right now it outputs a value of 50px instead of 0.5.\n    opacity: 0.5;\n  }\n\n  > .input-container {\n    @include input-container-styles();\n\n    input[type='checkbox'] {\n      @include input-styles();\n    }\n\n    .icon {\n      @include icon-styles();\n    }\n  }\n\n  > .text-container {\n    @include text-container-styles();\n\n    label {\n      @include label-styles();\n      &.visually-hidden {\n        @include utils.visually-hidden();\n      }\n    }\n\n    .description {\n      @include description-styles();\n    }\n\n    .error-description {\n      @include error-description-styles();\n    }\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Watch,\n  Event,\n  EventEmitter,\n  Listen,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { type LabelPlacement } from '../../utils/constants';\n\n/**\n * @slot default - Next to the label and description.\n * @slot main - Replaces the label and description.\n * @slot label - Content to be placed as the label, will override the label prop.\n * @slot description - Content to be placed as the description, will override the description prop.\n * @slot error-description - Content to be placed as the error description, will override the errorDescription prop.\n * @slot checked-icon - Content to be placed as the checked icon, will override the checkedIcon prop.\n * @slot indeterminate-icon - Content to be placed as the indeterminate icon, will override the indeterminateIcon prop.\n */\n@Component({\n  tag: 'nv-fieldcheckbox',\n  styleUrl: 'nv-fieldcheckbox.scss',\n  formAssociated: true,\n  shadow: false,\n})\nexport class NvFieldcheckbox {\n  @Element() el!: HTMLNvFieldcheckboxElement;\n\n  /****************************************************************************/\n  //#region DEPRECATED\n\n  /**\n   * Message define a 'hint ' message for the Field.\n   * @deprecated Use `description` instead.\n   * */\n  @Prop({ reflect: true })\n  readonly message?: string;\n\n  /**\n   * The text for the validation message.\n   * @deprecated Use `errorDescription` and set the error prop instead.\n   * */\n  @Prop({ reflect: true })\n  readonly validation?: string;\n\n  /**\n   * When true, the label will be placed before the checkbox.\n   * @deprecated Use `labelPlacement = end` instead.\n   * */\n  @Prop({ reflect: true })\n  readonly labelBefore?: boolean = false;\n\n  //#endregion DEPRECATED\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Sets the ID for the radio button’s input element and the for attribute of\n   * the associated label. If no ID is provided, a random one will be\n   * automatically generated to ensure unique identification, facilitating\n   * proper label association and accessibility.\n   */\n  @Prop({ reflect: true })\n  readonly inputId: string = uuidv4();\n\n  /**\n   * The name attribute for the checkbox input, used to reference the form data\n   * after submission.\n   */\n  @Prop({ reflect: true })\n  readonly name?: string;\n\n  /**\n   * The value attribute of the checkbox input, representing the value sent on\n   * form submission when the checkbox is checked. When the form is submitted,\n   * the data will consist of a name=value pair.\n   */\n  @Prop({ reflect: true })\n  readonly value?: string;\n\n  /**\n   * The label displayed next to the checkbox.\n   */\n  @Prop({ reflect: true })\n  readonly label?: string;\n\n  /**\n   * Determines the position of the label relative to the checkbox, either\n   * 'start' (before) or 'end' (after).\n   */\n  @Prop({ reflect: true, mutable: true })\n  labelPlacement: `${LabelPlacement}`;\n\n  /**\n   * Hides the label visually while still keeping it available for screen\n   * readers.\n   */\n  @Prop({ reflect: true })\n  readonly hideLabel: boolean = false;\n\n  /**\n   * A description providing additional context or information about the\n   * checkbox.\n   */\n  @Prop({ reflect: true, mutable: true })\n  description?: string;\n\n  /**\n   * Signals that there is an error associated with the checkbox, which can\n   * trigger visual cues.\n   * @validator error\n   */\n  @Prop({ reflect: true, mutable: true })\n  error: boolean = false;\n\n  /**\n   * A description that appears when there is an error related to the checkbox.\n   * @validator message\n   */\n  @Prop({ reflect: true, mutable: true })\n  errorDescription?: string;\n\n  /**\n   * Indicates whether the checkbox is checked or not.\n   */\n  @Prop({ reflect: true, mutable: true })\n  checked: boolean = false;\n\n  /**\n   * Indicates whether the checkbox is in an indeterminate state, typically used\n   * for hierarchical checkboxes.\n   */\n  @Prop({ reflect: true, mutable: true })\n  indeterminate: boolean = false;\n\n  /**\n   * Disables the checkbox, preventing user interaction.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Sets the checkbox to read-only, preventing user changes but still allowing\n   * focus and selection of text.\n   */\n  @Prop({ reflect: true })\n  readonly readonly: boolean = false;\n\n  /**\n   * Marks the checkbox as required, indicating that it must be checked for\n   * form submission.\n   */\n  @Prop({ reflect: true })\n  readonly required: boolean = false;\n\n  /**\n   * Applies focus to the input field as soon as the component is mounted. This\n   * is equivalent to setting the native autofocus attribute on an <input>\n   * element.\n   */\n  @Prop({ reflect: true })\n  // eslint-disable-next-line @stencil-community/reserved-member-names\n  readonly autofocus: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emits when the checked state changes.\n   * @bind checked\n   */\n  @Event()\n  checkedChanged: EventEmitter<boolean>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region LISTENERS\n\n  /**\n   * Listens for the change event on the checkbox input element and updates the\n   * checked state.\n   * @param {Event} event - The change event.\n   */\n  @Listen('change')\n  handleChange(event: Event) {\n    const target = event.target as HTMLInputElement;\n\n    if (target.type === 'checkbox' && target.id === this.inputId) {\n      if (this.readonly || this.disabled) {\n        event.preventDefault();\n        return;\n      }\n\n      if (this.indeterminate) {\n        this.indeterminate = false;\n      }\n\n      this.checked = target.checked;\n    }\n  }\n\n  //#endregion LISTENERS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  /**\n   * Watches for changes to the checked state and emits the new value.\n   * @param {boolean} checked - The new value of the checked state.\n   */\n  @Watch('checked')\n  onCheckedChanged(checked: boolean) {\n    this.checkedChanged.emit(checked);\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillRender() {\n    if (this.message) {\n      this.description = this.message;\n    }\n\n    if (this.labelBefore) {\n      this.labelPlacement = 'before';\n    }\n\n    if (this.validation) {\n      this.errorDescription = this.validation;\n      this.error = true;\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        class={clsx(\n          this.labelPlacement === 'before' && 'label-placement-before',\n          this.error && 'error',\n        )}\n      >\n        <div class=\"input-container\">\n          <input\n            type=\"checkbox\"\n            id={this.inputId}\n            name={this.name}\n            autofocus={this.autofocus}\n            autocomplete=\"off\"\n            value={this.value}\n            checked={Boolean(this.checked)}\n            disabled={this.disabled || this.readonly}\n            readonly={this.readonly && !this.required}\n            required={this.required}\n            indeterminate={this.indeterminate}\n            ref={el => {\n              if (el) {\n                el.indeterminate = this.indeterminate;\n              }\n            }}\n          />\n          <span class=\"icon\">\n            {this.checked && !this.indeterminate && (\n              <slot name=\"checked-icon\">\n                <svg\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  width=\"14\"\n                  height=\"14\"\n                  viewBox=\"0 0 14 14\"\n                  fill=\"none\"\n                >\n                  <path\n                    d=\"M11.6667 3.5L5.25004 9.91667L2.33337 7\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  />\n                </svg>\n              </slot>\n            )}\n            {this.indeterminate && (\n              <slot name=\"indeterminate-icon\">\n                <svg\n                  class=\"indeterminate-svg\"\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  viewBox=\"0 0 14 14\"\n                  fill=\"none\"\n                >\n                  <path\n                    d=\"M2.9165 7H11.0832\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  />\n                </svg>\n              </slot>\n            )}\n          </span>\n        </div>\n\n        <slot></slot>\n\n        <div class=\"text-container\">\n          <slot name=\"main\">\n            {(this.label || this.el.querySelector('[slot=\"label\"]')) && (\n              <label\n                htmlFor={this.inputId}\n                class={clsx(this.hideLabel && 'visually-hidden')}\n              >\n                <slot name=\"label\">{this.label}</slot>\n              </label>\n            )}\n\n            {(this.description ||\n              this.el.querySelector('[slot=\"description\"]')) && (\n              <div class=\"description\">\n                <slot name=\"description\">{this.description}</slot>\n              </div>\n            )}\n          </slot>\n\n          {(this.errorDescription ||\n            this.el.querySelector('[slot=\"error-description\"]')) && (\n            <div hidden={!this.error} class=\"error-description\">\n              <slot name=\"error-description\">{this.errorDescription}</slot>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}
+{"file":"p-1172e9bb.js","mappings":"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","names":["uuidv4"],"sources":["src/components/nv-fieldcheckbox/nv-fieldcheckbox.scss?tag=nv-fieldcheckbox","src/components/nv-fieldcheckbox/nv-fieldcheckbox.tsx"],"sourcesContent":["@use \"../../styles/utils\" as utils;\n@import '../../styles/focus-ring';\n\n@mixin fieldcheckbox-variables() {\n  --nv-fieldcheckbox-border-default: var(\n    --components-form-field-border-default\n  );\n  --nv-fieldcheckbox-border-hover: var(--components-form-field-border-hover);\n  --nv-fieldcheckbox-border-focus: var(--components-form-field-border-default);\n  --nv-fieldcheckbox-background-default: var(\n    --components-form-field-background-default\n  );\n  --nv-fieldcheckbox-background-checked: var(\n    --components-form-field-background-checked\n  );\n  --nv-fieldcheckbox-background-disabled: var(\n    --components-form-field-background-disabled\n  );\n  --nv-fieldcheckbox-focus-box-shadow: var(--color-focus-brand);\n  --nv-fieldcheckbox-color-checked: var(\n    --components-form-shape-foreground-default\n  );\n  --nv-fieldcheckbox-color-disabled: var(\n    --components-form-shape-foreground-disabled\n  );\n  --nv-fieldcheckbox-outline-color: var(--color-focus-brand);\n}\n\n@mixin fieldcheckbox-error-variables() {\n  --nv-fieldcheckbox-border-default: var(--components-form-field-border-error);\n  --nv-fieldcheckbox-border-hover: var(--nv-fieldcheckbox-border-default);\n  --nv-fieldcheckbox-border-focus: var(--components-form-field-border-error);\n  --nv-fieldcheckbox-focus-box-shadow: var(--color-focus-destructive);\n  --nv-fieldcheckbox-color-disabled: var(\n    --components-form-shape-foreground-disabled-error\n  );\n  --nv-fieldcheckbox-background-checked: var(\n    --components-form-field-background-error\n  );\n  --nv-fieldcheckbox-outline-color: var(--color-focus-destructive);\n}\n\n@mixin root-styles() {\n  display: inline-flex;\n  align-items: flex-start;\n  gap: var(--form-gap-x);\n  position: relative;\n\n  &:not([disabled], [readonly]) {\n    input,\n    label {\n      cursor: pointer;\n    }\n  }\n}\n\n@mixin label-before-styles() {\n  flex-direction: row-reverse;\n}\n\n@mixin label-styles() {\n  align-self: stretch;\n  color: var(--components-form-text-label-default);\n  font-family: 'TT Norms Pro', sans-serif;\n  font-size: var(--form-label-font-size);\n  font-style: normal;\n  font-weight: var(--form-label-font-weight);\n  line-height: var(--form-label-line-height);\n}\n\n@mixin description-styles() {\n  align-self: stretch;\n  color: var(--components-form-text-description-default);\n  font-family: 'TT Norms Pro', sans-serif;\n  font-size: var(--form-description-font-size);\n  font-style: normal;\n  font-weight: var(--form-description-font-weight);\n  line-height: var(--form-description-line-height);\n}\n\n@mixin error-description-styles() {\n  @include description-styles();\n\n  color: var(--components-form-text-description-error);\n}\n\n@mixin text-container-styles() {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  flex: 1 0 0;\n}\n\n@mixin input-container-styles() {\n  position: relative;\n  color: var(--nv-fieldcheckbox-color-checked);\n\n  input[type='checkbox'][readonly] {\n    // TODO: Find a way to use the --components-form-opacity-disabled variable properly, right now it outputs a value of 50px instead of 0.5.\n    opacity: 0.5;\n  }\n\n  &:has(input[type='checkbox']:disabled:not([readonly])) {\n    color: var(--nv-fieldcheckbox-color-disabled);\n  }\n}\n\n@mixin input-styles() {\n  appearance: none;\n  position: relative;\n  display: flex;\n  width: var(--form-checkbox-size);\n  height: var(--form-checkbox-size);\n  flex-direction: column;\n  align-items: flex-start;\n  border-radius: var(--form-checkbox-radius);\n  border-width: var(--form-checkbox-border-width);\n  border-style: solid;\n  border-color: var(--nv-fieldcheckbox-border-default);\n  background: var(--nv-fieldcheckbox-background-default);\n\n  &:hover {\n    border-color: var(--nv-fieldcheckbox-border-hover);\n  }\n\n  &:focus {\n    border-color: var(--nv-fieldcheckbox-border-focus);\n  }\n\n  @include focus-ring(var(--nv-fieldcheckbox-outline-color));\n\n  &:checked,\n  &:indeterminate {\n    background: var(--nv-fieldcheckbox-background-checked);\n    border-color: var(--nv-fieldcheckbox-background-checked);\n  }\n\n  &:disabled:not([readonly]) {\n    background: var(--nv-fieldcheckbox-background-disabled);\n    border-color: var(--nv-fieldcheckbox-border-default);\n  }\n\n  &[readonly] {\n    // TODO: Find a way to use the --components-form-opacity-disabled variable properly, right now it outputs a value of 50px instead of 0.5.\n    opacity: 0.5;\n  }\n}\n\n@mixin icon-styles() {\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n  svg {\n    width: var(--form-checkbox-icon-size);\n    height: var(--form-checkbox-icon-size);\n    fill: none;\n    stroke: currentcolor;\n    stroke-width: var(--form-checkbox-icon-stroke);\n    flex-shrink: 0;\n  }\n}\n\nnv-fieldcheckbox {\n  @include fieldcheckbox-variables();\n  @include root-styles();\n\n  &.error > .input-container {\n    @include fieldcheckbox-error-variables();\n  }\n\n  &.label-placement-before {\n    @include label-before-styles();\n  }\n\n  &[disabled]:not([disabled='false']) {\n    // TODO: Find a way to use the --components-form-opacity-disabled variable properly, right now it outputs a value of 50px instead of 0.5.\n    opacity: 0.5;\n  }\n\n  > .input-container {\n    @include input-container-styles();\n\n    input[type='checkbox'] {\n      @include input-styles();\n    }\n\n    .icon {\n      @include icon-styles();\n    }\n  }\n\n  > .text-container {\n    @include text-container-styles();\n\n    label {\n      @include label-styles();\n      &.visually-hidden {\n        @include utils.visually-hidden();\n      }\n    }\n\n    .description {\n      @include description-styles();\n    }\n\n    .error-description {\n      @include error-description-styles();\n    }\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Watch,\n  Event,\n  EventEmitter,\n  Listen,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { type LabelPlacement } from '../../utils/constants';\n\n/**\n * @slot default - Next to the label and description.\n * @slot main - Replaces the label and description.\n * @slot label - Content to be placed as the label, will override the label prop.\n * @slot description - Content to be placed as the description, will override the description prop.\n * @slot error-description - Content to be placed as the error description, will override the errorDescription prop.\n * @slot checked-icon - Content to be placed as the checked icon, will override the checkedIcon prop.\n * @slot indeterminate-icon - Content to be placed as the indeterminate icon, will override the indeterminateIcon prop.\n */\n@Component({\n  tag: 'nv-fieldcheckbox',\n  styleUrl: 'nv-fieldcheckbox.scss',\n  formAssociated: true,\n  shadow: false,\n})\nexport class NvFieldcheckbox {\n  @Element() el!: HTMLNvFieldcheckboxElement;\n\n  /****************************************************************************/\n  //#region DEPRECATED\n\n  /**\n   * Message define a 'hint ' message for the Field.\n   * @deprecated Use `description` instead.\n   * */\n  @Prop({ reflect: true })\n  readonly message?: string;\n\n  /**\n   * The text for the validation message.\n   * @deprecated Use `errorDescription` and set the error prop instead.\n   * */\n  @Prop({ reflect: true })\n  readonly validation?: string;\n\n  /**\n   * When true, the label will be placed before the checkbox.\n   * @deprecated Use `labelPlacement = end` instead.\n   * */\n  @Prop({ reflect: true })\n  readonly labelBefore?: boolean = false;\n\n  //#endregion DEPRECATED\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Sets the ID for the radio button’s input element and the for attribute of\n   * the associated label. If no ID is provided, a random one will be\n   * automatically generated to ensure unique identification, facilitating\n   * proper label association and accessibility.\n   */\n  @Prop({ reflect: true })\n  readonly inputId: string = uuidv4();\n\n  /**\n   * The name attribute for the checkbox input, used to reference the form data\n   * after submission.\n   */\n  @Prop({ reflect: true })\n  readonly name?: string;\n\n  /**\n   * The value attribute of the checkbox input, representing the value sent on\n   * form submission when the checkbox is checked. When the form is submitted,\n   * the data will consist of a name=value pair.\n   */\n  @Prop({ reflect: true })\n  readonly value?: string;\n\n  /**\n   * The label displayed next to the checkbox.\n   */\n  @Prop({ reflect: true })\n  readonly label?: string;\n\n  /**\n   * Determines the position of the label relative to the checkbox, either\n   * 'start' (before) or 'end' (after).\n   */\n  @Prop({ reflect: true, mutable: true })\n  labelPlacement: `${LabelPlacement}`;\n\n  /**\n   * Hides the label visually while still keeping it available for screen\n   * readers.\n   */\n  @Prop({ reflect: true })\n  readonly hideLabel: boolean = false;\n\n  /**\n   * A description providing additional context or information about the\n   * checkbox.\n   */\n  @Prop({ reflect: true, mutable: true })\n  description?: string;\n\n  /**\n   * Signals that there is an error associated with the checkbox, which can\n   * trigger visual cues.\n   * @validator error\n   */\n  @Prop({ reflect: true, mutable: true })\n  error: boolean = false;\n\n  /**\n   * A description that appears when there is an error related to the checkbox.\n   * @validator message\n   */\n  @Prop({ reflect: true, mutable: true })\n  errorDescription?: string;\n\n  /**\n   * Indicates whether the checkbox is checked or not.\n   */\n  @Prop({ reflect: true, mutable: true })\n  checked: boolean = false;\n\n  /**\n   * Indicates whether the checkbox is in an indeterminate state, typically used\n   * for hierarchical checkboxes.\n   */\n  @Prop({ reflect: true, mutable: true })\n  indeterminate: boolean = false;\n\n  /**\n   * Disables the checkbox, preventing user interaction.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Sets the checkbox to read-only, preventing user changes but still allowing\n   * focus and selection of text.\n   */\n  @Prop({ reflect: true })\n  readonly readonly: boolean = false;\n\n  /**\n   * Marks the checkbox as required, indicating that it must be checked for\n   * form submission.\n   */\n  @Prop({ reflect: true })\n  readonly required: boolean = false;\n\n  /**\n   * Applies focus to the input field as soon as the component is mounted. This\n   * is equivalent to setting the native autofocus attribute on an <input>\n   * element.\n   */\n  @Prop({ reflect: true })\n  // eslint-disable-next-line @stencil-community/reserved-member-names\n  readonly autofocus: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emits when the checked state changes.\n   * @bind checked\n   */\n  @Event()\n  checkedChanged: EventEmitter<boolean>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region LISTENERS\n\n  /**\n   * Listens for the change event on the checkbox input element and updates the\n   * checked state.\n   * @param {Event} event - The change event.\n   */\n  @Listen('change')\n  handleChange(event: Event) {\n    const target = event.target as HTMLInputElement;\n\n    if (target.type === 'checkbox' && target.id === this.inputId) {\n      if (this.readonly || this.disabled) {\n        event.preventDefault();\n        return;\n      }\n\n      if (this.indeterminate) {\n        this.indeterminate = false;\n      }\n\n      this.checked = target.checked;\n    }\n  }\n\n  //#endregion LISTENERS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  /**\n   * Watches for changes to the checked state and emits the new value.\n   * @param {boolean} checked - The new value of the checked state.\n   */\n  @Watch('checked')\n  onCheckedChanged(checked: boolean) {\n    this.checkedChanged.emit(checked);\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillRender() {\n    if (this.message) {\n      this.description = this.message;\n    }\n\n    if (this.labelBefore) {\n      this.labelPlacement = 'before';\n    }\n\n    if (this.validation) {\n      this.errorDescription = this.validation;\n      this.error = true;\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        class={clsx(\n          this.labelPlacement === 'before' && 'label-placement-before',\n          this.error && 'error',\n        )}\n      >\n        <div class=\"input-container\">\n          <input\n            type=\"checkbox\"\n            id={this.inputId}\n            name={this.name}\n            autofocus={this.autofocus}\n            autocomplete=\"off\"\n            value={this.value}\n            checked={Boolean(this.checked)}\n            disabled={this.disabled || this.readonly}\n            readonly={this.readonly && !this.required}\n            required={this.required}\n            indeterminate={this.indeterminate}\n            ref={el => {\n              if (el) {\n                el.indeterminate = this.indeterminate;\n              }\n            }}\n          />\n          <span class=\"icon\">\n            {this.checked && !this.indeterminate && (\n              <slot name=\"checked-icon\">\n                <svg\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  width=\"14\"\n                  height=\"14\"\n                  viewBox=\"0 0 14 14\"\n                  fill=\"none\"\n                >\n                  <path\n                    d=\"M11.6667 3.5L5.25004 9.91667L2.33337 7\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  />\n                </svg>\n              </slot>\n            )}\n            {this.indeterminate && (\n              <slot name=\"indeterminate-icon\">\n                <svg\n                  class=\"indeterminate-svg\"\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  viewBox=\"0 0 14 14\"\n                  fill=\"none\"\n                >\n                  <path\n                    d=\"M2.9165 7H11.0832\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  />\n                </svg>\n              </slot>\n            )}\n          </span>\n        </div>\n\n        <slot></slot>\n\n        <div class=\"text-container\">\n          <slot name=\"main\">\n            {(this.label || this.el.querySelector('[slot=\"label\"]')) && (\n              <label\n                htmlFor={this.inputId}\n                class={clsx(this.hideLabel && 'visually-hidden')}\n              >\n                <slot name=\"label\">{this.label}</slot>\n              </label>\n            )}\n\n            {(this.description ||\n              this.el.querySelector('[slot=\"description\"]')) && (\n              <div class=\"description\">\n                <slot name=\"description\">{this.description}</slot>\n              </div>\n            )}\n          </slot>\n\n          {(this.errorDescription ||\n            this.el.querySelector('[slot=\"error-description\"]')) && (\n            <div hidden={!this.error} class=\"error-description\">\n              <slot name=\"error-description\">{this.errorDescription}</slot>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}

package/dist/components/{p-a3ddec4c.js → p-2277cfc8.js}

@@ -42,6 +42,11 @@ var ButtonType;
     ButtonType["Reset"] = "reset";
     ButtonType["Button"] = "button";
 })(ButtonType || (ButtonType = {}));
+var NotificationEmphasis;
+(function (NotificationEmphasis) {
+    NotificationEmphasis["Medium"] = "medium";
+    NotificationEmphasis["High"] = "high";
+})(NotificationEmphasis || (NotificationEmphasis = {}));
 var ToggleButtonEmphasis;
 (function (ToggleButtonEmphasis) {
     ToggleButtonEmphasis["High"] = "high";
@@ -266,28 +271,6 @@ const CUSTOM_MONTH_NAMES = {
     ],
 };
 
-const constants = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    get FeedbackColors () { return FeedbackColors; },
-    get DeprecatedSemanticColors () { return DeprecatedSemanticColors; },
-    get SemanticSizes () { return SemanticSizes; },
-    get ButtonSize () { return ButtonSize; },
-    get ButtonEmphasis () { return ButtonEmphasis; },
-    get ButtonType () { return ButtonType; },
-    get ToggleButtonEmphasis () { return ToggleButtonEmphasis; },
-    get ToggleButtonSize () { return ToggleButtonSize; },
-    get IconButtonShape () { return IconButtonShape; },
-    get LoaderColors () { return LoaderColors; },
-    get LabelPlacement () { return LabelPlacement; },
-    get TextInputAutocomplete () { return TextInputAutocomplete; },
-    get TimeType () { return TimeType; },
-    get GlobalFilterPosition () { return GlobalFilterPosition; },
-    get SortingPossibility () { return SortingPossibility; },
-    WEEK_ABBREVIATIONS: WEEK_ABBREVIATIONS,
-    CUSTOM_DAY_NAMES: CUSTOM_DAY_NAMES,
-    CUSTOM_MONTH_NAMES: CUSTOM_MONTH_NAMES
-});
+export { ButtonSize as B, CUSTOM_DAY_NAMES as C, DeprecatedSemanticColors as D, FeedbackColors as F, GlobalFilterPosition as G, IconButtonShape as I, LoaderColors as L, NotificationEmphasis as N, SemanticSizes as S, ToggleButtonEmphasis as T, WEEK_ABBREVIATIONS as W, ButtonEmphasis as a, ButtonType as b, ToggleButtonSize as c, LabelPlacement as d, TextInputAutocomplete as e, TimeType as f, SortingPossibility as g, CUSTOM_MONTH_NAMES as h };
 
-export { ButtonType as B, CUSTOM_DAY_NAMES as C, FeedbackColors as F, SemanticSizes as S, TimeType as T, WEEK_ABBREVIATIONS as W, ButtonSize as a, CUSTOM_MONTH_NAMES as b, constants as c, SortingPossibility as d };
-
-//# sourceMappingURL=p-a3ddec4c.js.map
+//# sourceMappingURL=p-2277cfc8.js.map

package/dist/components/p-2277cfc8.js.map

@@ -0,0 +1 @@
+{"file":"p-2277cfc8.js","mappings":"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","names":[],"sources":["src/utils/constants.ts"],"sourcesContent":["import { WeekAbbreviations } from '../interfaces/localization';\n\nexport enum FeedbackColors {\n  Information = 'information',\n  Warning = 'warning',\n  Success = 'success',\n  Error = 'error',\n  Neutral = 'neutral',\n}\nexport enum DeprecatedSemanticColors {\n  Neutral = 'neutral',\n  Primary = 'primary',\n  Secondary = 'secondary',\n  Success = 'success',\n  Error = 'error',\n}\nexport enum SemanticSizes {\n  ExtraSmall = 'xs',\n  Small = 'sm',\n  Medium = 'md',\n  Large = 'lg',\n  ExtraLarge = 'xl',\n}\nexport enum ButtonSize {\n  ExtraSmall = 'xs',\n  Small = 'sm',\n  Medium = 'md',\n  Large = 'lg',\n}\nexport enum ButtonEmphasis {\n  High = 'high',\n  Medium = 'medium',\n  Low = 'low',\n  Lower = 'lower',\n}\nexport enum ButtonType {\n  Submit = 'submit',\n  Reset = 'reset',\n  Button = 'button',\n}\nexport enum NotificationEmphasis {\n  Medium = 'medium',\n  High = 'high',\n}\nexport enum ToggleButtonEmphasis {\n  High = 'high',\n  Low = 'low',\n}\nexport enum ToggleButtonSize {\n  ExtraSmall = 'xs',\n  Small = 'sm',\n  Medium = 'md',\n  Large = 'lg',\n}\nexport enum IconButtonShape {\n  Square = 'square',\n  Rounded = 'rounded',\n}\nexport enum LoaderColors {\n  High = 'brand',\n  Low = 'white',\n}\nexport enum LabelPlacement {\n  Before = 'before',\n  After = 'after',\n}\n\nexport enum TextInputAutocomplete {\n  On = 'on',\n  Off = 'off',\n  Section = 'section-*',\n  Shipping = 'shipping',\n  Billing = 'billing',\n  Home = 'home',\n  Work = 'work',\n  Mobile = 'mobile',\n  Fax = 'fax',\n  Pager = 'pager',\n  Tel = 'tel',\n  TelCountryCode = 'tel-country-code',\n  TelNational = 'tel-national',\n  TelAreaCode = 'tel-area-code',\n  TelLocal = 'tel-local',\n  TelLocalPrefix = 'tel-local-prefix',\n  TelLocalSuffix = 'tel-local-suffix',\n  TelExtension = 'tel-extension',\n  Email = 'email',\n  IMProtocol = 'impp',\n  Name = 'name',\n  HonorificPrefix = 'honorific-prefix',\n  GivenName = 'given-name',\n  AdditionalName = 'additional-name',\n  FamilyName = 'family-name',\n  HonorificSuffix = 'honorific-suffix',\n  Nickname = 'nickname',\n  Username = 'username',\n  NewPassword = 'new-password',\n  CurrentPassword = 'current-password',\n  OneTimeCode = 'one-time-code',\n  OrganizationTitle = 'organization-title',\n  Organization = 'organization',\n  StreetAddress = 'street-address',\n  AddressLine1 = 'address-line1',\n  AddressLine2 = 'address-line2',\n  AddressLine3 = 'address-line3',\n  AddressLevel4 = 'address-level4',\n  AddressLevel3 = 'address-level3',\n  AddressLevel2 = 'address-level2',\n  AddressLevel1 = 'address-level1',\n  Country = 'country',\n  CountryName = 'country-name',\n  PostalCode = 'postal-code',\n  CCName = 'cc-name',\n  CCGivenName = 'cc-given-name',\n  CCAdditionalName = 'cc-additional-name',\n  CCFamilyName = 'cc-family-name',\n  CCNumber = 'cc-number',\n  CCExp = 'cc-exp',\n  CCExpMonth = 'cc-exp-month',\n  CCExpYear = 'cc-exp-year',\n  CCCSC = 'cc-csc',\n  CCType = 'cc-type',\n  TransactionCurrency = 'transaction-currency',\n  TransactionAmount = 'transaction-amount',\n  Language = 'language',\n  Bday = 'bday',\n  BdayDay = 'bday-day',\n  BdayMonth = 'bday-month',\n  BdayYear = 'bday-year',\n  Sex = 'sex',\n  Url = 'url',\n  Photo = 'photo',\n}\n\nexport enum TimeType {\n  Hours = 'hours',\n  Minutes = 'minutes',\n  Seconds = 'seconds',\n}\n\nexport enum GlobalFilterPosition {\n  End = 'end',\n  Start = 'start',\n  Center = 'center',\n}\nexport enum SortingPossibility {\n  Asc = 'asc',\n  Desc = 'desc',\n}\n\nexport const WEEK_ABBREVIATIONS: WeekAbbreviations = {\n  'fr-FR': 'Sem', // Semaine\n  'fr-BE': 'Sem', // Semaine\n  'nl-BE': 'W', // Week\n  'en-BE': 'W', // Week\n  'en-US': 'W', // Week\n  'en-GB': 'W', // Week\n  'es-ES': 'Sem', // Semana\n  'de-DE': 'KW', // Kalenderwoche\n  'it-IT': 'Set', // Settimana\n  'pt-PT': 'Sem', // Semana\n  'nl-NL': 'W', // Week\n  'pl-PL': 'Tyd', // Tydzień\n  'ru-RU': 'Нед', // Неделя\n  'ja-JP': '週', // Shū\n  'zh-CN': '周', // Zhōu\n  'ko-KR': '주', // Ju\n};\n\nexport const CUSTOM_DAY_NAMES: { [key: string]: string[] } = {\n  'fr-BE': ['Lu', 'Ma', 'Me', 'Je', 'Ve', 'Sa', 'Di'],\n  'nl-BE': ['Ma', 'Di', 'Wo', 'Do', 'Vr', 'Za', 'Zo'],\n  'de-DE': ['Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa', 'So'],\n  'en-BE': ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],\n  'en-US': ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],\n  'en-GB': ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],\n};\n\nexport const CUSTOM_MONTH_NAMES: { [key: string]: string[] } = {\n  'fr-BE': [\n    'Jan',\n    'Fev',\n    'Mar',\n    'Avr',\n    'Mai',\n    'Jun',\n    'Jul',\n    'Aou',\n    'Sep',\n    'Oct',\n    'Nov',\n    'Dec',\n  ],\n  'nl-BE': [\n    'Jan',\n    'Feb',\n    'Maa',\n    'Apr',\n    'Mei',\n    'Jun',\n    'Jul',\n    'Aug',\n    'Sep',\n    'Okt',\n    'Nov',\n    'Dec',\n  ],\n  'de-DE': [\n    'Jan',\n    'Feb',\n    'Mär',\n    'Apr',\n    'Mai',\n    'Jun',\n    'Jul',\n    'Aug',\n    'Sep',\n    'Okt',\n    'Nov',\n    'Dez',\n  ],\n  'en-BE': [\n    'Jan',\n    'Feb',\n    'Mar',\n    'Apr',\n    'May',\n    'Jun',\n    'Jul',\n    'Aug',\n    'Sep',\n    'Oct',\n    'Nov',\n    'Dec',\n  ],\n  'en-US': [\n    'Jan',\n    'Feb',\n    'Mar',\n    'Apr',\n    'May',\n    'Jun',\n    'Jul',\n    'Aug',\n    'Sep',\n    'Oct',\n    'Nov',\n    'Dec',\n  ],\n  'en-GB': [\n    'Jan',\n    'Feb',\n    'Mar',\n    'Apr',\n    'May',\n    'Jun',\n    'Jul',\n    'Aug',\n    'Sep',\n    'Oct',\n    'Nov',\n    'Dec',\n  ],\n};\n"],"version":3}

package/dist/components/{p-b659b999.js → p-2854cf01.js}

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-aff3ed68.js';
-import { d as defineCustomElement$1 } from './p-a1fe0a5d.js';
+import { d as defineCustomElement$1 } from './p-ca38a8a9.js';
 
 const nvMenuitemCss = "nv-menuitem{display:flex;align-items:center;max-width:300px;width:100vw;font-size:var(--menu-contextual-item-font-size);font-weight:var(--menu-contextual-item-font-weight);color:var(--components-menu-contextual-item-content);border-radius:var(--menu-contextual-item-radius);gap:var(--menu-contextual-item-gap-x);padding:var(--menu-contextual-item-padding-y) var(--menu-contextual-item-padding-x);transition:background-color 150ms ease-out;cursor:pointer}nv-menuitem:hover,nv-menuitem:focus,nv-menuitem:focus-within{background-color:var(--components-menu-contextual-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-menuitem *{pointer-events:none}nv-menuitem kbd{color:var(--components-menu-contextual-item-shortcut)}nv-menuitem [data-scope=text]{margin-right:auto}nv-menuitem[disabled]:not([disabled=false]){cursor:unset;background-color:unset;color:var(--components-menu-contextual-item-content-disabled)}";
 const NvMenuitemStyle0 = nvMenuitemCss;
@@ -82,4 +82,4 @@ defineCustomElement();
 
 export { NvMenuitem as N, defineCustomElement as d };
 
-//# sourceMappingURL=p-b659b999.js.map
+//# sourceMappingURL=p-2854cf01.js.map

package/dist/components/{p-b659b999.js.map → p-2854cf01.js.map}

@@ -1 +1 @@
-{"file":"p-b659b999.js","mappings":";;;AAAA,MAAM,aAAa,GAAG,+6BAA+6B,CAAC;AACt8B,yBAAe,aAAa;;MCoBf,UAAU;IALvB;;;;;;;QA6BW,aAAQ,GAAY,KAAK,CAAC;;;;QAY1B,eAAU,GAAY,KAAK,CAAC;KAuFtC;IArDS,oBAAoB,CAAC,KAAY;;QAEvC,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,OAAO;SACR;QAED,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC;YACzB,EAAE,EAAE,IAAI,CAAC,EAAE,CAAC,EAAE;YACd,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,UAAU,EAAE,IAAI,CAAC,UAAU;SAC5B,CAAC,CAAC;KACJ;IAGD,WAAW,CAAC,KAAiB;QAC3B,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC;KAClC;IAGD,aAAa,CAAC,KAAoB;QAChC,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE;YAC9C,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAsC,CAAC;YACtE,IACE,aAAa;gBACb,aAAa,CAAC,OAAO,KAAK,aAAa;gBACvC,CAAC,aAAa,CAAC,YAAY,CAAC,aAAa,CAAC,EAC1C;gBACA,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC;aACjB;SACF;KACF;;;;IAMD,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,IAAI,EAAC,UAAU,EAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,GAAG,IACvD,IAAI,CAAC,IAAI,IAAI,gEAAS,IAAI,EAAE,IAAI,CAAC,IAAI,GAAY,EAElD,8DAAa,EAEZ,IAAI,CAAC,KAAK,IAAI,2EAAiB,MAAM,IAAE,IAAI,CAAC,KAAK,CAAQ,EACzD,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,8DAAM,IAAI,CAAC,QAAQ,CAAO,EAC/D,IAAI,CAAC,UAAU,IAAI,gEAAS,IAAI,EAAC,eAAe,GAAW,CACvD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-menuitem/nv-menuitem.scss?tag=nv-menuitem","src/components/nv-menuitem/nv-menuitem.tsx"],"sourcesContent":["@mixin root-styles() {\n  display: flex;\n  align-items: center;\n  max-width: 300px;\n  width: 100vw;\n  font-size: var(--menu-contextual-item-font-size);\n  font-weight: var(--menu-contextual-item-font-weight);\n  color: var(--components-menu-contextual-item-content);\n  border-radius: var(--menu-contextual-item-radius);\n  gap: var(--menu-contextual-item-gap-x);\n  padding: var(--menu-contextual-item-padding-y) var(--menu-contextual-item-padding-x);\n  transition: background-color 150ms ease-out;\n  cursor: pointer;\n  &:hover, &:focus, &:focus-within {\n    @include focused-styles();\n  }\n  * {\n    pointer-events: none;\n  }\n}\n\n@mixin focused-styles() {\n  background-color: var(--components-menu-contextual-item-background-hover);\n  color: var(--components-menu-contextual-item-content-hover);\n}\n\n@mixin disabled-styles() {\n  cursor: unset;\n  background-color: unset;\n  color: var(--components-menu-contextual-item-content-disabled);\n}\n\n@mixin text-styles() {\n  margin-right: auto;\n}\n\n@mixin shortcut-styles() {\n  color: var(--components-menu-contextual-item-shortcut);\n}\n\nnv-menuitem {\n  @include root-styles();\n\n  kbd {\n    @include shortcut-styles();\n  }\n\n  [data-scope=\"text\"] {\n    @include text-styles();\n  }\n\n  &[disabled]:not([disabled=\"false\"]) {\n    @include disabled-styles();\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  Listen,\n} from '@stencil/core';\n\nimport { IconName } from '../nv-icon/nv-icons';\n\n/**\n * @slot default - Use this slot to render custom content for the menu item.\n */\n@Component({\n  tag: 'nv-menuitem',\n  styleUrl: 'nv-menuitem.scss',\n  shadow: false,\n})\nexport class NvMenuitem {\n  @Element() el: HTMLNvMenuitemElement;\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Text content for the menu item. If a more custom approach is needed, use\n   * the default slot instead.\n   */\n  @Prop({ reflect: true })\n  readonly label: string;\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 icon: `${IconName}`;\n\n  /**\n   * Disables the item, preventing user interaction.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Show a shortcut key for the action represented in the menu item.\n   */\n  @Prop({ reflect: true })\n  readonly shortcut: string;\n\n  /**\n   * If the menu item has a submenu, the a caret icon will be displayed.\n   */\n  @Prop({ reflect: true })\n  readonly hasSubmenu: boolean = false;\n\n  /**\n   * Represents the identifier or name associated with the menu item. This value\n   * will be emitted as part of the event data when the menu item is selected,\n   * enabling event handlers to identify the chosen item.\n   */\n  @Prop({ reflect: true })\n  readonly name: string;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Fires when the menu item is selected (click or keypress). Will include the\n   * id and name of the menu item.\n   */\n  @Event()\n  menuitemSelected: EventEmitter<{\n    /**\n     * The id of the menu item that was selected.\n     */\n    id?: HTMLElement['id'];\n    /**\n     * The name of the menu item that was selected.\n     */\n    name?: string;\n    /**\n     * Indicates if the menu item has a nested submenu.\n     */\n    hasSubmenu?: boolean;\n  }>;\n\n  private handleMenuItemSelect(event: Event) {\n    // If the element is disabled, stop propagation\n    if (this.disabled) {\n      event.stopPropagation();\n      return;\n    }\n\n    this.menuitemSelected.emit({\n      id: this.el.id,\n      name: this.name,\n      hasSubmenu: this.hasSubmenu,\n    });\n  }\n\n  @Listen('click', { capture: true })\n  handleClick(event: MouseEvent) {\n    this.handleMenuItemSelect(event);\n  }\n\n  @Listen('keydown', { passive: false })\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter' || event.key === ' ') {\n      const activeElement = document.activeElement as HTMLNvMenuitemElement;\n      if (\n        activeElement &&\n        activeElement.tagName === 'NV-MENUITEM' &&\n        !activeElement.hasAttribute('has-submenu')\n      ) {\n        event.preventDefault();\n        this.el.click();\n      }\n    }\n  }\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host role=\"menuitem\" tabindex={this.disabled ? '-1' : '0'}>\n        {this.icon && <nv-icon name={this.icon}></nv-icon>}\n\n        <slot></slot>\n\n        {this.label && <span data-scope=\"text\">{this.label}</span>}\n        {this.shortcut && !this.hasSubmenu && <kbd>{this.shortcut}</kbd>}\n        {this.hasSubmenu && <nv-icon name=\"chevron-right\"></nv-icon>}\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}
+{"file":"p-2854cf01.js","mappings":";;;AAAA,MAAM,aAAa,GAAG,+6BAA+6B,CAAC;AACt8B,yBAAe,aAAa;;MCoBf,UAAU;IALvB;;;;;;;QA6BW,aAAQ,GAAY,KAAK,CAAC;;;;QAY1B,eAAU,GAAY,KAAK,CAAC;KAuFtC;IArDS,oBAAoB,CAAC,KAAY;;QAEvC,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,OAAO;SACR;QAED,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC;YACzB,EAAE,EAAE,IAAI,CAAC,EAAE,CAAC,EAAE;YACd,IAAI,EAAE,IAAI,CAAC,IAAI;YACf,UAAU,EAAE,IAAI,CAAC,UAAU;SAC5B,CAAC,CAAC;KACJ;IAGD,WAAW,CAAC,KAAiB;QAC3B,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC;KAClC;IAGD,aAAa,CAAC,KAAoB;QAChC,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE;YAC9C,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAsC,CAAC;YACtE,IACE,aAAa;gBACb,aAAa,CAAC,OAAO,KAAK,aAAa;gBACvC,CAAC,aAAa,CAAC,YAAY,CAAC,aAAa,CAAC,EAC1C;gBACA,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC;aACjB;SACF;KACF;;;;IAMD,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,IAAI,EAAC,UAAU,EAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,IAAI,GAAG,GAAG,IACvD,IAAI,CAAC,IAAI,IAAI,gEAAS,IAAI,EAAE,IAAI,CAAC,IAAI,GAAY,EAElD,8DAAa,EAEZ,IAAI,CAAC,KAAK,IAAI,2EAAiB,MAAM,IAAE,IAAI,CAAC,KAAK,CAAQ,EACzD,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,8DAAM,IAAI,CAAC,QAAQ,CAAO,EAC/D,IAAI,CAAC,UAAU,IAAI,gEAAS,IAAI,EAAC,eAAe,GAAW,CACvD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-menuitem/nv-menuitem.scss?tag=nv-menuitem","src/components/nv-menuitem/nv-menuitem.tsx"],"sourcesContent":["@mixin root-styles() {\n  display: flex;\n  align-items: center;\n  max-width: 300px;\n  width: 100vw;\n  font-size: var(--menu-contextual-item-font-size);\n  font-weight: var(--menu-contextual-item-font-weight);\n  color: var(--components-menu-contextual-item-content);\n  border-radius: var(--menu-contextual-item-radius);\n  gap: var(--menu-contextual-item-gap-x);\n  padding: var(--menu-contextual-item-padding-y) var(--menu-contextual-item-padding-x);\n  transition: background-color 150ms ease-out;\n  cursor: pointer;\n  &:hover, &:focus, &:focus-within {\n    @include focused-styles();\n  }\n  * {\n    pointer-events: none;\n  }\n}\n\n@mixin focused-styles() {\n  background-color: var(--components-menu-contextual-item-background-hover);\n  color: var(--components-menu-contextual-item-content-hover);\n}\n\n@mixin disabled-styles() {\n  cursor: unset;\n  background-color: unset;\n  color: var(--components-menu-contextual-item-content-disabled);\n}\n\n@mixin text-styles() {\n  margin-right: auto;\n}\n\n@mixin shortcut-styles() {\n  color: var(--components-menu-contextual-item-shortcut);\n}\n\nnv-menuitem {\n  @include root-styles();\n\n  kbd {\n    @include shortcut-styles();\n  }\n\n  [data-scope=\"text\"] {\n    @include text-styles();\n  }\n\n  &[disabled]:not([disabled=\"false\"]) {\n    @include disabled-styles();\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  Listen,\n} from '@stencil/core';\n\nimport { IconName } from '../nv-icon/nv-icons';\n\n/**\n * @slot default - Use this slot to render custom content for the menu item.\n */\n@Component({\n  tag: 'nv-menuitem',\n  styleUrl: 'nv-menuitem.scss',\n  shadow: false,\n})\nexport class NvMenuitem {\n  @Element() el: HTMLNvMenuitemElement;\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Text content for the menu item. If a more custom approach is needed, use\n   * the default slot instead.\n   */\n  @Prop({ reflect: true })\n  readonly label: string;\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 icon: `${IconName}`;\n\n  /**\n   * Disables the item, preventing user interaction.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Show a shortcut key for the action represented in the menu item.\n   */\n  @Prop({ reflect: true })\n  readonly shortcut: string;\n\n  /**\n   * If the menu item has a submenu, the a caret icon will be displayed.\n   */\n  @Prop({ reflect: true })\n  readonly hasSubmenu: boolean = false;\n\n  /**\n   * Represents the identifier or name associated with the menu item. This value\n   * will be emitted as part of the event data when the menu item is selected,\n   * enabling event handlers to identify the chosen item.\n   */\n  @Prop({ reflect: true })\n  readonly name: string;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Fires when the menu item is selected (click or keypress). Will include the\n   * id and name of the menu item.\n   */\n  @Event()\n  menuitemSelected: EventEmitter<{\n    /**\n     * The id of the menu item that was selected.\n     */\n    id?: HTMLElement['id'];\n    /**\n     * The name of the menu item that was selected.\n     */\n    name?: string;\n    /**\n     * Indicates if the menu item has a nested submenu.\n     */\n    hasSubmenu?: boolean;\n  }>;\n\n  private handleMenuItemSelect(event: Event) {\n    // If the element is disabled, stop propagation\n    if (this.disabled) {\n      event.stopPropagation();\n      return;\n    }\n\n    this.menuitemSelected.emit({\n      id: this.el.id,\n      name: this.name,\n      hasSubmenu: this.hasSubmenu,\n    });\n  }\n\n  @Listen('click', { capture: true })\n  handleClick(event: MouseEvent) {\n    this.handleMenuItemSelect(event);\n  }\n\n  @Listen('keydown', { passive: false })\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter' || event.key === ' ') {\n      const activeElement = document.activeElement as HTMLNvMenuitemElement;\n      if (\n        activeElement &&\n        activeElement.tagName === 'NV-MENUITEM' &&\n        !activeElement.hasAttribute('has-submenu')\n      ) {\n        event.preventDefault();\n        this.el.click();\n      }\n    }\n  }\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host role=\"menuitem\" tabindex={this.disabled ? '-1' : '0'}>\n        {this.icon && <nv-icon name={this.icon}></nv-icon>}\n\n        <slot></slot>\n\n        {this.label && <span data-scope=\"text\">{this.label}</span>}\n        {this.shortcut && !this.hasSubmenu && <kbd>{this.shortcut}</kbd>}\n        {this.hasSubmenu && <nv-icon name=\"chevron-right\"></nv-icon>}\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}

package/dist/components/{p-cf06032d.js → p-2de17259.js}

@@ -1,8 +1,8 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-aff3ed68.js';
-import { B as ButtonType, a as ButtonSize } from './p-a3ddec4c.js';
+import { b as ButtonType, B as ButtonSize } from './p-2277cfc8.js';
 import { d as defineCustomElement$1 } from './p-fda58a76.js';
 
-const nvButtonCss = "nv-button{text-decoration:none;display:inline-flex;justify-content:center;align-items:center;font-style:normal;font-weight:var(--font-weight-medium-emphasis);font-family:\"TT Norms Pro\", sans-serif;transition:background-color 150ms ease-out;user-select:none;cursor:pointer;height:fit-content;width:fit-content}nv-button[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)}nv-button[size=xs] nv-icon>svg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-button[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)}nv-button[size=sm] nv-icon>svg{width:var(--spacing-4);height:var(--spacing-4);stroke-width:1.5px}nv-button[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)}nv-button[size=md] nv-icon>svg{width:var(--spacing-5);height:var(--spacing-5);stroke-width:1.6px}nv-button[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)}nv-button[size=lg] nv-icon>svg{width:var(--spacing-6);height:var(--spacing-6);stroke-width:1.8px}nv-button[emphasis=high]{background:var(--components-button-high-background);border:1px solid var(--components-button-high-border);color:var(--components-button-high-text)}nv-button[emphasis=high]:hover{background:var(--components-button-high-background-hover);border:1px solid var(--components-button-high-border);color:var(--components-button-high-text-hover)}nv-button[emphasis=high]:active{background:var(--components-button-high-background-active);border:1px solid var(--components-button-high-border-active);color:var(--components-button-high-text-active)}nv-button[emphasis=high]:focus,nv-button[emphasis=high]:focus-within{outline:none}nv-button[emphasis=high]:focus-visible,nv-button[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);z-index:111}nv-button[emphasis=high]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=high][active]:not([active=false]){background:var(--components-button-high-background-active);border:1px solid var(--components-button-high-border-active);color:var(--components-button-high-text-active)}nv-button[emphasis=high][danger]:not([danger=false]){background:var(--components-button-destructive-high-background);border:1px solid transparent;color:var(--components-button-destructive-high-text)}nv-button[emphasis=high][danger]:not([danger=false]):hover{background:var(--components-button-destructive-high-background-hover);border:1px solid transparent;color:var(--components-button-destructive-high-text-hover)}nv-button[emphasis=high][danger]:not([danger=false]):focus,nv-button[emphasis=high][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=high][danger]:not([danger=false]):focus-visible,nv-button[emphasis=high][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[emphasis=medium]{background:var(--components-button-medium-background);border:1px solid var(--components-button-medium-border);color:var(--components-button-medium-text)}nv-button[emphasis=medium]:hover{background:var(--components-button-medium-background-hover);border:1px solid var(--components-button-medium-border);color:var(--components-button-medium-text-hover)}nv-button[emphasis=medium]:active{background:var(--components-button-medium-background-active);border:1px solid var(--components-button-medium-border-active);color:var(--components-button-medium-text-active)}nv-button[emphasis=medium]:focus,nv-button[emphasis=medium]:focus-within{outline:none}nv-button[emphasis=medium]:focus-visible,nv-button[emphasis=medium]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[emphasis=medium]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=medium][active]:not([active=false]){background:var(--components-button-medium-background-active);border:1px solid var(--components-button-medium-border-active);color:var(--components-button-medium-text-active)}nv-button[emphasis=medium][danger]:not([danger=false]){background:var(--components-button-destructive-medium-background);border:1px solid var(--components-button-destructive-medium-border);color:var(--components-button-destructive-medium-text)}nv-button[emphasis=medium][danger]:not([danger=false]):hover{background:var(--components-button-destructive-medium-background-hover);border:1px solid var(--components-button-destructive-medium-border);color:var(--components-button-destructive-medium-text-hover)}nv-button[emphasis=medium][danger]:not([danger=false]):focus,nv-button[emphasis=medium][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=medium][danger]:not([danger=false]):focus-visible,nv-button[emphasis=medium][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[emphasis=low]{background:var(--components-button-low-background);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text)}nv-button[emphasis=low]:hover{background:var(--components-button-low-background-hover);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text-hover)}nv-button[emphasis=low]: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-button[emphasis=low]:focus,nv-button[emphasis=low]:focus-within{outline:none}nv-button[emphasis=low]:focus-visible,nv-button[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);z-index:111}nv-button[emphasis=low]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=low][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-button[emphasis=low][danger]:not([danger=false]){background:var(--components-button-destructive-low-background);border:1px solid var(--components-button-destructive-low-border);color:var(--components-button-destructive-low-text)}nv-button[emphasis=low][danger]:not([danger=false]):hover{background:var(--components-button-destructive-low-background-hover);border:1px solid var(--components-button-destructive-low-border);color:var(--components-button-destructive-low-text-hover)}nv-button[emphasis=low][danger]:not([danger=false]):focus,nv-button[emphasis=low][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=low][danger]:not([danger=false]):focus-visible,nv-button[emphasis=low][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[emphasis=lower]{background:var(--components-button-lower-background);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text)}nv-button[emphasis=lower]:hover{background:var(--components-button-lower-background-hover);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text-hover)}nv-button[emphasis=lower]: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-button[emphasis=lower]:focus,nv-button[emphasis=lower]:focus-within{outline:none}nv-button[emphasis=lower]:focus-visible,nv-button[emphasis=lower]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[emphasis=lower]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=lower][active]:not([active=false]){background:var(--components-button-lower-background-active);border:1px solid var(--components-button-lower-border-active);color:var(--components-button-lower-text-active)}nv-button[emphasis=lower][danger]:not([danger=false]){background:var(--components-button-destructive-lower-background);border:1px solid var(--components-button-destructive-lower-border);color:var(--components-button-destructive-lower-text)}nv-button[emphasis=lower][danger]:not([danger=false]):hover{background:var(--components-button-destructive-lower-background-hover);border:1px solid var(--components-button-destructive-lower-border);color:var(--components-button-destructive-lower-text-hover)}nv-button[emphasis=lower][danger]:not([danger=false]):focus,nv-button[emphasis=lower][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=lower][danger]:not([danger=false]):focus-visible,nv-button[emphasis=lower][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[fluid]:not([fluid=false]){width:100%}nv-button[loading]:not([loading=false]) [slot=leading-icon]{display:none}";
+const nvButtonCss = "nv-button{text-decoration:none;display:inline-flex;justify-content:center;align-items:center;font-style:normal;font-weight:var(--font-weight-medium-emphasis);font-family:\"TT Norms Pro\", sans-serif;transition:background-color 150ms ease-out;user-select:none;cursor:pointer;height:fit-content;width:fit-content}nv-button[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)}nv-button[size=xs] nv-icon>svg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-button[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)}nv-button[size=sm] nv-icon>svg{width:var(--spacing-4);height:var(--spacing-4);stroke-width:1.5px}nv-button[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)}nv-button[size=md] nv-icon>svg{width:var(--spacing-5);height:var(--spacing-5);stroke-width:1.6px}nv-button[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)}nv-button[size=lg] nv-icon>svg{width:var(--spacing-6);height:var(--spacing-6);stroke-width:1.8px}nv-button[emphasis=high]{background:var(--components-button-high-background);border:1px solid var(--components-button-high-border);color:var(--components-button-high-text)}nv-button[emphasis=high]:hover{background:var(--components-button-high-background-hover);border:1px solid var(--components-button-high-border);color:var(--components-button-high-text-hover)}nv-button[emphasis=high]:active{background:var(--components-button-high-background-active);border:1px solid var(--components-button-high-border-active);color:var(--components-button-high-text-active)}nv-button[emphasis=high]:focus,nv-button[emphasis=high]:focus-within{outline:none}nv-button[emphasis=high]:focus-visible,nv-button[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-button[emphasis=high]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=high][active]:not([active=false]){background:var(--components-button-high-background-active);border:1px solid var(--components-button-high-border-active);color:var(--components-button-high-text-active)}nv-button[emphasis=high][danger]:not([danger=false]){background:var(--components-button-destructive-high-background);border:1px solid transparent;color:var(--components-button-destructive-high-text)}nv-button[emphasis=high][danger]:not([danger=false]):hover{background:var(--components-button-destructive-high-background-hover);border:1px solid transparent;color:var(--components-button-destructive-high-text-hover)}nv-button[emphasis=high][danger]:not([danger=false]):focus,nv-button[emphasis=high][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=high][danger]:not([danger=false]):focus-visible,nv-button[emphasis=high][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=medium]{background:var(--components-button-medium-background);border:1px solid var(--components-button-medium-border);color:var(--components-button-medium-text)}nv-button[emphasis=medium]:hover{background:var(--components-button-medium-background-hover);border:1px solid var(--components-button-medium-border);color:var(--components-button-medium-text-hover)}nv-button[emphasis=medium]:active{background:var(--components-button-medium-background-active);border:1px solid var(--components-button-medium-border-active);color:var(--components-button-medium-text-active)}nv-button[emphasis=medium]:focus,nv-button[emphasis=medium]:focus-within{outline:none}nv-button[emphasis=medium]:focus-visible,nv-button[emphasis=medium]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=medium]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=medium][active]:not([active=false]){background:var(--components-button-medium-background-active);border:1px solid var(--components-button-medium-border-active);color:var(--components-button-medium-text-active)}nv-button[emphasis=medium][danger]:not([danger=false]){background:var(--components-button-destructive-medium-background);border:1px solid var(--components-button-destructive-medium-border);color:var(--components-button-destructive-medium-text)}nv-button[emphasis=medium][danger]:not([danger=false]):hover{background:var(--components-button-destructive-medium-background-hover);border:1px solid var(--components-button-destructive-medium-border);color:var(--components-button-destructive-medium-text-hover)}nv-button[emphasis=medium][danger]:not([danger=false]):focus,nv-button[emphasis=medium][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=medium][danger]:not([danger=false]):focus-visible,nv-button[emphasis=medium][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=low]{background:var(--components-button-low-background);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text)}nv-button[emphasis=low]:hover{background:var(--components-button-low-background-hover);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text-hover)}nv-button[emphasis=low]: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-button[emphasis=low]:focus,nv-button[emphasis=low]:focus-within{outline:none}nv-button[emphasis=low]:focus-visible,nv-button[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-button[emphasis=low]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=low][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-button[emphasis=low][danger]:not([danger=false]){background:var(--components-button-destructive-low-background);border:1px solid var(--components-button-destructive-low-border);color:var(--components-button-destructive-low-text)}nv-button[emphasis=low][danger]:not([danger=false]):hover{background:var(--components-button-destructive-low-background-hover);border:1px solid var(--components-button-destructive-low-border);color:var(--components-button-destructive-low-text-hover)}nv-button[emphasis=low][danger]:not([danger=false]):focus,nv-button[emphasis=low][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=low][danger]:not([danger=false]):focus-visible,nv-button[emphasis=low][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=lower]{background:var(--components-button-lower-background);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text)}nv-button[emphasis=lower]:hover{background:var(--components-button-lower-background-hover);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text-hover)}nv-button[emphasis=lower]: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-button[emphasis=lower]:focus,nv-button[emphasis=lower]:focus-within{outline:none}nv-button[emphasis=lower]:focus-visible,nv-button[emphasis=lower]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=lower]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=lower][active]:not([active=false]){background:var(--components-button-lower-background-active);border:1px solid var(--components-button-lower-border-active);color:var(--components-button-lower-text-active)}nv-button[emphasis=lower][danger]:not([danger=false]){background:var(--components-button-destructive-lower-background);border:1px solid var(--components-button-destructive-lower-border);color:var(--components-button-destructive-lower-text)}nv-button[emphasis=lower][danger]:not([danger=false]):hover{background:var(--components-button-destructive-lower-background-hover);border:1px solid var(--components-button-destructive-lower-border);color:var(--components-button-destructive-lower-text-hover)}nv-button[emphasis=lower][danger]:not([danger=false]):focus,nv-button[emphasis=lower][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=lower][danger]:not([danger=false]):focus-visible,nv-button[emphasis=lower][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[fluid]:not([fluid=false]){width:100%}nv-button[loading]:not([loading=false]) [slot=leading-icon]{display:none}";
 const NvButtonStyle0 = nvButtonCss;
 
 const NvButton = /*@__PURE__*/ proxyCustomElement(class NvButton extends H {
@@ -188,4 +188,4 @@ defineCustomElement();
 
 export { NvButton as N, defineCustomElement as d };
 
-//# sourceMappingURL=p-cf06032d.js.map
+//# sourceMappingURL=p-2de17259.js.map

package/dist/components/{p-cf06032d.js.map → p-2de17259.js.map}

@@ -1 +1 @@
-{"file":"p-cf06032d.js","mappings":";;;;AAAA,MAAM,WAAW,GAAG,y7TAAy7T,CAAC;AAC98T,uBAAe,WAAW;;MCuBb,QAAQ;IANrB;;;;;;;;;;;QAmBW,SAAI,GAAoB,IAAI,CAAC;;;;;;QAQ7B,aAAQ,GAAwB,MAAM,CAAC;;;;;QAOvC,WAAM,GAAY,KAAK,CAAC;;;;;QAOxB,WAAM,GAAY,KAAK,CAAC;;;;;;QAQjC,YAAO,GAAY,KAAK,CAAC;;;;QAMzB,aAAQ,GAAY,KAAK,CAAC;;;;QAMjB,UAAK,GAAY,KAAK,CAAC;;;;;;QAQvB,SAAI,GAAoB,QAAQ,CAAC;;;;;;;;;;QAmBlC,sBAAiB,GAAG,CAAC,KAAY;;YACvC,IAAI,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACjC,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,OAAO;aACR;YAED,IACE,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,MAAM;iBAC9B,IAAI,CAAC,IAAI,KAAI,MAAA,IAAI,CAAC,SAAS,0CAAE,IAAI,CAAA,CAAC,EACnC;gBACA,IAAI,CAAC,iBAAiB,EAAE,CAAC;aAC1B;iBAAM,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,MAAM,EAAE;gBACvD,OAAO,CAAC,IAAI,CACV,8FAA8F,EAC9F,SAAS,EACT,IAAI,CAAC,EAAE,CACR,CAAC;aACH;SACF,CAAC;;;;;;QAOM,sBAAiB,GAAG;;YAC1B,MAAM,WAAW,GAAG,IAAI,CAAC,IAAI;kBACxB,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAqB;kBACvD,MAAA,IAAI,CAAC,SAAS,0CAAE,IAAI,CAAC;YAEzB,IAAI,CAAC,WAAW,EAAE;gBAChB,OAAO,CAAC,IAAI,CACV,wBAAwB,EACxB,YAAY,IAAI,CAAC,IAAI,IAAI,cAAc,EAAE,EACzC,iBAAiB,EACjB,MAAA,IAAI,CAAC,SAAS,0CAAE,IAAI,CACrB,CAAC;gBACF,OAAO;aACR;YAED,QAAQ,IAAI,CAAC,IAAI;gBACf,KAAK,UAAU,CAAC,MAAM;oBACpB,WAAW,CAAC,aAAa,EAAE,CAAC;oBAC5B,MAAM;gBACR,KAAK,UAAU,CAAC,KAAK;oBACnB,WAAW,CAAC,KAAK,EAAE,CAAC;oBACpB,MAAM;aACT;SACF,CAAC;KAuEH;;;;IAhEC,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;;;;IAOD,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;;;;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,qDAAC,IAAI,EAAC,QAAQ,EAAC,QAAQ,EAAC,GAAG,EAAC,OAAO,EAAE,IAAI,CAAC,iBAAiB,IAC7D,IAAI,CAAC,OAAO,KACX,kEACE,IAAI,EAAE,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,KAAK,GAAG,IAAI,GAAG,IAAI,GACvC,CACd,EAED,6DAAM,IAAI,EAAC,cAAc,GAAQ,EACjC,8DAAa,EACb,6DAAM,IAAI,EAAC,eAAe,GAAQ,CAC7B,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-button/styles/nv-button.scss?tag=nv-button","src/components/nv-button/nv-button.tsx"],"sourcesContent":["@use \"./mixins\" as *;\n\n// Make sure to update nv-button class in the tailwind-components.scss file when\n// you add new styles or change the structure here.\nnv-button {\n  @include root-styles();\n\n  @each $size in $sizes {\n    &[size=\"#{$size}\"] {\n      @include size-styles($size);\n    }\n  }\n\n  @each $emphasis in $emphases {\n    &[emphasis=\"#{$emphasis}\"] {\n      @include emphasis-styles($emphasis);\n\n      &[active]:not([active=\"false\"]) {\n        @include active-styles($emphasis);\n      }\n\n      &[danger]:not([danger=\"false\"]) {\n        @include danger-styles($emphasis);\n      }\n    }\n  }\n\n  &[fluid]:not([fluid=\"false\"]) {\n    @include fluid-styles();\n  }\n\n  &[loading]:not([loading=\"false\"]) {\n    [slot=\"leading-icon\"] {\n      display: none;\n    }\n  }\n}\n","import {\n  Component,\n  Listen,\n  Host,\n  h,\n  Prop,\n  AttachInternals,\n  Element,\n  Watch,\n} from '@stencil/core';\n\nimport { ButtonSize, ButtonEmphasis, ButtonType } from '../../utils/constants';\n\n/**\n * @slot default - Content of the button.\n * @slot leading-icon - Icon before the label.\n * @slot trailing-icon - Icon after the label.\n */\n@Component({\n  tag: 'nv-button',\n  shadow: false,\n  formAssociated: true,\n  styleUrl: 'styles/nv-button.scss',\n})\nexport class NvButton {\n  @AttachInternals() internals: ElementInternals;\n  @Element() el: HTMLNvButtonElement;\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   * Use this prop to highlight the button when it represents the current page\n   * or active selection. This helps users understand their navigation context.\n   */\n  @Prop({ reflect: true })\n  readonly active: boolean = false;\n\n  /**\n   * Applies styling that visually indicates the button represents a dangerous\n   * action.\n   */\n  @Prop({ reflect: true })\n  readonly danger: boolean = false;\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.\n   */\n  @Prop({ reflect: true, mutable: true })\n  loading: boolean = false;\n\n  /**\n   * Disables the button, preventing user interaction.\n   */\n  @Prop({ reflect: true, mutable: true })\n  disabled: boolean = false;\n\n  /**\n   * Allows the button to stretch and fill the entire width of its container.\n   */\n  @Prop({ reflect: true })\n  readonly fluid: boolean = false;\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 form associated with the button in case the (submit) button is not a child of a form.\n   * Matches the native HTML button 'form' attribute behavior.\n   */\n  @Prop({ reflect: true })\n  readonly form: string;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Handles button click events, managing form actions and disabled states.\n   * Prevents default behavior when button is disabled or loading, and\n   * processes form submissions/resets when appropriate.\n   * @param {Event} event - The click event.\n   */\n  private handleButtonClick = (event: Event): void => {\n    if (this.loading || this.disabled) {\n      event.preventDefault();\n      return;\n    }\n\n    if (\n      this.type !== ButtonType.Button &&\n      (this.form || this.internals?.form)\n    ) {\n      this.processFormAction();\n    } else if (this.form && this.type === ButtonType.Button) {\n      console.warn(\n        'Button has a form id but is not of type submit or reset so no form action will be processed.',\n        `Button:`,\n        this.el,\n      );\n    }\n  };\n\n  /**\n   * Processes form-related actions by finding the associated form element\n   * and triggering the appropriate action (submit/reset) based on button type.\n   * Falls back to ElementInternals form if no explicit form ID is provided.\n   */\n  private processFormAction = (): void => {\n    const formElement = this.form\n      ? (document.getElementById(this.form) as HTMLFormElement)\n      : this.internals?.form;\n\n    if (!formElement) {\n      console.warn(\n        'No form element found.',\n        `Form ID: ${this.form || 'Not provided'}`,\n        `Internals form:`,\n        this.internals?.form,\n      );\n      return;\n    }\n\n    switch (this.type) {\n      case ButtonType.Submit:\n        formElement.requestSubmit();\n        break;\n      case ButtonType.Reset:\n        formElement.reset();\n        break;\n    }\n  };\n\n  //#endregion METHODS\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 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 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 role=\"button\" tabindex=\"0\" onClick={this.handleButtonClick}>\n        {this.loading && (\n          <nv-loader\n            size={this.size === ButtonSize.Large ? 'sm' : 'xs'}\n          ></nv-loader>\n        )}\n\n        <slot name=\"leading-icon\"></slot>\n        <slot></slot>\n        <slot name=\"trailing-icon\"></slot>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}
+{"file":"p-2de17259.js","mappings":"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","names":[],"sources":["src/components/nv-button/styles/nv-button.scss?tag=nv-button","src/components/nv-button/nv-button.tsx"],"sourcesContent":["@use \"./mixins\" as *;\n\n// Make sure to update nv-button class in the tailwind-components.scss file when\n// you add new styles or change the structure here.\nnv-button {\n  @include root-styles();\n\n  @each $size in $sizes {\n    &[size=\"#{$size}\"] {\n      @include size-styles($size);\n    }\n  }\n\n  @each $emphasis in $emphases {\n    &[emphasis=\"#{$emphasis}\"] {\n      @include emphasis-styles($emphasis);\n\n      &[active]:not([active=\"false\"]) {\n        @include active-styles($emphasis);\n      }\n\n      &[danger]:not([danger=\"false\"]) {\n        @include danger-styles($emphasis);\n      }\n    }\n  }\n\n  &[fluid]:not([fluid=\"false\"]) {\n    @include fluid-styles();\n  }\n\n  &[loading]:not([loading=\"false\"]) {\n    [slot=\"leading-icon\"] {\n      display: none;\n    }\n  }\n}\n","import {\n  Component,\n  Listen,\n  Host,\n  h,\n  Prop,\n  AttachInternals,\n  Element,\n  Watch,\n} from '@stencil/core';\n\nimport { ButtonSize, ButtonEmphasis, ButtonType } from '../../utils/constants';\n\n/**\n * @slot default - Content of the button.\n * @slot leading-icon - Icon before the label.\n * @slot trailing-icon - Icon after the label.\n */\n@Component({\n  tag: 'nv-button',\n  shadow: false,\n  formAssociated: true,\n  styleUrl: 'styles/nv-button.scss',\n})\nexport class NvButton {\n  @AttachInternals() internals: ElementInternals;\n  @Element() el: HTMLNvButtonElement;\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   * Use this prop to highlight the button when it represents the current page\n   * or active selection. This helps users understand their navigation context.\n   */\n  @Prop({ reflect: true })\n  readonly active: boolean = false;\n\n  /**\n   * Applies styling that visually indicates the button represents a dangerous\n   * action.\n   */\n  @Prop({ reflect: true })\n  readonly danger: boolean = false;\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.\n   */\n  @Prop({ reflect: true, mutable: true })\n  loading: boolean = false;\n\n  /**\n   * Disables the button, preventing user interaction.\n   */\n  @Prop({ reflect: true, mutable: true })\n  disabled: boolean = false;\n\n  /**\n   * Allows the button to stretch and fill the entire width of its container.\n   */\n  @Prop({ reflect: true })\n  readonly fluid: boolean = false;\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 form associated with the button in case the (submit) button is not a child of a form.\n   * Matches the native HTML button 'form' attribute behavior.\n   */\n  @Prop({ reflect: true })\n  readonly form: string;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Handles button click events, managing form actions and disabled states.\n   * Prevents default behavior when button is disabled or loading, and\n   * processes form submissions/resets when appropriate.\n   * @param {Event} event - The click event.\n   */\n  private handleButtonClick = (event: Event): void => {\n    if (this.loading || this.disabled) {\n      event.preventDefault();\n      return;\n    }\n\n    if (\n      this.type !== ButtonType.Button &&\n      (this.form || this.internals?.form)\n    ) {\n      this.processFormAction();\n    } else if (this.form && this.type === ButtonType.Button) {\n      console.warn(\n        'Button has a form id but is not of type submit or reset so no form action will be processed.',\n        `Button:`,\n        this.el,\n      );\n    }\n  };\n\n  /**\n   * Processes form-related actions by finding the associated form element\n   * and triggering the appropriate action (submit/reset) based on button type.\n   * Falls back to ElementInternals form if no explicit form ID is provided.\n   */\n  private processFormAction = (): void => {\n    const formElement = this.form\n      ? (document.getElementById(this.form) as HTMLFormElement)\n      : this.internals?.form;\n\n    if (!formElement) {\n      console.warn(\n        'No form element found.',\n        `Form ID: ${this.form || 'Not provided'}`,\n        `Internals form:`,\n        this.internals?.form,\n      );\n      return;\n    }\n\n    switch (this.type) {\n      case ButtonType.Submit:\n        formElement.requestSubmit();\n        break;\n      case ButtonType.Reset:\n        formElement.reset();\n        break;\n    }\n  };\n\n  //#endregion METHODS\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 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 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 role=\"button\" tabindex=\"0\" onClick={this.handleButtonClick}>\n        {this.loading && (\n          <nv-loader\n            size={this.size === ButtonSize.Large ? 'sm' : 'xs'}\n          ></nv-loader>\n        )}\n\n        <slot name=\"leading-icon\"></slot>\n        <slot></slot>\n        <slot name=\"trailing-icon\"></slot>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}

package/dist/components/p-31591941.js

@@ -0,0 +1,216 @@
+import { l as linear, a as animate } from './p-42ea6b74.js';
+
+const a = (a1, a2) => 1.0 - 3.0 * a2 + 3.0 * a1;
+const b = (a1, a2) => 3.0 * a2 - 6.0 * a1;
+const c = (a1) => 3.0 * a1;
+const calcBezier = (t, a1, a2) => ((a(a1, a2) * t + b(a1, a2)) * t + c(a1)) * t;
+const getSlope = (t, a1, a2) => 3.0 * a(a1, a2) * t * t + 2.0 * b(a1, a2) * t + c(a1);
+const subdivisionPrecision = 0.0000001;
+const subdivisionMaxIterations = 10;
+function binarySubdivide(aX, aA, aB, mX1, mX2) {
+    let currentX;
+    let currentT;
+    let i = 0;
+    do {
+        currentT = aA + (aB - aA) / 2.0;
+        currentX = calcBezier(currentT, mX1, mX2) - aX;
+        if (currentX > 0.0) {
+            aB = currentT;
+        }
+        else {
+            aA = currentT;
+        }
+    } while (Math.abs(currentX) > subdivisionPrecision &&
+        ++i < subdivisionMaxIterations);
+    return currentT;
+}
+const newtonIterations = 8;
+const newtonMinSlope = 0.001;
+function newtonRaphsonIterate(aX, aGuessT, mX1, mX2) {
+    for (let i = 0; i < newtonIterations; ++i) {
+        const currentSlope = getSlope(aGuessT, mX1, mX2);
+        if (currentSlope === 0.0) {
+            return aGuessT;
+        }
+        const currentX = calcBezier(aGuessT, mX1, mX2) - aX;
+        aGuessT -= currentX / currentSlope;
+    }
+    return aGuessT;
+}
+const kSplineTableSize = 11;
+const kSampleStepSize = 1.0 / (kSplineTableSize - 1.0);
+function cubicBezier(mX1, mY1, mX2, mY2) {
+    if (mX1 === mY1 && mX2 === mY2)
+        return linear;
+    const sampleValues = new Float32Array(kSplineTableSize);
+    for (let i = 0; i < kSplineTableSize; ++i) {
+        sampleValues[i] = calcBezier(i * kSampleStepSize, mX1, mX2);
+    }
+    function getTForX(aX) {
+        let intervalStart = 0.0;
+        let currentSample = 1;
+        const lastSample = kSplineTableSize - 1;
+        for (; currentSample !== lastSample && sampleValues[currentSample] <= aX; ++currentSample) {
+            intervalStart += kSampleStepSize;
+        }
+        --currentSample;
+        const dist = (aX - sampleValues[currentSample]) /
+            (sampleValues[currentSample + 1] - sampleValues[currentSample]);
+        const guessForT = intervalStart + dist * kSampleStepSize;
+        const initialSlope = getSlope(guessForT, mX1, mX2);
+        if (initialSlope >= newtonMinSlope) {
+            return newtonRaphsonIterate(aX, guessForT, mX1, mX2);
+        }
+        else if (initialSlope === 0.0) {
+            return guessForT;
+        }
+        else {
+            return binarySubdivide(aX, intervalStart, intervalStart + kSampleStepSize, mX1, mX2);
+        }
+    }
+    return (t) => t === 0 || t === 1 ? t : calcBezier(getTForX(t), mY1, mY2);
+}
+
+/**
+ * Read current box metrics (height + vertical margins).
+ * @param {HTMLElement} node - The element to measure.
+ * @returns {object} The box metrics.
+ */
+function getBoxMetrics(node) {
+    const rectHeight = node.getBoundingClientRect().height;
+    const style = getComputedStyle(node);
+    const marginTop = parseFloat(style.marginTop) || 0;
+    const marginBottom = parseFloat(style.marginBottom) || 0;
+    const total = rectHeight + marginTop + marginBottom;
+    return { height: rectHeight, marginTop, marginBottom, total };
+}
+const useCollapse = (node, { duration = 200, overflow = 'hidden' } = {}) => {
+    let currentAnimation = null;
+    const stop = () => {
+        if (currentAnimation) {
+            currentAnimation.stop();
+            currentAnimation = null;
+        }
+    };
+    const setStyle = (styles) => {
+        for (const [k, v] of Object.entries(styles)) {
+            node.style[k] = v;
+        }
+    };
+    /** Instantly apply collapsed styles (no animation). */
+    function setCollapsed() {
+        stop();
+        setStyle({
+            height: '0px',
+            marginTop: '0px',
+            marginBottom: '0px',
+            overflow,
+        });
+    }
+    /** Instantly apply expanded styles (no animation). */
+    function setExpanded() {
+        stop();
+        setStyle({
+            height: '',
+            marginTop: '',
+            marginBottom: '',
+            overflow: '',
+        });
+    }
+    /**
+     * Collapse: animate from current box (height + margins) down to 0.
+     */
+    function collapse() {
+        stop();
+        return new Promise(resolve => {
+            const { height, marginTop, marginBottom, total } = getBoxMetrics(node);
+            // Lock current box
+            setStyle({
+                height: `${height}px`,
+                marginTop: `${marginTop}px`,
+                marginBottom: `${marginBottom}px`,
+                overflow,
+                willChange: 'height, margin',
+            });
+            const denom = total > 0 ? total : 0.0001; // avoid divide-by-zero
+            currentAnimation = animate({
+                from: total,
+                to: 0,
+                duration,
+                ease: cubicBezier(0.2, 0, 0, 1),
+                onUpdate: v => {
+                    const ratio = v / denom;
+                    setStyle({
+                        height: `${height * ratio}px`,
+                        marginTop: `${marginTop * ratio}px`,
+                        marginBottom: `${marginBottom * ratio}px`,
+                    });
+                },
+                onComplete: () => {
+                    setStyle({
+                        height: '0px',
+                        marginTop: '0px',
+                        marginBottom: '0px',
+                        willChange: '',
+                    });
+                    resolve();
+                },
+            });
+        });
+    }
+    /**
+     * Expand: animate from 0 box to the element's natural box (height + margins),
+     * then restore `height: auto` and computed margins.
+     */
+    function expand() {
+        stop();
+        return new Promise(resolve => {
+            // Let the element size naturally to measure the target box
+            setStyle({
+                height: '',
+                marginTop: '',
+                marginBottom: '',
+                overflow,
+            });
+            const { height, marginTop, marginBottom, total } = getBoxMetrics(node);
+            // Start locked at zero box
+            setStyle({
+                height: '0px',
+                marginTop: '0px',
+                marginBottom: '0px',
+                willChange: 'height, margin',
+            });
+            const denom = total > 0 ? total : 0.0001;
+            currentAnimation = animate({
+                from: 0,
+                to: total,
+                duration,
+                ease: cubicBezier(0.2, 0, 0, 1),
+                onUpdate: v => {
+                    const ratio = v / denom;
+                    setStyle({
+                        height: `${height * ratio}px`,
+                        marginTop: `${marginTop * ratio}px`,
+                        marginBottom: `${marginBottom * ratio}px`,
+                    });
+                },
+                onComplete: () => {
+                    // Restore natural layout
+                    setStyle({
+                        height: '',
+                        marginTop: '',
+                        marginBottom: '',
+                        overflow: '',
+                        willChange: '',
+                    });
+                    resolve();
+                },
+            });
+        });
+    }
+    return { collapse, expand, setCollapsed, setExpanded };
+};
+
+export { useCollapse as u };
+
+//# sourceMappingURL=p-31591941.js.map

package/dist/components/p-31591941.js.map

@@ -0,0 +1 @@
+{"file":"p-31591941.js","mappings":"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","names":[],"sources":["../../node_modules/popmotion/dist/es/easing/cubic-bezier.mjs","src/animations/collapse.animation.ts"],"sourcesContent":["import { linear } from './index.mjs';\n\nconst a = (a1, a2) => 1.0 - 3.0 * a2 + 3.0 * a1;\nconst b = (a1, a2) => 3.0 * a2 - 6.0 * a1;\nconst c = (a1) => 3.0 * a1;\nconst calcBezier = (t, a1, a2) => ((a(a1, a2) * t + b(a1, a2)) * t + c(a1)) * t;\nconst getSlope = (t, a1, a2) => 3.0 * a(a1, a2) * t * t + 2.0 * b(a1, a2) * t + c(a1);\nconst subdivisionPrecision = 0.0000001;\nconst subdivisionMaxIterations = 10;\nfunction binarySubdivide(aX, aA, aB, mX1, mX2) {\n    let currentX;\n    let currentT;\n    let i = 0;\n    do {\n        currentT = aA + (aB - aA) / 2.0;\n        currentX = calcBezier(currentT, mX1, mX2) - aX;\n        if (currentX > 0.0) {\n            aB = currentT;\n        }\n        else {\n            aA = currentT;\n        }\n    } while (Math.abs(currentX) > subdivisionPrecision &&\n        ++i < subdivisionMaxIterations);\n    return currentT;\n}\nconst newtonIterations = 8;\nconst newtonMinSlope = 0.001;\nfunction newtonRaphsonIterate(aX, aGuessT, mX1, mX2) {\n    for (let i = 0; i < newtonIterations; ++i) {\n        const currentSlope = getSlope(aGuessT, mX1, mX2);\n        if (currentSlope === 0.0) {\n            return aGuessT;\n        }\n        const currentX = calcBezier(aGuessT, mX1, mX2) - aX;\n        aGuessT -= currentX / currentSlope;\n    }\n    return aGuessT;\n}\nconst kSplineTableSize = 11;\nconst kSampleStepSize = 1.0 / (kSplineTableSize - 1.0);\nfunction cubicBezier(mX1, mY1, mX2, mY2) {\n    if (mX1 === mY1 && mX2 === mY2)\n        return linear;\n    const sampleValues = new Float32Array(kSplineTableSize);\n    for (let i = 0; i < kSplineTableSize; ++i) {\n        sampleValues[i] = calcBezier(i * kSampleStepSize, mX1, mX2);\n    }\n    function getTForX(aX) {\n        let intervalStart = 0.0;\n        let currentSample = 1;\n        const lastSample = kSplineTableSize - 1;\n        for (; currentSample !== lastSample && sampleValues[currentSample] <= aX; ++currentSample) {\n            intervalStart += kSampleStepSize;\n        }\n        --currentSample;\n        const dist = (aX - sampleValues[currentSample]) /\n            (sampleValues[currentSample + 1] - sampleValues[currentSample]);\n        const guessForT = intervalStart + dist * kSampleStepSize;\n        const initialSlope = getSlope(guessForT, mX1, mX2);\n        if (initialSlope >= newtonMinSlope) {\n            return newtonRaphsonIterate(aX, guessForT, mX1, mX2);\n        }\n        else if (initialSlope === 0.0) {\n            return guessForT;\n        }\n        else {\n            return binarySubdivide(aX, intervalStart, intervalStart + kSampleStepSize, mX1, mX2);\n        }\n    }\n    return (t) => t === 0 || t === 1 ? t : calcBezier(getTForX(t), mY1, mY2);\n}\n\nexport { cubicBezier };\n","import { animate, cubicBezier } from 'popmotion';\n\nexport type CollapseOptions = {\n  /**\n   * Duration of the expand/collapse animation in milliseconds.\n   * @default 200\n   */\n  duration?: number;\n\n  /**\n   * Set the overflow state while animating.\n   * @default \"hidden\"\n   */\n  overflow?: 'hidden' | 'visible';\n};\n\n/**\n * Read current box metrics (height + vertical margins).\n * @param {HTMLElement} node - The element to measure.\n * @returns {object} The box metrics.\n */\nfunction getBoxMetrics(node: HTMLElement) {\n  const rectHeight = node.getBoundingClientRect().height;\n  const style = getComputedStyle(node);\n  const marginTop = parseFloat(style.marginTop) || 0;\n  const marginBottom = parseFloat(style.marginBottom) || 0;\n  const total = rectHeight + marginTop + marginBottom;\n  return { height: rectHeight, marginTop, marginBottom, total };\n}\n\nconst useCollapse = (\n  node: HTMLElement,\n  { duration = 200, overflow = 'hidden' }: CollapseOptions = {},\n) => {\n  let currentAnimation: ReturnType<typeof animate> | null = null;\n\n  const stop = () => {\n    if (currentAnimation) {\n      currentAnimation.stop();\n      currentAnimation = null;\n    }\n  };\n\n  const setStyle = (styles: Partial<CSSStyleDeclaration>) => {\n    for (const [k, v] of Object.entries(styles)) {\n      node.style[k] = v as string;\n    }\n  };\n\n  /** Instantly apply collapsed styles (no animation). */\n  function setCollapsed() {\n    stop();\n    setStyle({\n      height: '0px',\n      marginTop: '0px',\n      marginBottom: '0px',\n      overflow,\n    });\n  }\n\n  /** Instantly apply expanded styles (no animation). */\n  function setExpanded() {\n    stop();\n    setStyle({\n      height: '',\n      marginTop: '',\n      marginBottom: '',\n      overflow: '',\n    });\n  }\n\n  /**\n   * Collapse: animate from current box (height + margins) down to 0.\n   */\n  function collapse() {\n    stop();\n    return new Promise<void>(resolve => {\n      const { height, marginTop, marginBottom, total } = getBoxMetrics(node);\n\n      // Lock current box\n      setStyle({\n        height: `${height}px`,\n        marginTop: `${marginTop}px`,\n        marginBottom: `${marginBottom}px`,\n        overflow,\n        willChange: 'height, margin',\n      });\n\n      const denom = total > 0 ? total : 0.0001; // avoid divide-by-zero\n\n      currentAnimation = animate({\n        from: total,\n        to: 0,\n        duration,\n        ease: cubicBezier(0.2, 0, 0, 1),\n        onUpdate: v => {\n          const ratio = v / denom;\n          setStyle({\n            height: `${height * ratio}px`,\n            marginTop: `${marginTop * ratio}px`,\n            marginBottom: `${marginBottom * ratio}px`,\n          });\n        },\n        onComplete: () => {\n          setStyle({\n            height: '0px',\n            marginTop: '0px',\n            marginBottom: '0px',\n            willChange: '',\n          });\n          resolve();\n        },\n      });\n    });\n  }\n\n  /**\n   * Expand: animate from 0 box to the element's natural box (height + margins),\n   * then restore `height: auto` and computed margins.\n   */\n  function expand() {\n    stop();\n    return new Promise<void>(resolve => {\n      // Let the element size naturally to measure the target box\n      setStyle({\n        height: '',\n        marginTop: '',\n        marginBottom: '',\n        overflow,\n      });\n      const { height, marginTop, marginBottom, total } = getBoxMetrics(node);\n\n      // Start locked at zero box\n      setStyle({\n        height: '0px',\n        marginTop: '0px',\n        marginBottom: '0px',\n        willChange: 'height, margin',\n      });\n\n      const denom = total > 0 ? total : 0.0001;\n\n      currentAnimation = animate({\n        from: 0,\n        to: total,\n        duration,\n        ease: cubicBezier(0.2, 0, 0, 1),\n        onUpdate: v => {\n          const ratio = v / denom;\n          setStyle({\n            height: `${height * ratio}px`,\n            marginTop: `${marginTop * ratio}px`,\n            marginBottom: `${marginBottom * ratio}px`,\n          });\n        },\n        onComplete: () => {\n          // Restore natural layout\n          setStyle({\n            height: '',\n            marginTop: '',\n            marginBottom: '',\n            overflow: '',\n            willChange: '',\n          });\n          resolve();\n        },\n      });\n    });\n  }\n\n  return { collapse, expand, setCollapsed, setExpanded };\n};\n\nexport { useCollapse };\n"],"version":3}