npm - @nova-design-system/nova-webcomponents - Versions diffs - 3.2.0 → 3.4.0 - Mend

@nova-design-system/nova-webcomponents 3.2.0 → 3.4.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 (431) hide show

package/dist/collection/components/nv-fieldtime/nv-fieldtime.js CHANGED Viewed

@@ -970,26 +970,26 @@ export class NvFieldtime {
             }, key: `${option}-${index}`, onClick: e => this.handleTimeOptionClick(e, type) }, option)))));
     }
     render() {
-        return (h(Host, { key: 'f2e316b464ef324043fca47a25d7511fed662fe9', onclick: e => this.handleHostClick(e) }, (this.label || this.el.querySelector('[slot="label"]')) && (h("label", { key: '738dd3f9ba307a21ad7f16f77eb09f4f9fed8ccb', htmlFor: this.inputId }, h("slot", { key: '8106132899c67bbc7e9ffb82caf575d599239b9a', name: "label" }, this.label))), h("nv-popover", { key: '8306d0204039862466d83c7e5e2f42b87ea331c4', ref: el => (this.popoverElement = el), triggerMode: "controlled", placement: "bottom-start", open: this.open }, h("div", { key: '0355aee332a5c5cd2492f22b7d820625273c74e6', class: "input-wrapper", slot: "trigger" }, h("slot", { key: 'a6aaeaba4901b4fe0b0266796c84531d57fbb719', name: "before-input" }), h("div", { key: 'ae78ff8fc1a857a0da7be6e3c29464dbc0b80771', class: "input-container" }, h("slot", { key: '6455a51b2f1edf565ac754e61ac773a920f319d4', name: "leading-input" }), startsWithIgnoreCase(this.format, 'HH') && [
-            h("input", { key: '9a48b8ea04698b9443774a2e2bf41383144ba29a', ref: el => (this.inputElements[TimeType.Hours] = el), type: "number", autofocus: this.autofocus, class: "time-input", pattern: "[0-9]*", maxlength: "3", value: this.hours, onInput: e => this.handleInputChange(e, TimeType.Hours), placeholder: this.format.includes('hh') ? 'hh' : 'HH', inputMode: "numeric", onFocus: () => this.handleFocus(TimeType.Hours), name: this.name
+        return (h(Host, { key: 'c93db13f558128b6923ef9c0a5a96f3a1df15a23', onclick: e => this.handleHostClick(e) }, (this.label || this.el.querySelector('[slot="label"]')) && (h("label", { key: '3049f15468677e1214e627352e6d0c5bfedf2aa8', htmlFor: this.inputId }, h("slot", { key: '00291784c0f7074a9b6e42b9e884c58735fadee9', name: "label" }, this.label))), h("nv-popover", { key: '38d2995f5698c21cc8e10d02e57cf1c617188aed', ref: el => (this.popoverElement = el), triggerMode: "controlled", placement: "bottom-start", open: this.open }, h("div", { key: 'd71f02fb8cfd8c7ccd96e17e06ab6e930ae437a8', class: "input-wrapper", slot: "trigger" }, h("slot", { key: 'b4fa621c1189efb75d786e87d48eb6e754987358', name: "before-input" }), h("div", { key: '00d7bb6ae8945d946182fbe01faea79c4176b66a', class: "input-container" }, h("slot", { key: '6d5fc613e05a7a353f96fb6f8b30dd606627c742', name: "leading-input" }), startsWithIgnoreCase(this.format, 'HH') && [
+            h("input", { key: '4a062db12b9b750c6d327fcadff850571e92f674', ref: el => (this.inputElements[TimeType.Hours] = el), type: "number", autofocus: this.autofocus, class: "time-input", pattern: "[0-9]*", maxlength: "3", value: this.hours, onInput: e => this.handleInputChange(e, TimeType.Hours), placeholder: this.format.includes('hh') ? 'hh' : 'HH', inputMode: "numeric", onFocus: () => this.handleFocus(TimeType.Hours), name: this.name
                     ? `${TimeType.Hours}-${this.name}`
                     : TimeType.Hours, id: this.inputId, readonly: this.readonly, disabled: this.disabled, required: this.required, onKeyDown: e => this.handleKeyDown(e), onBlur: () => this.handleInputBlur() }),
         ], this.format.includes('mm') && [
-            h("span", { key: '5f75d09a90c0a8f6f106eb3e24f4f342fcc36d67' }, ":"),
-            h("input", { key: 'b3cc508705147ea07218a037f21f425deb9b94af', ref: el => (this.inputElements[TimeType.Minutes] = el), type: "number", autofocus: this.autofocus, class: "time-input", pattern: "[0-9]*", maxlength: "3", value: this.minutes, onInput: e => this.handleInputChange(e, TimeType.Minutes), placeholder: "mm", inputMode: "numeric", onFocus: () => this.handleFocus(TimeType.Minutes), name: this.name
+            h("span", { key: '629882cf244f54684e1997c7dd60d32deb5fad5a' }, ":"),
+            h("input", { key: '14ae0159a0e5d616d8734e12deffb0f392ee315a', ref: el => (this.inputElements[TimeType.Minutes] = el), type: "number", autofocus: this.autofocus, class: "time-input", pattern: "[0-9]*", maxlength: "3", value: this.minutes, onInput: e => this.handleInputChange(e, TimeType.Minutes), placeholder: "mm", inputMode: "numeric", onFocus: () => this.handleFocus(TimeType.Minutes), name: this.name
                     ? `${TimeType.Minutes}-${this.name}`
                     : TimeType.Minutes, id: `${this.inputId}-minutes`, readonly: this.readonly, disabled: this.disabled, required: this.required, onKeyDown: e => this.handleKeyDown(e), onBlur: () => this.handleInputBlur() }),
         ], this.format.includes('ss') && [
-            h("span", { key: '00b9320c275b027f9b2fbbebc1f56431783c874e' }, ":"),
-            h("input", { key: '3421fb11a4c9d9ba58bbf6f809070ce35d3d1ad6', ref: el => (this.inputElements[TimeType.Seconds] = el), type: "number", autofocus: this.autofocus, class: "time-input", pattern: "[0-9]*", maxlength: "3", value: this.seconds, onInput: e => this.handleInputChange(e, TimeType.Seconds), placeholder: "ss", inputMode: "numeric", onFocus: () => this.handleFocus(TimeType.Seconds), name: this.name
+            h("span", { key: '4d1fb67d409976c5510773c409441f330f627ea4' }, ":"),
+            h("input", { key: 'ea04cddd6f7534f88bc79f82ddcb4a111bffb492', ref: el => (this.inputElements[TimeType.Seconds] = el), type: "number", autofocus: this.autofocus, class: "time-input", pattern: "[0-9]*", maxlength: "3", value: this.seconds, onInput: e => this.handleInputChange(e, TimeType.Seconds), placeholder: "ss", inputMode: "numeric", onFocus: () => this.handleFocus(TimeType.Seconds), name: this.name
                     ? `${TimeType.Seconds}-${this.name}`
                     : TimeType.Seconds, id: `${this.inputId}-seconds`, readonly: this.readonly, disabled: this.disabled, required: this.required, onKeyDown: e => this.handleKeyDown(e), onBlur: () => this.handleInputBlur() }),
-        ], h("nv-iconbutton", { key: 'c61dc8780e1d668f2bf11ac2ace21b89ed460fdb', name: this.open ? 'chevron-top' : 'chevron-down', size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide time picker' : 'Show time picker', "aria-pressed": this.open.toString(), onClick: () => this.HandleDropdownIconClick() }), this.error && (h("nv-icon", { key: '5963651793c9c1ec5d47be2a8cea9fed22490bb9', name: "alert-circle", class: "validation", size: "sm" })), this.success && (h("nv-icon", { key: '79953118d4206363f97ffb8d69dd76545795e419', name: "circle-check", class: "validation", size: "sm" }))), h("slot", { key: 'd0a8c104a671f997e6a9da223baa2a37dd3bf349', name: "after-input" })), h("div", { key: '7dec8335599d59e116065bdb0053a9096acaae88', class: "time-dropdown", slot: "content" }, h("div", { key: 'be7d3a3fa7b4def66a7ebdf2f29b489540fa5802', class: "time-columns" }, startsWithIgnoreCase(this.format, 'HH') &&
+        ], h("nv-iconbutton", { key: '1eaf8a58a077bfd9c3d93f9277aa8db6e16cbc80', name: this.open ? 'chevron-top' : 'chevron-down', size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide time picker' : 'Show time picker', "aria-pressed": this.open.toString(), onClick: () => this.HandleDropdownIconClick() }), this.error && (h("nv-icon", { key: 'e3ce880982184b1d31f6a15163361997deca7ac6', name: "alert-circle", class: "validation", size: "sm" })), this.success && (h("nv-icon", { key: '6bcf818a4713e4420d79bf8b0f447ff41dfe5d6f', name: "circle-check", class: "validation", size: "sm" }))), h("slot", { key: '55538603473159890b542b3953b73c43bb8ff262', name: "after-input" })), h("div", { key: '577234c4d732118b059e5a5aa8626677f40ba864', class: "time-dropdown", slot: "content" }, h("div", { key: '25d144cb214a37420182e121078e9f690ee21271', class: "time-columns" }, startsWithIgnoreCase(this.format, 'HH') &&
             this.RenderTimeOptionsColumn(TimeType.Hours), this.format.includes('mm') &&
             this.RenderTimeOptionsColumn(TimeType.Minutes), this.format.includes('ss') &&
             this.RenderTimeOptionsColumn(TimeType.Seconds)))), (this.description ||
-            this.el.querySelector('[slot="description"]')) && (h("div", { key: 'ec98cc31482efab33ace4e0bf62c6d5d82890df5', class: "description" }, h("slot", { key: '307b134933cca699d6f00d891a440281f2427d79', name: "description" }, this.description))), (this.errorDescription ||
-            this.el.querySelector('[slot="error-description"]')) && (h("div", { key: '71763de75be4e9f14e1cd1788ca06f2265a46d7e', hidden: !this.error, class: "error-description" }, h("slot", { key: 'dbe05c00515a5ccf1b4ba4736b943cfd8cefaaa0', name: "error-description" }, this.errorDescription)))));
+            this.el.querySelector('[slot="description"]')) && (h("div", { key: '875466380478b23bbc56e661a93392b27fa7af7d', class: "description" }, h("slot", { key: 'ae870e00e1b92f44ea6a3e08b844b9de21060a01', name: "description" }, this.description))), (this.errorDescription ||
+            this.el.querySelector('[slot="error-description"]')) && (h("div", { key: 'aaca1281abe877b9696931d5cc1ab567441f3de9', hidden: !this.error, class: "error-description" }, h("slot", { key: '4e17b0085732e9a47c9637c4ad9b145b5a705e2a', name: "error-description" }, this.errorDescription)))));
     }
     static get is() { return "nv-fieldtime"; }
     static get formAssociated() { return true; }

package/dist/collection/components/nv-fieldtime/styles/nv-fieldtime.css CHANGED Viewed

@@ -5,6 +5,44 @@
  * Usage:
  * @include scrollbar();
  */
+/* TODO: integrate this logic in the proper structure */
+nv-fieldslider .slider-container .track-container:has(.thumb:hover) .track-range {
+  background: var(--components-slider-track-filled-hover);
+}
+nv-fieldslider .slider-container .track-container:has(.thumb:hover) .thumb {
+  border-color: var(--components-slider-track-filled-hover);
+}
+nv-fieldslider .slider-container .track-container:has(.thumb:focus) .track-range {
+  background: var(--components-slider-track-filled-focus);
+}
+nv-fieldslider .slider-container .track-container:has(.thumb:focus) .thumb {
+  border-color: var(--components-slider-track-filled-focus);
+}
+nv-fieldslider[error] .slider-container .track-container .track .track-range {
+  background: var(--components-slider-track-filled-error);
+}
+nv-fieldslider[error] .slider-container .track-container .track .thumb {
+  border-color: var(--components-slider-track-filled-error);
+}
+nv-fieldslider[error] .slider-container .track-container .track .thumb:hover {
+  border-color: var(--components-slider-track-filled-error);
+  outline: calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);
+  outline-offset: calc(var(--focus-outline-offset) * 1);
+  background-color: var(--components-slider-handler-background-error);
+}
+nv-fieldslider[error] .slider-container .track-container .track .thumb:focus {
+  border-color: var(--components-slider-track-filled-error);
+  outline: calc(var(--focus-outline-stroke) * 1) solid var(--components-slider-track-filled-error);
+  outline-offset: calc(var(--focus-outline-offset) * 1);
+  background-color: var(--components-slider-track-filled-error);
+}
+nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .track-range {
+  background: var(--components-slider-track-filled-error);
+}
+nv-fieldslider[error] .slider-container .track-container:has(.thumb:hover) .thumb {
+  border-color: var(--components-slider-track-filled-error);
+}
 nv-fieldtime {
   --nv-field-border-default: var(--components-form-field-border-default);
   --nv-field-border-hover: var(--components-form-field-border-hover);
@@ -131,6 +169,7 @@ nv-fieldtime .input-container input.time-input {
   font-weight: 500;
   line-height: var(--form-field-line-height);
   width: 100%;
+  /* Hide Edge built-in password reveal and clear icons */
   width: 100%;
   min-width: 24px;
   flex: 0 0 24px;
@@ -151,6 +190,11 @@ nv-fieldtime .input-container input.time-input::placeholder {
   font-weight: 400;
   line-height: var(--form-field-line-height);
 }
+nv-fieldtime .input-container input.time-input[type=password]::-ms-clear, nv-fieldtime .input-container input.time-input[type=password]::-ms-reveal {
+  display: none;
+  width: 0;
+  height: 0;
+}
 nv-fieldtime .input-container input.time-input::-webkit-inner-spin-button, nv-fieldtime .input-container input.time-input::-webkit-outer-spin-button {
   -webkit-appearance: none;
   margin: 0;

package/dist/collection/components/nv-icon/nv-icon.js CHANGED Viewed

@@ -48,7 +48,7 @@ export class NvIcon {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '107d58f8858951a11af7bc23be7ae8564ece6b15', class: clsx(this.color && `${this.color}`), role: "img", "aria-label": `${this.name}-icon` }, h("svg", { key: '3e7d4827757d59019b3661a5994d99c5eca995f2', 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: '0bc93cc49237854d5a8ca2bb50c25e7660c2dfa1', href: `#${this.name}` }))));
+        return (h(Host, { key: '26f1c3b326b50a317bfef8f8415fa76c28b08253', class: clsx(this.color && `${this.color}`), role: "img", "aria-label": `${this.name}-icon` }, h("svg", { key: '7a998a855a9526b9e86e0b19f4f03f8e0cdf235d', 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: '9f2681f14c37da95909b8dc6abcac22adf906a11', href: `#${this.name}` }))));
     }
     static get is() { return "nv-icon"; }
     static get originalStyleUrls() {

package/dist/collection/components/nv-iconbutton/nv-iconbutton.js CHANGED Viewed

@@ -111,7 +111,7 @@ export class NvIconbutton {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'eb27cfea5e30fa97e9950d76f3038dc9ff4f4116', role: "button", type: this.type, tabindex: "0", disabled: this.disabled ? true : undefined, class: clsx('root', `size-${this.size}`, `emphasis-${this.emphasis}`, this.loading && 'loading', `shape-${this.shape}`), onClick: this.handleClick }, this.loading && h("nv-loader", { key: '6f24a71b7ecab3168567a76b67f0b226f3afa9c3', size: this.size }), !this.loading && h("nv-icon", { key: 'f4a0eb19d8bc08a0c8dbc8cedca249bf417eeb1b', name: this.name, size: this.size }), h("slot", { key: '2994118659b1ad184a42ea4b20ea754427dae279' })));
+        return (h(Host, { key: '1536dd34c53c9eaf67914fcdf869a0274aa6cf87', role: "button", type: this.type, tabindex: "0", disabled: this.disabled ? true : undefined, class: clsx('root', `size-${this.size}`, `emphasis-${this.emphasis}`, this.loading && 'loading', `shape-${this.shape}`), onClick: this.handleClick }, this.loading && h("nv-loader", { key: '241d18417cd2c4a55c1dcc3fb328edfd8b95a95f', size: this.size }), !this.loading && h("nv-icon", { key: '1cadeaa79ff4992fb88b6703c4e7d6feee37440c', name: this.name, size: this.size }), h("slot", { key: '9d205fbc548c91990fac461f7722f69470b58913' })));
     }
     static get is() { return "nv-iconbutton"; }
     static get formAssociated() { return true; }

package/dist/collection/components/nv-loader/nv-loader.js CHANGED Viewed

@@ -16,7 +16,7 @@ export class NvLoader {
     //#region RENDER
     /* <slot> empty to force rendering change */
     render() {
-        return (h(Host, { key: '0048566e92b54cf51ef761b8cce814aab1f78707', class: clsx(this.size && `size-${this.size}`, this.color && `color-${this.color}`) }));
+        return (h(Host, { key: '5e3cf72314d0355d5a979cf1c8561312eed50644', class: clsx(this.size && `size-${this.size}`, this.color && `color-${this.color}`) }));
     }
     static get is() { return "nv-loader"; }
     static get originalStyleUrls() {

package/dist/collection/components/nv-menu/nv-menu.js CHANGED Viewed

@@ -189,7 +189,7 @@ export class NvMenu {
         });
     }
     render() {
-        return (h(Host, { key: '55cb23963aea78dabf518a9a54308391ed5c5dcb' }, h("slot", { key: 'b7bd9090491a34f3205afb8db8d7ca87864d0c04', name: "trigger" }), h("nv-popover", { key: '8b7e35e0b394827a5bd66858a4f3e81e90dcb597', ref: el => (this.popoverElement = el), triggerMode: "click", triggerElement: this.triggerElement, placement: this.placement, nested: this.nested, open: this.open }, this.items ? (h("ul", { slot: "content" }, this.renderMenuItems())) : (h("slot", { name: "content" })))));
+        return (h(Host, { key: 'e95adf4b7d951357f550a8084ce957c97134d58f' }, h("slot", { key: 'e2db24c208c716c24c3357c95983c87ee0f11d88', name: "trigger" }), h("nv-popover", { key: '735f6d29c7333293aea263eea751b021fbfd0943', ref: el => (this.popoverElement = el), triggerMode: "click", triggerElement: this.triggerElement, placement: this.placement, nested: this.nested, open: this.open }, this.items ? (h("ul", { slot: "content" }, this.renderMenuItems())) : (h("slot", { name: "content" })))));
     }
     static get is() { return "nv-menu"; }
     static get originalStyleUrls() {

package/dist/collection/components/nv-menuitem/nv-menuitem.js CHANGED Viewed

@@ -43,7 +43,7 @@ export class NvMenuitem {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'b1eeb8aaaab3daf8e247d2ca60ca4ea91828dc25', role: "menuitem", tabindex: this.disabled ? '-1' : '0' }, this.icon && h("nv-icon", { key: '48a9145eec4d5fd701fa975000bf29e4f8e7b018', name: this.icon }), h("slot", { key: 'a3212c6b899ce3dd2f538d8ea2163355ced9a57e' }), this.label && h("span", { key: '9b64bfabd9c2d2e25702e1e06f53dd76a1405a0e', "data-scope": "text" }, this.label), this.shortcut && !this.hasSubmenu && h("kbd", { key: 'adca0ce4f6c9c53f965d0d71b7f0a9d7675091b4' }, this.shortcut), this.hasSubmenu && h("nv-icon", { key: '5d55fc8fe1b1fc32fef9ee38b8dd53d7617ed0e0', name: "chevron-right" })));
+        return (h(Host, { key: '12438da400f424a313c213b0950fcca96fd42442', role: "menuitem", tabindex: this.disabled ? '-1' : '0' }, this.icon && h("nv-icon", { key: '83a86971ac01576cfbfbe3d07e39e0c54f813bde', name: this.icon }), h("slot", { key: '0b6fc3c1e0eaa6dedee1aa5c99fc39ee4899e400' }), this.label && h("span", { key: 'fb85b1ace8d7cd479c9f78d48950110fd592788d', "data-scope": "text" }, this.label), this.shortcut && !this.hasSubmenu && h("kbd", { key: 'fd42e2eb808d318a9f5e7aaa18da7f4e85293ec3' }, this.shortcut), this.hasSubmenu && h("nv-icon", { key: '51a5accbc105843b9e7a40209bd9139c16eec4b0', name: "chevron-right" })));
     }
     static get is() { return "nv-menuitem"; }
     static get originalStyleUrls() {

package/dist/collection/components/nv-popover/nv-popover.js CHANGED Viewed

@@ -48,7 +48,7 @@ export class NvPopover {
         /**
          * Sets how many pixels the popover should stay from the edge of the viewport.
          */
-        this.shiftPadding = 16;
+        this.shiftPadding = 0;
         /**
          * Use this to set a delay before the popover appears on hover. If the mouse
          * leaves before this time, the popover won't show. This only works when the
@@ -306,7 +306,7 @@ export class NvPopover {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'af402e7713ddfed886a9965c0bde847be7399f7e' }, h("slot", { key: 'bdef517573a37c420109712631120377fb862ab1', name: "trigger" }), h("div", { key: '8c2004b6d92bb09a1d19ea1f709b2f104695e111', "data-scope": "popover", hidden: true, ref: el => (this.popoverElement = el) }, this.hasArrow && (h("div", { key: '11d1b809fcdfddf55b471e12618ec4b8735d4a31', "data-scope": "arrow", ref: el => (this.arrowElement = el) })), h("slot", { key: '989d8f02e4044d4963d3152f137f691fd80ef818', name: "content" }))));
+        return (h(Host, { key: '3ab4e0f245ab925d2336f09b0cfa1c5c81a7eb32' }, h("slot", { key: '54d237432f4f69f517f0182e58a3e6d75c658382', name: "trigger" }), h("div", { key: 'ea6d9cedbade36ca48f9e72ec139720caeae1e35', "data-scope": "popover", hidden: true, ref: el => (this.popoverElement = el) }, this.hasArrow && (h("div", { key: 'f7cc6db85501f067317f66cc500b21e6571feeb6', "data-scope": "arrow", ref: el => (this.arrowElement = el) })), h("slot", { key: '2330178c2adfd93eea13286ec3efee5c495b2680', name: "content" }))));
     }
     static get is() { return "nv-popover"; }
     static get originalStyleUrls() {
@@ -510,7 +510,7 @@ export class NvPopover {
                 "setter": false,
                 "attribute": "shift-padding",
                 "reflect": true,
-                "defaultValue": "16"
+                "defaultValue": "0"
             },
             "enterDelay": {
                 "type": "number",

package/dist/collection/components/nv-popover/nv-popover.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"nv-popover.js","sourceRoot":"","sources":["../../../src/components/nv-popover/nv-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Prop,\n Host,\n h,\n EventEmitter,\n Event,\n Watch,\n Listen,\n Element,\n Method,\n} from '@stencil/core';\nimport {\n computePosition,\n flip,\n shift,\n offset,\n arrow,\n type Placement,\n} from '@floating-ui/dom';\nimport { createStore } from '@stencil/store';\n\nimport { useGrow, useFade } from '../../animations';\nimport {\n addEventListeners,\n removeEventListeners,\n type EventsAndListeners,\n} from '../../utils/events.utils';\n\nconst { state } = createStore<{\n /*\n A map of popover groups, used to manage the opening and closing of multiple\n /\n groups: Map<\n string,\n {\n /\n The popover element that opened the group.\n /\n openedBy: HTMLNvPopoverElement;\n }\n >;\n}>({\n groups: new Map(),\n});\n\n/\n @slot trigger - Content to be placed as the trigger.\n * @slot content - Content to be placed within the popover.\n /\n@Component({\n tag: 'nv-popover',\n styleUrl: 'nv-popover.scss',\n shadow: false,\n})\nexport class NvPopover {\n @Element() el: HTMLNvPopoverElement;\n private popoverElement!: HTMLDivElement;\n private arrowElement!: HTMLDivElement;\n private eventsAttached = false;\n\n /*************************************************************************/\n //#region PROPERTIES\n\n /\n * @internal\n * Accepts a reference to the DOM element acting as the popover trigger. This\n * should be used when the slot for the trigger is not defined.\n /\n @Prop({ reflect: false, mutable: true })\n triggerElement: Element;\n\n /\n Use this prop to toggle the visibility of the popover. Set to true to show\n * the popover and false to hide it.\n /\n @Prop({ reflect: true, mutable: true })\n open: boolean = false;\n\n /\n Sets the interaction mode for triggering the popover. Options include:\n * - `hover`: The popover is shown on trigger hover.\n * - `click`: The popover toggles on trigger click.\n * - `controlled`: The visibility is managed manually through methods or the\n * open prop.\n /\n @Prop({ reflect: true })\n readonly triggerMode: 'hover' \| 'click' \| 'controlled' = 'click';\n\n /\n Defines where the popover appears relative to the trigger.\n /\n @Prop({ reflect: true })\n readonly placement: Placement = 'bottom';\n\n /\n Use this to group popovers together so that opening one will not animate\n * the closing of another. This is helpful when popovers are placed close\n * together, preventing animation overlap.\n /\n @Prop({ reflect: true })\n readonly groupName: string;\n\n /\n Adjust the gap between the popover and its trigger element by setting how\n * many pixels they should be apart.\n /\n @Prop({ reflect: true })\n readonly offset: number = 6;\n\n /\n Use this to decide if the popover should include a small arrow pointing to\n * the trigger element, making the connection between them more clear.\n /\n @Prop({ reflect: true })\n readonly hasArrow: boolean = false;\n\n /\n Disables the automatic flipping of the popover when the trigger element is\n * out of the viewport. The popover will flip automatically by default.\n /\n @Prop({ reflect: true })\n readonly disableFlip: boolean = false;\n\n /\n Sets how many pixels the popover should stay from the edge of the viewport.\n /\n @Prop({ reflect: true })\n readonly shiftPadding: number = 16;\n\n /\n Use this to set a delay before the popover appears on hover. If the mouse\n * leaves before this time, the popover won't show. This only works when the\n * trigger mode is set to `hover`.\n /\n @Prop({ reflect: true })\n readonly enterDelay: number = 0;\n\n /\n Use this to set the popover to be nested inside another popover. This will\n * prevent the parent popover from closing when the child popover is opened.\n /\n @Prop({ reflect: true })\n readonly nested: boolean = false;\n\n //#endregion PROPERTIES\n /*************************************************************************/\n //#region METHODS\n\n /\n * Call this method to show the popover, making it visible on the screen.\n /\n @Method()\n async show() {\n this.open = true;\n }\n\n /\n Use this method to hide the popover, making it disappear from view.\n /\n @Method()\n async hide() {\n this.open = false;\n }\n\n /\n Call this method to toggle between showing and hiding the popover, based on\n * its current state.\n /\n @Method()\n async toggle() {\n this.open = !this.open;\n }\n\n /\n Attaches event listeners to the trigger element, and makes sure this only\n * happens once.\n /\n private attachEventListeners() {\n if (this.triggerElement && !this.eventsAttached) {\n addEventListeners(this.closeEvents, document, this);\n\n if (this.triggerMode === 'click') {\n addEventListeners(this.clickEvents, this.triggerElement, this);\n\n // Add document click and touch listeners\n addEventListeners(this.outsideClickEvents, document, this);\n }\n\n if (this.triggerMode === 'hover') {\n addEventListeners(this.hoverEvents, this.triggerElement, this);\n }\n this.eventsAttached = true;\n }\n }\n\n /\n Handles the click outside event.\n * @param {MouseEvent \| TouchEvent} event - The event object.\n /\n private handleClickOutside = (event: MouseEvent \| TouchEvent) => {\n // This popover should close when the user clicks outside of it.\n if (this.el.contains(event.target as Node)) return;\n if (this.triggerElement?.contains(event.target as Node)) return;\n this.open = false;\n };\n\n /\n Calculates the position of the popover relative to the trigger.\n * @docs https://floating-ui.com/docs/computePosition\n /\n private positionPopover() {\n if (!this.triggerElement) return;\n\n computePosition(this.triggerElement, this.popoverElement, {\n placement: this.placement,\n middleware: [\n offset(this.offset),\n !this.disableFlip &&\n flip({\n fallbackStrategy: 'bestFit',\n crossAxis: true,\n fallbackPlacements: ['bottom'],\n }),\n shift({ padding: this.shiftPadding }),\n this.hasArrow && arrow({ element: this.arrowElement }),\n ],\n }).then(({ x, y, placement, middlewareData }) => {\n Object.assign(this.popoverElement.style, {\n left: `${x}px`,\n top: `${y}px`,\n });\n\n if (this.hasArrow) {\n const staticSide = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n }[placement.split('-')[0]];\n\n const transform = {\n top: 'rotate(225deg)',\n right: 'rotate(315deg)',\n bottom: 'rotate(45deg)',\n left: 'rotate(135deg)',\n }[placement.split('-')[0]];\n\n const { x: arrowX, y: arrowY } = middlewareData.arrow;\n\n Object.assign(this.arrowElement.style, {\n left: arrowX != null ? `${arrowX}px` : '',\n top: arrowY != null ? `${arrowY}px` : '',\n right: '',\n bottom: '',\n transform,\n [staticSide]: '-4px',\n });\n }\n });\n }\n\n //#endregion METHODS\n /*************************************************************************/\n //#region EVENTS\n\n /\n * Emitted when the popover is toggled.\n * @bind open\n /\n @Event()\n openChanged: EventEmitter<boolean>;\n\n @Listen('openChanged', { target: 'document' })\n handleOpenChanged(event: CustomEvent<boolean>) {\n if (this.triggerMode === 'controlled') return;\n if (this.nested) return;\n if ((event.target as Element)?.hasAttribute('nested')) return;\n // This popover should close when another one is opened.\n if (event.target !== this.el && event.detail === true) this.open = false;\n }\n\n private clickEvents: EventsAndListeners = [\n ['click', () => (this.open = !this.open)],\n ];\n\n private outsideClickEvents: EventsAndListeners = [\n ['click', this.handleClickOutside],\n ['touchstart', this.handleClickOutside],\n ];\n\n private hideTimeout: ReturnType<typeof setTimeout>;\n private showTimeout: ReturnType<typeof setTimeout>;\n private hoverEvents: EventsAndListeners = [\n [\n 'focus',\n () => {\n clearTimeout(this.hideTimeout);\n this.showTimeout = setTimeout(\n () => (this.open = true),\n this.enterDelay,\n );\n },\n ],\n [\n 'blur',\n () => {\n clearTimeout(this.showTimeout);\n this.hideTimeout = setTimeout(() => (this.open = false), 50);\n },\n ],\n [\n 'mouseenter',\n () => {\n clearTimeout(this.hideTimeout);\n this.showTimeout = setTimeout(\n () => (this.open = true),\n this.enterDelay,\n );\n },\n ],\n [\n 'mouseleave',\n () => {\n clearTimeout(this.showTimeout);\n this.hideTimeout = setTimeout(() => (this.open = false), 100);\n },\n ],\n ];\n\n private closeEvents: EventsAndListeners = [\n [\n 'keydown',\n (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n this.open = false;\n }\n },\n ],\n ];\n\n //#endregion EVENTS\n /*************************************************************************/\n //#region WATCHERS\n private isAnimating = false;\n\n @Watch('open')\n async handleOpenChange(open: boolean) {\n // Prevent multiple animations from running at the same time.\n while (this.isAnimating) {\n await new Promise(resolve => setTimeout(resolve, 50));\n }\n\n this.isAnimating = true;\n\n const group = state.groups.get(this.groupName);\n const isOtherMemberOpen = group && group.openedBy !== this.el;\n const isThisMemberOpen = group && group.openedBy === this.el;\n\n if (open) this.popoverElement.style.removeProperty('display');\n if (isThisMemberOpen && !open) state.groups.delete(this.groupName);\n if (this.groupName && open)\n state.groups.set(this.groupName, { openedBy: this.el });\n\n const { growIn } = useGrow(this.popoverElement, {\n duration: isOtherMemberOpen ? 0 : 100,\n amount: 0.85,\n });\n\n const { fadeOut } = useFade(this.popoverElement, {\n duration: isOtherMemberOpen ? 0 : 100,\n });\n\n if (open === true) {\n this.popoverElement.removeAttribute('hidden');\n this.positionPopover();\n await growIn();\n }\n if (open === false) {\n await fadeOut();\n this.popoverElement.setAttribute('hidden', '');\n }\n\n this.isAnimating = false;\n this.openChanged.emit(open);\n }\n\n //#endregion WATCHERS\n /************************************************************************/\n //#region LIFECYCLE\n\n componentWillLoad() {\n if (!this.triggerElement)\n this.triggerElement = Array.from(this.el.children).find(\n child => child.getAttribute('slot') === 'trigger',\n );\n }\n\n componentWillUpdate() {\n this.attachEventListeners();\n }\n\n componentDidLoad() {\n // Initial inline style setup\n if (!this.open) {\n const { setGrowOut } = useGrow(this.popoverElement);\n setGrowOut();\n } else {\n const { setFadeIn } = useFade(this.popoverElement);\n setFadeIn();\n this.popoverElement.removeAttribute('hidden');\n }\n\n this.positionPopover();\n this.attachEventListeners();\n }\n\n disconnectedCallback() {\n removeEventListeners(this.closeEvents, document, this);\n\n if (this.triggerMode === 'click') {\n removeEventListeners(this.clickEvents, this.triggerElement, this);\n // Remove document listeners\n removeEventListeners(this.outsideClickEvents, document, this);\n }\n\n if (this.triggerMode === 'hover')\n removeEventListeners(this.hoverEvents, this.triggerElement, this);\n\n // Reset flag so events can be reattached if component is reconnected\n this.eventsAttached = false;\n\n // Clean up any pending timeouts\n if (this.hideTimeout) clearTimeout(this.hideTimeout);\n if (this.showTimeout) clearTimeout(this.showTimeout);\n }\n\n //#endregion LIFECYCLE\n /**************************************************************************/\n //#region RENDER\n\n render() {\n return (\n <Host>\n <slot name=\"trigger\"></slot>\n\n <div data-scope=\"popover\" hidden ref={el => (this.popoverElement = el)}>\n {this.hasArrow && (\n <div data-scope=\"arrow\" ref={el => (this.arrowElement = el)}></div>\n )}\n\n <slot name=\"content\"></slot>\n </div>\n </Host>\n );\n }\n\n //#endregion RENDER\n}\n"]}
1	+ {"version":3,"file":"nv-popover.js","sourceRoot":"","sources":["../../../src/components/nv-popover/nv-popover.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,CAAC,EAED,KAAK,EACL,KAAK,EACL,MAAM,EACN,OAAO,EACP,MAAM,GACP,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,eAAe,EACf,IAAI,EACJ,KAAK,EACL,MAAM,EACN,KAAK,GAEN,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AACpD,OAAO,EACL,iBAAiB,EACjB,oBAAoB,GAErB,MAAM,0BAA0B,CAAC;AAElC,MAAM,EAAE,KAAK,EAAE,GAAG,WAAW,CAa1B;IACD,MAAM,EAAE,IAAI,GAAG,EAAE;CAClB,CAAC,CAAC;AAEH;;;GAGG;AAMH,MAAM,OAAO,SAAS;IALtB;QASU,mBAAc,GAAG,KAAK,CAAC;QAa/B;;;WAGG;QAEH,SAAI,GAAY,KAAK,CAAC;QAEtB;;;;;;WAMG;QAEM,gBAAW,GAAqC,OAAO,CAAC;QAEjE;;WAEG;QAEM,cAAS,GAAc,QAAQ,CAAC;QAUzC;;;WAGG;QAEM,WAAM,GAAW,CAAC,CAAC;QAE5B;;;WAGG;QAEM,aAAQ,GAAY,KAAK,CAAC;QAEnC;;;WAGG;QAEM,gBAAW,GAAY,KAAK,CAAC;QAEtC;;WAEG;QAEM,iBAAY,GAAW,CAAC,CAAC;QAElC;;;;WAIG;QAEM,eAAU,GAAW,CAAC,CAAC;QAEhC;;;WAGG;QAEM,WAAM,GAAY,KAAK,CAAC;QAqDjC;;;WAGG;QACK,uBAAkB,GAAG,CAAC,KAA8B,EAAE,EAAE;;YAC9D,gEAAgE;YAChE,IAAI,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC;gBAAE,OAAO;YACnD,IAAI,MAAA,IAAI,CAAC,cAAc,0CAAE,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC;gBAAE,OAAO;YAChE,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;QACpB,CAAC,CAAC;QA6EM,gBAAW,GAAuB;YACxC,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SAC1C,CAAC;QAEM,uBAAkB,GAAuB;YAC/C,CAAC,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC;YAClC,CAAC,YAAY,EAAE,IAAI,CAAC,kBAAkB,CAAC;SACxC,CAAC;QAIM,gBAAW,GAAuB;YACxC;gBACE,OAAO;gBACP,GAAG,EAAE;oBACH,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;oBAC/B,IAAI,CAAC,WAAW,GAAG,UAAU,CAC3B,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,EACxB,IAAI,CAAC,UAAU,CAChB,CAAC;gBACJ,CAAC;aACF;YACD;gBACE,MAAM;gBACN,GAAG,EAAE;oBACH,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;oBAC/B,IAAI,CAAC,WAAW,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC;gBAC/D,CAAC;aACF;YACD;gBACE,YAAY;gBACZ,GAAG,EAAE;oBACH,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;oBAC/B,IAAI,CAAC,WAAW,GAAG,UAAU,CAC3B,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,EACxB,IAAI,CAAC,UAAU,CAChB,CAAC;gBACJ,CAAC;aACF;YACD;gBACE,YAAY;gBACZ,GAAG,EAAE;oBACH,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;oBAC/B,IAAI,CAAC,WAAW,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC,EAAE,GAAG,CAAC,CAAC;gBAChE,CAAC;aACF;SACF,CAAC;QAEM,gBAAW,GAAuB;YACxC;gBACE,SAAS;gBACT,CAAC,CAAgB,EAAE,EAAE;oBACnB,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;wBACvB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;oBACpB,CAAC;gBACH,CAAC;aACF;SACF,CAAC;QAEF,mBAAmB;QACnB,8EAA8E;QAC9E,kBAAkB;QACV,gBAAW,GAAG,KAAK,CAAC;KAkH7B;IAzTC,uBAAuB;IACvB,8EAA8E;IAC9E,iBAAiB;IAEjB;;OAEG;IAEH,KAAK,CAAC,IAAI;QACR,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACnB,CAAC;IAED;;OAEG;IAEH,KAAK,CAAC,IAAI;QACR,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IACpB,CAAC;IAED;;;OAGG;IAEH,KAAK,CAAC,MAAM;QACV,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;IACzB,CAAC;IAED;;;OAGG;IACK,oBAAoB;QAC1B,IAAI,IAAI,CAAC,cAAc,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;YAChD,iBAAiB,CAAC,IAAI,CAAC,WAAW,EAAE,QAAQ,EAAE,IAAI,CAAC,CAAC;YAEpD,IAAI,IAAI,CAAC,WAAW,KAAK,OAAO,EAAE,CAAC;gBACjC,iBAAiB,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,cAAc,EAAE,IAAI,CAAC,CAAC;gBAE/D,yCAAyC;gBACzC,iBAAiB,CAAC,IAAI,CAAC,kBAAkB,EAAE,QAAQ,EAAE,IAAI,CAAC,CAAC;YAC7D,CAAC;YAED,IAAI,IAAI,CAAC,WAAW,KAAK,OAAO,EAAE,CAAC;gBACjC,iBAAiB,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,cAAc,EAAE,IAAI,CAAC,CAAC;YACjE,CAAC;YACD,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC7B,CAAC;IACH,CAAC;IAaD;;;OAGG;IACK,eAAe;QACrB,IAAI,CAAC,IAAI,CAAC,cAAc;YAAE,OAAO;QAEjC,eAAe,CAAC,IAAI,CAAC,cAAc,EAAE,IAAI,CAAC,cAAc,EAAE;YACxD,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,UAAU,EAAE;gBACV,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC;gBACnB,CAAC,IAAI,CAAC,WAAW;oBACf,IAAI,CAAC;wBACH,gBAAgB,EAAE,SAAS;wBAC3B,SAAS,EAAE,IAAI;wBACf,kBAAkB,EAAE,CAAC,QAAQ,CAAC;qBAC/B,CAAC;gBACJ,KAAK,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,YAAY,EAAE,CAAC;gBACrC,IAAI,CAAC,QAAQ,IAAI,KAAK,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,YAAY,EAAE,CAAC;aACvD;SACF,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,cAAc,EAAE,EAAE,EAAE;YAC9C,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE;gBACvC,IAAI,EAAE,GAAG,CAAC,IAAI;gBACd,GAAG,EAAE,GAAG,CAAC,IAAI;aACd,CAAC,CAAC;YAEH,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAClB,MAAM,UAAU,GAAG;oBACjB,GAAG,EAAE,QAAQ;oBACb,KAAK,EAAE,MAAM;oBACb,MAAM,EAAE,KAAK;oBACb,IAAI,EAAE,OAAO;iBACd,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gBAE3B,MAAM,SAAS,GAAG;oBAChB,GAAG,EAAE,gBAAgB;oBACrB,KAAK,EAAE,gBAAgB;oBACvB,MAAM,EAAE,eAAe;oBACvB,IAAI,EAAE,gBAAgB;iBACvB,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gBAE3B,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,GAAG,cAAc,CAAC,KAAK,CAAC;gBAEtD,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE;oBACrC,IAAI,EAAE,MAAM,IAAI,IAAI,CAAC,CAAC,CAAC,GAAG,MAAM,IAAI,CAAC,CAAC,CAAC,EAAE;oBACzC,GAAG,EAAE,MAAM,IAAI,IAAI,CAAC,CAAC,CAAC,GAAG,MAAM,IAAI,CAAC,CAAC,CAAC,EAAE;oBACxC,KAAK,EAAE,EAAE;oBACT,MAAM,EAAE,EAAE;oBACV,SAAS;oBACT,CAAC,UAAU,CAAC,EAAE,MAAM;iBACrB,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC;IAcD,iBAAiB,CAAC,KAA2B;;QAC3C,IAAI,IAAI,CAAC,WAAW,KAAK,YAAY;YAAE,OAAO;QAC9C,IAAI,IAAI,CAAC,MAAM;YAAE,OAAO;QACxB,IAAI,MAAC,KAAK,CAAC,MAAkB,0CAAE,YAAY,CAAC,QAAQ,CAAC;YAAE,OAAO;QAC9D,wDAAwD;QACxD,IAAI,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC,EAAE,IAAI,KAAK,CAAC,MAAM,KAAK,IAAI;YAAE,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IAC3E,CAAC;IAmED,KAAK,CAAC,gBAAgB,CAAC,IAAa;QAClC,6DAA6D;QAC7D,OAAO,IAAI,CAAC,WAAW,EAAE,CAAC;YACxB,MAAM,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC,UAAU,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,CAAC;QACxD,CAAC;QAED,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;QAExB,MAAM,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC/C,MAAM,iBAAiB,GAAG,KAAK,IAAI,KAAK,CAAC,QAAQ,KAAK,IAAI,CAAC,EAAE,CAAC;QAC9D,MAAM,gBAAgB,GAAG,KAAK,IAAI,KAAK,CAAC,QAAQ,KAAK,IAAI,CAAC,EAAE,CAAC;QAE7D,IAAI,IAAI;YAAE,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC;QAC9D,IAAI,gBAAgB,IAAI,CAAC,IAAI;YAAE,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QACnE,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI;YACxB,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;QAE1D,MAAM,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,cAAc,EAAE;YAC9C,QAAQ,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;YACrC,MAAM,EAAE,IAAI;SACb,CAAC,CAAC;QAEH,MAAM,EAAE,OAAO,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,cAAc,EAAE;YAC/C,QAAQ,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;SACtC,CAAC,CAAC;QAEH,IAAI,IAAI,KAAK,IAAI,EAAE,CAAC;YAClB,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;YAC9C,IAAI,CAAC,eAAe,EAAE,CAAC;YACvB,MAAM,MAAM,EAAE,CAAC;QACjB,CAAC;QACD,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;YACnB,MAAM,OAAO,EAAE,CAAC;YAChB,IAAI,CAAC,cAAc,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;QACjD,CAAC;QAED,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;QACzB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC9B,CAAC;IAED,qBAAqB;IACrB,8EAA8E;IAC9E,mBAAmB;IAEnB,iBAAiB;QACf,IAAI,CAAC,IAAI,CAAC,cAAc;YACtB,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,IAAI,CACrD,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,SAAS,CAClD,CAAC;IACN,CAAC;IAED,mBAAmB;QACjB,IAAI,CAAC,oBAAoB,EAAE,CAAC;IAC9B,CAAC;IAED,gBAAgB;QACd,6BAA6B;QAC7B,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,MAAM,EAAE,UAAU,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;YACpD,UAAU,EAAE,CAAC;QACf,CAAC;aAAM,CAAC;YACN,MAAM,EAAE,SAAS,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;YACnD,SAAS,EAAE,CAAC;YACZ,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;QAChD,CAAC;QAED,IAAI,CAAC,eAAe,EAAE,CAAC;QACvB,IAAI,CAAC,oBAAoB,EAAE,CAAC;IAC9B,CAAC;IAED,oBAAoB;QAClB,oBAAoB,CAAC,IAAI,CAAC,WAAW,EAAE,QAAQ,EAAE,IAAI,CAAC,CAAC;QAEvD,IAAI,IAAI,CAAC,WAAW,KAAK,OAAO,EAAE,CAAC;YACjC,oBAAoB,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,cAAc,EAAE,IAAI,CAAC,CAAC;YAClE,4BAA4B;YAC5B,oBAAoB,CAAC,IAAI,CAAC,kBAAkB,EAAE,QAAQ,EAAE,IAAI,CAAC,CAAC;QAChE,CAAC;QAED,IAAI,IAAI,CAAC,WAAW,KAAK,OAAO;YAC9B,oBAAoB,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,cAAc,EAAE,IAAI,CAAC,CAAC;QAEpE,qEAAqE;QACrE,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAE5B,gCAAgC;QAChC,IAAI,IAAI,CAAC,WAAW;YAAE,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QACrD,IAAI,IAAI,CAAC,WAAW;YAAE,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IACvD,CAAC;IAED,sBAAsB;IACtB,8EAA8E;IAC9E,gBAAgB;IAEhB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,6DAAM,IAAI,EAAC,SAAS,GAAQ;YAE5B,0EAAgB,SAAS,EAAC,MAAM,QAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,cAAc,GAAG,EAAE,CAAC;gBACnE,IAAI,CAAC,QAAQ,IAAI,CAChB,0EAAgB,OAAO,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC,GAAQ,CACpE;gBAED,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGF","sourcesContent":["import {\n Component,\n Prop,\n Host,\n h,\n EventEmitter,\n Event,\n Watch,\n Listen,\n Element,\n Method,\n} from '@stencil/core';\nimport {\n computePosition,\n flip,\n shift,\n offset,\n arrow,\n type Placement,\n} from '@floating-ui/dom';\nimport { createStore } from '@stencil/store';\n\nimport { useGrow, useFade } from '../../animations';\nimport {\n addEventListeners,\n removeEventListeners,\n type EventsAndListeners,\n} from '../../utils/events.utils';\n\nconst { state } = createStore<{\n /*\n A map of popover groups, used to manage the opening and closing of multiple\n /\n groups: Map<\n string,\n {\n /\n The popover element that opened the group.\n /\n openedBy: HTMLNvPopoverElement;\n }\n >;\n}>({\n groups: new Map(),\n});\n\n/\n @slot trigger - Content to be placed as the trigger.\n * @slot content - Content to be placed within the popover.\n /\n@Component({\n tag: 'nv-popover',\n styleUrl: 'nv-popover.scss',\n shadow: false,\n})\nexport class NvPopover {\n @Element() el: HTMLNvPopoverElement;\n private popoverElement!: HTMLDivElement;\n private arrowElement!: HTMLDivElement;\n private eventsAttached = false;\n\n /*************************************************************************/\n //#region PROPERTIES\n\n /\n * @internal\n * Accepts a reference to the DOM element acting as the popover trigger. This\n * should be used when the slot for the trigger is not defined.\n /\n @Prop({ reflect: false, mutable: true })\n triggerElement: Element;\n\n /\n Use this prop to toggle the visibility of the popover. Set to true to show\n * the popover and false to hide it.\n /\n @Prop({ reflect: true, mutable: true })\n open: boolean = false;\n\n /\n Sets the interaction mode for triggering the popover. Options include:\n * - `hover`: The popover is shown on trigger hover.\n * - `click`: The popover toggles on trigger click.\n * - `controlled`: The visibility is managed manually through methods or the\n * open prop.\n /\n @Prop({ reflect: true })\n readonly triggerMode: 'hover' \| 'click' \| 'controlled' = 'click';\n\n /\n Defines where the popover appears relative to the trigger.\n /\n @Prop({ reflect: true })\n readonly placement: Placement = 'bottom';\n\n /\n Use this to group popovers together so that opening one will not animate\n * the closing of another. This is helpful when popovers are placed close\n * together, preventing animation overlap.\n /\n @Prop({ reflect: true })\n readonly groupName: string;\n\n /\n Adjust the gap between the popover and its trigger element by setting how\n * many pixels they should be apart.\n /\n @Prop({ reflect: true })\n readonly offset: number = 6;\n\n /\n Use this to decide if the popover should include a small arrow pointing to\n * the trigger element, making the connection between them more clear.\n /\n @Prop({ reflect: true })\n readonly hasArrow: boolean = false;\n\n /\n Disables the automatic flipping of the popover when the trigger element is\n * out of the viewport. The popover will flip automatically by default.\n /\n @Prop({ reflect: true })\n readonly disableFlip: boolean = false;\n\n /\n Sets how many pixels the popover should stay from the edge of the viewport.\n /\n @Prop({ reflect: true })\n readonly shiftPadding: number = 0;\n\n /\n Use this to set a delay before the popover appears on hover. If the mouse\n * leaves before this time, the popover won't show. This only works when the\n * trigger mode is set to `hover`.\n /\n @Prop({ reflect: true })\n readonly enterDelay: number = 0;\n\n /\n Use this to set the popover to be nested inside another popover. This will\n * prevent the parent popover from closing when the child popover is opened.\n /\n @Prop({ reflect: true })\n readonly nested: boolean = false;\n\n //#endregion PROPERTIES\n /*************************************************************************/\n //#region METHODS\n\n /\n * Call this method to show the popover, making it visible on the screen.\n /\n @Method()\n async show() {\n this.open = true;\n }\n\n /\n Use this method to hide the popover, making it disappear from view.\n /\n @Method()\n async hide() {\n this.open = false;\n }\n\n /\n Call this method to toggle between showing and hiding the popover, based on\n * its current state.\n /\n @Method()\n async toggle() {\n this.open = !this.open;\n }\n\n /\n Attaches event listeners to the trigger element, and makes sure this only\n * happens once.\n /\n private attachEventListeners() {\n if (this.triggerElement && !this.eventsAttached) {\n addEventListeners(this.closeEvents, document, this);\n\n if (this.triggerMode === 'click') {\n addEventListeners(this.clickEvents, this.triggerElement, this);\n\n // Add document click and touch listeners\n addEventListeners(this.outsideClickEvents, document, this);\n }\n\n if (this.triggerMode === 'hover') {\n addEventListeners(this.hoverEvents, this.triggerElement, this);\n }\n this.eventsAttached = true;\n }\n }\n\n /\n Handles the click outside event.\n * @param {MouseEvent \| TouchEvent} event - The event object.\n /\n private handleClickOutside = (event: MouseEvent \| TouchEvent) => {\n // This popover should close when the user clicks outside of it.\n if (this.el.contains(event.target as Node)) return;\n if (this.triggerElement?.contains(event.target as Node)) return;\n this.open = false;\n };\n\n /\n Calculates the position of the popover relative to the trigger.\n * @docs https://floating-ui.com/docs/computePosition\n /\n private positionPopover() {\n if (!this.triggerElement) return;\n\n computePosition(this.triggerElement, this.popoverElement, {\n placement: this.placement,\n middleware: [\n offset(this.offset),\n !this.disableFlip &&\n flip({\n fallbackStrategy: 'bestFit',\n crossAxis: true,\n fallbackPlacements: ['bottom'],\n }),\n shift({ padding: this.shiftPadding }),\n this.hasArrow && arrow({ element: this.arrowElement }),\n ],\n }).then(({ x, y, placement, middlewareData }) => {\n Object.assign(this.popoverElement.style, {\n left: `${x}px`,\n top: `${y}px`,\n });\n\n if (this.hasArrow) {\n const staticSide = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n }[placement.split('-')[0]];\n\n const transform = {\n top: 'rotate(225deg)',\n right: 'rotate(315deg)',\n bottom: 'rotate(45deg)',\n left: 'rotate(135deg)',\n }[placement.split('-')[0]];\n\n const { x: arrowX, y: arrowY } = middlewareData.arrow;\n\n Object.assign(this.arrowElement.style, {\n left: arrowX != null ? `${arrowX}px` : '',\n top: arrowY != null ? `${arrowY}px` : '',\n right: '',\n bottom: '',\n transform,\n [staticSide]: '-4px',\n });\n }\n });\n }\n\n //#endregion METHODS\n /*************************************************************************/\n //#region EVENTS\n\n /\n * Emitted when the popover is toggled.\n * @bind open\n /\n @Event()\n openChanged: EventEmitter<boolean>;\n\n @Listen('openChanged', { target: 'document' })\n handleOpenChanged(event: CustomEvent<boolean>) {\n if (this.triggerMode === 'controlled') return;\n if (this.nested) return;\n if ((event.target as Element)?.hasAttribute('nested')) return;\n // This popover should close when another one is opened.\n if (event.target !== this.el && event.detail === true) this.open = false;\n }\n\n private clickEvents: EventsAndListeners = [\n ['click', () => (this.open = !this.open)],\n ];\n\n private outsideClickEvents: EventsAndListeners = [\n ['click', this.handleClickOutside],\n ['touchstart', this.handleClickOutside],\n ];\n\n private hideTimeout: ReturnType<typeof setTimeout>;\n private showTimeout: ReturnType<typeof setTimeout>;\n private hoverEvents: EventsAndListeners = [\n [\n 'focus',\n () => {\n clearTimeout(this.hideTimeout);\n this.showTimeout = setTimeout(\n () => (this.open = true),\n this.enterDelay,\n );\n },\n ],\n [\n 'blur',\n () => {\n clearTimeout(this.showTimeout);\n this.hideTimeout = setTimeout(() => (this.open = false), 50);\n },\n ],\n [\n 'mouseenter',\n () => {\n clearTimeout(this.hideTimeout);\n this.showTimeout = setTimeout(\n () => (this.open = true),\n this.enterDelay,\n );\n },\n ],\n [\n 'mouseleave',\n () => {\n clearTimeout(this.showTimeout);\n this.hideTimeout = setTimeout(() => (this.open = false), 100);\n },\n ],\n ];\n\n private closeEvents: EventsAndListeners = [\n [\n 'keydown',\n (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n this.open = false;\n }\n },\n ],\n ];\n\n //#endregion EVENTS\n /*************************************************************************/\n //#region WATCHERS\n private isAnimating = false;\n\n @Watch('open')\n async handleOpenChange(open: boolean) {\n // Prevent multiple animations from running at the same time.\n while (this.isAnimating) {\n await new Promise(resolve => setTimeout(resolve, 50));\n }\n\n this.isAnimating = true;\n\n const group = state.groups.get(this.groupName);\n const isOtherMemberOpen = group && group.openedBy !== this.el;\n const isThisMemberOpen = group && group.openedBy === this.el;\n\n if (open) this.popoverElement.style.removeProperty('display');\n if (isThisMemberOpen && !open) state.groups.delete(this.groupName);\n if (this.groupName && open)\n state.groups.set(this.groupName, { openedBy: this.el });\n\n const { growIn } = useGrow(this.popoverElement, {\n duration: isOtherMemberOpen ? 0 : 100,\n amount: 0.85,\n });\n\n const { fadeOut } = useFade(this.popoverElement, {\n duration: isOtherMemberOpen ? 0 : 100,\n });\n\n if (open === true) {\n this.popoverElement.removeAttribute('hidden');\n this.positionPopover();\n await growIn();\n }\n if (open === false) {\n await fadeOut();\n this.popoverElement.setAttribute('hidden', '');\n }\n\n this.isAnimating = false;\n this.openChanged.emit(open);\n }\n\n //#endregion WATCHERS\n /************************************************************************/\n //#region LIFECYCLE\n\n componentWillLoad() {\n if (!this.triggerElement)\n this.triggerElement = Array.from(this.el.children).find(\n child => child.getAttribute('slot') === 'trigger',\n );\n }\n\n componentWillUpdate() {\n this.attachEventListeners();\n }\n\n componentDidLoad() {\n // Initial inline style setup\n if (!this.open) {\n const { setGrowOut } = useGrow(this.popoverElement);\n setGrowOut();\n } else {\n const { setFadeIn } = useFade(this.popoverElement);\n setFadeIn();\n this.popoverElement.removeAttribute('hidden');\n }\n\n this.positionPopover();\n this.attachEventListeners();\n }\n\n disconnectedCallback() {\n removeEventListeners(this.closeEvents, document, this);\n\n if (this.triggerMode === 'click') {\n removeEventListeners(this.clickEvents, this.triggerElement, this);\n // Remove document listeners\n removeEventListeners(this.outsideClickEvents, document, this);\n }\n\n if (this.triggerMode === 'hover')\n removeEventListeners(this.hoverEvents, this.triggerElement, this);\n\n // Reset flag so events can be reattached if component is reconnected\n this.eventsAttached = false;\n\n // Clean up any pending timeouts\n if (this.hideTimeout) clearTimeout(this.hideTimeout);\n if (this.showTimeout) clearTimeout(this.showTimeout);\n }\n\n //#endregion LIFECYCLE\n /**************************************************************************/\n //#region RENDER\n\n render() {\n return (\n <Host>\n <slot name=\"trigger\"></slot>\n\n <div data-scope=\"popover\" hidden ref={el => (this.popoverElement = el)}>\n {this.hasArrow && (\n <div data-scope=\"arrow\" ref={el => (this.arrowElement = el)}></div>\n )}\n\n <slot name=\"content\"></slot>\n </div>\n </Host>\n );\n }\n\n //#endregion RENDER\n}\n"]}

package/dist/collection/components/nv-row/nv-row.js CHANGED Viewed

@@ -6,7 +6,7 @@ export class NvRow {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'f5e01b297dcede0d11045bc52f7f75278bc66c43' }, h("slot", { key: '158a47218c5edff393c19207dbb7987a25779e6d' })));
+        return (h(Host, { key: '5cd3c7b2db57e433f37a086d0cda9bb0335c84fc' }, h("slot", { key: 'ca4003ec7100ee2979ba7b00352c19ecf1d62e05' })));
     }
     static get is() { return "nv-row"; }
     static get originalStyleUrls() {

package/dist/collection/components/nv-stack/nv-stack.js CHANGED Viewed

@@ -18,7 +18,7 @@ export class NvStack {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'bc18faae4116df9b3a2f944b97c5e5cf096654ae', class: clsx(this.fill && 'nv-stack-fill', this.flex && 'nv-stack-flex', this.full && 'w-full', this.gutter && !this.vertical && `gap-x-${this.gutter}`, this.gutter && this.vertical && `gap-y-${this.gutter}`, this.vertical && 'nv-stack-vertical') }, h("slot", { key: 'fe3a07a01bd3a5898bcd1533c7966241cff21b44' })));
+        return (h(Host, { key: '61662dda82c5191e4d90098e10d01bad6524e8c7', class: clsx(this.fill && 'nv-stack-fill', this.flex && 'nv-stack-flex', this.full && 'w-full', this.gutter && !this.vertical && `gap-x-${this.gutter}`, this.gutter && this.vertical && `gap-y-${this.gutter}`, this.vertical && 'nv-stack-vertical') }, h("slot", { key: '7ee777cdebbfe9d4f6438a2a79407d9f670f2885' })));
     }
     static get is() { return "nv-stack"; }
     static get originalStyleUrls() {

package/dist/collection/components/nv-table/nv-table.js CHANGED Viewed

@@ -314,14 +314,14 @@ export class NvTable {
         const rows = !this.table || this.table === undefined || this.parsedData.length === 0
             ? []
             : this.table.data;
-        return (h(Host, { key: 'b1df9cabce9289f174177a6b28851c3fa4788529' }, h("div", { key: '5e27d3ad0d34f64c9e9b5c9f43ac025603c08530', class: "hidden" }, h("slot", { key: 'aaef162487498f64c21fb1071b2863e8fa4e5a5c' })), h("slot", { key: '34325af8079d76a7599c1c4516fa8f371ce2fe75', name: "before" }), this.parsedColumns.length === 0 && this.parsedData.length === 0 ? (h("div", { class: "no-data" }, this.noColumnsNoDataMessage)) : (h("table", { class: "table" }, this.parsedColumns.length > 0 && headerGroups.length > 0 && (h("thead", { class: "table-header" }, h("tr", null, headerGroups &&
+        return (h(Host, { key: '510ea0b8404254faa7b2add62884da77232bf13d' }, h("div", { key: '482a3cfb6fb948d7280b7c0ea70035a9c6385615', class: "hidden" }, h("slot", { key: 'da7aa706d453676212e260e9454ed4e5143f2ccc' })), h("slot", { key: '78054c9a10623c82d7cc7fef5619053c89b70944', name: "before" }), this.parsedColumns.length === 0 && this.parsedData.length === 0 ? (h("div", { class: "no-data" }, this.noColumnsNoDataMessage)) : (h("table", { class: "table" }, this.parsedColumns.length > 0 && headerGroups.length > 0 && (h("thead", { class: "table-header" }, h("tr", null, headerGroups &&
             headerGroups.map(col => {
                 return (h("th", { key: col.name }, this.renderTemplate(this.headerTemplateCache.get(col.name), {}) || col.header));
             })))), h("tbody", { class: "table-body" }, !rows || rows.length === 0 ? (h("tr", null, h("td", { colSpan: headerGroups.length || 12, class: "no-data" }, this.noDataMessage))) : (rows.map(row => (h("tr", { key: JSON.stringify(row) }, headerGroups.map(col => {
             var _a;
             return (h("td", null, this.renderTemplate(this.templateCache.get(col.name), row) ||
                 ((_a = row[col.name]) !== null && _a !== void 0 ? _a : this.fallbackValue)));
-        })))))))), h("slot", { key: '49cdd7614ab002f5a3de09d414df6bb46c72a28f', name: "after" })));
+        })))))))), h("slot", { key: '8e5b8eee3870e0d38944370a3d9500f641914935', name: "after" })));
     }
     static get is() { return "nv-table"; }
     static get originalStyleUrls() {

package/dist/collection/components/nv-toggle/nv-toggle.js CHANGED Viewed

@@ -60,8 +60,8 @@ export class NvToggle {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'cb88cfea301859b05adedf15690027b21cd4837e', class: clsx(this.labelPlacement === 'before' && 'label-placement-before') }, h("div", { key: '307011c7dcbbe5a6dfc9b2bc1a5bd9842b99f68c', class: "input-container" }, h("input", { key: 'ff87395a3a737a1daaae243176975856a571cac1', type: "checkbox", id: this.inputId, name: this.name, autocomplete: "off", value: this.value, checked: Boolean(this.checked), disabled: this.disabled || this.readonly, readonly: this.readonly })), h("div", { key: 'c190ac33b861a5f92869c83249b441e243b2ee21', class: "text-container" }, (this.label || this.el.querySelector('[slot="label"]')) && (h("label", { key: 'cfd87cc4e3c68bedf4729a0b62f192077c4b4813', htmlFor: this.inputId, class: clsx(this.hideLabel && 'visually-hidden') }, h("slot", { key: '81de13cc0e98b4bdb494cc20fb1af59be66952b0', name: "label" }, this.label))), (this.description ||
-            this.el.querySelector('[slot="description"]')) && (h("div", { key: '69647c010b34a94afb215f9e56b5fba0bd114581', class: "description" }, h("slot", { key: 'ecf7b68b862976907c2d4605a65ee24875b926d3', name: "description" }, this.description))))));
+        return (h(Host, { key: '4c1b964876714244584d1dd4e949cf920312d0bf', class: clsx(this.labelPlacement === 'before' && 'label-placement-before') }, h("div", { key: 'b593008916115afefa8eebeaffde07c3a576089b', class: "input-container" }, h("input", { key: '20783b13ea6e1b427fd79db1ff46d5685e7c7d89', type: "checkbox", id: this.inputId, name: this.name, autocomplete: "off", value: this.value, checked: Boolean(this.checked), disabled: this.disabled || this.readonly, readonly: this.readonly })), h("div", { key: 'b2c9e1d17dbf53a42fdd0612c1ba507ea15c2775', class: "text-container" }, (this.label || this.el.querySelector('[slot="label"]')) && (h("label", { key: 'd5ac7d57befa88f4b1fa752d95dce9ea50db577c', htmlFor: this.inputId, class: clsx(this.hideLabel && 'visually-hidden') }, h("slot", { key: '63817f8322de43590bd2052d3695a3e090c466bc', name: "label" }, this.label))), (this.description ||
+            this.el.querySelector('[slot="description"]')) && (h("div", { key: 'f33e45707f6cde570f7d4e3f44aece36413cf7c8', class: "description" }, h("slot", { key: '3dcbe64426121cd2541fc545606f1b1381d51fdf', name: "description" }, this.description))))));
     }
     static get is() { return "nv-toggle"; }
     static get formAssociated() { return true; }

package/dist/collection/components/nv-tooltip/nv-tooltip.js CHANGED Viewed

@@ -31,7 +31,7 @@ export class NvTooltip {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '893071a64f973b33dccbf3acec95db46e592b717' }, h("slot", { key: '010776550ed5f942c02540b12756f0c0f64e31c4' }), h("nv-popover", { key: '21a669333da9e55b697f8a0b0962a8328beac55a', triggerMode: "hover", hasArrow: true, placement: this.placement, triggerElement: this.triggerElement, groupName: 'tooltip', enterDelay: this.enterDelay }, h("p", { key: 'ed89d0bfe1e9e8d12e33e3d7fb0f5b7f2685bbb9', slot: "content" }, this.message), h("slot", { key: 'fa2d9602e003f1da5c3d23156db7b2ac482966bd', name: "content" }))));
+        return (h(Host, { key: '34431c56ab8f0d9581d7bae170eea34972594a3c' }, h("slot", { key: '0e9b3492b07b23e3eb5e7475d174aca7f3d18cdb' }), h("nv-popover", { key: '2a3eccd8a928114ad8df6ce67a19948fab772654', triggerMode: "hover", hasArrow: true, placement: this.placement, triggerElement: this.triggerElement, groupName: 'tooltip', enterDelay: this.enterDelay }, h("p", { key: '286fad171703def16f9a1b95f2e8dc01afc062a0', slot: "content" }, this.message), h("slot", { key: '502d9abb156d4a40f36f442a6629e08b754a983f', name: "content" }))));
     }
     static get is() { return "nv-tooltip"; }
     static get originalStyleUrls() {

package/dist/collection/templates/navigation.docs.js CHANGED Viewed

@@ -20,7 +20,7 @@ const NavigationDocs = {
         {
             name: 'Sidenav',
             description: 'A Navigation bar using Tailwind CSS for styling. It’s easy to jump between sections like the Home page, Dashboard, Projects, and Tasks. Each tab has its own icon and a clear border that shows you which one’s active.',
-            template: (h("nav", { "data-class": "nv-sidenav flex flex-1 flex-col" }, h("ul", { role: "list", class: "flex flex-1 flex-col gap-y-0.5" }, h("li", null, h("a", { href: "/login", "data-class": "nv-link" }, h("nv-icon", { role: "img", "aria-label": "home-icon", name: "home", size: "md" }), "Home")), h("li", null, h("a", { href: "/form", "data-class": "nv-link active" }, h("nv-icon", { role: "img", "aria-label": "layout-dashboard-icon", name: "layout-dashboard", size: "md" }), "Dashboard")), h("li", { "data-class": "collapsible" }, h("a", { href: "/typo", "data-class": "nv-link" }, h("span", { "data-class": "flex items-center gap-x-2" }, h("nv-icon", { role: "img", "aria-label": "stack-icon", name: "stack", size: "md" }), "Projects"), h("nv-iconbutton", { "data-class": "nv-iconbutton", size: "md", name: "chevron-down", emphasis: "lower" }))), h("li", null, h("a", { href: "#", "data-class": "nv-link" }, h("nv-icon", { role: "img", "aria-label": "checklist-icon", name: "checklist", size: "md" }), "Tasks")), h("li", null, h("a", { href: "#", "data-class": "nv-link" }, h("nv-icon", { role: "img", "aria-label": "notebook-icon", name: "notebook", size: "md" }), "Documentation")), h("li", null, h("a", { href: "#", "data-class": "nv-link" }, h("nv-icon", { role: "img", "aria-label": "headset-icon", name: "headset", size: "md" }), "Support")), h("li", null, h("a", { href: "#", "data-class": "nv-link disabled" }, h("nv-icon", { role: "img", "aria-label": "contract-icon", name: "contract", size: "md" }), "Contracts"))))),
+            template: (h("nav", { "data-class": "nv-sidenav flex flex-1 flex-col" }, h("ul", { role: "list", "data-class": "flex flex-1 flex-col gap-y-0.5" }, h("li", null, h("a", { href: "/login", "data-class": "nv-link" }, h("nv-icon", { role: "img", "aria-label": "home-icon", name: "home", size: "md" }), "Home")), h("li", null, h("a", { href: "/form", "data-class": "nv-link active" }, h("nv-icon", { role: "img", "aria-label": "layout-dashboard-icon", name: "layout-dashboard", size: "md" }), "Dashboard")), h("li", { "data-class": "collapsible" }, h("a", { href: "/typo", "data-class": "nv-link" }, h("span", { "data-class": "flex items-center gap-x-2" }, h("nv-icon", { role: "img", "aria-label": "stack-icon", name: "stack", size: "md" }), "Projects"), h("nv-iconbutton", { "data-class": "nv-iconbutton", size: "md", name: "chevron-down", emphasis: "lower" }))), h("li", null, h("a", { href: "#", "data-class": "nv-link" }, h("nv-icon", { role: "img", "aria-label": "checklist-icon", name: "checklist", size: "md" }), "Tasks")), h("li", null, h("a", { href: "#", "data-class": "nv-link" }, h("nv-icon", { role: "img", "aria-label": "notebook-icon", name: "notebook", size: "md" }), "Documentation")), h("li", null, h("a", { href: "#", "data-class": "nv-link" }, h("nv-icon", { role: "img", "aria-label": "headset-icon", name: "headset", size: "md" }), "Support")), h("li", null, h("a", { href: "#", "data-class": "nv-link disabled" }, h("nv-icon", { role: "img", "aria-label": "contract-icon", name: "contract", size: "md" }), "Contracts"))))),
         },
     ],
 };

package/dist/collection/templates/navigation.docs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"navigation.docs.js","sourceRoot":"","sources":["../../src/templates/navigation.docs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAGlC,MAAM,cAAc,GAA2B;IAC7C,aAAa,EAAE,CAAC,SAAS,EAAE,eAAe,CAAC;IAC3C,OAAO,EAAE;QACP;YACE,IAAI,EAAE,aAAa;YACnB,WAAW,EACT,+RAA+R;YACjS,QAAQ,EAAE,CACR,yBAAgB,4BAA4B;gBAC1C,wBAAe,MAAM;oBACnB;wBACE,SAAG,IAAI,EAAC,QAAQ,gBAAY,SAAS;4BACnC,eAAS,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,GAAW;yCACvC,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,OAAO,gBAAY,gBAAgB;4BACzC,eAAS,IAAI,EAAC,YAAY,EAAC,IAAI,EAAC,IAAI,GAAW;oCAC7C,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,OAAO,gBAAY,SAAS;4BAClC,eAAS,IAAI,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,GAAW;oCAC1C,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,GAAG,gBAAY,kBAAkB;4BACvC,eAAS,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,GAAW;oCACvC,CACD,CACF,CACD,CACP;SACF;QACD;YACE,IAAI,EAAE,MAAM;YACZ,WAAW,EACT,gMAAgM;YAClM,QAAQ,EAAE,CACR,yBAAgB,qBAAqB;gBACnC,wBAAe,MAAM;oBACnB;wBACE,SAAG,IAAI,EAAC,QAAQ,gBAAY,SAAS;4BACnC,eAAS,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,GAAW;yCACvC,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,OAAO,gBAAY,gBAAgB;4BACzC,eAAS,IAAI,EAAC,YAAY,EAAC,IAAI,EAAC,IAAI,GAAW;oCAC7C,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,OAAO,gBAAY,SAAS;4BAClC,eAAS,IAAI,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,GAAW;oCAC1C,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,GAAG,gBAAY,kBAAkB;4BACvC,eAAS,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,GAAW;oCACvC,CACD,CACF,CACD,CACP;SACF;QACD;YACE,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,qCAAqC;YAClD,QAAQ,EAAE,CACR,yBAAgB,WAAW;gBACzB,wBAAe,gBAAgB;oBAC7B;wBACE,SAAG,IAAI,EAAC,GAAG,gBAAY,SAAS;4BAC9B,eAAS,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,GAAW;mCACvC,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,GAAG,gBAAY,SAAS;4BAC9B,eAAS,IAAI,EAAC,kBAAkB,EAAC,IAAI,EAAC,IAAI,GAAW;wCAEnD,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,GAAG,gBAAY,gBAAgB;4BACrC,eAAS,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,IAAI,GAAW;;4BAE1C,eAAS,IAAI,EAAC,cAAc,EAAC,IAAI,EAAC,IAAI,GAAW,CAC/C,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,GAAG,gBAAY,SAAS;4BAC9B,eAAS,IAAI,EAAC,OAAO,EAAC,IAAI,EAAC,IAAI,GAAW;;4BAE1C,0BAAiB,wHAAwH,QAElI,CACL,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,GAAG,gBAAY,SAAS;4BAC9B,eAAS,IAAI,EAAC,UAAU,EAAC,IAAI,EAAC,IAAI,GAAW;4CAC3C,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,GAAG,gBAAY,SAAS;4BAC9B,eAAS,IAAI,EAAC,SAAS,EAAC,IAAI,EAAC,IAAI,GAAW;sCAC1C,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,GAAG,gBAAY,kBAAkB;4BACvC,eAAS,IAAI,EAAC,UAAU,EAAC,IAAI,EAAC,IAAI,GAAW;wCAC3C,CACD,CACF,CACD,CACP;SACF;QACD;YACE,IAAI,EAAE,SAAS;YACf,WAAW,EACT,yNAAyN;YAC3N,QAAQ,EAAE,CACR,yBAAgB,iCAAiC;gBAC/C,UAAI,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,gCAAgC;oBACpD;wBACE,SAAG,IAAI,EAAC,QAAQ,gBAAY,SAAS;4BACnC,eACE,IAAI,EAAC,KAAK,gBACC,WAAW,EACtB,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,IAAI,GACA;mCAET,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,OAAO,gBAAY,gBAAgB;4BACzC,eACE,IAAI,EAAC,KAAK,gBACC,uBAAuB,EAClC,IAAI,EAAC,kBAAkB,EACvB,IAAI,EAAC,IAAI,GACA;wCAET,CACD;oBACL,wBAAe,aAAa;wBAC1B,SAAG,IAAI,EAAC,OAAO,gBAAY,SAAS;4BAClC,0BAAiB,2BAA2B;gCAC1C,eACE,IAAI,EAAC,KAAK,gBACC,YAAY,EACvB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,IAAI,GACA;2CAEN;4BAEP,mCACa,eAAe,EAC1B,IAAI,EAAC,IAAI,EACT,IAAI,EAAC,cAAc,EACnB,QAAQ,EAAC,OAAO,GACD,CACf,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,GAAG,gBAAY,SAAS;4BAC9B,eACE,IAAI,EAAC,KAAK,gBACC,gBAAgB,EAC3B,IAAI,EAAC,WAAW,EAChB,IAAI,EAAC,IAAI,GACA;oCAET,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,GAAG,gBAAY,SAAS;4BAC9B,eACE,IAAI,EAAC,KAAK,gBACC,eAAe,EAC1B,IAAI,EAAC,UAAU,EACf,IAAI,EAAC,IAAI,GACA;4CAET,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,GAAG,gBAAY,SAAS;4BAC9B,eACE,IAAI,EAAC,KAAK,gBACC,cAAc,EACzB,IAAI,EAAC,SAAS,EACd,IAAI,EAAC,IAAI,GACA;sCAET,CACD;oBACL;wBACE,SAAG,IAAI,EAAC,GAAG,gBAAY,kBAAkB;4BACvC,eACE,IAAI,EAAC,KAAK,gBACC,eAAe,EAC1B,IAAI,EAAC,UAAU,EACf,IAAI,EAAC,IAAI,GACA;wCAET,CACD,CACF,CACD,CACP;SACF;KACF;CACF,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { h } from '@stencil/core';\nimport type { NovaDocs, NovaTemplate } from '../nova-docs';\n\nconst NavigationDocs: NovaDocs<NovaTemplate> = {\n subcomponents: ['nv-icon', 'nv-iconbutton'],\n stories: [\n {\n name: 'Buttongroup',\n description:\n 'A button group that lets users switch seamlessly between related options, like different view modes or settings. Each button has a clear visual distinction for the active state, ensuring clarity and ease of use. Icons or labels provide quick recognition, making interactions intuitive.',\n template: (\n <nav data-class=\"nv-buttongroup bg-level-00\">\n <ul data-class=\"flex\">\n <li>\n <a href=\"/login\" data-class=\"nv-link\">\n <nv-icon name=\"lock\" size=\"md\"></nv-icon>Login page\n </a>\n </li>\n <li>\n <a href=\"/form\" data-class=\"nv-link active\">\n <nv-icon name=\"chart-dots\" size=\"md\"></nv-icon>Forms\n </a>\n </li>\n <li>\n <a href=\"/typo\" data-class=\"nv-link\">\n <nv-icon name=\"feather\" size=\"md\"></nv-icon>Typos\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link disabled\">\n <nv-icon name=\"user\" size=\"md\"></nv-icon>Other\n </a>\n </li>\n </ul>\n </nav>\n ),\n },\n {\n name: 'Tabs',\n description:\n 'A navigation bar using a tab view so it’s easy to jump between sections like the Login page, Forms, and Typos. Each tab has its own icon and a clear border that shows you which one’s active.',\n template: (\n <nav data-class=\"nv-tabs bg-level-00\">\n <ul data-class=\"flex\">\n <li>\n <a href=\"/login\" data-class=\"nv-link\">\n <nv-icon name=\"lock\" size=\"md\"></nv-icon>Login page\n </a>\n </li>\n <li>\n <a href=\"/form\" data-class=\"nv-link active\">\n <nv-icon name=\"chart-dots\" size=\"md\"></nv-icon>Forms\n </a>\n </li>\n <li>\n <a href=\"/typo\" data-class=\"nv-link\">\n <nv-icon name=\"feather\" size=\"md\"></nv-icon>Typos\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link disabled\">\n <nv-icon name=\"user\" size=\"md\"></nv-icon>Other\n </a>\n </li>\n </ul>\n </nav>\n ),\n },\n {\n name: 'Navbar',\n description: 'It is an horizontal navigation bar.',\n template: (\n <nav data-class=\"nv-navbar\">\n <ul data-class=\"flex gap-x-0.5\">\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon name=\"home\" size=\"md\"></nv-icon>Home\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon name=\"layout-dashboard\" size=\"md\"></nv-icon>\n Dashboard\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link active\">\n <nv-icon name=\"stack\" size=\"md\"></nv-icon>\n Projects\n <nv-icon name=\"chevron-down\" size=\"sm\"></nv-icon>\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon name=\"stack\" size=\"md\"></nv-icon>\n Tasks\n <span data-class=\"nv-badge bg-feedback-warning-high text-feedback-warning-high rounded-full w-5 flex items-center justify-center text-sm\">\n 3\n </span>\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon name=\"notebook\" size=\"md\"></nv-icon>Documentation\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon name=\"headset\" size=\"md\"></nv-icon>Support\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link disabled\">\n <nv-icon name=\"contract\" size=\"md\"></nv-icon>Contracts\n </a>\n </li>\n </ul>\n </nav>\n ),\n },\n {\n name: 'Sidenav',\n description:\n 'A Navigation bar using Tailwind CSS for styling. It’s easy to jump between sections like the Home page, Dashboard, Projects, and Tasks. Each tab has its own icon and a clear border that shows you which one’s active.',\n template: (\n <nav data-class=\"nv-sidenav flex flex-1 flex-col\">\n <ul role=\"list\" class=\"flex flex-1 flex-col gap-y-0.5\">\n <li>\n <a href=\"/login\" data-class=\"nv-link\">\n <nv-icon\n role=\"img\"\n aria-label=\"home-icon\"\n name=\"home\"\n size=\"md\"\n ></nv-icon>\n Home\n </a>\n </li>\n <li>\n <a href=\"/form\" data-class=\"nv-link active\">\n <nv-icon\n role=\"img\"\n aria-label=\"layout-dashboard-icon\"\n name=\"layout-dashboard\"\n size=\"md\"\n ></nv-icon>\n Dashboard\n </a>\n </li>\n <li data-class=\"collapsible\">\n <a href=\"/typo\" data-class=\"nv-link\">\n <span data-class=\"flex items-center gap-x-2\">\n <nv-icon\n role=\"img\"\n aria-label=\"stack-icon\"\n name=\"stack\"\n size=\"md\"\n ></nv-icon>\n Projects\n </span>\n\n <nv-iconbutton\n data-class=\"nv-iconbutton\"\n size=\"md\"\n name=\"chevron-down\"\n emphasis=\"lower\"\n ></nv-iconbutton>\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon\n role=\"img\"\n aria-label=\"checklist-icon\"\n name=\"checklist\"\n size=\"md\"\n ></nv-icon>\n Tasks\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon\n role=\"img\"\n aria-label=\"notebook-icon\"\n name=\"notebook\"\n size=\"md\"\n ></nv-icon>\n Documentation\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon\n role=\"img\"\n aria-label=\"headset-icon\"\n name=\"headset\"\n size=\"md\"\n ></nv-icon>\n Support\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link disabled\">\n <nv-icon\n role=\"img\"\n aria-label=\"contract-icon\"\n name=\"contract\"\n size=\"md\"\n ></nv-icon>\n Contracts\n </a>\n </li>\n </ul>\n </nav>\n ),\n },\n ],\n};\n\nexport default NavigationDocs;\n"]}
1	+ {"version":3,"file":"navigation.docs.js","sourceRoot":"","sources":["../../src/templates/navigation.docs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@stencil/core';\nimport type { NovaDocs, NovaTemplate } from '../nova-docs';\n\nconst NavigationDocs: NovaDocs<NovaTemplate> = {\n subcomponents: ['nv-icon', 'nv-iconbutton'],\n stories: [\n {\n name: 'Buttongroup',\n description:\n 'A button group that lets users switch seamlessly between related options, like different view modes or settings. Each button has a clear visual distinction for the active state, ensuring clarity and ease of use. Icons or labels provide quick recognition, making interactions intuitive.',\n template: (\n <nav data-class=\"nv-buttongroup bg-level-00\">\n <ul data-class=\"flex\">\n <li>\n <a href=\"/login\" data-class=\"nv-link\">\n <nv-icon name=\"lock\" size=\"md\"></nv-icon>Login page\n </a>\n </li>\n <li>\n <a href=\"/form\" data-class=\"nv-link active\">\n <nv-icon name=\"chart-dots\" size=\"md\"></nv-icon>Forms\n </a>\n </li>\n <li>\n <a href=\"/typo\" data-class=\"nv-link\">\n <nv-icon name=\"feather\" size=\"md\"></nv-icon>Typos\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link disabled\">\n <nv-icon name=\"user\" size=\"md\"></nv-icon>Other\n </a>\n </li>\n </ul>\n </nav>\n ),\n },\n {\n name: 'Tabs',\n description:\n 'A navigation bar using a tab view so it’s easy to jump between sections like the Login page, Forms, and Typos. Each tab has its own icon and a clear border that shows you which one’s active.',\n template: (\n <nav data-class=\"nv-tabs bg-level-00\">\n <ul data-class=\"flex\">\n <li>\n <a href=\"/login\" data-class=\"nv-link\">\n <nv-icon name=\"lock\" size=\"md\"></nv-icon>Login page\n </a>\n </li>\n <li>\n <a href=\"/form\" data-class=\"nv-link active\">\n <nv-icon name=\"chart-dots\" size=\"md\"></nv-icon>Forms\n </a>\n </li>\n <li>\n <a href=\"/typo\" data-class=\"nv-link\">\n <nv-icon name=\"feather\" size=\"md\"></nv-icon>Typos\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link disabled\">\n <nv-icon name=\"user\" size=\"md\"></nv-icon>Other\n </a>\n </li>\n </ul>\n </nav>\n ),\n },\n {\n name: 'Navbar',\n description: 'It is an horizontal navigation bar.',\n template: (\n <nav data-class=\"nv-navbar\">\n <ul data-class=\"flex gap-x-0.5\">\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon name=\"home\" size=\"md\"></nv-icon>Home\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon name=\"layout-dashboard\" size=\"md\"></nv-icon>\n Dashboard\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link active\">\n <nv-icon name=\"stack\" size=\"md\"></nv-icon>\n Projects\n <nv-icon name=\"chevron-down\" size=\"sm\"></nv-icon>\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon name=\"stack\" size=\"md\"></nv-icon>\n Tasks\n <span data-class=\"nv-badge bg-feedback-warning-high text-feedback-warning-high rounded-full w-5 flex items-center justify-center text-sm\">\n 3\n </span>\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon name=\"notebook\" size=\"md\"></nv-icon>Documentation\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon name=\"headset\" size=\"md\"></nv-icon>Support\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link disabled\">\n <nv-icon name=\"contract\" size=\"md\"></nv-icon>Contracts\n </a>\n </li>\n </ul>\n </nav>\n ),\n },\n {\n name: 'Sidenav',\n description:\n 'A Navigation bar using Tailwind CSS for styling. It’s easy to jump between sections like the Home page, Dashboard, Projects, and Tasks. Each tab has its own icon and a clear border that shows you which one’s active.',\n template: (\n <nav data-class=\"nv-sidenav flex flex-1 flex-col\">\n <ul role=\"list\" data-class=\"flex flex-1 flex-col gap-y-0.5\">\n <li>\n <a href=\"/login\" data-class=\"nv-link\">\n <nv-icon\n role=\"img\"\n aria-label=\"home-icon\"\n name=\"home\"\n size=\"md\"\n ></nv-icon>\n Home\n </a>\n </li>\n <li>\n <a href=\"/form\" data-class=\"nv-link active\">\n <nv-icon\n role=\"img\"\n aria-label=\"layout-dashboard-icon\"\n name=\"layout-dashboard\"\n size=\"md\"\n ></nv-icon>\n Dashboard\n </a>\n </li>\n <li data-class=\"collapsible\">\n <a href=\"/typo\" data-class=\"nv-link\">\n <span data-class=\"flex items-center gap-x-2\">\n <nv-icon\n role=\"img\"\n aria-label=\"stack-icon\"\n name=\"stack\"\n size=\"md\"\n ></nv-icon>\n Projects\n </span>\n\n <nv-iconbutton\n data-class=\"nv-iconbutton\"\n size=\"md\"\n name=\"chevron-down\"\n emphasis=\"lower\"\n ></nv-iconbutton>\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon\n role=\"img\"\n aria-label=\"checklist-icon\"\n name=\"checklist\"\n size=\"md\"\n ></nv-icon>\n Tasks\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon\n role=\"img\"\n aria-label=\"notebook-icon\"\n name=\"notebook\"\n size=\"md\"\n ></nv-icon>\n Documentation\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link\">\n <nv-icon\n role=\"img\"\n aria-label=\"headset-icon\"\n name=\"headset\"\n size=\"md\"\n ></nv-icon>\n Support\n </a>\n </li>\n <li>\n <a href=\"#\" data-class=\"nv-link disabled\">\n <nv-icon\n role=\"img\"\n aria-label=\"contract-icon\"\n name=\"contract\"\n size=\"md\"\n ></nv-icon>\n Contracts\n </a>\n </li>\n </ul>\n </nav>\n ),\n },\n ],\n};\n\nexport default NavigationDocs;\n"]}

package/dist/components/index.js CHANGED Viewed

@@ -1,4 +1,4 @@
-export { g as getAssetPath, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-679e0fa9.js';
+export { g as getAssetPath, s as setAssetPath, a as setNonce, b as setPlatformOptions } from './p-aff3ed68.js';
 export { c as constants } from './p-1f505531.js';
 export { e as eventUtils } from './p-d429a343.js';
 export { s as stringUtils } from './p-a5c8eee9.js';

package/dist/components/nv-alert.js CHANGED Viewed

@@ -1,9 +1,9 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-679e0fa9.js';
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-aff3ed68.js';
 import { c as clsx } from './p-8a1a6e56.js';
 import { F as FeedbackColors } from './p-1f505531.js';
 import { u as useCollapse, t as timeline } from './p-42301d8f.js';
 import { u as useFade } from './p-1daca48a.js';
-import { d as defineCustomElement$2 } from './p-76a30bf1.js';
+import { d as defineCustomElement$2 } from './p-b207be02.js';
 const nvAlertCss = "nv-alert{display:flex !important;align-items:flex-start;position:relative;gap:var(--alert-gap-x);border-radius:var(--alert-radius);font-family:\"TT Norms Pro\", \"Montserrat\", sans-serif}nv-alert>nv-icon{margin-left:var(--alert-icon-position-x);margin-top:var(--alert-icon-position-y)}nv-alert.hidden{display:none !important}nv-alert.feedback-information{background-color:var(--components-alert-information-background);border:1px solid var(--components-alert-information-border) !important}nv-alert.feedback-information>.close:focus,nv-alert.feedback-information>.close:focus-within{outline:none}nv-alert.feedback-information>.close:focus-visible,nv-alert.feedback-information>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-information-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert.feedback-warning{background-color:var(--components-alert-warning-background);border:1px solid var(--components-alert-warning-border) !important}nv-alert.feedback-warning>.close:focus,nv-alert.feedback-warning>.close:focus-within{outline:none}nv-alert.feedback-warning>.close:focus-visible,nv-alert.feedback-warning>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-warning-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert.feedback-error{background-color:var(--components-alert-error-background);border:1px solid var(--components-alert-error-border) !important}nv-alert.feedback-error>.close:focus,nv-alert.feedback-error>.close:focus-within{outline:none}nv-alert.feedback-error>.close:focus-visible,nv-alert.feedback-error>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-error-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert.feedback-success{background-color:var(--components-alert-success-background);border:1px solid var(--components-alert-success-border) !important}nv-alert.feedback-success>.close:focus,nv-alert.feedback-success>.close:focus-within{outline:none}nv-alert.feedback-success>.close:focus-visible,nv-alert.feedback-success>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-success-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert.feedback-neutral{background-color:var(--components-alert-neutral-background);border:1px solid var(--components-alert-neutral-border) !important}nv-alert.feedback-neutral>.close:focus,nv-alert.feedback-neutral>.close:focus-within{outline:none}nv-alert.feedback-neutral>.close:focus-visible,nv-alert.feedback-neutral>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-neutral-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert>nv-icon.icon-information{color:var(--components-alert-information-icon)}nv-alert>nv-icon.icon-warning{color:var(--components-alert-warning-icon)}nv-alert>nv-icon.icon-error{color:var(--components-alert-error-icon)}nv-alert>nv-icon.icon-success{color:var(--components-alert-success-icon)}nv-alert>nv-icon.icon-neutral{color:var(--components-alert-neutral-icon)}nv-alert>.content{display:flex;padding:var(--alert-padding);padding-left:0;flex-direction:column;gap:var(--alert-gap-y)}nv-alert>.content>.heading{color:var(--components-alert-content-title);font-size:var(--alert-heading-font-size);line-height:var(--alert-heading-line-height);font-weight:var(--alert-heading-font-weight)}nv-alert>.content>.message{color:var(--components-alert-content-description);font-size:var(--alert-message-font-size);line-height:var(--alert-message-line-height)}nv-alert>.close{border-radius:var(--alert-radius);position:absolute;display:flex;top:var(--alert-icon-position-y);right:var(--alert-icon-position-x);padding:0;border:none;background:none;cursor:pointer}";
 const NvAlertStyle0 = nvAlertCss;

package/dist/components/nv-avatar.js CHANGED Viewed

@@ -1,7 +1,7 @@
-import { p as proxyCustomElement, H, h, d as Host } from './p-679e0fa9.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-aff3ed68.js';
 import { c as clsx } from './p-8a1a6e56.js';
 import { S as SemanticSizes } from './p-1f505531.js';
-import { d as defineCustomElement$2 } from './p-76a30bf1.js';
+import { d as defineCustomElement$2 } from './p-b207be02.js';
 const nvAvatarCss = "nv-avatar{align-items:center !important;background-color:var(--components-avatar-background-1);border-radius:var(--radius-rounded-full) !important;display:flex !important;flex-shrink:0 !important;font-family:\"TT Norms Pro\", sans-serif;font-style:normal;font-weight:var(--font-weight-medium-emphasis);justify-content:center !important;leading-trim:both;line-height:1 !important;text-align:center;text-edge:cap;text-transform:uppercase}nv-avatar.avatar-color-1{background-color:var(--components-avatar-background-1);color:var(--components-avatar-content-1)}nv-avatar.avatar-color-2{background-color:var(--components-avatar-background-2);color:var(--components-avatar-content-2)}nv-avatar.avatar-color-3{background-color:var(--components-avatar-background-3);color:var(--components-avatar-content-3)}nv-avatar.avatar-color-4{background-color:var(--components-avatar-background-4);color:var(--components-avatar-content-4)}nv-avatar.avatar-color-5{background-color:var(--components-avatar-background-5);color:var(--components-avatar-content-5)}nv-avatar.avatar-color-6{background-color:var(--components-avatar-background-6);color:var(--components-avatar-content-6)}nv-avatar.avatar-color-7{background-color:var(--components-avatar-background-7);color:var(--components-avatar-content-7)}nv-avatar.avatar-color-8{background-color:var(--components-avatar-background-8);color:var(--components-avatar-content-8)}nv-avatar.avatar-color-9{background-color:var(--components-avatar-background-9);color:var(--components-avatar-content-9)}nv-avatar.avatar-color-10{background-color:var(--components-avatar-background-10);color:var(--components-avatar-content-10)}nv-avatar img{height:100%;width:100%;object-fit:cover;object-position:center;border-radius:50%}nv-avatar.avatar-xs{width:var(--avatar-xs-size);height:var(--avatar-xs-size);font-size:var(--avatar-xs-font-size);line-height:var(--avatar-xs-font-size)}nv-avatar.avatar-xs nv-icon>svg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-avatar.avatar-sm{width:var(--avatar-sm-size);height:var(--avatar-sm-size);font-size:var(--avatar-sm-font-size);line-height:var(--avatar-sm-font-size)}nv-avatar.avatar-sm nv-icon>svg{width:var(--spacing-4);height:var(--spacing-4);stroke-width:1.5px}nv-avatar.avatar-md{width:var(--avatar-md-size);height:var(--avatar-md-size);font-size:var(--avatar-md-font-size);line-height:var(--avatar-md-font-size)}nv-avatar.avatar-md nv-icon>svg{width:var(--spacing-5);height:var(--spacing-5);stroke-width:1.6px}nv-avatar.avatar-lg{width:var(--avatar-lg-size);height:var(--avatar-lg-size);font-size:var(--avatar-lg-font-size);line-height:var(--avatar-lg-font-size)}nv-avatar.avatar-lg nv-icon>svg{width:var(--spacing-6);height:var(--spacing-6);stroke-width:1.8px}nv-avatar.avatar-xl{width:var(--avatar-xl-size);height:var(--avatar-xl-size);font-size:var(--avatar-xl-font-size);line-height:var(--avatar-xl-font-size)}nv-avatar.avatar-xl nv-icon>svg{width:var(--spacing-7);height:var(--spacing-7);stroke-width:1.9px}";
 const NvAvatarStyle0 = nvAvatarCss;

package/dist/components/nv-badge.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { N as NvBadge$1, d as defineCustomElement$1 } from './p-07a89754.js';
+import { N as NvBadge$1, d as defineCustomElement$1 } from './p-953d8b4d.js';
 const NvBadge = NvBadge$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/nv-breadcrumb.js CHANGED Viewed

@@ -1,7 +1,7 @@
-import { p as proxyCustomElement, H, f as forceUpdate, h, d as Host } from './p-679e0fa9.js';
+import { p as proxyCustomElement, H, f as forceUpdate, h, d as Host } from './p-aff3ed68.js';
 import { c as clsx } from './p-8a1a6e56.js';
-import { d as defineCustomElement$3 } from './p-0ab80d95.js';
-import { d as defineCustomElement$2 } from './p-c0a91091.js';
+import { d as defineCustomElement$3 } from './p-131e5140.js';
+import { d as defineCustomElement$2 } from './p-f7c7a406.js';
 const nvBreadcrumbCss = "nv-breadcrumb{display:flex;align-items:center;color:var(--components-breadcrumb-text);font-size:var(--font-size-sm);font-style:normal;font-weight:500;line-height:var(--line-height-sm)}nv-breadcrumb.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-breadcrumb ul{display:flex;flex-direction:column;gap:var(--spacing-1-5);padding:var(--spacing-1)}nv-breadcrumb ul a,nv-breadcrumb ul button{display:inline-flex;align-self:center;color:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;line-height:inherit;text-decoration:none}nv-breadcrumb ul a:focus,nv-breadcrumb ul a:focus-within,nv-breadcrumb ul button:focus,nv-breadcrumb ul button:focus-within{outline:none}nv-breadcrumb ul a:focus-visible,nv-breadcrumb ul a:has(:focus-visible),nv-breadcrumb ul button:focus-visible,nv-breadcrumb ul button:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 0.5) solid var(--components-breadcrumb-text-hover);outline-offset:calc(var(--focus-outline-offset) * 0.3)}nv-breadcrumb ul a:hover,nv-breadcrumb ul button:hover{text-decoration:underline;color:var(--components-breadcrumb-text-hover)}nv-breadcrumb>a,nv-breadcrumb>button{display:inline-flex;align-self:center;color:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;line-height:inherit;text-decoration:none}nv-breadcrumb>a:focus,nv-breadcrumb>a:focus-within,nv-breadcrumb>button:focus,nv-breadcrumb>button:focus-within{outline:none}nv-breadcrumb>a:focus-visible,nv-breadcrumb>a:has(:focus-visible),nv-breadcrumb>button:focus-visible,nv-breadcrumb>button:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 0.5) solid var(--components-breadcrumb-text-hover);outline-offset:calc(var(--focus-outline-offset) * 0.3)}nv-breadcrumb>a:hover,nv-breadcrumb>button:hover{text-decoration:underline;color:var(--components-breadcrumb-text-hover)}nv-breadcrumb span[data-scope=separator]{display:inline-flex;padding-left:var(--breadcrumb-padding-y)}";
 const NvBreadcrumbStyle0 = nvBreadcrumbCss;

package/dist/components/nv-breadcrumbs.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, h, d as Host } from './p-679e0fa9.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-aff3ed68.js';
 const nvBreadcrumbsCss = "nv-breadcrumbs{display:block}nv-breadcrumbs>ol{display:flex;flex-wrap:wrap;align-items:center;gap:var(--breadcrumb-padding-y)}nv-breadcrumbs nv-breadcrumb:last-child [data-scope=separator],nv-breadcrumbs nv-breadcrumb:last-child [slot=separator]{display:none}";
 const NvBreadcrumbsStyle0 = nvBreadcrumbsCss;

package/dist/components/nv-button.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { N as NvButton$1, d as defineCustomElement$1 } from './p-cbe9521f.js';
+import { N as NvButton$1, d as defineCustomElement$1 } from './p-dcaf9010.js';
 const NvButton = NvButton$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/nv-calendar.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { N as NvCalendar$1, d as defineCustomElement$1 } from './p-4656efae.js';
+import { N as NvCalendar$1, d as defineCustomElement$1 } from './p-a0d7e0cd.js';
 const NvCalendar = NvCalendar$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/nv-col.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, h, d as Host } from './p-679e0fa9.js';
+import { p as proxyCustomElement, H, h, d as Host } from './p-aff3ed68.js';
 import { c as clsx } from './p-8a1a6e56.js';
 const nvColCss = "nv-col{display:block;flex:1 1 0%;padding-left:calc(var(--spacing-4) / 2);padding-right:calc(var(--spacing-4) / 2)}nv-col[class*=w-]{flex:none}nv-col.w-1\\/12{width:calc(100% * 1 / 12)}nv-col.w-2\\/12{width:calc(100% * 2 / 12)}nv-col.w-3\\/12{width:calc(100% * 3 / 12)}nv-col.w-4\\/12{width:calc(100% * 4 / 12)}nv-col.w-5\\/12{width:calc(100% * 5 / 12)}nv-col.w-6\\/12{width:calc(100% * 6 / 12)}nv-col.w-7\\/12{width:calc(100% * 7 / 12)}nv-col.w-8\\/12{width:calc(100% * 8 / 12)}nv-col.w-9\\/12{width:calc(100% * 9 / 12)}nv-col.w-10\\/12{width:calc(100% * 10 / 12)}nv-col.w-11\\/12{width:calc(100% * 11 / 12)}nv-col.w-12\\/12{width:calc(100% * 12 / 12)}";