@nova-design-system/nova-webcomponents 3.1.0 → 3.2.0

package/dist/native/{p-3953464e.entry.js → p-ed488498.entry.js}

@@ -1,7 +1,7 @@
-import{r as t,c as e,h as i,a as r,g as n}from"./p-ab002252.js";import{a as o,r as a}from"./p-d429a343.js";import{c as s}from"./p-8a1a6e56.js";import{B as l}from"./p-f85c08f1.js";import{v as d}from"./p-f5ff676c.js";
+import{r as t,c as e,h as i,a as r,g as n}from"./p-711a7778.js";import{a as o,r as a}from"./p-d429a343.js";import{c as s}from"./p-8a1a6e56.js";import{B as l}from"./p-f85c08f1.js";import{v as d}from"./p-f5ff676c.js";
 /*!
 * tabbable 6.2.0
 * @license MIT, https://github.com/focus-trap/tabbable/blob/master/LICENSE
 */
 var f=["input:not([inert])","select:not([inert])","textarea:not([inert])","a[href]:not([inert])","button:not([inert])","[tabindex]:not(slot):not([inert])","audio[controls]:not([inert])","video[controls]:not([inert])",'[contenteditable]:not([contenteditable="false"]):not([inert])',"details>summary:first-of-type:not([inert])","details:not([inert])"];var u=f.join(",");var c=typeof Element==="undefined";var h=c?function(){}:Element.prototype.matches||Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector;var v=!c&&Element.prototype.getRootNode?function(t){var e;return t===null||t===void 0?void 0:(e=t.getRootNode)===null||e===void 0?void 0:e.call(t)}:function(t){return t===null||t===void 0?void 0:t.ownerDocument};var b=function t(e,i){var r;if(i===void 0){i=true}var n=e===null||e===void 0?void 0:(r=e.getAttribute)===null||r===void 0?void 0:r.call(e,"inert");var o=n===""||n==="true";var a=o||i&&e&&t(e.parentNode);return a};var p=function t(e){var i;var r=e===null||e===void 0?void 0:(i=e.getAttribute)===null||i===void 0?void 0:i.call(e,"contenteditable");return r===""||r==="true"};var g=function t(e,i,r){if(b(e)){return[]}var n=Array.prototype.slice.apply(e.querySelectorAll(u));if(i&&h.call(e,u)){n.unshift(e)}n=n.filter(r);return n};var m=function t(e,i,r){var n=[];var o=Array.from(e);while(o.length){var a=o.shift();if(b(a,false)){continue}if(a.tagName==="SLOT"){var s=a.assignedElements();var l=s.length?s:a.children;var d=t(l,true,r);if(r.flatten){n.push.apply(n,d)}else{n.push({scopeParent:a,candidates:d})}}else{var f=h.call(a,u);if(f&&r.filter(a)&&(i||!e.includes(a))){n.push(a)}var c=a.shadowRoot||typeof r.getShadowRoot==="function"&&r.getShadowRoot(a);var v=!b(c,false)&&(!r.shadowRootFilter||r.shadowRootFilter(a));if(c&&v){var p=t(c===true?a.children:c.children,true,r);if(r.flatten){n.push.apply(n,p)}else{n.push({scopeParent:a,candidates:p})}}else{o.unshift.apply(o,a.children)}}}return n};var y=function t(e){return!isNaN(parseInt(e.getAttribute("tabindex"),10))};var w=function t(e){if(!e){throw new Error("No node provided")}if(e.tabIndex<0){if((/^(AUDIO|VIDEO|DETAILS)$/.test(e.tagName)||p(e))&&!y(e)){return 0}}return e.tabIndex};var x=function t(e,i){var r=w(e);if(r<0&&i&&!y(e)){return 0}return r};var k=function t(e,i){return e.tabIndex===i.tabIndex?e.documentOrder-i.documentOrder:e.tabIndex-i.tabIndex};var E=function t(e){return e.tagName==="INPUT"};var S=function t(e){return E(e)&&e.type==="hidden"};var T=function t(e){var i=e.tagName==="DETAILS"&&Array.prototype.slice.apply(e.children).some((function(t){return t.tagName==="SUMMARY"}));return i};var C=function t(e,i){for(var r=0;r<e.length;r++){if(e[r].checked&&e[r].form===i){return e[r]}}};var A=function t(e){if(!e.name){return true}var i=e.form||v(e);var r=function t(e){return i.querySelectorAll('input[type="radio"][name="'+e+'"]')};var n;if(typeof window!=="undefined"&&typeof window.CSS!=="undefined"&&typeof window.CSS.escape==="function"){n=r(window.CSS.escape(e.name))}else{try{n=r(e.name)}catch(t){console.error("Looks like you have a radio button with a name attribute containing invalid CSS selector characters and need the CSS.escape polyfill: %s",t.message);return false}}var o=C(n,e.form);return!o||o===e};var D=function t(e){return E(e)&&e.type==="radio"};var I=function t(e){return D(e)&&!A(e)};var L=function t(e){var i;var r=e&&v(e);var n=(i=r)===null||i===void 0?void 0:i.host;var o=false;if(r&&r!==e){var a,s,l;o=!!((a=n)!==null&&a!==void 0&&(s=a.ownerDocument)!==null&&s!==void 0&&s.contains(n)||e!==null&&e!==void 0&&(l=e.ownerDocument)!==null&&l!==void 0&&l.contains(e));while(!o&&n){var d,f,u;r=v(n);n=(d=r)===null||d===void 0?void 0:d.host;o=!!((f=n)!==null&&f!==void 0&&(u=f.ownerDocument)!==null&&u!==void 0&&u.contains(n))}}return o};var N=function t(e){var i=e.getBoundingClientRect(),r=i.width,n=i.height;return r===0&&n===0};var O=function t(e,i){var r=i.displayCheck,n=i.getShadowRoot;if(getComputedStyle(e).visibility==="hidden"){return true}var o=h.call(e,"details>summary:first-of-type");var a=o?e.parentElement:e;if(h.call(a,"details:not([open]) *")){return true}if(!r||r==="full"||r==="legacy-full"){if(typeof n==="function"){var s=e;while(e){var l=e.parentElement;var d=v(e);if(l&&!l.shadowRoot&&n(l)===true){return N(e)}else if(e.assignedSlot){e=e.assignedSlot}else if(!l&&d!==e.ownerDocument){e=d.host}else{e=l}}e=s}if(L(e)){return!e.getClientRects().length}if(r!=="legacy-full"){return true}}else if(r==="non-zero-area"){return N(e)}return false};var j=function t(e){if(/^(INPUT|BUTTON|SELECT|TEXTAREA)$/.test(e.tagName)){var i=e.parentElement;while(i){if(i.tagName==="FIELDSET"&&i.disabled){for(var r=0;r<i.children.length;r++){var n=i.children.item(r);if(n.tagName==="LEGEND"){return h.call(i,"fieldset[disabled] *")?true:!n.contains(e)}}return true}i=i.parentElement}}return false};var z=function t(e,i){if(i.disabled||b(i)||S(i)||O(i,e)||T(i)||j(i)){return false}return true};var U=function t(e,i){if(I(i)||w(i)<0||!z(e,i)){return false}return true};var P=function t(e){var i=parseInt(e.getAttribute("tabindex"),10);if(isNaN(i)||i>=0){return true}return false};var R=function t(e){var i=[];var r=[];e.forEach((function(e,n){var o=!!e.scopeParent;var a=o?e.scopeParent:e;var s=x(a,o);var l=o?t(e.candidates):a;if(s===0){o?i.push.apply(i,l):i.push(a)}else{r.push({documentOrder:n,tabIndex:s,item:e,isScope:o,content:l})}}));return r.sort(k).reduce((function(t,e){e.isScope?t.push.apply(t,e.content):t.push(e.content);return t}),[]).concat(i)};var B=function t(e,i){i=i||{};var r;if(i.getShadowRoot){r=m([e],i.includeContainer,{filter:U.bind(null,i),flatten:false,getShadowRoot:i.getShadowRoot,shadowRootFilter:P})}else{r=g(e,i.includeContainer,U.bind(null,i))}return R(r)};const F='dialog{border-radius:var(--radius-rounded-2xl);background:var(--color-level-00-background);min-width:400px;width:fit-content;max-width:clamp(90vw, min(90vw, 960px), 960px);margin:auto;max-height:90vh;overflow:hidden;box-shadow:0px var(--shadow-y-axis-2xl) var(--shadow-blur-2xl) var(--shadow-spread-2xl) var(--shadow-color-opacity-3) var(--shadow-color-opacity-3)}dialog.full{width:90vw}dialog::backdrop{opacity:var(--components-overlay-opacity);background:var(--components-overlay-background)}dialog .content{display:flex;flex-direction:column;align-items:flex-start;height:fit-content;max-height:90vh;overflow:hidden}dialog .content nv-button.close-button{position:absolute;top:var(--dialog-dismissible-position-top);right:var(--dialog-dismissible-position-right);display:flex;padding:var(--button-sm-icon-button-padding);justify-content:flex-end;align-items:flex-start;gap:10px}dialog .content .content-body{overflow:auto;box-sizing:border-box;padding:var(--dialog-body-padding-y) var(--dialog-body-padding-x);scrollbar-gutter:stable both-edges;font-family:"TT Norms Pro", sans-serif;font-size:var(--font-size-md);font-style:normal;font-weight:400;line-height:var(--line-height-base);color:var(--color-content-medium-text)}dialog .content .content-body::-webkit-scrollbar{width:6px;height:6px}dialog .content .content-body::-webkit-scrollbar-track{background-color:var(--color-level-10-background);border-radius:9999px}dialog .content .content-body::-webkit-scrollbar-thumb{background-color:var(--color-gray-200);border-radius:9999px}';const $=F;const M=class{constructor(i){t(this,i);this.openChanged=e(this,"openChanged",7);this.eventsAttached=false;this.open=false;this.undismissable=false;this.clickOutside=false;this.controlled=false;this.full=false;this.handleCloseButton=()=>{this.close()};this.handleCancelButton=()=>{this.close()};this.checkForForm=()=>{if(!this.form){const t=this.el.querySelector("form");if(t){this.form=this.ensureFormId(t)}}};this.handleDialogClose=()=>{if(this.open){this.close()}};this.handleClickOutside=t=>{if(t.target===this.dialogElement){this.close();t.preventDefault();t.stopPropagation()}};this.triggerClickEvents=[["click",this.show],["touchstart",this.show],["keydown",t=>{if(t.key==="Enter"||t.key===" "){t.preventDefault();this.show()}}]]}async show(){this.open=true;this.preventScroll();this.dialogElement.showModal();this.openChanged.emit(this.open)}async close(){this.open=false;this.allowScroll();this.dialogElement.close();this.openChanged.emit(this.open)}setAutofocus(){const t=B(this.dialogElement,{displayCheck:"none"});if(t.length>0){let e=t[0];let i=e.getBoundingClientRect();t.forEach((t=>{const r=t.getBoundingClientRect();if(r.top<i.top||r.left<i.left){e=t;i=r}}));e.setAttribute("autofocus","true")}}attachEventListeners(){if(this.triggerElement&&!this.eventsAttached&&!this.controlled){o(this.triggerClickEvents,this.triggerElement,this);this.eventsAttached=true}}preventScroll(){document.body.style.overflow="hidden"}allowScroll(){document.body.style.overflow=""}ensureFormId(t){if(!t.id){t.id=`dialog-form-${d()}`}return t.id}handleKeyDown(t){if(t.key==="Escape"&&this.undismissable){t.preventDefault();t.stopPropagation()}}handleDocumentClick(t){if(!this.clickOutside||this.undismissable)return;this.handleClickOutside(t)}handleDocumentTouch(t){if(!this.clickOutside||this.undismissable)return;this.handleClickOutside(t)}async handleDialogOpenChange(t){if(t){this.show()}else{this.close()}}componentWillLoad(){this.triggerElement=Array.from(this.el.children).find((t=>t.getAttribute("slot")==="trigger"));this.headerElement=Array.from(this.el.children).find((t=>t.getAttribute("slot")==="header"||t.tagName.toLowerCase()==="nv-dialogheader"));this.footerElement=Array.from(this.el.children).find((t=>t.getAttribute("slot")==="footer"||t.tagName.toLowerCase()==="nv-dialogfooter"));this.checkForForm()}componentWillUpdate(){this.attachEventListeners()}componentDidLoad(){if(this.open){this.show()}if(!this.dialogElement.querySelector("[autofocus]")){this.setAutofocus()}this.attachEventListeners();this.checkForForm()}disconnectedCallback(){if(this.triggerElement&&!this.eventsAttached&&!this.controlled){a(this.triggerClickEvents,this.triggerElement,this);this.eventsAttached=false}this.allowScroll()}render(){const t=this.form||this.el.querySelector("form");return i(r,{key:"c1eb9b79f52028c3ef7a57bad99260a45b678eb5"},i("slot",{key:"65a624853aa7242dc849a1196c6b5b8c331d426f",name:"trigger"}),i("dialog",{key:"17369b9be014e9136d77f99628b4bc8184d36370",ref:t=>this.dialogElement=t,onClose:this.handleDialogClose,role:"dialog","aria-modal":"true","aria-labelledby":"dialog-header","aria-describedby":"dialog-content",class:s({full:this.full})},i("div",{key:"8a17cd8deff162b333e2ac90c487454743d76f3d",class:"content"},!this.undismissable&&i("nv-button",{key:"d61a63785ce284ce2039be5c62d6e2bcce2a9b44",class:"close-button",emphasis:"lower",size:"sm",onClick:this.handleCloseButton,"aria-label":"Close dialog"},i("nv-icon",{key:"5a0adb449785bc684c41d0e35aad08ccb725386a",name:"x",size:"sm"})),this.headerElement?i("slot",{name:"header"}):i("nv-dialogheader",{id:"dialog-header"}),i("div",{key:"7c39e52d8fe6fc9ab2fdc2574a0c105d790bbfbe",class:"content-body",id:"dialog-content"},i("slot",{key:"038d9f3623177af5d996631dd9ae25fec49fd778"})),this.footerElement?i("slot",{name:"footer"}):i("nv-dialogfooter",{form:this.form,primaryButtonType:t?l.Submit:l.Button,onDialogCanceled:this.handleCancelButton,undismissable:this.undismissable}))))}get el(){return n(this)}static get watchers(){return{open:["handleDialogOpenChange"]}}};M.style=$;export{M as nv_dialog};
-//# sourceMappingURL=p-3953464e.entry.js.map
+//# sourceMappingURL=p-ed488498.entry.js.map

package/dist/native/p-ef76178b.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as r,h as i,a as t,g as o}from"./p-711a7778.js";import{v as n}from"./p-f5ff676c.js";const a='nv-fieldtext{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box;max-width:480px}nv-fieldtext[fluid]:not([fluid=false]){max-width:unset}nv-fieldtext[readonly]:not([readonly=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fieldtext[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive-in-field)}nv-fieldtext[success]:not([success=false]){--nv-field-border-default:var(--components-form-field-border-success);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-success)}nv-fieldtext[required]:not([required=false]) label::after{content:"*";color:var(--components-form-text-required);font-weight:700}nv-fieldtext>label{display:flex;align-items:center;gap:var(--form-label-gap);align-self:stretch;color:var(--components-form-text-label-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:500;line-height:var(--form-label-line-height)}nv-fieldtext>.input-wrapper{display:flex;flex-wrap:wrap;gap:var(--form-gap-x);align-items:stretch;align-self:stretch}nv-fieldtext>.input-wrapper .input-container{display:flex;flex-grow:1;justify-content:center;align-items:center;align-self:stretch;border-radius:var(--form-field-radius);border-width:1px;border-style:solid;border-color:var(--nv-field-border-default);opacity:var(--components-form-opacity-default, 1);background:var(--nv-field-background);transition:all 150ms ease-out}nv-fieldtext>.input-wrapper .input-container:hover{border-color:var(--nv-field-border-hover)}nv-fieldtext>.input-wrapper .input-container:focus-within,nv-fieldtext>.input-wrapper .input-container:focus-within:hover,nv-fieldtext>.input-wrapper .input-container:focus,nv-fieldtext>.input-wrapper .input-container:focus:hover{border-color:var(--nv-field-border-focus);box-shadow:0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow)}nv-fieldtext>.input-wrapper .input-container:has(input:read-only){opacity:0.5;background-color:var(--components-form-field-background-readonly);border-color:var(--nv-field-border-readonly)}nv-fieldtext>.input-wrapper .input-container:has(input:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fieldtext>.input-wrapper .input-container>[slot=leading-input]{display:block;margin-left:var(--form-field-padding-x)}nv-fieldtext>.input-wrapper .input-container input{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);padding:var(--form-field-padding-y) var(--form-field-padding-x);font-size:var(--form-field-font-size);font-style:normal;font-weight:500;line-height:var(--form-field-line-height);width:100%}nv-fieldtext>.input-wrapper .input-container input:focus{outline:none}nv-fieldtext>.input-wrapper .input-container input::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:"TT Norms Pro", sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:400;line-height:var(--form-field-line-height)}nv-fieldtext>.input-wrapper .input-container nv-icon.validation{color:var(--nv-field-border-default);margin-right:var(--form-gap-x)}nv-fieldtext>.input-wrapper .input-container>[slot=trailing-input]{display:block;margin-right:var(--form-field-padding-x)}nv-fieldtext>.description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fieldtext>.error-description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}';const d=a;const l=class{constructor(i){e(this,i);this.valueChanged=r(this,"valueChanged",7);this.inputId=n();this.type="text";this.disabled=false;this.readonly=false;this.required=false;this.error=false;this.success=false;this.multiple=false;this.autofocus=false;this.fluid=false;this.handleInput=e=>{const r=e.target;this.value=r.value;this.valueChanged.emit(r.value)};this.handleInputContainerClick=()=>{this.inputElement.focus()}}componentWillRender(){if(this.textInputType){this.type=this.textInputType}if(this.message){this.description=this.message}if(this.validation){this.errorDescription=this.validation;this.error=true}}render(){return i(t,{key:"852a919f0fcf19b0b67ddf6b0cc2762fc41c9388"},(this.label||this.el.querySelector('[slot="label"]'))&&i("label",{key:"3c99f456e76ddbc6ec21d3390aea76f849d72b88",htmlFor:this.inputId},i("slot",{key:"5a11c6f3f0f56b8ab05d0390fec6bd1b15763d02",name:"label"},this.label)),i("div",{key:"a305c2ffb63cfd66c70d0074fc62c823cce37f8e",class:"input-wrapper"},i("slot",{key:"0efd115ea0805160dee0c4b58ad137be2aabc741",name:"before-input"}),i("div",{key:"ccaaa74adf0df1667bc971eaedb4b9883061851d",class:"input-container",onClick:this.handleInputContainerClick},i("slot",{key:"f81025cb44b30e185b3057527cdc2a1662f5252a",name:"leading-input"}),i("input",{key:"a8b2356d0b5372823f3da9f053d0de8e28bf8c08",id:this.inputId,ref:e=>this.inputElement=e,placeholder:this.placeholder,name:this.name,type:this.type,disabled:this.disabled,readOnly:this.readonly,required:this.required,maxlength:this.maxlength,minlength:this.minlength,pattern:this.pattern,autofocus:this.autofocus,autocomplete:this.autocomplete,multiple:this.multiple,value:this.value,onInput:this.handleInput}),i("slot",{key:"aa531021a4d3db52839c280cda21d06be6deaa79",name:"trailing-input"}),this.error&&i("nv-icon",{key:"fc590ef5879887b2990912b16cc247db875af237",name:"alert-circle",class:"validation",size:"md"}),this.success&&i("nv-icon",{key:"68023589dc8340647b1aa5fa07f1b9bda248049d",name:"circle-check",class:"validation",size:"md"})),i("slot",{key:"3d0a53914d87559eab76f4d0b8165ad1d7e4eccf",name:"after-input"})),(this.description||this.el.querySelector('[slot="description"]'))&&i("div",{key:"8641ee0c8638ec43d5a3da0d08ed29991cedfc6a",class:"description"},i("slot",{key:"fe4ee537f946b69ef9908f1d086046b03c777f90",name:"description"},this.description)),(this.errorDescription||this.el.querySelector('[slot="error-description"]'))&&i("div",{key:"865c34d486b86223fbbbc81f22cd3428e4110af8",hidden:!this.error,class:"error-description"},i("slot",{key:"ac80b543c58bed6db534b8f1571a70aabf811918",name:"error-description"},this.errorDescription)))}static get formAssociated(){return true}get el(){return o(this)}};l.style=d;export{l as nv_fieldtext};
+//# sourceMappingURL=p-ef76178b.entry.js.map

package/dist/native/p-ef76178b.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["nvFieldtextCss","NvFieldtextStyle0","NvFieldtext","constructor","hostRef","this","inputId","uuidv4","type","disabled","readonly","required","error","success","multiple","autofocus","fluid","handleInput","event","input","target","value","valueChanged","emit","handleInputContainerClick","inputElement","focus","componentWillRender","textInputType","message","description","validation","errorDescription","render","h","Host","key","label","el","querySelector","htmlFor","name","class","onClick","id","ref","e","placeholder","readOnly","maxlength","minlength","pattern","autocomplete","onInput","size","hidden"],"sources":["src/components/nv-fieldtext/nv-fieldtext.scss?tag=nv-fieldtext","src/components/nv-fieldtext/nv-fieldtext.tsx"],"sourcesContent":["@import '../../styles/form-field';\n\nnv-fieldtext {\n  @include form-field-variables();\n  @include form-field-root();\n\n  &[fluid]:not([fluid='false']) {\n    @include form-field-fluid();\n  }\n\n  &[readonly]:not([readonly='false']) {\n    @include form-field-readonly-variables();\n  }\n\n  &[error]:not([error='false']) {\n    @include form-field-error-variables();\n  }\n\n  &[success]:not([success='false']) {\n    @include form-field-success-variables();\n  }\n\n  &[required]:not([required='false']) label {\n    @include form-field-label-required();\n  }\n\n  > label {\n    @include form-field-label();\n  }\n\n  > .input-wrapper {\n    @include form-field-input-wrapper();\n\n    .input-container {\n      @include form-field-input-container();\n      > [slot='leading-input'] {\n        @include form-field-inner-leading-slot();\n      }\n\n      input {\n        @include form-field-input();\n      }\n      \n\n      nv-icon.validation {\n        @include form-field-icon();\n        margin-right: var(--form-gap-x);\n      }\n      > [slot='trailing-input'] {\n        @include form-field-inner-trailing-slot();\n      }\n    }\n  }\n\n  > .description {\n    @include form-field-description();\n  }\n\n  > .error-description {\n    @include form-field-error-description();\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Element,\n} from '@stencil/core';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { TextInputAutocomplete } from '../../utils/constants';\n\n/**\n * @slot leading-input - Content to be placed before the input text, within the input container.\n * @slot trailing-input - Content to be placed after the input text, within the input container.\n * @slot before-input - Content to be placed before the input text, outside the input container.\n * @slot after-input - Content to be placed after the input text, outside the input container.\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 * @slot error-description - Content to be placed as the error description, will override the errorDescription prop.\n */\n@Component({\n  tag: 'nv-fieldtext',\n  shadow: false,\n  formAssociated: true,\n  styleUrl: 'nv-fieldtext.scss',\n})\nexport class NvFieldtext {\n  @Element() el: HTMLNvFieldtextElement;\n  private inputElement!: HTMLInputElement;\n\n  /****************************************************************************/\n  //#region DEPRECATED\n\n  /**\n   * Message defines a 'hint ' message for the Text Field.\n   * @deprecated Use `description` instead.\n   */\n  @Prop({ reflect: true })\n  readonly message: string;\n\n  /**\n   * Add the message to the validation state.\n   * @deprecated Use `errorDescription` and set the error prop instead.\n   */\n  @Prop({ reflect: true })\n  readonly validation: string;\n\n  /**\n   * Type of the input.\n   * @deprecated use type instead.\n   */\n  @Prop({ reflect: true })\n  readonly textInputType: 'text' | 'tel' | 'email';\n\n  //#endregion DEPRECATED\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Sets the ID for the input element and the for attribute of the associated\n   * label. If no ID is provided, a random one will be automatically generated\n   * to ensure unique identification, facilitating proper label association and\n   * accessibility.\n   */\n  @Prop({ reflect: true })\n  readonly inputId: string = uuidv4();\n\n  /**\n   * Lets you define the text that explains what users should enter in the text\n   * input field. It’s a crucial element for making forms clear and\n   * user-friendly.\n   */\n  @Prop({ reflect: true })\n  readonly label: string;\n\n  /**\n   * Add helpful hints or extra information under the text input field. This is\n   * where you can clarify what users should enter or provide additional\n   * instructions, making the form easier to fill out correctly.\n   */\n  @Prop({ reflect: true, mutable: true })\n  description: string;\n\n  /**\n   * Display temporary text inside the input field to give users a hint about\n   * what to type. It’s a great way to provide examples or suggestions directly\n   * in the field before they start typing.\n   */\n  @Prop({ reflect: true })\n  readonly placeholder: string;\n\n  /**\n   * Defines the name attribute of the input field, which is crucial for form\n   * submission. This value is used as the key in the key-value pair sent to\n   * the server, representing the input’s data in form submissions. It should be\n   * unique within the form to avoid conflicts\n   */\n  @Prop({ reflect: true })\n  readonly name: string;\n\n  /**\n   * Specifies the value of the input field, which determines the text displayed\n   * within the field. This prop is typically used in controlled components\n   * where the input’s value is managed by the component’s state.\n   */\n  @Prop({ reflect: true, mutable: true })\n  value: string;\n\n  /**\n   * The type prop lets you specify what kind of information the input field\n   * should accept. Choose 'text' for general words or sentences, 'tel' for\n   * phone numbers, or 'email' for email addresses. This makes sure users get\n   * the right keyboard and validation for what they need to enter.\n   */\n  @Prop({ reflect: true, mutable: true })\n  type: 'text' | 'tel' | 'email' = 'text';\n\n  /**\n   * The disabled prop lets you turn off the input field so that users can’t\n   * type in it. When disabled, the field is grayed out and won’t respond to\n   * clicks or touches.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Display the input field’s content without allowing users to change it.\n   * Users can still click on it, select, and copy the text, but they won’t be\n   * able to type or delete anything.\n   */\n  @Prop({ reflect: true })\n  readonly readonly: boolean = false;\n\n  /**\n   * Marks the input field as required, ensuring that the user must fill it out\n   * before submitting the form.\n   */\n  @Prop({ reflect: true })\n  readonly required: boolean = false;\n\n  /**\n   * Alters the input field’s appearance to indicate an error, helping users\n   * identify fields that need correction.\n   * @validator error\n   */\n  @Prop({ reflect: true, mutable: true })\n  error: boolean = false;\n\n  /**\n   * A description that appears when there is an error related to the textfield\n   * field.\n   * @validator message\n   */\n  @Prop({ reflect: true, mutable: true })\n  errorDescription?: string;\n\n  /**\n   * Changes the input field’s appearance to indicate successful input or\n   * validation.\n   */\n  @Prop({ reflect: true })\n  readonly success: boolean = false;\n\n  /**\n   * Limits how many characters users can type into the input field. It’s\n   * helpful for making sure users don’t enter too much information, keeping\n   * their input within the allowed limit.\n   */\n  @Prop({ reflect: true })\n  readonly maxlength: number;\n\n  /**\n   * Ensures that users type at least a certain number of characters into the\n   * input field. It’s a way to make sure users provide enough information\n   * before moving on.\n   */\n  @Prop({ reflect: true })\n  readonly minlength: number;\n\n  /**\n   * Set rules for how the input should be formatted. For example, you can\n   * require that a phone number includes only digits or that an email address\n   * has the correct format. If users don’t follow these rules, they’ll get a\n   * prompt to correct their input after the form is submitted.\n   */\n  @Prop({ reflect: true })\n  readonly pattern: string;\n\n  /**\n   * The autocomplete prop helps users fill out the input field faster by\n   * suggesting entries they’ve used before, like their email or address.\n   * You can turn it on to make forms more convenient or off to ensure users\n   * always type in fresh data.\n   */\n  @Prop({ reflect: true })\n  readonly autocomplete: `${TextInputAutocomplete}`;\n\n  /**\n   * When used with the email input type, this prop enables the field to accept\n   * multiple email addresses. Users can enter several addresses, separating\n   * each one with a comma, allowing the form to handle multiple recipients.\n   */\n  @Prop({ reflect: true })\n  readonly multiple: boolean = false;\n\n  /**\n   * Applies focus to the input field as soon as the component is mounted. This\n   * is equivalent to setting the native autofocus attribute on an <input>\n   * element.\n   */\n  @Prop({ reflect: true })\n  // eslint-disable-next-line @stencil-community/reserved-member-names\n  readonly autofocus: boolean = false;\n\n  /**\n   * Allows the field to stretch and fill the entire width of its container.\n   */\n  @Prop({ reflect: true })\n  readonly fluid: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emitted when the input value changes.\n   * @bind value\n   */\n  @Event()\n  valueChanged: EventEmitter<string>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Handles the input event on the input element.\n   * Emits the inputChanged event with the new value.\n   * @param {Event} event - Event object of the input event.\n   */\n  private handleInput = (event: Event) => {\n    const input = event.target as HTMLInputElement;\n    this.value = input.value;\n    this.valueChanged.emit(input.value);\n  };\n\n  /**\n   * Handles focus when the input container is clicked.\n   */\n  private handleInputContainerClick = () => {\n    this.inputElement.focus();\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillRender() {\n    if (this.textInputType) {\n      this.type = this.textInputType;\n    }\n\n    if (this.message) {\n      this.description = this.message;\n    }\n\n    if (this.validation) {\n      this.errorDescription = this.validation;\n      this.error = true;\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        {(this.label || this.el.querySelector('[slot=\"label\"]')) && (\n          <label htmlFor={this.inputId}>\n            <slot name=\"label\">{this.label}</slot>\n          </label>\n        )}\n\n        <div class=\"input-wrapper\">\n          <slot name=\"before-input\"></slot>\n\n          <div class=\"input-container\" onClick={this.handleInputContainerClick}>\n            <slot name=\"leading-input\"></slot>\n\n            <input\n              id={this.inputId}\n              ref={e => (this.inputElement = e)}\n              placeholder={this.placeholder}\n              name={this.name}\n              type={this.type}\n              disabled={this.disabled}\n              readOnly={this.readonly}\n              required={this.required}\n              maxlength={this.maxlength}\n              minlength={this.minlength}\n              pattern={this.pattern}\n              autofocus={this.autofocus}\n              autocomplete={this.autocomplete}\n              multiple={this.multiple}\n              value={this.value}\n              onInput={this.handleInput}\n            />\n\n            <slot name=\"trailing-input\"></slot>\n\n            {this.error && (\n              <nv-icon name=\"alert-circle\" class=\"validation\" size=\"md\" />\n            )}\n            {this.success && (\n              <nv-icon name=\"circle-check\" class=\"validation\" size=\"md\" />\n            )}\n          </div>\n\n          <slot name=\"after-input\"></slot>\n        </div>\n\n        {(this.description ||\n          this.el.querySelector('[slot=\"description\"]')) && (\n          <div class=\"description\">\n            <slot name=\"description\">{this.description}</slot>\n          </div>\n        )}\n\n        {(this.errorDescription ||\n          this.el.querySelector('[slot=\"error-description\"]')) && (\n          <div hidden={!this.error} class=\"error-description\">\n            <slot name=\"error-description\">{this.errorDescription}</slot>\n          </div>\n        )}\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"mappings":"oGAAA,MAAMA,EAAiB,yxKACvB,MAAAC,EAAeD,E,MC2BFE,EAAW,MANxB,WAAAC,CAAAC,G,qDA6CWC,KAAAC,QAAkBC,IAkD3BF,KAAAG,KAAiC,OAQxBH,KAAAI,SAAoB,MAQpBJ,KAAAK,SAAoB,MAOpBL,KAAAM,SAAoB,MAQ7BN,KAAAO,MAAiB,MAeRP,KAAAQ,QAAmB,MA0CnBR,KAAAS,SAAoB,MASpBT,KAAAU,UAAqB,MAMrBV,KAAAW,MAAiB,MAsBlBX,KAAAY,YAAeC,IACrB,MAAMC,EAAQD,EAAME,OACpBf,KAAKgB,MAAQF,EAAME,MACnBhB,KAAKiB,aAAaC,KAAKJ,EAAME,MAAM,EAM7BhB,KAAAmB,0BAA4B,KAClCnB,KAAKoB,aAAaC,OAAO,C,CAO3B,mBAAAC,GACE,GAAItB,KAAKuB,cAAe,CACtBvB,KAAKG,KAAOH,KAAKuB,a,CAGnB,GAAIvB,KAAKwB,QAAS,CAChBxB,KAAKyB,YAAczB,KAAKwB,O,CAG1B,GAAIxB,KAAK0B,WAAY,CACnB1B,KAAK2B,iBAAmB3B,KAAK0B,WAC7B1B,KAAKO,MAAQ,I,EAQjB,MAAAqB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,6CACD/B,KAAKgC,OAAShC,KAAKiC,GAAGC,cAAc,oBACpCL,EAAA,SAAAE,IAAA,2CAAOI,QAASnC,KAAKC,SACnB4B,EAAA,QAAAE,IAAA,2CAAMK,KAAK,SAASpC,KAAKgC,QAI7BH,EAAA,OAAAE,IAAA,2CAAKM,MAAM,iBACTR,EAAA,QAAAE,IAAA,2CAAMK,KAAK,iBAEXP,EAAA,OAAAE,IAAA,2CAAKM,MAAM,kBAAkBC,QAAStC,KAAKmB,2BACzCU,EAAA,QAAAE,IAAA,2CAAMK,KAAK,kBAEXP,EAAA,SAAAE,IAAA,2CACEQ,GAAIvC,KAAKC,QACTuC,IAAKC,GAAMzC,KAAKoB,aAAeqB,EAC/BC,YAAa1C,KAAK0C,YAClBN,KAAMpC,KAAKoC,KACXjC,KAAMH,KAAKG,KACXC,SAAUJ,KAAKI,SACfuC,SAAU3C,KAAKK,SACfC,SAAUN,KAAKM,SACfsC,UAAW5C,KAAK4C,UAChBC,UAAW7C,KAAK6C,UAChBC,QAAS9C,KAAK8C,QACdpC,UAAWV,KAAKU,UAChBqC,aAAc/C,KAAK+C,aACnBtC,SAAUT,KAAKS,SACfO,MAAOhB,KAAKgB,MACZgC,QAAShD,KAAKY,cAGhBiB,EAAA,QAAAE,IAAA,2CAAMK,KAAK,mBAEVpC,KAAKO,OACJsB,EAAA,WAAAE,IAAA,2CAASK,KAAK,eAAeC,MAAM,aAAaY,KAAK,OAEtDjD,KAAKQ,SACJqB,EAAA,WAAAE,IAAA,2CAASK,KAAK,eAAeC,MAAM,aAAaY,KAAK,QAIzDpB,EAAA,QAAAE,IAAA,2CAAMK,KAAK,kBAGXpC,KAAKyB,aACLzB,KAAKiC,GAAGC,cAAc,0BACtBL,EAAA,OAAAE,IAAA,2CAAKM,MAAM,eACTR,EAAA,QAAAE,IAAA,2CAAMK,KAAK,eAAepC,KAAKyB,eAIjCzB,KAAK2B,kBACL3B,KAAKiC,GAAGC,cAAc,gCACtBL,EAAA,OAAAE,IAAA,2CAAKmB,QAASlD,KAAKO,MAAO8B,MAAM,qBAC9BR,EAAA,QAAAE,IAAA,2CAAMK,KAAK,qBAAqBpC,KAAK2B,mB","ignoreList":[]}

package/dist/native/{p-e5de64d5.entry.js → p-f0ddf60b.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,c as o,h as c,a as i,g as n}from"./p-ab002252.js";import{c as t}from"./p-8a1a6e56.js";import{v as r}from"./p-f5ff676c.js";const a='nv-fieldcheckbox{--nv-fieldcheckbox-border-default:var(\n    --components-form-field-border-default\n  );--nv-fieldcheckbox-border-hover:var(--components-form-field-border-hover);--nv-fieldcheckbox-border-focus:var(--components-form-field-border-default);--nv-fieldcheckbox-background-default:var(\n    --components-form-field-background-default\n  );--nv-fieldcheckbox-background-checked:var(\n    --components-form-field-background-checked\n  );--nv-fieldcheckbox-background-disabled:var(\n    --components-form-field-background-disabled\n  );--nv-fieldcheckbox-focus-box-shadow:var(--color-focus-brand);--nv-fieldcheckbox-color-checked:var(\n    --components-form-shape-foreground-default\n  );--nv-fieldcheckbox-color-disabled:var(\n    --components-form-shape-foreground-disabled\n  );--nv-fieldcheckbox-outline-color:var(--color-focus-brand);display:inline-flex;align-items:flex-start;gap:var(--form-gap-x);position:relative}nv-fieldcheckbox:not([disabled],[readonly]) input,nv-fieldcheckbox:not([disabled],[readonly]) label{cursor:pointer}nv-fieldcheckbox.error>.input-container{--nv-fieldcheckbox-border-default:var(--components-form-field-border-error);--nv-fieldcheckbox-border-hover:var(--nv-fieldcheckbox-border-default);--nv-fieldcheckbox-border-focus:var(--components-form-field-border-error);--nv-fieldcheckbox-focus-box-shadow:var(--color-focus-destructive);--nv-fieldcheckbox-color-disabled:var(\n    --components-form-shape-foreground-disabled-error\n  );--nv-fieldcheckbox-background-checked:var(\n    --components-form-field-background-error\n  );--nv-fieldcheckbox-outline-color:var(--color-focus-destructive)}nv-fieldcheckbox.label-placement-before{flex-direction:row-reverse}nv-fieldcheckbox[disabled]:not([disabled=false]){opacity:0.5}nv-fieldcheckbox>.input-container{position:relative;color:var(--nv-fieldcheckbox-color-checked)}nv-fieldcheckbox>.input-container input[type=checkbox][readonly]{opacity:0.5}nv-fieldcheckbox>.input-container:has(input[type=checkbox]:disabled:not([readonly])){color:var(--nv-fieldcheckbox-color-disabled)}nv-fieldcheckbox>.input-container input[type=checkbox]{appearance:none;position:relative;display:flex;width:var(--form-checkbox-size);height:var(--form-checkbox-size);flex-direction:column;align-items:flex-start;border-radius:var(--form-checkbox-radius);border-width:var(--form-checkbox-border-width);border-style:solid;border-color:var(--nv-fieldcheckbox-border-default);background:var(--nv-fieldcheckbox-background-default)}nv-fieldcheckbox>.input-container input[type=checkbox]:hover{border-color:var(--nv-fieldcheckbox-border-hover)}nv-fieldcheckbox>.input-container input[type=checkbox]:focus{border-color:var(--nv-fieldcheckbox-border-focus)}nv-fieldcheckbox>.input-container input[type=checkbox]:focus,nv-fieldcheckbox>.input-container input[type=checkbox]:focus-within{outline:none}nv-fieldcheckbox>.input-container input[type=checkbox]:focus-visible,nv-fieldcheckbox>.input-container input[type=checkbox]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--nv-fieldcheckbox-outline-color);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-fieldcheckbox>.input-container input[type=checkbox]:checked,nv-fieldcheckbox>.input-container input[type=checkbox]:indeterminate{background:var(--nv-fieldcheckbox-background-checked);border-color:var(--nv-fieldcheckbox-background-checked)}nv-fieldcheckbox>.input-container input[type=checkbox]:disabled:not([readonly]){background:var(--nv-fieldcheckbox-background-disabled);border-color:var(--nv-fieldcheckbox-border-default)}nv-fieldcheckbox>.input-container input[type=checkbox][readonly]{opacity:0.5}nv-fieldcheckbox>.input-container .icon{pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center}nv-fieldcheckbox>.input-container .icon svg{width:var(--form-checkbox-icon-size);height:var(--form-checkbox-icon-size);fill:none;stroke:currentcolor;stroke-width:var(--form-checkbox-icon-stroke);flex-shrink:0}nv-fieldcheckbox>.text-container{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}nv-fieldcheckbox>.text-container label{align-self:stretch;color:var(--components-form-text-label-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:var(--form-label-font-weight);line-height:var(--form-label-line-height)}nv-fieldcheckbox>.text-container label.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-fieldcheckbox>.text-container .description{align-self:stretch;color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;font-weight:var(--form-description-font-weight);line-height:var(--form-description-line-height)}nv-fieldcheckbox>.text-container .error-description{align-self:stretch;color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;font-weight:var(--form-description-font-weight);line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}';const d=a;const s=class{constructor(c){e(this,c);this.checkedChanged=o(this,"checkedChanged",7);this.labelBefore=false;this.inputId=r();this.hideLabel=false;this.error=false;this.checked=false;this.indeterminate=false;this.disabled=false;this.readonly=false;this.required=false;this.autofocus=false}handleChange(e){const o=e.target;if(o.type==="checkbox"&&o.id===this.inputId){if(this.readonly||this.disabled){e.preventDefault();return}if(this.indeterminate){this.indeterminate=false}this.checked=o.checked}}onCheckedChanged(e){this.checkedChanged.emit(e)}componentWillRender(){if(this.message){this.description=this.message}if(this.labelBefore){this.labelPlacement="before"}if(this.validation){this.errorDescription=this.validation;this.error=true}}render(){return c(i,{key:"98f9dfdadab534193e7076f929c9820a231fecba",class:t(this.labelPlacement==="before"&&"label-placement-before",this.error&&"error")},c("div",{key:"5a4d02d46b7c8c8930c24f794452180d58604ffe",class:"input-container"},c("input",{key:"f7a4002a5fb9800ed4036638773ac42c49d4ae0f",type:"checkbox",id:this.inputId,name:this.name,autofocus:this.autofocus,autocomplete:"off",value:this.value,checked:Boolean(this.checked),disabled:this.disabled||this.readonly,readonly:this.readonly&&!this.required,required:this.required,indeterminate:this.indeterminate,ref:e=>{if(e){e.indeterminate=this.indeterminate}}}),c("span",{key:"56a2547ecf96ef3f7f28054592471323497cb94f",class:"icon"},this.checked&&!this.indeterminate&&c("slot",{key:"af4e10bd52b42850c8348e0aed8c90a7e700d64a",name:"checked-icon"},c("svg",{key:"105847f526c391566cef42fa35d94fbaba0e8984",xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 14 14",fill:"none"},c("path",{key:"41e221d5f3eab7a4cc88d4ed9454f198d69ec815",d:"M11.6667 3.5L5.25004 9.91667L2.33337 7","stroke-linecap":"round","stroke-linejoin":"round"}))),this.indeterminate&&c("slot",{key:"3a1f5ffdc34a1ecdc1bb7f1b5347e1f12f5f690d",name:"indeterminate-icon"},c("svg",{key:"1b68c27172d5b6b9ba2419d278c0ac0299d7a4b7",class:"indeterminate-svg",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 14 14",fill:"none"},c("path",{key:"7b2f4e5fe1d961fad290aade639b9807446f34ba",d:"M2.9165 7H11.0832","stroke-linecap":"round","stroke-linejoin":"round"}))))),c("div",{key:"d472d7d8901ff7de37fe370bf5d637fc8ae6069d",class:"text-container"},(this.label||this.el.querySelector('[slot="label"]'))&&c("label",{key:"c8dbda4d6f9cb757476c9a96934599171f6ea7ae",htmlFor:this.inputId,class:t(this.hideLabel&&"visually-hidden")},c("slot",{key:"3c0ec17aeb856457b63981fd0e21ead69ca3af0f",name:"label"},this.label)),(this.description||this.el.querySelector('[slot="description"]'))&&c("div",{key:"dff6c3a69496324cabcf25ae7639c98a7d908769",class:"description"},c("slot",{key:"498c8216c9a0a537f1aa2a542b3caa688b76e55d",name:"description"},this.description)),(this.errorDescription||this.el.querySelector('[slot="error-description"]'))&&c("div",{key:"6c584da0ad93e7f0ad62610d760c36d77b1a6fc6",hidden:!this.error,class:"error-description"},c("slot",{key:"93df382e666707cdde3133daae7aa66914215149",name:"error-description"},this.errorDescription))))}static get formAssociated(){return true}get el(){return n(this)}static get watchers(){return{checked:["onCheckedChanged"]}}};s.style=d;export{s as nv_fieldcheckbox};
-//# sourceMappingURL=p-e5de64d5.entry.js.map
+import{r as e,c as o,h as c,a as i,g as n}from"./p-711a7778.js";import{c as t}from"./p-8a1a6e56.js";import{v as r}from"./p-f5ff676c.js";const a='nv-fieldcheckbox{--nv-fieldcheckbox-border-default:var(\n    --components-form-field-border-default\n  );--nv-fieldcheckbox-border-hover:var(--components-form-field-border-hover);--nv-fieldcheckbox-border-focus:var(--components-form-field-border-default);--nv-fieldcheckbox-background-default:var(\n    --components-form-field-background-default\n  );--nv-fieldcheckbox-background-checked:var(\n    --components-form-field-background-checked\n  );--nv-fieldcheckbox-background-disabled:var(\n    --components-form-field-background-disabled\n  );--nv-fieldcheckbox-focus-box-shadow:var(--color-focus-brand);--nv-fieldcheckbox-color-checked:var(\n    --components-form-shape-foreground-default\n  );--nv-fieldcheckbox-color-disabled:var(\n    --components-form-shape-foreground-disabled\n  );--nv-fieldcheckbox-outline-color:var(--color-focus-brand);display:inline-flex;align-items:flex-start;gap:var(--form-gap-x);position:relative}nv-fieldcheckbox:not([disabled],[readonly]) input,nv-fieldcheckbox:not([disabled],[readonly]) label{cursor:pointer}nv-fieldcheckbox.error>.input-container{--nv-fieldcheckbox-border-default:var(--components-form-field-border-error);--nv-fieldcheckbox-border-hover:var(--nv-fieldcheckbox-border-default);--nv-fieldcheckbox-border-focus:var(--components-form-field-border-error);--nv-fieldcheckbox-focus-box-shadow:var(--color-focus-destructive);--nv-fieldcheckbox-color-disabled:var(\n    --components-form-shape-foreground-disabled-error\n  );--nv-fieldcheckbox-background-checked:var(\n    --components-form-field-background-error\n  );--nv-fieldcheckbox-outline-color:var(--color-focus-destructive)}nv-fieldcheckbox.label-placement-before{flex-direction:row-reverse}nv-fieldcheckbox[disabled]:not([disabled=false]){opacity:0.5}nv-fieldcheckbox>.input-container{position:relative;color:var(--nv-fieldcheckbox-color-checked)}nv-fieldcheckbox>.input-container input[type=checkbox][readonly]{opacity:0.5}nv-fieldcheckbox>.input-container:has(input[type=checkbox]:disabled:not([readonly])){color:var(--nv-fieldcheckbox-color-disabled)}nv-fieldcheckbox>.input-container input[type=checkbox]{appearance:none;position:relative;display:flex;width:var(--form-checkbox-size);height:var(--form-checkbox-size);flex-direction:column;align-items:flex-start;border-radius:var(--form-checkbox-radius);border-width:var(--form-checkbox-border-width);border-style:solid;border-color:var(--nv-fieldcheckbox-border-default);background:var(--nv-fieldcheckbox-background-default)}nv-fieldcheckbox>.input-container input[type=checkbox]:hover{border-color:var(--nv-fieldcheckbox-border-hover)}nv-fieldcheckbox>.input-container input[type=checkbox]:focus{border-color:var(--nv-fieldcheckbox-border-focus)}nv-fieldcheckbox>.input-container input[type=checkbox]:focus,nv-fieldcheckbox>.input-container input[type=checkbox]:focus-within{outline:none}nv-fieldcheckbox>.input-container input[type=checkbox]:focus-visible,nv-fieldcheckbox>.input-container input[type=checkbox]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--nv-fieldcheckbox-outline-color);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-fieldcheckbox>.input-container input[type=checkbox]:checked,nv-fieldcheckbox>.input-container input[type=checkbox]:indeterminate{background:var(--nv-fieldcheckbox-background-checked);border-color:var(--nv-fieldcheckbox-background-checked)}nv-fieldcheckbox>.input-container input[type=checkbox]:disabled:not([readonly]){background:var(--nv-fieldcheckbox-background-disabled);border-color:var(--nv-fieldcheckbox-border-default)}nv-fieldcheckbox>.input-container input[type=checkbox][readonly]{opacity:0.5}nv-fieldcheckbox>.input-container .icon{pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center}nv-fieldcheckbox>.input-container .icon svg{width:var(--form-checkbox-icon-size);height:var(--form-checkbox-icon-size);fill:none;stroke:currentcolor;stroke-width:var(--form-checkbox-icon-stroke);flex-shrink:0}nv-fieldcheckbox>.text-container{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}nv-fieldcheckbox>.text-container label{align-self:stretch;color:var(--components-form-text-label-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:var(--form-label-font-weight);line-height:var(--form-label-line-height)}nv-fieldcheckbox>.text-container label.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-fieldcheckbox>.text-container .description{align-self:stretch;color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;font-weight:var(--form-description-font-weight);line-height:var(--form-description-line-height)}nv-fieldcheckbox>.text-container .error-description{align-self:stretch;color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;font-weight:var(--form-description-font-weight);line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}';const d=a;const s=class{constructor(c){e(this,c);this.checkedChanged=o(this,"checkedChanged",7);this.labelBefore=false;this.inputId=r();this.hideLabel=false;this.error=false;this.checked=false;this.indeterminate=false;this.disabled=false;this.readonly=false;this.required=false;this.autofocus=false}handleChange(e){const o=e.target;if(o.type==="checkbox"&&o.id===this.inputId){if(this.readonly||this.disabled){e.preventDefault();return}if(this.indeterminate){this.indeterminate=false}this.checked=o.checked}}onCheckedChanged(e){this.checkedChanged.emit(e)}componentWillRender(){if(this.message){this.description=this.message}if(this.labelBefore){this.labelPlacement="before"}if(this.validation){this.errorDescription=this.validation;this.error=true}}render(){return c(i,{key:"98f9dfdadab534193e7076f929c9820a231fecba",class:t(this.labelPlacement==="before"&&"label-placement-before",this.error&&"error")},c("div",{key:"5a4d02d46b7c8c8930c24f794452180d58604ffe",class:"input-container"},c("input",{key:"f7a4002a5fb9800ed4036638773ac42c49d4ae0f",type:"checkbox",id:this.inputId,name:this.name,autofocus:this.autofocus,autocomplete:"off",value:this.value,checked:Boolean(this.checked),disabled:this.disabled||this.readonly,readonly:this.readonly&&!this.required,required:this.required,indeterminate:this.indeterminate,ref:e=>{if(e){e.indeterminate=this.indeterminate}}}),c("span",{key:"56a2547ecf96ef3f7f28054592471323497cb94f",class:"icon"},this.checked&&!this.indeterminate&&c("slot",{key:"af4e10bd52b42850c8348e0aed8c90a7e700d64a",name:"checked-icon"},c("svg",{key:"105847f526c391566cef42fa35d94fbaba0e8984",xmlns:"http://www.w3.org/2000/svg",width:"14",height:"14",viewBox:"0 0 14 14",fill:"none"},c("path",{key:"41e221d5f3eab7a4cc88d4ed9454f198d69ec815",d:"M11.6667 3.5L5.25004 9.91667L2.33337 7","stroke-linecap":"round","stroke-linejoin":"round"}))),this.indeterminate&&c("slot",{key:"3a1f5ffdc34a1ecdc1bb7f1b5347e1f12f5f690d",name:"indeterminate-icon"},c("svg",{key:"1b68c27172d5b6b9ba2419d278c0ac0299d7a4b7",class:"indeterminate-svg",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 14 14",fill:"none"},c("path",{key:"7b2f4e5fe1d961fad290aade639b9807446f34ba",d:"M2.9165 7H11.0832","stroke-linecap":"round","stroke-linejoin":"round"}))))),c("div",{key:"d472d7d8901ff7de37fe370bf5d637fc8ae6069d",class:"text-container"},(this.label||this.el.querySelector('[slot="label"]'))&&c("label",{key:"c8dbda4d6f9cb757476c9a96934599171f6ea7ae",htmlFor:this.inputId,class:t(this.hideLabel&&"visually-hidden")},c("slot",{key:"3c0ec17aeb856457b63981fd0e21ead69ca3af0f",name:"label"},this.label)),(this.description||this.el.querySelector('[slot="description"]'))&&c("div",{key:"dff6c3a69496324cabcf25ae7639c98a7d908769",class:"description"},c("slot",{key:"498c8216c9a0a537f1aa2a542b3caa688b76e55d",name:"description"},this.description)),(this.errorDescription||this.el.querySelector('[slot="error-description"]'))&&c("div",{key:"6c584da0ad93e7f0ad62610d760c36d77b1a6fc6",hidden:!this.error,class:"error-description"},c("slot",{key:"93df382e666707cdde3133daae7aa66914215149",name:"error-description"},this.errorDescription))))}static get formAssociated(){return true}get el(){return n(this)}static get watchers(){return{checked:["onCheckedChanged"]}}};s.style=d;export{s as nv_fieldcheckbox};
+//# sourceMappingURL=p-f0ddf60b.entry.js.map

package/dist/native/p-f39803d9.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as i,a as r,g as n}from"./p-711a7778.js";import{I as a}from"./p-53aa81dd.js";import{v as o}from"./p-f5ff676c.js";import"./p-0462f723.js";const d='nv-fielddaterange{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box;max-width:480px}nv-fielddaterange[fluid]:not([fluid=false]){max-width:unset}nv-fielddaterange[readonly]:not([readonly=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fielddaterange[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive-in-field)}nv-fielddaterange[success]:not([success=false]){--nv-field-border-default:var(--components-form-field-border-success);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-success)}nv-fielddaterange[required]:not([required=false]) label::after{content:"*";color:var(--components-form-text-required);font-weight:700}nv-fielddaterange label{display:flex;align-items:center;gap:var(--form-label-gap);align-self:stretch;color:var(--components-form-text-label-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:500;line-height:var(--form-label-line-height)}nv-fielddaterange nv-popover{width:100%;display:block}nv-fielddaterange nv-popover [data-scope=popover]{padding:0;background-color:var(--components-list-dropdown-background);border:1px solid var(--components-list-dropdown-border);width:auto}nv-fielddaterange nv-popover [slot=content]{display:block;width:100%}nv-fielddaterange .input-wrapper{display:flex;flex-wrap:wrap;gap:var(--form-gap-x);align-items:stretch;align-self:stretch;display:flex;align-items:center;gap:8px}nv-fielddaterange .input-wrapper .input-container{display:flex;flex-grow:1;justify-content:center;align-items:center;align-self:stretch;border-radius:var(--form-field-radius);border-width:1px;border-style:solid;border-color:var(--nv-field-border-default);opacity:var(--components-form-opacity-default, 1);background:var(--nv-field-background);transition:all 150ms ease-out}nv-fielddaterange .input-wrapper .input-container:hover{border-color:var(--nv-field-border-hover)}nv-fielddaterange .input-wrapper .input-container:focus-within,nv-fielddaterange .input-wrapper .input-container:focus-within:hover,nv-fielddaterange .input-wrapper .input-container:focus,nv-fielddaterange .input-wrapper .input-container:focus:hover{border-color:var(--nv-field-border-focus);box-shadow:0px 0px 0px var(--focus-field-stroke) var(--nv-field-focus-box-shadow)}nv-fielddaterange .input-wrapper .input-container:has(input:read-only){opacity:0.5;background-color:var(--components-form-field-background-readonly);border-color:var(--nv-field-border-readonly)}nv-fielddaterange .input-wrapper .input-container:has(input:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fielddaterange .input-wrapper .input-container input{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);padding:var(--form-field-padding-y) var(--form-field-padding-x);font-size:var(--form-field-font-size);font-style:normal;font-weight:500;line-height:var(--form-field-line-height);width:100%;width:100%}nv-fielddaterange .input-wrapper .input-container input:focus{outline:none}nv-fielddaterange .input-wrapper .input-container input::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:"TT Norms Pro", sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:400;line-height:var(--form-field-line-height)}nv-fielddaterange .input-wrapper .input-container>nv-iconbutton{border:0px;border-radius:0px}nv-fielddaterange .input-wrapper .input-container>nv-iconbutton:focus-visible{border-radius:var(--button-md-border-radius);outline-offset:-3px}nv-fielddaterange .input-wrapper .input-container nv-icon.validation{color:var(--nv-field-border-default)}nv-fielddaterange .description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fielddaterange .error-description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}nv-fielddaterange .range-inputs{display:flex;align-items:center;gap:8px}nv-fielddaterange .range-inputs input{flex:1;border:none;outline:none;padding:0;font-size:var(--form-field-font-size);color:var(--components-form-field-content-text);background:transparent;min-width:0;text-align:center}nv-fielddaterange .range-inputs input::placeholder{color:var(--components-form-field-content-placeholder)}nv-fielddaterange .range-inputs input:disabled{cursor:not-allowed;color:var(--components-form-field-content-text);background-color:var(--components-form-field-background-disabled)}';const s=d;const l=class{constructor(i){e(this,i);this.dateRangeChange=t(this,"dateRangeChange",7);this.popoverId=o();this.startInputId=o();this.endInputId=o();this.disabled=false;this.readonly=false;this.required=false;this.error=false;this.success=false;this.autofocus=false;this.value="";this.startValue="";this.endValue="";this.open=false;this.calendarState=null;this.firstDayOfWeek=1;this.numberOfCalendars=2;this.min="";this.max="";this.locale="en-BE";this.dateFormat="YYYY-MM-DD";this.shortcutsPlacement="bottom";this.showActions=false;this.fluid=false;this.handleClickOutside=e=>{if(this.open&&this.el&&!this.el.contains(e.target)){this.open=false}};this.handleStartInput=e=>{if(this.readonly||this.disabled){e.preventDefault();return}const t=e.target;this.startValue=t.value;this.dateRangeChange.emit({start:t.value,end:this.endValue});if(this.calendarElement){this.calendarElement.removeAttribute("data-prevent-navigation");this.updateCalendarValue();setTimeout((()=>{if(this.calendarElement){this.calendarElement.setAttribute("data-prevent-navigation","true")}}),100)}};this.handleEndInput=e=>{if(this.readonly||this.disabled){e.preventDefault();return}const t=e.target;this.endValue=t.value;this.dateRangeChange.emit({start:this.startValue,end:t.value});if(this.calendarElement){this.calendarElement.removeAttribute("data-prevent-navigation");this.updateCalendarValue();setTimeout((()=>{if(this.calendarElement){this.calendarElement.setAttribute("data-prevent-navigation","true")}}),100)}};this.handleFocus=e=>{if(this.readonly||this.disabled){e.preventDefault();e.target.blur();return}if(this.calendarElement){this.calendarElement.removeAttribute("data-prevent-navigation")}this.open=true;setTimeout((()=>{if(this.calendarElement){this.calendarElement.setAttribute("data-prevent-navigation","true")}}),300)};this.toggleCalendar=()=>{if(this.readonly||this.disabled){return}this.open=!this.open}}convertToInputmaskFormat(e){if(!e){return"dd/mm/yyyy"}const t={"YYYY-MM-DD":"yyyy-mm-dd","DD/MM/YYYY":"dd/mm/yyyy","MM/DD/YYYY":"mm/dd/yyyy","DD.MM.YYYY":"dd.mm.yyyy",YYYYMMDD:"yyyymmdd"};return t[e]||"dd/mm/yyyy"}updateCalendarValue(){if(this.calendarElement&&this.startValue&&this.endValue){this.calendarState={start:this.startValue,end:this.endValue}}}connectedCallback(){document.addEventListener("click",this.handleClickOutside)}componentWillLoad(){if(this.value){try{const e=JSON.parse(this.value);this.startValue=e.start||"";this.endValue=e.end||"";if(e.start&&e.end){this.calendarState={start:e.start,end:e.end}}}catch(e){console.error("Invalid JSON for value:");console.error(e)}}}componentDidLoad(){const e=this.el.querySelectorAll(".input-wrapper input");e.forEach((e=>{const t=new a({alias:"datetime",inputFormat:this.convertToInputmaskFormat(this.dateFormat),placeholder:"_",clearIncomplete:false,showMaskOnHover:false,showMaskOnFocus:false,clearMaskOnLostFocus:false,insertMode:true,rightAlign:false,oncomplete:function(e){const t=e.target;const i=new CustomEvent("input",{bubbles:true});t.dispatchEvent(i)}});t.mask(e);if(e.name===this.startName&&this.startValue){requestAnimationFrame((()=>{e.value=this.startValue;const t=new CustomEvent("input",{bubbles:true});e.dispatchEvent(t)}))}else if(e.name===this.endName&&this.endValue){requestAnimationFrame((()=>{e.value=this.endValue;const t=new CustomEvent("input",{bubbles:true});e.dispatchEvent(t)}))}}))}componentDidRender(){const e=this.el.querySelectorAll(".input-wrapper input");e.forEach((e=>{const t=e.name===this.startName?this.startValue:this.endName?this.endValue:"";if(t){requestAnimationFrame((()=>{e.value=t;e.setAttribute("value",t)}))}}))}disconnectedCallback(){document.removeEventListener("click",this.handleClickOutside)}handleRangeDateChange(e){const{start:t,end:i}=e.detail||{};if(t&&i){this.startValue=t;this.endValue=i;this.calendarState={start:t,end:i};this.dateRangeChange.emit({start:this.startValue,end:this.endValue});if(!this.showActions){this.open=false}}}handleClosePopover(){this.open=false}handleApplyDateRange(){this.open=false}handleDateReset(e){const t=e.type==="singleDateChange"&&e.detail==="";const i=e.type==="rangeDateChange"&&e.detail&&e.detail.start===""&&e.detail.end==="";if(t||i){this.startValue="";this.endValue="";const e=this.el.querySelectorAll(".input-wrapper input");e.forEach((e=>{e.value=""}));this.dateRangeChange.emit({start:"",end:""})}}handleKeyDown(e){if(!this.open){if(e.key==="ArrowDown"){this.open=true;e.preventDefault();return}return}if(!this.popoverElement){console.warn("nv-fielddaterange -> Popover element is not defined");return}}handleValueChange(e){try{const t=JSON.parse(e);this.startValue=t.start||"";this.endValue=t.end||""}catch(e){console.error("Invalid JSON for value:",e)}}render(){return i(r,{key:"152a588b815a0f3846c5b0c8b9da8d3dbc8f4768"},(this.label&&this.label.length>0||this.el.querySelector('[slot="label"]'))&&i("label",{key:"786269a2bd4a50559cfad72c61f80797e4afc902",htmlFor:this.startInputId},i("slot",{key:"e1c6ed7d288d21889e1ebdfdf0595d4f43e551f7",name:"label"},this.label)),i("nv-popover",{key:"228966569f5670f1b283c2e45f1c1057811e699d",ref:e=>this.popoverElement=e,id:this.popoverId,triggerMode:"controlled",placement:"bottom-start",open:this.open},i("div",{key:"ee39e8da7367bceb1fdcaf7f008d780652471e8e",slot:"trigger",class:"input-wrapper"},i("slot",{key:"0555695d16ae919327771c586a291dc1767ed98f",name:"before-input"}),i("div",{key:"106aec6a9be06a03497f66407ea8038d5e4be899",class:"input-container"},i("slot",{key:"e448f8bacd3b383944f862b9dc1b7ea64feb565e",name:"leading-input"}),i("div",{key:"52ef48b4d76f063c65daa43865da607273ba6410",class:"range-inputs"},i("input",{key:"899e309f7e100b7b6d12603b229aa4c429ddc1d2",id:this.startInputId,type:"text",placeholder:this.startPlaceholder,name:this.startName,disabled:this.disabled,readOnly:this.readonly,required:this.required,autofocus:this.autofocus,value:this.startValue,onInput:this.handleStartInput,onFocus:this.handleFocus,"data-scope":"date-range"}),i("svg",{key:"083bef93159b08aaf5c9f7637fbe459c2017e82f",xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round",class:"icon icon-tabler icons-tabler-outline icon-tabler-arrows-move-horizontal"},i("path",{key:"2946dbfae81e0b3cdd62f77bb928617d182ae5c1",stroke:"none",d:"M0 0h24v24H0z",fill:"none"}),i("path",{key:"afcf53514d22c9f8bb5d7d09294808f3ca053cc9",d:"M18 9l3 3l-3 3"}),i("path",{key:"53fe61cf1c1a5206f22d4c065292680f28fa3c59",d:"M15 12h6"}),i("path",{key:"1e138be2146498fa127922dcba9646e2e960a7e3",d:"M6 9l-3 3l3 3"}),i("path",{key:"3e324bf333bd69374fccac278386f6cc966fc3bd",d:"M3 12h6"})),i("input",{key:"b7eeab7a9e0071c862528e8fa47c543d0295d331",id:this.endInputId,type:"text",placeholder:this.endPlaceholder,name:this.endName,disabled:this.disabled,readOnly:this.readonly,required:this.required,value:this.endValue,onInput:this.handleEndInput,onFocus:this.handleFocus,"data-scope":"date-range"})),this.error&&i("nv-icon",{key:"f2ab540736820a8fcf7f4dbb973bc3a16b14fa8d",name:"alert-circle",class:"validation",size:"md"}),this.success&&i("nv-icon",{key:"91e75c515c4a44a3e499240e4d3c45b7a736429a",name:"circle-check",class:"validation",size:"md"}),i("nv-iconbutton",{key:"a471cb1db59673f07ce493bae59e54ee8ecd8968",class:"toggle-calendar-icon",name:"calendar",size:"md",emphasis:"lower","aria-label":this.open?"Hide calendar":"Show calendar","aria-pressed":this.open.toString(),onClick:this.toggleCalendar,tabIndex:this.disabled?-1:0})),i("slot",{key:"375a0c1848445652c2ef5f20ded877223774f792",name:"after-input"})),i("div",{key:"7427c51a78cf38a979b9f7eb4e9a7f49a36279d5",slot:"content"},i("nv-calendar",{key:"1f9ad9bed53d9496f17544c6381824490431c342",ref:e=>this.calendarElement=e,dateFormat:this.dateFormat,rangeValue:this.calendarState,firstDayOfWeek:this.firstDayOfWeek,numberOfCalendars:this.numberOfCalendars,min:this.min,max:this.max,locale:this.locale,shortcutsPlacement:this.shortcutsPlacement,showActions:this.showActions,shortcuts:this.shortcuts,showWeekNumbers:this.showWeekNumbers,disabledDates:this.disabledDates,selectionType:"range","data-prevent-navigation":"true"}))),(this.description&&this.description.length>0||this.el.querySelector('[slot="description"]'))&&i("div",{key:"c964928de34f26fc82619601d0964079b061048f",class:"description"},i("slot",{key:"f409a5286e1c0ba16f36f062df3df5531dad6296",name:"description"},this.description)),(this.errorDescription||this.el.querySelector('[slot="error-description"]'))&&i("div",{key:"5e8a1b48da516f801372a59e379c5ade77f9761a",hidden:!this.error,class:"error-description"},this.el.querySelector('[slot="error-description"]')?i("slot",{name:"error-description"}):this.errorDescription),i("slot",{key:"68f37bddcd3208217a26eb230d1f8afdd3552eff"}))}get el(){return n(this)}static get watchers(){return{value:["handleValueChange"]}}};l.style=s;export{l as nv_fielddaterange};
+//# sourceMappingURL=p-f39803d9.entry.js.map

package/dist/native/p-f39803d9.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["nvFielddaterangeCss","NvFielddaterangeStyle0","NvFielddaterange","constructor","hostRef","this","popoverId","uuidv4","startInputId","endInputId","disabled","readonly","required","error","success","autofocus","value","startValue","endValue","open","calendarState","firstDayOfWeek","numberOfCalendars","min","max","locale","dateFormat","shortcutsPlacement","showActions","fluid","handleClickOutside","event","el","contains","target","handleStartInput","preventDefault","input","dateRangeChange","emit","start","end","calendarElement","removeAttribute","updateCalendarValue","setTimeout","setAttribute","handleEndInput","handleFocus","blur","toggleCalendar","convertToInputmaskFormat","format","formatMap","YYYYMMDD","connectedCallback","document","addEventListener","componentWillLoad","range","JSON","parse","console","componentDidLoad","inputs","querySelectorAll","forEach","inputMask","Inputmask","alias","inputFormat","placeholder","clearIncomplete","showMaskOnHover","showMaskOnFocus","clearMaskOnLostFocus","insertMode","rightAlign","oncomplete","e","CustomEvent","bubbles","dispatchEvent","mask","name","startName","requestAnimationFrame","endName","componentDidRender","disconnectedCallback","removeEventListener","handleRangeDateChange","detail","handleClosePopover","handleApplyDateRange","handleDateReset","isResetSingle","type","isResetRange","handleKeyDown","key","popoverElement","warn","handleValueChange","newValue","render","h","Host","label","length","querySelector","htmlFor","ref","id","triggerMode","placement","slot","class","startPlaceholder","readOnly","onInput","onFocus","xmlns","width","height","viewBox","fill","stroke","d","endPlaceholder","size","emphasis","toString","onClick","tabIndex","rangeValue","shortcuts","showWeekNumbers","disabledDates","selectionType","description","errorDescription","hidden"],"sources":["src/components/nv-fielddaterange/styles/nv-fielddaterange.scss?tag=nv-fielddaterange","src/components/nv-fielddaterange/nv-fielddaterange.tsx"],"sourcesContent":["@import '../../../styles/form-field';\n\nnv-fielddaterange {\n  @include form-field-variables();\n  @include form-field-root();\n\n  &[fluid]:not([fluid=\"false\"]) {\n    @include form-field-fluid();\n  }\n\n  &[readonly]:not([readonly='false']) {\n    @include form-field-readonly-variables();\n  }\n\n  &[error]:not([error='false']) {\n    @include form-field-error-variables();\n  }\n\n  &[success]:not([success='false']) {\n    @include form-field-success-variables();\n  }\n\n  &[required]:not([required='false']) label {\n    @include form-field-label-required();\n  }\n\n  label {\n    @include form-field-label();\n  }\n\n  nv-popover {\n    width: 100%;\n    display: block;\n\n    [data-scope='popover'] {\n      padding: 0;\n      background-color: var(--components-list-dropdown-background);\n      border: 1px solid var(--components-list-dropdown-border);\n      width: auto;\n    }\n\n    [slot='content'] {\n      display: block;\n      width: 100%;\n    }\n  }\n\n  .input-wrapper {\n    @include form-field-input-wrapper();\n    display: flex;\n    align-items: center;\n    gap: 8px;\n\n    .input-container {\n      @include form-field-input-container();\n\n      input {\n        @include form-field-input();\n        width: 100%;\n      }\n\n      > nv-iconbutton {\n        @include form-field-action();\n      }\n\n      nv-icon.validation {\n        @include form-field-icon();\n      }\n    }\n  }\n\n  .description {\n    @include form-field-description();\n  }\n\n  .error-description {\n    @include form-field-error-description();\n  }\n\n  .range-inputs {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n\n    input {\n      flex: 1;\n      border: none;\n      outline: none;\n      padding: 0;\n      font-size: var(--form-field-font-size);\n      color: var(--components-form-field-content-text);\n      background: transparent;\n      min-width: 0; // to avoid overflow\n      text-align: center;\n\n      &::placeholder {\n        color: var(--components-form-field-content-placeholder);\n      }\n\n      &:disabled {\n        cursor: not-allowed;\n        color: var(--components-form-field-content-text);\n        background-color: var(--components-form-field-background-disabled);\n      }\n    }\n  }\n}\n","import {\n  Component,\n  h,\n  Prop,\n  State,\n  Element,\n  Event,\n  EventEmitter,\n  Listen,\n  Host,\n  Watch,\n} from '@stencil/core';\nimport Inputmask from 'inputmask';\nimport { v4 as uuidv4 } from 'uuid';\n\n/**\n * @slot default - Child content of the component.\n * @slot leading-input - Content to be placed before the input text, within the input container.\n * @slot before-input - Content to be placed before the input text, outside the input container.\n * @slot after-input - Content to be placed after the input text, outside the input container.\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 * @slot error-description - Content to be placed as the error description, will override the errorDescription prop.\n */\n@Component({\n  tag: 'nv-fielddaterange',\n  styleUrl: 'styles/nv-fielddaterange.scss',\n  shadow: false,\n})\nexport class NvFielddaterange {\n  @Element() el!: HTMLNvFielddaterangeElement;\n  private popoverElement!: HTMLNvPopoverElement;\n  private calendarElement!: HTMLNvCalendarElement;\n  private popoverId: string = uuidv4();\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Sets the ID for the start input element and the for attribute of the associated\n   * label. If no ID is provided, a random one will be automatically generated.\n   */\n  @Prop({ reflect: true })\n  readonly startInputId: string = uuidv4();\n\n  /**\n   * Sets the ID for the end input element and the for attribute of the associated\n   * label. If no ID is provided, a random one will be automatically generated.\n   */\n  @Prop({ reflect: true })\n  readonly endInputId: string = uuidv4();\n\n  /**\n   * Text displayed as label. A slot label can override this prop.\n   */\n  @Prop({ reflect: true })\n  readonly label: string;\n\n  /**\n   * Description displayed below the input. A slot description can override this prop.\n   */\n  @Prop({ reflect: true })\n  readonly description: string;\n\n  /**\n   * Placeholder for the start input field.\n   */\n  @Prop({ reflect: true })\n  readonly startPlaceholder: string;\n\n  /**\n   * Placeholder for the end input field.\n   */\n  @Prop({ reflect: true })\n  readonly endPlaceholder: string;\n\n  /**\n   * Name attribute for the start input.\n   */\n  @Prop({ reflect: true })\n  readonly startName: string;\n\n  /**\n   * Name attribute for the end input.\n   */\n  @Prop({ reflect: true })\n  readonly endName: string;\n\n  /**\n   * Disables both input fields.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Sets both input fields as read-only.\n   */\n  @Prop({ reflect: true })\n  readonly readonly: boolean = false;\n\n  /**\n   * Marks both input fields as required.\n   */\n  @Prop({ reflect: true })\n  readonly required: boolean = false;\n\n  /**\n   * Indicates an error state.\n   */\n  @Prop({ reflect: true })\n  readonly error: boolean = false;\n\n  /**\n   * Error description. A slot error-description can override this prop.\n   */\n  @Prop({ reflect: true })\n  readonly errorDescription?: string;\n\n  /**\n   * Indicates a success state.\n   */\n  @Prop({ reflect: true })\n  readonly success: boolean = false;\n\n  /**\n   * Autofocus the start input when the component is mounted.\n   */\n  @Prop({ reflect: true })\n  // eslint-disable-next-line @stencil-community/reserved-member-names\n  readonly autofocus: boolean = false;\n\n  /**\n   * The initial value of the date range (in string format).\n   */\n  @Prop({ reflect: true })\n  readonly value: string = '';\n\n  /**\n   * The current value of the start date in string format.\n   */\n  @State()\n  startValue: string = '';\n\n  /**\n   * The current value of the end date in string format.\n   */\n  @State()\n  endValue: string = '';\n\n  /**\n   * Controls the opening of the popover.\n   */\n  @State()\n  open: boolean = false;\n\n  /**\n   * Current calendar state to prevent unwanted navigation\n   */\n  @State()\n  private calendarState: {\n    /** Start date in string format */\n    start: string;\n    /** End date in string format */\n    end: string;\n  } = null;\n\n  /**\n   * First day of the week 0 = Sunday, 1 = Monday, etc.\n   * @default 1\n   */\n  @Prop({ reflect: true })\n  readonly firstDayOfWeek: number = 1;\n\n  /**\n   * Number of calendars to display\n   * @default 2\n   */\n  @Prop({ reflect: true })\n  readonly numberOfCalendars: number = 2;\n\n  /**\n   * Minimum date for selection ISO string format, ex: 2025-01-01\n   */\n  @Prop({ reflect: true })\n  readonly min?: string = '';\n\n  /**\n   * Maximum date for selection ISO string format, ex: 2025-12-31\n   */\n  @Prop({ reflect: true })\n  readonly max?: string = '';\n\n  /** Locale for date formatting\n   * @default 'en-BE'\n   */\n  @Prop({ reflect: true })\n  readonly locale: string = 'en-BE';\n\n  /** Date format ex: YYYY-MM-DD, DD-MM-YYYY, etc.\n   * @default 'YYYY-MM-DD'\n   */\n  @Prop({ reflect: true })\n  readonly dateFormat: string = 'YYYY-MM-DD';\n\n  /**\n   * Footer placement\n   * @default 'bottom'\n   */\n  @Prop({ reflect: true })\n  readonly shortcutsPlacement: 'bottom' | 'left' | 'right' = 'bottom';\n\n  /**\n   * Show action buttons\n   * @default false\n   */\n  @Prop({ reflect: true })\n  readonly showActions: boolean = false;\n\n  /**\n   * Custom actions to display in the footer\n   */\n  @Prop({ reflect: true })\n  readonly shortcuts: HTMLNvCalendarElement['shortcuts'];\n\n  /**\n   * Show week numbers\n   */\n  @Prop({ reflect: true })\n  readonly showWeekNumbers: boolean;\n\n  /**\n   * Disabled dates ISO string array\n   */\n  @Prop({ reflect: true })\n  readonly disabledDates: Array<string>;\n\n  /**\n   * Allows the field to stretch and fill the entire width of its container.\n   */\n  @Prop({ reflect: true })\n  readonly fluid: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Converts the nv-calendar date format to the format expected by Inputmask.\n   * @param {string} format - The date format to convert\n   * @returns {string} The converted format for Inputmask\n   */\n  private convertToInputmaskFormat(format: string): string {\n    // If the format is not specified, use the default format YYYY-MM-DD\n    if (!format) {\n      return 'dd/mm/yyyy';\n    }\n\n    const formatMap = {\n      'YYYY-MM-DD': 'yyyy-mm-dd',\n      'DD/MM/YYYY': 'dd/mm/yyyy',\n      'MM/DD/YYYY': 'mm/dd/yyyy',\n      'DD.MM.YYYY': 'dd.mm.yyyy',\n      'YYYYMMDD': 'yyyymmdd',\n    };\n\n    return formatMap[format] || 'dd/mm/yyyy';\n  }\n\n  /**\n   * Closes the popover when a click is detected outside the component.\n   * @param {MouseEvent} event - The mouse event\n   */\n  private handleClickOutside = (event: MouseEvent) => {\n    if (this.open && this.el && !this.el.contains(event.target as Node)) {\n      this.open = false;\n    }\n  };\n\n  /**\n   * Handles the input event on the start input element.\n   * @param {Event} event - The input event\n   */\n  private handleStartInput = (event: Event) => {\n    if (this.readonly || this.disabled) {\n      event.preventDefault();\n      return;\n    }\n    const input = event.target as HTMLInputElement;\n    this.startValue = input.value;\n    this.dateRangeChange.emit({ start: input.value, end: this.endValue });\n\n    // Temporarily enable navigation for keyboard input\n    if (this.calendarElement) {\n      this.calendarElement.removeAttribute('data-prevent-navigation');\n      this.updateCalendarValue();\n      // Restore navigation prevention after update\n      setTimeout(() => {\n        if (this.calendarElement) {\n          this.calendarElement.setAttribute('data-prevent-navigation', 'true');\n        }\n      }, 100);\n    }\n  };\n\n  /**\n   * Handles the input event on the end input element.\n   * @param {Event} event - The input event\n   */\n  private handleEndInput = (event: Event) => {\n    if (this.readonly || this.disabled) {\n      event.preventDefault();\n      return;\n    }\n    const input = event.target as HTMLInputElement;\n    this.endValue = input.value;\n    this.dateRangeChange.emit({ start: this.startValue, end: input.value });\n\n    // Temporarily enable navigation for keyboard input\n    if (this.calendarElement) {\n      this.calendarElement.removeAttribute('data-prevent-navigation');\n      this.updateCalendarValue();\n      // Restore navigation prevention after update\n      setTimeout(() => {\n        if (this.calendarElement) {\n          this.calendarElement.setAttribute('data-prevent-navigation', 'true');\n        }\n      }, 100);\n    }\n  };\n\n  /**\n   * Update the calendar's rangeValue property without forcing month change\n   */\n  private updateCalendarValue() {\n    if (this.calendarElement && this.startValue && this.endValue) {\n      // Store the current calendar state\n      this.calendarState = {\n        start: this.startValue,\n        end: this.endValue,\n      };\n    }\n  }\n\n  /**\n   * Handles focus events on the input elements.\n   * @param {FocusEvent} event - The focus event\n   */\n  private handleFocus = (event: FocusEvent) => {\n    if (this.readonly || this.disabled) {\n      event.preventDefault();\n      (event.target as HTMLElement).blur();\n      return;\n    }\n\n    // Enable navigation on focus\n    if (this.calendarElement) {\n      this.calendarElement.removeAttribute('data-prevent-navigation');\n    }\n\n    this.open = true;\n\n    // Restore navigation prevention after opening\n    setTimeout(() => {\n      if (this.calendarElement) {\n        this.calendarElement.setAttribute('data-prevent-navigation', 'true');\n      }\n    }, 300);\n  };\n\n  /**\n   * Toggles the opening/closing of the popover.\n   */\n  private toggleCalendar = () => {\n    if (this.readonly || this.disabled) {\n      return;\n    }\n    this.open = !this.open;\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  connectedCallback() {\n    document.addEventListener('click', this.handleClickOutside);\n  }\n\n  componentWillLoad() {\n    if (this.value) {\n      try {\n        const range = JSON.parse(\n          this.value,\n        ) as HTMLNvCalendarElement['rangeValue'];\n        this.startValue = range.start || '';\n        this.endValue = range.end || '';\n        if (range.start && range.end) {\n          this.calendarState = {\n            start: range.start,\n            end: range.end,\n          };\n        }\n      } catch (error) {\n        console.error('Invalid JSON for value:');\n        console.error(error);\n      }\n    }\n  }\n\n  componentDidLoad() {\n    const inputs = this.el.querySelectorAll('.input-wrapper input');\n    inputs.forEach((input: HTMLInputElement) => {\n      const inputMask = new Inputmask({\n        alias: 'datetime',\n        inputFormat: this.convertToInputmaskFormat(this.dateFormat),\n        placeholder: '_',\n        clearIncomplete: false,\n        showMaskOnHover: false,\n        showMaskOnFocus: false,\n        clearMaskOnLostFocus: false,\n        insertMode: true,\n        rightAlign: false,\n        oncomplete: function (e) {\n          const input = e.target as HTMLInputElement;\n          const event = new CustomEvent('input', { bubbles: true });\n          input.dispatchEvent(event);\n        },\n      });\n      inputMask.mask(input);\n\n      // Set the value after applying the mask\n      if (input.name === this.startName && this.startValue) {\n        requestAnimationFrame(() => {\n          input.value = this.startValue;\n          const event = new CustomEvent('input', { bubbles: true });\n          input.dispatchEvent(event);\n        });\n      } else if (input.name === this.endName && this.endValue) {\n        requestAnimationFrame(() => {\n          input.value = this.endValue;\n          const event = new CustomEvent('input', { bubbles: true });\n          input.dispatchEvent(event);\n        });\n      }\n    });\n  }\n\n  componentDidRender() {\n    const inputs = this.el.querySelectorAll('.input-wrapper input');\n    inputs.forEach((input: HTMLInputElement) => {\n      const value =\n        input.name === this.startName\n          ? this.startValue\n          : this.endName\n          ? this.endValue\n          : '';\n      if (value) {\n        // Make sure the value is defined both as a property and attribute\n        requestAnimationFrame(() => {\n          input.value = value;\n          input.setAttribute('value', value);\n        });\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    document.removeEventListener('click', this.handleClickOutside);\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emits an event when the date range changes.\n   */\n  @Event()\n  dateRangeChange: EventEmitter<\n    HTMLNvCalendarElementEventMap['rangeDateChange']\n  >;\n\n  /**\n   * Handles the range date selection event from nv-calendar.\n   * @param {CustomEvent<DateRange>} event - The custom event\n   */\n  @Listen('rangeDateChange')\n  handleRangeDateChange(\n    event: CustomEvent<HTMLNvCalendarElementEventMap['rangeDateChange']>,\n  ) {\n    const { start, end } = event.detail || {};\n\n    // Check that both dates are defined\n    if (start && end) {\n      this.startValue = start;\n      this.endValue = end;\n      this.calendarState = { start, end };\n      this.dateRangeChange.emit({\n        start: this.startValue,\n        end: this.endValue,\n      });\n\n      if (!this.showActions) {\n        this.open = false;\n      }\n    }\n  }\n\n  @Listen('closePopover')\n  handleClosePopover() {\n    this.open = false;\n  }\n\n  @Listen('applyDateRange')\n  handleApplyDateRange() {\n    this.open = false;\n  }\n\n  /**\n   * Handles the reset event from the calendar's cancel button\n   * @param {CustomEvent} event - The event emitted by the calendar\n   */\n  @Listen('singleDateChange')\n  @Listen('rangeDateChange')\n  handleDateReset(event: CustomEvent) {\n    const isResetSingle =\n      event.type === 'singleDateChange' && event.detail === '';\n    const isResetRange =\n      event.type === 'rangeDateChange' &&\n      event.detail &&\n      event.detail.start === '' &&\n      event.detail.end === '';\n\n    if (isResetSingle || isResetRange) {\n      this.startValue = '';\n      this.endValue = '';\n\n      const inputs = this.el.querySelectorAll('.input-wrapper input');\n      inputs.forEach((input: HTMLInputElement) => {\n        input.value = '';\n      });\n\n      this.dateRangeChange.emit({ start: '', end: '' });\n    }\n  }\n\n  /**\n   * Handles keyboard events.\n   * @param {KeyboardEvent} event - The keyboard event\n   */\n  @Listen('keydown', { passive: false })\n  handleKeyDown(event: KeyboardEvent) {\n    if (!this.open) {\n      if (event.key === 'ArrowDown') {\n        this.open = true;\n        event.preventDefault();\n        return;\n      }\n      return;\n    }\n\n    if (!this.popoverElement) {\n      console.warn('nv-fielddaterange -> Popover element is not defined');\n      return;\n    }\n  }\n\n  @Watch('value')\n  handleValueChange(newValue: string) {\n    try {\n      const range = JSON.parse(newValue) as HTMLNvCalendarElement['rangeValue'];\n      this.startValue = range.start || '';\n      this.endValue = range.end || '';\n    } catch (error) {\n      console.error('Invalid JSON for value:', error);\n    }\n  }\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        {((this.label && this.label.length > 0) ||\n          this.el.querySelector('[slot=\"label\"]')) && (\n          <label htmlFor={this.startInputId}>\n            <slot name=\"label\">{this.label}</slot>\n          </label>\n        )}\n\n        <nv-popover\n          ref={el => (this.popoverElement = el as HTMLNvPopoverElement)}\n          id={this.popoverId}\n          triggerMode=\"controlled\"\n          placement=\"bottom-start\"\n          open={this.open}\n        >\n          <div slot=\"trigger\" class=\"input-wrapper\">\n            <slot name=\"before-input\"></slot>\n\n            <div class=\"input-container\">\n              <slot name=\"leading-input\"></slot>\n\n              <div class=\"range-inputs\">\n                <input\n                  id={this.startInputId}\n                  type=\"text\"\n                  placeholder={this.startPlaceholder}\n                  name={this.startName}\n                  disabled={this.disabled}\n                  readOnly={this.readonly}\n                  required={this.required}\n                  autofocus={this.autofocus}\n                  value={this.startValue}\n                  onInput={this.handleStartInput}\n                  onFocus={this.handleFocus}\n                  data-scope=\"date-range\"\n                />\n\n                <svg\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  width=\"24\"\n                  height=\"24\"\n                  viewBox=\"0 0 24 24\"\n                  fill=\"none\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                  class=\"icon icon-tabler icons-tabler-outline icon-tabler-arrows-move-horizontal\"\n                >\n                  <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\" />\n                  <path d=\"M18 9l3 3l-3 3\" />\n                  <path d=\"M15 12h6\" />\n                  <path d=\"M6 9l-3 3l3 3\" />\n                  <path d=\"M3 12h6\" />\n                </svg>\n\n                <input\n                  id={this.endInputId}\n                  type=\"text\"\n                  placeholder={this.endPlaceholder}\n                  name={this.endName}\n                  disabled={this.disabled}\n                  readOnly={this.readonly}\n                  required={this.required}\n                  value={this.endValue}\n                  onInput={this.handleEndInput}\n                  onFocus={this.handleFocus}\n                  data-scope=\"date-range\"\n                />\n              </div>\n\n              {this.error && (\n                <nv-icon name=\"alert-circle\" class=\"validation\" size=\"md\" />\n              )}\n              {this.success && (\n                <nv-icon name=\"circle-check\" class=\"validation\" size=\"md\" />\n              )}\n\n              <nv-iconbutton\n                class=\"toggle-calendar-icon\"\n                name=\"calendar\"\n                size=\"md\"\n                emphasis=\"lower\"\n                aria-label={this.open ? 'Hide calendar' : 'Show calendar'}\n                aria-pressed={this.open.toString()}\n                onClick={this.toggleCalendar}\n                tabIndex={this.disabled ? -1 : 0}\n              />\n            </div>\n\n            <slot name=\"after-input\"></slot>\n          </div>\n\n          <div slot=\"content\">\n            <nv-calendar\n              ref={el => (this.calendarElement = el as HTMLNvCalendarElement)}\n              dateFormat={this.dateFormat}\n              rangeValue={this.calendarState}\n              firstDayOfWeek={this.firstDayOfWeek}\n              numberOfCalendars={this.numberOfCalendars}\n              min={this.min}\n              max={this.max}\n              locale={this.locale}\n              shortcutsPlacement={this.shortcutsPlacement}\n              showActions={this.showActions}\n              shortcuts={this.shortcuts}\n              showWeekNumbers={this.showWeekNumbers}\n              disabledDates={this.disabledDates}\n              selectionType=\"range\"\n              data-prevent-navigation=\"true\"\n            ></nv-calendar>\n          </div>\n        </nv-popover>\n\n        {((this.description && this.description.length > 0) ||\n          this.el.querySelector('[slot=\"description\"]')) && (\n          <div class=\"description\">\n            <slot name=\"description\">{this.description}</slot>\n          </div>\n        )}\n\n        {(this.errorDescription ||\n          this.el.querySelector('[slot=\"error-description\"]')) && (\n          <div hidden={!this.error} class=\"error-description\">\n            {this.el.querySelector('[slot=\"error-description\"]') ? (\n              <slot name=\"error-description\"></slot>\n            ) : (\n              this.errorDescription\n            )}\n          </div>\n        )}\n\n        <slot></slot>\n      </Host>\n    );\n  }\n  //#endregion RENDER\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/native/p-fb897f7d.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as r,h as t,a,g as o}from"./p-711a7778.js";import{c as i}from"./p-8a1a6e56.js";import{v as n}from"./p-f5ff676c.js";const l='nv-fieldtextarea{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box;max-width:480px}nv-fieldtextarea[fluid]:not([fluid=false]){max-width:unset}nv-fieldtextarea[readonly]:not([readonly=false]){--nv-field-border-default:var(--components-form-field-border-readonly);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-background:var(--components-form-field-background-readonly)}nv-fieldtextarea[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive-in-field)}nv-fieldtextarea[success]:not([success=false]){--nv-field-border-default:var(--components-form-field-border-success);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-success)}nv-fieldtextarea[required]:not([required=false]) label::after{content:"*";color:var(--components-form-text-required);font-weight:700}nv-fieldtextarea label{display:flex;align-items:center;gap:var(--form-label-gap);align-self:stretch;color:var(--components-form-text-label-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-label-font-size);font-style:normal;font-weight:500;line-height:var(--form-label-line-height)}nv-fieldtextarea .textarea-wrapper{display:flex;flex-wrap:wrap;gap:var(--form-gap-x);align-items:stretch;align-self:stretch}nv-fieldtextarea .textarea-wrapper .textarea-container{display:flex;flex-grow:1;padding:calc(var(--form-field-padding-y) - 1px) var(--form-field-padding-x);justify-content:center;align-items:center;gap:var(--form-field-gap);align-self:stretch;border-radius:var(--form-field-radius);border-width:1px;border-style:solid;border-color:var(--nv-field-border-default);opacity:var(--components-form-opacity-default);background:var(--nv-field-background);transition:all 150ms ease-out}nv-fieldtextarea .textarea-wrapper .textarea-container:hover{border-color:var(--nv-field-border-hover)}nv-fieldtextarea .textarea-wrapper .textarea-container:focus-within{border-color:var(--nv-field-border-focus);box-shadow:0 0 0 var(--focus-field-stroke) var(--nv-field-focus-box-shadow)}nv-fieldtextarea .textarea-wrapper .textarea-container:has(textarea:read-only){opacity:0.5;background-color:var(--components-form-field-background-readonly);border-color:var(--nv-field-border-readonly)}nv-fieldtextarea .textarea-wrapper .textarea-container:has(textarea:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fieldtextarea .textarea-wrapper .textarea-container textarea{display:flex;align-items:center;flex:1 0 0;overflow:hidden;background-color:transparent;color:var(--components-form-field-content-text);text-overflow:ellipsis;font-size:var(--form-field-font-size);font-style:normal;font-weight:500;line-height:var(--form-field-line-height)}nv-fieldtextarea .textarea-wrapper .textarea-container textarea::-webkit-scrollbar{width:6px;height:6px}nv-fieldtextarea .textarea-wrapper .textarea-container textarea::-webkit-scrollbar-track{background-color:var(--color-level-10-background);border-radius:9999px}nv-fieldtextarea .textarea-wrapper .textarea-container textarea::-webkit-scrollbar-thumb{background-color:var(--color-gray-200);border-radius:9999px}nv-fieldtextarea .textarea-wrapper .textarea-container textarea:focus{outline:none}nv-fieldtextarea .textarea-wrapper .textarea-container textarea::placeholder{overflow:hidden;color:var(--components-form-field-content-placeholder);text-overflow:ellipsis;font-family:"TT Norms Pro", sans-serif;font-size:var(--form-field-font-size);font-style:normal;font-weight:400;line-height:var(--form-field-line-height)}nv-fieldtextarea .textarea-wrapper .textarea-container nv-icon.validation{color:var(--nv-field-border-default)}nv-fieldtextarea .description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fieldtextarea .error-description{display:flex;align-items:center;align-self:stretch;gap:var(--spacing-1);color:var(--components-form-text-description-default);font-family:"TT Norms Pro", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}';const d=l;const s=class{constructor(t){e(this,t);this.valueChanged=r(this,"valueChanged",7);this.inputId=n();this.disabled=false;this.readonly=false;this.required=false;this.error=false;this.success=false;this.rows=3;this.resize="vertical";this.autosize=false;this.autofocus=false;this.fluid=false;this.handleTextarea=e=>{const r=e.target;this.value=r.value;this.valueChanged.emit(r.value)};this.handleTextareaContainerClick=()=>{this.textareaElement.focus()}}rowsChanged(){if(this.autosize){this.adjustTextareaHeight()}}autosizeChanged(){var e;if(this.autosize){this.adjustTextareaHeight()}else{(e=this.textareaElement)===null||e===void 0?void 0:e.style.removeProperty("height")}}handleValueChange(){if(this.autosize){this.adjustTextareaHeight()}}adjustTextareaHeight(){if(this.textareaElement&&this.autosize){requestAnimationFrame((()=>{requestAnimationFrame((()=>{this.textareaElement.style.height="auto";const e=window.getComputedStyle(this.textareaElement);const r=parseFloat(e.lineHeight);const t=parseFloat(e.paddingTop);const a=parseFloat(e.paddingBottom);const o=parseFloat(e.borderTopWidth);const i=parseFloat(e.borderBottomWidth);const n=r*this.rows+t+a+o+i;this.textareaElement.style.minHeight=`${n}px`;this.textareaElement.style.height=this.textareaElement.scrollHeight+"px"}))}))}}componentWillRender(){if(this.message){this.description=this.message}if(this.validation){this.errorDescription=this.validation;this.error=true}}componentDidLoad(){if(this.autosize){this.adjustTextareaHeight()}}render(){return t(a,{key:"405a8423bb391cc8c1e32d8d64ab587c71b355d1"},(this.label||this.el.querySelector('[slot="label"]'))&&t("label",{key:"dc5a90e0f9cde1946966cb5b2ad98050c6740869",htmlFor:this.inputId},t("slot",{key:"a2c78f23289fcdb742000fa949b98359441268dc",name:"label"},this.label)),t("div",{key:"be9840925f442ad964597e77d7c6b9b29b5bae0f",class:"textarea-wrapper"},t("div",{key:"11b986940cfff801c6599f03850b1fc8c5cf2800",class:"textarea-container",onClick:this.handleTextareaContainerClick},t("textarea",{key:"b4d7bbec6ed6d38545935eef997fbc73499bdc15",id:this.inputId,ref:e=>this.textareaElement=e,placeholder:this.placeholder,autofocus:this.autofocus,name:this.name,disabled:this.disabled,readOnly:this.readonly,required:this.required,maxlength:this.maxlength,minlength:this.minlength,autocomplete:"off",value:this.value,onInput:this.handleTextarea,rows:this.rows,class:i(this.resize==="none"&&"resize-none",this.resize==="vertical"&&"resize-y",this.resize==="horizontal"&&"resize-x",this.resize==="both"&&"resize")}))),(this.description||this.el.querySelector('[slot="description"]'))&&t("div",{key:"fc2b00df7fccc60ee9ff1f04cd81e059839b29c0",class:"description"},t("slot",{key:"9cfaf267dfec3412a5a09ee8fe64b244fda69c7b",name:"description"},this.description)),(this.errorDescription||this.el.querySelector('[slot="error-description"]'))&&t("div",{key:"a56439ef49efeffe303d13f56a0b00f648a7979d",hidden:!this.error,class:"error-description"},t("slot",{key:"5337f43770894cf6898fcbdc3b77f8a337061597",name:"error-description"},this.errorDescription)))}static get formAssociated(){return true}get el(){return o(this)}static get watchers(){return{rows:["rowsChanged"],autosize:["autosizeChanged"],value:["handleValueChange"]}}};s.style=d;export{s as nv_fieldtextarea};
+//# sourceMappingURL=p-fb897f7d.entry.js.map

package/dist/native/{p-fc97f071.entry.js.map → p-fb897f7d.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["nvFieldtextareaCss","NvFieldtextareaStyle0","NvFieldtextarea","constructor","hostRef","this","inputId","uuidv4","disabled","readonly","required","error","success","rows","resize","autosize","autofocus","fluid","handleTextarea","event","textarea","target","value","valueChanged","emit","handleTextareaContainerClick","textareaElement","focus","rowsChanged","adjustTextareaHeight","autosizeChanged","_a","style","removeProperty","handleValueChange","requestAnimationFrame","height","computedStyle","window","getComputedStyle","lineHeight","parseFloat","paddingTop","paddingBottom","borderTopWidth","borderBottomWidth","minHeight","scrollHeight","componentWillRender","message","description","validation","errorDescription","componentDidLoad","render","h","Host","key","label","el","querySelector","htmlFor","name","class","onClick","id","ref","e","placeholder","readOnly","maxlength","minlength","autocomplete","onInput","clsx","hidden"],"sources":["src/components/nv-fieldtextarea/nv-fieldtextarea.scss?tag=nv-fieldtextarea","src/components/nv-fieldtextarea/nv-fieldtextarea.tsx"],"sourcesContent":["@import \"../../styles/form-field\";\n@import \"../../styles/scrollbar\";\n\n@mixin form-field-textarea-wrapper() {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--form-gap-x);\n  align-items: stretch;\n  align-self: stretch;\n}\n\n@mixin form-field-textarea-container() {\n  display: flex;\n  flex-grow: 1;\n  padding: calc(var(--form-field-padding-y) - 1px) var(--form-field-padding-x);\n  justify-content: center;\n  align-items: center;\n  gap: var(--form-field-gap);\n  align-self: stretch;\n  border-radius: var(--form-field-radius);\n  border-width: 1px;\n  border-style: solid;\n  border-color: var(--nv-field-border-default);\n  opacity: var(--components-form-opacity-default);\n  background: var(--nv-field-background);\n  transition: all 150ms ease-out;\n\n  &:hover {\n    border-color: var(--nv-field-border-hover);\n  }\n\n  &:focus-within {\n    border-color: var(--nv-field-border-focus);\n    box-shadow: 0 0 0 var(--focus-field-stroke) var(--nv-field-focus-box-shadow);\n  }\n  // Keep  ReadOnly before Disabled\n  &:has(textarea:read-only) {\n    // opacity: var(--components-form-opacity-readonly, 0.5); broken token generation, is 50px instead of 0.5\n    opacity: 0.5;\n    background-color: var(--components-form-field-background-readonly);\n    border-color: var(--nv-field-border-readonly);\n  }\n\n  &:has(textarea:disabled) {\n    // opacity: var(--components-form-opacity-disabled, 0.5); broken token generation, is 50px instead of 0.5\n    opacity: 0.5;\n    background-color: var(--components-form-field-background-disabled);\n    border-color: var(--nv-field-border-disabled);\n  }\n}\n\n@mixin form-field-textarea() {\n  @include scrollbar();\n  display: flex;\n  align-items: center;\n  flex: 1 0 0;\n  overflow: hidden;\n  background-color: transparent;\n  color: var(--components-form-field-content-text);\n  text-overflow: ellipsis;\n  font-size: var(--form-field-font-size);\n  font-style: normal;\n  font-weight: 500;\n  line-height: var(--form-field-line-height);\n\n  &:focus {\n    outline: none;\n  }\n\n  &::placeholder {\n    overflow: hidden;\n    color: var(--components-form-field-content-placeholder);\n    text-overflow: ellipsis;\n    font-family: \"TT Norms Pro\", sans-serif;\n    font-size: var(--form-field-font-size);\n    font-style: normal;\n    font-weight: 400;\n    line-height: var(--form-field-line-height);\n  }\n}\n\nnv-fieldtextarea {\n  @include form-field-variables();\n  @include form-field-root();\n\n  &[fluid]:not([fluid=\"false\"]) {\n    @include form-field-fluid();\n  }\n\n  &[readonly]:not([readonly=\"false\"]) {\n    @include form-field-readonly-variables();\n  }\n\n  &[error]:not([error=\"false\"]) {\n    @include form-field-error-variables();\n  }\n\n  &[success]:not([success=\"false\"]) {\n    @include form-field-success-variables();\n  }\n\n  &[required]:not([required=\"false\"]) label {\n    @include form-field-label-required();\n  }\n\n  label {\n    @include form-field-label();\n  }\n\n  .textarea-wrapper {\n    @include form-field-textarea-wrapper();\n\n    .textarea-container {\n      @include form-field-textarea-container();\n\n      textarea {\n        @include form-field-textarea();\n      }\n\n      nv-icon.validation {\n        @include form-field-icon();\n      }\n    }\n  }\n\n  .description {\n    @include form-field-description();\n  }\n\n  .error-description {\n    @include form-field-error-description();\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Element,\n  Watch,\n} from '@stencil/core';\nimport { v4 as uuidv4 } from 'uuid';\nimport clsx from 'clsx';\n\n/**\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 * @slot error-description - Content to be placed as the error description, will override the errorDescription prop.\n */\n@Component({\n  tag: 'nv-fieldtextarea',\n  shadow: false,\n  formAssociated: true,\n  styleUrl: 'nv-fieldtextarea.scss',\n})\nexport class NvFieldtextarea {\n  @Element() el: HTMLNvFieldtextareaElement;\n  private textareaElement!: HTMLTextAreaElement;\n\n  /****************************************************************************/\n  //#region DEPRECATED\n\n  /**\n   * Message defines a 'hint ' message for the Text Field.\n   * @deprecated Use `description` instead.\n   */\n  @Prop({ reflect: true })\n  readonly message: string;\n\n  /**\n   * Add the message to the validation state.\n   * @deprecated Use `errorDescription` and set the error prop instead.\n   */\n  @Prop({ reflect: true })\n  readonly validation: string;\n\n  //#endregion DEPRECATED\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Sets the ID for the input element and the for attribute of the associated\n   * label. If no ID is provided, a random one will be automatically generated\n   * to ensure unique identification, facilitating proper label association and\n   * accessibility.\n   */\n  @Prop({ reflect: true })\n  readonly inputId: string = uuidv4();\n\n  /**\n   * Lets you define the text that explains what users should enter in the text\n   * textarea field. It’s a crucial element for making forms clear and\n   * user-friendly.\n   */\n  @Prop({ reflect: true })\n  readonly label: string;\n\n  /**\n   * Add helpful hints or extra information under the text textarea field. This is\n   * where you can clarify what users should enter or provide additional\n   * instructions, making the form easier to fill out correctly.\n   */\n  @Prop({ reflect: true, mutable: true })\n  description: string;\n\n  /**\n   * Display temporary text inside the textarea field to give users a hint about\n   * what to type. It’s a great way to provide examples or suggestions directly\n   * in the field before they start typing.\n   */\n  @Prop({ reflect: true })\n  readonly placeholder: string;\n\n  /**\n   * Defines the name attribute of the textarea field, which is crucial for form\n   * submission. This value is used as the key in the key-value pair sent to\n   * the server, representing the textarea’s data in form submissions. It should be\n   * unique within the form to avoid conflicts\n   */\n  @Prop({ reflect: true })\n  readonly name: string;\n\n  /**\n   * Specifies the value of the textarea field, which determines the text displayed\n   * within the field. This prop is typically used in controlled components\n   * where the textarea’s value is managed by the component’s state.\n   */\n  @Prop({ reflect: true, mutable: true })\n  value: string;\n\n  /**\n   * The disabled prop lets you turn off the textarea field so that users can’t\n   * type in it. When disabled, the field is grayed out and won’t respond to#\n   * clicks or touches.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Display the textarea field’s content without allowing users to change it.\n   * Users can still click on it, select, and copy the text, but they won’t be\n   * able to type or delete anything.\n   */\n  @Prop({ reflect: true })\n  readonly readonly: boolean = false;\n\n  /**\n   * Marks the textarea field as required, ensuring that the user must fill it out\n   * before submitting the form.\n   */\n  @Prop({ reflect: true })\n  readonly required: boolean = false;\n\n  /**\n   * Alters the textarea field’s appearance to indicate an error, helping users\n   * identify fields that need correction.\n   * @validator error\n   */\n  @Prop({ reflect: true, mutable: true })\n  error: boolean = false;\n\n  /**\n   * Show a helpful message under the textarea field when there’s a problem. It\n   * explains what’s wrong and how users can fix it, making the error easier to\n   * understand and resolve.\n   * @validator message\n   */\n  @Prop({ reflect: true, mutable: true })\n  errorDescription: string;\n\n  /**\n   * Changes the textarea field’s appearance to indicate successful textarea or\n   * validation.\n   */\n  @Prop({ reflect: true })\n  readonly success: boolean = false;\n\n  /**\n   * Limits how many characters users can type into the textarea field. It’s\n   * helpful for making sure users don’t enter too much information, keeping\n   * their textarea within the allowed limit.\n   */\n  @Prop({ reflect: true })\n  readonly maxlength: number;\n\n  /**\n   * Ensures that users type at least a certain number of characters into the\n   * textarea field. It’s a way to make sure users provide enough information\n   * before moving on.\n   */\n  @Prop({ reflect: true })\n  readonly minlength: number;\n\n  /**\n   * The number of visible text lines for the control. The default is 3. This\n   * can be useful when you want to limit the size of the textarea field or when\n   * you want to make the textarea field smaller to fit a specific layout. The\n   * textarea field will expand vertically to fit the text as the user types.\n   */\n  @Prop({ reflect: true })\n  readonly rows: number = 3;\n\n  /**\n   * Controls the resize property of a textarea. It can be set to none, both,\n   * horizontal, or vertical. The default is vertical.\n   */\n  @Prop({ reflect: true })\n  readonly resize: 'none' | 'both' | 'horizontal' | 'vertical' = 'vertical';\n\n  /**\n   * Enable this to make the textarea automatically resize as the user types,\n   * adjusting the height to fit the content. For the best experience, avoid\n   * vertical resizing, as it’s controlled by this feature. Horizontal resizing\n   * can still be allowed if desired.\n   */\n  @Prop({ reflect: true })\n  readonly autosize: boolean = false;\n\n  /**\n   * Applies focus to the input field as soon as the component is mounted. This\n   * is equivalent to setting the native autofocus attribute on a <textarea>\n   * element.\n   */\n  @Prop({ reflect: true })\n  // eslint-disable-next-line @stencil-community/reserved-member-names\n  readonly autofocus: boolean = false;\n\n  /**\n   * Allows the field to stretch and fill the entire width of its container.\n   */\n  @Prop({ reflect: true })\n  readonly fluid: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emitted when the textarea value changes.\n   * @bind value\n   */\n  @Event()\n  valueChanged: EventEmitter<string>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  /**\n   * If autosize is true, we need to make sure to update the min-height when\n   * the rows change.\n   */\n  @Watch('rows')\n  rowsChanged() {\n    if (this.autosize) {\n      this.adjustTextareaHeight();\n    }\n  }\n\n  /**\n   * If autosize is true, we need to make sure to update the height and\n   * min-height, if false, we need to remove the height property.\n   */\n  @Watch('autosize')\n  autosizeChanged() {\n    if (this.autosize) {\n      this.adjustTextareaHeight();\n    } else {\n      this.textareaElement?.style.removeProperty('height');\n    }\n  }\n\n  /**\n   * Make sure to adjust the height of the textarea when the value changes\n   * programmatically or by typing when autosize is on.\n   */\n  @Watch('value')\n  handleValueChange() {\n    if (this.autosize) {\n      this.adjustTextareaHeight();\n    }\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region METHODS\n\n  private handleTextarea = (event: Event) => {\n    const textarea = event.target as HTMLTextAreaElement;\n    this.value = textarea.value;\n    this.valueChanged.emit(textarea.value);\n  };\n\n  private handleTextareaContainerClick = () => {\n    this.textareaElement.focus();\n  };\n\n  private adjustTextareaHeight() {\n    if (this.textareaElement && this.autosize) {\n      /**\n       * The first requestAnimationFrame ensures that the DOM has applied any\n       * pending changes (e.g., value updates or attribute changes) before\n       * proceeding to the next frame.\n       */\n      requestAnimationFrame(() => {\n        /**\n         * The second requestAnimationFrame ensures that the browser has fully\n         * recalculated layout and styles based on the updated DOM, such as\n         * recalculating scrollHeight for the textarea after the new value is\n         * rendered.\n         */\n        requestAnimationFrame(() => {\n          this.textareaElement.style.height = 'auto';\n\n          const computedStyle = window.getComputedStyle(this.textareaElement);\n          const lineHeight = parseFloat(computedStyle.lineHeight);\n          const paddingTop = parseFloat(computedStyle.paddingTop);\n          const paddingBottom = parseFloat(computedStyle.paddingBottom);\n          const borderTopWidth = parseFloat(computedStyle.borderTopWidth);\n          const borderBottomWidth = parseFloat(computedStyle.borderBottomWidth);\n\n          // Calculate min-height based on rows\n          const minHeight =\n            lineHeight * this.rows +\n            paddingTop +\n            paddingBottom +\n            borderTopWidth +\n            borderBottomWidth;\n\n          this.textareaElement.style.minHeight = `${minHeight}px`;\n          this.textareaElement.style.height =\n            this.textareaElement.scrollHeight + 'px';\n        });\n      });\n    }\n  }\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillRender() {\n    if (this.message) {\n      this.description = this.message;\n    }\n\n    if (this.validation) {\n      this.errorDescription = this.validation;\n      this.error = true;\n    }\n  }\n\n  componentDidLoad() {\n    if (this.autosize) {\n      this.adjustTextareaHeight();\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        {(this.label || this.el.querySelector('[slot=\"label\"]')) && (\n          <label htmlFor={this.inputId}>\n            <slot name=\"label\">{this.label}</slot>\n          </label>\n        )}\n\n        <div class=\"textarea-wrapper\">\n          <div\n            class=\"textarea-container\"\n            onClick={this.handleTextareaContainerClick}\n          >\n            <textarea\n              id={this.inputId}\n              ref={e => (this.textareaElement = e)}\n              placeholder={this.placeholder}\n              autofocus={this.autofocus}\n              name={this.name}\n              disabled={this.disabled}\n              readOnly={this.readonly}\n              required={this.required}\n              maxlength={this.maxlength}\n              minlength={this.minlength}\n              autocomplete=\"off\"\n              value={this.value}\n              onInput={this.handleTextarea}\n              rows={this.rows}\n              class={clsx(\n                this.resize === 'none' && 'resize-none',\n                this.resize === 'vertical' && 'resize-y',\n                this.resize === 'horizontal' && 'resize-x',\n                this.resize === 'both' && 'resize',\n              )}\n            />\n          </div>\n        </div>\n\n        {(this.description ||\n          this.el.querySelector('[slot=\"description\"]')) && (\n          <div class=\"description\">\n            <slot name=\"description\">{this.description}</slot>\n          </div>\n        )}\n\n        {(this.errorDescription ||\n          this.el.querySelector('[slot=\"error-description\"]')) && (\n          <div hidden={!this.error} class=\"error-description\">\n            <slot name=\"error-description\">{this.errorDescription}</slot>\n          </div>\n        )}\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["nvFieldtextareaCss","NvFieldtextareaStyle0","NvFieldtextarea","constructor","hostRef","this","inputId","uuidv4","disabled","readonly","required","error","success","rows","resize","autosize","autofocus","fluid","handleTextarea","event","textarea","target","value","valueChanged","emit","handleTextareaContainerClick","textareaElement","focus","rowsChanged","adjustTextareaHeight","autosizeChanged","_a","style","removeProperty","handleValueChange","requestAnimationFrame","height","computedStyle","window","getComputedStyle","lineHeight","parseFloat","paddingTop","paddingBottom","borderTopWidth","borderBottomWidth","minHeight","scrollHeight","componentWillRender","message","description","validation","errorDescription","componentDidLoad","render","h","Host","key","label","el","querySelector","htmlFor","name","class","onClick","id","ref","e","placeholder","readOnly","maxlength","minlength","autocomplete","onInput","clsx","hidden"],"sources":["src/components/nv-fieldtextarea/nv-fieldtextarea.scss?tag=nv-fieldtextarea","src/components/nv-fieldtextarea/nv-fieldtextarea.tsx"],"sourcesContent":["@import \"../../styles/form-field\";\n@import \"../../styles/scrollbar\";\n\n@mixin form-field-textarea-wrapper() {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--form-gap-x);\n  align-items: stretch;\n  align-self: stretch;\n}\n\n@mixin form-field-textarea-container() {\n  display: flex;\n  flex-grow: 1;\n  padding: calc(var(--form-field-padding-y) - 1px) var(--form-field-padding-x);\n  justify-content: center;\n  align-items: center;\n  gap: var(--form-field-gap);\n  align-self: stretch;\n  border-radius: var(--form-field-radius);\n  border-width: 1px;\n  border-style: solid;\n  border-color: var(--nv-field-border-default);\n  opacity: var(--components-form-opacity-default);\n  background: var(--nv-field-background);\n  transition: all 150ms ease-out;\n\n  &:hover {\n    border-color: var(--nv-field-border-hover);\n  }\n\n  &:focus-within {\n    border-color: var(--nv-field-border-focus);\n    box-shadow: 0 0 0 var(--focus-field-stroke) var(--nv-field-focus-box-shadow);\n  }\n  // Keep  ReadOnly before Disabled\n  &:has(textarea:read-only) {\n    // opacity: var(--components-form-opacity-readonly, 0.5); broken token generation, is 50px instead of 0.5\n    opacity: 0.5;\n    background-color: var(--components-form-field-background-readonly);\n    border-color: var(--nv-field-border-readonly);\n  }\n\n  &:has(textarea:disabled) {\n    // opacity: var(--components-form-opacity-disabled, 0.5); broken token generation, is 50px instead of 0.5\n    opacity: 0.5;\n    background-color: var(--components-form-field-background-disabled);\n    border-color: var(--nv-field-border-disabled);\n  }\n}\n\n@mixin form-field-textarea() {\n  @include scrollbar();\n  display: flex;\n  align-items: center;\n  flex: 1 0 0;\n  overflow: hidden;\n  background-color: transparent;\n  color: var(--components-form-field-content-text);\n  text-overflow: ellipsis;\n  font-size: var(--form-field-font-size);\n  font-style: normal;\n  font-weight: 500;\n  line-height: var(--form-field-line-height);\n\n  &:focus {\n    outline: none;\n  }\n\n  &::placeholder {\n    overflow: hidden;\n    color: var(--components-form-field-content-placeholder);\n    text-overflow: ellipsis;\n    font-family: \"TT Norms Pro\", sans-serif;\n    font-size: var(--form-field-font-size);\n    font-style: normal;\n    font-weight: 400;\n    line-height: var(--form-field-line-height);\n  }\n}\n\nnv-fieldtextarea {\n  @include form-field-variables();\n  @include form-field-root();\n\n  &[fluid]:not([fluid=\"false\"]) {\n    @include form-field-fluid();\n  }\n\n  &[readonly]:not([readonly=\"false\"]) {\n    @include form-field-readonly-variables();\n  }\n\n  &[error]:not([error=\"false\"]) {\n    @include form-field-error-variables();\n  }\n\n  &[success]:not([success=\"false\"]) {\n    @include form-field-success-variables();\n  }\n\n  &[required]:not([required=\"false\"]) label {\n    @include form-field-label-required();\n  }\n\n  label {\n    @include form-field-label();\n  }\n\n  .textarea-wrapper {\n    @include form-field-textarea-wrapper();\n\n    .textarea-container {\n      @include form-field-textarea-container();\n\n      textarea {\n        @include form-field-textarea();\n      }\n\n      nv-icon.validation {\n        @include form-field-icon();\n      }\n    }\n  }\n\n  .description {\n    @include form-field-description();\n  }\n\n  .error-description {\n    @include form-field-error-description();\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Element,\n  Watch,\n} from '@stencil/core';\nimport { v4 as uuidv4 } from 'uuid';\nimport clsx from 'clsx';\n\n/**\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 * @slot error-description - Content to be placed as the error description, will override the errorDescription prop.\n */\n@Component({\n  tag: 'nv-fieldtextarea',\n  shadow: false,\n  formAssociated: true,\n  styleUrl: 'nv-fieldtextarea.scss',\n})\nexport class NvFieldtextarea {\n  @Element() el: HTMLNvFieldtextareaElement;\n  private textareaElement!: HTMLTextAreaElement;\n\n  /****************************************************************************/\n  //#region DEPRECATED\n\n  /**\n   * Message defines a 'hint ' message for the Text Field.\n   * @deprecated Use `description` instead.\n   */\n  @Prop({ reflect: true })\n  readonly message: string;\n\n  /**\n   * Add the message to the validation state.\n   * @deprecated Use `errorDescription` and set the error prop instead.\n   */\n  @Prop({ reflect: true })\n  readonly validation: string;\n\n  //#endregion DEPRECATED\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Sets the ID for the input element and the for attribute of the associated\n   * label. If no ID is provided, a random one will be automatically generated\n   * to ensure unique identification, facilitating proper label association and\n   * accessibility.\n   */\n  @Prop({ reflect: true })\n  readonly inputId: string = uuidv4();\n\n  /**\n   * Lets you define the text that explains what users should enter in the text\n   * textarea field. It’s a crucial element for making forms clear and\n   * user-friendly.\n   */\n  @Prop({ reflect: true })\n  readonly label: string;\n\n  /**\n   * Add helpful hints or extra information under the text textarea field. This is\n   * where you can clarify what users should enter or provide additional\n   * instructions, making the form easier to fill out correctly.\n   */\n  @Prop({ reflect: true, mutable: true })\n  description: string;\n\n  /**\n   * Display temporary text inside the textarea field to give users a hint about\n   * what to type. It’s a great way to provide examples or suggestions directly\n   * in the field before they start typing.\n   */\n  @Prop({ reflect: true })\n  readonly placeholder: string;\n\n  /**\n   * Defines the name attribute of the textarea field, which is crucial for form\n   * submission. This value is used as the key in the key-value pair sent to\n   * the server, representing the textarea’s data in form submissions. It should be\n   * unique within the form to avoid conflicts\n   */\n  @Prop({ reflect: true })\n  readonly name: string;\n\n  /**\n   * Specifies the value of the textarea field, which determines the text displayed\n   * within the field. This prop is typically used in controlled components\n   * where the textarea’s value is managed by the component’s state.\n   */\n  @Prop({ reflect: true, mutable: true })\n  value: string;\n\n  /**\n   * The disabled prop lets you turn off the textarea field so that users can’t\n   * type in it. When disabled, the field is grayed out and won’t respond to#\n   * clicks or touches.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Display the textarea field’s content without allowing users to change it.\n   * Users can still click on it, select, and copy the text, but they won’t be\n   * able to type or delete anything.\n   */\n  @Prop({ reflect: true })\n  readonly readonly: boolean = false;\n\n  /**\n   * Marks the textarea field as required, ensuring that the user must fill it out\n   * before submitting the form.\n   */\n  @Prop({ reflect: true })\n  readonly required: boolean = false;\n\n  /**\n   * Alters the textarea field’s appearance to indicate an error, helping users\n   * identify fields that need correction.\n   * @validator error\n   */\n  @Prop({ reflect: true, mutable: true })\n  error: boolean = false;\n\n  /**\n   * Show a helpful message under the textarea field when there’s a problem. It\n   * explains what’s wrong and how users can fix it, making the error easier to\n   * understand and resolve.\n   * @validator message\n   */\n  @Prop({ reflect: true, mutable: true })\n  errorDescription: string;\n\n  /**\n   * Changes the textarea field’s appearance to indicate successful textarea or\n   * validation.\n   */\n  @Prop({ reflect: true })\n  readonly success: boolean = false;\n\n  /**\n   * Limits how many characters users can type into the textarea field. It’s\n   * helpful for making sure users don’t enter too much information, keeping\n   * their textarea within the allowed limit.\n   */\n  @Prop({ reflect: true })\n  readonly maxlength: number;\n\n  /**\n   * Ensures that users type at least a certain number of characters into the\n   * textarea field. It’s a way to make sure users provide enough information\n   * before moving on.\n   */\n  @Prop({ reflect: true })\n  readonly minlength: number;\n\n  /**\n   * The number of visible text lines for the control. The default is 3. This\n   * can be useful when you want to limit the size of the textarea field or when\n   * you want to make the textarea field smaller to fit a specific layout. The\n   * textarea field will expand vertically to fit the text as the user types.\n   */\n  @Prop({ reflect: true })\n  readonly rows: number = 3;\n\n  /**\n   * Controls the resize property of a textarea. It can be set to none, both,\n   * horizontal, or vertical. The default is vertical.\n   */\n  @Prop({ reflect: true })\n  readonly resize: 'none' | 'both' | 'horizontal' | 'vertical' = 'vertical';\n\n  /**\n   * Enable this to make the textarea automatically resize as the user types,\n   * adjusting the height to fit the content. For the best experience, avoid\n   * vertical resizing, as it’s controlled by this feature. Horizontal resizing\n   * can still be allowed if desired.\n   */\n  @Prop({ reflect: true })\n  readonly autosize: boolean = false;\n\n  /**\n   * Applies focus to the input field as soon as the component is mounted. This\n   * is equivalent to setting the native autofocus attribute on a <textarea>\n   * element.\n   */\n  @Prop({ reflect: true })\n  // eslint-disable-next-line @stencil-community/reserved-member-names\n  readonly autofocus: boolean = false;\n\n  /**\n   * Allows the field to stretch and fill the entire width of its container.\n   */\n  @Prop({ reflect: true })\n  readonly fluid: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emitted when the textarea value changes.\n   * @bind value\n   */\n  @Event()\n  valueChanged: EventEmitter<string>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  /**\n   * If autosize is true, we need to make sure to update the min-height when\n   * the rows change.\n   */\n  @Watch('rows')\n  rowsChanged() {\n    if (this.autosize) {\n      this.adjustTextareaHeight();\n    }\n  }\n\n  /**\n   * If autosize is true, we need to make sure to update the height and\n   * min-height, if false, we need to remove the height property.\n   */\n  @Watch('autosize')\n  autosizeChanged() {\n    if (this.autosize) {\n      this.adjustTextareaHeight();\n    } else {\n      this.textareaElement?.style.removeProperty('height');\n    }\n  }\n\n  /**\n   * Make sure to adjust the height of the textarea when the value changes\n   * programmatically or by typing when autosize is on.\n   */\n  @Watch('value')\n  handleValueChange() {\n    if (this.autosize) {\n      this.adjustTextareaHeight();\n    }\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region METHODS\n\n  private handleTextarea = (event: Event) => {\n    const textarea = event.target as HTMLTextAreaElement;\n    this.value = textarea.value;\n    this.valueChanged.emit(textarea.value);\n  };\n\n  private handleTextareaContainerClick = () => {\n    this.textareaElement.focus();\n  };\n\n  private adjustTextareaHeight() {\n    if (this.textareaElement && this.autosize) {\n      /**\n       * The first requestAnimationFrame ensures that the DOM has applied any\n       * pending changes (e.g., value updates or attribute changes) before\n       * proceeding to the next frame.\n       */\n      requestAnimationFrame(() => {\n        /**\n         * The second requestAnimationFrame ensures that the browser has fully\n         * recalculated layout and styles based on the updated DOM, such as\n         * recalculating scrollHeight for the textarea after the new value is\n         * rendered.\n         */\n        requestAnimationFrame(() => {\n          this.textareaElement.style.height = 'auto';\n\n          const computedStyle = window.getComputedStyle(this.textareaElement);\n          const lineHeight = parseFloat(computedStyle.lineHeight);\n          const paddingTop = parseFloat(computedStyle.paddingTop);\n          const paddingBottom = parseFloat(computedStyle.paddingBottom);\n          const borderTopWidth = parseFloat(computedStyle.borderTopWidth);\n          const borderBottomWidth = parseFloat(computedStyle.borderBottomWidth);\n\n          // Calculate min-height based on rows\n          const minHeight =\n            lineHeight * this.rows +\n            paddingTop +\n            paddingBottom +\n            borderTopWidth +\n            borderBottomWidth;\n\n          this.textareaElement.style.minHeight = `${minHeight}px`;\n          this.textareaElement.style.height =\n            this.textareaElement.scrollHeight + 'px';\n        });\n      });\n    }\n  }\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillRender() {\n    if (this.message) {\n      this.description = this.message;\n    }\n\n    if (this.validation) {\n      this.errorDescription = this.validation;\n      this.error = true;\n    }\n  }\n\n  componentDidLoad() {\n    if (this.autosize) {\n      this.adjustTextareaHeight();\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        {(this.label || this.el.querySelector('[slot=\"label\"]')) && (\n          <label htmlFor={this.inputId}>\n            <slot name=\"label\">{this.label}</slot>\n          </label>\n        )}\n\n        <div class=\"textarea-wrapper\">\n          <div\n            class=\"textarea-container\"\n            onClick={this.handleTextareaContainerClick}\n          >\n            <textarea\n              id={this.inputId}\n              ref={e => (this.textareaElement = e)}\n              placeholder={this.placeholder}\n              autofocus={this.autofocus}\n              name={this.name}\n              disabled={this.disabled}\n              readOnly={this.readonly}\n              required={this.required}\n              maxlength={this.maxlength}\n              minlength={this.minlength}\n              autocomplete=\"off\"\n              value={this.value}\n              onInput={this.handleTextarea}\n              rows={this.rows}\n              class={clsx(\n                this.resize === 'none' && 'resize-none',\n                this.resize === 'vertical' && 'resize-y',\n                this.resize === 'horizontal' && 'resize-x',\n                this.resize === 'both' && 'resize',\n              )}\n            />\n          </div>\n        </div>\n\n        {(this.description ||\n          this.el.querySelector('[slot=\"description\"]')) && (\n          <div class=\"description\">\n            <slot name=\"description\">{this.description}</slot>\n          </div>\n        )}\n\n        {(this.errorDescription ||\n          this.el.querySelector('[slot=\"error-description\"]')) && (\n          <div hidden={!this.error} class=\"error-description\">\n            <slot name=\"error-description\">{this.errorDescription}</slot>\n          </div>\n        )}\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/native/{p-244f56ac.entry.js → p-fc3bea07.entry.js}

@@ -1,2 +1,2 @@
-import{r as c,h as l,a}from"./p-ab002252.js";import{c as t}from"./p-8a1a6e56.js";const d="nv-col{display:block;flex:1 1 0%;padding-left:calc(var(--spacing-4) / 2);padding-right:calc(var(--spacing-4) / 2)}nv-col[class*=w-]{flex:none}nv-col.w-1\\/12{width:calc(100% * 1 / 12)}nv-col.w-2\\/12{width:calc(100% * 2 / 12)}nv-col.w-3\\/12{width:calc(100% * 3 / 12)}nv-col.w-4\\/12{width:calc(100% * 4 / 12)}nv-col.w-5\\/12{width:calc(100% * 5 / 12)}nv-col.w-6\\/12{width:calc(100% * 6 / 12)}nv-col.w-7\\/12{width:calc(100% * 7 / 12)}nv-col.w-8\\/12{width:calc(100% * 8 / 12)}nv-col.w-9\\/12{width:calc(100% * 9 / 12)}nv-col.w-10\\/12{width:calc(100% * 10 / 12)}nv-col.w-11\\/12{width:calc(100% * 11 / 12)}nv-col.w-12\\/12{width:calc(100% * 12 / 12)}";const i=d;const n=class{constructor(l){c(this,l)}getColSize(){if(this.size){if(this.size<1||this.size>12)return;return`w-${this.size}/12`}}render(){return l(a,{key:"8f7112dc8ce8896d9e7265741f06b7449dd508df",class:t(this.getColSize())},l("slot",{key:"3bedff11752d04db2615a5f26d4d910d95dee76c"}))}};n.style=i;export{n as nv_col};
-//# sourceMappingURL=p-244f56ac.entry.js.map
+import{r as c,h as l,a}from"./p-711a7778.js";import{c as t}from"./p-8a1a6e56.js";const d="nv-col{display:block;flex:1 1 0%;padding-left:calc(var(--spacing-4) / 2);padding-right:calc(var(--spacing-4) / 2)}nv-col[class*=w-]{flex:none}nv-col.w-1\\/12{width:calc(100% * 1 / 12)}nv-col.w-2\\/12{width:calc(100% * 2 / 12)}nv-col.w-3\\/12{width:calc(100% * 3 / 12)}nv-col.w-4\\/12{width:calc(100% * 4 / 12)}nv-col.w-5\\/12{width:calc(100% * 5 / 12)}nv-col.w-6\\/12{width:calc(100% * 6 / 12)}nv-col.w-7\\/12{width:calc(100% * 7 / 12)}nv-col.w-8\\/12{width:calc(100% * 8 / 12)}nv-col.w-9\\/12{width:calc(100% * 9 / 12)}nv-col.w-10\\/12{width:calc(100% * 10 / 12)}nv-col.w-11\\/12{width:calc(100% * 11 / 12)}nv-col.w-12\\/12{width:calc(100% * 12 / 12)}";const i=d;const n=class{constructor(l){c(this,l)}getColSize(){if(this.size){if(this.size<1||this.size>12)return;return`w-${this.size}/12`}}render(){return l(a,{key:"8f7112dc8ce8896d9e7265741f06b7449dd508df",class:t(this.getColSize())},l("slot",{key:"3bedff11752d04db2615a5f26d4d910d95dee76c"}))}};n.style=i;export{n as nv_col};
+//# sourceMappingURL=p-fc3bea07.entry.js.map

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

@@ -247,14 +247,10 @@ export declare class NvCalendar {
      */
     private applyShortcut;
     /**
-     * Method to force the complete calendar update (and fix the persistent hover problem)
+     * Method to force the complete calendar update
      * @param {Date} newDate - Date to force
      */
     private forceCalendarUpdate;
-    /**
-     * Function to reset the touch effect (Mobile fix)
-     */
-    private clearTouchState;
     /**
      * Handles month change with an offset
      * @param {number} direction - Direction (-1 for previous, 1 for next)

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

@@ -40,20 +40,6 @@ export declare class NvDatagrid {
      * @default []
      */
     readonly columns: Column[];
-    /**
-     * The data to display in the data grid.
-     * It can be passed directly as an array of objects or as a JSON string.
-     * If both `data` and `dataJson` are provided, `data` takes precedence.
-     * @example `[{ "name": "Alice", "age": 25 }, { "name": "Bob", "age": 30 }]`
-     */
-    readonly dataJson?: string;
-    /**
-     * The columns to display in the data grid.
-     * It can be passed directly as an array of objects or as a JSON string.
-     * If both `columns` and `columnsJson` are provided, `columns` takes precedence.
-     * @example `[{"header":"Name","accessor":"name"},{"header":"Age","accessor":"age"},{"header":"Email","accessor":"email"}]`
-     */
-    readonly columnsJson?: string;
     /**
      * Fallback value to be displayed when data is not available
      * @default 'N/A'
@@ -173,9 +159,7 @@ export declare class NvDatagrid {
     private getPagination;
     /****************************************************************************/
     parseColumns(newValue: Column[], oldValue?: Column[]): void;
-    parseJsonColumns(newValue: string | undefined, oldValue: Column[]): void;
     parseData(newValue: any[], oldValue?: any[]): void;
-    parseJsonData(newValue: string | undefined): void;
     handleParsedChange(): void;
     handleGlobalFilterSearchTerm(newValue: string): void;
     handlePaginationState(newValue: PaginationState, oldValue: PaginationState): void;

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

@@ -16,6 +16,10 @@ export declare class NvDatagridcolumn {
      * Whether the column need to be repeated with the template.
      */
     readonly repeatTemplate: boolean;
+    /**
+     * Defines the group header of the column.
+     */
+    readonly group?: string;
     /****************************************************************************/
     render(): any;
 }

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

@@ -11,6 +11,7 @@ import { EventEmitter } from '../../stencil-public-runtime';
 export declare class NvFielddaterange {
     el: HTMLNvFielddaterangeElement;
     private popoverElement;
+    private calendarElement;
     private popoverId;
     /****************************************************************************/
     /**
@@ -91,6 +92,10 @@ export declare class NvFielddaterange {
      * Controls the opening of the popover.
      */
     open: boolean;
+    /**
+     * Current calendar state to prevent unwanted navigation
+     */
+    private calendarState;
     /**
      * First day of the week 0 = Sunday, 1 = Monday, etc.
      * @default 1
@@ -166,7 +171,7 @@ export declare class NvFielddaterange {
      */
     private handleEndInput;
     /**
-     * Update the calendar's rangeValue property
+     * Update the calendar's rangeValue property without forcing month change
      */
     private updateCalendarValue;
     /**
@@ -196,6 +201,11 @@ export declare class NvFielddaterange {
     handleRangeDateChange(event: CustomEvent<HTMLNvCalendarElementEventMap['rangeDateChange']>): void;
     handleClosePopover(): void;
     handleApplyDateRange(): void;
+    /**
+     * Handles the reset event from the calendar's cancel button
+     * @param {CustomEvent} event - The event emitted by the calendar
+     */
+    handleDateReset(event: CustomEvent): void;
     /**
      * Handles keyboard events.
      * @param {KeyboardEvent} event - The keyboard event