pixel-react 1.10.3 → 1.10.4

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 (68) 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/InputWithDropdown/types.d.ts +3 -0
  23. package/lib/components/LazyLoad/LazyLoad.stories.d.ts +6 -0
  24. package/lib/components/MenuOption/MenuOption.stories.d.ts +15 -0
  25. package/lib/components/MiniModal/MiniModal.stories.d.ts +9 -0
  26. package/lib/components/Modal/Modal.stories.d.ts +7 -0
  27. package/lib/components/MultiSelect/MultiSelect.stories.d.ts +9 -0
  28. package/lib/components/RadioButton/RadioButton.stories.d.ts +10 -0
  29. package/lib/components/RadioGroup/RadioGroup.stories.d.ts +8 -0
  30. package/lib/components/Search/Search.stories.d.ts +6 -0
  31. package/lib/components/Select/Select.stories.d.ts +13 -0
  32. package/lib/components/Select/components/Dropdown/Dropdown.d.ts +4 -0
  33. package/lib/components/Select/components/Dropdown/dropdownTypes.d.ts +15 -0
  34. package/lib/components/SequentialConnectingBranch/components/AddBrowserModal/AddBrowserModal.d.ts +4 -0
  35. package/lib/components/SequentialConnectingBranch/components/AddBrowserModal/types.d.ts +3 -0
  36. package/lib/components/SequentialConnectingBranch/components/DatasetListModal/DatasetListModal.d.ts +4 -0
  37. package/lib/components/SequentialConnectingBranch/components/DatasetListModal/types.d.ts +3 -0
  38. package/lib/components/StateDropdown/StateDropdown.stories.d.ts +10 -0
  39. package/lib/components/StatusButton/StatusButton.stories.d.ts +14 -0
  40. package/lib/components/Table/Table.stories.d.ts +11 -0
  41. package/lib/components/TableTree/TableTree.stories.d.ts +7 -0
  42. package/lib/components/Tabs/Tabs.stories.d.ts +9 -0
  43. package/lib/components/TextArea/Textarea.stories.d.ts +9 -0
  44. package/lib/components/ThemeProvider/CustomThemeProvider.d.ts +8 -0
  45. package/lib/components/Toast/Toast.stories.d.ts +6 -0
  46. package/lib/components/Toggle/Toggle.stories.d.ts +12 -0
  47. package/lib/components/Tooltip/Tooltip.stories.d.ts +15 -0
  48. package/lib/components/Typography/Typography.stories.d.ts +10 -0
  49. package/lib/hooks/useCustomThemeProvider.d.ts +11 -0
  50. package/lib/index.d.ts +3 -0
  51. package/lib/index.esm.js +225 -379
  52. package/lib/index.esm.js.map +1 -1
  53. package/lib/index.js +225 -379
  54. package/lib/index.js.map +1 -1
  55. package/lib/tsconfig.tsbuildinfo +1 -1
  56. package/lib/utils/checkEmpty/checkEmpty.stories.d.ts +6 -0
  57. package/lib/utils/compareArrays/compareArrays.stories.d.ts +6 -0
  58. package/lib/utils/compareObjects/compareObjects.stories.d.ts +6 -0
  59. package/lib/utils/debounce/debounce.stories.d.ts +6 -0
  60. package/lib/utils/ffID/ffID.stories.d.ts +6 -0
  61. package/lib/utils/find/findAndInsert.d.ts +7 -0
  62. package/lib/utils/find/findAndInsert.stories.d.ts +7 -0
  63. package/lib/utils/getExtension/getExtension.stories.d.ts +6 -0
  64. package/lib/utils/throttle/throttle.stories.d.ts +6 -0
  65. package/lib/utils/truncateText/truncateText.stories.d.ts +6 -0
  66. package/package.json +1 -1
  67. package/src/components/InputWithDropdown/InputWithDropdown.tsx +6 -0
  68. package/src/components/InputWithDropdown/types.ts +7 -1
package/lib/index.js CHANGED
@@ -3950,8 +3950,6 @@ function LiveRegion(_ref) {
3950
3950
  // Hide element visually but keep it readable by screen readers
3951
3951
  const visuallyHidden = {
3952
3952
  position: 'fixed',
3953
- top: 0,
3954
- left: 0,
3955
3953
  width: 1,
3956
3954
  height: 1,
3957
3955
  margin: -1,
@@ -4941,12 +4939,11 @@ var KeyboardCode;
4941
4939
  KeyboardCode["Up"] = "ArrowUp";
4942
4940
  KeyboardCode["Esc"] = "Escape";
4943
4941
  KeyboardCode["Enter"] = "Enter";
4944
- KeyboardCode["Tab"] = "Tab";
4945
4942
  })(KeyboardCode || (KeyboardCode = {}));
4946
4943
  const defaultKeyboardCodes = {
4947
4944
  start: [KeyboardCode.Space, KeyboardCode.Enter],
4948
4945
  cancel: [KeyboardCode.Esc],
4949
- end: [KeyboardCode.Space, KeyboardCode.Enter, KeyboardCode.Tab]
4946
+ end: [KeyboardCode.Space, KeyboardCode.Enter]
4950
4947
  };
4951
4948
  const defaultKeyboardCoordinateGetter = (event, _ref) => {
4952
4949
  let {
@@ -5245,9 +5242,6 @@ class AbstractPointerSensor {
5245
5242
  passive: false
5246
5243
  });
5247
5244
  this.listeners.add(events.end.name, this.handleEnd);
5248
- if (events.cancel) {
5249
- this.listeners.add(events.cancel.name, this.handleCancel);
5250
- }
5251
5245
  this.windowListeners.add(EventName.Resize, this.handleCancel);
5252
5246
  this.windowListeners.add(EventName.DragStart, preventDefault);
5253
5247
  this.windowListeners.add(EventName.VisibilityChange, this.handleCancel);
@@ -5263,11 +5257,9 @@ class AbstractPointerSensor {
5263
5257
  }
5264
5258
  if (isDelayConstraint(activationConstraint)) {
5265
5259
  this.timeoutId = setTimeout(this.handleStart, activationConstraint.delay);
5266
- this.handlePending(activationConstraint);
5267
5260
  return;
5268
5261
  }
5269
5262
  if (isDistanceConstraint(activationConstraint)) {
5270
- this.handlePending(activationConstraint);
5271
5263
  return;
5272
5264
  }
5273
5265
  }
@@ -5284,13 +5276,6 @@ class AbstractPointerSensor {
5284
5276
  this.timeoutId = null;
5285
5277
  }
5286
5278
  }
5287
- handlePending(constraint, offset) {
5288
- const {
5289
- active,
5290
- onPending
5291
- } = this.props;
5292
- onPending(active, constraint, this.initialCoordinates, offset);
5293
- }
5294
5279
  handleStart() {
5295
5280
  const {
5296
5281
  initialCoordinates
@@ -5344,7 +5329,6 @@ class AbstractPointerSensor {
5344
5329
  return this.handleCancel();
5345
5330
  }
5346
5331
  }
5347
- this.handlePending(activationConstraint, delta);
5348
5332
  return;
5349
5333
  }
5350
5334
  if (event.cancelable) {
@@ -5354,24 +5338,16 @@ class AbstractPointerSensor {
5354
5338
  }
5355
5339
  handleEnd() {
5356
5340
  const {
5357
- onAbort,
5358
5341
  onEnd
5359
5342
  } = this.props;
5360
5343
  this.detach();
5361
- if (!this.activated) {
5362
- onAbort(this.props.active);
5363
- }
5364
5344
  onEnd();
5365
5345
  }
5366
5346
  handleCancel() {
5367
5347
  const {
5368
- onAbort,
5369
5348
  onCancel
5370
5349
  } = this.props;
5371
5350
  this.detach();
5372
- if (!this.activated) {
5373
- onAbort(this.props.active);
5374
- }
5375
5351
  onCancel();
5376
5352
  }
5377
5353
  handleKeydown(event) {
@@ -5385,9 +5361,6 @@ class AbstractPointerSensor {
5385
5361
  }
5386
5362
  }
5387
5363
  const events = {
5388
- cancel: {
5389
- name: 'pointercancel'
5390
- },
5391
5364
  move: {
5392
5365
  name: 'pointermove'
5393
5366
  },
@@ -5460,9 +5433,6 @@ MouseSensor.activators = [{
5460
5433
  }
5461
5434
  }];
5462
5435
  const events$2 = {
5463
- cancel: {
5464
- name: 'touchcancel'
5465
- },
5466
5436
  move: {
5467
5437
  name: 'touchmove'
5468
5438
  },
@@ -5664,11 +5634,11 @@ function useScrollIntent(_ref2) {
5664
5634
  }, [disabled, delta, previousDelta]);
5665
5635
  }
5666
5636
  function useCachedNode(draggableNodes, id) {
5667
- const draggableNode = id != null ? draggableNodes.get(id) : undefined;
5637
+ const draggableNode = id !== null ? draggableNodes.get(id) : undefined;
5668
5638
  const node = draggableNode ? draggableNode.node.current : null;
5669
5639
  return useLazyMemo(cachedNode => {
5670
5640
  var _ref;
5671
- if (id == null) {
5641
+ if (id === null) {
5672
5642
  return null;
5673
5643
  } // In some cases, the draggable node can unmount while dragging
5674
5644
  // This is the case for virtualized lists. In those situations,
@@ -5876,26 +5846,7 @@ function useRect(element, measure, fallbackRect) {
5876
5846
  if (measure === void 0) {
5877
5847
  measure = defaultMeasure;
5878
5848
  }
5879
- const [rect, setRect] = React.useState(null);
5880
- function measureRect() {
5881
- setRect(currentRect => {
5882
- if (!element) {
5883
- return null;
5884
- }
5885
- if (element.isConnected === false) {
5886
- var _ref;
5887
-
5888
- // Fall back to last rect we measured if the element is
5889
- // no longer connected to the DOM.
5890
- return (_ref = currentRect != null ? currentRect : fallbackRect) != null ? _ref : null;
5891
- }
5892
- const newRect = measure(element);
5893
- if (JSON.stringify(currentRect) === JSON.stringify(newRect)) {
5894
- return currentRect;
5895
- }
5896
- return newRect;
5897
- });
5898
- }
5849
+ const [rect, measureRect] = React.useReducer(reducer, null);
5899
5850
  const mutationObserver = useMutationObserver({
5900
5851
  callback(records) {
5901
5852
  if (!element) {
@@ -5930,6 +5881,23 @@ function useRect(element, measure, fallbackRect) {
5930
5881
  }
5931
5882
  }, [element]);
5932
5883
  return rect;
5884
+ function reducer(currentRect) {
5885
+ if (!element) {
5886
+ return null;
5887
+ }
5888
+ if (element.isConnected === false) {
5889
+ var _ref;
5890
+
5891
+ // Fall back to last rect we measured if the element is
5892
+ // no longer connected to the DOM.
5893
+ return (_ref = currentRect != null ? currentRect : fallbackRect) != null ? _ref : null;
5894
+ }
5895
+ const newRect = measure(element);
5896
+ if (JSON.stringify(currentRect) === JSON.stringify(newRect)) {
5897
+ return currentRect;
5898
+ }
5899
+ return newRect;
5900
+ }
5933
5901
  }
5934
5902
  function useRectDelta(rect) {
5935
5903
  const initialRect = useInitialValue(rect);
@@ -6075,24 +6043,28 @@ function useRects(elements, measure) {
6075
6043
  }
6076
6044
  const [firstElement] = elements;
6077
6045
  const windowRect = useWindowRect(firstElement ? getWindow(firstElement) : null);
6078
- const [rects, setRects] = React.useState(defaultValue$2);
6079
- function measureRects() {
6080
- setRects(() => {
6081
- if (!elements.length) {
6082
- return defaultValue$2;
6083
- }
6084
- return elements.map(element => isDocumentScrollingElement(element) ? windowRect : new Rect(measure(element), element));
6085
- });
6086
- }
6046
+ const [rects, measureRects] = React.useReducer(reducer, defaultValue$2);
6087
6047
  const resizeObserver = useResizeObserver({
6088
6048
  callback: measureRects
6089
6049
  });
6090
- useIsomorphicLayoutEffect$1(() => {
6091
- resizeObserver == null ? void 0 : resizeObserver.disconnect();
6050
+ if (elements.length > 0 && rects === defaultValue$2) {
6092
6051
  measureRects();
6093
- elements.forEach(element => resizeObserver == null ? void 0 : resizeObserver.observe(element));
6052
+ }
6053
+ useIsomorphicLayoutEffect$1(() => {
6054
+ if (elements.length) {
6055
+ elements.forEach(element => resizeObserver == null ? void 0 : resizeObserver.observe(element));
6056
+ } else {
6057
+ resizeObserver == null ? void 0 : resizeObserver.disconnect();
6058
+ measureRects();
6059
+ }
6094
6060
  }, [elements]);
6095
6061
  return rects;
6062
+ function reducer() {
6063
+ if (!elements.length) {
6064
+ return defaultValue$2;
6065
+ }
6066
+ return elements.map(element => isDocumentScrollingElement(element) ? windowRect : new Rect(measure(element), element));
6067
+ }
6096
6068
  }
6097
6069
  function getMeasurableNode(node) {
6098
6070
  if (!node) {
@@ -6259,7 +6231,7 @@ function reducer$1(state, action) {
6259
6231
  }
6260
6232
  };
6261
6233
  case Action.DragMove:
6262
- if (state.draggable.active == null) {
6234
+ if (!state.draggable.active) {
6263
6235
  return state;
6264
6236
  }
6265
6237
  return {
@@ -6531,7 +6503,7 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6531
6503
  containers: droppableContainers
6532
6504
  }
6533
6505
  } = state;
6534
- const node = activeId != null ? draggableNodes.get(activeId) : null;
6506
+ const node = activeId ? draggableNodes.get(activeId) : null;
6535
6507
  const activeRects = React.useRef({
6536
6508
  initial: null,
6537
6509
  translated: null
@@ -6566,7 +6538,7 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6566
6538
  const autoScrollOptions = getAutoScrollerOptions();
6567
6539
  const initialActiveNodeRect = useInitialRect(activeNode, measuringConfiguration.draggable.measure);
6568
6540
  useLayoutShiftScrollCompensation({
6569
- activeNode: activeId != null ? draggableNodes.get(activeId) : null,
6541
+ activeNode: activeId ? draggableNodes.get(activeId) : null,
6570
6542
  config: autoScrollOptions.layoutShiftCompensation,
6571
6543
  initialRect: initialActiveNodeRect,
6572
6544
  measure: measuringConfiguration.draggable.measure
@@ -6644,7 +6616,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6644
6616
 
6645
6617
  const appliedTranslate = usesDragOverlay ? modifiedTranslate : add(modifiedTranslate, activeNodeScrollDelta);
6646
6618
  const transform = adjustScale(appliedTranslate, (_over$rect = over == null ? void 0 : over.rect) != null ? _over$rect : null, activeNodeRect);
6647
- const activeSensorRef = React.useRef(null);
6648
6619
  const instantiateSensor = React.useCallback((event, _ref2) => {
6649
6620
  let {
6650
6621
  sensor: Sensor,
@@ -6666,43 +6637,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6666
6637
  // Sensors need to be instantiated with refs for arguments that change over time
6667
6638
  // otherwise they are frozen in time with the stale arguments
6668
6639
  context: sensorContext,
6669
- onAbort(id) {
6670
- const draggableNode = draggableNodes.get(id);
6671
- if (!draggableNode) {
6672
- return;
6673
- }
6674
- const {
6675
- onDragAbort
6676
- } = latestProps.current;
6677
- const event = {
6678
- id
6679
- };
6680
- onDragAbort == null ? void 0 : onDragAbort(event);
6681
- dispatchMonitorEvent({
6682
- type: 'onDragAbort',
6683
- event
6684
- });
6685
- },
6686
- onPending(id, constraint, initialCoordinates, offset) {
6687
- const draggableNode = draggableNodes.get(id);
6688
- if (!draggableNode) {
6689
- return;
6690
- }
6691
- const {
6692
- onDragPending
6693
- } = latestProps.current;
6694
- const event = {
6695
- id,
6696
- constraint,
6697
- initialCoordinates,
6698
- offset
6699
- };
6700
- onDragPending == null ? void 0 : onDragPending(event);
6701
- dispatchMonitorEvent({
6702
- type: 'onDragPending',
6703
- event
6704
- });
6705
- },
6706
6640
  onStart(initialCoordinates) {
6707
6641
  const id = activeRef.current;
6708
6642
  if (id == null) {
@@ -6716,7 +6650,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6716
6650
  onDragStart
6717
6651
  } = latestProps.current;
6718
6652
  const event = {
6719
- activatorEvent,
6720
6653
  active: {
6721
6654
  id,
6722
6655
  data: draggableNode.data,
@@ -6735,8 +6668,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6735
6668
  type: 'onDragStart',
6736
6669
  event
6737
6670
  });
6738
- setActiveSensor(activeSensorRef.current);
6739
- setActivatorEvent(activatorEvent);
6740
6671
  });
6741
6672
  },
6742
6673
  onMove(coordinates) {
@@ -6748,7 +6679,10 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6748
6679
  onEnd: createHandler(Action.DragEnd),
6749
6680
  onCancel: createHandler(Action.DragCancel)
6750
6681
  });
6751
- activeSensorRef.current = sensorInstance;
6682
+ ReactDOM.unstable_batchedUpdates(() => {
6683
+ setActiveSensor(sensorInstance);
6684
+ setActivatorEvent(event.nativeEvent);
6685
+ });
6752
6686
  function createHandler(type) {
6753
6687
  return async function handler() {
6754
6688
  const {
@@ -6785,7 +6719,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6785
6719
  setOver(null);
6786
6720
  setActiveSensor(null);
6787
6721
  setActivatorEvent(null);
6788
- activeSensorRef.current = null;
6789
6722
  const eventName = type === Action.DragEnd ? 'onDragEnd' : 'onDragCancel';
6790
6723
  if (event) {
6791
6724
  const handler = latestProps.current[eventName];
@@ -7007,7 +6940,7 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
7007
6940
  });
7008
6941
  const NullContext = /*#__PURE__*/React.createContext(null);
7009
6942
  const defaultRole = 'button';
7010
- const ID_PREFIX$1 = 'Draggable';
6943
+ const ID_PREFIX$1 = 'Droppable';
7011
6944
  function useDraggable(_ref) {
7012
6945
  let {
7013
6946
  id,
@@ -7154,7 +7087,7 @@ function useDroppable(_ref) {
7154
7087
  resizeObserverConnected.current = false;
7155
7088
  resizeObserver.observe(nodeRef.current);
7156
7089
  }, [nodeRef, resizeObserver]);
7157
- React.useEffect(() => {
7090
+ useIsomorphicLayoutEffect$1(() => {
7158
7091
  dispatch({
7159
7092
  type: Action.RegisterDroppable,
7160
7093
  element: {
@@ -7569,7 +7502,6 @@ var DNDCore = /*#__PURE__*/Object.freeze({
7569
7502
  defaultCoordinates: defaultCoordinates,
7570
7503
  defaultDropAnimation: defaultDropAnimationConfiguration,
7571
7504
  defaultDropAnimationSideEffects: defaultDropAnimationSideEffects,
7572
- defaultKeyboardCoordinateGetter: defaultKeyboardCoordinateGetter,
7573
7505
  defaultScreenReaderInstructions: defaultScreenReaderInstructions,
7574
7506
  getClientRect: getClientRect,
7575
7507
  getFirstCollision: getFirstCollision,
@@ -11350,14 +11282,13 @@ var isWeb = typeof window !== 'undefined' &&
11350
11282
  function cloneObject(data) {
11351
11283
  let copy;
11352
11284
  const isArray = Array.isArray(data);
11353
- const isFileListInstance = typeof FileList !== 'undefined' ? data instanceof FileList : false;
11354
11285
  if (data instanceof Date) {
11355
11286
  copy = new Date(data);
11356
11287
  }
11357
11288
  else if (data instanceof Set) {
11358
11289
  copy = new Set(data);
11359
11290
  }
11360
- else if (!(isWeb && (data instanceof Blob || isFileListInstance)) &&
11291
+ else if (!(isWeb && (data instanceof Blob || data instanceof FileList)) &&
11361
11292
  (isArray || isObject$2(data))) {
11362
11293
  copy = isArray ? [] : {};
11363
11294
  if (!isArray && !isPlainObject(data)) {
@@ -11416,7 +11347,7 @@ var set$1 = (object, path, value) => {
11416
11347
  ? []
11417
11348
  : {};
11418
11349
  }
11419
- if (key === '__proto__' || key === 'constructor' || key === 'prototype') {
11350
+ if (key === '__proto__') {
11420
11351
  return;
11421
11352
  }
11422
11353
  object[key] = newValue;
@@ -11635,7 +11566,7 @@ function useFormState(props) {
11635
11566
  _mounted.current = false;
11636
11567
  };
11637
11568
  }, [control]);
11638
- return React.useMemo(() => getProxyFormState(formState, control, _localProxyFormState.current, false), [formState, control]);
11569
+ return getProxyFormState(formState, control, _localProxyFormState.current, false);
11639
11570
  }
11640
11571
 
11641
11572
  var isString = (value) => typeof value === 'string';
@@ -11731,67 +11662,6 @@ function useController(props) {
11731
11662
  value,
11732
11663
  ...(isBoolean(props.disabled) ? { disabled: props.disabled } : {}),
11733
11664
  }));
11734
- const fieldState = React.useMemo(() => Object.defineProperties({}, {
11735
- invalid: {
11736
- enumerable: true,
11737
- get: () => !!get$1(formState.errors, name),
11738
- },
11739
- isDirty: {
11740
- enumerable: true,
11741
- get: () => !!get$1(formState.dirtyFields, name),
11742
- },
11743
- isTouched: {
11744
- enumerable: true,
11745
- get: () => !!get$1(formState.touchedFields, name),
11746
- },
11747
- isValidating: {
11748
- enumerable: true,
11749
- get: () => !!get$1(formState.validatingFields, name),
11750
- },
11751
- error: {
11752
- enumerable: true,
11753
- get: () => get$1(formState.errors, name),
11754
- },
11755
- }), [formState, name]);
11756
- const field = React.useMemo(() => ({
11757
- name,
11758
- value,
11759
- ...(isBoolean(disabled) || formState.disabled
11760
- ? { disabled: formState.disabled || disabled }
11761
- : {}),
11762
- onChange: (event) => _registerProps.current.onChange({
11763
- target: {
11764
- value: getEventValue(event),
11765
- name: name,
11766
- },
11767
- type: EVENTS.CHANGE,
11768
- }),
11769
- onBlur: () => _registerProps.current.onBlur({
11770
- target: {
11771
- value: get$1(control._formValues, name),
11772
- name: name,
11773
- },
11774
- type: EVENTS.BLUR,
11775
- }),
11776
- ref: (elm) => {
11777
- const field = get$1(control._fields, name);
11778
- if (field && elm) {
11779
- field._f.ref = {
11780
- focus: () => elm.focus(),
11781
- select: () => elm.select(),
11782
- setCustomValidity: (message) => elm.setCustomValidity(message),
11783
- reportValidity: () => elm.reportValidity(),
11784
- };
11785
- }
11786
- },
11787
- }), [
11788
- name,
11789
- control._formValues,
11790
- disabled,
11791
- formState.disabled,
11792
- value,
11793
- control._fields,
11794
- ]);
11795
11665
  React.useEffect(() => {
11796
11666
  const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;
11797
11667
  const updateMounted = (name, value) => {
@@ -11817,7 +11687,7 @@ function useController(props) {
11817
11687
  };
11818
11688
  }, [name, control, isArrayField, shouldUnregister]);
11819
11689
  React.useEffect(() => {
11820
- if (isBoolean(disabled) && get$1(control._fields, name)) {
11690
+ if (get$1(control._fields, name)) {
11821
11691
  control._updateDisabledField({
11822
11692
  disabled,
11823
11693
  fields: control._fields,
@@ -11826,11 +11696,63 @@ function useController(props) {
11826
11696
  });
11827
11697
  }
11828
11698
  }, [disabled, name, control]);
11829
- return React.useMemo(() => ({
11830
- field,
11699
+ return {
11700
+ field: {
11701
+ name,
11702
+ value,
11703
+ ...(isBoolean(disabled) || formState.disabled
11704
+ ? { disabled: formState.disabled || disabled }
11705
+ : {}),
11706
+ onChange: React.useCallback((event) => _registerProps.current.onChange({
11707
+ target: {
11708
+ value: getEventValue(event),
11709
+ name: name,
11710
+ },
11711
+ type: EVENTS.CHANGE,
11712
+ }), [name]),
11713
+ onBlur: React.useCallback(() => _registerProps.current.onBlur({
11714
+ target: {
11715
+ value: get$1(control._formValues, name),
11716
+ name: name,
11717
+ },
11718
+ type: EVENTS.BLUR,
11719
+ }), [name, control]),
11720
+ ref: React.useCallback((elm) => {
11721
+ const field = get$1(control._fields, name);
11722
+ if (field && elm) {
11723
+ field._f.ref = {
11724
+ focus: () => elm.focus(),
11725
+ select: () => elm.select(),
11726
+ setCustomValidity: (message) => elm.setCustomValidity(message),
11727
+ reportValidity: () => elm.reportValidity(),
11728
+ };
11729
+ }
11730
+ }, [control._fields, name]),
11731
+ },
11831
11732
  formState,
11832
- fieldState,
11833
- }), [field, formState, fieldState]);
11733
+ fieldState: Object.defineProperties({}, {
11734
+ invalid: {
11735
+ enumerable: true,
11736
+ get: () => !!get$1(formState.errors, name),
11737
+ },
11738
+ isDirty: {
11739
+ enumerable: true,
11740
+ get: () => !!get$1(formState.dirtyFields, name),
11741
+ },
11742
+ isTouched: {
11743
+ enumerable: true,
11744
+ get: () => !!get$1(formState.touchedFields, name),
11745
+ },
11746
+ isValidating: {
11747
+ enumerable: true,
11748
+ get: () => !!get$1(formState.validatingFields, name),
11749
+ },
11750
+ error: {
11751
+ enumerable: true,
11752
+ get: () => get$1(formState.errors, name),
11753
+ },
11754
+ }),
11755
+ };
11834
11756
  }
11835
11757
 
11836
11758
  /**
@@ -11880,7 +11802,7 @@ const Controller = (props) => props.render(useController(props));
11880
11802
  const flatten = (obj) => {
11881
11803
  const output = {};
11882
11804
  for (const key of Object.keys(obj)) {
11883
- if (isObjectType(obj[key]) && obj[key] !== null) {
11805
+ if (isObjectType(obj[key])) {
11884
11806
  const nested = flatten(obj[key]);
11885
11807
  for (const nestedKey of Object.keys(nested)) {
11886
11808
  output[`${key}.${nestedKey}`] = nested[nestedKey];
@@ -11949,7 +11871,7 @@ function Form(props) {
11949
11871
  headers && headers['Content-Type'],
11950
11872
  encType,
11951
11873
  ].some((value) => value && value.includes('json'));
11952
- const response = await fetch(String(action), {
11874
+ const response = await fetch(action, {
11953
11875
  method,
11954
11876
  headers: {
11955
11877
  ...headers,
@@ -12447,7 +12369,7 @@ var updateAt = (fieldValues, index, value) => {
12447
12369
  */
12448
12370
  function useFieldArray(props) {
12449
12371
  const methods = useFormContext();
12450
- const { control = methods.control, name, keyName = 'id', shouldUnregister, rules, } = props;
12372
+ const { control = methods.control, name, keyName = 'id', shouldUnregister, } = props;
12451
12373
  const [fields, setFields] = React.useState(control._getFieldArray(name));
12452
12374
  const ids = React.useRef(control._getFieldArray(name).map(generateId));
12453
12375
  const _fieldIds = React.useRef(fields);
@@ -12456,8 +12378,8 @@ function useFieldArray(props) {
12456
12378
  _name.current = name;
12457
12379
  _fieldIds.current = fields;
12458
12380
  control._names.array.add(name);
12459
- rules &&
12460
- control.register(name, rules);
12381
+ props.rules &&
12382
+ control.register(name, props.rules);
12461
12383
  useSubscribe({
12462
12384
  next: ({ values, name: fieldArrayName, }) => {
12463
12385
  if (fieldArrayName === _name.current || !fieldArrayName) {
@@ -12501,8 +12423,6 @@ function useFieldArray(props) {
12501
12423
  ids.current = removeArrayAt(ids.current, index);
12502
12424
  updateValues(updatedFieldArrayValues);
12503
12425
  setFields(updatedFieldArrayValues);
12504
- !Array.isArray(get$1(control._fields, name)) &&
12505
- set$1(control._fields, name, undefined);
12506
12426
  control._updateFieldArray(name, updatedFieldArrayValues, removeArrayAt, {
12507
12427
  argA: index,
12508
12428
  });
@@ -12817,8 +12737,7 @@ var getRuleValue = (rule) => isUndefined(rule)
12817
12737
  : rule;
12818
12738
 
12819
12739
  const ASYNC_FUNCTION = 'AsyncFunction';
12820
- var hasPromiseValidation = (fieldReference) => !!fieldReference &&
12821
- !!fieldReference.validate &&
12740
+ var hasPromiseValidation = (fieldReference) => (!fieldReference || !fieldReference.validate) &&
12822
12741
  !!((isFunction$1(fieldReference.validate) &&
12823
12742
  fieldReference.validate.constructor.name === ASYNC_FUNCTION) ||
12824
12743
  (isObject$2(fieldReference.validate) &&
@@ -12947,7 +12866,7 @@ function createFormControl(props = {}) {
12947
12866
  timer = setTimeout(callback, wait);
12948
12867
  };
12949
12868
  const _updateValid = async (shouldUpdateValid) => {
12950
- if (!_options.disabled && (_proxyFormState.isValid || shouldUpdateValid)) {
12869
+ if (!props.disabled && (_proxyFormState.isValid || shouldUpdateValid)) {
12951
12870
  const isValid = _options.resolver
12952
12871
  ? isEmptyObject((await _executeSchema()).errors)
12953
12872
  : await executeBuiltInValidation(_fields, true);
@@ -12959,7 +12878,7 @@ function createFormControl(props = {}) {
12959
12878
  }
12960
12879
  };
12961
12880
  const _updateIsValidating = (names, isValidating) => {
12962
- if (!_options.disabled &&
12881
+ if (!props.disabled &&
12963
12882
  (_proxyFormState.isValidating || _proxyFormState.validatingFields)) {
12964
12883
  (names || Array.from(_names.mount)).forEach((name) => {
12965
12884
  if (name) {
@@ -12975,7 +12894,7 @@ function createFormControl(props = {}) {
12975
12894
  }
12976
12895
  };
12977
12896
  const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
12978
- if (args && method && !_options.disabled) {
12897
+ if (args && method && !props.disabled) {
12979
12898
  _state.action = true;
12980
12899
  if (shouldUpdateFieldsAndState && Array.isArray(get$1(_fields, name))) {
12981
12900
  const fieldValues = method(get$1(_fields, name), args.argA, args.argB);
@@ -13039,7 +12958,7 @@ function createFormControl(props = {}) {
13039
12958
  const output = {
13040
12959
  name,
13041
12960
  };
13042
- if (!_options.disabled) {
12961
+ if (!props.disabled) {
13043
12962
  const disabledField = !!(get$1(_fields, name) &&
13044
12963
  get$1(_fields, name)._f &&
13045
12964
  get$1(_fields, name)._f.disabled);
@@ -13080,9 +12999,9 @@ function createFormControl(props = {}) {
13080
12999
  const shouldUpdateValid = _proxyFormState.isValid &&
13081
13000
  isBoolean(isValid) &&
13082
13001
  _formState.isValid !== isValid;
13083
- if (_options.delayError && error) {
13002
+ if (props.delayError && error) {
13084
13003
  delayErrorCallback = debounce(() => updateErrors(name, error));
13085
- delayErrorCallback(_options.delayError);
13004
+ delayErrorCallback(props.delayError);
13086
13005
  }
13087
13006
  else {
13088
13007
  clearTimeout(timer);
@@ -13175,7 +13094,7 @@ function createFormControl(props = {}) {
13175
13094
  }
13176
13095
  _names.unMount = new Set();
13177
13096
  };
13178
- const _getDirty = (name, data) => !_options.disabled &&
13097
+ const _getDirty = (name, data) => !props.disabled &&
13179
13098
  (name && data && set$1(_formValues, name, data),
13180
13099
  !deepEqual(getValues(), _defaultValues));
13181
13100
  const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {
@@ -13187,7 +13106,7 @@ function createFormControl(props = {}) {
13187
13106
  ? { [names]: defaultValue }
13188
13107
  : defaultValue),
13189
13108
  }, isGlobal, defaultValue);
13190
- const _getFieldArray = (name) => compact(get$1(_state.mount ? _formValues : _defaultValues, name, _options.shouldUnregister ? get$1(_defaultValues, name, []) : []));
13109
+ const _getFieldArray = (name) => compact(get$1(_state.mount ? _formValues : _defaultValues, name, props.shouldUnregister ? get$1(_defaultValues, name, []) : []));
13191
13110
  const setFieldValue = (name, value, options = {}) => {
13192
13111
  const field = get$1(_fields, name);
13193
13112
  let fieldValue = value;
@@ -13320,7 +13239,7 @@ function createFormControl(props = {}) {
13320
13239
  });
13321
13240
  if (shouldSkipValidation) {
13322
13241
  if (_proxyFormState.isValid) {
13323
- if (_options.mode === 'onBlur') {
13242
+ if (props.mode === 'onBlur') {
13324
13243
  if (isBlurEvent) {
13325
13244
  _updateValid();
13326
13245
  }
@@ -13485,15 +13404,13 @@ function createFormControl(props = {}) {
13485
13404
  : isUndefined(value)
13486
13405
  ? getFieldValue(field ? field._f : get$1(fields, name)._f)
13487
13406
  : value;
13488
- if (disabled || (!disabled && !isUndefined(inputValue))) {
13489
- set$1(_formValues, name, inputValue);
13490
- }
13407
+ set$1(_formValues, name, inputValue);
13491
13408
  updateTouchAndDirty(name, inputValue, false, false, true);
13492
13409
  }
13493
13410
  };
13494
13411
  const register = (name, options = {}) => {
13495
13412
  let field = get$1(_fields, name);
13496
- const disabledIsDefined = isBoolean(options.disabled) || isBoolean(_options.disabled);
13413
+ const disabledIsDefined = isBoolean(options.disabled) || isBoolean(props.disabled);
13497
13414
  set$1(_fields, name, {
13498
13415
  ...(field || {}),
13499
13416
  _f: {
@@ -13509,7 +13426,7 @@ function createFormControl(props = {}) {
13509
13426
  field,
13510
13427
  disabled: isBoolean(options.disabled)
13511
13428
  ? options.disabled
13512
- : _options.disabled,
13429
+ : props.disabled,
13513
13430
  name,
13514
13431
  value: options.value,
13515
13432
  });
@@ -13519,7 +13436,7 @@ function createFormControl(props = {}) {
13519
13436
  }
13520
13437
  return {
13521
13438
  ...(disabledIsDefined
13522
- ? { disabled: options.disabled || _options.disabled }
13439
+ ? { disabled: options.disabled || props.disabled }
13523
13440
  : {}),
13524
13441
  ...(_options.progressive
13525
13442
  ? {
@@ -13603,12 +13520,6 @@ function createFormControl(props = {}) {
13603
13520
  e.preventDefault && e.preventDefault();
13604
13521
  e.persist && e.persist();
13605
13522
  }
13606
- if (_options.disabled) {
13607
- if (onInvalid) {
13608
- await onInvalid({ ..._formState.errors }, e);
13609
- }
13610
- return;
13611
- }
13612
13523
  let fieldValues = cloneObject(_formValues);
13613
13524
  _subjects.state.next({
13614
13525
  isSubmitting: true,
@@ -13716,7 +13627,7 @@ function createFormControl(props = {}) {
13716
13627
  }
13717
13628
  _fields = {};
13718
13629
  }
13719
- _formValues = _options.shouldUnregister
13630
+ _formValues = props.shouldUnregister
13720
13631
  ? keepStateOptions.keepDefaultValues
13721
13632
  ? cloneObject(_defaultValues)
13722
13633
  : {}
@@ -13740,7 +13651,7 @@ function createFormControl(props = {}) {
13740
13651
  !_proxyFormState.isValid ||
13741
13652
  !!keepStateOptions.keepIsValid ||
13742
13653
  !!keepStateOptions.keepDirtyValues;
13743
- _state.watch = !!_options.shouldUnregister;
13654
+ _state.watch = !!props.shouldUnregister;
13744
13655
  _subjects.state.next({
13745
13656
  submitCount: keepStateOptions.keepSubmitCount
13746
13657
  ? _formState.submitCount
@@ -13787,9 +13698,7 @@ function createFormControl(props = {}) {
13787
13698
  : fieldReference.ref;
13788
13699
  if (fieldRef.focus) {
13789
13700
  fieldRef.focus();
13790
- options.shouldSelect &&
13791
- isFunction$1(fieldRef.select) &&
13792
- fieldRef.select();
13701
+ options.shouldSelect && fieldRef.select();
13793
13702
  }
13794
13703
  }
13795
13704
  };
@@ -13911,8 +13820,8 @@ function createFormControl(props = {}) {
13911
13820
  * ```
13912
13821
  */
13913
13822
  function useForm(props = {}) {
13914
- const _formControl = React.useRef(undefined);
13915
- const _values = React.useRef(undefined);
13823
+ const _formControl = React.useRef();
13824
+ const _values = React.useRef();
13916
13825
  const [formState, updateFormState] = React.useState({
13917
13826
  isDirty: false,
13918
13827
  isValidating: false,
@@ -13990,6 +13899,11 @@ function useForm(props = {}) {
13990
13899
  values: control._getWatch(),
13991
13900
  });
13992
13901
  }, [props.shouldUnregister, control]);
13902
+ React.useEffect(() => {
13903
+ if (_formControl.current) {
13904
+ _formControl.current.watch = _formControl.current.watch.bind({});
13905
+ }
13906
+ }, [formState]);
13993
13907
  _formControl.current.formState = getProxyFormState(formState, control);
13994
13908
  return _formControl.current;
13995
13909
  }
@@ -14057,6 +13971,9 @@ const InputWithDropdown = /*#__PURE__*/React.forwardRef(({
14057
13971
  onDropdownChangeHandler = () => {},
14058
13972
  onInputChangeHandler,
14059
13973
  onInputBlurHandler,
13974
+ onClick,
13975
+ onKeyUp,
13976
+ onFocus,
14060
13977
  optionsRequired = true,
14061
13978
  dropdownPosition = 'right',
14062
13979
  type = 'text'
@@ -14118,6 +14035,9 @@ const InputWithDropdown = /*#__PURE__*/React.forwardRef(({
14118
14035
  autoComplete: autoComplete,
14119
14036
  required: required,
14120
14037
  disabled: disabled,
14038
+ onClick: onClick,
14039
+ onKeyUp: onKeyUp,
14040
+ onFocus: onFocus,
14121
14041
  className: classNames('ff-floating-input', {
14122
14042
  'ff-floating-input--filled': isValueFilled,
14123
14043
  'ff-floating-input--disabled': !!disabled,
@@ -18311,53 +18231,6 @@ function setYear(date, year, options) {
18311
18231
  return date_;
18312
18232
  }
18313
18233
 
18314
- const FIVE_WEEKS = 5;
18315
- const FOUR_WEEKS = 4;
18316
- /**
18317
- * Return the number of weeks to display in the broadcast calendar.
18318
- *
18319
- * @since 9.4.0
18320
- */
18321
- function getBroadcastWeeksInMonth(month, dateLib) {
18322
- // Get the first day of the month
18323
- const firstDayOfMonth = dateLib.startOfMonth(month);
18324
- // Get the day of the week for the first day of the month (1-7, where 1 is Monday)
18325
- const firstDayOfWeek = firstDayOfMonth.getDay() > 0 ? firstDayOfMonth.getDay() : 7;
18326
- const broadcastStartDate = dateLib.addDays(month, -firstDayOfWeek + 1);
18327
- const lastDateOfLastWeek = dateLib.addDays(broadcastStartDate, FIVE_WEEKS * 7 - 1);
18328
- const numberOfWeeks = month.getMonth() === lastDateOfLastWeek.getMonth() ? FIVE_WEEKS : FOUR_WEEKS;
18329
- return numberOfWeeks;
18330
- }
18331
-
18332
- /**
18333
- * Return the start date of the week in the broadcast calendar.
18334
- *
18335
- * @since 9.4.0
18336
- */
18337
- function startOfBroadcastWeek(date, dateLib) {
18338
- const firstOfMonth = dateLib.startOfMonth(date);
18339
- const dayOfWeek = firstOfMonth.getDay();
18340
- if (dayOfWeek === 1) {
18341
- return firstOfMonth;
18342
- } else if (dayOfWeek === 0) {
18343
- return dateLib.addDays(firstOfMonth, -1 * 6);
18344
- } else {
18345
- return dateLib.addDays(firstOfMonth, -1 * (dayOfWeek - 1));
18346
- }
18347
- }
18348
-
18349
- /**
18350
- * Return the end date of the week in the broadcast calendar.
18351
- *
18352
- * @since 9.4.0
18353
- */
18354
- function endOfBroadcastWeek(date, dateLib) {
18355
- const startDate = startOfBroadcastWeek(date, dateLib);
18356
- const numberOfWeeks = getBroadcastWeeksInMonth(date, dateLib);
18357
- const endDate = dateLib.addDays(startDate, numberOfWeeks * 7 - 1);
18358
- return endDate;
18359
- }
18360
-
18361
18234
  /**
18362
18235
  * A wrapper class around [date-fns](http://date-fns.org) sharing the same
18363
18236
  * options. Methods of this class can be overridden using the
@@ -18438,15 +18311,6 @@ class DateLib {
18438
18311
  this.differenceInCalendarMonths = (dateLeft, dateRight) => {
18439
18312
  return this.overrides?.differenceInCalendarMonths ? this.overrides.differenceInCalendarMonths(dateLeft, dateRight) : differenceInCalendarMonths(dateLeft, dateRight);
18440
18313
  };
18441
- /**
18442
- * Returns the end of the broadcast week for the given date.
18443
- *
18444
- * @param date The original date.
18445
- * @returns The end of the broadcast week.
18446
- */
18447
- this.endOfBroadcastWeek = date => {
18448
- return this.overrides?.endOfBroadcastWeek ? this.overrides.endOfBroadcastWeek(date, this) : endOfBroadcastWeek(date, this);
18449
- };
18450
18314
  /**
18451
18315
  * Returns the end of the ISO week for the given date.
18452
18316
  *
@@ -18608,15 +18472,6 @@ class DateLib {
18608
18472
  this.setYear = (date, year) => {
18609
18473
  return this.overrides?.setYear ? this.overrides.setYear(date, year) : setYear(date, year);
18610
18474
  };
18611
- /**
18612
- * Returns the start of the broadcast week for the given date.
18613
- *
18614
- * @param date The original date.
18615
- * @returns The start of the broadcast week.
18616
- */
18617
- this.startOfBroadcastWeek = date => {
18618
- return this.overrides?.startOfBroadcastWeek ? this.overrides.startOfBroadcastWeek(date, this) : startOfBroadcastWeek(date, this);
18619
- };
18620
18475
  /**
18621
18476
  * Returns the start of the day for the given date.
18622
18477
  *
@@ -19099,9 +18954,7 @@ function Weekday(props) {
19099
18954
  * @see https://daypicker.dev/guides/custom-components
19100
18955
  */
19101
18956
  function Weekdays(props) {
19102
- return /*#__PURE__*/React.createElement("thead", {
19103
- "aria-hidden": true
19104
- }, /*#__PURE__*/React.createElement("tr", {
18957
+ return /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", {
19105
18958
  ...props
19106
18959
  }));
19107
18960
  }
@@ -19204,8 +19057,7 @@ function getDataAttributes(props) {
19204
19057
  "data-mode": props.mode ?? undefined,
19205
19058
  "data-required": "required" in props ? props.required : undefined,
19206
19059
  "data-multiple-months": props.numberOfMonths && props.numberOfMonths > 1 || undefined,
19207
- "data-week-numbers": props.showWeekNumber || undefined,
19208
- "data-broadcast-calendar": props.broadcastCalendar || undefined
19060
+ "data-week-numbers": props.showWeekNumber || undefined
19209
19061
  };
19210
19062
  Object.entries(props).forEach(([key, val]) => {
19211
19063
  if (key.startsWith("data-")) {
@@ -19271,7 +19123,7 @@ function formatDay(date, options, dateLib) {
19271
19123
  */
19272
19124
  function formatMonthDropdown(/** The month number to format. */
19273
19125
  monthNumber, /** The locale to use for formatting. */
19274
- locale) {
19126
+ locale = enUS$1) {
19275
19127
  return locale.localize?.month(monthNumber);
19276
19128
  }
19277
19129
 
@@ -19361,12 +19213,13 @@ function getMonthOptions(displayMonth, navStart, navEnd, formatters, dateLib) {
19361
19213
  if (!navEnd) return undefined;
19362
19214
  const {
19363
19215
  addMonths,
19364
- startOfMonth
19216
+ startOfMonth,
19217
+ isBefore
19365
19218
  } = dateLib;
19366
19219
  const year = displayMonth.getFullYear();
19367
19220
  const months = [];
19368
19221
  let month = navStart;
19369
- while (months.length < 12) {
19222
+ while (months.length < 12 && isBefore(month, addMonths(navEnd, 1))) {
19370
19223
  months.push(month.getMonth());
19371
19224
  month = addMonths(month, 1);
19372
19225
  }
@@ -19374,7 +19227,7 @@ function getMonthOptions(displayMonth, navStart, navEnd, formatters, dateLib) {
19374
19227
  return a - b;
19375
19228
  });
19376
19229
  const options = sortedMonths.map(value => {
19377
- const label = formatters.formatMonthDropdown(value, dateLib.options.locale ?? enUS$1);
19230
+ const label = formatters.formatMonthDropdown(value, dateLib.options.locale);
19378
19231
  const month = dateLib.Date ? new dateLib.Date(year, value) : new Date(year, value);
19379
19232
  const disabled = navStart && month < startOfMonth(navStart) || navEnd && month > startOfMonth(navEnd) || false;
19380
19233
  return {
@@ -19749,8 +19602,7 @@ function tzName(tz, date) {
19749
19602
  */
19750
19603
  function getWeekdays(/** The date library. */
19751
19604
  dateLib, /** Use ISOWeek instead of locale/ */
19752
- ISOWeek, timeZone, /** @since 9.4.0 */
19753
- broadcastCalendar) {
19605
+ ISOWeek, timeZone) {
19754
19606
  const date = timeZone ? TZDate.tz(timeZone) : dateLib.Date ? new dateLib.Date() : new Date();
19755
19607
  const start = ISOWeek ? dateLib.startOfISOWeek(date) : dateLib.startOfWeek(date);
19756
19608
  const days = [];
@@ -19762,18 +19614,20 @@ broadcastCalendar) {
19762
19614
  }
19763
19615
 
19764
19616
  /** Return the years to show in the dropdown. */
19765
- function getYearOptions(navStart, navEnd, formatters, dateLib) {
19766
- if (!navStart) return undefined;
19767
- if (!navEnd) return undefined;
19617
+ function getYearOptions(displayMonth, calendarStart, calendarEnd, formatters, dateLib) {
19618
+ if (!calendarStart) return undefined;
19619
+ if (!calendarEnd) return undefined;
19768
19620
  const {
19621
+ startOfMonth,
19769
19622
  startOfYear,
19770
19623
  endOfYear,
19771
19624
  addYears,
19772
19625
  isBefore,
19773
19626
  isSameYear
19774
19627
  } = dateLib;
19775
- const firstNavYear = startOfYear(navStart);
19776
- const lastNavYear = endOfYear(navEnd);
19628
+ const month = displayMonth.getMonth();
19629
+ const firstNavYear = startOfYear(calendarStart);
19630
+ const lastNavYear = endOfYear(calendarEnd);
19777
19631
  const years = [];
19778
19632
  let year = firstNavYear;
19779
19633
  while (isBefore(year, lastNavYear) || isSameYear(year, lastNavYear)) {
@@ -19781,11 +19635,13 @@ function getYearOptions(navStart, navEnd, formatters, dateLib) {
19781
19635
  year = addYears(year, 1);
19782
19636
  }
19783
19637
  return years.map(value => {
19638
+ const year = dateLib.Date ? new dateLib.Date(value, month) : new Date(value, month);
19639
+ const disabled = calendarStart && year < startOfMonth(calendarStart) || month && calendarEnd && year > startOfMonth(calendarEnd) || false;
19784
19640
  const label = formatters.formatYearDropdown(value);
19785
19641
  return {
19786
19642
  value,
19787
19643
  label,
19788
- disabled: false
19644
+ disabled
19789
19645
  };
19790
19646
  });
19791
19647
  }
@@ -19949,30 +19805,29 @@ var defaultLabels = /*#__PURE__*/Object.freeze({
19949
19805
  labelYearDropdown: labelYearDropdown
19950
19806
  });
19951
19807
 
19808
+ /** The number of days in a month when having 6 weeks. */
19809
+ const NrOfDaysWithFixedWeeks = 42;
19952
19810
  /** Return all the dates to display in the calendar. */
19953
19811
  function getDates(displayMonths, maxDate, props, dateLib) {
19954
19812
  const firstMonth = displayMonths[0];
19955
19813
  const lastMonth = displayMonths[displayMonths.length - 1];
19956
19814
  const {
19957
19815
  ISOWeek,
19958
- fixedWeeks,
19959
- broadcastCalendar
19816
+ fixedWeeks
19960
19817
  } = props ?? {};
19961
19818
  const {
19819
+ startOfWeek,
19820
+ endOfWeek,
19821
+ startOfISOWeek,
19822
+ endOfISOWeek,
19962
19823
  addDays,
19963
19824
  differenceInCalendarDays,
19964
19825
  differenceInCalendarMonths,
19965
- endOfBroadcastWeek,
19966
- endOfISOWeek,
19967
- endOfMonth,
19968
- endOfWeek,
19969
19826
  isAfter,
19970
- startOfBroadcastWeek,
19971
- startOfISOWeek,
19972
- startOfWeek
19827
+ endOfMonth
19973
19828
  } = dateLib;
19974
- const startWeekFirstDate = broadcastCalendar ? startOfBroadcastWeek(firstMonth, dateLib) : ISOWeek ? startOfISOWeek(firstMonth) : startOfWeek(firstMonth);
19975
- const endWeekLastDate = broadcastCalendar ? endOfBroadcastWeek(lastMonth, dateLib) : ISOWeek ? endOfISOWeek(endOfMonth(lastMonth)) : endOfWeek(endOfMonth(lastMonth));
19829
+ const startWeekFirstDate = ISOWeek ? startOfISOWeek(firstMonth) : startOfWeek(firstMonth);
19830
+ const endWeekLastDate = ISOWeek ? endOfISOWeek(endOfMonth(lastMonth)) : endOfWeek(endOfMonth(lastMonth));
19976
19831
  const nOfDays = differenceInCalendarDays(endWeekLastDate, startWeekFirstDate);
19977
19832
  const nOfMonths = differenceInCalendarMonths(lastMonth, firstMonth) + 1;
19978
19833
  const dates = [];
@@ -19984,11 +19839,9 @@ function getDates(displayMonths, maxDate, props, dateLib) {
19984
19839
  dates.push(date);
19985
19840
  }
19986
19841
  // If fixed weeks is enabled, add the extra dates to the array
19987
- const nrOfDaysWithFixedWeeks = broadcastCalendar ? 35 : 42;
19988
- const extraDates = nrOfDaysWithFixedWeeks * nOfMonths;
19842
+ const extraDates = NrOfDaysWithFixedWeeks * nOfMonths;
19989
19843
  if (fixedWeeks && dates.length < extraDates) {
19990
- const daysToAdd = extraDates - dates.length;
19991
- for (let i = 0; i < daysToAdd; i++) {
19844
+ for (let i = 0; i < 7; i++) {
19992
19845
  const date = addDays(dates[dates.length - 1], 1);
19993
19846
  dates.push(date);
19994
19847
  }
@@ -20099,29 +19952,25 @@ displayMonths, /** The dates to display in the calendar. */
20099
19952
  dates, /** Options from the props context. */
20100
19953
  props, dateLib) {
20101
19954
  const {
20102
- addDays,
20103
- endOfBroadcastWeek,
19955
+ startOfWeek,
19956
+ endOfWeek,
19957
+ startOfISOWeek,
20104
19958
  endOfISOWeek,
20105
19959
  endOfMonth,
20106
- endOfWeek,
20107
- getISOWeek,
19960
+ addDays,
20108
19961
  getWeek,
20109
- startOfBroadcastWeek,
20110
- startOfISOWeek,
20111
- startOfWeek
19962
+ getISOWeek
20112
19963
  } = dateLib;
20113
19964
  const dayPickerMonths = displayMonths.reduce((months, month) => {
20114
- const firstDateOfFirstWeek = props.broadcastCalendar ? startOfBroadcastWeek(month, dateLib) : props.ISOWeek ? startOfISOWeek(month) : startOfWeek(month);
20115
- const lastDateOfLastWeek = props.broadcastCalendar ? endOfBroadcastWeek(month, dateLib) : props.ISOWeek ? endOfISOWeek(endOfMonth(month)) : endOfWeek(endOfMonth(month));
19965
+ const firstDateOfFirstWeek = props.ISOWeek ? startOfISOWeek(month) : startOfWeek(month);
19966
+ const lastDateOfLastWeek = props.ISOWeek ? endOfISOWeek(endOfMonth(month)) : endOfWeek(endOfMonth(month));
20116
19967
  /** The dates to display in the month. */
20117
19968
  const monthDates = dates.filter(date => {
20118
19969
  return date >= firstDateOfFirstWeek && date <= lastDateOfLastWeek;
20119
19970
  });
20120
- const nrOfDaysWithFixedWeeks = props.broadcastCalendar ? 35 : 42;
20121
- if (props.fixedWeeks && monthDates.length < nrOfDaysWithFixedWeeks) {
19971
+ if (props.fixedWeeks && monthDates.length < 42) {
20122
19972
  const extraDates = dates.filter(date => {
20123
- const daysToAdd = nrOfDaysWithFixedWeeks - monthDates.length;
20124
- return date > lastDateOfLastWeek && date <= addDays(lastDateOfLastWeek, daysToAdd);
19973
+ return date > lastDateOfLastWeek && date <= addDays(lastDateOfLastWeek, 7);
20125
19974
  });
20126
19975
  monthDates.push(...extraDates);
20127
19976
  }
@@ -20559,30 +20408,27 @@ function dateMatchModifiers(date, matchers, dateLib = defaultDateLib) {
20559
20408
  /** Return the next date that should be focused. */
20560
20409
  function getFocusableDate(moveBy, moveDir, refDate, navStart, navEnd, props, dateLib) {
20561
20410
  const {
20562
- ISOWeek,
20563
- broadcastCalendar
20411
+ ISOWeek
20564
20412
  } = props;
20565
20413
  const {
20566
20414
  addDays,
20567
20415
  addMonths,
20568
- addWeeks,
20569
20416
  addYears,
20570
- endOfBroadcastWeek,
20417
+ addWeeks,
20418
+ startOfISOWeek,
20571
20419
  endOfISOWeek,
20420
+ startOfWeek,
20572
20421
  endOfWeek,
20573
20422
  max,
20574
- min,
20575
- startOfBroadcastWeek,
20576
- startOfISOWeek,
20577
- startOfWeek
20423
+ min
20578
20424
  } = dateLib;
20579
20425
  const moveFns = {
20580
20426
  day: addDays,
20581
20427
  week: addWeeks,
20582
20428
  month: addMonths,
20583
20429
  year: addYears,
20584
- startOfWeek: date => broadcastCalendar ? startOfBroadcastWeek(date, dateLib) : ISOWeek ? startOfISOWeek(date) : startOfWeek(date),
20585
- endOfWeek: date => broadcastCalendar ? endOfBroadcastWeek(date, dateLib) : ISOWeek ? endOfISOWeek(date) : endOfWeek(date)
20430
+ startOfWeek: date => ISOWeek ? startOfISOWeek(date) : startOfWeek(date),
20431
+ endOfWeek: date => ISOWeek ? endOfISOWeek(date) : endOfWeek(date)
20586
20432
  };
20587
20433
  let focusableDate = moveFns[moveBy](refDate, moveDir === "after" ? 1 : -1);
20588
20434
  if (moveDir === "before" && navStart) {
@@ -20648,8 +20494,6 @@ function useFocus(props, calendar, getModifiers, isSelected, dateLib) {
20648
20494
  /**
20649
20495
  * Return a function to get the modifiers for a given day.
20650
20496
  *
20651
- * NOTE: this is not an hook, but a factory for `getModifiers`.
20652
- *
20653
20497
  * @private
20654
20498
  */
20655
20499
  function useGetModifiers(days, props, dateLib) {
@@ -20658,19 +20502,12 @@ function useGetModifiers(days, props, dateLib) {
20658
20502
  hidden,
20659
20503
  modifiers,
20660
20504
  showOutsideDays,
20661
- broadcastCalendar,
20662
20505
  today
20663
20506
  } = props;
20664
20507
  const {
20665
20508
  isSameDay,
20666
- isSameMonth,
20667
- startOfMonth,
20668
- isBefore,
20669
- endOfMonth,
20670
- isAfter
20509
+ isSameMonth
20671
20510
  } = dateLib;
20672
- const startMonth = props.startMonth && startOfMonth(props.startMonth);
20673
- const endMonth = props.endMonth && endOfMonth(props.endMonth);
20674
20511
  const internalModifiersMap = {
20675
20512
  [DayFlag.focused]: [],
20676
20513
  [DayFlag.outside]: [],
@@ -20679,18 +20516,20 @@ function useGetModifiers(days, props, dateLib) {
20679
20516
  [DayFlag.today]: []
20680
20517
  };
20681
20518
  const customModifiersMap = {};
20519
+ const selectionModifiersMap = {
20520
+ [SelectionState.range_end]: [],
20521
+ [SelectionState.range_middle]: [],
20522
+ [SelectionState.range_start]: [],
20523
+ [SelectionState.selected]: []
20524
+ };
20682
20525
  for (const day of days) {
20683
20526
  const {
20684
20527
  date,
20685
20528
  displayMonth
20686
20529
  } = day;
20687
20530
  const isOutside = Boolean(displayMonth && !isSameMonth(date, displayMonth));
20688
- const isBeforeStartMonth = Boolean(startMonth && isBefore(date, startMonth));
20689
- const isAfterEndMonth = Boolean(endMonth && isAfter(date, endMonth));
20690
20531
  const isDisabled = Boolean(disabled && dateMatchModifiers(date, disabled, dateLib));
20691
- const isHidden = Boolean(hidden && dateMatchModifiers(date, hidden, dateLib)) || isBeforeStartMonth || isAfterEndMonth ||
20692
- // Broadcast calendar will show outside days as default
20693
- !broadcastCalendar && !showOutsideDays && isOutside || broadcastCalendar && showOutsideDays === false && isOutside;
20532
+ const isHidden = Boolean(hidden && dateMatchModifiers(date, hidden, dateLib)) || !showOutsideDays && isOutside;
20694
20533
  const isToday = isSameDay(date, today ?? (props.timeZone ? TZDate.tz(props.timeZone) : dateLib.Date ? new dateLib.Date() : new Date()));
20695
20534
  if (isOutside) internalModifiersMap.outside.push(day);
20696
20535
  if (isDisabled) internalModifiersMap.disabled.push(day);
@@ -20719,16 +20558,27 @@ function useGetModifiers(days, props, dateLib) {
20719
20558
  [DayFlag.outside]: false,
20720
20559
  [DayFlag.today]: false
20721
20560
  };
20561
+ const selectionStates = {
20562
+ [SelectionState.range_end]: false,
20563
+ [SelectionState.range_middle]: false,
20564
+ [SelectionState.range_start]: false,
20565
+ [SelectionState.selected]: false
20566
+ };
20722
20567
  const customModifiers = {};
20723
20568
  // Find the modifiers for the given day
20724
20569
  for (const name in internalModifiersMap) {
20725
20570
  const days = internalModifiersMap[name];
20726
20571
  dayFlags[name] = days.some(d => d === day);
20727
20572
  }
20573
+ for (const name in selectionModifiersMap) {
20574
+ const days = selectionModifiersMap[name];
20575
+ selectionStates[name] = days.some(d => d === day);
20576
+ }
20728
20577
  for (const name in customModifiersMap) {
20729
20578
  customModifiers[name] = customModifiersMap[name].some(d => d === day);
20730
20579
  }
20731
20580
  return {
20581
+ ...selectionStates,
20732
20582
  ...dayFlags,
20733
20583
  // custom modifiers should override all the previous ones
20734
20584
  ...customModifiers
@@ -21133,7 +20983,7 @@ function DayPicker(props) {
21133
20983
  };
21134
20984
  const dateLib = new DateLib({
21135
20985
  locale,
21136
- weekStartsOn: props.broadcastCalendar ? 1 : props.weekStartsOn,
20986
+ weekStartsOn: props.weekStartsOn,
21137
20987
  firstWeekContainsDate: props.firstWeekContainsDate,
21138
20988
  useAdditionalWeekYearTokens: props.useAdditionalWeekYearTokens,
21139
20989
  useAdditionalDayOfYearTokens: props.useAdditionalDayOfYearTokens
@@ -21152,7 +21002,7 @@ function DayPicker(props) {
21152
21002
  ...props.classNames
21153
21003
  }
21154
21004
  };
21155
- }, [props.classNames, props.components, props.dateLib, props.firstWeekContainsDate, props.formatters, props.labels, props.locale, props.useAdditionalDayOfYearTokens, props.useAdditionalWeekYearTokens, props.weekStartsOn, props.broadcastCalendar]);
21005
+ }, [props.classNames, props.components, props.dateLib, props.firstWeekContainsDate, props.formatters, props.labels, props.locale, props.useAdditionalDayOfYearTokens, props.useAdditionalWeekYearTokens, props.weekStartsOn]);
21156
21006
  const {
21157
21007
  captionLayout,
21158
21008
  mode,
@@ -21262,16 +21112,6 @@ function DayPicker(props) {
21262
21112
  const handleDayMouseLeave = React.useCallback((day, modifiers) => e => {
21263
21113
  onDayMouseLeave?.(day.date, modifiers, e);
21264
21114
  }, [onDayMouseLeave]);
21265
- const handleMonthChange = React.useCallback(date => e => {
21266
- const selectedMonth = Number(e.target.value);
21267
- const month = dateLib.setMonth(dateLib.startOfMonth(date), selectedMonth);
21268
- goToMonth(month);
21269
- }, [dateLib, goToMonth]);
21270
- const handleYearChange = React.useCallback(date => e => {
21271
- const selectedYear = Number(e.target.value);
21272
- const month = dateLib.setYear(dateLib.startOfMonth(date), selectedYear);
21273
- goToMonth(month);
21274
- }, [dateLib, goToMonth]);
21275
21115
  const {
21276
21116
  className,
21277
21117
  style
@@ -21309,8 +21149,6 @@ function DayPicker(props) {
21309
21149
  lang: props.lang,
21310
21150
  nonce: props.nonce,
21311
21151
  title: props.title,
21312
- role: props.role,
21313
- "aria-label": props["aria-label"],
21314
21152
  ...dataAttributes
21315
21153
  }, /*#__PURE__*/React.createElement(components.Months, {
21316
21154
  className: classNames[UI.Months],
@@ -21324,8 +21162,17 @@ function DayPicker(props) {
21324
21162
  previousMonth: previousMonth,
21325
21163
  nextMonth: nextMonth
21326
21164
  })), months.map((calendarMonth, displayIndex) => {
21165
+ const handleMonthChange = e => {
21166
+ const selectedMonth = Number(e.target.value);
21167
+ const month = dateLib.setMonth(dateLib.startOfMonth(calendarMonth.date), selectedMonth);
21168
+ goToMonth(month);
21169
+ };
21170
+ const handleYearChange = e => {
21171
+ const month = dateLib.setYear(dateLib.startOfMonth(calendarMonth.date), Number(e.target.value));
21172
+ goToMonth(month);
21173
+ };
21327
21174
  const dropdownMonths = getMonthOptions(calendarMonth.date, navStart, navEnd, formatters, dateLib);
21328
- const dropdownYears = getYearOptions(navStart, navEnd, formatters, dateLib);
21175
+ const dropdownYears = getYearOptions(months[0].date, navStart, navEnd, formatters, dateLib);
21329
21176
  return /*#__PURE__*/React.createElement(components.Month, {
21330
21177
  className: classNames[UI.Month],
21331
21178
  style: styles?.[UI.Month],
@@ -21346,7 +21193,7 @@ function DayPicker(props) {
21346
21193
  classNames: classNames,
21347
21194
  components: components,
21348
21195
  disabled: Boolean(props.disableNavigation),
21349
- onChange: handleMonthChange(calendarMonth.date),
21196
+ onChange: handleMonthChange,
21350
21197
  options: dropdownMonths,
21351
21198
  style: styles?.[UI.Dropdown],
21352
21199
  value: calendarMonth.date.getMonth()
@@ -21359,7 +21206,7 @@ function DayPicker(props) {
21359
21206
  classNames: classNames,
21360
21207
  components: components,
21361
21208
  disabled: Boolean(props.disableNavigation),
21362
- onChange: handleYearChange(calendarMonth.date),
21209
+ onChange: handleYearChange,
21363
21210
  options: dropdownYears,
21364
21211
  style: styles?.[UI.Dropdown],
21365
21212
  value: calendarMonth.date.getFullYear()
@@ -21406,8 +21253,7 @@ function DayPicker(props) {
21406
21253
  locale
21407
21254
  }),
21408
21255
  className: classNames[UI.WeekNumber],
21409
- scope: "row",
21410
- role: "rowheader"
21256
+ scope: "row"
21411
21257
  }, formatWeekNumber(week.weekNumber))), week.days.map(day => {
21412
21258
  const {
21413
21259
  date
@@ -21427,14 +21273,14 @@ function DayPicker(props) {
21427
21273
  }
21428
21274
  const style = getStyleForModifiers(modifiers, styles, props.modifiersStyles);
21429
21275
  const className = getClassNamesForModifiers(modifiers, classNames, props.modifiersClassNames);
21430
- const ariaLabel = !isInteractive && !modifiers.hidden ? labelGridcell(date, modifiers, dateLib.options, dateLib) : undefined;
21276
+ const ariaLabel = !isInteractive ? labelGridcell(date, modifiers, dateLib.options, dateLib) : undefined;
21431
21277
  return /*#__PURE__*/React.createElement(components.Day, {
21432
21278
  key: `${dateLib.format(date, "yyyy-MM-dd")}_${dateLib.format(day.displayMonth, "yyyy-MM")}`,
21433
21279
  day: day,
21434
21280
  modifiers: modifiers,
21435
21281
  className: className.join(" "),
21436
21282
  style: style,
21437
- role: "gridcell",
21283
+ "aria-hidden": modifiers.hidden || undefined,
21438
21284
  "aria-selected": modifiers.selected || undefined,
21439
21285
  "aria-label": ariaLabel,
21440
21286
  "data-day": dateLib.format(date, "yyyy-MM-dd"),
@@ -21445,7 +21291,7 @@ function DayPicker(props) {
21445
21291
  "data-outside": day.outside || undefined,
21446
21292
  "data-focused": modifiers.focused || undefined,
21447
21293
  "data-today": modifiers.today || undefined
21448
- }, !modifiers.hidden && isInteractive ? (/*#__PURE__*/React.createElement(components.DayButton, {
21294
+ }, isInteractive ? (/*#__PURE__*/React.createElement(components.DayButton, {
21449
21295
  className: classNames[UI.DayButton],
21450
21296
  style: styles?.[UI.DayButton],
21451
21297
  type: "button",
@@ -21460,7 +21306,7 @@ function DayPicker(props) {
21460
21306
  onKeyDown: handleDayKeyDown(day, modifiers),
21461
21307
  onMouseEnter: handleDayMouseEnter(day, modifiers),
21462
21308
  onMouseLeave: handleDayMouseLeave(day, modifiers)
21463
- }, formatDay(date, dateLib.options, dateLib))) : !modifiers.hidden && formatDay(day.date, dateLib.options, dateLib));
21309
+ }, formatDay(date, dateLib.options, dateLib))) : formatDay(day.date, dateLib.options, dateLib));
21464
21310
  }));
21465
21311
  }))));
21466
21312
  })), props.footer && (/*#__PURE__*/React.createElement(components.Footer, {