@nova-design-system/nova-webcomponents 3.24.0 → 3.25.0

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

@@ -1,9 +1,9 @@
 'use strict';
 
-var index = require('./index-B1na8x6M.js');
+var index = require('./index-BQjqJTJB.js');
 var clsx = require('./clsx-BtxeOLZW.js');
 
-const nvIconbuttonCss = "nv-iconbutton.root{display:inline-flex;justify-content:center;align-items:center;font-style:normal;font-weight:var(--font-weight-medium-emphasis);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;transition:background-color 150ms ease-out;height:fit-content;width:fit-content}nv-iconbutton.size-xs{padding:calc(var(--button-xs-icon-button-padding) - 1px);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:calc(var(--button-sm-icon-button-padding) - 1px);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:calc(var(--button-md-icon-button-padding) - 1px);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:calc(var(--button-lg-icon-button-padding) - 1px);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)}";
+const nvIconbuttonCss = () => `nv-iconbutton.root{display:inline-flex;justify-content:center;align-items:center;font-style:normal;font-weight:var(--font-weight-medium-emphasis);font-family:var(--font-family-default), var(--font-family-fallback), sans-serif;transition:background-color 150ms ease-out;height:fit-content;width:fit-content}nv-iconbutton.size-xs{padding:calc(var(--button-xs-icon-button-padding) - 1px);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:calc(var(--button-sm-icon-button-padding) - 1px);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:calc(var(--button-md-icon-button-padding) - 1px);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:calc(var(--button-lg-icon-button-padding) - 1px);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)}`;
 
 const NvIconbutton = class {
     constructor(hostRef) {
@@ -125,18 +125,22 @@ const NvIconbutton = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '2e0011f5ebb23512aa89756ae7fd5ad81586f8b1', role: "button", type: this.type, tabindex: this.disableTabindex ? -1 : 0, disabled: this.disabled ? true : undefined, class: clsx.clsx('root', `size-${this.size}`, `emphasis-${this.emphasis}`, this.loading && 'loading', `shape-${this.shape}`), onClick: this.handleClick }, this.loading && index.h("nv-loader", { key: '435692a00ed0af3548c2ac875e573af00daf5d62', size: this.size }), !this.loading && index.h("nv-icon", { key: '00b08fbd43724ad7ce54c96cd052ba637e111ece', name: this.name, size: this.size }), index.h("slot", { key: 'bb61e7db6115c9017007f15320dd5b2f6ccd9671' })));
+        return (index.h(index.Host, { key: '06b48253c77b09ae1259f72ad7698c9f9ddcd750', role: "button", type: this.type, tabindex: this.disableTabindex ? -1 : 0, disabled: this.disabled ? true : undefined, class: clsx.clsx('root', `size-${this.size}`, `emphasis-${this.emphasis}`, this.loading && 'loading', `shape-${this.shape}`), onClick: this.handleClick }, this.loading && index.h("nv-loader", { key: '5b4117978546581bfb217a0595dec6c736369955', size: this.size }), !this.loading && index.h("nv-icon", { key: 'f2f0da0fae0d0fde955cc2f766cb98a3058ffb7e', name: this.name, size: this.size }), index.h("slot", { key: '8d59cdf4be11216ff4a0a607bea4970128faa214' })));
     }
     static get formAssociated() { return true; }
     get el() { return index.getElement(this); }
     static get watchers() { return {
-        "loading": ["handleLoadingChange"],
-        "disabled": ["handleDisabledChange"]
+        "loading": [{
+                "handleLoadingChange": 0
+            }],
+        "disabled": [{
+                "handleDisabledChange": 0
+            }]
     }; }
 };
-NvIconbutton.style = nvIconbuttonCss;
+NvIconbutton.style = nvIconbuttonCss();
 
-const nvLoaderCss = "@keyframes rotation{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}nv-loader{display:inline-block;position:relative;aspect-ratio:1/1;border-radius:9999px;color:inherit}nv-loader.size-xs{width:var(--loader-size-xs);height:var(--loader-size-xs)}nv-loader.size-xs::before,nv-loader.size-xs::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-xs::before{content:\" \";border:calc(var(--loader-size-xs) / 10) solid;opacity:0.3}nv-loader.size-xs::after{content:\" \";border-top:calc(var(--loader-size-xs) / 10) solid transparent;border-left:calc(var(--loader-size-xs) / 10) solid transparent;border-right:calc(var(--loader-size-xs) / 10) solid transparent;border-bottom:calc(var(--loader-size-xs) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-sm{width:var(--loader-size-sm);height:var(--loader-size-sm)}nv-loader.size-sm::before,nv-loader.size-sm::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-sm::before{content:\" \";border:calc(var(--loader-size-sm) / 10) solid;opacity:0.3}nv-loader.size-sm::after{content:\" \";border-top:calc(var(--loader-size-sm) / 10) solid transparent;border-left:calc(var(--loader-size-sm) / 10) solid transparent;border-right:calc(var(--loader-size-sm) / 10) solid transparent;border-bottom:calc(var(--loader-size-sm) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-md{width:var(--loader-size-md);height:var(--loader-size-md)}nv-loader.size-md::before,nv-loader.size-md::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-md::before{content:\" \";border:calc(var(--loader-size-md) / 10) solid;opacity:0.3}nv-loader.size-md::after{content:\" \";border-top:calc(var(--loader-size-md) / 10) solid transparent;border-left:calc(var(--loader-size-md) / 10) solid transparent;border-right:calc(var(--loader-size-md) / 10) solid transparent;border-bottom:calc(var(--loader-size-md) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-lg{width:var(--loader-size-lg);height:var(--loader-size-lg)}nv-loader.size-lg::before,nv-loader.size-lg::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-lg::before{content:\" \";border:calc(var(--loader-size-lg) / 10) solid;opacity:0.3}nv-loader.size-lg::after{content:\" \";border-top:calc(var(--loader-size-lg) / 10) solid transparent;border-left:calc(var(--loader-size-lg) / 10) solid transparent;border-right:calc(var(--loader-size-lg) / 10) solid transparent;border-bottom:calc(var(--loader-size-lg) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-xl{width:var(--loader-size-xl);height:var(--loader-size-xl)}nv-loader.size-xl::before,nv-loader.size-xl::after{content:\" \";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-xl::before{content:\" \";border:calc(var(--loader-size-xl) / 10) solid;opacity:0.3}nv-loader.size-xl::after{content:\" \";border-top:calc(var(--loader-size-xl) / 10) solid transparent;border-left:calc(var(--loader-size-xl) / 10) solid transparent;border-right:calc(var(--loader-size-xl) / 10) solid transparent;border-bottom:calc(var(--loader-size-xl) / 10) solid;animation:rotation 1s linear infinite}nv-loader.color-brand::before{border-color:var(--components-loader-brand-background);opacity:1}nv-loader.color-brand::after{border-bottom-color:var(--components-loader-brand-foreground)}nv-loader.color-white::before{border-color:var(--components-loader-white-background);opacity:1}nv-loader.color-white::after{border-bottom-color:var(--components-loader-white-foreground)}";
+const nvLoaderCss = () => `@keyframes rotation{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}nv-loader{display:inline-block;position:relative;aspect-ratio:1/1;border-radius:9999px;color:inherit}nv-loader.size-xs{width:var(--loader-size-xs);height:var(--loader-size-xs)}nv-loader.size-xs::before,nv-loader.size-xs::after{content:" ";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-xs::before{content:" ";border:calc(var(--loader-size-xs) / 10) solid;opacity:0.3}nv-loader.size-xs::after{content:" ";border-top:calc(var(--loader-size-xs) / 10) solid transparent;border-left:calc(var(--loader-size-xs) / 10) solid transparent;border-right:calc(var(--loader-size-xs) / 10) solid transparent;border-bottom:calc(var(--loader-size-xs) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-sm{width:var(--loader-size-sm);height:var(--loader-size-sm)}nv-loader.size-sm::before,nv-loader.size-sm::after{content:" ";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-sm::before{content:" ";border:calc(var(--loader-size-sm) / 10) solid;opacity:0.3}nv-loader.size-sm::after{content:" ";border-top:calc(var(--loader-size-sm) / 10) solid transparent;border-left:calc(var(--loader-size-sm) / 10) solid transparent;border-right:calc(var(--loader-size-sm) / 10) solid transparent;border-bottom:calc(var(--loader-size-sm) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-md{width:var(--loader-size-md);height:var(--loader-size-md)}nv-loader.size-md::before,nv-loader.size-md::after{content:" ";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-md::before{content:" ";border:calc(var(--loader-size-md) / 10) solid;opacity:0.3}nv-loader.size-md::after{content:" ";border-top:calc(var(--loader-size-md) / 10) solid transparent;border-left:calc(var(--loader-size-md) / 10) solid transparent;border-right:calc(var(--loader-size-md) / 10) solid transparent;border-bottom:calc(var(--loader-size-md) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-lg{width:var(--loader-size-lg);height:var(--loader-size-lg)}nv-loader.size-lg::before,nv-loader.size-lg::after{content:" ";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-lg::before{content:" ";border:calc(var(--loader-size-lg) / 10) solid;opacity:0.3}nv-loader.size-lg::after{content:" ";border-top:calc(var(--loader-size-lg) / 10) solid transparent;border-left:calc(var(--loader-size-lg) / 10) solid transparent;border-right:calc(var(--loader-size-lg) / 10) solid transparent;border-bottom:calc(var(--loader-size-lg) / 10) solid;animation:rotation 1s linear infinite}nv-loader.size-xl{width:var(--loader-size-xl);height:var(--loader-size-xl)}nv-loader.size-xl::before,nv-loader.size-xl::after{content:" ";position:absolute;top:0;left:0;border-radius:inherit;width:100%;height:100%}nv-loader.size-xl::before{content:" ";border:calc(var(--loader-size-xl) / 10) solid;opacity:0.3}nv-loader.size-xl::after{content:" ";border-top:calc(var(--loader-size-xl) / 10) solid transparent;border-left:calc(var(--loader-size-xl) / 10) solid transparent;border-right:calc(var(--loader-size-xl) / 10) solid transparent;border-bottom:calc(var(--loader-size-xl) / 10) solid;animation:rotation 1s linear infinite}nv-loader.color-brand::before{border-color:var(--components-loader-brand-background);opacity:1}nv-loader.color-brand::after{border-bottom-color:var(--components-loader-brand-foreground)}nv-loader.color-white::before{border-color:var(--components-loader-white-background);opacity:1}nv-loader.color-white::after{border-bottom-color:var(--components-loader-white-foreground)}`;
 
 const NvLoader = class {
     constructor(hostRef) {
@@ -155,11 +159,10 @@ const NvLoader = class {
     //#region RENDER
     /* <slot> empty to force rendering change */
     render() {
-        return (index.h(index.Host, { key: '4347ec4ee393edb5e23a60e253bae73d0f9db583', class: clsx.clsx(this.size && `size-${this.size}`, this.color && `color-${this.color}`) }));
+        return (index.h(index.Host, { key: '0e617a9043f912160b40255feba5c5a9140f1703', class: clsx.clsx(this.size && `size-${this.size}`, this.color && `color-${this.color}`) }));
     }
 };
-NvLoader.style = nvLoaderCss;
+NvLoader.style = nvLoaderCss();
 
 exports.nv_iconbutton = NvIconbutton;
 exports.nv_loader = NvLoader;
-//# sourceMappingURL=nv-iconbutton.nv-loader.entry.cjs.js.map

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

@@ -1,13 +1,13 @@
 'use strict';
 
-var index = require('./index-B1na8x6M.js');
+var index = require('./index-BQjqJTJB.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 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 NvMenu = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.menuitemSelected = index.createEvent(this, "menuitemSelected", 3);
+        this.menuitemSelected = index.createEvent(this, "menuitemSelected", 7);
         this.isHandlingKeyDown = false;
         /****************************************************************************/
         //#region PROPERTIES
@@ -43,9 +43,9 @@ const NvMenu = class {
         this.renderMenuItems = () => {
             return this.items.map(item => {
                 if (item.hasSubmenu && item.submenuItems?.length > 0) {
-                    return (index.h("nv-menu", { nested: true, placement: "right-start", items: item.submenuItems }, index.h("nv-menuitem", { slot: "trigger", hasSubmenu: true, disabled: item.disabled, icon: item.icon, shortcut: item.shortcut, id: item.value, name: item.label, label: item.label, onMenuitemSelected: e => this.menuitemSelected.emit(e.detail) })));
+                    return (index.h("nv-menu", { nested: true, placement: "right-start", items: item.submenuItems }, index.h("nv-menuitem", { slot: "trigger", hasSubmenu: true, disabled: item.disabled, icon: item.icon, shortcut: item.shortcut, id: item.value, name: item.label, label: item.label })));
                 }
-                return (index.h("nv-menuitem", { disabled: item.disabled, icon: item.icon, shortcut: item.shortcut, id: item.value, name: item.label, label: item.label, onMenuitemSelected: e => this.menuitemSelected.emit(e.detail) }));
+                return (index.h("nv-menuitem", { disabled: item.disabled, icon: item.icon, shortcut: item.shortcut, id: item.value, name: item.label, label: item.label }));
             });
         };
     }
@@ -80,7 +80,6 @@ const NvMenu = class {
     //#endregion EVENTS
     /****************************************************************************/
     //#region LISTENERS
-    /* eslint-disable nova/native-event-listener */
     handleMenuItemSelect(event) {
         if (this.disableCloseOnSelect)
             return;
@@ -88,7 +87,6 @@ const NvMenu = class {
             return;
         this.open = false;
     }
-    /* eslint-enable nova/native-event-listener */
     handleKeydown(event) {
         // If the menu is not open, check if the trigger is focused
         // and the user presses Enter or ArrowDown, open the menu
@@ -187,17 +185,14 @@ const NvMenu = class {
     //#endregion LISTENERS
     /****************************************************************************/
     //#region LIFECYCLE
-    componentWillLoad() {
-        this.triggerElement = Array.from(this.el.children).find(child => {
-            return child.getAttribute('slot') === 'trigger';
-        });
+    componentWillRender() {
+        this.triggerElement = this.el.querySelector('[slot="trigger"]');
     }
     render() {
-        return (index.h(index.Host, { key: '1139a5dbbbb52e2f32c5d1410b4bdb87156cfd60' }, index.h("slot", { key: 'f2202b254512643f0a16ebcda3715438a7c7aa2a', name: "trigger" }), index.h("nv-popover", { key: '2f49bd9af8ff253ab662b5054717e0d44690f47d', ref: el => (this.popoverElement = el), triggerMode: "click", triggerElement: this.triggerElement, placement: this.placement, nested: this.nested, open: this.open, onOpenChanged: this.handleOpenChanged.bind(this) }, this.items ? (index.h("ul", { slot: "content" }, this.renderMenuItems())) : (index.h("slot", { name: "content" })))));
+        return (index.h(index.Host, { key: 'de2604e6681418f23352dc436ac6dfb64d3d3a8d' }, index.h("slot", { key: '26afcd55842377b82a3f6d1f63d2f87eff4f6001', name: "trigger" }), index.h("nv-popover", { key: '03466649d538b909070feb3c50e18a35ee7dda19', ref: el => (this.popoverElement = el), triggerMode: "click", triggerElement: this.triggerElement, placement: this.placement, nested: this.nested, open: this.open, onOpenChanged: this.handleOpenChanged.bind(this) }, this.items ? (index.h("ul", { slot: "content" }, this.renderMenuItems())) : (index.h("slot", { name: "content" })))));
     }
     get el() { return index.getElement(this); }
 };
-NvMenu.style = nvMenuCss;
+NvMenu.style = nvMenuCss();
 
 exports.nv_menu = NvMenu;
-//# sourceMappingURL=nv-menu.entry.cjs.js.map

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

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-B1na8x6M.js');
+var index = require('./index-BQjqJTJB.js');
 
-const nvMenuitemCss = "nv-menuitem{display:flex;align-items:center;max-width:300px;width:100vw;font-size:var(--menu-contextual-item-font-size);font-weight:var(--menu-contextual-item-font-weight);color:var(--components-menu-contextual-item-content);border-radius:var(--menu-contextual-item-radius);gap:var(--menu-contextual-item-gap-x);padding:var(--menu-contextual-item-padding-y) var(--menu-contextual-item-padding-x);transition:background-color 150ms ease-out;cursor:pointer}nv-menuitem:hover,nv-menuitem:focus,nv-menuitem:focus-within{background-color:var(--components-menu-contextual-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-menuitem *{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)}";
+const nvMenuitemCss = () => `nv-menuitem{display:flex;align-items:center;max-width:300px;width:100vw;font-size:var(--menu-contextual-item-font-size);font-weight:var(--menu-contextual-item-font-weight);color:var(--components-menu-contextual-item-content);border-radius:var(--menu-contextual-item-radius);gap:var(--menu-contextual-item-gap-x);padding:var(--menu-contextual-item-padding-y) var(--menu-contextual-item-padding-x);transition:background-color 150ms ease-out;cursor:pointer}nv-menuitem:hover,nv-menuitem:focus,nv-menuitem:focus-within{background-color:var(--components-menu-contextual-item-background-hover);color:var(--components-menu-contextual-item-content-hover)}nv-menuitem *{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)}`;
 
 const NvMenuitem = class {
     constructor(hostRef) {
@@ -17,7 +17,6 @@ const NvMenuitem = class {
          */
         this.hasSubmenu = false;
     }
-    /* eslint-enable nova/event-bubbling */
     handleMenuItemSelect(event) {
         // If the element is disabled, stop propagation
         if (this.disabled) {
@@ -48,11 +47,10 @@ const NvMenuitem = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: 'e21f532b90f018810befe6a03ef4cb75fe05aea2', role: "menuitem", tabindex: this.disabled ? '-1' : '0' }, this.icon && index.h("nv-icon", { key: 'a63bdcae06b1311440ec95ecf002a8b9a130aea8', name: this.icon }), index.h("slot", { key: 'f25c0104369b8d70ce35d4bf74cf92c1bcdf66c6' }), this.label && index.h("span", { key: '5ab5691b53857876c8e13e91f975b41e255999da', "data-scope": "text" }, this.label), this.shortcut && !this.hasSubmenu && index.h("kbd", { key: 'c93777342da74e2cba4dfbbdf6657814b3996f41' }, this.shortcut), this.hasSubmenu && index.h("nv-icon", { key: '87a58745651c54efb1c96841846363e377ee6fca', name: "chevron-right" })));
+        return (index.h(index.Host, { key: '3c05131caa0ee794ee2bbbd9c3a9d589d1fde266', role: "menuitem", tabindex: this.disabled ? '-1' : '0' }, this.icon && index.h("nv-icon", { key: '5d9e236545a19a4291885d26bbc13fed02d3e4bd', name: this.icon }), index.h("slot", { key: 'b020591899e341c5775f662dcdcd1a9894ab85a1' }), this.label && index.h("span", { key: '4984519ed9fefbb1647739ae0eeb4087ff320a01', "data-scope": "text" }, this.label), this.shortcut && !this.hasSubmenu && index.h("kbd", { key: 'bd3e3e3544e7efafa4eaedc212e88e55ad7ea4d0' }, this.shortcut), this.hasSubmenu && index.h("nv-icon", { key: '7b928e7c9ea2892061915ace6c08d3cccbf1655e', name: "chevron-right" })));
     }
     get el() { return index.getElement(this); }
 };
-NvMenuitem.style = nvMenuitemCss;
+NvMenuitem.style = nvMenuitemCss();
 
 exports.nv_menuitem = NvMenuitem;
-//# sourceMappingURL=nv-menuitem.entry.cjs.js.map

package/dist/cjs/nv-notification-bullet.cjs.entry.js

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-B1na8x6M.js');
+var index = require('./index-BQjqJTJB.js');
 
-const nvNotificationBulletCss = "nv-notification-bullet{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-notification-bullet-size);max-width:var(--sidebar-notification-bullet-size);height:var(--sidebar-notification-bullet-size);padding:0 var(--spacing-1);border-radius:var(--radius-rounded-full);font-size:var(--sidebar-notification-bullet-font-size);font-weight:var(--sidebar-notification-bullet-font-weight);white-space:nowrap;flex-shrink:0;position:relative;}nv-notification-bullet.nv-notification-bullet-brand .nv-notification-bullet{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-notification-bullet-size);max-width:var(--sidebar-notification-bullet-size);height:var(--sidebar-notification-bullet-size);padding:0 var(--spacing-1);border-radius:var(--radius-rounded-full);font-size:var(--sidebar-notification-bullet-font-size);font-weight:var(--sidebar-notification-bullet-font-weight);white-space:nowrap;flex-shrink:0}nv-notification-bullet.nv-notification-bullet-brand .nv-notification-bullet.nv-notification-bullet-high{background-color:var(--color-brand-500);color:var(--color-feedback-neutral-high-contrast-title)}nv-notification-bullet.nv-notification-bullet-brand .nv-notification-bullet.nv-notification-bullet-low{background-color:var(--color-brand-50);color:var(--color-brand-600);border:1px solid var(--color-brand-600)}nv-notification-bullet{}nv-notification-bullet.nv-notification-bullet-neutral{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-notification-bullet-size);max-width:var(--sidebar-notification-bullet-size);height:var(--sidebar-notification-bullet-size);padding:0 var(--spacing-1);border-radius:var(--radius-rounded-full);font-size:var(--sidebar-notification-bullet-font-size);font-weight:var(--sidebar-notification-bullet-font-weight);white-space:nowrap;flex-shrink:0}nv-notification-bullet.nv-notification-bullet-neutral .nv-notification-bullet.nv-notification-bullet-high{background-color:var(--color-feedback-neutral-high-contrast-background);color:var(--color-feedback-neutral-high-contrast-title)}nv-notification-bullet.nv-notification-bullet-neutral .nv-notification-bullet.nv-notification-bullet-low{background-color:var(--color-feedback-neutral-low-background);color:var(--color-feedback-neutral-low-text);border-radius:var(--radius-rounded-full)}nv-notification-bullet{}nv-notification-bullet.nv-notification-bullet-with-cross-border::before{content:\"\";position:absolute;top:55%;left:45%;transform:translate(-50%, -50%);width:calc(var(--sidebar-notification-bullet-size) + 1.5px);height:calc(var(--sidebar-notification-bullet-size) * 1.5);border-radius:var(--radius-rounded-full);background-color:var(--nv-component-background, var(--nv-sidebarnavitem-background, var(--color-interaction-container-neutral-background)));z-index:-1;pointer-events:none}nv-notification-bullet{}nv-sidebar[collapsed] nv-notification-bullet.nv-notification-bullet-with-cross-border::before{width:calc(var(--sidebar-notification-bullet-size-reduced) * 1.5);height:calc(var(--sidebar-notification-bullet-size-reduced) * 1.5)}nv-notification-bullet{}nv-notification-bullet .nv-notification-bullet.nv-notification-bullet-reduced,nv-sidebar[collapsed] nv-notification-bullet .nv-notification-bullet{width:var(--sidebar-notification-bullet-size-reduced);height:var(--sidebar-notification-bullet-size-reduced);min-width:var(--sidebar-notification-bullet-size-reduced);max-width:var(--sidebar-notification-bullet-size-reduced);min-height:var(--sidebar-notification-bullet-size-reduced);max-height:var(--sidebar-notification-bullet-size-reduced);padding:0;font-size:0}";
+const nvNotificationBulletCss = () => `nv-notification-bullet{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-notification-bullet-size);max-width:var(--sidebar-notification-bullet-size);height:var(--sidebar-notification-bullet-size);padding:0 var(--spacing-1);border-radius:var(--radius-rounded-full);font-size:var(--sidebar-notification-bullet-font-size);font-weight:var(--sidebar-notification-bullet-font-weight);white-space:nowrap;flex-shrink:0;position:relative;}nv-notification-bullet.nv-notification-bullet-brand .nv-notification-bullet{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-notification-bullet-size);max-width:var(--sidebar-notification-bullet-size);height:var(--sidebar-notification-bullet-size);padding:0 var(--spacing-1);border-radius:var(--radius-rounded-full);font-size:var(--sidebar-notification-bullet-font-size);font-weight:var(--sidebar-notification-bullet-font-weight);white-space:nowrap;flex-shrink:0}nv-notification-bullet.nv-notification-bullet-brand .nv-notification-bullet.nv-notification-bullet-high{background-color:var(--color-brand-500);color:var(--color-feedback-neutral-high-contrast-title)}nv-notification-bullet.nv-notification-bullet-brand .nv-notification-bullet.nv-notification-bullet-low{background-color:var(--color-brand-50);color:var(--color-brand-600);border:1px solid var(--color-brand-600)}nv-notification-bullet{}nv-notification-bullet.nv-notification-bullet-neutral{display:inline-flex;align-items:center;justify-content:center;min-width:var(--sidebar-notification-bullet-size);max-width:var(--sidebar-notification-bullet-size);height:var(--sidebar-notification-bullet-size);padding:0 var(--spacing-1);border-radius:var(--radius-rounded-full);font-size:var(--sidebar-notification-bullet-font-size);font-weight:var(--sidebar-notification-bullet-font-weight);white-space:nowrap;flex-shrink:0}nv-notification-bullet.nv-notification-bullet-neutral .nv-notification-bullet.nv-notification-bullet-high{background-color:var(--color-feedback-neutral-high-contrast-background);color:var(--color-feedback-neutral-high-contrast-title)}nv-notification-bullet.nv-notification-bullet-neutral .nv-notification-bullet.nv-notification-bullet-low{background-color:var(--color-feedback-neutral-low-background);color:var(--color-feedback-neutral-low-text);border-radius:var(--radius-rounded-full)}nv-notification-bullet{}nv-notification-bullet.nv-notification-bullet-with-cross-border::before{content:"";position:absolute;top:55%;left:45%;transform:translate(-50%, -50%);width:calc(var(--sidebar-notification-bullet-size) + 1.5px);height:calc(var(--sidebar-notification-bullet-size) * 1.5);border-radius:var(--radius-rounded-full);background-color:var(--nv-component-background, var(--nv-sidebarnavitem-background, var(--color-interaction-container-neutral-background)));z-index:-1;pointer-events:none}nv-notification-bullet{}nv-sidebar[collapsed] nv-notification-bullet.nv-notification-bullet-with-cross-border::before{width:calc(var(--sidebar-notification-bullet-size-reduced) * 1.5);height:calc(var(--sidebar-notification-bullet-size-reduced) * 1.5)}nv-notification-bullet{}nv-notification-bullet .nv-notification-bullet.nv-notification-bullet-reduced,nv-sidebar[collapsed] nv-notification-bullet .nv-notification-bullet{width:var(--sidebar-notification-bullet-size-reduced);height:var(--sidebar-notification-bullet-size-reduced);min-width:var(--sidebar-notification-bullet-size-reduced);max-width:var(--sidebar-notification-bullet-size-reduced);min-height:var(--sidebar-notification-bullet-size-reduced);max-height:var(--sidebar-notification-bullet-size-reduced);padding:0;font-size:0}`;
 
 const NvNotificationBullet = class {
     constructor(hostRef) {
@@ -68,7 +68,6 @@ const NvNotificationBullet = class {
     }
     get el() { return index.getElement(this); }
 };
-NvNotificationBullet.style = nvNotificationBulletCss;
+NvNotificationBullet.style = nvNotificationBulletCss();
 
 exports.nv_notification_bullet = NvNotificationBullet;
-//# sourceMappingURL=nv-notification-bullet.entry.cjs.js.map

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-B1na8x6M.js');
+var index = require('./index-BQjqJTJB.js');
 var constants = require('./constants-BugGJYqL.js');
 var collapse_animation = require('./collapse.animation-CcG0GAWk.js');
 var fade_animation = require('./fade.animation-BQSqXXOJ.js');
@@ -9,7 +9,7 @@ var slide_animation = require('./slide.animation-Cb3tpLQv.js');
 var timeline_animation = require('./timeline.animation-KteJaZPb.js');
 var v4 = require('./v4-C1vaJ4yP.js');
 
-const nvNotificationCss = "nv-notification{display:block}nv-notification [data-scope=container]{display:flex;position:relative;max-width:512px;width:100%;padding:var(--notification-padding);align-items:flex-start;gap:var(--notification-gap-x);border-radius:var(--notification-radius);border-style:solid;box-shadow:0 var(--shadow-y-axis-lg-1, 4px) var(--shadow-blur-lg-1, 6px) var(--shadow-spread-lg-1, -2px) var(--shadow-color-opacity-1, rgba(14, 14, 14, 0.06)), 0 var(--shadow-y-axis-lg-2, 10px) var(--shadow-blur-lg-2, 15px) var(--shadow-spread-lg-2, -3px) var(--shadow-color-opacity-2, rgba(14, 14, 14, 0.1))}nv-notification [data-scope=container] [data-scope=icon]{flex-shrink:0}nv-notification [data-scope=container] [data-scope=dismiss]{padding:var(--button-sm-icon-button-padding, 8px);justify-content:center;align-items:center;gap:var(--button-sm-gap, 6px);display:flex;position:absolute;right:8px;top:8px;border-radius:var(--button-sm-border-radius, 4px);background:var(--components-button-lower-background, rgba(255, 255, 255, 0));color:var(--components-button-lower-icon)}nv-notification [data-scope=container] [data-scope=content]{display:flex;padding-right:var(--notification-padding-right);flex-direction:column;align-items:flex-start;gap:var(--notification-gap-y);flex:1 0 0}nv-notification [data-scope=container] [data-scope=content] [data-scope=heading]{display:flex;align-items:flex-start;gap:var(--notification-gap-x);align-self:stretch;color:var(--components-notification-content-title);font-size:var(--notification-title-font-size);font-style:normal;font-weight:var(--font-weight-medium-emphasis);line-height:20px;}nv-notification [data-scope=container] [data-scope=content] [data-scope=message]{display:flex;flex-direction:column;align-items:flex-start;gap:var(--notification-gap-y);align-self:stretch;color:var(--components-notification-content-description);font-variant-numeric:lining-nums tabular-nums slashed-zero;font-size:var(--font-size-sm, 14px);font-style:normal;font-weight:var(--font-weight-low-emphasis);line-height:var(--line-height-sm, 20px)}nv-notification [data-scope=container] [data-scope=content] [data-scope=actions]{display:flex;padding:var(--spacing-2, 8px) 0;padding-bottom:0px;align-items:flex-start;gap:var(--notification-gap-x);align-self:stretch;margin-left:calc(-1 * var(--button-sm-padding-x))}nv-notification[feedback=information] [data-scope=container]{background-color:var(--components-notification-information-background);border-color:var(--components-notification-information-border)}nv-notification[feedback=information] [data-scope=container] [data-scope=icon]{color:var(--components-notification-information-icon)}nv-notification[feedback=information]>[data-scope=close]:focus,nv-notification[feedback=information]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=information]>[data-scope=close]:focus-visible,nv-notification[feedback=information]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-information-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[feedback=warning] [data-scope=container]{background-color:var(--components-notification-warning-background);border-color:var(--components-notification-warning-border)}nv-notification[feedback=warning] [data-scope=container] [data-scope=icon]{color:var(--components-notification-warning-icon)}nv-notification[feedback=warning]>[data-scope=close]:focus,nv-notification[feedback=warning]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=warning]>[data-scope=close]:focus-visible,nv-notification[feedback=warning]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-warning-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[feedback=error] [data-scope=container]{background-color:var(--components-notification-error-background);border-color:var(--components-notification-error-border)}nv-notification[feedback=error] [data-scope=container] [data-scope=icon]{color:var(--components-notification-error-icon)}nv-notification[feedback=error]>[data-scope=close]:focus,nv-notification[feedback=error]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=error]>[data-scope=close]:focus-visible,nv-notification[feedback=error]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-error-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[feedback=success] [data-scope=container]{background-color:var(--components-notification-success-background);border-color:var(--components-notification-success-border)}nv-notification[feedback=success] [data-scope=container] [data-scope=icon]{color:var(--components-notification-success-icon)}nv-notification[feedback=success]>[data-scope=close]:focus,nv-notification[feedback=success]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=success]>[data-scope=close]:focus-visible,nv-notification[feedback=success]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-success-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[feedback=neutral] [data-scope=container]{background-color:var(--components-notification-neutral-background);border-color:var(--components-notification-neutral-border)}nv-notification[feedback=neutral] [data-scope=container] [data-scope=icon]{color:var(--components-notification-neutral-icon)}nv-notification[feedback=neutral]>[data-scope=close]:focus,nv-notification[feedback=neutral]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=neutral]>[data-scope=close]:focus-visible,nv-notification[feedback=neutral]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-neutral-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[emphasis=high] [data-scope=container]{border-width:1px;border-left-width:var(--notification-border-width-high-emphasis);padding-left:calc(var(--notification-padding) - var(--notification-border-width-high-emphasis) + 1px)}nv-notification[emphasis=medium] [data-scope=container]{border-width:var(--notification-border-width-low-emphasis);border-color:var(--color-content-low-border, #E3E3E3)}";
+const nvNotificationCss = () => `nv-notification{display:block}nv-notification [data-scope=container]{display:flex;position:relative;max-width:512px;width:100%;padding:var(--notification-padding);align-items:flex-start;gap:var(--notification-gap-x);border-radius:var(--notification-radius);border-style:solid;box-shadow:0 var(--shadow-y-axis-lg-1, 4px) var(--shadow-blur-lg-1, 6px) var(--shadow-spread-lg-1, -2px) var(--shadow-color-opacity-1, rgba(14, 14, 14, 0.06)), 0 var(--shadow-y-axis-lg-2, 10px) var(--shadow-blur-lg-2, 15px) var(--shadow-spread-lg-2, -3px) var(--shadow-color-opacity-2, rgba(14, 14, 14, 0.1))}nv-notification [data-scope=container] [data-scope=icon]{flex-shrink:0}nv-notification [data-scope=container] [data-scope=dismiss]{padding:var(--button-sm-icon-button-padding, 8px);justify-content:center;align-items:center;gap:var(--button-sm-gap, 6px);display:flex;position:absolute;right:8px;top:8px;border-radius:var(--button-sm-border-radius, 4px);background:var(--components-button-lower-background, rgba(255, 255, 255, 0));color:var(--components-button-lower-icon)}nv-notification [data-scope=container] [data-scope=content]{display:flex;padding-right:var(--notification-padding-right);flex-direction:column;align-items:flex-start;gap:var(--notification-gap-y);flex:1 0 0}nv-notification [data-scope=container] [data-scope=content] [data-scope=heading]{display:flex;align-items:flex-start;gap:var(--notification-gap-x);align-self:stretch;color:var(--components-notification-content-title);font-size:var(--notification-title-font-size);font-style:normal;font-weight:var(--font-weight-medium-emphasis);line-height:20px;}nv-notification [data-scope=container] [data-scope=content] [data-scope=message]{display:flex;flex-direction:column;align-items:flex-start;gap:var(--notification-gap-y);align-self:stretch;color:var(--components-notification-content-description);font-variant-numeric:lining-nums tabular-nums slashed-zero;font-size:var(--font-size-sm, 14px);font-style:normal;font-weight:var(--font-weight-low-emphasis);line-height:var(--line-height-sm, 20px)}nv-notification [data-scope=container] [data-scope=content] [data-scope=actions]{display:flex;padding:var(--spacing-2, 8px) 0;padding-bottom:0px;align-items:flex-start;gap:var(--notification-gap-x);align-self:stretch;margin-left:calc(-1 * var(--button-sm-padding-x))}nv-notification[feedback=information] [data-scope=container]{background-color:var(--components-notification-information-background);border-color:var(--components-notification-information-border)}nv-notification[feedback=information] [data-scope=container] [data-scope=icon]{color:var(--components-notification-information-icon)}nv-notification[feedback=information]>[data-scope=close]:focus,nv-notification[feedback=information]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=information]>[data-scope=close]:focus-visible,nv-notification[feedback=information]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-information-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[feedback=warning] [data-scope=container]{background-color:var(--components-notification-warning-background);border-color:var(--components-notification-warning-border)}nv-notification[feedback=warning] [data-scope=container] [data-scope=icon]{color:var(--components-notification-warning-icon)}nv-notification[feedback=warning]>[data-scope=close]:focus,nv-notification[feedback=warning]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=warning]>[data-scope=close]:focus-visible,nv-notification[feedback=warning]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-warning-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[feedback=error] [data-scope=container]{background-color:var(--components-notification-error-background);border-color:var(--components-notification-error-border)}nv-notification[feedback=error] [data-scope=container] [data-scope=icon]{color:var(--components-notification-error-icon)}nv-notification[feedback=error]>[data-scope=close]:focus,nv-notification[feedback=error]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=error]>[data-scope=close]:focus-visible,nv-notification[feedback=error]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-error-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[feedback=success] [data-scope=container]{background-color:var(--components-notification-success-background);border-color:var(--components-notification-success-border)}nv-notification[feedback=success] [data-scope=container] [data-scope=icon]{color:var(--components-notification-success-icon)}nv-notification[feedback=success]>[data-scope=close]:focus,nv-notification[feedback=success]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=success]>[data-scope=close]:focus-visible,nv-notification[feedback=success]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-success-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[feedback=neutral] [data-scope=container]{background-color:var(--components-notification-neutral-background);border-color:var(--components-notification-neutral-border)}nv-notification[feedback=neutral] [data-scope=container] [data-scope=icon]{color:var(--components-notification-neutral-icon)}nv-notification[feedback=neutral]>[data-scope=close]:focus,nv-notification[feedback=neutral]>[data-scope=close]:focus-within{outline:none}nv-notification[feedback=neutral]>[data-scope=close]:focus-visible,nv-notification[feedback=neutral]>[data-scope=close]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-notification-neutral-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-notification[emphasis=high] [data-scope=container]{border-width:1px;border-left-width:var(--notification-border-width-high-emphasis);padding-left:calc(var(--notification-padding) - var(--notification-border-width-high-emphasis) + 1px)}nv-notification[emphasis=medium] [data-scope=container]{border-width:var(--notification-border-width-low-emphasis);border-color:var(--color-content-low-border, #E3E3E3)}`;
 
 const NvNotification = class {
     constructor(hostRef) {
@@ -164,11 +164,10 @@ const NvNotification = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '64c79843ff7bdd1a4ae001a60a8db540947b8412', role: this.getAriaRole(), "aria-live": this.getAriaLive(), "aria-atomic": true, "aria-labelledby": this.getHeadingId() ?? null, "aria-describedby": this.getMessageId() ?? null, tabindex: "-1" }, index.h("div", { key: 'b51c9c3829b122476564726e20a1da112059035b', "data-scope": "container", ref: el => (this.container = el) }, this.dismissible && (index.h("button", { key: '3ee952fb7dc41f54fa35c88d12d4d512b96eece1', "data-scope": "dismiss", type: "button", onClick: this.dismiss.bind(this) }, index.h("nv-icon", { key: '4fa53d42ff6ea7b5e90a01cfcffec167368aece6', name: "x", size: "sm" }))), index.h("nv-icon", { key: 'e116c962672fb2237382b7dc2d3c6feae62bfced', name: this.icon ?? this.getDefaultIcon(), size: "md", "data-scope": "icon" }), index.h("div", { key: '62a1da7ac952aa704965aca61ba6f98eb12341a2', "data-scope": "content" }, (this.heading || this.headingSlot) && (index.h("p", { key: '4ddc91bc5568f54c6f8f3114720c0821c103f1c3', id: this.getHeadingId(), "data-scope": "heading" }, index.h("slot", { key: 'b7b7c678c995d68be52ca6711e55e5a8fa43fe68', name: "heading" }, this.heading))), (this.message || this.messageSlot) && (index.h("p", { key: '5e02782e07e7e2720cef3ec8c7f06321ce53940d', id: this.getMessageId(), "data-scope": "message" }, index.h("slot", { key: '4886e5e490c5f1baf429c48666fd715f43113a71', name: "content" }, this.message))), this.actionsSlot && (index.h("div", { key: '1d75b6276a8622bc607cf296336abc734e02320a', "data-scope": "actions" }, index.h("slot", { key: '6cab1b879e9b0582a415edd5d096a2b794b82ea4', name: "actions" })))))));
+        return (index.h(index.Host, { key: 'f8d336b349e7a71862bfa058022deee6fcf0a956', role: this.getAriaRole(), "aria-live": this.getAriaLive(), "aria-atomic": true, "aria-labelledby": this.getHeadingId() ?? null, "aria-describedby": this.getMessageId() ?? null, tabindex: "-1" }, index.h("div", { key: 'e75e6bd61a041bac249d77459ebcb3ac98dc54b7', "data-scope": "container", ref: el => (this.container = el) }, this.dismissible && (index.h("button", { key: 'b87bf092486682914d8c22612cb93c1f12027753', "data-scope": "dismiss", type: "button", onClick: this.dismiss.bind(this) }, index.h("nv-icon", { key: '95436607fe33bb5fc899af9dd430413b99c4615f', name: "x", size: "sm" }))), index.h("nv-icon", { key: '9962cdd859425b7c542fee370b637288aeb9a63f', name: this.icon ?? this.getDefaultIcon(), size: "md", "data-scope": "icon" }), index.h("div", { key: '8056d8d40228eea6de9dd8cc243f1a99b5fb23c1', "data-scope": "content" }, (this.heading || this.headingSlot) && (index.h("p", { key: '4d13e9d221f3ca0f7dbba81afdb77a6e57c55983', id: this.getHeadingId(), "data-scope": "heading" }, index.h("slot", { key: '6ab11ef7c73caa7864c44c58870c3ee7519e48a4', name: "heading" }, this.heading))), (this.message || this.messageSlot) && (index.h("p", { key: '8002e001201393026b28a55c17d51568e4d60aa3', id: this.getMessageId(), "data-scope": "message" }, index.h("slot", { key: 'ae7bac61287736609a9101c185d7ef3a6f0aee5d', name: "content" }, this.message))), this.actionsSlot && (index.h("div", { key: '7116aaf907928256e971c737730d1908bdb72b6a', "data-scope": "actions" }, index.h("slot", { key: 'ffe5530dccfbdea2b26646b376c22c008c67f77c', name: "actions" })))))));
     }
     get el() { return index.getElement(this); }
 };
-NvNotification.style = nvNotificationCss;
+NvNotification.style = nvNotificationCss();
 
 exports.nv_notification = NvNotification;
-//# sourceMappingURL=nv-notification.entry.cjs.js.map

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

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-B1na8x6M.js');
+var index = require('./index-BQjqJTJB.js');
 
-const nvNotificationcontainerCss = "nv-notificationcontainer{position:fixed;display:flex;flex-direction:column;padding:var(--spacing-2);padding-top:0;z-index:9999;pointer-events:none;width:100%;max-width:512px}nv-notificationcontainer.position-top-right{top:0;right:0}nv-notificationcontainer.position-top-right nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer.position-top-left{top:0;left:0}nv-notificationcontainer.position-top-left nv-notification{margin-bottom:var(--spacing-2)}nv-notificationcontainer.position-top-center{top:0;left:50%;transform:translateX(-50%)}nv-notificationcontainer.position-top-center nv-notification{margin-bottom:var(--spacing-2)}nv-notificationcontainer.position-bottom-right{bottom:0;right:0;flex-direction:column-reverse}nv-notificationcontainer.position-bottom-right nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer.position-bottom-left{bottom:0;left:0;flex-direction:column-reverse}nv-notificationcontainer.position-bottom-left nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer.position-bottom-center{bottom:0;left:50%;transform:translateX(-50%);flex-direction:column-reverse}nv-notificationcontainer.position-bottom-center nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer>*{pointer-events:auto}";
+const nvNotificationcontainerCss = () => `nv-notificationcontainer{position:fixed;display:flex;flex-direction:column;padding:var(--spacing-2);padding-top:0;z-index:9999;pointer-events:none;width:100%;max-width:512px}nv-notificationcontainer.position-top-right{top:0;right:0}nv-notificationcontainer.position-top-right nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer.position-top-left{top:0;left:0}nv-notificationcontainer.position-top-left nv-notification{margin-bottom:var(--spacing-2)}nv-notificationcontainer.position-top-center{top:0;left:50%;transform:translateX(-50%)}nv-notificationcontainer.position-top-center nv-notification{margin-bottom:var(--spacing-2)}nv-notificationcontainer.position-bottom-right{bottom:0;right:0;flex-direction:column-reverse}nv-notificationcontainer.position-bottom-right nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer.position-bottom-left{bottom:0;left:0;flex-direction:column-reverse}nv-notificationcontainer.position-bottom-left nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer.position-bottom-center{bottom:0;left:50%;transform:translateX(-50%);flex-direction:column-reverse}nv-notificationcontainer.position-bottom-center nv-notification{margin-top:var(--spacing-2)}nv-notificationcontainer>*{pointer-events:auto}`;
 
 const NvNotificationContainer = class {
     constructor(hostRef) {
@@ -30,10 +30,9 @@ const NvNotificationContainer = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: '5dee0dc22cb8917d8134e2f256996118e3e30b42', class: `position-${this.position}` }, index.h("slot", { key: '14664d70fb1840877d80eda1b3c7804457ffa67f' })));
+        return (index.h(index.Host, { key: 'a3fd9f89cf68fbd203b2bc669a85c3e33a9b9cb7', class: `position-${this.position}` }, index.h("slot", { key: '972e9722ec2ac5d909066d46ab9a9d3de4626ee6' })));
     }
 };
-NvNotificationContainer.style = nvNotificationcontainerCss;
+NvNotificationContainer.style = nvNotificationcontainerCss();
 
 exports.nv_notificationcontainer = NvNotificationContainer;
-//# sourceMappingURL=nv-notificationcontainer.entry.cjs.js.map

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

@@ -0,0 +1,228 @@
+'use strict';
+
+var index = require('./index-BQjqJTJB.js');
+
+/**
+ * Pagination table utility functions for nv-paginationtable component
+ *
+ * This module contains pure utility functions for label interpolation
+ * and pagination calculations.
+ */
+/**
+ * Interpolates a template string by replacing placeholders with values.
+ * Placeholders are defined using curly braces: {key}
+ *
+ * @param {string} template - The template string with placeholders
+ * @param {InterpolationValues} values - Object containing key-value pairs for replacement
+ * @param {string} [fallback] - Optional fallback template if template is undefined/null
+ * @returns {string} The interpolated string, or empty string if no template and no fallback
+ *
+ * @example
+ * interpolate('Page {pageIndex} of {pageCount}', { pageIndex: 1, pageCount: 14 })
+ * // Returns: 'Page 1 of 14'
+ */
+function interpolate(template, values, fallback) {
+    const effectiveTemplate = template ?? fallback ?? '';
+    if (!effectiveTemplate)
+        return '';
+    return effectiveTemplate.replace(/\{(\w+)\}/g, (match, key) => {
+        return key in values ? String(values[key]) : match;
+    });
+}
+/**
+ * Checks if navigation to the first/previous page is possible
+ * @param {number} pageIndex - Current page index (zero-based)
+ * @returns {boolean} True if at the first page
+ */
+function isFirstPage(pageIndex) {
+    return pageIndex === 0;
+}
+/**
+ * Checks if navigation to the last/next page is possible
+ * @param {number} pageIndex - Current page index (zero-based)
+ * @param {number} pageCount - Total number of pages
+ * @returns {boolean} True if at the last page
+ */
+function isLastPage(pageIndex, pageCount) {
+    return pageIndex >= pageCount - 1;
+}
+/**
+ * Default page size values
+ */
+const DEFAULT_PAGE_SIZES = [10, 25, 50, 100];
+/**
+ * Generates page size options with translated labels.
+ * @param {string} labelTemplate - Template string for the label (e.g., '{pageSize} per page')
+ * @param {number[]} sizes - Array of page size values
+ * @returns {PageSizeOption[]} Array of page size options with interpolated labels
+ *
+ * @example
+ * generatePageSizeOptions('{pageSize} per page', [10, 25, 50])
+ * // Returns: [{ label: '10 per page', value: '10' }, { label: '25 per page', value: '25' }, ...]
+ */
+function generatePageSizeOptions(labelTemplate, sizes = DEFAULT_PAGE_SIZES) {
+    return sizes.map(size => ({
+        label: interpolate(labelTemplate, { pageSize: size }),
+        value: String(size),
+    }));
+}
+
+const nvPaginationtableCss = () => `nv-paginationtable{display:flex;align-items:center;color:var(--color-content-medium-text);gap:var(--pagination-table-gap-x);user-select:none;font-size:var(--pagination-table-font-size);font-weight:400}nv-paginationtable nv-fieldselect .select-wrapper .select-container{border-color:transparent}nv-paginationtable nv-fieldselect .select-wrapper .select-container select{font-size:var(--pagination-table-font-size);font-weight:400;color:var(--color-content-medium-text)}`;
+
+const NvPaginationtable = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.pageIndexChanged = index.createEvent(this, "pageIndexChanged", 3);
+        this.pageSizeChanged = index.createEvent(this, "pageSizeChanged", 3);
+        /****************************************************************************/
+        //#region PROPERTIES
+        /**
+         * Indicates which page of table results is currently being shown, using a
+         * zero-based index.
+         */
+        this.pageIndex = 0;
+        /**
+         * Sets how many results appear at once before moving to the next page.
+         */
+        this.pageSize = 10;
+        /**
+         * Total number of pages available.
+         */
+        this.pageCount = 0;
+        /**
+         * Total number of rows in the dataset.
+         */
+        this.rowCount = 0;
+        /**
+         * Hides all arrow navigation controls when set to true.
+         * By default, all controls are visible.
+         */
+        this.hideControls = false;
+        /**
+         * Hides the previous/next arrow controls when set to true.
+         */
+        this.hidePrevNext = false;
+        /**
+         * Hides the first/last arrow controls when set to true.
+         */
+        this.hideFirstLast = false;
+        /**
+         * Label template for the page indicator.
+         * Supports placeholders: {pageIndex}, {pageCount}.
+         * Note: {pageIndex} is displayed as 1-based to users (internally 0-based).
+         * @example 'Page {pageIndex} of {pageCount}' → 'Page 1 of 14'
+         */
+        this.labelPage = 'Page {pageIndex} of {pageCount}';
+        /**
+         * Label template for the total row count display.
+         * Supports placeholder: {rowCount}.
+         * @example 'Total: {rowCount} rows' → 'Total: 254 rows'
+         */
+        this.labelTotal = 'Total: {rowCount} rows';
+        /**
+         * Label template for the page size dropdown options.
+         * Supports placeholder: {pageSize}.
+         * @example '{pageSize} per page' → '10 per page'
+         */
+        this.labelPageSizeOption = '{pageSize} per page';
+        /**
+         * Handles the page size change from the dropdown.
+         * @param {CustomEvent<string>} event - The value changed event from nv-fieldselect.
+         */
+        this.handlePageSizeChange = (event) => {
+            const newSize = Number(event.detail);
+            if (newSize > 0) {
+                this.pageSize = newSize;
+            }
+        };
+    }
+    //#endregion PROPERTIES
+    /****************************************************************************/
+    //#region METHODS
+    /**
+     * Navigates to the first page.
+     */
+    async firstPage() {
+        this.pageIndex = 0;
+    }
+    /**
+     * Navigates to the previous page.
+     */
+    async previousPage() {
+        if (this.pageIndex > 0) {
+            this.pageIndex = this.pageIndex - 1;
+        }
+    }
+    /**
+     * Navigates to the next page.
+     */
+    async nextPage() {
+        if (this.pageIndex < this.pageCount - 1) {
+            this.pageIndex = this.pageIndex + 1;
+        }
+    }
+    /**
+     * Navigates to the last page.
+     */
+    async lastPage() {
+        this.pageIndex = this.pageCount - 1;
+    }
+    /**
+     * Navigates to a specific page by index.
+     * @param {number} index The zero-based page index to navigate to.
+     */
+    async setPageIndex(index) {
+        if (index >= 0 && index < this.pageCount) {
+            this.pageIndex = index;
+        }
+    }
+    /**
+     * Changes the number of rows displayed per page.
+     * @param {number} size The new page size.
+     */
+    async setPageSize(size) {
+        if (size > 0) {
+            this.pageSize = size;
+        }
+    }
+    //#endregion METHODS
+    /****************************************************************************/
+    //#region WATCHERS
+    /**
+     * Watches for changes to pageIndex and emits the pageIndexChanged event.
+     * @param {number} newValue The new page index value.
+     */
+    onPageIndexChange(newValue) {
+        this.pageIndexChanged.emit(newValue);
+    }
+    /**
+     * Watches for changes to pageSize and emits the pageSizeChanged event.
+     * @param {number} newValue The new page size value.
+     */
+    onPageSizeChange(newValue) {
+        this.pageSizeChanged.emit(newValue);
+    }
+    //#endregion EVENTS
+    /****************************************************************************/
+    //#region RENDER
+    render() {
+        const atFirstPage = isFirstPage(this.pageIndex);
+        const atLastPage = isLastPage(this.pageIndex, this.pageCount);
+        // Use fallback values to handle undefined props (can happen when frameworks pass undefined explicitly)
+        const pageLabel = interpolate(this.labelPage, { pageIndex: this.pageIndex + 1, pageCount: this.pageCount }, 'Page {pageIndex} of {pageCount}');
+        const totalLabel = interpolate(this.labelTotal, { rowCount: this.rowCount }, 'Total: {rowCount} rows');
+        const pageSizeOptions = generatePageSizeOptions(this.labelPageSizeOption ?? '{pageSize} per page');
+        return (index.h(index.Host, { key: '1c032ac283f0b259804d05df2d82c496a4ba2590' }, !this.hideControls && (index.h("div", { key: '3d1bdf1d99583a1dfeef2c9b2f8d120862e5f771', "data-scope": "controls" }, !this.hideFirstLast && (index.h("nv-iconbutton", { key: '353464b98b5af27b9932f7ada5358a5fe3886ca5', name: "chevrons-left", emphasis: "lower", size: "sm", disabled: atFirstPage, onClick: () => this.firstPage() })), !this.hidePrevNext && (index.h("nv-iconbutton", { key: '3196094e7ccff072e292c4e7ba7fe1d23d9a74f9', name: "chevron-left", emphasis: "lower", size: "sm", disabled: atFirstPage, onClick: () => this.previousPage() })), !this.hidePrevNext && (index.h("nv-iconbutton", { key: 'c9a82233745d41c812ba9d18ac133e54dd183435', name: "chevron-right", emphasis: "lower", size: "sm", disabled: atLastPage, onClick: () => this.nextPage() })), !this.hideFirstLast && (index.h("nv-iconbutton", { key: '649b89169098230931ec30f205548104342e4d8c', name: "chevrons-right", emphasis: "lower", size: "sm", disabled: atLastPage, onClick: () => this.lastPage() })))), index.h("span", { key: '3e1311af13227e797ad6914ab70274e554a2f8b2', "data-scope": "page-label" }, pageLabel), index.h("span", { key: '63d020bd24a353d47dc3097146b2afd9b31de612', "data-scope": "total" }, totalLabel), index.h("div", { key: '046597be91d6d83551557592aedb799e3d86da4c', "data-scope": "per-page" }, index.h("nv-fieldselect", { key: '8d661cb40826a34d323d07bb994b5019eb0127fc', value: String(this.pageSize), onValueChanged: this.handlePageSizeChange, options: pageSizeOptions })), index.h("slot", { key: '385e77f742cb4501d26706b08986825d817fd725' })));
+    }
+    static get watchers() { return {
+        "pageIndex": [{
+                "onPageIndexChange": 0
+            }],
+        "pageSize": [{
+                "onPageSizeChange": 0
+            }]
+    }; }
+};
+NvPaginationtable.style = nvPaginationtableCss();
+
+exports.nv_paginationtable = NvPaginationtable;