@nova-design-system/nova-webcomponents 3.0.0-beta.43 → 3.0.0-beta.45

package/dist/components/nv-fieldpassword.js

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-1c45c0f2.js';
-import { d as defineCustomElement$4 } from './p-ebf24fd0.js';
-import { d as defineCustomElement$3 } from './p-1e095bba.js';
+import { d as defineCustomElement$4 } from './p-78b00756.js';
+import { d as defineCustomElement$3 } from './p-3b096098.js';
 import { d as defineCustomElement$2 } from './p-3a3ba5b1.js';
 import { v as v4 } from './p-f5ff676c.js';
 

package/dist/components/nv-fieldselect.js

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-1c45c0f2.js';
-import { d as defineCustomElement$4 } from './p-ebf24fd0.js';
-import { d as defineCustomElement$3 } from './p-1e095bba.js';
+import { d as defineCustomElement$4 } from './p-78b00756.js';
+import { d as defineCustomElement$3 } from './p-3b096098.js';
 import { d as defineCustomElement$2 } from './p-3a3ba5b1.js';
 import { v as v4 } from './p-f5ff676c.js';
 

package/dist/components/nv-fieldtext.js

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-1c45c0f2.js';
-import { d as defineCustomElement$2 } from './p-ebf24fd0.js';
+import { d as defineCustomElement$2 } from './p-78b00756.js';
 import { v as v4 } from './p-f5ff676c.js';
 
 const nvFieldtextCss = "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}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)}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 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)}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>.description{align-self:stretch;color:var(--components-form-text-description-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fieldtext>.error-description{align-self:stretch;color:var(--components-form-text-description-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}";

package/dist/components/nv-fieldtime.js

@@ -1,10 +1,10 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-1c45c0f2.js';
 import { a as startsWithIgnoreCase } from './p-a5c8eee9.js';
 import { T as TimeType } from './p-8348db09.js';
-import { d as defineCustomElement$5 } from './p-ebf24fd0.js';
-import { d as defineCustomElement$4 } from './p-1e095bba.js';
+import { d as defineCustomElement$5 } from './p-78b00756.js';
+import { d as defineCustomElement$4 } from './p-3b096098.js';
 import { d as defineCustomElement$3 } from './p-3a3ba5b1.js';
-import { d as defineCustomElement$2 } from './p-057ae4f2.js';
+import { d as defineCustomElement$2 } from './p-e46c2e31.js';
 import { v as v4 } from './p-f5ff676c.js';
 
 const nvFieldtimeCss = "nv-fieldtime{--nv-field-border-default:var(--components-form-field-border-default);--nv-field-border-hover:var(--components-form-field-border-hover);--nv-field-border-focus:var(--components-form-field-border-focus);--nv-field-border-disabled:var(--components-form-field-border-default);--nv-field-border-readonly:var(--components-form-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-brand);--nv-field-background:var(--components-form-field-background-default);display:flex;flex-direction:column;align-items:flex-start;gap:var(--form-gap-y);box-sizing:border-box}nv-fieldtime[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-fieldtime[error]:not([error=false]){--nv-field-border-default:var(--components-form-field-border-error);--nv-field-border-hover:var(--nv-field-border-default);--nv-field-border-focus:var(--nv-field-border-default);--nv-field-border-disabled:var(--nv-field-border-default);--nv-field-border-readonly:var(--nv-field-border-default);--nv-field-focus-box-shadow:var(--color-focus-destructive)}nv-fieldtime[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-fieldtime[required]:not([required=false]) label::after{content:\"*\";color:var(--components-form-text-required);font-weight:700}nv-fieldtime 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-fieldtime nv-popover{width:100%;display:block}nv-fieldtime nv-popover [data-scope=popover]{padding:var(--list-dropdown-padding);background-color:var(--components-list-dropdown-background);border:1px solid var(--components-list-dropdown-border);width:100%}nv-fieldtime .input-wrapper{display:flex;flex-wrap:wrap;gap:var(--form-gap-x);align-items:stretch;align-self:stretch;width:100%}nv-fieldtime .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;display:flex;justify-content:flex-start;align-items:center;position:relative;width:100%;min-height:40px;gap:0;padding-left:var(--form-field-padding-x)}nv-fieldtime .input-container:hover{border-color:var(--nv-field-border-hover)}nv-fieldtime .input-container:focus-within,nv-fieldtime .input-container:focus-within:hover,nv-fieldtime .input-container:focus,nv-fieldtime .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-fieldtime .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-fieldtime .input-container:has(input:disabled){opacity:0.5;background-color:var(--components-form-field-background-disabled);border-color:var(--nv-field-border-disabled)}nv-fieldtime .input-container input.time-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%;min-width:24px;flex:0 0 24px;text-align:center;padding:0;margin:0}nv-fieldtime .input-container input.time-input:focus{outline:none}nv-fieldtime .input-container input.time-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-fieldtime .input-container input.time-input::-webkit-inner-spin-button,nv-fieldtime .input-container input.time-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}nv-fieldtime .input-container span{width:100%;text-align:center;min-width:24px;flex:0 0 24px;padding:0 4px;color:var(--components-form-field-content-text)}nv-fieldtime .input-container>nv-iconbutton{border:0px;border-radius:0px;margin-left:auto}nv-fieldtime .input-container>nv-iconbutton:focus-visible{border-radius:var(--button-md-border-radius);outline-offset:-3px}nv-fieldtime .input-container nv-icon.validation{color:var(--nv-field-border-default);position:absolute;right:50px;top:50%;transform:translateY(-50%)}nv-fieldtime .input-container:focus,nv-fieldtime .input-container:focus-within{border-color:var(--color-focus-brand);box-shadow:0px 0px 0px var(--focus-field-stroke) var(--color-focus-brand)}nv-fieldtime .description{align-self:stretch;color:var(--components-form-text-description-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height)}nv-fieldtime .error-description{align-self:stretch;color:var(--components-form-text-description-default);font-family:\"TT Norms Pro\", sans-serif;font-size:var(--form-description-font-size);font-style:normal;line-height:var(--form-description-line-height);color:var(--components-form-text-description-error)}nv-fieldtime hr{border:none;border-top:1px solid var(--dropdown-divider-color, #ccc);margin:0.5rem 0}nv-fieldtime .time-dropdown{width:100%}nv-fieldtime .time-dropdown .time-columns{display:flex;justify-content:flex-start;align-items:center}nv-fieldtime .time-dropdown .time-columns .time-column{flex:1;text-align:center;max-height:200px;overflow-y:auto;scroll-behavior:smooth}nv-fieldtime .time-dropdown .time-columns .time-column::-webkit-scrollbar{width:4px}nv-fieldtime .time-dropdown .time-columns .time-column::-webkit-scrollbar-thumb{border-radius:4px}nv-fieldtime .time-dropdown .time-columns .time-column:last-child{border-right:none}nv-fieldtime .time-dropdown .time-columns .time-column .time-option{padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);text-align:center;cursor:pointer;transition:background-color 0.2s;height:40px;border-radius:var(--list-dropdown-item-radius);display:flex;justify-content:center;align-items:center}nv-fieldtime .time-dropdown .time-columns .time-column .time-option:hover{background-color:var(--components-list-dropdown-item-background-hover);color:var(--components-list-dropdown-item-label-hover)}nv-fieldtime .time-dropdown .time-columns .time-column .time-option:focus,nv-fieldtime .time-dropdown .time-columns .time-column .time-option:focus-within{background-color:var(--components-list-dropdown-item-background-hover);color:var(--components-list-dropdown-item-label-hover)}nv-fieldtime .time-dropdown .time-columns .time-column .time-option.selected{background-color:var(--components-list-dropdown-item-background-active);color:var(--components-list-dropdown-item-label-active);border-width:1px;border-style:solid;border-color:var(--components-list-dropdown-item-border-active)}nv-fieldtime .time-dropdown .time-columns .time-column .time-option.highlighted{background-color:var(--components-list-dropdown-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}";

package/dist/components/nv-icon.js

@@ -1,4 +1,4 @@
-import { N as NvIcon$1, d as defineCustomElement$1 } from './p-ebf24fd0.js';
+import { N as NvIcon$1, d as defineCustomElement$1 } from './p-78b00756.js';
 
 const NvIcon = NvIcon$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/nv-iconbutton.js

@@ -1,4 +1,4 @@
-import { N as NvIconbutton$1, d as defineCustomElement$1 } from './p-1e095bba.js';
+import { N as NvIconbutton$1, d as defineCustomElement$1 } from './p-3b096098.js';
 
 const NvIconbutton = NvIconbutton$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/nv-menu.js

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-1c45c0f2.js';
-import { d as defineCustomElement$4 } from './p-ebf24fd0.js';
-import { d as defineCustomElement$3 } from './p-4c6ba63c.js';
-import { d as defineCustomElement$2 } from './p-057ae4f2.js';
+import { d as defineCustomElement$4 } from './p-78b00756.js';
+import { d as defineCustomElement$3 } from './p-863974b2.js';
+import { d as defineCustomElement$2 } from './p-e46c2e31.js';
 
 const nvMenuCss = "nv-menuitem{display:flex;align-items:center;max-width:300px;width:100vw;font-size:var(--menu-contextual-item-font-size);font-weight:var(--menu-contextual-item-font-weight);color:var(--components-menu-contextual-item-content);border-radius:var(--menu-contextual-item-radius);gap:var(--menu-contextual-item-gap-x);padding:var(--menu-contextual-item-padding-y) var(--menu-contextual-item-padding-x);transition:background-color 150ms ease-out;cursor:pointer}nv-menuitem:hover,nv-menuitem:focus,nv-menuitem:focus-within{background-color:var(--components-menu-contextual-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-menuitem *{pointer-events:none}nv-menuitem kbd{color:var(--components-menu-contextual-item-shortcut)}nv-menuitem [data-scope=text]{margin-right:auto}nv-menuitem[disabled]:not([disabled=false]){cursor:unset;background-color:unset;color:var(--components-menu-contextual-item-content-disabled)}nv-menu{display:inline-block;position:relative}nv-menu:has([fluid]:not([fluid=false])){display:block}nv-menu nv-popover{display:unset}nv-menu nv-popover [data-scope=popover]{background-color:transparent !important;padding:0 !important}nv-menu [slot=content]{padding:var(--menu-contextual-padding-y) var(--menu-contextual-padding-x);border-radius:var(--menu-contextual-radius);gap:var(--menu-contextual-gap-y);background-color:var(--components-menu-contextual-background);border-color:var(--components-menu-contextual-border);display:flex;flex-direction:column}nv-menu nv-menu[open]:not([open=false])>nv-menuitem{background-color:var(--components-menu-contextual-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-menu hr{display:block;margin:var(--menu-contextual-divider-padding-top) var(--menu-contextual-divider-padding-x) var(--menu-contextual-divider-padding-bottom) var(--menu-contextual-divider-padding-x)}";
 const NvMenuStyle0 = nvMenuCss;

package/dist/components/nv-menuitem.js

@@ -1,4 +1,4 @@
-import { N as NvMenuitem$1, d as defineCustomElement$1 } from './p-4c6ba63c.js';
+import { N as NvMenuitem$1, d as defineCustomElement$1 } from './p-863974b2.js';
 
 const NvMenuitem = NvMenuitem$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/nv-popover.js

@@ -1,4 +1,4 @@
-import { N as NvPopover$1, d as defineCustomElement$1 } from './p-057ae4f2.js';
+import { N as NvPopover$1, d as defineCustomElement$1 } from './p-e46c2e31.js';
 
 const NvPopover = NvPopover$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/nv-table.js

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-1c45c0f2.js';
 import { d as deepCopyElement, e as excludedProps } from './p-cb34aa4f.js';
 
-const nvTableCss = "nv-table{display:block}nv-table .hidden{display:none}nv-table table{border-collapse:collapse;border-color:inherit;text-indent:0;width:100%}nv-table th{text-align:left;border-bottom:1px solid var(--components-datagrid-border-header);height:var(--spacing-12);padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-md);font-weight:700;color:var(--components-datagrid-content-header)}nv-table td{border-bottom:1px solid var(--components-datagrid-border-body);height:var(--spacing-12);max-height:var(--spacing-14);padding:var(--spacing-2) var(--spacing-4);font-size:var(--font-size-md);font-weight:400;color:var(--components-datagrid-content-text);white-space:nowrap;text-overflow:ellipsis}nv-table tbody>tr:hover{background:var(--color-interaction-container-neutral-background-hover)}";
+const nvTableCss = "nv-table{display:block}nv-table .hidden{display:none}nv-table table{border-collapse:collapse;border-color:inherit;text-indent:0;width:100%}nv-table th{text-align:left;border-bottom:1px solid var(--components-datagrid-header-border);height:var(--spacing-12);padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-md);font-weight:700;color:var(--components-datagrid-header-text)}nv-table td{border-bottom:1px solid var(--components-datagrid-body-border);height:var(--spacing-12);max-height:var(--spacing-14);padding:var(--spacing-2) var(--spacing-4);font-size:var(--font-size-md);font-weight:400;color:var(--components-datagrid-body-text);white-space:nowrap;text-overflow:ellipsis}nv-table tbody>tr:hover{background:var(--color-interaction-container-neutral-background-hover)}";
 const NvTableStyle0 = nvTableCss;
 
 const NvTable$1 = /*@__PURE__*/ proxyCustomElement(class NvTable extends H {

package/dist/components/nv-table.js.map

@@ -1 +1 @@
-{"file":"nv-table.js","mappings":"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","names":["NvTable","HTMLElement"],"sources":["src/components/nv-table/nv-table.scss?tag=nv-table","src/components/nv-table/nv-table.tsx"],"sourcesContent":["@mixin root-styles() {\n  display: block;\n}\n\nnv-table {\n  @include root-styles();\n\n  .hidden {\n    display: none;\n  }\n\n  table {\n    border-collapse: collapse;\n    border-color: inherit;\n    text-indent: 0;\n    width: 100%;\n  }\n  th {\n    text-align: left;\n    border-bottom: 1px solid var(--components-datagrid-border-header);\n    height: var(--spacing-12);\n    padding: var(--spacing-3) var(--spacing-4);\n    font-size: var(--font-size-md);\n    font-weight: 700;\n    color: var(--components-datagrid-content-header);\n  }\n  td {\n    border-bottom: 1px solid var(--components-datagrid-border-body);\n    height: var(--spacing-12);\n    max-height: var(--spacing-14);\n    padding: var(--spacing-2) var(--spacing-4);\n    font-size: var(--font-size-md);\n    font-weight: 400;\n    color: var(--components-datagrid-content-text);\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n  tbody > tr:hover {\n    background: var(--color-interaction-container-neutral-background-hover);\n  }\n}\n\n// https://tailwindcss.com/docs/table-layout","/* eslint-disable @typescript-eslint/no-explicit-any */\nimport {\n  Component,\n  Host,\n  Prop,\n  State,\n  h,\n  Element,\n  Watch,\n  Event,\n  EventEmitter,\n} from '@stencil/core';\nimport { ColumnConfig } from '../../interfaces/ColumnConfig';\nimport { ActionEvent } from '../../interfaces/actionEvent';\nimport { deepCopyElement, excludedProps } from '../../utils/dom.utils';\n\n/**\n * Helper interface to define the table structure\n */\ninterface Table {\n  /**\n   * Configuration of the columns of the table\n   */\n  columns: ColumnConfig[];\n\n  /**\n   * Data to be displayed in the table\n   */\n  data: any[];\n}\n\n/**\n * @slot default - Slot for the composed table columns\n * @slot before - Use this slot to insert HTML before the table.\n * @slot after - Use this slot to insert HTML after the table.\n */\n@Component({\n  tag: 'nv-table',\n  styleUrl: 'nv-table.scss',\n  shadow: false,\n})\nexport class NvTable {\n  @Element() el: HTMLNvTableElement;\n\n  private readonly templateCache = new Map<string, Element>();\n  private readonly headerTemplateCache = new Map<string, Element>();\n\n  /****************************************************************************/\n  //#region STATES\n\n  @State()\n  parsedColumns: ColumnConfig[] = [];\n\n  @State()\n  parsedData: any[] = [];\n\n  @State()\n  private table: Table = null;\n\n  //#endregion STATES\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Data to be displayed in the table\n   */\n  @Prop({ reflect: true })\n  readonly data: any[] = [];\n\n  /**\n   * Configuration of the columns of the table\n   */\n  @Prop({ reflect: true })\n  readonly columnsConfig: ColumnConfig[] = [];\n\n  /**\n   * Data to be displayed in the table\n   */\n  @Prop({ reflect: true })\n  readonly dataJson?: string;\n\n  /**\n   * Configuration of the columns of the table\n   */\n  @Prop({ reflect: true })\n  readonly columnsConfigJson?: string;\n\n  /**\n   * Fallback value to be displayed when data is not available\n   */\n  @Prop({ reflect: true })\n  readonly fallbackValue: string = 'N/A';\n\n  /**\n   * Message to be displayed when no data is available\n   */\n  @Prop({ reflect: true })\n  readonly noDataMessage: string = 'No data available';\n\n  /**\n   * The message to display when there are no columns or data available.\n   * @default 'No data or columns available to display.'\n   */\n  @Prop({ reflect: true })\n  readonly noColumnsNoDataMessage: string =\n    'No data or columns available to display.';\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Caches templates for cells and headers upfront to improve performance.\n   */\n  private cacheTemplates() {\n    const columns = Array.from(this.el.querySelectorAll('nv-tablecolumn'));\n\n    columns.forEach((col: HTMLNvTablecolumnElement) => {\n      const key = col.name;\n      const cellSlot = col.querySelector('[slot=\"cell\"]');\n\n      if (cellSlot) {\n        const element = deepCopyElement(cellSlot as HTMLElement);\n        this.templateCache.set(key, element);\n      }\n\n      const headerSlot = col.querySelector('[slot=\"header\"]');\n\n      if (headerSlot) {\n        const element = deepCopyElement(headerSlot as HTMLElement);\n        this.headerTemplateCache.set(key, element);\n      } else {\n        const header = col.header;\n\n        if (header) {\n          const headerDiv = document.createElement('div');\n          headerDiv.textContent = header;\n          this.headerTemplateCache.set(key, headerDiv);\n        }\n      }\n    });\n  }\n\n  private parseDataAndColumns() {\n    if (this.dataJson) {\n      this.parseJsonData(this.dataJson);\n    } else if (this.data && this.data.length > 0) {\n      this.parseDataArray(this.data, this.parsedData);\n    }\n\n    if (this.columnsConfigJson) {\n      this.parseJsonColumns(this.columnsConfigJson, this.parsedColumns);\n    } else if (this.columnsConfig && this.columnsConfig.length > 0) {\n      this.parseColumnsArray(this.columnsConfig, this.parsedColumns);\n    } else if (this.headerTemplateCache.size > 0) {\n      const headerKeys = Array.from(this.headerTemplateCache.keys());\n      const arrayColumnsConfig = headerKeys.map<ColumnConfig>(key => ({\n        ...{}, // Ensure no prototype inheritance\n        name: key,\n        header: key ? key.charAt(0).toUpperCase() + key.slice(1) : '',\n      }));\n\n      this.parseColumnsArray(arrayColumnsConfig, this.parsedColumns);\n    } else if (this.parsedData.length > 0) {\n      const firstRow = this.parsedData[0];\n      const arrayColumnsConfig = Object.keys(firstRow).map<ColumnConfig>(\n        key => ({\n          name: key,\n          header: key.charAt(0).toUpperCase() + key.slice(1),\n        }),\n      );\n\n      this.parseColumnsArray(arrayColumnsConfig, this.parsedColumns);\n    }\n  }\n\n  private deepEqual(a: any, b: any): boolean {\n    return JSON.stringify(a) === JSON.stringify(b);\n  }\n\n  /**\n   * Parses the data array and sets the state accordingly\n   * @param {any[]} newValue - New value of the data array\n   * @param {any[]} oldValue - Old value of the data array\n   * @returns {void}\n   */\n  private parseDataArray(newValue: any[], oldValue: any[]) {\n    // Ensure both are arrays for proper comparison\n    const safeNewValue = Array.isArray(newValue) ? newValue : [];\n    const safeOldValue = Array.isArray(oldValue) ? oldValue : [];\n\n    if (this.deepEqual(safeNewValue, safeOldValue)) {\n      return; // Deep comparison\n    }\n\n    this.parsedData = Array.isArray(newValue) ? newValue : [];\n  }\n\n  /**\n   * Parses the columns array and sets the state accordingly\n   * @param {ColumnConfig[]} newValue - New value of the columns array\n   * @param {ColumnConfig[]} oldValue - Old value of the columns array\n   * @returns {void}\n   */\n  private parseColumnsArray(\n    newValue: ColumnConfig[] | null | undefined,\n    oldValue: ColumnConfig[] | null | undefined,\n  ) {\n    // Ensure both are arrays for proper comparison\n    const safeNewValue = Array.isArray(newValue) ? newValue : [];\n    const safeOldValue = Array.isArray(oldValue) ? oldValue : [];\n\n    // Use a proper deep comparison function (e.g., Lodash's isEqual)\n    if (this.deepEqual(safeNewValue, safeOldValue)) {\n      return;\n    }\n\n    // Assign only after confirming changes\n    this.parsedColumns = safeNewValue;\n  }\n\n  private initializeTable() {\n    // Clear the previous table instance (if any)\n    this.table = null;\n\n    if (this.parsedColumns.length > 0) {\n      this.table = {\n        columns: this.parsedColumns,\n        data: this.getTableData(),\n      };\n    } else {\n      this.table = null;\n    }\n  }\n\n  private getTableData(): any[] {\n    if (\n      this.parsedData &&\n      Array.isArray(this.parsedData) &&\n      this.parsedData.length > 0\n    ) {\n      return [...this.parsedData];\n    } else {\n      return [];\n    }\n  }\n\n  // Helper function to get nested property value\n  private replaceKeyWithValue(obj: any, path: string) {\n    return (\n      path\n        .split('.')\n        .reduce(\n          (acc, key) => (acc && acc[key] !== undefined ? acc[key] : undefined),\n          obj,\n        ) ?? this.fallbackValue\n    );\n  }\n\n  private renderTemplate(template: Element | undefined, row: any) {\n    if (!template) {\n      return null;\n    }\n\n    // Handle <template> elements correctly\n    const templateContent =\n      template instanceof HTMLTemplateElement ? template.content : template;\n    const element = deepCopyElement(templateContent as HTMLElement);\n\n    // Replace placeholders in text content, attributes, and properties\n    element.querySelectorAll('*').forEach(el => {\n      // Replace placeholders in text content\n      this.replacePlaceholdersTextContent(el, row);\n\n      // Replace placeholders in attributes\n      this.replacePlaceholdersAttributes(el, row);\n\n      // Replace placeholders in properties\n      this.replacePlaceholdersProperties(el, row);\n    });\n\n    // Handle `data-bind-event`\n    element.querySelectorAll('[data-bind-event]').forEach(el => {\n      const bindEvent = el.getAttribute('data-bind-event') || '';\n      const splitted = bindEvent.split(':');\n\n      if (!bindEvent.includes(':') || splitted.length < 2) {\n        console.warn('Invalid data-bind-event format:', bindEvent);\n        return;\n      }\n\n      const eventType = splitted[0];\n      const keyAction = splitted[1];\n      const details = splitted.length > 2 ? splitted[2] : null;\n\n      el.addEventListener(eventType, () => {\n        const keys = details?.split(',') ?? [];\n\n        // Convert keys into a single object instead of an array of objects\n        const keyValue = keys.reduce((acc, key) => {\n          acc[key] = row?.[key];\n          return acc;\n        }, {} as Record<string, any>);\n\n        const action: ActionEvent = { keyAction, details: keyValue };\n\n        this.action.emit(action);\n      });\n    });\n\n    // Ensure Web Components are properly connected\n    setTimeout(() => {\n      element.querySelectorAll('*').forEach(child => {\n        if (typeof (child as any).connectedCallback === 'function') {\n          (child as any).connectedCallback();\n        }\n      });\n    }, 0);\n\n    return (\n      <div\n        ref={el => {\n          if (el) {\n            el.innerHTML = ''; // Remove existing content\n            el.appendChild(element); // Append new element\n          }\n        }}\n      ></div>\n    );\n  }\n\n  private replacePlaceholdersTextContent(element: Element, row: any) {\n    // ✅ Replace placeholders in text content\n    element.childNodes.forEach(node => {\n      if (node.nodeType === Node.TEXT_NODE) {\n        node.textContent = node.textContent.replace(/__([\\w.]+)__/g, (_, key) =>\n          this.replaceKeyWithValue(row, key),\n        );\n      }\n    });\n  }\n\n  private replacePlaceholdersAttributes(element: Element, row: any) {\n    // ✅ Replace placeholders in attributes\n    Array.from(element.attributes).forEach(attr => {\n      if (attr.value.includes('__')) {\n        attr.value = attr.value.replace(/__([\\w.]+)__/g, (_, key) =>\n          this.replaceKeyWithValue(row, key),\n        );\n      }\n    });\n  }\n\n  private replacePlaceholdersProperties(element: Element, row: any) {\n    // ✅ Dynamically extract relevant properties\n    const properties = new Set<string>();\n\n    // Collect only own enumerable properties\n    Object.keys(element).forEach(key => properties.add(key));\n\n    // Collect inherited properties from prototypes (HTMLElement -> Element -> Node)\n    let proto = Object.getPrototypeOf(element);\n    while (proto && proto !== HTMLElement.prototype) {\n      Object.keys(proto).forEach(key => properties.add(key));\n      proto = Object.getPrototypeOf(proto);\n    }\n\n    // ✅ Filter and copy only non-function properties and exclude irrelevant ones\n    properties.forEach(prop => {\n      if (\n        typeof (element as any)[prop] !== 'function' && // Ignore methods\n        !prop.startsWith('on') && // Ignore event listeners (onclick, oninput, etc.)\n        !excludedProps.has(prop) // 🚨 Prevent text duplication and irrelevant props\n      ) {\n        try {\n          const value = element[prop];\n\n          // ✅ Replace placeholders only if the value is a string\n          if (typeof value === 'string' && value.includes('__')) {\n            element[prop] = value.replace(/__([\\w.]+)__/g, (_, key: string) =>\n              this.replaceKeyWithValue(row, key),\n            ) as any; // ✅ TypeScript safe\n          }\n        } catch (error) {\n          console.warn(`Could not assign property ${prop}:`, error.message);\n        }\n      }\n    });\n  }\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  @Watch('columnsConfig')\n  parseColumns(newValue: ColumnConfig[], oldValue: ColumnConfig[]) {\n    this.parseColumnsArray(newValue, oldValue);\n  }\n\n  @Watch('columnsConfigJson')\n  parseJsonColumns(newValue: string | undefined, oldValue: ColumnConfig[]) {\n    try {\n      const newItems = newValue ? JSON.parse(newValue) : [];\n\n      this.parseColumnsArray(newItems, oldValue);\n    } catch (e) {\n      console.error('Invalid JSON format for columnsConfigJson:', e.message);\n      this.parsedColumns = [];\n    }\n  }\n\n  @Watch('data')\n  parseData(newValue: any[], oldValue: any[]) {\n    this.parseDataArray(newValue, oldValue);\n  }\n\n  @Watch('dataJson')\n  parseJsonData(newValue: string | undefined) {\n    try {\n      const newItems = newValue ? JSON.parse(newValue) : [];\n\n      this.parseDataArray(newItems, this.parsedData);\n    } catch (e) {\n      console.error('Invalid JSON format for dataJson:', e.message);\n      this.parsedData = [];\n    }\n  }\n\n  @Watch('parsedColumns')\n  @Watch('parsedData')\n  handleParsedChange() {\n    this.initializeTable();\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    this.cacheTemplates();\n\n    this.parseDataAndColumns();\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region EVENTS\n\n  @Event()\n  action: EventEmitter<ActionEvent>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    const headerGroups =\n      !this.table || this.table === undefined || this.parsedColumns.length === 0\n        ? []\n        : this.table.columns;\n\n    const rows =\n      !this.table || this.table === undefined || this.parsedData.length === 0\n        ? []\n        : this.table.data;\n\n    return (\n      <Host>\n        <div class=\"hidden\">\n          <slot></slot>\n        </div>\n\n        <slot name=\"before\"></slot>\n\n        {this.parsedColumns.length === 0 && this.parsedData.length === 0 ? (\n          <div class=\"no-data\">{this.noColumnsNoDataMessage}</div>\n        ) : (\n          <table class=\"table\">\n            {this.parsedColumns.length > 0 && headerGroups.length > 0 && (\n              <thead class=\"table-header\">\n                <tr>\n                  {headerGroups &&\n                    headerGroups.map(col => {\n                      return (\n                        <th key={col.name}>\n                          {this.renderTemplate(\n                            this.headerTemplateCache.get(col.name),\n                            {},\n                          ) || col.header}\n                        </th>\n                      );\n                    })}\n                </tr>\n              </thead>\n            )}\n            <tbody class=\"table-body\">\n              {!rows || rows.length === 0 ? (\n                <tr>\n                  <td colSpan={headerGroups.length || 12} class=\"no-data\">\n                    {this.noDataMessage}\n                  </td>\n                </tr>\n              ) : (\n                rows.map(row => (\n                  <tr key={JSON.stringify(row)}>\n                    {headerGroups.map(col => (\n                      <td>\n                        {this.renderTemplate(\n                          this.templateCache.get(col.name),\n                          row,\n                        ) ||\n                          (row[col.name] ?? this.fallbackValue)}\n                      </td>\n                    ))}\n                  </tr>\n                ))\n              )}\n            </tbody>\n          </table>\n        )}\n\n        <slot name=\"after\"></slot>\n      </Host>\n    );\n  }\n  // #endregion RENDER\n}\n"],"version":3}
+{"file":"nv-table.js","mappings":";;;AAAA,MAAM,UAAU,GAAG,qxBAAqxB,CAAC;AACzyB,sBAAe,UAAU;;MCwCZA,SAAO;IALpB;;;;QAQmB,kBAAa,GAAG,IAAI,GAAG,EAAmB,CAAC;QAC3C,wBAAmB,GAAG,IAAI,GAAG,EAAmB,CAAC;;;QAMlE,kBAAa,GAAmB,EAAE,CAAC;QAGnC,eAAU,GAAU,EAAE,CAAC;QAGf,UAAK,GAAU,IAAI,CAAC;;;;;;;QAUnB,SAAI,GAAU,EAAE,CAAC;;;;QAMjB,kBAAa,GAAmB,EAAE,CAAC;;;;QAkBnC,kBAAa,GAAW,KAAK,CAAC;;;;QAM9B,kBAAa,GAAW,mBAAmB,CAAC;;;;;QAO5C,2BAAsB,GAC7B,0CAA0C,CAAC;KAqa9C;;;;;;;IA5ZS,cAAc;QACpB,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,CAAC,CAAC;QAEvE,OAAO,CAAC,OAAO,CAAC,CAAC,GAA6B;YAC5C,MAAM,GAAG,GAAG,GAAG,CAAC,IAAI,CAAC;YACrB,MAAM,QAAQ,GAAG,GAAG,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;YAEpD,IAAI,QAAQ,EAAE;gBACZ,MAAM,OAAO,GAAG,eAAe,CAAC,QAAuB,CAAC,CAAC;gBACzD,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;aACtC;YAED,MAAM,UAAU,GAAG,GAAG,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;YAExD,IAAI,UAAU,EAAE;gBACd,MAAM,OAAO,GAAG,eAAe,CAAC,UAAyB,CAAC,CAAC;gBAC3D,IAAI,CAAC,mBAAmB,CAAC,GAAG,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;aAC5C;iBAAM;gBACL,MAAM,MAAM,GAAG,GAAG,CAAC,MAAM,CAAC;gBAE1B,IAAI,MAAM,EAAE;oBACV,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;oBAChD,SAAS,CAAC,WAAW,GAAG,MAAM,CAAC;oBAC/B,IAAI,CAAC,mBAAmB,CAAC,GAAG,CAAC,GAAG,EAAE,SAAS,CAAC,CAAC;iBAC9C;aACF;SACF,CAAC,CAAC;KACJ;IAEO,mBAAmB;QACzB,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;SACnC;aAAM,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE;YAC5C,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;SACjD;QAED,IAAI,IAAI,CAAC,iBAAiB,EAAE;YAC1B,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,iBAAiB,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;SACnE;aAAM,IAAI,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,EAAE;YAC9D,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;SAChE;aAAM,IAAI,IAAI,CAAC,mBAAmB,CAAC,IAAI,GAAG,CAAC,EAAE;YAC5C,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,IAAI,EAAE,CAAC,CAAC;YAC/D,MAAM,kBAAkB,GAAG,UAAU,CAAC,GAAG,CAAe,GAAG,mBACtD,EAAE,IACL,IAAI,EAAE,GAAG,EACT,MAAM,EAAE,GAAG,GAAG,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,EAAE,IAC7D,CAAC,CAAC;YAEJ,IAAI,CAAC,iBAAiB,CAAC,kBAAkB,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;SAChE;aAAM,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;YACrC,MAAM,QAAQ,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;YACpC,MAAM,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,GAAG,CAClD,GAAG,KAAK;gBACN,IAAI,EAAE,GAAG;gBACT,MAAM,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC;aACnD,CAAC,CACH,CAAC;YAEF,IAAI,CAAC,iBAAiB,CAAC,kBAAkB,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;SAChE;KACF;IAEO,SAAS,CAAC,CAAM,EAAE,CAAM;QAC9B,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;KAChD;;;;;;;IAQO,cAAc,CAAC,QAAe,EAAE,QAAe;;QAErD,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,QAAQ,GAAG,EAAE,CAAC;QAC7D,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,QAAQ,GAAG,EAAE,CAAC;QAE7D,IAAI,IAAI,CAAC,SAAS,CAAC,YAAY,EAAE,YAAY,CAAC,EAAE;YAC9C,OAAO;SACR;QAED,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,QAAQ,GAAG,EAAE,CAAC;KAC3D;;;;;;;IAQO,iBAAiB,CACvB,QAA2C,EAC3C,QAA2C;;QAG3C,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,QAAQ,GAAG,EAAE,CAAC;QAC7D,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,QAAQ,GAAG,EAAE,CAAC;;QAG7D,IAAI,IAAI,CAAC,SAAS,CAAC,YAAY,EAAE,YAAY,CAAC,EAAE;YAC9C,OAAO;SACR;;QAGD,IAAI,CAAC,aAAa,GAAG,YAAY,CAAC;KACnC;IAEO,eAAe;;QAErB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QAElB,IAAI,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,EAAE;YACjC,IAAI,CAAC,KAAK,GAAG;gBACX,OAAO,EAAE,IAAI,CAAC,aAAa;gBAC3B,IAAI,EAAE,IAAI,CAAC,YAAY,EAAE;aAC1B,CAAC;SACH;aAAM;YACL,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;SACnB;KACF;IAEO,YAAY;QAClB,IACE,IAAI,CAAC,UAAU;YACf,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,CAAC;YAC9B,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,EAC1B;YACA,OAAO,CAAC,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC;SAC7B;aAAM;YACL,OAAO,EAAE,CAAC;SACX;KACF;;IAGO,mBAAmB,CAAC,GAAQ,EAAE,IAAY;;QAChD,QACE,MAAA,IAAI;aACD,KAAK,CAAC,GAAG,CAAC;aACV,MAAM,CACL,CAAC,GAAG,EAAE,GAAG,MAAM,GAAG,IAAI,GAAG,CAAC,GAAG,CAAC,KAAK,SAAS,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,SAAS,CAAC,EACpE,GAAG,CACJ,mCAAI,IAAI,CAAC,aAAa,EACzB;KACH;IAEO,cAAc,CAAC,QAA6B,EAAE,GAAQ;QAC5D,IAAI,CAAC,QAAQ,EAAE;YACb,OAAO,IAAI,CAAC;SACb;;QAGD,MAAM,eAAe,GACnB,QAAQ,YAAY,mBAAmB,GAAG,QAAQ,CAAC,OAAO,GAAG,QAAQ,CAAC;QACxE,MAAM,OAAO,GAAG,eAAe,CAAC,eAA8B,CAAC,CAAC;;QAGhE,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,EAAE;;YAEtC,IAAI,CAAC,8BAA8B,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC;;YAG7C,IAAI,CAAC,6BAA6B,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC;;YAG5C,IAAI,CAAC,6BAA6B,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC;SAC7C,CAAC,CAAC;;QAGH,OAAO,CAAC,gBAAgB,CAAC,mBAAmB,CAAC,CAAC,OAAO,CAAC,EAAE;YACtD,MAAM,SAAS,GAAG,EAAE,CAAC,YAAY,CAAC,iBAAiB,CAAC,IAAI,EAAE,CAAC;YAC3D,MAAM,QAAQ,GAAG,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;YAEtC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;gBACnD,OAAO,CAAC,IAAI,CAAC,iCAAiC,EAAE,SAAS,CAAC,CAAC;gBAC3D,OAAO;aACR;YAED,MAAM,SAAS,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;YAC9B,MAAM,SAAS,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;YAC9B,MAAM,OAAO,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;YAEzD,EAAE,CAAC,gBAAgB,CAAC,SAAS,EAAE;;gBAC7B,MAAM,IAAI,GAAG,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK,CAAC,GAAG,CAAC,mCAAI,EAAE,CAAC;;gBAGvC,MAAM,QAAQ,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,GAAG;oBACpC,GAAG,CAAC,GAAG,CAAC,GAAG,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAG,GAAG,CAAC,CAAC;oBACtB,OAAO,GAAG,CAAC;iBACZ,EAAE,EAAyB,CAAC,CAAC;gBAE9B,MAAM,MAAM,GAAgB,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAC;gBAE7D,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;aAC1B,CAAC,CAAC;SACJ,CAAC,CAAC;;QAGH,UAAU,CAAC;YACT,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,KAAK;gBACzC,IAAI,OAAQ,KAAa,CAAC,iBAAiB,KAAK,UAAU,EAAE;oBACzD,KAAa,CAAC,iBAAiB,EAAE,CAAC;iBACpC;aACF,CAAC,CAAC;SACJ,EAAE,CAAC,CAAC,CAAC;QAEN,QACE,WACE,GAAG,EAAE,EAAE;gBACL,IAAI,EAAE,EAAE;oBACN,EAAE,CAAC,SAAS,GAAG,EAAE,CAAC;oBAClB,EAAE,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;iBACzB;aACF,GACI,EACP;KACH;IAEO,8BAA8B,CAAC,OAAgB,EAAE,GAAQ;;QAE/D,OAAO,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI;YAC7B,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,CAAC,SAAS,EAAE;gBACpC,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,eAAe,EAAE,CAAC,CAAC,EAAE,GAAG,KAClE,IAAI,CAAC,mBAAmB,CAAC,GAAG,EAAE,GAAG,CAAC,CACnC,CAAC;aACH;SACF,CAAC,CAAC;KACJ;IAEO,6BAA6B,CAAC,OAAgB,EAAE,GAAQ;;QAE9D,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,IAAI;YACzC,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;gBAC7B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,eAAe,EAAE,CAAC,CAAC,EAAE,GAAG,KACtD,IAAI,CAAC,mBAAmB,CAAC,GAAG,EAAE,GAAG,CAAC,CACnC,CAAC;aACH;SACF,CAAC,CAAC;KACJ;IAEO,6BAA6B,CAAC,OAAgB,EAAE,GAAQ;;QAE9D,MAAM,UAAU,GAAG,IAAI,GAAG,EAAU,CAAC;;QAGrC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,GAAG,IAAI,UAAU,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;;QAGzD,IAAI,KAAK,GAAG,MAAM,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;QAC3C,OAAO,KAAK,IAAI,KAAK,KAAKC,CAAW,CAAC,SAAS,EAAE;YAC/C,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,GAAG,IAAI,UAAU,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;YACvD,KAAK,GAAG,MAAM,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;SACtC;;QAGD,UAAU,CAAC,OAAO,CAAC,IAAI;YACrB,IACE,OAAQ,OAAe,CAAC,IAAI,CAAC,KAAK,UAAU;gBAC5C,CAAC,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;gBACtB,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC;cACxB;gBACA,IAAI;oBACF,MAAM,KAAK,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;;oBAG5B,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;wBACrD,OAAO,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,eAAe,EAAE,CAAC,CAAC,EAAE,GAAW,KAC5D,IAAI,CAAC,mBAAmB,CAAC,GAAG,EAAE,GAAG,CAAC,CAC5B,CAAC;qBACV;iBACF;gBAAC,OAAO,KAAK,EAAE;oBACd,OAAO,CAAC,IAAI,CAAC,6BAA6B,IAAI,GAAG,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC;iBACnE;aACF;SACF,CAAC,CAAC;KACJ;;;;IAOD,YAAY,CAAC,QAAwB,EAAE,QAAwB;QAC7D,IAAI,CAAC,iBAAiB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;KAC5C;IAGD,gBAAgB,CAAC,QAA4B,EAAE,QAAwB;QACrE,IAAI;YACF,MAAM,QAAQ,GAAG,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC;YAEtD,IAAI,CAAC,iBAAiB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;SAC5C;QAAC,OAAO,CAAC,EAAE;YACV,OAAO,CAAC,KAAK,CAAC,4CAA4C,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC;YACvE,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC;SACzB;KACF;IAGD,SAAS,CAAC,QAAe,EAAE,QAAe;QACxC,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;KACzC;IAGD,aAAa,CAAC,QAA4B;QACxC,IAAI;YACF,MAAM,QAAQ,GAAG,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC;YAEtD,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;SAChD;QAAC,OAAO,CAAC,EAAE;YACV,OAAO,CAAC,KAAK,CAAC,mCAAmC,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC;YAC9D,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;SACtB;KACF;IAID,kBAAkB;QAChB,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;;;;IAMD,iBAAiB;QACf,IAAI,CAAC,cAAc,EAAE,CAAC;QAEtB,IAAI,CAAC,mBAAmB,EAAE,CAAC;KAC5B;;;;IAaD,MAAM;QACJ,MAAM,YAAY,GAChB,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,aAAa,CAAC,MAAM,KAAK,CAAC;cACtE,EAAE;cACF,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC;QAEzB,MAAM,IAAI,GACR,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,KAAK,CAAC;cACnE,EAAE;cACF,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;QAEtB,QACE,EAAC,IAAI,uDACH,4DAAK,KAAK,EAAC,QAAQ,IACjB,8DAAa,CACT,EAEN,6DAAM,IAAI,EAAC,QAAQ,GAAQ,EAE1B,IAAI,CAAC,aAAa,CAAC,MAAM,KAAK,CAAC,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,KAAK,CAAC,IAC9D,WAAK,KAAK,EAAC,SAAS,IAAE,IAAI,CAAC,sBAAsB,CAAO,KAExD,aAAO,KAAK,EAAC,OAAO,IACjB,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,CAAC,IAAI,YAAY,CAAC,MAAM,GAAG,CAAC,KACvD,aAAO,KAAK,EAAC,cAAc,IACzB,cACG,YAAY;YACX,YAAY,CAAC,GAAG,CAAC,GAAG;gBAClB,QACE,UAAI,GAAG,EAAE,GAAG,CAAC,IAAI,IACd,IAAI,CAAC,cAAc,CAClB,IAAI,CAAC,mBAAmB,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,EACtC,EAAE,CACH,IAAI,GAAG,CAAC,MAAM,CACZ,EACL;aACH,CAAC,CACD,CACC,CACT,EACD,aAAO,KAAK,EAAC,YAAY,IACtB,CAAC,IAAI,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,IACzB,cACE,UAAI,OAAO,EAAE,YAAY,CAAC,MAAM,IAAI,EAAE,EAAE,KAAK,EAAC,SAAS,IACpD,IAAI,CAAC,aAAa,CAChB,CACF,KAEL,IAAI,CAAC,GAAG,CAAC,GAAG,KACV,UAAI,GAAG,EAAE,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,IACzB,YAAY,CAAC,GAAG,CAAC,GAAG;;YAAI,QACvB,cACG,IAAI,CAAC,cAAc,CAClB,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,EAChC,GAAG,CACJ;iBACE,MAAA,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,mCAAI,IAAI,CAAC,aAAa,CAAC,CACpC,EACN;SAAA,CAAC,CACC,CACN,CAAC,CACH,CACK,CACF,CACT,EAED,6DAAM,IAAI,EAAC,OAAO,GAAQ,CACrB,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["NvTable","HTMLElement"],"sources":["src/components/nv-table/nv-table.scss?tag=nv-table","src/components/nv-table/nv-table.tsx"],"sourcesContent":["@mixin root-styles() {\n  display: block;\n}\n\nnv-table {\n  @include root-styles();\n\n  .hidden {\n    display: none;\n  }\n\n  table {\n    border-collapse: collapse;\n    border-color: inherit;\n    text-indent: 0;\n    width: 100%;\n  }\n  th {\n    text-align: left;\n    border-bottom: 1px solid var(--components-datagrid-header-border);\n    height: var(--spacing-12);\n    padding: var(--spacing-3) var(--spacing-4);\n    font-size: var(--font-size-md);\n    font-weight: 700;\n    color: var(--components-datagrid-header-text);\n  }\n  td {\n    border-bottom: 1px solid var(--components-datagrid-body-border);\n    height: var(--spacing-12);\n    max-height: var(--spacing-14);\n    padding: var(--spacing-2) var(--spacing-4);\n    font-size: var(--font-size-md);\n    font-weight: 400;\n    color: var(--components-datagrid-body-text);\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n  tbody > tr:hover {\n    background: var(--color-interaction-container-neutral-background-hover);\n  }\n}\n\n// https://tailwindcss.com/docs/table-layout","/* eslint-disable @typescript-eslint/no-explicit-any */\nimport {\n  Component,\n  Host,\n  Prop,\n  State,\n  h,\n  Element,\n  Watch,\n  Event,\n  EventEmitter,\n} from '@stencil/core';\nimport { ColumnConfig } from '../../interfaces/ColumnConfig';\nimport { ActionEvent } from '../../interfaces/actionEvent';\nimport { deepCopyElement, excludedProps } from '../../utils/dom.utils';\n\n/**\n * Helper interface to define the table structure\n */\ninterface Table {\n  /**\n   * Configuration of the columns of the table\n   */\n  columns: ColumnConfig[];\n\n  /**\n   * Data to be displayed in the table\n   */\n  data: any[];\n}\n\n/**\n * @slot default - Slot for the composed table columns\n * @slot before - Use this slot to insert HTML before the table.\n * @slot after - Use this slot to insert HTML after the table.\n */\n@Component({\n  tag: 'nv-table',\n  styleUrl: 'nv-table.scss',\n  shadow: false,\n})\nexport class NvTable {\n  @Element() el: HTMLNvTableElement;\n\n  private readonly templateCache = new Map<string, Element>();\n  private readonly headerTemplateCache = new Map<string, Element>();\n\n  /****************************************************************************/\n  //#region STATES\n\n  @State()\n  parsedColumns: ColumnConfig[] = [];\n\n  @State()\n  parsedData: any[] = [];\n\n  @State()\n  private table: Table = null;\n\n  //#endregion STATES\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Data to be displayed in the table\n   */\n  @Prop({ reflect: true })\n  readonly data: any[] = [];\n\n  /**\n   * Configuration of the columns of the table\n   */\n  @Prop({ reflect: true })\n  readonly columnsConfig: ColumnConfig[] = [];\n\n  /**\n   * Data to be displayed in the table\n   */\n  @Prop({ reflect: true })\n  readonly dataJson?: string;\n\n  /**\n   * Configuration of the columns of the table\n   */\n  @Prop({ reflect: true })\n  readonly columnsConfigJson?: string;\n\n  /**\n   * Fallback value to be displayed when data is not available\n   */\n  @Prop({ reflect: true })\n  readonly fallbackValue: string = 'N/A';\n\n  /**\n   * Message to be displayed when no data is available\n   */\n  @Prop({ reflect: true })\n  readonly noDataMessage: string = 'No data available';\n\n  /**\n   * The message to display when there are no columns or data available.\n   * @default 'No data or columns available to display.'\n   */\n  @Prop({ reflect: true })\n  readonly noColumnsNoDataMessage: string =\n    'No data or columns available to display.';\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Caches templates for cells and headers upfront to improve performance.\n   */\n  private cacheTemplates() {\n    const columns = Array.from(this.el.querySelectorAll('nv-tablecolumn'));\n\n    columns.forEach((col: HTMLNvTablecolumnElement) => {\n      const key = col.name;\n      const cellSlot = col.querySelector('[slot=\"cell\"]');\n\n      if (cellSlot) {\n        const element = deepCopyElement(cellSlot as HTMLElement);\n        this.templateCache.set(key, element);\n      }\n\n      const headerSlot = col.querySelector('[slot=\"header\"]');\n\n      if (headerSlot) {\n        const element = deepCopyElement(headerSlot as HTMLElement);\n        this.headerTemplateCache.set(key, element);\n      } else {\n        const header = col.header;\n\n        if (header) {\n          const headerDiv = document.createElement('div');\n          headerDiv.textContent = header;\n          this.headerTemplateCache.set(key, headerDiv);\n        }\n      }\n    });\n  }\n\n  private parseDataAndColumns() {\n    if (this.dataJson) {\n      this.parseJsonData(this.dataJson);\n    } else if (this.data && this.data.length > 0) {\n      this.parseDataArray(this.data, this.parsedData);\n    }\n\n    if (this.columnsConfigJson) {\n      this.parseJsonColumns(this.columnsConfigJson, this.parsedColumns);\n    } else if (this.columnsConfig && this.columnsConfig.length > 0) {\n      this.parseColumnsArray(this.columnsConfig, this.parsedColumns);\n    } else if (this.headerTemplateCache.size > 0) {\n      const headerKeys = Array.from(this.headerTemplateCache.keys());\n      const arrayColumnsConfig = headerKeys.map<ColumnConfig>(key => ({\n        ...{}, // Ensure no prototype inheritance\n        name: key,\n        header: key ? key.charAt(0).toUpperCase() + key.slice(1) : '',\n      }));\n\n      this.parseColumnsArray(arrayColumnsConfig, this.parsedColumns);\n    } else if (this.parsedData.length > 0) {\n      const firstRow = this.parsedData[0];\n      const arrayColumnsConfig = Object.keys(firstRow).map<ColumnConfig>(\n        key => ({\n          name: key,\n          header: key.charAt(0).toUpperCase() + key.slice(1),\n        }),\n      );\n\n      this.parseColumnsArray(arrayColumnsConfig, this.parsedColumns);\n    }\n  }\n\n  private deepEqual(a: any, b: any): boolean {\n    return JSON.stringify(a) === JSON.stringify(b);\n  }\n\n  /**\n   * Parses the data array and sets the state accordingly\n   * @param {any[]} newValue - New value of the data array\n   * @param {any[]} oldValue - Old value of the data array\n   * @returns {void}\n   */\n  private parseDataArray(newValue: any[], oldValue: any[]) {\n    // Ensure both are arrays for proper comparison\n    const safeNewValue = Array.isArray(newValue) ? newValue : [];\n    const safeOldValue = Array.isArray(oldValue) ? oldValue : [];\n\n    if (this.deepEqual(safeNewValue, safeOldValue)) {\n      return; // Deep comparison\n    }\n\n    this.parsedData = Array.isArray(newValue) ? newValue : [];\n  }\n\n  /**\n   * Parses the columns array and sets the state accordingly\n   * @param {ColumnConfig[]} newValue - New value of the columns array\n   * @param {ColumnConfig[]} oldValue - Old value of the columns array\n   * @returns {void}\n   */\n  private parseColumnsArray(\n    newValue: ColumnConfig[] | null | undefined,\n    oldValue: ColumnConfig[] | null | undefined,\n  ) {\n    // Ensure both are arrays for proper comparison\n    const safeNewValue = Array.isArray(newValue) ? newValue : [];\n    const safeOldValue = Array.isArray(oldValue) ? oldValue : [];\n\n    // Use a proper deep comparison function (e.g., Lodash's isEqual)\n    if (this.deepEqual(safeNewValue, safeOldValue)) {\n      return;\n    }\n\n    // Assign only after confirming changes\n    this.parsedColumns = safeNewValue;\n  }\n\n  private initializeTable() {\n    // Clear the previous table instance (if any)\n    this.table = null;\n\n    if (this.parsedColumns.length > 0) {\n      this.table = {\n        columns: this.parsedColumns,\n        data: this.getTableData(),\n      };\n    } else {\n      this.table = null;\n    }\n  }\n\n  private getTableData(): any[] {\n    if (\n      this.parsedData &&\n      Array.isArray(this.parsedData) &&\n      this.parsedData.length > 0\n    ) {\n      return [...this.parsedData];\n    } else {\n      return [];\n    }\n  }\n\n  // Helper function to get nested property value\n  private replaceKeyWithValue(obj: any, path: string) {\n    return (\n      path\n        .split('.')\n        .reduce(\n          (acc, key) => (acc && acc[key] !== undefined ? acc[key] : undefined),\n          obj,\n        ) ?? this.fallbackValue\n    );\n  }\n\n  private renderTemplate(template: Element | undefined, row: any) {\n    if (!template) {\n      return null;\n    }\n\n    // Handle <template> elements correctly\n    const templateContent =\n      template instanceof HTMLTemplateElement ? template.content : template;\n    const element = deepCopyElement(templateContent as HTMLElement);\n\n    // Replace placeholders in text content, attributes, and properties\n    element.querySelectorAll('*').forEach(el => {\n      // Replace placeholders in text content\n      this.replacePlaceholdersTextContent(el, row);\n\n      // Replace placeholders in attributes\n      this.replacePlaceholdersAttributes(el, row);\n\n      // Replace placeholders in properties\n      this.replacePlaceholdersProperties(el, row);\n    });\n\n    // Handle `data-bind-event`\n    element.querySelectorAll('[data-bind-event]').forEach(el => {\n      const bindEvent = el.getAttribute('data-bind-event') || '';\n      const splitted = bindEvent.split(':');\n\n      if (!bindEvent.includes(':') || splitted.length < 2) {\n        console.warn('Invalid data-bind-event format:', bindEvent);\n        return;\n      }\n\n      const eventType = splitted[0];\n      const keyAction = splitted[1];\n      const details = splitted.length > 2 ? splitted[2] : null;\n\n      el.addEventListener(eventType, () => {\n        const keys = details?.split(',') ?? [];\n\n        // Convert keys into a single object instead of an array of objects\n        const keyValue = keys.reduce((acc, key) => {\n          acc[key] = row?.[key];\n          return acc;\n        }, {} as Record<string, any>);\n\n        const action: ActionEvent = { keyAction, details: keyValue };\n\n        this.action.emit(action);\n      });\n    });\n\n    // Ensure Web Components are properly connected\n    setTimeout(() => {\n      element.querySelectorAll('*').forEach(child => {\n        if (typeof (child as any).connectedCallback === 'function') {\n          (child as any).connectedCallback();\n        }\n      });\n    }, 0);\n\n    return (\n      <div\n        ref={el => {\n          if (el) {\n            el.innerHTML = ''; // Remove existing content\n            el.appendChild(element); // Append new element\n          }\n        }}\n      ></div>\n    );\n  }\n\n  private replacePlaceholdersTextContent(element: Element, row: any) {\n    // ✅ Replace placeholders in text content\n    element.childNodes.forEach(node => {\n      if (node.nodeType === Node.TEXT_NODE) {\n        node.textContent = node.textContent.replace(/__([\\w.]+)__/g, (_, key) =>\n          this.replaceKeyWithValue(row, key),\n        );\n      }\n    });\n  }\n\n  private replacePlaceholdersAttributes(element: Element, row: any) {\n    // ✅ Replace placeholders in attributes\n    Array.from(element.attributes).forEach(attr => {\n      if (attr.value.includes('__')) {\n        attr.value = attr.value.replace(/__([\\w.]+)__/g, (_, key) =>\n          this.replaceKeyWithValue(row, key),\n        );\n      }\n    });\n  }\n\n  private replacePlaceholdersProperties(element: Element, row: any) {\n    // ✅ Dynamically extract relevant properties\n    const properties = new Set<string>();\n\n    // Collect only own enumerable properties\n    Object.keys(element).forEach(key => properties.add(key));\n\n    // Collect inherited properties from prototypes (HTMLElement -> Element -> Node)\n    let proto = Object.getPrototypeOf(element);\n    while (proto && proto !== HTMLElement.prototype) {\n      Object.keys(proto).forEach(key => properties.add(key));\n      proto = Object.getPrototypeOf(proto);\n    }\n\n    // ✅ Filter and copy only non-function properties and exclude irrelevant ones\n    properties.forEach(prop => {\n      if (\n        typeof (element as any)[prop] !== 'function' && // Ignore methods\n        !prop.startsWith('on') && // Ignore event listeners (onclick, oninput, etc.)\n        !excludedProps.has(prop) // 🚨 Prevent text duplication and irrelevant props\n      ) {\n        try {\n          const value = element[prop];\n\n          // ✅ Replace placeholders only if the value is a string\n          if (typeof value === 'string' && value.includes('__')) {\n            element[prop] = value.replace(/__([\\w.]+)__/g, (_, key: string) =>\n              this.replaceKeyWithValue(row, key),\n            ) as any; // ✅ TypeScript safe\n          }\n        } catch (error) {\n          console.warn(`Could not assign property ${prop}:`, error.message);\n        }\n      }\n    });\n  }\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  @Watch('columnsConfig')\n  parseColumns(newValue: ColumnConfig[], oldValue: ColumnConfig[]) {\n    this.parseColumnsArray(newValue, oldValue);\n  }\n\n  @Watch('columnsConfigJson')\n  parseJsonColumns(newValue: string | undefined, oldValue: ColumnConfig[]) {\n    try {\n      const newItems = newValue ? JSON.parse(newValue) : [];\n\n      this.parseColumnsArray(newItems, oldValue);\n    } catch (e) {\n      console.error('Invalid JSON format for columnsConfigJson:', e.message);\n      this.parsedColumns = [];\n    }\n  }\n\n  @Watch('data')\n  parseData(newValue: any[], oldValue: any[]) {\n    this.parseDataArray(newValue, oldValue);\n  }\n\n  @Watch('dataJson')\n  parseJsonData(newValue: string | undefined) {\n    try {\n      const newItems = newValue ? JSON.parse(newValue) : [];\n\n      this.parseDataArray(newItems, this.parsedData);\n    } catch (e) {\n      console.error('Invalid JSON format for dataJson:', e.message);\n      this.parsedData = [];\n    }\n  }\n\n  @Watch('parsedColumns')\n  @Watch('parsedData')\n  handleParsedChange() {\n    this.initializeTable();\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    this.cacheTemplates();\n\n    this.parseDataAndColumns();\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region EVENTS\n\n  @Event()\n  action: EventEmitter<ActionEvent>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    const headerGroups =\n      !this.table || this.table === undefined || this.parsedColumns.length === 0\n        ? []\n        : this.table.columns;\n\n    const rows =\n      !this.table || this.table === undefined || this.parsedData.length === 0\n        ? []\n        : this.table.data;\n\n    return (\n      <Host>\n        <div class=\"hidden\">\n          <slot></slot>\n        </div>\n\n        <slot name=\"before\"></slot>\n\n        {this.parsedColumns.length === 0 && this.parsedData.length === 0 ? (\n          <div class=\"no-data\">{this.noColumnsNoDataMessage}</div>\n        ) : (\n          <table class=\"table\">\n            {this.parsedColumns.length > 0 && headerGroups.length > 0 && (\n              <thead class=\"table-header\">\n                <tr>\n                  {headerGroups &&\n                    headerGroups.map(col => {\n                      return (\n                        <th key={col.name}>\n                          {this.renderTemplate(\n                            this.headerTemplateCache.get(col.name),\n                            {},\n                          ) || col.header}\n                        </th>\n                      );\n                    })}\n                </tr>\n              </thead>\n            )}\n            <tbody class=\"table-body\">\n              {!rows || rows.length === 0 ? (\n                <tr>\n                  <td colSpan={headerGroups.length || 12} class=\"no-data\">\n                    {this.noDataMessage}\n                  </td>\n                </tr>\n              ) : (\n                rows.map(row => (\n                  <tr key={JSON.stringify(row)}>\n                    {headerGroups.map(col => (\n                      <td>\n                        {this.renderTemplate(\n                          this.templateCache.get(col.name),\n                          row,\n                        ) ||\n                          (row[col.name] ?? this.fallbackValue)}\n                      </td>\n                    ))}\n                  </tr>\n                ))\n              )}\n            </tbody>\n          </table>\n        )}\n\n        <slot name=\"after\"></slot>\n      </Host>\n    );\n  }\n  // #endregion RENDER\n}\n"],"version":3}

package/dist/components/nv-toggle.js

@@ -2,7 +2,7 @@ import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-
 import { c as clsx } from './p-8a1a6e56.js';
 import { v as v4 } from './p-f5ff676c.js';
 
-const nvToggleCss = "nv-toggle{display:inline-flex;align-items:flex-start;gap:var(--form-gap-x);position:relative}nv-toggle:not([disabled],[readonly]) input,nv-toggle:not([disabled],[readonly]) label{cursor:pointer}nv-toggle.label-placement-before{flex-direction:row-reverse}nv-toggle[disabled]{opacity:0.5}nv-toggle 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:500;line-height:var(--form-label-line-height)}nv-toggle .input-container{position:relative;color:var(--components-form-shape-foreground-default)}nv-toggle .input-container:has(input[type=checkbox]:disabled:not([readonly])){color:var(--components-form-shape-foreground-disabled)}nv-toggle .input-container input[type=checkbox]{appearance:none;position:relative;display:flex;width:var(--form-toggle-width);height:var(--form-toggle-height);flex-direction:column;align-items:flex-start;border-radius:var(--form-toggle-radius);border-width:var(--form-toggle-border-width);border-style:solid;border-color:var(--components-form-field-border-default);background:var(--components-form-field-background-default)}nv-toggle .input-container input[type=checkbox]::after{content:\"\";display:block;width:var(--form-toggle-switch-dot-default);height:var(--form-toggle-switch-dot-default);background-color:var(--components-form-shape-foreground-switch-dot);border-radius:var(--radius-rounded-full);position:absolute;top:50%;left:25%;transform:translate(-50%, -50%)}nv-toggle .input-container input[type=checkbox]:hover{border-color:var(--components-form-field-border-hover)}nv-toggle .input-container input[type=checkbox]:focus{border-color:var(--components-form-field-border-default)}nv-toggle .input-container input[type=checkbox]:focus,nv-toggle .input-container input[type=checkbox]:focus-within{outline:none}nv-toggle .input-container input[type=checkbox]:focus-visible,nv-toggle .input-container input[type=checkbox]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-toggle .input-container input[type=checkbox]:checked{background:var(--components-form-field-background-checked);border-color:var(--components-form-field-background-checked)}nv-toggle .input-container input[type=checkbox]:checked::after{content:\"\";display:block;width:var(--form-toggle-switch-dot-default);height:var(--form-toggle-switch-dot-default);background-color:var(--components-form-shape-foreground-default);border-radius:var(--radius-rounded-full);position:absolute;top:50%;left:75%;transform:translate(-50%, -50%)}nv-toggle .input-container input[type=checkbox]:checked:focus{background:var(--components-form-field-background-checked);border-color:var(--components-form-field-border-focus)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]){box-shadow:unset;background:var(--components-form-field-background-disabled);border-color:var(--components-form-field-border-default)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]):checked::after{background-color:var(--components-form-shape-foreground-disabled)}nv-toggle .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:450;line-height:var(--form-description-line-height)}nv-toggle .text-container{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}";
+const nvToggleCss = "nv-toggle{display:inline-flex;align-items:flex-start;gap:var(--form-gap-x);position:relative}nv-toggle:not([disabled],[readonly]) input,nv-toggle:not([disabled],[readonly]) label{cursor:pointer}nv-toggle.label-placement-before{flex-direction:row-reverse}nv-toggle[disabled]{opacity:0.5}nv-toggle 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:500;line-height:var(--form-label-line-height)}nv-toggle 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-toggle .input-container{position:relative;color:var(--components-form-shape-foreground-default)}nv-toggle .input-container:has(input[type=checkbox]:disabled:not([readonly])){color:var(--components-form-shape-foreground-disabled)}nv-toggle .input-container input[type=checkbox]{appearance:none;position:relative;display:flex;width:var(--form-toggle-width);height:var(--form-toggle-height);flex-direction:column;align-items:flex-start;border-radius:var(--form-toggle-radius);border-width:var(--form-toggle-border-width);border-style:solid;border-color:var(--components-form-field-border-default);background:var(--components-form-field-background-default)}nv-toggle .input-container input[type=checkbox]::after{content:\"\";display:block;width:var(--form-toggle-switch-dot-default);height:var(--form-toggle-switch-dot-default);background-color:var(--components-form-shape-foreground-switch-dot);border-radius:var(--radius-rounded-full);position:absolute;top:50%;left:25%;transform:translate(-50%, -50%)}nv-toggle .input-container input[type=checkbox]:hover{border-color:var(--components-form-field-border-hover)}nv-toggle .input-container input[type=checkbox]:focus{border-color:var(--components-form-field-border-default)}nv-toggle .input-container input[type=checkbox]:focus,nv-toggle .input-container input[type=checkbox]:focus-within{outline:none}nv-toggle .input-container input[type=checkbox]:focus-visible,nv-toggle .input-container input[type=checkbox]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-toggle .input-container input[type=checkbox]:checked{background:var(--components-form-field-background-checked);border-color:var(--components-form-field-background-checked)}nv-toggle .input-container input[type=checkbox]:checked::after{content:\"\";display:block;width:var(--form-toggle-switch-dot-default);height:var(--form-toggle-switch-dot-default);background-color:var(--components-form-shape-foreground-default);border-radius:var(--radius-rounded-full);position:absolute;top:50%;left:75%;transform:translate(-50%, -50%)}nv-toggle .input-container input[type=checkbox]:checked:focus{background:var(--components-form-field-background-checked);border-color:var(--components-form-field-border-focus)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]){box-shadow:unset;background:var(--components-form-field-background-disabled);border-color:var(--components-form-field-border-default)}nv-toggle .input-container input[type=checkbox]:disabled:not([readonly]):checked::after{background-color:var(--components-form-shape-foreground-disabled)}nv-toggle .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:450;line-height:var(--form-description-line-height)}nv-toggle .text-container{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}";
 const NvToggleStyle0 = nvToggleCss;
 
 const NvToggle$1 = /*@__PURE__*/ proxyCustomElement(class NvToggle extends H {

package/dist/components/nv-toggle.js.map

@@ -1 +1 @@
-{"file":"nv-toggle.js","mappings":";;;;AAAA,MAAM,WAAW,GAAG,w+GAAw+G,CAAC;AAC7/G,uBAAe,WAAW;;MCyBbA,UAAQ;IANrB;;;;;;;;;;;;QAmBW,YAAO,GAAWC,EAAM,EAAE,CAAC;;;;;QAgC3B,cAAS,GAAY,KAAK,CAAC;;QAWpC,YAAO,GAAY,KAAK,CAAC;;QAIhB,aAAQ,GAAY,KAAK,CAAC;;;;;QAO1B,aAAQ,GAAY,KAAK,CAAC;KA2FpC;;;;;;;;IArEC,gBAAgB,CAAC,OAAgB;QAC/B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACnC;;;;;;IAQD,YAAY,CAAC,KAAY;QACvB,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B,CAAC;QAEhD,IAAI,MAAM,CAAC,IAAI,KAAK,UAAU,IAAI,MAAM,CAAC,EAAE,KAAK,IAAI,CAAC,OAAO,EAAE;YAC5D,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,EAAE;gBAClC,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,OAAO;aACR;YAED,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC;SAC/B;KACF;;;;IAMD,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,KAAK,EAAE,IAAI,CACT,IAAI,CAAC,cAAc,KAAK,QAAQ,IAAI,wBAAwB,CAC7D,IAED,4DAAK,KAAK,EAAC,iBAAiB,IAC1B,8DACE,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,IAAI,CAAC,OAAO,EAChB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,YAAY,EAAC,KAAK,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,EAC9B,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,EACxC,QAAQ,EAAE,IAAI,CAAC,QAAQ,GACvB,CACE,EAEN,4DAAK,KAAK,EAAC,gBAAgB,IACxB,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,gBAAgB,CAAC,MACrD,8DACE,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,iBAAiB,CAAC,IAEhD,6DAAM,IAAI,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CAChC,CACT,EAEA,CAAC,IAAI,CAAC,WAAW;YAChB,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,sBAAsB,CAAC,MAC7C,4DAAK,KAAK,EAAC,aAAa,IACtB,6DAAM,IAAI,EAAC,aAAa,IAAE,IAAI,CAAC,WAAW,CAAQ,CAC9C,CACP,CACG,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["NvToggle","uuidv4"],"sources":["src/components/nv-toggle/nv-toggle.scss?tag=nv-toggle","src/components/nv-toggle/nv-toggle.tsx"],"sourcesContent":["@import \"../../styles/focus-ring\";\n\n@mixin root-styles() {\n  display: inline-flex;\n  align-items: flex-start;\n  gap: var(--form-gap-x);\n  position: relative;\n\n  &:not([disabled], [readonly]) {\n    input,\n    label {\n      cursor: pointer;\n    }\n  }\n}\n\n@mixin label-before-styles() {\n  flex-direction: row-reverse;\n}\n\n@mixin label-styles() {\n  align-self: stretch;\n  color: var(--components-form-text-label-default);\n  font-family: \"TT Norms Pro\", sans-serif;\n  font-size: var(--form-label-font-size);\n  font-style: normal;\n  font-weight: 500;\n  line-height: var(--form-label-line-height);\n}\n\n@mixin description-styles() {\n  align-self: stretch;\n  color: var(--components-form-text-description-default);\n  font-family: \"TT Norms Pro\", sans-serif;\n  font-size: var(--form-description-font-size);\n  font-style: normal;\n  font-weight: 450;\n  line-height: var(--form-description-line-height);\n}\n\n@mixin text-container-styles() {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  flex: 1 0 0;\n}\n\n@mixin input-container-styles() {\n  position: relative;\n  color: var(--components-form-shape-foreground-default);\n\n  &:has(input[type=\"checkbox\"]:disabled:not([readonly])) {\n    color: var(--components-form-shape-foreground-disabled);\n  }\n}\n\n@mixin input-styles() {\n  appearance: none;\n  position: relative;\n  display: flex;\n  width: var(--form-toggle-width);\n  height: var(--form-toggle-height);\n  flex-direction: column;\n  align-items: flex-start;\n  border-radius: var(--form-toggle-radius);\n  border-width: var(--form-toggle-border-width);\n  border-style: solid;\n  border-color: var(--components-form-field-border-default);\n  background: var(--components-form-field-background-default);\n\n  &::after {\n    content: '';\n    display: block;\n    width: var(--form-toggle-switch-dot-default);\n    height: var(--form-toggle-switch-dot-default);\n    background-color: var(--components-form-shape-foreground-switch-dot);\n    border-radius: var(--radius-rounded-full);\n    position: absolute;\n    top: 50%;\n    left: 25%;\n    transform: translate(-50%, -50%);\n  }\n\n  &:hover {\n    border-color: var(--components-form-field-border-hover);\n  }\n\n  &:focus {\n    border-color: var(--components-form-field-border-default);\n  }\n\n  @include focus-ring();\n\n  &:checked {\n    background: var(--components-form-field-background-checked);\n    border-color: var(--components-form-field-background-checked);\n\n    &::after {\n      content: '';\n      display: block;\n      width: var(--form-toggle-switch-dot-default);\n      height: var(--form-toggle-switch-dot-default);\n      background-color: var(--components-form-shape-foreground-default);\n      border-radius: var(--radius-rounded-full);\n      position: absolute;\n      top: 50%;\n      left: 75%;\n      transform: translate(-50%, -50%);\n    }\n\n    &:focus {\n      background: var(--components-form-field-background-checked);\n      border-color: var(--components-form-field-border-focus);\n    }\n  }\n\n  &:disabled:not([readonly]) {\n    box-shadow: unset;\n    background: var(--components-form-field-background-disabled);\n    border-color: var(--components-form-field-border-default);\n\n    &:checked {\n      &::after {\n        background-color: var(--components-form-shape-foreground-disabled);\n      }\n    }\n  }\n}\n\nnv-toggle {\n  @include root-styles();\n\n  &.label-placement-before {\n    @include label-before-styles();\n  }\n\n  &[disabled] {\n    // TODO: Find a way to use the --components-form-opacity-disabled variable properly, right now it outputs a value of 50px instead of 0.5.\n    // opacity: var(--components-form-opacity-disabled); Error: Invalid value for --components-form-opacity-disabled (expected a <number> but got \"50px\")\n    opacity: 0.5;\n  }\n  label {\n    @include label-styles();\n  }\n\n  .input-container {\n    @include input-container-styles();\n\n    input[type=\"checkbox\"] {\n      @include input-styles();\n    }\n  }\n\n  .description {\n    @include description-styles();\n  }\n\n  .text-container {\n    @include text-container-styles();\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Watch,\n  Event,\n  EventEmitter,\n  Listen,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { type LabelPlacement } from '../../utils/constants';\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 */\n@Component({\n  tag: 'nv-toggle',\n  styleUrl: 'nv-toggle.scss',\n  shadow: false,\n  formAssociated: true,\n})\nexport class NvToggle {\n  @Element() el!: HTMLNvToggleElement;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Sets the ID for the radio button’s input element and the for attribute of\n   * the associated label. If no ID is provided, a random one will be\n   * automatically generated to ensure unique identification, facilitating\n   * proper label association and accessibility.\n   */\n  @Prop({ reflect: true })\n  readonly inputId: string = uuidv4();\n\n  /**\n   * The name attribute for the toggle input, used to reference the form data\n   * after submission.\n   */\n  @Prop({ reflect: true })\n  readonly name?: string;\n\n  /**\n   * The value attribute of the toggle input, representing the value sent on\n   * form submission when the toggle is checked.\n   */\n  @Prop({ reflect: true })\n  readonly value?: string;\n\n  /** The label displayed next to the toggle.*/\n  @Prop({ reflect: true })\n  readonly label?: string;\n\n  /**\n   * Determines the position of the label relative to the toggle, either\n   * 'start' (before) or 'end' (after).\n   */\n  @Prop({ reflect: true })\n  readonly labelPlacement: `${LabelPlacement}`;\n\n  /**\n   * Hides the label visually while still keeping it available for screen\n   * readers.\n   */\n  @Prop({ reflect: true })\n  readonly hideLabel: boolean = false;\n\n  /**\n   * A description providing additional context or information about the\n   * toggle.\n   */\n  @Prop({ reflect: true })\n  readonly description?: string;\n\n  /** Indicates whether the toggle is checked or not. */\n  @Prop({ reflect: true, mutable: true })\n  checked: boolean = false;\n\n  /** Disables the toggle, preventing user interaction. */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Sets the toggle to read-only, preventing user changes but still allowing\n   * focus and selection of text.\n   */\n  @Prop({ reflect: true })\n  readonly readonly: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emits when the checked state changes.\n   * @bind checked\n   */\n  @Event()\n  checkedChanged: EventEmitter<boolean>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  /**\n   * Watches for changes to the checked state and emits the new value.\n   * @param {boolean} checked - The new value of the checked state.\n   */\n  @Watch('checked')\n  onCheckedChanged(checked: boolean) {\n    this.checkedChanged.emit(checked);\n  }\n\n  /**\n   * Listens for the change event on the toggle input element and updates the checked state.\n   * the checked state of the host elements.\n   * @param {Event} event - The change event.\n   */\n  @Listen('change')\n  handleChange(event: Event) {\n    const target = event.target as HTMLInputElement;\n\n    if (target.type === 'checkbox' && target.id === this.inputId) {\n      if (this.readonly || this.disabled) {\n        event.preventDefault();\n        return;\n      }\n\n      this.checked = target.checked;\n    }\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        class={clsx(\n          this.labelPlacement === 'before' && 'label-placement-before',\n        )}\n      >\n        <div class=\"input-container\">\n          <input\n            type=\"checkbox\"\n            id={this.inputId}\n            name={this.name}\n            autocomplete=\"off\"\n            value={this.value}\n            checked={Boolean(this.checked)}\n            disabled={this.disabled || this.readonly}\n            readonly={this.readonly}\n          />\n        </div>\n\n        <div class=\"text-container\">\n          {(this.label || this.el.querySelector('[slot=\"label\"]')) && (\n            <label\n              htmlFor={this.inputId}\n              class={clsx(this.hideLabel && 'visually-hidden')}\n            >\n              <slot name=\"label\">{this.label}</slot>\n            </label>\n          )}\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        </div>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}
+{"file":"nv-toggle.js","mappings":";;;;AAAA,MAAM,WAAW,GAAG,uoHAAuoH,CAAC;AAC5pH,uBAAe,WAAW;;MCyBbA,UAAQ;IANrB;;;;;;;;;;;;QAmBW,YAAO,GAAWC,EAAM,EAAE,CAAC;;;;;QAgC3B,cAAS,GAAY,KAAK,CAAC;;QAWpC,YAAO,GAAY,KAAK,CAAC;;QAIhB,aAAQ,GAAY,KAAK,CAAC;;;;;QAO1B,aAAQ,GAAY,KAAK,CAAC;KA2FpC;;;;;;;;IArEC,gBAAgB,CAAC,OAAgB;QAC/B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACnC;;;;;;IAQD,YAAY,CAAC,KAAY;QACvB,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B,CAAC;QAEhD,IAAI,MAAM,CAAC,IAAI,KAAK,UAAU,IAAI,MAAM,CAAC,EAAE,KAAK,IAAI,CAAC,OAAO,EAAE;YAC5D,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,EAAE;gBAClC,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,OAAO;aACR;YAED,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC;SAC/B;KACF;;;;IAMD,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,KAAK,EAAE,IAAI,CACT,IAAI,CAAC,cAAc,KAAK,QAAQ,IAAI,wBAAwB,CAC7D,IAED,4DAAK,KAAK,EAAC,iBAAiB,IAC1B,8DACE,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,IAAI,CAAC,OAAO,EAChB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,YAAY,EAAC,KAAK,EAClB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,OAAO,EAAE,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,EAC9B,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,EACxC,QAAQ,EAAE,IAAI,CAAC,QAAQ,GACvB,CACE,EAEN,4DAAK,KAAK,EAAC,gBAAgB,IACxB,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,gBAAgB,CAAC,MACrD,8DACE,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,iBAAiB,CAAC,IAEhD,6DAAM,IAAI,EAAC,OAAO,IAAE,IAAI,CAAC,KAAK,CAAQ,CAChC,CACT,EAEA,CAAC,IAAI,CAAC,WAAW;YAChB,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,sBAAsB,CAAC,MAC7C,4DAAK,KAAK,EAAC,aAAa,IACtB,6DAAM,IAAI,EAAC,aAAa,IAAE,IAAI,CAAC,WAAW,CAAQ,CAC9C,CACP,CACG,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["NvToggle","uuidv4"],"sources":["src/components/nv-toggle/nv-toggle.scss?tag=nv-toggle","src/components/nv-toggle/nv-toggle.tsx"],"sourcesContent":["@use \"../../styles/utils\" as utils;\n@import \"../../styles/focus-ring\";\n\n@mixin root-styles() {\n  display: inline-flex;\n  align-items: flex-start;\n  gap: var(--form-gap-x);\n  position: relative;\n\n  &:not([disabled], [readonly]) {\n    input,\n    label {\n      cursor: pointer;\n    }\n  }\n}\n\n@mixin label-before-styles() {\n  flex-direction: row-reverse;\n}\n\n@mixin label-styles() {\n  align-self: stretch;\n  color: var(--components-form-text-label-default);\n  font-family: \"TT Norms Pro\", sans-serif;\n  font-size: var(--form-label-font-size);\n  font-style: normal;\n  font-weight: 500;\n  line-height: var(--form-label-line-height);\n}\n\n@mixin description-styles() {\n  align-self: stretch;\n  color: var(--components-form-text-description-default);\n  font-family: \"TT Norms Pro\", sans-serif;\n  font-size: var(--form-description-font-size);\n  font-style: normal;\n  font-weight: 450;\n  line-height: var(--form-description-line-height);\n}\n\n@mixin text-container-styles() {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  flex: 1 0 0;\n}\n\n@mixin input-container-styles() {\n  position: relative;\n  color: var(--components-form-shape-foreground-default);\n\n  &:has(input[type=\"checkbox\"]:disabled:not([readonly])) {\n    color: var(--components-form-shape-foreground-disabled);\n  }\n}\n\n@mixin input-styles() {\n  appearance: none;\n  position: relative;\n  display: flex;\n  width: var(--form-toggle-width);\n  height: var(--form-toggle-height);\n  flex-direction: column;\n  align-items: flex-start;\n  border-radius: var(--form-toggle-radius);\n  border-width: var(--form-toggle-border-width);\n  border-style: solid;\n  border-color: var(--components-form-field-border-default);\n  background: var(--components-form-field-background-default);\n\n  &::after {\n    content: '';\n    display: block;\n    width: var(--form-toggle-switch-dot-default);\n    height: var(--form-toggle-switch-dot-default);\n    background-color: var(--components-form-shape-foreground-switch-dot);\n    border-radius: var(--radius-rounded-full);\n    position: absolute;\n    top: 50%;\n    left: 25%;\n    transform: translate(-50%, -50%);\n  }\n\n  &:hover {\n    border-color: var(--components-form-field-border-hover);\n  }\n\n  &:focus {\n    border-color: var(--components-form-field-border-default);\n  }\n\n  @include focus-ring();\n\n  &:checked {\n    background: var(--components-form-field-background-checked);\n    border-color: var(--components-form-field-background-checked);\n\n    &::after {\n      content: '';\n      display: block;\n      width: var(--form-toggle-switch-dot-default);\n      height: var(--form-toggle-switch-dot-default);\n      background-color: var(--components-form-shape-foreground-default);\n      border-radius: var(--radius-rounded-full);\n      position: absolute;\n      top: 50%;\n      left: 75%;\n      transform: translate(-50%, -50%);\n    }\n\n    &:focus {\n      background: var(--components-form-field-background-checked);\n      border-color: var(--components-form-field-border-focus);\n    }\n  }\n\n  &:disabled:not([readonly]) {\n    box-shadow: unset;\n    background: var(--components-form-field-background-disabled);\n    border-color: var(--components-form-field-border-default);\n\n    &:checked {\n      &::after {\n        background-color: var(--components-form-shape-foreground-disabled);\n      }\n    }\n  }\n}\n\nnv-toggle {\n  @include root-styles();\n\n  &.label-placement-before {\n    @include label-before-styles();\n  }\n\n  &[disabled] {\n    // TODO: Find a way to use the --components-form-opacity-disabled variable properly, right now it outputs a value of 50px instead of 0.5.\n    // opacity: var(--components-form-opacity-disabled); Error: Invalid value for --components-form-opacity-disabled (expected a <number> but got \"50px\")\n    opacity: 0.5;\n  }\n  label {\n    @include label-styles();\n\n    &.visually-hidden {\n      @include utils.visually-hidden();\n    }\n  }\n\n  .input-container {\n    @include input-container-styles();\n\n    input[type=\"checkbox\"] {\n      @include input-styles();\n    }\n  }\n\n  .description {\n    @include description-styles();\n  }\n\n  .text-container {\n    @include text-container-styles();\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Watch,\n  Event,\n  EventEmitter,\n  Listen,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { type LabelPlacement } from '../../utils/constants';\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 */\n@Component({\n  tag: 'nv-toggle',\n  styleUrl: 'nv-toggle.scss',\n  shadow: false,\n  formAssociated: true,\n})\nexport class NvToggle {\n  @Element() el!: HTMLNvToggleElement;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Sets the ID for the radio button’s input element and the for attribute of\n   * the associated label. If no ID is provided, a random one will be\n   * automatically generated to ensure unique identification, facilitating\n   * proper label association and accessibility.\n   */\n  @Prop({ reflect: true })\n  readonly inputId: string = uuidv4();\n\n  /**\n   * The name attribute for the toggle input, used to reference the form data\n   * after submission.\n   */\n  @Prop({ reflect: true })\n  readonly name?: string;\n\n  /**\n   * The value attribute of the toggle input, representing the value sent on\n   * form submission when the toggle is checked.\n   */\n  @Prop({ reflect: true })\n  readonly value?: string;\n\n  /** The label displayed next to the toggle.*/\n  @Prop({ reflect: true })\n  readonly label?: string;\n\n  /**\n   * Determines the position of the label relative to the toggle, either\n   * 'start' (before) or 'end' (after).\n   */\n  @Prop({ reflect: true })\n  readonly labelPlacement: `${LabelPlacement}`;\n\n  /**\n   * Hides the label visually while still keeping it available for screen\n   * readers.\n   */\n  @Prop({ reflect: true })\n  readonly hideLabel: boolean = false;\n\n  /**\n   * A description providing additional context or information about the\n   * toggle.\n   */\n  @Prop({ reflect: true })\n  readonly description?: string;\n\n  /** Indicates whether the toggle is checked or not. */\n  @Prop({ reflect: true, mutable: true })\n  checked: boolean = false;\n\n  /** Disables the toggle, preventing user interaction. */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Sets the toggle to read-only, preventing user changes but still allowing\n   * focus and selection of text.\n   */\n  @Prop({ reflect: true })\n  readonly readonly: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emits when the checked state changes.\n   * @bind checked\n   */\n  @Event()\n  checkedChanged: EventEmitter<boolean>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  /**\n   * Watches for changes to the checked state and emits the new value.\n   * @param {boolean} checked - The new value of the checked state.\n   */\n  @Watch('checked')\n  onCheckedChanged(checked: boolean) {\n    this.checkedChanged.emit(checked);\n  }\n\n  /**\n   * Listens for the change event on the toggle input element and updates the checked state.\n   * the checked state of the host elements.\n   * @param {Event} event - The change event.\n   */\n  @Listen('change')\n  handleChange(event: Event) {\n    const target = event.target as HTMLInputElement;\n\n    if (target.type === 'checkbox' && target.id === this.inputId) {\n      if (this.readonly || this.disabled) {\n        event.preventDefault();\n        return;\n      }\n\n      this.checked = target.checked;\n    }\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        class={clsx(\n          this.labelPlacement === 'before' && 'label-placement-before',\n        )}\n      >\n        <div class=\"input-container\">\n          <input\n            type=\"checkbox\"\n            id={this.inputId}\n            name={this.name}\n            autocomplete=\"off\"\n            value={this.value}\n            checked={Boolean(this.checked)}\n            disabled={this.disabled || this.readonly}\n            readonly={this.readonly}\n          />\n        </div>\n\n        <div class=\"text-container\">\n          {(this.label || this.el.querySelector('[slot=\"label\"]')) && (\n            <label\n              htmlFor={this.inputId}\n              class={clsx(this.hideLabel && 'visually-hidden')}\n            >\n              <slot name=\"label\">{this.label}</slot>\n            </label>\n          )}\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        </div>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}

package/dist/components/nv-tooltip.js

@@ -1,4 +1,4 @@
-import { N as NvTooltip$1, d as defineCustomElement$1 } from './p-a8b5969f.js';
+import { N as NvTooltip$1, d as defineCustomElement$1 } from './p-3561c093.js';
 
 const NvTooltip = NvTooltip$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/{p-7f142767.js → p-0f59f38e.js}

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

package/dist/components/p-0f59f38e.js.map

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

package/dist/components/{p-1a4f9c97.js → p-103756d6.js}

@@ -64,14 +64,16 @@ const NvButton = /*@__PURE__*/ proxyCustomElement(class NvButton extends H {
          * @param {Event} event - The click event.
          */
         this.handleButtonClick = (event) => {
+            var _a;
             if (this.loading || this.disabled) {
                 event.preventDefault();
                 return;
             }
-            if (this.form && this.type !== ButtonType.Button) {
+            if (this.type !== ButtonType.Button &&
+                (this.form || ((_a = this.internals) === null || _a === void 0 ? void 0 : _a.form))) {
                 this.processFormAction();
             }
-            else if (this.form) {
+            else if (this.form && this.type === ButtonType.Button) {
                 console.warn('Button has a form id but is not of type submit or reset so no form action will be processed.', `Button:`, this.el);
             }
         };
@@ -141,7 +143,7 @@ const NvButton = /*@__PURE__*/ proxyCustomElement(class NvButton extends H {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'df051a1d21cf540e4b1d0d086dab611f586943db', role: "button", tabindex: "0", onClick: this.handleButtonClick }, this.loading && (h("nv-loader", { key: '52219fff7f98e65f08d60b1d57a7135ab99a7c07', size: this.size === ButtonSize.Large ? 'sm' : 'xs' })), h("slot", { key: '5536d1a79a179b02f694f764b6890b232227877e', name: "leading-icon" }), h("slot", { key: '9fc9e638a005de084a89b7981e339cb6ab8dbc77' }), h("slot", { key: 'fe0520428b9e9510e9e68937049ff5003816f818', name: "trailing-icon" })));
+        return (h(Host, { key: '2e0084462020783fc79f59bb8f9700efde5326f9', role: "button", tabindex: "0", onClick: this.handleButtonClick }, this.loading && (h("nv-loader", { key: '71f6b82ad0a48bd1e80f12685e0513acdb2b5431', size: this.size === ButtonSize.Large ? 'sm' : 'xs' })), h("slot", { key: 'eaeb55591a8f5e25707e12e62c0a85d6bd869fad', name: "leading-icon" }), h("slot", { key: 'ad6e7d861a3becdf31643c6cbc49a122f89d36eb' }), h("slot", { key: '6c3eeecc5a2c99d01a7b555b8f7d314d6f985012', name: "trailing-icon" })));
     }
     static get formAssociated() { return true; }
     get el() { return this; }
@@ -186,4 +188,4 @@ defineCustomElement();
 
 export { NvButton as N, defineCustomElement as d };
 
-//# sourceMappingURL=p-1a4f9c97.js.map
+//# sourceMappingURL=p-103756d6.js.map

package/dist/components/p-103756d6.js.map

@@ -0,0 +1 @@
+{"file":"p-103756d6.js","mappings":"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","names":[],"sources":["src/components/nv-button/styles/nv-button.scss?tag=nv-button","src/components/nv-button/nv-button.tsx"],"sourcesContent":["@use \"./mixins\" as *;\n\n// Make sure to update nv-button class in the tailwind-components.scss file when\n// you add new styles or change the structure here.\nnv-button {\n  @include root-styles();\n\n  @each $size in $sizes {\n    &[size=\"#{$size}\"] {\n      @include size-styles($size);\n    }\n  }\n\n  @each $emphasis in $emphases {\n    &[emphasis=\"#{$emphasis}\"] {\n      @include emphasis-styles($emphasis);\n\n      &[active]:not([active=\"false\"]) {\n        @include active-styles($emphasis);\n      }\n\n      &[danger]:not([danger=\"false\"]) {\n        @include danger-styles($emphasis);\n      }\n    }\n  }\n\n  &[fluid]:not([fluid=\"false\"]) {\n    @include fluid-styles();\n  }\n\n  &[loading]:not([loading=\"false\"]) {\n    [slot=\"leading-icon\"] {\n      display: none;\n    }\n  }\n}\n","import {\n  Component,\n  Listen,\n  Host,\n  h,\n  Prop,\n  AttachInternals,\n  Element,\n  Watch,\n} from '@stencil/core';\n\nimport { ButtonSize, ButtonEmphasis, ButtonType } from '../../utils/constants';\n\n/**\n * @slot default - Content of the button.\n * @slot leading-icon - Icon before the label.\n * @slot trailing-icon - Icon after the label.\n */\n@Component({\n  tag: 'nv-button',\n  shadow: false,\n  formAssociated: true,\n  styleUrl: 'styles/nv-button.scss',\n})\nexport class NvButton {\n  @AttachInternals() internals: ElementInternals;\n  @Element() el: HTMLNvButtonElement;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Determines how large or small the button appears, allowing for\n   * customization of the button's dimensions to fit different design\n   * specifications and user needs.\n   */\n  @Prop({ reflect: true })\n  readonly size: `${ButtonSize}` = 'md';\n\n  /**\n   * Adjusts the button's emphasis to make it more or less visually prominent\n   * to users. Use this to draw attention to important actions or reduce focus\n   * on less critical ones\n   */\n  @Prop({ reflect: true })\n  readonly emphasis: `${ButtonEmphasis}` = 'high';\n\n  /**\n   * Use this prop to highlight the button when it represents the current page\n   * or active selection. This helps users understand their navigation context.\n   */\n  @Prop({ reflect: true })\n  readonly active: boolean = false;\n\n  /**\n   * Applies styling that visually indicates the button represents a dangerous\n   * action.\n   */\n  @Prop({ reflect: true })\n  readonly danger: boolean = false;\n\n  /**\n   * Set this to true to show a spinner on the button, letting users know that\n   * their action is being processed. It helps improve user experience by\n   * indicating ongoing activities.\n   */\n  @Prop({ reflect: true, mutable: true })\n  loading: boolean = false;\n\n  /**\n   * Disables the button, preventing user interaction.\n   */\n  @Prop({ reflect: true, mutable: true })\n  disabled: boolean = false;\n\n  /**\n   * Allows the button to stretch and fill the entire width of its container.\n   */\n  @Prop({ reflect: true })\n  readonly fluid: boolean = false;\n\n  /**\n   * Sets the button type to control its function in forms. Use 'submit' to send\n   * form data, 'reset' to clear the form, or 'button' for a standard button\n   * that doesn't interact with form submission by default.\n   */\n  @Prop({ reflect: true })\n  readonly type: `${ButtonType}` = 'button';\n\n  /**\n   * Sets the form associated with the button in case the (submit) button is not a child of a form.\n   * Matches the native HTML button 'form' attribute behavior.\n   */\n  @Prop({ reflect: true })\n  readonly form: string;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region METHODS\n\n  /**\n   * Handles button click events, managing form actions and disabled states.\n   * Prevents default behavior when button is disabled or loading, and\n   * processes form submissions/resets when appropriate.\n   * @param {Event} event - The click event.\n   */\n  private handleButtonClick = (event: Event): void => {\n    if (this.loading || this.disabled) {\n      event.preventDefault();\n      return;\n    }\n\n    if (\n      this.type !== ButtonType.Button &&\n      (this.form || this.internals?.form)\n    ) {\n      this.processFormAction();\n    } else if (this.form && this.type === ButtonType.Button) {\n      console.warn(\n        'Button has a form id but is not of type submit or reset so no form action will be processed.',\n        `Button:`,\n        this.el,\n      );\n    }\n  };\n\n  /**\n   * Processes form-related actions by finding the associated form element\n   * and triggering the appropriate action (submit/reset) based on button type.\n   * Falls back to ElementInternals form if no explicit form ID is provided.\n   */\n  private processFormAction = (): void => {\n    const formElement = this.form\n      ? (document.getElementById(this.form) as HTMLFormElement)\n      : this.internals?.form;\n\n    if (!formElement) {\n      console.warn(\n        'No form element found.',\n        `Form ID: ${this.form || 'Not provided'}`,\n        `Internals form:`,\n        this.internals?.form,\n      );\n      return;\n    }\n\n    switch (this.type) {\n      case ButtonType.Submit:\n        formElement.requestSubmit();\n        break;\n      case ButtonType.Reset:\n        formElement.reset();\n        break;\n    }\n  };\n\n  //#endregion METHODS\n  /****************************************************************************/\n  //#region EVENTS\n\n  @Listen('keydown', { passive: false })\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      this.el.click();\n    }\n  }\n\n  @Listen('touchstart', { passive: false })\n  handleTouchStart(event: TouchEvent) {\n    if (event.touches.length > 1) return;\n    event.preventDefault();\n    this.el.click();\n  }\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  @Watch('loading')\n  handleLoadingChange(loading: boolean) {\n    this.loading = loading;\n    this.disabled = loading;\n  }\n\n  @Watch('disabled')\n  handleDisabledChange(disabled: boolean) {\n    if (this.loading) {\n      this.disabled = this.loading;\n    } else {\n      this.disabled = disabled;\n    }\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    if (this.loading) {\n      this.disabled = this.loading;\n    }\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host role=\"button\" tabindex=\"0\" onClick={this.handleButtonClick}>\n        {this.loading && (\n          <nv-loader\n            size={this.size === ButtonSize.Large ? 'sm' : 'xs'}\n          ></nv-loader>\n        )}\n\n        <slot name=\"leading-icon\"></slot>\n        <slot></slot>\n        <slot name=\"trailing-icon\"></slot>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}

package/dist/components/{p-a8b5969f.js → p-3561c093.js}

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-1c45c0f2.js';
-import { d as defineCustomElement$1 } from './p-057ae4f2.js';
+import { d as defineCustomElement$1 } from './p-e46c2e31.js';
 
 const nvTooltipCss = "nv-tooltip{display:inline-block;position:relative}nv-tooltip:has([fluid]:not([fluid=false])){display:block}nv-tooltip [data-scope=popover]{background:var(--components-tooltip-background);color:var(--components-tooltip-text);font-weight:var(--font-weight-medium-emphasis);padding:var(--tooltip-padding-y) var(--tooltip-padding-x);font-size:var(--tooltip-font-size);border-radius:var(--tooltip-radius);border:none;box-shadow:0px var(--shadow-y-axis-lg-1) var(--shadow-blur-lg-1) var(--shadow-spread-lg-1) var(--shadow-color-opacity-1), 0px var(--shadow-y-axis-lg-2) var(--shadow-blur-lg-2) var(--shadow-spread-lg-2) var(--shadow-color-opacity-2)}nv-tooltip [data-scope=popover] [data-scope=arrow]{background:var(--components-tooltip-background);box-shadow:none;border:none}";
 const NvTooltipStyle0 = nvTooltipCss;
@@ -34,7 +34,7 @@ const NvTooltip = /*@__PURE__*/ proxyCustomElement(class NvTooltip extends H {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '58df5290d4cfe97638f0f0f0796dcb318b3c3871' }, h("slot", { key: '49592f157bf2a0369df4ee70bf1ba003a694cd9e' }), h("nv-popover", { key: 'e47234d1b2cb4be5f8cfc5e1c797dc7769eed11e', triggerMode: "hover", hasArrow: true, placement: this.placement, triggerElement: this.triggerElement, groupName: 'tooltip', enterDelay: this.enterDelay }, h("p", { key: '798b50640a27acbea723d6404fb41265454e9648', slot: "content" }, this.message), h("slot", { key: '8122e778c2453d16924be738120a570f0c0474fb', name: "content" }))));
+        return (h(Host, { key: '8cd2c98bb131f251183acb9af66c9f6f9756ea95' }, h("slot", { key: 'fe6b19ecbf81c75579d2eda7f420dba67d17f6b1' }), h("nv-popover", { key: '4bb59ab06f861d3892de8122ef12eacacb8b4ad5', triggerMode: "hover", hasArrow: true, placement: this.placement, triggerElement: this.triggerElement, groupName: 'tooltip', enterDelay: this.enterDelay }, h("p", { key: '1f6eca5114ef857086f1263adb806894d5e8e49e', slot: "content" }, this.message), h("slot", { key: '7a359b89785621df4fb4f1c499d4a295f4112aed', name: "content" }))));
     }
     get el() { return this; }
     static get style() { return NvTooltipStyle0; }
@@ -66,4 +66,4 @@ defineCustomElement();
 
 export { NvTooltip as N, defineCustomElement as d };
 
-//# sourceMappingURL=p-a8b5969f.js.map
+//# sourceMappingURL=p-3561c093.js.map

package/dist/components/{p-a8b5969f.js.map → p-3561c093.js.map}

@@ -1 +1 @@
-{"file":"p-a8b5969f.js","mappings":";;;AAAA,MAAM,YAAY,GAAG,qwBAAqwB,CAAC;AAC3xB,wBAAe,YAAY;;MCWd,SAAS;IALtB;;;;;;;;QAiCW,cAAS,GAAc,QAAQ,CAAC;;;;;;QAQhC,eAAU,GAAW,CAAC,CAAC;KAsCjC;;;;IAhCC,iBAAiB;QACf,IAAI,CAAC,IAAI,CAAC,cAAc;YACtB,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,KAAK;gBAC3D,OAAO,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;aAC5C,CAAC,CAAC;KACN;;;;IAMD,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,8DAAa,EAEb,mEACE,WAAW,EAAC,OAAO,EACnB,QAAQ,QACR,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,IAAI,CAAC,UAAU,IAE3B,0DAAG,IAAI,EAAC,SAAS,IAAE,IAAI,CAAC,OAAO,CAAK,EACpC,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACjB,CACR,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-tooltip/nv-tooltip.scss?tag=nv-tooltip","src/components/nv-tooltip/nv-tooltip.tsx"],"sourcesContent":["@mixin root-styles() {\n  display: inline-block;\n  position: relative;\n  &:has([fluid]:not([fluid='false'])) {\n    display: block;\n  }\n}\n\n@mixin tooltip-styles() {\n  background: var(--components-tooltip-background);\n  color: var(--components-tooltip-text);\n  font-weight: var(--font-weight-medium-emphasis);\n  padding: var(--tooltip-padding-y) var(--tooltip-padding-x);\n  font-size: var(--tooltip-font-size);\n  border-radius: var(--tooltip-radius);\n  border: none;\n  box-shadow:\n    0px var(--shadow-y-axis-lg-1) var(--shadow-blur-lg-1)\n    var(--shadow-spread-lg-1) var(--shadow-color-opacity-1),\n    0px var(--shadow-y-axis-lg-2) var(--shadow-blur-lg-2)\n    var(--shadow-spread-lg-2) var(--shadow-color-opacity-2);\n}\n\n@mixin arrow-styles() {\n  background: var(--components-tooltip-background);\n  box-shadow: none;\n  border: none;\n}\n\nnv-tooltip {\n  @include root-styles();\n\n  [data-scope='popover'] {\n    @include tooltip-styles();\n\n    [data-scope='arrow'] {\n      @include arrow-styles();\n    }\n  }\n}\n","import { Component, Host, h, Element, Prop } from '@stencil/core';\nimport type { Placement } from '@floating-ui/dom';\n\n/**\n * @slot default - Content to be placed as the trigger.\n * @slot content - Content to be placed within the popover. Use for custom html, will render under the message.\n */\n@Component({\n  tag: 'nv-tooltip',\n  styleUrl: 'nv-tooltip.scss',\n  shadow: false,\n})\nexport class NvTooltip {\n  @Element() el: HTMLNvTooltipElement;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * @internal\n   * Accepts a reference to the DOM element acting as the popover trigger. This\n   * should be used when the slot for the trigger is not defined.\n   */\n  @Prop({ mutable: true })\n  triggerElement: Element;\n\n  /**\n   * A string representing the text to be displayed inside the tooltip. This\n   * content is shown when the tooltip is activated by the user, such as on\n   * hover or focus events.\n   */\n  @Prop({ reflect: true })\n  readonly message: string;\n\n  /**\n   * Decides where the tooltip shows up next to the element it’s linked to\n   * (above, below, to the sides). If there isn’t enough room, it will adjust\n   * it's position on the axis to fit on the screen, so users can always see it.\n   */\n  @Prop({ reflect: true })\n  readonly placement: Placement = 'bottom';\n\n  /**\n   * Controls how long (in milliseconds) the tooltip waits to show after you\n   * hover over or focus on an element. If you move away before the delay is up,\n   * the tooltip won’t appear.\n   */\n  @Prop({ reflect: true })\n  readonly enterDelay: number = 0;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    if (!this.triggerElement)\n      this.triggerElement = Array.from(this.el.children).find(child => {\n        return child.getAttribute('slot') === null;\n      });\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n\n        <nv-popover\n          triggerMode=\"hover\"\n          hasArrow\n          placement={this.placement}\n          triggerElement={this.triggerElement}\n          groupName={'tooltip'}\n          enterDelay={this.enterDelay}\n        >\n          <p slot=\"content\">{this.message}</p>\n          <slot name=\"content\"></slot>\n        </nv-popover>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}
+{"file":"p-3561c093.js","mappings":";;;AAAA,MAAM,YAAY,GAAG,qwBAAqwB,CAAC;AAC3xB,wBAAe,YAAY;;MCWd,SAAS;IALtB;;;;;;;;QAiCW,cAAS,GAAc,QAAQ,CAAC;;;;;;QAQhC,eAAU,GAAW,CAAC,CAAC;KAsCjC;;;;IAhCC,iBAAiB;QACf,IAAI,CAAC,IAAI,CAAC,cAAc;YACtB,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,KAAK;gBAC3D,OAAO,KAAK,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;aAC5C,CAAC,CAAC;KACN;;;;IAMD,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,8DAAa,EAEb,mEACE,WAAW,EAAC,OAAO,EACnB,QAAQ,QACR,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,cAAc,EAAE,IAAI,CAAC,cAAc,EACnC,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,IAAI,CAAC,UAAU,IAE3B,0DAAG,IAAI,EAAC,SAAS,IAAE,IAAI,CAAC,OAAO,CAAK,EACpC,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACjB,CACR,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/nv-tooltip/nv-tooltip.scss?tag=nv-tooltip","src/components/nv-tooltip/nv-tooltip.tsx"],"sourcesContent":["@mixin root-styles() {\n  display: inline-block;\n  position: relative;\n  &:has([fluid]:not([fluid='false'])) {\n    display: block;\n  }\n}\n\n@mixin tooltip-styles() {\n  background: var(--components-tooltip-background);\n  color: var(--components-tooltip-text);\n  font-weight: var(--font-weight-medium-emphasis);\n  padding: var(--tooltip-padding-y) var(--tooltip-padding-x);\n  font-size: var(--tooltip-font-size);\n  border-radius: var(--tooltip-radius);\n  border: none;\n  box-shadow:\n    0px var(--shadow-y-axis-lg-1) var(--shadow-blur-lg-1)\n    var(--shadow-spread-lg-1) var(--shadow-color-opacity-1),\n    0px var(--shadow-y-axis-lg-2) var(--shadow-blur-lg-2)\n    var(--shadow-spread-lg-2) var(--shadow-color-opacity-2);\n}\n\n@mixin arrow-styles() {\n  background: var(--components-tooltip-background);\n  box-shadow: none;\n  border: none;\n}\n\nnv-tooltip {\n  @include root-styles();\n\n  [data-scope='popover'] {\n    @include tooltip-styles();\n\n    [data-scope='arrow'] {\n      @include arrow-styles();\n    }\n  }\n}\n","import { Component, Host, h, Element, Prop } from '@stencil/core';\nimport type { Placement } from '@floating-ui/dom';\n\n/**\n * @slot default - Content to be placed as the trigger.\n * @slot content - Content to be placed within the popover. Use for custom html, will render under the message.\n */\n@Component({\n  tag: 'nv-tooltip',\n  styleUrl: 'nv-tooltip.scss',\n  shadow: false,\n})\nexport class NvTooltip {\n  @Element() el: HTMLNvTooltipElement;\n\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * @internal\n   * Accepts a reference to the DOM element acting as the popover trigger. This\n   * should be used when the slot for the trigger is not defined.\n   */\n  @Prop({ reflect: false, mutable: true })\n  triggerElement: Element;\n\n  /**\n   * A string representing the text to be displayed inside the tooltip. This\n   * content is shown when the tooltip is activated by the user, such as on\n   * hover or focus events.\n   */\n  @Prop({ reflect: true })\n  readonly message: string;\n\n  /**\n   * Decides where the tooltip shows up next to the element it’s linked to\n   * (above, below, to the sides). If there isn’t enough room, it will adjust\n   * it's position on the axis to fit on the screen, so users can always see it.\n   */\n  @Prop({ reflect: true })\n  readonly placement: Placement = 'bottom';\n\n  /**\n   * Controls how long (in milliseconds) the tooltip waits to show after you\n   * hover over or focus on an element. If you move away before the delay is up,\n   * the tooltip won’t appear.\n   */\n  @Prop({ reflect: true })\n  readonly enterDelay: number = 0;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region LIFECYCLE\n\n  componentWillLoad() {\n    if (!this.triggerElement)\n      this.triggerElement = Array.from(this.el.children).find(child => {\n        return child.getAttribute('slot') === null;\n      });\n  }\n\n  //#endregion LIFECYCLE\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n\n        <nv-popover\n          triggerMode=\"hover\"\n          hasArrow\n          placement={this.placement}\n          triggerElement={this.triggerElement}\n          groupName={'tooltip'}\n          enterDelay={this.enterDelay}\n        >\n          <p slot=\"content\">{this.message}</p>\n          <slot name=\"content\"></slot>\n        </nv-popover>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"],"version":3}

package/dist/components/{p-1e095bba.js → p-3b096098.js}

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-1c45c0f2.js';
 import { c as clsx } from './p-8a1a6e56.js';
-import { d as defineCustomElement$2 } from './p-ebf24fd0.js';
+import { d as defineCustomElement$2 } from './p-78b00756.js';
 import { d as defineCustomElement$1 } from './p-3a3ba5b1.js';
 
 const nvIconbuttonCss = "nv-iconbutton.root{display:inline-flex;justify-content:center;align-items:center;font-style:normal;font-weight:500;font-family:\"TT Norms Pro\", sans-serif;transition:background-color 150ms ease-out;height:fit-content;width:fit-content}nv-iconbutton.size-xs{padding:var(--button-xs-icon-button-padding);gap:var(--button-xs-gap);border-radius:var(--button-xs-border-radius);line-height:var(--button-xs-line-height);font-size:var(--button-xs-font-size)}nv-iconbutton.size-sm{padding:var(--button-sm-icon-button-padding);gap:var(--button-sm-gap);border-radius:var(--button-sm-border-radius);line-height:var(--button-sm-line-height);font-size:var(--button-sm-font-size)}nv-iconbutton.size-md{padding:var(--button-md-icon-button-padding);gap:var(--button-md-gap);border-radius:var(--button-md-border-radius);line-height:var(--button-md-line-height);font-size:var(--button-md-font-size)}nv-iconbutton.size-lg{padding:var(--button-lg-icon-button-padding);gap:var(--button-lg-gap);border-radius:var(--button-lg-border-radius);line-height:var(--button-lg-line-height);font-size:var(--button-lg-font-size)}nv-iconbutton.emphasis-high{background:var(--components-button-high-background);border:1px solid var(--components-button-high-border);color:var(--components-button-high-text)}nv-iconbutton.emphasis-high:hover{background:var(--components-button-high-background-hover);color:var(--components-button-high-text-hover)}nv-iconbutton.emphasis-high:focus,nv-iconbutton.emphasis-high:focus-within{outline:none}nv-iconbutton.emphasis-high:focus-visible,nv-iconbutton.emphasis-high:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-iconbutton.emphasis-high:disabled{background:var(--components-button-high-background);color:var(--components-button-high-text);opacity:0.5;cursor:not-allowed;box-shadow:none}nv-iconbutton.emphasis-high nv-icon>svg{color:var(--components-button-high-icon)}nv-iconbutton.emphasis-medium{background:var(--components-button-medium-background);border:1px solid var(--components-button-medium-border);color:var(--components-button-medium-text)}nv-iconbutton.emphasis-medium:hover{background:var(--components-button-medium-background-hover);color:var(--components-button-medium-text-hover)}nv-iconbutton.emphasis-medium:focus,nv-iconbutton.emphasis-medium:focus-within{outline:none}nv-iconbutton.emphasis-medium:focus-visible,nv-iconbutton.emphasis-medium:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-iconbutton.emphasis-medium:disabled{background:var(--components-button-medium-background);color:var(--components-button-medium-text);opacity:0.5;cursor:not-allowed;box-shadow:none}nv-iconbutton.emphasis-medium nv-icon>svg{color:var(--components-button-medium-icon)}nv-iconbutton.emphasis-low{background:var(--components-button-low-background);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text)}nv-iconbutton.emphasis-low:hover{background:var(--components-button-low-background-hover);color:var(--components-button-low-text-hover)}nv-iconbutton.emphasis-low:focus,nv-iconbutton.emphasis-low:focus-within{outline:none}nv-iconbutton.emphasis-low:focus-visible,nv-iconbutton.emphasis-low:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-iconbutton.emphasis-low:disabled{background:var(--components-button-low-background);color:var(--components-button-low-text);opacity:0.5;cursor:not-allowed;box-shadow:none}nv-iconbutton.emphasis-low nv-icon>svg{color:var(--components-button-low-icon)}nv-iconbutton.emphasis-lower{background:var(--components-button-lower-background);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text)}nv-iconbutton.emphasis-lower:hover{background:var(--components-button-lower-background-hover);color:var(--components-button-lower-text-hover)}nv-iconbutton.emphasis-lower:focus,nv-iconbutton.emphasis-lower:focus-within{outline:none}nv-iconbutton.emphasis-lower:focus-visible,nv-iconbutton.emphasis-lower:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-iconbutton.emphasis-lower:disabled{background:var(--components-button-lower-background);color:var(--components-button-lower-text);opacity:0.5;cursor:not-allowed;box-shadow:none}nv-iconbutton.emphasis-lower nv-icon>svg{color:var(--components-button-lower-icon)}nv-iconbutton.loading [slot=leading-icon]{display:none}nv-iconbutton.shape-rounded{border-radius:var(--radius-rounded-full)}";
@@ -166,4 +166,4 @@ defineCustomElement();
 
 export { NvIconbutton as N, defineCustomElement as d };
 
-//# sourceMappingURL=p-1e095bba.js.map
+//# sourceMappingURL=p-3b096098.js.map