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

package/dist/native/{p-13032ec1.entry.js → p-9991116a.entry.js}

@@ -1,2 +1,2 @@
-import{r as o,c as e,h as a,H as n,g as r}from"./p-d0a33e64.js";import{c}from"./p-8a1a6e56.js";import{u as i}from"./p-9a263d0e.js";import{u as l}from"./p-1cbacdba.js";import"./p-09cdd71f.js";import{t as d}from"./p-15aeab4d.js";const s="nv-badge{padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge.is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.with-gap{padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge.with-gap.is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.visually-hidden{position:absolute;padding:0;border:0;overflow:hidden;white-space:nowrap;width:1px;height:1px;margin:-1px;clip:rect(0, 0, 0, 0)}nv-badge:not(.with-gap){padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge:not(.with-gap).is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.badge-1{color:var(--color-rainbow-1-text);background-color:var(--color-rainbow-1-background);border-color:var(--color-rainbow-1-border)}nv-badge.badge-1 .close:focus,nv-badge.badge-1 .close:focus-within{outline:none}nv-badge.badge-1 .close:focus-visible,nv-badge.badge-1 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-1-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-1 nv-icon{color:var(--color-rainbow-1-icon)}nv-badge.badge-2{color:var(--color-rainbow-2-text);background-color:var(--color-rainbow-2-background);border-color:var(--color-rainbow-2-border)}nv-badge.badge-2 .close:focus,nv-badge.badge-2 .close:focus-within{outline:none}nv-badge.badge-2 .close:focus-visible,nv-badge.badge-2 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-2-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-2 nv-icon{color:var(--color-rainbow-2-icon)}nv-badge.badge-3{color:var(--color-rainbow-3-text);background-color:var(--color-rainbow-3-background);border-color:var(--color-rainbow-3-border)}nv-badge.badge-3 .close:focus,nv-badge.badge-3 .close:focus-within{outline:none}nv-badge.badge-3 .close:focus-visible,nv-badge.badge-3 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-3-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-3 nv-icon{color:var(--color-rainbow-3-icon)}nv-badge.badge-4{color:var(--color-rainbow-4-text);background-color:var(--color-rainbow-4-background);border-color:var(--color-rainbow-4-border)}nv-badge.badge-4 .close:focus,nv-badge.badge-4 .close:focus-within{outline:none}nv-badge.badge-4 .close:focus-visible,nv-badge.badge-4 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-4-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-4 nv-icon{color:var(--color-rainbow-4-icon)}nv-badge.badge-5{color:var(--color-rainbow-5-text);background-color:var(--color-rainbow-5-background);border-color:var(--color-rainbow-5-border)}nv-badge.badge-5 .close:focus,nv-badge.badge-5 .close:focus-within{outline:none}nv-badge.badge-5 .close:focus-visible,nv-badge.badge-5 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-5-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-5 nv-icon{color:var(--color-rainbow-5-icon)}nv-badge.badge-6{color:var(--color-rainbow-6-text);background-color:var(--color-rainbow-6-background);border-color:var(--color-rainbow-6-border)}nv-badge.badge-6 .close:focus,nv-badge.badge-6 .close:focus-within{outline:none}nv-badge.badge-6 .close:focus-visible,nv-badge.badge-6 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-6-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-6 nv-icon{color:var(--color-rainbow-6-icon)}nv-badge.badge-7{color:var(--color-rainbow-7-text);background-color:var(--color-rainbow-7-background);border-color:var(--color-rainbow-7-border)}nv-badge.badge-7 .close:focus,nv-badge.badge-7 .close:focus-within{outline:none}nv-badge.badge-7 .close:focus-visible,nv-badge.badge-7 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-7-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-7 nv-icon{color:var(--color-rainbow-7-icon)}nv-badge.badge-8{color:var(--color-rainbow-8-text);background-color:var(--color-rainbow-8-background);border-color:var(--color-rainbow-8-border)}nv-badge.badge-8 .close:focus,nv-badge.badge-8 .close:focus-within{outline:none}nv-badge.badge-8 .close:focus-visible,nv-badge.badge-8 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-8-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-8 nv-icon{color:var(--color-rainbow-8-icon)}nv-badge.badge-9{color:var(--color-rainbow-9-text);background-color:var(--color-rainbow-9-background);border-color:var(--color-rainbow-9-border)}nv-badge.badge-9 .close:focus,nv-badge.badge-9 .close:focus-within{outline:none}nv-badge.badge-9 .close:focus-visible,nv-badge.badge-9 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-9-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-9 nv-icon{color:var(--color-rainbow-9-icon)}nv-badge.badge-10{color:var(--color-rainbow-10-text);background-color:var(--color-rainbow-10-background);border-color:var(--color-rainbow-10-border)}nv-badge.badge-10 .close:focus,nv-badge.badge-10 .close:focus-within{outline:none}nv-badge.badge-10 .close:focus-visible,nv-badge.badge-10 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-10-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-10 nv-icon{color:var(--color-rainbow-10-icon)}nv-badge.badge-error{color:var(--color-feedback-error-low-text);background-color:var(--color-feedback-error-low-background);border-color:var(--color-feedback-error-low-border)}nv-badge.badge-error .close:focus,nv-badge.badge-error .close:focus-within{outline:none}nv-badge.badge-error .close:focus-visible,nv-badge.badge-error .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-error-low-content, var(--color-feedback-error-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-error nv-icon{color:var(--color-feedback-error-low-icon)}nv-badge.badge-information{color:var(--color-feedback-information-low-text);background-color:var(--color-feedback-information-low-background);border-color:var(--color-feedback-information-low-border)}nv-badge.badge-information .close:focus,nv-badge.badge-information .close:focus-within{outline:none}nv-badge.badge-information .close:focus-visible,nv-badge.badge-information .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-information-low-content, var(--color-feedback-information-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-information nv-icon{color:var(--color-feedback-information-low-icon)}nv-badge.badge-neutral{color:var(--color-feedback-neutral-low-text);background-color:var(--color-feedback-neutral-low-background);border-color:var(--color-feedback-neutral-low-border)}nv-badge.badge-neutral .close:focus,nv-badge.badge-neutral .close:focus-within{outline:none}nv-badge.badge-neutral .close:focus-visible,nv-badge.badge-neutral .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-neutral-low-content, var(--color-feedback-neutral-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-neutral nv-icon{color:var(--color-feedback-neutral-low-icon)}nv-badge.badge-success{color:var(--color-feedback-success-low-text);background-color:var(--color-feedback-success-low-background);border-color:var(--color-feedback-success-low-border)}nv-badge.badge-success .close:focus,nv-badge.badge-success .close:focus-within{outline:none}nv-badge.badge-success .close:focus-visible,nv-badge.badge-success .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-success-low-content, var(--color-feedback-success-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-success nv-icon{color:var(--color-feedback-success-low-icon)}nv-badge.badge-warning{color:var(--color-feedback-warning-low-text);background-color:var(--color-feedback-warning-low-background);border-color:var(--color-feedback-warning-low-border)}nv-badge.badge-warning .close:focus,nv-badge.badge-warning .close:focus-within{outline:none}nv-badge.badge-warning .close:focus-visible,nv-badge.badge-warning .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-warning-low-content, var(--color-feedback-warning-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-warning nv-icon{color:var(--color-feedback-warning-low-icon)}nv-badge.badge-amber{color:var(--color-rainbow-1-text);background-color:var(--color-rainbow-1-background);border-color:var(--color-rainbow-1-border)}nv-badge.badge-amber .close:focus,nv-badge.badge-amber .close:focus-within{outline:none}nv-badge.badge-amber .close:focus-visible,nv-badge.badge-amber .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-amber-content, var(--color-rainbow-1-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-amber nv-icon{color:var(--color-rainbow-1-icon)}nv-badge.badge-orange{color:var(--color-rainbow-2-text);background-color:var(--color-rainbow-2-background);border-color:var(--color-rainbow-2-border)}nv-badge.badge-orange .close:focus,nv-badge.badge-orange .close:focus-within{outline:none}nv-badge.badge-orange .close:focus-visible,nv-badge.badge-orange .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-orange-content, var(--color-rainbow-2-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-orange nv-icon{color:var(--color-rainbow-2-icon)}nv-badge.badge-turquoise{color:var(--color-rainbow-5-text);background-color:var(--color-rainbow-5-background);border-color:var(--color-rainbow-5-border)}nv-badge.badge-turquoise .close:focus,nv-badge.badge-turquoise .close:focus-within{outline:none}nv-badge.badge-turquoise .close:focus-visible,nv-badge.badge-turquoise .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-turquoise-content, var(--color-rainbow-5-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-turquoise nv-icon{color:var(--color-rainbow-5-icon)}nv-badge.badge-crimson{color:var(--color-rainbow-6-text);background-color:var(--color-rainbow-6-background);border-color:var(--color-rainbow-6-border)}nv-badge.badge-crimson .close:focus,nv-badge.badge-crimson .close:focus-within{outline:none}nv-badge.badge-crimson .close:focus-visible,nv-badge.badge-crimson .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-crimson-content, var(--color-rainbow-6-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-crimson nv-icon{color:var(--color-rainbow-6-icon)}nv-badge.badge-lime{color:var(--color-rainbow-9-text);background-color:var(--color-rainbow-9-background);border-color:var(--color-rainbow-9-border)}nv-badge.badge-lime .close:focus,nv-badge.badge-lime .close:focus-within{outline:none}nv-badge.badge-lime .close:focus-visible,nv-badge.badge-lime .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-lime-content, var(--color-rainbow-9-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-lime nv-icon{color:var(--color-rainbow-9-icon)}nv-badge.badge-petrol{color:var(--color-rainbow-8-text);background-color:var(--color-rainbow-8-background);border-color:var(--color-rainbow-8-border)}nv-badge.badge-petrol .close:focus,nv-badge.badge-petrol .close:focus-within{outline:none}nv-badge.badge-petrol .close:focus-visible,nv-badge.badge-petrol .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-petrol-content, var(--color-rainbow-8-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-petrol nv-icon{color:var(--color-rainbow-8-icon)}nv-badge span{font-size:var(--font-size-xs);line-height:var(--line-height-xs) !important;text-align:center}nv-badge nv-icon>svg.icon-xs{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-sm{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-md{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-lg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-xl{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge .close{padding:0;line-height:0;border:none;background:none;cursor:pointer;color:inherit;display:inline-flex;align-items:center;aspect-ratio:1/1;border-radius:var(--radius-rounded-full)}";const b=s;const t=class{constructor(a){o(this,a);this.closeClicked=e(this,"closeClicked",7);this.hiddenChanged=e(this,"hiddenChanged",7);this.hiddenChangedComplete=e(this,"hiddenChangedComplete",7);this.dismissal=false;this.color="1";this.label=null;this.leadIcon=null;this.dismissible=false;this.hidden=false;this.preventAutoClose=false;this.isIconOnly=false;this.handleClose=()=>{if(!this.preventAutoClose){this.hidden=true}this.closeClicked.emit()}}handleDismissalChange(o){this.dismissible=o}handleIconChange(o){this.leadIcon=o}async handleHiddenChange(o){this.hiddenChanged.emit(o);if(this._isHidden===true)this._isHidden=o;const{fadeIn:e,fadeOut:a}=l(this.ref,{duration:150});const{collapse:n,expand:r}=i(this.ref,{duration:150});if(o===true)await d(a,n).start();if(o===false)await d(r,e).start();this.hiddenChangedComplete.emit(o);if(this._isHidden===false)this._isHidden=o}componentWillLoad(){if(this.dismissal){this.dismissible=this.dismissal}if(this.icon!=null&&this.icon!=""){this.leadIcon=this.icon}if(this.hidden){this._isHidden=true;const{setCollapsed:o}=i(this.ref);const{setFadeOut:e}=l(this.ref);o();e()}}render(){return a(n,{key:"435c5bb1f565c8bd95cca5c6828157c80f60aa39",class:c(`badge-${this.color}`,{"has-close":this.dismissible,"with-gap":this.dismissible||this.label,"visually-hidden":this._isHidden,"is-icon-only":this.isIconOnly})},a("slot",{key:"271dc833471e026af5088f48227639682e661e97",name:"leading-icon"},this.leadIcon&&a("nv-icon",{key:"e578eabf4c5a09e61e28c3839b943804acdf88e8",name:this.leadIcon,size:"sm"})),a("span",{key:"24d16a21b2b4499be712f9b747c9ab63c5e6ca0c",class:c({"visually-hidden":this.isIconOnly})},this.label,a("slot",{key:"3e3827620e6ade8be256ce7dd0b8bb949f36f2d5"})),this.dismissible&&a("button",{key:"90ed9ec1b71815554b963b0eafeb5536578700cf",onClick:this.handleClose,class:"close",type:"button"},a("nv-icon",{key:"df426e5d88c2bf02e7aa83c179c05db4795f03db",name:"x",size:"sm"})))}get ref(){return r(this)}static get watchers(){return{dismissal:["handleDismissalChange"],icon:["handleIconChange"],hidden:["handleHiddenChange"]}}};t.style=b;const g="nv-fielddropdownitemcheck{cursor:pointer;display:flex;padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);border-radius:var(--list-dropdown-item-radius)}nv-fielddropdownitemcheck slot-fb,nv-fielddropdownitemcheck span{all:unset}nv-fielddropdownitemcheck:hover{background-color:var(--components-list-dropdown-item-background-hover)}";const v=g;const u=class{constructor(a){o(this,a);this.itemChecked=e(this,"itemChecked",7);this.checked=false;this.disabled=false;this.onFieldcheckboxChanged=o=>{if(this.disabled)return;this.checked=o.detail;this.itemChecked.emit({value:this.value,checked:this.checked,group:this.group})};this.handleClick=()=>{if(this.disabled)return;if(this.el.querySelector("input").checked){this.checked=false}else{this.checked=true}}}render(){return a(n,{key:"869eb969c0cff66f1947673e5aa3e0c677a07421",onClick:this.handleClick},a("nv-fieldcheckbox",{key:"4bbe45597bdd0f30c8e9a255e52d08be476fab1a",checked:this.checked,name:this.label||this.value,label:this.label||this.value,labelPlacement:"after",description:this.description,disabled:this.disabled,tabindex:"-1",onCheckedChanged:this.onFieldcheckboxChanged},a("slot",{key:"f53f44e3fdb78894e9bb37fa455b1407efea17b1"}),a("slot",{key:"aacd757c1fec541a4fc7b4f2683281aef31ee135",name:"main"}),a("slot",{key:"ef2f761a3a1f05dcba6145efc89830ddc82af27d",name:"label"}),a("slot",{key:"610700f871b524f1f89538d03bd6c16167e3b24e",name:"description"})))}get el(){return r(this)}};u.style=v;export{t as nv_badge,u as nv_fielddropdownitemcheck};
-//# sourceMappingURL=p-13032ec1.entry.js.map
+import{r as o,c as e,h as a,H as n,g as r}from"./p-d0a33e64.js";import{c}from"./p-8a1a6e56.js";import{u as i}from"./p-9a263d0e.js";import{u as l}from"./p-1cbacdba.js";import"./p-09cdd71f.js";import{t as d}from"./p-15aeab4d.js";const s="nv-badge{padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge.is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.with-gap{padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge.with-gap.is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.visually-hidden{position:absolute;padding:0;border:0;overflow:hidden;white-space:nowrap;width:1px;height:1px;margin:-1px;clip:rect(0, 0, 0, 0)}nv-badge:not(.with-gap){padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge:not(.with-gap).is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.badge-1{color:var(--color-rainbow-1-text);background-color:var(--color-rainbow-1-background);border-color:var(--color-rainbow-1-border)}nv-badge.badge-1 .close:focus,nv-badge.badge-1 .close:focus-within{outline:none}nv-badge.badge-1 .close:focus-visible,nv-badge.badge-1 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-1-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-1 nv-icon{color:var(--color-rainbow-1-icon)}nv-badge.badge-2{color:var(--color-rainbow-2-text);background-color:var(--color-rainbow-2-background);border-color:var(--color-rainbow-2-border)}nv-badge.badge-2 .close:focus,nv-badge.badge-2 .close:focus-within{outline:none}nv-badge.badge-2 .close:focus-visible,nv-badge.badge-2 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-2-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-2 nv-icon{color:var(--color-rainbow-2-icon)}nv-badge.badge-3{color:var(--color-rainbow-3-text);background-color:var(--color-rainbow-3-background);border-color:var(--color-rainbow-3-border)}nv-badge.badge-3 .close:focus,nv-badge.badge-3 .close:focus-within{outline:none}nv-badge.badge-3 .close:focus-visible,nv-badge.badge-3 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-3-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-3 nv-icon{color:var(--color-rainbow-3-icon)}nv-badge.badge-4{color:var(--color-rainbow-4-text);background-color:var(--color-rainbow-4-background);border-color:var(--color-rainbow-4-border)}nv-badge.badge-4 .close:focus,nv-badge.badge-4 .close:focus-within{outline:none}nv-badge.badge-4 .close:focus-visible,nv-badge.badge-4 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-4-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-4 nv-icon{color:var(--color-rainbow-4-icon)}nv-badge.badge-5{color:var(--color-rainbow-5-text);background-color:var(--color-rainbow-5-background);border-color:var(--color-rainbow-5-border)}nv-badge.badge-5 .close:focus,nv-badge.badge-5 .close:focus-within{outline:none}nv-badge.badge-5 .close:focus-visible,nv-badge.badge-5 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-5-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-5 nv-icon{color:var(--color-rainbow-5-icon)}nv-badge.badge-6{color:var(--color-rainbow-6-text);background-color:var(--color-rainbow-6-background);border-color:var(--color-rainbow-6-border)}nv-badge.badge-6 .close:focus,nv-badge.badge-6 .close:focus-within{outline:none}nv-badge.badge-6 .close:focus-visible,nv-badge.badge-6 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-6-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-6 nv-icon{color:var(--color-rainbow-6-icon)}nv-badge.badge-7{color:var(--color-rainbow-7-text);background-color:var(--color-rainbow-7-background);border-color:var(--color-rainbow-7-border)}nv-badge.badge-7 .close:focus,nv-badge.badge-7 .close:focus-within{outline:none}nv-badge.badge-7 .close:focus-visible,nv-badge.badge-7 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-7-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-7 nv-icon{color:var(--color-rainbow-7-icon)}nv-badge.badge-8{color:var(--color-rainbow-8-text);background-color:var(--color-rainbow-8-background);border-color:var(--color-rainbow-8-border)}nv-badge.badge-8 .close:focus,nv-badge.badge-8 .close:focus-within{outline:none}nv-badge.badge-8 .close:focus-visible,nv-badge.badge-8 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-8-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-8 nv-icon{color:var(--color-rainbow-8-icon)}nv-badge.badge-9{color:var(--color-rainbow-9-text);background-color:var(--color-rainbow-9-background);border-color:var(--color-rainbow-9-border)}nv-badge.badge-9 .close:focus,nv-badge.badge-9 .close:focus-within{outline:none}nv-badge.badge-9 .close:focus-visible,nv-badge.badge-9 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-9-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-9 nv-icon{color:var(--color-rainbow-9-icon)}nv-badge.badge-10{color:var(--color-rainbow-10-text);background-color:var(--color-rainbow-10-background);border-color:var(--color-rainbow-10-border)}nv-badge.badge-10 .close:focus,nv-badge.badge-10 .close:focus-within{outline:none}nv-badge.badge-10 .close:focus-visible,nv-badge.badge-10 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-10-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-10 nv-icon{color:var(--color-rainbow-10-icon)}nv-badge.badge-error{color:var(--color-feedback-error-low-text);background-color:var(--color-feedback-error-low-background);border-color:var(--color-feedback-error-low-border)}nv-badge.badge-error .close:focus,nv-badge.badge-error .close:focus-within{outline:none}nv-badge.badge-error .close:focus-visible,nv-badge.badge-error .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-error-low-content, var(--color-feedback-error-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-error nv-icon{color:var(--color-feedback-error-low-icon)}nv-badge.badge-information{color:var(--color-feedback-information-low-text);background-color:var(--color-feedback-information-low-background);border-color:var(--color-feedback-information-low-border)}nv-badge.badge-information .close:focus,nv-badge.badge-information .close:focus-within{outline:none}nv-badge.badge-information .close:focus-visible,nv-badge.badge-information .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-information-low-content, var(--color-feedback-information-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-information nv-icon{color:var(--color-feedback-information-low-icon)}nv-badge.badge-neutral{color:var(--color-feedback-neutral-low-text);background-color:var(--color-feedback-neutral-low-background);border-color:var(--color-feedback-neutral-low-border)}nv-badge.badge-neutral .close:focus,nv-badge.badge-neutral .close:focus-within{outline:none}nv-badge.badge-neutral .close:focus-visible,nv-badge.badge-neutral .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-neutral-low-content, var(--color-feedback-neutral-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-neutral nv-icon{color:var(--color-feedback-neutral-low-icon)}nv-badge.badge-success{color:var(--color-feedback-success-low-text);background-color:var(--color-feedback-success-low-background);border-color:var(--color-feedback-success-low-border)}nv-badge.badge-success .close:focus,nv-badge.badge-success .close:focus-within{outline:none}nv-badge.badge-success .close:focus-visible,nv-badge.badge-success .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-success-low-content, var(--color-feedback-success-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-success nv-icon{color:var(--color-feedback-success-low-icon)}nv-badge.badge-warning{color:var(--color-feedback-warning-low-text);background-color:var(--color-feedback-warning-low-background);border-color:var(--color-feedback-warning-low-border)}nv-badge.badge-warning .close:focus,nv-badge.badge-warning .close:focus-within{outline:none}nv-badge.badge-warning .close:focus-visible,nv-badge.badge-warning .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-warning-low-content, var(--color-feedback-warning-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-warning nv-icon{color:var(--color-feedback-warning-low-icon)}nv-badge.badge-amber{color:var(--color-rainbow-1-text);background-color:var(--color-rainbow-1-background);border-color:var(--color-rainbow-1-border)}nv-badge.badge-amber .close:focus,nv-badge.badge-amber .close:focus-within{outline:none}nv-badge.badge-amber .close:focus-visible,nv-badge.badge-amber .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-amber-content, var(--color-rainbow-1-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-amber nv-icon{color:var(--color-rainbow-1-icon)}nv-badge.badge-orange{color:var(--color-rainbow-2-text);background-color:var(--color-rainbow-2-background);border-color:var(--color-rainbow-2-border)}nv-badge.badge-orange .close:focus,nv-badge.badge-orange .close:focus-within{outline:none}nv-badge.badge-orange .close:focus-visible,nv-badge.badge-orange .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-orange-content, var(--color-rainbow-2-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-orange nv-icon{color:var(--color-rainbow-2-icon)}nv-badge.badge-turquoise{color:var(--color-rainbow-5-text);background-color:var(--color-rainbow-5-background);border-color:var(--color-rainbow-5-border)}nv-badge.badge-turquoise .close:focus,nv-badge.badge-turquoise .close:focus-within{outline:none}nv-badge.badge-turquoise .close:focus-visible,nv-badge.badge-turquoise .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-turquoise-content, var(--color-rainbow-5-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-turquoise nv-icon{color:var(--color-rainbow-5-icon)}nv-badge.badge-crimson{color:var(--color-rainbow-6-text);background-color:var(--color-rainbow-6-background);border-color:var(--color-rainbow-6-border)}nv-badge.badge-crimson .close:focus,nv-badge.badge-crimson .close:focus-within{outline:none}nv-badge.badge-crimson .close:focus-visible,nv-badge.badge-crimson .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-crimson-content, var(--color-rainbow-6-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-crimson nv-icon{color:var(--color-rainbow-6-icon)}nv-badge.badge-lime{color:var(--color-rainbow-9-text);background-color:var(--color-rainbow-9-background);border-color:var(--color-rainbow-9-border)}nv-badge.badge-lime .close:focus,nv-badge.badge-lime .close:focus-within{outline:none}nv-badge.badge-lime .close:focus-visible,nv-badge.badge-lime .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-lime-content, var(--color-rainbow-9-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-lime nv-icon{color:var(--color-rainbow-9-icon)}nv-badge.badge-petrol{color:var(--color-rainbow-8-text);background-color:var(--color-rainbow-8-background);border-color:var(--color-rainbow-8-border)}nv-badge.badge-petrol .close:focus,nv-badge.badge-petrol .close:focus-within{outline:none}nv-badge.badge-petrol .close:focus-visible,nv-badge.badge-petrol .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-petrol-content, var(--color-rainbow-8-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-petrol nv-icon{color:var(--color-rainbow-8-icon)}nv-badge span{font-size:var(--font-size-xs);line-height:var(--line-height-xs) !important;text-align:center}nv-badge nv-icon>svg.icon-xs{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-sm{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-md{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-lg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-xl{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge .close{padding:0;line-height:0;border:none;background:none;cursor:pointer;color:inherit;display:inline-flex;align-items:center;aspect-ratio:1/1;border-radius:var(--radius-rounded-full)}";const t=s;const b=class{constructor(a){o(this,a);this.closeClicked=e(this,"closeClicked",7);this.hiddenChanged=e(this,"hiddenChanged",7);this.hiddenChangedComplete=e(this,"hiddenChangedComplete",7);this.dismissal=false;this.color="1";this.label=null;this.leadIcon=null;this.dismissible=false;this.hidden=false;this.preventAutoClose=false;this.isIconOnly=false;this.handleClose=()=>{if(!this.preventAutoClose){this.hidden=true}this.closeClicked.emit()}}handleDismissalChange(o){this.dismissible=o}handleIconChange(o){this.leadIcon=o}async handleHiddenChange(o){this.hiddenChanged.emit(o);if(this._isHidden===true)this._isHidden=o;const{fadeIn:e,fadeOut:a}=l(this.ref,{duration:150});const{collapse:n,expand:r}=i(this.ref,{duration:150});if(o===true)await d(a,n).start();if(o===false)await d(r,e).start();this.hiddenChangedComplete.emit(o);if(this._isHidden===false)this._isHidden=o}componentWillLoad(){if(this.dismissal){this.dismissible=this.dismissal}if(this.icon!=null&&this.icon!=""){this.leadIcon=this.icon}if(this.hidden){this._isHidden=true;const{setCollapsed:o}=i(this.ref);const{setFadeOut:e}=l(this.ref);o();e()}}render(){return a(n,{key:"435c5bb1f565c8bd95cca5c6828157c80f60aa39",class:c(`badge-${this.color}`,{"has-close":this.dismissible,"with-gap":this.dismissible||this.label,"visually-hidden":this._isHidden,"is-icon-only":this.isIconOnly})},a("slot",{key:"271dc833471e026af5088f48227639682e661e97",name:"leading-icon"},this.leadIcon&&a("nv-icon",{key:"e578eabf4c5a09e61e28c3839b943804acdf88e8",name:this.leadIcon,size:"sm"})),a("span",{key:"24d16a21b2b4499be712f9b747c9ab63c5e6ca0c",class:c({"visually-hidden":this.isIconOnly})},this.label,a("slot",{key:"3e3827620e6ade8be256ce7dd0b8bb949f36f2d5"})),this.dismissible&&a("button",{key:"90ed9ec1b71815554b963b0eafeb5536578700cf",onClick:this.handleClose,class:"close",type:"button"},a("nv-icon",{key:"df426e5d88c2bf02e7aa83c179c05db4795f03db",name:"x",size:"sm"})))}get ref(){return r(this)}static get watchers(){return{dismissal:["handleDismissalChange"],icon:["handleIconChange"],hidden:["handleHiddenChange"]}}};b.style=t;const g="nv-fielddropdownitemcheck{cursor:pointer;display:flex;padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);border-radius:var(--list-dropdown-item-radius)}nv-fielddropdownitemcheck slot-fb,nv-fielddropdownitemcheck span{all:unset}nv-fielddropdownitemcheck:hover{background-color:var(--components-list-dropdown-item-background-hover)}";const v=g;const u=class{constructor(a){o(this,a);this.itemChecked=e(this,"itemChecked",7);this.checked=false;this.disabled=false;this.onFieldcheckboxChanged=o=>{if(this.disabled)return;this.checked=o.detail;this.itemChecked.emit({value:this.value,checked:this.checked,group:this.group})};this.handleClick=()=>{if(this.disabled)return;if(this.el.querySelector("input").checked){this.checked=false}else{this.checked=true}}}render(){return a(n,{key:"cb922f0c0224c950ab5a87783028f2909eb1e39c",onClick:this.handleClick},a("nv-fieldcheckbox",{key:"6f8748022131a8cd31b0f69851313f80c330172a",checked:this.checked,name:this.label||this.value,label:this.label||this.value,labelPlacement:"after",description:this.description,disabled:this.disabled,tabindex:"-1",onCheckedChanged:this.onFieldcheckboxChanged},a("slot",{key:"20d1014accc6cfc00658703057b25037175287af"}),a("slot",{key:"a7e61eed6bc72d3a14096cac2c195629a0ce2928",name:"main"}),a("slot",{key:"93f6bce370ac36f1ce3e0f2c1d9cdd598c14cb14",name:"label"}),a("slot",{key:"837359fc1fea49e0dea221039dc7466cdc86b757",name:"description"})))}get el(){return r(this)}};u.style=v;export{b as nv_badge,u as nv_fielddropdownitemcheck};
+//# sourceMappingURL=p-9991116a.entry.js.map

package/dist/native/{p-13032ec1.entry.js.map → p-9991116a.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["nvBadgeCss","NvBadgeStyle0","NvBadge","constructor","hostRef","this","dismissal","color","label","leadIcon","dismissible","hidden","preventAutoClose","isIconOnly","handleClose","closeClicked","emit","handleDismissalChange","handleIconChange","icon","handleHiddenChange","hiddenChanged","_isHidden","fadeIn","fadeOut","useFade","ref","duration","collapse","expand","useCollapse","timeline","start","hiddenChangedComplete","componentWillLoad","setCollapsed","setFadeOut","render","h","Host","key","class","clsx","name","size","onClick","type","nvFielddropdownitemcheckCss","NvFielddropdownitemcheckStyle0","NvFielddropdownitemcheck","checked","disabled","onFieldcheckboxChanged","event","detail","itemChecked","value","group","handleClick","el","querySelector","labelPlacement","description","tabindex","onCheckedChanged"],"sources":["src/components/nv-badge/nv-badge.scss?tag=nv-badge","src/components/nv-badge/nv-badge.tsx","src/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.scss?tag=nv-fielddropdownitemcheck","src/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.tsx"],"sourcesContent":["@use 'sass:map';\n@use '../nv-icon/styles/mixins' as icon;\n@use '../../styles/utils' as utils;\n@import '../../styles/focus-ring';\n\n/* Variants */\n$badge-colors: (\n  '1',\n  '2',\n  '3',\n  '4',\n  '5',\n  '6',\n  '7',\n  '8',\n  '9',\n  '10',\n  'error',\n  'information',\n  'neutral',\n  'success',\n  'warning',\n  'amber',\n  'orange',\n  'turquoise',\n  'crimson',\n  'lime',\n  'petrol',\n);\n\n/* Define maps for color-related variables */\n$color-rainbow-text: (\n  '1': var(--color-rainbow-1-text),\n  '2': var(--color-rainbow-2-text),\n  '3': var(--color-rainbow-3-text),\n  '4': var(--color-rainbow-4-text),\n  '5': var(--color-rainbow-5-text),\n  '6': var(--color-rainbow-6-text),\n  '7': var(--color-rainbow-7-text),\n  '8': var(--color-rainbow-8-text),\n  '9': var(--color-rainbow-9-text),\n  '10': var(--color-rainbow-10-text),\n  'error': var(--color-feedback-error-low-text),\n  'information': var(--color-feedback-information-low-text),\n  'neutral': var(--color-feedback-neutral-low-text),\n  'success': var(--color-feedback-success-low-text),\n  'warning': var(--color-feedback-warning-low-text),\n  'amber': var(--color-rainbow-1-text),\n  'orange': var(--color-rainbow-2-text),\n  'turquoise': var(--color-rainbow-5-text),\n  'crimson': var(--color-rainbow-6-text),\n  'lime': var(--color-rainbow-9-text),\n  'petrol': var(--color-rainbow-8-text),\n);\n\n$color-rainbow-icon: (\n  '1': var(--color-rainbow-1-icon),\n  '2': var(--color-rainbow-2-icon),\n  '3': var(--color-rainbow-3-icon),\n  '4': var(--color-rainbow-4-icon),\n  '5': var(--color-rainbow-5-icon),\n  '6': var(--color-rainbow-6-icon),\n  '7': var(--color-rainbow-7-icon),\n  '8': var(--color-rainbow-8-icon),\n  '9': var(--color-rainbow-9-icon),\n  '10': var(--color-rainbow-10-icon),\n  'error': var(--color-feedback-error-low-icon),\n  'information': var(--color-feedback-information-low-icon),\n  'neutral': var(--color-feedback-neutral-low-icon),\n  'success': var(--color-feedback-success-low-icon),\n  'warning': var(--color-feedback-warning-low-icon),\n  'amber': var(--color-rainbow-1-icon),\n  'orange': var(--color-rainbow-2-icon),\n  'turquoise': var(--color-rainbow-5-icon),\n  'crimson': var(--color-rainbow-6-icon),\n  'lime': var(--color-rainbow-9-icon),\n  'petrol': var(--color-rainbow-8-icon),\n);\n\n$color-rainbow-background: (\n  '1': var(--color-rainbow-1-background),\n  '2': var(--color-rainbow-2-background),\n  '3': var(--color-rainbow-3-background),\n  '4': var(--color-rainbow-4-background),\n  '5': var(--color-rainbow-5-background),\n  '6': var(--color-rainbow-6-background),\n  '7': var(--color-rainbow-7-background),\n  '8': var(--color-rainbow-8-background),\n  '9': var(--color-rainbow-9-background),\n  '10': var(--color-rainbow-10-background),\n  'error': var(--color-feedback-error-low-background),\n  'information': var(--color-feedback-information-low-background),\n  'neutral': var(--color-feedback-neutral-low-background),\n  'success': var(--color-feedback-success-low-background),\n  'warning': var(--color-feedback-warning-low-background),\n  'amber': var(--color-rainbow-1-background),\n  'orange': var(--color-rainbow-2-background),\n  'turquoise': var(--color-rainbow-5-background),\n  'crimson': var(--color-rainbow-6-background),\n  'lime': var(--color-rainbow-9-background),\n  'petrol': var(--color-rainbow-8-background),\n);\n$color-rainbow-border: (\n  '1': var(--color-rainbow-1-border),\n  '2': var(--color-rainbow-2-border),\n  '3': var(--color-rainbow-3-border),\n  '4': var(--color-rainbow-4-border),\n  '5': var(--color-rainbow-5-border),\n  '6': var(--color-rainbow-6-border),\n  '7': var(--color-rainbow-7-border),\n  '8': var(--color-rainbow-8-border),\n  '9': var(--color-rainbow-9-border),\n  '10': var(--color-rainbow-10-border),\n  'error': var(--color-feedback-error-low-border),\n  'information': var(--color-feedback-information-low-border),\n  'neutral': var(--color-feedback-neutral-low-border),\n  'success': var(--color-feedback-success-low-border),\n  'warning': var(--color-feedback-warning-low-border),\n  'amber': var(--color-rainbow-1-border),\n  'orange': var(--color-rainbow-2-border),\n  'turquoise': var(--color-rainbow-5-border),\n  'crimson': var(--color-rainbow-6-border),\n  'lime': var(--color-rainbow-9-border),\n  'petrol': var(--color-rainbow-8-border),\n);\n\n@mixin root-styles() {\n  padding: var(--badge-padding-y) var(--badge-padding-x);\n  display: inline-flex !important; // override the display: none in [hidden] css\n  gap: var(--badge-gap-x);\n  vertical-align: middle;\n  align-items: center;\n  border-radius: var(--radius-rounded-full);\n  border-style: solid;\n  border-width: 0.5px;\n  height: fit-content;\n  width: fit-content;\n\n  &.is-icon-only {\n    padding: var(--badge-padding-y) var(--badge-padding-icon-only-x);\n    gap: var(--badge-gap-icon-only-x);\n  }\n}\n\n@mixin root-styles-with-gap() {\n  @include root-styles();\n}\n\n@mixin badge-color($color-key) {\n  color: map.get($color-rainbow-text, $color-key);\n  background-color: map.get($color-rainbow-background, $color-key);\n  border-color: map.get($color-rainbow-border, $color-key);\n  .close {\n    @include focus-ring(\n      if(\n        str-index('error information neutral success warning', $color-key),\n        var(\n          --color-feedback-#{$color-key}-low-content,\n          map.get($color-rainbow-text, $color-key)\n        ),\n        if(\n          type-of($color-key) == 'string' and not (str-length($color-key) <= 2)\n            and not\n            str-index('error information neutral success warning', $color-key),\n          var(\n            --color-#{$color-key}-content,\n            map.get($color-rainbow-text, $color-key)\n          ),\n          var(--color-rainbow-#{$color-key}-content)\n        )\n      ),\n      0.2\n    );\n  }\n}\n\n@mixin icon-color($color-key) {\n  color: map.get($color-rainbow-icon, $color-key);\n}\n\n@mixin type-settings($font-size, $line-height) {\n  font-size: var(--font-size-xs);\n  line-height: var(--line-height-xs) !important;\n}\n\nnv-badge {\n  @include root-styles();\n\n  //gap styles\n  &.with-gap {\n    @include root-styles-with-gap();\n  }\n\n  &.visually-hidden {\n    @include utils.visually-hidden();\n  }\n\n  &:not(.with-gap) {\n    @include root-styles();\n  }\n\n  // color styles\n  @each $i in $badge-colors {\n    &.badge-#{$i} {\n      @include badge-color($i);\n      nv-icon {\n        @include icon-color($i);\n      }\n    }\n  }\n\n  //label styles\n  & span {\n    @include type-settings(xs, xs);\n    text-align: center;\n  }\n\n  // nv-icon styles\n  & nv-icon > svg {\n    @each $size, $config in icon.$size-variants {\n      &.icon-#{$size} {\n        @include icon.icon-size-and-stroke(\n          map.get(map.get(icon.$size-variants, 'xs'), size),\n          map.get(map.get(icon.$size-variants, 'xs'), stroke)\n        );\n      }\n    }\n  }\n\n  .close {\n    padding: 0;\n    line-height: 0;\n    border: none;\n    background: none;\n    cursor: pointer;\n    color: inherit;\n    display: inline-flex;\n    align-items: center;\n    aspect-ratio: 1/1;\n    border-radius: var(--radius-rounded-full);\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Watch,\n  Element,\n  State,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { useFade, useCollapse, timeline } from '../../animations';\n\n/**\n * @slot leading-icon - Icon before the label.\n * @slot default - for custom content, for pure text use label instead.\n */\n@Component({\n  tag: 'nv-badge',\n  styleUrl: 'nv-badge.scss',\n  shadow: false,\n})\nexport class NvBadge {\n  @Element() ref: HTMLNvBadgeElement;\n\n  /****************************************************************************/\n  //#region DEPRECATED\n\n  /**\n   * Whether the badge is dismissible.\n   * @deprecated use dismissible instead.\n   */\n  @Prop({ reflect: true })\n  readonly dismissal: boolean = false;\n\n  /**\n   * The icon to display in the badge.\n   * @deprecated use leadIcon or slot=\"leading-icon\" instead.\n   */\n  @Prop({ reflect: true })\n  readonly icon: string;\n\n  /**\n   * The location of the icon in the badge.\n   * @deprecated only leadIcon now.\n   */\n  @Prop({ reflect: true })\n  readonly iconLocation: 'left' | 'right';\n\n  //#endregion DEPRECATED\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * The color of the badge.\n   * deprecated Use status values or named colors instead.\n   * Use a string between 1 to 10\n   * or one of the status values: error, information, neutral, success, warning\n   * or one of the color names: amber, orange, turquoise, crimson, lime\n   */\n  @Prop({ reflect: true })\n  readonly color?: string = '1';\n\n  /**\n   * Main content of the badge.\n   */\n  @Prop({ reflect: true })\n  readonly label?: string | null = null;\n\n  /**\n   * The lead icon of the badge.\n   */\n  @Prop({ reflect: true, mutable: true })\n  leadIcon?: string | null = null;\n\n  /**\n   * Whether the badge is dismissible.\n   */\n  @Prop({ reflect: true, mutable: true })\n  dismissible: boolean = false;\n\n  /**\n   * Controls the visibility of the badge. Will animate with fade and collapse.\n   */\n  @Prop({ reflect: true, mutable: true })\n  hidden: boolean = false; // eslint-disable-line @stencil-community/reserved-member-names\n  @State()\n  private _isHidden: boolean;\n\n  /**\n   * When true, the alert does not automatically close upon dismissing.\n   * Useful for externally controlled component behavior.\n   */\n  @Prop({ reflect: true })\n  readonly preventAutoClose: boolean = false;\n\n  /**\n   * When true, the badge will only display an icon without label.\n   * The label will be visually hidden but still accessible for screen readers.\n   */\n  @Prop({ reflect: true })\n  readonly isIconOnly?: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emitted when the badge is dismissed.\n   */\n  @Event()\n  closeClicked: EventEmitter<void>;\n\n  /**\n   * Emits when the 'hidden' prop changes, reflecting a change in visibility.\n   * Passes hidden value to the detail.\n   */\n  @Event()\n  hiddenChanged: EventEmitter<boolean>;\n\n  /**\n   * Emitted when the animations complete, detail includes the hidden value.\n   */\n  @Event()\n  hiddenChangedComplete: EventEmitter<boolean>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  /**\n   * Handles the dismissal prop change.\n   * @param {boolean} dismissal - The new dismissal value.\n   */\n  @Watch('dismissal')\n  handleDismissalChange(dismissal: boolean) {\n    this.dismissible = dismissal;\n  }\n\n  /**\n   * Handles the icon prop change.\n   * @param {string} icon - The new icon value.\n   */\n  @Watch('icon')\n  handleIconChange(icon: string) {\n    this.leadIcon = icon;\n  }\n\n  /**\n   * Handles the hidden prop change.\n   * @param {boolean} hidden - The new hidden value.\n   */\n  @Watch('hidden')\n  async handleHiddenChange(hidden: boolean) {\n    this.hiddenChanged.emit(hidden);\n    if (this._isHidden === true) this._isHidden = hidden;\n\n    const { fadeIn, fadeOut } = useFade(this.ref, { duration: 150 });\n    const { collapse, expand } = useCollapse(this.ref, { duration: 150 });\n\n    if (hidden === true) await timeline(fadeOut, collapse).start();\n    if (hidden === false) await timeline(expand, fadeIn).start();\n\n    this.hiddenChangedComplete.emit(hidden);\n\n    if (this._isHidden === false) this._isHidden = hidden;\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  /**\n   * Component will load.\n   */\n  componentWillLoad() {\n    if (this.dismissal) {\n      this.dismissible = this.dismissal;\n    }\n\n    if (this.icon != null && this.icon != '') {\n      this.leadIcon = this.icon;\n    }\n\n    if (this.hidden) {\n      this._isHidden = true;\n      const { setCollapsed } = useCollapse(this.ref);\n      const { setFadeOut } = useFade(this.ref);\n\n      setCollapsed();\n      setFadeOut();\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Handles the close button click.\n   */\n  private readonly handleClose = () => {\n    if (!this.preventAutoClose) {\n      this.hidden = true;\n    }\n\n    this.closeClicked.emit();\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        class={clsx(`badge-${this.color}`, {\n          'has-close': this.dismissible,\n          'with-gap': this.dismissible || this.label,\n          'visually-hidden': this._isHidden,\n          'is-icon-only': this.isIconOnly,\n        })}\n      >\n        <slot name=\"leading-icon\">\n          {this.leadIcon && <nv-icon name={this.leadIcon} size=\"sm\"></nv-icon>}\n        </slot>\n\n        <span class={clsx({ 'visually-hidden': this.isIconOnly })}>\n          {this.label}\n          <slot></slot>\n        </span>\n\n        {this.dismissible && (\n          <button onClick={this.handleClose} class=\"close\" type=\"button\">\n            <nv-icon name=\"x\" size=\"sm\" />\n          </button>\n        )}\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n","nv-fielddropdownitemcheck {\n  slot-fb,\n  span {\n    all: unset;\n  }\n\n  cursor: pointer;\n  display: flex;\n  padding: var(--list-dropdown-item-padding-y)  var(--list-dropdown-item-padding-x);\n  border-radius: var(--list-dropdown-item-radius);\n\n  &:hover {\n    background-color: var(--components-list-dropdown-item-background-hover);\n  }\n}","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Element,\n} from '@stencil/core';\n\n/**\n * @slot default - Next to the label and description.\n * @slot main - Replaces the label and description.\n * @slot label - Content to be placed as the label, will override the label prop.\n * @slot description - Content to be placed as the description, will override the description prop.\n */\n@Component({\n  tag: 'nv-fielddropdownitemcheck',\n  styleUrl: 'nv-fielddropdownitemcheck.scss',\n  shadow: false,\n})\nexport class NvFielddropdownitemcheck {\n  @Element() el: HTMLNvFielddropdownitemcheckElement;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Indicates whether the checkbox is selected.\n   */\n  @Prop({ reflect: true, mutable: true })\n  checked: boolean = false;\n\n  /**\n   * The value associated with this item.\n   */\n  @Prop({ reflect: true })\n  readonly value?: string;\n\n  /**\n   * The label displayed alongside the checkbox.\n   */\n  @Prop({ reflect: true })\n  readonly label?: string;\n\n  /**\n   * A description providing additional context or information about the\n   * checkbox.\n   */\n  @Prop({ reflect: true })\n  readonly description?: string;\n\n  /**\n   * The group this item belongs to, if applicable.\n   */\n  @Prop({ reflect: true })\n  readonly group?: string;\n\n  /**\n   * Disables the item, preventing any user interaction.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Event emitted when the checkbox is toggled.\n   * It provides details about the current state of the item.\n   */\n  @Event()\n  itemChecked: EventEmitter<{\n    /**\n     * The value associated with this item\n     */\n    value: string | undefined;\n    /**\n     * Whether the checkbox is currently checked\n     */\n    checked: boolean;\n    /**\n     * The group this item belongs to, if any\n     */\n    group?: string | undefined;\n  }>;\n\n  /**\n   * when the child <nv-fieldcheckbox> change its `checked` state,\n   * update `this.checked` and emit `itemChecked`.\n   * @param {CustomEvent<boolean>} event - The event emitted by the <nv-fieldcheckbox> component.\n   */\n  private onFieldcheckboxChanged = (event: CustomEvent<boolean>) => {\n    if (this.disabled) return;\n    // NvFieldcheckbox has emitted checkedChanged\n    this.checked = event.detail; // get the new state\n    this.itemChecked.emit({\n      value: this.value,\n      checked: this.checked,\n      group: this.group,\n    });\n  };\n\n  /** Make sure the checkbox is checked when clicked anywhere in the item. */\n  private handleClick = () => {\n    if (this.disabled) return;\n    if (this.el.querySelector('input').checked) {\n      this.checked = false;\n    } else {\n      this.checked = true;\n    }\n  };\n\n  render() {\n    return (\n      <Host onClick={this.handleClick}>\n        <nv-fieldcheckbox\n          checked={this.checked}\n          name={this.label || this.value}\n          label={this.label || this.value}\n          labelPlacement=\"after\"\n          description={this.description}\n          disabled={this.disabled}\n          tabindex=\"-1\"\n          onCheckedChanged={this.onFieldcheckboxChanged}\n        >\n          <slot></slot>\n          <slot name=\"main\"></slot>\n          <slot name=\"label\"></slot>\n          <slot name=\"description\"></slot>\n        </nv-fieldcheckbox>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["nvBadgeCss","NvBadgeStyle0","NvBadge","constructor","hostRef","this","dismissal","color","label","leadIcon","dismissible","hidden","preventAutoClose","isIconOnly","handleClose","closeClicked","emit","handleDismissalChange","handleIconChange","icon","handleHiddenChange","hiddenChanged","_isHidden","fadeIn","fadeOut","useFade","ref","duration","collapse","expand","useCollapse","timeline","start","hiddenChangedComplete","componentWillLoad","setCollapsed","setFadeOut","render","h","Host","key","class","clsx","name","size","onClick","type","nvFielddropdownitemcheckCss","NvFielddropdownitemcheckStyle0","NvFielddropdownitemcheck","checked","disabled","onFieldcheckboxChanged","event","detail","itemChecked","value","group","handleClick","el","querySelector","labelPlacement","description","tabindex","onCheckedChanged"],"sources":["src/components/nv-badge/nv-badge.scss?tag=nv-badge","src/components/nv-badge/nv-badge.tsx","src/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.scss?tag=nv-fielddropdownitemcheck","src/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.tsx"],"sourcesContent":["@use 'sass:map';\n@use '../nv-icon/styles/mixins' as icon;\n@use '../../styles/utils' as utils;\n@import '../../styles/focus-ring';\n\n/* Variants */\n$badge-colors: (\n  '1',\n  '2',\n  '3',\n  '4',\n  '5',\n  '6',\n  '7',\n  '8',\n  '9',\n  '10',\n  'error',\n  'information',\n  'neutral',\n  'success',\n  'warning',\n  'amber',\n  'orange',\n  'turquoise',\n  'crimson',\n  'lime',\n  'petrol',\n);\n\n/* Define maps for color-related variables */\n$color-rainbow-text: (\n  '1': var(--color-rainbow-1-text),\n  '2': var(--color-rainbow-2-text),\n  '3': var(--color-rainbow-3-text),\n  '4': var(--color-rainbow-4-text),\n  '5': var(--color-rainbow-5-text),\n  '6': var(--color-rainbow-6-text),\n  '7': var(--color-rainbow-7-text),\n  '8': var(--color-rainbow-8-text),\n  '9': var(--color-rainbow-9-text),\n  '10': var(--color-rainbow-10-text),\n  'error': var(--color-feedback-error-low-text),\n  'information': var(--color-feedback-information-low-text),\n  'neutral': var(--color-feedback-neutral-low-text),\n  'success': var(--color-feedback-success-low-text),\n  'warning': var(--color-feedback-warning-low-text),\n  'amber': var(--color-rainbow-1-text),\n  'orange': var(--color-rainbow-2-text),\n  'turquoise': var(--color-rainbow-5-text),\n  'crimson': var(--color-rainbow-6-text),\n  'lime': var(--color-rainbow-9-text),\n  'petrol': var(--color-rainbow-8-text),\n);\n\n$color-rainbow-icon: (\n  '1': var(--color-rainbow-1-icon),\n  '2': var(--color-rainbow-2-icon),\n  '3': var(--color-rainbow-3-icon),\n  '4': var(--color-rainbow-4-icon),\n  '5': var(--color-rainbow-5-icon),\n  '6': var(--color-rainbow-6-icon),\n  '7': var(--color-rainbow-7-icon),\n  '8': var(--color-rainbow-8-icon),\n  '9': var(--color-rainbow-9-icon),\n  '10': var(--color-rainbow-10-icon),\n  'error': var(--color-feedback-error-low-icon),\n  'information': var(--color-feedback-information-low-icon),\n  'neutral': var(--color-feedback-neutral-low-icon),\n  'success': var(--color-feedback-success-low-icon),\n  'warning': var(--color-feedback-warning-low-icon),\n  'amber': var(--color-rainbow-1-icon),\n  'orange': var(--color-rainbow-2-icon),\n  'turquoise': var(--color-rainbow-5-icon),\n  'crimson': var(--color-rainbow-6-icon),\n  'lime': var(--color-rainbow-9-icon),\n  'petrol': var(--color-rainbow-8-icon),\n);\n\n$color-rainbow-background: (\n  '1': var(--color-rainbow-1-background),\n  '2': var(--color-rainbow-2-background),\n  '3': var(--color-rainbow-3-background),\n  '4': var(--color-rainbow-4-background),\n  '5': var(--color-rainbow-5-background),\n  '6': var(--color-rainbow-6-background),\n  '7': var(--color-rainbow-7-background),\n  '8': var(--color-rainbow-8-background),\n  '9': var(--color-rainbow-9-background),\n  '10': var(--color-rainbow-10-background),\n  'error': var(--color-feedback-error-low-background),\n  'information': var(--color-feedback-information-low-background),\n  'neutral': var(--color-feedback-neutral-low-background),\n  'success': var(--color-feedback-success-low-background),\n  'warning': var(--color-feedback-warning-low-background),\n  'amber': var(--color-rainbow-1-background),\n  'orange': var(--color-rainbow-2-background),\n  'turquoise': var(--color-rainbow-5-background),\n  'crimson': var(--color-rainbow-6-background),\n  'lime': var(--color-rainbow-9-background),\n  'petrol': var(--color-rainbow-8-background),\n);\n$color-rainbow-border: (\n  '1': var(--color-rainbow-1-border),\n  '2': var(--color-rainbow-2-border),\n  '3': var(--color-rainbow-3-border),\n  '4': var(--color-rainbow-4-border),\n  '5': var(--color-rainbow-5-border),\n  '6': var(--color-rainbow-6-border),\n  '7': var(--color-rainbow-7-border),\n  '8': var(--color-rainbow-8-border),\n  '9': var(--color-rainbow-9-border),\n  '10': var(--color-rainbow-10-border),\n  'error': var(--color-feedback-error-low-border),\n  'information': var(--color-feedback-information-low-border),\n  'neutral': var(--color-feedback-neutral-low-border),\n  'success': var(--color-feedback-success-low-border),\n  'warning': var(--color-feedback-warning-low-border),\n  'amber': var(--color-rainbow-1-border),\n  'orange': var(--color-rainbow-2-border),\n  'turquoise': var(--color-rainbow-5-border),\n  'crimson': var(--color-rainbow-6-border),\n  'lime': var(--color-rainbow-9-border),\n  'petrol': var(--color-rainbow-8-border),\n);\n\n@mixin root-styles() {\n  padding: var(--badge-padding-y) var(--badge-padding-x);\n  display: inline-flex !important; // override the display: none in [hidden] css\n  gap: var(--badge-gap-x);\n  vertical-align: middle;\n  align-items: center;\n  border-radius: var(--radius-rounded-full);\n  border-style: solid;\n  border-width: 0.5px;\n  height: fit-content;\n  width: fit-content;\n\n  &.is-icon-only {\n    padding: var(--badge-padding-y) var(--badge-padding-icon-only-x);\n    gap: var(--badge-gap-icon-only-x);\n  }\n}\n\n@mixin root-styles-with-gap() {\n  @include root-styles();\n}\n\n@mixin badge-color($color-key) {\n  color: map.get($color-rainbow-text, $color-key);\n  background-color: map.get($color-rainbow-background, $color-key);\n  border-color: map.get($color-rainbow-border, $color-key);\n  .close {\n    @include focus-ring(\n      if(\n        str-index('error information neutral success warning', $color-key),\n        var(\n          --color-feedback-#{$color-key}-low-content,\n          map.get($color-rainbow-text, $color-key)\n        ),\n        if(\n          type-of($color-key) == 'string' and not (str-length($color-key) <= 2)\n            and not\n            str-index('error information neutral success warning', $color-key),\n          var(\n            --color-#{$color-key}-content,\n            map.get($color-rainbow-text, $color-key)\n          ),\n          var(--color-rainbow-#{$color-key}-content)\n        )\n      ),\n      0.2\n    );\n  }\n}\n\n@mixin icon-color($color-key) {\n  color: map.get($color-rainbow-icon, $color-key);\n}\n\n@mixin type-settings($font-size, $line-height) {\n  font-size: var(--font-size-xs);\n  line-height: var(--line-height-xs) !important;\n}\n\nnv-badge {\n  @include root-styles();\n\n  //gap styles\n  &.with-gap {\n    @include root-styles-with-gap();\n  }\n\n  &.visually-hidden {\n    @include utils.visually-hidden();\n  }\n\n  &:not(.with-gap) {\n    @include root-styles();\n  }\n\n  // color styles\n  @each $i in $badge-colors {\n    &.badge-#{$i} {\n      @include badge-color($i);\n      nv-icon {\n        @include icon-color($i);\n      }\n    }\n  }\n\n  //label styles\n  & span {\n    @include type-settings(xs, xs);\n    text-align: center;\n  }\n\n  // nv-icon styles\n  & nv-icon > svg {\n    @each $size, $config in icon.$size-variants {\n      &.icon-#{$size} {\n        @include icon.icon-size-and-stroke(\n          map.get(map.get(icon.$size-variants, 'xs'), size),\n          map.get(map.get(icon.$size-variants, 'xs'), stroke)\n        );\n      }\n    }\n  }\n\n  .close {\n    padding: 0;\n    line-height: 0;\n    border: none;\n    background: none;\n    cursor: pointer;\n    color: inherit;\n    display: inline-flex;\n    align-items: center;\n    aspect-ratio: 1/1;\n    border-radius: var(--radius-rounded-full);\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Watch,\n  Element,\n  State,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { useFade, useCollapse, timeline } from '../../animations';\n\n/**\n * @slot leading-icon - Icon before the label.\n * @slot default - for custom content, for pure text use label instead.\n */\n@Component({\n  tag: 'nv-badge',\n  styleUrl: 'nv-badge.scss',\n  shadow: false,\n})\nexport class NvBadge {\n  @Element() ref: HTMLNvBadgeElement;\n\n  /****************************************************************************/\n  //#region DEPRECATED\n\n  /**\n   * Whether the badge is dismissible.\n   * @deprecated use dismissible instead.\n   */\n  @Prop({ reflect: true })\n  readonly dismissal: boolean = false;\n\n  /**\n   * The icon to display in the badge.\n   * @deprecated use leadIcon or slot=\"leading-icon\" instead.\n   */\n  @Prop({ reflect: true })\n  readonly icon: string;\n\n  /**\n   * The location of the icon in the badge.\n   * @deprecated only leadIcon now.\n   */\n  @Prop({ reflect: true })\n  readonly iconLocation: 'left' | 'right';\n\n  //#endregion DEPRECATED\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * The color of the badge.\n   * deprecated Use status values or named colors instead.\n   * Use a string between 1 to 10\n   * or one of the status values: error, information, neutral, success, warning\n   * or one of the color names: amber, orange, turquoise, crimson, lime\n   */\n  @Prop({ reflect: true })\n  readonly color?: string = '1';\n\n  /**\n   * Main content of the badge.\n   */\n  @Prop({ reflect: true })\n  readonly label?: string | null = null;\n\n  /**\n   * The lead icon of the badge.\n   */\n  @Prop({ reflect: true, mutable: true })\n  leadIcon?: string | null = null;\n\n  /**\n   * Whether the badge is dismissible.\n   */\n  @Prop({ reflect: true, mutable: true })\n  dismissible: boolean = false;\n\n  /**\n   * Controls the visibility of the badge. Will animate with fade and collapse.\n   */\n  @Prop({ reflect: true, mutable: true })\n  hidden: boolean = false; // eslint-disable-line @stencil-community/reserved-member-names\n  @State()\n  private _isHidden: boolean;\n\n  /**\n   * When true, the alert does not automatically close upon dismissing.\n   * Useful for externally controlled component behavior.\n   */\n  @Prop({ reflect: true })\n  readonly preventAutoClose: boolean = false;\n\n  /**\n   * When true, the badge will only display an icon without label.\n   * The label will be visually hidden but still accessible for screen readers.\n   */\n  @Prop({ reflect: true })\n  readonly isIconOnly?: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emitted when the badge is dismissed.\n   */\n  @Event()\n  closeClicked: EventEmitter<void>;\n\n  /**\n   * Emits when the 'hidden' prop changes, reflecting a change in visibility.\n   * Passes hidden value to the detail.\n   */\n  @Event()\n  hiddenChanged: EventEmitter<boolean>;\n\n  /**\n   * Emitted when the animations complete, detail includes the hidden value.\n   */\n  @Event()\n  hiddenChangedComplete: EventEmitter<boolean>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  /**\n   * Handles the dismissal prop change.\n   * @param {boolean} dismissal - The new dismissal value.\n   */\n  @Watch('dismissal')\n  handleDismissalChange(dismissal: boolean) {\n    this.dismissible = dismissal;\n  }\n\n  /**\n   * Handles the icon prop change.\n   * @param {string} icon - The new icon value.\n   */\n  @Watch('icon')\n  handleIconChange(icon: string) {\n    this.leadIcon = icon;\n  }\n\n  /**\n   * Handles the hidden prop change.\n   * @param {boolean} hidden - The new hidden value.\n   */\n  @Watch('hidden')\n  async handleHiddenChange(hidden: boolean) {\n    this.hiddenChanged.emit(hidden);\n    if (this._isHidden === true) this._isHidden = hidden;\n\n    const { fadeIn, fadeOut } = useFade(this.ref, { duration: 150 });\n    const { collapse, expand } = useCollapse(this.ref, { duration: 150 });\n\n    if (hidden === true) await timeline(fadeOut, collapse).start();\n    if (hidden === false) await timeline(expand, fadeIn).start();\n\n    this.hiddenChangedComplete.emit(hidden);\n\n    if (this._isHidden === false) this._isHidden = hidden;\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  /**\n   * Component will load.\n   */\n  componentWillLoad() {\n    if (this.dismissal) {\n      this.dismissible = this.dismissal;\n    }\n\n    if (this.icon != null && this.icon != '') {\n      this.leadIcon = this.icon;\n    }\n\n    if (this.hidden) {\n      this._isHidden = true;\n      const { setCollapsed } = useCollapse(this.ref);\n      const { setFadeOut } = useFade(this.ref);\n\n      setCollapsed();\n      setFadeOut();\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Handles the close button click.\n   */\n  private readonly handleClose = () => {\n    if (!this.preventAutoClose) {\n      this.hidden = true;\n    }\n\n    this.closeClicked.emit();\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        class={clsx(`badge-${this.color}`, {\n          'has-close': this.dismissible,\n          'with-gap': this.dismissible || this.label,\n          'visually-hidden': this._isHidden,\n          'is-icon-only': this.isIconOnly,\n        })}\n      >\n        <slot name=\"leading-icon\">\n          {this.leadIcon && <nv-icon name={this.leadIcon} size=\"sm\"></nv-icon>}\n        </slot>\n\n        <span class={clsx({ 'visually-hidden': this.isIconOnly })}>\n          {this.label}\n          <slot></slot>\n        </span>\n\n        {this.dismissible && (\n          <button onClick={this.handleClose} class=\"close\" type=\"button\">\n            <nv-icon name=\"x\" size=\"sm\" />\n          </button>\n        )}\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n","nv-fielddropdownitemcheck {\n  slot-fb,\n  span {\n    all: unset;\n  }\n\n  cursor: pointer;\n  display: flex;\n  padding: var(--list-dropdown-item-padding-y)  var(--list-dropdown-item-padding-x);\n  border-radius: var(--list-dropdown-item-radius);\n\n  &:hover {\n    background-color: var(--components-list-dropdown-item-background-hover);\n  }\n}","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Element,\n} from '@stencil/core';\n\n/**\n * @slot default - Next to the label and description.\n * @slot main - Replaces the label and description.\n * @slot label - Content to be placed as the label, will override the label prop.\n * @slot description - Content to be placed as the description, will override the description prop.\n */\n@Component({\n  tag: 'nv-fielddropdownitemcheck',\n  styleUrl: 'nv-fielddropdownitemcheck.scss',\n  shadow: false,\n})\nexport class NvFielddropdownitemcheck {\n  @Element() el: HTMLNvFielddropdownitemcheckElement;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Indicates whether the checkbox is selected.\n   */\n  @Prop({ reflect: true, mutable: true })\n  checked: boolean = false;\n\n  /**\n   * The value associated with this item.\n   */\n  @Prop({ reflect: true })\n  readonly value?: string;\n\n  /**\n   * The label displayed alongside the checkbox.\n   */\n  @Prop({ reflect: true })\n  readonly label?: string;\n\n  /**\n   * A description providing additional context or information about the\n   * checkbox.\n   */\n  @Prop({ reflect: true })\n  readonly description?: string;\n\n  /**\n   * The group this item belongs to, if applicable.\n   */\n  @Prop({ reflect: true })\n  readonly group?: string;\n\n  /**\n   * Disables the item, preventing any user interaction.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Event emitted when the checkbox is toggled.\n   * It provides details about the current state of the item.\n   */\n  @Event()\n  itemChecked: EventEmitter<{\n    /**\n     * The value associated with this item\n     */\n    value: string | undefined;\n    /**\n     * Whether the checkbox is currently checked\n     */\n    checked: boolean;\n    /**\n     * The group this item belongs to, if any\n     */\n    group?: string | undefined;\n  }>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * when the child <nv-fieldcheckbox> change its `checked` state,\n   * update `this.checked` and emit `itemChecked`.\n   * @param {CustomEvent<boolean>} event - The event emitted by the <nv-fieldcheckbox> component.\n   */\n  private onFieldcheckboxChanged = (event: CustomEvent<boolean>) => {\n    if (this.disabled) return;\n\n    // NvFieldcheckbox has emitted checkedChanged\n    this.checked = event.detail; // get the new state\n    this.itemChecked.emit({\n      value: this.value,\n      checked: this.checked,\n      group: this.group,\n    });\n  };\n\n  /** Make sure the checkbox is checked when clicked anywhere in the item. */\n  private handleClick = () => {\n    if (this.disabled) return;\n\n    if (this.el.querySelector('input').checked) {\n      this.checked = false;\n    } else {\n      this.checked = true;\n    }\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host onClick={this.handleClick}>\n        <nv-fieldcheckbox\n          checked={this.checked}\n          name={this.label || this.value}\n          label={this.label || this.value}\n          labelPlacement=\"after\"\n          description={this.description}\n          disabled={this.disabled}\n          tabindex=\"-1\"\n          onCheckedChanged={this.onFieldcheckboxChanged}\n        >\n          <slot></slot>\n          <slot name=\"main\"></slot>\n          <slot name=\"label\"></slot>\n          <slot name=\"description\"></slot>\n        </nv-fieldcheckbox>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n  /****************************************************************************/\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/types/components/nv-fielddropdownitemcheck/nv-fielddropdownitemcheck.d.ts

@@ -52,6 +52,7 @@ export declare class NvFielddropdownitemcheck {
          */
         group?: string | undefined;
     }>;
+    /****************************************************************************/
     /**
      * when the child <nv-fieldcheckbox> change its `checked` state,
      * update `this.checked` and emit `itemChecked`.
@@ -60,5 +61,6 @@ export declare class NvFielddropdownitemcheck {
     private onFieldcheckboxChanged;
     /** Make sure the checkbox is checked when clicked anywhere in the item. */
     private handleClick;
+    /****************************************************************************/
     render(): any;
 }

package/dist/types/components/nv-fieldmultiselect/nv-fieldmultiselect.d.ts

@@ -13,6 +13,7 @@ export declare class NvFieldmultiselect {
     el: HTMLNvFieldmultiselectElement;
     private inputElement;
     private popoverElement;
+    private isBulkOperation;
     /**
      * Timer for debouncing input events.
      * Private property preferred over @State as it:
@@ -187,6 +188,8 @@ export declare class NvFieldmultiselect {
      */
     private isSelectAllSectionVisible;
     private preventBlurClose;
+    private _boundHandleClickOutside?;
+    private handleMouseDownPreventBlur;
     /****************************************************************************/
     /**
      * Emitted when the selected values change.

package/hydrate/index.js

@@ -5417,7 +5417,7 @@ const CUSTOM_MONTH_NAMES = {
     ],
 };
 
-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);z-index:111}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);z-index:111}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);z-index:111}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);z-index:111}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);z-index:111}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 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);z-index:111}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);z-index:111}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);z-index:111}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);z-index:111}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);z-index:111}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-right:calc(var(--alert-padding) + var(--icon-md) + var(--spacing-1));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}";
 var NvAlertStyle0 = nvAlertCss;
 
 /**
@@ -18796,6 +18796,9 @@ class NvFielddropdownitemcheck {
          * Disables the item, preventing any user interaction.
          */
         this.disabled = false;
+        //#endregion EVENTS
+        /****************************************************************************/
+        //#region METHODS
         /**
          * when the child <nv-fieldcheckbox> change its `checked` state,
          * update `this.checked` and emit `itemChecked`.
@@ -18824,8 +18827,11 @@ class NvFielddropdownitemcheck {
             }
         };
     }
+    //#endregion METHODS
+    /****************************************************************************/
+    //#region RENDER
     render() {
-        return (hAsync(Host, { key: '869eb969c0cff66f1947673e5aa3e0c677a07421', onClick: this.handleClick }, hAsync("nv-fieldcheckbox", { key: '4bbe45597bdd0f30c8e9a255e52d08be476fab1a', checked: this.checked, name: this.label || this.value, label: this.label || this.value, labelPlacement: "after", description: this.description, disabled: this.disabled, tabindex: "-1", onCheckedChanged: this.onFieldcheckboxChanged }, hAsync("slot", { key: 'f53f44e3fdb78894e9bb37fa455b1407efea17b1' }), hAsync("slot", { key: 'aacd757c1fec541a4fc7b4f2683281aef31ee135', name: "main" }), hAsync("slot", { key: 'ef2f761a3a1f05dcba6145efc89830ddc82af27d', name: "label" }), hAsync("slot", { key: '610700f871b524f1f89538d03bd6c16167e3b24e', name: "description" }))));
+        return (hAsync(Host, { key: 'cb922f0c0224c950ab5a87783028f2909eb1e39c', onClick: this.handleClick }, hAsync("nv-fieldcheckbox", { key: '6f8748022131a8cd31b0f69851313f80c330172a', checked: this.checked, name: this.label || this.value, label: this.label || this.value, labelPlacement: "after", description: this.description, disabled: this.disabled, tabindex: "-1", onCheckedChanged: this.onFieldcheckboxChanged }, hAsync("slot", { key: '20d1014accc6cfc00658703057b25037175287af' }), hAsync("slot", { key: 'a7e61eed6bc72d3a14096cac2c195629a0ce2928', name: "main" }), hAsync("slot", { key: '93f6bce370ac36f1ce3e0f2c1d9cdd598c14cb14', name: "label" }), hAsync("slot", { key: '837359fc1fea49e0dea221039dc7466cdc86b757', name: "description" }))));
     }
     get el() { return getElement(this); }
     static get style() { return NvFielddropdownitemcheckStyle0; }
@@ -18863,6 +18869,7 @@ class NvFieldmultiselect {
         registerInstance(this, hostRef);
         this.valueChanged = createEvent(this, "valueChanged", 7);
         this.filterTextChanged = createEvent(this, "filterTextChanged", 7);
+        this.isBulkOperation = false;
         /**
          * Sets the ID for the input element and the for attribute of the associated
          * label. If no ID is provided, a random one will be automatically generated
@@ -18970,6 +18977,9 @@ class NvFieldmultiselect {
         this.isSelectAllSectionVisible = true;
         // Add the flag to the class
         this.preventBlurClose = false;
+        this.handleMouseDownPreventBlur = () => {
+            this.preventBlurClose = true;
+        };
         /**
          * Handle badge close for options mode.
          */
@@ -19156,6 +19166,11 @@ class NvFieldmultiselect {
          */
         this.handleInputBlurSlots = () => {
             setTimeout(() => {
+                // Honor preventBlurClose to avoid closing when interacting inside the popover
+                if (this.preventBlurClose) {
+                    this.preventBlurClose = false;
+                    return; // Don't close the popover
+                }
                 if (!this.el.contains(document.activeElement)) {
                     // Close the popover without affecting the divider
                     this.open = false;
@@ -19192,24 +19207,33 @@ class NvFieldmultiselect {
         this.toggleSelectAllOptions = (selectAll) => {
             if (!this.options)
                 return;
-            // Get visible and enabled option values from DOM
-            const visibleOptionValues = this.getVisibleEnabledOptionItems();
-            console.info('[SelectAll][Options] toggleSelectAllOptions called. selectAll:', selectAll, 'visibleOptionValues:', visibleOptionValues, 'Current value:', this.value);
-            if (selectAll) {
-                // Select all visible options - merge with existing selections
-                this.value = [...new Set([...this.value, ...visibleOptionValues])];
+            this.isBulkOperation = true; // Set flag to suppress individual emissions
+            try {
+                // Get visible and enabled option values from DOM
+                const visibleOptionValues = this.getVisibleEnabledOptionItems();
+                console.info('[SelectAll][Options] toggleSelectAllOptions called. selectAll:', selectAll, 'visibleOptionValues:', visibleOptionValues, 'Current value:', this.value);
+                if (selectAll) {
+                    // Select all visible options - merge with existing selections
+                    this.value = [...new Set([...this.value, ...visibleOptionValues])];
+                }
+                else {
+                    // Deselect only the visible options, keep others that might be filtered out
+                    this.value = this.value.filter(val => !visibleOptionValues.includes(val));
+                }
+                console.info('[SelectAll][Options] New value after toggle:', this.value);
+                // Emit the change event
+                this.valueChanged.emit(this.value);
+                // Synchronize child components
+                this.syncChildComponents();
+                // Reorder content to move selected items to top
+                this.reorderOptionsContent();
             }
-            else {
-                // Deselect only the visible options, keep others that might be filtered out
-                this.value = this.value.filter(val => !visibleOptionValues.includes(val));
+            finally {
+                // Defer reset to next frame to ensure any async child emissions are ignored
+                requestAnimationFrame(() => {
+                    this.isBulkOperation = false; // Reset flag
+                });
             }
-            console.info('[SelectAll][Options] New value after toggle:', this.value);
-            // Emit the change event
-            this.valueChanged.emit(this.value);
-            // Synchronize child components
-            this.syncChildComponents();
-            // Reorder content to move selected items to top
-            this.reorderOptionsContent();
         };
         /**
          * Toggles the selection state of all non-disabled slot items.
@@ -19218,31 +19242,40 @@ class NvFieldmultiselect {
         this.toggleSelectAllSlots = (selectAll) => {
             if (this.options)
                 return; // Only for slots mode
-            // Get visible and enabled items
-            const items = this.getVisibleEnabledSlotItems();
-            console.info('[SelectAll][Slots] toggleSelectAllSlots called. selectAll:', selectAll, 'visible slot items:', items.map(item => item.getAttribute('value') || item.getAttribute('label')), 'Current value:', this.value);
-            if (selectAll) {
-                // Select all visible items
-                const allActiveValues = items
-                    .map(item => item.getAttribute('value') || item.getAttribute('label') || '')
-                    .filter(value => value !== '');
-                this.value = [...new Set([...this.value, ...allActiveValues])];
+            this.isBulkOperation = true; // Set flag to suppress individual emissions
+            try {
+                // Get visible and enabled items
+                const items = this.getVisibleEnabledSlotItems();
+                console.info('[SelectAll][Slots] toggleSelectAllSlots called. selectAll:', selectAll, 'visible slot items:', items.map(item => item.getAttribute('value') || item.getAttribute('label')), 'Current value:', this.value);
+                if (selectAll) {
+                    // Select all visible items
+                    const allActiveValues = items
+                        .map(item => item.getAttribute('value') || item.getAttribute('label') || '')
+                        .filter(value => value !== '');
+                    this.value = [...new Set([...this.value, ...allActiveValues])];
+                }
+                else {
+                    // Deselect only the visible items, keep others that might be filtered out
+                    const visibleValues = items
+                        .map(item => item.getAttribute('value') || item.getAttribute('label') || '')
+                        .filter(value => value !== '');
+                    this.value = this.value.filter(val => !visibleValues.includes(val));
+                }
+                console.info('[SelectAll][Slots] New value after toggle:', this.value);
+                // Emit the change event
+                this.valueChanged.emit(this.value);
+                // Force synchronization with a small delay to ensure DOM is updated
+                requestAnimationFrame(() => {
+                    this.syncChildComponents();
+                    this.reorderSlotContent();
+                });
+            }
+            finally {
+                // Defer reset to next frame to ensure any async child emissions are ignored
+                requestAnimationFrame(() => {
+                    this.isBulkOperation = false; // Reset flag
+                });
             }
-            else {
-                // Deselect only the visible items, keep others that might be filtered out
-                const visibleValues = items
-                    .map(item => item.getAttribute('value') || item.getAttribute('label') || '')
-                    .filter(value => value !== '');
-                this.value = this.value.filter(val => !visibleValues.includes(val));
-            }
-            console.info('[SelectAll][Slots] New value after toggle:', this.value);
-            // Emit the change event
-            this.valueChanged.emit(this.value);
-            // Force synchronization with a small delay to ensure DOM is updated
-            requestAnimationFrame(() => {
-                this.syncChildComponents();
-                this.reorderSlotContent();
-            });
         };
         /**
          * Handle click on the select all checkbox in options mode.
@@ -19294,16 +19327,10 @@ class NvFieldmultiselect {
                     width: '0',
                     height: '0',
                     pointerEvents: 'none',
-                }, tabIndex: -1, "aria-hidden": "true", autoComplete: this.autocomplete, name: this.name, onFocus: this.handleInputFocusOptions }), hAsync("p", { id: this.inputId, class: "non-filterable-text", onClick: this.handleInputContainerClickOptions, tabIndex: 0, onKeyDown: this.handleKeyDown, onFocus: this.handleInputFocusOptions, "aria-label": this.label, "aria-controls": `${this.inputId}-listbox`, "data-scope": "focusable", role: "button" }, hAsync("span", null, this.placeholder)))), this.error && (hAsync("nv-icon", { name: "alert-circle", class: "validation", size: "md" })), this.filterable && this.filterText.length > 0 && (hAsync("nv-iconbutton", { "data-scope": "clear-filter", name: "x", size: "md", emphasis: "lower", "aria-label": "Clear filter text", tabindex: "-1", title: "Clear filter text", onMouseDown: () => {
-                    this.preventBlurClose = true;
-                }, onClick: this.clearFilterText })), hAsync("nv-iconbutton", { "data-scope": "toggle-dropdown", name: this.open ? 'chevron-top' : 'chevron-down', size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide dropdown' : 'Show dropdown', title: this.open ? 'Hide dropdown' : 'Show dropdown', onMouseDown: () => {
-                    this.preventBlurClose = true;
-                }, onClick: this.togglePopoverOptions })), hAsync("slot", { name: "after-input" })), hAsync("div", { id: `${this.inputId}-listbox`, slot: "content", style: this.maxHeight ? { maxHeight: this.maxHeight } : {} }, this.shouldShowToggleAllOptionsButton() && (hAsync("div", { class: "select-all-container" }, hAsync("div", { class: "select-all-header" }, this.isSelectAllSectionVisible && (hAsync("nv-fieldcheckbox", { checked: this.getSelectAllCheckboxStateOptions() === 'checked', indeterminate: this.getSelectAllCheckboxStateOptions() ===
+                }, tabIndex: -1, "aria-hidden": "true", autoComplete: this.autocomplete, name: this.name, onFocus: this.handleInputFocusOptions }), hAsync("p", { id: this.inputId, class: "non-filterable-text", onClick: this.handleInputContainerClickOptions, tabIndex: 0, onKeyDown: this.handleKeyDown, onFocus: this.handleInputFocusOptions, "aria-label": this.label, "aria-controls": `${this.inputId}-listbox`, "data-scope": "focusable", role: "button" }, hAsync("span", null, this.placeholder)))), this.error && (hAsync("nv-icon", { name: "alert-circle", class: "validation", size: "md" })), this.filterable && this.filterText.length > 0 && (hAsync("nv-iconbutton", { "data-scope": "clear-filter", name: "x", size: "md", emphasis: "lower", "aria-label": "Clear filter text", tabindex: "-1", title: "Clear filter text", onMouseDown: this.handleMouseDownPreventBlur, onClick: this.clearFilterText })), hAsync("nv-iconbutton", { "data-scope": "toggle-dropdown", name: this.open ? 'chevron-top' : 'chevron-down', size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide dropdown' : 'Show dropdown', title: this.open ? 'Hide dropdown' : 'Show dropdown', onMouseDown: this.handleMouseDownPreventBlur, onClick: this.togglePopoverOptions })), hAsync("slot", { name: "after-input" })), hAsync("div", { id: `${this.inputId}-listbox`, slot: "content", style: this.maxHeight ? { maxHeight: this.maxHeight } : {}, onMouseDown: this.handleMouseDownPreventBlur }, this.shouldShowToggleAllOptionsButton() && (hAsync("div", { class: "select-all-container" }, hAsync("div", { class: "select-all-header" }, this.isSelectAllSectionVisible && (hAsync("nv-fieldcheckbox", { checked: this.getSelectAllCheckboxStateOptions() === 'checked', indeterminate: this.getSelectAllCheckboxStateOptions() ===
                     'indeterminate', label: this.getSelectAllCheckboxStateOptions() === 'unchecked'
                     ? this.selectAllLabel
-                    : this.deselectAllLabel, onMouseDown: () => {
-                    this.preventBlurClose = true;
-                }, onClick: this.handleSelectAllCheckboxOptionsClick }))))), hAsync("ul", { role: "listbox", "aria-multiselectable": "true" }, this.options.map(option => (hAsync("nv-fielddropdownitemcheck", { role: "option", label: option.label, description: option.description, value: option.value, checked: this.value.includes(option.value), disabled: option.disabled })))))), this.renderDescriptions()));
+                    : this.deselectAllLabel, onMouseDown: this.handleMouseDownPreventBlur, onClick: this.handleSelectAllCheckboxOptionsClick }))))), hAsync("ul", { role: "listbox", "aria-multiselectable": "true" }, this.options.map(option => (hAsync("nv-fielddropdownitemcheck", { role: "option", label: option.label, description: option.description, value: option.value, checked: this.value.includes(option.value), disabled: option.disabled })))))), this.renderDescriptions()));
         };
         /**
          * Renders the component in slots mode
@@ -19316,16 +19343,10 @@ class NvFieldmultiselect {
                     width: '0',
                     height: '0',
                     pointerEvents: 'none',
-                }, tabIndex: -1, "aria-hidden": "true", autoComplete: this.autocomplete, name: this.name, onFocus: this.handleInputFocusSlots }), hAsync("p", { id: this.inputId, class: "non-filterable-text", "aria-label": this.label, onClick: this.handleInputContainerClickSlots, tabIndex: 0, onKeyDown: this.handleKeyDown, onFocus: this.handleInputFocusSlots, "aria-controls": `${this.inputId}-listbox`, "data-scope": "focusable", role: "button" }, hAsync("span", null, this.placeholder)))), this.error && (hAsync("nv-icon", { name: "alert-circle", class: "validation", size: "md" })), this.filterable && this.filterText.length > 0 && (hAsync("nv-iconbutton", { name: "x", size: "md", emphasis: "lower", tabindex: "-1", onMouseDown: () => {
-                    this.preventBlurClose = true;
-                }, onClick: this.clearFilterText, "aria-label": "Clear filter text" })), hAsync("nv-iconbutton", { "data-scope": "toggle-dropdown", name: this.open ? 'chevron-top' : 'chevron-down', size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide dropdown' : 'Show dropdown', title: this.open ? 'Hide dropdown' : 'Show dropdown', onMouseDown: () => {
-                    this.preventBlurClose = true;
-                }, onClick: this.togglePopoverSlots })), hAsync("slot", { name: "after-input" })), hAsync("div", { id: `${this.inputId}-listbox`, slot: "content", style: this.maxHeight ? { maxHeight: this.maxHeight } : {} }, this.shouldShowToggleAllSlotButton() && (hAsync("div", { class: "select-all-container" }, hAsync("div", { class: "select-all-header" }, this.isSelectAllSectionVisible && (hAsync("nv-fieldcheckbox", { checked: this.getSelectAllCheckboxStateSlots() === 'checked', indeterminate: this.getSelectAllCheckboxStateSlots() ===
+                }, tabIndex: -1, "aria-hidden": "true", autoComplete: this.autocomplete, name: this.name, onFocus: this.handleInputFocusSlots }), hAsync("p", { id: this.inputId, class: "non-filterable-text", "aria-label": this.label, onClick: this.handleInputContainerClickSlots, tabIndex: 0, onKeyDown: this.handleKeyDown, onFocus: this.handleInputFocusSlots, "aria-controls": `${this.inputId}-listbox`, "data-scope": "focusable", role: "button" }, hAsync("span", null, this.placeholder)))), this.error && (hAsync("nv-icon", { name: "alert-circle", class: "validation", size: "md" })), this.filterable && this.filterText.length > 0 && (hAsync("nv-iconbutton", { name: "x", size: "md", emphasis: "lower", tabindex: "-1", onMouseDown: this.handleMouseDownPreventBlur, onClick: this.clearFilterText, "aria-label": "Clear filter text" })), hAsync("nv-iconbutton", { "data-scope": "toggle-dropdown", name: this.open ? 'chevron-top' : 'chevron-down', size: "md", emphasis: "lower", "aria-label": this.open ? 'Hide dropdown' : 'Show dropdown', title: this.open ? 'Hide dropdown' : 'Show dropdown', onMouseDown: this.handleMouseDownPreventBlur, onClick: this.togglePopoverSlots })), hAsync("slot", { name: "after-input" })), hAsync("div", { id: `${this.inputId}-listbox`, slot: "content", style: this.maxHeight ? { maxHeight: this.maxHeight } : {}, onMouseDown: this.handleMouseDownPreventBlur }, this.shouldShowToggleAllSlotButton() && (hAsync("div", { class: "select-all-container" }, hAsync("div", { class: "select-all-header" }, this.isSelectAllSectionVisible && (hAsync("nv-fieldcheckbox", { checked: this.getSelectAllCheckboxStateSlots() === 'checked', indeterminate: this.getSelectAllCheckboxStateSlots() ===
                     'indeterminate', label: this.getSelectAllCheckboxStateSlots() === 'unchecked'
                     ? this.selectAllLabel
-                    : this.deselectAllLabel, onMouseDown: () => {
-                    this.preventBlurClose = true;
-                }, onClick: this.handleSelectAllCheckboxSlotsClick }))))), hAsync("slot", { name: "content" }))), this.renderDescriptions()));
+                    : this.deselectAllLabel, onMouseDown: this.handleMouseDownPreventBlur, onClick: this.handleSelectAllCheckboxSlotsClick }))))), hAsync("slot", { name: "content" }))), this.renderDescriptions()));
         };
     }
     //#endregion EVENTS
@@ -19354,7 +19375,12 @@ class NvFieldmultiselect {
         this.reorderOptionsContent();
     }
     watchValueHandler() {
-        console.info('[Watch:value] Value changed:', this.value);
+        console.info('[Watch:value] Value changed:', this.value, 'isBulkOperation:', this.isBulkOperation);
+        // Skip processing during bulk operations
+        if (this.isBulkOperation) {
+            console.info('[Watch:value] Skipping syncChildComponents and options update due to bulk operation');
+            return;
+        }
         // Synchronize child components when value changes programmatically
         if (this.el && this.el.isConnected) {
             this.syncChildComponents();
@@ -19399,7 +19425,9 @@ class NvFieldmultiselect {
      * @param {CustomEvent} event - The event object containing the selected value and its checked state.
      */
     handleItemChecked(event) {
-        if (this.disabled || this.readonly) {
+        if (this.disabled || this.readonly || this.isBulkOperation) {
+            // Skip processing itemChecked events during bulk operations
+            console.info('[Event:itemChecked] Skipped due to bulk operation or disabled/readonly', event.detail);
             return;
         }
         const { value, checked } = event.detail;
@@ -19407,21 +19435,23 @@ class NvFieldmultiselect {
         if (value !== undefined && value !== null) {
             const newValue = [...this.value];
             const valueIndex = newValue.indexOf(value);
+            let hasChanged = false;
             if (checked && valueIndex === -1) {
                 newValue.push(value);
+                hasChanged = true;
             }
             else if (!checked && valueIndex > -1) {
                 newValue.splice(valueIndex, 1);
+                hasChanged = true;
             }
             console.info('[Event:itemChecked] newValue after update:', newValue);
-            // Always update the state and emit the event when an item is checked/unchecked
-            this.value = newValue;
-            this.valueChanged.emit(this.value);
-            // Update the checked state of all items to ensure consistency
-            this.syncChildComponents();
+            if (hasChanged) {
+                this.value = newValue;
+                this.valueChanged.emit(this.value);
+                this.syncChildComponents();
+            }
             // Preserve the filter text in the input
             if (this.filterable && this.inputElement) {
-                // Keep the current filter text in the input
                 this.inputElement.value = this.filterText;
             }
         }
@@ -19449,7 +19479,11 @@ class NvFieldmultiselect {
      */
     connectedCallback() {
         console.info('[Lifecycle] connectedCallback - value:', this.value);
-        document.addEventListener('click', this.handleClickOutside.bind(this));
+        // Bind once and reuse the same reference for add/remove to avoid leaks
+        if (!this._boundHandleClickOutside) {
+            this._boundHandleClickOutside = this.handleClickOutside.bind(this);
+        }
+        document.addEventListener('click', this._boundHandleClickOutside);
     }
     /**
      * Set the mode state and handle options change.
@@ -19507,7 +19541,9 @@ class NvFieldmultiselect {
      */
     disconnectedCallback() {
         console.info('[Lifecycle] disconnectedCallback - value:', this.value);
-        document.removeEventListener('click', this.handleClickOutside.bind(this));
+        if (this._boundHandleClickOutside) {
+            document.removeEventListener('click', this._boundHandleClickOutside);
+        }
     }
     //#endregion LIFECYCLE
     /****************************************************************************/
@@ -20036,13 +20072,23 @@ class NvFieldmultiselect {
             const itemValue = item.getAttribute('value') || item.getAttribute('label') || '';
             const shouldBeChecked = this.value.includes(itemValue);
             console.info('[syncChildComponents] itemValue:', itemValue, 'shouldBeChecked:', shouldBeChecked, 'item.checked(before):', item.checked);
-            if (shouldBeChecked) {
-                item.setAttribute('checked', '');
-                item.checked = true;
-            }
-            else {
-                item.removeAttribute('checked');
-                item.checked = false;
+            // Only update if the checked state differs to avoid triggering unnecessary events
+            if (item.checked !== shouldBeChecked) {
+                // Set attribute and property, but avoid triggering itemChecked during bulk
+                if (this.isBulkOperation) {
+                    // Directly update the DOM attribute to avoid triggering the setter
+                    if (shouldBeChecked) {
+                        item.setAttribute('checked', '');
+                    }
+                    else {
+                        item.removeAttribute('checked');
+                    }
+                    // Update internal state without emitting events (assumes nv-fielddropdownitemcheck respects this)
+                    item.checked = shouldBeChecked;
+                }
+                else {
+                    item.checked = shouldBeChecked;
+                }
             }
             console.info('[syncChildComponents] itemValue:', itemValue, 'item.checked(after):', item.checked);
         });
@@ -26969,7 +27015,7 @@ class NvTogglebuttongroup {
     }; }
 }
 
-const nvTooltipCss = "nv-tooltip{display:inline-block;position:relative;user-select:none}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=popover] [data-scope=arrow]{background:var(--components-tooltip-background);box-shadow:none;border:none}";
+const nvTooltipCss = "nv-tooltip{display:inline-block;position:relative;user-select:none}nv-tooltip:has([fluid]:not([fluid=false])){display:block}nv-tooltip nv-popover>[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 nv-popover>[data-scope=popover] [data-scope=arrow]{background:var(--components-tooltip-background);box-shadow:none;border:none}";
 var NvTooltipStyle0 = nvTooltipCss;
 
 /**