@northlight/ui 2.26.1 → 2.27.1

package/dist/es/northlight.js

@@ -1,4 +1,4 @@
-import { Accordion as Accordion$1, AccordionButton as AccordionButton$1, AccordionPanel as AccordionPanel$1, AccordionItem as AccordionItem$1, useInterval, useMediaQuery, useToken as useToken$1, 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, Spinner as Spinner$2, Button as Button$2, Checkbox as Checkbox$2, FormControl, Stack, FormErrorMessage, Flex, IconButton as IconButton$1, Popover as Popover$2, useDisclosure, useBoolean, PopoverTrigger, PopoverContent, PopoverHeader, PopoverBody, SimpleGrid, SlideFade as SlideFade$1, keyframes, extendTheme, Table as Table$2, Thead, Tbody, Tr, Select as Select$2, PopoverAnchor, InputGroup, InputRightElement, Link as Link$1, Portal, 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, 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, TagLeftIcon, AlertTitle, AlertDescription, Tab, TabList, useClipboard, Grid, GridItem, useOutsideClick } from '@chakra-ui/react';
+import { Accordion as Accordion$1, AccordionButton as AccordionButton$1, AccordionPanel as AccordionPanel$1, AccordionItem as AccordionItem$1, useInterval, useMediaQuery, useToken as useToken$1, 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, Spinner as Spinner$2, Button as Button$2, Checkbox as Checkbox$2, FormControl, Stack, FormErrorMessage, Flex, IconButton as IconButton$1, Popover as Popover$2, useDisclosure, useBoolean, PopoverTrigger, PopoverContent, PopoverHeader, PopoverBody, SimpleGrid, SlideFade as SlideFade$1, keyframes, extendTheme, Table as Table$2, Thead, Tbody, Tr, Select as Select$2, PopoverAnchor, InputGroup, InputRightElement, Link as Link$1, Portal, 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, 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, TagLeftIcon, AlertTitle, AlertDescription, Tab, TabList, useClipboard, Grid, GridItem } from '@chakra-ui/react';
 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, 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, keyframes, 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';
 import React, { useState, useEffect, useRef, isValidElement, cloneElement, Children, createContext, useContext, forwardRef as forwardRef$1, useImperativeHandle, memo, useMemo, useCallback } from 'react';
 import { CreatableSelect, chakraComponents, AsyncSelect, Select as Select$3 } from 'chakra-react-select';
@@ -641,7 +641,7 @@ var __spreadValues$2i = (a, b) => {
   return a;
 };
 var __spreadProps$u = (a, b) => __defProps$u(a, __getOwnPropDescs$u(b));
-var __objRest$1N = (source, exclude) => {
+var __objRest$1O = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$2i.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -661,7 +661,7 @@ function TagsInput(_a) {
     loadingList = () => null,
     "data-testid": testId,
     value = []
-  } = _b, rest = __objRest$1N(_b, [
+  } = _b, rest = __objRest$1O(_b, [
     "options",
     "onChange",
     "isLoading",
@@ -778,7 +778,7 @@ var __spreadValues$2h = (a, b) => {
     }
   return a;
 };
-var __objRest$1M = (source, exclude) => {
+var __objRest$1N = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$2h.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -795,7 +795,7 @@ const OrganizationLogo = (_a) => {
     name,
     image,
     variant = "square"
-  } = _b, rest = __objRest$1M(_b, [
+  } = _b, rest = __objRest$1N(_b, [
     "name",
     "image",
     "variant"
@@ -837,7 +837,7 @@ var __spreadValues$2g = (a, b) => {
     }
   return a;
 };
-var __objRest$1L = (source, exclude) => {
+var __objRest$1M = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$2g.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -853,7 +853,7 @@ const Alert$1 = (_a) => {
   var _b = _a, {
     variant = "success",
     children
-  } = _b, rest = __objRest$1L(_b, [
+  } = _b, rest = __objRest$1M(_b, [
     "variant",
     "children"
   ]);
@@ -894,7 +894,7 @@ var __spreadValues$2e = (a, b) => {
     }
   return a;
 };
-var __objRest$1K = (source, exclude) => {
+var __objRest$1L = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$2e.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -912,7 +912,7 @@ const Icon$1 = forwardRef((_a, ref) => {
     size,
     color,
     boxSize
-  } = _b, rest = __objRest$1K(_b, [
+  } = _b, rest = __objRest$1L(_b, [
     "as",
     "size",
     "color",
@@ -953,7 +953,7 @@ var __spreadValues$2d = (a, b) => {
     }
   return a;
 };
-var __objRest$1J = (source, exclude) => {
+var __objRest$1K = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$2d.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -972,7 +972,7 @@ const Avatar$1 = (_a) => {
     name,
     image,
     size
-  } = _b, rest = __objRest$1J(_b, [
+  } = _b, rest = __objRest$1K(_b, [
     "variant",
     "notificationCount",
     "name",
@@ -1018,7 +1018,7 @@ var __spreadValues$2c = (a, b) => {
     }
   return a;
 };
-var __objRest$1I = (source, exclude) => {
+var __objRest$1J = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$2c.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1034,7 +1034,7 @@ const H1$1 = forwardRef$1((_a, ref) => {
   var _b = _a, {
     children,
     sx = {}
-  } = _b, rest = __objRest$1I(_b, [
+  } = _b, rest = __objRest$1J(_b, [
     "children",
     "sx"
   ]);
@@ -1066,7 +1066,7 @@ var __spreadValues$2b = (a, b) => {
     }
   return a;
 };
-var __objRest$1H = (source, exclude) => {
+var __objRest$1I = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$2b.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1082,7 +1082,7 @@ const H2$1 = forwardRef$1((_a, ref) => {
   var _b = _a, {
     children,
     sx = {}
-  } = _b, rest = __objRest$1H(_b, [
+  } = _b, rest = __objRest$1I(_b, [
     "children",
     "sx"
   ]);
@@ -1114,7 +1114,7 @@ var __spreadValues$2a = (a, b) => {
     }
   return a;
 };
-var __objRest$1G = (source, exclude) => {
+var __objRest$1H = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$2a.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1130,7 +1130,7 @@ const H3$1 = forwardRef$1((_a, ref) => {
   var _b = _a, {
     children,
     sx = {}
-  } = _b, rest = __objRest$1G(_b, [
+  } = _b, rest = __objRest$1H(_b, [
     "children",
     "sx"
   ]);
@@ -1162,7 +1162,7 @@ var __spreadValues$29 = (a, b) => {
     }
   return a;
 };
-var __objRest$1F = (source, exclude) => {
+var __objRest$1G = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$29.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1178,7 +1178,7 @@ const H4$1 = forwardRef$1((_a, ref) => {
   var _b = _a, {
     children,
     sx = {}
-  } = _b, rest = __objRest$1F(_b, [
+  } = _b, rest = __objRest$1G(_b, [
     "children",
     "sx"
   ]);
@@ -1210,7 +1210,7 @@ var __spreadValues$28 = (a, b) => {
     }
   return a;
 };
-var __objRest$1E = (source, exclude) => {
+var __objRest$1F = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$28.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1226,7 +1226,7 @@ const H5$1 = forwardRef$1((_a, ref) => {
   var _b = _a, {
     children,
     sx = {}
-  } = _b, rest = __objRest$1E(_b, [
+  } = _b, rest = __objRest$1F(_b, [
     "children",
     "sx"
   ]);
@@ -1258,7 +1258,7 @@ var __spreadValues$27 = (a, b) => {
     }
   return a;
 };
-var __objRest$1D = (source, exclude) => {
+var __objRest$1E = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$27.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1274,7 +1274,7 @@ const H6$1 = forwardRef$1((_a, ref) => {
   var _b = _a, {
     children,
     sx = {}
-  } = _b, rest = __objRest$1D(_b, [
+  } = _b, rest = __objRest$1E(_b, [
     "children",
     "sx"
   ]);
@@ -1306,7 +1306,7 @@ var __spreadValues$26 = (a, b) => {
     }
   return a;
 };
-var __objRest$1C = (source, exclude) => {
+var __objRest$1D = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$26.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1323,7 +1323,7 @@ const P$1 = (_a) => {
     children,
     variant = "16",
     sx = {}
-  } = _b, rest = __objRest$1C(_b, [
+  } = _b, rest = __objRest$1D(_b, [
     "children",
     "variant",
     "sx"
@@ -1355,7 +1355,7 @@ var __spreadValues$25 = (a, b) => {
     }
   return a;
 };
-var __objRest$1B = (source, exclude) => {
+var __objRest$1C = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$25.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1368,7 +1368,7 @@ var __objRest$1B = (source, exclude) => {
   return target;
 };
 const Blockquote$1 = (_a) => {
-  var _b = _a, { children, sx = {} } = _b, rest = __objRest$1B(_b, ["children", "sx"]);
+  var _b = _a, { children, sx = {} } = _b, rest = __objRest$1C(_b, ["children", "sx"]);
   const styles = useStyleConfig("Blockquote", { sx });
   return /* @__PURE__ */ React.createElement(Text, __spreadValues$25({ as: "span", sx: styles }, rest), children);
 };
@@ -1389,7 +1389,7 @@ var __spreadValues$24 = (a, b) => {
     }
   return a;
 };
-var __objRest$1A = (source, exclude) => {
+var __objRest$1B = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$24.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1405,7 +1405,7 @@ const Capitalized$1 = (_a) => {
   var _b = _a, {
     children,
     sx = {}
-  } = _b, rest = __objRest$1A(_b, [
+  } = _b, rest = __objRest$1B(_b, [
     "children",
     "sx"
   ]);
@@ -1436,7 +1436,7 @@ var __spreadValues$23 = (a, b) => {
     }
   return a;
 };
-var __objRest$1z = (source, exclude) => {
+var __objRest$1A = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$23.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1452,7 +1452,7 @@ const Lead$1 = (_a) => {
   var _b = _a, {
     children,
     sx = {}
-  } = _b, rest = __objRest$1z(_b, [
+  } = _b, rest = __objRest$1A(_b, [
     "children",
     "sx"
   ]);
@@ -1483,7 +1483,7 @@ var __spreadValues$22 = (a, b) => {
     }
   return a;
 };
-var __objRest$1y = (source, exclude) => {
+var __objRest$1z = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$22.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1499,7 +1499,7 @@ const Small$1 = (_a) => {
   var _b = _a, {
     children,
     sx = {}
-  } = _b, rest = __objRest$1y(_b, [
+  } = _b, rest = __objRest$1z(_b, [
     "children",
     "sx"
   ]);
@@ -1530,7 +1530,7 @@ var __spreadValues$21 = (a, b) => {
     }
   return a;
 };
-var __objRest$1x = (source, exclude) => {
+var __objRest$1y = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$21.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1546,7 +1546,7 @@ const Tiny$1 = (_a) => {
   var _b = _a, {
     children,
     sx = {}
-  } = _b, rest = __objRest$1x(_b, [
+  } = _b, rest = __objRest$1y(_b, [
     "children",
     "sx"
   ]);
@@ -1577,7 +1577,7 @@ var __spreadValues$20 = (a, b) => {
     }
   return a;
 };
-var __objRest$1w = (source, exclude) => {
+var __objRest$1x = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$20.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1594,7 +1594,7 @@ const Label$1 = forwardRef$1((_a, ref) => {
     children,
     size = "sm",
     sx = {}
-  } = _b, rest = __objRest$1w(_b, [
+  } = _b, rest = __objRest$1x(_b, [
     "children",
     "size",
     "sx"
@@ -1627,7 +1627,7 @@ var __spreadValues$1$ = (a, b) => {
     }
   return a;
 };
-var __objRest$1v = (source, exclude) => {
+var __objRest$1w = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1$.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1641,7 +1641,7 @@ var __objRest$1v = (source, exclude) => {
 };
 const NumVal$1 = forwardRef$1(
   (_a, ref) => {
-    var _b = _a, { children, size = "sm", sx = {} } = _b, rest = __objRest$1v(_b, ["children", "size", "sx"]);
+    var _b = _a, { children, size = "sm", sx = {} } = _b, rest = __objRest$1w(_b, ["children", "size", "sx"]);
     const styles = useStyleConfig("NumVal", { sx, size });
     return /* @__PURE__ */ React.createElement(
       Text,
@@ -1751,7 +1751,7 @@ var __spreadValues$1_ = (a, b) => {
     }
   return a;
 };
-var __objRest$1u = (source, exclude) => {
+var __objRest$1v = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1_.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1768,7 +1768,7 @@ const AvatarGroup = (_a) => {
     children,
     max = Infinity,
     spacing = "-4"
-  } = _b, rest = __objRest$1u(_b, [
+  } = _b, rest = __objRest$1v(_b, [
     "children",
     "max",
     "spacing"
@@ -1811,7 +1811,7 @@ var __spreadValues$1Y = (a, b) => {
     }
   return a;
 };
-var __objRest$1t = (source, exclude) => {
+var __objRest$1u = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1Y.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1828,7 +1828,7 @@ const Blinker$1 = (_a) => {
     color = "",
     size,
     isBlinking = true
-  } = _b, rest = __objRest$1t(_b, [
+  } = _b, rest = __objRest$1u(_b, [
     "color",
     "size",
     "isBlinking"
@@ -1853,7 +1853,7 @@ var __spreadValues$1X = (a, b) => {
     }
   return a;
 };
-var __objRest$1s = (source, exclude) => {
+var __objRest$1t = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1X.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1866,7 +1866,7 @@ var __objRest$1s = (source, exclude) => {
   return target;
 };
 const Spinner$1 = (_a) => {
-  var rest = __objRest$1s(_a, []);
+  var rest = __objRest$1t(_a, []);
   return /* @__PURE__ */ React.createElement(Spinner$2, __spreadValues$1X({}, rest));
 };
 
@@ -1886,7 +1886,7 @@ var __spreadValues$1W = (a, b) => {
     }
   return a;
 };
-var __objRest$1r = (source, exclude) => {
+var __objRest$1s = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1W.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1906,7 +1906,7 @@ const SpinnerSizeMap = {
 };
 const Button$1 = forwardRef$1(
   (_a, ref) => {
-    var _b = _a, { variant = "default", children, size = "md" } = _b, rest = __objRest$1r(_b, ["variant", "children", "size"]);
+    var _b = _a, { variant = "default", children, size = "md" } = _b, rest = __objRest$1s(_b, ["variant", "children", "size"]);
     return /* @__PURE__ */ React.createElement(
       Button$2,
       __spreadValues$1W({
@@ -1941,7 +1941,7 @@ var __spreadValues$1V = (a, b) => {
     }
   return a;
 };
-var __objRest$1q = (source, exclude) => {
+var __objRest$1r = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1V.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -1960,7 +1960,7 @@ const Checkbox$1 = (_a) => {
     name,
     size = "md",
     variant = "default"
-  } = _b, rest = __objRest$1q(_b, [
+  } = _b, rest = __objRest$1r(_b, [
     "value",
     "onChange",
     "name",
@@ -2011,7 +2011,7 @@ var __spreadValues$1U = (a, b) => {
     }
   return a;
 };
-var __objRest$1p = (source, exclude) => {
+var __objRest$1q = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1U.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -2035,7 +2035,7 @@ const Form = forwardRef$1((_a, ref) => {
     shouldTrim = true,
     innerFormStyle = {},
     joiSchema
-  } = _b, rest = __objRest$1p(_b, [
+  } = _b, rest = __objRest$1q(_b, [
     "initialValues",
     "onSubmit",
     "children",
@@ -2106,7 +2106,7 @@ var __spreadValues$1T = (a, b) => {
   return a;
 };
 var __spreadProps$t = (a, b) => __defProps$t(a, __getOwnPropDescs$t(b));
-var __objRest$1o = (source, exclude) => {
+var __objRest$1p = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1T.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -2121,7 +2121,7 @@ var __objRest$1o = (source, exclude) => {
 const FormLabel = forwardRef$1((_a, ref) => {
   var _b = _a, {
     children: label
-  } = _b, rest = __objRest$1o(_b, [
+  } = _b, rest = __objRest$1p(_b, [
     "children"
   ]);
   return /* @__PURE__ */ React.createElement(
@@ -2158,7 +2158,7 @@ var __spreadValues$1S = (a, b) => {
     }
   return a;
 };
-var __objRest$1n = (source, exclude) => {
+var __objRest$1o = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1S.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -2180,7 +2180,7 @@ const BaseField = (_a, ref) => {
     noLabelConnection = false,
     validate,
     control: passedControl
-  } = _b, rest = __objRest$1n(_b, [
+  } = _b, rest = __objRest$1o(_b, [
     "name",
     "label",
     "children",
@@ -2240,7 +2240,7 @@ var __spreadValues$1R = (a, b) => {
     }
   return a;
 };
-var __objRest$1m = (source, exclude) => {
+var __objRest$1n = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1R.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -2263,7 +2263,7 @@ const CheckboxField = forwardRef$1((_a, ref) => {
     direction = "row",
     labelPlacement = "left",
     labelSize = "md"
-  } = _b, rest = __objRest$1m(_b, [
+  } = _b, rest = __objRest$1n(_b, [
     "name",
     "label",
     "variant",
@@ -2331,7 +2331,7 @@ var __spreadValues$1Q = (a, b) => {
     }
   return a;
 };
-var __objRest$1l = (source, exclude) => {
+var __objRest$1m = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1Q.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -2349,7 +2349,7 @@ const IconButton = forwardRef$1((_a, ref) => {
     icon,
     "aria-label": ariaLabel,
     children
-  } = _b, rest = __objRest$1l(_b, [
+  } = _b, rest = __objRest$1m(_b, [
     "variant",
     "icon",
     "aria-label",
@@ -2485,7 +2485,7 @@ var __spreadValues$1O = (a, b) => {
     }
   return a;
 };
-var __objRest$1k = (source, exclude) => {
+var __objRest$1l = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1O.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -2507,7 +2507,7 @@ const ColorPicker$1 = (_a) => {
     name,
     size = "md",
     popoverProps
-  } = _b, rest = __objRest$1k(_b, [
+  } = _b, rest = __objRest$1l(_b, [
     "onChange",
     "colors",
     "expandedColors",
@@ -2638,7 +2638,7 @@ var __spreadValues$1N = (a, b) => {
     }
   return a;
 };
-var __objRest$1j = (source, exclude) => {
+var __objRest$1k = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1N.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -2657,7 +2657,7 @@ const ColorPickerField = (_a) => {
     direction,
     isRequired,
     validate
-  } = _b, rest = __objRest$1j(_b, [
+  } = _b, rest = __objRest$1k(_b, [
     "name",
     "label",
     "direction",
@@ -2742,7 +2742,7 @@ var __spreadValues$1L = (a, b) => {
   return a;
 };
 var __spreadProps$r = (a, b) => __defProps$r(a, __getOwnPropDescs$r(b));
-var __objRest$1i = (source, exclude) => {
+var __objRest$1j = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1L.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -2764,7 +2764,7 @@ const FlipButton$1 = (props) => {
     icon,
     value,
     iconPlacement = "left"
-  } = _a, rest = __objRest$1i(_a, [
+  } = _a, rest = __objRest$1j(_a, [
     "children",
     "size",
     "variant",
@@ -2844,7 +2844,7 @@ var __spreadValues$1K = (a, b) => {
   return a;
 };
 var __spreadProps$q = (a, b) => __defProps$q(a, __getOwnPropDescs$q(b));
-var __objRest$1h = (source, exclude) => {
+var __objRest$1i = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1K.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -2868,7 +2868,7 @@ const FlipButtonGroup = (props) => {
     variant,
     icon,
     sx = {}
-  } = _a, rest = __objRest$1h(_a, [
+  } = _a, rest = __objRest$1i(_a, [
     "isMulti",
     "name",
     "children",
@@ -2928,7 +2928,7 @@ var __spreadValues$1J = (a, b) => {
     }
   return a;
 };
-var __objRest$1g = (source, exclude) => {
+var __objRest$1h = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1J.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -2950,7 +2950,7 @@ const FlipButtonGroupField = forwardRef$1((_a, ref) => {
     iconPlacement = "left",
     onChange: onChangeCallback = identity,
     validate
-  } = _b, rest = __objRest$1g(_b, [
+  } = _b, rest = __objRest$1h(_b, [
     "name",
     "label",
     "children",
@@ -5943,7 +5943,7 @@ var __spreadValues$1D = (a, b) => {
     }
   return a;
 };
-var __objRest$1f = (source, exclude) => {
+var __objRest$1g = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1D.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -5960,7 +5960,7 @@ const hoverAndActiveStyles = {
 };
 const ResizeHandle = forwardRef$1(
   (_a, ref) => {
-    var _b = _a, { color } = _b, rest = __objRest$1f(_b, ["color"]);
+    var _b = _a, { color } = _b, rest = __objRest$1g(_b, ["color"]);
     return /* @__PURE__ */ React.createElement(
       Box,
       __spreadValues$1D({
@@ -6137,7 +6137,7 @@ var __spreadValues$1z = (a, b) => {
   return a;
 };
 var __spreadProps$k = (a, b) => __defProps$k(a, __getOwnPropDescs$k(b));
-var __objRest$1e = (source, exclude) => {
+var __objRest$1f = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1z.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -6151,7 +6151,7 @@ var __objRest$1e = (source, exclude) => {
 };
 const StyledField = forwardRef$1(
   (_a, ref) => {
-    var _b = _a, { isInvalid, isDisabled, children, variant } = _b, rest = __objRest$1e(_b, ["isInvalid", "isDisabled", "children", "variant"]);
+    var _b = _a, { isInvalid, isDisabled, children, variant } = _b, rest = __objRest$1f(_b, ["isInvalid", "isDisabled", "children", "variant"]);
     const { styledField } = useMultiStyleConfig("DatePicker", { variant });
     return /* @__PURE__ */ React.createElement(
       Box,
@@ -6260,7 +6260,7 @@ var __spreadValues$1w = (a, b) => {
     }
   return a;
 };
-var __objRest$1d = (source, exclude) => {
+var __objRest$1e = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1w.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -6274,7 +6274,7 @@ var __objRest$1d = (source, exclude) => {
 };
 const CalendarGrid = memo(
   (_a) => {
-    var _b = _a, { state, locale } = _b, rest = __objRest$1d(_b, ["state", "locale"]);
+    var _b = _a, { state, locale } = _b, rest = __objRest$1e(_b, ["state", "locale"]);
     const startDate = state.visibleRange.start;
     const { gridProps, headerProps, weekDays } = useCalendarGrid(rest, state);
     const weeksInMonth = getWeeksInMonth(startDate, locale);
@@ -6311,7 +6311,7 @@ var __spreadValues$1v = (a, b) => {
   return a;
 };
 var __spreadProps$i = (a, b) => __defProps$i(a, __getOwnPropDescs$i(b));
-var __objRest$1c = (source, exclude) => {
+var __objRest$1d = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1v.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -6324,7 +6324,7 @@ var __objRest$1c = (source, exclude) => {
   return target;
 };
 const MonthButton = (_a) => {
-  var _b = _a, { children } = _b, rest = __objRest$1c(_b, ["children"]);
+  var _b = _a, { children } = _b, rest = __objRest$1d(_b, ["children"]);
   const ref = useRef(null);
   const { buttonProps } = useButton(rest, ref);
   return /* @__PURE__ */ React.createElement(
@@ -6572,7 +6572,7 @@ var __spreadValues$1t = (a, b) => {
   return a;
 };
 var __spreadProps$g = (a, b) => __defProps$g(a, __getOwnPropDescs$g(b));
-var __objRest$1b = (source, exclude) => {
+var __objRest$1c = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1t.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -6588,7 +6588,7 @@ const StandaloneCalendarGrid = (_a) => {
   var _b = _a, {
     state,
     range
-  } = _b, rest = __objRest$1b(_b, [
+  } = _b, rest = __objRest$1c(_b, [
     "state",
     "range"
   ]);
@@ -6767,7 +6767,7 @@ var __spreadValues$1q = (a, b) => {
     }
   return a;
 };
-var __objRest$1a = (source, exclude) => {
+var __objRest$1b = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1q.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -6780,7 +6780,7 @@ var __objRest$1a = (source, exclude) => {
   return target;
 };
 const Clickable = (_a) => {
-  var _b = _a, { href, linkProps } = _b, rest = __objRest$1a(_b, ["href", "linkProps"]);
+  var _b = _a, { href, linkProps } = _b, rest = __objRest$1b(_b, ["href", "linkProps"]);
   const clickable = useClickable(rest);
   return /* @__PURE__ */ React.createElement(React.Fragment, null, !isNil(href) && /* @__PURE__ */ React.createElement(
     Link$1,
@@ -7359,7 +7359,7 @@ var __spreadValues$1n = (a, b) => {
     }
   return a;
 };
-var __objRest$19 = (source, exclude) => {
+var __objRest$1a = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1n.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -7376,7 +7376,7 @@ const InputGroupWrapper = (_a) => {
     inputLeftElement,
     inputRightElement,
     children
-  } = _b, rest = __objRest$19(_b, [
+  } = _b, rest = __objRest$1a(_b, [
     "inputLeftElement",
     "inputRightElement",
     "children"
@@ -7401,7 +7401,7 @@ var __spreadValues$1m = (a, b) => {
     }
   return a;
 };
-var __objRest$18 = (source, exclude) => {
+var __objRest$19 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1m.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -7426,7 +7426,7 @@ const DatePickerField = forwardRef$1((_a, ref) => {
     onChange: onChangeCallback = identity,
     inputLeftElement,
     inputRightElement
-  } = _b, rest = __objRest$18(_b, [
+  } = _b, rest = __objRest$19(_b, [
     "name",
     "minValue",
     "maxValue",
@@ -7502,7 +7502,7 @@ var __spreadValues$1l = (a, b) => {
     }
   return a;
 };
-var __objRest$17 = (source, exclude) => {
+var __objRest$18 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1l.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -7526,7 +7526,7 @@ const DateRangePickerField = forwardRef$1((_a, ref) => {
     firstDayOfWeek = "monday",
     onChange: onChangeCallback = identity,
     isClearable = true
-  } = _b, rest = __objRest$17(_b, [
+  } = _b, rest = __objRest$18(_b, [
     "name",
     "minValue",
     "maxValue",
@@ -7606,7 +7606,7 @@ var __spreadValues$1k = (a, b) => {
     }
   return a;
 };
-var __objRest$16 = (source, exclude) => {
+var __objRest$17 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1k.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -7625,7 +7625,7 @@ const Tooltip = (_a) => {
     title = "",
     description = "",
     hasIcon = "true"
-  } = _b, rest = __objRest$16(_b, [
+  } = _b, rest = __objRest$17(_b, [
     "variant",
     "hasArrow",
     "title",
@@ -7671,7 +7671,7 @@ var __spreadValues$1j = (a, b) => {
     }
   return a;
 };
-var __objRest$15 = (source, exclude) => {
+var __objRest$16 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1j.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -7687,7 +7687,7 @@ const TimeoutProgressCircle = (_a) => {
   var _b = _a, {
     progress,
     ringColor = "border.error"
-  } = _b, rest = __objRest$15(_b, [
+  } = _b, rest = __objRest$16(_b, [
     "progress",
     "ringColor"
   ]);
@@ -7750,7 +7750,7 @@ var __spreadValues$1i = (a, b) => {
     }
   return a;
 };
-var __objRest$14 = (source, exclude) => {
+var __objRest$15 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1i.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -7771,7 +7771,7 @@ const IntentButton = (_a) => {
     },
     tooltipText = "Hold to Delete",
     "aria-label": ariaLabel = "confirm delete"
-  } = _b, rest = __objRest$14(_b, [
+  } = _b, rest = __objRest$15(_b, [
     "icon",
     "timeout",
     "ringColor",
@@ -7921,7 +7921,7 @@ var __spreadValues$1h = (a, b) => {
     }
   return a;
 };
-var __objRest$13 = (source, exclude) => {
+var __objRest$14 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1h.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -7945,7 +7945,7 @@ const Fade = (_a) => {
     enterDelay = 0,
     exitDelay = 0,
     onTransitionComplete = identity
-  } = _b, rest = __objRest$13(_b, [
+  } = _b, rest = __objRest$14(_b, [
     "children",
     "enterDuration",
     "exitDuration",
@@ -7988,7 +7988,7 @@ var __spreadValues$1g = (a, b) => {
     }
   return a;
 };
-var __objRest$12 = (source, exclude) => {
+var __objRest$13 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1g.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8012,7 +8012,7 @@ const ScaleFade = (_a) => {
     enterDelay = 0,
     exitDelay = 0,
     onTransitionComplete = identity
-  } = _b, rest = __objRest$12(_b, [
+  } = _b, rest = __objRest$13(_b, [
     "children",
     "enterDuration",
     "exitDuration",
@@ -8055,7 +8055,7 @@ var __spreadValues$1f = (a, b) => {
     }
   return a;
 };
-var __objRest$11 = (source, exclude) => {
+var __objRest$12 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1f.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8080,7 +8080,7 @@ const Slide = (_a) => {
     exitDelay = 0,
     direction = "bottom",
     onTransitionComplete = identity
-  } = _b, rest = __objRest$11(_b, [
+  } = _b, rest = __objRest$12(_b, [
     "children",
     "enterDuration",
     "exitDuration",
@@ -8125,7 +8125,7 @@ var __spreadValues$1e = (a, b) => {
     }
   return a;
 };
-var __objRest$10 = (source, exclude) => {
+var __objRest$11 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1e.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8153,7 +8153,7 @@ const SlideFade = (_a) => {
     enterDelay = 0,
     exitDelay = 0,
     onTransitionComplete = identity
-  } = _b, rest = __objRest$10(_b, [
+  } = _b, rest = __objRest$11(_b, [
     "children",
     "enterDuration",
     "exitDuration",
@@ -8203,7 +8203,7 @@ var __spreadValues$1d = (a, b) => {
     }
   return a;
 };
-var __objRest$$ = (source, exclude) => {
+var __objRest$10 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1d.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8227,7 +8227,7 @@ const Collapse = (_a) => {
     enterDelay = 0,
     exitDelay = 0,
     onTransitionComplete = identity
-  } = _b, rest = __objRest$$(_b, [
+  } = _b, rest = __objRest$10(_b, [
     "children",
     "enterDuration",
     "exitDuration",
@@ -8273,7 +8273,7 @@ var __spreadValues$1c = (a, b) => {
   return a;
 };
 var __spreadProps$c = (a, b) => __defProps$c(a, __getOwnPropDescs$c(b));
-var __objRest$_ = (source, exclude) => {
+var __objRest$$ = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1c.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8296,7 +8296,7 @@ const Toolbox = (_a) => {
     onClose,
     autoFocus = true,
     resizeLimit = "full"
-  } = _b, rest = __objRest$_(_b, [
+  } = _b, rest = __objRest$$(_b, [
     "isResizable",
     "isOpen",
     "children",
@@ -8381,7 +8381,7 @@ var __spreadValues$1b = (a, b) => {
     }
   return a;
 };
-var __objRest$Z = (source, exclude) => {
+var __objRest$_ = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1b.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8397,7 +8397,7 @@ const ToolboxHeader = (_a) => {
   var _b = _a, {
     children,
     onClose
-  } = _b, rest = __objRest$Z(_b, [
+  } = _b, rest = __objRest$_(_b, [
     "children",
     "onClose"
   ]);
@@ -8429,7 +8429,7 @@ var __spreadValues$1a = (a, b) => {
     }
   return a;
 };
-var __objRest$Y = (source, exclude) => {
+var __objRest$Z = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1a.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8442,7 +8442,7 @@ var __objRest$Y = (source, exclude) => {
   return target;
 };
 const ToolboxContent = (_a) => {
-  var _b = _a, { children } = _b, rest = __objRest$Y(_b, ["children"]);
+  var _b = _a, { children } = _b, rest = __objRest$Z(_b, ["children"]);
   const { body } = useMultiStyleConfig$1("Toolbox", {});
   return /* @__PURE__ */ React.createElement(
     Flex,
@@ -8469,7 +8469,7 @@ var __spreadValues$19 = (a, b) => {
     }
   return a;
 };
-var __objRest$X = (source, exclude) => {
+var __objRest$Y = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$19.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8482,7 +8482,7 @@ var __objRest$X = (source, exclude) => {
   return target;
 };
 const ToolboxFooter = (_a) => {
-  var _b = _a, { children } = _b, rest = __objRest$X(_b, ["children"]);
+  var _b = _a, { children } = _b, rest = __objRest$Y(_b, ["children"]);
   const { footer } = useMultiStyleConfig$1("Toolbox", {});
   return /* @__PURE__ */ React.createElement(Flex, __spreadValues$19({ sx: footer }, rest), children);
 };
@@ -8503,7 +8503,7 @@ var __spreadValues$18 = (a, b) => {
     }
   return a;
 };
-var __objRest$W = (source, exclude) => {
+var __objRest$X = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$18.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8521,7 +8521,7 @@ const Radio = (_a) => {
     onChange,
     name,
     value
-  } = _b, rest = __objRest$W(_b, [
+  } = _b, rest = __objRest$X(_b, [
     "size",
     "onChange",
     "name",
@@ -8554,7 +8554,7 @@ var __spreadValues$17 = (a, b) => {
     }
   return a;
 };
-var __objRest$V = (source, exclude) => {
+var __objRest$W = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$17.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8571,7 +8571,7 @@ const RadioGroup = (_a) => {
     direction = "row",
     children,
     name
-  } = _b, rest = __objRest$V(_b, [
+  } = _b, rest = __objRest$W(_b, [
     "direction",
     "children",
     "name"
@@ -8595,7 +8595,7 @@ var __spreadValues$16 = (a, b) => {
     }
   return a;
 };
-var __objRest$U = (source, exclude) => {
+var __objRest$V = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$16.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8616,7 +8616,7 @@ const RadioGroupField = forwardRef$1((_a, ref) => {
     isRequired,
     validate,
     onChange: onChangeCallback = identity
-  } = _b, rest = __objRest$U(_b, [
+  } = _b, rest = __objRest$V(_b, [
     "name",
     "label",
     "children",
@@ -8682,7 +8682,7 @@ var __spreadValues$15 = (a, b) => {
     }
   return a;
 };
-var __objRest$T = (source, exclude) => {
+var __objRest$U = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$15.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8698,7 +8698,7 @@ const CarouselArrow = (_a) => {
   var _b = _a, {
     onClick,
     direction
-  } = _b, rest = __objRest$T(_b, [
+  } = _b, rest = __objRest$U(_b, [
     "onClick",
     "direction"
   ]);
@@ -8729,7 +8729,7 @@ var __spreadValues$14 = (a, b) => {
     }
   return a;
 };
-var __objRest$S = (source, exclude) => {
+var __objRest$T = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$14.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8752,7 +8752,7 @@ const Carousel = (_a) => {
     itemHeight = carouselItemWidth,
     spacing = carouselItemSpacing,
     carouselStyles = {}
-  } = _b, rest = __objRest$S(_b, [
+  } = _b, rest = __objRest$T(_b, [
     "children",
     "showArrows",
     "showRadio",
@@ -8941,7 +8941,7 @@ var __spreadValues$12 = (a, b) => {
     }
   return a;
 };
-var __objRest$R = (source, exclude) => {
+var __objRest$S = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$12.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -8963,7 +8963,7 @@ function getComponents(components) {
       Control: (_a) => {
         var _b = _a, {
           children
-        } = _b, props = __objRest$R(_b, [
+        } = _b, props = __objRest$S(_b, [
           "children"
         ]);
         return props.selectProps.leftComponent ? /* @__PURE__ */ React.createElement(chakraComponents.Control, __spreadValues$12({}, props), /* @__PURE__ */ React.createElement(HStack, { w: "full", pl: "2" }, props.selectProps.leftComponent, /* @__PURE__ */ React.createElement(HStack, { w: "full", justify: "space-between" }, children))) : /* @__PURE__ */ React.createElement(chakraComponents.Control, __spreadValues$12({}, props), children);
@@ -8989,7 +8989,7 @@ var __spreadValues$11 = (a, b) => {
     }
   return a;
 };
-var __objRest$Q = (source, exclude) => {
+var __objRest$R = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$11.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -9020,7 +9020,7 @@ const SearchBar = forwardRef$1(
       value,
       onSearchInputChange = identity,
       icon = SearchDuo
-    } = _b, rest = __objRest$Q(_b, [
+    } = _b, rest = __objRest$R(_b, [
       "defaultOptions",
       "isMulti",
       "customOption",
@@ -9122,7 +9122,7 @@ var __spreadValues$10 = (a, b) => {
     }
   return a;
 };
-var __objRest$P = (source, exclude) => {
+var __objRest$Q = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$10.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -9146,7 +9146,7 @@ const BaseSearchBarField = (_a, ref) => {
     onChange: onChangeCallback = identity,
     inputLeftElement,
     inputRightElement
-  } = _b, rest = __objRest$P(_b, [
+  } = _b, rest = __objRest$Q(_b, [
     "name",
     "label",
     "direction",
@@ -9239,7 +9239,7 @@ var __spreadValues$_ = (a, b) => {
     }
   return a;
 };
-var __objRest$O = (source, exclude) => {
+var __objRest$P = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$_.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -9257,7 +9257,7 @@ const Tag = forwardRef$1((_a, ref) => {
     variant = "solid",
     bgColor,
     colorScheme
-  } = _b, rest = __objRest$O(_b, [
+  } = _b, rest = __objRest$P(_b, [
     "children",
     "variant",
     "bgColor",
@@ -9295,7 +9295,7 @@ var __spreadValues$Z = (a, b) => {
     }
   return a;
 };
-var __objRest$N = (source, exclude) => {
+var __objRest$O = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$Z.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -9313,7 +9313,7 @@ const TagGroup = (_a) => {
     max = Infinity,
     spacing = "2",
     OverflowIndicator: OverflowIndicator$1 = OverflowIndicator
-  } = _b, rest = __objRest$N(_b, [
+  } = _b, rest = __objRest$O(_b, [
     "children",
     "max",
     "spacing",
@@ -9349,7 +9349,7 @@ var __spreadValues$Y = (a, b) => {
     }
   return a;
 };
-var __objRest$M = (source, exclude) => {
+var __objRest$N = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$Y.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -9368,7 +9368,7 @@ const DragItem = forwardRef$1(
       isDragging,
       itemLabel = "Drag Me",
       bgColor
-    } = _b, rest = __objRest$M(_b, [
+    } = _b, rest = __objRest$N(_b, [
       "size",
       "isDragging",
       "itemLabel",
@@ -9408,7 +9408,7 @@ var __spreadValues$X = (a, b) => {
   return a;
 };
 var __spreadProps$a = (a, b) => __defProps$a(a, __getOwnPropDescs$a(b));
-var __objRest$L = (source, exclude) => {
+var __objRest$M = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$X.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -9426,7 +9426,7 @@ const Draggable = (_a) => {
     children,
     disableDrag = false,
     "data-testid": dataTestId
-  } = _b, rest = __objRest$L(_b, [
+  } = _b, rest = __objRest$M(_b, [
     "itemLabel",
     "children",
     "disableDrag",
@@ -9438,7 +9438,7 @@ const Draggable = (_a) => {
     setNodeRef,
     transform,
     isDragging
-  } = _a2, props = __objRest$L(_a2, [
+  } = _a2, props = __objRest$M(_a2, [
     "attributes",
     "listeners",
     "setNodeRef",
@@ -9483,7 +9483,7 @@ var __spreadValues$W = (a, b) => {
     }
   return a;
 };
-var __objRest$K = (source, exclude) => {
+var __objRest$L = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$W.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -9499,11 +9499,11 @@ const Droppable = (_a) => {
   var _b = _a, {
     children,
     "data-testid": testId
-  } = _b, rest = __objRest$K(_b, [
+  } = _b, rest = __objRest$L(_b, [
     "children",
     "data-testid"
   ]);
-  const _a2 = useDroppable(__spreadValues$W({}, rest)), { setNodeRef } = _a2, props = __objRest$K(_a2, ["setNodeRef"]);
+  const _a2 = useDroppable(__spreadValues$W({}, rest)), { setNodeRef } = _a2, props = __objRest$L(_a2, ["setNodeRef"]);
   return /* @__PURE__ */ React.createElement(Box, { ref: setNodeRef, "data-testid": testId }, typeof children === "function" ? children(props) : children || /* @__PURE__ */ React.createElement(Center, null, "Drop here"));
 };
 
@@ -9544,7 +9544,7 @@ var __spreadValues$U = (a, b) => {
   return a;
 };
 var __spreadProps$9 = (a, b) => __defProps$9(a, __getOwnPropDescs$9(b));
-var __objRest$J = (source, exclude) => {
+var __objRest$K = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$U.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -9563,7 +9563,7 @@ const SortableItem = (_a) => {
     children,
     disableDrag = false,
     "data-testid": dataTestId
-  } = _b, rest = __objRest$J(_b, [
+  } = _b, rest = __objRest$K(_b, [
     "itemLabel",
     "dblClickThreshold",
     "children",
@@ -9577,7 +9577,7 @@ const SortableItem = (_a) => {
     transform,
     transition,
     isDragging
-  } = _a2, props = __objRest$J(_a2, [
+  } = _a2, props = __objRest$K(_a2, [
     "attributes",
     "listeners",
     "setNodeRef",
@@ -9648,7 +9648,7 @@ var __spreadValues$T = (a, b) => {
     }
   return a;
 };
-var __objRest$I = (source, exclude) => {
+var __objRest$J = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$T.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -9661,7 +9661,7 @@ var __objRest$I = (source, exclude) => {
   return target;
 };
 const DragHandle = (_a) => {
-  var _b = _a, { icon, isDragging } = _b, rest = __objRest$I(_b, ["icon", "isDragging"]);
+  var _b = _a, { icon, isDragging } = _b, rest = __objRest$J(_b, ["icon", "isDragging"]);
   return /* @__PURE__ */ React.createElement(
     Icon$1,
     __spreadValues$T({
@@ -9687,7 +9687,7 @@ var __spreadValues$S = (a, b) => {
     }
   return a;
 };
-var __objRest$H = (source, exclude) => {
+var __objRest$I = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$S.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -9700,7 +9700,7 @@ var __objRest$H = (source, exclude) => {
   return target;
 };
 const DropZone = (_a) => {
-  var _b = _a, { sx = {}, name, children } = _b, rest = __objRest$H(_b, ["sx", "name", "children"]);
+  var _b = _a, { sx = {}, name, children } = _b, rest = __objRest$I(_b, ["sx", "name", "children"]);
   const { dropZone } = useMultiStyleConfig("DragAndDrop", { sx });
   return /* @__PURE__ */ React.createElement(Droppable, { id: name }, /* @__PURE__ */ React.createElement(Stack, __spreadValues$S({ sx: dropZone }, rest), children));
 };
@@ -9903,7 +9903,7 @@ var __spreadValues$Q = (a, b) => {
     }
   return a;
 };
-var __objRest$G = (source, exclude) => {
+var __objRest$H = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$Q.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -9925,7 +9925,7 @@ const FastList = forwardRef$1((_a, ref) => {
     height,
     overscanCount = 0,
     initialScrollOffset
-  } = _b, rest = __objRest$G(_b, [
+  } = _b, rest = __objRest$H(_b, [
     "itemCount",
     "itemSize",
     "direction",
@@ -9967,7 +9967,7 @@ var __spreadValues$P = (a, b) => {
     }
   return a;
 };
-var __objRest$F = (source, exclude) => {
+var __objRest$G = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$P.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -9990,7 +9990,7 @@ const FastGrid = forwardRef$1((_a, ref) => {
     height,
     overscanRowCount = 0,
     overscanColumnCount = 0
-  } = _b, rest = __objRest$F(_b, [
+  } = _b, rest = __objRest$G(_b, [
     "columns",
     "rows",
     "columnSize",
@@ -10034,7 +10034,15 @@ var __spreadValues$O = (a, b) => {
     }
   return a;
 };
-const EditableControls = ({ size }) => {
+const mapEditableVariantsToButtonSubmitVariants = {
+  brand: "brand",
+  default: "success"
+};
+const mapEditableVariantsToButtonCancelVariants = {
+  brand: "ghost",
+  default: "danger"
+};
+const EditableControls = ({ size, variant = "default" }) => {
   const {
     getSubmitButtonProps,
     getCancelButtonProps
@@ -10046,7 +10054,7 @@ const EditableControls = ({ size }) => {
     __spreadValues$O({
       "aria-label": "Cancel",
       sx: button,
-      variant: "danger"
+      variant: mapEditableVariantsToButtonCancelVariants[variant]
     }, getCancelButtonProps()),
     /* @__PURE__ */ React.createElement(Icon$1, { sx: icon, as: XCloseSolid })
   ), /* @__PURE__ */ React.createElement(
@@ -10054,7 +10062,7 @@ const EditableControls = ({ size }) => {
     __spreadValues$O({
       "aria-label": "Save",
       sx: button,
-      variant: "success"
+      variant: mapEditableVariantsToButtonSubmitVariants[variant]
     }, getSubmitButtonProps()),
     /* @__PURE__ */ React.createElement(Icon$1, { sx: icon, as: CheckDuo })
   )) : /* @__PURE__ */ React.createElement(
@@ -10085,7 +10093,7 @@ var __spreadValues$N = (a, b) => {
     }
   return a;
 };
-var __objRest$E = (source, exclude) => {
+var __objRest$F = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$N.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -10102,12 +10110,14 @@ const EditableText = (_a) => {
     size = "md",
     value: inputValue,
     onSubmit,
-    leftItem
-  } = _b, rest = __objRest$E(_b, [
+    leftItem,
+    variant = "default"
+  } = _b, rest = __objRest$F(_b, [
     "size",
     "value",
     "onSubmit",
-    "leftItem"
+    "leftItem",
+    "variant"
   ]);
   const [value, setValue] = useState(inputValue);
   const { input, preview } = useMultiStyleConfig("EditableText", { size, value });
@@ -10136,7 +10146,7 @@ const EditableText = (_a) => {
         size,
         sx: input
       }
-    ), /* @__PURE__ */ React.createElement(InputRightElement, { sx: { width: "min-content" } }, /* @__PURE__ */ React.createElement(EditableControls, { size })))
+    ), /* @__PURE__ */ React.createElement(InputRightElement, { sx: { width: "min-content" } }, /* @__PURE__ */ React.createElement(EditableControls, { size, variant })))
   );
 };
 
@@ -10156,7 +10166,7 @@ var __spreadValues$M = (a, b) => {
     }
   return a;
 };
-var __objRest$D = (source, exclude) => {
+var __objRest$E = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$M.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -10172,7 +10182,7 @@ const ModalBase = (_a) => {
   var _b = _a, {
     isCentered = true,
     children
-  } = _b, rest = __objRest$D(_b, [
+  } = _b, rest = __objRest$E(_b, [
     "isCentered",
     "children"
   ]);
@@ -10204,7 +10214,7 @@ var __spreadValues$L = (a, b) => {
     }
   return a;
 };
-var __objRest$C = (source, exclude) => {
+var __objRest$D = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$L.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -10220,7 +10230,7 @@ const Modal = (_a) => {
   var _b = _a, {
     stayMountedOnClose = false,
     isOpen
-  } = _b, rest = __objRest$C(_b, [
+  } = _b, rest = __objRest$D(_b, [
     "stayMountedOnClose",
     "isOpen"
   ]);
@@ -10261,7 +10271,7 @@ var __spreadValues$J = (a, b) => {
     }
   return a;
 };
-var __objRest$B = (source, exclude) => {
+var __objRest$C = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$J.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -10284,7 +10294,7 @@ const FileEditorModal = forwardRef$1((_a, ref) => {
     isImage,
     canEditFileName = true,
     canCropImage = false
-  } = _b, rest = __objRest$B(_b, [
+  } = _b, rest = __objRest$C(_b, [
     "fileName",
     "setFileName",
     "isOpen",
@@ -10369,7 +10379,7 @@ var __spreadValues$I = (a, b) => {
     }
   return a;
 };
-var __objRest$A = (source, exclude) => {
+var __objRest$B = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$I.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -10387,7 +10397,7 @@ const ConfirmDeleteModal = (_a) => {
     onClose,
     confirmDelete,
     fileName
-  } = _b, rest = __objRest$A(_b, [
+  } = _b, rest = __objRest$B(_b, [
     "isOpen",
     "onClose",
     "confirmDelete",
@@ -10430,7 +10440,7 @@ var __spreadValues$H = (a, b) => {
     }
   return a;
 };
-var __objRest$z = (source, exclude) => {
+var __objRest$A = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$H.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -10444,7 +10454,7 @@ var __objRest$z = (source, exclude) => {
 };
 const ProgressBar = forwardRef$1(
   (_a, ref) => {
-    var _b = _a, { animationSlideTimeMs = animationSlideTime, sx } = _b, props = __objRest$z(_b, ["animationSlideTimeMs", "sx"]);
+    var _b = _a, { animationSlideTimeMs = animationSlideTime, sx } = _b, props = __objRest$A(_b, ["animationSlideTimeMs", "sx"]);
     return /* @__PURE__ */ React.createElement(
       Progress,
       __spreadValues$H({
@@ -10495,7 +10505,7 @@ var __spreadValues$G = (a, b) => {
     }
   return a;
 };
-var __objRest$y = (source, exclude) => {
+var __objRest$z = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$G.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -10513,7 +10523,7 @@ const LoadingBar = (_a) => {
     onLoadEnd = () => {
     },
     hideDisplay = true
-  } = _b, rest = __objRest$y(_b, [
+  } = _b, rest = __objRest$z(_b, [
     "loaded",
     "onLoadEnd",
     "hideDisplay"
@@ -10777,7 +10787,7 @@ var __spreadValues$E = (a, b) => {
     }
   return a;
 };
-var __objRest$x = (source, exclude) => {
+var __objRest$y = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$E.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -10793,7 +10803,7 @@ const FileIconButton = (_a) => {
   var _b = _a, {
     icon,
     color = "unset"
-  } = _b, rest = __objRest$x(_b, [
+  } = _b, rest = __objRest$y(_b, [
     "icon",
     "color"
   ]);
@@ -10819,7 +10829,7 @@ var __spreadValues$D = (a, b) => {
   return a;
 };
 var __spreadProps$6 = (a, b) => __defProps$6(a, __getOwnPropDescs$6(b));
-var __objRest$w = (source, exclude) => {
+var __objRest$x = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$D.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -10843,7 +10853,7 @@ const FilePicker = (_a) => {
     loadWithSpinner = false,
     confirmDelete = false,
     editFileOptions = defaultEditOptions
-  } = _b, rest = __objRest$w(_b, [
+  } = _b, rest = __objRest$x(_b, [
     "acceptFormat",
     "onChange",
     "compression",
@@ -11149,7 +11159,7 @@ var __spreadValues$C = (a, b) => {
     }
   return a;
 };
-var __objRest$v = (source, exclude) => {
+var __objRest$w = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$C.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -11169,7 +11179,7 @@ const FilePickerField = (_a) => {
     isRequired,
     validate,
     onChange: onChangeCallback = identity
-  } = _b, rest = __objRest$v(_b, [
+  } = _b, rest = __objRest$w(_b, [
     "name",
     "label",
     "direction",
@@ -11227,7 +11237,7 @@ var __spreadValues$B = (a, b) => {
     }
   return a;
 };
-var __objRest$u = (source, exclude) => {
+var __objRest$v = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$B.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -11247,7 +11257,7 @@ function MultiFileUploader(_a) {
     addFilesToQueue = identity,
     updatePreviewFiles = identity,
     maxFileSize = fiveHundredMB
-  } = _b, rest = __objRest$u(_b, [
+  } = _b, rest = __objRest$v(_b, [
     "acceptFormat",
     "compression",
     "onChange",
@@ -11588,7 +11598,7 @@ var __spreadValues$z = (a, b) => {
     }
   return a;
 };
-var __objRest$t = (source, exclude) => {
+var __objRest$u = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$z.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -11610,7 +11620,7 @@ function MultiFileList(_a) {
     confirmDelete,
     editFileOptions = defaultEditOptions,
     enableSmartLoad = true
-  } = _b, rest = __objRest$t(_b, [
+  } = _b, rest = __objRest$u(_b, [
     "files",
     "uploadingFiles",
     "onChange",
@@ -11690,7 +11700,7 @@ var __spreadValues$y = (a, b) => {
     }
   return a;
 };
-var __objRest$s = (source, exclude) => {
+var __objRest$t = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$y.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -11716,7 +11726,7 @@ function MultiFilePicker(_a) {
     enableSmartLoad = true,
     editFileOptions = defaultEditOptions,
     variant
-  } = _b, rest = __objRest$s(_b, [
+  } = _b, rest = __objRest$t(_b, [
     "acceptFormat",
     "compression",
     "onChange",
@@ -11801,7 +11811,7 @@ var __spreadValues$x = (a, b) => {
     }
   return a;
 };
-var __objRest$r = (source, exclude) => {
+var __objRest$s = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$x.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -11821,7 +11831,7 @@ const MultiFilePickerField = (_a) => {
     isRequired,
     validate,
     onChange: onChangeCallback = identity
-  } = _b, rest = __objRest$r(_b, [
+  } = _b, rest = __objRest$s(_b, [
     "name",
     "label",
     "direction",
@@ -11905,7 +11915,7 @@ var __spreadValues$w = (a, b) => {
     }
   return a;
 };
-var __objRest$q = (source, exclude) => {
+var __objRest$r = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$w.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -11918,7 +11928,7 @@ var __objRest$q = (source, exclude) => {
   return target;
 };
 const Menu = (_a) => {
-  var _b = _a, { variant = "relaxed" } = _b, props = __objRest$q(_b, ["variant"]);
+  var _b = _a, { variant = "relaxed" } = _b, props = __objRest$r(_b, ["variant"]);
   return /* @__PURE__ */ React.createElement(Menu$2, __spreadValues$w({ variant }, props));
 };
 
@@ -11979,7 +11989,7 @@ var __spreadValues$v = (a, b) => {
     }
   return a;
 };
-var __objRest$p = (source, exclude) => {
+var __objRest$q = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$v.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -12000,7 +12010,7 @@ const NumberInput = (_a) => {
     enableStepperArrows = false,
     name,
     onlyAcceptPercentage = false
-  } = _b, rest = __objRest$p(_b, [
+  } = _b, rest = __objRest$q(_b, [
     "variant",
     "size",
     "onChange",
@@ -12055,7 +12065,7 @@ var __spreadValues$u = (a, b) => {
     }
   return a;
 };
-var __objRest$o = (source, exclude) => {
+var __objRest$p = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$u.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -12078,7 +12088,7 @@ const NumberInputField = forwardRef$1((_a, ref) => {
     onlyAcceptPercentage = false,
     inputLeftElement,
     inputRightElement
-  } = _b, rest = __objRest$o(_b, [
+  } = _b, rest = __objRest$p(_b, [
     "name",
     "label",
     "direction",
@@ -12145,7 +12155,7 @@ var __spreadValues$t = (a, b) => {
     }
   return a;
 };
-var __objRest$n = (source, exclude) => {
+var __objRest$o = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$t.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -12165,7 +12175,7 @@ const NotificationIconButton = forwardRef$1((_a, ref) => {
     hasNotification = false,
     blinkerColor = "green.500",
     size
-  } = _b, rest = __objRest$n(_b, [
+  } = _b, rest = __objRest$o(_b, [
     "variant",
     "icon",
     "aria-label",
@@ -12215,7 +12225,7 @@ var __spreadValues$s = (a, b) => {
   return a;
 };
 var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
-var __objRest$m = (source, exclude) => {
+var __objRest$n = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$s.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -12232,7 +12242,7 @@ const PinInput = (_a) => {
     variant = "outline",
     hidden,
     children
-  } = _b, rest = __objRest$m(_b, [
+  } = _b, rest = __objRest$n(_b, [
     "variant",
     "hidden",
     "children"
@@ -12273,7 +12283,7 @@ var __spreadValues$r = (a, b) => {
   return a;
 };
 var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
-var __objRest$l = (source, exclude) => {
+var __objRest$m = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$r.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -12301,7 +12311,7 @@ const Select = forwardRef$1((_a, ref) => {
     value,
     icon,
     components
-  } = _b, rest = __objRest$l(_b, [
+  } = _b, rest = __objRest$m(_b, [
     "options",
     "isMulti",
     "onChange",
@@ -12379,7 +12389,7 @@ var __spreadValues$q = (a, b) => {
     }
   return a;
 };
-var __objRest$k = (source, exclude) => {
+var __objRest$l = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$q.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -12404,7 +12414,7 @@ const BaseSelectField = (_a, ref) => {
     onChange: onChangeCallback = identity,
     inputLeftElement,
     inputRightElement
-  } = _b, rest = __objRest$k(_b, [
+  } = _b, rest = __objRest$l(_b, [
     "name",
     "label",
     "options",
@@ -12487,7 +12497,7 @@ var __spreadValues$p = (a, b) => {
     }
   return a;
 };
-var __objRest$j = (source, exclude) => {
+var __objRest$k = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$p.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -12505,7 +12515,7 @@ const Switch = (_a) => {
     onChange,
     name,
     size = "md"
-  } = _b, rest = __objRest$j(_b, [
+  } = _b, rest = __objRest$k(_b, [
     "value",
     "onChange",
     "name",
@@ -12538,7 +12548,7 @@ var __spreadValues$o = (a, b) => {
     }
   return a;
 };
-var __objRest$i = (source, exclude) => {
+var __objRest$j = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$o.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -12560,7 +12570,7 @@ const SwitchField = forwardRef$1((_a, ref) => {
     direction = "row",
     labelPlacement = "right",
     labelSize = "md"
-  } = _b, rest = __objRest$i(_b, [
+  } = _b, rest = __objRest$j(_b, [
     "name",
     "label",
     "isRequired",
@@ -12639,7 +12649,7 @@ var __spreadValues$m = (a, b) => {
     }
   return a;
 };
-var __objRest$h = (source, exclude) => {
+var __objRest$i = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$m.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -12656,7 +12666,7 @@ const Tabs = (_a) => {
     children,
     variant = "soft-rounded",
     isManual = true
-  } = _b, rest = __objRest$h(_b, [
+  } = _b, rest = __objRest$i(_b, [
     "children",
     "variant",
     "isManual"
@@ -12687,7 +12697,7 @@ var __spreadValues$l = (a, b) => {
     }
   return a;
 };
-var __objRest$g = (source, exclude) => {
+var __objRest$h = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$l.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -12705,7 +12715,7 @@ const Textarea = (_a) => {
     onChange,
     name,
     value
-  } = _b, rest = __objRest$g(_b, [
+  } = _b, rest = __objRest$h(_b, [
     "size",
     "onChange",
     "name",
@@ -12738,7 +12748,7 @@ var __spreadValues$k = (a, b) => {
     }
   return a;
 };
-var __objRest$f = (source, exclude) => {
+var __objRest$g = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$k.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -12758,7 +12768,7 @@ const TextareaField = forwardRef$1((_a, ref) => {
     validate,
     direction,
     onChange: onChangeCallback = identity
-  } = _b, rest = __objRest$f(_b, [
+  } = _b, rest = __objRest$g(_b, [
     "name",
     "label",
     "isRequired",
@@ -12812,7 +12822,7 @@ var __spreadValues$j = (a, b) => {
   return a;
 };
 var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
-var __objRest$e = (source, exclude) => {
+var __objRest$f = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$j.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -12849,7 +12859,7 @@ const FormattedNumberInput = (_a) => {
     min = -Infinity,
     inputLeftElement,
     inputRightElement
-  } = _b, rest = __objRest$e(_b, [
+  } = _b, rest = __objRest$f(_b, [
     "preset",
     "isPercentage",
     "onChange",
@@ -12923,7 +12933,7 @@ var __spreadValues$i = (a, b) => {
     }
   return a;
 };
-var __objRest$d = (source, exclude) => {
+var __objRest$e = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$i.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -12943,7 +12953,7 @@ const FormattedNumberInputField = forwardRef$1((_a, ref) => {
     validate,
     onChange: onChangeCallback = identity,
     direction = "row"
-  } = _b, rest = __objRest$d(_b, [
+  } = _b, rest = __objRest$e(_b, [
     "name",
     "label",
     "isRequired",
@@ -12991,7 +13001,7 @@ var __spreadValues$h = (a, b) => {
     }
   return a;
 };
-var __objRest$c = (source, exclude) => {
+var __objRest$d = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$h.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -13015,7 +13025,7 @@ const MaskedTextInput = (_a) => {
     placeholder,
     onChange,
     onBlur
-  } = _b, rest = __objRest$c(_b, [
+  } = _b, rest = __objRest$d(_b, [
     "mask",
     "maskPlaceholder",
     "alwaysShowMask",
@@ -13062,7 +13072,7 @@ var __spreadValues$g = (a, b) => {
     }
   return a;
 };
-var __objRest$b = (source, exclude) => {
+var __objRest$c = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$g.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -13085,7 +13095,7 @@ const TextField = forwardRef$1((_a, ref) => {
     onChange: onChangeCallback = identity,
     inputLeftElement,
     inputRightElement
-  } = _b, rest = __objRest$b(_b, [
+  } = _b, rest = __objRest$c(_b, [
     "name",
     "label",
     "as",
@@ -13145,7 +13155,7 @@ var __spreadValues$f = (a, b) => {
     }
   return a;
 };
-var __objRest$a = (source, exclude) => {
+var __objRest$b = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$f.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -13163,7 +13173,7 @@ const Toast = (_a) => {
     title = "",
     description = "",
     onClose
-  } = _b, rest = __objRest$a(_b, [
+  } = _b, rest = __objRest$b(_b, [
     "variant",
     "title",
     "description",
@@ -13277,7 +13287,7 @@ var __spreadValues$d = (a, b) => {
     }
   return a;
 };
-var __objRest$9 = (source, exclude) => {
+var __objRest$a = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$d.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -13290,7 +13300,7 @@ var __objRest$9 = (source, exclude) => {
   return target;
 };
 const StatusPin = (_a) => {
-  var _b = _a, { size = "md", variant } = _b, rest = __objRest$9(_b, ["size", "variant"]);
+  var _b = _a, { size = "md", variant } = _b, rest = __objRest$a(_b, ["size", "variant"]);
   const pinColor = pinVariantMap[variant];
   const pinSizeTuple = pinSizeMap[size];
   const [outerSize, innerSize] = pinSizeTuple;
@@ -13342,7 +13352,7 @@ var __spreadValues$c = (a, b) => {
     }
   return a;
 };
-var __objRest$8 = (source, exclude) => {
+var __objRest$9 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$c.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -13355,7 +13365,7 @@ var __objRest$8 = (source, exclude) => {
   return target;
 };
 const StatusBlock = (_a) => {
-  var _b = _a, { variant } = _b, rest = __objRest$8(_b, ["variant"]);
+  var _b = _a, { variant } = _b, rest = __objRest$9(_b, ["variant"]);
   const [bgColor, contentColor] = blockVariantMap[variant];
   return /* @__PURE__ */ React.createElement(
     Tag,
@@ -13396,7 +13406,7 @@ var __spreadValues$b = (a, b) => {
     }
   return a;
 };
-var __objRest$7 = (source, exclude) => {
+var __objRest$8 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$b.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -13411,7 +13421,7 @@ var __objRest$7 = (source, exclude) => {
 const AsyncError = (_a) => {
   var _b = _a, {
     message = ""
-  } = _b, rest = __objRest$7(_b, [
+  } = _b, rest = __objRest$8(_b, [
     "message"
   ]);
   return /* @__PURE__ */ React.createElement(Alert$2, __spreadValues$b({ backgroundColor: "background.default", color: "text.default", width: "100%" }, rest), /* @__PURE__ */ React.createElement(VStack, { w: "full" }, /* @__PURE__ */ React.createElement(Icon$1, { as: toastIconMap.error, color: "icon.toast.error", boxSize: 6 }), /* @__PURE__ */ React.createElement(AlertTitle, null, " Error "), message && /* @__PURE__ */ React.createElement(AlertDescription, null, message)));
@@ -13469,7 +13479,7 @@ var __spreadValues$8 = (a, b) => {
     }
   return a;
 };
-var __objRest$6 = (source, exclude) => {
+var __objRest$7 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$8.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -13482,7 +13492,7 @@ var __objRest$6 = (source, exclude) => {
   return target;
 };
 const Step = (_a) => {
-  var _b = _a, { label, description } = _b, rest = __objRest$6(_b, ["label", "description"]);
+  var _b = _a, { label, description } = _b, rest = __objRest$7(_b, ["label", "description"]);
   const {
     step,
     label: labelStyle,
@@ -13525,7 +13535,7 @@ var __spreadValues$7 = (a, b) => {
   return a;
 };
 var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
-var __objRest$5 = (source, exclude) => {
+var __objRest$6 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$7.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -13538,7 +13548,7 @@ var __objRest$5 = (source, exclude) => {
   return target;
 };
 const StepList = (_a) => {
-  var _b = _a, { children } = _b, rest = __objRest$5(_b, ["children"]);
+  var _b = _a, { children } = _b, rest = __objRest$6(_b, ["children"]);
   const tabs = Children.count(children);
   const styles = useStyleConfig("StepList", { tabs });
   return /* @__PURE__ */ React.createElement(TabList, __spreadProps$1(__spreadValues$7({}, rest), { sx: styles }), children);
@@ -13560,7 +13570,7 @@ var __spreadValues$6 = (a, b) => {
     }
   return a;
 };
-var __objRest$4 = (source, exclude) => {
+var __objRest$5 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$6.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -13577,7 +13587,7 @@ const ClipboardInput = forwardRef$1((_a, ref) => {
     size = "md",
     value,
     "aria-label": ariaLabel
-  } = _b, rest = __objRest$4(_b, [
+  } = _b, rest = __objRest$5(_b, [
     "size",
     "value",
     "aria-label"
@@ -13638,7 +13648,7 @@ var __spreadValues$5 = (a, b) => {
     }
   return a;
 };
-var __objRest$3 = (source, exclude) => {
+var __objRest$4 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$5.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -13657,7 +13667,7 @@ const SplitPane = (_a) => {
     isOpen,
     minLeftWidth = 25,
     minRightWidth = 50
-  } = _b, rest = __objRest$3(_b, [
+  } = _b, rest = __objRest$4(_b, [
     "children",
     "initialSplit",
     "isOpen",
@@ -13726,7 +13736,7 @@ var __spreadValues$4 = (a, b) => {
     }
   return a;
 };
-var __objRest$2 = (source, exclude) => {
+var __objRest$3 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$4.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -13739,7 +13749,7 @@ var __objRest$2 = (source, exclude) => {
   return target;
 };
 const PaneItem = (_a) => {
-  var _b = _a, { children } = _b, rest = __objRest$2(_b, ["children"]);
+  var _b = _a, { children } = _b, rest = __objRest$3(_b, ["children"]);
   return /* @__PURE__ */ React.createElement(GridItem, __spreadValues$4({ overflow: "hidden" }, rest), children);
 };
 
@@ -13786,7 +13796,7 @@ var __spreadValues$2 = (a, b) => {
     }
   return a;
 };
-var __objRest$1 = (source, exclude) => {
+var __objRest$2 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$2.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -13805,7 +13815,7 @@ const StepStack = (_a) => {
     rowHeight = "10",
     stepCircleAlignment = "center",
     stepCircleMarginTopPx = 0
-  } = _b, rest = __objRest$1(_b, [
+  } = _b, rest = __objRest$2(_b, [
     "children",
     "spacing",
     "rowHeight",
@@ -13865,7 +13875,7 @@ var __spreadValues$1 = (a, b) => {
     }
   return a;
 };
-var __objRest = (source, exclude) => {
+var __objRest$1 = (source, exclude) => {
   var target = {};
   for (var prop in source)
     if (__hasOwnProp$1.call(source, prop) && exclude.indexOf(prop) < 0)
@@ -13877,10 +13887,28 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
+const { Option: ChakraOption } = chakraComponents;
 const customComponents = {
   Option: (_a) => {
-    var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
-    return /* @__PURE__ */ React.createElement(chakraComponents.Option, __spreadValues$1({}, props), /* @__PURE__ */ React.createElement(React.Fragment, null, props.data.isCreation ? /* @__PURE__ */ React.createElement(Flex, { mr: 3, width: 1.5, mb: 0.5, justifyContent: "center", alignItems: "center" }, /* @__PURE__ */ React.createElement(Icon$1, { mb: "4px", as: PlusSolid, color: "brand" })) : /* @__PURE__ */ React.createElement(Box, { mr: 3, width: 1.5 }), children));
+    var _b = _a, { children } = _b, props = __objRest$1(_b, ["children"]);
+    return /* @__PURE__ */ React.createElement(ChakraOption, __spreadValues$1({}, props), props.data.isCreation && /* @__PURE__ */ React.createElement(
+      Flex,
+      {
+        mr: 3,
+        width: 1.5,
+        mb: 0.5,
+        justifyContent: "center",
+        alignItems: "center"
+      },
+      /* @__PURE__ */ React.createElement(Icon$1, { as: PlusSolid, color: "brand" })
+    ), !props.data.isCreation && /* @__PURE__ */ React.createElement(Box, { mr: 3, width: 1.5 }), /* @__PURE__ */ React.createElement(
+      Text,
+      {
+        color: props.data.isCreation ? "text.brand" : "text.default",
+        fontWeight: props.data.isCreation ? "semibold" : "normal"
+      },
+      children
+    ));
   }
 };
 
@@ -13903,70 +13931,90 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-const CreatableSelectDropdown = ({
-  standardOptions,
-  initialPlaceholder = "Select or create...",
-  addOptionPlaceholder = "Enter text...",
-  creationOption = {
-    label: "Add option...",
-    value: "Add option...",
-    isCreation: true
-  },
-  onOptionChange,
-  width = "100%",
-  variant = "outline",
-  defaultValue,
-  value,
-  menuPlacement = "bottom"
-}) => {
-  const initialSelectedOption = useMemo(
-    () => {
-      var _a, _b;
-      if (!isNil(value)) {
-        return (_a = standardOptions.find((option) => option.value === value)) != null ? _a : null;
-      }
-      if (!isNil(defaultValue)) {
-        return (_b = standardOptions.find((option) => option.value === defaultValue)) != null ? _b : null;
-      }
-      return null;
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+const CREATION_OPTION_VALUE = "add_field";
+const CreatableSelectDropdown = (_a) => {
+  var _b = _a, {
+    standardOptions,
+    initialPlaceholder = "Select or create...",
+    addOptionPlaceholder = "Select or create...",
+    creationOption = {
+      label: "Add field",
+      value: CREATION_OPTION_VALUE,
+      isCreation: true
     },
-    [value]
-  );
-  const [selectedOption, setSelectedOption] = useState(initialSelectedOption);
-  const [newOptionText, setNewOptionText] = useState("");
+    onOptionChange,
+    variant = "outline",
+    defaultValue,
+    value,
+    menuPlacement = "bottom"
+  } = _b, restProps = __objRest(_b, [
+    "standardOptions",
+    "initialPlaceholder",
+    "addOptionPlaceholder",
+    "creationOption",
+    "onOptionChange",
+    "variant",
+    "defaultValue",
+    "value",
+    "menuPlacement"
+  ]);
+  const [selectedOption, setSelectedOption] = useState(() => {
+    var _a2, _b2;
+    const targetValue = (_a2 = value != null ? value : defaultValue) != null ? _a2 : null;
+    return targetValue ? (_b2 = standardOptions.find((option) => option.value === targetValue)) != null ? _b2 : null : null;
+  });
   const [newOptionPlaceholder, setNewOptionPlaceholder] = useState(initialPlaceholder);
   const [createdOptions, setCreatedOptions] = useState([]);
+  const [createNewOption, setCreateNewOption] = useState(false);
+  const [addFieldInputValue, setAddFieldInputValue] = useState("");
   function isCreationOption(option) {
     return option && typeof option.isCreation === "boolean";
   }
   const ref = useRef(null);
-  useOutsideClick({
-    ref,
-    handler: () => {
-      if (isCreationOption(selectedOption)) {
-        setSelectedOption(initialSelectedOption);
-        setNewOptionPlaceholder(initialPlaceholder);
-      }
+  const checkIfNewOptionTextExistsInOptions = (string, options) => any((option) => toLower(option.value) === string, options);
+  const handleCreateOption = (newOptionTextString) => {
+    setCreateNewOption(true);
+    if (isEmpty(trim(newOptionTextString))) {
+      return;
     }
-  });
-  const handleInputChange = (newValue) => {
-    setNewOptionText(newValue);
-  };
-  const handleCreateOption = () => {
-    const newOptionTextLower = newOptionText.toLowerCase();
-    const newOptionExists = standardOptions.some((option) => option.value.toLowerCase() === newOptionTextLower);
-    if (!newOptionExists) {
-      const newOption = { label: newOptionText, value: newOptionText };
-      setCreatedOptions((currentCreatedOptions) => [...currentCreatedOptions, newOption]);
+    const newOptionTextLower = toLower(newOptionTextString);
+    const newOptionExistsInStandardOptions = checkIfNewOptionTextExistsInOptions(newOptionTextLower, standardOptions);
+    const newOptionExistsInCreatedOptions = checkIfNewOptionTextExistsInOptions(
+      newOptionTextLower,
+      createdOptions
+    );
+    if (!newOptionExistsInCreatedOptions && !newOptionExistsInStandardOptions) {
+      const newOption = {
+        label: newOptionTextString,
+        value: newOptionTextString
+      };
+      setCreatedOptions((currentCreatedOptions) => [
+        ...currentCreatedOptions,
+        newOption
+      ]);
       setSelectedOption(newOption);
       onOptionChange(newOption);
     }
-    setNewOptionText("");
     setNewOptionPlaceholder(initialPlaceholder);
   };
   const handleChange = (newValue, _actionMeta) => {
     const option = newValue;
-    if (option === null) {
+    if (newValue == null ? void 0 : newValue.isCreation) {
+      setCreateNewOption(true);
+    }
+    if (option == null) {
       return;
     }
     if (isCreationOption(option)) {
@@ -13974,29 +14022,58 @@ const CreatableSelectDropdown = ({
     } else {
       setNewOptionPlaceholder(initialPlaceholder);
     }
-    setSelectedOption(option);
-    onOptionChange(option);
-  };
-  const handleKeyDown = (event) => {
-    if (event.key === "Enter" && newOptionText) {
-      handleCreateOption();
-      event.preventDefault();
+    if (option.value !== CREATION_OPTION_VALUE) {
+      setSelectedOption(option);
     }
+    onOptionChange(option);
   };
-  const combinedOptions = [...standardOptions, ...createdOptions];
+  const combinedOptions = useMemo(
+    () => [...standardOptions, ...createdOptions],
+    [standardOptions, createdOptions]
+  );
   const customOptions = [
     __spreadProps(__spreadValues({}, creationOption), {
       icon: /* @__PURE__ */ React.createElement(Icon$2, { as: PlusSolid, color: "brand" })
     }),
     ...combinedOptions
   ];
-  return /* @__PURE__ */ React.createElement(Box, { ref }, /* @__PURE__ */ React.createElement(
-    CreatableSelect,
+  useEffect(() => {
+    var _a2;
+    const newSelectedOption = (_a2 = combinedOptions.find((option) => option.value === value)) != null ? _a2 : null;
+    if ((selectedOption == null ? void 0 : selectedOption.value) !== (newSelectedOption == null ? void 0 : newSelectedOption.value)) {
+      setSelectedOption(newSelectedOption);
+    }
+  }, [value, combinedOptions]);
+  return /* @__PURE__ */ React.createElement(Box, { ref, w: "sm", maxW: "full" }, createNewOption && /* @__PURE__ */ React.createElement(
+    EditableText,
     {
+      value: addFieldInputValue,
+      startWithEditView: true,
+      onChange: (v) => {
+        setAddFieldInputValue(v);
+      },
+      submitOnBlur: false,
+      onCancel: () => {
+        setAddFieldInputValue("");
+        setCreateNewOption(false);
+      },
+      onSubmit: (v) => {
+        handleCreateOption(v);
+        setCreateNewOption(false);
+      },
+      variant: "brand",
+      sx: {
+        minWidth: "100%",
+        width: "100%"
+      }
+    }
+  ), !createNewOption && /* @__PURE__ */ React.createElement(
+    CreatableSelect,
+    __spreadValues({
       menuPlacement,
       chakraStyles: __spreadProps(__spreadValues({}, customSelectStyles), {
         container: (provided) => __spreadProps(__spreadValues({}, provided), {
-          width
+          width: "100%"
         }),
         option: (provided, { isSelected }) => __spreadValues(__spreadValues({}, provided), isSelected && {
           color: "black"
@@ -14007,14 +14084,14 @@ const CreatableSelectDropdown = ({
       value: selectedOption,
       onChange: handleChange,
       isMulti: false,
-      onInputChange: handleInputChange,
-      onKeyDown: handleKeyDown,
-      onCreateOption: handleCreateOption,
+      onCreateOption: (v) => {
+        setCreateNewOption(true);
+        setAddFieldInputValue(v);
+      },
       placeholder: newOptionPlaceholder,
-      inputValue: newOptionText,
       useBasicStyles: true,
       variant
-    }
+    }, restProps)
   ));
 };