@nova-design-system/nova-webcomponents 3.0.0-beta.17 → 3.0.0-beta.20

package/dist/cjs/nv-iconbutton.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d1f2412.js');
+const index = require('./index-b925c7f5.js');
 const clsx = require('./clsx-fc789adc.js');
 
 const nvIconbuttonCss = "nv-iconbutton.root{display:inline-flex;justify-content:center;align-items:center;font-style:normal;font-weight:500;font-family:\"TT Norms Pro\", sans-serif;transition:background-color 150ms ease-out;height:fit-content;width:fit-content}nv-iconbutton.size-xs{padding:var(--button-xs-icon-button-padding);gap:var(--button-xs-gap);border-radius:var(--button-xs-border-radius);line-height:var(--button-xs-line-height);font-size:var(--button-xs-font-size)}nv-iconbutton.size-sm{padding:var(--button-sm-icon-button-padding);gap:var(--button-sm-gap);border-radius:var(--button-sm-border-radius);line-height:var(--button-sm-line-height);font-size:var(--button-sm-font-size)}nv-iconbutton.size-md{padding:var(--button-md-icon-button-padding);gap:var(--button-md-gap);border-radius:var(--button-md-border-radius);line-height:var(--button-md-line-height);font-size:var(--button-md-font-size)}nv-iconbutton.size-lg{padding:var(--button-lg-icon-button-padding);gap:var(--button-lg-gap);border-radius:var(--button-lg-border-radius);line-height:var(--button-lg-line-height);font-size:var(--button-lg-font-size)}nv-iconbutton.emphasis-high{background:var(--components-button-high-background);border:1px solid var(--components-button-high-border);color:var(--components-button-high-text)}nv-iconbutton.emphasis-high:hover{background:var(--components-button-high-background-hover);color:var(--components-button-high-text-hover)}nv-iconbutton.emphasis-high:focus,nv-iconbutton.emphasis-high:focus-within{outline:none}nv-iconbutton.emphasis-high:focus-visible,nv-iconbutton.emphasis-high:has(:focus-visible){outline:var(--focus-outline-stroke) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-iconbutton.emphasis-high:disabled{background:var(--components-button-high-background);color:var(--components-button-high-text);opacity:0.5;cursor:not-allowed;box-shadow:none}nv-iconbutton.emphasis-high nv-icon>svg{color:var(--components-button-high-icon)}nv-iconbutton.emphasis-medium{background:var(--components-button-medium-background);border:1px solid var(--components-button-medium-border);color:var(--components-button-medium-text)}nv-iconbutton.emphasis-medium:hover{background:var(--components-button-medium-background-hover);color:var(--components-button-medium-text-hover)}nv-iconbutton.emphasis-medium:focus,nv-iconbutton.emphasis-medium:focus-within{outline:none}nv-iconbutton.emphasis-medium:focus-visible,nv-iconbutton.emphasis-medium:has(:focus-visible){outline:var(--focus-outline-stroke) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-iconbutton.emphasis-medium:disabled{background:var(--components-button-medium-background);color:var(--components-button-medium-text);opacity:0.5;cursor:not-allowed;box-shadow:none}nv-iconbutton.emphasis-medium nv-icon>svg{color:var(--components-button-medium-icon)}nv-iconbutton.emphasis-low{background:var(--components-button-low-background);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text)}nv-iconbutton.emphasis-low:hover{background:var(--components-button-low-background-hover);color:var(--components-button-low-text-hover)}nv-iconbutton.emphasis-low:focus,nv-iconbutton.emphasis-low:focus-within{outline:none}nv-iconbutton.emphasis-low:focus-visible,nv-iconbutton.emphasis-low:has(:focus-visible){outline:var(--focus-outline-stroke) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-iconbutton.emphasis-low:disabled{background:var(--components-button-low-background);color:var(--components-button-low-text);opacity:0.5;cursor:not-allowed;box-shadow:none}nv-iconbutton.emphasis-low nv-icon>svg{color:var(--components-button-low-icon)}nv-iconbutton.emphasis-lower{background:var(--components-button-lower-background);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text)}nv-iconbutton.emphasis-lower:hover{background:var(--components-button-lower-background-hover);color:var(--components-button-lower-text-hover)}nv-iconbutton.emphasis-lower:focus,nv-iconbutton.emphasis-lower:focus-within{outline:none}nv-iconbutton.emphasis-lower:focus-visible,nv-iconbutton.emphasis-lower:has(:focus-visible){outline:var(--focus-outline-stroke) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-iconbutton.emphasis-lower:disabled{background:var(--components-button-lower-background);color:var(--components-button-lower-text);opacity:0.5;cursor:not-allowed;box-shadow:none}nv-iconbutton.emphasis-lower nv-icon>svg{color:var(--components-button-lower-icon)}nv-iconbutton.loading [slot=leading-icon]{display:none}nv-iconbutton.shape-rounded{border-radius:var(--radius-rounded-full)}";
@@ -76,7 +76,7 @@ const NvIconbutton = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '3ca84b14312db9e4fff85fac71fbb0cc7ae7db44', role: "button", type: this.type, tabindex: "0", disabled: this.disabled ? true : undefined, class: clsx.clsx('root', `size-${this.size}`, `emphasis-${this.emphasis}`, this.loading && 'loading', `shape-${this.shape}`), onClick: this.handleClick }, this.loading && index.h("nv-loader", { key: 'bfb6c6ee4dbfa56595b704f436120c3ae18f4fc4', size: this.size }), !this.loading && index.h("nv-icon", { key: '7e87da2f6d233289bbce12416bf0d39b647f43f3', name: this.name, size: this.size }), index.h("slot", { key: '43972e79cf4efb921cbc9714110b13590144a268' })));
+        return (index.h(index.Host, { key: 'dc918224a0fcbea4bc0d299fcd86a066c9fb2a6e', role: "button", type: this.type, tabindex: "0", disabled: this.disabled ? true : undefined, class: clsx.clsx('root', `size-${this.size}`, `emphasis-${this.emphasis}`, this.loading && 'loading', `shape-${this.shape}`), onClick: this.handleClick }, this.loading && index.h("nv-loader", { key: '7f2484c41aa8b8dc2d6e40f4174c486e95efe65b', size: this.size }), !this.loading && index.h("nv-icon", { key: '772c5d352e9eb65911ee68fcbeeb6f1b1ad3606a', name: this.name, size: this.size }), index.h("slot", { key: 'e4bdc61098a178a8c12a898410b5131105a1b6f4' })));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/nv-loader.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d1f2412.js');
+const index = require('./index-b925c7f5.js');
 const clsx = require('./clsx-fc789adc.js');
 
 const nvLoaderCss = "@keyframes rotation{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}nv-loader{display:inline-block;position:relative;aspect-ratio:1/1;border-radius:9999px;color:inherit}nv-loader.size-xs{width:var(--loader-size-xs);height:var(--loader-size-xs)}nv-loader.size-xs::before,nv-loader.size-xs::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-xs::before{content:\" \";border:calc(var(--loader-size-xs) / 10) solid;opacity:0.3}nv-loader.size-xs::after{content:\" \";border-top:calc(var(--loader-size-xs) / 10) solid transparent;border-left:calc(var(--loader-size-xs) / 10) solid transparent;border-right:calc(var(--loader-size-xs) / 10) solid transparent;border-bottom:calc(var(--loader-size-xs) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-sm{width:var(--loader-size-sm);height:var(--loader-size-sm)}nv-loader.size-sm::before,nv-loader.size-sm::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-sm::before{content:\" \";border:calc(var(--loader-size-sm) / 10) solid;opacity:0.3}nv-loader.size-sm::after{content:\" \";border-top:calc(var(--loader-size-sm) / 10) solid transparent;border-left:calc(var(--loader-size-sm) / 10) solid transparent;border-right:calc(var(--loader-size-sm) / 10) solid transparent;border-bottom:calc(var(--loader-size-sm) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-md{width:var(--loader-size-md);height:var(--loader-size-md)}nv-loader.size-md::before,nv-loader.size-md::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-md::before{content:\" \";border:calc(var(--loader-size-md) / 10) solid;opacity:0.3}nv-loader.size-md::after{content:\" \";border-top:calc(var(--loader-size-md) / 10) solid transparent;border-left:calc(var(--loader-size-md) / 10) solid transparent;border-right:calc(var(--loader-size-md) / 10) solid transparent;border-bottom:calc(var(--loader-size-md) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-lg{width:var(--loader-size-lg);height:var(--loader-size-lg)}nv-loader.size-lg::before,nv-loader.size-lg::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-lg::before{content:\" \";border:calc(var(--loader-size-lg) / 10) solid;opacity:0.3}nv-loader.size-lg::after{content:\" \";border-top:calc(var(--loader-size-lg) / 10) solid transparent;border-left:calc(var(--loader-size-lg) / 10) solid transparent;border-right:calc(var(--loader-size-lg) / 10) solid transparent;border-bottom:calc(var(--loader-size-lg) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-xl{width:var(--loader-size-xl);height:var(--loader-size-xl)}nv-loader.size-xl::before,nv-loader.size-xl::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-xl::before{content:\" \";border:calc(var(--loader-size-xl) / 10) solid;opacity:0.3}nv-loader.size-xl::after{content:\" \";border-top:calc(var(--loader-size-xl) / 10) solid transparent;border-left:calc(var(--loader-size-xl) / 10) solid transparent;border-right:calc(var(--loader-size-xl) / 10) solid transparent;border-bottom:calc(var(--loader-size-xl) / 10) solid;animation:rotation 1s linear infinite}nv-loader.color-brand::before{border-color:var(--components-loader-brand-background);opacity:1}nv-loader.color-brand::after{border-bottom-color:var(--components-loader-brand-foreground)}nv-loader.color-white::before{border-color:var(--components-loader-white-background);opacity:1}nv-loader.color-white::after{border-bottom-color:var(--components-loader-white-foreground)}";
@@ -19,7 +19,7 @@ const NvLoader = class {
     //#region RENDER
     /* <slot> empty to force rendering change */
     render() {
-        return (index.h(index.Host, { key: 'b4c0dab3c3ea4e2bdd434d779d4b736577bd467e', class: clsx.clsx(this.size && `size-${this.size}`, this.color && `color-${this.color}`) }));
+        return (index.h(index.Host, { key: 'd6bc07fa876b14f8332275b0013eb0957463448d', class: clsx.clsx(this.size && `size-${this.size}`, this.color && `color-${this.color}`) }));
     }
 };
 NvLoader.style = NvLoaderStyle0;

package/dist/cjs/nv-menu.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d1f2412.js');
+const index = require('./index-b925c7f5.js');
 
 const nvMenuCss = "nv-menuitem{display:flex;align-items:center;max-width:300px;width:100vw;font-size:var(--menu-contextual-item-font-size);font-weight:var(--menu-contextual-item-font-weight);color:var(--components-menu-contextual-item-content);border-radius:var(--menu-contextual-item-radius);gap:var(--menu-contextual-item-gap-x);padding:var(--menu-contextual-item-padding-y) var(--menu-contextual-item-padding-x);transition:background-color 150ms ease-out;cursor:pointer}nv-menuitem:hover,nv-menuitem:focus,nv-menuitem:focus-within{background-color:var(--components-menu-contextual-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-menuitem kbd{color:var(--components-menu-contextual-item-shortcut)}nv-menuitem [data-scope=text]{margin-right:auto}nv-menuitem[disabled]:not([disabled=false]){cursor:unset;background-color:unset;color:var(--components-menu-contextual-item-content-disabled)}nv-menu{display:inline-block;position:relative}nv-menu:has([fluid]:not([fluid=false])){display:block}nv-menu nv-popover{display:unset}nv-menu nv-popover [data-scope=popover]{background-color:transparent !important;padding:0 !important}nv-menu [slot=content]{padding:var(--menu-contextual-padding-y) var(--menu-contextual-padding-x);border-radius:var(--menu-contextual-radius);gap:var(--menu-contextual-gap-y);background-color:var(--components-menu-contextual-background);border-color:var(--components-menu-contextual-border);display:flex;flex-direction:column}nv-menu nv-menu[open]:not([open=false])>nv-menuitem{background-color:var(--components-menu-contextual-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-menu hr{display:block;margin:var(--menu-contextual-divider-padding-top) var(--menu-contextual-divider-padding-x) var(--menu-contextual-divider-padding-bottom) var(--menu-contextual-divider-padding-x)}";
 const NvMenuStyle0 = nvMenuCss;
@@ -178,7 +178,7 @@ const NvMenu = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '5a3a0645d952724b5c2ddd1f2578201568bf827b' }, index.h("slot", { key: '65506a9b7035ef645daa87079339ad7e7cd76377', name: "trigger" }), index.h("nv-popover", { key: 'f5998e3d878671d09ea684de2a54bca504513f48', ref: el => (this.popoverElement = el), triggerMode: "click", triggerElement: this.triggerElement, placement: this.placement, nested: this.nested, open: this.open }, index.h("slot", { key: '267e0e587177bdb8b6ce9b10f36c43158547d5b2', name: "content" }))));
+        return (index.h(index.Host, { key: '080871f790f3725ee0c627ff6f2c23b0b9c67ed9' }, index.h("slot", { key: '8b2b2392d606f14b61c7c3ea799273948b045d0d', name: "trigger" }), index.h("nv-popover", { key: '33bae39e185e26a23aa0d7d9d2ac7b0f35658fd9', ref: el => (this.popoverElement = el), triggerMode: "click", triggerElement: this.triggerElement, placement: this.placement, nested: this.nested, open: this.open }, index.h("slot", { key: 'f50743c2ed89866882266413e595a03185bd329e', name: "content" }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/nv-menuitem.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d1f2412.js');
+const index = require('./index-b925c7f5.js');
 
 const nvMenuitemCss = "nv-menuitem{display:flex;align-items:center;max-width:300px;width:100vw;font-size:var(--menu-contextual-item-font-size);font-weight:var(--menu-contextual-item-font-weight);color:var(--components-menu-contextual-item-content);border-radius:var(--menu-contextual-item-radius);gap:var(--menu-contextual-item-gap-x);padding:var(--menu-contextual-item-padding-y) var(--menu-contextual-item-padding-x);transition:background-color 150ms ease-out;cursor:pointer}nv-menuitem:hover,nv-menuitem:focus,nv-menuitem:focus-within{background-color:var(--components-menu-contextual-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-menuitem kbd{color:var(--components-menu-contextual-item-shortcut)}nv-menuitem [data-scope=text]{margin-right:auto}nv-menuitem[disabled]:not([disabled=false]){cursor:unset;background-color:unset;color:var(--components-menu-contextual-item-content-disabled)}";
 const NvMenuitemStyle0 = nvMenuitemCss;

package/dist/cjs/nv-popover.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d1f2412.js');
+const index = require('./index-b925c7f5.js');
 const fade_animation = require('./fade.animation-0d33d198.js');
 const grow_animation = require('./grow.animation-46e7ae4b.js');
 
@@ -2313,7 +2313,7 @@ const NvPopover = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '8d32b4cb618de8d8c88e813b5cb446eb4e667f27' }, index.h("slot", { key: 'bb4688a7ed334a32c1033c340d765e5abc8aef4a', name: "trigger" }), index.h("div", { key: '2e3847dd205be87742f3794f806ed1d903d88f14', "data-scope": "popover", hidden: true, ref: el => (this.popoverElement = el) }, this.hasArrow && (index.h("div", { key: '8259476267d3c14043c649b95d875452909e1e08', "data-scope": "arrow", ref: el => (this.arrowElement = el) })), index.h("slot", { key: 'e6d68d89876b7353c0abd349b7c3bc1bfe790a76', name: "content" }))));
+        return (index.h(index.Host, { key: '305452892fe5a5889aa81ad8a794f91407965a82' }, index.h("slot", { key: 'c82770ebfafb46c8e5ceb55b71199873ac7ca039', name: "trigger" }), index.h("div", { key: '02646f26b908fa4103ebb0a44233a833713c57bc', "data-scope": "popover", hidden: true, ref: el => (this.popoverElement = el) }, this.hasArrow && (index.h("div", { key: 'dc654f5595b1e9b2fae2b8eab2d8716ad8c1fcee', "data-scope": "arrow", ref: el => (this.arrowElement = el) })), index.h("slot", { key: '0d2dd2e1fca7f73815add0cd4ff85b41932f01fb', name: "content" }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/nv-row.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d1f2412.js');
+const index = require('./index-b925c7f5.js');
 
 const nvRowCss = "nv-row{display:flex;flex-wrap:wrap;margin-right:calc(var(--spacing-4) * -1);margin-left:calc(var(--spacing-4) * -1);row-gap:var(--spacing-4)}";
 const NvRowStyle0 = nvRowCss;
@@ -14,7 +14,7 @@ const NvRow = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: 'b6a2c143bf767ab622d0305574be11c71a770421' }, index.h("slot", { key: '8665290a25fdb12165d52436fc64d1a11ff93814' })));
+        return (index.h(index.Host, { key: 'bccdd262d6d7bcec9a25422886173b75e84e8681' }, index.h("slot", { key: '5e16847683228465a72ec2f5b03de429cb881d41' })));
     }
 };
 NvRow.style = NvRowStyle0;

package/dist/cjs/nv-stack.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d1f2412.js');
+const index = require('./index-b925c7f5.js');
 const clsx = require('./clsx-fc789adc.js');
 
 const nvStackCss = "nv-stack{display:flex;align-items:center;justify-content:flex-start;flex-direction:row}nv-stack nv-col{display:flex}nv-stack:not(nv-row){flex-wrap:nowrap}nv-stack>.nv-stack-item-flex{flex-shrink:1;flex-grow:1}nv-stack>.nv-stack-item-lead{margin-right:auto}nv-stack>.nv-stack-item-lead+*{margin-left:0}nv-stack>.nv-stack-item-center{margin-right:auto;margin-left:auto}nv-stack>.nv-stack-item-tail{margin-left:auto}nv-stack>.nv-stack-nowrap{white-space:nowrap}nv-stack.nv-stack-vertical{align-items:stretch;flex-direction:column}nv-stack.nv-stack-vertical>.nv-stack-item-lead{margin-right:0;margin-bottom:auto}nv-stack.nv-stack-vertical>.nv-stack-item-lead+*{margin-top:0}nv-stack.nv-stack-vertical>.nv-stack-item-tail{margin-left:0;margin-top:auto}nv-stack.nv-stack-vertical>.nv-stack-item-center{margin:auto 0}nv-stack.nv-stack-flex>*{flex-shrink:1;flex-grow:1}nv-stack.nv-stack-fill>*{height:100%}nv-stack.nv-stack-fill.nv-stack-vertical>*{height:auto;width:100%}";
@@ -21,7 +21,7 @@ const NvStack = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '4c8889bb870137f5c3aa8fc499c26fc77bc6fba1', class: clsx.clsx(this.fill && 'nv-stack-fill', this.flex && 'nv-stack-flex', this.full && 'w-full', this.gutter && !this.vertical && `gutter-x-${this.gutter}`, this.gutter && this.vertical && `gutter-y-${this.gutter}`, this.vertical && 'nv-stack-vertical') }, index.h("slot", { key: 'dbd5b334a0e6ee5aa3bbc0431d44d81933f1c05c' })));
+        return (index.h(index.Host, { key: 'a06b3c85ea07e19125e1b8b23561869de8c8edcc', class: clsx.clsx(this.fill && 'nv-stack-fill', this.flex && 'nv-stack-flex', this.full && 'w-full', this.gutter && !this.vertical && `gutter-x-${this.gutter}`, this.gutter && this.vertical && `gutter-y-${this.gutter}`, this.vertical && 'nv-stack-vertical') }, index.h("slot", { key: '8d902ed2b636bb6d1d8930c6d89117c7a1081707' })));
     }
 };
 NvStack.style = NvStackStyle0;

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

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-5d1f2412.js');
+const index = require('./index-b925c7f5.js');
 
 const nvTooltipCss = "nv-tooltip{display:inline-block;position:relative}nv-tooltip:has([fluid]:not([fluid=false])){display:block}nv-tooltip [data-scope=popover]{background:var(--components-tooltip-background);color:var(--components-tooltip-text);font-weight:var(--font-weight-medium-emphasis);padding:var(--tooltip-padding-y) var(--tooltip-padding-x);font-size:var(--tooltip-font-size);border-radius:var(--tooltip-radius);border:none;box-shadow:0px var(--shadow-y-axis-lg-1) var(--shadow-blur-lg-1) var(--shadow-spread-lg-1) var(--shadow-color-opacity-1), 0px var(--shadow-y-axis-lg-2) var(--shadow-blur-lg-2) var(--shadow-spread-lg-2) var(--shadow-color-opacity-2)}nv-tooltip [data-scope=arrow]{background:var(--components-tooltip-background);box-shadow:none;border:none}";
 const NvTooltipStyle0 = nvTooltipCss;
@@ -26,7 +26,7 @@ const NvTooltip = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '7fbaa673028556f15b8c15a863f066d79b7b844e' }, index.h("slot", { key: 'b9007b3c3326ed7bb3bea05c2b2ad90d49b25a45' }), index.h("nv-popover", { key: '9a72b61bf4af4a769ba5ad991925bc982a440f93', triggerMode: "hover", hasArrow: true, placement: this.placement, triggerElement: this.triggerElement, groupName: 'tooltip', enterDelay: this.enterDelay }, index.h("p", { key: 'aa7d584e0db97792915f5460a7760ad16f45c5ba', slot: "content" }, this.message), index.h("slot", { key: 'fc32501ada94b526adf6e9fcb71ec355f72a163d', name: "content" }))));
+        return (index.h(index.Host, { key: 'adb606648ce4c11bb1293007a640f90603c66317' }, index.h("slot", { key: 'eef7d009694b5cd1010c3bf2ef40f46e726f1306' }), index.h("nv-popover", { key: '5ab73b344c52709cae8e27b519e27b9297f9e048', triggerMode: "hover", hasArrow: true, placement: this.placement, triggerElement: this.triggerElement, groupName: 'tooltip', enterDelay: this.enterDelay }, index.h("p", { key: '999764402770b8a19402d2c87c2994aead46ba87', slot: "content" }, this.message), index.h("slot", { key: '8c4f29a7acb4469ad8a4bced0defc2f8021f125a', name: "content" }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/collection/collection-manifest.json

@@ -8,6 +8,8 @@
     "components/nv-button/nv-button.js",
     "components/nv-col/nv-col.js",
     "components/nv-fieldcheckbox/nv-fieldcheckbox.js",
+    "components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.js",
+    "components/nv-fieldmultiselect/nv-fieldmultiselect.js",
     "components/nv-fieldnumber/nv-fieldnumber.js",
     "components/nv-fieldpassword/nv-fieldpassword.js",
     "components/nv-fieldradio/nv-fieldradio.js",

package/dist/collection/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.css

@@ -0,0 +1,12 @@
+@charset "UTF-8";
+nv-fielddropdownitemcheck slot-fb {
+  all: unset; /* Réinitialise tous les styles hérités */
+}
+nv-fielddropdownitemcheck nv-fieldcheckbox input[type=checkbox] {
+  all: unset; /* Réinitialise tous les styles hérités */
+  display: inline-block; /* Assurez-vous qu'il s'affiche correctement */
+  margin: 0; /* Supprime les marges */
+  padding: 0; /* Supprime les espaces internes */
+  width: 20px;
+  height: 20px;
+}

package/dist/collection/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.docs.js

@@ -0,0 +1,6 @@
+const NvFielddropdownitemcheckDocs = {
+    component: 'nv-fielddropdownitemcheck',
+    skip: true,
+};
+export default NvFielddropdownitemcheckDocs;
+//# sourceMappingURL=nv-fielddropdownitemcheck.docs.js.map

package/dist/collection/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.docs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nv-fielddropdownitemcheck.docs.js","sourceRoot":"","sources":["../../../src/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.docs.tsx"],"names":[],"mappings":"AAGA,MAAM,4BAA4B,GAChC;IACE,SAAS,EAAE,2BAA2B;IACtC,IAAI,EAAE,IAAI;CACX,CAAC;AAEJ,eAAe,4BAA4B,CAAC","sourcesContent":["import type { NovaDocs } from '../../nova-docs';\nimport { Components } from '../../components';\n\nconst NvFielddropdownitemcheckDocs: NovaDocs<Components.NvFielddropdownitemcheck> =\n  {\n    component: 'nv-fielddropdownitemcheck',\n    skip: true,\n  };\n\nexport default NvFielddropdownitemcheckDocs;\n"]}

package/dist/collection/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.js

@@ -0,0 +1,190 @@
+import { Host, h, } from "@stencil/core";
+export class NvFielddropdownitemcheck {
+    constructor() {
+        this.handleCheckboxToggle = () => {
+            if (this.disabled)
+                return; // Ignore interactions si désactivé
+            this.checked = !this.checked;
+            this.itemChecked.emit({
+                value: this.value,
+                checked: this.checked,
+                group: this.group,
+            });
+            console.log('itemChecked emitted:', {
+                value: this.value,
+                checked: this.checked,
+                group: this.group,
+            });
+        };
+        this.checked = false;
+        this.value = undefined;
+        this.label = undefined;
+        this.description = undefined;
+        this.group = undefined;
+        this.disabled = false;
+    }
+    //#endregion EVENTS
+    /****************************************************************************/
+    //#region RENDER
+    render() {
+        return (h(Host, { key: 'a12664b18cb98c654b7e13b1883775baf96f174d', onClick: this.handleCheckboxToggle }, h("div", { key: '279a9e736c4e12c214bff691494b1bbc8efea808' }, h("nv-fieldcheckbox", { key: 'b278a88b87f8d5137cd9bdf28b332a28938ef1e2', checked: this.checked, name: this.label || this.value, label: this.label || this.value, "label-placement": "after", description: this.description, disabled: this.disabled, tabindex: "-1", role: "option" }))));
+    }
+    static get is() { return "nv-fielddropdownitemcheck"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["nv-fielddropdownitemcheck.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["nv-fielddropdownitemcheck.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "checked": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indicates whether the checkbox is selected."
+                },
+                "attribute": "checked",
+                "reflect": true,
+                "defaultValue": "false"
+            },
+            "value": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The value associated with this item."
+                },
+                "attribute": "value",
+                "reflect": true
+            },
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The label displayed alongside the checkbox."
+                },
+                "attribute": "label",
+                "reflect": true
+            },
+            "description": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "A description providing additional context or information about the\ncheckbox."
+                },
+                "attribute": "description",
+                "reflect": true
+            },
+            "group": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The group this item belongs to, if applicable."
+                },
+                "attribute": "group",
+                "reflect": true
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Disables the item, preventing any user interaction."
+                },
+                "attribute": "disabled",
+                "reflect": true,
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "itemChecked",
+                "name": "itemChecked",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event emitted when the checkbox is toggled.\nIt provides details about the current state of the item."
+                },
+                "complexType": {
+                    "original": "{\n    value: string | undefined;\n    checked: boolean;\n    group?: string | undefined;\n  }",
+                    "resolved": "{ value: string; checked: boolean; group?: string; }",
+                    "references": {}
+                }
+            }];
+    }
+    static get elementRef() { return "el"; }
+}
+//  <Host
+//    role="checkbox"
+//    aria-checked={this.checked.toString()}
+//    tabindex="0"
+//    onClick={this.handleCheckboxToggle}
+//    class={{
+//      disabled: this.disabled,
+//    }}
+//  >
+//    <nv-fieldcheckbox
+//      checked={this.checked}
+//      name="checkbox-hidden-label"
+//      label={this.label || this.value}
+//      label-placement="after"
+//      description={this.description}
+//      disabled={this.disabled}
+//      tabindex="-1"
+//    ></nv-fieldcheckbox>
+//  </Host>;
+//# sourceMappingURL=nv-fielddropdownitemcheck.js.map

package/dist/collection/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nv-fielddropdownitemcheck.js","sourceRoot":"","sources":["../../../src/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,IAAI,EACJ,CAAC,EACD,IAAI,EACJ,KAAK,EAEL,OAAO,GACR,MAAM,eAAe,CAAC;AAOvB,MAAM,OAAO,wBAAwB;;QA0D3B,yBAAoB,GAAG,GAAG,EAAE;YAClC,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO,CAAC,mCAAmC;YAC9D,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;YAC7B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;gBACpB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,KAAK,EAAE,IAAI,CAAC,KAAK;aAClB,CAAC,CAAC;YAEH,OAAO,CAAC,GAAG,CAAC,sBAAsB,EAAE;gBAClC,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,KAAK,EAAE,IAAI,CAAC,KAAK;aAClB,CAAC,CAAC;QACL,CAAC,CAAC;uBA9DiB,KAAK;;;;;wBA+BK,KAAK;;IAiClC,mBAAmB;IACnB,8EAA8E;IAC9E,gBAAgB;IAEhB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,OAAO,EAAE,IAAI,CAAC,oBAAoB;YACtC;gBACE,yEACE,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,EAC9B,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,qBACf,OAAO,EACvB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAC,IAAI,EACb,IAAI,EAAC,QAAQ,GACK,CAChB,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGF;AAED,SAAS;AACT,qBAAqB;AACrB,4CAA4C;AAC5C,kBAAkB;AAClB,yCAAyC;AACzC,cAAc;AACd,gCAAgC;AAChC,QAAQ;AACR,KAAK;AACL,uBAAuB;AACvB,8BAA8B;AAC9B,oCAAoC;AACpC,wCAAwC;AACxC,+BAA+B;AAC/B,sCAAsC;AACtC,gCAAgC;AAChC,qBAAqB;AACrB,0BAA0B;AAC1B,YAAY","sourcesContent":["import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Element,\n} from '@stencil/core';\n\n@Component({\n  tag: 'nv-fielddropdownitemcheck',\n  styleUrl: 'nv-fielddropdownitemcheck.scss',\n  shadow: false,\n})\nexport class NvFielddropdownitemcheck {\n  @Element() el: HTMLNvFielddropdownitemcheckElement;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Indicates whether the checkbox is selected.\n   */\n  @Prop({ reflect: true, mutable: true })\n  checked: boolean = false;\n\n  /**\n   * The value associated with this item.\n   */\n  @Prop({ reflect: true })\n  readonly value?: string;\n\n  /**\n   * The label displayed alongside the checkbox.\n   */\n  @Prop({ reflect: true })\n  readonly label?: string;\n\n  /**\n   * A description providing additional context or information about the\n   * checkbox.\n   */\n  @Prop({ reflect: true })\n  readonly description?: string;\n\n  /**\n   * The group this item belongs to, if applicable.\n   */\n  @Prop({ reflect: true })\n  readonly group?: string;\n\n  /**\n   * Disables the item, preventing any user interaction.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Event emitted when the checkbox is toggled.\n   * It provides details about the current state of the item.\n   */\n  @Event()\n  itemChecked: EventEmitter<{\n    value: string | undefined;\n    checked: boolean;\n    group?: string | undefined;\n  }>;\n\n  private handleCheckboxToggle = () => {\n    if (this.disabled) return; // Ignore interactions si désactivé\n    this.checked = !this.checked;\n    this.itemChecked.emit({\n      value: this.value,\n      checked: this.checked,\n      group: this.group,\n    });\n\n    console.log('itemChecked emitted:', {\n      value: this.value,\n      checked: this.checked,\n      group: this.group,\n    });\n  };\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host onClick={this.handleCheckboxToggle}>\n        <div>\n          <nv-fieldcheckbox\n            checked={this.checked}\n            name={this.label || this.value}\n            label={this.label || this.value}\n            label-placement=\"after\"\n            description={this.description}\n            disabled={this.disabled}\n            tabindex=\"-1\"\n            role=\"option\"\n          ></nv-fieldcheckbox>\n        </div>\n      </Host>\n    );\n  }\n\n  //#endregion METHODS\n}\n\n//  <Host\n//    role=\"checkbox\"\n//    aria-checked={this.checked.toString()}\n//    tabindex=\"0\"\n//    onClick={this.handleCheckboxToggle}\n//    class={{\n//      disabled: this.disabled,\n//    }}\n//  >\n//    <nv-fieldcheckbox\n//      checked={this.checked}\n//      name=\"checkbox-hidden-label\"\n//      label={this.label || this.value}\n//      label-placement=\"after\"\n//      description={this.description}\n//      disabled={this.disabled}\n//      tabindex=\"-1\"\n//    ></nv-fieldcheckbox>\n//  </Host>;\n"]}

package/dist/collection/components/nv-fieldmultiselect/nv-fieldmultiselect.css

@@ -0,0 +1,195 @@
+nv-fieldmultiselect {
+  --nv-field-border-default: var(--components-form-field-border-default);
+  --nv-field-border-hover: var(--components-form-field-border-hover);
+  --nv-field-border-focus: var(--components-form-field-border-focus);
+  --nv-field-border-disabled: var(--components-form-field-border-default);
+  --nv-field-border-readonly: var(--components-form-field-border-default);
+  --nv-field-focus-box-shadow: var(--color-focus-brand);
+  --nv-field-background: var(--components-form-field-background-default);
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: var(--form-gap-y);
+  box-sizing: border-box;
+}
+nv-fieldmultiselect[readonly]:not([readonly=false]) {
+  --nv-field-border-default: var(--components-form-field-border-readonly);
+  --nv-field-border-hover: var(--nv-field-border-default);
+  --nv-field-border-focus: var(--components-form-field-border-focus);
+  --nv-field-border-disabled: var(--nv-field-border-default);
+  --nv-field-border-readonly: var(--nv-field-border-default);
+  --nv-field-background: var(--components-form-field-background-readonly);
+}
+nv-fieldmultiselect[error]:not([error=false]) {
+  --nv-field-border-default: var(--components-form-field-border-error);
+  --nv-field-border-hover: var(--nv-field-border-default);
+  --nv-field-border-focus: var(--nv-field-border-default);
+  --nv-field-border-disabled: var(--nv-field-border-default);
+  --nv-field-border-readonly: var(--nv-field-border-default);
+  --nv-field-focus-box-shadow: var(--color-focus-destructive);
+}
+nv-fieldmultiselect[required]:not([required=false]) label::after {
+  content: "*";
+  color: var(--components-form-text-required);
+  font-weight: 700;
+}
+nv-fieldmultiselect label {
+  display: flex;
+  align-items: center;
+  gap: var(--form-label-gap);
+  align-self: stretch;
+  color: var(--components-form-text-label-default);
+  font-family: "TT Norms Pro", sans-serif;
+  font-size: var(--form-label-font-size);
+  font-style: normal;
+  font-weight: 500;
+  line-height: var(--form-label-line-height);
+}
+nv-fieldmultiselect nv-popover {
+  width: 100%;
+  display: block;
+}
+nv-fieldmultiselect .input-wrapper-multiselect {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--form-gap-x);
+  align-items: stretch;
+  align-self: stretch;
+  width: 100%;
+}
+nv-fieldmultiselect .input-container-multiselect {
+  display: flex;
+  flex-grow: 1;
+  padding: calc(var(--form-field-padding-y) - 1px) var(--form-field-padding-x);
+  justify-content: center;
+  align-items: center;
+  gap: var(--form-field-gap);
+  align-self: stretch;
+  border-radius: var(--form-field-radius);
+  border-width: 1px;
+  border-style: solid;
+  border-color: var(--nv-field-border-default);
+  opacity: var(--components-form-opacity-default);
+  background: var(--nv-field-background);
+  transition: all 150ms ease-out;
+  display: flex;
+  align-items: center;
+  position: relative;
+  width: 100%;
+  min-height: 40px;
+}
+nv-fieldmultiselect .input-container-multiselect:hover {
+  border-color: var(--nv-field-border-hover);
+}
+nv-fieldmultiselect .input-container-multiselect:focus-within {
+  border-color: var(--nv-field-border-focus);
+  box-shadow: 0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow);
+}
+nv-fieldmultiselect .input-container-multiselect:has(input:read-only) {
+  opacity: 0.5;
+  background-color: var(--components-form-field-background-readonly);
+  border-color: var(--nv-field-border-readonly);
+}
+nv-fieldmultiselect .input-container-multiselect:has(input:disabled) {
+  opacity: 0.5;
+  background-color: var(--components-form-field-background-disabled);
+  border-color: var(--nv-field-border-disabled);
+}
+nv-fieldmultiselect .input-container-multiselect input,
+nv-fieldmultiselect .input-container-multiselect p.non-filterable-text {
+  display: flex;
+  align-items: center;
+  flex: 1 0 0;
+  overflow: hidden;
+  background-color: transparent;
+  color: var(--components-form-field-content-text);
+  text-overflow: ellipsis;
+  font-size: var(--form-field-font-size);
+  font-style: normal;
+  font-weight: 500;
+  line-height: var(--form-field-line-height);
+  width: 100%;
+  padding-right: 2rem;
+  flex-grow: 1;
+  margin: 0;
+  min-height: 100%;
+  box-sizing: border-box;
+}
+nv-fieldmultiselect .input-container-multiselect input:focus,
+nv-fieldmultiselect .input-container-multiselect p.non-filterable-text:focus {
+  outline: none;
+}
+nv-fieldmultiselect .input-container-multiselect input::placeholder,
+nv-fieldmultiselect .input-container-multiselect p.non-filterable-text::placeholder {
+  overflow: hidden;
+  color: var(--components-form-field-content-placeholder);
+  text-overflow: ellipsis;
+  font-family: "TT Norms Pro", sans-serif;
+  font-size: var(--form-field-font-size);
+  font-style: normal;
+  font-weight: 400;
+  line-height: var(--form-field-line-height);
+}
+nv-fieldmultiselect .input-container-multiselect .toggle-dropdown-icon {
+  position: absolute;
+  right: 0;
+  top: 50%;
+  transform: translateY(-50%);
+  z-index: 2;
+}
+nv-fieldmultiselect .input-container-multiselect nv-icon.validation {
+  color: var(--nv-field-border-default);
+  position: absolute;
+  right: 50px;
+}
+nv-fieldmultiselect .input-container-multiselect.focus-within, nv-fieldmultiselect .input-container-multiselect:hover {
+  border-color: var(--nv-field-border-focus);
+  box-shadow: 0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow);
+}
+nv-fieldmultiselect .non-filterable-text {
+  display: block;
+  border-radius: var(--form-field-radius);
+  background-color: var(--nv-field-background);
+  color: var(--components-form-field-content-text);
+  font-size: var(--form-field-font-size);
+  font-weight: 500;
+  line-height: var(--form-field-line-height);
+  box-sizing: border-box;
+  cursor: pointer;
+  height: 100%;
+  min-height: 40px;
+}
+nv-fieldmultiselect .non-filterable-text span {
+  display: inline-block;
+  width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+nv-fieldmultiselect .description {
+  align-self: stretch;
+  color: var(--components-form-text-description-default);
+  font-family: "TT Norms Pro", sans-serif;
+  font-size: var(--form-description-font-size);
+  font-style: normal;
+  line-height: var(--form-description-line-height);
+}
+nv-fieldmultiselect .error-description {
+  align-self: stretch;
+  color: var(--components-form-text-description-default);
+  font-family: "TT Norms Pro", sans-serif;
+  font-size: var(--form-description-font-size);
+  font-style: normal;
+  line-height: var(--form-description-line-height);
+  color: var(--components-form-text-description-error);
+}
+nv-fieldmultiselect hr {
+  border: none;
+  border-top: 1px solid var(--dropdown-divider-color, #ccc);
+  margin: 0.5rem 0;
+}
+
+.input-container-multiselect.focus-within,
+.input-container-multiselect:hover {
+  border-color: var(--nv-field-border-focus);
+  box-shadow: 0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow);
+}