@northlight/ui 1.0.0

package/dist/es/mediatool-ui-framework.d.mts

@@ -0,0 +1,1132 @@
+import { AvatarProps as AvatarProps$1, AlertProps as AlertProps$1, ButtonProps as ButtonProps$1, CheckboxProps as CheckboxProps$1, IconButtonProps as IconButtonProps$1, StackDirection, InputProps, FlexProps, BoxProps, StackProps, TagProps as TagProps$1, IconProps as IconProps$1, SystemStyleObject, HeadingProps as HeadingProps$1, TextProps, FormLabelProps as FormLabelProps$1, Heading, Text, ModalProps as ModalProps$1, NumberInputProps as NumberInputProps$1, PinInputProps as PinInputProps$1, RadioProps as RadioProps$1, RadioGroupProps as RadioGroupProps$1, SpinnerProps as SpinnerProps$1, SwitchProps as SwitchProps$1, TabsProps as TabsProps$1, TabPanelProps as TabPanelProps$1, TextareaProps as TextareaProps$1, FadeProps as FadeProps$1, ScaleFadeProps as ScaleFadeProps$1, SlideProps as SlideProps$1, SlideFadeProps as SlideFadeProps$1, CollapseProps as CollapseProps$1, TabListProps, TabProps, GridProps, GridItemProps, EditableProps as EditableProps$1 } from '@chakra-ui/react';
+export { AbsoluteCenter, Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, AlertDescription, AlertDialog, AlertDialogBody, AlertDialogCloseButton, AlertDialogContent, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertIcon, AlertTitle, AspectRatio, AvatarGroup, Badge, 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, Highlight, Image, Input, InputAddon, InputGroup, InputLeftAddon, InputLeftElement, InputRightAddon, InputRightElement, Kbd, Link, 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, RadioGroup, RangeSlider, RangeSliderFilledTrack, RangeSliderMark, RangeSliderThumb, RangeSliderTrack, 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, useMediaQuery, useMergeRefs, useNumberInput, useOutsideClick, usePrefersReducedMotion, useRadio, useRadioGroup, useTab, useTabs, useTheme, useToast, useToken } from '@chakra-ui/react';
+import React$1, { ChangeEvent, ComponentType, InputHTMLAttributes, HTMLAttributes, ReactNode, ChangeEventHandler, ReactElement } from 'react';
+import { RegisterOptions, SetValueConfig, ControllerRenderProps, FieldValues, UseFormReturn, UseFormProps, FieldError, Merge, FieldErrorsImpl } from 'react-hook-form';
+export { useController, useFieldArray, useForm, useFormContext, useFormState, useWatch } from 'react-hook-form';
+import { CheckboxGroupState } from '@react-stately/checkbox';
+import { RadioGroupState } from '@react-stately/radio';
+import { CSSObject } from '@emotion/react';
+import { DateValue, CalendarDate } from '@internationalized/date';
+import { AriaDateFieldProps, AriaDatePickerProps, AriaDateRangePickerProps } from '@react-aria/datepicker';
+import { DateRange } from '@react-types/calendar';
+import { Props, GroupBase, ActionMeta, ChakraStylesConfig, SelectInstance, MenuListProps, MultiValue, SingleValue } from 'chakra-react-select';
+export { AsyncCreatableSelect, AsyncSelect, Select as ChakraReactSelect, CreatableSelect } from 'chakra-react-select';
+import { InputFieldProps as InputFieldProps$1 } from '~/lib/types';
+import { DndContextProps, UseDroppableArguments, UseDraggableArguments, UniqueIdentifier, CollisionDetection, SensorDescriptor, SensorOptions } from '@dnd-kit/core';
+export * from '@dnd-kit/core';
+import { UseSortableArguments, SortingStrategy, SortableContextProps } from '@dnd-kit/sortable';
+export * from '@dnd-kit/sortable';
+import { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities';
+export * from '@dnd-kit/utilities';
+export * from '@dnd-kit/modifiers';
+import { VariableSizeListProps, VariableSizeList, VariableSizeGridProps, VariableSizeGrid } from 'react-window';
+import * as _chakra_ui_icon from '@chakra-ui/icon';
+import * as _chakra_ui_system from '@chakra-ui/system';
+import { Props as Props$1 } from 'react-input-mask';
+import { LinkProps, NavLinkProps } from 'react-router-dom';
+import { UseClickableProps } from '@chakra-ui/clickable';
+import * as _react_types_shared from '@react-types/shared';
+import * as _react_aria_focus from '@react-aria/focus';
+import { FieldErrorType as FieldErrorType$1 } from 'lib/components/form/types';
+import { DateSegment, DateFieldState } from '@react-stately/datepicker';
+import { AriaButtonProps } from '@react-aria/button';
+import { RangeCalendarState, CalendarState } from '@react-stately/calendar';
+
+interface OrganizationLogoProps extends AvatarProps$1 {
+    name: string;
+    image?: string;
+}
+
+declare const OrganizationLogo: ({ name, image, variant, ...rest }: OrganizationLogoProps) => JSX.Element;
+
+declare type AlertVariants = 'success' | 'warning' | 'error' | 'info';
+interface AlertProps extends AlertProps$1 {
+    variant?: AlertVariants;
+}
+
+declare const Alert: ({ variant, children, ...rest }: AlertProps) => JSX.Element;
+
+interface AvatarProps extends AvatarProps$1 {
+    name?: string;
+    image?: string;
+    notificationCount?: number;
+    size?: 'sm' | 'md' | 'lg';
+}
+interface AvatarBadgeProps {
+    notificationCount?: number;
+}
+
+declare const Avatar: ({ variant, notificationCount, name, image, size, ...rest }: AvatarProps) => JSX.Element;
+
+declare const AvatarBadge: ({ notificationCount, }: AvatarBadgeProps) => JSX.Element;
+
+declare type BlinkerProps = {
+    color?: string;
+    size?: '2xs' | 'xs' | 'sm' | 'md' | 'lg';
+    isBlinking?: boolean;
+};
+
+declare const Blinker: ({ color, size, isBlinking, ...rest }: BlinkerProps) => JSX.Element;
+
+declare type ButtonVariants = 'default' | 'danger' | 'success' | 'brand' | 'link' | 'ghost';
+interface ButtonProps extends ButtonProps$1 {
+    variant?: ButtonVariants;
+}
+
+declare const Button: (props: ButtonProps & React$1.RefAttributes<unknown>) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>> | null;
+
+declare type CheckboxVariants = 'default' | 'rounded';
+declare type CheckboxProps = CheckboxProps$1 & {
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
+    value?: boolean;
+    variant?: CheckboxVariants;
+};
+declare type CheckboxFieldProps = CheckboxProps$1 & {
+    name: string;
+    label: string;
+    validate?: RegisterOptions;
+    isRequired?: boolean;
+    variant?: CheckboxVariants;
+};
+
+declare const Checkbox: ({ value, onChange, name, size, variant, ...rest }: CheckboxProps) => JSX.Element;
+
+declare const CheckboxField: ({ name, label, variant, isRequired, validate, ...rest }: CheckboxFieldProps) => JSX.Element;
+
+declare type ColorPickerSize = 'sm' | 'md' | 'lg';
+interface ColorPickerProps extends Omit<IconButtonProps$1, 'onChange' | 'value' | 'aria-label' | 'variant'> {
+    onChange?: (value: string) => void;
+    colors?: string[];
+    expandedColors?: string[];
+    value?: string | null;
+    size?: ColorPickerSize;
+    name?: string;
+}
+declare type ColorButtonProps = {
+    color: string;
+    onClick: () => void;
+    size?: ColorPickerSize;
+    selected?: boolean;
+};
+declare type ColorsExpandButtonProps = {
+    onClick: () => void;
+    size: ColorPickerSize;
+    expanded: boolean;
+};
+declare type ColorPickerFieldProps = ColorPickerProps & {
+    name: string;
+    label: string;
+    validate?: RegisterOptions;
+    size?: ColorPickerSize;
+    isRequired?: boolean;
+    direction?: StackDirection;
+};
+
+declare const ColorPicker: ({ onChange, colors, expandedColors, value, name, size, ...rest }: ColorPickerProps) => JSX.Element;
+
+declare const ColorPickerField: ({ name, label, direction, isRequired, validate, ...rest }: ColorPickerFieldProps) => JSX.Element;
+
+declare type FlipButtonSize = 'xs' | 'sm' | 'md' | 'lg';
+declare type FlipButtonVariant = 'default' | 'brand';
+declare type StyleType = {
+    opacity: '0';
+    width: '0';
+    height: '0';
+};
+declare type InputPropsType = InputHTMLAttributes<HTMLInputElement>;
+declare type FocusPropsType = React$1.DOMAttributes<Element>;
+declare type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (k: infer I) => void ? I : never;
+declare type TupleTypes<T> = {
+    [P in keyof T]: T[P];
+} extends {
+    [key: number]: infer V;
+} ? V : never;
+declare type MergedFocusAndInputProps = UnionToIntersection<TupleTypes<[InputPropsType, FocusPropsType]>>;
+interface CustomFlipButtonPropsType extends MergedFocusAndInputProps {
+    ref: React$1.MutableRefObject<null>;
+    style: StyleType;
+    'aria-label': string;
+}
+declare type FocusRingType = {
+    outline?: string;
+    ring?: string;
+    ringColor?: string;
+    ringOffset?: string;
+};
+declare type CustomContainerPropsType = {
+    'aria-checked': boolean;
+    'aria-disabled': boolean;
+    sx: FocusRingType;
+    as: 'label';
+    cursor: 'pointer';
+};
+interface CustomFlipButtonProps {
+    state: CheckboxGroupState | RadioGroupState | null;
+    flipButtonProps: CustomFlipButtonPropsType;
+    containerProps: CustomContainerPropsType;
+    isFocused: boolean;
+    isSelected: boolean;
+    isDisabled: boolean;
+    isMulti: boolean;
+    focusRing: FocusRingType;
+    label?: string;
+    value: string;
+}
+interface FlipButtonProps {
+    size?: FlipButtonSize;
+    variant?: FlipButtonVariant;
+    isMulti?: boolean;
+    isDisabled?: boolean;
+    icon?: ComponentType<any>;
+    value: string;
+    label?: string;
+    children: ((props: CustomFlipButtonProps) => JSX.Element) | string;
+}
+interface FlipButtonGroupProps extends Omit<FlipButtonProps, 'value' | 'children' | 'label'> {
+    onChange?: (val: string | string[]) => void;
+    direction?: StackDirection;
+    children?: React$1.ReactNode[] | React$1.ReactNode;
+    name?: string;
+    value?: string | string[];
+    sx?: CSSObject;
+}
+interface FlipButtonGroupFieldProps extends FlipButtonGroupProps {
+    name: string;
+    label: string;
+    isRequired?: boolean;
+    validate?: RegisterOptions;
+    value?: string;
+}
+
+declare const FlipButton: (props: FlipButtonProps) => JSX.Element;
+
+declare const FlipButtonGroup: (props: FlipButtonGroupProps) => JSX.Element;
+
+declare const FlipButtonGroupField: ({ name, label, children, direction, isRequired, onChange: onChangeCallback, validate, ...rest }: FlipButtonGroupFieldProps) => JSX.Element;
+
+declare type Color = 'blue' | 'gray' | 'red' | 'pink' | 'green' | 'orange' | 'purple' | 'yellow' | 'mediatoolBlue';
+declare type ColorGrade = 50 | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900;
+declare type ColorShades = Record<ColorGrade, string>;
+
+interface InputFieldProps {
+    inputLeftElement?: React.ReactNode;
+    inputRightElement?: React.ReactNode;
+}
+
+declare type DateSegmentType = DateSegment;
+interface DateFieldProps extends AriaDateFieldProps<DateValue> {
+    dateFormat?: string;
+}
+interface DateSegmentProps {
+    segment: DateSegment;
+    state: DateFieldState;
+}
+interface StyledFieldProps extends HTMLAttributes<HTMLElement> {
+    isInvalid?: boolean;
+    isDisabled?: boolean;
+    children: ReactNode;
+}
+interface TriggerProps extends AriaButtonProps {
+    handleClick: () => void;
+}
+
+declare const Trigger: (props: TriggerProps) => JSX.Element;
+
+declare const DateField: (props: DateFieldProps) => JSX.Element;
+
+declare const StyledField: (props: StyledFieldProps & React$1.RefAttributes<unknown>) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>> | null;
+
+interface MonthSelectProps {
+    state: RangeCalendarState;
+    offset: number;
+}
+interface YearSelectCalendarProps {
+    state: CalendarState;
+}
+interface YearSelectRangeCalendarProps extends MonthSelectProps {
+}
+interface YearValue {
+    value: CalendarDate;
+    formatted: string;
+}
+interface UseYearsCalendarProps {
+    state: CalendarState;
+}
+interface UseYearsRangeCalendarProps extends MonthSelectProps {
+}
+interface YearSelectProps {
+    onChange: ChangeEventHandler<HTMLSelectElement>;
+    years: YearValue[];
+}
+
+declare const MonthSelect: ({ state, offset, }: MonthSelectProps) => JSX.Element;
+
+declare const YearSelectCalendar: ({ state }: YearSelectCalendarProps) => JSX.Element;
+
+declare const YearSelectRangeCalendar: ({ state, offset, }: YearSelectRangeCalendarProps) => JSX.Element;
+
+declare type MonthButtonProps = AriaButtonProps;
+interface CalendarGridProps {
+    state: CalendarState;
+    locale: string;
+}
+
+declare const CalendarGrid: React$1.MemoExoticComponent<({ state, locale, ...rest }: CalendarGridProps) => JSX.Element>;
+
+declare const MonthButton: ({ children, ...rest }: MonthButtonProps) => JSX.Element;
+
+declare type DatePickerSettings = {
+    firstDayOfWeek: 'sunday' | 'monday';
+    resetDate: () => void;
+    isInvalid?: boolean;
+    dateFormat?: string;
+    isClearable?: boolean;
+};
+declare type DatePickerMode = 'simple' | 'advanced';
+interface DatePickerProps extends AriaDatePickerProps<DateValue>, DatePickerSettings {
+}
+interface DateRangePickerProps extends AriaDateRangePickerProps<DateValue>, DatePickerSettings {
+    fiscalStartMonth?: number;
+    mode?: DatePickerMode;
+}
+interface DatePickerFieldProps extends Omit<InputProps, 'onChange'>, InputFieldProps {
+    name: string;
+    label: string;
+    minValue?: string;
+    maxValue?: string;
+    validate?: RegisterOptions;
+    firstDayOfWeek?: 'sunday' | 'monday';
+    direction?: StackDirection;
+    dateFormat?: string;
+    onChange?: (date: DateValue) => void;
+    isClearable?: boolean;
+    fiscalStartMonth?: number;
+}
+interface DateRangePickerFieldProps extends Omit<DatePickerFieldProps, 'onChange'> {
+    onChange?: (date: DateRange) => void;
+    mode?: DatePickerMode;
+}
+interface DateRangeFormatted {
+    startDate: string;
+    endDate: string;
+}
+declare type FormBody = Record<string, DateRangeFormatted>;
+
+declare const DatePicker: (props: DatePickerProps) => JSX.Element;
+
+declare const DateRangePicker: (props: DateRangePickerProps) => JSX.Element;
+
+declare const DatePickerField: ({ name, minValue, maxValue, isRequired, direction, label, validate, firstDayOfWeek, onChange: onChangeCallback, inputLeftElement, inputRightElement, ...rest }: DatePickerFieldProps) => JSX.Element;
+
+declare const DateRangePickerField: ({ name, minValue, maxValue, isRequired, direction, label, validate, firstDayOfWeek, onChange: onChangeCallback, ...rest }: DateRangePickerFieldProps) => JSX.Element;
+
+interface ToolboxProps extends Omit<FlexProps, 'direction'> {
+    isOpen: boolean;
+    direction?: 'right' | 'left';
+    shouldPush?: boolean;
+    children: JSX.Element[] | JSX.Element;
+    size?: 'sm' | 'md' | 'lg';
+    onClose: () => void;
+    autoFocus?: boolean;
+}
+interface ToolboxHeaderProps extends FlexProps {
+    onClose?: () => void;
+    children: JSX.Element | string;
+}
+interface ToolboxContentProps extends FlexProps {
+    children: JSX.Element | string;
+}
+interface ToolboxFooterProps extends FlexProps {
+    children: JSX.Element | JSX.Element[] | string;
+}
+
+declare const Toolbox: ({ isOpen, children, direction, shouldPush, size, onClose, autoFocus, ...rest }: ToolboxProps) => JSX.Element;
+
+declare const ToolboxHeader: ({ children, onClose, ...rest }: ToolboxHeaderProps) => JSX.Element;
+
+declare const ToolboxContent: ({ children, ...rest }: ToolboxContentProps) => JSX.Element;
+
+declare const ToolboxFooter: ({ children, ...rest }: ToolboxFooterProps) => JSX.Element;
+
+interface CarouselProps extends Omit<BoxProps, 'onChange'> {
+    children: JSX.Element[];
+    showArrows?: boolean;
+    showRadio?: boolean;
+    itemWidth?: number;
+    itemHeight?: number;
+    spacing?: number;
+    value?: number;
+    onChange?: (value: number) => void;
+    carouselStyles?: StackProps;
+}
+
+declare const Carousel: ({ children, showArrows, showRadio, value: controlledIndex, onChange, itemWidth, itemHeight, spacing, carouselStyles, ...rest }: CarouselProps) => JSX.Element;
+
+declare type Size$1 = 'sm' | 'md' | 'lg';
+interface SearchBarOptionType {
+    label: string;
+    value: any;
+}
+interface DebounceOptionsType {
+    leading?: boolean;
+    maxWait?: number;
+    trailing?: boolean;
+}
+declare type CustomElementType<T extends SearchBarOptionType> = ((props: T) => JSX.Element) | null;
+interface SearchBarProps<T extends SearchBarOptionType> extends Omit<Props<T, boolean, GroupBase<T>>, 'onChange' | 'value'> {
+    value?: T | T[];
+    onChange?: (val: any, event: ActionMeta<T>) => void;
+    onAdd?: (val: unknown) => void;
+    onRemove?: (val: unknown) => void;
+    size?: Size$1;
+    'data-testid'?: string;
+    debouncedWaitTime?: number;
+    debouncedOptions?: DebounceOptionsType;
+    clearInputOnSelect?: boolean;
+    closeMenuonSelect?: boolean;
+    defaultOptions?: T[];
+    sx?: ChakraStylesConfig<any>;
+    isMulti?: boolean;
+    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$1 {
+    onChange?: (val: T | T[], event: ActionMeta<T>) => void;
+    direction?: StackDirection;
+    name: string;
+    label: string;
+    validate?: RegisterOptions;
+    isRequired?: boolean;
+}
+
+declare const SearchBar: <T extends SearchBarOptionType>(props: SearchBarProps<T> & React$1.RefAttributes<SelectInstance<T, boolean, GroupBase<T>>>) => React$1.ReactElement<any, string | React$1.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 DragAndDrop: (props: DndContextProps) => JSX.Element;
+
+declare type ListenersType = SyntheticListenerMap;
+declare type ChildrenType$1<PropType = any, PropTypeTwo = any> = ((props: PropType, secondProp: PropTypeTwo, thirdProp?: any) => JSX.Element | JSX.Element[] | undefined) | (JSX.Element | JSX.Element[]);
+declare type MultiItemType<itemKeys extends string | number | symbol> = Record<itemKeys, string[]>;
+interface DroppableProps extends UseDroppableArguments {
+    children?: ((props: any) => JSX.Element | JSX.Element[]) | (JSX.Element | JSX.Element[]);
+}
+interface DraggableProps extends UseDraggableArguments {
+    itemLabel?: string;
+    children?: ChildrenType$1<ListenersType>;
+    disableDrag?: boolean;
+}
+interface SortableItemProps extends UseSortableArguments {
+    children?: ChildrenType$1<ListenersType>;
+    itemLabel?: UniqueIdentifier;
+    dblClickThreshold?: number;
+    disableDrag?: boolean;
+}
+declare type MovedItemType<T> = {
+    item: T;
+    oldIndex: number;
+    newIndex: number;
+};
+interface SortableListProps<T> {
+    children?: ChildrenType$1<T, ListenersType>;
+    items: T[];
+    collisionDetection?: CollisionDetection;
+    strategy?: SortingStrategy;
+    onChange?: (items: T[]) => void;
+    createKey?: (item: T) => UniqueIdentifier;
+    displayOverlay?: boolean;
+    sensors?: SensorDescriptor<SensorOptions>[];
+    dblClickThreshold?: number;
+    disableDrag?: boolean;
+    onMovedItem?: ({ item, oldIndex, newIndex }: MovedItemType<T>) => void;
+}
+interface MultiSortProps<itemKeys extends string | number | symbol> {
+    children?: ChildrenType$1;
+    items: MultiItemType<itemKeys>;
+    collisionDetection?: CollisionDetection;
+    onChange?: (items: MultiItemType<itemKeys>) => void;
+    sensors?: SensorDescriptor<SensorOptions>[];
+}
+interface DragItemProps extends Omit<TagProps$1, 'variant'> {
+    isDragging?: boolean;
+    itemLabel?: UniqueIdentifier;
+    bgColor?: string;
+}
+interface DragHandleProps extends IconProps$1 {
+    isDragging?: boolean;
+    icon?: ComponentType<any>;
+}
+interface DropZoneProps {
+    sx?: SystemStyleObject;
+    name: UniqueIdentifier;
+    children?: JSX.Element;
+}
+interface SortableContainerProps {
+    items: UniqueIdentifier[];
+    strategy?: SortingStrategy;
+    children?: (id: UniqueIdentifier) => JSX.Element;
+}
+
+declare const Draggable: ({ itemLabel, children, disableDrag, ...rest }: DraggableProps) => JSX.Element;
+
+declare const Droppable: ({ children, ...rest }: DroppableProps) => JSX.Element;
+
+declare const Sortable: (props: SortableContextProps) => JSX.Element;
+
+declare const SortableItem: ({ itemLabel, dblClickThreshold, children, disableDrag, ...rest }: SortableItemProps) => JSX.Element;
+
+declare const DragItem: (props: DragItemProps & React$1.RefAttributes<unknown>) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>> | null;
+
+declare const DragHandle: ({ icon, isDragging, ...rest }: DragHandleProps) => JSX.Element;
+
+declare const DropZone: ({ sx, name, children, ...rest }: DropZoneProps) => JSX.Element;
+
+declare function MultiSort<itemKeys extends string | number | symbol>({ items: sortableItems, onChange, children, collisionDetection, sensors, }: MultiSortProps<itemKeys>): JSX.Element;
+
+declare function SortableList<T>({ children, items: sortableItems, collisionDetection, createKey, strategy, onChange, onMovedItem, displayOverlay, sensors, dblClickThreshold, disableDrag, }: SortableListProps<T>): JSX.Element;
+
+declare const SortableContainer: ({ children, items, strategy }: SortableContainerProps) => JSX.Element;
+
+interface HeadingProps extends HeadingProps$1 {
+}
+
+declare const H1: ({ children, sx, ...rest }: HeadingProps) => JSX.Element;
+
+declare const H2: ({ children, sx, ...rest }: HeadingProps) => JSX.Element;
+
+declare const H3: ({ children, sx, ...rest }: HeadingProps) => JSX.Element;
+
+declare const H4: ({ children, sx, ...rest }: HeadingProps) => JSX.Element;
+
+declare const H5: ({ children, sx, ...rest }: HeadingProps) => JSX.Element;
+
+declare const H6: ({ children, sx, ...rest }: HeadingProps) => JSX.Element;
+
+interface PProps extends TextProps {
+    variant?: '14' | '16';
+}
+
+declare const P: ({ children, variant, sx, ...rest }: PProps) => JSX.Element;
+
+declare const Blockquote: ({ children, sx, ...rest }: TextProps) => JSX.Element;
+
+declare const Capitalized: ({ children, sx, ...rest }: TextProps) => JSX.Element;
+
+declare const Lead: ({ children, sx, ...rest }: TextProps) => JSX.Element;
+
+declare const Small: ({ children, sx, ...rest }: TextProps) => JSX.Element;
+
+declare const Tiny: ({ children, sx, ...rest }: TextProps) => JSX.Element;
+
+declare type LabelSizes = '2xs' | 'xs' | 'sm' | 'md' | 'lg';
+interface LabelProps extends FormLabelProps$1 {
+    size?: LabelSizes;
+}
+
+declare const Label: ({ children, size, sx, ...rest }: LabelProps) => JSX.Element;
+
+declare type HeadingType = typeof Heading;
+declare type BodyType = typeof P;
+declare type StylizedType = typeof Text;
+declare type LabelType = typeof Label;
+
+interface FormLabelProps extends LabelProps {
+    size?: LabelSizes;
+}
+
+declare const FormLabel: ({ children: label, ...rest }: FormLabelProps) => JSX.Element;
+
+interface FastListProps extends Omit<VariableSizeListProps, 'itemSize' | 'children' | 'height' | 'width' | 'direction'> {
+    itemSize: number | ((index: number) => number);
+    itemCount: number;
+    direction?: StackDirection;
+    children: JSX.Element | ((index: number) => JSX.Element | string) | string;
+    width?: number;
+    height?: number;
+    initialScrollOffset?: number;
+    overscanCount?: number;
+}
+
+declare const FastList: (props: FastListProps & React$1.RefAttributes<VariableSizeList<any>>) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>> | null;
+
+interface FastGridProps extends Omit<VariableSizeGridProps, 'children' | 'height' | 'width' | 'columnWidth' | 'rowHeight' | 'columnCount' | 'rowCount'> {
+    columnSize: number | ((index: number) => number);
+    rowSize: number | ((index: number) => number);
+    columns: number;
+    rows: number;
+    children: JSX.Element | ((rowIndex: number, columnIndex: number) => JSX.Element | string | null) | string;
+    width?: number;
+    height?: number;
+    overscanRowCount?: number;
+    overscanColumnCount?: number;
+}
+
+declare const FastGrid: (props: FastGridProps & React$1.RefAttributes<VariableSizeGrid<any>>) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>> | null;
+
+declare const Icon: _chakra_ui_system.ComponentWithAs<_chakra_ui_system.As<any>, _chakra_ui_icon.IconProps & {
+    as?: React$1.ComponentType<any> | undefined;
+    size?: "sm" | "md" | "lg" | "xs" | undefined;
+}>;
+
+declare type IconProps = IconProps$1 & {
+    as?: ComponentType<any>;
+    size?: 'xs' | 'sm' | 'md' | 'lg';
+};
+
+interface IconButtonProps extends IconButtonProps$1 {
+    variant?: ButtonVariants;
+}
+
+declare const IconButton: (props: IconButtonProps & React$1.RefAttributes<unknown>) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>> | null;
+
+declare type ModalSizes = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | 'full' | 'huge';
+interface ModalProps extends ModalProps$1 {
+    size?: ModalSizes;
+}
+
+interface CompressionType {
+    width: number;
+    height: number;
+    quality: number;
+}
+interface EditFileOptionsType {
+    canEdit: boolean;
+    canEditImage: boolean;
+    canEditName: boolean;
+}
+interface FileFormat {
+    src: string | null;
+    name: string;
+    type: string;
+    _id: string;
+    isLazy?: boolean;
+    size: number | null;
+    isUploading?: boolean;
+    uploaded?: number;
+    lastModified?: number;
+}
+declare type FileWithType = Pick<FileFormat, 'type'>;
+declare type FileWithSrcNameType = Pick<FileFormat, 'src' | 'name' | 'type'>;
+declare type FileWithSizeAndType = Pick<FileFormat, 'type' | 'size'>;
+declare type ModalBooleans = {
+    canCropImage?: boolean;
+    canEditFile?: boolean;
+    confirmDelete?: boolean;
+    canEditFileName?: boolean;
+};
+interface FilePickerProps {
+    acceptFormat?: string;
+    onChange?: (image: File | null) => void;
+    compression?: CompressionType;
+    isUploading?: boolean;
+    uploaded?: number;
+    maxFileSize?: number;
+    value?: string | null;
+    loadWithSpinner?: boolean;
+    confirmDelete?: boolean;
+    editFileOptions?: EditFileOptionsType;
+    showProgress?: boolean;
+}
+interface FilePickerFieldProps extends Omit<FilePickerProps, 'onChange'> {
+    name: string;
+    label: string;
+    validate?: RegisterOptions;
+    isRequired?: boolean;
+    direction?: StackDirection;
+    onChange?: (File: string | null) => void;
+}
+interface MultiFilePickerFieldProps extends Omit<FilePickerFieldProps, 'onChange'> {
+    onChange?: (File: string[]) => void;
+}
+interface MultiFilePickerProps<T extends FileFormat> extends Omit<FilePickerProps, 'onChange'> {
+    onChange?: (files: File[]) => void;
+    compression?: CompressionType;
+    files?: T[] | null;
+    uploadingFiles?: T[];
+    deleteFile?: ((file: T | FileFormat) => void) | null;
+    enablePreLoad?: boolean;
+    enableSmartLoad?: boolean;
+    confirmDelete?: boolean;
+}
+interface MultiFileUploaderProps<T extends FileFormat> {
+    acceptFormat?: string;
+    compression?: CompressionType;
+    maxFileSize?: number;
+    addFilesToQueue?: (files: T[]) => void;
+    updatePreviewFiles?: (files: any[]) => void;
+    onChange?: (files: File[]) => void;
+}
+interface MultiFileListProps<T extends FileFormat> {
+    files?: T[];
+    uploadingFiles?: T[];
+    deleteFile?: (file: T | FileFormat) => void;
+    onChange?: (files: File[]) => void;
+    addFile?: (file: File, id: string) => void;
+    enableSmartLoad?: boolean;
+    editFileOptions?: EditFileOptionsType;
+    confirmDelete?: boolean;
+}
+interface FileItemProps<T> {
+    file: T | FileFormat;
+    deleteFile: (file: T | FileFormat) => void;
+    onChangeCallback: (files: File[]) => void;
+    addFile?: (file: File, id: string) => void;
+    isLazy?: boolean;
+    editFileOptions?: EditFileOptionsType;
+    confirmDelete?: boolean;
+}
+interface ConfirmDeleteModalProps extends Omit<ModalProps, 'children'> {
+    confirmDelete: () => void;
+    fileName: string;
+}
+interface FileEditorModalProps extends Omit<ModalProps, 'children'> {
+    fileName: string;
+    canEditFileName?: boolean;
+    canCropImage?: boolean;
+    isImage: boolean;
+    handleCrop: () => void;
+    image: File | string | null;
+    setFileName: (value: string) => void;
+}
+interface FileIconButtonProps extends Omit<IconButtonProps$1, 'icon' | 'ButtonVariants'> {
+    icon: ComponentType<any>;
+    variant?: ButtonVariants;
+}
+
+declare const FilePicker: ({ acceptFormat, onChange, compression, uploaded: uploadedInitial, maxFileSize, showProgress, value, loadWithSpinner, confirmDelete, editFileOptions, }: FilePickerProps) => JSX.Element;
+
+declare const FilePickerField: ({ name, label, direction, isRequired, validate, onChange: onChangeCallback, ...rest }: FilePickerFieldProps) => JSX.Element;
+
+declare function MultiFileUploader<T extends FileFormat>({ acceptFormat, compression, onChange, addFilesToQueue, updatePreviewFiles, maxFileSize, }: MultiFileUploaderProps<T>): JSX.Element;
+
+declare function MultiFilePicker<T extends FileFormat>({ acceptFormat, compression, onChange, files, uploadingFiles, deleteFile, confirmDelete, maxFileSize, enablePreLoad, enableSmartLoad, editFileOptions, }: MultiFilePickerProps<T>): JSX.Element;
+
+declare function MultiFileList<T extends FileFormat>({ files, uploadingFiles, onChange, deleteFile, addFile, confirmDelete, editFileOptions, enableSmartLoad, }: MultiFileListProps<T>): JSX.Element;
+
+declare const MultiFilePickerField: ({ name, label, direction, isRequired, validate, onChange: onChangeCallback, ...rest }: MultiFilePickerFieldProps) => JSX.Element;
+
+interface MediatoolThemeProviderProps {
+    children: ReactNode;
+    theme?: Record<string, any>;
+}
+
+declare const MediatoolThemeProvider: ({ children, theme, }: MediatoolThemeProviderProps) => JSX.Element;
+
+declare type NumberInputSizeProps = 'sm' | 'md' | 'lg';
+declare type NumberInputProps = NumberInputProps$1 & {
+    size?: NumberInputSizeProps;
+    onChange?: (...event: any[]) => void;
+    onlyAcceptPercentage?: boolean;
+    onInputChange?: (input: string) => void;
+};
+declare type NumberInputFieldProps = Omit<NumberInputProps, 'onChange'> & InputFieldProps & {
+    name: string;
+    label: string;
+    validate?: RegisterOptions;
+    size?: NumberInputSizeProps;
+    isRequired?: boolean;
+    unit?: string;
+    direction?: StackDirection;
+    onChange?: (e: number | string) => void;
+    inputLeftElement?: React.ReactNode;
+    inputRightElement?: React.ReactNode;
+};
+interface NumberInputStepperProps {
+    includePercentage?: boolean;
+}
+
+declare const NumberInput: ({ variant, size, onChange, onInputChange, name, onlyAcceptPercentage, ...rest }: NumberInputProps) => JSX.Element;
+
+declare const NumberInputStepper: ({ includePercentage, }: NumberInputStepperProps) => JSX.Element;
+
+declare const NumberInputField: ({ name, label, direction, isRequired, validate, onChange: onChangeCallback, onlyAcceptPercentage, inputLeftElement, inputRightElement, ...rest }: NumberInputFieldProps) => JSX.Element;
+
+declare const advancedParseFloat: (value: number | string) => string | number;
+
+interface NotificationIconButtonProps extends IconButtonProps$1 {
+    variant?: ButtonVariants;
+    blinkerColor?: string;
+    hasNotification?: boolean;
+}
+
+declare const NotificationIconButton: (props: NotificationIconButtonProps & React$1.RefAttributes<unknown>) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>> | null;
+
+interface PageLayoutProps {
+    title: ReactNode;
+    subtitle?: ReactNode;
+    children: ReactNode;
+}
+declare const PageLayout: ({ children, title, subtitle, }: PageLayoutProps) => JSX.Element;
+
+declare type PinVariant = 'green' | 'yellow' | 'gray' | 'red';
+declare type PinSize = 'sm' | 'md' | 'lg';
+declare type PinSizeTuple = [number, number];
+interface PinInputProps extends PinInputProps$1 {
+    size?: PinSize;
+    hidden?: boolean;
+}
+
+declare const PinInput: ({ variant, hidden, children, ...rest }: PinInputProps) => JSX.Element;
+
+interface ProgressBarProps extends StackProps {
+    loaded: number;
+    hideDisplay?: boolean;
+    onLoadEnd?: () => void;
+}
+
+declare const ProgressBar: ({ loaded, onLoadEnd, hideDisplay, ...rest }: ProgressBarProps) => JSX.Element;
+
+declare type RadioProps = RadioProps$1 & {
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
+    value?: string;
+};
+declare type RadioFieldProps = RadioProps$1 & {
+    value: string;
+};
+declare type RadioGroupProps = RadioGroupProps$1 & {
+    direction?: StackDirection;
+};
+declare type RadioFieldGroupProps = RadioGroupProps$1 & {
+    direction?: StackDirection;
+    name: string;
+    label: string;
+    validate?: RegisterOptions;
+    isRequired?: boolean;
+    value?: string;
+};
+
+declare const Radio: ({ size, onChange, name, value, ...rest }: RadioProps) => JSX.Element;
+
+declare const RadioGroupField: ({ name, label, children, direction, isRequired, validate, onChange: onChangeCallback, ...rest }: RadioFieldGroupProps) => JSX.Element;
+
+declare type Size = 'sm' | 'md' | 'lg';
+interface Option {
+    label: string;
+    value: string;
+}
+interface SelectProps<T> extends Omit<Props<T, boolean, GroupBase<T>>, 'onChange' | 'value'> {
+    value?: Option | Option[];
+    onChange?: (val: any, event: ActionMeta<T>) => void;
+    onAdd?: (val: unknown) => void;
+    onRemove?: (val: unknown) => void;
+    name?: string;
+    size?: Size;
+    'data-testid'?: string;
+    loadingList?: ComponentType<MenuListProps<T, boolean, GroupBase<T>>> | undefined;
+    icon?: ComponentType<any>;
+}
+declare type SelectFieldProps<T> = Omit<SelectProps<T>, 'onChange'> & InputFieldProps & {
+    onChange?: (val: T | T[], event: ActionMeta<T>) => void;
+    direction?: StackDirection;
+    name: string;
+    label: string;
+    validate?: RegisterOptions;
+    isRequired?: boolean;
+    isMulti?: boolean;
+};
+
+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 SelectField<T extends Option>({ name, label, options, direction, isMulti, isRequired, validate, isClearable, onChange: onChangeCallback, inputLeftElement, inputRightElement, ...rest }: SelectFieldProps<T>): JSX.Element;
+
+interface SpinnerProps extends SpinnerProps$1 {
+}
+
+declare const Spinner: ({ ...rest }: SpinnerProps) => JSX.Element;
+
+declare type SwitchProps = SwitchProps$1 & {
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
+    value?: boolean;
+};
+declare type SwitchFieldProps = SwitchProps$1 & {
+    name: string;
+    label: string;
+    validate?: RegisterOptions;
+    isRequired?: boolean;
+};
+
+declare const Switch: ({ value, onChange, name, size, ...rest }: SwitchProps) => JSX.Element;
+
+declare const SwitchField: ({ name, label, isRequired, validate, onChange: onChangeCallback, ...rest }: SwitchFieldProps) => JSX.Element;
+
+interface TabsProps extends TabsProps$1 {
+}
+interface TabPanelProps extends TabPanelProps$1 {
+}
+
+declare const TabPanel: (props: TabPanelProps) => JSX.Element;
+
+declare const Tabs: ({ children, variant, isManual, ...rest }: TabsProps) => JSX.Element;
+
+interface TagProps extends TagProps$1 {
+    bgColor?: string;
+    variant?: 'solid' | 'subtle';
+}
+
+declare const Tag: (props: TagProps & React$1.RefAttributes<unknown>) => React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>> | null;
+
+declare type TextSizeProps = 'sm' | 'md';
+declare type TextareaProps = TextareaProps$1 & {
+    onChange?: (...event: any[]) => void | ((e: ChangeEvent<HTMLInputElement>) => void);
+    value?: boolean;
+    size?: TextSizeProps;
+};
+declare type TextareaFieldProps = TextareaProps$1 & {
+    name: string;
+    label: string;
+    validate?: RegisterOptions;
+    isRequired?: boolean;
+    size?: TextSizeProps;
+    direction?: StackDirection;
+};
+
+declare const Textarea: ({ size, onChange, name, value, ...rest }: TextareaProps) => JSX.Element;
+
+declare const TextareaField: ({ name, label, isRequired, validate, direction, onChange: onChangeCallback, ...rest }: TextareaFieldProps) => JSX.Element;
+
+interface TextInputFormatter {
+    format: (value: string) => string;
+    unFormat: (value: string) => string;
+}
+declare type TextFieldProps = Omit<InputProps, 'onChange'> & InputFieldProps & {
+    name: string;
+    label: string;
+    mask?: string;
+    formatter?: TextInputFormatter;
+    validate?: RegisterOptions;
+    direction?: StackDirection;
+    onChange?: (e: React.ChangeEvent<HTMLInputElement> | string) => void;
+};
+declare type MaskedTextInputProps = InputProps & Props$1 & {
+    maskPlaceholder?: string;
+};
+declare type FormattedNumberInputProps = Omit<InputProps, 'onChange'> & {
+    formatter: TextInputFormatter;
+    onChange?: (value: string) => void;
+    value?: string;
+};
+
+declare const FormattedNumberInput: ({ onChange, formatter, ...rest }: FormattedNumberInputProps) => JSX.Element;
+
+declare const MaskedTextInput: ({ mask, maskPlaceholder, alwaysShowMask, name, value, placeholder, onChange, onBlur, ...rest }: MaskedTextInputProps) => JSX.Element;
+
+declare const TextField: ({ name, label, as: As, isRequired, validate, direction, onChange: onChangeCallback, inputLeftElement, inputRightElement, ...rest }: TextFieldProps) => JSX.Element;
+
+interface ToastProps extends AlertProps {
+    title?: string;
+    variant?: AlertVariants;
+    description?: string;
+    onClose?: () => void;
+}
+
+declare const Toast: ({ variant, title, description, onClose, ...rest }: ToastProps) => JSX.Element;
+
+declare type DurationType = number | null;
+declare type OffsetType = number | string;
+declare type ChildrenType = React.ReactNode | React.ReactNode[];
+declare type TransitionDirection = 'right' | 'bottom' | 'left' | 'top' | null;
+interface FadeProps extends FadeProps$1 {
+    duration?: DurationType;
+    enterDuration?: DurationType;
+    exitDuration?: DurationType;
+    disableFocus?: boolean;
+    hideDisplay?: boolean;
+    enterDelay?: number;
+    exitDelay?: number;
+    onTransitionComplete?: (isHidden: boolean) => void;
+}
+interface ScaleFadeProps extends FadeProps, Omit<ScaleFadeProps$1, 'delay'> {
+}
+interface SlideProps extends FadeProps, Omit<SlideProps$1, 'delay'> {
+}
+interface SlideFadeProps extends FadeProps, Omit<SlideFadeProps$1, 'delay'> {
+    direction?: TransitionDirection;
+    offset?: number;
+}
+interface CollapseProps extends FadeProps, Omit<CollapseProps$1, 'delay'> {
+}
+
+declare const Fade: ({ children, enterDuration, exitDuration, duration, in: show, disableFocus, hideDisplay, enterDelay, exitDelay, onTransitionComplete, ...rest }: FadeProps) => JSX.Element;
+
+declare const ScaleFade: ({ children, enterDuration, exitDuration, duration, in: show, disableFocus, hideDisplay, enterDelay, exitDelay, onTransitionComplete, ...rest }: ScaleFadeProps) => JSX.Element;
+
+declare const Slide: ({ children, enterDuration, exitDuration, duration, in: show, disableFocus, hideDisplay, enterDelay, exitDelay, direction, onTransitionComplete, ...rest }: SlideProps) => JSX.Element;
+
+declare const SlideFade: ({ children, enterDuration, exitDuration, duration, in: show, disableFocus, hideDisplay, direction, offset: delta, offsetX: deltaX, offsetY: deltaY, enterDelay, exitDelay, onTransitionComplete, ...rest }: SlideFadeProps) => JSX.Element;
+
+declare const Collapse: ({ children, enterDuration, exitDuration, duration, in: show, disableFocus, hideDisplay, enterDelay, exitDelay, onTransitionComplete, ...rest }: CollapseProps) => JSX.Element;
+
+interface StatusPinProps {
+    size?: PinSize;
+    variant: PinVariant;
+}
+
+declare const StatusPin: ({ size, variant }: StatusPinProps) => JSX.Element;
+
+declare type NavbarItemProps = LinkProps & NavLinkProps & {
+    to: string;
+    icon: ComponentType;
+    renderTitle?: boolean;
+};
+
+declare const NavbarItem: ({ to, icon, title, renderTitle, }: NavbarItemProps) => JSX.Element;
+
+declare type BlockVariant = 'working' | 'pending' | 'approved' | 'rejected';
+declare type StatusBlockProps = {
+    variant: BlockVariant;
+};
+declare type BlockVariantColorTuple = [`${Color}.${ColorGrade}`, `${Color}.${ColorGrade}`];
+declare const statusIconMap: Record<BlockVariant, any>;
+
+declare const StatusBlock: ({ variant }: StatusBlockProps) => JSX.Element;
+
+interface AsyncErrorProps extends AlertProps {
+    message?: string;
+}
+
+declare const AsyncError: ({ message, ...rest }: AsyncErrorProps) => JSX.Element;
+
+declare const Modal: ({ isCentered, children, ...rest }: ModalProps) => JSX.Element;
+
+declare type Maybe<T> = T | undefined;
+declare type CustomSubmitHandler<TFieldValues extends FieldValues> = (data: TFieldValues, event: UseFormReturn<TFieldValues>) => any | Promise<any>;
+declare type SetValueOptionsType = Maybe<SetValueConfig>;
+declare type FieldProps = {
+    name: string;
+    label: string;
+    direction?: StackDirection;
+    isRequired?: boolean;
+    isSelect?: boolean;
+    validate?: RegisterOptions;
+    children: (field: ControllerRenderProps<FieldValues, string>, methods: UseFormReturn<FieldValues>) => JSX.Element | JSX.Element;
+};
+declare type FormProps<FormValues extends FieldValues> = {
+    initialValues: FormValues;
+    enableReinitialize?: boolean;
+    onSubmit: CustomSubmitHandler<FormValues>;
+    methods?: UseFormReturn<FormValues>;
+    formSettings?: UseFormProps<FormValues>;
+    validate?: any;
+    shouldTrim?: boolean;
+    children: ((methods: UseFormReturn<FormValues>) => ReactNode) | ReactNode;
+};
+declare type FieldErrorType<T extends FieldValues> = FieldError | Merge<FieldError, FieldErrorsImpl<T>> | undefined;
+
+declare function Form<FormValues extends FieldValues>({ initialValues, onSubmit, children, validate, formSettings, methods, enableReinitialize, shouldTrim, ...rest }: FormProps<FormValues>): JSX.Element;
+
+declare function Field({ name, label, children, direction, isRequired, isSelect, validate, }: FieldProps): JSX.Element;
+
+declare const useSetValueRefreshed: () => (name: any, value: any, options: SetValueOptionsType) => void;
+
+declare const trimFormValues: <T extends FieldValues>(obj: FieldValues) => T;
+
+interface StepListProps extends TabListProps {
+}
+interface StepPanelProps extends TabPanelProps$1 {
+}
+interface StepsProps extends TabsProps$1 {
+}
+interface StepProps extends TabProps {
+    label: string;
+    description?: string;
+}
+
+declare const StepPanel: (props: StepPanelProps) => JSX.Element;
+
+declare const Steps: (props: StepsProps) => JSX.Element;
+
+declare const Step: ({ label, description, ...rest }: StepProps) => JSX.Element;
+
+declare const StepList: ({ children, ...rest }: StepListProps) => JSX.Element;
+
+interface ClipboardInputProps extends InputProps {
+    value: string;
+    size?: 'sm' | 'md' | 'lg';
+}
+
+declare const ClipboardInput: ({ size, value, "aria-label": ariaLabel, ...rest }: ClipboardInputProps) => JSX.Element;
+
+interface ClickableProps extends UseClickableProps {
+    href?: string;
+}
+
+declare const Clickable: (props: ClickableProps) => JSX.Element;
+
+interface SplitPaneProps extends GridProps {
+    isOpen: boolean;
+    children: ReactElement[];
+    initialSplit?: number;
+    minLeftWidth?: number;
+    minRightWidth?: number;
+}
+
+declare const SplitPane: ({ children, initialSplit, isOpen, minLeftWidth, minRightWidth, }: SplitPaneProps) => JSX.Element;
+
+declare const PaneItem: ({ children, ...rest }: GridItemProps) => JSX.Element;
+
+declare const PaneDivider: _chakra_ui_system.ComponentWithAs<_chakra_ui_system.As<any>, BoxProps>;
+
+declare type EditableSizes = 'sm' | 'md' | 'lg';
+interface EditableProps extends EditableProps$1 {
+    value?: string;
+    size?: EditableSizes;
+    leftItem?: ReactElement;
+}
+interface EditableControlsProps {
+    size: EditableSizes;
+}
+
+declare const EditableText: ({ size, value: inputValue, onSubmit, leftItem, ...rest }: EditableProps) => JSX.Element;
+
+declare const useArrowFocus: (columns: number) => {
+    defaultArrows: (e: any) => void;
+    focusPrevious: ({ repeat, wrap, }?: {
+        wrap: boolean;
+        repeat: number;
+    }) => void;
+    focusNext: ({ repeat, wrap, }?: {
+        wrap: boolean;
+        repeat: number;
+    }) => void;
+    focusFirst: (opts?: _react_aria_focus.FocusManagerOptions | undefined) => _react_types_shared.FocusableElement;
+    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: unknown, event: ActionMeta<T>) => void;
+    onAdd: (val: unknown) => void;
+    onRemove: (val: unknown) => void;
+    isMulti: boolean;
+    value: T | T[];
+}
+interface BasicOption {
+    label: string;
+    value: unknown;
+}
+declare 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 theme: Record<string, any>;
+declare const tottTheme: Record<string, any>;
+
+declare const getContrastColor: (color: string) => "text.default" | "text.inverted";
+
+declare const luminosity: (hexcolor: string) => number;
+
+declare const ring: CSSObject;
+
+declare const highlight: CSSObject;
+
+declare const getShades: (startShade: number, endShade?: number) => string[];
+
+declare const getInitials: (name: string) => string;
+
+declare function getFieldError<T extends FieldValues>(name: string, errors: FieldErrorsImpl<T>): FieldErrorType$1<T>;
+
+declare const getChildrenWithProps: (children: React$1.ReactNode | React$1.ReactNode[], styles: Record<string, any>, predicate?: (child: React$1.ReactNode, index: number) => boolean) => (string | number | boolean | React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>> | React$1.ReactFragment | null | undefined)[];
+
+export { Alert, AlertProps, AlertVariants, AsyncError, AsyncErrorProps, Avatar, AvatarBadge, AvatarBadgeProps, AvatarProps, BasicOption, Blinker, BlinkerProps, BlockVariant, BlockVariantColorTuple, Blockquote, BodyType, Button, ButtonProps, ButtonVariants, CalendarGrid, Capitalized, Carousel, Checkbox, CheckboxField, CheckboxFieldProps, CheckboxProps, CheckboxVariants, ChildrenType, Clickable, ClickableProps, ClipboardInput, ClipboardInputProps, Collapse, CollapseProps, Color, ColorButtonProps, ColorGrade, ColorPicker, ColorPickerField, ColorPickerFieldProps, ColorPickerProps, ColorShades, ColorsExpandButtonProps, ConfirmDeleteModalProps, CustomContainerPropsType, CustomElementType, CustomFlipButtonProps, CustomFlipButtonPropsType, DateField, DateFieldProps, DatePicker, DatePickerField, DatePickerFieldProps, DatePickerProps, DateRangePicker, DateRangePickerField, DateRangePickerFieldProps, DateRangePickerProps, DateSegmentProps, DateSegmentType, 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, Modal, ModalBooleans, ModalProps, ModalSizes, MonthButton, MonthSelect, MonthSelectProps, MultiFileList, MultiFileListProps, MultiFilePicker, MultiFilePickerField, MultiFilePickerFieldProps, MultiFilePickerProps, MultiFileUploader, MultiFileUploaderProps, MultiItemType, MultiSort, MultiSortProps, NavbarItem, NavbarItemProps, NotificationIconButton, NotificationIconButtonProps, NumberInput, NumberInputField, NumberInputFieldProps, NumberInputProps, NumberInputSizeProps, NumberInputStepper, NumberInputStepperProps, OffsetType, Option, OrganizationLogo, OrganizationLogoProps, P, PProps, PageLayout, PageLayoutProps, PaneDivider, PaneItem, PinInput, PinInputProps, PinSize, PinSizeTuple, PinVariant, ProgressBar, Radio, RadioFieldGroupProps, RadioFieldProps, 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, Steps, StepsProps, StyledField, StyledFieldProps, StylizedType, Switch, SwitchField, SwitchFieldProps, SwitchProps, TabPanel, TabPanelProps, Tabs, TabsProps, Tag, TagProps, TextField, TextFieldProps, TextInputFormatter, TextSizeProps, Textarea, TextareaField, TextareaFieldProps, TextareaProps, Tiny, Toast, ToastProps, Toolbox, ToolboxContent, ToolboxContentProps, ToolboxFooter, ToolboxFooterProps, ToolboxHeader, ToolboxHeaderProps, ToolboxProps, TransitionDirection, Trigger, TriggerProps, UseSelectCallbacksProps, UseYearsCalendarProps, UseYearsRangeCalendarProps, YearSelectCalendar, YearSelectCalendarProps, YearSelectProps, YearSelectRangeCalendar, YearSelectRangeCalendarProps, YearValue, advancedParseFloat, getChildrenWithProps, getContrastColor, getFieldError, getInitials, getShades, highlight, luminosity, ring, statusIconMap, theme, tottTheme, trimFormValues, useArrowFocus, useSelectCallbacks, useSetValueRefreshed };