@nova-design-system/nova-react 3.9.0 → 3.10.0

package/dist/cjs/nv-buttongroup.entry-BGpQpMD_.js

@@ -0,0 +1,195 @@
+'use strict';
+
+var index = require('./index-Cm4m8MM1.js');
+require('react');
+
+/**
+ * Utility functions for nv-buttongroup.
+ */
+/**
+ * Recursively finds the first button or link element within a container
+ * @param {HTMLElement} element - The HTML element to search within
+ * @returns {HTMLElement | null} The first button or link element found, or null if none exists
+ */
+function findFirstButtonOrLink(element) {
+    // Check if the element itself is a button or link
+    const tagName = element.tagName.toLowerCase();
+    if (tagName === 'nv-button' ||
+        tagName === 'nv-iconbutton' ||
+        tagName === 'a') {
+        return element;
+    }
+    // Recursively search through children
+    for (const child of Array.from(element.children)) {
+        const found = findFirstButtonOrLink(child);
+        if (found) {
+            return found;
+        }
+    }
+    return null;
+}
+/**
+ * Forwards the buttongroup properties to all child elements
+ * @param {HTMLElement} containerElement - The container element containing the buttons
+ * @param {object} props - The properties to forward to children
+ * @param {string} props.size - The size property to apply
+ * @param {string} props.emphasis - The emphasis property to apply
+ * @param {boolean} props.fluid - Whether the buttons should be fluid
+ */
+function forwardPropsToChildren(containerElement, props) {
+    const children = Array.from(containerElement.children);
+    const buttonElements = [];
+    // Find the first button or link in each direct child
+    children.forEach(child => {
+        const buttonOrLink = findFirstButtonOrLink(child);
+        if (buttonOrLink) {
+            buttonElements.push(buttonOrLink);
+        }
+    });
+    buttonElements.forEach(element => {
+        element.classList.remove('first', 'last', 'group-item');
+    });
+    // Apply properties and positional classes to found elements
+    buttonElements.forEach((element, index) => {
+        const isFirst = index === 0;
+        const isLast = index === buttonElements.length - 1;
+        const tagName = element.tagName.toLowerCase();
+        // Add positional classes
+        if (isFirst) {
+            element.classList.add('first');
+        }
+        if (isLast) {
+            element.classList.add('last');
+        }
+        // Add group item classes
+        element.classList.add('group-item');
+        // Forward props to nv-button elements
+        if (tagName === 'nv-button' || tagName === 'nv-iconbutton') {
+            element.setAttribute('size', props.size);
+            element.setAttribute('emphasis', props.emphasis);
+            if (props.fluid) {
+                element.setAttribute('fluid', '');
+            }
+            else {
+                element.removeAttribute('fluid');
+            }
+        }
+        // Forward props to anchor elements by adding CSS classes
+        if (tagName === 'a') {
+            element.classList.add('nv-button');
+            element.classList.add(`size-${props.size}`);
+            element.classList.add(`emphasis-${props.emphasis}`);
+            if (props.fluid) {
+                element.classList.add('fluid');
+            }
+            else {
+                element.classList.remove('fluid');
+            }
+        }
+    });
+}
+
+const nvButtongroupCss = "nv-buttongroup{display:flex}nv-buttongroup[emphasis=high]{gap:1px}nv-buttongroup[emphasis=low] .group-item,nv-buttongroup[emphasis=low] .group-item:hover{border:1px solid var(--components-button-low-text)}nv-buttongroup[emphasis=lower] .group-item,nv-buttongroup[emphasis=lower] .group-item:hover{border:1px solid var(--components-button-lower-text)}nv-buttongroup:not([orientation=vertical]) .group-item:not(.last):not(.first){border-radius:0}nv-buttongroup:not([orientation=vertical]) .group-item.first{border-top-right-radius:0;border-bottom-right-radius:0}nv-buttongroup:not([orientation=vertical]) .group-item.last{border-top-left-radius:0;border-bottom-left-radius:0}nv-buttongroup:not([orientation=vertical])[emphasis=medium] .group-item:not(.last){border-right:none}nv-buttongroup:not([orientation=vertical])[emphasis=low] .group-item:not(.last){border-right:none}nv-buttongroup:not([orientation=vertical])[emphasis=low] .group-item:not(.first){border-left:none}nv-buttongroup:not([orientation=vertical])[emphasis=lower] .group-item:not(.last){border-right:none}nv-buttongroup:not([orientation=vertical])[emphasis=lower] .group-item:not(.first){border-left:none}nv-buttongroup[orientation=vertical]{flex-direction:column;align-items:stretch;width:fit-content}nv-buttongroup[orientation=vertical] .group-item{width:unset;display:flex}nv-buttongroup[orientation=vertical] .group-item:not(.last):not(.first){border-radius:0}nv-buttongroup[orientation=vertical] .group-item.first{border-bottom-left-radius:0;border-bottom-right-radius:0}nv-buttongroup[orientation=vertical] .group-item.last{border-top-left-radius:0;border-top-right-radius:0}nv-buttongroup[orientation=vertical][emphasis=medium] .group-item:not(.last){border-bottom:none}nv-buttongroup[orientation=vertical][emphasis=low] .group-item:not(.last){border-bottom:none}nv-buttongroup[orientation=vertical][emphasis=low] .group-item:not(.first){border-top:none}nv-buttongroup[orientation=vertical][emphasis=lower] .group-item:not(.last){border-bottom:none}nv-buttongroup[orientation=vertical][emphasis=lower] .group-item:not(.first){border-top:none}";
+const NvButtongroupStyle0 = nvButtongroupCss;
+
+const NvButtongroup = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        /****************************************************************************/
+        //#region PROPERTIES
+        /**
+         * Determines how large or small all the buttons appear, allowing for
+         * customization of the button's dimensions to fit different design
+         * specifications and user needs.
+         */
+        this.size = 'md';
+        /**
+         * Adjusts the emphasis of all the buttons to make it more or less visually
+         * prominent to users. Use this to draw attention to important actions or
+         * reduce focus on less critical ones
+         */
+        this.emphasis = 'medium';
+        /**
+         * Allows the button group to stretch and fill the entire width of its
+         * container.
+         */
+        this.fluid = false;
+        /**
+         * Determines the orientation of the button group. When enabled, the buttons
+         * are stacked vertically rather than aligned side by side.
+         */
+        this.orientation = 'horizontal';
+        //#endregion PROPERTIES
+        /****************************************************************************/
+        //#region METHODS
+        /**
+         * Forwards the buttongroup properties to all child elements
+         */
+        this.forwardPropsToChildren = () => {
+            forwardPropsToChildren(this.el, {
+                size: this.size,
+                emphasis: this.emphasis,
+                fluid: this.fluid,
+            });
+        };
+        /**
+         * Sets up the MutationObserver to watch for changes in child elements
+         */
+        this.setupMutationObserver = () => {
+            this.mutationObserver = new MutationObserver(mutations => {
+                mutations.forEach(mutation => {
+                    if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
+                        // Forward props to all children when changes occur
+                        this.forwardPropsToChildren();
+                    }
+                });
+            });
+            this.mutationObserver.observe(this.el, {
+                childList: true,
+                subtree: true,
+            });
+        };
+    }
+    //#endregion METHODS
+    /****************************************************************************/
+    //#region WATCHERS
+    onEmphasisChange() {
+        this.forwardPropsToChildren();
+    }
+    onSizeChange() {
+        this.forwardPropsToChildren();
+    }
+    onFluidChange() {
+        this.forwardPropsToChildren();
+    }
+    //#endregion WATCHERS
+    /****************************************************************************/
+    //#region LIFECYCLE
+    componentWillLoad() {
+        this.forwardPropsToChildren();
+        this.setupMutationObserver();
+    }
+    disconnectedCallback() {
+        if (this.mutationObserver) {
+            this.mutationObserver.disconnect();
+        }
+    }
+    //#endregion LIFECYCLE
+    /****************************************************************************/
+    //#region EVENTS
+    //#endregion EVENTS
+    /****************************************************************************/
+    //#region RENDER
+    render() {
+        return (index.h(index.Host, { key: 'd0322897a0312e7b55b087e4abfc94fcaf9f7747' }, index.h("slot", { key: '70afccf10fe728482096d3fce42083e9931e06bd' })));
+    }
+    get el() { return index.getElement(this); }
+    static get watchers() { return {
+        "emphasis": ["onEmphasisChange"],
+        "size": ["onSizeChange"],
+        "fluid": ["onFluidChange"]
+    }; }
+};
+NvButtongroup.style = NvButtongroupStyle0;
+
+exports.nv_buttongroup = NvButtongroup;

package/dist/cjs/{nv-calendar.entry-BHT-inlG.js → nv-calendar.entry-CAINTAPB.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-var index = require('./index-BPZo04LR.js');
-var constants4faa1fae = require('./constants-4faa1fae-BzFAKCkR.js');
+var index = require('./index-Cm4m8MM1.js');
+var constants23aaef7b = require('./constants-23aaef7b-Cj2b-su0.js');
 var _commonjsHelpers1789f0cf = require('./_commonjsHelpers-1789f0cf-BJu3ubxk.js');
 require('react');
 
@@ -239,6 +239,74 @@ function parseDate(dateInput, dateFormat) {
     }
     return parsed.toDate();
 }
+/**
+ * Checks if a date is disabled.
+ * @param {Date} date - Date to check
+ * @param {string} min - Minimum date
+ * @param {string} max - Maximum date
+ * @param {Date[]} parsedDisabledDates - Parsed disabled dates
+ * @param {string} dateFormat - Date format
+ * @param {boolean} isUTCMode - Whether the dates are in UTC mode
+ * @returns {boolean} true if the date is disabled
+ */
+function isDateDisabledUtil(date, min, max, parsedDisabledDates, dateFormat, isUTCMode) {
+    if (!date)
+        return true;
+    if (min) {
+        const minDate = parseDate(min, dateFormat);
+        if (minDate && date < minDate) {
+            return true;
+        }
+    }
+    if (max) {
+        const maxDate = parseDate(max, dateFormat);
+        if (maxDate && date > maxDate) {
+            return true;
+        }
+    }
+    return parsedDisabledDates.some(disabledDate => isSameDate(date, disabledDate, { isUTCMode }));
+}
+/**
+ * Checks if a date is within the hover range.
+ * @param {Date} date - The date to check.
+ * @param {Date} startDate - The start of the range.
+ * @param {Date | null} hoverDate - The hovered date.
+ * @returns {boolean} True if the date is in the hover range.
+ */
+const isInHoverRange = (date, startDate, hoverDate) => {
+    if (!hoverDate || !startDate || !date) {
+        return false;
+    }
+    const start = startDate < hoverDate ? startDate : hoverDate;
+    const end = startDate < hoverDate ? hoverDate : startDate;
+    return date > start && date < end;
+};
+/**
+ * Checks if the hover range is valid (does not contain disabled dates).
+ * @param {Date} startDate - The start of the range.
+ * @param {Date | null} hoverDate - The hovered date.
+ * @param {string} min - The minimum allowed date.
+ * @param {string} max - The maximum allowed date.
+ * @param {Date[]} parsedDisabledDates - An array of disabled dates.
+ * @param {string} dateFormat - The date format for parsing.
+ * @param {boolean} isUTCMode - Flag for UTC mode.
+ * @returns {boolean} True if the hover range is valid.
+ */
+const isHoverRangeValid = (startDate, hoverDate, min, max, parsedDisabledDates, dateFormat, isUTCMode) => {
+    if (!hoverDate || !startDate) {
+        return true;
+    }
+    const start = startDate < hoverDate ? startDate : hoverDate;
+    const end = startDate < hoverDate ? hoverDate : startDate;
+    const current = new Date(start);
+    while (current <= end) {
+        if (isDateDisabledUtil(current, min, max, parsedDisabledDates, dateFormat, isUTCMode)) {
+            return false;
+        }
+        current.setDate(current.getDate() + 1);
+    }
+    return true;
+};
 
 /**
  * Renders a single day cell in the calendar grid
@@ -246,7 +314,7 @@ function parseDate(dateInput, dateFormat) {
  * @returns {JSX.Element} JSX element representing a day cell
  */
 const DayCell = props => {
-    const { date, dayOfMonth, isCurrentMonth, isSelected, isInRange, isStart, isEnd, isToday, isDisabled, onClick, } = props;
+    const { date, dayOfMonth, isCurrentMonth, isSelected, isInRange, isStart, isEnd, isToday, isDisabled, onClick, onDayHover, isInHoverRange, isHoverRangeValid, } = props;
     // Build CSS classes for the day cell
     const dayClasses = [
         'day',
@@ -257,17 +325,12 @@ const DayCell = props => {
         isDisabled ? 'disabled' : '',
         !isCurrentMonth ? 'outside-month' : '',
         isToday ? 'is-today' : '',
+        isInHoverRange && isHoverRangeValid ? 'hover-range' : '',
+        isInHoverRange && !isHoverRangeValid ? 'hover-blocked' : '',
     ]
         .filter(Boolean)
         .join(' ');
-    const handleClick = () => {
-        if (!isDisabled && onClick) {
-            onClick(date);
-        }
-    };
-    return (
-    // eslint-disable-next-line react/jsx-no-bind
-    index.h("div", { class: dayClasses, onClick: handleClick, "aria-disabled": isDisabled }, dayOfMonth));
+    return (index.h("div", { class: dayClasses, "data-date": date.toISOString(), onClick: !isDisabled ? onClick : undefined, onMouseEnter: onDayHover, "aria-disabled": isDisabled }, dayOfMonth));
 };
 
 /**
@@ -392,10 +455,10 @@ const CalendarHeader = props => {
  * @returns {JSX.Element} JSX element representing the calendar grid
  */
 const CalendarGrid = props => {
-    const { days, dayNames, selectionType, selectedDate, startDate, endDate, isUTCMode, onDayClick, isDateInRange, isToday, } = props;
+    const { days, dayNames, selectionType, selectedDate, startDate, endDate, isUTCMode, onDayClick, isDateInRange, isToday, onDayHover, onMouseLeave, hoverDate, isInHoverRange, isHoverRangeValid, } = props;
     return (index.h("div", { class: "days-container" },
         index.h("div", { class: "days-header" }, dayNames.map((day, index$1) => (index.h("div", { class: "day-header", key: `day-header-${index$1}` }, day)))),
-        index.h("div", { class: "days-grid" }, days.map(day => {
+        index.h("div", { class: "days-grid", onMouseLeave: onMouseLeave }, days.map(day => {
             if (day.isBlank) {
                 return index.h("div", { class: "day day-blank" });
             }
@@ -409,11 +472,13 @@ const CalendarGrid = props => {
             const isStart = isSameDate(date, startDate, { isUTCMode });
             const isEnd = isSameDate(date, endDate, { isUTCMode });
             const isTodayDate = isToday(date);
-            return (index.h(DayCell, { date: date, dayOfMonth: day.dayOfMonth, isCurrentMonth: day.isCurrentMonth, isSelected: isSelected, isInRange: isInRange, isStart: isStart, isEnd: isEnd, isToday: isTodayDate, isDisabled: day.isDisabled, selectionType: selectionType, onClick: onDayClick }));
+            const inHoverRange = isInHoverRange(date, startDate, hoverDate);
+            const hoverRangeValid = isHoverRangeValid(startDate, hoverDate);
+            return (index.h(DayCell, { date: date, dayOfMonth: day.dayOfMonth, isCurrentMonth: day.isCurrentMonth, isSelected: isSelected, isInRange: isInRange, isStart: isStart, isEnd: isEnd, isToday: isTodayDate, isDisabled: day.isDisabled, selectionType: selectionType, onClick: onDayClick, onDayHover: onDayHover, isInHoverRange: inHoverRange, isHoverRangeValid: hoverRangeValid }));
         }))));
 };
 
-const nvCalendarCss = "nv-calendar{display:block}.datepicker-root{display:flex;justify-content:center;align-items:flex-start;width:auto}.datepicker-container{font-family:system-ui, sans-serif;display:flex;flex-direction:column;align-items:stretch;background:var(--components-calendar-background);border-radius:var(--calendar-radius);padding:var(--calendar-padding);box-shadow:0px var(--shadow-y-axis-md-1) var(--shadow-blur-md-1) var(--shadow-spread-md, 0) var(--shadow-color-opacity-0), 0px var(--shadow-y-axis-md-2) var(--shadow-blur-md-2) var(--shadow-spread-md, 0) var(--shadow-color-opacity-2);border:1px solid var(--components-calendar-border);width:auto;max-width:100%}.datepicker-container-single{max-width:300px}.datepicker-container-single .datepicker-wrapper:has(.shortcuts-placement-left),.datepicker-container-single .datepicker-wrapper:has(.shortcuts-placement-right){max-width:410px !important}.datepicker-container-single:has(.shortcuts-placement-left),.datepicker-container-single:has(.shortcuts-placement-right){max-width:410px !important}.datepicker-wrapper{display:flex;justify-content:center;align-items:flex-start;gap:var(--calendar-gap-x);width:auto;overflow-x:hidden}.datepicker-wrapper::-webkit-scrollbar{width:6px;height:6px}.datepicker-wrapper::-webkit-scrollbar-track{background-color:var(--color-level-10-background);border-radius:9999px}.datepicker-wrapper::-webkit-scrollbar-thumb{background-color:var(--color-gray-200);border-radius:9999px}.datepicker-wrapper.single{justify-content:center}.calendar-container{display:flex;flex-direction:column;align-items:center;padding:var(--calendar-padding);width:auto;position:relative}.calendar-separator{width:1px;background:var(--components-calendar-border);height:auto;min-height:100%;margin:0 10px}.header{display:flex;justify-content:start;align-items:center;margin-bottom:var(--calendar-header-margin-bottom);width:100%}.header nv-iconbutton{width:var(--calendar-header-button-size);height:var(--calendar-header-button-size)}.nav-buttons{display:flex;gap:var(--spacing-0);margin-left:auto}.nav-left{order:-1}.date-controls{display:flex;gap:var(--spacing-1);align-items:center;min-height:34px;justify-content:center}.datepicker-container-single .date-controls{justify-content:flex-start}.datepicker-container:not(.datepicker-container-single) .date-controls{justify-content:start;flex-grow:1}.date-controls .month-select,.date-controls .year-input{background:transparent !important}.calendar-wrapper:nth-child(n+2) .datepicker-container{margin-left:42px}.calendar-grid{display:grid;grid-template-columns:auto 1fr;column-gap:var(--calendar-weeks-calendar-gap-x);position:relative}.calendar-grid.slide-left{animation:slideLeft 0.3s ease-out}.calendar-grid.slide-right{animation:slideRight 0.3s ease-out}.week-numbers{display:grid;grid-template-rows:var(--calendar-cell-size) repeat(6, var(--calendar-cell-size));background:var(--components-calendar-weeks-background);color:var(--components-calendar-weeks-text);border-radius:var(--calendar-weeks-radius);width:var(--calendar-weeks-size);row-gap:var(--calendar-grid-gap-y)}.week-numbers .clickable{cursor:pointer}.week-numbers .clickable:hover{background-color:var(--components-calendar-weeks-background-hover);color:var(--components-calendar-weeks-text-hover);border-radius:var(--calendar-radius)}.week-header,.week-number{display:grid;place-items:center;font-size:var(--calendar-cell-font-size)}.week-header{font-weight:700;color:var(--components-calendar-weeks-text)}.week-number{color:var(--components-calendar-cell-text)}.days-container{display:grid;grid-template-rows:auto 1fr;row-gap:var(--calendar-grid-gap-y)}.days-header{display:grid;grid-template-columns:repeat(7, var(--calendar-cell-size));height:var(--calendar-cell-size)}.day-header{display:grid;place-items:center;font-size:var(--calendar-cell-font-size);color:var(--components-calendar-cell-text)}.days-grid{display:grid;grid-template-columns:repeat(7, var(--calendar-cell-size));grid-template-rows:repeat(6, var(--calendar-cell-size));animation:fadeIn 0.2s ease-in;row-gap:var(--calendar-grid-gap-y);z-index:0}.day{display:grid;place-items:center;width:var(--calendar-cell-size);height:var(--calendar-cell-size);font-size:var(--calendar-cell-font-size);border-radius:var(--calendar-cell-radius);cursor:pointer;border:none;background:transparent;transition:all 0.2s ease;text-align:center;animation:scaleIn 0.2s ease-out}.day:hover:not(.disabled,.empty,.selected){background:var(--components-calendar-cell-background-hover);color:var(--components-calendar-cell-text-hover)}.day.selected,.day.selected:hover .day.is-today.selected,.day.is-today.selected:hover{background:var(--components-calendar-cell-background-selected);color:var(--components-calendar-cell-text-selected) !important}.day.disabled{opacity:var(--opacity-disabled);cursor:not-allowed}.day.is-empty{pointer-events:none;background-color:transparent;border-color:transparent}.day.day-blank{pointer-events:none;background-color:transparent;border-color:transparent}.day.outside-month{color:var(--components-calendar-cell-text);opacity:var(--opacity-disabled)}.day.outside-month.selected{opacity:1 !important;color:var(--components-calendar-cell-text-selected)}.day.outside-month.in-range{opacity:0.5 !important;background-color:var(--components-calendar-cell-background-in-range);color:var(--components-calendar-cell-text-in-range)}.day.outside-month.in-range:hover{opacity:0.7 !important;background-color:var(--components-calendar-cell-background-in-range)}.day.in-range{background:var(--components-calendar-cell-background-in-range);color:var(--components-calendar-cell-text-in-range);border-radius:0;position:relative}.day.range-start,.day.range-start:focus,.day.range-start:hover,.day.range-end,.day.range-end:focus,.day.range-end:hover{background-color:var(--components-calendar-cell-background-selected) !important;color:var(--components-calendar-cell-text-selected) !important}.day.range-start,.day.range-end,.day.range-start.is-today,.day.range-end.is-today{background:var(--components-calendar-cell-background-selected);color:var(--components-calendar-cell-text-selected);position:relative;border-radius:var(--radius-rounded-full)}.day.range-start:hover,.day.range-end:hover,.day.range-start.is-today:hover,.day.range-end.is-today:hover{color:var(--components-calendar-cell-text-today)}.day.range-start:before,.day.range-end:before,.day.range-start.is-today:before,.day.range-end.is-today:before{content:\"\";position:absolute;bottom:0;left:0;right:0;top:0;z-index:-1;background-color:var(--components-calendar-cell-background-in-range);border-radius:var(--radius-rounded-full);width:auto;height:auto}.day.range-start:has(~.range-end):before,.day.range-start:has(+.in-range):before{border-top-right-radius:0;border-bottom-right-radius:0}.day.range-end:before{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}.day.outside-month.range-start,.day.outside-month.range-end{opacity:1 !important;background:var(--components-calendar-cell-background-selected) !important;color:var(--components-calendar-cell-text-selected)}.day.is-today{font-weight:700;position:relative;color:var(--components-calendar-cell-text-today)}.day.is-today.range-start,.day.is-today.range-end{color:var(--components-calendar-cell-text-selected)}.day.is-today.range-start:hover,.day.is-today.range-end:hover{color:var(--components-calendar-cell-text-today)}.day.is-today::after{content:\"\";position:absolute;bottom:var(--spacing-1);left:50%;transform:translateX(-50%);width:var(--calendar-cell-dot-size);height:var(--calendar-cell-dot-size);background-color:currentColor;border-radius:50%}.day.is-today.selected::after{color:var(--components-calendar-cell-text-selected)}.day.is-today.selected::after::after{background-color:var(--components-calendar-cell-dot-selected)}.calendar-footer{display:flex;gap:var(--spacing-1);justify-content:flex-start;width:100%;flex-wrap:wrap}.footer-placement-left{justify-content:flex-start}.footer-placement-right{justify-content:flex-end}.footer-placement-center{justify-content:center}.datepicker-controls{display:flex;flex-direction:column;border-top:1px solid var(--components-calendar-border);padding:var(--calendar-controls-padding-top) var(--calendar-padding) var(--calendar-padding);gap:var(--calendar-grid-gap-y);margin-top:var(--calendar-controls-margin-top)}.datepicker-actions{display:flex;justify-content:flex-end;gap:var(--spacing-1);width:100%}.datepicker-actions slot-fb{display:contents !important}.calendar-footer+.datepicker-actions{margin-top:0}.shortcuts-placement-left,.shortcuts-placement-right{display:flex;flex-direction:column;gap:var(--spacing-1);margin-top:var(--spacing-4)}.shortcuts-placement-left{align-items:flex-end}.shortcuts-placement-right{align-items:flex-start}@keyframes slideLeft{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}@keyframes slideRight{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{from{opacity:0;transform:scale(0.9)}to{opacity:1;transform:scale(1)}}";
+const nvCalendarCss = "nv-calendar{display:block}.datepicker-root{display:flex;justify-content:center;align-items:flex-start;width:auto}.datepicker-container{font-family:system-ui, sans-serif;display:flex;flex-direction:column;align-items:stretch;background:var(--components-calendar-background);border-radius:var(--calendar-radius);padding:var(--calendar-padding);box-shadow:0px var(--shadow-y-axis-md-1) var(--shadow-blur-md-1) var(--shadow-spread-md, 0) var(--shadow-color-opacity-0), 0px var(--shadow-y-axis-md-2) var(--shadow-blur-md-2) var(--shadow-spread-md, 0) var(--shadow-color-opacity-2);border:1px solid var(--components-calendar-border);width:auto;max-width:100%}.datepicker-container-single{max-width:300px}.datepicker-container-single .datepicker-wrapper:has(.shortcuts-placement-left),.datepicker-container-single .datepicker-wrapper:has(.shortcuts-placement-right){max-width:410px !important}.datepicker-container-single:has(.shortcuts-placement-left),.datepicker-container-single:has(.shortcuts-placement-right){max-width:410px !important}.datepicker-wrapper{display:flex;justify-content:center;align-items:flex-start;gap:var(--calendar-gap-x);width:auto;overflow-x:hidden}.datepicker-wrapper::-webkit-scrollbar{width:6px;height:6px}.datepicker-wrapper::-webkit-scrollbar-track{background-color:var(--color-level-10-background);border-radius:9999px}.datepicker-wrapper::-webkit-scrollbar-thumb{background-color:var(--color-gray-200);border-radius:9999px}.datepicker-wrapper.single{justify-content:center}.calendar-container{display:flex;flex-direction:column;align-items:center;padding:var(--calendar-padding);width:auto;position:relative}.calendar-separator{width:1px;background:var(--components-calendar-border);height:auto;min-height:100%;margin:0 10px}.header{display:flex;justify-content:start;align-items:center;margin-bottom:var(--calendar-header-margin-bottom);width:100%}.header nv-iconbutton{width:var(--calendar-header-button-size);height:var(--calendar-header-button-size)}.nav-buttons{display:flex;gap:var(--spacing-0);margin-left:auto}.nav-left{order:-1}.date-controls{display:flex;gap:var(--spacing-1);align-items:center;min-height:34px;justify-content:center}.datepicker-container-single .date-controls{justify-content:flex-start}.datepicker-container:not(.datepicker-container-single) .date-controls{justify-content:start;flex-grow:1}.date-controls .month-select,.date-controls .year-input{background:transparent !important}.calendar-wrapper:nth-child(n+2) .datepicker-container{margin-left:42px}.calendar-grid{display:grid;grid-template-columns:auto 1fr;column-gap:var(--calendar-weeks-calendar-gap-x);position:relative}.calendar-grid.slide-left{animation:slideLeft 0.3s ease-out}.calendar-grid.slide-right{animation:slideRight 0.3s ease-out}.week-numbers{display:grid;grid-template-rows:var(--calendar-cell-size) repeat(6, var(--calendar-cell-size));background:var(--components-calendar-weeks-background);color:var(--components-calendar-weeks-text);border-radius:var(--calendar-weeks-radius);width:var(--calendar-weeks-size);row-gap:var(--calendar-grid-gap-y)}.week-numbers .clickable{cursor:pointer}.week-numbers .clickable:hover{background-color:var(--components-calendar-weeks-background-hover);color:var(--components-calendar-weeks-text-hover);border-radius:var(--calendar-radius)}.week-header,.week-number{display:grid;place-items:center;font-size:var(--calendar-cell-font-size)}.week-header{font-weight:700;color:var(--components-calendar-weeks-text)}.week-number{color:var(--components-calendar-cell-text)}.days-container{display:grid;grid-template-rows:auto 1fr;row-gap:var(--calendar-grid-gap-y)}.days-header{display:grid;grid-template-columns:repeat(7, var(--calendar-cell-size));height:var(--calendar-cell-size)}.day-header{display:grid;place-items:center;font-size:var(--calendar-cell-font-size);color:var(--components-calendar-cell-text)}.days-grid{display:grid;grid-template-columns:repeat(7, var(--calendar-cell-size));grid-template-rows:repeat(6, var(--calendar-cell-size));animation:fadeIn 0.2s ease-in;row-gap:var(--calendar-grid-gap-y);z-index:0}.day{display:grid;place-items:center;width:var(--calendar-cell-size);height:var(--calendar-cell-size);font-size:var(--calendar-cell-font-size);border-radius:var(--calendar-cell-radius);cursor:pointer;border:none;background:transparent;transition:all 0.2s ease;text-align:center;animation:scaleIn 0.2s ease-out}.day:hover:not(.disabled,.empty,.selected){background:var(--components-calendar-cell-background-hover);color:var(--components-calendar-cell-text-hover)}.day.selected,.day.selected:hover .day.is-today.selected,.day.is-today.selected:hover{background:var(--components-calendar-cell-background-selected);color:var(--components-calendar-cell-text-selected) !important}.day.disabled{opacity:var(--opacity-disabled);cursor:not-allowed}.day.is-empty{pointer-events:none;background-color:transparent;border-color:transparent}.day.day-blank{pointer-events:none;background-color:transparent;border-color:transparent}.day.outside-month{color:var(--components-calendar-cell-text);opacity:var(--opacity-disabled)}.day.outside-month.selected{opacity:1 !important;color:var(--components-calendar-cell-text-selected)}.day.outside-month.in-range{opacity:0.5 !important;background-color:var(--components-calendar-cell-background-in-range);color:var(--components-calendar-cell-text-in-range)}.day.outside-month.in-range:hover{opacity:0.7 !important;background-color:var(--components-calendar-cell-background-in-range)}.day.in-range{background:var(--components-calendar-cell-background-in-range);color:var(--components-calendar-cell-text-in-range);border-radius:0;position:relative}.day.range-start,.day.range-start:focus,.day.range-start:hover,.day.range-end,.day.range-end:focus,.day.range-end:hover{background-color:var(--components-calendar-cell-background-selected) !important;color:var(--components-calendar-cell-text-selected) !important}.day.range-start,.day.range-end,.day.range-start.is-today,.day.range-end.is-today{background:var(--components-calendar-cell-background-selected);color:var(--components-calendar-cell-text-selected);position:relative;border-radius:var(--radius-rounded-full)}.day.range-start:hover,.day.range-end:hover,.day.range-start.is-today:hover,.day.range-end.is-today:hover{color:var(--components-calendar-cell-text-today)}.day.range-start:before,.day.range-end:before,.day.range-start.is-today:before,.day.range-end.is-today:before{content:\"\";position:absolute;bottom:0;left:0;right:0;top:0;z-index:-1;background-color:var(--components-calendar-cell-background-in-range);border-radius:var(--radius-rounded-full);width:auto;height:auto}.day.range-start:has(~.range-end):before,.day.range-start:has(+.in-range):before{border-top-right-radius:0;border-bottom-right-radius:0}.day.range-end:before{border-top-left-radius:0 !important;border-bottom-left-radius:0 !important}.day.outside-month.range-start,.day.outside-month.range-end{opacity:1 !important;background:var(--components-calendar-cell-background-selected) !important;color:var(--components-calendar-cell-text-selected)}.day.is-today{font-weight:700;position:relative;color:var(--components-calendar-cell-text-today)}.day.is-today.range-start,.day.is-today.range-end{color:var(--components-calendar-cell-text-selected)}.day.is-today.range-start:hover,.day.is-today.range-end:hover{color:var(--components-calendar-cell-text-today)}.day.is-today::after{content:\"\";position:absolute;bottom:var(--spacing-1);left:50%;transform:translateX(-50%);width:var(--calendar-cell-dot-size);height:var(--calendar-cell-dot-size);background-color:currentColor;border-radius:50%}.day.is-today.selected::after{color:var(--components-calendar-cell-text-selected)}.day.is-today.selected::after::after{background-color:var(--components-calendar-cell-dot-selected)}.day.hover-range{background-color:var(--components-calendar-cell-background-hover)}.day.hover-blocked{background-color:var(--components-calendar-cell-background-hover)}.day.disabled.hover-blocked{background-color:transparent}.calendar-footer{display:flex;gap:var(--spacing-1);justify-content:flex-start;width:100%;flex-wrap:wrap}.footer-placement-left{justify-content:flex-start}.footer-placement-right{justify-content:flex-end}.footer-placement-center{justify-content:center}.datepicker-controls{display:flex;flex-direction:column;border-top:1px solid var(--components-calendar-border);padding:var(--calendar-controls-padding-top) var(--calendar-padding) var(--calendar-padding);gap:var(--calendar-grid-gap-y);margin-top:var(--calendar-controls-margin-top)}.datepicker-actions{display:flex;justify-content:flex-end;gap:var(--spacing-1);width:100%}.datepicker-actions slot-fb{display:contents !important}.calendar-footer+.datepicker-actions{margin-top:0}.shortcuts-placement-left,.shortcuts-placement-right{display:flex;flex-direction:column;gap:var(--spacing-1);margin-top:var(--spacing-4)}.shortcuts-placement-left{align-items:flex-end}.shortcuts-placement-right{align-items:flex-start}@keyframes slideLeft{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}@keyframes slideRight{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{from{opacity:0;transform:scale(0.9)}to{opacity:1;transform:scale(1)}}";
 const NvCalendarStyle0 = nvCalendarCss;
 
 const NvCalendar = class {
@@ -480,6 +545,7 @@ const NvCalendar = class {
         this.selectedDate = null;
         this.startDate = null;
         this.endDate = null;
+        this.hoverDate = null;
         /** List of formatted months for the selector */
         this.months = [];
         /**
@@ -498,6 +564,12 @@ const NvCalendar = class {
                 .split(',')
                 .map(v => v.trim())
                 .filter(Boolean);
+            if (this.selectionType === 'range' && values.length < 2) {
+                console.warn(`Invalid date range format: ${value}`);
+                this.startDate = null;
+                this.endDate = null;
+                return;
+            }
             if (this.selectionType === 'single' && values.length >= 1) {
                 const parsedDate = parseDate(values[0], this.dateFormat);
                 if (parsedDate) {
@@ -542,7 +614,7 @@ const NvCalendar = class {
                 }
                 else {
                     // Handle malformed dates gracefully - reset state
-                    console.warn(`Invalid date range format: ${values[0]}, ${values[1]}`);
+                    console.warn(`Invalid date range format: ${values === null || values === void 0 ? void 0 : values[0]}, ${values === null || values === void 0 ? void 0 : values[1]}`);
                     this.startDate = null;
                     this.endDate = null;
                     if (!this.showActions) {
@@ -568,11 +640,29 @@ const NvCalendar = class {
             });
             this.currentDate = newDate;
         };
+        this.handleMouseLeave = () => {
+            this.hoverDate = null;
+        };
+        this.handleDayHover = (event) => {
+            const target = event.target;
+            const dateStr = target.getAttribute('data-date');
+            if (dateStr &&
+                this.selectionType === 'range' &&
+                this.startDate &&
+                !this.endDate) {
+                this.hoverDate = new Date(dateStr);
+            }
+        };
         /**
          * Handles date selection based on the mode
-         * @param {Date} date - Selected date
+         * @param {MouseEvent} event - The mouse event from the click.
          */
-        this.handleDateSelection = (date) => {
+        this.handleDateSelection = (event) => {
+            const target = event.target;
+            const dateStr = target.getAttribute('data-date');
+            if (!dateStr)
+                return;
+            const date = new Date(dateStr);
             if (this.isDateDisabled(date)) {
                 return;
             }
@@ -618,6 +708,7 @@ const NvCalendar = class {
             else {
                 // Complete range selection
                 this.endDate = date;
+                this.hoverDate = null;
                 // Ensure correct order
                 if (this.startDate > this.endDate) {
                     [this.startDate, this.endDate] = [this.endDate, this.startDate];
@@ -649,24 +740,7 @@ const NvCalendar = class {
          * @returns {boolean} true if the date is disabled
          */
         this.isDateDisabled = (date) => {
-            if (!date)
-                return true;
-            // Minimum bound check
-            if (this.min) {
-                const minDate = parseDate(this.min, this.dateFormat);
-                if (minDate && date < minDate) {
-                    return true;
-                }
-            }
-            // Maximum bound check
-            if (this.max) {
-                const maxDate = parseDate(this.max, this.dateFormat);
-                if (maxDate && date > maxDate) {
-                    return true;
-                }
-            }
-            // Check disabled dates
-            return this.parsedDisabledDates.some(disabledDate => isSameDate(date, disabledDate, { isUTCMode: this.isUTCMode }));
+            return isDateDisabledUtil(date, this.min, this.max, this.parsedDisabledDates, this.dateFormat, this.isUTCMode);
         };
         /**
          * Checks if a date is in the selected range
@@ -697,9 +771,9 @@ const NvCalendar = class {
         this.getDayNames = () => {
             let days;
             // If we have custom day names for this locale
-            if (constants4faa1fae.CUSTOM_DAY_NAMES[this.locale]) {
+            if (constants23aaef7b.CUSTOM_DAY_NAMES[this.locale]) {
                 // Custom day names are expected to start with Monday (index 0 = Monday)
-                days = [...constants4faa1fae.CUSTOM_DAY_NAMES[this.locale]];
+                days = [...constants23aaef7b.CUSTOM_DAY_NAMES[this.locale]];
             }
             else {
                 // Generate days using Intl.DateTimeFormat, starting from Monday
@@ -789,8 +863,8 @@ const NvCalendar = class {
         /** Initializes the list of formatted months according to the locale */
         this.initializeMonths = () => {
             // If we have custom month names for this locale
-            if (constants4faa1fae.CUSTOM_MONTH_NAMES[this.locale]) {
-                this.months = constants4faa1fae.CUSTOM_MONTH_NAMES[this.locale].map((label, value) => ({
+            if (constants23aaef7b.CUSTOM_MONTH_NAMES[this.locale]) {
+                this.months = constants23aaef7b.CUSTOM_MONTH_NAMES[this.locale].map((label, value) => ({
                     value,
                     label,
                 }));
@@ -808,7 +882,7 @@ const NvCalendar = class {
          * @returns {string} Localized abbreviation for "week"
          */
         this.getLocalizedWeekText = () => {
-            return constants4faa1fae.WEEK_ABBREVIATIONS[this.locale] || 'W';
+            return constants23aaef7b.WEEK_ABBREVIATIONS[this.locale] || 'W';
         };
         /**
          * Handles month change in the selector
@@ -1063,6 +1137,15 @@ const NvCalendar = class {
         index$1) => {
             return (index.h(WeekNumbers, { weeks: weeks, localizedWeekText: this.getLocalizedWeekText(), selectionType: this.selectionType, onWeekSelect: this.handleWeekSelection, calendarIndex: index$1 }));
         };
+        /**
+         * Checks if the hover range is valid
+         * @param {Date} startDate - Start date
+         * @param {Date | null} hoverDate - Hovered date
+         * @returns {boolean} true if the hover range is valid
+         */
+        this.isHoverRangeValidFn = (startDate, hoverDate) => {
+            return isHoverRangeValid(startDate, hoverDate, this.min, this.max, this.parsedDisabledDates, this.dateFormat, this.isUTCMode);
+        };
         /**
          * Renders the calendar
          * @param {number} index - Calendar index
@@ -1085,7 +1168,7 @@ const NvCalendar = class {
             targetDate.setUTCMonth(targetDate.getUTCMonth() + offset);
             const year = targetDate.getUTCFullYear();
             const month = targetDate.getUTCMonth();
-            return (index.h("div", { class: "calendar-wrapper" }, index.h("div", { class: "calendar-container", key: `calendar-${index$1}-${year}-${month}` }, this.renderHeader(offset, index$1), index.h("div", { class: "calendar-grid" }, this.showWeekNumbers && this.renderWeekNumbers(weeks, index$1), index.h(CalendarGrid, { days: days, dayNames: this.getDayNames(), selectionType: this.selectionType, selectedDate: this.selectedDate, startDate: this.startDate, endDate: this.endDate, isUTCMode: this.isUTCMode, onDayClick: this.handleDateSelection, isDateInRange: this.isDateInRange, isToday: this.isToday }))), index$1 < this.numberOfCalendars - 1 && (index.h("div", { class: "calendar-separator" }))));
+            return (index.h("div", { class: "calendar-wrapper" }, index.h("div", { class: "calendar-container", key: `calendar-${index$1}-${year}-${month}` }, this.renderHeader(offset, index$1), index.h("div", { class: "calendar-grid" }, this.showWeekNumbers && this.renderWeekNumbers(weeks, index$1), index.h(CalendarGrid, { days: days, dayNames: this.getDayNames(), selectionType: this.selectionType, selectedDate: this.selectedDate, startDate: this.startDate, endDate: this.endDate, isUTCMode: this.isUTCMode, onDayClick: this.handleDateSelection, isDateInRange: this.isDateInRange, isToday: this.isToday, onDayHover: this.handleDayHover, onMouseLeave: this.handleMouseLeave, hoverDate: this.hoverDate, isInHoverRange: isInHoverRange, isHoverRangeValid: this.isHoverRangeValidFn }))), index$1 < this.numberOfCalendars - 1 && (index.h("div", { class: "calendar-separator" }))));
         };
         /**
          * Renders the shortcuts
@@ -1305,8 +1388,8 @@ const NvCalendar = class {
      * @slot default - Child content of the component.
      */
     render() {
-        return (index.h(index.Host, { key: '7abeb96312f2bcf26eed3a133ef59d5d3b5b528f' }, index.h("div", { key: 'e0b2db720853551e3b6445e92b39b418123cb83e', class: "datepicker-root" }, index.h("div", { key: '1a83c285278c440c4e33ae770a033974e4924830', class: `datepicker-container ${this.numberOfCalendars === 1 ? 'datepicker-container-single' : ''}` }, index.h("div", { key: '3481fe780a3e1d8f0c1e22ffc82c3b7830721055', class: `datepicker-wrapper ${this.numberOfCalendars === 1 ? 'single' : ''}` }, this.shortcutsPlacement === 'left' && this.renderShortcuts(), Array.from({ length: this.numberOfCalendars }, (_, index) => this.renderCalendar(index, index)), this.shortcutsPlacement === 'right' && this.renderShortcuts()), ((this.hasShortcuts && this.shortcutsPlacement === 'bottom') ||
-            this.hasActions) && (index.h("div", { key: '3a644bdc993142c181c45173756e362025d4a23a', class: "datepicker-controls" }, this.shortcutsPlacement === 'bottom' && this.renderShortcuts(), this.hasActions && this.renderActions())))), index.h("slot", { key: '4a4290ccf63429a9a88cfd95a33b4fdc34c8ef74' })));
+        return (index.h(index.Host, { key: '15aa3c2afb51ea1fbd16de597889d687fb8d1982' }, index.h("div", { key: '6492b58cb2b5c9bb7fd6c40e8f37e9c2142b5827', class: "datepicker-root" }, index.h("div", { key: '3cb216c3af4900b48c2dcd09a0a0034c7ebf622d', class: `datepicker-container ${this.numberOfCalendars === 1 ? 'datepicker-container-single' : ''}` }, index.h("div", { key: '0663841721d5db871e7ede0ec396affa560ea99d', class: `datepicker-wrapper ${this.numberOfCalendars === 1 ? 'single' : ''}` }, this.shortcutsPlacement === 'left' && this.renderShortcuts(), Array.from({ length: this.numberOfCalendars }, (_, index) => this.renderCalendar(index, index)), this.shortcutsPlacement === 'right' && this.renderShortcuts()), ((this.hasShortcuts && this.shortcutsPlacement === 'bottom') ||
+            this.hasActions) && (index.h("div", { key: '0a17a627cb1e4a4cb2b91aa104403b00d055bce5', class: "datepicker-controls" }, this.shortcutsPlacement === 'bottom' && this.renderShortcuts(), this.hasActions && this.renderActions())))), index.h("slot", { key: '3104795c8cc9c81a6aca7e426a145e3966a4361e' })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/{nv-col.entry-AHfSMqc1.js → nv-col.entry-5trkPEIg.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BPZo04LR.js');
+var index = require('./index-Cm4m8MM1.js');
 var clsx297c1ffe = require('./clsx-297c1ffe-BtxeOLZW.js');
 require('react');
 
@@ -29,7 +29,7 @@ const NvCol = class {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (index.h(index.Host, { key: 'e258bc3e01d3bd35bf64f14241c70ae044fac132', class: clsx297c1ffe.clsx(this.getColSize()) }, index.h("slot", { key: 'd36caf0fde38eae6cd37b62fb4c02e3de6b7225e' })));
+        return (index.h(index.Host, { key: '4fe90a1d020de9e85d32a52ccb39c8b6d8c1fc25', class: clsx297c1ffe.clsx(this.getColSize()) }, index.h("slot", { key: '5a6ad624fd7c6251b2f555c0e3bc828c0e048761' })));
     }
 };
 NvCol.style = NvColStyle0;

package/dist/cjs/{nv-datagrid.entry-BRT5wQGR.js → nv-datagrid.entry-DqbLtkI4.js}

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-BPZo04LR.js');
+var index = require('./index-Cm4m8MM1.js');
 var dom_utilsAc71e0ef = require('./dom.utils-ac71e0ef-CmIwRr6O.js');
-var constants4faa1fae = require('./constants-4faa1fae-BzFAKCkR.js');
+var constants23aaef7b = require('./constants-23aaef7b-Cj2b-su0.js');
 require('react');
 
 /**
@@ -3309,7 +3309,7 @@ function debounce(func, wait) {
     };
 }
 
-const nvDatagridCss = "nv-datagrid{--nv-datagrid-border-default:var(\n    --components-form-field-border-default\n  );--nv-datagrid-border-hover:var(--components-form-field-border-hover);--nv-datagrid-border-focus:var(--components-form-field-border-default);--nv-datagrid-background-default:var(\n    --components-form-field-background-default\n  );--nv-datagrid-background-checked:var(\n    --components-form-field-background-checked\n  );--nv-datagrid-background-disabled:var(\n    --components-form-field-background-disabled\n  );--nv-datagrid-color-checked:var(\n    --components-form-shape-foreground-default\n  );--nv-datagrid-color-disabled:var(\n    --components-form-shape-foreground-disabled\n  );--nv-datagrid-outline-color:var(--color-focus-brand);display:block}nv-datagrid .hidden{display:none}nv-datagrid table{border-collapse:collapse;border-color:inherit;text-indent:0;width:100%}nv-datagrid 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-datagrid 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-datagrid tbody>tr:hover{background:var(--color-interaction-container-neutral-background-hover)}nv-datagrid .cursor-pointer{cursor:pointer}nv-datagrid .select-none{-webkit-user-select:none;user-select:none}nv-datagrid .search-container{display:flex}nv-datagrid .checkbox-container{position:relative;color:var(--nv-datagrid-color-checked)}nv-datagrid .checkbox-container input[type=checkbox][readonly]{opacity:0.5}nv-datagrid .checkbox-container:has(input[type=checkbox]:disabled:not([readonly])){color:var(--nv-datagrid-color-disabled)}nv-datagrid .checkbox-container input[type=checkbox]{appearance:none;position:relative;display:flex;width:var(--form-checkbox-size);height:var(--form-checkbox-size);flex-direction:column;align-items:flex-start;border-radius:var(--form-checkbox-radius);border-width:var(--form-checkbox-border-width);border-style:solid;border-color:var(--nv-datagrid-border-default);background:var(--nv-datagrid-background-default)}nv-datagrid .checkbox-container input[type=checkbox]:hover{border-color:var(--nv-datagrid-border-hover)}nv-datagrid .checkbox-container input[type=checkbox]:focus{border-color:var(--nv-datagrid-border-focus)}nv-datagrid .checkbox-container input[type=checkbox]:focus,nv-datagrid .checkbox-container input[type=checkbox]:focus-within{outline:none}nv-datagrid .checkbox-container input[type=checkbox]:focus-visible,nv-datagrid .checkbox-container input[type=checkbox]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--nv-datagrid-outline-color);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-datagrid .checkbox-container input[type=checkbox]:checked,nv-datagrid .checkbox-container input[type=checkbox]:indeterminate{background:var(--nv-datagrid-background-checked);border-color:var(--nv-datagrid-background-checked)}nv-datagrid .checkbox-container input[type=checkbox]:disabled:not([readonly]){background:var(--nv-datagrid-background-disabled);border-color:var(--nv-datagrid-border-default)}nv-datagrid .checkbox-container input[type=checkbox][readonly]{opacity:0.5}nv-datagrid .checkbox-container .icon{pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center}nv-datagrid .checkbox-container .icon svg{width:var(--form-checkbox-icon-size);height:var(--form-checkbox-icon-size);fill:none;stroke:currentcolor;stroke-width:var(--form-checkbox-icon-stroke);flex-shrink:0}";
+const nvDatagridCss = "nv-datagrid{--nv-datagrid-border-default:var(\n    --components-form-field-border-default\n  );--nv-datagrid-border-hover:var(--components-form-field-border-hover);--nv-datagrid-border-focus:var(--components-form-field-border-default);--nv-datagrid-background-default:var(\n    --components-form-field-background-default\n  );--nv-datagrid-background-checked:var(\n    --components-form-field-background-checked\n  );--nv-datagrid-background-disabled:var(\n    --components-form-field-background-disabled\n  );--nv-datagrid-color-checked:var(\n    --components-form-shape-foreground-default\n  );--nv-datagrid-color-disabled:var(\n    --components-form-shape-foreground-disabled\n  );--nv-datagrid-outline-color:var(--color-focus-brand);display:block}nv-datagrid .hidden{display:none}nv-datagrid table{border-collapse:collapse;border-color:inherit;text-indent:0;width:100%}nv-datagrid 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-datagrid 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-datagrid tbody>tr:hover{background:var(--color-interaction-container-neutral-background-hover)}nv-datagrid .cursor-pointer{cursor:pointer}nv-datagrid .select-none{-webkit-user-select:none;user-select:none}nv-datagrid .search-container{display:flex}nv-datagrid .checkbox-container{position:relative;color:var(--nv-datagrid-color-checked)}nv-datagrid .checkbox-container input[type=checkbox][readonly]{opacity:0.5}nv-datagrid .checkbox-container:has(input[type=checkbox]:disabled:not([readonly])){color:var(--nv-datagrid-color-disabled)}nv-datagrid .checkbox-container input[type=checkbox]{appearance:none;position:relative;display:flex;width:var(--form-checkbox-size);height:var(--form-checkbox-size);flex-direction:column;align-items:flex-start;border-radius:var(--form-checkbox-radius);border-width:var(--form-checkbox-border-width);border-style:solid;border-color:var(--nv-datagrid-border-default);background:var(--nv-datagrid-background-default)}nv-datagrid .checkbox-container input[type=checkbox]:hover{border-color:var(--nv-datagrid-border-hover)}nv-datagrid .checkbox-container input[type=checkbox]:focus{border-color:var(--nv-datagrid-border-focus)}nv-datagrid .checkbox-container input[type=checkbox]:focus,nv-datagrid .checkbox-container input[type=checkbox]:focus-within{outline:none}nv-datagrid .checkbox-container input[type=checkbox]:focus-visible,nv-datagrid .checkbox-container input[type=checkbox]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--nv-datagrid-outline-color);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-datagrid .checkbox-container input[type=checkbox]:checked,nv-datagrid .checkbox-container input[type=checkbox]:indeterminate{background:var(--nv-datagrid-background-checked);border-color:var(--nv-datagrid-background-checked)}nv-datagrid .checkbox-container input[type=checkbox]:disabled:not([readonly]){background:var(--nv-datagrid-background-disabled);border-color:var(--nv-datagrid-border-default)}nv-datagrid .checkbox-container input[type=checkbox][readonly]{opacity:0.5}nv-datagrid .checkbox-container .icon{pointer-events:none;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center}nv-datagrid .checkbox-container .icon svg{width:var(--form-checkbox-icon-size);height:var(--form-checkbox-icon-size);fill:none;stroke:currentcolor;stroke-width:var(--form-checkbox-icon-stroke);flex-shrink:0}";
 const NvDatagridStyle0 = nvDatagridCss;
 
 const NvDatagrid = class {
@@ -3464,9 +3464,9 @@ const NvDatagrid = class {
                 return;
             const nextOrder = header.column.getNextSortingOrder();
             switch (nextOrder) {
-                case constants4faa1fae.SortingPossibility.Asc:
+                case constants23aaef7b.SortingPossibility.Asc:
                     return 'Sort ascending';
-                case constants4faa1fae.SortingPossibility.Desc:
+                case constants23aaef7b.SortingPossibility.Desc:
                     return 'Sort descending';
                 default:
                     return 'Clear sort';
@@ -4158,10 +4158,10 @@ const NvDatagrid = class {
         if (!header.column.getCanSort())
             return null;
         const sortState = header.column.getIsSorted();
-        if (sortState === constants4faa1fae.SortingPossibility.Asc) {
+        if (sortState === constants23aaef7b.SortingPossibility.Asc) {
             return (index.h("div", { class: "inline-flex align-middle" }, index.h("nv-icon", { name: "arrow-up" })));
         }
-        if (sortState === constants4faa1fae.SortingPossibility.Desc) {
+        if (sortState === constants23aaef7b.SortingPossibility.Desc) {
             return (index.h("div", { class: "inline-flex align-middle" }, index.h("nv-icon", { name: "arrow-down" })));
         }
         return null;
@@ -4321,7 +4321,7 @@ const NvDatagrid = class {
         const rows = !this.table || this.table === undefined || this.parsedData.length === 0
             ? []
             : (_c = (_b = this.table) === null || _b === void 0 ? void 0 : _b.getRowModel()) === null || _c === void 0 ? void 0 : _c.rows;
-        return (index.h(index.Host, { key: 'b149279b85a3138e5be62b2f431a82fe5056b996' }, index.h("div", { key: '84ffd6a613a7e51539f0bc7e5ddff16a1769af5a', class: "hidden" }, index.h("slot", { key: 'cabafd2aab117816742972bd4eb6e7122c333ee9' })), index.h("slot", { key: '17a26ba154ddc2dea82f7576878107ede55a2043', name: "before" }), this.enableGlobalFilter && this.table && (index.h("div", { key: '822bb793cad6266810571dbb2c087c9e2b68958d', class: `search-container justify-${this.globalFilterPosition}` }, index.h("nv-fieldtext", { key: 'b9fd668a09b602ded195e4d10b79ae3d06c9a0f6', value: this.globalFilterSearchTerm, onInput: this.handleGlobalFilteringOnInput, placeholder: "Search all columns..." }))), this.parsedColumns.length === 0 && this.parsedData.length === 0 ? (index.h("div", { class: "no-data" }, this.noColumnsNoDataMessage)) : (index.h("div", null, index.h("table", null, this.parsedColumns.length > 0 && headerGroups.length > 0 && (index.h("thead", null, this.parsedColumns.length > 0 && headerGroups
+        return (index.h(index.Host, { key: '12113da221c66835cbd3c9c6f84d386b01a6cd3d' }, index.h("div", { key: '81e429e22f928758c413e295d431b9b5e989304f', class: "hidden" }, index.h("slot", { key: '12a21e3793f14ae1b47df812bf6d4c4d0d6c02f3' })), index.h("slot", { key: '372beaeea9fec7014a372961c6fabfae485c4cdc', name: "before" }), this.enableGlobalFilter && this.table && (index.h("div", { key: 'ca2589c327c23d4e4155d716f7d92c463ff36ab9', class: `search-container justify-${this.globalFilterPosition}` }, index.h("nv-fieldtext", { key: '749336787db4601d30d9b96d3f0db7f1cffe545f', value: this.globalFilterSearchTerm, onInput: this.handleGlobalFilteringOnInput, placeholder: "Search all columns..." }))), this.parsedColumns.length === 0 && this.parsedData.length === 0 ? (index.h("div", { class: "no-data" }, this.noColumnsNoDataMessage)) : (index.h("div", null, index.h("table", null, this.parsedColumns.length > 0 && headerGroups.length > 0 && (index.h("thead", null, this.parsedColumns.length > 0 && headerGroups
             ? headerGroups === null || headerGroups === void 0 ? void 0 : headerGroups.map(headerGroup => (index.h("tr", { key: headerGroup.id }, headerGroup.headers.map(header => {
                 return this.getHeaderCell(header);
             }))))
@@ -4332,7 +4332,7 @@ const NvDatagrid = class {
                 return (index.h("td", { key: cell.id, "data-row-id": rowId }, this.flexRender(cell.column.columnDef.cell, cell.getContext())));
             })));
         }))), this.table && this.enableRowSelection ? (index.h("tfoot", null, index.h("tr", null, index.h("td", { colSpan: 20 }, this.enableRowSelection && this.table ? (index.h("div", null, this.rowSelectionState &&
-            Object.keys(this.rowSelectionState).length > 0 ? (index.h("span", null, Object.keys(this.rowSelectionState).length, " of", ' ', ((_e = (_d = this.table.getPreFilteredRowModel()) === null || _d === void 0 ? void 0 : _d.rows) === null || _e === void 0 ? void 0 : _e.length) || 0, ' ', "Total Rows Selected")) : (index.h("span", null, "No rows selected")))) : null)))) : null), this.getPagination())), index.h("slot", { key: 'f509745423857527f2983c5cce1289441cc1f7c7', name: "after" })));
+            Object.keys(this.rowSelectionState).length > 0 ? (index.h("span", null, Object.keys(this.rowSelectionState).length, " of", ' ', ((_e = (_d = this.table.getPreFilteredRowModel()) === null || _d === void 0 ? void 0 : _d.rows) === null || _e === void 0 ? void 0 : _e.length) || 0, ' ', "Total Rows Selected")) : (index.h("span", null, "No rows selected")))) : null)))) : null), this.getPagination())), index.h("slot", { key: 'd7dbad31543cb111f4137fd1a0430f9a2803bfdd', name: "after" })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {