@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.
- package/dist/es/northlight.d.ts +33 -1
- package/dist/es/northlight.js +180 -175
- package/dist/es/northlight.js.map +1 -1
- package/dist/umd/northlight.cjs +179 -174
- package/dist/umd/northlight.cjs.map +1 -1
- package/dist/umd/northlight.min.cjs +3 -3
- package/dist/umd/northlight.min.cjs.map +1 -1
- package/package.json +2 -2
package/dist/es/northlight.d.ts
CHANGED
|
@@ -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
|
-
|
|
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;
|
package/dist/es/northlight.js
CHANGED
|
@@ -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,
|
|
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:
|
|
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
|
-
|
|
7908
|
-
|
|
7909
|
-
|
|
7910
|
-
|
|
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
|
|
7994
|
-
|
|
7995
|
-
|
|
7996
|
-
|
|
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
|
|
8003
|
-
|
|
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:
|
|
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$
|
|
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$
|
|
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$
|
|
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:
|
|
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$
|
|
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$
|
|
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$
|
|
8066
|
-
var __getOwnPropSymbols$
|
|
8067
|
-
var __hasOwnProp$
|
|
8068
|
-
var __propIsEnum$
|
|
8069
|
-
var __defNormalProp$
|
|
8070
|
-
var __spreadValues$
|
|
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$
|
|
8073
|
-
__defNormalProp$
|
|
8074
|
-
if (__getOwnPropSymbols$
|
|
8075
|
-
for (var prop of __getOwnPropSymbols$
|
|
8076
|
-
if (__propIsEnum$
|
|
8077
|
-
__defNormalProp$
|
|
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$
|
|
8162
|
+
var __objRest$1a = (source, exclude) => {
|
|
8082
8163
|
var target = {};
|
|
8083
8164
|
for (var prop in source)
|
|
8084
|
-
if (__hasOwnProp$
|
|
8165
|
+
if (__hasOwnProp$1n.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
8085
8166
|
target[prop] = source[prop];
|
|
8086
|
-
if (source != null && __getOwnPropSymbols$
|
|
8087
|
-
for (var prop of __getOwnPropSymbols$
|
|
8088
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum$
|
|
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$
|
|
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$
|
|
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$
|
|
8108
|
-
var __getOwnPropSymbols$
|
|
8109
|
-
var __hasOwnProp$
|
|
8110
|
-
var __propIsEnum$
|
|
8111
|
-
var __defNormalProp$
|
|
8112
|
-
var __spreadValues$
|
|
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$
|
|
8115
|
-
__defNormalProp$
|
|
8116
|
-
if (__getOwnPropSymbols$
|
|
8117
|
-
for (var prop of __getOwnPropSymbols$
|
|
8118
|
-
if (__propIsEnum$
|
|
8119
|
-
__defNormalProp$
|
|
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$
|
|
8204
|
+
var __objRest$19 = (source, exclude) => {
|
|
8124
8205
|
var target = {};
|
|
8125
8206
|
for (var prop in source)
|
|
8126
|
-
if (__hasOwnProp$
|
|
8207
|
+
if (__hasOwnProp$1m.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
8127
8208
|
target[prop] = source[prop];
|
|
8128
|
-
if (source != null && __getOwnPropSymbols$
|
|
8129
|
-
for (var prop of __getOwnPropSymbols$
|
|
8130
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum$
|
|
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$
|
|
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$
|
|
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$
|
|
8209
|
-
var __getOwnPropSymbols$
|
|
8210
|
-
var __hasOwnProp$
|
|
8211
|
-
var __propIsEnum$
|
|
8212
|
-
var __defNormalProp$
|
|
8213
|
-
var __spreadValues$
|
|
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$
|
|
8216
|
-
__defNormalProp$
|
|
8217
|
-
if (__getOwnPropSymbols$
|
|
8218
|
-
for (var prop of __getOwnPropSymbols$
|
|
8219
|
-
if (__propIsEnum$
|
|
8220
|
-
__defNormalProp$
|
|
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$
|
|
8305
|
+
var __objRest$18 = (source, exclude) => {
|
|
8225
8306
|
var target = {};
|
|
8226
8307
|
for (var prop in source)
|
|
8227
|
-
if (__hasOwnProp$
|
|
8308
|
+
if (__hasOwnProp$1l.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
8228
8309
|
target[prop] = source[prop];
|
|
8229
|
-
if (source != null && __getOwnPropSymbols$
|
|
8230
|
-
for (var prop of __getOwnPropSymbols$
|
|
8231
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum$
|
|
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$
|
|
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$
|
|
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;
|