@northlight/ui 2.8.0 → 2.9.0

package/dist/es/northlight.d.mts

@@ -994,7 +994,7 @@ interface SearchBarOptionType {
     value: any;
 }
 type CustomElementType<T extends SearchBarOptionType> = ((props: T) => JSX.Element) | null;
-interface SearchBarProps<T extends SearchBarOptionType> extends Omit<Props<T, boolean, GroupBase<T>>, 'onChange' | 'value'> {
+interface SearchBarProps<T extends SearchBarOptionType, K extends boolean = false> extends Omit<Props<T, boolean, GroupBase<T>>, 'onChange' | 'value'> {
     value?: T | T[];
     onChange?: (val: any, event: ActionMeta<T>) => void;
     onAdd?: (val: unknown) => void;
@@ -1006,14 +1006,14 @@ interface SearchBarProps<T extends SearchBarOptionType> extends Omit<Props<T, bo
     closeMenuonSelect?: boolean;
     defaultOptions?: T[];
     sx?: ChakraStylesConfig<any>;
-    isMulti?: boolean;
+    isMulti?: K;
     customOption?: CustomElementType<T>;
     customTag?: CustomElementType<T>;
     loadOptions?: ((query: string) => Promise<T[]>) | null;
     onSearchInputChange?: (input: string) => void;
     icon?: ComponentType<any>;
 }
-interface SearchBarFieldProps<T extends SearchBarOptionType> extends Omit<SearchBarProps<T>, 'onChange'>, InputFieldProps {
+interface SearchBarFieldProps<T extends SearchBarOptionType, K extends boolean = false> extends Omit<SearchBarProps<T, K>, 'onChange'>, InputFieldProps {
     onChange?: (val: T | T[], event: ActionMeta<T>) => void;
     direction?: StackDirection;
     name: string;
@@ -1022,9 +1022,9 @@ interface SearchBarFieldProps<T extends SearchBarOptionType> extends Omit<Search
     isRequired?: boolean;
 }
 
-declare const SearchBar: <T extends SearchBarOptionType>(props: SearchBarProps<T> & React__default.RefAttributes<SelectInstance<T, boolean, GroupBase<T>>>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const SearchBar: <T extends SearchBarOptionType, K extends boolean = false>(props: SearchBarProps<T, K> & React__default.RefAttributes<SelectInstance<T, K, GroupBase<T>>>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
-declare const SearchBarField: <T extends SearchBarOptionType>({ name, label, direction, isMulti, isRequired, validate, isClearable, onChange: onChangeCallback, inputLeftElement, inputRightElement, ...rest }: SearchBarFieldProps<T>) => JSX.Element;
+declare const SearchBarField: <T extends SearchBarOptionType, K extends boolean = false>({ name, label, direction, isMulti, isRequired, validate, isClearable, onChange: onChangeCallback, inputLeftElement, inputRightElement, ...rest }: SearchBarFieldProps<T, K>) => JSX.Element;
 
 /**
  * Context used for all drag and drop components
@@ -2439,12 +2439,12 @@ interface Option {
     label: string;
     value: string;
 }
-interface SelectProps<T> extends Omit<Props<T, boolean, GroupBase<T>>, 'onChange' | 'value'> {
+interface SelectProps<T, K> extends Omit<Props<T, boolean, GroupBase<T>>, 'onChange' | 'value' | 'isMulti'> {
     /** Whatever is currently selected by the select will be controlled by value prop */
     value?: Option | Option[];
     /** Take a look at the second argument, the event,
      *  for info as to which specific element was added */
-    onChange?: (option: MultiValue<T> | SingleValue<T>, event: ActionMeta<T>) => void;
+    onChange?: (option: K extends true ? MultiValue<T> : SingleValue<T>, event: ActionMeta<T>) => void;
     onAdd?: (val: unknown) => void;
     onRemove?: (val: unknown) => void;
     /** Used for accessibility */
@@ -2457,15 +2457,14 @@ interface SelectProps<T> extends Omit<Props<T, boolean, GroupBase<T>>, 'onChange
     /** Custom icon that will be put to the faremost left of the component */
     leftIcon?: ComponentType<any>;
     customOption?: ((option: T) => JSX.Element) | null;
+    isMulti?: K;
 }
-type SelectFieldProps<T, K extends boolean = false> = Omit<SelectProps<T>, 'onChange' | 'isMulti'> & Omit<InputFieldProps, 'isMulti'> & {
-    onChange?: (val: K extends true ? T[] : T, event: ActionMeta<T>) => void;
+type SelectFieldProps<T, K extends boolean = false> = SelectProps<T, K> & Omit<InputFieldProps, 'isMulti'> & {
     direction?: StackDirection;
     name: string;
     label: string;
     validate?: RegisterOptions;
     isRequired?: boolean;
-    isMulti?: K;
 };
 
 /**
@@ -2591,7 +2590,7 @@ render(<CustomSelect />);
  * />
  * ?)
 */
-declare function Select<T extends Option>({ options, isMulti, onChange, onAdd, onRemove, isLoading, loadingList, 'data-testid': testId, customOption, customTag, value, icon, ...rest }: SelectProps<T>): JSX.Element;
+declare function Select<T extends Option, K extends boolean = false>({ options, isMulti, onChange, onAdd, onRemove, isLoading, loadingList, 'data-testid': testId, customOption, customTag, value, icon, ...rest }: SelectProps<T, K>): JSX.Element;
 
 declare function SelectField<T extends Option, K extends boolean = false>({ name, label, options, direction, isMulti, isRequired, validate, isClearable, onChange: onChangeCallback, inputLeftElement, inputRightElement, ...rest }: SelectFieldProps<T, K>): JSX.Element;
 
@@ -3538,11 +3537,11 @@ declare const useArrowFocus: (columns: number) => {
     focusLast: (opts?: _react_aria_focus.FocusManagerOptions | undefined) => _react_types_shared.FocusableElement;
 };
 
-interface UseSelectCallbacksProps<T> extends Omit<Props<T, boolean, GroupBase<T>>, 'onChange' | 'value'> {
-    onChange: (val: MultiValue<T> | SingleValue<T>, event: ActionMeta<T>) => void;
+interface UseSelectCallbacksProps<T, K extends boolean = false> extends Omit<Props<T, boolean, GroupBase<T>>, 'onChange' | 'value'> {
+    onChange: (option: K extends true ? MultiValue<T> : SingleValue<T>, event: ActionMeta<T>) => void;
     onAdd: (val: unknown) => void;
     onRemove: (val: unknown) => void;
-    isMulti: boolean;
+    isMulti?: boolean;
     value: T | T[];
 }
 interface BasicOption {
@@ -3551,11 +3550,13 @@ interface BasicOption {
 }
 type SelectActionMeta<T> = ActionMeta<T>;
 
-declare const useSelectCallbacks: <T extends BasicOption>({ onChange, onAdd, onRemove, isMulti, value, }: UseSelectCallbacksProps<T>) => (val: MultiValue<T> | SingleValue<T>, event: ActionMeta<T>) => void;
+declare const useSelectCallbacks: <T extends BasicOption, K extends boolean = false>({ onChange, onAdd, onRemove, isMulti, value, }: UseSelectCallbacksProps<T, K>) => (val: K extends true ? MultiValue<T> : SingleValue<T>, event: ActionMeta<T>) => void;
 
 declare const useOutsideRectClick: (ref: MutableRefObject<HTMLElement | null>, callback: (event: MouseEvent | TouchEvent) => void) => void;
 
+declare const useScreenSize: () => "sm" | "md" | "lg";
+
 declare const theme: Record<string, any>;
 declare const tottTheme: Record<string, any>;
 
-export { Accordion, AccordionButton, AccordionItem, AccordionPanel, Alert, AlertProps, AlertVariants, AspectRatio, AsyncError, AsyncErrorProps, Avatar, AvatarBadgeProps, AvatarGroup, AvatarGroupProps, AvatarProps, Badge, BasicOption, Blinker, BlinkerProps, BlockVariant, BlockVariantColorTuple, Blockquote, BodyType, Button, ButtonProps, ButtonVariants, Capitalized, Carousel, Checkbox, CheckboxField, CheckboxFieldProps, CheckboxProps, CheckboxVariants, ChildrenType, Clickable, ClickableProps, ClipboardInput, ClipboardInputProps, Collapse, CollapseProps, Color, ColorButtonProps, ColorGrade, ColorPicker, ColorPickerField, ColorPickerFieldProps, ColorPickerProps, ColorShades, ColorsExpandButtonProps, ConfirmDeleteModalProps, CurrentTheme, CustomContainerPropsType, CustomElementType, CustomFlipButtonProps, CustomFlipButtonPropsType, CustomTheme, DatePicker, DatePickerField, DatePickerFieldProps, DatePickerProps, DateRange, DateRangePicker, DateRangePickerField, DateRangePickerFieldProps, DateRangePickerProps, DragAndDrop, DragHandle, DragHandleProps, DragItem, DragItemProps, Draggable, DraggableProps, DropZone, DropZoneProps, Droppable, DroppableProps, DurationType, EditableControlsProps, EditableProps, EditableSizes, EditableText, Fade, FadeProps, FastGrid, FastGridProps, FastList, FastListProps, Field, FieldErrorType, FieldProps, FileEditorModalProps, FileFormat, FileIconButtonProps, FileItemProps, FilePicker, FilePickerField, FilePickerFieldProps, FilePickerProps, FileWithSizeAndType, FileWithSrcNameType, FileWithType, FlipButton, FlipButtonGroup, FlipButtonGroupField, FlipButtonGroupFieldProps, FlipButtonGroupProps, FlipButtonProps, Form, FormBody, FormLabel, FormLabelProps, FormProps, FormattedNumberInput, FormattedNumberInputProps, H1, H2, H3, H4, H5, H6, HeadingProps, HeadingType, Icon, IconButton, IconButtonProps, IconProps, InputFieldProps, Label, LabelProps, LabelSizes, LabelType, Lead, ListenersType, MaskedTextInput, MaskedTextInputProps, MediatoolThemeProvider, MediatoolThemeProviderProps, Message, Modal, ModalBase, ModalBooleans, ModalProps, ModalSizes, MultiFileList, MultiFileListProps, MultiFilePicker, MultiFilePickerField, MultiFilePickerFieldProps, MultiFilePickerProps, MultiFileUploader, MultiFileUploaderProps, MultiItemType, MultiSort, MultiSortProps, NotificationIconButton, NotificationIconButtonProps, NumberInput, NumberInputField, NumberInputFieldProps, NumberInputProps, NumberInputSizeProps, NumberInputStepperProps, OffsetType, Option, OrganizationLogo, OrganizationLogoProps, OverflowGroup, OverflowGroupProps, OverflowIndicatorProps, P, PProps, PaneDivider, PaneItem, PinInput, PinInputProps, PinSize, PinSizeTuple, PinVariant, ProgressBar, Radio, RadioFieldGroupProps, RadioFieldProps, RadioGroup, RadioGroupField, RadioGroupProps, RadioProps, ScaleFade, ScaleFadeProps, SearchBar, SearchBarField, SearchBarFieldProps, SearchBarOptionType, SearchBarProps, Select, SelectActionMeta, SelectField, SelectFieldProps, SelectProps, SetValueOptionsType, Slide, SlideFade, SlideFadeProps, SlideProps, Small, Sortable, SortableContainer, SortableContainerProps, SortableItem, SortableItemProps, SortableList, SortableListProps, Spinner, SpinnerProps, SplitPane, SplitPaneProps, StatusBlock, StatusBlockProps, StatusPin, StatusPinProps, Step, StepList, StepListProps, StepPanel, StepPanelProps, StepProps, StepStack, Steps, StepsProps, StylizedType, Switch, SwitchField, SwitchFieldProps, SwitchProps, TabPanel, TabPanelProps, Tabs, TabsProps, Tag, TagGroup, TagGroupProps, TagProps, TextField, TextFieldProps, TextInputFormatter, TextSizeProps, Textarea, TextareaField, TextareaFieldProps, TextareaProps, Tiny, Toast, ToastProps, Toolbox, ToolboxContent, ToolboxContentProps, ToolboxFooter, ToolboxFooterProps, ToolboxHeader, ToolboxHeaderProps, ToolboxProps, TransitionDirection, UseFormReturn, UseSelectCallbacksProps, UseToastOptions, addAlpha, advancedParseFloat, createDebounceFunctionInstance, getChildrenWithProps, getContrastColor, getFieldError, getInitials, getShades, highlight, luminosity, ring, statusIconMap, theme, tottTheme, trimFormValues, useArrowFocus, useCurrentTheme, useDebounce, useLoadingMessage, useOutsideRectClick, useOverflowGroup, useScrollToBottom, useSelectCallbacks, useSetValueRefreshed, useToast };
+export { Accordion, AccordionButton, AccordionItem, AccordionPanel, Alert, AlertProps, AlertVariants, AspectRatio, AsyncError, AsyncErrorProps, Avatar, AvatarBadgeProps, AvatarGroup, AvatarGroupProps, AvatarProps, Badge, BasicOption, Blinker, BlinkerProps, BlockVariant, BlockVariantColorTuple, Blockquote, BodyType, Button, ButtonProps, ButtonVariants, Capitalized, Carousel, Checkbox, CheckboxField, CheckboxFieldProps, CheckboxProps, CheckboxVariants, ChildrenType, Clickable, ClickableProps, ClipboardInput, ClipboardInputProps, Collapse, CollapseProps, Color, ColorButtonProps, ColorGrade, ColorPicker, ColorPickerField, ColorPickerFieldProps, ColorPickerProps, ColorShades, ColorsExpandButtonProps, ConfirmDeleteModalProps, CurrentTheme, CustomContainerPropsType, CustomElementType, CustomFlipButtonProps, CustomFlipButtonPropsType, CustomTheme, DatePicker, DatePickerField, DatePickerFieldProps, DatePickerProps, DateRange, DateRangePicker, DateRangePickerField, DateRangePickerFieldProps, DateRangePickerProps, DragAndDrop, DragHandle, DragHandleProps, DragItem, DragItemProps, Draggable, DraggableProps, DropZone, DropZoneProps, Droppable, DroppableProps, DurationType, EditableControlsProps, EditableProps, EditableSizes, EditableText, Fade, FadeProps, FastGrid, FastGridProps, FastList, FastListProps, Field, FieldErrorType, FieldProps, FileEditorModalProps, FileFormat, FileIconButtonProps, FileItemProps, FilePicker, FilePickerField, FilePickerFieldProps, FilePickerProps, FileWithSizeAndType, FileWithSrcNameType, FileWithType, FlipButton, FlipButtonGroup, FlipButtonGroupField, FlipButtonGroupFieldProps, FlipButtonGroupProps, FlipButtonProps, Form, FormBody, FormLabel, FormLabelProps, FormProps, FormattedNumberInput, FormattedNumberInputProps, H1, H2, H3, H4, H5, H6, HeadingProps, HeadingType, Icon, IconButton, IconButtonProps, IconProps, InputFieldProps, Label, LabelProps, LabelSizes, LabelType, Lead, ListenersType, MaskedTextInput, MaskedTextInputProps, MediatoolThemeProvider, MediatoolThemeProviderProps, Message, Modal, ModalBase, ModalBooleans, ModalProps, ModalSizes, MultiFileList, MultiFileListProps, MultiFilePicker, MultiFilePickerField, MultiFilePickerFieldProps, MultiFilePickerProps, MultiFileUploader, MultiFileUploaderProps, MultiItemType, MultiSort, MultiSortProps, NotificationIconButton, NotificationIconButtonProps, NumberInput, NumberInputField, NumberInputFieldProps, NumberInputProps, NumberInputSizeProps, NumberInputStepperProps, OffsetType, Option, OrganizationLogo, OrganizationLogoProps, OverflowGroup, OverflowGroupProps, OverflowIndicatorProps, P, PProps, PaneDivider, PaneItem, PinInput, PinInputProps, PinSize, PinSizeTuple, PinVariant, ProgressBar, Radio, RadioFieldGroupProps, RadioFieldProps, RadioGroup, RadioGroupField, RadioGroupProps, RadioProps, ScaleFade, ScaleFadeProps, SearchBar, SearchBarField, SearchBarFieldProps, SearchBarOptionType, SearchBarProps, Select, SelectActionMeta, SelectField, SelectFieldProps, SelectProps, SetValueOptionsType, Slide, SlideFade, SlideFadeProps, SlideProps, Small, Sortable, SortableContainer, SortableContainerProps, SortableItem, SortableItemProps, SortableList, SortableListProps, Spinner, SpinnerProps, SplitPane, SplitPaneProps, StatusBlock, StatusBlockProps, StatusPin, StatusPinProps, Step, StepList, StepListProps, StepPanel, StepPanelProps, StepProps, StepStack, Steps, StepsProps, StylizedType, Switch, SwitchField, SwitchFieldProps, SwitchProps, TabPanel, TabPanelProps, Tabs, TabsProps, Tag, TagGroup, TagGroupProps, TagProps, TextField, TextFieldProps, TextInputFormatter, TextSizeProps, Textarea, TextareaField, TextareaFieldProps, TextareaProps, Tiny, Toast, ToastProps, Toolbox, ToolboxContent, ToolboxContentProps, ToolboxFooter, ToolboxFooterProps, ToolboxHeader, ToolboxHeaderProps, ToolboxProps, TransitionDirection, UseFormReturn, UseSelectCallbacksProps, UseToastOptions, addAlpha, advancedParseFloat, createDebounceFunctionInstance, getChildrenWithProps, getContrastColor, getFieldError, getInitials, getShades, highlight, luminosity, ring, statusIconMap, theme, tottTheme, trimFormValues, useArrowFocus, useCurrentTheme, useDebounce, useLoadingMessage, useOutsideRectClick, useOverflowGroup, useScreenSize, useScrollToBottom, useSelectCallbacks, useSetValueRefreshed, useToast };

package/dist/es/northlight.mjs

@@ -1,4 +1,4 @@
-import { Accordion as Accordion$1, AccordionButton as AccordionButton$1, AccordionPanel as AccordionPanel$1, AccordionItem as AccordionItem$1, useMultiStyleConfig, chakra, Alert as Alert$2, AspectRatio as AspectRatio$1, forwardRef, useStyleConfig, Icon as Icon$2, Box, Heading, Text, FormLabel as FormLabel$1, VisuallyHidden, HStack, Badge as Badge$1, Button as Button$2, Checkbox as Checkbox$2, useInterval, FormControl, Stack, FormErrorMessage, Flex, IconButton as IconButton$1, useDisclosure, useBoolean, useToken as useToken$1, Popover, PopoverTrigger, PopoverContent, PopoverHeader, PopoverBody, SimpleGrid, SlideFade as SlideFade$1, Table, Thead, Tbody, Tr, Select as Select$2, PopoverAnchor, InputGroup, InputRightElement, Link as Link$1, Fade as Fade$1, ScaleFade as ScaleFade$1, Slide as Slide$1, Collapse as Collapse$1, Portal, CloseButton as CloseButton$1, Radio as Radio$2, RadioGroup as RadioGroup$1, Center, Tag as Tag$2, TagLabel, TagRightIcon, useEditableControls, useEditableState, Editable, InputLeftElement, Input as Input$1, EditablePreview, EditableInput, Modal as Modal$2, ModalOverlay, ModalContent, ModalCloseButton, ModalHeader, ModalBody, Slider, SliderTrack, SliderFilledTrack, SliderThumb, ModalFooter, VStack, Progress, Spinner as Spinner$2, Image as Image$1, keyframes, extendTheme, ChakraProvider, 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, Circle, TagLeftIcon, AlertTitle, AlertDescription, Tab, TabList, useClipboard, Tooltip as Tooltip$1, Grid, GridItem } from '@chakra-ui/react';
+import { Accordion as Accordion$1, AccordionButton as AccordionButton$1, AccordionPanel as AccordionPanel$1, AccordionItem as AccordionItem$1, useMultiStyleConfig, chakra, Alert as Alert$2, AspectRatio as AspectRatio$1, forwardRef, useStyleConfig, Icon as Icon$2, Box, Heading, Text, FormLabel as FormLabel$1, VisuallyHidden, HStack, Badge as Badge$1, Button as Button$2, Checkbox as Checkbox$2, useInterval, useMediaQuery, FormControl, Stack, FormErrorMessage, Flex, IconButton as IconButton$1, useDisclosure, useBoolean, useToken as useToken$1, Popover, PopoverTrigger, PopoverContent, PopoverHeader, PopoverBody, SimpleGrid, SlideFade as SlideFade$1, Table, Thead, Tbody, Tr, Select as Select$2, PopoverAnchor, InputGroup, InputRightElement, Link as Link$1, Fade as Fade$1, ScaleFade as ScaleFade$1, Slide as Slide$1, Collapse as Collapse$1, Portal, CloseButton as CloseButton$1, Radio as Radio$2, RadioGroup as RadioGroup$1, Center, Tag as Tag$2, TagLabel, TagRightIcon, useEditableControls, useEditableState, Editable, InputLeftElement, Input as Input$1, EditablePreview, EditableInput, Modal as Modal$2, ModalOverlay, ModalContent, ModalCloseButton, ModalHeader, ModalBody, Slider, SliderTrack, SliderFilledTrack, SliderThumb, ModalFooter, VStack, Progress, Spinner as Spinner$2, Image as Image$1, keyframes, extendTheme, ChakraProvider, 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, Circle, TagLeftIcon, AlertTitle, AlertDescription, Tab, TabList, useClipboard, Tooltip as Tooltip$1, 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, Menu, MenuButton, MenuCommand, MenuDivider, MenuGroup, MenuIcon, MenuItem, MenuItemOption, MenuList, MenuOptionGroup, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, NumberDecrementStepper, NumberIncrementStepper, OrderedList, PinInputField, Popover, 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, Table, TableCaption, TableContainer, TagCloseButton, TagLabel, TagLeftIcon, TagRightIcon, Tbody, Td, Text, Tfoot, Th, Thead, Tooltip, 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';
 import React, { isValidElement, cloneElement, Children, createContext, useContext, useState, useRef, useEffect, forwardRef as forwardRef$1, useImperativeHandle, memo, useMemo, useCallback } from 'react';
 import { UserSquareDuo, BusinessContactDuo, CheckDuo, ChevronUpDuo, ChevronDownDuo, ColorsDuo, CheckSolid, CalendarDuo, ChevronLeftSolid, ChevronRightSolid, XCloseSolid, ChevronUpSolid, ChevronDownSolid, ArrowCircleLeftDuo, ArrowCircleRightDuo, ChevronSelectorVerticalSolid, SearchDuo, DotsMatrixSolid, DragDuo, EditDuo, ZoomInDuo, Image03Solid, UploadCloudSolid, FileBlankDuo, EditBoxDuo, DownloadDuo, TrashFullDuo, Image03Duo, CheckCircleSolid, AlertTriangleSolid, AlertCircleSolid, BellSolid, StatusWorkingSolid, HourglassSolid, CDeleteSolid, CopyDuo } from '@northlight/icons';
@@ -1640,7 +1640,7 @@ const useSelectCallbacks = ({
   onChange,
   onAdd,
   onRemove,
-  isMulti,
+  isMulti = false,
   value
 }) => {
   const items = useRef(value);
@@ -1729,6 +1729,17 @@ const useOutsideRectClick = (ref, callback) => {
   }, []);
 };
 
+const useScreenSize = () => {
+  const screenSizes = useMediaQuery(["(min-width: 1280px)", "(min-width: 1024px)"]);
+  if (screenSizes[0]) {
+    return "lg";
+  }
+  if (screenSizes[1]) {
+    return "md";
+  }
+  return "sm";
+};
+
 function Field({
   name,
   label,
@@ -5366,7 +5377,7 @@ const SearchBar = forwardRef$1(
   (_a, ref) => {
     var _b = _a, {
       defaultOptions = [],
-      isMulti = false,
+      isMulti,
       customOption = null,
       customTag = null,
       sx = {},
@@ -10876,7 +10887,7 @@ var __objRest$g = (source, exclude) => {
 function Select(_a) {
   var _b = _a, {
     options,
-    isMulti = false,
+    isMulti,
     onChange = identity,
     onAdd = identity,
     onRemove = identity,
@@ -12173,5 +12184,5 @@ const StepStack = (_a) => {
   ));
 };
 
-export { Accordion, AccordionButton, AccordionItem, AccordionPanel, Alert$1 as Alert, AspectRatio, AsyncError, Avatar$1 as Avatar, AvatarGroup, Badge, Blinker$1 as Blinker, Blockquote$1 as Blockquote, Button$1 as Button, Capitalized$1 as Capitalized, Carousel$1 as Carousel, Checkbox$1 as Checkbox, CheckboxField, Clickable, ClipboardInput, Collapse, ColorPicker$1 as ColorPicker, ColorPickerField, CustomTheme, DatePicker$1 as DatePicker, DatePickerField, DateRangePicker, DateRangePickerField, DragAndDrop$1 as DragAndDrop, DragHandle, DragItem, Draggable, DropZone, Droppable, EditableText$1 as EditableText, Fade, FastGrid, FastList, Field, FilePicker$1 as FilePicker, FilePickerField, FlipButton$1 as FlipButton, FlipButtonGroup, FlipButtonGroupField, Form, FormLabel, FormattedNumberInput, H1$1 as H1, H2$1 as H2, H3$1 as H3, H4$1 as H4, H5$1 as H5, H6$1 as H6, Icon$1 as Icon, IconButton, Label$1 as Label, Lead$1 as Lead, MaskedTextInput, MediatoolThemeProvider, Modal$1 as Modal, ModalBase, MultiFileList, MultiFilePicker, MultiFilePickerField, MultiFileUploader, MultiSort, NotificationIconButton, NumberInput, NumberInputField, OrganizationLogo, OverflowGroup, P$1 as P, PaneDivider, PaneItem, PinInput, ProgressBar, Radio$1 as Radio, RadioGroup, RadioGroupField, ScaleFade, SearchBar, SearchBarField, Select, SelectField, Slide, SlideFade, Small$1 as Small, Sortable, SortableContainer, SortableItem, SortableList, Spinner$1 as Spinner, SplitPane, StatusBlock, StatusPin, Step, StepList, StepPanel, StepStack, Steps, Switch, SwitchField, TabPanel, Tabs, Tag$1 as Tag, TagGroup, TextField, Textarea, TextareaField, Tiny$1 as Tiny, Toast, Toolbox$1 as Toolbox, ToolboxContent, ToolboxFooter, ToolboxHeader, addAlpha, advancedParseFloat, createDebounceFunctionInstance, getChildrenWithProps, getContrastColor, getFieldError, getInitials, getShades, highlight, luminosity, ring, statusIconMap, theme, tottTheme, trimFormValues, useArrowFocus, useCurrentTheme, useDebounce, useLoadingMessage, useOutsideRectClick, useOverflowGroup, useScrollToBottom, useSelectCallbacks, useSetValueRefreshed, useToast };
+export { Accordion, AccordionButton, AccordionItem, AccordionPanel, Alert$1 as Alert, AspectRatio, AsyncError, Avatar$1 as Avatar, AvatarGroup, Badge, Blinker$1 as Blinker, Blockquote$1 as Blockquote, Button$1 as Button, Capitalized$1 as Capitalized, Carousel$1 as Carousel, Checkbox$1 as Checkbox, CheckboxField, Clickable, ClipboardInput, Collapse, ColorPicker$1 as ColorPicker, ColorPickerField, CustomTheme, DatePicker$1 as DatePicker, DatePickerField, DateRangePicker, DateRangePickerField, DragAndDrop$1 as DragAndDrop, DragHandle, DragItem, Draggable, DropZone, Droppable, EditableText$1 as EditableText, Fade, FastGrid, FastList, Field, FilePicker$1 as FilePicker, FilePickerField, FlipButton$1 as FlipButton, FlipButtonGroup, FlipButtonGroupField, Form, FormLabel, FormattedNumberInput, H1$1 as H1, H2$1 as H2, H3$1 as H3, H4$1 as H4, H5$1 as H5, H6$1 as H6, Icon$1 as Icon, IconButton, Label$1 as Label, Lead$1 as Lead, MaskedTextInput, MediatoolThemeProvider, Modal$1 as Modal, ModalBase, MultiFileList, MultiFilePicker, MultiFilePickerField, MultiFileUploader, MultiSort, NotificationIconButton, NumberInput, NumberInputField, OrganizationLogo, OverflowGroup, P$1 as P, PaneDivider, PaneItem, PinInput, ProgressBar, Radio$1 as Radio, RadioGroup, RadioGroupField, ScaleFade, SearchBar, SearchBarField, Select, SelectField, Slide, SlideFade, Small$1 as Small, Sortable, SortableContainer, SortableItem, SortableList, Spinner$1 as Spinner, SplitPane, StatusBlock, StatusPin, Step, StepList, StepPanel, StepStack, Steps, Switch, SwitchField, TabPanel, Tabs, Tag$1 as Tag, TagGroup, TextField, Textarea, TextareaField, Tiny$1 as Tiny, Toast, Toolbox$1 as Toolbox, ToolboxContent, ToolboxFooter, ToolboxHeader, addAlpha, advancedParseFloat, createDebounceFunctionInstance, getChildrenWithProps, getContrastColor, getFieldError, getInitials, getShades, highlight, luminosity, ring, statusIconMap, theme, tottTheme, trimFormValues, useArrowFocus, useCurrentTheme, useDebounce, useLoadingMessage, useOutsideRectClick, useOverflowGroup, useScreenSize, useScrollToBottom, useSelectCallbacks, useSetValueRefreshed, useToast };
 //# sourceMappingURL=northlight.mjs.map