pixel-react 1.10.10-1 → 1.10.10-3

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 (178) hide show
  1. package/lib/1fb4472b34e4fe07.css +1 -0
  2. package/lib/StyleGuide/ColorPalette/ColorPalette.stories.d.ts +6 -0
  3. package/lib/StyleGuide/Typography/Typography.stories.d.ts +6 -0
  4. package/lib/assets/fonts/Poppins-Bold.ttf +0 -0
  5. package/lib/assets/fonts/Poppins-Medium.ttf +0 -0
  6. package/lib/assets/fonts/Poppins-Regular.ttf +0 -0
  7. package/lib/assets/fonts/Poppins-SemiBold.ttf +0 -0
  8. package/lib/components/Accordion/Accordion.stories.d.ts +6 -0
  9. package/lib/components/AddButton/AddButton.d.ts +5 -0
  10. package/lib/components/AddButton/AddButton.stories.d.ts +6 -0
  11. package/lib/components/AddButton/index.d.ts +1 -0
  12. package/lib/components/AddButton/types.d.ts +4 -0
  13. package/lib/components/AddResourceButton/AddButton.stories.d.ts +8 -0
  14. package/lib/components/AddVariables/AddVariables.d.ts +5 -0
  15. package/lib/components/AddVariables/index.d.ts +1 -0
  16. package/lib/components/AddVariables/types.d.ts +35 -0
  17. package/lib/components/AllProjectsDropdown/AllProjectsDropdown.stories.d.ts +7 -0
  18. package/lib/components/AppHeader/AppHeader.stories.d.ts +7 -0
  19. package/lib/components/AppHeader/types.d.ts +1 -0
  20. package/lib/components/AttachImage/AttachImage.stories.d.ts +7 -0
  21. package/lib/components/AttachmentButton/AttachmentButton.stories.d.ts +9 -0
  22. package/lib/components/Avatar/Avatar.stories.d.ts +10 -0
  23. package/lib/components/Button/Button.stories.d.ts +13 -0
  24. package/lib/components/Charts/BarChart/BarChart.stories.d.ts +6 -0
  25. package/lib/components/Charts/DashboardDonutChart/DashboardDonutChart.stories.d.ts +7 -0
  26. package/lib/components/Charts/DonutChart/DonutChart.stories.d.ts +6 -0
  27. package/lib/components/Charts/IconRadialChart/IconRadialChart.stories.d.ts +8 -0
  28. package/lib/components/Charts/LineChart/LineChart.stories.d.ts +7 -0
  29. package/lib/components/Charts/MultiRadialChart/MultiRadialChart.stories.d.ts +8 -0
  30. package/lib/components/Charts/PieChart/PieChart.stories.d.ts +7 -0
  31. package/lib/components/Charts/RadialChart/RadialChart.stories.d.ts +6 -0
  32. package/lib/components/Checkbox/Checkbox.stories.d.ts +8 -0
  33. package/lib/components/Chip/Chip.stories.d.ts +14 -0
  34. package/lib/components/ConnectingBranch/ConnectingBranch.stories.d.ts +6 -0
  35. package/lib/components/ConnectingBranch/types.d.ts +2 -0
  36. package/lib/components/DatePicker/DatePicker.stories.d.ts +9 -0
  37. package/lib/components/DragAndDrop/DragAndDrop.stories.d.ts +6 -0
  38. package/lib/components/Drawer/Drawer.stories.d.ts +12 -0
  39. package/lib/components/EditTextField/EditTextField.stories.d.ts +10 -0
  40. package/lib/components/Editor/Editor.stories.d.ts +6 -0
  41. package/lib/components/Excel/ContextMenu/ContextMenu.d.ts +4 -0
  42. package/lib/components/Excel/ExcelFile.stories.d.ts +6 -0
  43. package/lib/components/ExcelFile/ChangeExcelStyles.d.ts +14 -0
  44. package/lib/components/ExcelFile/ColorBarSelector/ColorBarSelector.d.ts +8 -0
  45. package/lib/components/ExcelFile/ContextMenu/ContextMenu.d.ts +4 -0
  46. package/lib/components/ExcelFile/ExcelFile/Excel/ActiveCell.d.ts +7 -0
  47. package/lib/components/ExcelFile/ExcelFile/Excel/Cell.d.ts +4 -0
  48. package/lib/components/ExcelFile/ExcelFile/Excel/ColumnIndicator.d.ts +5 -0
  49. package/lib/components/ExcelFile/ExcelFile/Excel/Copied.d.ts +3 -0
  50. package/lib/components/ExcelFile/ExcelFile/Excel/CornerIndicator.d.ts +5 -0
  51. package/lib/components/ExcelFile/ExcelFile/Excel/DataEditor.d.ts +5 -0
  52. package/lib/components/ExcelFile/ExcelFile/Excel/DataViewer.d.ts +8 -0
  53. package/lib/components/ExcelFile/ExcelFile/Excel/FloatingRect.d.ts +10 -0
  54. package/lib/components/ExcelFile/ExcelFile/Excel/HeaderRow.d.ts +3 -0
  55. package/lib/components/ExcelFile/ExcelFile/Excel/Row.d.ts +3 -0
  56. package/lib/components/ExcelFile/ExcelFile/Excel/RowIndicator.d.ts +5 -0
  57. package/lib/components/ExcelFile/ExcelFile/Excel/Selected.d.ts +3 -0
  58. package/lib/components/ExcelFile/ExcelFile/Excel/Spreadsheet.d.ts +80 -0
  59. package/lib/components/ExcelFile/ExcelFile/Excel/Table.d.ts +3 -0
  60. package/lib/components/ExcelFile/ExcelFile/Excel/actions.d.ts +174 -0
  61. package/lib/components/ExcelFile/ExcelFile/Excel/areModelsEqual.d.ts +1 -0
  62. package/lib/components/ExcelFile/ExcelFile/Excel/context.d.ts +8 -0
  63. package/lib/components/ExcelFile/ExcelFile/Excel/engine/engine.d.ts +22 -0
  64. package/lib/components/ExcelFile/ExcelFile/Excel/engine/formula.d.ts +17 -0
  65. package/lib/components/ExcelFile/ExcelFile/Excel/engine/index.d.ts +2 -0
  66. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-graph.d.ts +21 -0
  67. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-hash.d.ts +3 -0
  68. package/lib/components/ExcelFile/ExcelFile/Excel/engine/point-set.d.ts +24 -0
  69. package/lib/components/ExcelFile/ExcelFile/Excel/index.d.ts +13 -0
  70. package/lib/components/ExcelFile/ExcelFile/Excel/matrix.d.ts +67 -0
  71. package/lib/components/ExcelFile/ExcelFile/Excel/point-range.d.ts +22 -0
  72. package/lib/components/ExcelFile/ExcelFile/Excel/point.d.ts +11 -0
  73. package/lib/components/ExcelFile/ExcelFile/Excel/reducer.d.ts +27 -0
  74. package/lib/components/ExcelFile/ExcelFile/Excel/selection.d.ts +95 -0
  75. package/lib/components/ExcelFile/ExcelFile/Excel/types.d.ts +178 -0
  76. package/lib/components/ExcelFile/ExcelFile/Excel/use-dispatch.d.ts +3 -0
  77. package/lib/components/ExcelFile/ExcelFile/Excel/use-selector.d.ts +3 -0
  78. package/lib/components/ExcelFile/ExcelFile/Excel/util.d.ts +44 -0
  79. package/lib/components/ExcelFile/ExcelFile/ExcelFile.d.ts +19 -0
  80. package/lib/components/ExcelFile/ExcelFile.stories.d.ts +6 -0
  81. package/lib/components/ExcelFile/ExcelSheetBar/ExcelSheetBar.d.ts +12 -0
  82. package/lib/components/ExcelFile/ExcelToolBar/ExcelToolBar.d.ts +15 -0
  83. package/lib/components/ExcelFile/ImportExcelStyles.d.ts +24 -0
  84. package/lib/components/ExcelFile/Types.d.ts +129 -0
  85. package/lib/components/ExcelFile/index.d.ts +1 -0
  86. package/lib/components/ExpandableMenu/ExpandableMenu.stories.d.ts +7 -0
  87. package/lib/components/FF_Captcha/captcha.stories.d.ts +8 -0
  88. package/lib/components/FileDropzone/FileDropzone.stories.d.ts +8 -0
  89. package/lib/components/Form/Form.stories.d.ts +7 -0
  90. package/lib/components/GridLayout/GridLayout.stories.d.ts +8 -0
  91. package/lib/components/HighlightText/HighlightText.stories.d.ts +6 -0
  92. package/lib/components/Icon/Icon.stories.d.ts +8 -0
  93. package/lib/components/IconButton/IconButton.stories.d.ts +7 -0
  94. package/lib/components/IconRadioGroup/IconRadioGroup.stories.d.ts +7 -0
  95. package/lib/components/Input/Input.stories.d.ts +9 -0
  96. package/lib/components/InputWithDropdown/InputWithDropdown.stories.d.ts +9 -0
  97. package/lib/components/LabelEditTextField/LabelEditTextField.stories.d.ts +13 -0
  98. package/lib/components/LazyLoad/LazyLoad.stories.d.ts +6 -0
  99. package/lib/components/MachineInputField/MachineInputField.stories.d.ts +6 -0
  100. package/lib/components/MenuOption/MenuOption.stories.d.ts +16 -0
  101. package/lib/components/MiniModal/MiniModal.stories.d.ts +10 -0
  102. package/lib/components/Modal/Modal.stories.d.ts +7 -0
  103. package/lib/components/ModulesChip/ModuleChip.stories.d.ts +6 -0
  104. package/lib/components/MultiSelect/MultiSelect.stories.d.ts +11 -0
  105. package/lib/components/NLPInput/NlpInput.stories.d.ts +7 -0
  106. package/lib/components/NLPInput/type.d.ts +70 -0
  107. package/lib/components/Paper/Paper.stories.d.ts +11 -0
  108. package/lib/components/RadioButton/RadioButton.stories.d.ts +10 -0
  109. package/lib/components/RadioGroup/RadioGroup.stories.d.ts +9 -0
  110. package/lib/components/Search/Search.stories.d.ts +6 -0
  111. package/lib/components/Select/Select.stories.d.ts +14 -0
  112. package/lib/components/Select/components/Dropdown/Dropdown.d.ts +4 -0
  113. package/lib/components/Select/components/Dropdown/dropdownTypes.d.ts +17 -0
  114. package/lib/components/SequentialConnectingBranch/SequentialConnectingBranch.stories.d.ts +6 -0
  115. package/lib/components/SequentialConnectingBranch/components/AddBrowserModal/AddBrowserModal.d.ts +4 -0
  116. package/lib/components/SequentialConnectingBranch/components/AddBrowserModal/types.d.ts +3 -0
  117. package/lib/components/SequentialConnectingBranch/components/DatasetListModal/DatasetListModal.d.ts +4 -0
  118. package/lib/components/SequentialConnectingBranch/components/DatasetListModal/types.d.ts +3 -0
  119. package/lib/components/StateDropdown/StateDropdown.stories.d.ts +10 -0
  120. package/lib/components/StatusButton/StatusButton.stories.d.ts +14 -0
  121. package/lib/components/StatusCard/StatusCard.stories.d.ts +11 -0
  122. package/lib/components/Table/Table.stories.d.ts +13 -0
  123. package/lib/components/TableTree/TableTree.stories.d.ts +7 -0
  124. package/lib/components/Tabs/Tabs.stories.d.ts +9 -0
  125. package/lib/components/TextArea/Textarea.stories.d.ts +9 -0
  126. package/lib/components/Toast/Toast.stories.d.ts +6 -0
  127. package/lib/components/Toastify/Toastify.stories.d.ts +6 -0
  128. package/lib/components/Toggle/Toggle.stories.d.ts +12 -0
  129. package/lib/components/Tooltip/Tooltip.stories.d.ts +15 -0
  130. package/lib/components/Typography/Typography.stories.d.ts +10 -0
  131. package/lib/components/VariableInput/VariableInput.stories.d.ts +6 -0
  132. package/lib/index.d.ts +2 -0
  133. package/lib/index.esm.js +799 -575
  134. package/lib/index.esm.js.map +1 -1
  135. package/lib/index.js +799 -575
  136. package/lib/index.js.map +1 -1
  137. package/lib/tsconfig.tsbuildinfo +1 -1
  138. package/lib/utils/checkEmpty/checkEmpty.stories.d.ts +6 -0
  139. package/lib/utils/compareArrays/compareArrays.stories.d.ts +6 -0
  140. package/lib/utils/compareObjects/compareObjects.stories.d.ts +6 -0
  141. package/lib/utils/debounce/debounce.stories.d.ts +6 -0
  142. package/lib/utils/ffID/ffID.stories.d.ts +6 -0
  143. package/lib/utils/find/findAndInsert.d.ts +7 -0
  144. package/lib/utils/find/findAndInsert.stories.d.ts +7 -0
  145. package/lib/utils/findAndInsert/findAndInsert.stories.d.ts +7 -0
  146. package/lib/utils/getEncryptedData/getEncryptedData.stories.d.ts +6 -0
  147. package/lib/utils/getExtension/getExtension.stories.d.ts +6 -0
  148. package/lib/utils/getSequentialPayload/getSequentialPayload.stories.d.ts +10 -0
  149. package/lib/utils/throttle/throttle.stories.d.ts +6 -0
  150. package/lib/utils/truncateText/truncateText.stories.d.ts +6 -0
  151. package/package.json +1 -1
  152. package/src/assets/icons/approval_pending.svg +8 -8
  153. package/src/assets/icons/configuration.svg +3 -3
  154. package/src/assets/icons/defects.svg +8 -8
  155. package/src/assets/icons/element.svg +4 -4
  156. package/src/assets/icons/project_element.svg +4 -4
  157. package/src/assets/icons/step_group.svg +10 -10
  158. package/src/assets/icons/variable.svg +3 -3
  159. package/src/assets/icons/web_service_icon.svg +3 -3
  160. package/src/components/AppHeader/AppHeader.scss +7 -1
  161. package/src/components/AppHeader/AppHeader.stories.tsx +1 -0
  162. package/src/components/AppHeader/AppHeader.tsx +8 -1
  163. package/src/components/AppHeader/types.ts +1 -0
  164. package/src/components/Comment/Comments.stories.tsx +77 -3
  165. package/src/components/ConnectingBranch/BranchComponents/MachineInstances.tsx +36 -27
  166. package/src/components/ConnectingBranch/ConnectingBranch.stories.tsx +10 -0
  167. package/src/components/ConnectingBranch/ConnectingBranch.tsx +36 -23
  168. package/src/components/ConnectingBranch/types.ts +2 -0
  169. package/src/components/Select/Select.stories.tsx +34 -10
  170. package/src/components/Select/Select.tsx +1 -0
  171. package/src/components/Select/components/Dropdown.tsx +24 -21
  172. package/src/components/SequentialConnectingBranch/components/Branches/Branches.tsx +19 -14
  173. package/src/components/TableTree/Components/AddModule/AddModule.scss +73 -1
  174. package/src/components/TableTree/Components/AddModule/AddModule.tsx +26 -2
  175. package/src/components/TableTree/Components/TableCell.tsx +122 -74
  176. package/src/components/TableTree/TableTree.scss +13 -2
  177. package/src/components/TableTree/TableTree.stories.tsx +5 -5
  178. package/src/components/TableTree/TableTree.tsx +2 -2
package/lib/index.js CHANGED
@@ -2957,7 +2957,7 @@ const Dropdown$1 = ({
2957
2957
  }),
2958
2958
  children: !checkEmpty(options) ? options.map(option => jsxRuntime.jsx("div", {
2959
2959
  className: classNames('ff-select-dropdown-option', {
2960
- 'ff-select-dropdown-option__selected': getLabel(option, valueAccessor) === selectedOption
2960
+ 'ff-select-dropdown-option__selected': getValue$1(option, valueAccessor) === selectedOption
2961
2961
  }, currentTheme),
2962
2962
  onClick: () => {
2963
2963
  if ('disable' in option && option['disable']) return;
@@ -3285,7 +3285,8 @@ const Select$1 = ({
3285
3285
  onSaveModal: onSaveModal,
3286
3286
  onCancelModal: onCancelModal,
3287
3287
  modalJSXProps: modalJSXProps,
3288
- recurrence: recurrence
3288
+ recurrence: recurrence,
3289
+ valueAccessor: valueAccessor
3289
3290
  }), document.body)
3290
3291
  })]
3291
3292
  });
@@ -4048,8 +4049,6 @@ function LiveRegion(_ref) {
4048
4049
  // Hide element visually but keep it readable by screen readers
4049
4050
  const visuallyHidden = {
4050
4051
  position: 'fixed',
4051
- top: 0,
4052
- left: 0,
4053
4052
  width: 1,
4054
4053
  height: 1,
4055
4054
  margin: -1,
@@ -5039,12 +5038,11 @@ var KeyboardCode;
5039
5038
  KeyboardCode["Up"] = "ArrowUp";
5040
5039
  KeyboardCode["Esc"] = "Escape";
5041
5040
  KeyboardCode["Enter"] = "Enter";
5042
- KeyboardCode["Tab"] = "Tab";
5043
5041
  })(KeyboardCode || (KeyboardCode = {}));
5044
5042
  const defaultKeyboardCodes = {
5045
5043
  start: [KeyboardCode.Space, KeyboardCode.Enter],
5046
5044
  cancel: [KeyboardCode.Esc],
5047
- end: [KeyboardCode.Space, KeyboardCode.Enter, KeyboardCode.Tab]
5045
+ end: [KeyboardCode.Space, KeyboardCode.Enter]
5048
5046
  };
5049
5047
  const defaultKeyboardCoordinateGetter = (event, _ref) => {
5050
5048
  let {
@@ -5343,9 +5341,6 @@ class AbstractPointerSensor {
5343
5341
  passive: false
5344
5342
  });
5345
5343
  this.listeners.add(events.end.name, this.handleEnd);
5346
- if (events.cancel) {
5347
- this.listeners.add(events.cancel.name, this.handleCancel);
5348
- }
5349
5344
  this.windowListeners.add(EventName.Resize, this.handleCancel);
5350
5345
  this.windowListeners.add(EventName.DragStart, preventDefault);
5351
5346
  this.windowListeners.add(EventName.VisibilityChange, this.handleCancel);
@@ -5361,11 +5356,9 @@ class AbstractPointerSensor {
5361
5356
  }
5362
5357
  if (isDelayConstraint(activationConstraint)) {
5363
5358
  this.timeoutId = setTimeout(this.handleStart, activationConstraint.delay);
5364
- this.handlePending(activationConstraint);
5365
5359
  return;
5366
5360
  }
5367
5361
  if (isDistanceConstraint(activationConstraint)) {
5368
- this.handlePending(activationConstraint);
5369
5362
  return;
5370
5363
  }
5371
5364
  }
@@ -5382,13 +5375,6 @@ class AbstractPointerSensor {
5382
5375
  this.timeoutId = null;
5383
5376
  }
5384
5377
  }
5385
- handlePending(constraint, offset) {
5386
- const {
5387
- active,
5388
- onPending
5389
- } = this.props;
5390
- onPending(active, constraint, this.initialCoordinates, offset);
5391
- }
5392
5378
  handleStart() {
5393
5379
  const {
5394
5380
  initialCoordinates
@@ -5442,7 +5428,6 @@ class AbstractPointerSensor {
5442
5428
  return this.handleCancel();
5443
5429
  }
5444
5430
  }
5445
- this.handlePending(activationConstraint, delta);
5446
5431
  return;
5447
5432
  }
5448
5433
  if (event.cancelable) {
@@ -5452,24 +5437,16 @@ class AbstractPointerSensor {
5452
5437
  }
5453
5438
  handleEnd() {
5454
5439
  const {
5455
- onAbort,
5456
5440
  onEnd
5457
5441
  } = this.props;
5458
5442
  this.detach();
5459
- if (!this.activated) {
5460
- onAbort(this.props.active);
5461
- }
5462
5443
  onEnd();
5463
5444
  }
5464
5445
  handleCancel() {
5465
5446
  const {
5466
- onAbort,
5467
5447
  onCancel
5468
5448
  } = this.props;
5469
5449
  this.detach();
5470
- if (!this.activated) {
5471
- onAbort(this.props.active);
5472
- }
5473
5450
  onCancel();
5474
5451
  }
5475
5452
  handleKeydown(event) {
@@ -5483,9 +5460,6 @@ class AbstractPointerSensor {
5483
5460
  }
5484
5461
  }
5485
5462
  const events = {
5486
- cancel: {
5487
- name: 'pointercancel'
5488
- },
5489
5463
  move: {
5490
5464
  name: 'pointermove'
5491
5465
  },
@@ -5558,9 +5532,6 @@ MouseSensor.activators = [{
5558
5532
  }
5559
5533
  }];
5560
5534
  const events$2 = {
5561
- cancel: {
5562
- name: 'touchcancel'
5563
- },
5564
5535
  move: {
5565
5536
  name: 'touchmove'
5566
5537
  },
@@ -5762,11 +5733,11 @@ function useScrollIntent(_ref2) {
5762
5733
  }, [disabled, delta, previousDelta]);
5763
5734
  }
5764
5735
  function useCachedNode(draggableNodes, id) {
5765
- const draggableNode = id != null ? draggableNodes.get(id) : undefined;
5736
+ const draggableNode = id !== null ? draggableNodes.get(id) : undefined;
5766
5737
  const node = draggableNode ? draggableNode.node.current : null;
5767
5738
  return useLazyMemo(cachedNode => {
5768
5739
  var _ref;
5769
- if (id == null) {
5740
+ if (id === null) {
5770
5741
  return null;
5771
5742
  } // In some cases, the draggable node can unmount while dragging
5772
5743
  // This is the case for virtualized lists. In those situations,
@@ -5974,26 +5945,7 @@ function useRect(element, measure, fallbackRect) {
5974
5945
  if (measure === void 0) {
5975
5946
  measure = defaultMeasure;
5976
5947
  }
5977
- const [rect, setRect] = React.useState(null);
5978
- function measureRect() {
5979
- setRect(currentRect => {
5980
- if (!element) {
5981
- return null;
5982
- }
5983
- if (element.isConnected === false) {
5984
- var _ref;
5985
-
5986
- // Fall back to last rect we measured if the element is
5987
- // no longer connected to the DOM.
5988
- return (_ref = currentRect != null ? currentRect : fallbackRect) != null ? _ref : null;
5989
- }
5990
- const newRect = measure(element);
5991
- if (JSON.stringify(currentRect) === JSON.stringify(newRect)) {
5992
- return currentRect;
5993
- }
5994
- return newRect;
5995
- });
5996
- }
5948
+ const [rect, measureRect] = React.useReducer(reducer, null);
5997
5949
  const mutationObserver = useMutationObserver({
5998
5950
  callback(records) {
5999
5951
  if (!element) {
@@ -6028,6 +5980,23 @@ function useRect(element, measure, fallbackRect) {
6028
5980
  }
6029
5981
  }, [element]);
6030
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
+ }
6031
6000
  }
6032
6001
  function useRectDelta(rect) {
6033
6002
  const initialRect = useInitialValue(rect);
@@ -6173,24 +6142,28 @@ function useRects(elements, measure) {
6173
6142
  }
6174
6143
  const [firstElement] = elements;
6175
6144
  const windowRect = useWindowRect(firstElement ? getWindow(firstElement) : null);
6176
- const [rects, setRects] = React.useState(defaultValue$2);
6177
- function measureRects() {
6178
- setRects(() => {
6179
- if (!elements.length) {
6180
- return defaultValue$2;
6181
- }
6182
- return elements.map(element => isDocumentScrollingElement(element) ? windowRect : new Rect(measure(element), element));
6183
- });
6184
- }
6145
+ const [rects, measureRects] = React.useReducer(reducer, defaultValue$2);
6185
6146
  const resizeObserver = useResizeObserver({
6186
6147
  callback: measureRects
6187
6148
  });
6188
- useIsomorphicLayoutEffect$1(() => {
6189
- resizeObserver == null ? void 0 : resizeObserver.disconnect();
6149
+ if (elements.length > 0 && rects === defaultValue$2) {
6190
6150
  measureRects();
6191
- 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
+ }
6192
6159
  }, [elements]);
6193
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
+ }
6194
6167
  }
6195
6168
  function getMeasurableNode(node) {
6196
6169
  if (!node) {
@@ -6357,7 +6330,7 @@ function reducer$1(state, action) {
6357
6330
  }
6358
6331
  };
6359
6332
  case Action.DragMove:
6360
- if (state.draggable.active == null) {
6333
+ if (!state.draggable.active) {
6361
6334
  return state;
6362
6335
  }
6363
6336
  return {
@@ -6629,7 +6602,7 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6629
6602
  containers: droppableContainers
6630
6603
  }
6631
6604
  } = state;
6632
- const node = activeId != null ? draggableNodes.get(activeId) : null;
6605
+ const node = activeId ? draggableNodes.get(activeId) : null;
6633
6606
  const activeRects = React.useRef({
6634
6607
  initial: null,
6635
6608
  translated: null
@@ -6664,7 +6637,7 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6664
6637
  const autoScrollOptions = getAutoScrollerOptions();
6665
6638
  const initialActiveNodeRect = useInitialRect(activeNode, measuringConfiguration.draggable.measure);
6666
6639
  useLayoutShiftScrollCompensation({
6667
- activeNode: activeId != null ? draggableNodes.get(activeId) : null,
6640
+ activeNode: activeId ? draggableNodes.get(activeId) : null,
6668
6641
  config: autoScrollOptions.layoutShiftCompensation,
6669
6642
  initialRect: initialActiveNodeRect,
6670
6643
  measure: measuringConfiguration.draggable.measure
@@ -6742,7 +6715,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6742
6715
 
6743
6716
  const appliedTranslate = usesDragOverlay ? modifiedTranslate : add(modifiedTranslate, activeNodeScrollDelta);
6744
6717
  const transform = adjustScale(appliedTranslate, (_over$rect = over == null ? void 0 : over.rect) != null ? _over$rect : null, activeNodeRect);
6745
- const activeSensorRef = React.useRef(null);
6746
6718
  const instantiateSensor = React.useCallback((event, _ref2) => {
6747
6719
  let {
6748
6720
  sensor: Sensor,
@@ -6764,43 +6736,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6764
6736
  // Sensors need to be instantiated with refs for arguments that change over time
6765
6737
  // otherwise they are frozen in time with the stale arguments
6766
6738
  context: sensorContext,
6767
- onAbort(id) {
6768
- const draggableNode = draggableNodes.get(id);
6769
- if (!draggableNode) {
6770
- return;
6771
- }
6772
- const {
6773
- onDragAbort
6774
- } = latestProps.current;
6775
- const event = {
6776
- id
6777
- };
6778
- onDragAbort == null ? void 0 : onDragAbort(event);
6779
- dispatchMonitorEvent({
6780
- type: 'onDragAbort',
6781
- event
6782
- });
6783
- },
6784
- onPending(id, constraint, initialCoordinates, offset) {
6785
- const draggableNode = draggableNodes.get(id);
6786
- if (!draggableNode) {
6787
- return;
6788
- }
6789
- const {
6790
- onDragPending
6791
- } = latestProps.current;
6792
- const event = {
6793
- id,
6794
- constraint,
6795
- initialCoordinates,
6796
- offset
6797
- };
6798
- onDragPending == null ? void 0 : onDragPending(event);
6799
- dispatchMonitorEvent({
6800
- type: 'onDragPending',
6801
- event
6802
- });
6803
- },
6804
6739
  onStart(initialCoordinates) {
6805
6740
  const id = activeRef.current;
6806
6741
  if (id == null) {
@@ -6814,7 +6749,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6814
6749
  onDragStart
6815
6750
  } = latestProps.current;
6816
6751
  const event = {
6817
- activatorEvent,
6818
6752
  active: {
6819
6753
  id,
6820
6754
  data: draggableNode.data,
@@ -6833,8 +6767,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6833
6767
  type: 'onDragStart',
6834
6768
  event
6835
6769
  });
6836
- setActiveSensor(activeSensorRef.current);
6837
- setActivatorEvent(activatorEvent);
6838
6770
  });
6839
6771
  },
6840
6772
  onMove(coordinates) {
@@ -6846,7 +6778,10 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6846
6778
  onEnd: createHandler(Action.DragEnd),
6847
6779
  onCancel: createHandler(Action.DragCancel)
6848
6780
  });
6849
- activeSensorRef.current = sensorInstance;
6781
+ ReactDOM.unstable_batchedUpdates(() => {
6782
+ setActiveSensor(sensorInstance);
6783
+ setActivatorEvent(event.nativeEvent);
6784
+ });
6850
6785
  function createHandler(type) {
6851
6786
  return async function handler() {
6852
6787
  const {
@@ -6883,7 +6818,6 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
6883
6818
  setOver(null);
6884
6819
  setActiveSensor(null);
6885
6820
  setActivatorEvent(null);
6886
- activeSensorRef.current = null;
6887
6821
  const eventName = type === Action.DragEnd ? 'onDragEnd' : 'onDragCancel';
6888
6822
  if (event) {
6889
6823
  const handler = latestProps.current[eventName];
@@ -7105,7 +7039,7 @@ const DndContext = /*#__PURE__*/React.memo(function DndContext(_ref) {
7105
7039
  });
7106
7040
  const NullContext = /*#__PURE__*/React.createContext(null);
7107
7041
  const defaultRole = 'button';
7108
- const ID_PREFIX$1 = 'Draggable';
7042
+ const ID_PREFIX$1 = 'Droppable';
7109
7043
  function useDraggable(_ref) {
7110
7044
  let {
7111
7045
  id,
@@ -7252,7 +7186,7 @@ function useDroppable(_ref) {
7252
7186
  resizeObserverConnected.current = false;
7253
7187
  resizeObserver.observe(nodeRef.current);
7254
7188
  }, [nodeRef, resizeObserver]);
7255
- React.useEffect(() => {
7189
+ useIsomorphicLayoutEffect$1(() => {
7256
7190
  dispatch({
7257
7191
  type: Action.RegisterDroppable,
7258
7192
  element: {
@@ -7667,7 +7601,6 @@ var DNDCore = /*#__PURE__*/Object.freeze({
7667
7601
  defaultCoordinates: defaultCoordinates,
7668
7602
  defaultDropAnimation: defaultDropAnimationConfiguration,
7669
7603
  defaultDropAnimationSideEffects: defaultDropAnimationSideEffects,
7670
- defaultKeyboardCoordinateGetter: defaultKeyboardCoordinateGetter,
7671
7604
  defaultScreenReaderInstructions: defaultScreenReaderInstructions,
7672
7605
  getClientRect: getClientRect,
7673
7606
  getFirstCollision: getFirstCollision,
@@ -11505,14 +11438,13 @@ var isWeb = typeof window !== 'undefined' &&
11505
11438
  function cloneObject(data) {
11506
11439
  let copy;
11507
11440
  const isArray = Array.isArray(data);
11508
- const isFileListInstance = typeof FileList !== 'undefined' ? data instanceof FileList : false;
11509
11441
  if (data instanceof Date) {
11510
11442
  copy = new Date(data);
11511
11443
  }
11512
11444
  else if (data instanceof Set) {
11513
11445
  copy = new Set(data);
11514
11446
  }
11515
- else if (!(isWeb && (data instanceof Blob || isFileListInstance)) &&
11447
+ else if (!(isWeb && (data instanceof Blob || data instanceof FileList)) &&
11516
11448
  (isArray || isObject$2(data))) {
11517
11449
  copy = isArray ? [] : {};
11518
11450
  if (!isArray && !isPlainObject(data)) {
@@ -11571,7 +11503,7 @@ var set$1 = (object, path, value) => {
11571
11503
  ? []
11572
11504
  : {};
11573
11505
  }
11574
- if (key === '__proto__' || key === 'constructor' || key === 'prototype') {
11506
+ if (key === '__proto__') {
11575
11507
  return;
11576
11508
  }
11577
11509
  object[key] = newValue;
@@ -11790,7 +11722,7 @@ function useFormState(props) {
11790
11722
  _mounted.current = false;
11791
11723
  };
11792
11724
  }, [control]);
11793
- return React.useMemo(() => getProxyFormState(formState, control, _localProxyFormState.current, false), [formState, control]);
11725
+ return getProxyFormState(formState, control, _localProxyFormState.current, false);
11794
11726
  }
11795
11727
 
11796
11728
  var isString = (value) => typeof value === 'string';
@@ -11886,67 +11818,6 @@ function useController(props) {
11886
11818
  value,
11887
11819
  ...(isBoolean(props.disabled) ? { disabled: props.disabled } : {}),
11888
11820
  }));
11889
- const fieldState = React.useMemo(() => 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
- }), [formState, name]);
11911
- const field = React.useMemo(() => ({
11912
- name,
11913
- value,
11914
- ...(isBoolean(disabled) || formState.disabled
11915
- ? { disabled: formState.disabled || disabled }
11916
- : {}),
11917
- onChange: (event) => _registerProps.current.onChange({
11918
- target: {
11919
- value: getEventValue(event),
11920
- name: name,
11921
- },
11922
- type: EVENTS.CHANGE,
11923
- }),
11924
- onBlur: () => _registerProps.current.onBlur({
11925
- target: {
11926
- value: get$1(control._formValues, name),
11927
- name: name,
11928
- },
11929
- type: EVENTS.BLUR,
11930
- }),
11931
- ref: (elm) => {
11932
- const field = get$1(control._fields, name);
11933
- if (field && elm) {
11934
- field._f.ref = {
11935
- focus: () => elm.focus(),
11936
- select: () => elm.select(),
11937
- setCustomValidity: (message) => elm.setCustomValidity(message),
11938
- reportValidity: () => elm.reportValidity(),
11939
- };
11940
- }
11941
- },
11942
- }), [
11943
- name,
11944
- control._formValues,
11945
- disabled,
11946
- formState.disabled,
11947
- value,
11948
- control._fields,
11949
- ]);
11950
11821
  React.useEffect(() => {
11951
11822
  const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;
11952
11823
  const updateMounted = (name, value) => {
@@ -11972,7 +11843,7 @@ function useController(props) {
11972
11843
  };
11973
11844
  }, [name, control, isArrayField, shouldUnregister]);
11974
11845
  React.useEffect(() => {
11975
- if (isBoolean(disabled) && get$1(control._fields, name)) {
11846
+ if (get$1(control._fields, name)) {
11976
11847
  control._updateDisabledField({
11977
11848
  disabled,
11978
11849
  fields: control._fields,
@@ -11981,11 +11852,63 @@ function useController(props) {
11981
11852
  });
11982
11853
  }
11983
11854
  }, [disabled, name, control]);
11984
- return React.useMemo(() => ({
11985
- 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
+ },
11986
11888
  formState,
11987
- fieldState,
11988
- }), [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
+ };
11989
11912
  }
11990
11913
 
11991
11914
  /**
@@ -12035,7 +11958,7 @@ const Controller = (props) => props.render(useController(props));
12035
11958
  const flatten = (obj) => {
12036
11959
  const output = {};
12037
11960
  for (const key of Object.keys(obj)) {
12038
- if (isObjectType(obj[key]) && obj[key] !== null) {
11961
+ if (isObjectType(obj[key])) {
12039
11962
  const nested = flatten(obj[key]);
12040
11963
  for (const nestedKey of Object.keys(nested)) {
12041
11964
  output[`${key}.${nestedKey}`] = nested[nestedKey];
@@ -12104,7 +12027,7 @@ function Form(props) {
12104
12027
  headers && headers['Content-Type'],
12105
12028
  encType,
12106
12029
  ].some((value) => value && value.includes('json'));
12107
- const response = await fetch(String(action), {
12030
+ const response = await fetch(action, {
12108
12031
  method,
12109
12032
  headers: {
12110
12033
  ...headers,
@@ -12602,7 +12525,7 @@ var updateAt = (fieldValues, index, value) => {
12602
12525
  */
12603
12526
  function useFieldArray(props) {
12604
12527
  const methods = useFormContext();
12605
- const { control = methods.control, name, keyName = 'id', shouldUnregister, rules, } = props;
12528
+ const { control = methods.control, name, keyName = 'id', shouldUnregister, } = props;
12606
12529
  const [fields, setFields] = React.useState(control._getFieldArray(name));
12607
12530
  const ids = React.useRef(control._getFieldArray(name).map(generateId));
12608
12531
  const _fieldIds = React.useRef(fields);
@@ -12611,8 +12534,8 @@ function useFieldArray(props) {
12611
12534
  _name.current = name;
12612
12535
  _fieldIds.current = fields;
12613
12536
  control._names.array.add(name);
12614
- rules &&
12615
- control.register(name, rules);
12537
+ props.rules &&
12538
+ control.register(name, props.rules);
12616
12539
  useSubscribe({
12617
12540
  next: ({ values, name: fieldArrayName, }) => {
12618
12541
  if (fieldArrayName === _name.current || !fieldArrayName) {
@@ -12656,8 +12579,6 @@ function useFieldArray(props) {
12656
12579
  ids.current = removeArrayAt(ids.current, index);
12657
12580
  updateValues(updatedFieldArrayValues);
12658
12581
  setFields(updatedFieldArrayValues);
12659
- !Array.isArray(get$1(control._fields, name)) &&
12660
- set$1(control._fields, name, undefined);
12661
12582
  control._updateFieldArray(name, updatedFieldArrayValues, removeArrayAt, {
12662
12583
  argA: index,
12663
12584
  });
@@ -12972,8 +12893,7 @@ var getRuleValue = (rule) => isUndefined(rule)
12972
12893
  : rule;
12973
12894
 
12974
12895
  const ASYNC_FUNCTION = 'AsyncFunction';
12975
- var hasPromiseValidation = (fieldReference) => !!fieldReference &&
12976
- !!fieldReference.validate &&
12896
+ var hasPromiseValidation = (fieldReference) => (!fieldReference || !fieldReference.validate) &&
12977
12897
  !!((isFunction$1(fieldReference.validate) &&
12978
12898
  fieldReference.validate.constructor.name === ASYNC_FUNCTION) ||
12979
12899
  (isObject$2(fieldReference.validate) &&
@@ -13102,7 +13022,7 @@ function createFormControl(props = {}) {
13102
13022
  timer = setTimeout(callback, wait);
13103
13023
  };
13104
13024
  const _updateValid = async (shouldUpdateValid) => {
13105
- if (!_options.disabled && (_proxyFormState.isValid || shouldUpdateValid)) {
13025
+ if (!props.disabled && (_proxyFormState.isValid || shouldUpdateValid)) {
13106
13026
  const isValid = _options.resolver
13107
13027
  ? isEmptyObject((await _executeSchema()).errors)
13108
13028
  : await executeBuiltInValidation(_fields, true);
@@ -13114,7 +13034,7 @@ function createFormControl(props = {}) {
13114
13034
  }
13115
13035
  };
13116
13036
  const _updateIsValidating = (names, isValidating) => {
13117
- if (!_options.disabled &&
13037
+ if (!props.disabled &&
13118
13038
  (_proxyFormState.isValidating || _proxyFormState.validatingFields)) {
13119
13039
  (names || Array.from(_names.mount)).forEach((name) => {
13120
13040
  if (name) {
@@ -13130,7 +13050,7 @@ function createFormControl(props = {}) {
13130
13050
  }
13131
13051
  };
13132
13052
  const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
13133
- if (args && method && !_options.disabled) {
13053
+ if (args && method && !props.disabled) {
13134
13054
  _state.action = true;
13135
13055
  if (shouldUpdateFieldsAndState && Array.isArray(get$1(_fields, name))) {
13136
13056
  const fieldValues = method(get$1(_fields, name), args.argA, args.argB);
@@ -13194,7 +13114,7 @@ function createFormControl(props = {}) {
13194
13114
  const output = {
13195
13115
  name,
13196
13116
  };
13197
- if (!_options.disabled) {
13117
+ if (!props.disabled) {
13198
13118
  const disabledField = !!(get$1(_fields, name) &&
13199
13119
  get$1(_fields, name)._f &&
13200
13120
  get$1(_fields, name)._f.disabled);
@@ -13235,9 +13155,9 @@ function createFormControl(props = {}) {
13235
13155
  const shouldUpdateValid = _proxyFormState.isValid &&
13236
13156
  isBoolean(isValid) &&
13237
13157
  _formState.isValid !== isValid;
13238
- if (_options.delayError && error) {
13158
+ if (props.delayError && error) {
13239
13159
  delayErrorCallback = debounce(() => updateErrors(name, error));
13240
- delayErrorCallback(_options.delayError);
13160
+ delayErrorCallback(props.delayError);
13241
13161
  }
13242
13162
  else {
13243
13163
  clearTimeout(timer);
@@ -13330,7 +13250,7 @@ function createFormControl(props = {}) {
13330
13250
  }
13331
13251
  _names.unMount = new Set();
13332
13252
  };
13333
- const _getDirty = (name, data) => !_options.disabled &&
13253
+ const _getDirty = (name, data) => !props.disabled &&
13334
13254
  (name && data && set$1(_formValues, name, data),
13335
13255
  !deepEqual(getValues(), _defaultValues));
13336
13256
  const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {
@@ -13342,7 +13262,7 @@ function createFormControl(props = {}) {
13342
13262
  ? { [names]: defaultValue }
13343
13263
  : defaultValue),
13344
13264
  }, isGlobal, defaultValue);
13345
- 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, []) : []));
13346
13266
  const setFieldValue = (name, value, options = {}) => {
13347
13267
  const field = get$1(_fields, name);
13348
13268
  let fieldValue = value;
@@ -13475,7 +13395,7 @@ function createFormControl(props = {}) {
13475
13395
  });
13476
13396
  if (shouldSkipValidation) {
13477
13397
  if (_proxyFormState.isValid) {
13478
- if (_options.mode === 'onBlur') {
13398
+ if (props.mode === 'onBlur') {
13479
13399
  if (isBlurEvent) {
13480
13400
  _updateValid();
13481
13401
  }
@@ -13640,15 +13560,13 @@ function createFormControl(props = {}) {
13640
13560
  : isUndefined(value)
13641
13561
  ? getFieldValue(field ? field._f : get$1(fields, name)._f)
13642
13562
  : value;
13643
- if (disabled || (!disabled && !isUndefined(inputValue))) {
13644
- set$1(_formValues, name, inputValue);
13645
- }
13563
+ set$1(_formValues, name, inputValue);
13646
13564
  updateTouchAndDirty(name, inputValue, false, false, true);
13647
13565
  }
13648
13566
  };
13649
13567
  const register = (name, options = {}) => {
13650
13568
  let field = get$1(_fields, name);
13651
- const disabledIsDefined = isBoolean(options.disabled) || isBoolean(_options.disabled);
13569
+ const disabledIsDefined = isBoolean(options.disabled) || isBoolean(props.disabled);
13652
13570
  set$1(_fields, name, {
13653
13571
  ...(field || {}),
13654
13572
  _f: {
@@ -13664,7 +13582,7 @@ function createFormControl(props = {}) {
13664
13582
  field,
13665
13583
  disabled: isBoolean(options.disabled)
13666
13584
  ? options.disabled
13667
- : _options.disabled,
13585
+ : props.disabled,
13668
13586
  name,
13669
13587
  value: options.value,
13670
13588
  });
@@ -13674,7 +13592,7 @@ function createFormControl(props = {}) {
13674
13592
  }
13675
13593
  return {
13676
13594
  ...(disabledIsDefined
13677
- ? { disabled: options.disabled || _options.disabled }
13595
+ ? { disabled: options.disabled || props.disabled }
13678
13596
  : {}),
13679
13597
  ...(_options.progressive
13680
13598
  ? {
@@ -13758,12 +13676,6 @@ function createFormControl(props = {}) {
13758
13676
  e.preventDefault && e.preventDefault();
13759
13677
  e.persist && e.persist();
13760
13678
  }
13761
- if (_options.disabled) {
13762
- if (onInvalid) {
13763
- await onInvalid({ ..._formState.errors }, e);
13764
- }
13765
- return;
13766
- }
13767
13679
  let fieldValues = cloneObject(_formValues);
13768
13680
  _subjects.state.next({
13769
13681
  isSubmitting: true,
@@ -13871,7 +13783,7 @@ function createFormControl(props = {}) {
13871
13783
  }
13872
13784
  _fields = {};
13873
13785
  }
13874
- _formValues = _options.shouldUnregister
13786
+ _formValues = props.shouldUnregister
13875
13787
  ? keepStateOptions.keepDefaultValues
13876
13788
  ? cloneObject(_defaultValues)
13877
13789
  : {}
@@ -13895,7 +13807,7 @@ function createFormControl(props = {}) {
13895
13807
  !_proxyFormState.isValid ||
13896
13808
  !!keepStateOptions.keepIsValid ||
13897
13809
  !!keepStateOptions.keepDirtyValues;
13898
- _state.watch = !!_options.shouldUnregister;
13810
+ _state.watch = !!props.shouldUnregister;
13899
13811
  _subjects.state.next({
13900
13812
  submitCount: keepStateOptions.keepSubmitCount
13901
13813
  ? _formState.submitCount
@@ -13942,9 +13854,7 @@ function createFormControl(props = {}) {
13942
13854
  : fieldReference.ref;
13943
13855
  if (fieldRef.focus) {
13944
13856
  fieldRef.focus();
13945
- options.shouldSelect &&
13946
- isFunction$1(fieldRef.select) &&
13947
- fieldRef.select();
13857
+ options.shouldSelect && fieldRef.select();
13948
13858
  }
13949
13859
  }
13950
13860
  };
@@ -14066,8 +13976,8 @@ function createFormControl(props = {}) {
14066
13976
  * ```
14067
13977
  */
14068
13978
  function useForm(props = {}) {
14069
- const _formControl = React.useRef(undefined);
14070
- const _values = React.useRef(undefined);
13979
+ const _formControl = React.useRef();
13980
+ const _values = React.useRef();
14071
13981
  const [formState, updateFormState] = React.useState({
14072
13982
  isDirty: false,
14073
13983
  isValidating: false,
@@ -14145,6 +14055,11 @@ function useForm(props = {}) {
14145
14055
  values: control._getWatch(),
14146
14056
  });
14147
14057
  }, [props.shouldUnregister, control]);
14058
+ React.useEffect(() => {
14059
+ if (_formControl.current) {
14060
+ _formControl.current.watch = _formControl.current.watch.bind({});
14061
+ }
14062
+ }, [formState]);
14148
14063
  _formControl.current.formState = getProxyFormState(formState, control);
14149
14064
  return _formControl.current;
14150
14065
  }
@@ -14586,7 +14501,7 @@ const MiniModal = /*#__PURE__*/React.forwardRef(({
14586
14501
  }), document.body);
14587
14502
  });
14588
14503
 
14589
- 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}\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\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 {\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: 400px !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}\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-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}\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}";
14590
14505
  styleInject(css_248z$R);
14591
14506
 
14592
14507
  const TableHead = /*#__PURE__*/React.memo(({
@@ -14628,7 +14543,7 @@ const TableHead = /*#__PURE__*/React.memo(({
14628
14543
  });
14629
14544
  });
14630
14545
 
14631
- var css_248z$Q = ".add-module-container {\n display: flex;\n}\n.add-module-container .icons {\n cursor: pointer;\n}";
14546
+ var css_248z$Q = ".fontXs, .add-module-container .ff-add-module-input-container:focus-within .ff-add-module-label-container, .add-module-container .ff-add-module-input-container--float .ff-add-module-label-container {\n font-family: \"Poppins\";\n font-size: 10px;\n}\n\n.fontSm {\n font-family: \"Poppins\";\n font-size: 12px;\n}\n\n.fontMd {\n font-family: \"Poppins\";\n font-size: 14px;\n}\n\n.fontLg {\n font-family: \"Poppins\";\n font-size: 16px;\n}\n\n.fontXL {\n font-family: \"Poppins\";\n font-size: 18px;\n}\n\n.font2Xl {\n font-family: \"Poppins\";\n font-size: 24px;\n}\n\n.font-size-8 {\n font-family: \"Poppins\";\n font-size: 8px;\n}\n\n.font-size-20 {\n font-family: \"Poppins\";\n font-size: 20px;\n}\n\n.font-size-32 {\n font-family: \"Poppins\";\n font-size: 32px;\n}\n\n.font-size-80 {\n font-family: \"Poppins\";\n font-size: 80px;\n}\n\n.add-module-container {\n display: flex;\n}\n.add-module-container .icons {\n cursor: pointer;\n}\n.add-module-container .ff-add-module-input-container {\n display: flex;\n flex-direction: column;\n position: relative;\n}\n.add-module-container .ff-add-module-input-container .ff-add-module-label-container {\n display: flex;\n gap: 2px;\n position: absolute;\n border: none;\n outline: none;\n line-height: 18px;\n margin-top: 1px;\n padding: 4px 6px;\n transition: all 0.3s ease-in-out;\n}\n.add-module-container .ff-add-module-input-container .ff-add-module-label-container .ff-add-module-label {\n color: var(--input-default-label-color);\n}\n.add-module-container .ff-add-module-input-container .add-module-input {\n height: 24px;\n padding: 0px 6px;\n width: 330px;\n border: 0.5px solid var(--nlp-color);\n border-radius: 4px;\n outline: none;\n line-height: 18px;\n color: var(--nlp-color);\n}\n.add-module-container .ff-add-module-input-container:focus-within .ff-add-module-label-container {\n top: -9px;\n background-color: var(--input-label-bg-color);\n line-height: 15px;\n padding: 0px 2px;\n margin-left: 10px;\n}\n.add-module-container .ff-add-module-input-container:focus-within .ff-add-module-label-container .ff-add-module-label {\n color: var(--nlp-color);\n}\n.add-module-container .ff-add-module-input-container--float .ff-add-module-label-container {\n top: -9px;\n background-color: var(--input-label-bg-color);\n line-height: 15px;\n padding: 0px 2px;\n margin-left: 10px;\n}\n.add-module-container .ff-add-module-input-container--float .ff-add-module-label-container .ff-add-module-label {\n color: var(--nlp-color);\n}\n.add-module-container .ff-module-icon-container {\n display: flex;\n gap: 8px;\n align-items: center;\n}";
14632
14547
  styleInject(css_248z$Q);
14633
14548
 
14634
14549
  const AddModule = ({
@@ -14639,22 +14554,47 @@ const AddModule = ({
14639
14554
  }) => {
14640
14555
  console.log('🚀 ~ value:', value);
14641
14556
  const [text, setText] = React.useState(value);
14557
+ const isValueFilled = !checkEmpty(text);
14642
14558
  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
14643
14559
  children: [jsxRuntime.jsxs("div", {
14644
- className: "add-module-container",
14645
- children: [jsxRuntime.jsx("input", {
14646
- type: "text",
14647
- className: "add-module-input",
14648
- onChange: e => setText(e.target.value),
14649
- value: text
14650
- }), jsxRuntime.jsx(Icon, {
14651
- className: "icons",
14652
- name: "update_icon",
14653
- onClick: () => onConfirm && onConfirm(text)
14654
- }), jsxRuntime.jsx(Icon, {
14655
- className: "icons",
14656
- name: "close",
14657
- onClick: onCancel
14560
+ className: classNames("add-module-container"),
14561
+ children: [jsxRuntime.jsxs("div", {
14562
+ className: classNames("ff-add-module-input-container", {
14563
+ 'ff-add-module-input-container--float': isValueFilled
14564
+ }),
14565
+ children: [jsxRuntime.jsx("label", {
14566
+ className: 'ff-add-module-label-container',
14567
+ htmlFor: 'add-module-input',
14568
+ children: jsxRuntime.jsx("span", {
14569
+ className: classNames('ff-add-module-label', {
14570
+ 'ff-input-label--no-hover': !!text
14571
+ }),
14572
+ children: "Edit Script"
14573
+ })
14574
+ }), jsxRuntime.jsx("input", {
14575
+ name: 'add-module-input',
14576
+ type: "text",
14577
+ className: "add-module-input",
14578
+ onChange: e => setText(e.target.value),
14579
+ value: text
14580
+ })]
14581
+ }), jsxRuntime.jsxs("div", {
14582
+ className: "ff-module-icon-container",
14583
+ children: [jsxRuntime.jsx(Icon, {
14584
+ className: "icons",
14585
+ name: "update_icon",
14586
+ onClick: () => onConfirm && onConfirm(text),
14587
+ color: 'var(--label-edit-confirm-icon)',
14588
+ height: 18,
14589
+ width: 18
14590
+ }), jsxRuntime.jsx(Icon, {
14591
+ className: "icons",
14592
+ name: "close",
14593
+ onClick: onCancel,
14594
+ color: 'var(--label-edit-cancel-icon)',
14595
+ height: 14,
14596
+ width: 14
14597
+ })]
14658
14598
  })]
14659
14599
  }), jsxRuntime.jsx("small", {
14660
14600
  children: error
@@ -14668,7 +14608,7 @@ const renderSpaces = (level, parentSiblings = [], isLast, isContainer) => {
14668
14608
  if (checkEmpty(parentSiblings)) {
14669
14609
  isLastNode = false;
14670
14610
  if (!isNaN(level)) {
14671
- siblingsArray = Array(level).fill(true);
14611
+ siblingsArray = Array(level - 1).fill(true);
14672
14612
  }
14673
14613
  }
14674
14614
  return jsxRuntime.jsx("div", {
@@ -14688,47 +14628,79 @@ const TableCell = /*#__PURE__*/React.memo(({
14688
14628
  onToggleExpand,
14689
14629
  onAddConfirm,
14690
14630
  onAddCancel
14691
- }) => jsxRuntime.jsxs("td", {
14692
- className: `ff-table-tree-td ${col.isTree && node.container ? 'folder' : ''}`,
14693
- children: [col.isTree && renderSpaces(node.hierarchy + 1, node.parentSiblings, node.lastResource, node.container), jsxRuntime.jsxs("div", {
14694
- className: "tree-title-container",
14695
- children: [col.isTree && jsxRuntime.jsx("span", {
14696
- className: `tree-table-space-block last-block ${node.expand ? 'tree-row-expanded' : 'tree-row-collapsed'} ${node.container ? '' : 'no-folder'}`,
14697
- onClick: () => onToggleExpand(node),
14698
- children: node.container && node?.resourceCount + node?.subContainerCount > 0 && jsxRuntime.jsxs("span", {
14699
- onClick: () => onToggleExpand(node),
14700
- children: [' ', jsxRuntime.jsx(SvgArrowsDownIcon, {})]
14701
- })
14702
- }), jsxRuntime.jsxs("span", {
14703
- className: `tree-table-td-content ${col.isTree && node.container ? 'folder' : ''}`,
14704
- children: [!node?.isNewNode && jsxRuntime.jsxs(jsxRuntime.Fragment, {
14705
- children: [col.isTree && select === 'checkbox' && jsxRuntime.jsx(Checkbox, {
14706
- checked: node?.checked || false,
14707
- partial: node?.checked === 'partial',
14708
- onChange: e => onCheckBoxChange(e, node)
14709
- }), col.isTree && select === 'radio' && jsxRuntime.jsx(RadioButton, {
14710
- name: node.title,
14711
- checked: selected.includes(node.id),
14712
- value: node.id,
14713
- onChange: e => onCheckBoxChange(e, node)
14631
+ }) => {
14632
+ React.useEffect(() => {
14633
+ const handleHover = (event, isHovering) => {
14634
+ const target = event.target;
14635
+ const levelClass = Array.from(target.classList).find(cls => cls.startsWith('tree-table-space-block-'));
14636
+ if (levelClass) {
14637
+ const level = levelClass.split('-').pop();
14638
+ // Check if level is valid before selecting elements
14639
+ if (level) {
14640
+ const sameLevelBlocks = document.querySelectorAll(`.tree-table-space-block-${level}`);
14641
+ sameLevelBlocks.forEach(block => {
14642
+ if (isHovering) {
14643
+ block.classList.add('tree-table-hovered');
14644
+ } else {
14645
+ block.classList.remove('tree-table-hovered');
14646
+ }
14647
+ });
14648
+ }
14649
+ }
14650
+ };
14651
+ const spaceBlocks = document.querySelectorAll('.tree-table-space-block');
14652
+ spaceBlocks.forEach(block => {
14653
+ block.addEventListener('mouseenter', e => handleHover(e, true));
14654
+ block.addEventListener('mouseleave', e => handleHover(e, false));
14655
+ });
14656
+ return () => {
14657
+ spaceBlocks.forEach(block => {
14658
+ block.removeEventListener('mouseenter', e => handleHover(e, true));
14659
+ block.removeEventListener('mouseleave', e => handleHover(e, false));
14660
+ });
14661
+ };
14662
+ }, []);
14663
+ return jsxRuntime.jsxs("td", {
14664
+ className: `ff-table-tree-td ${col.isTree && node.container ? 'folder' : ''}`,
14665
+ children: [col.isTree && renderSpaces(node.hierarchy + 1, node.parentSiblings, node.lastResource, node.container), jsxRuntime.jsxs("div", {
14666
+ className: "tree-title-container",
14667
+ children: [col.isTree && jsxRuntime.jsx("span", {
14668
+ className: `tree-table-space-block tree-table-space-block-${node.hierarchy} last-block ${node.expand ? 'tree-row-expanded' : 'tree-row-collapsed'} ${node.container ? '' : 'no-folder'}`,
14669
+ children: node.container && (node?.resourceCount + node?.subContainerCount > 0 || node.expandable) && jsxRuntime.jsxs("span", {
14670
+ onClick: () => onToggleExpand(node),
14671
+ children: [' ', jsxRuntime.jsx(SvgArrowsDownIcon, {})]
14672
+ })
14673
+ }), jsxRuntime.jsxs("span", {
14674
+ className: `tree-table-td-content ${col.isTree && node.container ? 'folder' : ''}`,
14675
+ children: [!node?.isNewNode && jsxRuntime.jsxs(jsxRuntime.Fragment, {
14676
+ children: [col.isTree && select === 'checkbox' && jsxRuntime.jsx(Checkbox, {
14677
+ checked: node?.checked || false,
14678
+ partial: node?.checked === 'partial',
14679
+ onChange: e => onCheckBoxChange(e, node)
14680
+ }), col.isTree && select === 'radio' && jsxRuntime.jsx(RadioButton, {
14681
+ name: node.key,
14682
+ checked: selected.includes(node.key),
14683
+ value: node.key,
14684
+ onChange: e => onCheckBoxChange(e, node)
14685
+ })]
14686
+ }), node.isNewNode && col.isTree ? jsxRuntime.jsx(AddModule, {
14687
+ onCancel: onAddCancel,
14688
+ onConfirm: onAddConfirm,
14689
+ error: node?.error || '',
14690
+ value: node.value
14691
+ }) : jsxRuntime.jsx("span", {
14692
+ className: "tree-table-td-content-text",
14693
+ children: prepareData(node, col)
14714
14694
  })]
14715
- }), node.isNewNode && col.isTree ? jsxRuntime.jsx(AddModule, {
14716
- onCancel: onAddCancel,
14717
- onConfirm: onAddConfirm,
14718
- error: node?.error || '',
14719
- value: node.value
14720
- }) : jsxRuntime.jsx("span", {
14721
- className: "tree-table-td-content-text",
14722
- children: prepareData(node, col)
14723
14695
  })]
14696
+ }), col.actions && jsxRuntime.jsx("div", {
14697
+ className: `table-tree-row-action`,
14698
+ children: (() => {
14699
+ return col.actions(node, treeRowRef);
14700
+ })()
14724
14701
  })]
14725
- }), col.actions && jsxRuntime.jsx("div", {
14726
- className: `table-tree-row-action`,
14727
- children: (() => {
14728
- return col.actions(node, treeRowRef);
14729
- })()
14730
- })]
14731
- }));
14702
+ });
14703
+ });
14732
14704
 
14733
14705
  const TableRow = /*#__PURE__*/React.memo(({
14734
14706
  node,
@@ -14892,8 +14864,8 @@ const TreeTable = ({
14892
14864
  const lastNode = document.getElementById('ff-table-tree-last-node');
14893
14865
  // Exit early if essential elements or data are missing
14894
14866
  if (!scrollContainer || !firstNode || !lastNode || !treeData?.length) return;
14895
- const isLastResourceAbove = treeData[0]?.lastResource;
14896
- const isLastResourceBelow = treeData[treeData.length - 1]?.lastResource;
14867
+ const isLastResourceAbove = !!treeData[0]?.lastResource;
14868
+ const isLastResourceBelow = !!treeData[treeData.length - 1]?.lastResource;
14897
14869
  // Skip pagination if both last resources are present
14898
14870
  if (isLastResourceAbove && isLastResourceBelow) return;
14899
14871
  const observerCallback = entries => {
@@ -18653,53 +18625,6 @@ function setYear(date, year, options) {
18653
18625
  return date_;
18654
18626
  }
18655
18627
 
18656
- const FIVE_WEEKS = 5;
18657
- const FOUR_WEEKS = 4;
18658
- /**
18659
- * Return the number of weeks to display in the broadcast calendar.
18660
- *
18661
- * @since 9.4.0
18662
- */
18663
- function getBroadcastWeeksInMonth(month, dateLib) {
18664
- // Get the first day of the month
18665
- const firstDayOfMonth = dateLib.startOfMonth(month);
18666
- // Get the day of the week for the first day of the month (1-7, where 1 is Monday)
18667
- const firstDayOfWeek = firstDayOfMonth.getDay() > 0 ? firstDayOfMonth.getDay() : 7;
18668
- const broadcastStartDate = dateLib.addDays(month, -firstDayOfWeek + 1);
18669
- const lastDateOfLastWeek = dateLib.addDays(broadcastStartDate, FIVE_WEEKS * 7 - 1);
18670
- const numberOfWeeks = month.getMonth() === lastDateOfLastWeek.getMonth() ? FIVE_WEEKS : FOUR_WEEKS;
18671
- return numberOfWeeks;
18672
- }
18673
-
18674
- /**
18675
- * Return the start date of the week in the broadcast calendar.
18676
- *
18677
- * @since 9.4.0
18678
- */
18679
- function startOfBroadcastWeek(date, dateLib) {
18680
- const firstOfMonth = dateLib.startOfMonth(date);
18681
- const dayOfWeek = firstOfMonth.getDay();
18682
- if (dayOfWeek === 1) {
18683
- return firstOfMonth;
18684
- } else if (dayOfWeek === 0) {
18685
- return dateLib.addDays(firstOfMonth, -1 * 6);
18686
- } else {
18687
- return dateLib.addDays(firstOfMonth, -1 * (dayOfWeek - 1));
18688
- }
18689
- }
18690
-
18691
- /**
18692
- * Return the end date of the week in the broadcast calendar.
18693
- *
18694
- * @since 9.4.0
18695
- */
18696
- function endOfBroadcastWeek(date, dateLib) {
18697
- const startDate = startOfBroadcastWeek(date, dateLib);
18698
- const numberOfWeeks = getBroadcastWeeksInMonth(date, dateLib);
18699
- const endDate = dateLib.addDays(startDate, numberOfWeeks * 7 - 1);
18700
- return endDate;
18701
- }
18702
-
18703
18628
  /**
18704
18629
  * A wrapper class around [date-fns](http://date-fns.org) sharing the same
18705
18630
  * options. Methods of this class can be overridden using the
@@ -18780,15 +18705,6 @@ class DateLib {
18780
18705
  this.differenceInCalendarMonths = (dateLeft, dateRight) => {
18781
18706
  return this.overrides?.differenceInCalendarMonths ? this.overrides.differenceInCalendarMonths(dateLeft, dateRight) : differenceInCalendarMonths(dateLeft, dateRight);
18782
18707
  };
18783
- /**
18784
- * Returns the end of the broadcast week for the given date.
18785
- *
18786
- * @param date The original date.
18787
- * @returns The end of the broadcast week.
18788
- */
18789
- this.endOfBroadcastWeek = date => {
18790
- return this.overrides?.endOfBroadcastWeek ? this.overrides.endOfBroadcastWeek(date, this) : endOfBroadcastWeek(date, this);
18791
- };
18792
18708
  /**
18793
18709
  * Returns the end of the ISO week for the given date.
18794
18710
  *
@@ -18950,15 +18866,6 @@ class DateLib {
18950
18866
  this.setYear = (date, year) => {
18951
18867
  return this.overrides?.setYear ? this.overrides.setYear(date, year) : setYear(date, year);
18952
18868
  };
18953
- /**
18954
- * Returns the start of the broadcast week for the given date.
18955
- *
18956
- * @param date The original date.
18957
- * @returns The start of the broadcast week.
18958
- */
18959
- this.startOfBroadcastWeek = date => {
18960
- return this.overrides?.startOfBroadcastWeek ? this.overrides.startOfBroadcastWeek(date, this) : startOfBroadcastWeek(date, this);
18961
- };
18962
18869
  /**
18963
18870
  * Returns the start of the day for the given date.
18964
18871
  *
@@ -19441,9 +19348,7 @@ function Weekday(props) {
19441
19348
  * @see https://daypicker.dev/guides/custom-components
19442
19349
  */
19443
19350
  function Weekdays(props) {
19444
- return /*#__PURE__*/React.createElement("thead", {
19445
- "aria-hidden": true
19446
- }, /*#__PURE__*/React.createElement("tr", {
19351
+ return /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", {
19447
19352
  ...props
19448
19353
  }));
19449
19354
  }
@@ -19546,8 +19451,7 @@ function getDataAttributes(props) {
19546
19451
  "data-mode": props.mode ?? undefined,
19547
19452
  "data-required": "required" in props ? props.required : undefined,
19548
19453
  "data-multiple-months": props.numberOfMonths && props.numberOfMonths > 1 || undefined,
19549
- "data-week-numbers": props.showWeekNumber || undefined,
19550
- "data-broadcast-calendar": props.broadcastCalendar || undefined
19454
+ "data-week-numbers": props.showWeekNumber || undefined
19551
19455
  };
19552
19456
  Object.entries(props).forEach(([key, val]) => {
19553
19457
  if (key.startsWith("data-")) {
@@ -19613,7 +19517,7 @@ function formatDay(date, options, dateLib) {
19613
19517
  */
19614
19518
  function formatMonthDropdown(/** The month number to format. */
19615
19519
  monthNumber, /** The locale to use for formatting. */
19616
- locale) {
19520
+ locale = enUS$1) {
19617
19521
  return locale.localize?.month(monthNumber);
19618
19522
  }
19619
19523
 
@@ -19703,12 +19607,13 @@ function getMonthOptions(displayMonth, navStart, navEnd, formatters, dateLib) {
19703
19607
  if (!navEnd) return undefined;
19704
19608
  const {
19705
19609
  addMonths,
19706
- startOfMonth
19610
+ startOfMonth,
19611
+ isBefore
19707
19612
  } = dateLib;
19708
19613
  const year = displayMonth.getFullYear();
19709
19614
  const months = [];
19710
19615
  let month = navStart;
19711
- while (months.length < 12) {
19616
+ while (months.length < 12 && isBefore(month, addMonths(navEnd, 1))) {
19712
19617
  months.push(month.getMonth());
19713
19618
  month = addMonths(month, 1);
19714
19619
  }
@@ -19716,7 +19621,7 @@ function getMonthOptions(displayMonth, navStart, navEnd, formatters, dateLib) {
19716
19621
  return a - b;
19717
19622
  });
19718
19623
  const options = sortedMonths.map(value => {
19719
- const label = formatters.formatMonthDropdown(value, dateLib.options.locale ?? enUS$1);
19624
+ const label = formatters.formatMonthDropdown(value, dateLib.options.locale);
19720
19625
  const month = dateLib.Date ? new dateLib.Date(year, value) : new Date(year, value);
19721
19626
  const disabled = navStart && month < startOfMonth(navStart) || navEnd && month > startOfMonth(navEnd) || false;
19722
19627
  return {
@@ -20091,8 +19996,7 @@ function tzName(tz, date) {
20091
19996
  */
20092
19997
  function getWeekdays(/** The date library. */
20093
19998
  dateLib, /** Use ISOWeek instead of locale/ */
20094
- ISOWeek, timeZone, /** @since 9.4.0 */
20095
- broadcastCalendar) {
19999
+ ISOWeek, timeZone) {
20096
20000
  const date = timeZone ? TZDate.tz(timeZone) : dateLib.Date ? new dateLib.Date() : new Date();
20097
20001
  const start = ISOWeek ? dateLib.startOfISOWeek(date) : dateLib.startOfWeek(date);
20098
20002
  const days = [];
@@ -20104,18 +20008,20 @@ broadcastCalendar) {
20104
20008
  }
20105
20009
 
20106
20010
  /** Return the years to show in the dropdown. */
20107
- function getYearOptions(navStart, navEnd, formatters, dateLib) {
20108
- if (!navStart) return undefined;
20109
- if (!navEnd) return undefined;
20011
+ function getYearOptions(displayMonth, calendarStart, calendarEnd, formatters, dateLib) {
20012
+ if (!calendarStart) return undefined;
20013
+ if (!calendarEnd) return undefined;
20110
20014
  const {
20015
+ startOfMonth,
20111
20016
  startOfYear,
20112
20017
  endOfYear,
20113
20018
  addYears,
20114
20019
  isBefore,
20115
20020
  isSameYear
20116
20021
  } = dateLib;
20117
- const firstNavYear = startOfYear(navStart);
20118
- const lastNavYear = endOfYear(navEnd);
20022
+ const month = displayMonth.getMonth();
20023
+ const firstNavYear = startOfYear(calendarStart);
20024
+ const lastNavYear = endOfYear(calendarEnd);
20119
20025
  const years = [];
20120
20026
  let year = firstNavYear;
20121
20027
  while (isBefore(year, lastNavYear) || isSameYear(year, lastNavYear)) {
@@ -20123,11 +20029,13 @@ function getYearOptions(navStart, navEnd, formatters, dateLib) {
20123
20029
  year = addYears(year, 1);
20124
20030
  }
20125
20031
  return years.map(value => {
20032
+ const year = dateLib.Date ? new dateLib.Date(value, month) : new Date(value, month);
20033
+ const disabled = calendarStart && year < startOfMonth(calendarStart) || month && calendarEnd && year > startOfMonth(calendarEnd) || false;
20126
20034
  const label = formatters.formatYearDropdown(value);
20127
20035
  return {
20128
20036
  value,
20129
20037
  label,
20130
- disabled: false
20038
+ disabled
20131
20039
  };
20132
20040
  });
20133
20041
  }
@@ -20291,30 +20199,29 @@ var defaultLabels = /*#__PURE__*/Object.freeze({
20291
20199
  labelYearDropdown: labelYearDropdown
20292
20200
  });
20293
20201
 
20202
+ /** The number of days in a month when having 6 weeks. */
20203
+ const NrOfDaysWithFixedWeeks = 42;
20294
20204
  /** Return all the dates to display in the calendar. */
20295
20205
  function getDates(displayMonths, maxDate, props, dateLib) {
20296
20206
  const firstMonth = displayMonths[0];
20297
20207
  const lastMonth = displayMonths[displayMonths.length - 1];
20298
20208
  const {
20299
20209
  ISOWeek,
20300
- fixedWeeks,
20301
- broadcastCalendar
20210
+ fixedWeeks
20302
20211
  } = props ?? {};
20303
20212
  const {
20213
+ startOfWeek,
20214
+ endOfWeek,
20215
+ startOfISOWeek,
20216
+ endOfISOWeek,
20304
20217
  addDays,
20305
20218
  differenceInCalendarDays,
20306
20219
  differenceInCalendarMonths,
20307
- endOfBroadcastWeek,
20308
- endOfISOWeek,
20309
- endOfMonth,
20310
- endOfWeek,
20311
20220
  isAfter,
20312
- startOfBroadcastWeek,
20313
- startOfISOWeek,
20314
- startOfWeek
20221
+ endOfMonth
20315
20222
  } = dateLib;
20316
- const startWeekFirstDate = broadcastCalendar ? startOfBroadcastWeek(firstMonth, dateLib) : ISOWeek ? startOfISOWeek(firstMonth) : startOfWeek(firstMonth);
20317
- const endWeekLastDate = broadcastCalendar ? endOfBroadcastWeek(lastMonth, dateLib) : ISOWeek ? endOfISOWeek(endOfMonth(lastMonth)) : endOfWeek(endOfMonth(lastMonth));
20223
+ const startWeekFirstDate = ISOWeek ? startOfISOWeek(firstMonth) : startOfWeek(firstMonth);
20224
+ const endWeekLastDate = ISOWeek ? endOfISOWeek(endOfMonth(lastMonth)) : endOfWeek(endOfMonth(lastMonth));
20318
20225
  const nOfDays = differenceInCalendarDays(endWeekLastDate, startWeekFirstDate);
20319
20226
  const nOfMonths = differenceInCalendarMonths(lastMonth, firstMonth) + 1;
20320
20227
  const dates = [];
@@ -20326,11 +20233,9 @@ function getDates(displayMonths, maxDate, props, dateLib) {
20326
20233
  dates.push(date);
20327
20234
  }
20328
20235
  // If fixed weeks is enabled, add the extra dates to the array
20329
- const nrOfDaysWithFixedWeeks = broadcastCalendar ? 35 : 42;
20330
- const extraDates = nrOfDaysWithFixedWeeks * nOfMonths;
20236
+ const extraDates = NrOfDaysWithFixedWeeks * nOfMonths;
20331
20237
  if (fixedWeeks && dates.length < extraDates) {
20332
- const daysToAdd = extraDates - dates.length;
20333
- for (let i = 0; i < daysToAdd; i++) {
20238
+ for (let i = 0; i < 7; i++) {
20334
20239
  const date = addDays(dates[dates.length - 1], 1);
20335
20240
  dates.push(date);
20336
20241
  }
@@ -20441,29 +20346,25 @@ displayMonths, /** The dates to display in the calendar. */
20441
20346
  dates, /** Options from the props context. */
20442
20347
  props, dateLib) {
20443
20348
  const {
20444
- addDays,
20445
- endOfBroadcastWeek,
20349
+ startOfWeek,
20350
+ endOfWeek,
20351
+ startOfISOWeek,
20446
20352
  endOfISOWeek,
20447
20353
  endOfMonth,
20448
- endOfWeek,
20449
- getISOWeek,
20354
+ addDays,
20450
20355
  getWeek,
20451
- startOfBroadcastWeek,
20452
- startOfISOWeek,
20453
- startOfWeek
20356
+ getISOWeek
20454
20357
  } = dateLib;
20455
20358
  const dayPickerMonths = displayMonths.reduce((months, month) => {
20456
- const firstDateOfFirstWeek = props.broadcastCalendar ? startOfBroadcastWeek(month, dateLib) : props.ISOWeek ? startOfISOWeek(month) : startOfWeek(month);
20457
- const lastDateOfLastWeek = props.broadcastCalendar ? endOfBroadcastWeek(month, dateLib) : props.ISOWeek ? endOfISOWeek(endOfMonth(month)) : endOfWeek(endOfMonth(month));
20359
+ const firstDateOfFirstWeek = props.ISOWeek ? startOfISOWeek(month) : startOfWeek(month);
20360
+ const lastDateOfLastWeek = props.ISOWeek ? endOfISOWeek(endOfMonth(month)) : endOfWeek(endOfMonth(month));
20458
20361
  /** The dates to display in the month. */
20459
20362
  const monthDates = dates.filter(date => {
20460
20363
  return date >= firstDateOfFirstWeek && date <= lastDateOfLastWeek;
20461
20364
  });
20462
- const nrOfDaysWithFixedWeeks = props.broadcastCalendar ? 35 : 42;
20463
- if (props.fixedWeeks && monthDates.length < nrOfDaysWithFixedWeeks) {
20365
+ if (props.fixedWeeks && monthDates.length < 42) {
20464
20366
  const extraDates = dates.filter(date => {
20465
- const daysToAdd = nrOfDaysWithFixedWeeks - monthDates.length;
20466
- return date > lastDateOfLastWeek && date <= addDays(lastDateOfLastWeek, daysToAdd);
20367
+ return date > lastDateOfLastWeek && date <= addDays(lastDateOfLastWeek, 7);
20467
20368
  });
20468
20369
  monthDates.push(...extraDates);
20469
20370
  }
@@ -20901,30 +20802,27 @@ function dateMatchModifiers(date, matchers, dateLib = defaultDateLib) {
20901
20802
  /** Return the next date that should be focused. */
20902
20803
  function getFocusableDate(moveBy, moveDir, refDate, navStart, navEnd, props, dateLib) {
20903
20804
  const {
20904
- ISOWeek,
20905
- broadcastCalendar
20805
+ ISOWeek
20906
20806
  } = props;
20907
20807
  const {
20908
20808
  addDays,
20909
20809
  addMonths,
20910
- addWeeks,
20911
20810
  addYears,
20912
- endOfBroadcastWeek,
20811
+ addWeeks,
20812
+ startOfISOWeek,
20913
20813
  endOfISOWeek,
20814
+ startOfWeek,
20914
20815
  endOfWeek,
20915
20816
  max,
20916
- min,
20917
- startOfBroadcastWeek,
20918
- startOfISOWeek,
20919
- startOfWeek
20817
+ min
20920
20818
  } = dateLib;
20921
20819
  const moveFns = {
20922
20820
  day: addDays,
20923
20821
  week: addWeeks,
20924
20822
  month: addMonths,
20925
20823
  year: addYears,
20926
- startOfWeek: date => broadcastCalendar ? startOfBroadcastWeek(date, dateLib) : ISOWeek ? startOfISOWeek(date) : startOfWeek(date),
20927
- endOfWeek: date => broadcastCalendar ? endOfBroadcastWeek(date, dateLib) : ISOWeek ? endOfISOWeek(date) : endOfWeek(date)
20824
+ startOfWeek: date => ISOWeek ? startOfISOWeek(date) : startOfWeek(date),
20825
+ endOfWeek: date => ISOWeek ? endOfISOWeek(date) : endOfWeek(date)
20928
20826
  };
20929
20827
  let focusableDate = moveFns[moveBy](refDate, moveDir === "after" ? 1 : -1);
20930
20828
  if (moveDir === "before" && navStart) {
@@ -20990,8 +20888,6 @@ function useFocus(props, calendar, getModifiers, isSelected, dateLib) {
20990
20888
  /**
20991
20889
  * Return a function to get the modifiers for a given day.
20992
20890
  *
20993
- * NOTE: this is not an hook, but a factory for `getModifiers`.
20994
- *
20995
20891
  * @private
20996
20892
  */
20997
20893
  function useGetModifiers(days, props, dateLib) {
@@ -21000,19 +20896,12 @@ function useGetModifiers(days, props, dateLib) {
21000
20896
  hidden,
21001
20897
  modifiers,
21002
20898
  showOutsideDays,
21003
- broadcastCalendar,
21004
20899
  today
21005
20900
  } = props;
21006
20901
  const {
21007
20902
  isSameDay,
21008
- isSameMonth,
21009
- startOfMonth,
21010
- isBefore,
21011
- endOfMonth,
21012
- isAfter
20903
+ isSameMonth
21013
20904
  } = dateLib;
21014
- const startMonth = props.startMonth && startOfMonth(props.startMonth);
21015
- const endMonth = props.endMonth && endOfMonth(props.endMonth);
21016
20905
  const internalModifiersMap = {
21017
20906
  [DayFlag.focused]: [],
21018
20907
  [DayFlag.outside]: [],
@@ -21021,18 +20910,20 @@ function useGetModifiers(days, props, dateLib) {
21021
20910
  [DayFlag.today]: []
21022
20911
  };
21023
20912
  const customModifiersMap = {};
20913
+ const selectionModifiersMap = {
20914
+ [SelectionState.range_end]: [],
20915
+ [SelectionState.range_middle]: [],
20916
+ [SelectionState.range_start]: [],
20917
+ [SelectionState.selected]: []
20918
+ };
21024
20919
  for (const day of days) {
21025
20920
  const {
21026
20921
  date,
21027
20922
  displayMonth
21028
20923
  } = day;
21029
20924
  const isOutside = Boolean(displayMonth && !isSameMonth(date, displayMonth));
21030
- const isBeforeStartMonth = Boolean(startMonth && isBefore(date, startMonth));
21031
- const isAfterEndMonth = Boolean(endMonth && isAfter(date, endMonth));
21032
20925
  const isDisabled = Boolean(disabled && dateMatchModifiers(date, disabled, dateLib));
21033
- const isHidden = Boolean(hidden && dateMatchModifiers(date, hidden, dateLib)) || isBeforeStartMonth || isAfterEndMonth ||
21034
- // Broadcast calendar will show outside days as default
21035
- !broadcastCalendar && !showOutsideDays && isOutside || broadcastCalendar && showOutsideDays === false && isOutside;
20926
+ const isHidden = Boolean(hidden && dateMatchModifiers(date, hidden, dateLib)) || !showOutsideDays && isOutside;
21036
20927
  const isToday = isSameDay(date, today ?? (props.timeZone ? TZDate.tz(props.timeZone) : dateLib.Date ? new dateLib.Date() : new Date()));
21037
20928
  if (isOutside) internalModifiersMap.outside.push(day);
21038
20929
  if (isDisabled) internalModifiersMap.disabled.push(day);
@@ -21061,16 +20952,27 @@ function useGetModifiers(days, props, dateLib) {
21061
20952
  [DayFlag.outside]: false,
21062
20953
  [DayFlag.today]: false
21063
20954
  };
20955
+ const selectionStates = {
20956
+ [SelectionState.range_end]: false,
20957
+ [SelectionState.range_middle]: false,
20958
+ [SelectionState.range_start]: false,
20959
+ [SelectionState.selected]: false
20960
+ };
21064
20961
  const customModifiers = {};
21065
20962
  // Find the modifiers for the given day
21066
20963
  for (const name in internalModifiersMap) {
21067
20964
  const days = internalModifiersMap[name];
21068
20965
  dayFlags[name] = days.some(d => d === day);
21069
20966
  }
20967
+ for (const name in selectionModifiersMap) {
20968
+ const days = selectionModifiersMap[name];
20969
+ selectionStates[name] = days.some(d => d === day);
20970
+ }
21070
20971
  for (const name in customModifiersMap) {
21071
20972
  customModifiers[name] = customModifiersMap[name].some(d => d === day);
21072
20973
  }
21073
20974
  return {
20975
+ ...selectionStates,
21074
20976
  ...dayFlags,
21075
20977
  // custom modifiers should override all the previous ones
21076
20978
  ...customModifiers
@@ -21475,7 +21377,7 @@ function DayPicker(props) {
21475
21377
  };
21476
21378
  const dateLib = new DateLib({
21477
21379
  locale,
21478
- weekStartsOn: props.broadcastCalendar ? 1 : props.weekStartsOn,
21380
+ weekStartsOn: props.weekStartsOn,
21479
21381
  firstWeekContainsDate: props.firstWeekContainsDate,
21480
21382
  useAdditionalWeekYearTokens: props.useAdditionalWeekYearTokens,
21481
21383
  useAdditionalDayOfYearTokens: props.useAdditionalDayOfYearTokens
@@ -21494,7 +21396,7 @@ function DayPicker(props) {
21494
21396
  ...props.classNames
21495
21397
  }
21496
21398
  };
21497
- }, [props.classNames, props.components, props.dateLib, props.firstWeekContainsDate, props.formatters, props.labels, props.locale, props.useAdditionalDayOfYearTokens, props.useAdditionalWeekYearTokens, props.weekStartsOn, props.broadcastCalendar]);
21399
+ }, [props.classNames, props.components, props.dateLib, props.firstWeekContainsDate, props.formatters, props.labels, props.locale, props.useAdditionalDayOfYearTokens, props.useAdditionalWeekYearTokens, props.weekStartsOn]);
21498
21400
  const {
21499
21401
  captionLayout,
21500
21402
  mode,
@@ -21604,16 +21506,6 @@ function DayPicker(props) {
21604
21506
  const handleDayMouseLeave = React.useCallback((day, modifiers) => e => {
21605
21507
  onDayMouseLeave?.(day.date, modifiers, e);
21606
21508
  }, [onDayMouseLeave]);
21607
- const handleMonthChange = React.useCallback(date => e => {
21608
- const selectedMonth = Number(e.target.value);
21609
- const month = dateLib.setMonth(dateLib.startOfMonth(date), selectedMonth);
21610
- goToMonth(month);
21611
- }, [dateLib, goToMonth]);
21612
- const handleYearChange = React.useCallback(date => e => {
21613
- const selectedYear = Number(e.target.value);
21614
- const month = dateLib.setYear(dateLib.startOfMonth(date), selectedYear);
21615
- goToMonth(month);
21616
- }, [dateLib, goToMonth]);
21617
21509
  const {
21618
21510
  className,
21619
21511
  style
@@ -21651,8 +21543,6 @@ function DayPicker(props) {
21651
21543
  lang: props.lang,
21652
21544
  nonce: props.nonce,
21653
21545
  title: props.title,
21654
- role: props.role,
21655
- "aria-label": props["aria-label"],
21656
21546
  ...dataAttributes
21657
21547
  }, /*#__PURE__*/React.createElement(components.Months, {
21658
21548
  className: classNames[UI.Months],
@@ -21666,8 +21556,17 @@ function DayPicker(props) {
21666
21556
  previousMonth: previousMonth,
21667
21557
  nextMonth: nextMonth
21668
21558
  })), months.map((calendarMonth, displayIndex) => {
21559
+ const handleMonthChange = e => {
21560
+ const selectedMonth = Number(e.target.value);
21561
+ const month = dateLib.setMonth(dateLib.startOfMonth(calendarMonth.date), selectedMonth);
21562
+ goToMonth(month);
21563
+ };
21564
+ const handleYearChange = e => {
21565
+ const month = dateLib.setYear(dateLib.startOfMonth(calendarMonth.date), Number(e.target.value));
21566
+ goToMonth(month);
21567
+ };
21669
21568
  const dropdownMonths = getMonthOptions(calendarMonth.date, navStart, navEnd, formatters, dateLib);
21670
- const dropdownYears = getYearOptions(navStart, navEnd, formatters, dateLib);
21569
+ const dropdownYears = getYearOptions(months[0].date, navStart, navEnd, formatters, dateLib);
21671
21570
  return /*#__PURE__*/React.createElement(components.Month, {
21672
21571
  className: classNames[UI.Month],
21673
21572
  style: styles?.[UI.Month],
@@ -21688,7 +21587,7 @@ function DayPicker(props) {
21688
21587
  classNames: classNames,
21689
21588
  components: components,
21690
21589
  disabled: Boolean(props.disableNavigation),
21691
- onChange: handleMonthChange(calendarMonth.date),
21590
+ onChange: handleMonthChange,
21692
21591
  options: dropdownMonths,
21693
21592
  style: styles?.[UI.Dropdown],
21694
21593
  value: calendarMonth.date.getMonth()
@@ -21701,7 +21600,7 @@ function DayPicker(props) {
21701
21600
  classNames: classNames,
21702
21601
  components: components,
21703
21602
  disabled: Boolean(props.disableNavigation),
21704
- onChange: handleYearChange(calendarMonth.date),
21603
+ onChange: handleYearChange,
21705
21604
  options: dropdownYears,
21706
21605
  style: styles?.[UI.Dropdown],
21707
21606
  value: calendarMonth.date.getFullYear()
@@ -21748,8 +21647,7 @@ function DayPicker(props) {
21748
21647
  locale
21749
21648
  }),
21750
21649
  className: classNames[UI.WeekNumber],
21751
- scope: "row",
21752
- role: "rowheader"
21650
+ scope: "row"
21753
21651
  }, formatWeekNumber(week.weekNumber))), week.days.map(day => {
21754
21652
  const {
21755
21653
  date
@@ -21769,14 +21667,14 @@ function DayPicker(props) {
21769
21667
  }
21770
21668
  const style = getStyleForModifiers(modifiers, styles, props.modifiersStyles);
21771
21669
  const className = getClassNamesForModifiers(modifiers, classNames, props.modifiersClassNames);
21772
- const ariaLabel = !isInteractive && !modifiers.hidden ? labelGridcell(date, modifiers, dateLib.options, dateLib) : undefined;
21670
+ const ariaLabel = !isInteractive ? labelGridcell(date, modifiers, dateLib.options, dateLib) : undefined;
21773
21671
  return /*#__PURE__*/React.createElement(components.Day, {
21774
21672
  key: `${dateLib.format(date, "yyyy-MM-dd")}_${dateLib.format(day.displayMonth, "yyyy-MM")}`,
21775
21673
  day: day,
21776
21674
  modifiers: modifiers,
21777
21675
  className: className.join(" "),
21778
21676
  style: style,
21779
- role: "gridcell",
21677
+ "aria-hidden": modifiers.hidden || undefined,
21780
21678
  "aria-selected": modifiers.selected || undefined,
21781
21679
  "aria-label": ariaLabel,
21782
21680
  "data-day": dateLib.format(date, "yyyy-MM-dd"),
@@ -21787,7 +21685,7 @@ function DayPicker(props) {
21787
21685
  "data-outside": day.outside || undefined,
21788
21686
  "data-focused": modifiers.focused || undefined,
21789
21687
  "data-today": modifiers.today || undefined
21790
- }, !modifiers.hidden && isInteractive ? (/*#__PURE__*/React.createElement(components.DayButton, {
21688
+ }, isInteractive ? (/*#__PURE__*/React.createElement(components.DayButton, {
21791
21689
  className: classNames[UI.DayButton],
21792
21690
  style: styles?.[UI.DayButton],
21793
21691
  type: "button",
@@ -21802,7 +21700,7 @@ function DayPicker(props) {
21802
21700
  onKeyDown: handleDayKeyDown(day, modifiers),
21803
21701
  onMouseEnter: handleDayMouseEnter(day, modifiers),
21804
21702
  onMouseLeave: handleDayMouseLeave(day, modifiers)
21805
- }, formatDay(date, dateLib.options, dateLib))) : !modifiers.hidden && formatDay(day.date, dateLib.options, dateLib));
21703
+ }, formatDay(date, dateLib.options, dateLib))) : formatDay(day.date, dateLib.options, dateLib));
21806
21704
  }));
21807
21705
  }))));
21808
21706
  })), props.footer && (/*#__PURE__*/React.createElement(components.Footer, {
@@ -27301,12 +27199,13 @@ const PieChart = ({
27301
27199
  });
27302
27200
  };
27303
27201
 
27304
- var css_248z$F = ".ff-app-header-main {\n display: flex;\n}\n.ff-app-header-main .ff-app-header {\n display: flex;\n z-index: 1000;\n flex-basis: 100%;\n justify-content: space-between;\n background-color: var(--brand-color);\n padding-left: 8px;\n height: 40px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-left-container {\n display: flex;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-left-container .ff-app-header-logo-icon {\n padding: 4px;\n height: 24px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar {\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--brand-color);\n transform: translateY(12px);\n border-radius: 20px;\n padding: 4px;\n padding-bottom: 16px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items {\n display: flex;\n align-items: center;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item {\n margin-left: 8px;\n padding: 7px;\n color: var(--ff-header-text-color);\n cursor: pointer;\n display: flex;\n position: relative;\n flex: 1 1 auto;\n overflow: hidden;\n transition: flex-grow 1s ease, opacity 1s ease, max-width 1s ease;\n max-width: 150px; /* Initial max-width */\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item:not(.ff-app-header-nav-bar-item--selected):hover::after {\n animation: oscillate-border-width 0.5s ease-in-out forwards;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 25%;\n width: 0%;\n height: 2px;\n background: var(--ff-app-header-menu-border-bottom-color);\n border-radius: 4px;\n transition: width 0.15s ease-in-out;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-nav-bar-item-label {\n white-space: nowrap;\n align-content: center;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected {\n padding: 3px;\n background-color: var(--primary-icon-color);\n border-radius: 20px;\n flex-grow: 12; /* Increase size on hover */\n max-width: 700px;\n opacity: 1;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected .ff-app-header-nav-bar-item-label {\n box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2509803922) inset;\n background: linear-gradient(90deg, var(--brand-color) 0%, var(--button-background-gradient-color) 100%);\n border-radius: 20px;\n padding: 4px 8px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected :last-child {\n margin-right: 3px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected :first-child {\n margin: 0;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container {\n display: flex;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item {\n color: var(--ff-header-submenu-text-color);\n align-content: center;\n position: relative;\n white-space: nowrap;\n padding-left: 8px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item:not(.ff-app-header-nav-bar-submenu-item--selected):hover::after {\n animation: oscillate-border-width 0.5s ease-in-out forwards;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 25%;\n width: 0%;\n height: 2px;\n border-radius: 4px;\n transition: width 0.15s ease-in-out;\n background: var(--ff-app-header-submenu-border-bottom-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item--selected {\n color: var(--ff-header-submenu-highlight-text-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item--selected::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 20%;\n width: 70%;\n height: 2px;\n border-radius: 4px;\n box-shadow: 0px 1px 0.2px 0px rgba(0, 0, 0, 0.1607843137);\n background: var(--ff-app-header-submenu-border-bottom-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container {\n display: flex;\n align-items: center;\n overflow: hidden;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item {\n margin-right: 8px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item:last-child {\n margin: 0px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item .ff-tooltip-container {\n display: inline;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item .ff-tooltip-container .ff-icon-container {\n padding: 2px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item--selected {\n background: var(--brand-color);\n border-radius: 5px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item--selected :hover {\n background: transparent;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item--selected svg path {\n fill: var(--primary-button-text-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected .ff-app-header-quickmenu-container {\n animation: quickmenu-expand 1s ease forwards;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item:not(.ff-app-header-nav-bar-item--selected) .ff-app-header-quickmenu-container {\n animation: quickmenu-collapse 1s ease forwards;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .more-menu {\n width: 40px;\n display: flex;\n justify-content: center;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .more-menu .ff-app-header-more-icon svg {\n cursor: pointer;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .more-menu .ff-app-header-more-icon svg path {\n fill: var(--primary-icon-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-left-content,\n.ff-app-header-main .ff-app-header .ff-app-header-right-content {\n height: 24px;\n padding: 8px;\n align-content: center;\n}\n\n@keyframes oscillate-border-width {\n 0% {\n width: 50%;\n left: 25%;\n }\n 50% {\n width: 70%;\n left: 15%;\n }\n 100% {\n width: 50%;\n left: 25%;\n }\n}\n@keyframes quickmenu-expand {\n from {\n max-height: 0;\n opacity: 0;\n }\n to {\n max-height: 500px; /* Ensure this value covers the full height of your quick menu */\n opacity: 1;\n }\n}\n@keyframes quickmenu-collapse {\n from {\n max-height: 500px;\n opacity: 1;\n }\n to {\n max-height: 0;\n opacity: 0;\n }\n}";
27202
+ var css_248z$F = ".ff-app-header-main {\n display: flex;\n}\n.ff-app-header-main .ff-app-header {\n display: flex;\n z-index: 1000;\n flex-basis: 100%;\n justify-content: space-between;\n background-color: var(--brand-color);\n padding-left: 8px;\n height: 40px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-left-container {\n display: flex;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-left-container .ff-app-header-logo-icon {\n padding: 4px;\n height: 24px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar {\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--brand-color);\n transform: translateY(12px);\n border-radius: 20px;\n padding: 4px;\n padding-bottom: 16px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items {\n display: flex;\n align-items: center;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item {\n margin-left: 8px;\n padding: 7px;\n color: var(--ff-header-text-color);\n cursor: pointer;\n display: flex;\n position: relative;\n flex: 1 1 auto;\n overflow: hidden;\n transition: flex-grow 1s ease, opacity 1s ease, max-width 1s ease;\n max-width: 150px; /* Initial max-width */\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item:not(.ff-app-header-nav-bar-item--selected):hover::after {\n animation: oscillate-border-width 0.5s ease-in-out forwards;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 25%;\n width: 0%;\n height: 2px;\n background: var(--ff-app-header-menu-border-bottom-color);\n border-radius: 4px;\n transition: width 0.15s ease-in-out;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-nav-bar-item-label {\n white-space: nowrap;\n align-content: center;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected {\n padding: 3px;\n background-color: var(--primary-icon-color);\n border-radius: 20px;\n flex-grow: 12; /* Increase size on hover */\n max-width: 700px;\n opacity: 1;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected .ff-app-header-nav-bar-item-label {\n box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2509803922) inset;\n background: linear-gradient(90deg, var(--brand-color) 0%, var(--button-background-gradient-color) 100%);\n border-radius: 20px;\n padding: 4px 8px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected :last-child {\n margin-right: 3px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected :first-child {\n margin: 0;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container {\n display: flex;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item {\n color: var(--ff-header-submenu-text-color);\n align-content: center;\n position: relative;\n white-space: nowrap;\n padding-left: 8px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item:not(.ff-app-header-nav-bar-submenu-item--selected):hover::after {\n animation: oscillate-border-width 0.5s ease-in-out forwards;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 25%;\n width: 0%;\n height: 2px;\n border-radius: 4px;\n transition: width 0.15s ease-in-out;\n background: var(--ff-app-header-submenu-border-bottom-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item--selected {\n color: var(--ff-header-submenu-highlight-text-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-nav-bar-submenu-item--selected::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 20%;\n width: 70%;\n height: 2px;\n border-radius: 4px;\n box-shadow: 0px 1px 0.2px 0px rgba(0, 0, 0, 0.1607843137);\n background: var(--ff-app-header-submenu-border-bottom-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container {\n display: flex;\n align-items: center;\n overflow: hidden;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item {\n margin-right: 8px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item:last-child {\n margin: 0px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item .ff-tooltip-container {\n display: inline;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item .ff-tooltip-container .ff-icon-container {\n padding: 2px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item--selected {\n background: var(--brand-color);\n border-radius: 5px;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item--selected :hover {\n background: transparent;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item .ff-app-header-submenu-container .ff-app-header-quickmenu-container .ff-app-header-nav-bar-quickmenu-item--selected svg path {\n fill: var(--primary-button-text-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item--selected .ff-app-header-quickmenu-container {\n animation: quickmenu-expand 1s ease forwards;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .ff-app-header-nav-bar-items .ff-app-header-nav-bar-item:not(.ff-app-header-nav-bar-item--selected) .ff-app-header-quickmenu-container {\n animation: quickmenu-collapse 1s ease forwards;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .more-menu {\n width: 40px;\n margin-left: 8px;\n display: flex;\n justify-content: center;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .more-menu .ff-app-header-more-icon svg {\n cursor: pointer;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .more-menu .ff-app-header-more-icon svg path {\n fill: var(--primary-icon-color);\n}\n.ff-app-header-main .ff-app-header .ff-app-header-nav-bar .more-menu .ff-menuicon-container {\n width: 40px !important;\n height: 32px !important;\n border-radius: 16px !important;\n}\n.ff-app-header-main .ff-app-header .ff-app-header-left-content,\n.ff-app-header-main .ff-app-header .ff-app-header-right-content {\n height: 24px;\n padding: 8px;\n align-content: center;\n}\n\n@keyframes oscillate-border-width {\n 0% {\n width: 50%;\n left: 25%;\n }\n 50% {\n width: 70%;\n left: 15%;\n }\n 100% {\n width: 50%;\n left: 25%;\n }\n}\n@keyframes quickmenu-expand {\n from {\n max-height: 0;\n opacity: 0;\n }\n to {\n max-height: 500px; /* Ensure this value covers the full height of your quick menu */\n opacity: 1;\n }\n}\n@keyframes quickmenu-collapse {\n from {\n max-height: 500px;\n opacity: 1;\n }\n to {\n max-height: 0;\n opacity: 0;\n }\n}";
27305
27203
  styleInject(css_248z$F);
27306
27204
 
27307
27205
  const AppHeader = ({
27308
27206
  logoIconName = 'fireflink_icon',
27309
27207
  width,
27208
+ borderRadius,
27310
27209
  leftContent,
27311
27210
  rightContent,
27312
27211
  projectsList,
@@ -27332,6 +27231,10 @@ const AppHeader = ({
27332
27231
  className: "ff-app-header-main",
27333
27232
  children: jsxRuntime.jsxs("div", {
27334
27233
  className: "ff-app-header",
27234
+ style: {
27235
+ borderStartStartRadius: borderRadius,
27236
+ borderStartEndRadius: borderRadius
27237
+ },
27335
27238
  children: [jsxRuntime.jsxs("div", {
27336
27239
  className: "ff-app-header-left-container",
27337
27240
  children: [jsxRuntime.jsx("div", {
@@ -27878,9 +27781,9 @@ const DashboardDonutChart = ({
27878
27781
 
27879
27782
  var propTypes = {exports: {}};
27880
27783
 
27881
- var reactIs = {exports: {}};
27784
+ var reactIs$1 = {exports: {}};
27882
27785
 
27883
- var reactIs_production_min = {};
27786
+ var reactIs_production_min$1 = {};
27884
27787
 
27885
27788
  /** @license React v16.13.1
27886
27789
  * react-is.production.min.js
@@ -27890,10 +27793,10 @@ var reactIs_production_min = {};
27890
27793
  * This source code is licensed under the MIT license found in the
27891
27794
  * LICENSE file in the root directory of this source tree.
27892
27795
  */
27893
- var hasRequiredReactIs_production_min;
27894
- function requireReactIs_production_min() {
27895
- if (hasRequiredReactIs_production_min) return reactIs_production_min;
27896
- hasRequiredReactIs_production_min = 1;
27796
+ var hasRequiredReactIs_production_min$1;
27797
+ function requireReactIs_production_min$1() {
27798
+ if (hasRequiredReactIs_production_min$1) return reactIs_production_min$1;
27799
+ hasRequiredReactIs_production_min$1 = 1;
27897
27800
  var b = "function" === typeof Symbol && Symbol.for,
27898
27801
  c = b ? Symbol.for("react.element") : 60103,
27899
27802
  d = b ? Symbol.for("react.portal") : 60106,
@@ -27946,64 +27849,64 @@ function requireReactIs_production_min() {
27946
27849
  function A(a) {
27947
27850
  return z(a) === m;
27948
27851
  }
27949
- reactIs_production_min.AsyncMode = l;
27950
- reactIs_production_min.ConcurrentMode = m;
27951
- reactIs_production_min.ContextConsumer = k;
27952
- reactIs_production_min.ContextProvider = h;
27953
- reactIs_production_min.Element = c;
27954
- reactIs_production_min.ForwardRef = n;
27955
- reactIs_production_min.Fragment = e;
27956
- reactIs_production_min.Lazy = t;
27957
- reactIs_production_min.Memo = r;
27958
- reactIs_production_min.Portal = d;
27959
- reactIs_production_min.Profiler = g;
27960
- reactIs_production_min.StrictMode = f;
27961
- reactIs_production_min.Suspense = p;
27962
- reactIs_production_min.isAsyncMode = function (a) {
27852
+ reactIs_production_min$1.AsyncMode = l;
27853
+ reactIs_production_min$1.ConcurrentMode = m;
27854
+ reactIs_production_min$1.ContextConsumer = k;
27855
+ reactIs_production_min$1.ContextProvider = h;
27856
+ reactIs_production_min$1.Element = c;
27857
+ reactIs_production_min$1.ForwardRef = n;
27858
+ reactIs_production_min$1.Fragment = e;
27859
+ reactIs_production_min$1.Lazy = t;
27860
+ reactIs_production_min$1.Memo = r;
27861
+ reactIs_production_min$1.Portal = d;
27862
+ reactIs_production_min$1.Profiler = g;
27863
+ reactIs_production_min$1.StrictMode = f;
27864
+ reactIs_production_min$1.Suspense = p;
27865
+ reactIs_production_min$1.isAsyncMode = function (a) {
27963
27866
  return A(a) || z(a) === l;
27964
27867
  };
27965
- reactIs_production_min.isConcurrentMode = A;
27966
- reactIs_production_min.isContextConsumer = function (a) {
27868
+ reactIs_production_min$1.isConcurrentMode = A;
27869
+ reactIs_production_min$1.isContextConsumer = function (a) {
27967
27870
  return z(a) === k;
27968
27871
  };
27969
- reactIs_production_min.isContextProvider = function (a) {
27872
+ reactIs_production_min$1.isContextProvider = function (a) {
27970
27873
  return z(a) === h;
27971
27874
  };
27972
- reactIs_production_min.isElement = function (a) {
27875
+ reactIs_production_min$1.isElement = function (a) {
27973
27876
  return "object" === typeof a && null !== a && a.$$typeof === c;
27974
27877
  };
27975
- reactIs_production_min.isForwardRef = function (a) {
27878
+ reactIs_production_min$1.isForwardRef = function (a) {
27976
27879
  return z(a) === n;
27977
27880
  };
27978
- reactIs_production_min.isFragment = function (a) {
27881
+ reactIs_production_min$1.isFragment = function (a) {
27979
27882
  return z(a) === e;
27980
27883
  };
27981
- reactIs_production_min.isLazy = function (a) {
27884
+ reactIs_production_min$1.isLazy = function (a) {
27982
27885
  return z(a) === t;
27983
27886
  };
27984
- reactIs_production_min.isMemo = function (a) {
27887
+ reactIs_production_min$1.isMemo = function (a) {
27985
27888
  return z(a) === r;
27986
27889
  };
27987
- reactIs_production_min.isPortal = function (a) {
27890
+ reactIs_production_min$1.isPortal = function (a) {
27988
27891
  return z(a) === d;
27989
27892
  };
27990
- reactIs_production_min.isProfiler = function (a) {
27893
+ reactIs_production_min$1.isProfiler = function (a) {
27991
27894
  return z(a) === g;
27992
27895
  };
27993
- reactIs_production_min.isStrictMode = function (a) {
27896
+ reactIs_production_min$1.isStrictMode = function (a) {
27994
27897
  return z(a) === f;
27995
27898
  };
27996
- reactIs_production_min.isSuspense = function (a) {
27899
+ reactIs_production_min$1.isSuspense = function (a) {
27997
27900
  return z(a) === p;
27998
27901
  };
27999
- reactIs_production_min.isValidElementType = function (a) {
27902
+ reactIs_production_min$1.isValidElementType = function (a) {
28000
27903
  return "string" === typeof a || "function" === typeof a || a === e || a === m || a === g || a === f || a === p || a === q || "object" === typeof a && null !== a && (a.$$typeof === t || a.$$typeof === r || a.$$typeof === h || a.$$typeof === k || a.$$typeof === n || a.$$typeof === w || a.$$typeof === x || a.$$typeof === y || a.$$typeof === v);
28001
27904
  };
28002
- reactIs_production_min.typeOf = z;
28003
- return reactIs_production_min;
27905
+ reactIs_production_min$1.typeOf = z;
27906
+ return reactIs_production_min$1;
28004
27907
  }
28005
27908
 
28006
- var reactIs_development = {};
27909
+ var reactIs_development$1 = {};
28007
27910
 
28008
27911
  /** @license React v16.13.1
28009
27912
  * react-is.development.js
@@ -28013,10 +27916,10 @@ var reactIs_development = {};
28013
27916
  * This source code is licensed under the MIT license found in the
28014
27917
  * LICENSE file in the root directory of this source tree.
28015
27918
  */
28016
- var hasRequiredReactIs_development;
28017
- function requireReactIs_development() {
28018
- if (hasRequiredReactIs_development) return reactIs_development;
28019
- hasRequiredReactIs_development = 1;
27919
+ var hasRequiredReactIs_development$1;
27920
+ function requireReactIs_development$1() {
27921
+ if (hasRequiredReactIs_development$1) return reactIs_development$1;
27922
+ hasRequiredReactIs_development$1 = 1;
28020
27923
  if (process.env.NODE_ENV !== "production") {
28021
27924
  (function () {
28022
27925
 
@@ -28143,49 +28046,49 @@ function requireReactIs_development() {
28143
28046
  function isSuspense(object) {
28144
28047
  return typeOf(object) === REACT_SUSPENSE_TYPE;
28145
28048
  }
28146
- reactIs_development.AsyncMode = AsyncMode;
28147
- reactIs_development.ConcurrentMode = ConcurrentMode;
28148
- reactIs_development.ContextConsumer = ContextConsumer;
28149
- reactIs_development.ContextProvider = ContextProvider;
28150
- reactIs_development.Element = Element;
28151
- reactIs_development.ForwardRef = ForwardRef;
28152
- reactIs_development.Fragment = Fragment;
28153
- reactIs_development.Lazy = Lazy;
28154
- reactIs_development.Memo = Memo;
28155
- reactIs_development.Portal = Portal;
28156
- reactIs_development.Profiler = Profiler;
28157
- reactIs_development.StrictMode = StrictMode;
28158
- reactIs_development.Suspense = Suspense;
28159
- reactIs_development.isAsyncMode = isAsyncMode;
28160
- reactIs_development.isConcurrentMode = isConcurrentMode;
28161
- reactIs_development.isContextConsumer = isContextConsumer;
28162
- reactIs_development.isContextProvider = isContextProvider;
28163
- reactIs_development.isElement = isElement;
28164
- reactIs_development.isForwardRef = isForwardRef;
28165
- reactIs_development.isFragment = isFragment;
28166
- reactIs_development.isLazy = isLazy;
28167
- reactIs_development.isMemo = isMemo;
28168
- reactIs_development.isPortal = isPortal;
28169
- reactIs_development.isProfiler = isProfiler;
28170
- reactIs_development.isStrictMode = isStrictMode;
28171
- reactIs_development.isSuspense = isSuspense;
28172
- reactIs_development.isValidElementType = isValidElementType;
28173
- reactIs_development.typeOf = typeOf;
28049
+ reactIs_development$1.AsyncMode = AsyncMode;
28050
+ reactIs_development$1.ConcurrentMode = ConcurrentMode;
28051
+ reactIs_development$1.ContextConsumer = ContextConsumer;
28052
+ reactIs_development$1.ContextProvider = ContextProvider;
28053
+ reactIs_development$1.Element = Element;
28054
+ reactIs_development$1.ForwardRef = ForwardRef;
28055
+ reactIs_development$1.Fragment = Fragment;
28056
+ reactIs_development$1.Lazy = Lazy;
28057
+ reactIs_development$1.Memo = Memo;
28058
+ reactIs_development$1.Portal = Portal;
28059
+ reactIs_development$1.Profiler = Profiler;
28060
+ reactIs_development$1.StrictMode = StrictMode;
28061
+ reactIs_development$1.Suspense = Suspense;
28062
+ reactIs_development$1.isAsyncMode = isAsyncMode;
28063
+ reactIs_development$1.isConcurrentMode = isConcurrentMode;
28064
+ reactIs_development$1.isContextConsumer = isContextConsumer;
28065
+ reactIs_development$1.isContextProvider = isContextProvider;
28066
+ reactIs_development$1.isElement = isElement;
28067
+ reactIs_development$1.isForwardRef = isForwardRef;
28068
+ reactIs_development$1.isFragment = isFragment;
28069
+ reactIs_development$1.isLazy = isLazy;
28070
+ reactIs_development$1.isMemo = isMemo;
28071
+ reactIs_development$1.isPortal = isPortal;
28072
+ reactIs_development$1.isProfiler = isProfiler;
28073
+ reactIs_development$1.isStrictMode = isStrictMode;
28074
+ reactIs_development$1.isSuspense = isSuspense;
28075
+ reactIs_development$1.isValidElementType = isValidElementType;
28076
+ reactIs_development$1.typeOf = typeOf;
28174
28077
  })();
28175
28078
  }
28176
- return reactIs_development;
28079
+ return reactIs_development$1;
28177
28080
  }
28178
28081
 
28179
- var hasRequiredReactIs;
28180
- function requireReactIs() {
28181
- if (hasRequiredReactIs) return reactIs.exports;
28182
- hasRequiredReactIs = 1;
28082
+ var hasRequiredReactIs$1;
28083
+ function requireReactIs$1() {
28084
+ if (hasRequiredReactIs$1) return reactIs$1.exports;
28085
+ hasRequiredReactIs$1 = 1;
28183
28086
  if (process.env.NODE_ENV === 'production') {
28184
- reactIs.exports = requireReactIs_production_min();
28087
+ reactIs$1.exports = requireReactIs_production_min$1();
28185
28088
  } else {
28186
- reactIs.exports = requireReactIs_development();
28089
+ reactIs$1.exports = requireReactIs_development$1();
28187
28090
  }
28188
- return reactIs.exports;
28091
+ return reactIs$1.exports;
28189
28092
  }
28190
28093
 
28191
28094
  /*
@@ -28400,7 +28303,7 @@ var hasRequiredFactoryWithTypeCheckers;
28400
28303
  function requireFactoryWithTypeCheckers() {
28401
28304
  if (hasRequiredFactoryWithTypeCheckers) return factoryWithTypeCheckers;
28402
28305
  hasRequiredFactoryWithTypeCheckers = 1;
28403
- var ReactIs = requireReactIs();
28306
+ var ReactIs = requireReactIs$1();
28404
28307
  var assign = requireObjectAssign();
28405
28308
  var ReactPropTypesSecret = /*@__PURE__*/requireReactPropTypesSecret();
28406
28309
  var has = /*@__PURE__*/requireHas();
@@ -29013,7 +28916,7 @@ function requirePropTypes() {
29013
28916
  if (hasRequiredPropTypes) return propTypes.exports;
29014
28917
  hasRequiredPropTypes = 1;
29015
28918
  if (process.env.NODE_ENV !== 'production') {
29016
- var ReactIs = requireReactIs();
28919
+ var ReactIs = requireReactIs$1();
29017
28920
 
29018
28921
  // By explicitly using `prop-types` you are opting into new development behavior.
29019
28922
  // http://fb.me/prop-types-in-prod
@@ -29248,6 +29151,316 @@ ReCAPTCHA.defaultProps = {
29248
29151
  badge: "bottomright"
29249
29152
  };
29250
29153
 
29154
+ var reactIs = {exports: {}};
29155
+
29156
+ var reactIs_production_min = {};
29157
+
29158
+ /** @license React v16.13.1
29159
+ * react-is.production.min.js
29160
+ *
29161
+ * Copyright (c) Facebook, Inc. and its affiliates.
29162
+ *
29163
+ * This source code is licensed under the MIT license found in the
29164
+ * LICENSE file in the root directory of this source tree.
29165
+ */
29166
+ var hasRequiredReactIs_production_min;
29167
+ function requireReactIs_production_min() {
29168
+ if (hasRequiredReactIs_production_min) return reactIs_production_min;
29169
+ hasRequiredReactIs_production_min = 1;
29170
+ var b = "function" === typeof Symbol && Symbol.for,
29171
+ c = b ? Symbol.for("react.element") : 60103,
29172
+ d = b ? Symbol.for("react.portal") : 60106,
29173
+ e = b ? Symbol.for("react.fragment") : 60107,
29174
+ f = b ? Symbol.for("react.strict_mode") : 60108,
29175
+ g = b ? Symbol.for("react.profiler") : 60114,
29176
+ h = b ? Symbol.for("react.provider") : 60109,
29177
+ k = b ? Symbol.for("react.context") : 60110,
29178
+ l = b ? Symbol.for("react.async_mode") : 60111,
29179
+ m = b ? Symbol.for("react.concurrent_mode") : 60111,
29180
+ n = b ? Symbol.for("react.forward_ref") : 60112,
29181
+ p = b ? Symbol.for("react.suspense") : 60113,
29182
+ q = b ? Symbol.for("react.suspense_list") : 60120,
29183
+ r = b ? Symbol.for("react.memo") : 60115,
29184
+ t = b ? Symbol.for("react.lazy") : 60116,
29185
+ v = b ? Symbol.for("react.block") : 60121,
29186
+ w = b ? Symbol.for("react.fundamental") : 60117,
29187
+ x = b ? Symbol.for("react.responder") : 60118,
29188
+ y = b ? Symbol.for("react.scope") : 60119;
29189
+ function z(a) {
29190
+ if ("object" === typeof a && null !== a) {
29191
+ var u = a.$$typeof;
29192
+ switch (u) {
29193
+ case c:
29194
+ switch (a = a.type, a) {
29195
+ case l:
29196
+ case m:
29197
+ case e:
29198
+ case g:
29199
+ case f:
29200
+ case p:
29201
+ return a;
29202
+ default:
29203
+ switch (a = a && a.$$typeof, a) {
29204
+ case k:
29205
+ case n:
29206
+ case t:
29207
+ case r:
29208
+ case h:
29209
+ return a;
29210
+ default:
29211
+ return u;
29212
+ }
29213
+ }
29214
+ case d:
29215
+ return u;
29216
+ }
29217
+ }
29218
+ }
29219
+ function A(a) {
29220
+ return z(a) === m;
29221
+ }
29222
+ reactIs_production_min.AsyncMode = l;
29223
+ reactIs_production_min.ConcurrentMode = m;
29224
+ reactIs_production_min.ContextConsumer = k;
29225
+ reactIs_production_min.ContextProvider = h;
29226
+ reactIs_production_min.Element = c;
29227
+ reactIs_production_min.ForwardRef = n;
29228
+ reactIs_production_min.Fragment = e;
29229
+ reactIs_production_min.Lazy = t;
29230
+ reactIs_production_min.Memo = r;
29231
+ reactIs_production_min.Portal = d;
29232
+ reactIs_production_min.Profiler = g;
29233
+ reactIs_production_min.StrictMode = f;
29234
+ reactIs_production_min.Suspense = p;
29235
+ reactIs_production_min.isAsyncMode = function (a) {
29236
+ return A(a) || z(a) === l;
29237
+ };
29238
+ reactIs_production_min.isConcurrentMode = A;
29239
+ reactIs_production_min.isContextConsumer = function (a) {
29240
+ return z(a) === k;
29241
+ };
29242
+ reactIs_production_min.isContextProvider = function (a) {
29243
+ return z(a) === h;
29244
+ };
29245
+ reactIs_production_min.isElement = function (a) {
29246
+ return "object" === typeof a && null !== a && a.$$typeof === c;
29247
+ };
29248
+ reactIs_production_min.isForwardRef = function (a) {
29249
+ return z(a) === n;
29250
+ };
29251
+ reactIs_production_min.isFragment = function (a) {
29252
+ return z(a) === e;
29253
+ };
29254
+ reactIs_production_min.isLazy = function (a) {
29255
+ return z(a) === t;
29256
+ };
29257
+ reactIs_production_min.isMemo = function (a) {
29258
+ return z(a) === r;
29259
+ };
29260
+ reactIs_production_min.isPortal = function (a) {
29261
+ return z(a) === d;
29262
+ };
29263
+ reactIs_production_min.isProfiler = function (a) {
29264
+ return z(a) === g;
29265
+ };
29266
+ reactIs_production_min.isStrictMode = function (a) {
29267
+ return z(a) === f;
29268
+ };
29269
+ reactIs_production_min.isSuspense = function (a) {
29270
+ return z(a) === p;
29271
+ };
29272
+ reactIs_production_min.isValidElementType = function (a) {
29273
+ return "string" === typeof a || "function" === typeof a || a === e || a === m || a === g || a === f || a === p || a === q || "object" === typeof a && null !== a && (a.$$typeof === t || a.$$typeof === r || a.$$typeof === h || a.$$typeof === k || a.$$typeof === n || a.$$typeof === w || a.$$typeof === x || a.$$typeof === y || a.$$typeof === v);
29274
+ };
29275
+ reactIs_production_min.typeOf = z;
29276
+ return reactIs_production_min;
29277
+ }
29278
+
29279
+ var reactIs_development = {};
29280
+
29281
+ /** @license React v16.13.1
29282
+ * react-is.development.js
29283
+ *
29284
+ * Copyright (c) Facebook, Inc. and its affiliates.
29285
+ *
29286
+ * This source code is licensed under the MIT license found in the
29287
+ * LICENSE file in the root directory of this source tree.
29288
+ */
29289
+ var hasRequiredReactIs_development;
29290
+ function requireReactIs_development() {
29291
+ if (hasRequiredReactIs_development) return reactIs_development;
29292
+ hasRequiredReactIs_development = 1;
29293
+ if (process.env.NODE_ENV !== "production") {
29294
+ (function () {
29295
+
29296
+ // The Symbol used to tag the ReactElement-like types. If there is no native Symbol
29297
+ // nor polyfill, then a plain number is used for performance.
29298
+ var hasSymbol = typeof Symbol === 'function' && Symbol.for;
29299
+ var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for('react.element') : 0xeac7;
29300
+ var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for('react.portal') : 0xeaca;
29301
+ var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for('react.fragment') : 0xeacb;
29302
+ var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeacc;
29303
+ var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
29304
+ var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
29305
+ var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace; // TODO: We don't use AsyncMode or ConcurrentMode anymore. They were temporary
29306
+ // (unstable) APIs that have been removed. Can we remove the symbols?
29307
+
29308
+ var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for('react.async_mode') : 0xeacf;
29309
+ var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for('react.concurrent_mode') : 0xeacf;
29310
+ var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
29311
+ var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for('react.suspense') : 0xead1;
29312
+ var REACT_SUSPENSE_LIST_TYPE = hasSymbol ? Symbol.for('react.suspense_list') : 0xead8;
29313
+ var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
29314
+ var REACT_LAZY_TYPE = hasSymbol ? Symbol.for('react.lazy') : 0xead4;
29315
+ var REACT_BLOCK_TYPE = hasSymbol ? Symbol.for('react.block') : 0xead9;
29316
+ var REACT_FUNDAMENTAL_TYPE = hasSymbol ? Symbol.for('react.fundamental') : 0xead5;
29317
+ var REACT_RESPONDER_TYPE = hasSymbol ? Symbol.for('react.responder') : 0xead6;
29318
+ var REACT_SCOPE_TYPE = hasSymbol ? Symbol.for('react.scope') : 0xead7;
29319
+ function isValidElementType(type) {
29320
+ return typeof type === 'string' || typeof type === 'function' ||
29321
+ // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
29322
+ type === REACT_FRAGMENT_TYPE || type === REACT_CONCURRENT_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || typeof type === 'object' && type !== null && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_RESPONDER_TYPE || type.$$typeof === REACT_SCOPE_TYPE || type.$$typeof === REACT_BLOCK_TYPE);
29323
+ }
29324
+ function typeOf(object) {
29325
+ if (typeof object === 'object' && object !== null) {
29326
+ var $$typeof = object.$$typeof;
29327
+ switch ($$typeof) {
29328
+ case REACT_ELEMENT_TYPE:
29329
+ var type = object.type;
29330
+ switch (type) {
29331
+ case REACT_ASYNC_MODE_TYPE:
29332
+ case REACT_CONCURRENT_MODE_TYPE:
29333
+ case REACT_FRAGMENT_TYPE:
29334
+ case REACT_PROFILER_TYPE:
29335
+ case REACT_STRICT_MODE_TYPE:
29336
+ case REACT_SUSPENSE_TYPE:
29337
+ return type;
29338
+ default:
29339
+ var $$typeofType = type && type.$$typeof;
29340
+ switch ($$typeofType) {
29341
+ case REACT_CONTEXT_TYPE:
29342
+ case REACT_FORWARD_REF_TYPE:
29343
+ case REACT_LAZY_TYPE:
29344
+ case REACT_MEMO_TYPE:
29345
+ case REACT_PROVIDER_TYPE:
29346
+ return $$typeofType;
29347
+ default:
29348
+ return $$typeof;
29349
+ }
29350
+ }
29351
+ case REACT_PORTAL_TYPE:
29352
+ return $$typeof;
29353
+ }
29354
+ }
29355
+ return undefined;
29356
+ } // AsyncMode is deprecated along with isAsyncMode
29357
+
29358
+ var AsyncMode = REACT_ASYNC_MODE_TYPE;
29359
+ var ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
29360
+ var ContextConsumer = REACT_CONTEXT_TYPE;
29361
+ var ContextProvider = REACT_PROVIDER_TYPE;
29362
+ var Element = REACT_ELEMENT_TYPE;
29363
+ var ForwardRef = REACT_FORWARD_REF_TYPE;
29364
+ var Fragment = REACT_FRAGMENT_TYPE;
29365
+ var Lazy = REACT_LAZY_TYPE;
29366
+ var Memo = REACT_MEMO_TYPE;
29367
+ var Portal = REACT_PORTAL_TYPE;
29368
+ var Profiler = REACT_PROFILER_TYPE;
29369
+ var StrictMode = REACT_STRICT_MODE_TYPE;
29370
+ var Suspense = REACT_SUSPENSE_TYPE;
29371
+ var hasWarnedAboutDeprecatedIsAsyncMode = false; // AsyncMode should be deprecated
29372
+
29373
+ function isAsyncMode(object) {
29374
+ {
29375
+ if (!hasWarnedAboutDeprecatedIsAsyncMode) {
29376
+ hasWarnedAboutDeprecatedIsAsyncMode = true; // Using console['warn'] to evade Babel and ESLint
29377
+
29378
+ console['warn']('The ReactIs.isAsyncMode() alias has been deprecated, ' + 'and will be removed in React 17+. Update your code to use ' + 'ReactIs.isConcurrentMode() instead. It has the exact same API.');
29379
+ }
29380
+ }
29381
+ return isConcurrentMode(object) || typeOf(object) === REACT_ASYNC_MODE_TYPE;
29382
+ }
29383
+ function isConcurrentMode(object) {
29384
+ return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
29385
+ }
29386
+ function isContextConsumer(object) {
29387
+ return typeOf(object) === REACT_CONTEXT_TYPE;
29388
+ }
29389
+ function isContextProvider(object) {
29390
+ return typeOf(object) === REACT_PROVIDER_TYPE;
29391
+ }
29392
+ function isElement(object) {
29393
+ return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
29394
+ }
29395
+ function isForwardRef(object) {
29396
+ return typeOf(object) === REACT_FORWARD_REF_TYPE;
29397
+ }
29398
+ function isFragment(object) {
29399
+ return typeOf(object) === REACT_FRAGMENT_TYPE;
29400
+ }
29401
+ function isLazy(object) {
29402
+ return typeOf(object) === REACT_LAZY_TYPE;
29403
+ }
29404
+ function isMemo(object) {
29405
+ return typeOf(object) === REACT_MEMO_TYPE;
29406
+ }
29407
+ function isPortal(object) {
29408
+ return typeOf(object) === REACT_PORTAL_TYPE;
29409
+ }
29410
+ function isProfiler(object) {
29411
+ return typeOf(object) === REACT_PROFILER_TYPE;
29412
+ }
29413
+ function isStrictMode(object) {
29414
+ return typeOf(object) === REACT_STRICT_MODE_TYPE;
29415
+ }
29416
+ function isSuspense(object) {
29417
+ return typeOf(object) === REACT_SUSPENSE_TYPE;
29418
+ }
29419
+ reactIs_development.AsyncMode = AsyncMode;
29420
+ reactIs_development.ConcurrentMode = ConcurrentMode;
29421
+ reactIs_development.ContextConsumer = ContextConsumer;
29422
+ reactIs_development.ContextProvider = ContextProvider;
29423
+ reactIs_development.Element = Element;
29424
+ reactIs_development.ForwardRef = ForwardRef;
29425
+ reactIs_development.Fragment = Fragment;
29426
+ reactIs_development.Lazy = Lazy;
29427
+ reactIs_development.Memo = Memo;
29428
+ reactIs_development.Portal = Portal;
29429
+ reactIs_development.Profiler = Profiler;
29430
+ reactIs_development.StrictMode = StrictMode;
29431
+ reactIs_development.Suspense = Suspense;
29432
+ reactIs_development.isAsyncMode = isAsyncMode;
29433
+ reactIs_development.isConcurrentMode = isConcurrentMode;
29434
+ reactIs_development.isContextConsumer = isContextConsumer;
29435
+ reactIs_development.isContextProvider = isContextProvider;
29436
+ reactIs_development.isElement = isElement;
29437
+ reactIs_development.isForwardRef = isForwardRef;
29438
+ reactIs_development.isFragment = isFragment;
29439
+ reactIs_development.isLazy = isLazy;
29440
+ reactIs_development.isMemo = isMemo;
29441
+ reactIs_development.isPortal = isPortal;
29442
+ reactIs_development.isProfiler = isProfiler;
29443
+ reactIs_development.isStrictMode = isStrictMode;
29444
+ reactIs_development.isSuspense = isSuspense;
29445
+ reactIs_development.isValidElementType = isValidElementType;
29446
+ reactIs_development.typeOf = typeOf;
29447
+ })();
29448
+ }
29449
+ return reactIs_development;
29450
+ }
29451
+
29452
+ var hasRequiredReactIs;
29453
+ function requireReactIs() {
29454
+ if (hasRequiredReactIs) return reactIs.exports;
29455
+ hasRequiredReactIs = 1;
29456
+ if (process.env.NODE_ENV === 'production') {
29457
+ reactIs.exports = requireReactIs_production_min();
29458
+ } else {
29459
+ reactIs.exports = requireReactIs_development();
29460
+ }
29461
+ return reactIs.exports;
29462
+ }
29463
+
29251
29464
  var hoistNonReactStatics_cjs;
29252
29465
  var hasRequiredHoistNonReactStatics_cjs;
29253
29466
  function requireHoistNonReactStatics_cjs() {
@@ -30411,7 +30624,8 @@ const Branches = ({
30411
30624
  readOnly
30412
30625
  }) => {
30413
30626
  const evenRow = rowIndex % 2 === 0;
30414
- const lastMachineInstance = checkEmpty(machineInstances[machineColumnCount - 1]);
30627
+ const getLastIndex = readOnly ? 0 : 1;
30628
+ const lastMachineInstance = checkEmpty(machineInstances[machineColumnCount - getLastIndex]);
30415
30629
  const getBorderStyle = (currentBranch, nextBranch) => {
30416
30630
  if (currentBranch && nextBranch && 'machineInstanceId' in currentBranch && 'machineInstanceId' in nextBranch) {
30417
30631
  return currentBranch.machineInstanceId === nextBranch.machineInstanceId ? 'dashed' : 'solid';
@@ -30568,16 +30782,18 @@ const Branches = ({
30568
30782
  color: "var(--ff-connecting-branch-color)",
30569
30783
  children: "Dataset List"
30570
30784
  })]
30571
- }), jsxRuntime.jsx(Icon, {
30572
- name: "plus_icon",
30573
- className: "ff-connecting-icon",
30574
- onClick: () => onAddRunBrowser(machineInstanceId),
30575
- color: "var(--ff-connecting-branch-color)",
30576
- hoverEffect: true
30577
- }), jsxRuntime.jsx(Typography, {
30578
- className: "ff-connecting-text",
30579
- color: "var(--ff-connecting-branch-color)",
30580
- children: "Run"
30785
+ }), !readOnly && jsxRuntime.jsxs(jsxRuntime.Fragment, {
30786
+ children: [jsxRuntime.jsx(Icon, {
30787
+ name: "plus_icon",
30788
+ className: "ff-connecting-icon",
30789
+ onClick: () => onAddRunBrowser(machineInstanceId),
30790
+ color: "var(--ff-connecting-branch-color)",
30791
+ hoverEffect: true
30792
+ }), jsxRuntime.jsx(Typography, {
30793
+ className: "ff-connecting-text",
30794
+ color: "var(--ff-connecting-branch-color)",
30795
+ children: "Run"
30796
+ })]
30581
30797
  })]
30582
30798
  }), !readOnly && jsxRuntime.jsx(Icon, {
30583
30799
  name: "delete",
@@ -51619,28 +51835,31 @@ const MachineInstances = ({
51619
51835
  datasetHeight,
51620
51836
  curveHeights,
51621
51837
  itemRefs,
51622
- datasetRef
51838
+ datasetRef,
51839
+ isReadOnlyMode
51623
51840
  }) => {
51624
51841
  return jsxRuntime.jsx(jsxRuntime.Fragment, {
51625
- children: parentNodeData?.machineInstances?.length === 0 ? jsxRuntime.jsxs(jsxRuntime.Fragment, {
51626
- children: [jsxRuntime.jsx("div", {
51627
- className: "ff-selectedMachines-connecting-line",
51628
- children: jsxRuntime.jsxs("div", {
51629
- className: "ff-line",
51630
- children: [jsxRuntime.jsx("div", {
51631
- className: "ff-left-icon"
51632
- }), jsxRuntime.jsx("div", {
51633
- className: "ff-right-icon"
51634
- })]
51635
- })
51636
- }), jsxRuntime.jsx("div", {
51637
- className: "ff-machine-instance ff-machine-env-button",
51638
- children: getChildNodeComponent({
51639
- isButton: true,
51640
- parentNodeData,
51641
- parentNodeIndex
51642
- })
51643
- })]
51842
+ children: parentNodeData?.machineInstances?.length === 0 ? jsxRuntime.jsx(jsxRuntime.Fragment, {
51843
+ children: !isReadOnlyMode && jsxRuntime.jsxs(jsxRuntime.Fragment, {
51844
+ children: [jsxRuntime.jsx("div", {
51845
+ className: "ff-selectedMachines-connecting-line",
51846
+ children: jsxRuntime.jsxs("div", {
51847
+ className: "ff-line",
51848
+ children: [jsxRuntime.jsx("div", {
51849
+ className: "ff-left-icon"
51850
+ }), jsxRuntime.jsx("div", {
51851
+ className: "ff-right-icon"
51852
+ })]
51853
+ })
51854
+ }), jsxRuntime.jsx("div", {
51855
+ className: "ff-machine-instance ff-machine-env-button",
51856
+ children: getChildNodeComponent({
51857
+ isButton: true,
51858
+ parentNodeData,
51859
+ parentNodeIndex
51860
+ })
51861
+ })]
51862
+ })
51644
51863
  }) : parentNodeData?.machineInstances?.map((childNodeData, childNodeIndex) => {
51645
51864
  const isFirstLine = childNodeIndex === 0;
51646
51865
  return jsxRuntime.jsxs("div", {
@@ -51703,26 +51922,28 @@ const MachineInstances = ({
51703
51922
  })]
51704
51923
  }, ffid())
51705
51924
  }, runLevelExecutionDataSet?.runLevelExecutionDataSetId + ffid()))
51706
- }), childNodeIndex === parentNodeData.machineInstances.length - 1 && jsxRuntime.jsxs(jsxRuntime.Fragment, {
51707
- children: [jsxRuntime.jsx("div", {
51708
- className: "ff-selectedMachines-connecting-line ff-second-line",
51709
- children: jsxRuntime.jsxs("div", {
51710
- className: "ff-line",
51711
- children: [jsxRuntime.jsx("div", {
51712
- className: "ff-left-icon"
51713
- }), jsxRuntime.jsx("div", {
51714
- className: "ff-right-icon"
51715
- })]
51716
- })
51717
- }), jsxRuntime.jsx("div", {
51718
- className: "ff-machine-instance ff-machine-env-button",
51719
- children: getChildNodeComponent({
51720
- isButton: true,
51721
- parentNodeData,
51722
- parentNodeIndex,
51723
- childNodeIndex: childNodeIndex + 1
51724
- })
51725
- })]
51925
+ }), childNodeIndex === parentNodeData.machineInstances.length - 1 && jsxRuntime.jsx(jsxRuntime.Fragment, {
51926
+ children: !isReadOnlyMode && jsxRuntime.jsxs(jsxRuntime.Fragment, {
51927
+ children: [jsxRuntime.jsx("div", {
51928
+ className: "ff-selectedMachines-connecting-line ff-second-line",
51929
+ children: jsxRuntime.jsxs("div", {
51930
+ className: "ff-line",
51931
+ children: [jsxRuntime.jsx("div", {
51932
+ className: "ff-left-icon"
51933
+ }), jsxRuntime.jsx("div", {
51934
+ className: "ff-right-icon"
51935
+ })]
51936
+ })
51937
+ }), jsxRuntime.jsx("div", {
51938
+ className: "ff-machine-instance ff-machine-env-button",
51939
+ children: getChildNodeComponent({
51940
+ isButton: true,
51941
+ parentNodeData,
51942
+ parentNodeIndex,
51943
+ childNodeIndex: childNodeIndex + 1
51944
+ })
51945
+ })]
51946
+ })
51726
51947
  })]
51727
51948
  }, ffid());
51728
51949
  })
@@ -51734,17 +51955,19 @@ const ConnectingBranch = ({
51734
51955
  getChildNodeComponent,
51735
51956
  getParentNodeComponent,
51736
51957
  getParentNodeComponentActionItems,
51737
- childNodeCurveHeight = 1.28
51958
+ childNodeCurveHeight = 1.28,
51959
+ isReadOnlyMode = false
51738
51960
  }) => {
51739
51961
  const datasetRef = React.useRef(null);
51740
51962
  const [datasetHeight, setDatasetHeight] = React.useState(0);
51741
51963
  const [curveHeights, setCurveHeights] = React.useState([]);
51742
51964
  const itemRefs = React.useRef([]);
51743
51965
  const calculateVerticalLineHeight = (machineInstances, datasetHeight, gap) => {
51744
- const totalDataSets = machineInstances.reduce((acc, instance) => {
51745
- return acc + (instance.runLevelExecutionDataSets?.length || 0);
51746
- }, 0);
51747
- return totalDataSets * datasetHeight + totalDataSets * gap;
51966
+ if (machineInstances.length === 1 && isReadOnlyMode) {
51967
+ return 0;
51968
+ }
51969
+ const totalDataSets = machineInstances.reduce((acc, instance, index) => acc + (index !== machineInstances.length - 1 || !isReadOnlyMode ? instance.runLevelExecutionDataSets?.length || 0 : 0), 0);
51970
+ return totalDataSets * (datasetHeight + gap);
51748
51971
  };
51749
51972
  React.useEffect(() => {
51750
51973
  if (datasetRef.current) {
@@ -51848,11 +52071,12 @@ const ConnectingBranch = ({
51848
52071
  curveHeights: curveHeights,
51849
52072
  itemRefs: itemRefs,
51850
52073
  datasetRef: datasetRef,
51851
- getChildNodeComponent: getChildNodeComponent
52074
+ getChildNodeComponent: getChildNodeComponent,
52075
+ isReadOnlyMode: isReadOnlyMode
51852
52076
  })]
51853
52077
  })]
51854
52078
  }, ffid());
51855
- }), jsxRuntime.jsx("div", {
52079
+ }), !isReadOnlyMode && jsxRuntime.jsx("div", {
51856
52080
  className: "ff-select-machine-input",
51857
52081
  style: {
51858
52082
  gridRow: `${currentRow}`