@moving-walls/design-system 2.0.0 → 2.0.2

package/dist/index.esm.js

@@ -1,6 +1,6 @@
 import require$$1, { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as React from 'react';
-import React__default, { forwardRef, createElement, useLayoutEffect, useState, useRef, useEffect, createContext, useContext, useCallback, useMemo, isValidElement, cloneElement, memo } from 'react';
+import React__default, { forwardRef, createElement, useLayoutEffect, useState, useRef, useEffect, createContext, useContext, useCallback, useMemo, isValidElement, cloneElement } from 'react';
 import * as ReactDOM from 'react-dom';
 import ReactDOM__default, { createPortal } from 'react-dom';
 import { ModuleRegistry, AllCommunityModule } from 'ag-grid-community';
@@ -269,17 +269,14 @@ var Input = /*#__PURE__*/forwardRef(function (_a, ref) {
     label = _a.label,
     error = _a.error,
     helpText = _a.helpText,
-    id = _a.id,
-    props = __rest$1(_a, ["className", "label", "error", "helpText", "id"]);
+    props = __rest$1(_a, ["className", "label", "error", "helpText"]);
   return jsxs("div", {
     className: "space-y-2",
     children: [label && jsx("label", {
-      htmlFor: id,
       className: "block text-sm font-normal leading-none text-mw-neutral-700 dark:text-mw-neutral-300",
       children: label
     }), jsx("input", Object.assign({
       ref: ref,
-      id: id,
       className: clsx('block w-full h-10 min-h-10 px-3 py-2 border rounded-md text-sm font-normal', 'focus:outline-none focus:ring-1 focus:ring-mw-primary-500 focus:border-transparent', 'disabled:opacity-50 disabled:cursor-not-allowed', error ? 'border-mw-error-300 text-mw-error-900 placeholder-mw-error-300 focus:ring-mw-error-500' : 'border-mw-neutral-100 dark:border-mw-neutral-600 text-mw-neutral-500 dark:text-white placeholder-mw-neutral-400', 'dark:bg-mw-neutral-800', className)
     }, props)), error && jsx("p", {
       className: "text-sm text-mw-error-600 dark:text-mw-error-400",
@@ -299,8 +296,7 @@ var Textarea = /*#__PURE__*/forwardRef(function (_a, ref) {
     helpText = _a.helpText,
     _a$resize = _a.resize,
     resize = _a$resize === void 0 ? 'vertical' : _a$resize,
-    id = _a.id,
-    props = __rest$1(_a, ["className", "label", "error", "helpText", "resize", "id"]);
+    props = __rest$1(_a, ["className", "label", "error", "helpText", "resize"]);
   var resizeClasses = {
     none: 'resize-none',
     vertical: 'resize-y',
@@ -310,12 +306,10 @@ var Textarea = /*#__PURE__*/forwardRef(function (_a, ref) {
   return jsxs("div", {
     className: "space-y-2",
     children: [label && jsx("label", {
-      htmlFor: id,
       className: "block text-sm font-medium text-mw-neutral-700 dark:text-mw-neutral-300",
       children: label
     }), jsx("textarea", Object.assign({
       ref: ref,
-      id: id,
       className: clsx('block w-full px-3 py-2 border rounded-md shadow-sm min-h-[80px]', 'focus:outline-none focus:ring-2 focus:ring-mw-primary-500 focus:border-transparent', 'disabled:opacity-50 disabled:cursor-not-allowed', error ? 'border-mw-error-300 text-mw-error-900 placeholder-mw-error-300 focus:ring-mw-error-500' : 'border-mw-neutral-300 dark:border-mw-neutral-600 text-mw-neutral-900 dark:text-white placeholder-mw-neutral-400', 'dark:bg-mw-neutral-800', resizeClasses[resize], className)
     }, props)), error && jsx("p", {
       className: "text-sm text-mw-error-600 dark:text-mw-error-400",
@@ -333,8 +327,7 @@ var Checkbox = /*#__PURE__*/forwardRef(function (_a, ref) {
     label = _a.label,
     description = _a.description,
     error = _a.error,
-    id = _a.id,
-    props = __rest$1(_a, ["className", "label", "description", "error", "id"]);
+    props = __rest$1(_a, ["className", "label", "description", "error"]);
   return jsxs("div", {
     className: "space-y-2",
     children: [jsxs("div", {
@@ -342,12 +335,10 @@ var Checkbox = /*#__PURE__*/forwardRef(function (_a, ref) {
       children: [jsx("input", Object.assign({
         type: "checkbox",
         ref: ref,
-        id: id,
         className: clsx('mt-0.5 h-4 w-4 rounded border-mw-neutral-100 dark:border-mw-neutral-600', 'accent-mw-primary-500 focus:ring-mw-primary-600 focus:ring-offset-2', 'disabled:opacity-50 disabled:cursor-not-allowed', error && 'border-mw-error-300 accent-mw-error-500 focus:ring-mw-error-500', className)
       }, props)), (label || description) && jsxs("div", {
         className: "flex-1 min-w-0",
         children: [label && jsx("label", {
-          htmlFor: id,
           className: "text-sm font-medium text-mw-neutral-500 dark:text-mw-neutral-300",
           children: label
         }), description && jsx("p", {
@@ -367,8 +358,7 @@ var Radio$1 = /*#__PURE__*/forwardRef(function (_a, ref) {
     label = _a.label,
     description = _a.description,
     error = _a.error,
-    id = _a.id,
-    props = __rest$1(_a, ["className", "label", "description", "error", "id"]);
+    props = __rest$1(_a, ["className", "label", "description", "error"]);
   return jsxs("div", {
     className: "space-y-2",
     children: [jsxs("div", {
@@ -376,12 +366,10 @@ var Radio$1 = /*#__PURE__*/forwardRef(function (_a, ref) {
       children: [jsx("input", Object.assign({
         type: "radio",
         ref: ref,
-        id: id,
         className: clsx('mt-0.5 h-4 w-4 border-mw-neutral-100 dark:border-mw-neutral-600', 'accent-mw-primary-500 focus:ring-mw-primary-600 focus:ring-offset-2', 'disabled:opacity-50 disabled:cursor-not-allowed', error && 'border-mw-error-300 accent-mw-error-500 focus:ring-mw-error-500', className)
       }, props)), (label || description) && jsxs("div", {
         className: "flex-1 min-w-0",
         children: [label && jsx("label", {
-          htmlFor: id,
           className: "text-sm font-medium text-mw-neutral-500 dark:text-mw-neutral-300",
           children: label
         }), description && jsx("p", {
@@ -31446,7 +31434,7 @@ var AUTOFOCUS_ON_MOUNT = "focusScope.autoFocusOnMount";
 var AUTOFOCUS_ON_UNMOUNT = "focusScope.autoFocusOnUnmount";
 var EVENT_OPTIONS = { bubbles: false, cancelable: true };
 var FOCUS_SCOPE_NAME = "FocusScope";
-var FocusScope$1 = React.forwardRef((props, forwardedRef) => {
+var FocusScope = React.forwardRef((props, forwardedRef) => {
     const { loop = false, trapped = false, onMountAutoFocus: onMountAutoFocusProp, onUnmountAutoFocus: onUnmountAutoFocusProp } = props, scopeProps = __rest$1(props, ["loop", "trapped", "onMountAutoFocus", "onUnmountAutoFocus"]);
     const [container, setContainer] = React.useState(null);
     const onMountAutoFocus = useCallbackRef$1(onMountAutoFocusProp);
@@ -31566,7 +31554,7 @@ var FocusScope$1 = React.forwardRef((props, forwardedRef) => {
     }, [loop, trapped, focusScope.paused]);
     return /* @__PURE__ */ jsx(Primitive.div, Object.assign(Object.assign({ tabIndex: -1 }, scopeProps), { ref: composedRefs, onKeyDown: handleKeyDown }));
 });
-FocusScope$1.displayName = FOCUS_SCOPE_NAME;
+FocusScope.displayName = FOCUS_SCOPE_NAME;
 function focusFirst(candidates, { select = false } = {}) {
     const previouslyFocusedElement = document.activeElement;
     for (const candidate of candidates) {
@@ -33918,10 +33906,10 @@ var VISUALLY_HIDDEN_STYLES = Object.freeze({
     wordWrap: "normal"
 });
 var NAME = "VisuallyHidden";
-var VisuallyHidden$1 = React.forwardRef((props, forwardedRef) => {
+var VisuallyHidden = React.forwardRef((props, forwardedRef) => {
     return /* @__PURE__ */ jsx(Primitive.span, Object.assign(Object.assign({}, props), { ref: forwardedRef, style: Object.assign(Object.assign({}, VISUALLY_HIDDEN_STYLES), props.style) }));
 });
-VisuallyHidden$1.displayName = NAME;
+VisuallyHidden.displayName = NAME;
 
 var getDefaultParent = function (originalTarget) {
     if (typeof document === 'undefined') {
@@ -35094,7 +35082,7 @@ var SelectContentImpl = React.forwardRef((props, forwardedRef) => {
         position,
         isPositioned,
         searchRef,
-        children: /* @__PURE__ */ jsx(ReactRemoveScroll, { as: Slot, allowPinchZoom: true, children: /* @__PURE__ */ jsx(FocusScope$1, {
+        children: /* @__PURE__ */ jsx(ReactRemoveScroll, { as: Slot, allowPinchZoom: true, children: /* @__PURE__ */ jsx(FocusScope, {
                 asChild: true,
                 trapped: context.open,
                 onMountAutoFocus: (event) => {
@@ -36136,7 +36124,8 @@ var daysOfWeek = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
 function DatePicker(_ref) {
   var value = _ref.value,
     onChange = _ref.onChange,
-    placeholder = _ref.placeholder,
+    _ref$placeholder = _ref.placeholder,
+    placeholder = _ref$placeholder === void 0 ? 'Select date' : _ref$placeholder,
     _ref$disabled = _ref.disabled,
     disabled = _ref$disabled === void 0 ? false : _ref$disabled,
     className = _ref.className,
@@ -36479,16 +36468,17 @@ function CalendarMonth(_ref) {
 function DateRangePicker(_ref3) {
   var value = _ref3.value,
     onChange = _ref3.onChange,
-    placeholder = _ref3.placeholder,
-    labels = _ref3.labels,
+    _ref3$placeholder = _ref3.placeholder,
+    placeholder = _ref3$placeholder === void 0 ? 'Select date range' : _ref3$placeholder,
     _ref3$disabled = _ref3.disabled,
     disabled = _ref3$disabled === void 0 ? false : _ref3$disabled;
     _ref3.required;
     var _ref3$clearable = _ref3.clearable,
     clearable = _ref3$clearable === void 0 ? true : _ref3$clearable,
     minDate = _ref3.minDate,
-    maxDate = _ref3.maxDate,
-    _ref3$numberOfMonths = _ref3.numberOfMonths,
+    maxDate = _ref3.maxDate;
+    _ref3.selectsRange;
+    var _ref3$numberOfMonths = _ref3.numberOfMonths,
     numberOfMonths = _ref3$numberOfMonths === void 0 ? 1 : _ref3$numberOfMonths,
     className = _ref3.className,
     _ref3$format = _ref3.format,
@@ -36496,8 +36486,15 @@ function DateRangePicker(_ref3) {
     _ref3$presets = _ref3.presets,
     presets = _ref3$presets === void 0 ? defaultPresets$1 : _ref3$presets,
     _ref3$align = _ref3.align,
-    align = _ref3$align === void 0 ? 'left' : _ref3$align;
-  var _a, _b;
+    align = _ref3$align === void 0 ? 'left' : _ref3$align,
+    _ref3$enableApplyButt = _ref3.enableApplyButton,
+    enableApplyButton = _ref3$enableApplyButt === void 0 ? false : _ref3$enableApplyButt,
+    _ref3$applyButtonText = _ref3.applyButtonText,
+    applyButtonText = _ref3$applyButtonText === void 0 ? 'Apply' : _ref3$applyButtonText,
+    _ref3$enableCancelBut = _ref3.enableCancelButton,
+    enableCancelButton = _ref3$enableCancelBut === void 0 ? true : _ref3$enableCancelBut,
+    _ref3$cancelButtonTex = _ref3.cancelButtonText,
+    cancelButtonText = _ref3$cancelButtonTex === void 0 ? 'Cancel' : _ref3$cancelButtonTex;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     isOpen = _useState2[0],
@@ -36509,71 +36506,121 @@ function DateRangePicker(_ref3) {
     _useState4 = _slicedToArray(_useState3, 2),
     selectedRange = _useState4[0],
     setSelectedRange = _useState4[1];
-  var _useState5 = useState(new Date()),
+  var _useState5 = useState(value || {
+      from: null,
+      to: null
+    }),
     _useState6 = _slicedToArray(_useState5, 2),
-    currentMonth = _useState6[0],
-    setCurrentMonth = _useState6[1];
-  var _useState7 = useState(true),
+    pendingRange = _useState6[0],
+    setPendingRange = _useState6[1];
+  var _useState7 = useState(new Date()),
     _useState8 = _slicedToArray(_useState7, 2),
-    selectingStart = _useState8[0],
-    setSelectingStart = _useState8[1];
+    currentMonth = _useState8[0],
+    setCurrentMonth = _useState8[1];
+  var _useState9 = useState(true),
+    _useState0 = _slicedToArray(_useState9, 2),
+    selectingStart = _useState0[0],
+    setSelectingStart = _useState0[1];
   var containerRef = useRef(null);
   useEffect(function () {
     if (value) {
       setSelectedRange(value);
+      setPendingRange(value);
     }
   }, [value]);
   useEffect(function () {
     function handleClickOutside(event) {
       if (containerRef.current && !containerRef.current.contains(event.target)) {
         setIsOpen(false);
+        // Reset pending to selected when closing without apply
+        setPendingRange(selectedRange);
       }
     }
     document.addEventListener('mousedown', handleClickOutside);
     return function () {
       return document.removeEventListener('mousedown', handleClickOutside);
     };
-  }, []);
+  }, [selectedRange]);
   var handleDateSelect = function handleDateSelect(date) {
     var newRange;
-    if (selectingStart || !selectedRange.from) {
-      newRange = {
+    if (selectingStart || !pendingRange.from) {
+      // When Apply button is enabled, pre-fill to=from so single-day works immediately
+      newRange = enableApplyButton ? {
+        from: date,
+        to: date
+      } : {
         from: date,
         to: null
       };
       setSelectingStart(false);
     } else {
-      if (date < selectedRange.from) {
+      if (date < pendingRange.from) {
         newRange = {
           from: date,
-          to: selectedRange.from
+          to: null
+        };
+      } else if (date > pendingRange.from) {
+        newRange = {
+          from: pendingRange.from,
+          to: date
         };
+        setSelectingStart(true);
       } else {
+        // Same date selected for both start and end — allow single-day range
         newRange = {
-          from: selectedRange.from,
+          from: date,
           to: date
         };
+        setSelectingStart(true);
       }
-      setSelectingStart(true);
     }
-    setSelectedRange(newRange);
-    onChange === null || onChange === void 0 ? void 0 : onChange(newRange);
-    if (newRange.from && newRange.to) {
+    // Update pending range, don't call onChange yet
+    setPendingRange(newRange);
+    // Without Apply button, fire onChange immediately when full range selected
+    if (!enableApplyButton && newRange.from && newRange.to) {
+      setSelectedRange(newRange);
+      onChange === null || onChange === void 0 ? void 0 : onChange(newRange);
       setIsOpen(false);
     }
   };
-  var handlePresetSelect = function handlePresetSelect(preset) {
-    setSelectedRange(preset.range);
-    onChange === null || onChange === void 0 ? void 0 : onChange(preset.range);
+  var handleApply = function handleApply() {
+    // Single-day selection: auto-fill to = from when only start date is selected
+    var finalRange = pendingRange.from && !pendingRange.to ? {
+      from: pendingRange.from,
+      to: pendingRange.from
+    } : pendingRange;
+    setSelectedRange(finalRange);
+    onChange === null || onChange === void 0 ? void 0 : onChange(finalRange);
     setIsOpen(false);
   };
+  var handleCancel = function handleCancel() {
+    // Cancel: restore original selection, don't call onChange
+    setPendingRange(selectedRange);
+    setIsOpen(false);
+  };
+  var handlePresetSelect = function handlePresetSelect(preset) {
+    setPendingRange(preset.range);
+    // Navigate calendar to show the start month of the preset range
+    if (preset.range.from) {
+      setCurrentMonth(new Date(preset.range.from.getFullYear(), preset.range.from.getMonth(), 1));
+    }
+    setSelectingStart(true);
+    // If Apply button is enabled, keep calendar open so user can confirm
+    if (!enableApplyButton) {
+      setSelectedRange(preset.range);
+      onChange === null || onChange === void 0 ? void 0 : onChange(preset.range);
+      setIsOpen(false);
+    }
+  };
   var handleClear = function handleClear() {
     var clearedRange = {
       from: null,
       to: null
     };
     setSelectedRange(clearedRange);
+    setPendingRange(clearedRange);
     onChange === null || onChange === void 0 ? void 0 : onChange(clearedRange);
+    setIsOpen(false);
   };
   var formatDisplayValue = function formatDisplayValue() {
     if (!selectedRange.from && !selectedRange.to) return placeholder;
@@ -36589,19 +36636,31 @@ function DateRangePicker(_ref3) {
   return jsxs("div", {
     ref: containerRef,
     className: cn$p('relative', className),
-    children: [jsxs("button", {
-      type: "button",
+    children: [jsxs("div", {
+      role: "button",
+      tabIndex: disabled ? -1 : 0,
       onClick: function onClick() {
-        return !disabled && setIsOpen(!isOpen);
+        if (!disabled) {
+          if (!isOpen) setPendingRange(selectedRange);
+          setIsOpen(!isOpen);
+          setSelectingStart(true);
+        }
       },
-      disabled: disabled,
-      className: cn$p('w-full flex items-center justify-between px-3 py-2 text-left', 'border border-mw-neutral-200 dark:border-mw-neutral-600 rounded-md', 'bg-white dark:bg-mw-neutral-800', 'text-mw-neutral-800 dark:text-white', 'hover:border-mw-neutral-300 dark:hover:border-mw-neutral-500', 'focus:outline-none focus:ring-2 focus:ring-mw-primary-500 focus:border-transparent', disabled && 'opacity-50 cursor-not-allowed', !selectedRange.from && !selectedRange.to && 'text-mw-neutral-500 dark:text-mw-neutral-400'),
+      onKeyDown: function onKeyDown(e) {
+        if (!disabled && (e.key === 'Enter' || e.key === ' ')) {
+          if (!isOpen) setPendingRange(selectedRange);
+          setIsOpen(!isOpen);
+          setSelectingStart(true);
+        }
+      },
+      className: cn$p('w-full flex items-center justify-between px-3 py-2 text-left cursor-pointer', 'border border-mw-neutral-200 dark:border-mw-neutral-600 rounded-md', 'bg-white dark:bg-mw-neutral-800', 'text-mw-neutral-800 dark:text-white', 'hover:border-mw-neutral-300 dark:hover:border-mw-neutral-500', 'focus:outline-none focus:ring-2 focus:ring-mw-primary-500 focus:border-transparent', disabled && 'opacity-50 cursor-not-allowed pointer-events-none', !selectedRange.from && !selectedRange.to && 'text-mw-neutral-500 dark:text-mw-neutral-400'),
       children: [jsx("span", {
         className: "truncate",
         children: formatDisplayValue()
       }), jsxs("div", {
         className: "flex items-center gap-1 ml-2",
         children: [clearable && (selectedRange.from || selectedRange.to) && jsx("button", {
+          type: "button",
           onClick: function onClick(e) {
             e.stopPropagation();
             handleClear();
@@ -36627,6 +36686,7 @@ function DateRangePicker(_ref3) {
             className: "space-y-0.5",
             children: presets.map(function (preset, index) {
               return jsx("button", {
+                type: "button",
                 onClick: function onClick() {
                   return handlePresetSelect(preset);
                 },
@@ -36639,7 +36699,7 @@ function DateRangePicker(_ref3) {
           className: "flex",
           children: [jsx(CalendarMonth, {
             currentMonth: currentMonth,
-            selectedRange: selectedRange,
+            selectedRange: pendingRange,
             onDateSelect: handleDateSelect,
             onMonthChange: setCurrentMonth,
             minDate: minDate,
@@ -36647,7 +36707,7 @@ function DateRangePicker(_ref3) {
             selectingStart: selectingStart
           }), numberOfMonths === 2 && jsx(CalendarMonth, {
             currentMonth: new Date(currentMonth.getFullYear(), currentMonth.getMonth() + 1),
-            selectedRange: selectedRange,
+            selectedRange: pendingRange,
             onDateSelect: handleDateSelect,
             onMonthChange: function onMonthChange(month) {
               var prevMonth = new Date(month);
@@ -36663,22 +36723,20 @@ function DateRangePicker(_ref3) {
         className: "flex items-center justify-between px-3 py-2 border-t border-mw-neutral-200 dark:border-mw-neutral-700",
         children: [jsx("div", {
           className: "text-[11px] text-mw-neutral-500 dark:text-mw-neutral-400",
-          children: selectingStart ? (_a = labels === null || labels === void 0 ? void 0 : labels.selectStart) !== null && _a !== void 0 ? _a : 'Select start date' : (_b = labels === null || labels === void 0 ? void 0 : labels.selectEnd) !== null && _b !== void 0 ? _b : 'Select end date'
+          children: selectingStart ? 'Select start date' : 'Select end date'
         }), jsxs("div", {
           className: "flex gap-2 items-center",
-          children: [jsx("button", {
-            onClick: function onClick() {
-              return setIsOpen(false);
-            },
-            className: "px-2.5 py-1 text-xs text-mw-neutral-600 dark:text-mw-neutral-400 hover:text-mw-neutral-900 dark:hover:text-white",
-            children: "Cancel"
-          }), jsx("button", {
-            onClick: function onClick() {
-              return setIsOpen(false);
-            },
-            disabled: !selectedRange.from,
-            className: "px-3 py-1 text-xs bg-mw-primary-500 text-white rounded hover:bg-mw-primary-600 disabled:opacity-50 disabled:cursor-not-allowed",
-            children: "Apply"
+          children: [enableCancelButton && jsx("button", {
+            type: "button",
+            onClick: handleCancel,
+            className: "px-3 py-1.5 text-xs text-mw-neutral-600 dark:text-mw-neutral-400 hover:text-mw-neutral-900 dark:hover:text-white border border-mw-neutral-200 dark:border-mw-neutral-600 rounded",
+            children: cancelButtonText
+          }), enableApplyButton && jsx("button", {
+            type: "button",
+            onClick: handleApply,
+            disabled: !pendingRange.from,
+            className: "px-3 py-1.5 text-xs bg-mw-primary-500 text-white rounded hover:bg-mw-primary-600 disabled:opacity-50 disabled:cursor-not-allowed",
+            children: applyButtonText
           })]
         })]
       })]
@@ -36824,7 +36882,8 @@ function TimePicker(_ref2) {
     label = _ref2.label,
     error = _ref2.error,
     helpText = _ref2.helpText,
-    placeholder = _ref2.placeholder,
+    _ref2$placeholder = _ref2.placeholder,
+    placeholder = _ref2$placeholder === void 0 ? 'Select time' : _ref2$placeholder,
     className = _ref2.className,
     _ref2$size = _ref2.size,
     size = _ref2$size === void 0 ? 'md' : _ref2$size,
@@ -37190,7 +37249,8 @@ function TimeSelect(_ref) {
 function TimeRangePicker(_ref2) {
   var value = _ref2.value,
     onChange = _ref2.onChange,
-    placeholder = _ref2.placeholder,
+    _ref2$placeholder = _ref2.placeholder,
+    placeholder = _ref2$placeholder === void 0 ? 'Select time range' : _ref2$placeholder,
     _ref2$disabled = _ref2.disabled,
     disabled = _ref2$disabled === void 0 ? false : _ref2$disabled;
     _ref2.required;
@@ -37203,10 +37263,8 @@ function TimeRangePicker(_ref2) {
     minTime = _ref2.minTime,
     maxTime = _ref2.maxTime,
     className = _ref2.className,
-    labels = _ref2.labels,
     _ref2$presets = _ref2.presets,
     presets = _ref2$presets === void 0 ? defaultPresets : _ref2$presets;
-  var _a, _b;
   var _useState5 = useState(value || {
       from: null,
       to: null
@@ -37343,13 +37401,13 @@ function TimeRangePicker(_ref2) {
             children: [jsxs("div", {
               children: [jsx("label", {
                 className: "block text-sm font-medium mb-2 text-mw-neutral-900 dark:text-white",
-                children: (_a = labels === null || labels === void 0 ? void 0 : labels.fromTime) !== null && _a !== void 0 ? _a : 'From Time'
+                children: "From Time"
               }), jsx(TimeSelect, {
                 value: selectedRange.from,
                 onChange: handleFromTimeChange,
                 options: timeOptions,
                 format: format,
-                placeholder: labels === null || labels === void 0 ? void 0 : labels.selectStart,
+                placeholder: "Select start time",
                 disabled: disabled,
                 minTime: minTime,
                 maxTime: selectedRange.to ? format === '12' ? convertTo24Hour(selectedRange.to) : selectedRange.to : maxTime
@@ -37357,13 +37415,13 @@ function TimeRangePicker(_ref2) {
             }), jsxs("div", {
               children: [jsx("label", {
                 className: "block text-sm font-medium mb-2 text-mw-neutral-900 dark:text-white",
-                children: (_b = labels === null || labels === void 0 ? void 0 : labels.toTime) !== null && _b !== void 0 ? _b : 'To Time'
+                children: "To Time"
               }), jsx(TimeSelect, {
                 value: selectedRange.to,
                 onChange: handleToTimeChange,
                 options: timeOptions,
                 format: format,
-                placeholder: labels === null || labels === void 0 ? void 0 : labels.selectEnd,
+                placeholder: "Select end time",
                 disabled: disabled || !selectedRange.from,
                 minTime: selectedRange.from ? format === '12' ? convertTo24Hour(selectedRange.from) : selectedRange.from : minTime,
                 maxTime: maxTime
@@ -38692,7 +38750,8 @@ function MultiSelect(_ref) {
     _ref$value = _ref.value,
     value = _ref$value === void 0 ? [] : _ref$value,
     onChange = _ref.onChange,
-    placeholder = _ref.placeholder,
+    _ref$placeholder = _ref.placeholder,
+    placeholder = _ref$placeholder === void 0 ? 'Select...' : _ref$placeholder,
     label = _ref.label,
     _ref$disabled = _ref.disabled,
     disabled = _ref$disabled === void 0 ? false : _ref$disabled,
@@ -39149,8 +39208,7 @@ function ScheduleGrid(_ref) {
     _ref$presets = _ref.presets,
     presets = _ref$presets === void 0 ? DEFAULT_PRESETS : _ref$presets,
     _ref$showPresets = _ref.showPresets,
-    showPresets = _ref$showPresets === void 0 ? true : _ref$showPresets,
-    labels = _ref.labels;
+    showPresets = _ref$showPresets === void 0 ? true : _ref$showPresets;
   var _useState = useState('custom'),
     _useState2 = _slicedToArray(_useState, 2),
     selectedPreset = _useState2[0],
@@ -39273,7 +39331,6 @@ function ScheduleGrid(_ref) {
     onChange(newRules);
   };
   var renderHourGrid = function renderHourGrid(type, selectedHours) {
-    var _a, _b;
     var allSelected = selectedHours.size === 24;
     var label = type === 'DEFAULT' ? 'Default Hours' : type === 'WEEKDAY' ? 'Weekday Hours (Mon-Fri)' : 'Weekend Hours (Sat-Sun)';
     var isExpanded = expandedSection === type.toLowerCase();
@@ -39308,7 +39365,7 @@ function ScheduleGrid(_ref) {
               return handleSelectAll(type);
             },
             className: "text-xs text-mw-primary-500 hover:text-mw-primary-600 font-medium",
-            children: allSelected ? (_a = labels === null || labels === void 0 ? void 0 : labels.deselectAll) !== null && _a !== void 0 ? _a : 'Deselect All' : (_b = labels === null || labels === void 0 ? void 0 : labels.selectAll) !== null && _b !== void 0 ? _b : 'Select All 24 Hours'
+            children: allSelected ? 'Deselect All' : 'Select All 24 Hours'
           })
         }), jsx("div", {
           className: "grid grid-cols-6 gap-1.5",
@@ -42918,221 +42975,6 @@ function AdvancedTable(_ref3) {
   });
 }
 
-function getCellValue(row, column) {
-  if (column.accessorFn) return column.accessorFn(row);
-  if (column.accessorKey) return row[column.accessorKey];
-  return undefined;
-}
-function useAdvancedTable(_ref) {
-  var data = _ref.data,
-    columns = _ref.columns,
-    _ref$initialState = _ref.initialState,
-    initialState = _ref$initialState === void 0 ? {} : _ref$initialState,
-    _ref$getRowId = _ref.getRowId,
-    getRowId = _ref$getRowId === void 0 ? function (_row, index) {
-      return index;
-    } : _ref$getRowId;
-  var _useState = useState(initialState.sorting || []),
-    _useState2 = _slicedToArray(_useState, 2),
-    sorting = _useState2[0],
-    setSorting = _useState2[1];
-  var _useState3 = useState(initialState.filters || []),
-    _useState4 = _slicedToArray(_useState3, 2),
-    filters = _useState4[0],
-    setFilters = _useState4[1];
-  var _useState5 = useState(initialState.globalFilter || ''),
-    _useState6 = _slicedToArray(_useState5, 2),
-    globalFilter = _useState6[0],
-    setGlobalFilter = _useState6[1];
-  var _useState7 = useState(initialState.columnVisibility || {}),
-    _useState8 = _slicedToArray(_useState7, 2),
-    columnVisibility = _useState8[0],
-    setColumnVisibility = _useState8[1];
-  var _useState9 = useState(initialState.density || 'normal'),
-    _useState0 = _slicedToArray(_useState9, 2),
-    density = _useState0[0],
-    setDensity = _useState0[1];
-  var _useState1 = useState(new Set()),
-    _useState10 = _slicedToArray(_useState1, 2),
-    selectedRows = _useState10[0],
-    setSelectedRows = _useState10[1];
-  var visibleColumns = useMemo(function () {
-    return columns.filter(function (col) {
-      return columnVisibility[col.id] !== false && !col.hidden;
-    });
-  }, [columns, columnVisibility]);
-  var toggleSort = useCallback(function (columnId) {
-    setSorting(function (prev) {
-      var existing = prev.find(function (s) {
-        return s.columnId === columnId;
-      });
-      if (!existing) return [{
-        columnId: columnId,
-        direction: 'asc'
-      }];
-      if (existing.direction === 'asc') return [{
-        columnId: columnId,
-        direction: 'desc'
-      }];
-      return [];
-    });
-  }, []);
-  var addFilter = useCallback(function (filter) {
-    setFilters(function (prev) {
-      var idx = prev.findIndex(function (f) {
-        return f.columnId === filter.columnId;
-      });
-      if (idx >= 0) {
-        var next = _toConsumableArray(prev);
-        next[idx] = filter;
-        return next;
-      }
-      return [].concat(_toConsumableArray(prev), [filter]);
-    });
-  }, []);
-  var removeFilter = useCallback(function (columnId) {
-    setFilters(function (prev) {
-      return prev.filter(function (f) {
-        return f.columnId !== columnId;
-      });
-    });
-  }, []);
-  var clearFilters = useCallback(function () {
-    setFilters([]);
-    setGlobalFilter('');
-  }, []);
-  var toggleColumnVisibility = useCallback(function (columnId) {
-    setColumnVisibility(function (prev) {
-      return Object.assign(Object.assign({}, prev), _defineProperty({}, columnId, prev[columnId] === false ? true : false));
-    });
-  }, []);
-  var toggleRowSelection = useCallback(function (rowId) {
-    setSelectedRows(function (prev) {
-      var next = new Set(prev);
-      if (next.has(rowId)) next["delete"](rowId);else next.add(rowId);
-      return next;
-    });
-  }, []);
-  var selectAllRows = useCallback(function () {
-    setSelectedRows(new Set(data.map(function (row, i) {
-      return getRowId(row, i);
-    })));
-  }, [data, getRowId]);
-  var clearSelection = useCallback(function () {
-    setSelectedRows(new Set());
-  }, []);
-  var processedData = useMemo(function () {
-    var result = _toConsumableArray(data);
-    // Apply global filter
-    if (globalFilter) {
-      var searchLower = globalFilter.toLowerCase();
-      result = result.filter(function (row) {
-        return columns.some(function (col) {
-          if (!col.searchable && col.searchable !== undefined) return false;
-          var value = getCellValue(row, col);
-          return value != null && String(value).toLowerCase().includes(searchLower);
-        });
-      });
-    }
-    // Apply column filters
-    var _iterator = _createForOfIteratorHelper(filters),
-      _step;
-    try {
-      var _loop = function _loop() {
-        var filter = _step.value;
-        var column = columns.find(function (c) {
-          return c.id === filter.columnId;
-        });
-        if (!column) return 1; // continue
-        result = result.filter(function (row) {
-          var value = getCellValue(row, column);
-          if (value == null) return false;
-          var strValue = String(value).toLowerCase();
-          var filterValue = String(filter.value).toLowerCase();
-          switch (filter.operator || 'contains') {
-            case 'equals':
-              return strValue === filterValue;
-            case 'contains':
-              return strValue.includes(filterValue);
-            case 'startsWith':
-              return strValue.startsWith(filterValue);
-            case 'endsWith':
-              return strValue.endsWith(filterValue);
-            default:
-              return strValue.includes(filterValue);
-          }
-        });
-      };
-      for (_iterator.s(); !(_step = _iterator.n()).done;) {
-        if (_loop()) continue;
-      }
-      // Apply sorting
-    } catch (err) {
-      _iterator.e(err);
-    } finally {
-      _iterator.f();
-    }
-    if (sorting.length > 0) {
-      var sort = sorting[0];
-      var column = columns.find(function (c) {
-        return c.id === sort.columnId;
-      });
-      if (column) {
-        result.sort(function (a, b) {
-          var aVal = getCellValue(a, column);
-          var bVal = getCellValue(b, column);
-          if (aVal == null && bVal == null) return 0;
-          if (aVal == null) return 1;
-          if (bVal == null) return -1;
-          var cmp = String(aVal).localeCompare(String(bVal), undefined, {
-            numeric: true
-          });
-          return sort.direction === 'desc' ? -cmp : cmp;
-        });
-      }
-    }
-    return result;
-  }, [data, columns, sorting, filters, globalFilter]);
-  var state = {
-    sorting: sorting,
-    filters: filters,
-    globalFilter: globalFilter,
-    columnVisibility: columnVisibility,
-    columnOrder: columns.map(function (c) {
-      return c.id;
-    }),
-    columnSizing: {},
-    density: density,
-    frozenColumns: {
-      left: [],
-      right: []
-    }
-  };
-  return {
-    // Data
-    processedData: processedData,
-    visibleColumns: visibleColumns,
-    // State
-    state: state,
-    sorting: sorting,
-    filters: filters,
-    globalFilter: globalFilter,
-    density: density,
-    selectedRows: selectedRows,
-    // Actions
-    toggleSort: toggleSort,
-    addFilter: addFilter,
-    removeFilter: removeFilter,
-    clearFilters: clearFilters,
-    setGlobalFilter: setGlobalFilter,
-    setDensity: setDensity,
-    toggleColumnVisibility: toggleColumnVisibility,
-    toggleRowSelection: toggleRowSelection,
-    selectAllRows: selectAllRows,
-    clearSelection: clearSelection
-  };
-}
-
 var emptyStateIcons = {
   noData: jsx(Database, {
     className: "w-12 h-12 text-mw-neutral-400"
@@ -47327,121 +47169,6 @@ function DayView(_ref4) {
   });
 }
 
-function useCalendar(_ref) {
-  var value = _ref.value,
-    _ref$events = _ref.events,
-    events = _ref$events === void 0 ? [] : _ref$events,
-    _ref$view = _ref.view,
-    view = _ref$view === void 0 ? 'month' : _ref$view,
-    onViewChange = _ref.onViewChange,
-    onChange = _ref.onChange,
-    _ref$hourFormat = _ref.hourFormat,
-    hourFormat = _ref$hourFormat === void 0 ? 24 : _ref$hourFormat;
-  var _useState = useState(value || new Date()),
-    _useState2 = _slicedToArray(_useState, 2),
-    currentDate = _useState2[0],
-    setCurrentDate = _useState2[1];
-  var _useState3 = useState(view),
-    _useState4 = _slicedToArray(_useState3, 2),
-    currentView = _useState4[0],
-    setCurrentView = _useState4[1];
-  var today = new Date();
-  var _useMemo = useMemo(function () {
-      return {
-        year: currentDate.getFullYear(),
-        month: currentDate.getMonth()
-      };
-    }, [currentDate]),
-    year = _useMemo.year,
-    month = _useMemo.month;
-  var handleViewChange = useCallback(function (newView) {
-    setCurrentView(newView);
-    onViewChange === null || onViewChange === void 0 ? void 0 : onViewChange(newView);
-  }, [onViewChange]);
-  var handleDateSelect = useCallback(function (date) {
-    setCurrentDate(date);
-    onChange === null || onChange === void 0 ? void 0 : onChange(date);
-  }, [onChange]);
-  var navigateMonth = useCallback(function (delta) {
-    setCurrentDate(function (prev) {
-      return new Date(prev.getFullYear(), prev.getMonth() + delta, 1);
-    });
-  }, []);
-  var navigateWeek = useCallback(function (delta) {
-    setCurrentDate(function (prev) {
-      var d = new Date(prev);
-      d.setDate(d.getDate() + delta * 7);
-      return d;
-    });
-  }, []);
-  var navigateDay = useCallback(function (delta) {
-    setCurrentDate(function (prev) {
-      var d = new Date(prev);
-      d.setDate(d.getDate() + delta);
-      return d;
-    });
-  }, []);
-  var goToToday = useCallback(function () {
-    setCurrentDate(new Date());
-  }, []);
-  var getEventsForDate = useCallback(function (date) {
-    return events.filter(function (event) {
-      return event.date.toDateString() === date.toDateString();
-    });
-  }, [events]);
-  var getEventsForTimeSlot = useCallback(function (date, timeSlot) {
-    var dateEvents = getEventsForDate(date);
-    return dateEvents.filter(function (event) {
-      if (event.allDay) return false;
-      if (!event.startTime) return false;
-      var eventStart = event.startTime;
-      return eventStart === timeSlot;
-    });
-  }, [getEventsForDate]);
-  var formatTime = useCallback(function (time) {
-    if (hourFormat === 12) {
-      var _time$split$map = time.split(':').map(Number),
-        _time$split$map2 = _slicedToArray(_time$split$map, 2),
-        hours = _time$split$map2[0],
-        minutes = _time$split$map2[1];
-      var ampm = hours >= 12 ? 'PM' : 'AM';
-      var displayHours = hours % 12 || 12;
-      return "".concat(displayHours, ":").concat(minutes.toString().padStart(2, '0'), " ").concat(ampm);
-    }
-    return time;
-  }, [hourFormat]);
-  var getWeekDates = useCallback(function (date) {
-    var startOfWeek = new Date(date);
-    var day = startOfWeek.getDay();
-    var diff = startOfWeek.getDate() - day + (day === 0 ? -6 : 1);
-    startOfWeek.setDate(diff);
-    var weekDates = [];
-    for (var i = 0; i < 7; i++) {
-      var weekDate = new Date(startOfWeek);
-      weekDate.setDate(startOfWeek.getDate() + i);
-      weekDates.push(weekDate);
-    }
-    return weekDates;
-  }, []);
-  return {
-    currentDate: currentDate,
-    currentView: currentView,
-    today: today,
-    year: year,
-    month: month,
-    handleViewChange: handleViewChange,
-    handleDateSelect: handleDateSelect,
-    navigateMonth: navigateMonth,
-    navigateWeek: navigateWeek,
-    navigateDay: navigateDay,
-    goToToday: goToToday,
-    getEventsForDate: getEventsForDate,
-    getEventsForTimeSlot: getEventsForTimeSlot,
-    formatTime: formatTime,
-    getWeekDates: getWeekDates
-  };
-}
-
 function cn$8() {
   for (var _len = arguments.length, classes = new Array(_len), _key = 0; _key < _len; _key++) {
     classes[_key] = arguments[_key];
@@ -50085,420 +49812,6 @@ function AgGridTableInner(props) {
 }
 var AgGridTable = AgGridTableInner;
 
-/**
- * A mobile-optimized card for displaying a single data row.
- * Replaces AG Grid table rows on mobile viewports.
- * Minimum 44px touch target when clickable.
- */
-var MobileDataCard = /*#__PURE__*/memo(/*#__PURE__*/forwardRef(function (_a, ref) {
-  var title = _a.title,
-    subtitle = _a.subtitle,
-    statusBadge = _a.statusBadge,
-    fields = _a.fields,
-    actions = _a.actions,
-    onClick = _a.onClick,
-    className = _a.className,
-    props = __rest$1(_a, ["title", "subtitle", "statusBadge", "fields", "actions", "onClick", "className"]);
-  return jsxs("div", Object.assign({
-    ref: ref,
-    role: onClick ? 'button' : undefined,
-    tabIndex: onClick ? 0 : undefined,
-    onClick: onClick,
-    onKeyDown: onClick ? function (e) {
-      if (e.key === 'Enter') onClick();
-    } : undefined,
-    className: clsx('rounded-lg border border-mw-neutral-200 bg-white p-4', 'dark:border-mw-neutral-700 dark:bg-mw-neutral-800', onClick && 'cursor-pointer hover:border-mw-primary-300 dark:hover:border-mw-primary-600 min-h-[44px]', className)
-  }, props, {
-    children: [jsxs("div", {
-      className: "flex items-start justify-between gap-2",
-      children: [jsxs("div", {
-        className: "flex-1 min-w-0",
-        children: [jsx("p", {
-          className: "text-sm font-medium text-mw-neutral-900 dark:text-mw-neutral-100 truncate",
-          children: title
-        }), subtitle && jsx("p", {
-          className: "text-xs text-mw-neutral-500 dark:text-mw-neutral-400 mt-0.5",
-          children: subtitle
-        })]
-      }), jsxs("div", {
-        className: "flex items-center gap-2 flex-shrink-0",
-        children: [statusBadge, actions]
-      })]
-    }), fields.length > 0 && jsx("div", {
-      className: "grid grid-cols-2 gap-x-4 gap-y-2 mt-3",
-      children: fields.map(function (_ref) {
-        var label = _ref.label,
-          value = _ref.value;
-        return jsxs("div", {
-          children: [jsx("p", {
-            className: "text-xs text-mw-neutral-500 dark:text-mw-neutral-400",
-            children: label
-          }), jsx("p", {
-            className: "text-sm text-mw-neutral-900 dark:text-mw-neutral-100",
-            children: value
-          })]
-        }, label);
-      })
-    })]
-  }));
-}));
-MobileDataCard.displayName = 'MobileDataCard';
-
-/**
- * Prev/Next pagination for mobile card lists.
- * Shows "Page X of Y" with disabled states at boundaries.
- */
-var MobilePagination = /*#__PURE__*/forwardRef(function (_a, ref) {
-  var page = _a.page,
-    totalPages = _a.totalPages,
-    onPageChange = _a.onPageChange,
-    className = _a.className,
-    props = __rest$1(_a, ["page", "totalPages", "onPageChange", "className"]);
-  return jsxs("div", Object.assign({
-    ref: ref,
-    className: clsx('flex items-center justify-between px-2 py-3', className)
-  }, props, {
-    children: [jsx("button", {
-      type: "button",
-      "aria-label": "Previous page",
-      disabled: page <= 1,
-      onClick: function onClick() {
-        return onPageChange(page - 1);
-      },
-      className: clsx('px-3 py-2 text-sm font-medium rounded-md min-h-[44px] min-w-[44px]', 'border border-mw-neutral-200 dark:border-mw-neutral-700', 'text-mw-neutral-700 dark:text-mw-neutral-300', 'enabled:hover:bg-mw-neutral-50 enabled:dark:hover:bg-mw-neutral-800', 'disabled:opacity-50 disabled:cursor-not-allowed'),
-      children: "\u2190"
-    }), jsxs("span", {
-      className: "text-sm text-mw-neutral-600 dark:text-mw-neutral-400",
-      children: [page, " / ", totalPages]
-    }), jsx("button", {
-      type: "button",
-      "aria-label": "Next page",
-      disabled: page >= totalPages,
-      onClick: function onClick() {
-        return onPageChange(page + 1);
-      },
-      className: clsx('px-3 py-2 text-sm font-medium rounded-md min-h-[44px] min-w-[44px]', 'border border-mw-neutral-200 dark:border-mw-neutral-700', 'text-mw-neutral-700 dark:text-mw-neutral-300', 'enabled:hover:bg-mw-neutral-50 enabled:dark:hover:bg-mw-neutral-800', 'disabled:opacity-50 disabled:cursor-not-allowed'),
-      children: "\u2192"
-    })]
-  }));
-});
-MobilePagination.displayName = 'MobilePagination';
-
-/**
- * A mobile-optimized toolbar with search input and optional filter button.
- * Filter button shows an active count badge when filters are applied.
- */
-var MobileToolbar = /*#__PURE__*/forwardRef(function (_a, ref) {
-  var searchValue = _a.searchValue,
-    onSearchChange = _a.onSearchChange,
-    _a$searchPlaceholder = _a.searchPlaceholder,
-    searchPlaceholder = _a$searchPlaceholder === void 0 ? 'Search...' : _a$searchPlaceholder,
-    onFilterClick = _a.onFilterClick,
-    activeFilterCount = _a.activeFilterCount,
-    className = _a.className,
-    props = __rest$1(_a, ["searchValue", "onSearchChange", "searchPlaceholder", "onFilterClick", "activeFilterCount", "className"]);
-  return jsxs("div", Object.assign({
-    ref: ref,
-    className: clsx('flex items-center gap-2', className)
-  }, props, {
-    children: [jsxs("div", {
-      className: "relative flex-1",
-      children: [jsxs("svg", {
-        className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-mw-neutral-400",
-        xmlns: "http://www.w3.org/2000/svg",
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        strokeWidth: "2",
-        strokeLinecap: "round",
-        strokeLinejoin: "round",
-        "aria-hidden": "true",
-        children: [jsx("circle", {
-          cx: "11",
-          cy: "11",
-          r: "8"
-        }), jsx("path", {
-          d: "m21 21-4.3-4.3"
-        })]
-      }), jsx("input", {
-        type: "search",
-        role: "searchbox",
-        value: searchValue,
-        onChange: function onChange(e) {
-          return onSearchChange(e.target.value);
-        },
-        placeholder: searchPlaceholder,
-        className: clsx('w-full h-11 pl-10 pr-4 text-sm rounded-lg', 'border border-mw-neutral-200 bg-white', 'dark:border-mw-neutral-700 dark:bg-mw-neutral-800', 'text-mw-neutral-900 dark:text-mw-neutral-100', 'placeholder:text-mw-neutral-400 dark:placeholder:text-mw-neutral-500', 'focus:outline-none focus:ring-2 focus:ring-mw-primary-500 focus:border-mw-primary-500')
-      })]
-    }), onFilterClick && jsxs("button", {
-      type: "button",
-      "aria-label": "Filters",
-      onClick: onFilterClick,
-      className: clsx('relative flex items-center justify-center h-11 w-11 rounded-lg', 'border border-mw-neutral-200 bg-white', 'dark:border-mw-neutral-700 dark:bg-mw-neutral-800', 'text-mw-neutral-700 dark:text-mw-neutral-300', 'hover:bg-mw-neutral-50 dark:hover:bg-mw-neutral-700'),
-      children: [jsxs("svg", {
-        className: "h-5 w-5",
-        xmlns: "http://www.w3.org/2000/svg",
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        strokeWidth: "2",
-        strokeLinecap: "round",
-        strokeLinejoin: "round",
-        "aria-hidden": "true",
-        children: [jsx("line", {
-          x1: "4",
-          x2: "4",
-          y1: "21",
-          y2: "14"
-        }), jsx("line", {
-          x1: "4",
-          x2: "4",
-          y1: "10",
-          y2: "3"
-        }), jsx("line", {
-          x1: "12",
-          x2: "12",
-          y1: "21",
-          y2: "12"
-        }), jsx("line", {
-          x1: "12",
-          x2: "12",
-          y1: "8",
-          y2: "3"
-        }), jsx("line", {
-          x1: "20",
-          x2: "20",
-          y1: "21",
-          y2: "16"
-        }), jsx("line", {
-          x1: "20",
-          x2: "20",
-          y1: "12",
-          y2: "3"
-        }), jsx("line", {
-          x1: "2",
-          x2: "6",
-          y1: "14",
-          y2: "14"
-        }), jsx("line", {
-          x1: "10",
-          x2: "14",
-          y1: "8",
-          y2: "8"
-        }), jsx("line", {
-          x1: "18",
-          x2: "22",
-          y1: "16",
-          y2: "16"
-        })]
-      }), activeFilterCount != null && activeFilterCount > 0 && jsx("span", {
-        className: "absolute -top-1 -right-1 flex h-5 w-5 items-center justify-center rounded-full bg-mw-primary-500 text-[10px] font-bold text-white",
-        children: activeFilterCount
-      })]
-    })]
-  }));
-});
-MobileToolbar.displayName = 'MobileToolbar';
-
-/**
- * Renders children only on mobile (hidden on md+ screens).
- * Uses CSS-based visibility — both layouts are in the DOM.
- */
-var MobileOnly = /*#__PURE__*/forwardRef(function (_a, ref) {
-  var children = _a.children,
-    className = _a.className,
-    props = __rest$1(_a, ["children", "className"]);
-  return jsx("div", Object.assign({
-    ref: ref,
-    className: clsx('md:hidden', className)
-  }, props, {
-    children: children
-  }));
-});
-MobileOnly.displayName = 'MobileOnly';
-
-/**
- * Renders children only on desktop (hidden below md breakpoint).
- * Uses CSS-based visibility — both layouts are in the DOM.
- */
-var DesktopOnly = /*#__PURE__*/forwardRef(function (_a, ref) {
-  var children = _a.children,
-    className = _a.className,
-    props = __rest$1(_a, ["children", "className"]);
-  return jsx("div", Object.assign({
-    ref: ref,
-    className: clsx('hidden md:block', className)
-  }, props, {
-    children: children
-  }));
-});
-DesktopOnly.displayName = 'DesktopOnly';
-
-var breakpointRowClass = {
-  sm: 'sm:flex-row',
-  md: 'md:flex-row',
-  lg: 'lg:flex-row',
-  xl: 'xl:flex-row'
-};
-/**
- * Stacks children vertically on mobile, horizontally on desktop.
- * Replaces the common `flex flex-col md:flex-row` pattern.
- */
-var ResponsiveStack = /*#__PURE__*/forwardRef(function (_a, ref) {
-  var _a$breakpoint = _a.breakpoint,
-    breakpoint = _a$breakpoint === void 0 ? 'md' : _a$breakpoint,
-    gap = _a.gap,
-    _a$reverse = _a.reverse,
-    reverse = _a$reverse === void 0 ? false : _a$reverse,
-    children = _a.children,
-    className = _a.className,
-    props = __rest$1(_a, ["breakpoint", "gap", "reverse", "children", "className"]);
-  return jsx("div", Object.assign({
-    ref: ref,
-    className: clsx('flex', reverse ? 'flex-col-reverse' : 'flex-col', breakpointRowClass[breakpoint], gap != null && "gap-".concat(gap), className)
-  }, props, {
-    children: children
-  }));
-});
-ResponsiveStack.displayName = 'ResponsiveStack';
-
-/**
- * A collapsible panel for secondary information on mobile.
- * Wraps the design system Accordion for converting sidebar panels
- * (tips, insights, help text) into expandable sections.
- */
-var CollapsibleInfoPanel = /*#__PURE__*/forwardRef(function (_a, ref) {
-  var title = _a.title,
-    icon = _a.icon,
-    _a$defaultOpen = _a.defaultOpen,
-    defaultOpen = _a$defaultOpen === void 0 ? false : _a$defaultOpen,
-    children = _a.children,
-    className = _a.className,
-    props = __rest$1(_a, ["title", "icon", "defaultOpen", "children", "className"]);
-  return jsx("div", Object.assign({
-    ref: ref,
-    className: clsx(className)
-  }, props, {
-    children: jsx(Accordion, {
-      type: "single",
-      defaultValue: defaultOpen ? 'panel' : undefined,
-      children: jsxs(AccordionItem, {
-        value: "panel",
-        children: [jsxs(AccordionTrigger, {
-          className: clsx('flex items-center gap-2 text-sm font-medium', 'text-mw-neutral-900 dark:text-mw-neutral-100'),
-          children: [icon && jsx("span", {
-            className: "flex-shrink-0",
-            children: icon
-          }), title]
-        }), jsx(AccordionContent, {
-          children: jsx("div", {
-            className: "pt-2",
-            children: children
-          })
-        })]
-      })
-    })
-  }));
-});
-CollapsibleInfoPanel.displayName = 'CollapsibleInfoPanel';
-
-/**
- * Renders content that is visually hidden but accessible to screen readers.
- * Use this instead of ad-hoc `sr-only` classes for consistent accessibility.
- */
-var VisuallyHidden = /*#__PURE__*/forwardRef(function (_a, ref) {
-  var _a$as = _a.as,
-    Component = _a$as === void 0 ? 'span' : _a$as,
-    children = _a.children,
-    style = _a.style,
-    props = __rest$1(_a, ["as", "children", "style"]);
-  return jsx(Component, Object.assign({
-    ref: ref,
-    style: Object.assign({
-      position: 'absolute',
-      width: '1px',
-      height: '1px',
-      padding: 0,
-      margin: '-1px',
-      overflow: 'hidden',
-      clip: 'rect(0, 0, 0, 0)',
-      whiteSpace: 'nowrap',
-      borderWidth: 0
-    }, style)
-  }, props, {
-    children: children
-  }));
-});
-VisuallyHidden.displayName = 'VisuallyHidden';
-
-var FOCUSABLE_SELECTOR = 'button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"]):not([disabled])';
-/**
- * Traps keyboard focus within its children.
- * Use in modals, dialogs, and sheets to prevent focus from escaping.
- */
-var FocusScope = /*#__PURE__*/forwardRef(function (_a, _ref) {
-  var _a$trapped = _a.trapped,
-    trapped = _a$trapped === void 0 ? false : _a$trapped,
-    _a$autoFocus = _a.autoFocus,
-    autoFocus = _a$autoFocus === void 0 ? false : _a$autoFocus,
-    onEscape = _a.onEscape,
-    children = _a.children,
-    className = _a.className,
-    props = __rest$1(_a, ["trapped", "autoFocus", "onEscape", "children", "className"]);
-  var containerRef = useRef(null);
-  var getFocusableElements = useCallback(function () {
-    if (!containerRef.current) return [];
-    return Array.from(containerRef.current.querySelectorAll(FOCUSABLE_SELECTOR));
-  }, []);
-  useEffect(function () {
-    if (!autoFocus || !containerRef.current) return;
-    var focusable = getFocusableElements();
-    if (focusable.length > 0) {
-      focusable[0].focus();
-    }
-  }, [autoFocus, getFocusableElements]);
-  useEffect(function () {
-    if (!trapped || !containerRef.current) return;
-    var handleKeyDown = function handleKeyDown(e) {
-      if (e.key === 'Escape' && onEscape) {
-        onEscape();
-        return;
-      }
-      if (e.key !== 'Tab') return;
-      var focusable = getFocusableElements();
-      if (focusable.length === 0) return;
-      var first = focusable[0];
-      var last = focusable[focusable.length - 1];
-      if (e.shiftKey) {
-        if (document.activeElement === first) {
-          e.preventDefault();
-          last.focus();
-        }
-      } else {
-        if (document.activeElement === last) {
-          e.preventDefault();
-          first.focus();
-        }
-      }
-    };
-    var container = containerRef.current;
-    container.addEventListener('keydown', handleKeyDown);
-    return function () {
-      return container.removeEventListener('keydown', handleKeyDown);
-    };
-  }, [trapped, onEscape, getFocusableElements]);
-  return jsx("div", Object.assign({
-    ref: function ref(node) {
-      containerRef.current = node;
-      if (typeof _ref === 'function') _ref(node);else if (_ref) _ref.current = node;
-    },
-    className: clsx(className)
-  }, props, {
-    children: children
-  }));
-});
-FocusScope.displayName = 'FocusScope';
-
 function PageHeader(_a) {
   var title = _a.title,
     description = _a.description,
@@ -58340,5 +57653,5 @@ function getShortcutCategory(shortcut) {
 // Version
 var version = '1.0.0';
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AdvancedTable, AgGridTable, Alert, AlertCircleIcon, AlertTriangleIcon, AnimatedElement, AppHeader, Autocomplete, Avatar, AvatarFallback, AvatarGroup, AvatarImage, Badge, Breadcrumb, BreadcrumbItem, BreadcrumbSeparator, Button, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselSlide, CheckIcon, Checkbox, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, Chip, CloseIcon, CodeSnippet, Collapsible, CollapsibleCode, CollapsibleContent, CollapsibleInfoPanel, CollapsibleTrigger, ColumnCustomizationDrawer, Command, CommandGroup, CommandItem, CommandSeparator, ConfirmSheet, Container, CounterAnimation, DataGrid, DatePicker, DateRangePicker, DescriptionList, DesktopOnly, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Display, DocumentEditor, DragDrop, Dropdown, DropdownContent, DropdownItem, Dropdown as DropdownMenu, DropdownContent as DropdownMenuContent, DropdownItem as DropdownMenuItem, DropdownMenuLabel, DropdownSeparator as DropdownMenuSeparator, DropdownTrigger as DropdownMenuTrigger, DropdownSeparator, DropdownTrigger, DynamicIcon, EmptyState, Fieldset, FileUpload, Filter, FlexContainer, FloatingElement, FocusScope, Footer, Form, FormActions, FormControl, FormDescription, FormError, FormField, FormGroup, FormItem, FormLabel, FormMessage, FormSection, GridContainer, HStack, Heading, Icon$2 as Icon, Image, ImageCarousel, ImageThumbnail, InfoIcon, Input, Label, List, ListItem, Loading, MWBounceLoader, MWBrandLoader, MWDotsLoader, MWHeartbeatLoader, MWLoader, MWMatrixLoader, MWProgressiveLoader, Menu, MenuCheckboxItem, MenuGroup, MenuItem, MenuRadioGroup, MenuRadioItem, MenuSeparator, MetricCard, MinusIcon, MobileDataCard, MobileOnly, MobilePagination, MobileToolbar, Modal, ModalBody, ModalFooter, ModalHeader, MultiSelect, Navigation, NavigationList, NoDataEmptyState, NoResultsEmptyState, Notification, NotificationBadge, NotificationBell, NotificationList, PageHeader, PageHero, Pagination, Panel, PanelGroup, PanelHeader, PanelResizer, PlusIcon, Popover, PopoverContent, PopoverTrigger, ProcessFlowAnimation, Progress, ProgressBar, Radio$1 as Radio, RadioGroup, RadioGroupItem, Rating, ResponsiveContainer, ResponsiveStack, RichTextEditor, ScheduleGrid, ScrollArea, SearchBar, SearchIcon, SearchResults, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectRoot, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarCollapseToggle, SidebarContent, SidebarFooter, SidebarGroup, SidebarHeader, SidebarItem, SidebarNav, SidebarPanel, SidebarProvider, SidebarToggleButton, SidebarTrigger, SimpleSelect, Skeleton, Slider, SnackbarProvider, SortableList, Spinner, SplitPanel, Stack, StackPanel, StatusBadge, Stepper, Switch, SwitchGroup, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, Text, Textarea, ThemeToggle, Thumbnail, ThumbnailGallery, TimePicker, TimeRangePicker, Timeline, TimelineItem, ToastProvider, ToggleGroup, ToggleGroupItem, Tooltip, TreeView, VideoThumbnail, VisuallyHidden, borderRadius, borderWidth, breakpoints, cn, colors, cssVariables, debounce, effects, findTreeNode, formatIconName$1 as formatIconName, generateColorVariations, generateIconCode, getAllNodeIds, getParentIds, hexToRgb, shadows, spacing, tokens, typography, useAdvancedTable, useCalendar, useDragDrop, useFormContext, useIconSearch, useKeyboardShortcuts, useSidebar, useSidebarSafe, useSnackbar, useSnackbarHelpers, useToast, version, zIndex };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AdvancedTable, AgGridTable, Alert, AlertCircleIcon, AlertTriangleIcon, AnimatedElement, AppHeader, Autocomplete, Avatar, AvatarFallback, AvatarGroup, AvatarImage, Badge, Breadcrumb, BreadcrumbItem, BreadcrumbSeparator, Button, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselSlide, CheckIcon, Checkbox, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, Chip, CloseIcon, CodeSnippet, Collapsible, CollapsibleCode, CollapsibleContent, CollapsibleTrigger, ColumnCustomizationDrawer, Command, CommandGroup, CommandItem, CommandSeparator, ConfirmSheet, Container, CounterAnimation, DataGrid, DatePicker, DateRangePicker, DescriptionList, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Display, DocumentEditor, DragDrop, Dropdown, DropdownContent, DropdownItem, Dropdown as DropdownMenu, DropdownContent as DropdownMenuContent, DropdownItem as DropdownMenuItem, DropdownMenuLabel, DropdownSeparator as DropdownMenuSeparator, DropdownTrigger as DropdownMenuTrigger, DropdownSeparator, DropdownTrigger, DynamicIcon, EmptyState, Fieldset, FileUpload, Filter, FlexContainer, FloatingElement, Footer, Form, FormActions, FormControl, FormDescription, FormError, FormField, FormGroup, FormItem, FormLabel, FormMessage, FormSection, GridContainer, HStack, Heading, Icon$2 as Icon, Image, ImageCarousel, ImageThumbnail, InfoIcon, Input, Label, List, ListItem, Loading, MWBounceLoader, MWBrandLoader, MWDotsLoader, MWHeartbeatLoader, MWLoader, MWMatrixLoader, MWProgressiveLoader, Menu, MenuCheckboxItem, MenuGroup, MenuItem, MenuRadioGroup, MenuRadioItem, MenuSeparator, MetricCard, MinusIcon, Modal, ModalBody, ModalFooter, ModalHeader, MultiSelect, Navigation, NavigationList, NoDataEmptyState, NoResultsEmptyState, Notification, NotificationBadge, NotificationBell, NotificationList, PageHeader, PageHero, Pagination, Panel, PanelGroup, PanelHeader, PanelResizer, PlusIcon, Popover, PopoverContent, PopoverTrigger, ProcessFlowAnimation, Progress, ProgressBar, Radio$1 as Radio, RadioGroup, RadioGroupItem, Rating, ResponsiveContainer, RichTextEditor, ScheduleGrid, ScrollArea, SearchBar, SearchIcon, SearchResults, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectRoot, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarCollapseToggle, SidebarContent, SidebarFooter, SidebarGroup, SidebarHeader, SidebarItem, SidebarNav, SidebarPanel, SidebarProvider, SidebarToggleButton, SidebarTrigger, SimpleSelect, Skeleton, Slider, SnackbarProvider, SortableList, Spinner, SplitPanel, Stack, StackPanel, StatusBadge, Stepper, Switch, SwitchGroup, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, Text, Textarea, ThemeToggle, Thumbnail, ThumbnailGallery, TimePicker, TimeRangePicker, Timeline, TimelineItem, ToastProvider, ToggleGroup, ToggleGroupItem, Tooltip, TreeView, VideoThumbnail, borderRadius, borderWidth, breakpoints, cn, colors, cssVariables, debounce, effects, findTreeNode, formatIconName$1 as formatIconName, generateColorVariations, generateIconCode, getAllNodeIds, getParentIds, hexToRgb, shadows, spacing, tokens, typography, useDragDrop, useFormContext, useIconSearch, useKeyboardShortcuts, useSidebar, useSidebarSafe, useSnackbar, useSnackbarHelpers, useToast, version, zIndex };
 //# sourceMappingURL=index.esm.js.map