@moving-walls/design-system 2.0.0 → 2.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/dist/components/ui/DateRangePicker.d.ts +6 -7
  2. package/dist/components/ui/ScheduleGrid.d.ts +1 -6
  3. package/dist/components/ui/TimeRangePicker.d.ts +1 -8
  4. package/dist/components/ui/index.d.ts +0 -22
  5. package/dist/hooks/index.d.ts +0 -3
  6. package/dist/index.esm.js +130 -827
  7. package/dist/index.esm.js.map +1 -1
  8. package/dist/index.js +128 -836
  9. package/dist/index.js.map +1 -1
  10. package/dist/tsconfig.build.tsbuildinfo +1 -1
  11. package/package.json +144 -146
  12. package/dist/components/ui/AdvancedTable/index.d.ts +0 -3
  13. package/dist/components/ui/AdvancedTable/types.d.ts +0 -51
  14. package/dist/components/ui/AdvancedTable/useAdvancedTable.d.ts +0 -27
  15. package/dist/components/ui/Calendar/index.d.ts +0 -3
  16. package/dist/components/ui/Calendar/types.d.ts +0 -14
  17. package/dist/components/ui/Calendar/useCalendar.d.ts +0 -26
  18. package/dist/components/ui/CollapsibleInfoPanel.d.ts +0 -12
  19. package/dist/components/ui/DesktopOnly.d.ts +0 -8
  20. package/dist/components/ui/DragDrop/DragDropZone.d.ts +0 -14
  21. package/dist/components/ui/DragDrop/FilePreview.d.ts +0 -7
  22. package/dist/components/ui/DragDrop/SortableList.d.ts +0 -8
  23. package/dist/components/ui/DragDrop/index.d.ts +0 -9
  24. package/dist/components/ui/DragDrop/types.d.ts +0 -12
  25. package/dist/components/ui/DragDrop/useDragDrop.d.ts +0 -16
  26. package/dist/components/ui/FocusScope.d.ts +0 -14
  27. package/dist/components/ui/MobileDataCard.d.ts +0 -18
  28. package/dist/components/ui/MobileOnly.d.ts +0 -8
  29. package/dist/components/ui/MobilePagination.d.ts +0 -10
  30. package/dist/components/ui/MobileToolbar.d.ts +0 -12
  31. package/dist/components/ui/ResponsiveStack.d.ts +0 -14
  32. package/dist/components/ui/VisuallyHidden.d.ts +0 -10
  33. package/dist/hooks/useMediaQuery.d.ts +0 -6
  34. package/dist/hooks/useResponsiveSheet.d.ts +0 -19
package/dist/index.js CHANGED
@@ -289,17 +289,14 @@ var Input = /*#__PURE__*/React.forwardRef(function (_a, ref) {
289
289
  label = _a.label,
290
290
  error = _a.error,
291
291
  helpText = _a.helpText,
292
- id = _a.id,
293
- props = __rest$1(_a, ["className", "label", "error", "helpText", "id"]);
292
+ props = __rest$1(_a, ["className", "label", "error", "helpText"]);
294
293
  return require$$1.jsxs("div", {
295
294
  className: "space-y-2",
296
295
  children: [label && require$$1.jsx("label", {
297
- htmlFor: id,
298
296
  className: "block text-sm font-normal leading-none text-mw-neutral-700 dark:text-mw-neutral-300",
299
297
  children: label
300
298
  }), require$$1.jsx("input", Object.assign({
301
299
  ref: ref,
302
- id: id,
303
300
  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)
304
301
  }, props)), error && require$$1.jsx("p", {
305
302
  className: "text-sm text-mw-error-600 dark:text-mw-error-400",
@@ -319,8 +316,7 @@ var Textarea = /*#__PURE__*/React.forwardRef(function (_a, ref) {
319
316
  helpText = _a.helpText,
320
317
  _a$resize = _a.resize,
321
318
  resize = _a$resize === void 0 ? 'vertical' : _a$resize,
322
- id = _a.id,
323
- props = __rest$1(_a, ["className", "label", "error", "helpText", "resize", "id"]);
319
+ props = __rest$1(_a, ["className", "label", "error", "helpText", "resize"]);
324
320
  var resizeClasses = {
325
321
  none: 'resize-none',
326
322
  vertical: 'resize-y',
@@ -330,12 +326,10 @@ var Textarea = /*#__PURE__*/React.forwardRef(function (_a, ref) {
330
326
  return require$$1.jsxs("div", {
331
327
  className: "space-y-2",
332
328
  children: [label && require$$1.jsx("label", {
333
- htmlFor: id,
334
329
  className: "block text-sm font-medium text-mw-neutral-700 dark:text-mw-neutral-300",
335
330
  children: label
336
331
  }), require$$1.jsx("textarea", Object.assign({
337
332
  ref: ref,
338
- id: id,
339
333
  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)
340
334
  }, props)), error && require$$1.jsx("p", {
341
335
  className: "text-sm text-mw-error-600 dark:text-mw-error-400",
@@ -353,8 +347,7 @@ var Checkbox = /*#__PURE__*/React.forwardRef(function (_a, ref) {
353
347
  label = _a.label,
354
348
  description = _a.description,
355
349
  error = _a.error,
356
- id = _a.id,
357
- props = __rest$1(_a, ["className", "label", "description", "error", "id"]);
350
+ props = __rest$1(_a, ["className", "label", "description", "error"]);
358
351
  return require$$1.jsxs("div", {
359
352
  className: "space-y-2",
360
353
  children: [require$$1.jsxs("div", {
@@ -362,12 +355,10 @@ var Checkbox = /*#__PURE__*/React.forwardRef(function (_a, ref) {
362
355
  children: [require$$1.jsx("input", Object.assign({
363
356
  type: "checkbox",
364
357
  ref: ref,
365
- id: id,
366
358
  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)
367
359
  }, props)), (label || description) && require$$1.jsxs("div", {
368
360
  className: "flex-1 min-w-0",
369
361
  children: [label && require$$1.jsx("label", {
370
- htmlFor: id,
371
362
  className: "text-sm font-medium text-mw-neutral-500 dark:text-mw-neutral-300",
372
363
  children: label
373
364
  }), description && require$$1.jsx("p", {
@@ -387,8 +378,7 @@ var Radio$1 = /*#__PURE__*/React.forwardRef(function (_a, ref) {
387
378
  label = _a.label,
388
379
  description = _a.description,
389
380
  error = _a.error,
390
- id = _a.id,
391
- props = __rest$1(_a, ["className", "label", "description", "error", "id"]);
381
+ props = __rest$1(_a, ["className", "label", "description", "error"]);
392
382
  return require$$1.jsxs("div", {
393
383
  className: "space-y-2",
394
384
  children: [require$$1.jsxs("div", {
@@ -396,12 +386,10 @@ var Radio$1 = /*#__PURE__*/React.forwardRef(function (_a, ref) {
396
386
  children: [require$$1.jsx("input", Object.assign({
397
387
  type: "radio",
398
388
  ref: ref,
399
- id: id,
400
389
  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)
401
390
  }, props)), (label || description) && require$$1.jsxs("div", {
402
391
  className: "flex-1 min-w-0",
403
392
  children: [label && require$$1.jsx("label", {
404
- htmlFor: id,
405
393
  className: "text-sm font-medium text-mw-neutral-500 dark:text-mw-neutral-300",
406
394
  children: label
407
395
  }), description && require$$1.jsx("p", {
@@ -31466,7 +31454,7 @@ var AUTOFOCUS_ON_MOUNT = "focusScope.autoFocusOnMount";
31466
31454
  var AUTOFOCUS_ON_UNMOUNT = "focusScope.autoFocusOnUnmount";
31467
31455
  var EVENT_OPTIONS = { bubbles: false, cancelable: true };
31468
31456
  var FOCUS_SCOPE_NAME = "FocusScope";
31469
- var FocusScope$1 = React__namespace.forwardRef((props, forwardedRef) => {
31457
+ var FocusScope = React__namespace.forwardRef((props, forwardedRef) => {
31470
31458
  const { loop = false, trapped = false, onMountAutoFocus: onMountAutoFocusProp, onUnmountAutoFocus: onUnmountAutoFocusProp } = props, scopeProps = __rest$1(props, ["loop", "trapped", "onMountAutoFocus", "onUnmountAutoFocus"]);
31471
31459
  const [container, setContainer] = React__namespace.useState(null);
31472
31460
  const onMountAutoFocus = useCallbackRef$1(onMountAutoFocusProp);
@@ -31586,7 +31574,7 @@ var FocusScope$1 = React__namespace.forwardRef((props, forwardedRef) => {
31586
31574
  }, [loop, trapped, focusScope.paused]);
31587
31575
  return /* @__PURE__ */ require$$1.jsx(Primitive.div, Object.assign(Object.assign({ tabIndex: -1 }, scopeProps), { ref: composedRefs, onKeyDown: handleKeyDown }));
31588
31576
  });
31589
- FocusScope$1.displayName = FOCUS_SCOPE_NAME;
31577
+ FocusScope.displayName = FOCUS_SCOPE_NAME;
31590
31578
  function focusFirst(candidates, { select = false } = {}) {
31591
31579
  const previouslyFocusedElement = document.activeElement;
31592
31580
  for (const candidate of candidates) {
@@ -33938,10 +33926,10 @@ var VISUALLY_HIDDEN_STYLES = Object.freeze({
33938
33926
  wordWrap: "normal"
33939
33927
  });
33940
33928
  var NAME = "VisuallyHidden";
33941
- var VisuallyHidden$1 = React__namespace.forwardRef((props, forwardedRef) => {
33929
+ var VisuallyHidden = React__namespace.forwardRef((props, forwardedRef) => {
33942
33930
  return /* @__PURE__ */ require$$1.jsx(Primitive.span, Object.assign(Object.assign({}, props), { ref: forwardedRef, style: Object.assign(Object.assign({}, VISUALLY_HIDDEN_STYLES), props.style) }));
33943
33931
  });
33944
- VisuallyHidden$1.displayName = NAME;
33932
+ VisuallyHidden.displayName = NAME;
33945
33933
 
33946
33934
  var getDefaultParent = function (originalTarget) {
33947
33935
  if (typeof document === 'undefined') {
@@ -35114,7 +35102,7 @@ var SelectContentImpl = React__namespace.forwardRef((props, forwardedRef) => {
35114
35102
  position,
35115
35103
  isPositioned,
35116
35104
  searchRef,
35117
- children: /* @__PURE__ */ require$$1.jsx(ReactRemoveScroll, { as: Slot, allowPinchZoom: true, children: /* @__PURE__ */ require$$1.jsx(FocusScope$1, {
35105
+ children: /* @__PURE__ */ require$$1.jsx(ReactRemoveScroll, { as: Slot, allowPinchZoom: true, children: /* @__PURE__ */ require$$1.jsx(FocusScope, {
35118
35106
  asChild: true,
35119
35107
  trapped: context.open,
35120
35108
  onMountAutoFocus: (event) => {
@@ -36156,7 +36144,8 @@ var daysOfWeek = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
36156
36144
  function DatePicker(_ref) {
36157
36145
  var value = _ref.value,
36158
36146
  onChange = _ref.onChange,
36159
- placeholder = _ref.placeholder,
36147
+ _ref$placeholder = _ref.placeholder,
36148
+ placeholder = _ref$placeholder === void 0 ? 'Select date' : _ref$placeholder,
36160
36149
  _ref$disabled = _ref.disabled,
36161
36150
  disabled = _ref$disabled === void 0 ? false : _ref$disabled,
36162
36151
  className = _ref.className,
@@ -36499,16 +36488,17 @@ function CalendarMonth(_ref) {
36499
36488
  function DateRangePicker(_ref3) {
36500
36489
  var value = _ref3.value,
36501
36490
  onChange = _ref3.onChange,
36502
- placeholder = _ref3.placeholder,
36503
- labels = _ref3.labels,
36491
+ _ref3$placeholder = _ref3.placeholder,
36492
+ placeholder = _ref3$placeholder === void 0 ? 'Select date range' : _ref3$placeholder,
36504
36493
  _ref3$disabled = _ref3.disabled,
36505
36494
  disabled = _ref3$disabled === void 0 ? false : _ref3$disabled;
36506
36495
  _ref3.required;
36507
36496
  var _ref3$clearable = _ref3.clearable,
36508
36497
  clearable = _ref3$clearable === void 0 ? true : _ref3$clearable,
36509
36498
  minDate = _ref3.minDate,
36510
- maxDate = _ref3.maxDate,
36511
- _ref3$numberOfMonths = _ref3.numberOfMonths,
36499
+ maxDate = _ref3.maxDate;
36500
+ _ref3.selectsRange;
36501
+ var _ref3$numberOfMonths = _ref3.numberOfMonths,
36512
36502
  numberOfMonths = _ref3$numberOfMonths === void 0 ? 1 : _ref3$numberOfMonths,
36513
36503
  className = _ref3.className,
36514
36504
  _ref3$format = _ref3.format,
@@ -36516,8 +36506,15 @@ function DateRangePicker(_ref3) {
36516
36506
  _ref3$presets = _ref3.presets,
36517
36507
  presets = _ref3$presets === void 0 ? defaultPresets$1 : _ref3$presets,
36518
36508
  _ref3$align = _ref3.align,
36519
- align = _ref3$align === void 0 ? 'left' : _ref3$align;
36520
- var _a, _b;
36509
+ align = _ref3$align === void 0 ? 'left' : _ref3$align,
36510
+ _ref3$enableApplyButt = _ref3.enableApplyButton,
36511
+ enableApplyButton = _ref3$enableApplyButt === void 0 ? false : _ref3$enableApplyButt,
36512
+ _ref3$applyButtonText = _ref3.applyButtonText,
36513
+ applyButtonText = _ref3$applyButtonText === void 0 ? 'Apply' : _ref3$applyButtonText,
36514
+ _ref3$enableCancelBut = _ref3.enableCancelButton,
36515
+ enableCancelButton = _ref3$enableCancelBut === void 0 ? true : _ref3$enableCancelBut,
36516
+ _ref3$cancelButtonTex = _ref3.cancelButtonText,
36517
+ cancelButtonText = _ref3$cancelButtonTex === void 0 ? 'Cancel' : _ref3$cancelButtonTex;
36521
36518
  var _useState = React.useState(false),
36522
36519
  _useState2 = _slicedToArray(_useState, 2),
36523
36520
  isOpen = _useState2[0],
@@ -36529,71 +36526,111 @@ function DateRangePicker(_ref3) {
36529
36526
  _useState4 = _slicedToArray(_useState3, 2),
36530
36527
  selectedRange = _useState4[0],
36531
36528
  setSelectedRange = _useState4[1];
36532
- var _useState5 = React.useState(new Date()),
36529
+ var _useState5 = React.useState(value || {
36530
+ from: null,
36531
+ to: null
36532
+ }),
36533
36533
  _useState6 = _slicedToArray(_useState5, 2),
36534
- currentMonth = _useState6[0],
36535
- setCurrentMonth = _useState6[1];
36536
- var _useState7 = React.useState(true),
36534
+ pendingRange = _useState6[0],
36535
+ setPendingRange = _useState6[1];
36536
+ var _useState7 = React.useState(new Date()),
36537
36537
  _useState8 = _slicedToArray(_useState7, 2),
36538
- selectingStart = _useState8[0],
36539
- setSelectingStart = _useState8[1];
36538
+ currentMonth = _useState8[0],
36539
+ setCurrentMonth = _useState8[1];
36540
+ var _useState9 = React.useState(true),
36541
+ _useState0 = _slicedToArray(_useState9, 2),
36542
+ selectingStart = _useState0[0],
36543
+ setSelectingStart = _useState0[1];
36540
36544
  var containerRef = React.useRef(null);
36541
36545
  React.useEffect(function () {
36542
36546
  if (value) {
36543
36547
  setSelectedRange(value);
36548
+ setPendingRange(value);
36544
36549
  }
36545
36550
  }, [value]);
36546
36551
  React.useEffect(function () {
36547
36552
  function handleClickOutside(event) {
36548
36553
  if (containerRef.current && !containerRef.current.contains(event.target)) {
36549
36554
  setIsOpen(false);
36555
+ // Reset pending to selected when closing without apply
36556
+ setPendingRange(selectedRange);
36550
36557
  }
36551
36558
  }
36552
36559
  document.addEventListener('mousedown', handleClickOutside);
36553
36560
  return function () {
36554
36561
  return document.removeEventListener('mousedown', handleClickOutside);
36555
36562
  };
36556
- }, []);
36563
+ }, [selectedRange]);
36557
36564
  var handleDateSelect = function handleDateSelect(date) {
36558
36565
  var newRange;
36559
- if (selectingStart || !selectedRange.from) {
36566
+ if (selectingStart || !pendingRange.from) {
36560
36567
  newRange = {
36561
36568
  from: date,
36562
36569
  to: null
36563
36570
  };
36564
36571
  setSelectingStart(false);
36565
36572
  } else {
36566
- if (date < selectedRange.from) {
36573
+ if (date < pendingRange.from) {
36567
36574
  newRange = {
36568
36575
  from: date,
36569
- to: selectedRange.from
36576
+ to: null
36570
36577
  };
36571
- } else {
36578
+ } else if (date > pendingRange.from) {
36572
36579
  newRange = {
36573
- from: selectedRange.from,
36580
+ from: pendingRange.from,
36574
36581
  to: date
36575
36582
  };
36583
+ setSelectingStart(true);
36584
+ } else {
36585
+ newRange = {
36586
+ from: date,
36587
+ to: null
36588
+ };
36576
36589
  }
36577
- setSelectingStart(true);
36578
36590
  }
36579
- setSelectedRange(newRange);
36580
- onChange === null || onChange === void 0 ? void 0 : onChange(newRange);
36581
- if (newRange.from && newRange.to) {
36591
+ // Update pending range, don't call onChange yet
36592
+ setPendingRange(newRange);
36593
+ // Without Apply button, fire onChange immediately when full range selected
36594
+ if (!enableApplyButton && newRange.from && newRange.to) {
36595
+ setSelectedRange(newRange);
36596
+ onChange === null || onChange === void 0 ? void 0 : onChange(newRange);
36582
36597
  setIsOpen(false);
36583
36598
  }
36584
36599
  };
36585
- var handlePresetSelect = function handlePresetSelect(preset) {
36586
- setSelectedRange(preset.range);
36587
- onChange === null || onChange === void 0 ? void 0 : onChange(preset.range);
36600
+ var handleApply = function handleApply() {
36601
+ // Apply pending range and call onChange
36602
+ setSelectedRange(pendingRange);
36603
+ onChange === null || onChange === void 0 ? void 0 : onChange(pendingRange);
36604
+ setIsOpen(false);
36605
+ };
36606
+ var handleCancel = function handleCancel() {
36607
+ // Cancel: restore original selection, don't call onChange
36608
+ setPendingRange(selectedRange);
36588
36609
  setIsOpen(false);
36589
36610
  };
36611
+ var handlePresetSelect = function handlePresetSelect(preset) {
36612
+ setPendingRange(preset.range);
36613
+ // Navigate calendar to show the start month of the preset range
36614
+ if (preset.range.from) {
36615
+ setCurrentMonth(new Date(preset.range.from.getFullYear(), preset.range.from.getMonth(), 1));
36616
+ }
36617
+ setSelectingStart(true);
36618
+ // If Apply button is enabled, keep calendar open so user can confirm
36619
+ if (!enableApplyButton) {
36620
+ setSelectedRange(preset.range);
36621
+ onChange === null || onChange === void 0 ? void 0 : onChange(preset.range);
36622
+ setIsOpen(false);
36623
+ }
36624
+ };
36590
36625
  var handleClear = function handleClear() {
36591
36626
  var clearedRange = {
36592
36627
  from: null,
36593
36628
  to: null
36594
36629
  };
36595
36630
  setSelectedRange(clearedRange);
36631
+ setPendingRange(clearedRange);
36596
36632
  onChange === null || onChange === void 0 ? void 0 : onChange(clearedRange);
36633
+ setIsOpen(false);
36597
36634
  };
36598
36635
  var formatDisplayValue = function formatDisplayValue() {
36599
36636
  if (!selectedRange.from && !selectedRange.to) return placeholder;
@@ -36609,19 +36646,31 @@ function DateRangePicker(_ref3) {
36609
36646
  return require$$1.jsxs("div", {
36610
36647
  ref: containerRef,
36611
36648
  className: cn$p('relative', className),
36612
- children: [require$$1.jsxs("button", {
36613
- type: "button",
36649
+ children: [require$$1.jsxs("div", {
36650
+ role: "button",
36651
+ tabIndex: disabled ? -1 : 0,
36614
36652
  onClick: function onClick() {
36615
- return !disabled && setIsOpen(!isOpen);
36653
+ if (!disabled) {
36654
+ if (!isOpen) setPendingRange(selectedRange);
36655
+ setIsOpen(!isOpen);
36656
+ setSelectingStart(true);
36657
+ }
36616
36658
  },
36617
- disabled: disabled,
36618
- 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'),
36659
+ onKeyDown: function onKeyDown(e) {
36660
+ if (!disabled && (e.key === 'Enter' || e.key === ' ')) {
36661
+ if (!isOpen) setPendingRange(selectedRange);
36662
+ setIsOpen(!isOpen);
36663
+ setSelectingStart(true);
36664
+ }
36665
+ },
36666
+ 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'),
36619
36667
  children: [require$$1.jsx("span", {
36620
36668
  className: "truncate",
36621
36669
  children: formatDisplayValue()
36622
36670
  }), require$$1.jsxs("div", {
36623
36671
  className: "flex items-center gap-1 ml-2",
36624
36672
  children: [clearable && (selectedRange.from || selectedRange.to) && require$$1.jsx("button", {
36673
+ type: "button",
36625
36674
  onClick: function onClick(e) {
36626
36675
  e.stopPropagation();
36627
36676
  handleClear();
@@ -36647,6 +36696,7 @@ function DateRangePicker(_ref3) {
36647
36696
  className: "space-y-0.5",
36648
36697
  children: presets.map(function (preset, index) {
36649
36698
  return require$$1.jsx("button", {
36699
+ type: "button",
36650
36700
  onClick: function onClick() {
36651
36701
  return handlePresetSelect(preset);
36652
36702
  },
@@ -36659,7 +36709,7 @@ function DateRangePicker(_ref3) {
36659
36709
  className: "flex",
36660
36710
  children: [require$$1.jsx(CalendarMonth, {
36661
36711
  currentMonth: currentMonth,
36662
- selectedRange: selectedRange,
36712
+ selectedRange: pendingRange,
36663
36713
  onDateSelect: handleDateSelect,
36664
36714
  onMonthChange: setCurrentMonth,
36665
36715
  minDate: minDate,
@@ -36667,7 +36717,7 @@ function DateRangePicker(_ref3) {
36667
36717
  selectingStart: selectingStart
36668
36718
  }), numberOfMonths === 2 && require$$1.jsx(CalendarMonth, {
36669
36719
  currentMonth: new Date(currentMonth.getFullYear(), currentMonth.getMonth() + 1),
36670
- selectedRange: selectedRange,
36720
+ selectedRange: pendingRange,
36671
36721
  onDateSelect: handleDateSelect,
36672
36722
  onMonthChange: function onMonthChange(month) {
36673
36723
  var prevMonth = new Date(month);
@@ -36683,22 +36733,20 @@ function DateRangePicker(_ref3) {
36683
36733
  className: "flex items-center justify-between px-3 py-2 border-t border-mw-neutral-200 dark:border-mw-neutral-700",
36684
36734
  children: [require$$1.jsx("div", {
36685
36735
  className: "text-[11px] text-mw-neutral-500 dark:text-mw-neutral-400",
36686
- 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'
36736
+ children: selectingStart ? 'Select start date' : 'Select end date'
36687
36737
  }), require$$1.jsxs("div", {
36688
36738
  className: "flex gap-2 items-center",
36689
- children: [require$$1.jsx("button", {
36690
- onClick: function onClick() {
36691
- return setIsOpen(false);
36692
- },
36693
- 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",
36694
- children: "Cancel"
36695
- }), require$$1.jsx("button", {
36696
- onClick: function onClick() {
36697
- return setIsOpen(false);
36698
- },
36699
- disabled: !selectedRange.from,
36700
- 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",
36701
- children: "Apply"
36739
+ children: [enableCancelButton && require$$1.jsx("button", {
36740
+ type: "button",
36741
+ onClick: handleCancel,
36742
+ 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",
36743
+ children: cancelButtonText
36744
+ }), enableApplyButton && require$$1.jsx("button", {
36745
+ type: "button",
36746
+ onClick: handleApply,
36747
+ disabled: !pendingRange.from || !pendingRange.to,
36748
+ 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",
36749
+ children: applyButtonText
36702
36750
  })]
36703
36751
  })]
36704
36752
  })]
@@ -36844,7 +36892,8 @@ function TimePicker(_ref2) {
36844
36892
  label = _ref2.label,
36845
36893
  error = _ref2.error,
36846
36894
  helpText = _ref2.helpText,
36847
- placeholder = _ref2.placeholder,
36895
+ _ref2$placeholder = _ref2.placeholder,
36896
+ placeholder = _ref2$placeholder === void 0 ? 'Select time' : _ref2$placeholder,
36848
36897
  className = _ref2.className,
36849
36898
  _ref2$size = _ref2.size,
36850
36899
  size = _ref2$size === void 0 ? 'md' : _ref2$size,
@@ -37210,7 +37259,8 @@ function TimeSelect(_ref) {
37210
37259
  function TimeRangePicker(_ref2) {
37211
37260
  var value = _ref2.value,
37212
37261
  onChange = _ref2.onChange,
37213
- placeholder = _ref2.placeholder,
37262
+ _ref2$placeholder = _ref2.placeholder,
37263
+ placeholder = _ref2$placeholder === void 0 ? 'Select time range' : _ref2$placeholder,
37214
37264
  _ref2$disabled = _ref2.disabled,
37215
37265
  disabled = _ref2$disabled === void 0 ? false : _ref2$disabled;
37216
37266
  _ref2.required;
@@ -37223,10 +37273,8 @@ function TimeRangePicker(_ref2) {
37223
37273
  minTime = _ref2.minTime,
37224
37274
  maxTime = _ref2.maxTime,
37225
37275
  className = _ref2.className,
37226
- labels = _ref2.labels,
37227
37276
  _ref2$presets = _ref2.presets,
37228
37277
  presets = _ref2$presets === void 0 ? defaultPresets : _ref2$presets;
37229
- var _a, _b;
37230
37278
  var _useState5 = React.useState(value || {
37231
37279
  from: null,
37232
37280
  to: null
@@ -37363,13 +37411,13 @@ function TimeRangePicker(_ref2) {
37363
37411
  children: [require$$1.jsxs("div", {
37364
37412
  children: [require$$1.jsx("label", {
37365
37413
  className: "block text-sm font-medium mb-2 text-mw-neutral-900 dark:text-white",
37366
- children: (_a = labels === null || labels === void 0 ? void 0 : labels.fromTime) !== null && _a !== void 0 ? _a : 'From Time'
37414
+ children: "From Time"
37367
37415
  }), require$$1.jsx(TimeSelect, {
37368
37416
  value: selectedRange.from,
37369
37417
  onChange: handleFromTimeChange,
37370
37418
  options: timeOptions,
37371
37419
  format: format,
37372
- placeholder: labels === null || labels === void 0 ? void 0 : labels.selectStart,
37420
+ placeholder: "Select start time",
37373
37421
  disabled: disabled,
37374
37422
  minTime: minTime,
37375
37423
  maxTime: selectedRange.to ? format === '12' ? convertTo24Hour(selectedRange.to) : selectedRange.to : maxTime
@@ -37377,13 +37425,13 @@ function TimeRangePicker(_ref2) {
37377
37425
  }), require$$1.jsxs("div", {
37378
37426
  children: [require$$1.jsx("label", {
37379
37427
  className: "block text-sm font-medium mb-2 text-mw-neutral-900 dark:text-white",
37380
- children: (_b = labels === null || labels === void 0 ? void 0 : labels.toTime) !== null && _b !== void 0 ? _b : 'To Time'
37428
+ children: "To Time"
37381
37429
  }), require$$1.jsx(TimeSelect, {
37382
37430
  value: selectedRange.to,
37383
37431
  onChange: handleToTimeChange,
37384
37432
  options: timeOptions,
37385
37433
  format: format,
37386
- placeholder: labels === null || labels === void 0 ? void 0 : labels.selectEnd,
37434
+ placeholder: "Select end time",
37387
37435
  disabled: disabled || !selectedRange.from,
37388
37436
  minTime: selectedRange.from ? format === '12' ? convertTo24Hour(selectedRange.from) : selectedRange.from : minTime,
37389
37437
  maxTime: maxTime
@@ -38712,7 +38760,8 @@ function MultiSelect(_ref) {
38712
38760
  _ref$value = _ref.value,
38713
38761
  value = _ref$value === void 0 ? [] : _ref$value,
38714
38762
  onChange = _ref.onChange,
38715
- placeholder = _ref.placeholder,
38763
+ _ref$placeholder = _ref.placeholder,
38764
+ placeholder = _ref$placeholder === void 0 ? 'Select...' : _ref$placeholder,
38716
38765
  label = _ref.label,
38717
38766
  _ref$disabled = _ref.disabled,
38718
38767
  disabled = _ref$disabled === void 0 ? false : _ref$disabled,
@@ -39169,8 +39218,7 @@ function ScheduleGrid(_ref) {
39169
39218
  _ref$presets = _ref.presets,
39170
39219
  presets = _ref$presets === void 0 ? DEFAULT_PRESETS : _ref$presets,
39171
39220
  _ref$showPresets = _ref.showPresets,
39172
- showPresets = _ref$showPresets === void 0 ? true : _ref$showPresets,
39173
- labels = _ref.labels;
39221
+ showPresets = _ref$showPresets === void 0 ? true : _ref$showPresets;
39174
39222
  var _useState = React.useState('custom'),
39175
39223
  _useState2 = _slicedToArray(_useState, 2),
39176
39224
  selectedPreset = _useState2[0],
@@ -39293,7 +39341,6 @@ function ScheduleGrid(_ref) {
39293
39341
  onChange(newRules);
39294
39342
  };
39295
39343
  var renderHourGrid = function renderHourGrid(type, selectedHours) {
39296
- var _a, _b;
39297
39344
  var allSelected = selectedHours.size === 24;
39298
39345
  var label = type === 'DEFAULT' ? 'Default Hours' : type === 'WEEKDAY' ? 'Weekday Hours (Mon-Fri)' : 'Weekend Hours (Sat-Sun)';
39299
39346
  var isExpanded = expandedSection === type.toLowerCase();
@@ -39328,7 +39375,7 @@ function ScheduleGrid(_ref) {
39328
39375
  return handleSelectAll(type);
39329
39376
  },
39330
39377
  className: "text-xs text-mw-primary-500 hover:text-mw-primary-600 font-medium",
39331
- 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'
39378
+ children: allSelected ? 'Deselect All' : 'Select All 24 Hours'
39332
39379
  })
39333
39380
  }), require$$1.jsx("div", {
39334
39381
  className: "grid grid-cols-6 gap-1.5",
@@ -42938,221 +42985,6 @@ function AdvancedTable(_ref3) {
42938
42985
  });
42939
42986
  }
42940
42987
 
42941
- function getCellValue(row, column) {
42942
- if (column.accessorFn) return column.accessorFn(row);
42943
- if (column.accessorKey) return row[column.accessorKey];
42944
- return undefined;
42945
- }
42946
- function useAdvancedTable(_ref) {
42947
- var data = _ref.data,
42948
- columns = _ref.columns,
42949
- _ref$initialState = _ref.initialState,
42950
- initialState = _ref$initialState === void 0 ? {} : _ref$initialState,
42951
- _ref$getRowId = _ref.getRowId,
42952
- getRowId = _ref$getRowId === void 0 ? function (_row, index) {
42953
- return index;
42954
- } : _ref$getRowId;
42955
- var _useState = React.useState(initialState.sorting || []),
42956
- _useState2 = _slicedToArray(_useState, 2),
42957
- sorting = _useState2[0],
42958
- setSorting = _useState2[1];
42959
- var _useState3 = React.useState(initialState.filters || []),
42960
- _useState4 = _slicedToArray(_useState3, 2),
42961
- filters = _useState4[0],
42962
- setFilters = _useState4[1];
42963
- var _useState5 = React.useState(initialState.globalFilter || ''),
42964
- _useState6 = _slicedToArray(_useState5, 2),
42965
- globalFilter = _useState6[0],
42966
- setGlobalFilter = _useState6[1];
42967
- var _useState7 = React.useState(initialState.columnVisibility || {}),
42968
- _useState8 = _slicedToArray(_useState7, 2),
42969
- columnVisibility = _useState8[0],
42970
- setColumnVisibility = _useState8[1];
42971
- var _useState9 = React.useState(initialState.density || 'normal'),
42972
- _useState0 = _slicedToArray(_useState9, 2),
42973
- density = _useState0[0],
42974
- setDensity = _useState0[1];
42975
- var _useState1 = React.useState(new Set()),
42976
- _useState10 = _slicedToArray(_useState1, 2),
42977
- selectedRows = _useState10[0],
42978
- setSelectedRows = _useState10[1];
42979
- var visibleColumns = React.useMemo(function () {
42980
- return columns.filter(function (col) {
42981
- return columnVisibility[col.id] !== false && !col.hidden;
42982
- });
42983
- }, [columns, columnVisibility]);
42984
- var toggleSort = React.useCallback(function (columnId) {
42985
- setSorting(function (prev) {
42986
- var existing = prev.find(function (s) {
42987
- return s.columnId === columnId;
42988
- });
42989
- if (!existing) return [{
42990
- columnId: columnId,
42991
- direction: 'asc'
42992
- }];
42993
- if (existing.direction === 'asc') return [{
42994
- columnId: columnId,
42995
- direction: 'desc'
42996
- }];
42997
- return [];
42998
- });
42999
- }, []);
43000
- var addFilter = React.useCallback(function (filter) {
43001
- setFilters(function (prev) {
43002
- var idx = prev.findIndex(function (f) {
43003
- return f.columnId === filter.columnId;
43004
- });
43005
- if (idx >= 0) {
43006
- var next = _toConsumableArray(prev);
43007
- next[idx] = filter;
43008
- return next;
43009
- }
43010
- return [].concat(_toConsumableArray(prev), [filter]);
43011
- });
43012
- }, []);
43013
- var removeFilter = React.useCallback(function (columnId) {
43014
- setFilters(function (prev) {
43015
- return prev.filter(function (f) {
43016
- return f.columnId !== columnId;
43017
- });
43018
- });
43019
- }, []);
43020
- var clearFilters = React.useCallback(function () {
43021
- setFilters([]);
43022
- setGlobalFilter('');
43023
- }, []);
43024
- var toggleColumnVisibility = React.useCallback(function (columnId) {
43025
- setColumnVisibility(function (prev) {
43026
- return Object.assign(Object.assign({}, prev), _defineProperty({}, columnId, prev[columnId] === false ? true : false));
43027
- });
43028
- }, []);
43029
- var toggleRowSelection = React.useCallback(function (rowId) {
43030
- setSelectedRows(function (prev) {
43031
- var next = new Set(prev);
43032
- if (next.has(rowId)) next["delete"](rowId);else next.add(rowId);
43033
- return next;
43034
- });
43035
- }, []);
43036
- var selectAllRows = React.useCallback(function () {
43037
- setSelectedRows(new Set(data.map(function (row, i) {
43038
- return getRowId(row, i);
43039
- })));
43040
- }, [data, getRowId]);
43041
- var clearSelection = React.useCallback(function () {
43042
- setSelectedRows(new Set());
43043
- }, []);
43044
- var processedData = React.useMemo(function () {
43045
- var result = _toConsumableArray(data);
43046
- // Apply global filter
43047
- if (globalFilter) {
43048
- var searchLower = globalFilter.toLowerCase();
43049
- result = result.filter(function (row) {
43050
- return columns.some(function (col) {
43051
- if (!col.searchable && col.searchable !== undefined) return false;
43052
- var value = getCellValue(row, col);
43053
- return value != null && String(value).toLowerCase().includes(searchLower);
43054
- });
43055
- });
43056
- }
43057
- // Apply column filters
43058
- var _iterator = _createForOfIteratorHelper(filters),
43059
- _step;
43060
- try {
43061
- var _loop = function _loop() {
43062
- var filter = _step.value;
43063
- var column = columns.find(function (c) {
43064
- return c.id === filter.columnId;
43065
- });
43066
- if (!column) return 1; // continue
43067
- result = result.filter(function (row) {
43068
- var value = getCellValue(row, column);
43069
- if (value == null) return false;
43070
- var strValue = String(value).toLowerCase();
43071
- var filterValue = String(filter.value).toLowerCase();
43072
- switch (filter.operator || 'contains') {
43073
- case 'equals':
43074
- return strValue === filterValue;
43075
- case 'contains':
43076
- return strValue.includes(filterValue);
43077
- case 'startsWith':
43078
- return strValue.startsWith(filterValue);
43079
- case 'endsWith':
43080
- return strValue.endsWith(filterValue);
43081
- default:
43082
- return strValue.includes(filterValue);
43083
- }
43084
- });
43085
- };
43086
- for (_iterator.s(); !(_step = _iterator.n()).done;) {
43087
- if (_loop()) continue;
43088
- }
43089
- // Apply sorting
43090
- } catch (err) {
43091
- _iterator.e(err);
43092
- } finally {
43093
- _iterator.f();
43094
- }
43095
- if (sorting.length > 0) {
43096
- var sort = sorting[0];
43097
- var column = columns.find(function (c) {
43098
- return c.id === sort.columnId;
43099
- });
43100
- if (column) {
43101
- result.sort(function (a, b) {
43102
- var aVal = getCellValue(a, column);
43103
- var bVal = getCellValue(b, column);
43104
- if (aVal == null && bVal == null) return 0;
43105
- if (aVal == null) return 1;
43106
- if (bVal == null) return -1;
43107
- var cmp = String(aVal).localeCompare(String(bVal), undefined, {
43108
- numeric: true
43109
- });
43110
- return sort.direction === 'desc' ? -cmp : cmp;
43111
- });
43112
- }
43113
- }
43114
- return result;
43115
- }, [data, columns, sorting, filters, globalFilter]);
43116
- var state = {
43117
- sorting: sorting,
43118
- filters: filters,
43119
- globalFilter: globalFilter,
43120
- columnVisibility: columnVisibility,
43121
- columnOrder: columns.map(function (c) {
43122
- return c.id;
43123
- }),
43124
- columnSizing: {},
43125
- density: density,
43126
- frozenColumns: {
43127
- left: [],
43128
- right: []
43129
- }
43130
- };
43131
- return {
43132
- // Data
43133
- processedData: processedData,
43134
- visibleColumns: visibleColumns,
43135
- // State
43136
- state: state,
43137
- sorting: sorting,
43138
- filters: filters,
43139
- globalFilter: globalFilter,
43140
- density: density,
43141
- selectedRows: selectedRows,
43142
- // Actions
43143
- toggleSort: toggleSort,
43144
- addFilter: addFilter,
43145
- removeFilter: removeFilter,
43146
- clearFilters: clearFilters,
43147
- setGlobalFilter: setGlobalFilter,
43148
- setDensity: setDensity,
43149
- toggleColumnVisibility: toggleColumnVisibility,
43150
- toggleRowSelection: toggleRowSelection,
43151
- selectAllRows: selectAllRows,
43152
- clearSelection: clearSelection
43153
- };
43154
- }
43155
-
43156
42988
  var emptyStateIcons = {
43157
42989
  noData: require$$1.jsx(Database, {
43158
42990
  className: "w-12 h-12 text-mw-neutral-400"
@@ -47347,121 +47179,6 @@ function DayView(_ref4) {
47347
47179
  });
47348
47180
  }
47349
47181
 
47350
- function useCalendar(_ref) {
47351
- var value = _ref.value,
47352
- _ref$events = _ref.events,
47353
- events = _ref$events === void 0 ? [] : _ref$events,
47354
- _ref$view = _ref.view,
47355
- view = _ref$view === void 0 ? 'month' : _ref$view,
47356
- onViewChange = _ref.onViewChange,
47357
- onChange = _ref.onChange,
47358
- _ref$hourFormat = _ref.hourFormat,
47359
- hourFormat = _ref$hourFormat === void 0 ? 24 : _ref$hourFormat;
47360
- var _useState = React.useState(value || new Date()),
47361
- _useState2 = _slicedToArray(_useState, 2),
47362
- currentDate = _useState2[0],
47363
- setCurrentDate = _useState2[1];
47364
- var _useState3 = React.useState(view),
47365
- _useState4 = _slicedToArray(_useState3, 2),
47366
- currentView = _useState4[0],
47367
- setCurrentView = _useState4[1];
47368
- var today = new Date();
47369
- var _useMemo = React.useMemo(function () {
47370
- return {
47371
- year: currentDate.getFullYear(),
47372
- month: currentDate.getMonth()
47373
- };
47374
- }, [currentDate]),
47375
- year = _useMemo.year,
47376
- month = _useMemo.month;
47377
- var handleViewChange = React.useCallback(function (newView) {
47378
- setCurrentView(newView);
47379
- onViewChange === null || onViewChange === void 0 ? void 0 : onViewChange(newView);
47380
- }, [onViewChange]);
47381
- var handleDateSelect = React.useCallback(function (date) {
47382
- setCurrentDate(date);
47383
- onChange === null || onChange === void 0 ? void 0 : onChange(date);
47384
- }, [onChange]);
47385
- var navigateMonth = React.useCallback(function (delta) {
47386
- setCurrentDate(function (prev) {
47387
- return new Date(prev.getFullYear(), prev.getMonth() + delta, 1);
47388
- });
47389
- }, []);
47390
- var navigateWeek = React.useCallback(function (delta) {
47391
- setCurrentDate(function (prev) {
47392
- var d = new Date(prev);
47393
- d.setDate(d.getDate() + delta * 7);
47394
- return d;
47395
- });
47396
- }, []);
47397
- var navigateDay = React.useCallback(function (delta) {
47398
- setCurrentDate(function (prev) {
47399
- var d = new Date(prev);
47400
- d.setDate(d.getDate() + delta);
47401
- return d;
47402
- });
47403
- }, []);
47404
- var goToToday = React.useCallback(function () {
47405
- setCurrentDate(new Date());
47406
- }, []);
47407
- var getEventsForDate = React.useCallback(function (date) {
47408
- return events.filter(function (event) {
47409
- return event.date.toDateString() === date.toDateString();
47410
- });
47411
- }, [events]);
47412
- var getEventsForTimeSlot = React.useCallback(function (date, timeSlot) {
47413
- var dateEvents = getEventsForDate(date);
47414
- return dateEvents.filter(function (event) {
47415
- if (event.allDay) return false;
47416
- if (!event.startTime) return false;
47417
- var eventStart = event.startTime;
47418
- return eventStart === timeSlot;
47419
- });
47420
- }, [getEventsForDate]);
47421
- var formatTime = React.useCallback(function (time) {
47422
- if (hourFormat === 12) {
47423
- var _time$split$map = time.split(':').map(Number),
47424
- _time$split$map2 = _slicedToArray(_time$split$map, 2),
47425
- hours = _time$split$map2[0],
47426
- minutes = _time$split$map2[1];
47427
- var ampm = hours >= 12 ? 'PM' : 'AM';
47428
- var displayHours = hours % 12 || 12;
47429
- return "".concat(displayHours, ":").concat(minutes.toString().padStart(2, '0'), " ").concat(ampm);
47430
- }
47431
- return time;
47432
- }, [hourFormat]);
47433
- var getWeekDates = React.useCallback(function (date) {
47434
- var startOfWeek = new Date(date);
47435
- var day = startOfWeek.getDay();
47436
- var diff = startOfWeek.getDate() - day + (day === 0 ? -6 : 1);
47437
- startOfWeek.setDate(diff);
47438
- var weekDates = [];
47439
- for (var i = 0; i < 7; i++) {
47440
- var weekDate = new Date(startOfWeek);
47441
- weekDate.setDate(startOfWeek.getDate() + i);
47442
- weekDates.push(weekDate);
47443
- }
47444
- return weekDates;
47445
- }, []);
47446
- return {
47447
- currentDate: currentDate,
47448
- currentView: currentView,
47449
- today: today,
47450
- year: year,
47451
- month: month,
47452
- handleViewChange: handleViewChange,
47453
- handleDateSelect: handleDateSelect,
47454
- navigateMonth: navigateMonth,
47455
- navigateWeek: navigateWeek,
47456
- navigateDay: navigateDay,
47457
- goToToday: goToToday,
47458
- getEventsForDate: getEventsForDate,
47459
- getEventsForTimeSlot: getEventsForTimeSlot,
47460
- formatTime: formatTime,
47461
- getWeekDates: getWeekDates
47462
- };
47463
- }
47464
-
47465
47182
  function cn$8() {
47466
47183
  for (var _len = arguments.length, classes = new Array(_len), _key = 0; _key < _len; _key++) {
47467
47184
  classes[_key] = arguments[_key];
@@ -50105,420 +49822,6 @@ function AgGridTableInner(props) {
50105
49822
  }
50106
49823
  var AgGridTable = AgGridTableInner;
50107
49824
 
50108
- /**
50109
- * A mobile-optimized card for displaying a single data row.
50110
- * Replaces AG Grid table rows on mobile viewports.
50111
- * Minimum 44px touch target when clickable.
50112
- */
50113
- var MobileDataCard = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(function (_a, ref) {
50114
- var title = _a.title,
50115
- subtitle = _a.subtitle,
50116
- statusBadge = _a.statusBadge,
50117
- fields = _a.fields,
50118
- actions = _a.actions,
50119
- onClick = _a.onClick,
50120
- className = _a.className,
50121
- props = __rest$1(_a, ["title", "subtitle", "statusBadge", "fields", "actions", "onClick", "className"]);
50122
- return require$$1.jsxs("div", Object.assign({
50123
- ref: ref,
50124
- role: onClick ? 'button' : undefined,
50125
- tabIndex: onClick ? 0 : undefined,
50126
- onClick: onClick,
50127
- onKeyDown: onClick ? function (e) {
50128
- if (e.key === 'Enter') onClick();
50129
- } : undefined,
50130
- 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)
50131
- }, props, {
50132
- children: [require$$1.jsxs("div", {
50133
- className: "flex items-start justify-between gap-2",
50134
- children: [require$$1.jsxs("div", {
50135
- className: "flex-1 min-w-0",
50136
- children: [require$$1.jsx("p", {
50137
- className: "text-sm font-medium text-mw-neutral-900 dark:text-mw-neutral-100 truncate",
50138
- children: title
50139
- }), subtitle && require$$1.jsx("p", {
50140
- className: "text-xs text-mw-neutral-500 dark:text-mw-neutral-400 mt-0.5",
50141
- children: subtitle
50142
- })]
50143
- }), require$$1.jsxs("div", {
50144
- className: "flex items-center gap-2 flex-shrink-0",
50145
- children: [statusBadge, actions]
50146
- })]
50147
- }), fields.length > 0 && require$$1.jsx("div", {
50148
- className: "grid grid-cols-2 gap-x-4 gap-y-2 mt-3",
50149
- children: fields.map(function (_ref) {
50150
- var label = _ref.label,
50151
- value = _ref.value;
50152
- return require$$1.jsxs("div", {
50153
- children: [require$$1.jsx("p", {
50154
- className: "text-xs text-mw-neutral-500 dark:text-mw-neutral-400",
50155
- children: label
50156
- }), require$$1.jsx("p", {
50157
- className: "text-sm text-mw-neutral-900 dark:text-mw-neutral-100",
50158
- children: value
50159
- })]
50160
- }, label);
50161
- })
50162
- })]
50163
- }));
50164
- }));
50165
- MobileDataCard.displayName = 'MobileDataCard';
50166
-
50167
- /**
50168
- * Prev/Next pagination for mobile card lists.
50169
- * Shows "Page X of Y" with disabled states at boundaries.
50170
- */
50171
- var MobilePagination = /*#__PURE__*/React.forwardRef(function (_a, ref) {
50172
- var page = _a.page,
50173
- totalPages = _a.totalPages,
50174
- onPageChange = _a.onPageChange,
50175
- className = _a.className,
50176
- props = __rest$1(_a, ["page", "totalPages", "onPageChange", "className"]);
50177
- return require$$1.jsxs("div", Object.assign({
50178
- ref: ref,
50179
- className: clsx('flex items-center justify-between px-2 py-3', className)
50180
- }, props, {
50181
- children: [require$$1.jsx("button", {
50182
- type: "button",
50183
- "aria-label": "Previous page",
50184
- disabled: page <= 1,
50185
- onClick: function onClick() {
50186
- return onPageChange(page - 1);
50187
- },
50188
- 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'),
50189
- children: "\u2190"
50190
- }), require$$1.jsxs("span", {
50191
- className: "text-sm text-mw-neutral-600 dark:text-mw-neutral-400",
50192
- children: [page, " / ", totalPages]
50193
- }), require$$1.jsx("button", {
50194
- type: "button",
50195
- "aria-label": "Next page",
50196
- disabled: page >= totalPages,
50197
- onClick: function onClick() {
50198
- return onPageChange(page + 1);
50199
- },
50200
- 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'),
50201
- children: "\u2192"
50202
- })]
50203
- }));
50204
- });
50205
- MobilePagination.displayName = 'MobilePagination';
50206
-
50207
- /**
50208
- * A mobile-optimized toolbar with search input and optional filter button.
50209
- * Filter button shows an active count badge when filters are applied.
50210
- */
50211
- var MobileToolbar = /*#__PURE__*/React.forwardRef(function (_a, ref) {
50212
- var searchValue = _a.searchValue,
50213
- onSearchChange = _a.onSearchChange,
50214
- _a$searchPlaceholder = _a.searchPlaceholder,
50215
- searchPlaceholder = _a$searchPlaceholder === void 0 ? 'Search...' : _a$searchPlaceholder,
50216
- onFilterClick = _a.onFilterClick,
50217
- activeFilterCount = _a.activeFilterCount,
50218
- className = _a.className,
50219
- props = __rest$1(_a, ["searchValue", "onSearchChange", "searchPlaceholder", "onFilterClick", "activeFilterCount", "className"]);
50220
- return require$$1.jsxs("div", Object.assign({
50221
- ref: ref,
50222
- className: clsx('flex items-center gap-2', className)
50223
- }, props, {
50224
- children: [require$$1.jsxs("div", {
50225
- className: "relative flex-1",
50226
- children: [require$$1.jsxs("svg", {
50227
- className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-mw-neutral-400",
50228
- xmlns: "http://www.w3.org/2000/svg",
50229
- viewBox: "0 0 24 24",
50230
- fill: "none",
50231
- stroke: "currentColor",
50232
- strokeWidth: "2",
50233
- strokeLinecap: "round",
50234
- strokeLinejoin: "round",
50235
- "aria-hidden": "true",
50236
- children: [require$$1.jsx("circle", {
50237
- cx: "11",
50238
- cy: "11",
50239
- r: "8"
50240
- }), require$$1.jsx("path", {
50241
- d: "m21 21-4.3-4.3"
50242
- })]
50243
- }), require$$1.jsx("input", {
50244
- type: "search",
50245
- role: "searchbox",
50246
- value: searchValue,
50247
- onChange: function onChange(e) {
50248
- return onSearchChange(e.target.value);
50249
- },
50250
- placeholder: searchPlaceholder,
50251
- 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')
50252
- })]
50253
- }), onFilterClick && require$$1.jsxs("button", {
50254
- type: "button",
50255
- "aria-label": "Filters",
50256
- onClick: onFilterClick,
50257
- 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'),
50258
- children: [require$$1.jsxs("svg", {
50259
- className: "h-5 w-5",
50260
- xmlns: "http://www.w3.org/2000/svg",
50261
- viewBox: "0 0 24 24",
50262
- fill: "none",
50263
- stroke: "currentColor",
50264
- strokeWidth: "2",
50265
- strokeLinecap: "round",
50266
- strokeLinejoin: "round",
50267
- "aria-hidden": "true",
50268
- children: [require$$1.jsx("line", {
50269
- x1: "4",
50270
- x2: "4",
50271
- y1: "21",
50272
- y2: "14"
50273
- }), require$$1.jsx("line", {
50274
- x1: "4",
50275
- x2: "4",
50276
- y1: "10",
50277
- y2: "3"
50278
- }), require$$1.jsx("line", {
50279
- x1: "12",
50280
- x2: "12",
50281
- y1: "21",
50282
- y2: "12"
50283
- }), require$$1.jsx("line", {
50284
- x1: "12",
50285
- x2: "12",
50286
- y1: "8",
50287
- y2: "3"
50288
- }), require$$1.jsx("line", {
50289
- x1: "20",
50290
- x2: "20",
50291
- y1: "21",
50292
- y2: "16"
50293
- }), require$$1.jsx("line", {
50294
- x1: "20",
50295
- x2: "20",
50296
- y1: "12",
50297
- y2: "3"
50298
- }), require$$1.jsx("line", {
50299
- x1: "2",
50300
- x2: "6",
50301
- y1: "14",
50302
- y2: "14"
50303
- }), require$$1.jsx("line", {
50304
- x1: "10",
50305
- x2: "14",
50306
- y1: "8",
50307
- y2: "8"
50308
- }), require$$1.jsx("line", {
50309
- x1: "18",
50310
- x2: "22",
50311
- y1: "16",
50312
- y2: "16"
50313
- })]
50314
- }), activeFilterCount != null && activeFilterCount > 0 && require$$1.jsx("span", {
50315
- 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",
50316
- children: activeFilterCount
50317
- })]
50318
- })]
50319
- }));
50320
- });
50321
- MobileToolbar.displayName = 'MobileToolbar';
50322
-
50323
- /**
50324
- * Renders children only on mobile (hidden on md+ screens).
50325
- * Uses CSS-based visibility — both layouts are in the DOM.
50326
- */
50327
- var MobileOnly = /*#__PURE__*/React.forwardRef(function (_a, ref) {
50328
- var children = _a.children,
50329
- className = _a.className,
50330
- props = __rest$1(_a, ["children", "className"]);
50331
- return require$$1.jsx("div", Object.assign({
50332
- ref: ref,
50333
- className: clsx('md:hidden', className)
50334
- }, props, {
50335
- children: children
50336
- }));
50337
- });
50338
- MobileOnly.displayName = 'MobileOnly';
50339
-
50340
- /**
50341
- * Renders children only on desktop (hidden below md breakpoint).
50342
- * Uses CSS-based visibility — both layouts are in the DOM.
50343
- */
50344
- var DesktopOnly = /*#__PURE__*/React.forwardRef(function (_a, ref) {
50345
- var children = _a.children,
50346
- className = _a.className,
50347
- props = __rest$1(_a, ["children", "className"]);
50348
- return require$$1.jsx("div", Object.assign({
50349
- ref: ref,
50350
- className: clsx('hidden md:block', className)
50351
- }, props, {
50352
- children: children
50353
- }));
50354
- });
50355
- DesktopOnly.displayName = 'DesktopOnly';
50356
-
50357
- var breakpointRowClass = {
50358
- sm: 'sm:flex-row',
50359
- md: 'md:flex-row',
50360
- lg: 'lg:flex-row',
50361
- xl: 'xl:flex-row'
50362
- };
50363
- /**
50364
- * Stacks children vertically on mobile, horizontally on desktop.
50365
- * Replaces the common `flex flex-col md:flex-row` pattern.
50366
- */
50367
- var ResponsiveStack = /*#__PURE__*/React.forwardRef(function (_a, ref) {
50368
- var _a$breakpoint = _a.breakpoint,
50369
- breakpoint = _a$breakpoint === void 0 ? 'md' : _a$breakpoint,
50370
- gap = _a.gap,
50371
- _a$reverse = _a.reverse,
50372
- reverse = _a$reverse === void 0 ? false : _a$reverse,
50373
- children = _a.children,
50374
- className = _a.className,
50375
- props = __rest$1(_a, ["breakpoint", "gap", "reverse", "children", "className"]);
50376
- return require$$1.jsx("div", Object.assign({
50377
- ref: ref,
50378
- className: clsx('flex', reverse ? 'flex-col-reverse' : 'flex-col', breakpointRowClass[breakpoint], gap != null && "gap-".concat(gap), className)
50379
- }, props, {
50380
- children: children
50381
- }));
50382
- });
50383
- ResponsiveStack.displayName = 'ResponsiveStack';
50384
-
50385
- /**
50386
- * A collapsible panel for secondary information on mobile.
50387
- * Wraps the design system Accordion for converting sidebar panels
50388
- * (tips, insights, help text) into expandable sections.
50389
- */
50390
- var CollapsibleInfoPanel = /*#__PURE__*/React.forwardRef(function (_a, ref) {
50391
- var title = _a.title,
50392
- icon = _a.icon,
50393
- _a$defaultOpen = _a.defaultOpen,
50394
- defaultOpen = _a$defaultOpen === void 0 ? false : _a$defaultOpen,
50395
- children = _a.children,
50396
- className = _a.className,
50397
- props = __rest$1(_a, ["title", "icon", "defaultOpen", "children", "className"]);
50398
- return require$$1.jsx("div", Object.assign({
50399
- ref: ref,
50400
- className: clsx(className)
50401
- }, props, {
50402
- children: require$$1.jsx(Accordion, {
50403
- type: "single",
50404
- defaultValue: defaultOpen ? 'panel' : undefined,
50405
- children: require$$1.jsxs(AccordionItem, {
50406
- value: "panel",
50407
- children: [require$$1.jsxs(AccordionTrigger, {
50408
- className: clsx('flex items-center gap-2 text-sm font-medium', 'text-mw-neutral-900 dark:text-mw-neutral-100'),
50409
- children: [icon && require$$1.jsx("span", {
50410
- className: "flex-shrink-0",
50411
- children: icon
50412
- }), title]
50413
- }), require$$1.jsx(AccordionContent, {
50414
- children: require$$1.jsx("div", {
50415
- className: "pt-2",
50416
- children: children
50417
- })
50418
- })]
50419
- })
50420
- })
50421
- }));
50422
- });
50423
- CollapsibleInfoPanel.displayName = 'CollapsibleInfoPanel';
50424
-
50425
- /**
50426
- * Renders content that is visually hidden but accessible to screen readers.
50427
- * Use this instead of ad-hoc `sr-only` classes for consistent accessibility.
50428
- */
50429
- var VisuallyHidden = /*#__PURE__*/React.forwardRef(function (_a, ref) {
50430
- var _a$as = _a.as,
50431
- Component = _a$as === void 0 ? 'span' : _a$as,
50432
- children = _a.children,
50433
- style = _a.style,
50434
- props = __rest$1(_a, ["as", "children", "style"]);
50435
- return require$$1.jsx(Component, Object.assign({
50436
- ref: ref,
50437
- style: Object.assign({
50438
- position: 'absolute',
50439
- width: '1px',
50440
- height: '1px',
50441
- padding: 0,
50442
- margin: '-1px',
50443
- overflow: 'hidden',
50444
- clip: 'rect(0, 0, 0, 0)',
50445
- whiteSpace: 'nowrap',
50446
- borderWidth: 0
50447
- }, style)
50448
- }, props, {
50449
- children: children
50450
- }));
50451
- });
50452
- VisuallyHidden.displayName = 'VisuallyHidden';
50453
-
50454
- var FOCUSABLE_SELECTOR = 'button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"]):not([disabled])';
50455
- /**
50456
- * Traps keyboard focus within its children.
50457
- * Use in modals, dialogs, and sheets to prevent focus from escaping.
50458
- */
50459
- var FocusScope = /*#__PURE__*/React.forwardRef(function (_a, _ref) {
50460
- var _a$trapped = _a.trapped,
50461
- trapped = _a$trapped === void 0 ? false : _a$trapped,
50462
- _a$autoFocus = _a.autoFocus,
50463
- autoFocus = _a$autoFocus === void 0 ? false : _a$autoFocus,
50464
- onEscape = _a.onEscape,
50465
- children = _a.children,
50466
- className = _a.className,
50467
- props = __rest$1(_a, ["trapped", "autoFocus", "onEscape", "children", "className"]);
50468
- var containerRef = React.useRef(null);
50469
- var getFocusableElements = React.useCallback(function () {
50470
- if (!containerRef.current) return [];
50471
- return Array.from(containerRef.current.querySelectorAll(FOCUSABLE_SELECTOR));
50472
- }, []);
50473
- React.useEffect(function () {
50474
- if (!autoFocus || !containerRef.current) return;
50475
- var focusable = getFocusableElements();
50476
- if (focusable.length > 0) {
50477
- focusable[0].focus();
50478
- }
50479
- }, [autoFocus, getFocusableElements]);
50480
- React.useEffect(function () {
50481
- if (!trapped || !containerRef.current) return;
50482
- var handleKeyDown = function handleKeyDown(e) {
50483
- if (e.key === 'Escape' && onEscape) {
50484
- onEscape();
50485
- return;
50486
- }
50487
- if (e.key !== 'Tab') return;
50488
- var focusable = getFocusableElements();
50489
- if (focusable.length === 0) return;
50490
- var first = focusable[0];
50491
- var last = focusable[focusable.length - 1];
50492
- if (e.shiftKey) {
50493
- if (document.activeElement === first) {
50494
- e.preventDefault();
50495
- last.focus();
50496
- }
50497
- } else {
50498
- if (document.activeElement === last) {
50499
- e.preventDefault();
50500
- first.focus();
50501
- }
50502
- }
50503
- };
50504
- var container = containerRef.current;
50505
- container.addEventListener('keydown', handleKeyDown);
50506
- return function () {
50507
- return container.removeEventListener('keydown', handleKeyDown);
50508
- };
50509
- }, [trapped, onEscape, getFocusableElements]);
50510
- return require$$1.jsx("div", Object.assign({
50511
- ref: function ref(node) {
50512
- containerRef.current = node;
50513
- if (typeof _ref === 'function') _ref(node);else if (_ref) _ref.current = node;
50514
- },
50515
- className: clsx(className)
50516
- }, props, {
50517
- children: children
50518
- }));
50519
- });
50520
- FocusScope.displayName = 'FocusScope';
50521
-
50522
49825
  function PageHeader(_a) {
50523
49826
  var title = _a.title,
50524
49827
  description = _a.description,
@@ -58402,7 +57705,6 @@ exports.CodeSnippet = CodeSnippet;
58402
57705
  exports.Collapsible = Collapsible;
58403
57706
  exports.CollapsibleCode = CollapsibleCode;
58404
57707
  exports.CollapsibleContent = CollapsibleContent;
58405
- exports.CollapsibleInfoPanel = CollapsibleInfoPanel;
58406
57708
  exports.CollapsibleTrigger = CollapsibleTrigger;
58407
57709
  exports.ColumnCustomizationDrawer = ColumnCustomizationDrawer;
58408
57710
  exports.Command = Command;
@@ -58416,7 +57718,6 @@ exports.DataGrid = DataGrid;
58416
57718
  exports.DatePicker = DatePicker;
58417
57719
  exports.DateRangePicker = DateRangePicker;
58418
57720
  exports.DescriptionList = DescriptionList;
58419
- exports.DesktopOnly = DesktopOnly;
58420
57721
  exports.Dialog = Dialog;
58421
57722
  exports.DialogContent = DialogContent;
58422
57723
  exports.DialogDescription = DialogDescription;
@@ -58445,7 +57746,6 @@ exports.FileUpload = FileUpload;
58445
57746
  exports.Filter = Filter;
58446
57747
  exports.FlexContainer = FlexContainer;
58447
57748
  exports.FloatingElement = FloatingElement;
58448
- exports.FocusScope = FocusScope;
58449
57749
  exports.Footer = Footer;
58450
57750
  exports.Form = Form;
58451
57751
  exports.FormActions = FormActions;
@@ -58487,10 +57787,6 @@ exports.MenuRadioItem = MenuRadioItem;
58487
57787
  exports.MenuSeparator = MenuSeparator;
58488
57788
  exports.MetricCard = MetricCard;
58489
57789
  exports.MinusIcon = MinusIcon;
58490
- exports.MobileDataCard = MobileDataCard;
58491
- exports.MobileOnly = MobileOnly;
58492
- exports.MobilePagination = MobilePagination;
58493
- exports.MobileToolbar = MobileToolbar;
58494
57790
  exports.Modal = Modal;
58495
57791
  exports.ModalBody = ModalBody;
58496
57792
  exports.ModalFooter = ModalFooter;
@@ -58523,7 +57819,6 @@ exports.RadioGroup = RadioGroup;
58523
57819
  exports.RadioGroupItem = RadioGroupItem;
58524
57820
  exports.Rating = Rating;
58525
57821
  exports.ResponsiveContainer = ResponsiveContainer;
58526
- exports.ResponsiveStack = ResponsiveStack;
58527
57822
  exports.RichTextEditor = RichTextEditor;
58528
57823
  exports.ScheduleGrid = ScheduleGrid;
58529
57824
  exports.ScrollArea = ScrollArea;
@@ -58600,7 +57895,6 @@ exports.ToggleGroupItem = ToggleGroupItem;
58600
57895
  exports.Tooltip = Tooltip;
58601
57896
  exports.TreeView = TreeView;
58602
57897
  exports.VideoThumbnail = VideoThumbnail;
58603
- exports.VisuallyHidden = VisuallyHidden;
58604
57898
  exports.borderRadius = borderRadius;
58605
57899
  exports.borderWidth = borderWidth;
58606
57900
  exports.breakpoints = breakpoints;
@@ -58620,8 +57914,6 @@ exports.shadows = shadows;
58620
57914
  exports.spacing = spacing;
58621
57915
  exports.tokens = tokens;
58622
57916
  exports.typography = typography;
58623
- exports.useAdvancedTable = useAdvancedTable;
58624
- exports.useCalendar = useCalendar;
58625
57917
  exports.useDragDrop = useDragDrop;
58626
57918
  exports.useFormContext = useFormContext;
58627
57919
  exports.useIconSearch = useIconSearch;