pixel-react 1.10.11 → 1.10.13

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 (67) hide show
  1. package/lib/StyleGuide/ColorPalette/ColorPalette.stories.d.ts +6 -0
  2. package/lib/StyleGuide/Typography/Typography.stories.d.ts +6 -0
  3. package/lib/components/Accordion/Accordion.stories.d.ts +6 -0
  4. package/lib/components/AddResourceButton/AddButton.stories.d.ts +8 -0
  5. package/lib/components/Button/Button.stories.d.ts +12 -0
  6. package/lib/components/Charts/DonutChart/DonutChart.stories.d.ts +6 -0
  7. package/lib/components/Charts/RadialChart/RadialChart.stories.d.ts +6 -0
  8. package/lib/components/Checkbox/Checkbox.stories.d.ts +8 -0
  9. package/lib/components/Chip/Chip.stories.d.ts +14 -0
  10. package/lib/components/DatePicker/DatePicker.stories.d.ts +9 -0
  11. package/lib/components/DragAndDrop/DragAndDrop.stories.d.ts +6 -0
  12. package/lib/components/Drawer/Drawer.stories.d.ts +7 -0
  13. package/lib/components/ExpandableMenu/ExpandableMenu.stories.d.ts +7 -0
  14. package/lib/components/FileDropzone/FileDropzone.stories.d.ts +8 -0
  15. package/lib/components/Form/Form.stories.d.ts +6 -0
  16. package/lib/components/GridLayout/GridLayout.stories.d.ts +8 -0
  17. package/lib/components/HighlightText/HighlightText.stories.d.ts +6 -0
  18. package/lib/components/Icon/Icon.stories.d.ts +7 -0
  19. package/lib/components/IconButton/IconButton.stories.d.ts +6 -0
  20. package/lib/components/Input/Input.stories.d.ts +9 -0
  21. package/lib/components/InputWithDropdown/InputWithDropdown.stories.d.ts +9 -0
  22. package/lib/components/LazyLoad/LazyLoad.stories.d.ts +6 -0
  23. package/lib/components/MenuOption/MenuOption.stories.d.ts +15 -0
  24. package/lib/components/MiniModal/MiniModal.stories.d.ts +9 -0
  25. package/lib/components/Modal/Modal.stories.d.ts +7 -0
  26. package/lib/components/MultiSelect/MultiSelect.stories.d.ts +9 -0
  27. package/lib/components/RadioButton/RadioButton.stories.d.ts +10 -0
  28. package/lib/components/RadioGroup/RadioGroup.stories.d.ts +8 -0
  29. package/lib/components/Search/Search.stories.d.ts +6 -0
  30. package/lib/components/Select/Select.stories.d.ts +13 -0
  31. package/lib/components/Select/components/Dropdown/Dropdown.d.ts +4 -0
  32. package/lib/components/Select/components/Dropdown/dropdownTypes.d.ts +15 -0
  33. package/lib/components/SequentialConnectingBranch/components/AddBrowserModal/AddBrowserModal.d.ts +4 -0
  34. package/lib/components/SequentialConnectingBranch/components/AddBrowserModal/types.d.ts +3 -0
  35. package/lib/components/SequentialConnectingBranch/components/DatasetListModal/DatasetListModal.d.ts +4 -0
  36. package/lib/components/SequentialConnectingBranch/components/DatasetListModal/types.d.ts +3 -0
  37. package/lib/components/StateDropdown/StateDropdown.stories.d.ts +10 -0
  38. package/lib/components/StatusButton/StatusButton.stories.d.ts +14 -0
  39. package/lib/components/Table/Table.stories.d.ts +11 -0
  40. package/lib/components/TableTree/TableTree.stories.d.ts +7 -0
  41. package/lib/components/Tabs/Tabs.stories.d.ts +9 -0
  42. package/lib/components/TextArea/Textarea.stories.d.ts +9 -0
  43. package/lib/components/ThemeProvider/CustomThemeProvider.d.ts +8 -0
  44. package/lib/components/Toast/Toast.stories.d.ts +6 -0
  45. package/lib/components/Toggle/Toggle.stories.d.ts +12 -0
  46. package/lib/components/Tooltip/Tooltip.stories.d.ts +15 -0
  47. package/lib/components/Typography/Typography.stories.d.ts +10 -0
  48. package/lib/hooks/useCustomThemeProvider.d.ts +11 -0
  49. package/lib/index.esm.js +222 -382
  50. package/lib/index.esm.js.map +1 -1
  51. package/lib/index.js +222 -382
  52. package/lib/index.js.map +1 -1
  53. package/lib/tsconfig.tsbuildinfo +1 -1
  54. package/lib/utils/checkEmpty/checkEmpty.stories.d.ts +6 -0
  55. package/lib/utils/compareArrays/compareArrays.stories.d.ts +6 -0
  56. package/lib/utils/compareObjects/compareObjects.stories.d.ts +6 -0
  57. package/lib/utils/debounce/debounce.stories.d.ts +6 -0
  58. package/lib/utils/ffID/ffID.stories.d.ts +6 -0
  59. package/lib/utils/find/findAndInsert.d.ts +7 -0
  60. package/lib/utils/find/findAndInsert.stories.d.ts +7 -0
  61. package/lib/utils/getExtension/getExtension.stories.d.ts +6 -0
  62. package/lib/utils/throttle/throttle.stories.d.ts +6 -0
  63. package/lib/utils/truncateText/truncateText.stories.d.ts +6 -0
  64. package/package.json +1 -1
  65. package/src/components/Charts/MultiRadialChart/MultiRadialChart.tsx +1 -1
  66. package/src/components/TableTree/Components/TableCell.tsx +1 -1
  67. package/src/components/TableTree/TableTree.scss +11 -0
package/lib/index.js CHANGED
@@ -4049,8 +4049,6 @@ function LiveRegion(_ref) {
4049
4049
  // Hide element visually but keep it readable by screen readers
4050
4050
  const visuallyHidden = {
4051
4051
  position: 'fixed',
4052
- top: 0,
4053
- left: 0,
4054
4052
  width: 1,
4055
4053
  height: 1,
4056
4054
  margin: -1,
@@ -5040,12 +5038,11 @@ var KeyboardCode;
5040
5038
  KeyboardCode["Up"] = "ArrowUp";
5041
5039
  KeyboardCode["Esc"] = "Escape";
5042
5040
  KeyboardCode["Enter"] = "Enter";
5043
- KeyboardCode["Tab"] = "Tab";
5044
5041
  })(KeyboardCode || (KeyboardCode = {}));
5045
5042
  const defaultKeyboardCodes = {
5046
5043
  start: [KeyboardCode.Space, KeyboardCode.Enter],
5047
5044
  cancel: [KeyboardCode.Esc],
5048
- end: [KeyboardCode.Space, KeyboardCode.Enter, KeyboardCode.Tab]
5045
+ end: [KeyboardCode.Space, KeyboardCode.Enter]
5049
5046
  };
5050
5047
  const defaultKeyboardCoordinateGetter = (event, _ref) => {
5051
5048
  let {
@@ -5344,9 +5341,6 @@ class AbstractPointerSensor {
5344
5341
  passive: false
5345
5342
  });
5346
5343
  this.listeners.add(events.end.name, this.handleEnd);
5347
- if (events.cancel) {
5348
- this.listeners.add(events.cancel.name, this.handleCancel);
5349
- }
5350
5344
  this.windowListeners.add(EventName.Resize, this.handleCancel);
5351
5345
  this.windowListeners.add(EventName.DragStart, preventDefault);
5352
5346
  this.windowListeners.add(EventName.VisibilityChange, this.handleCancel);
@@ -5362,11 +5356,9 @@ class AbstractPointerSensor {
5362
5356
  }
5363
5357
  if (isDelayConstraint(activationConstraint)) {
5364
5358
  this.timeoutId = setTimeout(this.handleStart, activationConstraint.delay);
5365
- this.handlePending(activationConstraint);
5366
5359
  return;
5367
5360
  }
5368
5361
  if (isDistanceConstraint(activationConstraint)) {
5369
- this.handlePending(activationConstraint);
5370
5362
  return;
5371
5363
  }
5372
5364
  }
@@ -5383,13 +5375,6 @@ class AbstractPointerSensor {
5383
5375
  this.timeoutId = null;
5384
5376
  }
5385
5377
  }
5386
- handlePending(constraint, offset) {
5387
- const {
5388
- active,
5389
- onPending
5390
- } = this.props;
5391
- onPending(active, constraint, this.initialCoordinates, offset);
5392
- }
5393
5378
  handleStart() {
5394
5379
  const {
5395
5380
  initialCoordinates
@@ -5443,7 +5428,6 @@ class AbstractPointerSensor {
5443
5428
  return this.handleCancel();
5444
5429
  }
5445
5430
  }
5446
- this.handlePending(activationConstraint, delta);
5447
5431
  return;
5448
5432
  }
5449
5433
  if (event.cancelable) {
@@ -5453,24 +5437,16 @@ class AbstractPointerSensor {
5453
5437
  }
5454
5438
  handleEnd() {
5455
5439
  const {
5456
- onAbort,
5457
5440
  onEnd
5458
5441
  } = this.props;
5459
5442
  this.detach();
5460
- if (!this.activated) {
5461
- onAbort(this.props.active);
5462
- }
5463
5443
  onEnd();
5464
5444
  }
5465
5445
  handleCancel() {
5466
5446
  const {
5467
- onAbort,
5468
5447
  onCancel
5469
5448
  } = this.props;
5470
5449
  this.detach();
5471
- if (!this.activated) {
5472
- onAbort(this.props.active);
5473
- }
5474
5450
  onCancel();
5475
5451
  }
5476
5452
  handleKeydown(event) {
@@ -5484,9 +5460,6 @@ class AbstractPointerSensor {
5484
5460
  }
5485
5461
  }
5486
5462
  const events = {
5487
- cancel: {
5488
- name: 'pointercancel'
5489
- },
5490
5463
  move: {
5491
5464
  name: 'pointermove'
5492
5465
  },
@@ -5559,9 +5532,6 @@ MouseSensor.activators = [{
5559
5532
  }
5560
5533
  }];
5561
5534
  const events$2 = {
5562
- cancel: {
5563
- name: 'touchcancel'
5564
- },
5565
5535
  move: {
5566
5536
  name: 'touchmove'
5567
5537
  },
@@ -5763,11 +5733,11 @@ function useScrollIntent(_ref2) {
5763
5733
  }, [disabled, delta, previousDelta]);
5764
5734
  }
5765
5735
  function useCachedNode(draggableNodes, id) {
5766
- const draggableNode = id != null ? draggableNodes.get(id) : undefined;
5736
+ const draggableNode = id !== null ? draggableNodes.get(id) : undefined;
5767
5737
  const node = draggableNode ? draggableNode.node.current : null;
5768
5738
  return useLazyMemo(cachedNode => {
5769
5739
  var _ref;
5770
- if (id == null) {
5740
+ if (id === null) {
5771
5741
  return null;
5772
5742
  } // In some cases, the draggable node can unmount while dragging
5773
5743
  // This is the case for virtualized lists. In those situations,
@@ -5975,26 +5945,7 @@ function useRect(element, measure, fallbackRect) {
5975
5945
  if (measure === void 0) {
5976
5946
  measure = defaultMeasure;
5977
5947
  }
5978
- const [rect, setRect] = React.useState(null);
5979
- function measureRect() {
5980
- setRect(currentRect => {
5981
- if (!element) {
5982
- return null;
5983
- }
5984
- if (element.isConnected === false) {
5985
- var _ref;
5986
-
5987
- // Fall back to last rect we measured if the element is
5988
- // no longer connected to the DOM.
5989
- return (_ref = currentRect != null ? currentRect : fallbackRect) != null ? _ref : null;
5990
- }
5991
- const newRect = measure(element);
5992
- if (JSON.stringify(currentRect) === JSON.stringify(newRect)) {
5993
- return currentRect;
5994
- }
5995
- return newRect;
5996
- });
5997
- }
5948
+ const [rect, measureRect] = React.useReducer(reducer, null);
5998
5949
  const mutationObserver = useMutationObserver({
5999
5950
  callback(records) {
6000
5951
  if (!element) {
@@ -6029,6 +5980,23 @@ function useRect(element, measure, fallbackRect) {
6029
5980
  }
6030
5981
  }, [element]);
6031
5982
  return rect;
5983
+ function reducer(currentRect) {
5984
+ if (!element) {
5985
+ return null;
5986
+ }
5987
+ if (element.isConnected === false) {
5988
+ var _ref;
5989
+
5990
+ // Fall back to last rect we measured if the element is
5991
+ // no longer connected to the DOM.
5992
+ return (_ref = currentRect != null ? currentRect : fallbackRect) != null ? _ref : null;
5993
+ }
5994
+ const newRect = measure(element);
5995
+ if (JSON.stringify(currentRect) === JSON.stringify(newRect)) {
5996
+ return currentRect;
5997
+ }
5998
+ return newRect;
5999
+ }
6032
6000
  }
6033
6001
  function useRectDelta(rect) {
6034
6002
  const initialRect = useInitialValue(rect);
@@ -6174,24 +6142,28 @@ function useRects(elements, measure) {
6174
6142
  }
6175
6143
  const [firstElement] = elements;
6176
6144
  const windowRect = useWindowRect(firstElement ? getWindow(firstElement) : null);
6177
- const [rects, setRects] = React.useState(defaultValue$2);
6178
- function measureRects() {
6179
- setRects(() => {
6180
- if (!elements.length) {
6181
- return defaultValue$2;
6182
- }
6183
- return elements.map(element => isDocumentScrollingElement(element) ? windowRect : new Rect(measure(element), element));
6184
- });
6185
- }
6145
+ const [rects, measureRects] = React.useReducer(reducer, defaultValue$2);
6186
6146
  const resizeObserver = useResizeObserver({
6187
6147
  callback: measureRects
6188
6148
  });
6189
- useIsomorphicLayoutEffect$1(() => {
6190
- resizeObserver == null ? void 0 : resizeObserver.disconnect();
6149
+ if (elements.length > 0 && rects === defaultValue$2) {
6191
6150
  measureRects();
6192
- elements.forEach(element => resizeObserver == null ? void 0 : resizeObserver.observe(element));
6151
+ }
6152
+ useIsomorphicLayoutEffect$1(() => {
6153
+ if (elements.length) {
6154
+ elements.forEach(element => resizeObserver == null ? void 0 : resizeObserver.observe(element));
6155
+ } else {
6156
+ resizeObserver == null ? void 0 : resizeObserver.disconnect();
6157
+ measureRects();
6158
+ }
6193
6159
  }, [elements]);
6194
6160
  return rects;
6161
+ function reducer() {
6162
+ if (!elements.length) {
6163
+ return defaultValue$2;
6164
+ }
6165
+ return elements.map(element => isDocumentScrollingElement(element) ? windowRect : new Rect(measure(element), element));
6166
+ }
6195
6167
  }
6196
6168
  function getMeasurableNode(node) {
6197
6169
  if (!node) {
@@ -6358,7 +6330,7 @@ function reducer$1(state, action) {
6358
6330
  }
6359
6331
  };
6360
6332
  case Action.DragMove:
6361
- if (state.draggable.active == null) {
6333
+ if (!state.draggable.active) {
6362
6334
  return state;
6363
6335
  }
6364
6336
  return {
@@ -6630,7 +6602,7 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6630
6602
  containers: droppableContainers
6631
6603
  }
6632
6604
  } = state;
6633
- const node = activeId != null ? draggableNodes.get(activeId) : null;
6605
+ const node = activeId ? draggableNodes.get(activeId) : null;
6634
6606
  const activeRects = React.useRef({
6635
6607
  initial: null,
6636
6608
  translated: null
@@ -6665,7 +6637,7 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6665
6637
  const autoScrollOptions = getAutoScrollerOptions();
6666
6638
  const initialActiveNodeRect = useInitialRect(activeNode, measuringConfiguration.draggable.measure);
6667
6639
  useLayoutShiftScrollCompensation({
6668
- activeNode: activeId != null ? draggableNodes.get(activeId) : null,
6640
+ activeNode: activeId ? draggableNodes.get(activeId) : null,
6669
6641
  config: autoScrollOptions.layoutShiftCompensation,
6670
6642
  initialRect: initialActiveNodeRect,
6671
6643
  measure: measuringConfiguration.draggable.measure
@@ -6743,7 +6715,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6743
6715
 
6744
6716
  const appliedTranslate = usesDragOverlay ? modifiedTranslate : add(modifiedTranslate, activeNodeScrollDelta);
6745
6717
  const transform = adjustScale(appliedTranslate, (_over$rect = over == null ? void 0 : over.rect) != null ? _over$rect : null, activeNodeRect);
6746
- const activeSensorRef = React.useRef(null);
6747
6718
  const instantiateSensor = React.useCallback((event, _ref2) => {
6748
6719
  let {
6749
6720
  sensor: Sensor,
@@ -6765,43 +6736,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6765
6736
  // Sensors need to be instantiated with refs for arguments that change over time
6766
6737
  // otherwise they are frozen in time with the stale arguments
6767
6738
  context: sensorContext,
6768
- onAbort(id) {
6769
- const draggableNode = draggableNodes.get(id);
6770
- if (!draggableNode) {
6771
- return;
6772
- }
6773
- const {
6774
- onDragAbort
6775
- } = latestProps.current;
6776
- const event = {
6777
- id
6778
- };
6779
- onDragAbort == null ? void 0 : onDragAbort(event);
6780
- dispatchMonitorEvent({
6781
- type: 'onDragAbort',
6782
- event
6783
- });
6784
- },
6785
- onPending(id, constraint, initialCoordinates, offset) {
6786
- const draggableNode = draggableNodes.get(id);
6787
- if (!draggableNode) {
6788
- return;
6789
- }
6790
- const {
6791
- onDragPending
6792
- } = latestProps.current;
6793
- const event = {
6794
- id,
6795
- constraint,
6796
- initialCoordinates,
6797
- offset
6798
- };
6799
- onDragPending == null ? void 0 : onDragPending(event);
6800
- dispatchMonitorEvent({
6801
- type: 'onDragPending',
6802
- event
6803
- });
6804
- },
6805
6739
  onStart(initialCoordinates) {
6806
6740
  const id = activeRef.current;
6807
6741
  if (id == null) {
@@ -6815,7 +6749,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6815
6749
  onDragStart
6816
6750
  } = latestProps.current;
6817
6751
  const event = {
6818
- activatorEvent,
6819
6752
  active: {
6820
6753
  id,
6821
6754
  data: draggableNode.data,
@@ -6834,8 +6767,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6834
6767
  type: 'onDragStart',
6835
6768
  event
6836
6769
  });
6837
- setActiveSensor(activeSensorRef.current);
6838
- setActivatorEvent(activatorEvent);
6839
6770
  });
6840
6771
  },
6841
6772
  onMove(coordinates) {
@@ -6847,7 +6778,10 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6847
6778
  onEnd: createHandler(Action.DragEnd),
6848
6779
  onCancel: createHandler(Action.DragCancel)
6849
6780
  });
6850
- activeSensorRef.current = sensorInstance;
6781
+ ReactDOM.unstable_batchedUpdates(() => {
6782
+ setActiveSensor(sensorInstance);
6783
+ setActivatorEvent(event.nativeEvent);
6784
+ });
6851
6785
  function createHandler(type) {
6852
6786
  return async function handler() {
6853
6787
  const {
@@ -6884,7 +6818,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6884
6818
  setOver(null);
6885
6819
  setActiveSensor(null);
6886
6820
  setActivatorEvent(null);
6887
- activeSensorRef.current = null;
6888
6821
  const eventName = type === Action.DragEnd ? 'onDragEnd' : 'onDragCancel';
6889
6822
  if (event) {
6890
6823
  const handler = latestProps.current[eventName];
@@ -7106,7 +7039,7 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
7106
7039
  });
7107
7040
  const NullContext = /*#__PURE__*/React.createContext(null);
7108
7041
  const defaultRole = 'button';
7109
- const ID_PREFIX$1 = 'Draggable';
7042
+ const ID_PREFIX$1 = 'Droppable';
7110
7043
  function useDraggable(_ref) {
7111
7044
  let {
7112
7045
  id,
@@ -7253,7 +7186,7 @@ function useDroppable(_ref) {
7253
7186
  resizeObserverConnected.current = false;
7254
7187
  resizeObserver.observe(nodeRef.current);
7255
7188
  }, [nodeRef, resizeObserver]);
7256
- React.useEffect(() => {
7189
+ useIsomorphicLayoutEffect$1(() => {
7257
7190
  dispatch({
7258
7191
  type: Action.RegisterDroppable,
7259
7192
  element: {
@@ -7668,7 +7601,6 @@ var DNDCore = /*#__PURE__*/Object.freeze({
7668
7601
  defaultCoordinates: defaultCoordinates,
7669
7602
  defaultDropAnimation: defaultDropAnimationConfiguration,
7670
7603
  defaultDropAnimationSideEffects: defaultDropAnimationSideEffects,
7671
- defaultKeyboardCoordinateGetter: defaultKeyboardCoordinateGetter,
7672
7604
  defaultScreenReaderInstructions: defaultScreenReaderInstructions,
7673
7605
  getClientRect: getClientRect,
7674
7606
  getFirstCollision: getFirstCollision,
@@ -11506,14 +11438,13 @@ var isWeb = typeof window !== 'undefined' &&
11506
11438
  function cloneObject(data) {
11507
11439
  let copy;
11508
11440
  const isArray = Array.isArray(data);
11509
- const isFileListInstance = typeof FileList !== 'undefined' ? data instanceof FileList : false;
11510
11441
  if (data instanceof Date) {
11511
11442
  copy = new Date(data);
11512
11443
  }
11513
11444
  else if (data instanceof Set) {
11514
11445
  copy = new Set(data);
11515
11446
  }
11516
- else if (!(isWeb && (data instanceof Blob || isFileListInstance)) &&
11447
+ else if (!(isWeb && (data instanceof Blob || data instanceof FileList)) &&
11517
11448
  (isArray || isObject$2(data))) {
11518
11449
  copy = isArray ? [] : {};
11519
11450
  if (!isArray && !isPlainObject(data)) {
@@ -11572,7 +11503,7 @@ var set$1 = (object, path, value) => {
11572
11503
  ? []
11573
11504
  : {};
11574
11505
  }
11575
- if (key === '__proto__' || key === 'constructor' || key === 'prototype') {
11506
+ if (key === '__proto__') {
11576
11507
  return;
11577
11508
  }
11578
11509
  object[key] = newValue;
@@ -11791,7 +11722,7 @@ function useFormState(props) {
11791
11722
  _mounted.current = false;
11792
11723
  };
11793
11724
  }, [control]);
11794
- return React.useMemo(() => getProxyFormState(formState, control, _localProxyFormState.current, false), [formState, control]);
11725
+ return getProxyFormState(formState, control, _localProxyFormState.current, false);
11795
11726
  }
11796
11727
 
11797
11728
  var isString = (value) => typeof value === 'string';
@@ -11887,67 +11818,6 @@ function useController(props) {
11887
11818
  value,
11888
11819
  ...(isBoolean(props.disabled) ? { disabled: props.disabled } : {}),
11889
11820
  }));
11890
- const fieldState = React.useMemo(() => Object.defineProperties({}, {
11891
- invalid: {
11892
- enumerable: true,
11893
- get: () => !!get$1(formState.errors, name),
11894
- },
11895
- isDirty: {
11896
- enumerable: true,
11897
- get: () => !!get$1(formState.dirtyFields, name),
11898
- },
11899
- isTouched: {
11900
- enumerable: true,
11901
- get: () => !!get$1(formState.touchedFields, name),
11902
- },
11903
- isValidating: {
11904
- enumerable: true,
11905
- get: () => !!get$1(formState.validatingFields, name),
11906
- },
11907
- error: {
11908
- enumerable: true,
11909
- get: () => get$1(formState.errors, name),
11910
- },
11911
- }), [formState, name]);
11912
- const field = React.useMemo(() => ({
11913
- name,
11914
- value,
11915
- ...(isBoolean(disabled) || formState.disabled
11916
- ? { disabled: formState.disabled || disabled }
11917
- : {}),
11918
- onChange: (event) => _registerProps.current.onChange({
11919
- target: {
11920
- value: getEventValue(event),
11921
- name: name,
11922
- },
11923
- type: EVENTS.CHANGE,
11924
- }),
11925
- onBlur: () => _registerProps.current.onBlur({
11926
- target: {
11927
- value: get$1(control._formValues, name),
11928
- name: name,
11929
- },
11930
- type: EVENTS.BLUR,
11931
- }),
11932
- ref: (elm) => {
11933
- const field = get$1(control._fields, name);
11934
- if (field && elm) {
11935
- field._f.ref = {
11936
- focus: () => elm.focus(),
11937
- select: () => elm.select(),
11938
- setCustomValidity: (message) => elm.setCustomValidity(message),
11939
- reportValidity: () => elm.reportValidity(),
11940
- };
11941
- }
11942
- },
11943
- }), [
11944
- name,
11945
- control._formValues,
11946
- disabled,
11947
- formState.disabled,
11948
- value,
11949
- control._fields,
11950
- ]);
11951
11821
  React.useEffect(() => {
11952
11822
  const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;
11953
11823
  const updateMounted = (name, value) => {
@@ -11973,7 +11843,7 @@ function useController(props) {
11973
11843
  };
11974
11844
  }, [name, control, isArrayField, shouldUnregister]);
11975
11845
  React.useEffect(() => {
11976
- if (isBoolean(disabled) && get$1(control._fields, name)) {
11846
+ if (get$1(control._fields, name)) {
11977
11847
  control._updateDisabledField({
11978
11848
  disabled,
11979
11849
  fields: control._fields,
@@ -11982,11 +11852,63 @@ function useController(props) {
11982
11852
  });
11983
11853
  }
11984
11854
  }, [disabled, name, control]);
11985
- return React.useMemo(() => ({
11986
- field,
11855
+ return {
11856
+ field: {
11857
+ name,
11858
+ value,
11859
+ ...(isBoolean(disabled) || formState.disabled
11860
+ ? { disabled: formState.disabled || disabled }
11861
+ : {}),
11862
+ onChange: React.useCallback((event) => _registerProps.current.onChange({
11863
+ target: {
11864
+ value: getEventValue(event),
11865
+ name: name,
11866
+ },
11867
+ type: EVENTS.CHANGE,
11868
+ }), [name]),
11869
+ onBlur: React.useCallback(() => _registerProps.current.onBlur({
11870
+ target: {
11871
+ value: get$1(control._formValues, name),
11872
+ name: name,
11873
+ },
11874
+ type: EVENTS.BLUR,
11875
+ }), [name, control]),
11876
+ ref: React.useCallback((elm) => {
11877
+ const field = get$1(control._fields, name);
11878
+ if (field && elm) {
11879
+ field._f.ref = {
11880
+ focus: () => elm.focus(),
11881
+ select: () => elm.select(),
11882
+ setCustomValidity: (message) => elm.setCustomValidity(message),
11883
+ reportValidity: () => elm.reportValidity(),
11884
+ };
11885
+ }
11886
+ }, [control._fields, name]),
11887
+ },
11987
11888
  formState,
11988
- fieldState,
11989
- }), [field, formState, fieldState]);
11889
+ fieldState: Object.defineProperties({}, {
11890
+ invalid: {
11891
+ enumerable: true,
11892
+ get: () => !!get$1(formState.errors, name),
11893
+ },
11894
+ isDirty: {
11895
+ enumerable: true,
11896
+ get: () => !!get$1(formState.dirtyFields, name),
11897
+ },
11898
+ isTouched: {
11899
+ enumerable: true,
11900
+ get: () => !!get$1(formState.touchedFields, name),
11901
+ },
11902
+ isValidating: {
11903
+ enumerable: true,
11904
+ get: () => !!get$1(formState.validatingFields, name),
11905
+ },
11906
+ error: {
11907
+ enumerable: true,
11908
+ get: () => get$1(formState.errors, name),
11909
+ },
11910
+ }),
11911
+ };
11990
11912
  }
11991
11913
 
11992
11914
  /**
@@ -12036,7 +11958,7 @@ const Controller = (props) => props.render(useController(props));
12036
11958
  const flatten = (obj) => {
12037
11959
  const output = {};
12038
11960
  for (const key of Object.keys(obj)) {
12039
- if (isObjectType(obj[key]) && obj[key] !== null) {
11961
+ if (isObjectType(obj[key])) {
12040
11962
  const nested = flatten(obj[key]);
12041
11963
  for (const nestedKey of Object.keys(nested)) {
12042
11964
  output[`${key}.${nestedKey}`] = nested[nestedKey];
@@ -12105,7 +12027,7 @@ function Form(props) {
12105
12027
  headers && headers['Content-Type'],
12106
12028
  encType,
12107
12029
  ].some((value) => value && value.includes('json'));
12108
- const response = await fetch(String(action), {
12030
+ const response = await fetch(action, {
12109
12031
  method,
12110
12032
  headers: {
12111
12033
  ...headers,
@@ -12603,7 +12525,7 @@ var updateAt = (fieldValues, index, value) => {
12603
12525
  */
12604
12526
  function useFieldArray(props) {
12605
12527
  const methods = useFormContext();
12606
- const { control = methods.control, name, keyName = 'id', shouldUnregister, rules, } = props;
12528
+ const { control = methods.control, name, keyName = 'id', shouldUnregister, } = props;
12607
12529
  const [fields, setFields] = React.useState(control._getFieldArray(name));
12608
12530
  const ids = React.useRef(control._getFieldArray(name).map(generateId));
12609
12531
  const _fieldIds = React.useRef(fields);
@@ -12612,8 +12534,8 @@ function useFieldArray(props) {
12612
12534
  _name.current = name;
12613
12535
  _fieldIds.current = fields;
12614
12536
  control._names.array.add(name);
12615
- rules &&
12616
- control.register(name, rules);
12537
+ props.rules &&
12538
+ control.register(name, props.rules);
12617
12539
  useSubscribe({
12618
12540
  next: ({ values, name: fieldArrayName, }) => {
12619
12541
  if (fieldArrayName === _name.current || !fieldArrayName) {
@@ -12657,8 +12579,6 @@ function useFieldArray(props) {
12657
12579
  ids.current = removeArrayAt(ids.current, index);
12658
12580
  updateValues(updatedFieldArrayValues);
12659
12581
  setFields(updatedFieldArrayValues);
12660
- !Array.isArray(get$1(control._fields, name)) &&
12661
- set$1(control._fields, name, undefined);
12662
12582
  control._updateFieldArray(name, updatedFieldArrayValues, removeArrayAt, {
12663
12583
  argA: index,
12664
12584
  });
@@ -12973,8 +12893,7 @@ var getRuleValue = (rule) => isUndefined(rule)
12973
12893
  : rule;
12974
12894
 
12975
12895
  const ASYNC_FUNCTION = 'AsyncFunction';
12976
- var hasPromiseValidation = (fieldReference) => !!fieldReference &&
12977
- !!fieldReference.validate &&
12896
+ var hasPromiseValidation = (fieldReference) => (!fieldReference || !fieldReference.validate) &&
12978
12897
  !!((isFunction$1(fieldReference.validate) &&
12979
12898
  fieldReference.validate.constructor.name === ASYNC_FUNCTION) ||
12980
12899
  (isObject$2(fieldReference.validate) &&
@@ -13103,7 +13022,7 @@ function createFormControl(props = {}) {
13103
13022
  timer = setTimeout(callback, wait);
13104
13023
  };
13105
13024
  const _updateValid = async (shouldUpdateValid) => {
13106
- if (!_options.disabled && (_proxyFormState.isValid || shouldUpdateValid)) {
13025
+ if (!props.disabled && (_proxyFormState.isValid || shouldUpdateValid)) {
13107
13026
  const isValid = _options.resolver
13108
13027
  ? isEmptyObject((await _executeSchema()).errors)
13109
13028
  : await executeBuiltInValidation(_fields, true);
@@ -13115,7 +13034,7 @@ function createFormControl(props = {}) {
13115
13034
  }
13116
13035
  };
13117
13036
  const _updateIsValidating = (names, isValidating) => {
13118
- if (!_options.disabled &&
13037
+ if (!props.disabled &&
13119
13038
  (_proxyFormState.isValidating || _proxyFormState.validatingFields)) {
13120
13039
  (names || Array.from(_names.mount)).forEach((name) => {
13121
13040
  if (name) {
@@ -13131,7 +13050,7 @@ function createFormControl(props = {}) {
13131
13050
  }
13132
13051
  };
13133
13052
  const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
13134
- if (args && method && !_options.disabled) {
13053
+ if (args && method && !props.disabled) {
13135
13054
  _state.action = true;
13136
13055
  if (shouldUpdateFieldsAndState && Array.isArray(get$1(_fields, name))) {
13137
13056
  const fieldValues = method(get$1(_fields, name), args.argA, args.argB);
@@ -13195,7 +13114,7 @@ function createFormControl(props = {}) {
13195
13114
  const output = {
13196
13115
  name,
13197
13116
  };
13198
- if (!_options.disabled) {
13117
+ if (!props.disabled) {
13199
13118
  const disabledField = !!(get$1(_fields, name) &&
13200
13119
  get$1(_fields, name)._f &&
13201
13120
  get$1(_fields, name)._f.disabled);
@@ -13236,9 +13155,9 @@ function createFormControl(props = {}) {
13236
13155
  const shouldUpdateValid = _proxyFormState.isValid &&
13237
13156
  isBoolean(isValid) &&
13238
13157
  _formState.isValid !== isValid;
13239
- if (_options.delayError && error) {
13158
+ if (props.delayError && error) {
13240
13159
  delayErrorCallback = debounce(() => updateErrors(name, error));
13241
- delayErrorCallback(_options.delayError);
13160
+ delayErrorCallback(props.delayError);
13242
13161
  }
13243
13162
  else {
13244
13163
  clearTimeout(timer);
@@ -13331,7 +13250,7 @@ function createFormControl(props = {}) {
13331
13250
  }
13332
13251
  _names.unMount = new Set();
13333
13252
  };
13334
- const _getDirty = (name, data) => !_options.disabled &&
13253
+ const _getDirty = (name, data) => !props.disabled &&
13335
13254
  (name && data && set$1(_formValues, name, data),
13336
13255
  !deepEqual(getValues(), _defaultValues));
13337
13256
  const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {
@@ -13343,7 +13262,7 @@ function createFormControl(props = {}) {
13343
13262
  ? { [names]: defaultValue }
13344
13263
  : defaultValue),
13345
13264
  }, isGlobal, defaultValue);
13346
- const _getFieldArray = (name) => compact(get$1(_state.mount ? _formValues : _defaultValues, name, _options.shouldUnregister ? get$1(_defaultValues, name, []) : []));
13265
+ const _getFieldArray = (name) => compact(get$1(_state.mount ? _formValues : _defaultValues, name, props.shouldUnregister ? get$1(_defaultValues, name, []) : []));
13347
13266
  const setFieldValue = (name, value, options = {}) => {
13348
13267
  const field = get$1(_fields, name);
13349
13268
  let fieldValue = value;
@@ -13476,7 +13395,7 @@ function createFormControl(props = {}) {
13476
13395
  });
13477
13396
  if (shouldSkipValidation) {
13478
13397
  if (_proxyFormState.isValid) {
13479
- if (_options.mode === 'onBlur') {
13398
+ if (props.mode === 'onBlur') {
13480
13399
  if (isBlurEvent) {
13481
13400
  _updateValid();
13482
13401
  }
@@ -13641,15 +13560,13 @@ function createFormControl(props = {}) {
13641
13560
  : isUndefined(value)
13642
13561
  ? getFieldValue(field ? field._f : get$1(fields, name)._f)
13643
13562
  : value;
13644
- if (disabled || (!disabled && !isUndefined(inputValue))) {
13645
- set$1(_formValues, name, inputValue);
13646
- }
13563
+ set$1(_formValues, name, inputValue);
13647
13564
  updateTouchAndDirty(name, inputValue, false, false, true);
13648
13565
  }
13649
13566
  };
13650
13567
  const register = (name, options = {}) => {
13651
13568
  let field = get$1(_fields, name);
13652
- const disabledIsDefined = isBoolean(options.disabled) || isBoolean(_options.disabled);
13569
+ const disabledIsDefined = isBoolean(options.disabled) || isBoolean(props.disabled);
13653
13570
  set$1(_fields, name, {
13654
13571
  ...(field || {}),
13655
13572
  _f: {
@@ -13665,7 +13582,7 @@ function createFormControl(props = {}) {
13665
13582
  field,
13666
13583
  disabled: isBoolean(options.disabled)
13667
13584
  ? options.disabled
13668
- : _options.disabled,
13585
+ : props.disabled,
13669
13586
  name,
13670
13587
  value: options.value,
13671
13588
  });
@@ -13675,7 +13592,7 @@ function createFormControl(props = {}) {
13675
13592
  }
13676
13593
  return {
13677
13594
  ...(disabledIsDefined
13678
- ? { disabled: options.disabled || _options.disabled }
13595
+ ? { disabled: options.disabled || props.disabled }
13679
13596
  : {}),
13680
13597
  ...(_options.progressive
13681
13598
  ? {
@@ -13759,12 +13676,6 @@ function createFormControl(props = {}) {
13759
13676
  e.preventDefault && e.preventDefault();
13760
13677
  e.persist && e.persist();
13761
13678
  }
13762
- if (_options.disabled) {
13763
- if (onInvalid) {
13764
- await onInvalid({ ..._formState.errors }, e);
13765
- }
13766
- return;
13767
- }
13768
13679
  let fieldValues = cloneObject(_formValues);
13769
13680
  _subjects.state.next({
13770
13681
  isSubmitting: true,
@@ -13872,7 +13783,7 @@ function createFormControl(props = {}) {
13872
13783
  }
13873
13784
  _fields = {};
13874
13785
  }
13875
- _formValues = _options.shouldUnregister
13786
+ _formValues = props.shouldUnregister
13876
13787
  ? keepStateOptions.keepDefaultValues
13877
13788
  ? cloneObject(_defaultValues)
13878
13789
  : {}
@@ -13896,7 +13807,7 @@ function createFormControl(props = {}) {
13896
13807
  !_proxyFormState.isValid ||
13897
13808
  !!keepStateOptions.keepIsValid ||
13898
13809
  !!keepStateOptions.keepDirtyValues;
13899
- _state.watch = !!_options.shouldUnregister;
13810
+ _state.watch = !!props.shouldUnregister;
13900
13811
  _subjects.state.next({
13901
13812
  submitCount: keepStateOptions.keepSubmitCount
13902
13813
  ? _formState.submitCount
@@ -13943,9 +13854,7 @@ function createFormControl(props = {}) {
13943
13854
  : fieldReference.ref;
13944
13855
  if (fieldRef.focus) {
13945
13856
  fieldRef.focus();
13946
- options.shouldSelect &&
13947
- isFunction$1(fieldRef.select) &&
13948
- fieldRef.select();
13857
+ options.shouldSelect && fieldRef.select();
13949
13858
  }
13950
13859
  }
13951
13860
  };
@@ -14067,8 +13976,8 @@ function createFormControl(props = {}) {
14067
13976
  * ```
14068
13977
  */
14069
13978
  function useForm(props = {}) {
14070
- const _formControl = React.useRef(undefined);
14071
- const _values = React.useRef(undefined);
13979
+ const _formControl = React.useRef();
13980
+ const _values = React.useRef();
14072
13981
  const [formState, updateFormState] = React.useState({
14073
13982
  isDirty: false,
14074
13983
  isValidating: false,
@@ -14146,6 +14055,11 @@ function useForm(props = {}) {
14146
14055
  values: control._getWatch(),
14147
14056
  });
14148
14057
  }, [props.shouldUnregister, control]);
14058
+ React.useEffect(() => {
14059
+ if (_formControl.current) {
14060
+ _formControl.current.watch = _formControl.current.watch.bind({});
14061
+ }
14062
+ }, [formState]);
14149
14063
  _formControl.current.formState = getProxyFormState(formState, control);
14150
14064
  return _formControl.current;
14151
14065
  }
@@ -14587,7 +14501,7 @@ const MiniModal = /*#__PURE__*/React.forwardRef(({
14587
14501
  }), document.body);
14588
14502
  });
14589
14503
 
14590
- var css_248z$R = ":root {\n --table-height: auto;\n}\n\n.tree-table-space-block {\n display: inline-block;\n width: 20px;\n height: 16px;\n text-align: center;\n line-height: 16px;\n vertical-align: top;\n font-size: 19px;\n position: relative;\n box-sizing: border-box;\n border-radius: 50%;\n /* Hover background for all elements of the same level */\n}\n.tree-table-space-block.btn-toggle {\n position: relative;\n cursor: pointer;\n width: 22px;\n height: 18px;\n z-index: 12;\n}\n.tree-table-space-block.btn-toggle::before {\n display: none;\n}\n.tree-table-space-block.last-block::after, .tree-table-space-block.no-folder::after {\n position: absolute;\n content: \"\";\n height: 1px;\n background: var(--tree-connecting-lines-color);\n top: 50%;\n margin-top: -1px;\n}\n.tree-table-space-block.last-block::after {\n width: 12px;\n left: -10px;\n}\n.tree-table-space-block.no-folder {\n width: 8px;\n}\n.tree-table-space-block.no-folder::after {\n width: 22px;\n left: -10px;\n}\n.tree-table-space-block:not(.last-block, .no-lines, .last-node)::before {\n position: absolute;\n content: \"\";\n width: 1px;\n height: 40px;\n background: var(--tree-connecting-lines-color);\n left: 50%;\n top: -4px;\n z-index: 99;\n}\n.tree-table-space-block.last-node::before {\n position: absolute;\n content: \"\";\n width: 1px;\n height: 12px;\n background: var(--tree-connecting-lines-color);\n left: 50%;\n top: -4px;\n z-index: -1;\n}\n.tree-table-space-block.folder.last-node::before {\n height: 13px;\n}\n.tree-table-space-block.tree-table-hovered::before, .tree-table-space-block.tree-table-hovered::after {\n background-color: var(--brand-color);\n}\n\n.tree-title-container .tree-table-space-block {\n width: 16px;\n}\n\n.hidden {\n display: none;\n}\n\n.show {\n display: table-row;\n visibility: visible;\n}\n\n.btn-toggle {\n cursor: pointer;\n}\n.btn-toggle.is-close {\n background: #f1f1f1;\n border: 1px solid transparent;\n box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);\n}\n.btn-toggle::before, .btn-toggle::after {\n display: none;\n}\n\n.tree-table-wrap {\n width: 100%;\n padding-left: 4px;\n overflow: hidden;\n overflow-x: auto;\n}\n\n.table-scrollable {\n height: var(--table-height);\n /* Adjust height as needed */\n overflow-y: auto;\n position: relative;\n}\n\n.ff-table-tree-body {\n overflow: scroll;\n}\n\n.tree-table {\n table-layout: fixed;\n width: 100%;\n border-collapse: collapse;\n overflow: scroll;\n}\n.tree-table .ff-table-tree-head {\n position: sticky;\n top: 0;\n z-index: 2;\n}\n.tree-table .ff-table-tree-row:hover,\n.tree-table .ff-table-tree-row.hover {\n background-color: var(--hover-color);\n}\n.tree-table .ff-table-tree-row:hover .ff-table-tree-td:first-child,\n.tree-table .ff-table-tree-row.hover .ff-table-tree-td:first-child {\n background-color: var(--hover-color);\n}\n.tree-table .ff-table-tree-row:hover .table-tree-row-action,\n.tree-table .ff-table-tree-row.hover .table-tree-row-action {\n display: inline-flex;\n align-items: center;\n}\n.tree-table .ff-table-tree-row:hover .table-tree-row-action svg,\n.tree-table .ff-table-tree-row.hover .table-tree-row-action svg {\n height: 14px;\n width: 14px;\n}\n.tree-table .ff-table-tree-row {\n background-color: var(--base-bg-color);\n}\n.tree-table .ff-table-tree-row .table-tree-row-action {\n display: none;\n}\n.tree-table .ff-table-tree-row .table-row-add-button {\n display: inline-flex;\n z-index: 9999;\n align-items: center;\n}\n.tree-table .ff-table-tree-row::after {\n content: \"\";\n display: block;\n visibility: hidden;\n clear: both;\n}\n.tree-table .ff-table-tree-th,\n.tree-table .ff-table-tree-td {\n text-align: left;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.tree-table .ff-table-tree-th {\n color: var(--table-header-text-color);\n background: var(--border-color);\n font-size: 12px;\n font-weight: 600;\n width: 400px;\n height: 32px;\n box-sizing: border-box;\n}\n.tree-table .ff-table-tree-th:first-child {\n width: 600px !important;\n position: sticky;\n left: 0;\n padding-left: 8px;\n}\n.tree-table .ff-table-tree-td {\n font-size: 12px;\n color: var(--nlp-color);\n height: 18px;\n}\n.tree-table .ff-table-tree-td:first-child {\n overflow: initial;\n position: sticky;\n left: 0;\n background-color: white;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-default-content {\n margin-left: 8px;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-td-content {\n padding-left: 4px;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-td-content .tree-table-td-content-text {\n margin-left: 4px;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-default-content {\n font-weight: 700;\n}\n.tree-table .ff-table-tree-td.folder {\n height: 28px;\n}\n\n.tree-table-td-content {\n display: inline-flex;\n align-items: center;\n font-size: 12px;\n font-family: \"Poppins\", sans-serif;\n}\n.tree-table-td-content.folder {\n font-weight: 600;\n}\n\n.tree-row-expanded span svg,\n.tree-row-collapsed span svg {\n height: 12px;\n width: 12px;\n transition: transform 0.3s ease;\n cursor: pointer;\n}\n.tree-row-expanded span svg path,\n.tree-row-collapsed span svg path {\n fill: var(--brand-color);\n}\n\n.tree-row-collapsed svg {\n transform: rotate(-90deg);\n transition: transform 0.3s ease;\n}\n\n.tree-table-space-container {\n display: inline-flex;\n}\n\n.tree-title-container {\n display: inline-flex;\n align-items: center;\n}";
14504
+ var css_248z$R = ":root {\n --table-height: auto;\n}\n\n.tree-table-space-block {\n display: inline-block;\n width: 20px;\n height: 16px;\n text-align: center;\n line-height: 16px;\n vertical-align: top;\n font-size: 19px;\n position: relative;\n box-sizing: border-box;\n border-radius: 50%;\n /* Hover background for all elements of the same level */\n}\n.tree-table-space-block.btn-toggle {\n position: relative;\n cursor: pointer;\n width: 22px;\n height: 18px;\n z-index: 12;\n}\n.tree-table-space-block.btn-toggle::before {\n display: none;\n}\n.tree-table-space-block.last-block::after, .tree-table-space-block.no-folder::after {\n position: absolute;\n content: \"\";\n height: 1px;\n background: var(--tree-connecting-lines-color);\n top: 50%;\n margin-top: -1px;\n}\n.tree-table-space-block.last-block::after {\n width: 12px;\n left: -10px;\n}\n.tree-table-space-block.no-folder {\n width: 8px;\n}\n.tree-table-space-block.no-folder::after {\n width: 22px;\n left: -10px;\n}\n.tree-table-space-block:not(.last-block, .no-lines, .last-node)::before {\n position: absolute;\n content: \"\";\n width: 1px;\n height: 40px;\n background: var(--tree-connecting-lines-color);\n left: 50%;\n top: -4px;\n z-index: 99;\n}\n.tree-table-space-block.last-node::before {\n position: absolute;\n content: \"\";\n width: 1px;\n height: 12px;\n background: var(--tree-connecting-lines-color);\n left: 50%;\n top: -4px;\n z-index: -1;\n}\n.tree-table-space-block.folder.last-node::before {\n height: 13px;\n}\n.tree-table-space-block.tree-table-hovered::before, .tree-table-space-block.tree-table-hovered::after {\n background-color: var(--brand-color);\n}\n\n.tree-title-container .tree-table-space-block {\n width: 16px;\n}\n\n.hidden {\n display: none;\n}\n\n.show {\n display: table-row;\n visibility: visible;\n}\n\n.btn-toggle {\n cursor: pointer;\n}\n.btn-toggle.is-close {\n background: #f1f1f1;\n border: 1px solid transparent;\n box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);\n}\n.btn-toggle::before, .btn-toggle::after {\n display: none;\n}\n\n.tree-table-wrap {\n width: 100%;\n padding-left: 4px;\n overflow: hidden;\n overflow-x: auto;\n}\n\n.table-scrollable {\n height: var(--table-height);\n /* Adjust height as needed */\n overflow-y: auto;\n position: relative;\n}\n\n.ff-table-tree-body {\n overflow: scroll;\n}\n\n.tree-table {\n table-layout: fixed;\n width: 100%;\n border-collapse: collapse;\n overflow: scroll;\n}\n.tree-table .ff-table-tree-head {\n position: sticky;\n top: 0;\n z-index: 2;\n}\n.tree-table .ff-table-tree-row:hover,\n.tree-table .ff-table-tree-row.hover {\n background-color: var(--hover-color);\n}\n.tree-table .ff-table-tree-row:hover .ff-table-tree-td:first-child,\n.tree-table .ff-table-tree-row.hover .ff-table-tree-td:first-child {\n background-color: var(--hover-color);\n}\n.tree-table .ff-table-tree-row:hover .table-tree-row-action,\n.tree-table .ff-table-tree-row.hover .table-tree-row-action {\n display: inline-flex;\n align-items: center;\n}\n.tree-table .ff-table-tree-row:hover .table-tree-row-action svg,\n.tree-table .ff-table-tree-row.hover .table-tree-row-action svg {\n height: 14px;\n width: 14px;\n}\n.tree-table .ff-table-tree-row {\n background-color: var(--base-bg-color);\n}\n.tree-table .ff-table-tree-row .table-tree-row-action {\n display: none;\n}\n.tree-table .ff-table-tree-row .table-tree-row-action .ff-icon-container {\n height: 14px !important;\n width: 14px !important;\n padding: 2px 4px;\n}\n.tree-table .ff-table-tree-row .table-tree-row-action .ff-add-button-container {\n height: 20px;\n width: 22px;\n}\n.tree-table .ff-table-tree-row .table-row-add-button {\n display: inline-flex;\n z-index: 9999;\n align-items: center;\n}\n.tree-table .ff-table-tree-row::after {\n content: \"\";\n display: block;\n visibility: hidden;\n clear: both;\n}\n.tree-table .ff-table-tree-th,\n.tree-table .ff-table-tree-td {\n text-align: left;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.tree-table .ff-table-tree-th {\n color: var(--table-header-text-color);\n background: var(--border-color);\n font-size: 12px;\n font-weight: 600;\n width: 400px;\n height: 32px;\n box-sizing: border-box;\n}\n.tree-table .ff-table-tree-th:first-child {\n width: 600px !important;\n position: sticky;\n left: 0;\n padding-left: 8px;\n}\n.tree-table .ff-table-tree-td {\n font-size: 12px;\n color: var(--nlp-color);\n height: 18px;\n}\n.tree-table .ff-table-tree-td:first-child {\n overflow: initial;\n position: sticky;\n left: 0;\n background-color: white;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-default-content {\n margin-left: 8px;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-td-content {\n padding-left: 4px;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-td-content .tree-table-td-content-text {\n margin-left: 4px;\n}\n.tree-table .ff-table-tree-td:first-child .tree-table-default-content {\n font-weight: 700;\n}\n.tree-table .ff-table-tree-td.folder {\n height: 28px;\n}\n\n.tree-table-td-content {\n display: inline-flex;\n align-items: center;\n font-size: 12px;\n font-family: \"Poppins\", sans-serif;\n}\n.tree-table-td-content.folder {\n font-weight: 600;\n}\n\n.tree-row-expanded span svg,\n.tree-row-collapsed span svg {\n height: 12px;\n width: 12px;\n transition: transform 0.3s ease;\n cursor: pointer;\n}\n.tree-row-expanded span svg path,\n.tree-row-collapsed span svg path {\n fill: var(--brand-color);\n}\n\n.tree-row-collapsed svg {\n transform: rotate(-90deg);\n transition: transform 0.3s ease;\n}\n\n.tree-table-space-container {\n display: inline-flex;\n}\n\n.tree-title-container {\n display: inline-flex;\n align-items: center;\n}";
14591
14505
  styleInject(css_248z$R);
14592
14506
 
14593
14507
  const TableHead = /*#__PURE__*/React.memo(({
@@ -14696,7 +14610,7 @@ const renderSpaces = (level, parentSiblings = [], isLast, isContainer) => {
14696
14610
  if (checkEmpty(parentSiblings)) {
14697
14611
  isLastNode = false;
14698
14612
  if (!isNaN(level)) {
14699
- siblingsArray = Array(level - 1).fill(true);
14613
+ siblingsArray = Array(level).fill(true);
14700
14614
  }
14701
14615
  }
14702
14616
  return jsxRuntime.jsx("div", {
@@ -18740,53 +18654,6 @@ function setYear(date, year, options) {
18740
18654
  return date_;
18741
18655
  }
18742
18656
 
18743
- const FIVE_WEEKS = 5;
18744
- const FOUR_WEEKS = 4;
18745
- /**
18746
- * Return the number of weeks to display in the broadcast calendar.
18747
- *
18748
- * @since 9.4.0
18749
- */
18750
- function getBroadcastWeeksInMonth(month, dateLib) {
18751
- // Get the first day of the month
18752
- const firstDayOfMonth = dateLib.startOfMonth(month);
18753
- // Get the day of the week for the first day of the month (1-7, where 1 is Monday)
18754
- const firstDayOfWeek = firstDayOfMonth.getDay() > 0 ? firstDayOfMonth.getDay() : 7;
18755
- const broadcastStartDate = dateLib.addDays(month, -firstDayOfWeek + 1);
18756
- const lastDateOfLastWeek = dateLib.addDays(broadcastStartDate, FIVE_WEEKS * 7 - 1);
18757
- const numberOfWeeks = month.getMonth() === lastDateOfLastWeek.getMonth() ? FIVE_WEEKS : FOUR_WEEKS;
18758
- return numberOfWeeks;
18759
- }
18760
-
18761
- /**
18762
- * Return the start date of the week in the broadcast calendar.
18763
- *
18764
- * @since 9.4.0
18765
- */
18766
- function startOfBroadcastWeek(date, dateLib) {
18767
- const firstOfMonth = dateLib.startOfMonth(date);
18768
- const dayOfWeek = firstOfMonth.getDay();
18769
- if (dayOfWeek === 1) {
18770
- return firstOfMonth;
18771
- } else if (dayOfWeek === 0) {
18772
- return dateLib.addDays(firstOfMonth, -1 * 6);
18773
- } else {
18774
- return dateLib.addDays(firstOfMonth, -1 * (dayOfWeek - 1));
18775
- }
18776
- }
18777
-
18778
- /**
18779
- * Return the end date of the week in the broadcast calendar.
18780
- *
18781
- * @since 9.4.0
18782
- */
18783
- function endOfBroadcastWeek(date, dateLib) {
18784
- const startDate = startOfBroadcastWeek(date, dateLib);
18785
- const numberOfWeeks = getBroadcastWeeksInMonth(date, dateLib);
18786
- const endDate = dateLib.addDays(startDate, numberOfWeeks * 7 - 1);
18787
- return endDate;
18788
- }
18789
-
18790
18657
  /**
18791
18658
  * A wrapper class around [date-fns](http://date-fns.org) sharing the same
18792
18659
  * options. Methods of this class can be overridden using the
@@ -18867,15 +18734,6 @@ class DateLib {
18867
18734
  this.differenceInCalendarMonths = (dateLeft, dateRight) => {
18868
18735
  return this.overrides?.differenceInCalendarMonths ? this.overrides.differenceInCalendarMonths(dateLeft, dateRight) : differenceInCalendarMonths(dateLeft, dateRight);
18869
18736
  };
18870
- /**
18871
- * Returns the end of the broadcast week for the given date.
18872
- *
18873
- * @param date The original date.
18874
- * @returns The end of the broadcast week.
18875
- */
18876
- this.endOfBroadcastWeek = date => {
18877
- return this.overrides?.endOfBroadcastWeek ? this.overrides.endOfBroadcastWeek(date, this) : endOfBroadcastWeek(date, this);
18878
- };
18879
18737
  /**
18880
18738
  * Returns the end of the ISO week for the given date.
18881
18739
  *
@@ -19037,15 +18895,6 @@ class DateLib {
19037
18895
  this.setYear = (date, year) => {
19038
18896
  return this.overrides?.setYear ? this.overrides.setYear(date, year) : setYear(date, year);
19039
18897
  };
19040
- /**
19041
- * Returns the start of the broadcast week for the given date.
19042
- *
19043
- * @param date The original date.
19044
- * @returns The start of the broadcast week.
19045
- */
19046
- this.startOfBroadcastWeek = date => {
19047
- return this.overrides?.startOfBroadcastWeek ? this.overrides.startOfBroadcastWeek(date, this) : startOfBroadcastWeek(date, this);
19048
- };
19049
18898
  /**
19050
18899
  * Returns the start of the day for the given date.
19051
18900
  *
@@ -19528,9 +19377,7 @@ function Weekday(props) {
19528
19377
  * @see https://daypicker.dev/guides/custom-components
19529
19378
  */
19530
19379
  function Weekdays(props) {
19531
- return /*#__PURE__*/React.createElement("thead", {
19532
- "aria-hidden": true
19533
- }, /*#__PURE__*/React.createElement("tr", {
19380
+ return /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", {
19534
19381
  ...props
19535
19382
  }));
19536
19383
  }
@@ -19633,8 +19480,7 @@ function getDataAttributes(props) {
19633
19480
  "data-mode": props.mode ?? undefined,
19634
19481
  "data-required": "required" in props ? props.required : undefined,
19635
19482
  "data-multiple-months": props.numberOfMonths && props.numberOfMonths > 1 || undefined,
19636
- "data-week-numbers": props.showWeekNumber || undefined,
19637
- "data-broadcast-calendar": props.broadcastCalendar || undefined
19483
+ "data-week-numbers": props.showWeekNumber || undefined
19638
19484
  };
19639
19485
  Object.entries(props).forEach(([key, val]) => {
19640
19486
  if (key.startsWith("data-")) {
@@ -19700,7 +19546,7 @@ function formatDay(date, options, dateLib) {
19700
19546
  */
19701
19547
  function formatMonthDropdown(/** The month number to format. */
19702
19548
  monthNumber, /** The locale to use for formatting. */
19703
- locale) {
19549
+ locale = enUS$1) {
19704
19550
  return locale.localize?.month(monthNumber);
19705
19551
  }
19706
19552
 
@@ -19790,12 +19636,13 @@ function getMonthOptions(displayMonth, navStart, navEnd, formatters, dateLib) {
19790
19636
  if (!navEnd) return undefined;
19791
19637
  const {
19792
19638
  addMonths,
19793
- startOfMonth
19639
+ startOfMonth,
19640
+ isBefore
19794
19641
  } = dateLib;
19795
19642
  const year = displayMonth.getFullYear();
19796
19643
  const months = [];
19797
19644
  let month = navStart;
19798
- while (months.length < 12) {
19645
+ while (months.length < 12 && isBefore(month, addMonths(navEnd, 1))) {
19799
19646
  months.push(month.getMonth());
19800
19647
  month = addMonths(month, 1);
19801
19648
  }
@@ -19803,7 +19650,7 @@ function getMonthOptions(displayMonth, navStart, navEnd, formatters, dateLib) {
19803
19650
  return a - b;
19804
19651
  });
19805
19652
  const options = sortedMonths.map(value => {
19806
- const label = formatters.formatMonthDropdown(value, dateLib.options.locale ?? enUS$1);
19653
+ const label = formatters.formatMonthDropdown(value, dateLib.options.locale);
19807
19654
  const month = dateLib.Date ? new dateLib.Date(year, value) : new Date(year, value);
19808
19655
  const disabled = navStart && month < startOfMonth(navStart) || navEnd && month > startOfMonth(navEnd) || false;
19809
19656
  return {
@@ -20178,8 +20025,7 @@ function tzName(tz, date) {
20178
20025
  */
20179
20026
  function getWeekdays(/** The date library. */
20180
20027
  dateLib, /** Use ISOWeek instead of locale/ */
20181
- ISOWeek, timeZone, /** @since 9.4.0 */
20182
- broadcastCalendar) {
20028
+ ISOWeek, timeZone) {
20183
20029
  const date = timeZone ? TZDate.tz(timeZone) : dateLib.Date ? new dateLib.Date() : new Date();
20184
20030
  const start = ISOWeek ? dateLib.startOfISOWeek(date) : dateLib.startOfWeek(date);
20185
20031
  const days = [];
@@ -20191,18 +20037,20 @@ broadcastCalendar) {
20191
20037
  }
20192
20038
 
20193
20039
  /** Return the years to show in the dropdown. */
20194
- function getYearOptions(navStart, navEnd, formatters, dateLib) {
20195
- if (!navStart) return undefined;
20196
- if (!navEnd) return undefined;
20040
+ function getYearOptions(displayMonth, calendarStart, calendarEnd, formatters, dateLib) {
20041
+ if (!calendarStart) return undefined;
20042
+ if (!calendarEnd) return undefined;
20197
20043
  const {
20044
+ startOfMonth,
20198
20045
  startOfYear,
20199
20046
  endOfYear,
20200
20047
  addYears,
20201
20048
  isBefore,
20202
20049
  isSameYear
20203
20050
  } = dateLib;
20204
- const firstNavYear = startOfYear(navStart);
20205
- const lastNavYear = endOfYear(navEnd);
20051
+ const month = displayMonth.getMonth();
20052
+ const firstNavYear = startOfYear(calendarStart);
20053
+ const lastNavYear = endOfYear(calendarEnd);
20206
20054
  const years = [];
20207
20055
  let year = firstNavYear;
20208
20056
  while (isBefore(year, lastNavYear) || isSameYear(year, lastNavYear)) {
@@ -20210,11 +20058,13 @@ function getYearOptions(navStart, navEnd, formatters, dateLib) {
20210
20058
  year = addYears(year, 1);
20211
20059
  }
20212
20060
  return years.map(value => {
20061
+ const year = dateLib.Date ? new dateLib.Date(value, month) : new Date(value, month);
20062
+ const disabled = calendarStart && year < startOfMonth(calendarStart) || month && calendarEnd && year > startOfMonth(calendarEnd) || false;
20213
20063
  const label = formatters.formatYearDropdown(value);
20214
20064
  return {
20215
20065
  value,
20216
20066
  label,
20217
- disabled: false
20067
+ disabled
20218
20068
  };
20219
20069
  });
20220
20070
  }
@@ -20378,30 +20228,29 @@ var defaultLabels = /*#__PURE__*/Object.freeze({
20378
20228
  labelYearDropdown: labelYearDropdown
20379
20229
  });
20380
20230
 
20231
+ /** The number of days in a month when having 6 weeks. */
20232
+ const NrOfDaysWithFixedWeeks = 42;
20381
20233
  /** Return all the dates to display in the calendar. */
20382
20234
  function getDates(displayMonths, maxDate, props, dateLib) {
20383
20235
  const firstMonth = displayMonths[0];
20384
20236
  const lastMonth = displayMonths[displayMonths.length - 1];
20385
20237
  const {
20386
20238
  ISOWeek,
20387
- fixedWeeks,
20388
- broadcastCalendar
20239
+ fixedWeeks
20389
20240
  } = props ?? {};
20390
20241
  const {
20242
+ startOfWeek,
20243
+ endOfWeek,
20244
+ startOfISOWeek,
20245
+ endOfISOWeek,
20391
20246
  addDays,
20392
20247
  differenceInCalendarDays,
20393
20248
  differenceInCalendarMonths,
20394
- endOfBroadcastWeek,
20395
- endOfISOWeek,
20396
- endOfMonth,
20397
- endOfWeek,
20398
20249
  isAfter,
20399
- startOfBroadcastWeek,
20400
- startOfISOWeek,
20401
- startOfWeek
20250
+ endOfMonth
20402
20251
  } = dateLib;
20403
- const startWeekFirstDate = broadcastCalendar ? startOfBroadcastWeek(firstMonth, dateLib) : ISOWeek ? startOfISOWeek(firstMonth) : startOfWeek(firstMonth);
20404
- const endWeekLastDate = broadcastCalendar ? endOfBroadcastWeek(lastMonth, dateLib) : ISOWeek ? endOfISOWeek(endOfMonth(lastMonth)) : endOfWeek(endOfMonth(lastMonth));
20252
+ const startWeekFirstDate = ISOWeek ? startOfISOWeek(firstMonth) : startOfWeek(firstMonth);
20253
+ const endWeekLastDate = ISOWeek ? endOfISOWeek(endOfMonth(lastMonth)) : endOfWeek(endOfMonth(lastMonth));
20405
20254
  const nOfDays = differenceInCalendarDays(endWeekLastDate, startWeekFirstDate);
20406
20255
  const nOfMonths = differenceInCalendarMonths(lastMonth, firstMonth) + 1;
20407
20256
  const dates = [];
@@ -20413,11 +20262,9 @@ function getDates(displayMonths, maxDate, props, dateLib) {
20413
20262
  dates.push(date);
20414
20263
  }
20415
20264
  // If fixed weeks is enabled, add the extra dates to the array
20416
- const nrOfDaysWithFixedWeeks = broadcastCalendar ? 35 : 42;
20417
- const extraDates = nrOfDaysWithFixedWeeks * nOfMonths;
20265
+ const extraDates = NrOfDaysWithFixedWeeks * nOfMonths;
20418
20266
  if (fixedWeeks && dates.length < extraDates) {
20419
- const daysToAdd = extraDates - dates.length;
20420
- for (let i = 0; i < daysToAdd; i++) {
20267
+ for (let i = 0; i < 7; i++) {
20421
20268
  const date = addDays(dates[dates.length - 1], 1);
20422
20269
  dates.push(date);
20423
20270
  }
@@ -20528,29 +20375,25 @@ displayMonths, /** The dates to display in the calendar. */
20528
20375
  dates, /** Options from the props context. */
20529
20376
  props, dateLib) {
20530
20377
  const {
20531
- addDays,
20532
- endOfBroadcastWeek,
20378
+ startOfWeek,
20379
+ endOfWeek,
20380
+ startOfISOWeek,
20533
20381
  endOfISOWeek,
20534
20382
  endOfMonth,
20535
- endOfWeek,
20536
- getISOWeek,
20383
+ addDays,
20537
20384
  getWeek,
20538
- startOfBroadcastWeek,
20539
- startOfISOWeek,
20540
- startOfWeek
20385
+ getISOWeek
20541
20386
  } = dateLib;
20542
20387
  const dayPickerMonths = displayMonths.reduce((months, month) => {
20543
- const firstDateOfFirstWeek = props.broadcastCalendar ? startOfBroadcastWeek(month, dateLib) : props.ISOWeek ? startOfISOWeek(month) : startOfWeek(month);
20544
- const lastDateOfLastWeek = props.broadcastCalendar ? endOfBroadcastWeek(month, dateLib) : props.ISOWeek ? endOfISOWeek(endOfMonth(month)) : endOfWeek(endOfMonth(month));
20388
+ const firstDateOfFirstWeek = props.ISOWeek ? startOfISOWeek(month) : startOfWeek(month);
20389
+ const lastDateOfLastWeek = props.ISOWeek ? endOfISOWeek(endOfMonth(month)) : endOfWeek(endOfMonth(month));
20545
20390
  /** The dates to display in the month. */
20546
20391
  const monthDates = dates.filter(date => {
20547
20392
  return date >= firstDateOfFirstWeek && date <= lastDateOfLastWeek;
20548
20393
  });
20549
- const nrOfDaysWithFixedWeeks = props.broadcastCalendar ? 35 : 42;
20550
- if (props.fixedWeeks && monthDates.length < nrOfDaysWithFixedWeeks) {
20394
+ if (props.fixedWeeks && monthDates.length < 42) {
20551
20395
  const extraDates = dates.filter(date => {
20552
- const daysToAdd = nrOfDaysWithFixedWeeks - monthDates.length;
20553
- return date > lastDateOfLastWeek && date <= addDays(lastDateOfLastWeek, daysToAdd);
20396
+ return date > lastDateOfLastWeek && date <= addDays(lastDateOfLastWeek, 7);
20554
20397
  });
20555
20398
  monthDates.push(...extraDates);
20556
20399
  }
@@ -20988,30 +20831,27 @@ function dateMatchModifiers(date, matchers, dateLib = defaultDateLib) {
20988
20831
  /** Return the next date that should be focused. */
20989
20832
  function getFocusableDate(moveBy, moveDir, refDate, navStart, navEnd, props, dateLib) {
20990
20833
  const {
20991
- ISOWeek,
20992
- broadcastCalendar
20834
+ ISOWeek
20993
20835
  } = props;
20994
20836
  const {
20995
20837
  addDays,
20996
20838
  addMonths,
20997
- addWeeks,
20998
20839
  addYears,
20999
- endOfBroadcastWeek,
20840
+ addWeeks,
20841
+ startOfISOWeek,
21000
20842
  endOfISOWeek,
20843
+ startOfWeek,
21001
20844
  endOfWeek,
21002
20845
  max,
21003
- min,
21004
- startOfBroadcastWeek,
21005
- startOfISOWeek,
21006
- startOfWeek
20846
+ min
21007
20847
  } = dateLib;
21008
20848
  const moveFns = {
21009
20849
  day: addDays,
21010
20850
  week: addWeeks,
21011
20851
  month: addMonths,
21012
20852
  year: addYears,
21013
- startOfWeek: date => broadcastCalendar ? startOfBroadcastWeek(date, dateLib) : ISOWeek ? startOfISOWeek(date) : startOfWeek(date),
21014
- endOfWeek: date => broadcastCalendar ? endOfBroadcastWeek(date, dateLib) : ISOWeek ? endOfISOWeek(date) : endOfWeek(date)
20853
+ startOfWeek: date => ISOWeek ? startOfISOWeek(date) : startOfWeek(date),
20854
+ endOfWeek: date => ISOWeek ? endOfISOWeek(date) : endOfWeek(date)
21015
20855
  };
21016
20856
  let focusableDate = moveFns[moveBy](refDate, moveDir === "after" ? 1 : -1);
21017
20857
  if (moveDir === "before" && navStart) {
@@ -21077,8 +20917,6 @@ function useFocus(props, calendar, getModifiers, isSelected, dateLib) {
21077
20917
  /**
21078
20918
  * Return a function to get the modifiers for a given day.
21079
20919
  *
21080
- * NOTE: this is not an hook, but a factory for `getModifiers`.
21081
- *
21082
20920
  * @private
21083
20921
  */
21084
20922
  function useGetModifiers(days, props, dateLib) {
@@ -21087,19 +20925,12 @@ function useGetModifiers(days, props, dateLib) {
21087
20925
  hidden,
21088
20926
  modifiers,
21089
20927
  showOutsideDays,
21090
- broadcastCalendar,
21091
20928
  today
21092
20929
  } = props;
21093
20930
  const {
21094
20931
  isSameDay,
21095
- isSameMonth,
21096
- startOfMonth,
21097
- isBefore,
21098
- endOfMonth,
21099
- isAfter
20932
+ isSameMonth
21100
20933
  } = dateLib;
21101
- const startMonth = props.startMonth && startOfMonth(props.startMonth);
21102
- const endMonth = props.endMonth && endOfMonth(props.endMonth);
21103
20934
  const internalModifiersMap = {
21104
20935
  [DayFlag.focused]: [],
21105
20936
  [DayFlag.outside]: [],
@@ -21108,18 +20939,20 @@ function useGetModifiers(days, props, dateLib) {
21108
20939
  [DayFlag.today]: []
21109
20940
  };
21110
20941
  const customModifiersMap = {};
20942
+ const selectionModifiersMap = {
20943
+ [SelectionState.range_end]: [],
20944
+ [SelectionState.range_middle]: [],
20945
+ [SelectionState.range_start]: [],
20946
+ [SelectionState.selected]: []
20947
+ };
21111
20948
  for (const day of days) {
21112
20949
  const {
21113
20950
  date,
21114
20951
  displayMonth
21115
20952
  } = day;
21116
20953
  const isOutside = Boolean(displayMonth && !isSameMonth(date, displayMonth));
21117
- const isBeforeStartMonth = Boolean(startMonth && isBefore(date, startMonth));
21118
- const isAfterEndMonth = Boolean(endMonth && isAfter(date, endMonth));
21119
20954
  const isDisabled = Boolean(disabled && dateMatchModifiers(date, disabled, dateLib));
21120
- const isHidden = Boolean(hidden && dateMatchModifiers(date, hidden, dateLib)) || isBeforeStartMonth || isAfterEndMonth ||
21121
- // Broadcast calendar will show outside days as default
21122
- !broadcastCalendar && !showOutsideDays && isOutside || broadcastCalendar && showOutsideDays === false && isOutside;
20955
+ const isHidden = Boolean(hidden && dateMatchModifiers(date, hidden, dateLib)) || !showOutsideDays && isOutside;
21123
20956
  const isToday = isSameDay(date, today ?? (props.timeZone ? TZDate.tz(props.timeZone) : dateLib.Date ? new dateLib.Date() : new Date()));
21124
20957
  if (isOutside) internalModifiersMap.outside.push(day);
21125
20958
  if (isDisabled) internalModifiersMap.disabled.push(day);
@@ -21148,16 +20981,27 @@ function useGetModifiers(days, props, dateLib) {
21148
20981
  [DayFlag.outside]: false,
21149
20982
  [DayFlag.today]: false
21150
20983
  };
20984
+ const selectionStates = {
20985
+ [SelectionState.range_end]: false,
20986
+ [SelectionState.range_middle]: false,
20987
+ [SelectionState.range_start]: false,
20988
+ [SelectionState.selected]: false
20989
+ };
21151
20990
  const customModifiers = {};
21152
20991
  // Find the modifiers for the given day
21153
20992
  for (const name in internalModifiersMap) {
21154
20993
  const days = internalModifiersMap[name];
21155
20994
  dayFlags[name] = days.some(d => d === day);
21156
20995
  }
20996
+ for (const name in selectionModifiersMap) {
20997
+ const days = selectionModifiersMap[name];
20998
+ selectionStates[name] = days.some(d => d === day);
20999
+ }
21157
21000
  for (const name in customModifiersMap) {
21158
21001
  customModifiers[name] = customModifiersMap[name].some(d => d === day);
21159
21002
  }
21160
21003
  return {
21004
+ ...selectionStates,
21161
21005
  ...dayFlags,
21162
21006
  // custom modifiers should override all the previous ones
21163
21007
  ...customModifiers
@@ -21562,7 +21406,7 @@ function DayPicker(props) {
21562
21406
  };
21563
21407
  const dateLib = new DateLib({
21564
21408
  locale,
21565
- weekStartsOn: props.broadcastCalendar ? 1 : props.weekStartsOn,
21409
+ weekStartsOn: props.weekStartsOn,
21566
21410
  firstWeekContainsDate: props.firstWeekContainsDate,
21567
21411
  useAdditionalWeekYearTokens: props.useAdditionalWeekYearTokens,
21568
21412
  useAdditionalDayOfYearTokens: props.useAdditionalDayOfYearTokens
@@ -21581,7 +21425,7 @@ function DayPicker(props) {
21581
21425
  ...props.classNames
21582
21426
  }
21583
21427
  };
21584
- }, [props.classNames, props.components, props.dateLib, props.firstWeekContainsDate, props.formatters, props.labels, props.locale, props.useAdditionalDayOfYearTokens, props.useAdditionalWeekYearTokens, props.weekStartsOn, props.broadcastCalendar]);
21428
+ }, [props.classNames, props.components, props.dateLib, props.firstWeekContainsDate, props.formatters, props.labels, props.locale, props.useAdditionalDayOfYearTokens, props.useAdditionalWeekYearTokens, props.weekStartsOn]);
21585
21429
  const {
21586
21430
  captionLayout,
21587
21431
  mode,
@@ -21691,16 +21535,6 @@ function DayPicker(props) {
21691
21535
  const handleDayMouseLeave = React.useCallback((day, modifiers) => e => {
21692
21536
  onDayMouseLeave?.(day.date, modifiers, e);
21693
21537
  }, [onDayMouseLeave]);
21694
- const handleMonthChange = React.useCallback(date => e => {
21695
- const selectedMonth = Number(e.target.value);
21696
- const month = dateLib.setMonth(dateLib.startOfMonth(date), selectedMonth);
21697
- goToMonth(month);
21698
- }, [dateLib, goToMonth]);
21699
- const handleYearChange = React.useCallback(date => e => {
21700
- const selectedYear = Number(e.target.value);
21701
- const month = dateLib.setYear(dateLib.startOfMonth(date), selectedYear);
21702
- goToMonth(month);
21703
- }, [dateLib, goToMonth]);
21704
21538
  const {
21705
21539
  className,
21706
21540
  style
@@ -21738,8 +21572,6 @@ function DayPicker(props) {
21738
21572
  lang: props.lang,
21739
21573
  nonce: props.nonce,
21740
21574
  title: props.title,
21741
- role: props.role,
21742
- "aria-label": props["aria-label"],
21743
21575
  ...dataAttributes
21744
21576
  }, /*#__PURE__*/React.createElement(components.Months, {
21745
21577
  className: classNames[UI.Months],
@@ -21753,8 +21585,17 @@ function DayPicker(props) {
21753
21585
  previousMonth: previousMonth,
21754
21586
  nextMonth: nextMonth
21755
21587
  })), months.map((calendarMonth, displayIndex) => {
21588
+ const handleMonthChange = e => {
21589
+ const selectedMonth = Number(e.target.value);
21590
+ const month = dateLib.setMonth(dateLib.startOfMonth(calendarMonth.date), selectedMonth);
21591
+ goToMonth(month);
21592
+ };
21593
+ const handleYearChange = e => {
21594
+ const month = dateLib.setYear(dateLib.startOfMonth(calendarMonth.date), Number(e.target.value));
21595
+ goToMonth(month);
21596
+ };
21756
21597
  const dropdownMonths = getMonthOptions(calendarMonth.date, navStart, navEnd, formatters, dateLib);
21757
- const dropdownYears = getYearOptions(navStart, navEnd, formatters, dateLib);
21598
+ const dropdownYears = getYearOptions(months[0].date, navStart, navEnd, formatters, dateLib);
21758
21599
  return /*#__PURE__*/React.createElement(components.Month, {
21759
21600
  className: classNames[UI.Month],
21760
21601
  style: styles?.[UI.Month],
@@ -21775,7 +21616,7 @@ function DayPicker(props) {
21775
21616
  classNames: classNames,
21776
21617
  components: components,
21777
21618
  disabled: Boolean(props.disableNavigation),
21778
- onChange: handleMonthChange(calendarMonth.date),
21619
+ onChange: handleMonthChange,
21779
21620
  options: dropdownMonths,
21780
21621
  style: styles?.[UI.Dropdown],
21781
21622
  value: calendarMonth.date.getMonth()
@@ -21788,7 +21629,7 @@ function DayPicker(props) {
21788
21629
  classNames: classNames,
21789
21630
  components: components,
21790
21631
  disabled: Boolean(props.disableNavigation),
21791
- onChange: handleYearChange(calendarMonth.date),
21632
+ onChange: handleYearChange,
21792
21633
  options: dropdownYears,
21793
21634
  style: styles?.[UI.Dropdown],
21794
21635
  value: calendarMonth.date.getFullYear()
@@ -21835,8 +21676,7 @@ function DayPicker(props) {
21835
21676
  locale
21836
21677
  }),
21837
21678
  className: classNames[UI.WeekNumber],
21838
- scope: "row",
21839
- role: "rowheader"
21679
+ scope: "row"
21840
21680
  }, formatWeekNumber(week.weekNumber))), week.days.map(day => {
21841
21681
  const {
21842
21682
  date
@@ -21856,14 +21696,14 @@ function DayPicker(props) {
21856
21696
  }
21857
21697
  const style = getStyleForModifiers(modifiers, styles, props.modifiersStyles);
21858
21698
  const className = getClassNamesForModifiers(modifiers, classNames, props.modifiersClassNames);
21859
- const ariaLabel = !isInteractive && !modifiers.hidden ? labelGridcell(date, modifiers, dateLib.options, dateLib) : undefined;
21699
+ const ariaLabel = !isInteractive ? labelGridcell(date, modifiers, dateLib.options, dateLib) : undefined;
21860
21700
  return /*#__PURE__*/React.createElement(components.Day, {
21861
21701
  key: `${dateLib.format(date, "yyyy-MM-dd")}_${dateLib.format(day.displayMonth, "yyyy-MM")}`,
21862
21702
  day: day,
21863
21703
  modifiers: modifiers,
21864
21704
  className: className.join(" "),
21865
21705
  style: style,
21866
- role: "gridcell",
21706
+ "aria-hidden": modifiers.hidden || undefined,
21867
21707
  "aria-selected": modifiers.selected || undefined,
21868
21708
  "aria-label": ariaLabel,
21869
21709
  "data-day": dateLib.format(date, "yyyy-MM-dd"),
@@ -21874,7 +21714,7 @@ function DayPicker(props) {
21874
21714
  "data-outside": day.outside || undefined,
21875
21715
  "data-focused": modifiers.focused || undefined,
21876
21716
  "data-today": modifiers.today || undefined
21877
- }, !modifiers.hidden && isInteractive ? (/*#__PURE__*/React.createElement(components.DayButton, {
21717
+ }, isInteractive ? (/*#__PURE__*/React.createElement(components.DayButton, {
21878
21718
  className: classNames[UI.DayButton],
21879
21719
  style: styles?.[UI.DayButton],
21880
21720
  type: "button",
@@ -21889,7 +21729,7 @@ function DayPicker(props) {
21889
21729
  onKeyDown: handleDayKeyDown(day, modifiers),
21890
21730
  onMouseEnter: handleDayMouseEnter(day, modifiers),
21891
21731
  onMouseLeave: handleDayMouseLeave(day, modifiers)
21892
- }, formatDay(date, dateLib.options, dateLib))) : !modifiers.hidden && formatDay(day.date, dateLib.options, dateLib));
21732
+ }, formatDay(date, dateLib.options, dateLib))) : formatDay(day.date, dateLib.options, dateLib));
21893
21733
  }));
21894
21734
  }))));
21895
21735
  })), props.footer && (/*#__PURE__*/React.createElement(components.Footer, {
@@ -44811,7 +44651,7 @@ const MultiRadialChart = ({
44811
44651
  }), isLegendDetails && renderLegend(barValues.map(value => ({
44812
44652
  ...value,
44813
44653
  label: value?.barLabel,
44814
- key: value.value.toString()
44654
+ key: value.value?.toString()
44815
44655
  })), legendType)]
44816
44656
  });
44817
44657
  };