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

package/dist/components/nv-togglebutton.js.map

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

package/dist/components/nv-togglebuttongroup.js

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

package/dist/components/nv-tooltip.js

@@ -1,4 +1,4 @@
-import { N as NvTooltip$1, d as defineCustomElement$1 } from './p-81d915ef.js';
+import { N as NvTooltip$1, d as defineCustomElement$1 } from './p-643d7802.js';
 
 const NvTooltip = NvTooltip$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/{p-60083982.js → p-00347aae.js}

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment, d as Host } from './p-5829b9f7.js';
 import { b as ButtonType } from './p-51602221.js';
-import { d as defineCustomElement$3 } from './p-e1b2eba2.js';
-import { d as defineCustomElement$2 } from './p-946a047c.js';
+import { d as defineCustomElement$3 } from './p-2062ba39.js';
+import { d as defineCustomElement$2 } from './p-0bfe8a47.js';
 import { d as defineCustomElement$1 } from './p-222136c2.js';
 
 const nvDialogfooterCss = "nv-dialogfooter{display:flex;padding:var(--dialog-footer-padding-top) var(--dialog-footer-padding-x) var(--dialog-footer-padding-bottom) var(--dialog-footer-padding-x);justify-content:flex-end;align-items:flex-end;gap:var(--dialog-footer-gap-y);align-self:stretch}";
@@ -135,4 +135,4 @@ defineCustomElement();
 
 export { NvDialogfooter as N, defineCustomElement as d };
 
-//# sourceMappingURL=p-60083982.js.map
+//# sourceMappingURL=p-00347aae.js.map

package/dist/components/{p-60083982.js.map → p-00347aae.js.map}

@@ -1 +1 @@
-{"file":"p-60083982.js","mappings":";;;;;;AAAA,MAAM,iBAAiB,GAAG,0QAA0Q,CAAC;AACrS,6BAAe,iBAAiB;;MCqBnB,cAAc;IAN3B;;;;;;QASU,YAAO,GAAG,KAAK,CAAC;;;;;;QASf,aAAQ,GAAY,KAAK,CAAC;;;;;QAO1B,kBAAa,GAAY,KAAK,CAAC;;;;QAM/B,gBAAW,GAAW,EAAE,CAAC;;;;QAMzB,iBAAY,GAAW,EAAE,CAAC;;;;QAM1B,WAAM,GAAY,KAAK,CAAC;;;;QAMxB,gBAAW,GAAW,QAAQ,CAAC;;;;QAM/B,iBAAY,GAAW,SAAS,CAAC;;;;;;;;QA0ClC,kBAAa,GAAG,CAAC,KAAY;YACnC,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,IAAI,CAAC,oBAAoB,CAAC,IAAI,EAAE,CAAC;SAClC,CAAC;;;;;QAMM,iBAAY,GAAG,CAAC,KAAY;YAClC,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC;SAC5B,CAAC;KAwEH;;;;IAlEC,iBAAiB;;QAEf,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,IAAI;YACrD,QACE,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY;gBACnC,CAAE,IAAgB,CAAC,YAAY,CAAC,MAAM,CAAC,EACvC;SACH,CAAC,CAAC;KACJ;IAED,gBAAgB;;QAEd,IAAI,CAAC,iBAAiB;YACpB,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,IAAI;kBAC/B,UAAU,CAAC,MAAM;kBACjB,UAAU,CAAC,MAAM,CAAC;KACzB;;;;IAMD,MAAM;QACJ,QACE,EAAC,IAAI,uDACF,CAAC,IAAI,CAAC,OAAO,IACZ,EAAC,QAAQ,QACN,CAAC,IAAI,CAAC,aAAa,KAClB,iBAAW,OAAO,EAAE,IAAI,CAAC,YAAY,EAAE,QAAQ,EAAC,KAAK,EAAC,IAAI,EAAC,IAAI,IAC5D,IAAI,CAAC,WAAW,CACP,CACb,EACD,iBACE,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,IAAI,EACT,QAAQ,EAAC,MAAM,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,iBAAiB,IAE3B,IAAI,CAAC,WAAW,KACf,eACE,IAAI,EAAC,cAAc,EACnB,IAAI,EAAE,IAAI,CAAC,WAAW,EACtB,IAAI,EAAC,IAAI,GACT,CACH,EACA,IAAI,CAAC,YAAY,EACjB,IAAI,CAAC,YAAY,KAChB,eACE,IAAI,EAAC,eAAe,EACpB,IAAI,EAAE,IAAI,CAAC,YAAY,EACvB,IAAI,EAAC,IAAI,GACT,CACH,CACS,CACH,KAEX,eAAa,CACd,CACI,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-dialogfooter/nv-dialogfooter.scss?tag=nv-dialogfooter","src/components/nv-dialogfooter/nv-dialogfooter.tsx"],"sourcesContent":["nv-dialogfooter {\n  display: flex;\n  padding: var(--dialog-footer-padding-top) var(--dialog-footer-padding-x)\n    var(--dialog-footer-padding-bottom) var(--dialog-footer-padding-x);\n\n  justify-content: flex-end;\n  align-items: flex-end;\n  gap: var(--dialog-footer-gap-y);\n  align-self: stretch;\n}\n","import {\n  AttachInternals,\n  Component,\n  h,\n  Host,\n  Prop,\n  Event,\n  EventEmitter,\n  Fragment,\n  Element,\n} from '@stencil/core';\nimport { ButtonType } from '../../utils/constants';\n\n/**\n * @slot default - Custom content for the dialog footer. When provided, the default buttons will not be rendered.\n */\n@Component({\n  tag: 'nv-dialogfooter',\n  styleUrl: 'nv-dialogfooter.scss',\n  shadow: false,\n  formAssociated: true,\n})\nexport class NvDialogfooter {\n  @AttachInternals() internals: ElementInternals;\n  @Element() el: HTMLNvDialogfooterElement;\n  private hasSlot = false;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Disables the primary button, preventing user interaction.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Controls the visibility of the cancel button. When true, the cancel button is\n   * hidden.\n   */\n  @Prop({ reflect: true })\n  readonly undismissable: boolean = false;\n\n  /**\n   * Sets the leading icon for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly leadingIcon: string = '';\n\n  /**\n   * Sets the trailing icon for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly trailingIcon: string = '';\n\n  /**\n   * Sets the danger state for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly danger: boolean = false;\n\n  /**\n   * Sets the label for the cancel button.\n   */\n  @Prop({ reflect: true })\n  readonly cancelLabel: string = 'Cancel';\n\n  /**\n   * Sets the label for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly primaryLabel: string = 'Primary';\n\n  /**\n   * Sets the type of the primary button. If using a form, this will default to\n   * 'submit' if nothing passed.\n   */\n  @Prop({ reflect: true, mutable: true })\n  primaryButtonType: `${ButtonType}`;\n\n  /**\n   * A form inside the dialog can be submitted through the dialog footer by\n   * giving the form an id and passing that id to the form attribute.\n   */\n  @Prop({ reflect: true })\n  readonly form: string;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emitted when the cancel button is clicked. This will close the dialog.\n   */\n  @Event()\n  dialogCanceled: EventEmitter<void>;\n\n  /**\n   * Emitted when the primary button is clicked. This allows to handle the\n   * primary action and potential data capture before closing the dialog.\n   */\n  @Event()\n  dialogPrimaryClicked: EventEmitter<void>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Handles the primary action when the primary button is clicked.\n   * @param {Event} event - The click event.\n   */\n\n  private handlePrimary = (event: Event) => {\n    event.stopPropagation();\n    this.dialogPrimaryClicked.emit();\n  };\n\n  /**\n   * Handles the cancel action when the cancel button is clicked. This will close the dialog.\n   * @param {Event} event - The click event.\n   */\n  private handleCancel = (event: Event) => {\n    event.stopPropagation();\n    this.dialogCanceled.emit();\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    // Check if there are any child elements that don't have a slot attribute\n    this.hasSlot = Array.from(this.el.childNodes).some(node => {\n      return (\n        node.nodeType === Node.ELEMENT_NODE &&\n        !(node as Element).hasAttribute('slot')\n      );\n    });\n  }\n\n  componentDidLoad() {\n    // Set the default button type based on the form property\n    this.primaryButtonType =\n      this.primaryButtonType || this.form\n        ? ButtonType.Submit\n        : ButtonType.Button;\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        {!this.hasSlot ? (\n          <Fragment>\n            {!this.undismissable && (\n              <nv-button onClick={this.handleCancel} emphasis=\"low\" size=\"sm\">\n                {this.cancelLabel}\n              </nv-button>\n            )}\n            <nv-button\n              onClick={this.handlePrimary}\n              disabled={this.disabled}\n              danger={this.danger}\n              size=\"sm\"\n              emphasis=\"high\"\n              form={this.form}\n              type={this.primaryButtonType}\n            >\n              {this.leadingIcon && (\n                <nv-icon\n                  slot=\"leading-icon\"\n                  name={this.leadingIcon}\n                  size=\"sm\"\n                />\n              )}\n              {this.primaryLabel}\n              {this.trailingIcon && (\n                <nv-icon\n                  slot=\"trailing-icon\"\n                  name={this.trailingIcon}\n                  size=\"sm\"\n                />\n              )}\n            </nv-button>\n          </Fragment>\n        ) : (\n          <slot></slot>\n        )}\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}
+{"file":"p-00347aae.js","mappings":";;;;;;AAAA,MAAM,iBAAiB,GAAG,0QAA0Q,CAAC;AACrS,6BAAe,iBAAiB;;MCqBnB,cAAc;IAN3B;;;;;;QASU,YAAO,GAAG,KAAK,CAAC;;;;;;QASf,aAAQ,GAAY,KAAK,CAAC;;;;;QAO1B,kBAAa,GAAY,KAAK,CAAC;;;;QAM/B,gBAAW,GAAW,EAAE,CAAC;;;;QAMzB,iBAAY,GAAW,EAAE,CAAC;;;;QAM1B,WAAM,GAAY,KAAK,CAAC;;;;QAMxB,gBAAW,GAAW,QAAQ,CAAC;;;;QAM/B,iBAAY,GAAW,SAAS,CAAC;;;;;;;;QA0ClC,kBAAa,GAAG,CAAC,KAAY;YACnC,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,IAAI,CAAC,oBAAoB,CAAC,IAAI,EAAE,CAAC;SAClC,CAAC;;;;;QAMM,iBAAY,GAAG,CAAC,KAAY;YAClC,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC;SAC5B,CAAC;KAwEH;;;;IAlEC,iBAAiB;;QAEf,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,IAAI;YACrD,QACE,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY;gBACnC,CAAE,IAAgB,CAAC,YAAY,CAAC,MAAM,CAAC,EACvC;SACH,CAAC,CAAC;KACJ;IAED,gBAAgB;;QAEd,IAAI,CAAC,iBAAiB;YACpB,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,IAAI;kBAC/B,UAAU,CAAC,MAAM;kBACjB,UAAU,CAAC,MAAM,CAAC;KACzB;;;;IAMD,MAAM;QACJ,QACE,EAAC,IAAI,uDACF,CAAC,IAAI,CAAC,OAAO,IACZ,EAAC,QAAQ,QACN,CAAC,IAAI,CAAC,aAAa,KAClB,iBAAW,OAAO,EAAE,IAAI,CAAC,YAAY,EAAE,QAAQ,EAAC,KAAK,EAAC,IAAI,EAAC,IAAI,IAC5D,IAAI,CAAC,WAAW,CACP,CACb,EACD,iBACE,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,IAAI,EAAC,IAAI,EACT,QAAQ,EAAC,MAAM,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,iBAAiB,IAE3B,IAAI,CAAC,WAAW,KACf,eACE,IAAI,EAAC,cAAc,EACnB,IAAI,EAAE,IAAI,CAAC,WAAW,EACtB,IAAI,EAAC,IAAI,GACT,CACH,EACA,IAAI,CAAC,YAAY,EACjB,IAAI,CAAC,YAAY,KAChB,eACE,IAAI,EAAC,eAAe,EACpB,IAAI,EAAE,IAAI,CAAC,YAAY,EACvB,IAAI,EAAC,IAAI,GACT,CACH,CACS,CACH,KAEX,eAAa,CACd,CACI,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-dialogfooter/nv-dialogfooter.scss?tag=nv-dialogfooter","src/components/nv-dialogfooter/nv-dialogfooter.tsx"],"sourcesContent":["nv-dialogfooter {\n  display: flex;\n  padding: var(--dialog-footer-padding-top) var(--dialog-footer-padding-x)\n    var(--dialog-footer-padding-bottom) var(--dialog-footer-padding-x);\n\n  justify-content: flex-end;\n  align-items: flex-end;\n  gap: var(--dialog-footer-gap-y);\n  align-self: stretch;\n}\n","import {\n  AttachInternals,\n  Component,\n  h,\n  Host,\n  Prop,\n  Event,\n  EventEmitter,\n  Fragment,\n  Element,\n} from '@stencil/core';\nimport { ButtonType } from '../../utils/constants';\n\n/**\n * @slot default - Custom content for the dialog footer. When provided, the default buttons will not be rendered.\n */\n@Component({\n  tag: 'nv-dialogfooter',\n  styleUrl: 'nv-dialogfooter.scss',\n  shadow: false,\n  formAssociated: true,\n})\nexport class NvDialogfooter {\n  @AttachInternals() internals: ElementInternals;\n  @Element() el: HTMLNvDialogfooterElement;\n  private hasSlot = false;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Disables the primary button, preventing user interaction.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Controls the visibility of the cancel button. When true, the cancel button is\n   * hidden.\n   */\n  @Prop({ reflect: true })\n  readonly undismissable: boolean = false;\n\n  /**\n   * Sets the leading icon for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly leadingIcon: string = '';\n\n  /**\n   * Sets the trailing icon for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly trailingIcon: string = '';\n\n  /**\n   * Sets the danger state for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly danger: boolean = false;\n\n  /**\n   * Sets the label for the cancel button.\n   */\n  @Prop({ reflect: true })\n  readonly cancelLabel: string = 'Cancel';\n\n  /**\n   * Sets the label for the primary button.\n   */\n  @Prop({ reflect: true })\n  readonly primaryLabel: string = 'Primary';\n\n  /**\n   * Sets the type of the primary button. If using a form, this will default to\n   * 'submit' if nothing passed.\n   */\n  @Prop({ reflect: true, mutable: true })\n  primaryButtonType: `${ButtonType}`;\n\n  /**\n   * A form inside the dialog can be submitted through the dialog footer by\n   * giving the form an id and passing that id to the form attribute.\n   */\n  @Prop({ reflect: true })\n  readonly form: string;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emitted when the cancel button is clicked. This will close the dialog.\n   */\n  @Event()\n  dialogCanceled: EventEmitter<void>;\n\n  /**\n   * Emitted when the primary button is clicked. This allows to handle the\n   * primary action and potential data capture before closing the dialog.\n   */\n  @Event()\n  dialogPrimaryClicked: EventEmitter<void>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Handles the primary action when the primary button is clicked.\n   * @param {Event} event - The click event.\n   */\n\n  private handlePrimary = (event: Event) => {\n    event.stopPropagation();\n    this.dialogPrimaryClicked.emit();\n  };\n\n  /**\n   * Handles the cancel action when the cancel button is clicked. This will close the dialog.\n   * @param {Event} event - The click event.\n   */\n  private handleCancel = (event: Event) => {\n    event.stopPropagation();\n    this.dialogCanceled.emit();\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    // Check if there are any child elements that don't have a slot attribute\n    this.hasSlot = Array.from(this.el.childNodes).some(node => {\n      return (\n        node.nodeType === Node.ELEMENT_NODE &&\n        !(node as Element).hasAttribute('slot')\n      );\n    });\n  }\n\n  componentDidLoad() {\n    // Set the default button type based on the form property\n    this.primaryButtonType =\n      this.primaryButtonType || this.form\n        ? ButtonType.Submit\n        : ButtonType.Button;\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        {!this.hasSlot ? (\n          <Fragment>\n            {!this.undismissable && (\n              <nv-button onClick={this.handleCancel} emphasis=\"low\" size=\"sm\">\n                {this.cancelLabel}\n              </nv-button>\n            )}\n            <nv-button\n              onClick={this.handlePrimary}\n              disabled={this.disabled}\n              danger={this.danger}\n              size=\"sm\"\n              emphasis=\"high\"\n              form={this.form}\n              type={this.primaryButtonType}\n            >\n              {this.leadingIcon && (\n                <nv-icon\n                  slot=\"leading-icon\"\n                  name={this.leadingIcon}\n                  size=\"sm\"\n                />\n              )}\n              {this.primaryLabel}\n              {this.trailingIcon && (\n                <nv-icon\n                  slot=\"trailing-icon\"\n                  name={this.trailingIcon}\n                  size=\"sm\"\n                />\n              )}\n            </nv-button>\n          </Fragment>\n        ) : (\n          <slot></slot>\n        )}\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}