@northlight/ui 2.38.0 → 2.38.2

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.
@@ -996,7 +996,14 @@ interface DatePickerSettings {
996
996
  interface DatePickerProps extends Omit<AriaDatePickerProps<DateValue>, 'firstDayOfWeek'>, DatePickerSettings {
997
997
  }
998
998
  interface DateRangePickerProps extends Omit<AriaDateRangePickerProps<DateValue>, 'firstDayOfWeek' | 'onChange' | 'value' | 'minValue' | 'maxValue'>, DatePickerSettings {
999
+ /**
1000
+ * Function to be called when the user changes the date, both in
1001
+ * the modal and the input field.
1002
+ */
999
1003
  onChange?: (date: null | DateRange) => void;
1004
+ /**
1005
+ * Function to be called when the user saves the date change.
1006
+ */
1000
1007
  onSave?: () => void;
1001
1008
  value: DateRange | null;
1002
1009
  minValue?: string | undefined;
@@ -1004,12 +1011,37 @@ interface DateRangePickerProps extends Omit<AriaDateRangePickerProps<DateValue>,
1004
1011
  fiscalStartMonth?: number;
1005
1012
  fiscalStartDay?: number;
1006
1013
  renderInPortal?: boolean;
1014
+ /**
1015
+ * Label for the save button in the date range picker modal
1016
+ */
1007
1017
  buttonLabel?: string;
1008
- setIsOpen?: (isOpen: boolean) => void;
1018
+ /**
1019
+ * The previously saved date range used for save/cancel functionality.
1020
+ * When provided along with defaultDateRange, enables save and cancel buttons that appear
1021
+ * when the current value differs from the saved value. The component will revert to this
1022
+ * value when the popover is closed without saving or when cancel is clicked.
1023
+ */
1009
1024
  savedDateRange?: DateRange | null;
1025
+ /**
1026
+ * The default date range to set when the input is cleared.
1027
+ * When provided, the clear button will be shown next to the input field when
1028
+ * modal is closed if the current value differs from the default value.
1029
+ * If not provided, the clear button will always be shown when modal is closed.
1030
+ */
1010
1031
  defaultDateRange?: DateRange | null;
1032
+ /**
1033
+ * Custom reset button to be shown next to the input field when modal is closed.
1034
+ * If not provided, the default clear button will be shown.
1035
+ */
1011
1036
  CustomResetButton?: React.ReactNode;
1037
+ /**
1038
+ * Custom label for the clear button in the date range picker modal
1039
+ */
1012
1040
  clearButtonLabel?: string;
1041
+ /**
1042
+ * Function to be called when the user cancels the date change
1043
+ */
1044
+ onCancelChanges?: () => void;
1013
1045
  }
1014
1046
  interface DatePickerFieldProps extends Omit<InputProps, 'onChange'>, InputFieldProps {
1015
1047
  name: string;
@@ -1,4 +1,4 @@
1
- import { Accordion as Accordion$1, AccordionButton as AccordionButton$1, AccordionPanel as AccordionPanel$1, AccordionItem as AccordionItem$1, useInterval, useMediaQuery, useToken as useToken$1, extendTheme, Box, useMultiStyleConfig, chakra, Alert as Alert$2, AspectRatio as AspectRatio$1, forwardRef, useStyleConfig, Icon as Icon$2, Heading, Text, FormLabel as FormLabel$1, VisuallyHidden, HStack, Badge as Badge$2, Flex, Spinner as Spinner$2, Button as Button$2, Checkbox as Checkbox$2, FormControl, Stack, FormErrorMessage, CheckboxGroup, IconButton as IconButton$1, Popover as Popover$2, Portal, useDisclosure, useBoolean, PopoverTrigger, PopoverContent, PopoverHeader, PopoverBody, SimpleGrid, SlideFade as SlideFade$1, Table as Table$2, Thead, Tr, Tbody, Select as Select$2, PopoverAnchor, InputGroup, InputRightElement, Link as Link$1, Spacer, useOutsideClick, Tooltip as Tooltip$2, VStack, Circle, Center, Fade as Fade$1, ScaleFade as ScaleFade$1, Slide as Slide$1, Collapse as Collapse$1, CloseButton as CloseButton$1, Radio as Radio$2, RadioGroup as RadioGroup$1, Tag as Tag$2, TagLabel, TagRightIcon, useEditableControls, useEditableState, Editable, InputLeftElement, Input as Input$1, EditablePreview, EditableInput, Modal as Modal$2, ModalOverlay, ModalContent, ModalCloseButton, ModalBody as ModalBody$1, ModalHeader, Slider, SliderTrack, SliderFilledTrack, SliderThumb, ModalFooter, Progress as Progress$1, Image as Image$1, ChakraProvider, Menu as Menu$2, NumberInputStepper as NumberInputStepper$1, Divider, NumberIncrementStepper, NumberDecrementStepper, NumberInput as NumberInput$2, NumberInputField as NumberInputField$1, PinInput as PinInput$2, Switch as Switch$2, TabPanel as TabPanel$1, Tabs as Tabs$2, Textarea as Textarea$2, useToast as useToast$1, AlertTitle, AlertDescription, Tab, TabList, useClipboard, Grid, GridItem, theme as theme$1 } from '@chakra-ui/react';
1
+ import { Accordion as Accordion$1, AccordionButton as AccordionButton$1, AccordionPanel as AccordionPanel$1, AccordionItem as AccordionItem$1, useInterval, useMediaQuery, useToken as useToken$1, extendTheme, Box, useMultiStyleConfig, chakra, Alert as Alert$2, AspectRatio as AspectRatio$1, forwardRef, useStyleConfig, Icon as Icon$2, Heading, Text, FormLabel as FormLabel$1, VisuallyHidden, HStack, Badge as Badge$2, Flex, Spinner as Spinner$2, Button as Button$2, Checkbox as Checkbox$2, FormControl, Stack, FormErrorMessage, CheckboxGroup, IconButton as IconButton$1, Popover as Popover$2, Portal, useDisclosure, useBoolean, PopoverTrigger, PopoverContent, PopoverHeader, PopoverBody, SimpleGrid, SlideFade as SlideFade$1, Table as Table$2, Thead, Tr, Tbody, Select as Select$2, PopoverAnchor, InputGroup, InputRightElement, Link as Link$1, Spacer, Tooltip as Tooltip$2, VStack, useOutsideClick, Circle, Center, Fade as Fade$1, ScaleFade as ScaleFade$1, Slide as Slide$1, Collapse as Collapse$1, CloseButton as CloseButton$1, Radio as Radio$2, RadioGroup as RadioGroup$1, Tag as Tag$2, TagLabel, TagRightIcon, useEditableControls, useEditableState, Editable, InputLeftElement, Input as Input$1, EditablePreview, EditableInput, Modal as Modal$2, ModalOverlay, ModalContent, ModalCloseButton, ModalBody as ModalBody$1, ModalHeader, Slider, SliderTrack, SliderFilledTrack, SliderThumb, ModalFooter, Progress as Progress$1, Image as Image$1, ChakraProvider, Menu as Menu$2, NumberInputStepper as NumberInputStepper$1, Divider, NumberIncrementStepper, NumberDecrementStepper, NumberInput as NumberInput$2, NumberInputField as NumberInputField$1, PinInput as PinInput$2, Switch as Switch$2, TabPanel as TabPanel$1, Tabs as Tabs$2, Textarea as Textarea$2, useToast as useToast$1, AlertTitle, AlertDescription, Tab, TabList, useClipboard, Grid, GridItem, theme as theme$1 } from '@chakra-ui/react';
2
2
  export { AbsoluteCenter, AccordionIcon, AlertDescription, AlertDialog, AlertDialogBody, AlertDialogCloseButton, AlertDialogContent, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertIcon, AlertTitle, Box, BreadcrumbItem as Breadcrumb, BreadcrumbLink, BreadcrumbSeparator, Breadcrumb as Breadcrumbs, ButtonGroup, Card, CardBody, CardFooter, CardHeader, Center, Modal as ChakraModal, CheckboxGroup, Circle, CircularProgress, CircularProgressLabel, CloseButton, Code, Container, Divider, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerFooter, DrawerHeader, DrawerOverlay, Editable, EditableInput, EditablePreview, Flex, FormControl, FormErrorMessage, FormHelperText, Grid, GridItem, HStack, Heading, Hide, Highlight, Image, Input, InputAddon, InputGroup, InputLeftAddon, InputLeftElement, InputRightAddon, InputRightElement, Kbd, Link, LinkBox, LinkOverlay, List, ListIcon, ListItem, Mark, MenuButton, MenuCommand, MenuDivider, MenuGroup, MenuIcon, MenuItem, MenuItemOption, MenuList, MenuOptionGroup, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, NumberDecrementStepper, NumberIncrementStepper, OrderedList, PinInputField, PopoverAnchor, PopoverArrow, PopoverBody, PopoverCloseButton, PopoverContent, PopoverFooter, PopoverHeader, PopoverTrigger, Portal, RangeSlider, RangeSliderFilledTrack, RangeSliderMark, RangeSliderThumb, RangeSliderTrack, Show, SimpleGrid, Skeleton, SkeletonCircle, SkeletonText, Slider, SliderFilledTrack, SliderMark, SliderThumb, SliderTrack, Spacer, Stack, StackDivider, Stat, StatArrow, StatGroup, StatHelpText, StatLabel, StatNumber, TabIndicator as StepIndicator, TabPanels as StepPanels, Tab, TabIndicator, TabList, TabPanels, TableCaption, TableContainer, TagCloseButton, TagLabel, TagLeftIcon, TagRightIcon, Tbody, Td, Text, Tfoot, Th, Thead, Tr, UnorderedList, VStack, VisuallyHidden, VisuallyHiddenInput, Wrap, WrapItem, useBoolean, useBreakpoint, useBreakpointValue, useClipboard, useControllableProp, useControllableState, useDisclosure, useEditable, useEditableControls, useEditableState, useInterval, useMediaQuery, useMergeRefs, useNumberInput, useOutsideClick, usePrefersReducedMotion, useRadio, useRadioGroup, useTab, useTabs, useTheme, useToken } from '@chakra-ui/react';
3
3
  import React, { useState, useEffect, useRef, isValidElement, cloneElement, Children, createContext, useContext, forwardRef as forwardRef$1, useImperativeHandle, memo, useMemo, useCallback } from 'react';
4
4
  import { CreatableSelect, chakraComponents, AsyncSelect, Select as Select$3 } from 'chakra-react-select';
@@ -7765,8 +7765,7 @@ const RangeCalendar = (props) => {
7765
7765
  firstDayOfWeek,
7766
7766
  onSave,
7767
7767
  buttonLabel = "Save",
7768
- clearButtonLabel = "Clear",
7769
- onCancel
7768
+ clearButtonLabel = "Clear"
7770
7769
  } = props;
7771
7770
  const { locale } = useLocale();
7772
7771
  const ref = useRef(null);
@@ -7797,14 +7796,6 @@ const RangeCalendar = (props) => {
7797
7796
  locale,
7798
7797
  createCalendar: () => new GregorianCalendar()
7799
7798
  });
7800
- const handleOnReset = () => {
7801
- if (onCancel) {
7802
- onCancel();
7803
- } else {
7804
- resetDate();
7805
- }
7806
- handleClose();
7807
- };
7808
7799
  const focusDateRange = (dateRange) => {
7809
7800
  if (dateRange && dateRange.start && dateRange.end) {
7810
7801
  calendarOneState.setFocusedDate(dateRange.start);
@@ -7824,6 +7815,10 @@ const RangeCalendar = (props) => {
7824
7815
  onSave == null ? void 0 : onSave();
7825
7816
  handleClose();
7826
7817
  };
7818
+ const handleReset = () => {
7819
+ resetDate();
7820
+ handleClose();
7821
+ };
7827
7822
  return /* @__PURE__ */ React.createElement(Box, { ref, __css: rangeCalendarContainer }, /* @__PURE__ */ React.createElement(Stack, null, /* @__PURE__ */ React.createElement(Flex, { gap: 4 }, /* @__PURE__ */ React.createElement(
7828
7823
  QuickSelect,
7829
7824
  {
@@ -7846,14 +7841,23 @@ const RangeCalendar = (props) => {
7846
7841
  range: value,
7847
7842
  firstDayOfWeek
7848
7843
  }
7849
- ))), /* @__PURE__ */ React.createElement(HStack, { pt: "2", alignSelf: "end" }, isClearable && /* @__PURE__ */ React.createElement(Button, { onClick: handleOnReset, variant: "ghost", size: "sm" }, clearButtonLabel), /* @__PURE__ */ React.createElement(Button, { variant: "brand", onClick: handleSave, size: "sm" }, buttonLabel))))))));
7844
+ ))), /* @__PURE__ */ React.createElement(HStack, { pt: "2", alignSelf: "end" }, isClearable && /* @__PURE__ */ React.createElement(Button, { onClick: handleReset, variant: "ghost", size: "sm" }, clearButtonLabel), /* @__PURE__ */ React.createElement(Button, { variant: "brand", onClick: handleSave, size: "sm" }, buttonLabel))))))));
7850
7845
  };
7851
7846
 
7852
7847
  const isValidDateRange = (value) => is(Object, value) && has("startDate", value) && has("endDate", value) && is(String, value.startDate) && is(String, value.endDate);
7853
7848
 
7849
+ const tooltipIconMap = {
7850
+ success: CheckCircleSolid,
7851
+ warning: AlertTriangleSolid,
7852
+ error: AlertCircleSolid,
7853
+ danger: AlertOctagonSolid,
7854
+ info: InfoSolid,
7855
+ ai: BrightnessSolid,
7856
+ default: HelpCircleSolid,
7857
+ ghost: HelpCircleSolid
7858
+ };
7859
+
7854
7860
  var __defProp$1p = Object.defineProperty;
7855
- var __defProps$e = Object.defineProperties;
7856
- var __getOwnPropDescs$e = Object.getOwnPropertyDescriptors;
7857
7861
  var __getOwnPropSymbols$1p = Object.getOwnPropertySymbols;
7858
7862
  var __hasOwnProp$1p = Object.prototype.hasOwnProperty;
7859
7863
  var __propIsEnum$1p = Object.prototype.propertyIsEnumerable;
@@ -7869,6 +7873,73 @@ var __spreadValues$1p = (a, b) => {
7869
7873
  }
7870
7874
  return a;
7871
7875
  };
7876
+ var __objRest$1b = (source, exclude) => {
7877
+ var target = {};
7878
+ for (var prop in source)
7879
+ if (__hasOwnProp$1p.call(source, prop) && exclude.indexOf(prop) < 0)
7880
+ target[prop] = source[prop];
7881
+ if (source != null && __getOwnPropSymbols$1p)
7882
+ for (var prop of __getOwnPropSymbols$1p(source)) {
7883
+ if (exclude.indexOf(prop) < 0 && __propIsEnum$1p.call(source, prop))
7884
+ target[prop] = source[prop];
7885
+ }
7886
+ return target;
7887
+ };
7888
+ const Tooltip = (_a) => {
7889
+ var _b = _a, {
7890
+ variant = "default",
7891
+ hasArrow = true,
7892
+ title = "",
7893
+ description = "",
7894
+ hasIcon = false
7895
+ } = _b, rest = __objRest$1b(_b, [
7896
+ "variant",
7897
+ "hasArrow",
7898
+ "title",
7899
+ "description",
7900
+ "hasIcon"
7901
+ ]);
7902
+ const iconVariant = variant;
7903
+ const icon = tooltipIconMap[iconVariant];
7904
+ const TooltipContent = /* @__PURE__ */ React.createElement(HStack, { alignItems: "flex-start" }, hasIcon && /* @__PURE__ */ React.createElement(Icon, { as: icon, color: `icon.toast.${iconVariant}` }), /* @__PURE__ */ React.createElement(VStack, { spacing: 0, alignItems: "flex-start" }, /* @__PURE__ */ React.createElement(Label, { size: "sm" }, title), /* @__PURE__ */ React.createElement(
7905
+ P,
7906
+ {
7907
+ variant: "14",
7908
+ sx: {
7909
+ color: !variant || variant === "ai" ? "text.inverted" : "text.default"
7910
+ }
7911
+ },
7912
+ description
7913
+ )));
7914
+ return /* @__PURE__ */ React.createElement(
7915
+ Tooltip$2,
7916
+ __spreadValues$1p({
7917
+ hasArrow,
7918
+ hasIcon,
7919
+ label: title || description ? TooltipContent : void 0,
7920
+ variant
7921
+ }, rest)
7922
+ );
7923
+ };
7924
+
7925
+ var __defProp$1o = Object.defineProperty;
7926
+ var __defProps$e = Object.defineProperties;
7927
+ var __getOwnPropDescs$e = Object.getOwnPropertyDescriptors;
7928
+ var __getOwnPropSymbols$1o = Object.getOwnPropertySymbols;
7929
+ var __hasOwnProp$1o = Object.prototype.hasOwnProperty;
7930
+ var __propIsEnum$1o = Object.prototype.propertyIsEnumerable;
7931
+ var __defNormalProp$1o = (obj, key, value) => key in obj ? __defProp$1o(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
7932
+ var __spreadValues$1o = (a, b) => {
7933
+ for (var prop in b || (b = {}))
7934
+ if (__hasOwnProp$1o.call(b, prop))
7935
+ __defNormalProp$1o(a, prop, b[prop]);
7936
+ if (__getOwnPropSymbols$1o)
7937
+ for (var prop of __getOwnPropSymbols$1o(b)) {
7938
+ if (__propIsEnum$1o.call(b, prop))
7939
+ __defNormalProp$1o(a, prop, b[prop]);
7940
+ }
7941
+ return a;
7942
+ };
7872
7943
  var __spreadProps$e = (a, b) => __defProps$e(a, __getOwnPropDescs$e(b));
7873
7944
  const parseValue = (value) => {
7874
7945
  if (!isValidDateRange(value))
@@ -7904,11 +7975,10 @@ const DateRangePicker = (props) => {
7904
7975
  onSave,
7905
7976
  buttonLabel = "Save",
7906
7977
  clearButtonLabel = "Clear",
7907
- setIsOpen = () => {
7908
- },
7909
- savedDateRange = value,
7910
- defaultDateRange = value,
7911
- CustomResetButton
7978
+ savedDateRange,
7979
+ defaultDateRange,
7980
+ CustomResetButton,
7981
+ onCancelChanges
7912
7982
  } = props;
7913
7983
  const ref = useRef();
7914
7984
  const { group } = useMultiStyleConfig("DatePicker");
@@ -7936,9 +8006,6 @@ const DateRangePicker = (props) => {
7936
8006
  shouldCloseOnSelect: false,
7937
8007
  hideTimeZone: true
7938
8008
  });
7939
- useEffect(() => {
7940
- setIsOpen(state.isOpen);
7941
- }, [state.isOpen]);
7942
8009
  const {
7943
8010
  groupProps,
7944
8011
  startFieldProps,
@@ -7963,14 +8030,14 @@ const DateRangePicker = (props) => {
7963
8030
  isDisabled,
7964
8031
  isInvalid,
7965
8032
  startName: props.startName,
7966
- endName: props.endName
8033
+ endName: props.endName,
8034
+ "aria-label": "Date range picker"
7967
8035
  },
7968
8036
  state,
7969
8037
  ref
7970
8038
  );
7971
8039
  const togglePopup = () => state.setOpen(!state.isOpen);
7972
8040
  const handleClose = () => {
7973
- onChangeCallback(savedDateRange);
7974
8041
  state.setOpen(false);
7975
8042
  };
7976
8043
  useOutsideClick({
@@ -7990,50 +8057,64 @@ const DateRangePicker = (props) => {
7990
8057
  icon: /* @__PURE__ */ React.createElement(Icon, { as: XCloseSolid })
7991
8058
  }
7992
8059
  );
7993
- const isCurrentDateSaved = isDatesEqual(value, savedDateRange);
7994
- const isCurrentDateDefault = isDatesEqual(value, defaultDateRange);
7995
- const cancelDateChange = () => {
7996
- onChangeCallback(savedDateRange);
8060
+ const cancelOrResetDateChange = () => {
8061
+ if (onCancelChanges) {
8062
+ if (!isNil(savedDateRange))
8063
+ onChangeCallback(savedDateRange);
8064
+ onCancelChanges();
8065
+ } else {
8066
+ if (!isNil(defaultDateRange))
8067
+ onChangeCallback(defaultDateRange);
8068
+ resetDate();
8069
+ }
7997
8070
  };
7998
8071
  const handleSave = () => {
7999
8072
  onSave == null ? void 0 : onSave();
8000
8073
  handleClose();
8001
8074
  };
8002
- const shouldShowResetButton = !state.isOpen && isCurrentDateSaved && !isCurrentDateDefault;
8003
- const shouldShowSaveAndCancelButtons = !state.isOpen && !isCurrentDateSaved;
8075
+ const handleModalClose = () => {
8076
+ if (!isNil(savedDateRange))
8077
+ onChangeCallback(savedDateRange);
8078
+ handleClose();
8079
+ };
8080
+ const isCurrentDateSaved = isNil(savedDateRange) || isDatesEqual(value, savedDateRange);
8081
+ const isDateResettable = isNil(defaultDateRange) || !isDatesEqual(value, defaultDateRange);
8082
+ const canShowSaveAndCancelButtons = !isNil(savedDateRange) && !isNil(defaultDateRange);
8083
+ const shouldShowResetButton = !state.isOpen && isCurrentDateSaved && isDateResettable;
8084
+ const shouldShowSaveAndCancelButtons = canShowSaveAndCancelButtons && !state.isOpen && !isCurrentDateSaved;
8004
8085
  return /* @__PURE__ */ React.createElement(
8005
8086
  Popover,
8006
8087
  {
8007
8088
  isOpen: state.isOpen,
8008
- onClose: handleClose,
8089
+ onClose: handleModalClose,
8009
8090
  placement: "bottom-start"
8010
8091
  },
8011
- /* @__PURE__ */ React.createElement(PopoverAnchor, null, /* @__PURE__ */ React.createElement(HStack, null, /* @__PURE__ */ React.createElement(InputGroup, __spreadProps$e(__spreadValues$1p({}, groupProps), { ref, __css: group }), /* @__PURE__ */ React.createElement(
8092
+ /* @__PURE__ */ React.createElement(PopoverAnchor, null, /* @__PURE__ */ React.createElement(HStack, null, /* @__PURE__ */ React.createElement(InputGroup, __spreadProps$e(__spreadValues$1o({}, groupProps), { ref, __css: group }), /* @__PURE__ */ React.createElement(
8012
8093
  StyledField,
8013
8094
  {
8014
8095
  isDisabled,
8015
8096
  isInvalid,
8016
8097
  variant
8017
8098
  },
8018
- /* @__PURE__ */ React.createElement(HStack, { paddingInlineStart: "1a", paddingInlineEnd: 10 }, /* @__PURE__ */ React.createElement(DateField, __spreadProps$e(__spreadValues$1p({}, startFieldProps), { dateFormat })), /* @__PURE__ */ React.createElement(P, null, "-"), /* @__PURE__ */ React.createElement(DateField, __spreadProps$e(__spreadValues$1p({}, endFieldProps), { dateFormat })))
8099
+ /* @__PURE__ */ React.createElement(HStack, { paddingInlineStart: "1a", paddingInlineEnd: 10 }, /* @__PURE__ */ React.createElement(DateField, __spreadProps$e(__spreadValues$1o({}, startFieldProps), { dateFormat })), /* @__PURE__ */ React.createElement(P, null, "-"), /* @__PURE__ */ React.createElement(DateField, __spreadProps$e(__spreadValues$1o({}, endFieldProps), { dateFormat })))
8019
8100
  ), /* @__PURE__ */ React.createElement(InputRightElement, { sx: { height: "100%", paddingRight: "1" } }, /* @__PURE__ */ React.createElement(
8020
8101
  Trigger,
8021
- __spreadProps$e(__spreadValues$1p({}, buttonProps), {
8102
+ __spreadProps$e(__spreadValues$1o({}, buttonProps), {
8022
8103
  isDisabled,
8023
8104
  handleClick: togglePopup
8024
8105
  })
8025
- ))), shouldShowResetButton && ResetButton, shouldShowSaveAndCancelButtons && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
8106
+ ))), shouldShowResetButton && ResetButton, shouldShowSaveAndCancelButtons && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Tooltip, { label: clearButtonLabel }, /* @__PURE__ */ React.createElement(
8026
8107
  IconButton,
8027
8108
  {
8028
8109
  "aria-label": "cancel-date-change",
8029
8110
  variant: "ghost",
8030
8111
  size: "sm",
8031
8112
  fontSize: "xs",
8032
- onClick: cancelDateChange,
8113
+ onClick: onCancelChanges,
8033
8114
  isDisabled,
8034
8115
  icon: /* @__PURE__ */ React.createElement(Icon, { as: XCloseSolid })
8035
8116
  }
8036
- ), /* @__PURE__ */ React.createElement(
8117
+ )), /* @__PURE__ */ React.createElement(Tooltip, { label: buttonLabel }, /* @__PURE__ */ React.createElement(
8037
8118
  IconButton,
8038
8119
  {
8039
8120
  "aria-label": "save-date",
@@ -8041,20 +8122,20 @@ const DateRangePicker = (props) => {
8041
8122
  size: "sm",
8042
8123
  fontSize: "xs",
8043
8124
  onClick: handleSave,
8125
+ isDisabled,
8044
8126
  icon: /* @__PURE__ */ React.createElement(Icon, { as: CheckSolid })
8045
8127
  }
8046
- )))),
8047
- /* @__PURE__ */ React.createElement(PortalWrapper, { renderInPortal }, state.isOpen && /* @__PURE__ */ React.createElement(PopoverContent, __spreadProps$e(__spreadValues$1p({}, dialogProps), { ref, w: "max-content" }), /* @__PURE__ */ React.createElement(FocusScope, { contain: true, restoreFocus: true }, /* @__PURE__ */ React.createElement(DatePickerLocaleWrapper, { firstDayOfWeek }, /* @__PURE__ */ React.createElement(
8128
+ ))))),
8129
+ /* @__PURE__ */ React.createElement(PortalWrapper, { renderInPortal }, state.isOpen && /* @__PURE__ */ React.createElement(PopoverContent, __spreadProps$e(__spreadValues$1o({}, dialogProps), { ref, w: "max-content" }), /* @__PURE__ */ React.createElement(FocusScope, { contain: true, restoreFocus: true }, /* @__PURE__ */ React.createElement(DatePickerLocaleWrapper, { firstDayOfWeek }, /* @__PURE__ */ React.createElement(
8048
8130
  RangeCalendar,
8049
- __spreadProps$e(__spreadValues$1p({}, calendarProps), {
8050
- resetDate,
8131
+ __spreadProps$e(__spreadValues$1o({}, calendarProps), {
8132
+ resetDate: cancelOrResetDateChange,
8051
8133
  handleClose,
8052
8134
  fiscalStartMonth: fiscalStartMonth || 0,
8053
8135
  fiscalStartDay: fiscalStartDay || 0,
8054
8136
  isClearable,
8055
8137
  firstDayOfWeek,
8056
8138
  onSave,
8057
- onCancel: cancelDateChange,
8058
8139
  clearButtonLabel,
8059
8140
  buttonLabel
8060
8141
  })
@@ -8062,30 +8143,30 @@ const DateRangePicker = (props) => {
8062
8143
  );
8063
8144
  };
8064
8145
 
8065
- var __defProp$1o = Object.defineProperty;
8066
- var __getOwnPropSymbols$1o = Object.getOwnPropertySymbols;
8067
- var __hasOwnProp$1o = Object.prototype.hasOwnProperty;
8068
- var __propIsEnum$1o = Object.prototype.propertyIsEnumerable;
8069
- var __defNormalProp$1o = (obj, key, value) => key in obj ? __defProp$1o(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8070
- var __spreadValues$1o = (a, b) => {
8146
+ var __defProp$1n = Object.defineProperty;
8147
+ var __getOwnPropSymbols$1n = Object.getOwnPropertySymbols;
8148
+ var __hasOwnProp$1n = Object.prototype.hasOwnProperty;
8149
+ var __propIsEnum$1n = Object.prototype.propertyIsEnumerable;
8150
+ var __defNormalProp$1n = (obj, key, value) => key in obj ? __defProp$1n(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8151
+ var __spreadValues$1n = (a, b) => {
8071
8152
  for (var prop in b || (b = {}))
8072
- if (__hasOwnProp$1o.call(b, prop))
8073
- __defNormalProp$1o(a, prop, b[prop]);
8074
- if (__getOwnPropSymbols$1o)
8075
- for (var prop of __getOwnPropSymbols$1o(b)) {
8076
- if (__propIsEnum$1o.call(b, prop))
8077
- __defNormalProp$1o(a, prop, b[prop]);
8153
+ if (__hasOwnProp$1n.call(b, prop))
8154
+ __defNormalProp$1n(a, prop, b[prop]);
8155
+ if (__getOwnPropSymbols$1n)
8156
+ for (var prop of __getOwnPropSymbols$1n(b)) {
8157
+ if (__propIsEnum$1n.call(b, prop))
8158
+ __defNormalProp$1n(a, prop, b[prop]);
8078
8159
  }
8079
8160
  return a;
8080
8161
  };
8081
- var __objRest$1b = (source, exclude) => {
8162
+ var __objRest$1a = (source, exclude) => {
8082
8163
  var target = {};
8083
8164
  for (var prop in source)
8084
- if (__hasOwnProp$1o.call(source, prop) && exclude.indexOf(prop) < 0)
8165
+ if (__hasOwnProp$1n.call(source, prop) && exclude.indexOf(prop) < 0)
8085
8166
  target[prop] = source[prop];
8086
- if (source != null && __getOwnPropSymbols$1o)
8087
- for (var prop of __getOwnPropSymbols$1o(source)) {
8088
- if (exclude.indexOf(prop) < 0 && __propIsEnum$1o.call(source, prop))
8167
+ if (source != null && __getOwnPropSymbols$1n)
8168
+ for (var prop of __getOwnPropSymbols$1n(source)) {
8169
+ if (exclude.indexOf(prop) < 0 && __propIsEnum$1n.call(source, prop))
8089
8170
  target[prop] = source[prop];
8090
8171
  }
8091
8172
  return target;
@@ -8095,39 +8176,39 @@ const InputGroupWrapper = (_a) => {
8095
8176
  inputLeftElement,
8096
8177
  inputRightElement,
8097
8178
  children
8098
- } = _b, rest = __objRest$1b(_b, [
8179
+ } = _b, rest = __objRest$1a(_b, [
8099
8180
  "inputLeftElement",
8100
8181
  "inputRightElement",
8101
8182
  "children"
8102
8183
  ]);
8103
8184
  const containsInputGroupElement = not(all(isNil, [inputLeftElement, inputRightElement]));
8104
- return containsInputGroupElement ? /* @__PURE__ */ React.createElement(InputGroup, __spreadValues$1o({}, rest), inputLeftElement, children, inputRightElement) : /* @__PURE__ */ React.createElement(React.Fragment, null, children);
8185
+ return containsInputGroupElement ? /* @__PURE__ */ React.createElement(InputGroup, __spreadValues$1n({}, rest), inputLeftElement, children, inputRightElement) : /* @__PURE__ */ React.createElement(React.Fragment, null, children);
8105
8186
  };
8106
8187
 
8107
- var __defProp$1n = Object.defineProperty;
8108
- var __getOwnPropSymbols$1n = Object.getOwnPropertySymbols;
8109
- var __hasOwnProp$1n = Object.prototype.hasOwnProperty;
8110
- var __propIsEnum$1n = Object.prototype.propertyIsEnumerable;
8111
- var __defNormalProp$1n = (obj, key, value) => key in obj ? __defProp$1n(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8112
- var __spreadValues$1n = (a, b) => {
8188
+ var __defProp$1m = Object.defineProperty;
8189
+ var __getOwnPropSymbols$1m = Object.getOwnPropertySymbols;
8190
+ var __hasOwnProp$1m = Object.prototype.hasOwnProperty;
8191
+ var __propIsEnum$1m = Object.prototype.propertyIsEnumerable;
8192
+ var __defNormalProp$1m = (obj, key, value) => key in obj ? __defProp$1m(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8193
+ var __spreadValues$1m = (a, b) => {
8113
8194
  for (var prop in b || (b = {}))
8114
- if (__hasOwnProp$1n.call(b, prop))
8115
- __defNormalProp$1n(a, prop, b[prop]);
8116
- if (__getOwnPropSymbols$1n)
8117
- for (var prop of __getOwnPropSymbols$1n(b)) {
8118
- if (__propIsEnum$1n.call(b, prop))
8119
- __defNormalProp$1n(a, prop, b[prop]);
8195
+ if (__hasOwnProp$1m.call(b, prop))
8196
+ __defNormalProp$1m(a, prop, b[prop]);
8197
+ if (__getOwnPropSymbols$1m)
8198
+ for (var prop of __getOwnPropSymbols$1m(b)) {
8199
+ if (__propIsEnum$1m.call(b, prop))
8200
+ __defNormalProp$1m(a, prop, b[prop]);
8120
8201
  }
8121
8202
  return a;
8122
8203
  };
8123
- var __objRest$1a = (source, exclude) => {
8204
+ var __objRest$19 = (source, exclude) => {
8124
8205
  var target = {};
8125
8206
  for (var prop in source)
8126
- if (__hasOwnProp$1n.call(source, prop) && exclude.indexOf(prop) < 0)
8207
+ if (__hasOwnProp$1m.call(source, prop) && exclude.indexOf(prop) < 0)
8127
8208
  target[prop] = source[prop];
8128
- if (source != null && __getOwnPropSymbols$1n)
8129
- for (var prop of __getOwnPropSymbols$1n(source)) {
8130
- if (exclude.indexOf(prop) < 0 && __propIsEnum$1n.call(source, prop))
8209
+ if (source != null && __getOwnPropSymbols$1m)
8210
+ for (var prop of __getOwnPropSymbols$1m(source)) {
8211
+ if (exclude.indexOf(prop) < 0 && __propIsEnum$1m.call(source, prop))
8131
8212
  target[prop] = source[prop];
8132
8213
  }
8133
8214
  return target;
@@ -8145,7 +8226,7 @@ const DatePickerField = forwardRef$1((_a, ref) => {
8145
8226
  onChange: onChangeCallback = identity,
8146
8227
  inputLeftElement,
8147
8228
  inputRightElement
8148
- } = _b, rest = __objRest$1a(_b, [
8229
+ } = _b, rest = __objRest$19(_b, [
8149
8230
  "name",
8150
8231
  "minValue",
8151
8232
  "maxValue",
@@ -8189,7 +8270,7 @@ const DatePickerField = forwardRef$1((_a, ref) => {
8189
8270
  },
8190
8271
  /* @__PURE__ */ React.createElement(
8191
8272
  DatePicker,
8192
- __spreadValues$1n({
8273
+ __spreadValues$1m({
8193
8274
  firstDayOfWeek,
8194
8275
  "aria-label": label,
8195
8276
  isInvalid: !!errors[name],
@@ -8205,30 +8286,30 @@ const DatePickerField = forwardRef$1((_a, ref) => {
8205
8286
  );
8206
8287
  });
8207
8288
 
8208
- var __defProp$1m = Object.defineProperty;
8209
- var __getOwnPropSymbols$1m = Object.getOwnPropertySymbols;
8210
- var __hasOwnProp$1m = Object.prototype.hasOwnProperty;
8211
- var __propIsEnum$1m = Object.prototype.propertyIsEnumerable;
8212
- var __defNormalProp$1m = (obj, key, value) => key in obj ? __defProp$1m(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8213
- var __spreadValues$1m = (a, b) => {
8289
+ var __defProp$1l = Object.defineProperty;
8290
+ var __getOwnPropSymbols$1l = Object.getOwnPropertySymbols;
8291
+ var __hasOwnProp$1l = Object.prototype.hasOwnProperty;
8292
+ var __propIsEnum$1l = Object.prototype.propertyIsEnumerable;
8293
+ var __defNormalProp$1l = (obj, key, value) => key in obj ? __defProp$1l(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8294
+ var __spreadValues$1l = (a, b) => {
8214
8295
  for (var prop in b || (b = {}))
8215
- if (__hasOwnProp$1m.call(b, prop))
8216
- __defNormalProp$1m(a, prop, b[prop]);
8217
- if (__getOwnPropSymbols$1m)
8218
- for (var prop of __getOwnPropSymbols$1m(b)) {
8219
- if (__propIsEnum$1m.call(b, prop))
8220
- __defNormalProp$1m(a, prop, b[prop]);
8296
+ if (__hasOwnProp$1l.call(b, prop))
8297
+ __defNormalProp$1l(a, prop, b[prop]);
8298
+ if (__getOwnPropSymbols$1l)
8299
+ for (var prop of __getOwnPropSymbols$1l(b)) {
8300
+ if (__propIsEnum$1l.call(b, prop))
8301
+ __defNormalProp$1l(a, prop, b[prop]);
8221
8302
  }
8222
8303
  return a;
8223
8304
  };
8224
- var __objRest$19 = (source, exclude) => {
8305
+ var __objRest$18 = (source, exclude) => {
8225
8306
  var target = {};
8226
8307
  for (var prop in source)
8227
- if (__hasOwnProp$1m.call(source, prop) && exclude.indexOf(prop) < 0)
8308
+ if (__hasOwnProp$1l.call(source, prop) && exclude.indexOf(prop) < 0)
8228
8309
  target[prop] = source[prop];
8229
- if (source != null && __getOwnPropSymbols$1m)
8230
- for (var prop of __getOwnPropSymbols$1m(source)) {
8231
- if (exclude.indexOf(prop) < 0 && __propIsEnum$1m.call(source, prop))
8310
+ if (source != null && __getOwnPropSymbols$1l)
8311
+ for (var prop of __getOwnPropSymbols$1l(source)) {
8312
+ if (exclude.indexOf(prop) < 0 && __propIsEnum$1l.call(source, prop))
8232
8313
  target[prop] = source[prop];
8233
8314
  }
8234
8315
  return target;
@@ -8247,7 +8328,7 @@ const DateRangePickerField = forwardRef$1((_a, ref) => {
8247
8328
  isClearable = true,
8248
8329
  onSave,
8249
8330
  buttonLabel = "Save"
8250
- } = _b, rest = __objRest$19(_b, [
8331
+ } = _b, rest = __objRest$18(_b, [
8251
8332
  "name",
8252
8333
  "minValue",
8253
8334
  "maxValue",
@@ -8286,7 +8367,7 @@ const DateRangePickerField = forwardRef$1((_a, ref) => {
8286
8367
  },
8287
8368
  ({ value, onChange }, { formState: { errors } }) => /* @__PURE__ */ React.createElement(
8288
8369
  DateRangePicker,
8289
- __spreadValues$1m({
8370
+ __spreadValues$1l({
8290
8371
  firstDayOfWeek,
8291
8372
  "aria-label": label,
8292
8373
  isInvalid: !!errors[name],
@@ -8304,82 +8385,6 @@ const DateRangePickerField = forwardRef$1((_a, ref) => {
8304
8385
  );
8305
8386
  });
8306
8387
 
8307
- const tooltipIconMap = {
8308
- success: CheckCircleSolid,
8309
- warning: AlertTriangleSolid,
8310
- error: AlertCircleSolid,
8311
- danger: AlertOctagonSolid,
8312
- info: InfoSolid,
8313
- ai: BrightnessSolid,
8314
- default: HelpCircleSolid,
8315
- ghost: HelpCircleSolid
8316
- };
8317
-
8318
- var __defProp$1l = Object.defineProperty;
8319
- var __getOwnPropSymbols$1l = Object.getOwnPropertySymbols;
8320
- var __hasOwnProp$1l = Object.prototype.hasOwnProperty;
8321
- var __propIsEnum$1l = Object.prototype.propertyIsEnumerable;
8322
- var __defNormalProp$1l = (obj, key, value) => key in obj ? __defProp$1l(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8323
- var __spreadValues$1l = (a, b) => {
8324
- for (var prop in b || (b = {}))
8325
- if (__hasOwnProp$1l.call(b, prop))
8326
- __defNormalProp$1l(a, prop, b[prop]);
8327
- if (__getOwnPropSymbols$1l)
8328
- for (var prop of __getOwnPropSymbols$1l(b)) {
8329
- if (__propIsEnum$1l.call(b, prop))
8330
- __defNormalProp$1l(a, prop, b[prop]);
8331
- }
8332
- return a;
8333
- };
8334
- var __objRest$18 = (source, exclude) => {
8335
- var target = {};
8336
- for (var prop in source)
8337
- if (__hasOwnProp$1l.call(source, prop) && exclude.indexOf(prop) < 0)
8338
- target[prop] = source[prop];
8339
- if (source != null && __getOwnPropSymbols$1l)
8340
- for (var prop of __getOwnPropSymbols$1l(source)) {
8341
- if (exclude.indexOf(prop) < 0 && __propIsEnum$1l.call(source, prop))
8342
- target[prop] = source[prop];
8343
- }
8344
- return target;
8345
- };
8346
- const Tooltip = (_a) => {
8347
- var _b = _a, {
8348
- variant = "default",
8349
- hasArrow = true,
8350
- title = "",
8351
- description = "",
8352
- hasIcon = false
8353
- } = _b, rest = __objRest$18(_b, [
8354
- "variant",
8355
- "hasArrow",
8356
- "title",
8357
- "description",
8358
- "hasIcon"
8359
- ]);
8360
- const iconVariant = variant;
8361
- const icon = tooltipIconMap[iconVariant];
8362
- const TooltipContent = /* @__PURE__ */ React.createElement(HStack, { alignItems: "flex-start" }, hasIcon && /* @__PURE__ */ React.createElement(Icon, { as: icon, color: `icon.toast.${iconVariant}` }), /* @__PURE__ */ React.createElement(VStack, { spacing: 0, alignItems: "flex-start" }, /* @__PURE__ */ React.createElement(Label, { size: "sm" }, title), /* @__PURE__ */ React.createElement(
8363
- P,
8364
- {
8365
- variant: "14",
8366
- sx: {
8367
- color: !variant || variant === "ai" ? "text.inverted" : "text.default"
8368
- }
8369
- },
8370
- description
8371
- )));
8372
- return /* @__PURE__ */ React.createElement(
8373
- Tooltip$2,
8374
- __spreadValues$1l({
8375
- hasArrow,
8376
- hasIcon,
8377
- label: title || description ? TooltipContent : void 0,
8378
- variant
8379
- }, rest)
8380
- );
8381
- };
8382
-
8383
8388
  var __defProp$1k = Object.defineProperty;
8384
8389
  var __getOwnPropSymbols$1k = Object.getOwnPropertySymbols;
8385
8390
  var __hasOwnProp$1k = Object.prototype.hasOwnProperty;