npm - @nova-design-system/nova-webcomponents - Versions diffs - 3.0.0-beta.46 → 3.0.0 - Mend

@nova-design-system/nova-webcomponents 3.0.0-beta.46 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (322) hide show

package/dist/components/{p-d88ced51.js.map → p-02752770.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~d88ced51~~.js","mappings":";;AAAA,MAAM,iBAAiB,GAAG,wqBAAwqB,CAAC;AACnsB,6BAAe,iBAAiB;;MCSnB,cAAc;IAL3B;;;QAOU,YAAO,GAAG,KAAK,CAAC;;;;;;QASf,YAAO,GAAW,cAAc,CAAC;KA0C3C;;;;IA9BC,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;;;;IAMD,MAAM;QACJ,QACE,EAAC,IAAI,uDACF,CAAC,IAAI,CAAC,OAAO,IACZ,EAAC,QAAQ,QACP,WAAK,KAAK,EAAC,SAAS,IAAE,IAAI,CAAC,OAAO,CAAO,EACzC,WAAK,KAAK,EAAC,YAAY,IAAE,IAAI,CAAC,UAAU,CAAO,CACtC,KAEX,eAAa,CACd,CACI,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-dialogheader/nv-dialogheader.scss?tag=nv-dialogheader","src/components/nv-dialogheader/nv-dialogheader.tsx"],"sourcesContent":["nv-dialogheader {\n // calc(var(--dialog-header-padding-x, 24px) + var(--dialog-dismissible-position-right, 12px) + var(--button-sm-icon-size, 16px) + var(--button-sm-icon-button-padding, 8px))\n padding: var(--dialog-header-padding-top)\n var(--dialog-header-padding-x)\n var(--dialog-header-padding-bottom)\n var(--dialog-header-padding-x);\n justify-content: space-between;\n align-items: flex-start;\n align-self: stretch;\n\n .heading {\n color: var(--color-content-high-text);\n\n\n /* heading/xs/medium /\n font-family: 'TT Norms Pro', sans-serif;\n font-size: var(--font-size-lg);\n font-style: normal;\n font-weight: 500;\n line-height: var(--leading-px-6); / 133.333% /\n letter-spacing: var(--letter-spacing-heading-xs);\n }\n\n .subheading {\n color: var(--color-content-low-text);\n\n\n / text/sm/regular /\n font-family: 'TT Norms Pro', sans-serif;\n font-size: var(--font-size-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--line-height-sm); / 142.857% /\n }\n}\n","import { Component, Host, Prop, h, Element, Fragment } from '@stencil/core';\n\n/\n @slot default - Custom content for the dialog header. When provided, the default header will not be rendered.\n /\n@Component({\n tag: 'nv-dialogheader',\n styleUrl: 'nv-dialogheader.scss',\n shadow: false,\n})\nexport class NvDialogheader {\n @Element() el: HTMLNvDialogheaderElement;\n private hasSlot = false;\n\n /*************************************************************************/\n //#region PROPERTIES\n\n /\n * Sets the heading text for the dialog.\n /\n @Prop({ reflect: true })\n readonly heading: string = 'Dialog Title';\n\n /\n Sets the subheading text for the dialog.\n /\n @Prop({ reflect: true })\n readonly subheading: string;\n\n //#endregion PROPERTIES\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 //#endregion LIFECYCLE\n /**************************************************************************/\n //#region RENDER\n\n render() {\n return (\n <Host>\n {!this.hasSlot ? (\n <Fragment>\n <div class=\"heading\">{this.heading}</div>\n <div class=\"subheading\">{this.subheading}</div>\n </Fragment>\n ) : (\n <slot></slot>\n )}\n </Host>\n );\n }\n\n //#endregion RENDER\n}\n"],"version":3}
1	+ {"file":"p-02752770.js","mappings":";;AAAA,MAAM,iBAAiB,GAAG,wqBAAwqB,CAAC;AACnsB,6BAAe,iBAAiB;;MCSnB,cAAc;IAL3B;;;QAOU,YAAO,GAAG,KAAK,CAAC;;;;;;QASf,YAAO,GAAW,cAAc,CAAC;KA0C3C;;;;IA9BC,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;;;;IAMD,MAAM;QACJ,QACE,EAAC,IAAI,uDACF,CAAC,IAAI,CAAC,OAAO,IACZ,EAAC,QAAQ,QACP,WAAK,KAAK,EAAC,SAAS,IAAE,IAAI,CAAC,OAAO,CAAO,EACzC,WAAK,KAAK,EAAC,YAAY,IAAE,IAAI,CAAC,UAAU,CAAO,CACtC,KAEX,eAAa,CACd,CACI,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-dialogheader/nv-dialogheader.scss?tag=nv-dialogheader","src/components/nv-dialogheader/nv-dialogheader.tsx"],"sourcesContent":["nv-dialogheader {\n // calc(var(--dialog-header-padding-x, 24px) + var(--dialog-dismissible-position-right, 12px) + var(--button-sm-icon-size, 16px) + var(--button-sm-icon-button-padding, 8px))\n padding: var(--dialog-header-padding-top)\n var(--dialog-header-padding-x)\n var(--dialog-header-padding-bottom)\n var(--dialog-header-padding-x);\n justify-content: space-between;\n align-items: flex-start;\n align-self: stretch;\n\n .heading {\n color: var(--color-content-high-text);\n\n\n /* heading/xs/medium /\n font-family: 'TT Norms Pro', sans-serif;\n font-size: var(--font-size-lg);\n font-style: normal;\n font-weight: 500;\n line-height: var(--leading-px-6); / 133.333% /\n letter-spacing: var(--letter-spacing-heading-xs);\n }\n\n .subheading {\n color: var(--color-content-low-text);\n\n\n / text/sm/regular /\n font-family: 'TT Norms Pro', sans-serif;\n font-size: var(--font-size-sm);\n font-style: normal;\n font-weight: 400;\n line-height: var(--line-height-sm); / 142.857% /\n }\n}\n","import { Component, Host, Prop, h, Element, Fragment } from '@stencil/core';\n\n/\n @slot default - Custom content for the dialog header. When provided, the default header will not be rendered.\n /\n@Component({\n tag: 'nv-dialogheader',\n styleUrl: 'nv-dialogheader.scss',\n shadow: false,\n})\nexport class NvDialogheader {\n @Element() el: HTMLNvDialogheaderElement;\n private hasSlot = false;\n\n /*************************************************************************/\n //#region PROPERTIES\n\n /\n * Sets the heading text for the dialog.\n /\n @Prop({ reflect: true })\n readonly heading: string = 'Dialog Title';\n\n /\n Sets the subheading text for the dialog.\n /\n @Prop({ reflect: true })\n readonly subheading: string;\n\n //#endregion PROPERTIES\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 //#endregion LIFECYCLE\n /**************************************************************************/\n //#region RENDER\n\n render() {\n return (\n <Host>\n {!this.hasSlot ? (\n <Fragment>\n <div class=\"heading\">{this.heading}</div>\n <div class=\"subheading\">{this.subheading}</div>\n </Fragment>\n ) : (\n <slot></slot>\n )}\n </Host>\n );\n }\n\n //#endregion RENDER\n}\n"],"version":3}

package/dist/components/{p-7b89fb48.js → p-150daf68.js} RENAMED Viewed

@@ -22,7 +22,7 @@ const NvLoader = /*@__PURE__*/ proxyCustomElement(class NvLoader extends H {
     //#region RENDER
     /* <slot> empty to force rendering change */
     render() {
-        return (h(Host, { key: '701552c6cf9126e60d81f844648ec1d29079fdd3', class: clsx(this.size && `size-${this.size}`, this.color && `color-${this.color}`) }));
+        return (h(Host, { key: 'f3094e46eb7072534f497694d3c28030f0118acc', class: clsx(this.size && `size-${this.size}`, this.color && `color-${this.color}`) }));
     }
     static get style() { return NvLoaderStyle0; }
 }, [0, "nv-loader", {
@@ -46,4 +46,4 @@ defineCustomElement();
 export { NvLoader as N, defineCustomElement as d };
-//# sourceMappingURL=p-7b89fb48.js.map
+//# sourceMappingURL=p-150daf68.js.map

package/dist/components/{p-7b89fb48.js.map → p-150daf68.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~7b89fb48~~.js","mappings":";;;AAAA,MAAM,WAAW,GAAG,qoHAAqoH,CAAC;AAC1pH,uBAAe,WAAW;;MCSb,QAAQ;IALrB;;;;;;;;;;QAeW,SAAI,GAAuB,IAAI,CAAC;KA2B1C;;;;;IAZC,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,KAAK,EAAE,IAAI,CACT,IAAI,CAAC,IAAI,IAAI,QAAQ,IAAI,CAAC,IAAI,EAAE,EAChC,IAAI,CAAC,KAAK,IAAI,SAAS,IAAI,CAAC,KAAK,EAAE,CACpC,GACK,EACR;KACH;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-loader/nv-loader.scss?tag=nv-loader","src/components/nv-loader/nv-loader.tsx"],"sourcesContent":["@use \"sass:map\";\n\n/* Variants /\n$loader-sizes: (\"xs\", \"sm\", \"md\", \"lg\", \"xl\");\n$loader-color: (\"brand\", \"white\");\n\n/ Define maps for color-related variables /\n$components-loader-background: (\n \"brand\": var(--components-loader-brand-background),\n \"white\": var(--components-loader-white-background)\n);\n\n$components-loader-foreground: (\n \"brand\": var(--components-loader-brand-foreground),\n \"white\": var(--components-loader-white-foreground)\n);\n\n/ Define maps for size-related variables /\n$components-loader-size: (\n \"xs\": var(--loader-size-xs),\n \"sm\": var(--loader-size-sm),\n \"md\": var(--loader-size-md),\n \"lg\": var(--loader-size-lg),\n \"xl\": var(--loader-size-xl)\n);\n\n@mixin root-styles() {\n display: inline-block;\n position: relative;\n aspect-ratio: 1 / 1;\n border-radius: 9999px;\n color: inherit;\n}\n\n@mixin size-styles($size) {\n $loader-size: map.get($components-loader-size, $size);\n $border-size: calc($loader-size / 10);\n\n width: $loader-size;\n height: $loader-size;\n\n &::before,\n &::after {\n content: \" \";\n position: absolute;\n top: 0;\n left: 0;\n border-radius: inherit;\n width: 100%;\n height: 100%;\n }\n\n &::before {\n content: \" \";\n border: $border-size solid;\n opacity: 0.3;\n }\n\n &::after {\n content: \" \";\n border-top: $border-size solid transparent;\n border-left: $border-size solid transparent;\n border-right: $border-size solid transparent;\n border-bottom: $border-size solid;\n animation: rotation 1s linear infinite;\n }\n}\n\n@mixin color-styles($color) {\n &::before {\n border-color: map.get($components-loader-background, $color);\n opacity: 1;\n }\n\n &::after {\n border-bottom-color: map.get($components-loader-foreground, $color);\n }\n}\n\n@keyframes rotation {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n}\n\nnv-loader {\n @include root-styles();\n\n @each $size in $loader-sizes {\n &.size-#{$size} {\n @include size-styles($size);\n }\n }\n\n @each $color in $loader-color {\n &.color-#{$color} {\n @include color-styles($color);\n }\n }\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\nimport { SemanticSizes, LoaderColors } from '../../utils/constants';\n\n@Component({\n tag: 'nv-loader',\n styleUrl: 'nv-loader.scss',\n shadow: false,\n})\nexport class NvLoader {\n /*************************************************************************/\n //#region PROPERTIES\n\n /\n * Choose the size of the loader to best fit your application’s needs, whether\n * it’s a small spinner for subtle loading indicators or a large one for more\n * prominent displays.\n /\n @Prop({ reflect: true })\n readonly size: `${SemanticSizes}` = 'md';\n\n /\n Choose the color of the loader. Options are primary and white to keep the\n * design consistent and ensure the loader stands out or blends in\n * appropriately with your application’s interface.\n /\n @Prop({ reflect: true })\n readonly color: `${LoaderColors}`;\n\n //#endregion PROPERTIES\n /**************************************************************************/\n //#region RENDER\n\n / <slot> empty to force rendering change */\n render() {\n return (\n <Host\n class={clsx(\n this.size && `size-${this.size}`,\n this.color && `color-${this.color}`,\n )}\n ></Host>\n );\n }\n\n //#endregion RENDER\n}\n"],"version":3}
1	+ {"file":"p-150daf68.js","mappings":";;;AAAA,MAAM,WAAW,GAAG,qoHAAqoH,CAAC;AAC1pH,uBAAe,WAAW;;MCSb,QAAQ;IALrB;;;;;;;;;;QAeW,SAAI,GAAuB,IAAI,CAAC;KA2B1C;;;;;IAZC,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,KAAK,EAAE,IAAI,CACT,IAAI,CAAC,IAAI,IAAI,QAAQ,IAAI,CAAC,IAAI,EAAE,EAChC,IAAI,CAAC,KAAK,IAAI,SAAS,IAAI,CAAC,KAAK,EAAE,CACpC,GACK,EACR;KACH;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-loader/nv-loader.scss?tag=nv-loader","src/components/nv-loader/nv-loader.tsx"],"sourcesContent":["@use \"sass:map\";\n\n/* Variants /\n$loader-sizes: (\"xs\", \"sm\", \"md\", \"lg\", \"xl\");\n$loader-color: (\"brand\", \"white\");\n\n/ Define maps for color-related variables /\n$components-loader-background: (\n \"brand\": var(--components-loader-brand-background),\n \"white\": var(--components-loader-white-background)\n);\n\n$components-loader-foreground: (\n \"brand\": var(--components-loader-brand-foreground),\n \"white\": var(--components-loader-white-foreground)\n);\n\n/ Define maps for size-related variables /\n$components-loader-size: (\n \"xs\": var(--loader-size-xs),\n \"sm\": var(--loader-size-sm),\n \"md\": var(--loader-size-md),\n \"lg\": var(--loader-size-lg),\n \"xl\": var(--loader-size-xl)\n);\n\n@mixin root-styles() {\n display: inline-block;\n position: relative;\n aspect-ratio: 1 / 1;\n border-radius: 9999px;\n color: inherit;\n}\n\n@mixin size-styles($size) {\n $loader-size: map.get($components-loader-size, $size);\n $border-size: calc($loader-size / 10);\n\n width: $loader-size;\n height: $loader-size;\n\n &::before,\n &::after {\n content: \" \";\n position: absolute;\n top: 0;\n left: 0;\n border-radius: inherit;\n width: 100%;\n height: 100%;\n }\n\n &::before {\n content: \" \";\n border: $border-size solid;\n opacity: 0.3;\n }\n\n &::after {\n content: \" \";\n border-top: $border-size solid transparent;\n border-left: $border-size solid transparent;\n border-right: $border-size solid transparent;\n border-bottom: $border-size solid;\n animation: rotation 1s linear infinite;\n }\n}\n\n@mixin color-styles($color) {\n &::before {\n border-color: map.get($components-loader-background, $color);\n opacity: 1;\n }\n\n &::after {\n border-bottom-color: map.get($components-loader-foreground, $color);\n }\n}\n\n@keyframes rotation {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n}\n\nnv-loader {\n @include root-styles();\n\n @each $size in $loader-sizes {\n &.size-#{$size} {\n @include size-styles($size);\n }\n }\n\n @each $color in $loader-color {\n &.color-#{$color} {\n @include color-styles($color);\n }\n }\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\nimport clsx from 'clsx';\n\nimport { SemanticSizes, LoaderColors } from '../../utils/constants';\n\n@Component({\n tag: 'nv-loader',\n styleUrl: 'nv-loader.scss',\n shadow: false,\n})\nexport class NvLoader {\n /*************************************************************************/\n //#region PROPERTIES\n\n /\n * Choose the size of the loader to best fit your application’s needs, whether\n * it’s a small spinner for subtle loading indicators or a large one for more\n * prominent displays.\n /\n @Prop({ reflect: true })\n readonly size: `${SemanticSizes}` = 'md';\n\n /\n Choose the color of the loader. Options are primary and white to keep the\n * design consistent and ensure the loader stands out or blends in\n * appropriately with your application’s interface.\n /\n @Prop({ reflect: true })\n readonly color: `${LoaderColors}`;\n\n //#endregion PROPERTIES\n /**************************************************************************/\n //#region RENDER\n\n / <slot> empty to force rendering change */\n render() {\n return (\n <Host\n class={clsx(\n this.size && `size-${this.size}`,\n this.color && `color-${this.color}`,\n )}\n ></Host>\n );\n }\n\n //#endregion RENDER\n}\n"],"version":3}

package/dist/components/{p-56ef8131.js → p-2012b8ba.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-1c45c0f2.js';
-import { d as defineCustomElement$1 } from './p-9d6aaf76.js';
+import { d as defineCustomElement$1 } from './p-e00cbb8a.js';
 const nvFielddropdownitemcheckCss = "nv-fielddropdownitemcheck{cursor:pointer;display:flex;padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);border-radius:var(--list-dropdown-item-radius)}nv-fielddropdownitemcheck slot-fb,nv-fielddropdownitemcheck span{all:unset}nv-fielddropdownitemcheck:hover{background-color:var(--components-list-dropdown-item-background-hover)}";
 const NvFielddropdownitemcheckStyle0 = nvFielddropdownitemcheckCss;
@@ -48,7 +48,7 @@ const NvFielddropdownitemcheck = /*@__PURE__*/ proxyCustomElement(class NvFieldd
         };
     }
     render() {
-        return (h(Host, { key: '69e403031200efea98b211ed6d69d3a21338bea0', onClick: this.handleClick }, h("nv-fieldcheckbox", { key: '0d12dbeef8532087d950bfc4e14994821b1cd3f1', checked: this.checked, name: this.label || this.value, label: this.label || this.value, "label-placement": "after", description: this.description, disabled: this.disabled, tabindex: "-1", role: "option", onCheckedChanged: this.onFieldcheckboxChanged })));
+        return (h(Host, { key: '93a97fb36d69bd837b27cdbfa31adc5a7a71dab4', onClick: this.handleClick }, h("nv-fieldcheckbox", { key: '7afd9b55ce6911c327fae658304fa313fc908d45', checked: this.checked, name: this.label || this.value, label: this.label || this.value, "label-placement": "after", description: this.description, disabled: this.disabled, tabindex: "-1", role: "option", onCheckedChanged: this.onFieldcheckboxChanged })));
     }
     get el() { return this; }
     static get style() { return NvFielddropdownitemcheckStyle0; }
@@ -82,4 +82,4 @@ defineCustomElement();
 export { NvFielddropdownitemcheck as N, defineCustomElement as d };
-//# sourceMappingURL=p-56ef8131.js.map
+//# sourceMappingURL=p-2012b8ba.js.map

package/dist/components/{p-56ef8131.js.map → p-2012b8ba.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~56ef8131~~.js","mappings":";;;AAAA,MAAM,2BAA2B,GAAG,yWAAyW,CAAC;AAC9Y,uCAAe,2BAA2B;;MCc7B,wBAAwB;IALrC;;;;;;;;;QAeE,YAAO,GAAY,KAAK,CAAC;;;;QA+BhB,aAAQ,GAAY,KAAK,CAAC;;;;;;QA+B3B,2BAAsB,GAAG,CAAC,KAA2B;YAC3D,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;;YAE1B,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,MAAM,CAAC;YAC5B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;gBACpB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,KAAK,EAAE,IAAI,CAAC,KAAK;aAClB,CAAC,CAAC;SACJ,CAAC;;QAGM,gBAAW,GAAG;YACpB,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAC1B,IAAI,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE;gBAC1C,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;aACtB;iBAAM;gBACL,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;aACrB;SACF,CAAC;KAmBH;IAjBC,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,OAAO,EAAE,IAAI,CAAC,WAAW,IAC7B,yEACE,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,EAC9B,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,qBACf,OAAO,EACvB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAC,IAAI,EACb,IAAI,EAAC,QAAQ,EACb,gBAAgB,EAAE,IAAI,CAAC,sBAAsB,GAC3B,CACf,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.scss?tag=nv-fielddropdownitemcheck","src/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.tsx"],"sourcesContent":["nv-fielddropdownitemcheck {\n slot-fb,\n span {\n all: unset;\n }\n\n cursor: pointer;\n display: flex;\n padding: var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);\n border-radius: var(--list-dropdown-item-radius);\n\n &:hover {\n background-color: var(--components-list-dropdown-item-background-hover);\n }\n}","import {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Element,\n} from '@stencil/core';\n\n@Component({\n tag: 'nv-fielddropdownitemcheck',\n styleUrl: 'nv-fielddropdownitemcheck.scss',\n shadow: false,\n})\nexport class NvFielddropdownitemcheck {\n @Element() el: HTMLNvFielddropdownitemcheckElement;\n\n /**************************************************************************/\n //#region PROPERTIES\n\n /\n * Indicates whether the checkbox is selected.\n /\n @Prop({ reflect: true, mutable: true })\n checked: boolean = false;\n\n /\n The value associated with this item.\n /\n @Prop({ reflect: true })\n readonly value?: string;\n\n /\n The label displayed alongside the checkbox.\n /\n @Prop({ reflect: true })\n readonly label?: string;\n\n /\n A description providing additional context or information about the\n * checkbox.\n /\n @Prop({ reflect: true })\n readonly description?: string;\n\n /\n The group this item belongs to, if applicable.\n /\n @Prop({ reflect: true })\n readonly group?: string;\n\n /\n Disables the item, preventing any user interaction.\n /\n @Prop({ reflect: true })\n readonly disabled: boolean = false;\n\n //#endregion PROPERTIES\n /*************************************************************************/\n //#region EVENTS\n\n /\n * Event emitted when the checkbox is toggled.\n * It provides details about the current state of the item.\n /\n @Event()\n itemChecked: EventEmitter<{\n /\n The value associated with this item\n /\n value: string \| undefined;\n /\n Whether the checkbox is currently checked\n /\n checked: boolean;\n /\n The group this item belongs to, if any\n /\n group?: string \| undefined;\n }>;\n\n /\n when the child <nv-fieldcheckbox> change its `checked` state,\n * update `this.checked` and emit `itemChecked`.\n * @param {CustomEvent<boolean>} event - The event emitted by the <nv-fieldcheckbox> component.\n /\n private onFieldcheckboxChanged = (event: CustomEvent<boolean>) => {\n if (this.disabled) return;\n // NvFieldcheckbox has emitted checkedChanged\n this.checked = event.detail; // get the new state\n this.itemChecked.emit({\n value: this.value,\n checked: this.checked,\n group: this.group,\n });\n };\n\n /* Make sure the checkbox is checked when clicked anywhere in the item. */\n private handleClick = () => {\n if (this.disabled) return;\n if (this.el.querySelector('input').checked) {\n this.checked = false;\n } else {\n this.checked = true;\n }\n };\n\n render() {\n return (\n <Host onClick={this.handleClick}>\n <nv-fieldcheckbox\n checked={this.checked}\n name={this.label \|\| this.value}\n label={this.label \|\| this.value}\n label-placement=\"after\"\n description={this.description}\n disabled={this.disabled}\n tabindex=\"-1\"\n role=\"option\"\n onCheckedChanged={this.onFieldcheckboxChanged}\n ></nv-fieldcheckbox>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"p-2012b8ba.js","mappings":";;;AAAA,MAAM,2BAA2B,GAAG,yWAAyW,CAAC;AAC9Y,uCAAe,2BAA2B;;MCc7B,wBAAwB;IALrC;;;;;;;;;QAeE,YAAO,GAAY,KAAK,CAAC;;;;QA+BhB,aAAQ,GAAY,KAAK,CAAC;;;;;;QA+B3B,2BAAsB,GAAG,CAAC,KAA2B;YAC3D,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;;YAE1B,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,MAAM,CAAC;YAC5B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;gBACpB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,KAAK,EAAE,IAAI,CAAC,KAAK;aAClB,CAAC,CAAC;SACJ,CAAC;;QAGM,gBAAW,GAAG;YACpB,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAC1B,IAAI,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE;gBAC1C,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;aACtB;iBAAM;gBACL,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;aACrB;SACF,CAAC;KAmBH;IAjBC,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,OAAO,EAAE,IAAI,CAAC,WAAW,IAC7B,yEACE,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,EAC9B,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,qBACf,OAAO,EACvB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAC,IAAI,EACb,IAAI,EAAC,QAAQ,EACb,gBAAgB,EAAE,IAAI,CAAC,sBAAsB,GAC3B,CACf,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.scss?tag=nv-fielddropdownitemcheck","src/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.tsx"],"sourcesContent":["nv-fielddropdownitemcheck {\n slot-fb,\n span {\n all: unset;\n }\n\n cursor: pointer;\n display: flex;\n padding: var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);\n border-radius: var(--list-dropdown-item-radius);\n\n &:hover {\n background-color: var(--components-list-dropdown-item-background-hover);\n }\n}","import {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Element,\n} from '@stencil/core';\n\n@Component({\n tag: 'nv-fielddropdownitemcheck',\n styleUrl: 'nv-fielddropdownitemcheck.scss',\n shadow: false,\n})\nexport class NvFielddropdownitemcheck {\n @Element() el: HTMLNvFielddropdownitemcheckElement;\n\n /**************************************************************************/\n //#region PROPERTIES\n\n /\n * Indicates whether the checkbox is selected.\n /\n @Prop({ reflect: true, mutable: true })\n checked: boolean = false;\n\n /\n The value associated with this item.\n /\n @Prop({ reflect: true })\n readonly value?: string;\n\n /\n The label displayed alongside the checkbox.\n /\n @Prop({ reflect: true })\n readonly label?: string;\n\n /\n A description providing additional context or information about the\n * checkbox.\n /\n @Prop({ reflect: true })\n readonly description?: string;\n\n /\n The group this item belongs to, if applicable.\n /\n @Prop({ reflect: true })\n readonly group?: string;\n\n /\n Disables the item, preventing any user interaction.\n /\n @Prop({ reflect: true })\n readonly disabled: boolean = false;\n\n //#endregion PROPERTIES\n /*************************************************************************/\n //#region EVENTS\n\n /\n * Event emitted when the checkbox is toggled.\n * It provides details about the current state of the item.\n /\n @Event()\n itemChecked: EventEmitter<{\n /\n The value associated with this item\n /\n value: string \| undefined;\n /\n Whether the checkbox is currently checked\n /\n checked: boolean;\n /\n The group this item belongs to, if any\n /\n group?: string \| undefined;\n }>;\n\n /\n when the child <nv-fieldcheckbox> change its `checked` state,\n * update `this.checked` and emit `itemChecked`.\n * @param {CustomEvent<boolean>} event - The event emitted by the <nv-fieldcheckbox> component.\n /\n private onFieldcheckboxChanged = (event: CustomEvent<boolean>) => {\n if (this.disabled) return;\n // NvFieldcheckbox has emitted checkedChanged\n this.checked = event.detail; // get the new state\n this.itemChecked.emit({\n value: this.value,\n checked: this.checked,\n group: this.group,\n });\n };\n\n /* Make sure the checkbox is checked when clicked anywhere in the item. */\n private handleClick = () => {\n if (this.disabled) return;\n if (this.el.querySelector('input').checked) {\n this.checked = false;\n } else {\n this.checked = true;\n }\n };\n\n render() {\n return (\n <Host onClick={this.handleClick}>\n <nv-fieldcheckbox\n checked={this.checked}\n name={this.label \|\| this.value}\n label={this.label \|\| this.value}\n label-placement=\"after\"\n description={this.description}\n disabled={this.disabled}\n tabindex=\"-1\"\n role=\"option\"\n onCheckedChanged={this.onFieldcheckboxChanged}\n ></nv-fieldcheckbox>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/{p-8674c7af.js → p-2d9ba7d3.js} RENAMED Viewed

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-1c45c0f2.js';
 import { B as ButtonType, a as ButtonSize } from './p-8348db09.js';
-import { d as defineCustomElement$1 } from './p-7b89fb48.js';
+import { d as defineCustomElement$1 } from './p-150daf68.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)}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;
@@ -143,7 +143,7 @@ const NvButton = /*@__PURE__*/ proxyCustomElement(class NvButton extends H {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '751fa0a552eaf13a193a15f9c9d6fe0c257b93e8', role: "button", tabindex: "0", onClick: this.handleButtonClick }, this.loading && (h("nv-loader", { key: 'ae8b39b13bfd6cd8a33f7a30afea19e426d0064d', size: this.size === ButtonSize.Large ? 'sm' : 'xs' })), h("slot", { key: 'e1a213305895c9b35d517bedce3a61f49e39642a', name: "leading-icon" }), h("slot", { key: '2e9e5ed4381790f3c1c06f1a4bf5f60bda79bd1c' }), h("slot", { key: 'e960ec4f4eca0a2a941ca7f3b96a4e31603fa633', name: "trailing-icon" })));
+        return (h(Host, { key: 'f8b20f9052d71f93eaf03f98550a7237225cadf2', role: "button", tabindex: "0", onClick: this.handleButtonClick }, this.loading && (h("nv-loader", { key: 'c1cefa72ee24dad9ce16bbfe1f51e6cec6dc7fbc', size: this.size === ButtonSize.Large ? 'sm' : 'xs' })), h("slot", { key: '36a311494e45ebc23b1133923a676d58e87f3800', name: "leading-icon" }), h("slot", { key: 'f6fea826cda9a09f7152f4e30cc6981c89e73ebe' }), h("slot", { key: 'd59c23ff85ea7efc16c69c5adbeb0e91786f1f68', name: "trailing-icon" })));
     }
     static get formAssociated() { return true; }
     get el() { return this; }
@@ -188,4 +188,4 @@ defineCustomElement();
 export { NvButton as N, defineCustomElement as d };
-//# sourceMappingURL=p-8674c7af.js.map
+//# sourceMappingURL=p-2d9ba7d3.js.map

package/dist/components/{p-8674c7af.js.map → p-2d9ba7d3.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~8674c7af~~.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}
1	+ {"file":"p-2d9ba7d3.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-5a5f11c2.js → p-373926aa.js} RENAMED Viewed

@@ -2,7 +2,7 @@ import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-
 import { c as clsx } from './p-8a1a6e56.js';
 import { u as useCollapse, t as timeline } from './p-42301d8f.js';
 import { u as useFade } from './p-1daca48a.js';
-import { d as defineCustomElement$1 } from './p-91b58443.js';
+import { d as defineCustomElement$1 } from './p-591730e7.js';
 const nvBadgeCss = "nv-badge{padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge.with-gap{padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content;gap:var(--badge-gap-x)}nv-badge.visually-hidden{position:absolute;padding:0;border:0;overflow:hidden;white-space:nowrap;width:1px;height:1px;margin:-1px;clip:rect(0, 0, 0, 0)}nv-badge:not(.with-gap){padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge.badge-1{color:var(--color-rainbow-1-text);background-color:var(--color-rainbow-1-background);border-color:var(--color-rainbow-1-border)}nv-badge.badge-1 .close:focus,nv-badge.badge-1 .close:focus-within{outline:none}nv-badge.badge-1 .close:focus-visible,nv-badge.badge-1 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-1-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-1 nv-icon{color:var(--color-rainbow-1-icon)}nv-badge.badge-2{color:var(--color-rainbow-2-text);background-color:var(--color-rainbow-2-background);border-color:var(--color-rainbow-2-border)}nv-badge.badge-2 .close:focus,nv-badge.badge-2 .close:focus-within{outline:none}nv-badge.badge-2 .close:focus-visible,nv-badge.badge-2 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-2-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-2 nv-icon{color:var(--color-rainbow-2-icon)}nv-badge.badge-3{color:var(--color-rainbow-3-text);background-color:var(--color-rainbow-3-background);border-color:var(--color-rainbow-3-border)}nv-badge.badge-3 .close:focus,nv-badge.badge-3 .close:focus-within{outline:none}nv-badge.badge-3 .close:focus-visible,nv-badge.badge-3 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-3-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-3 nv-icon{color:var(--color-rainbow-3-icon)}nv-badge.badge-4{color:var(--color-rainbow-4-text);background-color:var(--color-rainbow-4-background);border-color:var(--color-rainbow-4-border)}nv-badge.badge-4 .close:focus,nv-badge.badge-4 .close:focus-within{outline:none}nv-badge.badge-4 .close:focus-visible,nv-badge.badge-4 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-4-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-4 nv-icon{color:var(--color-rainbow-4-icon)}nv-badge.badge-5{color:var(--color-rainbow-5-text);background-color:var(--color-rainbow-5-background);border-color:var(--color-rainbow-5-border)}nv-badge.badge-5 .close:focus,nv-badge.badge-5 .close:focus-within{outline:none}nv-badge.badge-5 .close:focus-visible,nv-badge.badge-5 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-5-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-5 nv-icon{color:var(--color-rainbow-5-icon)}nv-badge.badge-6{color:var(--color-rainbow-6-text);background-color:var(--color-rainbow-6-background);border-color:var(--color-rainbow-6-border)}nv-badge.badge-6 .close:focus,nv-badge.badge-6 .close:focus-within{outline:none}nv-badge.badge-6 .close:focus-visible,nv-badge.badge-6 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-6-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-6 nv-icon{color:var(--color-rainbow-6-icon)}nv-badge.badge-7{color:var(--color-rainbow-7-text);background-color:var(--color-rainbow-7-background);border-color:var(--color-rainbow-7-border)}nv-badge.badge-7 .close:focus,nv-badge.badge-7 .close:focus-within{outline:none}nv-badge.badge-7 .close:focus-visible,nv-badge.badge-7 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-7-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-7 nv-icon{color:var(--color-rainbow-7-icon)}nv-badge.badge-8{color:var(--color-rainbow-8-text);background-color:var(--color-rainbow-8-background);border-color:var(--color-rainbow-8-border)}nv-badge.badge-8 .close:focus,nv-badge.badge-8 .close:focus-within{outline:none}nv-badge.badge-8 .close:focus-visible,nv-badge.badge-8 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-8-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-8 nv-icon{color:var(--color-rainbow-8-icon)}nv-badge.badge-9{color:var(--color-rainbow-9-text);background-color:var(--color-rainbow-9-background);border-color:var(--color-rainbow-9-border)}nv-badge.badge-9 .close:focus,nv-badge.badge-9 .close:focus-within{outline:none}nv-badge.badge-9 .close:focus-visible,nv-badge.badge-9 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-9-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-9 nv-icon{color:var(--color-rainbow-9-icon)}nv-badge.badge-10{color:var(--color-rainbow-10-text);background-color:var(--color-rainbow-10-background);border-color:var(--color-rainbow-10-border)}nv-badge.badge-10 .close:focus,nv-badge.badge-10 .close:focus-within{outline:none}nv-badge.badge-10 .close:focus-visible,nv-badge.badge-10 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-10-content);outline-offset:calc(var(--focus-outline-offset) * 0.2)}nv-badge.badge-10 nv-icon{color:var(--color-rainbow-10-icon)}nv-badge span{font-size:var(--font-size-xs);line-height:var(--line-height-xs) !important}nv-badge nv-icon>svg.icon-xs{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-sm{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-md{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-lg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-xl{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge .close{padding:0;line-height:0;border:none;background:none;cursor:pointer;color:inherit;display:inline-flex;align-items:center;aspect-ratio:1/1;border-radius:var(--radius-rounded-full)}";
 const NvBadgeStyle0 = nvBadgeCss;
@@ -174,4 +174,4 @@ defineCustomElement();
 export { NvBadge as N, defineCustomElement as d };
-//# sourceMappingURL=p-5a5f11c2.js.map
+//# sourceMappingURL=p-373926aa.js.map

package/dist/components/{p-5a5f11c2.js.map → p-373926aa.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-5a5f11c2.js","mappings":"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","names":[],"sources":["src/components/nv-badge/nv-badge.scss?tag=nv-badge","src/components/nv-badge/nv-badge.tsx"],"sourcesContent":["@use \"sass:map\";\n@use \"../nv-icon/styles/mixins\" as icon;\n@use \"../../styles/utils\" as utils;\n@import \"../../styles/focus-ring\";\n\n/* Variants /\n$badge-colors: (\"1\", \"2\", \"3\", \"4\", \"5\", \"6\", \"7\", \"8\", \"9\", \"10\");\n\n/ Define maps for color-related variables /\n$color-rainbow-text: (\n \"1\": var(--color-rainbow-1-text),\n \"2\": var(--color-rainbow-2-text),\n \"3\": var(--color-rainbow-3-text),\n \"4\": var(--color-rainbow-4-text),\n \"5\": var(--color-rainbow-5-text),\n \"6\": var(--color-rainbow-6-text),\n \"7\": var(--color-rainbow-7-text),\n \"8\": var(--color-rainbow-8-text),\n \"9\": var(--color-rainbow-9-text),\n \"10\": var(--color-rainbow-10-text)\n);\n\n$color-rainbow-icon: (\n \"1\": var(--color-rainbow-1-icon),\n \"2\": var(--color-rainbow-2-icon),\n \"3\": var(--color-rainbow-3-icon),\n \"4\": var(--color-rainbow-4-icon),\n \"5\": var(--color-rainbow-5-icon),\n \"6\": var(--color-rainbow-6-icon),\n \"7\": var(--color-rainbow-7-icon),\n \"8\": var(--color-rainbow-8-icon),\n \"9\": var(--color-rainbow-9-icon),\n \"10\": var(--color-rainbow-10-icon)\n);\n\n$color-rainbow-background: (\n \"1\": var(--color-rainbow-1-background),\n \"2\": var(--color-rainbow-2-background),\n \"3\": var(--color-rainbow-3-background),\n \"4\": var(--color-rainbow-4-background),\n \"5\": var(--color-rainbow-5-background),\n \"6\": var(--color-rainbow-6-background),\n \"7\": var(--color-rainbow-7-background),\n \"8\": var(--color-rainbow-8-background),\n \"9\": var(--color-rainbow-9-background),\n \"10\": var(--color-rainbow-10-background)\n);\n$color-rainbow-border: (\n \"1\": var(--color-rainbow-1-border),\n \"2\": var(--color-rainbow-2-border),\n \"3\": var(--color-rainbow-3-border),\n \"4\": var(--color-rainbow-4-border),\n \"5\": var(--color-rainbow-5-border),\n \"6\": var(--color-rainbow-6-border),\n \"7\": var(--color-rainbow-7-border),\n \"8\": var(--color-rainbow-8-border),\n \"9\": var(--color-rainbow-9-border),\n \"10\": var(--color-rainbow-10-border)\n);\n\n@mixin root-styles() {\n padding: var(--badge-padding-y) var(--badge-padding-x);\n display: inline-flex !important; // override the display: none in [hidden] css\n vertical-align: middle;\n align-items: center;\n border-radius: var(--radius-rounded-full);\n border-style: solid;\n border-width: 0.5px;\n height: fit-content;\n width: fit-content;\n}\n\n@mixin root-styles-with-gap() {\n @include root-styles();\n gap: var(--badge-gap-x);\n}\n\n@mixin badge-color($badge-number) {\n color: map.get($color-rainbow-text, $badge-number);\n background-color: map.get($color-rainbow-background, $badge-number);\n border-color: map.get($color-rainbow-border, $badge-number);\n .close {\n @include focus-ring(var(--color-rainbow-#{$badge-number}-content), 0.2);\n }\n}\n\n@mixin icon-color($badge-number) {\n color: map.get($color-rainbow-icon, $badge-number);\n}\n\n@mixin type-settings($font-size, $line-height) {\n font-size: var(--font-size-xs);\n line-height: var(--line-height-xs) !important;\n}\n\nnv-badge {\n @include root-styles();\n\n //gap styles\n &.with-gap {\n @include root-styles-with-gap();\n }\n\n &.visually-hidden {\n @include utils.visually-hidden();\n }\n\n &:not(.with-gap) {\n @include root-styles();\n }\n\n // color styles\n @each $i in $badge-colors {\n &.badge-#{$i} {\n @include badge-color($i);\n nv-icon {\n @include icon-color($i);\n }\n }\n }\n\n //label styles\n & span {\n @include type-settings(xs, xs);\n }\n\n // nv-icon styles\n & nv-icon > svg {\n @each $size, $config in icon.$size-variants {\n &.icon-#{$size} {\n @include icon.icon-size-and-stroke(\n map.get(map.get(icon.$size-variants, \"xs\"), size),\n map.get(map.get(icon.$size-variants, \"xs\"), stroke)\n );\n }\n }\n }\n\n .close {\n padding: 0;\n line-height: 0;\n border: none;\n background: none;\n cursor: pointer;\n color: inherit;\n display: inline-flex;\n align-items: center;\n aspect-ratio: 1/1;\n border-radius: var(--radius-rounded-full);\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Watch,\n Element,\n State,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { useFade, useCollapse, timeline } from '../../animations';\n\n/\n @slot leading-icon - Icon before the label.\n * @slot default - for custom content, for pure text use label instead.\n /\n@Component({\n tag: 'nv-badge',\n styleUrl: 'nv-badge.scss',\n shadow: false,\n})\nexport class NvBadge {\n @Element() ref: HTMLNvBadgeElement;\n\n /*************************************************************************/\n //#region DEPRECATED\n\n /\n * Whether the badge is dismissible.\n * @deprecated use dismissible instead.\n /\n @Prop({ reflect: true })\n readonly dismissal: boolean = false;\n\n /\n The icon to display in the badge.\n * @deprecated use leadIcon or slot=\"leading-icon\" instead.\n /\n @Prop({ reflect: true })\n readonly icon: string;\n\n /\n The location of the icon in the badge.\n * @deprecated only leadIcon now.\n /\n @Prop({ reflect: true })\n readonly iconLocation: 'left' \| 'right';\n\n //#endregion DEPRECATED\n /*************************************************************************/\n //#region PROPERTIES\n\n /\n * The color of the badge. Use a string between 1 to 10\n /\n @Prop({ reflect: true })\n readonly color?: string = '1';\n\n /\n Main content of the badge.\n /\n @Prop({ reflect: true })\n readonly label?: string \| null = null;\n\n /\n The lead icon of the badge.\n /\n @Prop({ reflect: true, mutable: true })\n leadIcon?: string \| null = null;\n\n /\n Whether the badge is dismissible.\n /\n @Prop({ reflect: true, mutable: true })\n dismissible: boolean = false;\n\n /\n Controls the visibility of the badge. Will animate with fade and collapse.\n /\n @Prop({ reflect: true, mutable: true })\n hidden: boolean = false; // eslint-disable-line @stencil-community/reserved-member-names\n @State()\n private _isHidden: boolean;\n\n /\n When true, the alert does not automatically close upon dismissing.\n * Useful for externally controlled component behavior.\n /\n @Prop({ reflect: true })\n readonly preventAutoClose: boolean = false;\n\n //#endregion PROPERTIES\n /*************************************************************************/\n //#region EVENTS\n\n /\n * Emitted when the badge is dismissed.\n /\n @Event()\n closeClicked: EventEmitter<MouseEvent>;\n\n /\n Emits when the 'hidden' prop changes, reflecting a change in visibility.\n * Passes hidden value to the detail.\n /\n @Event()\n hiddenChanged: EventEmitter<boolean>;\n\n /\n Emitted when the animations complete, detail includes the hidden value.\n /\n @Event()\n hiddenChangedComplete: EventEmitter<boolean>;\n\n //#endregion EVENTS\n /*************************************************************************/\n //#region WATCHERS\n\n /\n * Handles the dismissal prop change.\n * @param {boolean} dismissal - The new dismissal value.\n /\n @Watch('dismissal')\n handleDismissalChange(dismissal: boolean) {\n this.dismissible = dismissal;\n }\n\n /\n Handles the icon prop change.\n * @param {string} icon - The new icon value.\n /\n @Watch('icon')\n handleIconChange(icon: string) {\n this.leadIcon = icon;\n }\n\n /\n Handles the hidden prop change.\n * @param {boolean} hidden - The new hidden value.\n /\n @Watch('hidden')\n async handleHiddenChange(hidden: boolean) {\n this.hiddenChanged.emit(hidden);\n if (this._isHidden === true) this._isHidden = hidden;\n\n const { fadeIn, fadeOut } = useFade(this.ref, { duration: 150 });\n const { collapse, expand } = useCollapse(this.ref, { duration: 150 });\n\n if (hidden === true) await timeline(fadeOut, collapse).start();\n if (hidden === false) await timeline(expand, fadeIn).start();\n\n this.hiddenChangedComplete.emit(hidden);\n\n if (this._isHidden === false) this._isHidden = hidden;\n }\n\n //#endregion WATCHERS\n /*************************************************************************/\n //#region LIFECYCLE\n\n /\n * Component will load.\n /\n componentWillLoad() {\n if (this.dismissal) {\n this.dismissible = this.dismissal;\n }\n\n if (this.icon != null && this.icon != '') {\n this.leadIcon = this.icon;\n }\n\n if (this.hidden) {\n this._isHidden = true;\n const { setCollapsed } = useCollapse(this.ref);\n const { setFadeOut } = useFade(this.ref);\n\n setCollapsed();\n setFadeOut();\n }\n }\n\n //#endregion LIFECYCLE\n /*************************************************************************/\n //#region METHODS\n\n /\n * Handles the close button click.\n * @param {MouseEvent} originalEvent - The original event.\n /\n private readonly handleClose = (originalEvent?: MouseEvent) => {\n if (!this.preventAutoClose) {\n this.hidden = true;\n }\n\n this.closeClicked.emit(originalEvent);\n };\n\n //#endregion METHODS\n /***************************************************************************/\n //#region RENDER\n\n render() {\n return (\n <Host\n class={clsx(`badge-${this.color}`, {\n 'has-close': this.dismissible,\n 'with-gap': this.dismissible \|\| this.label,\n 'visually-hidden': this._isHidden,\n })}\n >\n <slot name=\"leading-icon\">\n {this.leadIcon && <nv-icon name={this.leadIcon} size=\"sm\"></nv-icon>}\n </slot>\n\n <slot>{this.label && <span>{this.label}</span>}</slot>\n\n {this.dismissible && (\n <button onClick={this.handleClose} class=\"close\" type=\"button\">\n <nv-icon name=\"x\" size=\"sm\" />\n </button>\n )}\n </Host>\n );\n }\n\n //#endregion RENDER\n}\n"],"version":3}
1	+ {"file":"p-373926aa.js","mappings":"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","names":[],"sources":["src/components/nv-badge/nv-badge.scss?tag=nv-badge","src/components/nv-badge/nv-badge.tsx"],"sourcesContent":["@use \"sass:map\";\n@use \"../nv-icon/styles/mixins\" as icon;\n@use \"../../styles/utils\" as utils;\n@import \"../../styles/focus-ring\";\n\n/* Variants /\n$badge-colors: (\"1\", \"2\", \"3\", \"4\", \"5\", \"6\", \"7\", \"8\", \"9\", \"10\");\n\n/ Define maps for color-related variables /\n$color-rainbow-text: (\n \"1\": var(--color-rainbow-1-text),\n \"2\": var(--color-rainbow-2-text),\n \"3\": var(--color-rainbow-3-text),\n \"4\": var(--color-rainbow-4-text),\n \"5\": var(--color-rainbow-5-text),\n \"6\": var(--color-rainbow-6-text),\n \"7\": var(--color-rainbow-7-text),\n \"8\": var(--color-rainbow-8-text),\n \"9\": var(--color-rainbow-9-text),\n \"10\": var(--color-rainbow-10-text)\n);\n\n$color-rainbow-icon: (\n \"1\": var(--color-rainbow-1-icon),\n \"2\": var(--color-rainbow-2-icon),\n \"3\": var(--color-rainbow-3-icon),\n \"4\": var(--color-rainbow-4-icon),\n \"5\": var(--color-rainbow-5-icon),\n \"6\": var(--color-rainbow-6-icon),\n \"7\": var(--color-rainbow-7-icon),\n \"8\": var(--color-rainbow-8-icon),\n \"9\": var(--color-rainbow-9-icon),\n \"10\": var(--color-rainbow-10-icon)\n);\n\n$color-rainbow-background: (\n \"1\": var(--color-rainbow-1-background),\n \"2\": var(--color-rainbow-2-background),\n \"3\": var(--color-rainbow-3-background),\n \"4\": var(--color-rainbow-4-background),\n \"5\": var(--color-rainbow-5-background),\n \"6\": var(--color-rainbow-6-background),\n \"7\": var(--color-rainbow-7-background),\n \"8\": var(--color-rainbow-8-background),\n \"9\": var(--color-rainbow-9-background),\n \"10\": var(--color-rainbow-10-background)\n);\n$color-rainbow-border: (\n \"1\": var(--color-rainbow-1-border),\n \"2\": var(--color-rainbow-2-border),\n \"3\": var(--color-rainbow-3-border),\n \"4\": var(--color-rainbow-4-border),\n \"5\": var(--color-rainbow-5-border),\n \"6\": var(--color-rainbow-6-border),\n \"7\": var(--color-rainbow-7-border),\n \"8\": var(--color-rainbow-8-border),\n \"9\": var(--color-rainbow-9-border),\n \"10\": var(--color-rainbow-10-border)\n);\n\n@mixin root-styles() {\n padding: var(--badge-padding-y) var(--badge-padding-x);\n display: inline-flex !important; // override the display: none in [hidden] css\n vertical-align: middle;\n align-items: center;\n border-radius: var(--radius-rounded-full);\n border-style: solid;\n border-width: 0.5px;\n height: fit-content;\n width: fit-content;\n}\n\n@mixin root-styles-with-gap() {\n @include root-styles();\n gap: var(--badge-gap-x);\n}\n\n@mixin badge-color($badge-number) {\n color: map.get($color-rainbow-text, $badge-number);\n background-color: map.get($color-rainbow-background, $badge-number);\n border-color: map.get($color-rainbow-border, $badge-number);\n .close {\n @include focus-ring(var(--color-rainbow-#{$badge-number}-content), 0.2);\n }\n}\n\n@mixin icon-color($badge-number) {\n color: map.get($color-rainbow-icon, $badge-number);\n}\n\n@mixin type-settings($font-size, $line-height) {\n font-size: var(--font-size-xs);\n line-height: var(--line-height-xs) !important;\n}\n\nnv-badge {\n @include root-styles();\n\n //gap styles\n &.with-gap {\n @include root-styles-with-gap();\n }\n\n &.visually-hidden {\n @include utils.visually-hidden();\n }\n\n &:not(.with-gap) {\n @include root-styles();\n }\n\n // color styles\n @each $i in $badge-colors {\n &.badge-#{$i} {\n @include badge-color($i);\n nv-icon {\n @include icon-color($i);\n }\n }\n }\n\n //label styles\n & span {\n @include type-settings(xs, xs);\n }\n\n // nv-icon styles\n & nv-icon > svg {\n @each $size, $config in icon.$size-variants {\n &.icon-#{$size} {\n @include icon.icon-size-and-stroke(\n map.get(map.get(icon.$size-variants, \"xs\"), size),\n map.get(map.get(icon.$size-variants, \"xs\"), stroke)\n );\n }\n }\n }\n\n .close {\n padding: 0;\n line-height: 0;\n border: none;\n background: none;\n cursor: pointer;\n color: inherit;\n display: inline-flex;\n align-items: center;\n aspect-ratio: 1/1;\n border-radius: var(--radius-rounded-full);\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Watch,\n Element,\n State,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { useFade, useCollapse, timeline } from '../../animations';\n\n/\n @slot leading-icon - Icon before the label.\n * @slot default - for custom content, for pure text use label instead.\n /\n@Component({\n tag: 'nv-badge',\n styleUrl: 'nv-badge.scss',\n shadow: false,\n})\nexport class NvBadge {\n @Element() ref: HTMLNvBadgeElement;\n\n /*************************************************************************/\n //#region DEPRECATED\n\n /\n * Whether the badge is dismissible.\n * @deprecated use dismissible instead.\n /\n @Prop({ reflect: true })\n readonly dismissal: boolean = false;\n\n /\n The icon to display in the badge.\n * @deprecated use leadIcon or slot=\"leading-icon\" instead.\n /\n @Prop({ reflect: true })\n readonly icon: string;\n\n /\n The location of the icon in the badge.\n * @deprecated only leadIcon now.\n /\n @Prop({ reflect: true })\n readonly iconLocation: 'left' \| 'right';\n\n //#endregion DEPRECATED\n /*************************************************************************/\n //#region PROPERTIES\n\n /\n * The color of the badge. Use a string between 1 to 10\n /\n @Prop({ reflect: true })\n readonly color?: string = '1';\n\n /\n Main content of the badge.\n /\n @Prop({ reflect: true })\n readonly label?: string \| null = null;\n\n /\n The lead icon of the badge.\n /\n @Prop({ reflect: true, mutable: true })\n leadIcon?: string \| null = null;\n\n /\n Whether the badge is dismissible.\n /\n @Prop({ reflect: true, mutable: true })\n dismissible: boolean = false;\n\n /\n Controls the visibility of the badge. Will animate with fade and collapse.\n /\n @Prop({ reflect: true, mutable: true })\n hidden: boolean = false; // eslint-disable-line @stencil-community/reserved-member-names\n @State()\n private _isHidden: boolean;\n\n /\n When true, the alert does not automatically close upon dismissing.\n * Useful for externally controlled component behavior.\n /\n @Prop({ reflect: true })\n readonly preventAutoClose: boolean = false;\n\n //#endregion PROPERTIES\n /*************************************************************************/\n //#region EVENTS\n\n /\n * Emitted when the badge is dismissed.\n /\n @Event()\n closeClicked: EventEmitter<MouseEvent>;\n\n /\n Emits when the 'hidden' prop changes, reflecting a change in visibility.\n * Passes hidden value to the detail.\n /\n @Event()\n hiddenChanged: EventEmitter<boolean>;\n\n /\n Emitted when the animations complete, detail includes the hidden value.\n /\n @Event()\n hiddenChangedComplete: EventEmitter<boolean>;\n\n //#endregion EVENTS\n /*************************************************************************/\n //#region WATCHERS\n\n /\n * Handles the dismissal prop change.\n * @param {boolean} dismissal - The new dismissal value.\n /\n @Watch('dismissal')\n handleDismissalChange(dismissal: boolean) {\n this.dismissible = dismissal;\n }\n\n /\n Handles the icon prop change.\n * @param {string} icon - The new icon value.\n /\n @Watch('icon')\n handleIconChange(icon: string) {\n this.leadIcon = icon;\n }\n\n /\n Handles the hidden prop change.\n * @param {boolean} hidden - The new hidden value.\n /\n @Watch('hidden')\n async handleHiddenChange(hidden: boolean) {\n this.hiddenChanged.emit(hidden);\n if (this._isHidden === true) this._isHidden = hidden;\n\n const { fadeIn, fadeOut } = useFade(this.ref, { duration: 150 });\n const { collapse, expand } = useCollapse(this.ref, { duration: 150 });\n\n if (hidden === true) await timeline(fadeOut, collapse).start();\n if (hidden === false) await timeline(expand, fadeIn).start();\n\n this.hiddenChangedComplete.emit(hidden);\n\n if (this._isHidden === false) this._isHidden = hidden;\n }\n\n //#endregion WATCHERS\n /*************************************************************************/\n //#region LIFECYCLE\n\n /\n * Component will load.\n /\n componentWillLoad() {\n if (this.dismissal) {\n this.dismissible = this.dismissal;\n }\n\n if (this.icon != null && this.icon != '') {\n this.leadIcon = this.icon;\n }\n\n if (this.hidden) {\n this._isHidden = true;\n const { setCollapsed } = useCollapse(this.ref);\n const { setFadeOut } = useFade(this.ref);\n\n setCollapsed();\n setFadeOut();\n }\n }\n\n //#endregion LIFECYCLE\n /*************************************************************************/\n //#region METHODS\n\n /\n * Handles the close button click.\n * @param {MouseEvent} originalEvent - The original event.\n /\n private readonly handleClose = (originalEvent?: MouseEvent) => {\n if (!this.preventAutoClose) {\n this.hidden = true;\n }\n\n this.closeClicked.emit(originalEvent);\n };\n\n //#endregion METHODS\n /***************************************************************************/\n //#region RENDER\n\n render() {\n return (\n <Host\n class={clsx(`badge-${this.color}`, {\n 'has-close': this.dismissible,\n 'with-gap': this.dismissible \|\| this.label,\n 'visually-hidden': this._isHidden,\n })}\n >\n <slot name=\"leading-icon\">\n {this.leadIcon && <nv-icon name={this.leadIcon} size=\"sm\"></nv-icon>}\n </slot>\n\n <slot>{this.label && <span>{this.label}</span>}</slot>\n\n {this.dismissible && (\n <button onClick={this.handleClose} class=\"close\" type=\"button\">\n <nv-icon name=\"x\" size=\"sm\" />\n </button>\n )}\n </Host>\n );\n }\n\n //#endregion RENDER\n}\n"],"version":3}

package/dist/components/{p-dcabc6fa.js → p-4d3ec142.js} RENAMED Viewed

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-1c45c0f2.js';
-import { d as defineCustomElement$1 } from './p-91b58443.js';
+import { d as defineCustomElement$1 } from './p-591730e7.js';
 const nvFielddropdownitemCss = "nv-fielddropdownitem{display:flex;gap:var(--spacing-2);flex-wrap:wrap;align-items:center;width:100%;padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);font-weight:var(--menu-contextual-item-font-weight);font-size:var(--list-dropdown-font-size);line-height:var(--list-dropdown-line-height);color:var(--components-list-dropdown-item-label-default);border-radius:var(--list-dropdown-item-radius);transition:background-color 150ms ease-out, color 150ms ease-out;cursor:pointer}nv-fielddropdownitem:hover,nv-fielddropdownitem:focus,nv-fielddropdownitem:focus-within{background-color:var(--components-list-dropdown-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-fielddropdownitem[disabled]:not([disabled=false]){cursor:not-allowed;background-color:unset;color:var(--components-menu-contextual-item-content-disabled)}nv-fielddropdownitem .text-wrapper{display:flex;flex-grow:1;align-items:center;justify-content:space-between}nv-fielddropdownitem [data-scope=text]{flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}nv-fielddropdownitem nv-icon[data-scope=selected]{color:var(--components-list-dropdown-item-label-default);align-self:center;margin-left:auto}";
 const NvFielddropdownitemStyle0 = nvFielddropdownitemCss;
@@ -58,7 +58,7 @@ const NvFielddropdownitem = /*@__PURE__*/ proxyCustomElement(class NvFielddropdo
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '228a213b0a8acb108676e412ed2aa8bcd3f2e88d', role: "menuitem", tabindex: '-1', onClick: this.handleSelected }, h("slot", { key: '4578676f2a58e9a3a3a5173ff4659ca8e65755df' }), !this.composed && (h("div", { key: 'a4f670296e56319007852726fd5fa3dca1ea3d04', class: "text-wrapper" }, h("span", { key: '2b69bca3ee6e1d7e8db57befdfb57bd27c096658', "data-scope": "text" }, this.label))), this.selected && (h("nv-icon", { key: '869900dc55ef7e35550d9de1aea06478e90ba890', name: "check", "aria-hidden": "true", "data-scope": "selected" }))));
+        return (h(Host, { key: '86699901e52c35392ae5e60013f542427973a626', role: "menuitem", tabindex: '-1', onClick: this.handleSelected }, h("slot", { key: 'f2d893f0692821fc0e918da9283eb174c3429173' }), !this.composed && (h("div", { key: '5e62842ee3b0e79333f99a3ec8d92dd843ebd96e', class: "text-wrapper" }, h("span", { key: 'baa00ac59b5d85d912f34fc16fbf82d87af849e2', "data-scope": "text" }, this.label))), this.selected && (h("nv-icon", { key: 'f9a5082e4cee6b68531809f9861e3da83b3001d6', name: "check", "aria-hidden": "true", "data-scope": "selected" }))));
     }
     get el() { return this; }
     static get style() { return NvFielddropdownitemStyle0; }
@@ -90,4 +90,4 @@ defineCustomElement();
 export { NvFielddropdownitem as N, defineCustomElement as d };
-//# sourceMappingURL=p-dcabc6fa.js.map
+//# sourceMappingURL=p-4d3ec142.js.map

package/dist/components/{p-dcabc6fa.js.map → p-4d3ec142.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"p-~~dcabc6fa~~.js","mappings":";;;AAAA,MAAM,sBAAsB,GAAG,utCAAutC,CAAC;AACvvC,kCAAe,sBAAsB;;MCkBxB,mBAAmB;IALhC;;;;QAOU,aAAQ,GAAG,KAAK,CAAC;;;;;;QAShB,aAAQ,GAAY,KAAK,CAAC;;;;QAM1B,aAAQ,GAAY,KAAK,CAAC;;;;QAuD3B,mBAAc,GAAG;YACvB,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAE1B,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC;gBAC7B,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,KAAK,EAAE,IAAI,CAAC,KAAK;aAClB,CAAC,CAAC;SACJ,CAAC;KAqCH;IA9DC,aAAa,CAAC,KAAoB;;QAChC,IAAI,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC,EAAE;YAAE,OAAO;QAErC,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE;YAC9C,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,cAAc,EAAE,CAAC;YAEtB,MAAA,MAAA,IAAI,CAAC,EAAE;iBACJ,OAAO,CAAC,kBAAkB,CAAC,0CAC1B,aAAa,CAAc,0BAA0B,CAAC,0CACtD,KAAK,EAAE,CAAC;SACb;KACF;;;;IAmBD,iBAAiB;;QACf,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;QACjD,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACf,MAAM,QAAQ,GAAG,MAAA,IAAI,CAAC,KAAK,mCAAI,IAAI,CAAC,EAAE,CAAC,WAAW,CAAC;YACnD,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;SAC3C;KACF;;;;IAMD,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,IAAI,EAAC,UAAU,EAAC,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,cAAc,IAChE,8DAAQ,EAEP,CAAC,IAAI,CAAC,QAAQ,KACb,4DAAK,KAAK,EAAC,cAAc,IACvB,2EAAiB,MAAM,IAAE,IAAI,CAAC,KAAK,CAAQ,CACvC,CACP,EAEA,IAAI,CAAC,QAAQ,KACZ,gEAAS,IAAI,EAAC,OAAO,iBAAa,MAAM,gBAAY,UAAU,GAAG,CAClE,CACI,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-fielddropdownitem/styles/nv-fielddropdownitem.scss?tag=nv-fielddropdownitem","src/components/nv-fielddropdownitem/nv-fielddropdownitem.tsx"],"sourcesContent":["@use \"./mixins\" as ;\n\nnv-fielddropdownitem {\n @include root-styles();\n\n &[disabled]:not([disabled='false']) {\n @include disabled-styles();\n }\n\n .text-wrapper {\n @include text-wrapper-styles();\n }\n\n [data-scope='text'] {\n @include text-styles();\n }\n\n nv-icon[data-scope='selected'] {\n @include selected-icon-styles();\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Element,\n Listen,\n} from '@stencil/core';\n\n/\n @slot default - The content to be displayed inside the dropdown item.\n /\n@Component({\n tag: 'nv-fielddropdownitem',\n styleUrl: 'styles/nv-fielddropdownitem.scss',\n shadow: false,\n})\nexport class NvFielddropdownitem {\n @Element() el: HTMLNvFielddropdownitemElement;\n private composed = false;\n\n /*************************************************************************/\n //#region PROPERTIES\n\n /\n * Disables the item, preventing any user interaction.\n /\n @Prop({ reflect: true })\n readonly disabled: boolean = false;\n\n /\n Indicates if the item is selected.\n /\n @Prop({ reflect: true })\n readonly selected: boolean = false;\n\n /\n Value associated with the item. This is recommended and required for proper\n * form management.\n /\n @Prop({ reflect: true, mutable: true })\n value?: string;\n\n /\n Specifies the text label for the dropdown item.\n \n When no default slot is provided, this label is rendered as the item's\n * visible text. If the default slot is supplied, the label isn’t directly\n * displayed but is used as the selected text (on the dropdown trigger). If\n * no label is explicitly set, the component will automatically derive the\n * label from the text content of the default slot.\n /\n @Prop({ reflect: true })\n readonly label?: string;\n\n //#endregion PROPERTIES\n /*************************************************************************/\n //#region EVENTS\n\n /\n * Event emitted when the dropdown item is selected.\n /\n @Event()\n dropdownItemSelected: EventEmitter<{\n /* The value associated with the item. /\n label?: string;\n /* The value associated with the item. /\n value: string;\n }>;\n\n @Listen('keydown', { passive: false })\n handleKeyDown(event: KeyboardEvent) {\n if (event.target !== this.el) return;\n\n if (event.key === 'Enter' \|\| event.key === ' ') {\n event.preventDefault();\n this.handleSelected();\n\n this.el\n .closest('nv-fielddropdown')\n ?.querySelector<HTMLElement>(\"[data-scope='focusable']\")\n ?.focus();\n }\n }\n\n //#endregion EVENTS\n /*************************************************************************/\n //#region METHODS\n\n private handleSelected = () => {\n if (this.disabled) return;\n\n this.dropdownItemSelected.emit({\n label: this.label,\n value: this.value,\n });\n };\n\n //#endregion METHODS\n /************************************************************************/\n //#region LIFECYCLE\n\n componentWillLoad() {\n this.composed = Boolean(this.el.children.length);\n if (!this.value) {\n const fallback = this.label ?? this.el.textContent;\n this.value = fallback.replace(/\\W+/g, ''); // Remove non-word characters\n }\n }\n\n //#endregion LIFECYCLE\n /**************************************************************************/\n //#region RENDER\n\n render() {\n return (\n <Host role=\"menuitem\" tabindex={'-1'} onClick={this.handleSelected}>\n <slot />\n\n {!this.composed && (\n <div class=\"text-wrapper\">\n <span data-scope=\"text\">{this.label}</span>\n </div>\n )}\n\n {this.selected && (\n <nv-icon name=\"check\" aria-hidden=\"true\" data-scope=\"selected\" />\n )}\n </Host>\n );\n }\n\n //#endregion RENDER\n}\n"],"version":3}
1	+ {"file":"p-4d3ec142.js","mappings":";;;AAAA,MAAM,sBAAsB,GAAG,utCAAutC,CAAC;AACvvC,kCAAe,sBAAsB;;MCkBxB,mBAAmB;IALhC;;;;QAOU,aAAQ,GAAG,KAAK,CAAC;;;;;;QAShB,aAAQ,GAAY,KAAK,CAAC;;;;QAM1B,aAAQ,GAAY,KAAK,CAAC;;;;QAuD3B,mBAAc,GAAG;YACvB,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAE1B,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC;gBAC7B,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,KAAK,EAAE,IAAI,CAAC,KAAK;aAClB,CAAC,CAAC;SACJ,CAAC;KAqCH;IA9DC,aAAa,CAAC,KAAoB;;QAChC,IAAI,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC,EAAE;YAAE,OAAO;QAErC,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,EAAE;YAC9C,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,IAAI,CAAC,cAAc,EAAE,CAAC;YAEtB,MAAA,MAAA,IAAI,CAAC,EAAE;iBACJ,OAAO,CAAC,kBAAkB,CAAC,0CAC1B,aAAa,CAAc,0BAA0B,CAAC,0CACtD,KAAK,EAAE,CAAC;SACb;KACF;;;;IAmBD,iBAAiB;;QACf,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;QACjD,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACf,MAAM,QAAQ,GAAG,MAAA,IAAI,CAAC,KAAK,mCAAI,IAAI,CAAC,EAAE,CAAC,WAAW,CAAC;YACnD,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC;SAC3C;KACF;;;;IAMD,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,IAAI,EAAC,UAAU,EAAC,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,cAAc,IAChE,8DAAQ,EAEP,CAAC,IAAI,CAAC,QAAQ,KACb,4DAAK,KAAK,EAAC,cAAc,IACvB,2EAAiB,MAAM,IAAE,IAAI,CAAC,KAAK,CAAQ,CACvC,CACP,EAEA,IAAI,CAAC,QAAQ,KACZ,gEAAS,IAAI,EAAC,OAAO,iBAAa,MAAM,gBAAY,UAAU,GAAG,CAClE,CACI,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-fielddropdownitem/styles/nv-fielddropdownitem.scss?tag=nv-fielddropdownitem","src/components/nv-fielddropdownitem/nv-fielddropdownitem.tsx"],"sourcesContent":["@use \"./mixins\" as ;\n\nnv-fielddropdownitem {\n @include root-styles();\n\n &[disabled]:not([disabled='false']) {\n @include disabled-styles();\n }\n\n .text-wrapper {\n @include text-wrapper-styles();\n }\n\n [data-scope='text'] {\n @include text-styles();\n }\n\n nv-icon[data-scope='selected'] {\n @include selected-icon-styles();\n }\n}\n","import {\n Component,\n Host,\n h,\n Prop,\n Event,\n EventEmitter,\n Element,\n Listen,\n} from '@stencil/core';\n\n/\n @slot default - The content to be displayed inside the dropdown item.\n /\n@Component({\n tag: 'nv-fielddropdownitem',\n styleUrl: 'styles/nv-fielddropdownitem.scss',\n shadow: false,\n})\nexport class NvFielddropdownitem {\n @Element() el: HTMLNvFielddropdownitemElement;\n private composed = false;\n\n /*************************************************************************/\n //#region PROPERTIES\n\n /\n * Disables the item, preventing any user interaction.\n /\n @Prop({ reflect: true })\n readonly disabled: boolean = false;\n\n /\n Indicates if the item is selected.\n /\n @Prop({ reflect: true })\n readonly selected: boolean = false;\n\n /\n Value associated with the item. This is recommended and required for proper\n * form management.\n /\n @Prop({ reflect: true, mutable: true })\n value?: string;\n\n /\n Specifies the text label for the dropdown item.\n \n When no default slot is provided, this label is rendered as the item's\n * visible text. If the default slot is supplied, the label isn’t directly\n * displayed but is used as the selected text (on the dropdown trigger). If\n * no label is explicitly set, the component will automatically derive the\n * label from the text content of the default slot.\n /\n @Prop({ reflect: true })\n readonly label?: string;\n\n //#endregion PROPERTIES\n /*************************************************************************/\n //#region EVENTS\n\n /\n * Event emitted when the dropdown item is selected.\n /\n @Event()\n dropdownItemSelected: EventEmitter<{\n /* The value associated with the item. /\n label?: string;\n /* The value associated with the item. /\n value: string;\n }>;\n\n @Listen('keydown', { passive: false })\n handleKeyDown(event: KeyboardEvent) {\n if (event.target !== this.el) return;\n\n if (event.key === 'Enter' \|\| event.key === ' ') {\n event.preventDefault();\n this.handleSelected();\n\n this.el\n .closest('nv-fielddropdown')\n ?.querySelector<HTMLElement>(\"[data-scope='focusable']\")\n ?.focus();\n }\n }\n\n //#endregion EVENTS\n /*************************************************************************/\n //#region METHODS\n\n private handleSelected = () => {\n if (this.disabled) return;\n\n this.dropdownItemSelected.emit({\n label: this.label,\n value: this.value,\n });\n };\n\n //#endregion METHODS\n /************************************************************************/\n //#region LIFECYCLE\n\n componentWillLoad() {\n this.composed = Boolean(this.el.children.length);\n if (!this.value) {\n const fallback = this.label ?? this.el.textContent;\n this.value = fallback.replace(/\\W+/g, ''); // Remove non-word characters\n }\n }\n\n //#endregion LIFECYCLE\n /**************************************************************************/\n //#region RENDER\n\n render() {\n return (\n <Host role=\"menuitem\" tabindex={'-1'} onClick={this.handleSelected}>\n <slot />\n\n {!this.composed && (\n <div class=\"text-wrapper\">\n <span data-scope=\"text\">{this.label}</span>\n </div>\n )}\n\n {this.selected && (\n <nv-icon name=\"check\" aria-hidden=\"true\" data-scope=\"selected\" />\n )}\n </Host>\n );\n }\n\n //#endregion RENDER\n}\n"],"version":3}

package/dist/components/{p-91b58443.js → p-591730e7.js} RENAMED Viewed

@@ -55,7 +55,7 @@ const NvIcon = /*@__PURE__*/ proxyCustomElement(class NvIcon extends H {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'a5d7dbfd9cf1be24ba19e8a8902a5a7adb89cc24', class: clsx(this.color && `${this.color}`), role: "img", "aria-label": `${this.name}-icon` }, h("svg", { key: 'b35bc42c038fd288022e13650556086d1dc3604d', stroke: "currentColor", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", class: `nv-icon-${this.size}` }, h("use", { key: '41833d3d27433422c859b513f28dc48a202d5919', href: `#${this.name}` }))));
+        return (h(Host, { key: '5d5988e7c0f49781b57b86da6e46e38eeac5ddae', class: clsx(this.color && `${this.color}`), role: "img", "aria-label": `${this.name}-icon` }, h("svg", { key: 'ab4007e92d6a13245293dbbb7dc746ab21cdbe33', stroke: "currentColor", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", class: `nv-icon-${this.size}` }, h("use", { key: 'c9cb4fea1695e81c4e9e775c217dfb9ac3b7c9ec', href: `#${this.name}` }))));
     }
     static get style() { return NvIconStyle0; }
 }, [0, "nv-icon", {
@@ -85,4 +85,4 @@ defineCustomElement();
 export { NvIcon as N, defineCustomElement as d };
-//# sourceMappingURL=p-91b58443.js.map
+//# sourceMappingURL=p-591730e7.js.map