@chakra-ui/react

@chakra-ui/react

Version 3.21.0
Published 12 hours ago
2.18 MB
8 dependencies
MIT license

Install

npm i @chakra-ui/react

yarn add @chakra-ui/react

pnpm add @chakra-ui/react

Overview

Responsive and accessible React UI components built with React and Emotion

Index

Variables

variable AbsoluteCenter

const AbsoluteCenter: FunctionComponent<any>;

React component used to horizontally and vertically center an element relative to its parent dimensions.
It uses the position: absolute strategy.
See Also
- Docs https://chakra-ui.com/center

variable AccordionItem

const AccordionItem: any;

variable AccordionItemBody

const AccordionItemBody: any;

variable AccordionItemContent

const AccordionItemContent: any;

variable AccordionItemIndicator

const AccordionItemIndicator: any;

variable AccordionItemTrigger

const AccordionItemTrigger: any;

variable AccordionPropsProvider

const AccordionPropsProvider: React.Provider<ArkAccordion.RootBaseProps>;

variable AccordionRoot

const AccordionRoot: any;

variable AccordionRootProvider

const AccordionRootProvider: any;

variable ActionBarCloseTrigger

const ActionBarCloseTrigger: any;

variable ActionBarContent

const ActionBarContent: any;

variable ActionBarPositioner

const ActionBarPositioner: any;

variable ActionBarPropsProvider

const ActionBarPropsProvider: React.Provider<ActionBarRootBaseProps>;

variable ActionBarRoot

const ActionBarRoot: any;

variable ActionBarRootProvider

const ActionBarRootProvider: any;

variable ActionBarSelectionTrigger

const ActionBarSelectionTrigger: any;

variable ActionBarSeparator

const ActionBarSeparator: any;

variable AlertContent

const AlertContent: any;

variable AlertDescription

const AlertDescription: any;

variable AlertIndicator

const AlertIndicator: any;

variable AlertPropsProvider

const AlertPropsProvider: React.Provider<AlertRootBaseProps>;

variable AlertRoot

const AlertRoot: any;

variable AlertTitle

const AlertTitle: any;

variable AspectRatio

const AspectRatio: any;

variable AvatarFallback

const AvatarFallback: any;

variable AvatarGroup

const AvatarGroup: any;

variable AvatarIcon

const AvatarIcon: any;

variable AvatarImage

const AvatarImage: any;

variable AvatarPropsProvider

const AvatarPropsProvider: React.Provider<AvatarRootBaseProps>;

variable AvatarRoot

const AvatarRoot: any;

variable AvatarRootProvider

const AvatarRootProvider: any;

variable Badge

const Badge: any;

variable BadgePropsProvider

const BadgePropsProvider: React.Provider<BadgeBaseProps>;

variable Bleed

const Bleed: any;

variable BlockquoteCaption

const BlockquoteCaption: any;

variable BlockquoteContent

const BlockquoteContent: any;

variable BlockquoteIcon

const BlockquoteIcon: any;

variable BlockquotePropsProvider

const BlockquotePropsProvider: React.Provider<BlockquoteRootBaseProps>;

variable BlockquoteRoot

const BlockquoteRoot: any;

variable Box

const Box: FunctionComponent<any>;

Box is the most abstract component on top of which other chakra components are built. It renders a div element by default.
See Also
- Docs https://chakra-ui.com/box

variable BreadcrumbCurrentLink

const BreadcrumbCurrentLink: any;

variable BreadcrumbEllipsis

const BreadcrumbEllipsis: any;

variable BreadcrumbItem

const BreadcrumbItem: any;

variable BreadcrumbLink

const BreadcrumbLink: any;

variable BreadcrumbList

const BreadcrumbList: any;

variable BreadcrumbPropsProvider

const BreadcrumbPropsProvider: React.Provider<BreadcrumbRootBaseProps>;

variable BreadcrumbRoot

const BreadcrumbRoot: any;

variable BreadcrumbSeparator

const BreadcrumbSeparator: any;

variable Button

const Button: any;

variable ButtonGroup

const ButtonGroup: any;

variable ButtonPropsProvider

const ButtonPropsProvider: React.Provider<ButtonBaseProps>;

variable CardBody

const CardBody: any;

variable CardDescription

const CardDescription: any;

variable CardFooter

const CardFooter: any;

variable CardHeader

const CardHeader: any;

variable CardPropsProvider

const CardPropsProvider: React.Provider<CardRootBaseProps>;

variable CardRoot

const CardRoot: any;

variable CardTitle

const CardTitle: any;

variable Center

const Center: FunctionComponent<any>;

React component used to horizontally and vertically center its child. It uses the popular display: flex centering technique.
See Also
- Docs https://chakra-ui.com/center

variable chakra

const chakra: StyledFactoryFn;

variable CheckboxCardAddon

const CheckboxCardAddon: any;

variable CheckboxCardContent

const CheckboxCardContent: any;

variable CheckboxCardControl

const CheckboxCardControl: any;

variable CheckboxCardDescription

const CheckboxCardDescription: any;

variable CheckboxCardHiddenInput

const CheckboxCardHiddenInput: any;

variable CheckboxCardIndicator

const CheckboxCardIndicator: any;

variable CheckboxCardLabel

const CheckboxCardLabel: any;

variable CheckboxCardRoot

const CheckboxCardRoot: any;

variable CheckboxCardRootPropsProvider

const CheckboxCardRootPropsProvider: React.Provider<CheckboxCardRootBaseProps>;

variable CheckboxCardRootProvider

const CheckboxCardRootProvider: any;

variable CheckboxControl

const CheckboxControl: any;

variable CheckboxGroup

const CheckboxGroup: FunctionComponent<any>;

variable CheckboxHiddenInput

const CheckboxHiddenInput: any;

variable CheckboxIndicator

const CheckboxIndicator: any;

variable CheckboxLabel

const CheckboxLabel: any;

variable CheckboxPropsProvider

const CheckboxPropsProvider: React.Provider<CheckboxRootBaseProps>;

variable CheckboxRoot

const CheckboxRoot: any;

variable CheckboxRootProvider

const CheckboxRootProvider: any;

variable Checkmark

const Checkmark: any;

variable Circle

const Circle: any;

variable ClipboardControl

const ClipboardControl: any;

variable ClipboardCopyText

const ClipboardCopyText: any;

variable ClipboardIndicator

const ClipboardIndicator: any;

variable ClipboardInput

const ClipboardInput: any;

variable ClipboardLabel

const ClipboardLabel: any;

variable ClipboardPropsProvider

const ClipboardPropsProvider: React.Provider<ClipboardRootBaseProps>;

variable ClipboardRoot

const ClipboardRoot: any;

variable ClipboardRootProvider

const ClipboardRootProvider: any;

variable ClipboardTrigger

const ClipboardTrigger: any;

variable ClipboardValueText

const ClipboardValueText: any;

variable CloseButton

const CloseButton: React.ForwardRefExoticComponent<any>;

variable Code

const Code: any;

variable CodePropsProvider

const CodePropsProvider: React.Provider<CodeBaseProps>;

variable CollapsibleContent

const CollapsibleContent: any;

variable CollapsiblePropsProvider

const CollapsiblePropsProvider: React.Provider<CollapsibleRootBaseProps>;

variable CollapsibleRoot

const CollapsibleRoot: any;

variable CollapsibleRootProvider

const CollapsibleRootProvider: any;

variable CollapsibleTrigger

const CollapsibleTrigger: any;

variable ColorPickerArea

const ColorPickerArea: any;

variable ColorPickerAreaBackground

const ColorPickerAreaBackground: any;

variable ColorPickerAreaThumb

const ColorPickerAreaThumb: any;

variable ColorPickerChannelInput

const ColorPickerChannelInput: any;

variable ColorPickerChannelSlider

const ColorPickerChannelSlider: any;

variable ColorPickerChannelSliderLabel

const ColorPickerChannelSliderLabel: any;

variable ColorPickerChannelSliderThumb

const ColorPickerChannelSliderThumb: any;

variable ColorPickerChannelSliderTrack

const ColorPickerChannelSliderTrack: any;

variable ColorPickerChannelSliderValueText

const ColorPickerChannelSliderValueText: any;

variable ColorPickerChannelText

const ColorPickerChannelText: any;

variable ColorPickerContent

const ColorPickerContent: any;

variable ColorPickerControl

const ColorPickerControl: any;

variable ColorPickerEyeDropper

const ColorPickerEyeDropper: any;

variable ColorPickerEyeDropperTrigger

const ColorPickerEyeDropperTrigger: any;

variable ColorPickerFormatSelect

const ColorPickerFormatSelect: any;

variable ColorPickerFormatTrigger

const ColorPickerFormatTrigger: any;

variable ColorPickerHiddenInput

const ColorPickerHiddenInput: any;

variable ColorPickerInput

const ColorPickerInput: any;

variable ColorPickerLabel

const ColorPickerLabel: any;

variable ColorPickerPositioner

const ColorPickerPositioner: any;

variable ColorPickerPropsProvider

const ColorPickerPropsProvider: React.Provider<ColorPickerRootBaseProps>;

variable ColorPickerRoot

const ColorPickerRoot: any;

variable ColorPickerRootProvider

const ColorPickerRootProvider: any;

variable ColorPickerSliders

const ColorPickerSliders: any;

variable ColorPickerSwatch

const ColorPickerSwatch: any;

variable ColorPickerSwatchGroup

const ColorPickerSwatchGroup: any;

variable ColorPickerSwatchIndicator

const ColorPickerSwatchIndicator: any;

variable ColorPickerSwatchTrigger

const ColorPickerSwatchTrigger: any;

variable ColorPickerTransparencyGrid

const ColorPickerTransparencyGrid: any;

variable ColorPickerTrigger

const ColorPickerTrigger: any;

variable ColorPickerValueSwatch

const ColorPickerValueSwatch: any;

variable ColorPickerValueText

const ColorPickerValueText: any;

variable ColorPickerView

const ColorPickerView: any;

variable ColorSwatch

const ColorSwatch: any;

variable ColorSwatchPropsProvider

const ColorSwatchPropsProvider: any;

variable ComboboxClearTrigger

const ComboboxClearTrigger: any;

variable ComboboxContent

const ComboboxContent: any;

variable ComboboxControl

const ComboboxControl: any;

variable ComboboxEmpty

const ComboboxEmpty: any;

variable ComboboxIndicatorGroup

const ComboboxIndicatorGroup: any;

variable ComboboxInput

const ComboboxInput: any;

variable ComboboxItem

const ComboboxItem: any;

variable ComboboxItemGroup

const ComboboxItemGroup: any;

variable ComboboxItemGroupLabel

const ComboboxItemGroupLabel: any;

variable ComboboxItemIndicator

const ComboboxItemIndicator: any;

variable ComboboxItemText

const ComboboxItemText: any;

variable ComboboxLabel

const ComboboxLabel: any;

variable ComboboxPositioner

const ComboboxPositioner: any;

variable ComboboxPropsProvider

const ComboboxPropsProvider: React.Provider<ComboboxRootBaseProps<any>>;

variable ComboboxRoot

const ComboboxRoot: ComboboxRootComponent;

variable ComboboxRootProvider

const ComboboxRootProvider: ComboboxRootProviderComponent;

variable ComboboxTrigger

const ComboboxTrigger: any;

variable Container

const Container: any;

variable ContainerPropsProvider

const ContainerPropsProvider: React.Provider<ContainerBaseProps>;

variable DataListItem

const DataListItem: any;

variable DataListItemLabel

const DataListItemLabel: any;

variable DataListItemValue

const DataListItemValue: any;

variable DataListPropsProvider

const DataListPropsProvider: React.Provider<DataListRootBaseProps>;

variable DataListRoot

const DataListRoot: any;

variable defaultBaseConfig

const defaultBaseConfig: SystemConfig;

variable defaultConfig

const defaultConfig: SystemConfig;

variable defaultSystem

const defaultSystem: SystemContext;

variable defineGlobalStyles

const defineGlobalStyles: GlobalStyleIdentityFn;

variable defineKeyframes

const defineKeyframes: KeyframeIdentityFn;

variable defineRecipe

const defineRecipe: RecipeIdentityFn;

variable defineSemanticTokens

const defineSemanticTokens: ProxyValue<SemanticTokenDefinition>;

variable defineSlotRecipe

const defineSlotRecipe: SlotRecipeIdentityFn;

variable defineStyle

const defineStyle: SystemStyleIdentityFn;

variable defineTokens

const defineTokens: ProxyValue<TokenDefinition>;

variable DialogActionTrigger

const DialogActionTrigger: any;

variable DialogBackdrop

const DialogBackdrop: any;

variable DialogBody

const DialogBody: any;

variable DialogCloseTrigger

const DialogCloseTrigger: any;

variable DialogContent

const DialogContent: any;

variable DialogDescription

const DialogDescription: any;

variable DialogFooter

const DialogFooter: any;

variable DialogHeader

const DialogHeader: any;

variable DialogPositioner

const DialogPositioner: any;

variable DialogPropsProvider

const DialogPropsProvider: React.Provider<DialogRootBaseProps>;

variable DialogRoot

const DialogRoot: any;

variable DialogRootProvider

const DialogRootProvider: any;

variable DialogTitle

const DialogTitle: any;

variable DialogTrigger

const DialogTrigger: any;

variable DownloadTrigger

const DownloadTrigger: any;

variable DrawerActionTrigger

const DrawerActionTrigger: any;

variable DrawerBackdrop

const DrawerBackdrop: any;

variable DrawerBody

const DrawerBody: any;

variable DrawerCloseTrigger

const DrawerCloseTrigger: any;

variable DrawerContent

const DrawerContent: any;

variable DrawerDescription

const DrawerDescription: any;

variable DrawerFooter

const DrawerFooter: any;

variable DrawerHeader

const DrawerHeader: any;

variable DrawerPositioner

const DrawerPositioner: any;

variable DrawerRoot

const DrawerRoot: any;

variable DrawerRootPropsProvider

const DrawerRootPropsProvider: React.Provider<DrawerRootBaseProps>;

variable DrawerRootProvider

const DrawerRootProvider: any;

variable DrawerTitle

const DrawerTitle: any;

variable DrawerTrigger

const DrawerTrigger: any;

variable EditableArea

const EditableArea: any;

variable EditableCancelTrigger

const EditableCancelTrigger: any;

variable EditableControl

const EditableControl: any;

variable EditableEditTrigger

const EditableEditTrigger: any;

variable EditableInput

const EditableInput: any;

variable EditablePreview

const EditablePreview: any;

variable EditablePropsProvider

const EditablePropsProvider: React.Provider<EditableRootBaseProps>;

variable EditableRoot

const EditableRoot: any;

variable EditableRootProvider

const EditableRootProvider: any;

variable EditableSubmitTrigger

const EditableSubmitTrigger: any;

variable EditableTextarea

const EditableTextarea: any;

variable Em

const Em: FunctionComponent<any>;

variable EMPTY_SLOT_STYLES

const EMPTY_SLOT_STYLES: Readonly<Record<string, SystemStyleObject>>;

variable EMPTY_STYLES

const EMPTY_STYLES: Readonly<SystemStyleObject>;

variable EmptyStateContent

const EmptyStateContent: any;

variable EmptyStateDescription

const EmptyStateDescription: any;

variable EmptyStateIndicator

const EmptyStateIndicator: any;

variable EmptyStatePropsProvider

const EmptyStatePropsProvider: React.Provider<EmptyStateRootBaseProps>;

variable EmptyStateRoot

const EmptyStateRoot: any;

variable EmptyStateTitle

const EmptyStateTitle: any;

variable FieldErrorIcon

const FieldErrorIcon: any;

variable FieldErrorText

const FieldErrorText: any;

variable FieldHelperText

const FieldHelperText: any;

variable FieldLabel

const FieldLabel: any;

variable FieldPropsProvider

const FieldPropsProvider: React.Provider<FieldRootBaseProps>;

variable FieldRequiredIndicator

const FieldRequiredIndicator: any;

variable FieldRoot

const FieldRoot: any;

variable FieldsetContent

const FieldsetContent: any;

variable FieldsetErrorText

const FieldsetErrorText: any;

variable FieldsetHelperText

const FieldsetHelperText: any;

variable FieldsetLegend

const FieldsetLegend: any;

variable FieldsetRoot

const FieldsetRoot: any;

variable FileUploadClearTrigger

const FileUploadClearTrigger: any;

variable FileUploadDropzone

const FileUploadDropzone: any;

variable FileUploadDropzoneContent

const FileUploadDropzoneContent: any;

variable FileUploadFileText

const FileUploadFileText: any;

variable FileUploadHiddenInput

const FileUploadHiddenInput: any;

variable FileUploadItem

const FileUploadItem: any;

variable FileUploadItemContent

const FileUploadItemContent: any;

variable FileUploadItemDeleteTrigger

const FileUploadItemDeleteTrigger: any;

variable FileUploadItemGroup

const FileUploadItemGroup: any;

variable FileUploadItemName

const FileUploadItemName: any;

variable FileUploadItemPreview

const FileUploadItemPreview: any;

variable FileUploadItemPreviewImage

const FileUploadItemPreviewImage: any;

variable FileUploadItemSizeText

const FileUploadItemSizeText: any;

variable FileUploadLabel

const FileUploadLabel: any;

variable FileUploadList

const FileUploadList: any;

variable FileUploadPropsProvider

const FileUploadPropsProvider: React.Provider<FileUploadRootBaseProps>;

variable FileUploadRoot

const FileUploadRoot: any;

variable FileUploadRootProvider

const FileUploadRootProvider: any;

variable FileUploadTrigger

const FileUploadTrigger: any;

variable Flex

const Flex: any;

variable Float

const Float: any;

variable FocusTrap

const FocusTrap: FunctionComponent<any>;

variable FormatByte

const FormatByte: { (props: Format.ByteProps): any; displayName: string };

variable FormatNumber

const FormatNumber: { (props: Format.NumberProps): any; displayName: string };

variable Grid

const Grid: any;

variable GridItem

const GridItem: any;

variable Group

const Group: any;

variable Heading

const Heading: any;

variable HeadingPropsProvider

const HeadingPropsProvider: React.Provider<HeadingProps>;

variable HoverCardArrow

const HoverCardArrow: any;

variable HoverCardArrowTip

const HoverCardArrowTip: any;

variable HoverCardContent

const HoverCardContent: any;

variable HoverCardPositioner

const HoverCardPositioner: any;

variable HoverCardPropsProvider

const HoverCardPropsProvider: React.Provider<HoverCardRootBaseProps>;

variable HoverCardRoot

const HoverCardRoot: any;

variable HoverCardRootProvider

const HoverCardRootProvider: any;

variable HoverCardTrigger

const HoverCardTrigger: any;

variable HStack

const HStack: any;

A view that arranges its children in a horizontal line.
See Also
- Docs https://chakra-ui.com/docs/components/stack

variable Icon

const Icon: React.ForwardRefExoticComponent<any>;

The Icon component renders as an svg element to help define your own custom components.
See Also
- Docs https://chakra-ui.com/docs/components/icon#using-the-icon-component

variable IconButton

const IconButton: any;

variable IconPropsProvider

const IconPropsProvider: React.Provider<IconProps>;

variable Image

const Image: any;

React component that renders an image with support for fallbacks
See Also
- Docs https://www.chakra-ui.com/docs/components/image

variable Input

const Input: any;

variable InputAddon

const InputAddon: any;

variable InputElement

const InputElement: FunctionComponent<any>;

variable InputGroup

const InputGroup: any;

variable InputPropsProvider

const InputPropsProvider: React.Provider<InputProps>;

variable Kbd

const Kbd: any;

variable Link

const Link: any;

const LinkBox: any;

LinkBox is used to wrap content areas within a link while ensuring semantic html
See Also
- Docs https://chakra-ui.com/docs/navigation/link-overlay
- Resources https://www.sarasoueidan.com/blog/nested-links

variable LinkOverlay

const LinkOverlay: any;

variable LinkPropsProvider

const LinkPropsProvider: React.Provider<LinkProps>;

variable ListIndicator

const ListIndicator: any;

variable ListItem

const ListItem: any;

variable ListRoot

const ListRoot: any;

variable ListRootPropsProvider

const ListRootPropsProvider: React.Provider<ListRootBaseProps>;

variable Loader

const Loader: React.ForwardRefExoticComponent<any>;

variable LoaderOverlay

const LoaderOverlay: FunctionComponent<any>;

variable Mark

const Mark: any;

variable MarkPropsProvider

const MarkPropsProvider: React.Provider<MarkProps>;

variable MenuArrow

const MenuArrow: any;

variable MenuArrowTip

const MenuArrowTip: any;

variable MenuCheckboxItem

const MenuCheckboxItem: any;

variable MenuContent

const MenuContent: any;

variable MenuContextTrigger

const MenuContextTrigger: any;

variable MenuIndicator

const MenuIndicator: any;

variable MenuItem

const MenuItem: any;

variable MenuItemCommand

const MenuItemCommand: any;

variable MenuItemGroup

const MenuItemGroup: any;

variable MenuItemGroupLabel

const MenuItemGroupLabel: any;

variable MenuItemIndicator

const MenuItemIndicator: any;

variable MenuItemText

const MenuItemText: any;

variable MenuPositioner

const MenuPositioner: any;

variable MenuPropsProvider

const MenuPropsProvider: React.Provider<MenuRootBaseProps>;

variable MenuRadioItem

const MenuRadioItem: any;

variable MenuRadioItemGroup

const MenuRadioItemGroup: any;

variable MenuRoot

const MenuRoot: any;

variable MenuRootProvider

const MenuRootProvider: any;

variable MenuSeparator

const MenuSeparator: any;

variable MenuTrigger

const MenuTrigger: any;

variable MenuTriggerItem

const MenuTriggerItem: any;

variable NativeSelectField

const NativeSelectField: any;

variable NativeSelectPropsProvider

const NativeSelectPropsProvider: React.Provider<NativeSelectRootBaseProps>;

variable NativeSelectRoot

const NativeSelectRoot: any;

variable NumberInputControl

const NumberInputControl: any;

variable NumberInputDecrementTrigger

const NumberInputDecrementTrigger: any;

variable NumberInputIncrementTrigger

const NumberInputIncrementTrigger: any;

variable NumberInputInput

const NumberInputInput: any;

variable NumberInputLabel

const NumberInputLabel: any;

variable NumberInputPropsProvider

const NumberInputPropsProvider: React.Provider<NumberInputRootBaseProps>;

variable NumberInputRoot

const NumberInputRoot: any;

variable NumberInputRootProvider

const NumberInputRootProvider: any;

variable NumberInputScrubber

const NumberInputScrubber: any;

variable NumberInputValueText

const NumberInputValueText: any;

variable PaginationEllipsis

const PaginationEllipsis: any;

variable PaginationItem

const PaginationItem: any;

variable PaginationNextTrigger

const PaginationNextTrigger: any;

variable PaginationPageText

const PaginationPageText: any;

variable PaginationPrevTrigger

const PaginationPrevTrigger: any;

variable PaginationPropsProvider

const PaginationPropsProvider: React.Provider<PaginationRootBaseProps>;

variable PaginationRoot

const PaginationRoot: any;

variable PaginationRootProvider

const PaginationRootProvider: any;

variable PinInputControl

const PinInputControl: any;

variable PinInputHiddenInput

const PinInputHiddenInput: any;

variable PinInputInput

const PinInputInput: any;

variable PinInputLabel

const PinInputLabel: any;

variable PinInputPropsProvider

const PinInputPropsProvider: React.Provider<PinInputRootBaseProps>;

variable PinInputRoot

const PinInputRoot: any;

variable PinInputRootProvider

const PinInputRootProvider: any;

variable PopoverAnchor

const PopoverAnchor: any;

variable PopoverArrow

const PopoverArrow: any;

variable PopoverArrowTip

const PopoverArrowTip: any;

variable PopoverBody

const PopoverBody: any;

variable PopoverCloseTrigger

const PopoverCloseTrigger: any;

variable PopoverContent

const PopoverContent: any;

variable PopoverDescription

const PopoverDescription: any;

variable PopoverFooter

const PopoverFooter: any;

variable PopoverHeader

const PopoverHeader: any;

variable PopoverPositioner

const PopoverPositioner: any;

variable PopoverPropsProvider

const PopoverPropsProvider: React.Provider<PopoverRootBaseProps>;

variable PopoverRoot

const PopoverRoot: any;

variable PopoverRootProvider

const PopoverRootProvider: any;

variable PopoverTitle

const PopoverTitle: any;

variable PopoverTrigger

const PopoverTrigger: any;

variable Presence

const Presence: FunctionComponent<any>;

variable ProgressCircleCircle

const ProgressCircleCircle: any;

variable ProgressCircleLabel

const ProgressCircleLabel: any;

variable ProgressCirclePropsProvider

const ProgressCirclePropsProvider: React.Provider<ProgressCircleRootBaseProps>;

variable ProgressCircleRange

const ProgressCircleRange: any;

variable ProgressCircleRoot

const ProgressCircleRoot: any;

variable ProgressCircleRootProvider

const ProgressCircleRootProvider: any;

variable ProgressCircleTrack

const ProgressCircleTrack: any;

variable ProgressCircleValueText

const ProgressCircleValueText: any;

variable ProgressLabel

const ProgressLabel: any;

variable ProgressPropsProvider

const ProgressPropsProvider: React.Provider<ProgressRootBaseProps>;

variable ProgressRange

const ProgressRange: any;

variable ProgressRoot

const ProgressRoot: any;

variable ProgressRootProvider

const ProgressRootProvider: any;

variable ProgressTrack

const ProgressTrack: any;

variable ProgressValueText

const ProgressValueText: any;

variable QrCodeFrame

const QrCodeFrame: any;

variable QrCodeOverlay

const QrCodeOverlay: any;

variable QrCodePattern

const QrCodePattern: any;

variable QrCodePropsProvider

const QrCodePropsProvider: React.Provider<QrCodeRootBaseProps>;

variable QrCodeRoot

const QrCodeRoot: any;

variable QrCodeRootProvider

const QrCodeRootProvider: any;

variable Quote

const Quote: FunctionComponent<any>;

variable RadioCardContext

const RadioCardContext: React.FC<RadioCardContextProps>;

variable RadioCardItem

const RadioCardItem: any;

variable RadioCardItemAddon

const RadioCardItemAddon: any;

variable RadioCardItemContent

const RadioCardItemContent: any;

variable RadioCardItemControl

const RadioCardItemControl: any;

variable RadioCardItemDescription

const RadioCardItemDescription: any;

variable RadioCardItemHiddenInput

const RadioCardItemHiddenInput: any;

variable RadioCardItemIndicator

const RadioCardItemIndicator: any;

variable RadioCardItemText

const RadioCardItemText: any;

variable RadioCardLabel

const RadioCardLabel: any;

variable RadioCardPropsProvider

const RadioCardPropsProvider: React.Provider<RadioCardRootBaseProps>;

variable RadioCardRoot

const RadioCardRoot: any;

variable RadioCardRootProvider

const RadioCardRootProvider: any;

variable RadioGroupContext

const RadioGroupContext: React.FC<RadioGroupContextProps>;

variable RadioGroupItem

const RadioGroupItem: any;

variable RadioGroupItemControl

const RadioGroupItemControl: any;

variable RadioGroupItemHiddenInput

const RadioGroupItemHiddenInput: any;

variable RadioGroupItemIndicator

const RadioGroupItemIndicator: any;

variable RadioGroupItemText

const RadioGroupItemText: any;

variable RadioGroupLabel

const RadioGroupLabel: any;

variable RadioGroupPropsProvider

const RadioGroupPropsProvider: React.Provider<RadioGroupRootBaseProps>;

variable RadioGroupRoot

const RadioGroupRoot: any;

variable RadioGroupRootProvider

const RadioGroupRootProvider: any;

variable Radiomark

const Radiomark: any;

variable RatingGroupControl

const RatingGroupControl: any;

variable RatingGroupHiddenInput

const RatingGroupHiddenInput: any;

variable RatingGroupItem

const RatingGroupItem: any;

variable RatingGroupItemIndicator

const RatingGroupItemIndicator: any;

variable RatingGroupLabel

const RatingGroupLabel: any;

variable RatingGroupPropsProvider

const RatingGroupPropsProvider: React.Provider<RatingGroupRootBaseProps>;

variable RatingGroupRoot

const RatingGroupRoot: any;

variable RatingGroupRootProvider

const RatingGroupRootProvider: any;

variable SegmentGroupIndicator

const SegmentGroupIndicator: any;

variable SegmentGroupItem

const SegmentGroupItem: any;

variable SegmentGroupItemHiddenInput

const SegmentGroupItemHiddenInput: any;

variable SegmentGroupItemText

const SegmentGroupItemText: any;

variable SegmentGroupPropsProvider

const SegmentGroupPropsProvider: React.Provider<SegmentGroupRootBaseProps>;

variable SegmentGroupRoot

const SegmentGroupRoot: any;

variable SegmentGroupRootProvider

const SegmentGroupRootProvider: any;

variable SelectClearTrigger

const SelectClearTrigger: any;

variable SelectContent

const SelectContent: any;

variable SelectControl

const SelectControl: any;

variable SelectHiddenSelect

const SelectHiddenSelect: any;

variable SelectIndicator

const SelectIndicator: any;

variable SelectIndicatorGroup

const SelectIndicatorGroup: any;

variable SelectItem

const SelectItem: any;

variable SelectItemGroup

const SelectItemGroup: any;

variable SelectItemGroupLabel

const SelectItemGroupLabel: any;

variable SelectItemIndicator

const SelectItemIndicator: any;

variable SelectItemText

const SelectItemText: any;

variable SelectLabel

const SelectLabel: any;

variable SelectPositioner

const SelectPositioner: any;

variable SelectPropsProvider

const SelectPropsProvider: React.Provider<SelectRootBaseProps<any>>;

variable SelectRoot

const SelectRoot: SelectRootComponent;

variable SelectRootProvider

const SelectRootProvider: SelectRootProviderComponent;

variable SelectTrigger

const SelectTrigger: any;

variable SelectValueText

const SelectValueText: any;

variable Separator

const Separator: any;

variable SeparatorPropsProvider

const SeparatorPropsProvider: React.Provider<SeparatorBaseProps>;

variable SimpleGrid

const SimpleGrid: any;

SimpleGrid
React component that uses the Grid component and provides a simpler interface to create responsive grid layouts.
Provides props that easily define columns and spacing.
See Also
- Docs https://chakra-ui.com/simplegrid

variable Skeleton

const Skeleton: React.ForwardRefExoticComponent<any>;

variable SkeletonCircle

const SkeletonCircle: React.ForwardRefExoticComponent<any>;

variable SkeletonPropsProvider

const SkeletonPropsProvider: React.Provider<SkeletonProps>;

variable SkeletonText

const SkeletonText: React.ForwardRefExoticComponent<any>;

variable SkipNavContent

const SkipNavContent: any;

Renders a div as the target for the SkipNavLink.
See Also
- Docs https://chakra-ui.com/docs/components/skip-nav

variable SkipNavLink

const SkipNavLink: any;

Renders a link that remains hidden until focused to skip to the main content.
See Also
- Docs https://chakra-ui.com/docs/components/skip-nav

variable SliderControl

const SliderControl: any;

variable SliderDraggingIndicator

const SliderDraggingIndicator: any;

variable SliderHiddenInput

const SliderHiddenInput: any;

variable SliderLabel

const SliderLabel: any;

variable SliderMarker

const SliderMarker: any;

variable SliderMarkerGroup

const SliderMarkerGroup: any;

variable SliderMarkerIndicator

const SliderMarkerIndicator: any;

variable SliderPropsProvider

const SliderPropsProvider: React.Provider<SliderRootBaseProps>;

variable SliderRange

const SliderRange: any;

variable SliderRoot

const SliderRoot: any;

variable SliderRootProvider

const SliderRootProvider: any;

variable SliderThumb

const SliderThumb: any;

variable SliderTrack

const SliderTrack: any;

variable SliderValueText

const SliderValueText: any;

variable Spacer

const Spacer: FunctionComponent<any>;

A flexible flex spacer that expands along the major axis of its containing flex layout. It renders a div by default, and takes up any available space.
See Also
- Docs https://chakra-ui.com/flex#using-the-spacer

variable Span

const Span: FunctionComponent<any>;

variable Spinner

const Spinner: any;

variable SpinnerPropsProvider

const SpinnerPropsProvider: React.Provider<SpinnerProps>;

variable Square

const Square: any;

variable Stack

const Stack: any;

Stacks help you easily create flexible and automatically distributed layouts
You can stack elements in the horizontal or vertical direction, and apply a space or/and separator between each element.
It uses display: flex internally and renders a div.
See Also
- Docs https://chakra-ui.com/stack

variable StackSeparator

const StackSeparator: FunctionComponent<any>;

variable StatDownIndicator

const StatDownIndicator: any;

variable StatGroup

const StatGroup: any;

variable StatHelpText

const StatHelpText: any;

variable StatLabel

const StatLabel: any;

variable StatPropsProvider

const StatPropsProvider: React.Provider<StatRootBaseProps>;

variable StatRoot

const StatRoot: any;

variable StatUpIndicator

const StatUpIndicator: any;

variable StatusIndicator

const StatusIndicator: any;

variable StatusPropsProvider

const StatusPropsProvider: React.Provider<StatusRootBaseProps>;

variable StatusRoot

const StatusRoot: any;

variable StatValueText

const StatValueText: any;

variable StatValueUnit

const StatValueUnit: any;

variable StepsCompletedContent

const StepsCompletedContent: any;

variable StepsContent

const StepsContent: any;

variable StepsContext

const StepsContext: { (props: ArkSteps.ContextProps): any; displayName: string };

variable StepsDescription

const StepsDescription: any;

variable StepsIndicator

const StepsIndicator: any;

variable StepsItem

const StepsItem: any;

variable StepsItemContext

const StepsItemContext: {
    (props: ArkSteps.ItemContextProps): any;
    displayName: string;
};

variable StepsList

const StepsList: any;

variable StepsNextTrigger

const StepsNextTrigger: any;

variable StepsNumber

const StepsNumber: any;

variable StepsPrevTrigger

const StepsPrevTrigger: any;

variable StepsPropsProvider

const StepsPropsProvider: React.Provider<StepsRootBaseProps>;

variable StepsRoot

const StepsRoot: any;

variable StepsRootProvider

const StepsRootProvider: any;

variable StepsSeparator

const StepsSeparator: any;

variable StepsTitle

const StepsTitle: any;

variable StepsTrigger

const StepsTrigger: any;

variable Sticky

const Sticky: FunctionComponent<any>;

variable Strong

const Strong: FunctionComponent<any>;

variable SwitchControl

const SwitchControl: any;

variable SwitchHiddenInput

const SwitchHiddenInput: any;

variable SwitchIndicator

const SwitchIndicator: any;

variable SwitchLabel

const SwitchLabel: any;

variable SwitchPropsProvider

const SwitchPropsProvider: React.Provider<SwitchRootBaseProps>;

variable SwitchRoot

const SwitchRoot: any;

variable SwitchRootProvider

const SwitchRootProvider: any;

variable SwitchThumb

const SwitchThumb: any;

variable SwitchThumbIndicator

const SwitchThumbIndicator: any;

variable TableBody

const TableBody: any;

variable TableCaption

const TableCaption: any;

variable TableCell

const TableCell: any;

variable TableColumn

const TableColumn: any;

variable TableColumnGroup

const TableColumnGroup: any;

variable TableColumnHeader

const TableColumnHeader: any;

variable TableFooter

const TableFooter: any;

variable TableHeader

const TableHeader: any;

variable TableRoot

const TableRoot: any;

variable TableRootPropsProvider

const TableRootPropsProvider: React.Provider<TableRootBaseProps>;

variable TableRow

const TableRow: any;

variable TableScrollArea

const TableScrollArea: FunctionComponent<any>;

variable TabsContent

const TabsContent: any;

variable TabsContentGroup

const TabsContentGroup: any;

variable TabsIndicator

const TabsIndicator: any;

variable TabsList

const TabsList: any;

variable TabsPropsProvider

const TabsPropsProvider: React.Provider<TabsRootBaseProps>;

variable TabsRoot

const TabsRoot: any;

variable TabsRootProvider

const TabsRootProvider: any;

variable TabsTrigger

const TabsTrigger: any;

variable TagCloseTrigger

const TagCloseTrigger: any;

variable TagEndElement

const TagEndElement: any;

variable TagLabel

const TagLabel: any;

variable TagRoot

const TagRoot: any;

variable TagRootPropsProvider

const TagRootPropsProvider: React.Provider<TagRootBaseProps>;

variable TagStartElement

const TagStartElement: any;

variable Text

const Text: any;

variable Textarea

const Textarea: any;

variable TextareaPropsProvider

const TextareaPropsProvider: React.Provider<TextareaProps>;

variable TextPropsProvider

const TextPropsProvider: React.Provider<TextProps>;

variable Theme

const Theme: any;

variable TimelineConnector

const TimelineConnector: any;

variable TimelineContent

const TimelineContent: any;

variable TimelineDescription

const TimelineDescription: any;

variable TimelineIndicator

const TimelineIndicator: any;

variable TimelineItem

const TimelineItem: any;

variable TimelineRoot

const TimelineRoot: any;

variable TimelineRootPropsProvider

const TimelineRootPropsProvider: React.Provider<TimelineRootBaseProps>;

variable TimelineSeparator

const TimelineSeparator: any;

variable TimelineTitle

const TimelineTitle: any;

variable ToastActionTrigger

const ToastActionTrigger: any;

variable ToastCloseTrigger

const ToastCloseTrigger: any;

variable ToastDescription

const ToastDescription: any;

variable Toaster

const Toaster: React.FC<ToasterProps>;

variable ToastIndicator

const ToastIndicator: any;

variable ToastRoot

const ToastRoot: any;

variable ToastTitle

const ToastTitle: any;

variable ToggleIndicator

const ToggleIndicator: any;

variable TogglePropsProvider

const TogglePropsProvider: React.Provider<ToggleRootBaseProps>;

variable ToggleRoot

const ToggleRoot: any;

variable TooltipArrow

const TooltipArrow: any;

variable TooltipArrowTip

const TooltipArrowTip: any;

variable TooltipContent

const TooltipContent: any;

variable TooltipPositioner

const TooltipPositioner: any;

variable TooltipPropsProvider

const TooltipPropsProvider: React.Provider<TooltipRootBaseProps>;

variable TooltipRoot

const TooltipRoot: any;

variable TooltipRootProvider

const TooltipRootProvider: any;

variable TooltipTrigger

const TooltipTrigger: any;

variable useSafeLayoutEffect

const useSafeLayoutEffect: any;

variable useUpdateEffect

const useUpdateEffect: any;

variable VisuallyHidden

const VisuallyHidden: FunctionComponent<any>;

Visually hidden component used to hide elements on screen
See Also
- Docs https://chakra-ui.com/docs/components/visually-hidden

variable visuallyHiddenStyle

const visuallyHiddenStyle: {
    border: string;
    clip: string;
    height: string;
    width: string;
    margin: string;
    padding: string;
    overflow: string;
    whiteSpace: string;
    position: string;
};

variable VStack

const VStack: any;

A view that arranges its children in a vertical line.
See Also
- Docs https://chakra-ui.com/docs/components/stack

variable Wrap

const Wrap: any;

variable WrapItem

const WrapItem: any;

Functions

function AccordionContext

AccordionContext: (props: ArkAccordion.ContextProps) => any;

function AccordionItemContext

AccordionItemContext: (props: ArkAccordion.ItemContextProps) => any;

function ActionBarContext

ActionBarContext: (props: ArkPopover.ContextProps) => any;

function AvatarContext

AvatarContext: (props: ArkAvatar.ContextProps) => any;

function ChakraProvider

ChakraProvider: (props: ChakraProviderProps) => any;

function CheckboxCardContext

CheckboxCardContext: (props: ArkCheckbox.ContextProps) => any;

function CheckboxContext

CheckboxContext: (props: ArkCheckbox.ContextProps) => any;

function ClientOnly

ClientOnly: (props: ClientOnlyProps) => any;

function ClipboardContext

ClipboardContext: (props: ArkClipboard.ContextProps) => any;

function CollapsibleContext

CollapsibleContext: (props: ArkCollapsible.ContextProps) => any;

function ColorPickerContext

ColorPickerContext: (props: ArkColorPicker.ContextProps) => any;

function ColorSwatchMix

ColorSwatchMix: (props: ColorSwatchMixProps) => any;

function ComboboxContext

ComboboxContext: <T extends unknown>(props: ArkCombobox.ContextProps<T>) => any;

function ComboboxItemContext

ComboboxItemContext: (props: ArkCombobox.ItemContextProps) => any;

function createContext

createContext: <T>(options?: CreateContextOptions<T>) => CreateContextReturn<T>;

function createIcon

createIcon: (options: CreateIconOptions) => any;

function createOverlay

createOverlay: <T extends Dict<any>>(
    Component: React.ElementType<T & CreateOverlayProps>,
    options?: OverlayOptions<T>
) => CreateOverlayReturn<T>;

function createRecipeContext

createRecipeContext: <K extends RecipeKey>(
    options: UseRecipeOptions<K>
) => {
    withContext: <T, P>(
        Component: React.ElementType<any>,
        options?: JsxFactoryOptions<P>
    ) => React.ForwardRefExoticComponent<any>;
    PropsProvider: any;
    withPropsProvider: <P>() => React.Provider<Partial<P>>;
    usePropsContext: () => Record<string, any>;
    useRecipeResult: (props: any) => {
        styles: Readonly<import('./css.types').SystemStyleObject>;
        className: string;
        props: { [x: string]: any; [x: number]: any; [x: symbol]: any };
    };
};

function createSlotRecipeContext

createSlotRecipeContext: <R extends SlotRecipeKey>(
    options: UseSlotRecipeOptions<R>
) => {
    StylesProvider: any;
    ClassNamesProvider: any;
    PropsProvider: any;
    usePropsContext: () => Record<string, any>;
    useRecipeResult: (props: any) => {
        styles: Record<string, SystemStyleObject>;
        classNames: Record<string, string>;
        props: { [x: string]: any; [x: number]: any; [x: symbol]: any };
    };
    withProvider: <T, P>(
        Component: React.ElementType<any>,
        slot: R extends keyof ConfigRecipeSlots ? ConfigRecipeSlots[R] : string,
        options?: WithProviderOptions<P>
    ) => React.ForwardRefExoticComponent<any>;
    withContext: <T, P_1>(
        Component: React.ElementType<any>,
        slot?: R extends keyof ConfigRecipeSlots ? ConfigRecipeSlots[R] : string,
        options?: WithContextOptions<P_1>
    ) => React.ForwardRefExoticComponent<any>;
    withRootProvider: <P_2>(
        Component: React.ElementType<any>,
        options?: WithRootProviderOptions<P_2>
    ) => React.FC<React.PropsWithoutRef<P_2>>;
    useStyles: () => Record<string, SystemStyleObject>;
    useClassNames: () => Record<string, string>;
};

function createSystem

createSystem: (...configs: SystemConfig[]) => SystemContext;

function defineAnimationStyles

defineAnimationStyles: (
    v: CompositionStyles['animationStyles']
) => import('./composition').AnimationStyles;

function defineConditions

defineConditions: <T extends ConditionRecord>(v: T) => T;

function defineConfig

defineConfig: (v: SystemConfig) => SystemConfig;

function defineLayerStyles

defineLayerStyles: (
    v: CompositionStyles['layerStyles']
) => import('./composition').LayerStyles;

function defineTextStyles

defineTextStyles: (
    v: CompositionStyles['textStyles']
) => import('./composition').TextStyles;

function DialogContext

DialogContext: (props: ArkDialog.ContextProps) => any;

function DrawerContext

DrawerContext: (props: ArkDialog.ContextProps) => any;

function EditableContext

EditableContext: (props: ArkEditable.ContextProps) => any;

function FieldsetContext

FieldsetContext: (props: Fieldset.ContextProps) => any;

function FileUploadContext

FileUploadContext: (props: ArkFileUpload.ContextProps) => any;

function FileUploadItems

FileUploadItems: (props: FileUploadItemsProps) => any;

function For

For: <T extends string | number | Dict<any>>(
    props: ForProps<T>
) => React.ReactNode;

function getColorChannels

getColorChannels: <T extends 'rgba' | 'hsla' | 'hsba' | 'hexa'>(
    format: T
) => {
    readonly rgba: readonly ['red', 'green', 'blue', 'alpha'];
    readonly hsla: readonly ['hue', 'saturation', 'lightness', 'alpha'];
    readonly hsba: readonly ['hue', 'saturation', 'brightness', 'alpha'];
    readonly hexa: readonly ['hex', 'alpha'];
}[T];

function Highlight

Highlight: (props: HighlightProps) => JSX.Element;

Highlight allows you to highlight substrings of a text.
See Also
- Docs https://chakra-ui.com/docs/components/highlight

function HoverCardContext

HoverCardContext: (props: ArkHoverCard.ContextProps) => any;

function isValidSystem

isValidSystem: (mod: unknown) => mod is SystemContext;

function MenuContext

MenuContext: (props: ArkMenu.ContextProps) => any;

function MenuItemContext

MenuItemContext: (props: ArkMenu.ItemContextProps) => any;

function mergeConfigs

mergeConfigs: (...configs: SystemConfig[]) => SystemConfig;

function mergeProps

mergeProps: <T extends Props>(
    ...args: T[]
) => UnionToIntersection<TupleTypes<T[]>>;

function mergeRefs

mergeRefs: <T>(
    ...refs: (ReactRef<T> | null | undefined)[]
) => (node: T | null) => void;

function NativeSelectIndicator

NativeSelectIndicator: (props: NativeSelectIndicatorProps) => any;

function NumberInputContext

NumberInputContext: (props: ArkNumberInput.ContextProps) => any;

function PaginationContext

PaginationContext: (props: ArkPagination.ContextProps) => any;

function PaginationItems

PaginationItems: (props: PaginationItemsProps) => any;

function PinInputContext

PinInputContext: (props: ArkPinInput.ContextProps) => any;

function PopoverContext

PopoverContext: (props: ArkPopover.ContextProps) => any;

function ProgressCircleContext

ProgressCircleContext: (props: ArkProgress.ContextProps) => any;

function ProgressContext

ProgressContext: (props: ArkProgress.ContextProps) => any;

function RatingGroupContext

RatingGroupContext: (props: ArkRatingGroup.ContextProps) => any;

function RatingGroupItemContext

RatingGroupItemContext: (props: ArkRatingGroup.ItemContextProps) => any;

function RatingGroupItems

RatingGroupItems: (props: RatingGroupItemsProps) => any;

function RecipePropsProvider

RecipePropsProvider: <
    T extends
        | 'container'
        | 'badge'
        | 'button'
        | 'code'
        | 'heading'
        | 'input'
        | 'inputAddon'
        | 'kbd'
        | 'link'
        | 'mark'
        | 'separator'
        | 'skeleton'
        | 'skipNavLink'
        | 'spinner'
        | 'textarea'
        | 'icon'
        | 'checkmark'
        | 'radiomark'
        | 'colorSwatch'
        | (string & {})
        | 'accordion'
        | 'actionBar'
        | 'alert'
        | 'avatar'
        | 'blockquote'
        | 'breadcrumb'
        | 'card'
        | 'checkbox'
        | 'checkboxCard'
        | 'collapsible'
        | 'dataList'
        | 'dialog'
        | 'drawer'
        | 'editable'
        | 'emptyState'
        | 'field'
        | 'fieldset'
        | 'fileUpload'
        | 'hoverCard'
        | 'list'
        | 'menu'
        | 'nativeSelect'
        | 'numberInput'
        | 'pinInput'
        | 'popover'
        | 'progress'
        | 'progressCircle'
        | 'radioCard'
        | 'radioGroup'
        | 'ratingGroup'
        | 'segmentGroup'
        | 'select'
        | 'combobox'
        | 'slider'
        | 'stat'
        | 'steps'
        | 'switch'
        | 'table'
        | 'tabs'
        | 'tag'
        | 'toast'
        | 'tooltip'
        | 'status'
        | 'timeline'
        | 'colorPicker'
        | 'qrCode'
>(
    props: Props<T>
) => any;

function SegmentGroupContext

SegmentGroupContext: (props: ArkSegmentGroup.ContextProps) => any;

function SegmentGroupItemContext

SegmentGroupItemContext: (props: ArkSegmentGroup.ItemContextProps) => any;

function SegmentGroupItems

SegmentGroupItems: (props: SegmentGroupItemsProps) => any;

function SelectContext

SelectContext: <T extends unknown>(props: ArkSelect.ContextProps<T>) => any;

function SelectItemContext

SelectItemContext: (props: ArkSelect.ItemContextProps) => any;

function Show

Show: <T>(props: ShowProps<T>) => JSX.Element;

function SliderContext

SliderContext: (props: ArkSlider.ContextProps) => any;

function StepsStatus

StepsStatus: (props: StepsStatusProps) => any;

function SwitchContext

SwitchContext: (props: ArkSwitch.ContextProps) => any;

function TabsContext

TabsContext: (props: ArkTabs.ContextProps) => any;

function ToggleContext

ToggleContext: (props: ArkToggle.ContextProps) => any;

function TooltipContext

TooltipContext: (props: ArkTooltip.ContextProps) => any;

function useAccordionStyles

useAccordionStyles: () => Record<string, import('../..').SystemStyleObject>;

function useActionBarStyles

useActionBarStyles: () => Record<string, import('../..').SystemStyleObject>;

function useAlertStyles

useAlertStyles: () => Record<string, import('../..').SystemStyleObject>;

function useAvatarStyles

useAvatarStyles: () => Record<string, import('../..').SystemStyleObject>;

function useBlockquoteStyles

useBlockquoteStyles: () => Record<string, import('../..').SystemStyleObject>;

function useBreadcrumbStyles

useBreadcrumbStyles: () => Record<string, import('../..').SystemStyleObject>;

function useBreakpoint

useBreakpoint: (options?: UseBreakpointOptions) => string;

function useBreakpointValue

useBreakpointValue: <T = any>(
    value: Value<T>,
    opts?: UseBreakpointValueOptions
) => T | undefined;

function useCallbackRef

useCallbackRef: <Args extends unknown[], Return>(
    callback: (...args: Args) => Return,
    deps?: React.DependencyList
) => (...args: Args) => Return | undefined;

This hook is user-land implementation of the experimental useEffectEvent hook. React docs: https://react.dev/learn/separating-events-from-effects#declaring-an-effect-event

function useCardStyles

useCardStyles: () => Record<string, import('../..').SystemStyleObject>;

function useChakraContext

useChakraContext: () => SystemContext;

function useCheckboxCardStyles

useCheckboxCardStyles: () => Record<string, import('../..').SystemStyleObject>;

function useCheckboxStyles

useCheckboxStyles: () => Record<string, import('../..').SystemStyleObject>;

function useClipboardStyles

useClipboardStyles: () => Record<string, import('../..').SystemStyleObject>;

function useCollapsibleStyles

useCollapsibleStyles: () => Record<string, import('../..').SystemStyleObject>;

function useColorPickerStyles

useColorPickerStyles: () => Record<string, import('../..').SystemStyleObject>;

function useComboboxStyles

useComboboxStyles: () => Record<string, import('../..').SystemStyleObject>;

function useConst

useConst: <T extends unknown>(init: T | InitFn<T>) => T;

function useControllableProp

useControllableProp: <T>(prop: T | undefined, state: T) => [boolean, T];

Given a prop value and state value, the useControllableProp hook is used to determine whether a component is controlled or uncontrolled, and also returns the computed value.
See Also
- Docs https://chakra-ui.com/docs/hooks/use-controllable#usecontrollableprop

function useControllableState

useControllableState: <T>(
    props: UseControllableStateProps<T>
) => [T, React.Dispatch<React.SetStateAction<T>>];

The useControllableState hook returns the state and function that updates the state, just like React.useState does.
See Also
- Docs https://chakra-ui.com/docs/hooks/use-controllable#usecontrollablestate

function useDataListStyles

useDataListStyles: () => Record<string, import('../..').SystemStyleObject>;

function useDialogStyles

useDialogStyles: () => Record<string, import('../..').SystemStyleObject>;

function useDisclosure

useDisclosure: (props?: UseDisclosureProps) => {
    open: boolean;
    onOpen: () => void;
    onClose: () => void;
    onToggle: () => void;
    setOpen: import('react').Dispatch<import('react').SetStateAction<boolean>>;
};

useDisclosure is a custom hook used to help handle common open, close, or toggle scenarios. It can be used to control feedback component such as Modal, AlertDialog, Drawer, etc.
See Also
- Docs https://chakra-ui.com/docs/hooks/use-disclosure

function useDrawerStyles

useDrawerStyles: () => Record<string, import('../..').SystemStyleObject>;

function useEditableStyles

useEditableStyles: () => Record<string, import('../..').SystemStyleObject>;

function useElementRect

useElementRect: () => {
    ref: import('react').RefObject<HTMLElement | null>;
    rect: DOMRect | null;
};

function useEmptyStateStyles

useEmptyStateStyles: () => Record<string, import('../..').SystemStyleObject>;

function useFieldStyles

useFieldStyles: () => Record<string, import('../..').SystemStyleObject>;

function useFileUploadStyles

useFileUploadStyles: () => Record<string, import('../..').SystemStyleObject>;

function useForceUpdate

useForceUpdate: () => any;

function useHoverCardStyles

useHoverCardStyles: () => Record<string, import('../..').SystemStyleObject>;

function useListCollection

useListCollection: <T>(props: UseListCollectionProps<T>) => {
    collection: ListCollection<T>;
    filter: (inputValue: string) => void;
    set: (items: T[]) => void | undefined;
    reset: () => void | undefined;
    clear: () => void | undefined;
    insert: (index: number, ...items: T[]) => void | undefined;
    insertBefore: (value: string, ...items: T[]) => void | undefined;
    insertAfter: (value: string, ...items: T[]) => void | undefined;
    remove: (...args: T[]) => void | undefined;
    move: (value: string, to: number) => void | undefined;
    moveBefore: (value: string, ...values: string[]) => void | undefined;
    moveAfter: (value: string, ...values: string[]) => void | undefined;
    reorder: (from: number, to: number) => void | undefined;
    append: (...args: T[]) => void | undefined;
    prepend: (...args: T[]) => void | undefined;
    update: (value: string, item: T) => void | undefined;
};

function useListStyles

useListStyles: () => Record<string, import('../..').SystemStyleObject>;

function useLiveRef

useLiveRef: <T>(value: T) => any;

function useMediaQuery

useMediaQuery: (query: string[], options?: UseMediaQueryOptions) => boolean[];

function useMenuStyles

useMenuStyles: () => Record<string, import('../..').SystemStyleObject>;

function useNativeSelectStyles

useNativeSelectStyles: () => Record<string, import('../..').SystemStyleObject>;

function useNumberInputStyles

useNumberInputStyles: () => Record<string, import('../..').SystemStyleObject>;

function usePaginationStyles

usePaginationStyles: () => Record<string, import('../..').SystemStyleObject>;

function useParentRecipeProps

useParentRecipeProps: () => {
    recipe?: import('./recipe.types').RecipeDefinition | undefined;
};

function usePinInputStyles

usePinInputStyles: () => Record<string, import('../..').SystemStyleObject>;

function usePopoverStyles

usePopoverStyles: () => Record<string, import('../..').SystemStyleObject>;

function usePrevious

usePrevious: <T>(value: T) => T | undefined;

function useProgressCircleStyles

useProgressCircleStyles: () => Record<string, import('../..').SystemStyleObject>;

function useProgressStyles

useProgressStyles: () => Record<string, import('../..').SystemStyleObject>;

function useQrCodeStyles

useQrCodeStyles: () => Record<string, import('../..').SystemStyleObject>;

function useRadioCardStyles

useRadioCardStyles: () => Record<string, import('../..').SystemStyleObject>;

function useRadioGroupStyles

useRadioGroupStyles: () => Record<string, import('../..').SystemStyleObject>;

function useRatingGroupStyles

useRatingGroupStyles: () => Record<string, import('../..').SystemStyleObject>;

function useRecipe

useRecipe: {
    <Options extends { key: RecipeKey; recipe?: RecipeDefinition | undefined }>(
        options: Options
    ): Options['key'] extends keyof ConfigRecipes
        ? ConfigRecipes[Options['key']]
        : SystemRecipeFn<{}, {}>;
    <Options extends { recipe: RecipeDefinition<RecipeVariantRecord> }>(
        options: Options
    ): Options['recipe'] extends RecipeDefinition<
        infer T extends RecipeVariantRecord
    >
        ? SystemRecipeFn<RecipeVariantProps<Options['recipe']>, RecipeVariantMap<T>>
        : never;
};

function useSegmentGroupStyles

useSegmentGroupStyles: () => Record<string, import('../..').SystemStyleObject>;

function useSelectStyles

useSelectStyles: () => Record<string, import('../..').SystemStyleObject>;

function useSliderStyles

useSliderStyles: () => Record<string, import('../..').SystemStyleObject>;

function useSlotRecipe

useSlotRecipe: {
    <Options extends { key: SlotRecipeKey; recipe?: SlotRecipeConfig | undefined }>(
        options: Options
    ): Options['key'] extends keyof ConfigSlotRecipes
        ? ConfigSlotRecipes[Options['key']]
        : SystemSlotRecipeFn<string, {}, {}>;
    <
        Options extends {
            recipe: SlotRecipeConfig<string, SlotRecipeVariantRecord<string>>;
        }
    >(
        options: Options
    ): Options['recipe'] extends SlotRecipeConfig<
        infer S extends string,
        infer T extends SlotRecipeVariantRecord<infer S extends string>
    >
        ? SystemSlotRecipeFn<
              S,
              RecipeVariantProps<Options['recipe']>,
              RecipeVariantMap<T>
          >
        : never;
};

function useStatStyles

useStatStyles: () => Record<string, import('../..').SystemStyleObject>;

function useStatusStyles

useStatusStyles: () => Record<string, import('../..').SystemStyleObject>;

function useStepsStyles

useStepsStyles: () => Record<string, import('../..').SystemStyleObject>;

function useSwitchStyles

useSwitchStyles: () => Record<string, import('../..').SystemStyleObject>;

function useTableStyles

useTableStyles: () => Record<string, SystemStyleObject>;

function useTabsStyles

useTabsStyles: () => Record<string, import('../..').SystemStyleObject>;

function useTagStyles

useTagStyles: () => Record<string, import('../..').SystemStyleObject>;

function useTimelineStyles

useTimelineStyles: () => Record<string, import('../..').SystemStyleObject>;

function useToastStyles

useToastStyles: () => Record<string, import('../..').SystemStyleObject>;

function useToggleStyles

useToggleStyles: () => Record<string, import('../..').SystemStyleObject>;

function useToken

useToken: (category: string, token: string | string[]) => string[];

function useTooltipStyles

useTooltipStyles: () => Record<string, import('../..').SystemStyleObject>;

Interfaces

interface AbsoluteCenterProps

interface AbsoluteCenterProps extends HTMLChakraProps<'div'> {}

property axis

axis?: 'horizontal' | 'vertical' | 'both';

interface AccordionFocusChangeDetails

interface AccordionFocusChangeDetails extends ArkAccordion.FocusChangeDetails {}

interface AccordionItemBodyProps

interface AccordionItemBodyProps extends HTMLChakraProps<'div'> {}

interface AccordionItemContentProps

interface AccordionItemContentProps
    extends HTMLChakraProps<'div', ArkAccordion.ItemContentBaseProps> {}

interface AccordionItemIndicatorProps

interface AccordionItemIndicatorProps
    extends HTMLChakraProps<'button', ArkAccordion.ItemIndicatorBaseProps> {}

interface AccordionItemProps

interface AccordionItemProps
    extends HTMLChakraProps<'div', ArkAccordion.ItemBaseProps> {}

interface AccordionItemTriggerProps

interface AccordionItemTriggerProps
    extends HTMLChakraProps<'button', ArkAccordion.ItemTriggerBaseProps> {}

interface AccordionRootProps

interface AccordionRootProps
    extends HTMLChakraProps<'div', AccordionRootBaseProps> {}

interface AccordionRootProviderProps

interface AccordionRootProviderProps
    extends HTMLChakraProps<'div', AccordionRootProviderBaseProps> {}

interface AccordionValueChangeDetails

interface AccordionValueChangeDetails extends ArkAccordion.ValueChangeDetails {}

interface ActionBarCloseTriggerProps

interface ActionBarCloseTriggerProps
    extends HTMLChakraProps<'button', ArkPopover.CloseTriggerProps> {}

interface ActionBarContentProps

interface ActionBarContentProps
    extends HTMLChakraProps<'div', ArkPopover.ContentBaseProps> {}

interface ActionBarOpenChangeDetails

interface ActionBarOpenChangeDetails extends ArkPopover.OpenChangeDetails {}

interface ActionBarPositionerProps

interface ActionBarPositionerProps extends HTMLChakraProps<'div'> {}

interface ActionBarRootProps

interface ActionBarRootProps extends Omit<ActionBarRootBaseProps, 'positioning'> {}

property children

children: React.ReactNode;

interface ActionBarRootProviderProps

interface ActionBarRootProviderProps extends ActionBarRootProviderBaseProps {}

interface ActionBarSelectionTriggerProps

interface ActionBarSelectionTriggerProps extends HTMLChakraProps<'button'> {}

interface ActionBarSeparatorProps

interface ActionBarSeparatorProps extends HTMLChakraProps<'div'> {}

interface AlertContentProps

interface AlertContentProps extends HTMLChakraProps<'div'> {}

interface AlertDescriptionProps

interface AlertDescriptionProps extends HTMLChakraProps<'div'> {}

interface AlertIndicatorProps

interface AlertIndicatorProps extends HTMLChakraProps<'span'> {}

interface AlertRootProps

interface AlertRootProps extends HTMLChakraProps<'div', AlertRootBaseProps> {}

interface AlertTitleProps

interface AlertTitleProps extends HTMLChakraProps<'div'> {}

interface AspectRatioProps

interface AspectRatioProps extends Omit<HTMLChakraProps<'div'>, 'aspectRatio'> {}

property ratio

ratio?: ConditionalValue<number>;

The aspect ratio of the Box. Common values are:
21/9, 16/9, 9/16, 4/3, 1.85/1

interface AvatarFallbackProps

interface AvatarFallbackProps
    extends HTMLChakraProps<'div', ArkAvatar.FallbackProps> {}

property name

name?: string;

The name to derive the initials from. If not provided, the fallback will display a generic icon.

interface AvatarGroupProps

interface AvatarGroupProps extends GroupProps, SlotRecipeProps<'avatar'> {}

interface AvatarIconProps

interface AvatarIconProps extends HTMLChakraProps<'svg'> {}

interface AvatarImageProps

interface AvatarImageProps extends HTMLChakraProps<'img', ArkAvatar.ImageProps> {}

interface AvatarRootProps

interface AvatarRootProps extends HTMLChakraProps<'div', AvatarRootBaseProps> {}

interface AvatarStatusChangeDetails

interface AvatarStatusChangeDetails extends ArkAvatar.StatusChangeDetails {}

interface BadgeProps

interface BadgeProps extends HTMLChakraProps<'span', BadgeBaseProps> {}

interface BleedProps

interface BleedProps extends HTMLChakraProps<'div'> {}

property block

block?: SystemStyleObject['marginBlock'];

The negative margin on the y-axis

property blockEnd

blockEnd?: SystemStyleObject['marginBlockEnd'];

The negative margin on the block-end axis

property blockStart

blockStart?: SystemStyleObject['marginBlockStart'];

The negative margin on the block-start axis

property inline

inline?: SystemStyleObject['marginInline'];

The negative margin on the x-axis

property inlineEnd

inlineEnd?: SystemStyleObject['marginInlineEnd'];

The negative margin on the inline-end axis

property inlineStart

inlineStart?: SystemStyleObject['marginInlineStart'];

The negative margin on the inline-start axis

interface BlockquoteCaptionProps

interface BlockquoteCaptionProps extends HTMLChakraProps<'figcaption'> {}

interface BlockquoteContentProps

interface BlockquoteContentProps extends HTMLChakraProps<'blockquote'> {}

interface BlockquoteIconProps

interface BlockquoteIconProps extends HTMLChakraProps<'svg'> {}

interface BlockquoteRootProps

interface BlockquoteRootProps
    extends HTMLChakraProps<'figure', BlockquoteRootBaseProps> {}

interface BoxProps

interface BoxProps extends HTMLChakraProps<'div'> {}

interface BreadcrumbCurrentLinkProps

interface BreadcrumbCurrentLinkProps extends HTMLChakraProps<'span'> {}

interface BreadcrumbEllipsisProps

interface BreadcrumbEllipsisProps extends HTMLChakraProps<'span'> {}

interface BreadcrumbItemProps

interface BreadcrumbItemProps extends HTMLChakraProps<'li'> {}

interface BreadcrumbLinkProps

interface BreadcrumbLinkProps extends HTMLChakraProps<'a'> {}

interface BreadcrumbListProps

interface BreadcrumbListProps extends HTMLChakraProps<'ol'> {}

interface BreadcrumbRootProps

interface BreadcrumbRootProps
    extends HTMLChakraProps<'nav', BreadcrumbRootBaseProps> {}

interface BreadcrumbSeparatorProps

interface BreadcrumbSeparatorProps extends HTMLChakraProps<'li'> {}

interface ButtonGroupProps

interface ButtonGroupProps extends GroupProps, RecipeProps<'button'> {}

interface ButtonProps

interface ButtonProps extends HTMLChakraProps<'button', ButtonBaseProps> {}

interface CardBodyProps

interface CardBodyProps extends HTMLChakraProps<'div'> {}

interface CardDescriptionProps

interface CardDescriptionProps extends HTMLChakraProps<'p'> {}

interface CardFooterProps

interface CardFooterProps extends HTMLChakraProps<'div'> {}

interface CardHeaderProps

interface CardHeaderProps extends HTMLChakraProps<'div'> {}

interface CardRootProps

interface CardRootProps extends HTMLChakraProps<'div', CardRootBaseProps> {}

interface CardTitleProps

interface CardTitleProps extends HTMLChakraProps<'h2'> {}

interface CenterProps

interface CenterProps extends HTMLChakraProps<'div'> {}

interface ChakraProviderProps

interface ChakraProviderProps {}

property children

children: React.ReactNode;

property value

value: SystemContext;

interface CheckboxCardAddonProps

interface CheckboxCardAddonProps extends HTMLChakraProps<'div'> {}

interface CheckboxCardCheckedChangeDetails

interface CheckboxCardCheckedChangeDetails
    extends ArkCheckbox.CheckedChangeDetails {}

interface CheckboxCardContentProps

interface CheckboxCardContentProps extends HTMLChakraProps<'div'> {}

interface CheckboxCardControlProps

interface CheckboxCardControlProps
    extends HTMLChakraProps<'div', ArkCheckbox.ControlBaseProps> {}

interface CheckboxCardDescriptionProps

interface CheckboxCardDescriptionProps extends HTMLChakraProps<'div'> {}

interface CheckboxCardIndicatorProps

interface CheckboxCardIndicatorProps extends HTMLChakraProps<'svg'> {}

interface CheckboxCardLabelProps

interface CheckboxCardLabelProps
    extends HTMLChakraProps<'span', ArkCheckbox.LabelBaseProps> {}

interface CheckboxCardRootProps

interface CheckboxCardRootProps
    extends HTMLChakraProps<'label', CheckboxCardRootBaseProps> {}

interface CheckboxCardRootProviderProps

interface CheckboxCardRootProviderProps
    extends HTMLChakraProps<'label', CheckboxCardRootProviderBaseProps> {}

interface CheckboxCheckedChangeDetails

interface CheckboxCheckedChangeDetails extends ArkCheckbox.CheckedChangeDetails {}

interface CheckboxControlProps

interface CheckboxControlProps
    extends HTMLChakraProps<'div', ArkCheckbox.ControlBaseProps> {}

interface CheckboxGroupProps

interface CheckboxGroupProps
    extends HTMLChakraProps<'div', ArkCheckbox.GroupBaseProps> {}

interface CheckboxIndicatorProps

interface CheckboxIndicatorProps extends HTMLChakraProps<'svg'> {}

property checked

checked?: React.ReactElement;

property indeterminate

indeterminate?: React.ReactElement;

interface CheckboxLabelProps

interface CheckboxLabelProps
    extends HTMLChakraProps<'span', ArkCheckbox.LabelBaseProps> {}

interface CheckboxRootProps

interface CheckboxRootProps
    extends HTMLChakraProps<'label', CheckboxRootBaseProps> {}

interface CheckboxRootProviderProps

interface CheckboxRootProviderProps
    extends HTMLChakraProps<'div', CheckboxRootProviderBaseProps> {}

interface CheckmarkProps

interface CheckmarkProps
    extends HTMLChakraProps<'svg', RecipeProps<'checkmark'>>,
        UnstyledProp {}

property checked

checked?: boolean;

Whether the checkmark is checked

property disabled

disabled?: boolean;

Whether the checkmark is disabled

property indeterminate

indeterminate?: boolean;

Whether the checkmark is indeterminate

interface CircleProps

interface CircleProps extends SquareProps {}

interface ClientOnlyProps

interface ClientOnlyProps {}

property children

children: React.ReactNode;

property fallback

fallback?: React.ReactNode;

interface ClipboardControlProps

interface ClipboardControlProps
    extends HTMLChakraProps<'div', ArkClipboard.ControlProps> {}

interface ClipboardCopyStatusDetails

interface ClipboardCopyStatusDetails extends ArkClipboard.CopyStatusDetails {}

interface ClipboardIndicatorProps

interface ClipboardIndicatorProps
    extends HTMLChakraProps<'div', ArkClipboard.IndicatorProps> {}

interface ClipboardInputProps

interface ClipboardInputProps
    extends HTMLChakraProps<'input', ArkClipboard.InputProps> {}

interface ClipboardLabelProps

interface ClipboardLabelProps
    extends HTMLChakraProps<'label', ArkClipboard.LabelProps> {}

interface ClipboardRootProps

interface ClipboardRootProps
    extends HTMLChakraProps<'div', ClipboardRootBaseProps> {}

interface ClipboardRootProviderProps

interface ClipboardRootProviderProps
    extends HTMLChakraProps<'div', ClipboardRootProviderBaseProps> {}

interface ClipboardTriggerProps

interface ClipboardTriggerProps
    extends HTMLChakraProps<'button', ArkClipboard.TriggerProps> {}

interface ClipboardValueTextProps

interface ClipboardValueTextProps
    extends HTMLChakraProps<'div', ArkClipboard.ValueTextProps> {}

interface CloseButtonProps

interface CloseButtonProps extends IconButtonProps {}

interface CodeProps

interface CodeProps extends HTMLChakraProps<'code', CodeBaseProps> {}

interface CollapsibleContentProps

interface CollapsibleContentProps
    extends HTMLChakraProps<'div', ArkCollapsible.ContentBaseProps> {}

interface CollapsibleOpenChangeDetails

interface CollapsibleOpenChangeDetails extends ArkCollapsible.OpenChangeDetails {}

interface CollapsibleRootProps

interface CollapsibleRootProps
    extends HTMLChakraProps<'div', CollapsibleRootBaseProps> {}

interface CollapsibleRootProviderProps

interface CollapsibleRootProviderProps
    extends HTMLChakraProps<'div', CollapsibleRootProviderBaseProps> {}

interface CollapsibleTriggerProps

interface CollapsibleTriggerProps
    extends HTMLChakraProps<'button', ArkCollapsible.TriggerBaseProps> {}

interface ColorPickerAreaBackgroundProps

interface ColorPickerAreaBackgroundProps
    extends HTMLChakraProps<'div', ArkColorPicker.AreaBackgroundBaseProps> {}

interface ColorPickerAreaProps

interface ColorPickerAreaProps
    extends HTMLChakraProps<'div', ArkColorPicker.AreaBaseProps> {}

interface ColorPickerAreaThumbProps

interface ColorPickerAreaThumbProps
    extends HTMLChakraProps<'div', ArkColorPicker.AreaThumbBaseProps> {}

interface ColorPickerChannelInputProps

interface ColorPickerChannelInputProps
    extends HTMLChakraProps<'input', ArkColorPicker.ChannelInputBaseProps> {}

interface ColorPickerChannelSliderLabelProps

interface ColorPickerChannelSliderLabelProps
    extends HTMLChakraProps<'div', ArkColorPicker.ChannelSliderLabelBaseProps> {}

interface ColorPickerChannelSliderProps

interface ColorPickerChannelSliderProps
    extends HTMLChakraProps<'div', ArkColorPicker.ChannelSliderBaseProps> {}

interface ColorPickerChannelSliderThumbProps

interface ColorPickerChannelSliderThumbProps
    extends HTMLChakraProps<'div', ArkColorPicker.ChannelSliderThumbBaseProps> {}

interface ColorPickerChannelSliderTrackProps

interface ColorPickerChannelSliderTrackProps
    extends HTMLChakraProps<'div', ArkColorPicker.ChannelSliderTrackBaseProps> {}

interface ColorPickerChannelSliderValueTextProps

interface ColorPickerChannelSliderValueTextProps
    extends HTMLChakraProps<'div', ArkColorPicker.ChannelSliderValueTextBaseProps> {}

interface ColorPickerChannelTextProps

interface ColorPickerChannelTextProps extends HTMLChakraProps<'span'> {}

interface ColorPickerContentProps

interface ColorPickerContentProps
    extends HTMLChakraProps<'div', ArkColorPicker.ContentBaseProps> {}

interface ColorPickerControlProps

interface ColorPickerControlProps
    extends HTMLChakraProps<'div', ArkColorPicker.ControlBaseProps> {}

interface ColorPickerEyeDropperProps

interface ColorPickerEyeDropperProps extends IconButtonProps {}

interface ColorPickerEyeDropperTriggerProps

interface ColorPickerEyeDropperTriggerProps extends IconButtonProps {}

interface ColorPickerFormatSelectProps

interface ColorPickerFormatSelectProps
    extends HTMLChakraProps<'select', ArkColorPicker.FormatSelectBaseProps> {}

interface ColorPickerFormatTriggerProps

interface ColorPickerFormatTriggerProps
    extends HTMLChakraProps<'button', ArkColorPicker.FormatTriggerBaseProps> {}

interface ColorPickerLabelProps

interface ColorPickerLabelProps
    extends HTMLChakraProps<'label', ArkColorPicker.LabelBaseProps> {}

interface ColorPickerPositionerProps

interface ColorPickerPositionerProps
    extends HTMLChakraProps<'div', ArkColorPicker.PositionerBaseProps> {}

interface ColorPickerRootProps

interface ColorPickerRootProps
    extends HTMLChakraProps<'div', ColorPickerRootBaseProps> {}

interface ColorPickerRootProviderProps

interface ColorPickerRootProviderProps
    extends HTMLChakraProps<'div', ColorPickerRootProviderBaseProps> {}

interface ColorPickerSwatchGroupProps

interface ColorPickerSwatchGroupProps
    extends HTMLChakraProps<'div', ArkColorPicker.SwatchGroupBaseProps> {}

interface ColorPickerSwatchIndicatorProps

interface ColorPickerSwatchIndicatorProps
    extends HTMLChakraProps<'div', ArkColorPicker.SwatchIndicatorBaseProps> {}

interface ColorPickerSwatchProps

interface ColorPickerSwatchProps
    extends HTMLChakraProps<'div', ArkColorPicker.SwatchBaseProps> {}

interface ColorPickerSwatchTriggerProps

interface ColorPickerSwatchTriggerProps
    extends HTMLChakraProps<'button', ArkColorPicker.SwatchTriggerBaseProps> {}

interface ColorPickerTransparencyGridProps

interface ColorPickerTransparencyGridProps
    extends HTMLChakraProps<'div', ArkColorPicker.TransparencyGridBaseProps> {}

interface ColorPickerTriggerProps

interface ColorPickerTriggerProps
    extends HTMLChakraProps<'button', ArkColorPicker.TriggerBaseProps> {}

interface ColorPickerValueChangeDetails

interface ColorPickerValueChangeDetails extends ArkColorPicker.ValueChangeDetails {}

interface ColorPickerValueSwatchProps

interface ColorPickerValueSwatchProps
    extends HTMLChakraProps<'div', ArkColorPicker.ValueSwatchBaseProps> {}

interface ColorPickerValueTextProps

interface ColorPickerValueTextProps
    extends HTMLChakraProps<'div', ArkColorPicker.ValueTextBaseProps> {}

interface ColorPickerViewProps

interface ColorPickerViewProps
    extends HTMLChakraProps<'div', ArkColorPicker.ViewBaseProps> {}

interface ColorSwatchBaseProps

interface ColorSwatchBaseProps extends UnstyledProp, RecipeProps<'colorSwatch'> {}

property value

value: string;

interface ColorSwatchMixProps

interface ColorSwatchMixProps extends Omit<ColorSwatchProps, 'value'> {}

property items

items: string[];

interface ColorSwatchProps

interface ColorSwatchProps
    extends Assign<HTMLChakraProps<'span'>, ColorSwatchBaseProps> {}

interface ComboboxClearTriggerProps

interface ComboboxClearTriggerProps
    extends HTMLChakraProps<'button', ArkCombobox.ClearTriggerBaseProps> {}

interface ComboboxContentProps

interface ComboboxContentProps
    extends HTMLChakraProps<'div', ArkCombobox.ContentBaseProps> {}

interface ComboboxControlProps

interface ComboboxControlProps
    extends HTMLChakraProps<'div', ArkCombobox.ControlBaseProps> {}

interface ComboboxEmptyProps

interface ComboboxEmptyProps extends HTMLChakraProps<'div'> {}

interface ComboboxHighlightChangeDetails

interface ComboboxHighlightChangeDetails<T extends CollectionItem = any>
    extends ArkCombobox.HighlightChangeDetails<T> {}

interface ComboboxIndicatorGroupProps

interface ComboboxIndicatorGroupProps extends HTMLChakraProps<'div'> {}

interface ComboboxInputProps

interface ComboboxInputProps
    extends HTMLChakraProps<'input', ArkCombobox.InputBaseProps> {}

interface ComboboxInputValueChangeDetails

interface ComboboxInputValueChangeDetails
    extends ArkCombobox.InputValueChangeDetails {}

interface ComboboxItemGroupLabelProps

interface ComboboxItemGroupLabelProps
    extends HTMLChakraProps<'div', ArkCombobox.ItemGroupLabelBaseProps> {}

interface ComboboxItemGroupProps

interface ComboboxItemGroupProps
    extends HTMLChakraProps<'div', ArkCombobox.ItemGroupBaseProps> {}

interface ComboboxItemIndicatorProps

interface ComboboxItemIndicatorProps
    extends HTMLChakraProps<'div', ArkCombobox.ItemIndicatorBaseProps> {}

interface ComboboxItemProps

interface ComboboxItemProps
    extends HTMLChakraProps<'div', ArkCombobox.ItemBaseProps> {}

interface ComboboxItemTextProps

interface ComboboxItemTextProps
    extends HTMLChakraProps<'div', ArkCombobox.ItemTextBaseProps> {}

interface ComboboxLabelProps

interface ComboboxLabelProps
    extends HTMLChakraProps<'label', ArkCombobox.LabelBaseProps> {}

interface ComboboxOpenChangeDetails

interface ComboboxOpenChangeDetails extends ArkCombobox.OpenChangeDetails {}

interface ComboboxPositionerProps

interface ComboboxPositionerProps
    extends HTMLChakraProps<'div', ArkCombobox.PositionerBaseProps> {}

interface ComboboxRootProps

interface ComboboxRootProps<T extends CollectionItem = any>
    extends HTMLChakraProps<'div', ComboboxRootBaseProps<T>> {}

interface ComboboxRootProviderProps

interface ComboboxRootProviderProps<T extends CollectionItem = any>
    extends HTMLChakraProps<'div', ComboboxRootProviderBaseProps<T>> {}

interface ComboboxTriggerProps

interface ComboboxTriggerProps
    extends HTMLChakraProps<'button', ArkCombobox.TriggerBaseProps> {}

interface ComboboxValueChangeDetails

interface ComboboxValueChangeDetails<T extends CollectionItem = any>
    extends ArkCombobox.ValueChangeDetails<T> {}

interface CompositionStyles

interface CompositionStyles {}

property animationStyles

animationStyles: AnimationStyles;

property layerStyles

layerStyles: LayerStyles;

property textStyles

textStyles: TextStyles;

interface ConfigRecipeSlots

interface ConfigRecipeSlots {}

property accordion

accordion: AccordionSlot;

property actionBar

actionBar: ActionBarSlot;

property alert

alert: AlertSlot;

property avatar

avatar: AvatarSlot;

property blockquote

blockquote: BlockquoteSlot;

breadcrumb: BreadcrumbSlot;

property card

card: CardSlot;

property checkbox

checkbox: CheckboxSlot;

property checkboxCard

checkboxCard: CheckboxCardSlot;

property collapsible

collapsible: CollapsibleSlot;

property colorPicker

colorPicker: ColorPickerSlot;

property combobox

combobox: ComboboxSlot;

property dataList

dataList: DataListSlot;

property dialog

dialog: DialogSlot;

property drawer

drawer: DrawerSlot;

property editable

editable: EditableSlot;

property emptyState

emptyState: EmptyStateSlot;

property field

field: FieldSlot;

property fieldset

fieldset: FieldsetSlot;

property fileUpload

fileUpload: FileUploadSlot;

property hoverCard

hoverCard: HoverCardSlot;

property list

list: ListSlot;

menu: MenuSlot;

property nativeSelect

nativeSelect: NativeSelectSlot;

property numberInput

numberInput: NumberInputSlot;

property pinInput

pinInput: PinInputSlot;

property popover

popover: PopoverSlot;

property progress

progress: ProgressSlot;

property progressCircle

progressCircle: ProgressCircleSlot;

property qrCode

qrCode: QrCodeSlot;

property radioCard

radioCard: RadioCardSlot;

property radioGroup

radioGroup: RadioGroupSlot;

property ratingGroup

ratingGroup: RatingGroupSlot;

property segmentGroup

segmentGroup: SegmentGroupSlot;

property select

select: SelectSlot;

property slider

slider: SliderSlot;

property stat

stat: StatSlot;

property status

status: StatusSlot;

property steps

steps: StepsSlot;

property switch

switch: SwitchSlot;

property table

table: TableSlot;

property tabs

tabs: TabsSlot;

property tag

tag: TagSlot;

property timeline

timeline: TimelineSlot;

property toast

toast: ToastSlot;

property tooltip

tooltip: TooltipSlot;

interface ContainerProps

interface ContainerProps extends HTMLChakraProps<'div', ContainerBaseProps> {}

interface CreateOverlayProps

interface CreateOverlayProps {}

Props that are injected into the overlay component by the createOverlay function. These props are used to control the overlay's state and lifecycle.

property onExitComplete

onExitComplete?: () => void;

Callback fired when the overlay's exit animation completes

property onOpenChange

onOpenChange?: (e: { open: boolean }) => void;

Callback fired when the overlay's open state changes

property open

open?: boolean;

Whether the overlay is currently open

property setExitComplete

setExitComplete?: (() => void) | undefined;

Internal callback used to signal when the exit animation is complete

property setReturnValue

setReturnValue?: ((value: unknown) => void) | undefined;

Internal callback used to set the return value when the overlay closes

interface CreateOverlayReturn

interface CreateOverlayReturn<T extends CreateOverlayProps> {}

property close

close: (id: string, value?: any) => Promise<void>;

Closes the overlay with the given id and returns the value

property get

get: (id: string) => T;

Gets the props of the overlay with the given id

property getSnapshot

getSnapshot: () => T[];

Gets the current snapshot of the overlays

property open

open: (id: string, props: T) => Promise<any>;

Opens a new overlay with the given id and props

property remove

remove: (id: string) => void;

Removes the overlay with the given id

property removeAll

removeAll: () => void;

Removes all overlays

property update

update: (id: string, props: T) => void;

Updates the props of the overlay with the given id

property Viewport

Viewport: React.ElementType;

The root component for the overlay

property waitForExit

waitForExit: (id: string) => Promise<void>;

Waits for the exit animation to complete for the overlay with the given id

interface CssKeyframes

interface CssKeyframes {}

index signature

[name: string]: {
    [time: string]: CssProperties;
};

interface DataListItemLabelProps

interface DataListItemLabelProps extends HTMLChakraProps<'dt'> {}

interface DataListItemProps

interface DataListItemProps extends HTMLChakraProps<'div'> {}

interface DataListItemValueProps

interface DataListItemValueProps extends HTMLChakraProps<'dd'> {}

interface DataListRootProps

interface DataListRootProps extends HTMLChakraProps<'dl', DataListRootBaseProps> {}

interface DialogActionTriggerProps

interface DialogActionTriggerProps extends HTMLChakraProps<'button'> {}

interface DialogBackdropProps

interface DialogBackdropProps
    extends HTMLChakraProps<'div', ArkDialog.BackdropBaseProps> {}

interface DialogBodyProps

interface DialogBodyProps extends HTMLChakraProps<'div'> {}

interface DialogCloseTriggerProps

interface DialogCloseTriggerProps
    extends HTMLChakraProps<'button', ArkDialog.CloseTriggerBaseProps> {}

interface DialogContentProps

interface DialogContentProps
    extends HTMLChakraProps<'section', ArkDialog.ContentBaseProps> {}

interface DialogDescriptionProps

interface DialogDescriptionProps
    extends HTMLChakraProps<'p', ArkDialog.DescriptionBaseProps> {}

interface DialogFooterProps

interface DialogFooterProps extends HTMLChakraProps<'footer'> {}

interface DialogHeaderProps

interface DialogHeaderProps extends HTMLChakraProps<'div'> {}

interface DialogOpenChangeDetails

interface DialogOpenChangeDetails extends ArkDialog.OpenChangeDetails {}

interface DialogPositionerProps

interface DialogPositionerProps
    extends HTMLChakraProps<'div', ArkDialog.PositionerBaseProps> {}

interface DialogRootProps

interface DialogRootProps extends DialogRootBaseProps {}

property children

children: React.ReactNode;

interface DialogRootProviderProps

interface DialogRootProviderProps extends DialogRootProviderBaseProps {}

property children

children: React.ReactNode;

interface DialogTitleProps

interface DialogTitleProps extends HTMLChakraProps<'h2', ArkDialog.TitleBaseProps> {}

interface DialogTriggerProps

interface DialogTriggerProps
    extends HTMLChakraProps<'button', ArkDialog.TriggerBaseProps> {}

interface DownloadTriggerProps

interface DownloadTriggerProps
    extends HTMLChakraProps<'button'>,
        DownloadTriggerBaseProps {}

interface DrawerActionTriggerProps

interface DrawerActionTriggerProps extends HTMLChakraProps<'button'> {}

interface DrawerBackdropProps

interface DrawerBackdropProps
    extends HTMLChakraProps<'div', ArkDialog.BackdropBaseProps> {}

interface DrawerBodyProps

interface DrawerBodyProps extends HTMLChakraProps<'div'> {}

interface DrawerCloseTriggerProps

interface DrawerCloseTriggerProps
    extends HTMLChakraProps<'button', ArkDialog.CloseTriggerBaseProps> {}

interface DrawerContentProps

interface DrawerContentProps
    extends HTMLChakraProps<'section', ArkDialog.ContentBaseProps> {}

interface DrawerDescriptionProps

interface DrawerDescriptionProps
    extends HTMLChakraProps<'p', ArkDialog.DescriptionBaseProps> {}

interface DrawerFooterProps

interface DrawerFooterProps extends HTMLChakraProps<'footer'> {}

interface DrawerHeaderProps

interface DrawerHeaderProps extends HTMLChakraProps<'div'> {}

interface DrawerOpenChangeDetails

interface DrawerOpenChangeDetails extends ArkDialog.OpenChangeDetails {}

interface DrawerPositionerProps

interface DrawerPositionerProps
    extends HTMLChakraProps<'div', ArkDialog.PositionerBaseProps> {}

interface DrawerRootProps

interface DrawerRootProps extends DrawerRootBaseProps {}

property children

children: React.ReactNode;

interface DrawerRootProviderProps

interface DrawerRootProviderProps extends DrawerRootProviderBaseProps {}

property children

children: React.ReactNode;

interface DrawerTitleProps

interface DrawerTitleProps extends HTMLChakraProps<'h2', ArkDialog.TitleBaseProps> {}

interface DrawerTriggerProps

interface DrawerTriggerProps
    extends HTMLChakraProps<'button', ArkDialog.TriggerBaseProps> {}

interface EditableAreaProps

interface EditableAreaProps
    extends HTMLChakraProps<'div', ArkEditable.AreaBaseProps> {}

interface EditableCancelTriggerProps

interface EditableCancelTriggerProps
    extends HTMLChakraProps<'button', ArkEditable.CancelTriggerBaseProps> {}

interface EditableControlProps

interface EditableControlProps
    extends HTMLChakraProps<'div', ArkEditable.ControlBaseProps> {}

interface EditableEditTriggerProps

interface EditableEditTriggerProps
    extends HTMLChakraProps<'button', ArkEditable.EditTriggerBaseProps> {}

interface EditableInputProps

interface EditableInputProps
    extends HTMLChakraProps<'input', ArkEditable.InputBaseProps> {}

interface EditablePreviewProps

interface EditablePreviewProps
    extends HTMLChakraProps<'span', ArkEditable.PreviewBaseProps> {}

interface EditableRootProps

interface EditableRootProps extends HTMLChakraProps<'div', EditableRootBaseProps> {}

interface EditableRootProviderProps

interface EditableRootProviderProps
    extends HTMLChakraProps<'div', EditableRootProviderBaseProps> {}

interface EditableSubmitTriggerProps

interface EditableSubmitTriggerProps
    extends HTMLChakraProps<'button', ArkEditable.SubmitTriggerBaseProps> {}

interface EditableTextareaProps

interface EditableTextareaProps
    extends HTMLChakraProps<'textarea', ArkEditable.InputBaseProps> {}

interface EditableValueChangeDetails

interface EditableValueChangeDetails extends ArkEditable.ValueChangeDetails {}

interface EmProps

interface EmProps extends HTMLChakraProps<'em'> {}

interface EmptyStateContentProps

interface EmptyStateContentProps extends HTMLChakraProps<'div'> {}

interface EmptyStateDescriptionProps

interface EmptyStateDescriptionProps extends HTMLChakraProps<'p'> {}

interface EmptyStateIndicatorProps

interface EmptyStateIndicatorProps extends HTMLChakraProps<'div'> {}

interface EmptyStateRootProps

interface EmptyStateRootProps
    extends HTMLChakraProps<'div', EmptyStateRootBaseProps> {}

interface EmptyStateTitleProps

interface EmptyStateTitleProps extends HTMLChakraProps<'h3'> {}

interface FieldErrorIconProps

interface FieldErrorIconProps extends HTMLChakraProps<'svg'> {}

interface FieldErrorTextProps

interface FieldErrorTextProps
    extends HTMLChakraProps<'div', ArkField.ErrorTextBaseProps> {}

interface FieldHelperTextProps

interface FieldHelperTextProps
    extends HTMLChakraProps<'div', ArkField.HelperTextBaseProps> {}

interface FieldLabelProps

interface FieldLabelProps
    extends HTMLChakraProps<'label', ArkField.LabelBaseProps> {}

interface FieldRequiredIndicatorProps

interface FieldRequiredIndicatorProps extends HTMLChakraProps<'span'> {}

property fallback

fallback?: React.ReactNode;

interface FieldRootProps

interface FieldRootProps extends HTMLChakraProps<'div', FieldRootBaseProps> {}

interface FieldsetContentProps

interface FieldsetContentProps extends HTMLChakraProps<'div'> {}

interface FieldsetErrorTextProps

interface FieldsetErrorTextProps
    extends HTMLChakraProps<'span', Fieldset.ErrorTextBaseProps> {}

interface FieldsetHelperTextProps

interface FieldsetHelperTextProps
    extends HTMLChakraProps<'span', Fieldset.HelperTextBaseProps> {}

interface FieldsetLegendProps

interface FieldsetLegendProps
    extends HTMLChakraProps<'legend', Fieldset.LegendBaseProps> {}

interface FieldsetRootProps

interface FieldsetRootProps
    extends HTMLChakraProps<'fieldset', FieldsetRootBaseProps> {}

interface FileUploadClearTriggerProps

interface FileUploadClearTriggerProps extends HTMLChakraProps<'button'> {}

interface FileUploadDropzoneContentProps

interface FileUploadDropzoneContentProps extends HTMLChakraProps<'div'> {}

interface FileUploadDropzoneProps

interface FileUploadDropzoneProps
    extends HTMLChakraProps<'li', ArkFileUpload.DropzoneBaseProps> {}

interface FileUploadFileAcceptDetails

interface FileUploadFileAcceptDetails extends ArkFileUpload.FileAcceptDetails {}

interface FileUploadFileChangeDetails

interface FileUploadFileChangeDetails extends ArkFileUpload.FileChangeDetails {}

interface FileUploadFileRejectDetails

interface FileUploadFileRejectDetails extends ArkFileUpload.FileRejectDetails {}

interface FileUploadFileTextProps

interface FileUploadFileTextProps extends HTMLChakraProps<'span'> {}

property fallback

fallback?: string;

interface FileUploadItemContentProps

interface FileUploadItemContentProps extends HTMLChakraProps<'div'> {}

interface FileUploadItemDeleteTriggerProps

interface FileUploadItemDeleteTriggerProps
    extends HTMLChakraProps<'button', ArkFileUpload.ItemDeleteTriggerBaseProps> {}

interface FileUploadItemGroupProps

interface FileUploadItemGroupProps
    extends HTMLChakraProps<'ul', ArkFileUpload.ItemGroupBaseProps> {}

interface FileUploadItemNameProps

interface FileUploadItemNameProps
    extends HTMLChakraProps<'span', ArkFileUpload.ItemNameBaseProps> {}

interface FileUploadItemPreviewImageProps

interface FileUploadItemPreviewImageProps
    extends HTMLChakraProps<'img', ArkFileUpload.ItemPreviewImageBaseProps> {}

interface FileUploadItemPreviewProps

interface FileUploadItemPreviewProps
    extends HTMLChakraProps<'div', ArkFileUpload.ItemPreviewBaseProps> {}

interface FileUploadItemProps

interface FileUploadItemProps
    extends HTMLChakraProps<'li', ArkFileUpload.ItemBaseProps> {}

interface FileUploadItemSizeTextProps

interface FileUploadItemSizeTextProps
    extends HTMLChakraProps<'span', ArkFileUpload.ItemSizeTextBaseProps> {}

interface FileUploadItemsProps

interface FileUploadItemsProps
    extends Omit<FileUploadItemProps, 'file'>,
        FileUploadItemsBaseProps {}

interface FileUploadLabelProps

interface FileUploadLabelProps
    extends HTMLChakraProps<'label', ArkFileUpload.LabelBaseProps> {}

interface FileUploadListProps

interface FileUploadListProps extends FileUploadItemsBaseProps {}

interface FileUploadRootProps

interface FileUploadRootProps
    extends HTMLChakraProps<'div', FileUploadRootBaseProps> {}

interface FileUploadRootProviderProps

interface FileUploadRootProviderProps
    extends HTMLChakraProps<'div', FileUploadRootProviderBaseProps> {}

interface FileUploadTriggerProps

interface FileUploadTriggerProps
    extends HTMLChakraProps<'button', ArkFileUpload.TriggerBaseProps> {}

interface FlexProps

interface FlexProps extends HTMLChakraProps<'div', FlexOptions> {}

interface FloatProps

interface FloatProps
    extends Omit<HTMLChakraProps<'div'>, keyof FloatOptions>,
        FloatOptions {}

interface FocusTrapProps

interface FocusTrapProps extends HTMLChakraProps<'div'>, FocusTrapBaseProps {}

interface FormatByteProps

interface FormatByteProps extends Format.ByteProps {}

interface FormatNumberProps

interface FormatNumberProps extends Format.NumberProps {}

interface ForProps

interface ForProps<T> {}

property children

children: (item: Exclude<T, undefined>, index: number) => React.ReactNode;

The render function to render each item in the array

property each

each: T[] | readonly T[] | undefined;

The array to iterate over

property fallback

fallback?: React.ReactNode;

The fallback content to render when the array is empty

interface GlobalStyleObject

interface GlobalStyleObject {}

index signature

[selector: string]: SystemStyleObject;

interface GridItemProps

interface GridItemProps extends BoxProps {}

property area

area?: SystemStyleObject['gridArea'];

property colEnd

colEnd?: ConditionalValue<number | 'auto'>;

property colSpan

colSpan?: ConditionalValue<number | 'auto'>;

property colStart

colStart?: ConditionalValue<number | 'auto'>;

property rowEnd

rowEnd?: ConditionalValue<number | 'auto'>;

property rowSpan

rowSpan?: ConditionalValue<number | 'auto'>;

property rowStart

rowStart?: ConditionalValue<number | 'auto'>;

interface GridProps

interface GridProps
    extends Omit<HTMLChakraProps<'div'>, keyof GridOptions>,
        GridOptions {}

interface GroupProps

interface GroupProps extends HTMLChakraProps<'div', VariantProps> {}

property align

align?: JsxStyleProps['alignItems'];

The alignItems style property

property justify

justify?: JsxStyleProps['justifyContent'];

The justifyContent style property

property skip

skip?: (child: React.ReactElement) => boolean;

A function that determines if a child should be skipped

property wrap

wrap?: JsxStyleProps['flexWrap'];

The flexWrap style property

interface HeadingProps

interface HeadingProps
    extends Assign<HTMLChakraProps<'h2'>, RecipeProps<'heading'>> {}

interface HighlightProps

interface HighlightProps {}

property children

children: string | ((props: HighlightChunk[]) => React.ReactNode);

property ignoreCase

ignoreCase?: boolean;

property matchAll

matchAll?: boolean;

property query

query: string | string[];

property styles

styles?: SystemStyleObject;

interface HoverCardArrowProps

interface HoverCardArrowProps
    extends HTMLChakraProps<'div', ArkHoverCard.ArrowBaseProps> {}

interface HoverCardArrowTipProps

interface HoverCardArrowTipProps
    extends HTMLChakraProps<'div', ArkHoverCard.ArrowTipBaseProps> {}

interface HoverCardContentProps

interface HoverCardContentProps
    extends HTMLChakraProps<'section', ArkHoverCard.ContentBaseProps> {}

interface HoverCardOpenChangeDetails

interface HoverCardOpenChangeDetails extends ArkHoverCard.OpenChangeDetails {}

interface HoverCardPositionerProps

interface HoverCardPositionerProps
    extends HTMLChakraProps<'div', ArkHoverCard.PositionerBaseProps> {}

interface HoverCardRootProps

interface HoverCardRootProps extends HoverCardRootBaseProps {}

property children

children: React.ReactNode;

interface HoverCardRootProviderProps

interface HoverCardRootProviderProps extends HoverCardRootProviderBaseProps {}

property children

children: React.ReactNode;

interface HoverCardTriggerProps

interface HoverCardTriggerProps
    extends HTMLChakraProps<'button', ArkHoverCard.TriggerBaseProps> {}

interface HtmlProps

interface HtmlProps {}

property htmlContent

htmlContent?: string | undefined;

property htmlHeight

htmlHeight?: string | number | undefined;

property htmlSize

htmlSize?: number | undefined;

property htmlTranslate

htmlTranslate?: 'yes' | 'no' | undefined;

property htmlWidth

htmlWidth?: string | number | undefined;

interface IconButtonProps

interface IconButtonProps extends ButtonProps {}

interface IconProps

interface IconProps extends HTMLChakraProps<'svg'>, RecipeProps<'icon'> {}

interface ImageProps

interface ImageProps extends HTMLChakraProps<'img', ImageOptions> {}

interface InputAddonProps

interface InputAddonProps
    extends HTMLChakraProps<'div'>,
        RecipeProps<'inputAddon'>,
        UnstyledProp {}

interface InputElementProps

interface InputElementProps extends HTMLChakraProps<'div'> {}

interface InputGroupProps

interface InputGroupProps extends BoxProps {}

property children

children: React.ReactElement<InputElementProps>;

property endAddon

endAddon?: React.ReactNode;

property endAddonProps

endAddonProps?: InputAddonProps;

property endElement

endElement?: React.ReactNode;

property endElementProps

endElementProps?: InputElementProps;

property endOffset

endOffset?: InputElementProps['paddingEnd'];

property startAddon

startAddon?: React.ReactNode;

property startAddonProps

startAddonProps?: InputAddonProps;

property startElement

startElement?: React.ReactNode;

property startElementProps

startElementProps?: InputElementProps;

property startOffset

startOffset?: InputElementProps['paddingStart'];

interface InputProps

interface InputProps extends HTMLChakraProps<'input', InputBaseProps> {}

interface JsxFactory

interface JsxFactory {}

call signature

<T extends ElementType>(component: T): ChakraComponent<T, {}>;

call signature

<T extends ElementType, P extends RecipeVariantRecord>(
    component: T,
    recipe: RecipeDefinition<P>,
    options?: JsxFactoryOptions<Assign<ComponentProps<T>, RecipeSelection<P>>>
): JsxElement<T, RecipeSelection<P>>;

interface JsxFactoryOptions

interface JsxFactoryOptions<TProps> {}

property defaultProps

defaultProps?: (Partial<TProps> & DataAttr) | undefined;

property forwardAsChild

forwardAsChild?: boolean | undefined;

property forwardProps

forwardProps?: string[] | undefined;

method shouldForwardProp

shouldForwardProp: (prop: string, variantKeys: string[]) => boolean;

interface JsxStyleProps

interface JsxStyleProps extends SystemProperties, MinimalNested<SystemStyleObject> {}

property css

css?:
    | SystemStyleObject
    | undefined
    | Omit<(SystemStyleObject | undefined)[], keyof any[]>;

interface KbdProps

interface KbdProps extends HTMLChakraProps<'kbd', KbdBaseProps> {}

interface LinkBoxProps

interface LinkBoxProps extends HTMLChakraProps<'div'> {}

interface LinkOverlayProps

interface LinkOverlayProps extends HTMLChakraProps<'a'> {}

interface LinkProps

interface LinkProps extends HTMLChakraProps<'a', LinkBaseProps> {}

interface ListIndicatorProps

interface ListIndicatorProps extends HTMLChakraProps<'span'> {}

interface ListItemProps

interface ListItemProps extends HTMLChakraProps<'li'> {}

interface ListRootProps

interface ListRootProps extends HTMLChakraProps<'ul', ListRootBaseProps> {}

interface LoaderOverlayProps

interface LoaderOverlayProps extends HTMLChakraProps<'div'> {}

interface LoaderProps

interface LoaderProps extends HTMLChakraProps<'span'> {}

property spinner

spinner?: React.ReactNode;

The spinner to display when loading

property spinnerPlacement

spinnerPlacement?: 'start' | 'end';

The placement of the spinner "start"

property text

text?: React.ReactNode;

The text to display when loading

property visible

visible?: boolean;

Whether the loader is visible true

interface MarkProps

interface MarkProps extends Assign<HTMLChakraProps<'mark'>, RecipeProps<'mark'>> {}

interface MenuArrowProps

interface MenuArrowProps extends HTMLChakraProps<'div', ArkMenu.ArrowBaseProps> {}

interface MenuArrowTipProps

interface MenuArrowTipProps
    extends HTMLChakraProps<'div', ArkMenu.ArrowTipBaseProps> {}

interface MenuCheckboxItemProps

interface MenuCheckboxItemProps
    extends HTMLChakraProps<'div', ArkMenu.CheckboxItemBaseProps> {}

interface MenuContentProps

interface MenuContentProps
    extends HTMLChakraProps<'div', ArkMenu.ContentBaseProps> {}

interface MenuContextTriggerProps

interface MenuContextTriggerProps
    extends HTMLChakraProps<'div', ArkMenu.ContextTriggerBaseProps> {}

interface MenuHighlightChangeDetails

interface MenuHighlightChangeDetails extends ArkMenu.HighlightChangeDetails {}

interface MenuIndicatorProps

interface MenuIndicatorProps
    extends HTMLChakraProps<'div', ArkMenu.IndicatorBaseProps> {}

interface MenuItemCommandProps

interface MenuItemCommandProps extends HTMLChakraProps<'kbd'> {}

interface MenuItemGroupLabelProps

interface MenuItemGroupLabelProps
    extends HTMLChakraProps<'div', ArkMenu.ItemGroupLabelBaseProps> {}

interface MenuItemGroupProps

interface MenuItemGroupProps
    extends HTMLChakraProps<'div', ArkMenu.ItemGroupBaseProps> {}

interface MenuItemIndicatorProps

interface MenuItemIndicatorProps
    extends HTMLChakraProps<'div', ArkMenu.ItemIndicatorBaseProps> {}

interface MenuItemProps

interface MenuItemProps extends HTMLChakraProps<'div', ArkMenu.ItemBaseProps> {}

interface MenuItemTextProps

interface MenuItemTextProps
    extends HTMLChakraProps<'div', ArkMenu.ItemTextBaseProps> {}

interface MenuOpenChangeDetails

interface MenuOpenChangeDetails extends ArkMenu.OpenChangeDetails {}

interface MenuPositionerProps

interface MenuPositionerProps
    extends HTMLChakraProps<'div', ArkMenu.PositionerBaseProps> {}

interface MenuRadioItemGroupProps

interface MenuRadioItemGroupProps
    extends HTMLChakraProps<'div', ArkMenu.RadioItemGroupBaseProps> {}

interface MenuRadioItemProps

interface MenuRadioItemProps
    extends HTMLChakraProps<'div', ArkMenu.RadioItemBaseProps> {}

interface MenuRootProps

interface MenuRootProps extends MenuRootBaseProps {}

property children

children: React.ReactNode;

interface MenuRootProviderProps

interface MenuRootProviderProps extends MenuRootProviderBaseProps {}

property children

children: React.ReactNode;

interface MenuSelectionDetails

interface MenuSelectionDetails extends ArkMenu.SelectionDetails {}

interface MenuSeparatorProps

interface MenuSeparatorProps
    extends HTMLChakraProps<'div', ArkMenu.SeparatorBaseProps> {}

interface MenuTriggerItemProps

interface MenuTriggerItemProps
    extends HTMLChakraProps<'div', ArkMenu.TriggerItemBaseProps> {}

interface MenuTriggerProps

interface MenuTriggerProps
    extends HTMLChakraProps<'button', ArkMenu.TriggerBaseProps> {}

interface NativeSelectFieldProps

interface NativeSelectFieldProps extends Omit<HTMLChakraProps<'select'>, Omitted> {}

property placeholder

placeholder?: string;

interface NativeSelectIndicatorProps

interface NativeSelectIndicatorProps extends HTMLChakraProps<'div'> {}

interface NativeSelectRootProps

interface NativeSelectRootProps
    extends HTMLChakraProps<'div', NativeSelectRootBaseProps> {}

interface NumberInputControlProps

interface NumberInputControlProps
    extends HTMLChakraProps<'div', ArkNumberInput.ControlBaseProps> {}

interface NumberInputDecrementTriggerProps

interface NumberInputDecrementTriggerProps
    extends HTMLChakraProps<'button', ArkNumberInput.DecrementTriggerBaseProps> {}

interface NumberInputFocusChangeDetails

interface NumberInputFocusChangeDetails extends ArkNumberInput.FocusChangeDetails {}

interface NumberInputIncrementTriggerProps

interface NumberInputIncrementTriggerProps
    extends HTMLChakraProps<'button', ArkNumberInput.IncrementTriggerBaseProps> {}

interface NumberInputInputProps

interface NumberInputInputProps
    extends HTMLChakraProps<'input', ArkNumberInput.InputBaseProps> {}

interface NumberInputLabelProps

interface NumberInputLabelProps
    extends HTMLChakraProps<'label', ArkNumberInput.LabelBaseProps> {}

interface NumberInputRootProps

interface NumberInputRootProps
    extends HTMLChakraProps<'div', NumberInputRootBaseProps> {}

interface NumberInputRootProviderProps

interface NumberInputRootProviderProps
    extends HTMLChakraProps<'div', NumberInputRootProviderBaseProps> {}

interface NumberInputScrubberProps

interface NumberInputScrubberProps
    extends HTMLChakraProps<'div', ArkNumberInput.ScrubberBaseProps> {}

interface NumberInputValueChangeDetails

interface NumberInputValueChangeDetails extends ArkNumberInput.ValueChangeDetails {}

interface NumberInputValueInvalidDetails

interface NumberInputValueInvalidDetails
    extends ArkNumberInput.ValueInvalidDetails {}

interface NumberInputValueTextProps

interface NumberInputValueTextProps
    extends HTMLChakraProps<'span', ArkNumberInput.ValueTextBaseProps> {}

interface OverlayOptions

interface OverlayOptions<T extends CreateOverlayProps> {}

property props

props?: T;

interface PaginationEllipsisProps

interface PaginationEllipsisProps
    extends HTMLChakraProps<'div', ArkPagination.EllipsisBaseProps> {}

interface PaginationItemProps

interface PaginationItemProps
    extends HTMLChakraProps<'button', ArkPagination.ItemBaseProps> {}

interface PaginationItemsProps

interface PaginationItemsProps extends React.HTMLAttributes<HTMLElement> {}

property ellipsis

ellipsis?: React.ReactElement;

property render

render: (page: { type: 'page'; value: number }) => React.ReactNode;

interface PaginationNextTriggerProps

interface PaginationNextTriggerProps
    extends HTMLChakraProps<'button', ArkPagination.NextTriggerBaseProps> {}

interface PaginationPageTextProps

interface PaginationPageTextProps extends BoxProps {}

property format

format?: 'short' | 'compact' | 'long';

interface PaginationPrevTriggerProps

interface PaginationPrevTriggerProps
    extends HTMLChakraProps<'button', ArkPagination.PrevTriggerBaseProps> {}

interface PaginationRootProps

interface PaginationRootProps
    extends HTMLChakraProps<'div', PaginationRootBaseProps> {}

interface PaginationRootProviderProps

interface PaginationRootProviderProps
    extends HTMLChakraProps<'div', PaginationRootProviderBaseProps> {}

interface PinInputControlProps

interface PinInputControlProps
    extends HTMLChakraProps<'div', ArkPinInput.ControlBaseProps> {}

interface PinInputInputProps

interface PinInputInputProps
    extends HTMLChakraProps<'input', ArkPinInput.InputBaseProps> {}

interface PinInputLabelProps

interface PinInputLabelProps extends HTMLChakraProps<'label'> {}

interface PinInputRootProps

interface PinInputRootProps extends HTMLChakraProps<'div', PinInputRootBaseProps> {}

interface PinInputRootProviderProps

interface PinInputRootProviderProps
    extends HTMLChakraProps<'div', PinInputRootProviderBaseProps> {}

interface PinInputValueChangeDetails

interface PinInputValueChangeDetails extends ArkPinInput.ValueChangeDetails {}

interface PolymorphicProps

interface PolymorphicProps {}

property as

as?: ElementType | undefined;

property asChild

asChild?: boolean | undefined;

interface PopoverAnchorProps

interface PopoverAnchorProps
    extends HTMLChakraProps<'div', ArkPopover.AnchorBaseProps> {}

interface PopoverArrowProps

interface PopoverArrowProps
    extends HTMLChakraProps<'div', ArkPopover.ArrowBaseProps> {}

interface PopoverArrowTipProps

interface PopoverArrowTipProps
    extends HTMLChakraProps<'div', ArkPopover.ArrowTipBaseProps> {}

interface PopoverBodyProps

interface PopoverBodyProps extends HTMLChakraProps<'div'> {}

interface PopoverCloseTriggerProps

interface PopoverCloseTriggerProps
    extends HTMLChakraProps<'button', ArkPopover.CloseTriggerBaseProps> {}

interface PopoverContentProps

interface PopoverContentProps
    extends HTMLChakraProps<'div', ArkPopover.ContentBaseProps> {}

interface PopoverDescriptionProps

interface PopoverDescriptionProps
    extends HTMLChakraProps<'div', ArkPopover.DescriptionBaseProps> {}

interface PopoverFooterProps

interface PopoverFooterProps extends HTMLChakraProps<'footer'> {}

interface PopoverHeaderProps

interface PopoverHeaderProps
    extends HTMLChakraProps<'div', ArkPopover.TitleBaseProps> {}

interface PopoverOpenChangeDetails

interface PopoverOpenChangeDetails extends ArkPopover.OpenChangeDetails {}

interface PopoverPositionerProps

interface PopoverPositionerProps
    extends HTMLChakraProps<'div', ArkPopover.PositionerBaseProps> {}

interface PopoverRootProps

interface PopoverRootProps extends PopoverRootBaseProps {}

property children

children: React.ReactNode;

interface PopoverRootProviderProps

interface PopoverRootProviderProps extends PopoverRootProviderBaseProps {}

property children

children: React.ReactNode;

interface PopoverTitleProps

interface PopoverTitleProps
    extends HTMLChakraProps<'div', ArkPopover.TitleBaseProps> {}

interface PopoverTriggerProps

interface PopoverTriggerProps
    extends HTMLChakraProps<'button', ArkPopover.TriggerBaseProps> {}

interface PresenceProps

interface PresenceProps extends Assign<HTMLChakraProps<'div'>, ArkPresenceProps> {}

interface ProgressCircleCircleProps

interface ProgressCircleCircleProps
    extends HTMLChakraProps<'svg', ArkProgress.CircleBaseProps> {}

interface ProgressCircleLabelProps

interface ProgressCircleLabelProps
    extends HTMLChakraProps<'div', ArkProgress.LabelBaseProps> {}

interface ProgressCircleRangeProps

interface ProgressCircleRangeProps
    extends HTMLChakraProps<'circle', ArkProgress.RangeBaseProps> {}

interface ProgressCircleRootProps

interface ProgressCircleRootProps
    extends HTMLChakraProps<'div', ProgressCircleRootBaseProps> {}

interface ProgressCircleRootProviderProps

interface ProgressCircleRootProviderProps
    extends HTMLChakraProps<'div', ProgressCircleRootProviderBaseProps> {}

interface ProgressCircleTrackProps

interface ProgressCircleTrackProps
    extends HTMLChakraProps<'circle', ArkProgress.TrackBaseProps> {}

interface ProgressCircleValueTextProps

interface ProgressCircleValueTextProps
    extends HTMLChakraProps<'div', ArkProgress.ValueTextBaseProps> {}

interface ProgressLabelProps

interface ProgressLabelProps
    extends HTMLChakraProps<'div', ArkProgress.LabelBaseProps> {}

interface ProgressRangeProps

interface ProgressRangeProps
    extends HTMLChakraProps<'div', ArkProgress.RangeBaseProps> {}

interface ProgressRootProps

interface ProgressRootProps extends HTMLChakraProps<'div', ProgressRootBaseProps> {}

interface ProgressRootProviderProps

interface ProgressRootProviderProps
    extends HTMLChakraProps<'div', ProgressRootProviderBaseProps> {}

interface ProgressTrackProps

interface ProgressTrackProps
    extends HTMLChakraProps<'div', ArkProgress.TrackBaseProps> {}

interface ProgressValueTextProps

interface ProgressValueTextProps
    extends HTMLChakraProps<'div', ArkProgress.ValueTextBaseProps> {}

interface QrCodeFrameProps

interface QrCodeFrameProps extends HTMLChakraProps<'svg'> {}

interface QrCodeOverlayProps

interface QrCodeOverlayProps extends HTMLChakraProps<'div'> {}

interface QrCodePatternProps

interface QrCodePatternProps extends HTMLChakraProps<'path'> {}

interface QrCodeRootProps

interface QrCodeRootProps extends HTMLChakraProps<'div', QrCodeRootBaseProps> {}

interface QuoteProps

interface QuoteProps extends HTMLChakraProps<'q'> {}

interface RadioCardItemAddonProps

interface RadioCardItemAddonProps extends HTMLChakraProps<'div'> {}

interface RadioCardItemContentProps

interface RadioCardItemContentProps extends HTMLChakraProps<'div'> {}

interface RadioCardItemControlProps

interface RadioCardItemControlProps
    extends HTMLChakraProps<'div', ArkRadioGroup.ItemControlBaseProps> {}

interface RadioCardItemDescriptionProps

interface RadioCardItemDescriptionProps extends HTMLChakraProps<'div'> {}

interface RadioCardItemIndicatorProps

interface RadioCardItemIndicatorProps extends HTMLChakraProps<'span'> {}

property checked

checked?: React.ReactElement;

interface RadioCardItemProps

interface RadioCardItemProps
    extends HTMLChakraProps<'div', ArkRadioGroup.ItemBaseProps> {}

interface RadioCardItemTextProps

interface RadioCardItemTextProps
    extends HTMLChakraProps<'span', ArkRadioGroup.ItemTextBaseProps> {}

interface RadioCardLabelProps

interface RadioCardLabelProps
    extends HTMLChakraProps<'div', ArkRadioGroup.LabelBaseProps> {}

interface RadioCardRootProps

interface RadioCardRootProps
    extends HTMLChakraProps<'div', RadioCardRootBaseProps> {}

interface RadioCardRootProviderProps

interface RadioCardRootProviderProps
    extends HTMLChakraProps<'div', RadioCardRootProviderBaseProps> {}

interface RadioCardValueChangeDetails

interface RadioCardValueChangeDetails extends ArkRadioGroup.ValueChangeDetails {}

interface RadioGroupItemControlProps

interface RadioGroupItemControlProps
    extends HTMLChakraProps<'div', ArkRadioGroup.ItemControlBaseProps> {}

interface RadioGroupItemProps

interface RadioGroupItemProps
    extends HTMLChakraProps<'div', ArkRadioGroup.ItemBaseProps> {}

interface RadioGroupItemTextProps

interface RadioGroupItemTextProps
    extends HTMLChakraProps<'span', ArkRadioGroup.ItemTextBaseProps> {}

interface RadioGroupLabelProps

interface RadioGroupLabelProps
    extends HTMLChakraProps<'div', ArkRadioGroup.LabelBaseProps> {}

interface RadioGroupRootProps

interface RadioGroupRootProps
    extends HTMLChakraProps<'div', RadioGroupRootBaseProps> {}

interface RadioGroupRootProviderProps

interface RadioGroupRootProviderProps
    extends HTMLChakraProps<'div', RadioGroupRootProviderBaseProps> {}

interface RadioGroupValueChangeDetails

interface RadioGroupValueChangeDetails extends ArkRadioGroup.ValueChangeDetails {}

interface RadiomarkProps

interface RadiomarkProps
    extends HTMLChakraProps<'span', RecipeProps<'radiomark'>>,
        UnstyledProp {}

property checked

checked?: boolean;

Whether the checkmark is checked

property disabled

disabled?: boolean;

Whether the checkmark is disabled

interface RatingGroupControlProps

interface RatingGroupControlProps
    extends HTMLChakraProps<'div', ArkRatingGroup.ControlBaseProps> {}

interface RatingGroupHoverChangeDetails

interface RatingGroupHoverChangeDetails extends ArkRatingGroup.HoverChangeDetails {}

interface RatingGroupItemIndicatorProps

interface RatingGroupItemIndicatorProps extends HTMLChakraProps<'span'> {}

property icon

icon?: React.ReactElement;

interface RatingGroupItemProps

interface RatingGroupItemProps
    extends HTMLChakraProps<'div', ArkRatingGroup.ItemBaseProps> {}

interface RatingGroupItemsProps

interface RatingGroupItemsProps extends Omit<RatingGroupItemProps, 'index'> {}

interface RatingGroupLabelProps

interface RatingGroupLabelProps
    extends HTMLChakraProps<'div', ArkRatingGroup.LabelBaseProps> {}

interface RatingGroupRootProps

interface RatingGroupRootProps
    extends HTMLChakraProps<'div', RatingGroupRootBaseProps> {}

interface RatingGroupRootProviderProps

interface RatingGroupRootProviderProps
    extends HTMLChakraProps<'div', RatingGroupRootProviderBaseProps> {}

interface RatingGroupValueChangeDetails

interface RatingGroupValueChangeDetails extends ArkRatingGroup.ValueChangeDetails {}

interface RecipeDefinition

interface RecipeDefinition<T extends RecipeVariantRecord = RecipeVariantRecord> {}

property base

base?: SystemStyleObject | undefined;

The base styles of the recipe.

property className

className?: string | undefined;

The class name of the recipe.

property compoundVariants

compoundVariants?:
    | Pretty<RecipeCompoundVariant<RecipeCompoundSelection<T>>>[]
    | undefined;

The styles to apply when a combination of variants is selected.

property defaultVariants

defaultVariants?:
    | (RecipeSelection<T> & {
          colorPalette?: ColorPalette | undefined;
      })
    | undefined;

The default variants of the recipe.

property variants

variants?: T | undefined;

The multi-variant styles of the recipe.

interface RecipeRuntimeFn

interface RecipeRuntimeFn<T extends RecipeVariantRecord>
    extends RecipeVariantFn<T> {}

property config

config: RecipeDefinition<T>;

property merge

merge: any;

property variantKeys

variantKeys: (keyof T)[];

property variantMap

variantMap: RecipeVariantMap<T>;

method splitVariantProps

splitVariantProps: <Props extends RecipeSelection<T>>(
    props: Props
) => [RecipeSelection<T>, Pretty<DistributiveOmit<Props, keyof T>>];

interface SegmentGroupIndicatorProps

interface SegmentGroupIndicatorProps
    extends HTMLChakraProps<'div', ArkSegmentGroup.IndicatorBaseProps> {}

interface SegmentGroupItemProps

interface SegmentGroupItemProps
    extends HTMLChakraProps<'label', ArkSegmentGroup.ItemBaseProps> {}

interface SegmentGroupItemsProps

interface SegmentGroupItemsProps extends Omit<SegmentGroupItemProps, 'value'> {}

property items

items: Array<string | Item>;

interface SegmentGroupItemTextProps

interface SegmentGroupItemTextProps
    extends HTMLChakraProps<'span', ArkSegmentGroup.ItemTextBaseProps> {}

interface SegmentGroupRootProps

interface SegmentGroupRootProps
    extends HTMLChakraProps<'div', SegmentGroupRootBaseProps> {}

interface SegmentGroupRootProviderProps

interface SegmentGroupRootProviderProps
    extends HTMLChakraProps<'div', SegmentGroupRootProviderBaseProps> {}

interface SegmentGroupValueChangeDetails

interface SegmentGroupValueChangeDetails
    extends ArkSegmentGroup.ValueChangeDetails {}

interface SelectClearTriggerProps

interface SelectClearTriggerProps
    extends HTMLChakraProps<'button', ArkSelect.ClearTriggerBaseProps> {}

interface SelectContentProps

interface SelectContentProps
    extends HTMLChakraProps<'div', ArkSelect.ContentBaseProps> {}

interface SelectControlProps

interface SelectControlProps
    extends HTMLChakraProps<'div', ArkSelect.ControlBaseProps> {}

interface SelectHighlightChangeDetails

interface SelectHighlightChangeDetails<T extends CollectionItem = any>
    extends ArkSelect.HighlightChangeDetails<T> {}

interface SelectIndicatorGroupProps

interface SelectIndicatorGroupProps extends HTMLChakraProps<'div'> {}

interface SelectIndicatorProps

interface SelectIndicatorProps
    extends HTMLChakraProps<'div', ArkSelect.ItemIndicatorBaseProps> {}

interface SelectItemGroupLabelProps

interface SelectItemGroupLabelProps
    extends HTMLChakraProps<'div', ArkSelect.ItemGroupLabelBaseProps> {}

interface SelectItemGroupProps

interface SelectItemGroupProps
    extends HTMLChakraProps<'div', ArkSelect.ItemGroupBaseProps> {}

interface SelectItemIndicatorProps

interface SelectItemIndicatorProps
    extends HTMLChakraProps<'div', ArkSelect.ItemIndicatorBaseProps> {}

interface SelectItemProps

interface SelectItemProps extends HTMLChakraProps<'div', ArkSelect.ItemBaseProps> {}

interface SelectItemTextProps

interface SelectItemTextProps
    extends HTMLChakraProps<'div', ArkSelect.ItemTextBaseProps> {}

interface SelectLabelProps

interface SelectLabelProps
    extends HTMLChakraProps<'label', ArkSelect.LabelBaseProps> {}

interface SelectOpenChangeDetails

interface SelectOpenChangeDetails extends ArkSelect.OpenChangeDetails {}

interface SelectPositionerProps

interface SelectPositionerProps
    extends HTMLChakraProps<'div', ArkSelect.PositionerBaseProps> {}

interface SelectRootProps

interface SelectRootProps<T extends CollectionItem = any>
    extends HTMLChakraProps<'div', SelectRootBaseProps<T>> {}

interface SelectRootProviderProps

interface SelectRootProviderProps<T extends CollectionItem = any>
    extends HTMLChakraProps<'div', SelectRootProviderBaseProps<T>> {}

interface SelectTriggerProps

interface SelectTriggerProps
    extends HTMLChakraProps<'button', ArkSelect.TriggerBaseProps> {}

interface SelectValueChangeDetails

interface SelectValueChangeDetails<T extends CollectionItem = any>
    extends ArkSelect.ValueChangeDetails<T> {}

interface SelectValueTextProps

interface SelectValueTextProps
    extends HTMLChakraProps<'span', ArkSelect.ValueTextBaseProps> {}

interface SeparatorProps

interface SeparatorProps extends HTMLChakraProps<'span', SeparatorBaseProps> {}

interface ShowProps

interface ShowProps<T> {}

property children

children: React.ReactNode | ((props: T) => React.ReactNode);

The children to render if when is true

property fallback

fallback?: React.ReactNode;

The fallback content to render if when is false

property when

when: T | null | undefined;

If true, it'll render the children prop

interface SimpleGridProps

interface SimpleGridProps extends Omit<GridProps, 'columns'>, SimpleGridOptions {}

interface SkeletonCircleProps

interface SkeletonCircleProps extends SkeletonProps {}

property size

size?: CircleProps['size'];

interface SkeletonProps

interface SkeletonProps
    extends HTMLChakraProps<'div'>,
        RecipeProps<'skeleton'>,
        UnstyledProp {}

interface SkeletonTextProps

interface SkeletonTextProps extends SkeletonProps {}

property noOfLines

noOfLines?: number;

property rootProps

rootProps?: StackProps;

interface SkipNavContentProps

interface SkipNavContentProps extends HTMLChakraProps<'div'> {}

interface SkipNavLinkProps

interface SkipNavLinkProps
    extends HTMLChakraProps<'a'>,
        RecipeProps<'skipNavLink'> {}

interface SliderControlProps

interface SliderControlProps
    extends HTMLChakraProps<'div', ArkSlider.ControlBaseProps> {}

interface SliderDraggingIndicatorProps

interface SliderDraggingIndicatorProps
    extends HTMLChakraProps<'div', ArkSlider.DraggingIndicatorBaseProps> {}

interface SliderLabelProps

interface SliderLabelProps
    extends HTMLChakraProps<'label', ArkSlider.LabelBaseProps> {}

interface SliderMarkerGroupProps

interface SliderMarkerGroupProps
    extends HTMLChakraProps<'div', ArkSlider.MarkerGroupBaseProps> {}

interface SliderMarkerIndicatorProps

interface SliderMarkerIndicatorProps extends HTMLChakraProps<'div'> {}

interface SliderMarkerProps

interface SliderMarkerProps
    extends HTMLChakraProps<'div', ArkSlider.MarkerBaseProps> {}

interface SliderRangeProps

interface SliderRangeProps
    extends HTMLChakraProps<'div', ArkSlider.RangeBaseProps> {}

interface SliderRootProps

interface SliderRootProps extends HTMLChakraProps<'div', SliderRootBaseProps> {}

interface SliderRootProviderProps

interface SliderRootProviderProps
    extends HTMLChakraProps<'div', SliderRootProviderBaseProps> {}

interface SliderThumbProps

interface SliderThumbProps
    extends HTMLChakraProps<'div', ArkSlider.ThumbBaseProps> {}

interface SliderTrackProps

interface SliderTrackProps
    extends HTMLChakraProps<'div', ArkSlider.TrackBaseProps> {}

interface SliderValueChangeDetails

interface SliderValueChangeDetails extends ArkSlider.ValueChangeDetails {}

interface SliderValueTextProps

interface SliderValueTextProps
    extends HTMLChakraProps<'div', ArkSlider.ValueTextBaseProps> {}

interface SlotRecipeDefinition

interface SlotRecipeDefinition<
    S extends string = string,
    T extends SlotRecipeVariantRecord<S> = SlotRecipeVariantRecord<S>
> {}

property base

base?: SlotRecord<S, SystemStyleObject> | undefined;

The base styles of the recipe.

property className

className?: string | undefined;

The class name of the recipe. Useful for targeting slots.
Say the recipe has slots like root, control and the class name is 'checkbox' Each slot will have a class name like checkbox__root, checkbox__control

property compoundVariants

compoundVariants?:
    | Pretty<SlotRecipeCompoundVariant<S, RecipeCompoundSelection<T>>>[]
    | undefined;

The styles to apply when a combination of variants is selected.

property defaultVariants

defaultVariants?:
    | (RecipeSelection<T> & {
          colorPalette?: ColorPalette | undefined;
      })
    | undefined;

The default variants of the recipe.

property slots

slots: S[] | Readonly<S[]>;

The parts/slots of the recipe.

property variants

variants?: T | undefined;

The multi-variant styles of the recipe.

interface SlotRecipeRuntimeFn

interface SlotRecipeRuntimeFn<S extends string, T extends SlotRecipeVariantRecord<S>>
    extends SlotRecipeVariantFn<S, T> {}

property classNameMap

classNameMap: Record<S, string>;

property variantKeys

variantKeys: (keyof T)[];

property variantMap

variantMap: RecipeVariantMap<T>;

method splitVariantProps

splitVariantProps: <Props extends RecipeSelection<T>>(
    props: Props
) => [RecipeSelection<T>, Pretty<Omit<Props, keyof T>>];

interface SpacerProps

interface SpacerProps extends HTMLChakraProps<'div'> {}

interface SpanProps

interface SpanProps extends HTMLChakraProps<'span'> {}

interface SpinnerProps

interface SpinnerProps
    extends HTMLChakraProps<'span'>,
        UnstyledProp,
        RecipeProps<'spinner'> {}

interface SquareProps

interface SquareProps extends BoxProps {}

property size

size?: BoxProps['boxSize'];

The size (width and height) of the square

interface StackProps

interface StackProps extends HTMLChakraProps<'div', StackOptions> {}

interface StackSeparatorProps

interface StackSeparatorProps extends HTMLChakraProps<'div'> {}

interface StatDownIndicatorProps

interface StatDownIndicatorProps extends HTMLChakraProps<'span'> {}

interface StatGroupProps

interface StatGroupProps extends SlotRecipeProps<'stat'>, HTMLChakraProps<'div'> {}

interface StatHelpTextProps

interface StatHelpTextProps extends HTMLChakraProps<'span'> {}

interface StatLabelProps

interface StatLabelProps extends HTMLChakraProps<'dt'> {}

interface StatRootProps

interface StatRootProps extends HTMLChakraProps<'dl', StatRootBaseProps> {}

interface StatUpIndicatorProps

interface StatUpIndicatorProps extends HTMLChakraProps<'span'> {}

interface StatusIndicatorProps

interface StatusIndicatorProps extends HTMLChakraProps<'div'> {}

interface StatusRootProps

interface StatusRootProps extends HTMLChakraProps<'div', StatusRootBaseProps> {}

interface StatValueTextProps

interface StatValueTextProps extends HTMLChakraProps<'dd'> {}

interface StatValueUnitProps

interface StatValueUnitProps extends HTMLChakraProps<'span'> {}

interface StepsChangeDetails

interface StepsChangeDetails extends ArkSteps.ChangeDetails {}

interface StepsCompletedContentProps

interface StepsCompletedContentProps extends HTMLChakraProps<'div'> {}

interface StepsContentProps

interface StepsContentProps
    extends HTMLChakraProps<'div', ArkSteps.ContentBaseProps> {}

interface StepsDescriptionProps

interface StepsDescriptionProps extends HTMLChakraProps<'div'> {}

interface StepsIndicatorProps

interface StepsIndicatorProps
    extends HTMLChakraProps<'div', ArkSteps.IndicatorBaseProps> {}

interface StepsItemProps

interface StepsItemProps extends HTMLChakraProps<'div', ArkSteps.ItemBaseProps> {}

interface StepsListProps

interface StepsListProps extends HTMLChakraProps<'div', ArkSteps.ListBaseProps> {}

interface StepsNextTriggerProps

interface StepsNextTriggerProps
    extends HTMLChakraProps<'button', ArkSteps.NextTriggerBaseProps> {}

interface StepsNumberProps

interface StepsNumberProps extends HTMLChakraProps<'div'> {}

interface StepsPrevTriggerProps

interface StepsPrevTriggerProps
    extends HTMLChakraProps<'button', ArkSteps.PrevTriggerBaseProps> {}

interface StepsRootProps

interface StepsRootProps extends HTMLChakraProps<'div', StepsRootBaseProps> {}

interface StepsRootProviderProps

interface StepsRootProviderProps
    extends HTMLChakraProps<'div', StepsRootProviderBaseProps> {}

interface StepsSeparatorProps

interface StepsSeparatorProps
    extends HTMLChakraProps<'div', ArkSteps.SeparatorBaseProps> {}

interface StepsStatusProps

interface StepsStatusProps {}

property complete

complete: React.ReactNode;

property current

current?: React.ReactNode;

property incomplete

incomplete: React.ReactNode;

interface StepsTitleProps

interface StepsTitleProps extends HTMLChakraProps<'div'> {}

interface StepsTriggerProps

interface StepsTriggerProps
    extends HTMLChakraProps<'button', ArkSteps.TriggerBaseProps> {}

interface StickyProps

interface StickyProps extends HTMLChakraProps<'div'> {}

interface StrongProps

interface StrongProps extends HTMLChakraProps<'em'> {}

interface SwitchCheckedChangeDetails

interface SwitchCheckedChangeDetails extends ArkSwitch.CheckedChangeDetails {}

interface SwitchControlProps

interface SwitchControlProps
    extends HTMLChakraProps<'span', ArkSwitch.ControlBaseProps> {}

interface SwitchIndicatorProps

interface SwitchIndicatorProps extends HTMLChakraProps<'span'> {}

property fallback

fallback?: React.ReactNode;

interface SwitchLabelProps

interface SwitchLabelProps
    extends HTMLChakraProps<'span', ArkSwitch.LabelBaseProps> {}

interface SwitchRootProps

interface SwitchRootProps extends HTMLChakraProps<'label', SwitchRootBaseProps> {}

interface SwitchRootProviderProps

interface SwitchRootProviderProps
    extends HTMLChakraProps<'label', SwitchRootProviderBaseProps> {}

interface SwitchThumbIndicatorProps

interface SwitchThumbIndicatorProps extends HTMLChakraProps<'span'> {}

property fallback

fallback?: React.ReactNode;

interface SwitchThumbProps

interface SwitchThumbProps
    extends HTMLChakraProps<'span', ArkSwitch.ThumbBaseProps> {}

interface SystemConfig

interface SystemConfig extends PreflightConfig {}

property conditions

conditions?: Dict | undefined;

property cssVarsPrefix

cssVarsPrefix?: string | undefined;

property cssVarsRoot

cssVarsRoot?: string | undefined;

property disableLayers

disableLayers?: boolean | undefined;

property globalCss

globalCss?: Record<string, SystemStyleObject> | undefined;

property layers

layers?: Record<CascadeLayer, string> | undefined;

property strictTokens

strictTokens?: boolean | undefined;

property theme

theme?: ThemingConfig | undefined;

property utilities

utilities?: UtilityConfig | undefined;

interface SystemContext

interface SystemContext {}

property $$chakra

$$chakra: true;

property breakpoints

breakpoints: Breakpoint;

property conditions

conditions: Condition;

property css

css: CssFn;

property cva

cva: RecipeCreatorFn;

property layers

layers: Layers;

property properties

properties: Set<string>;

property sva

sva: SlotRecipeCreatorFn;

property token

token: TokenFn;

property tokens

tokens: TokenDictionary;

property utility

utility: Utility;

method getGlobalCss

getGlobalCss: () => Dict;

method getPreflightCss

getPreflightCss: () => Dict;

method getRecipe

getRecipe: (key: string, fallback?: any) => any;

method getSlotRecipe

getSlotRecipe: (key: string, fallback?: any) => any;

method getTokenCss

getTokenCss: () => Dict;

method hasRecipe

hasRecipe: (key: string) => boolean;

method isRecipe

isRecipe: (key: string) => boolean;

method isSlotRecipe

isSlotRecipe: (key: string) => boolean;

method isValidProperty

isValidProperty: (prop: string) => boolean;

method normalizeValue

normalizeValue: (value: any) => any;

method splitCssProps

splitCssProps: <T extends SystemStyleObject>(
    props: T
) => [SystemStyleObject, DistributiveOmit<T, keyof SystemStyleObject>];

interface SystemRecipeFn

interface SystemRecipeFn<VP, VM> {}

property className

className: string;

property variantKeys

variantKeys: Array<keyof VP>;

property variantMap

variantMap: VM;

method splitVariantProps

splitVariantProps: <P extends VP>(
    props: P
) => [VP, Pretty<DistributiveOmit<P, keyof VP>>];

call signature

(props?: Partial<VP>): SystemStyleObject;

interface SystemSlotRecipeFn

interface SystemSlotRecipeFn<S extends string, VP, VM> {}

property classNameMap

classNameMap: Record<S, string>;

property variantKeys

variantKeys: Array<keyof VP>;

property variantMap

variantMap: VM;

method splitVariantProps

splitVariantProps: <P extends VP & { recipe?: any | undefined }>(
    props: P
) => [VP, Pretty<DistributiveOmit<P, keyof VP | 'recipe'>>];

call signature

(props?: Partial<VP>): Record<S, SystemStyleObject>;

interface TableBodyProps

interface TableBodyProps extends HTMLChakraProps<'tbody'> {}

interface TableCaptionProps

interface TableCaptionProps extends HTMLChakraProps<'caption'> {}

interface TableCellProps

interface TableCellProps extends HTMLChakraProps<'td'> {}

interface TableColumnGroupProps

interface TableColumnGroupProps extends HTMLChakraProps<'colgroup'> {}

interface TableColumnHeaderProps

interface TableColumnHeaderProps extends HTMLChakraProps<'th'> {}

interface TableColumnProps

interface TableColumnProps extends HTMLChakraProps<'col'> {}

interface TableFooterProps

interface TableFooterProps extends HTMLChakraProps<'tfoot'> {}

interface TableHeaderProps

interface TableHeaderProps extends HTMLChakraProps<'thead'> {}

interface TableRootProps

interface TableRootProps extends HTMLChakraProps<'table', TableRootBaseProps> {}

property native

native?: boolean;

If true, the table will style its descendants with nested selectors

interface TableRowProps

interface TableRowProps extends HTMLChakraProps<'tr'> {}

interface TableScrollAreaProps

interface TableScrollAreaProps extends HTMLChakraProps<'div'> {}

interface TabsContentGroupProps

interface TabsContentGroupProps extends HTMLChakraProps<'div'> {}

interface TabsContentProps

interface TabsContentProps
    extends HTMLChakraProps<'div', ArkTabs.ContentBaseProps> {}

interface TabsIndicatorProps

interface TabsIndicatorProps extends HTMLChakraProps<'div', ArkTabs.ListBaseProps> {}

interface TabsListProps

interface TabsListProps extends HTMLChakraProps<'div', ArkTabs.ListBaseProps> {}

interface TabsRootProps

interface TabsRootProps extends HTMLChakraProps<'div', TabsRootBaseProps> {}

interface TabsRootProviderProps

interface TabsRootProviderProps
    extends HTMLChakraProps<'div', TabsRootProviderBaseProps> {}

interface TabsTriggerProps

interface TabsTriggerProps
    extends HTMLChakraProps<'button', ArkTabs.TriggerBaseProps> {}

interface TagCloseTriggerProps

interface TagCloseTriggerProps extends HTMLChakraProps<'button'> {}

interface TagEndElementProps

interface TagEndElementProps extends HTMLChakraProps<'span'> {}

interface TagLabelProps

interface TagLabelProps extends HTMLChakraProps<'span'> {}

interface TagRootProps

interface TagRootProps extends HTMLChakraProps<'span', TagRootBaseProps> {}

interface TagStartElementProps

interface TagStartElementProps extends HTMLChakraProps<'span'> {}

interface TextareaProps

interface TextareaProps extends HTMLChakraProps<'textarea', TextareaBaseProps> {}

interface TextProps

interface TextProps extends Assign<HTMLChakraProps<'p'>, RecipeProps<'text'>> {}

interface ThemeProps

interface ThemeProps extends HTMLChakraProps<'div'> {}

property appearance

appearance?: 'light' | 'dark';

The appearance of the theme.

property hasBackground

hasBackground?: boolean;

Whether to apply the theme background and color.

interface ThemingConfig

interface ThemingConfig {}

property animationStyles

animationStyles?: Record<string, Dict> | undefined;

property breakpoints

breakpoints?: Record<string, string> | undefined;

property keyframes

keyframes?: CssKeyframes | undefined;

property layerStyles

layerStyles?: Record<string, Dict> | undefined;

property recipes

recipes?: Record<string, RecipeDefinition> | undefined;

property semanticTokens

semanticTokens?: SemanticTokenDefinition | undefined;

property slotRecipes

slotRecipes?: Record<string, SlotRecipeConfig> | undefined;

property textStyles

textStyles?: Record<string, Dict> | undefined;

property tokens

tokens?: TokenDefinition | undefined;

interface TimelineConnectorProps

interface TimelineConnectorProps extends HTMLChakraProps<'div'> {}

interface TimelineContentProps

interface TimelineContentProps extends HTMLChakraProps<'div'> {}

interface TimelineDescriptionProps

interface TimelineDescriptionProps extends HTMLChakraProps<'div'> {}

interface TimelineIndicatorProps

interface TimelineIndicatorProps extends HTMLChakraProps<'div'> {}

interface TimelineItemProps

interface TimelineItemProps extends HTMLChakraProps<'div'> {}

interface TimelineRootProps

interface TimelineRootProps extends HTMLChakraProps<'div', TimelineRootBaseProps> {}

interface TimelineSeparatorProps

interface TimelineSeparatorProps extends HTMLChakraProps<'div'> {}

interface TimelineTitleProps

interface TimelineTitleProps extends HTMLChakraProps<'div'> {}

interface ToastActionTriggerProps

interface ToastActionTriggerProps
    extends HTMLChakraProps<'button', ArkToast.ActionTriggerProps> {}

interface ToastCloseTriggerProps

interface ToastCloseTriggerProps
    extends HTMLChakraProps<'button', ArkToast.CloseTriggerProps> {}

interface ToastDescriptionProps

interface ToastDescriptionProps
    extends HTMLChakraProps<'div', ArkToast.DescriptionProps> {}

interface ToasterProps

interface ToasterProps extends HTMLChakraProps<'div', ToasterBaseProps> {}

interface ToastIndicatorProps

interface ToastIndicatorProps extends HTMLChakraProps<'span'> {}

interface ToastRootProps

interface ToastRootProps extends HTMLChakraProps<'div', ToastRootBaseProps> {}

interface ToastTitleProps

interface ToastTitleProps extends HTMLChakraProps<'div', ArkToast.TitleProps> {}

interface ToggleIndicatorProps

interface ToggleIndicatorProps
    extends HTMLChakraProps<'div', ArkToggle.IndicatorBaseProps> {}

interface ToggleRootBaseProps

interface ToggleRootBaseProps
    extends Assign<ArkToggle.RootBaseProps, SlotRecipeProps<'toggle'>>,
        UnstyledProp {}

interface ToggleRootProps

interface ToggleRootProps extends HTMLChakraProps<'button', ToggleRootBaseProps> {}

interface TokenInterface

interface Token<T = any> {}

property description

description?: string | undefined;

property extensions

extensions: TokenExtensions;

property name

name: string;

property originalValue

originalValue: any;

property path

path: string[];

property value

value: T;

interface TooltipArrowProps

interface TooltipArrowProps extends HTMLChakraProps<'div', ArkTooltip.ArrowProps> {}

interface TooltipArrowTipProps

interface TooltipArrowTipProps
    extends HTMLChakraProps<'div', ArkTooltip.ArrowTipProps> {}

interface TooltipContentProps

interface TooltipContentProps
    extends HTMLChakraProps<'section', ArkTooltip.ContentProps> {}

interface TooltipOpenChangeDetails

interface TooltipOpenChangeDetails extends ArkTooltip.OpenChangeDetails {}

interface TooltipPositionerProps

interface TooltipPositionerProps
    extends HTMLChakraProps<'div', ArkTooltip.PositionerProps> {}

interface TooltipRootProps

interface TooltipRootProps extends TooltipRootBaseProps {}

property children

children?: React.ReactNode;

interface TooltipRootProviderProps

interface TooltipRootProviderProps extends TooltipRootProviderBaseProps {}

property children

children?: React.ReactNode;

interface TooltipTriggerProps

interface TooltipTriggerProps
    extends HTMLChakraProps<'button', ArkTooltip.TriggerProps> {}

interface UnstyledProp

interface UnstyledProp {}

property unstyled

unstyled?: boolean | undefined;

If true, the element will opt out of the theme styles.

interface UseBreakpointOptions

interface UseBreakpointOptions {}

property breakpoints

breakpoints?: string[];

property fallback

fallback?: string;

property getWindow

getWindow?: () => typeof window;

property ssr

ssr?: boolean;

interface UseControllableStateProps

interface UseControllableStateProps<T> {}

property defaultValue

defaultValue?: T | (() => T);

property onChange

onChange?: (value: T) => void;

property shouldUpdate

shouldUpdate?: (prev: T, next: T) => boolean;

property value

value?: T;

interface UseDisclosureProps

interface UseDisclosureProps {}

property defaultOpen

defaultOpen?: boolean;

property open

open?: boolean;

method onClose

onClose: () => void;

method onOpen

onOpen: () => void;

interface UseListCollectionProps

interface UseListCollectionProps<T> extends ListCollectionOptions<T> {}

property filter

filter?: (itemText: string, filterText: string) => boolean;

The filter function to use to filter the items.

property initialItems

initialItems: T[];

The initial items to display in the collection.

property limit

limit?: number;

The maximum number of items to display in the collection. Useful for performance when you have a large number of items.

interface UseMediaQueryOptions

interface UseMediaQueryOptions {}

property fallback

fallback?: boolean[];

property ssr

ssr?: boolean;

method getWindow

getWindow: () => typeof window;

interface UseRecipeOptions

interface UseRecipeOptions<K extends RecipeKey> {}

property key

key?: K | undefined;

property recipe

recipe?: RecipeDefinition | undefined;

interface UseSlotRecipeOptions

interface UseSlotRecipeOptions<K extends SlotRecipeKey> {}

property key

key?: K | undefined;

property recipe

recipe?: SlotRecipeConfig | undefined;

interface WithContextOptions

interface WithContextOptions<P> extends JsxFactoryOptions<P> {}

interface WithProviderOptions

interface WithProviderOptions<P> extends JsxFactoryOptions<P>, WrapElementProps<P> {}

interface WithRootProviderOptions

interface WithRootProviderOptions<P> extends WrapElementProps<P> {}

property defaultProps

defaultProps?: Partial<P> | undefined;

interface WrapItemProps

interface WrapItemProps extends HTMLChakraProps<'div'> {}

interface WrapProps

interface WrapProps
    extends Assign<
        HTMLChakraProps<'div'>,
        {
            justify?: SystemStyleObject['justifyContent'];
            align?: SystemStyleObject['alignItems'];
            direction?: SystemStyleObject['flexDirection'];
        }
    > {}

Type Aliases

type AnimationStyle

type AnimationStyle = CompositionStyleObject<AnimationStyleProperty>;

type AnimationStyles

type AnimationStyles = Recursive<Token<AnimationStyle>>;

type ChakraComponent

type ChakraComponent<T extends ElementType, P extends Dict = {}> = FunctionComponent<
    HTMLChakraProps<T, P> & {
        ref?: any | undefined;
    }
>;

type ColorPalette

type ColorPalette =
    | 'transparent'
    | 'current'
    | 'black'
    | 'white'
    | 'whiteAlpha'
    | 'blackAlpha'
    | 'gray'
    | 'red'
    | 'orange'
    | 'yellow'
    | 'green'
    | 'teal'
    | 'blue'
    | 'cyan'
    | 'purple'
    | 'pink'
    | 'bg'
    | 'fg'
    | 'border';

type ConditionalValue

type ConditionalValue<V> =
    | V
    | Array<V | null>
    | {
          [K in keyof Conditions]?: ConditionalValue<V>;
      };

type DataAttr

type DataAttr = Record<
    `data-${string}`,
    string | number | undefined | null | boolean
>;

type HTMLChakraProps

type HTMLChakraProps<T extends ElementType, P extends Dict = {}> = JsxHtmlProps<
    ComponentPropsWithoutRef<T>,
    Assign<JsxStyleProps, P> & PolymorphicProps
>;

type HtmlProp

type HtmlProp =
    | 'color'
    | 'size'
    | 'translate'
    | 'transition'
    | 'width'
    | 'height'
    | 'content';

type InferRecipeProps

type InferRecipeProps<T> = T extends ChakraComponent<any, infer P> ? P : {};

type JsxElement

type JsxElement<T extends ElementType, P extends Dict> = T extends ChakraComponent<
    infer A,
    infer B
>
    ? ChakraComponent<A, Pretty<DistributiveUnion<P, B>>>
    : ChakraComponent<T, P>;

type JsxHtmlProps

type JsxHtmlProps<T extends Dict, P extends Dict = {}> = Assign<
    PatchHtmlProps<T>,
    P
>;

type LayerStyle

type LayerStyle = CompositionStyleObject<LayerStyleProperty>;

type LayerStyles

type LayerStyles = Recursive<Token<LayerStyle>>;

type PatchHtmlProps

type PatchHtmlProps<T> = DistributiveOmit<T, HtmlProp> & HtmlProps;

type RecipeCompoundSelection

type RecipeCompoundSelection<T> = {
    [K in keyof T]?: OneOrMore<StringToBoolean<keyof T[K]>> | undefined;
} & {
    colorPalette?: OneOrMore<ColorPalette> | undefined;
};

type RecipeCompoundVariant

type RecipeCompoundVariant<T> = T & {
    css: SystemStyleObject;
};

type RecipeCreatorFn

type RecipeCreatorFn = <T extends RecipeVariantRecord>(
    config: RecipeDefinition<T>
) => RecipeRuntimeFn<T>;

type RecipeIdentityFn

type RecipeIdentityFn = <T extends RecipeVariantRecord>(
    config: RecipeDefinition<T>
) => RecipeDefinition<T>;

type RecipeKey

type RecipeKey = keyof ConfigRecipes | (string & {});

type RecipeProps

type RecipeProps<T> = T extends keyof ConfigRecipes
    ? ConfigRecipes[T]['__type'] & { recipe?: RecipeDefinition | undefined }
    : { recipe?: RecipeDefinition | undefined };

type RecipeSelection

type RecipeSelection<
    T extends RecipeVariantRecord | SlotRecipeVariantRecord<string>
> = keyof any extends keyof T
    ? {}
    : {
          [K in keyof T]?: ConditionalValue<StringToBoolean<keyof T[K]> | undefined>;
      };

type RecipeVariantFn

type RecipeVariantFn<T extends RecipeVariantRecord> = (
    props?: RecipeSelection<T>
) => SystemStyleObject;

type RecipeVariantMap

type RecipeVariantMap<T extends RecipeVariantRecord> = {
    [K in keyof T]: Array<keyof T[K]>;
};

type RecipeVariantProps

type RecipeVariantProps<T extends RecipeDefinition | SlotRecipeDefinition> =
    T extends RecipeDefinition<infer U>
        ? RecipeSelection<U>
        : T extends SlotRecipeDefinition<string, infer U>
        ? RecipeSelection<U>
        : never;

type RecipeVariantRecord

type RecipeVariantRecord = Record<any, Record<any, SystemStyleObject>>;

type SlotRecipeCompoundVariant

type SlotRecipeCompoundVariant<S extends string, T> = T & {
    css: SlotRecord<S, SystemStyleObject>;
};

type SlotRecipeConfig

type SlotRecipeConfig<
    S extends string = string,
    T extends SlotRecipeVariantRecord<S> = SlotRecipeVariantRecord<S>
> = SlotRecipeDefinition<S, T>;

type SlotRecipeCreatorFn

type SlotRecipeCreatorFn = <S extends string, T extends SlotRecipeVariantRecord<S>>(
    config: SlotRecipeDefinition<S, T>
) => SlotRecipeRuntimeFn<S, T>;

type SlotRecipeFn

type SlotRecipeFn<K extends SlotRecipeKey> = K extends keyof ConfigSlotRecipes
    ? ConfigSlotRecipes[K]
    : SystemSlotRecipeFn<string, {}, {}>;

type SlotRecipeIdentityFn

type SlotRecipeIdentityFn = <S extends string, T extends SlotRecipeVariantRecord<S>>(
    config: SlotRecipeDefinition<S, T>
) => SlotRecipeDefinition<S, T>;

type SlotRecipeKey

type SlotRecipeKey = keyof ConfigSlotRecipes | (string & {});

type SlotRecipeProps

type SlotRecipeProps<T> = T extends keyof ConfigSlotRecipes
    ? ConfigSlotRecipes[T]['__type'] & { recipe?: SlotRecipeDefinition | undefined }
    : { recipe?: SlotRecipeDefinition | undefined };

type SlotRecipeRecord

type SlotRecipeRecord<T, K> = T extends keyof ConfigRecipeSlots
    ? Record<ConfigRecipeSlots[T], K>
    : Record<string, K>;

type SlotRecipeVariantFn

type SlotRecipeVariantFn<S extends string, T extends RecipeVariantRecord> = (
    props?: RecipeSelection<T>
) => SlotRecord<S, string>;

type SlotRecipeVariantRecord

type SlotRecipeVariantRecord<S extends string> = Record<
    any,
    Record<any, SlotRecord<S, SystemStyleObject>>
>;

type StyledFactoryFn

type StyledFactoryFn = JsxFactory & JsxElements;

type SystemStyleObject

type SystemStyleObject = Nested<SystemProperties & CssVarProperties>;

type TextStyle

type TextStyle = CompositionStyleObject<TextStyleProperty>;

type TextStyles

type TextStyles = Recursive<Token<TextStyle>>;

type Token

type Token =
    | 'aspectRatios.square'
    | 'aspectRatios.landscape'
    | 'aspectRatios.portrait'
    | 'aspectRatios.wide'
    | 'aspectRatios.ultrawide'
    | 'aspectRatios.golden'
    | 'animations.spin'
    | 'animations.ping'
    | 'animations.pulse'
    | 'animations.bounce'
    | 'blurs.none'
    | 'blurs.sm'
    | 'blurs.md'
    | 'blurs.lg'
    | 'blurs.xl'
    | 'blurs.2xl'
    | 'blurs.3xl'
    | 'blurs.4xl'
    | 'borders.xs'
    | 'borders.sm'
    | 'borders.md'
    | 'borders.lg'
    | 'borders.xl'
    | 'colors.transparent'
    | 'colors.current'
    | 'colors.black'
    | 'colors.white'
    | 'colors.whiteAlpha.50'
    | 'colors.whiteAlpha.100'
    | 'colors.whiteAlpha.200'
    | 'colors.whiteAlpha.300'
    | 'colors.whiteAlpha.400'
    | 'colors.whiteAlpha.500'
    | 'colors.whiteAlpha.600'
    | 'colors.whiteAlpha.700'
    | 'colors.whiteAlpha.800'
    | 'colors.whiteAlpha.900'
    | 'colors.whiteAlpha.950'
    | 'colors.blackAlpha.50'
    | 'colors.blackAlpha.100'
    | 'colors.blackAlpha.200'
    | 'colors.blackAlpha.300'
    | 'colors.blackAlpha.400'
    | 'colors.blackAlpha.500'
    | 'colors.blackAlpha.600'
    | 'colors.blackAlpha.700'
    | 'colors.blackAlpha.800'
    | 'colors.blackAlpha.900'
    | 'colors.blackAlpha.950'
    | 'colors.gray.50'
    | 'colors.gray.100'
    | 'colors.gray.200'
    | 'colors.gray.300'
    | 'colors.gray.400'
    | 'colors.gray.500'
    | 'colors.gray.600'
    | 'colors.gray.700'
    | 'colors.gray.800'
    | 'colors.gray.900'
    | 'colors.gray.950'
    | 'colors.red.50'
    | 'colors.red.100'
    | 'colors.red.200'
    | 'colors.red.300'
    | 'colors.red.400'
    | 'colors.red.500'
    | 'colors.red.600'
    | 'colors.red.700'
    | 'colors.red.800'
    | 'colors.red.900'
    | 'colors.red.950'
    | 'colors.orange.50'
    | 'colors.orange.100'
    | 'colors.orange.200'
    | 'colors.orange.300'
    | 'colors.orange.400'
    | 'colors.orange.500'
    | 'colors.orange.600'
    | 'colors.orange.700'
    | 'colors.orange.800'
    | 'colors.orange.900'
    | 'colors.orange.950'
    | 'colors.yellow.50'
    | 'colors.yellow.100'
    | 'colors.yellow.200'
    | 'colors.yellow.300'
    | 'colors.yellow.400'
    | 'colors.yellow.500'
    | 'colors.yellow.600'
    | 'colors.yellow.700'
    | 'colors.yellow.800'
    | 'colors.yellow.900'
    | 'colors.yellow.950'
    | 'colors.green.50'
    | 'colors.green.100'
    | 'colors.green.200'
    | 'colors.green.300'
    | 'colors.green.400'
    | 'colors.green.500'
    | 'colors.green.600'
    | 'colors.green.700'
    | 'colors.green.800'
    | 'colors.green.900'
    | 'colors.green.950'
    | 'colors.teal.50'
    | 'colors.teal.100'
    | 'colors.teal.200'
    | 'colors.teal.300'
    | 'colors.teal.400'
    | 'colors.teal.500'
    | 'colors.teal.600'
    | 'colors.teal.700'
    | 'colors.teal.800'
    | 'colors.teal.900'
    | 'colors.teal.950'
    | 'colors.blue.50'
    | 'colors.blue.100'
    | 'colors.blue.200'
    | 'colors.blue.300'
    | 'colors.blue.400'
    | 'colors.blue.500'
    | 'colors.blue.600'
    | 'colors.blue.700'
    | 'colors.blue.800'
    | 'colors.blue.900'
    | 'colors.blue.950'
    | 'colors.cyan.50'
    | 'colors.cyan.100'
    | 'colors.cyan.200'
    | 'colors.cyan.300'
    | 'colors.cyan.400'
    | 'colors.cyan.500'
    | 'colors.cyan.600'
    | 'colors.cyan.700'
    | 'colors.cyan.800'
    | 'colors.cyan.900'
    | 'colors.cyan.950'
    | 'colors.purple.50'
    | 'colors.purple.100'
    | 'colors.purple.200'
    | 'colors.purple.300'
    | 'colors.purple.400'
    | 'colors.purple.500'
    | 'colors.purple.600'
    | 'colors.purple.700'
    | 'colors.purple.800'
    | 'colors.purple.900'
    | 'colors.purple.950'
    | 'colors.pink.50'
    | 'colors.pink.100'
    | 'colors.pink.200'
    | 'colors.pink.300'
    | 'colors.pink.400'
    | 'colors.pink.500'
    | 'colors.pink.600'
    | 'colors.pink.700'
    | 'colors.pink.800'
    | 'colors.pink.900'
    | 'colors.pink.950'
    | 'durations.fastest'
    | 'durations.faster'
    | 'durations.fast'
    | 'durations.moderate'
    | 'durations.slow'
    | 'durations.slower'
    | 'durations.slowest'
    | 'easings.ease-in'
    | 'easings.ease-out'
    | 'easings.ease-in-out'
    | 'easings.ease-in-smooth'
    | 'fonts.heading'
    | 'fonts.body'
    | 'fonts.mono'
    | 'fontSizes.2xs'
    | 'fontSizes.xs'
    | 'fontSizes.sm'
    | 'fontSizes.md'
    | 'fontSizes.lg'
    | 'fontSizes.xl'
    | 'fontSizes.2xl'
    | 'fontSizes.3xl'
    | 'fontSizes.4xl'
    | 'fontSizes.5xl'
    | 'fontSizes.6xl'
    | 'fontSizes.7xl'
    | 'fontSizes.8xl'
    | 'fontSizes.9xl'
    | 'fontWeights.thin'
    | 'fontWeights.extralight'
    | 'fontWeights.light'
    | 'fontWeights.normal'
    | 'fontWeights.medium'
    | 'fontWeights.semibold'
    | 'fontWeights.bold'
    | 'fontWeights.extrabold'
    | 'fontWeights.black'
    | 'letterSpacings.tighter'
    | 'letterSpacings.tight'
    | 'letterSpacings.wide'
    | 'letterSpacings.wider'
    | 'letterSpacings.widest'
    | 'lineHeights.shorter'
    | 'lineHeights.short'
    | 'lineHeights.moderate'
    | 'lineHeights.tall'
    | 'lineHeights.taller'
    | 'radii.none'
    | 'radii.2xs'
    | 'radii.xs'
    | 'radii.sm'
    | 'radii.md'
    | 'radii.lg'
    | 'radii.xl'
    | 'radii.2xl'
    | 'radii.3xl'
    | 'radii.4xl'
    | 'radii.full'
    | 'spacing.1'
    | 'spacing.2'
    | 'spacing.3'
    | 'spacing.4'
    | 'spacing.5'
    | 'spacing.6'
    | 'spacing.7'
    | 'spacing.8'
    | 'spacing.9'
    | 'spacing.10'
    | 'spacing.11'
    | 'spacing.12'
    | 'spacing.14'
    | 'spacing.16'
    | 'spacing.20'
    | 'spacing.24'
    | 'spacing.28'
    | 'spacing.32'
    | 'spacing.36'
    | 'spacing.40'
    | 'spacing.44'
    | 'spacing.48'
    | 'spacing.52'
    | 'spacing.56'
    | 'spacing.60'
    | 'spacing.64'
    | 'spacing.72'
    | 'spacing.80'
    | 'spacing.96'
    | 'spacing.0.5'
    | 'spacing.1.5'
    | 'spacing.2.5'
    | 'spacing.3.5'
    | 'spacing.4.5'
    | 'sizes.1'
    | 'sizes.2'
    | 'sizes.3'
    | 'sizes.4'
    | 'sizes.5'
    | 'sizes.6'
    | 'sizes.7'
    | 'sizes.8'
    | 'sizes.9'
    | 'sizes.10'
    | 'sizes.11'
    | 'sizes.12'
    | 'sizes.14'
    | 'sizes.16'
    | 'sizes.20'
    | 'sizes.24'
    | 'sizes.28'
    | 'sizes.32'
    | 'sizes.36'
    | 'sizes.40'
    | 'sizes.44'
    | 'sizes.48'
    | 'sizes.52'
    | 'sizes.56'
    | 'sizes.60'
    | 'sizes.64'
    | 'sizes.72'
    | 'sizes.80'
    | 'sizes.96'
    | 'sizes.3xs'
    | 'sizes.2xs'
    | 'sizes.xs'
    | 'sizes.sm'
    | 'sizes.md'
    | 'sizes.lg'
    | 'sizes.xl'
    | 'sizes.2xl'
    | 'sizes.3xl'
    | 'sizes.4xl'
    | 'sizes.5xl'
    | 'sizes.6xl'
    | 'sizes.7xl'
    | 'sizes.8xl'
    | 'sizes.0.5'
    | 'sizes.1.5'
    | 'sizes.2.5'
    | 'sizes.3.5'
    | 'sizes.4.5'
    | 'sizes.1/2'
    | 'sizes.1/3'
    | 'sizes.2/3'
    | 'sizes.1/4'
    | 'sizes.3/4'
    | 'sizes.1/5'
    | 'sizes.2/5'
    | 'sizes.3/5'
    | 'sizes.4/5'
    | 'sizes.1/6'
    | 'sizes.2/6'
    | 'sizes.3/6'
    | 'sizes.4/6'
    | 'sizes.5/6'
    | 'sizes.1/12'
    | 'sizes.2/12'
    | 'sizes.3/12'
    | 'sizes.4/12'
    | 'sizes.5/12'
    | 'sizes.6/12'
    | 'sizes.7/12'
    | 'sizes.8/12'
    | 'sizes.9/12'
    | 'sizes.10/12'
    | 'sizes.11/12'
    | 'sizes.max'
    | 'sizes.min'
    | 'sizes.fit'
    | 'sizes.prose'
    | 'sizes.full'
    | 'sizes.dvh'
    | 'sizes.svh'
    | 'sizes.lvh'
    | 'sizes.dvw'
    | 'sizes.svw'
    | 'sizes.lvw'
    | 'sizes.vw'
    | 'sizes.vh'
    | 'sizes.breakpoint-sm'
    | 'sizes.breakpoint-md'
    | 'sizes.breakpoint-lg'
    | 'sizes.breakpoint-xl'
    | 'sizes.breakpoint-2xl'
    | 'zIndex.hide'
    | 'zIndex.base'
    | 'zIndex.docked'
    | 'zIndex.dropdown'
    | 'zIndex.sticky'
    | 'zIndex.banner'
    | 'zIndex.overlay'
    | 'zIndex.modal'
    | 'zIndex.popover'
    | 'zIndex.skipNav'
    | 'zIndex.toast'
    | 'zIndex.tooltip'
    | 'zIndex.max'
    | 'cursor.button'
    | 'cursor.checkbox'
    | 'cursor.disabled'
    | 'cursor.menuitem'
    | 'cursor.option'
    | 'cursor.radio'
    | 'cursor.slider'
    | 'cursor.switch'
    | 'breakpoints.sm'
    | 'breakpoints.md'
    | 'breakpoints.lg'
    | 'breakpoints.xl'
    | 'breakpoints.2xl'
    | 'colors.bg'
    | 'colors.bg.subtle'
    | 'colors.bg.muted'
    | 'colors.bg.emphasized'
    | 'colors.bg.inverted'
    | 'colors.bg.panel'
    | 'colors.bg.error'
    | 'colors.bg.warning'
    | 'colors.bg.success'
    | 'colors.bg.info'
    | 'colors.fg'
    | 'colors.fg.muted'
    | 'colors.fg.subtle'
    | 'colors.fg.inverted'
    | 'colors.fg.error'
    | 'colors.fg.warning'
    | 'colors.fg.success'
    | 'colors.fg.info'
    | 'colors.border'
    | 'colors.border.muted'
    | 'colors.border.subtle'
    | 'colors.border.emphasized'
    | 'colors.border.inverted'
    | 'colors.border.error'
    | 'colors.border.warning'
    | 'colors.border.success'
    | 'colors.border.info'
    | 'colors.gray.contrast'
    | 'colors.gray.fg'
    | 'colors.gray.subtle'
    | 'colors.gray.muted'
    | 'colors.gray.emphasized'
    | 'colors.gray.solid'
    | 'colors.gray.focusRing'
    | 'colors.red.contrast'
    | 'colors.red.fg'
    | 'colors.red.subtle'
    | 'colors.red.muted'
    | 'colors.red.emphasized'
    | 'colors.red.solid'
    | 'colors.red.focusRing'
    | 'colors.orange.contrast'
    | 'colors.orange.fg'
    | 'colors.orange.subtle'
    | 'colors.orange.muted'
    | 'colors.orange.emphasized'
    | 'colors.orange.solid'
    | 'colors.orange.focusRing'
    | 'colors.green.contrast'
    | 'colors.green.fg'
    | 'colors.green.subtle'
    | 'colors.green.muted'
    | 'colors.green.emphasized'
    | 'colors.green.solid'
    | 'colors.green.focusRing'
    | 'colors.blue.contrast'
    | 'colors.blue.fg'
    | 'colors.blue.subtle'
    | 'colors.blue.muted'
    | 'colors.blue.emphasized'
    | 'colors.blue.solid'
    | 'colors.blue.focusRing'
    | 'colors.yellow.contrast'
    | 'colors.yellow.fg'
    | 'colors.yellow.subtle'
    | 'colors.yellow.muted'
    | 'colors.yellow.emphasized'
    | 'colors.yellow.solid'
    | 'colors.yellow.focusRing'
    | 'colors.teal.contrast'
    | 'colors.teal.fg'
    | 'colors.teal.subtle'
    | 'colors.teal.muted'
    | 'colors.teal.emphasized'
    | 'colors.teal.solid'
    | 'colors.teal.focusRing'
    | 'colors.purple.contrast'
    | 'colors.purple.fg'
    | 'colors.purple.subtle'
    | 'colors.purple.muted'
    | 'colors.purple.emphasized'
    | 'colors.purple.solid'
    | 'colors.purple.focusRing'
    | 'colors.pink.contrast'
    | 'colors.pink.fg'
    | 'colors.pink.subtle'
    | 'colors.pink.muted'
    | 'colors.pink.emphasized'
    | 'colors.pink.solid'
    | 'colors.pink.focusRing'
    | 'colors.cyan.contrast'
    | 'colors.cyan.fg'
    | 'colors.cyan.subtle'
    | 'colors.cyan.muted'
    | 'colors.cyan.emphasized'
    | 'colors.cyan.solid'
    | 'colors.cyan.focusRing'
    | 'shadows.xs'
    | 'shadows.sm'
    | 'shadows.md'
    | 'shadows.lg'
    | 'shadows.xl'
    | 'shadows.2xl'
    | 'shadows.inner'
    | 'shadows.inset'
    | 'radii.l1'
    | 'radii.l2'
    | 'radii.l3'
    | 'spacing.-1'
    | 'spacing.-2'
    | 'spacing.-3'
    | 'spacing.-4'
    | 'spacing.-5'
    | 'spacing.-6'
    | 'spacing.-7'
    | 'spacing.-8'
    | 'spacing.-9'
    | 'spacing.-10'
    | 'spacing.-11'
    | 'spacing.-12'
    | 'spacing.-14'
    | 'spacing.-16'
    | 'spacing.-20'
    | 'spacing.-24'
    | 'spacing.-28'
    | 'spacing.-32'
    | 'spacing.-36'
    | 'spacing.-40'
    | 'spacing.-44'
    | 'spacing.-48'
    | 'spacing.-52'
    | 'spacing.-56'
    | 'spacing.-60'
    | 'spacing.-64'
    | 'spacing.-72'
    | 'spacing.-80'
    | 'spacing.-96'
    | 'spacing.-0.5'
    | 'spacing.-1.5'
    | 'spacing.-2.5'
    | 'spacing.-3.5'
    | 'spacing.-4.5'
    | 'colors.colorPalette'
    | 'colors.colorPalette.50'
    | 'colors.colorPalette.100'
    | 'colors.colorPalette.200'
    | 'colors.colorPalette.300'
    | 'colors.colorPalette.400'
    | 'colors.colorPalette.500'
    | 'colors.colorPalette.600'
    | 'colors.colorPalette.700'
    | 'colors.colorPalette.800'
    | 'colors.colorPalette.900'
    | 'colors.colorPalette.950'
    | 'colors.colorPalette.subtle'
    | 'colors.colorPalette.muted'
    | 'colors.colorPalette.emphasized'
    | 'colors.colorPalette.inverted'
    | 'colors.colorPalette.panel'
    | 'colors.colorPalette.error'
    | 'colors.colorPalette.warning'
    | 'colors.colorPalette.success'
    | 'colors.colorPalette.info'
    | 'colors.colorPalette.contrast'
    | 'colors.colorPalette.fg'
    | 'colors.colorPalette.solid'
    | 'colors.colorPalette.focusRing';

type Tokens

type Tokens = {
    aspectRatios: AspectRatiosToken;
    animations: AnimationsToken;
    blurs: BlursToken;
    borders: BordersToken;
    colors: ColorsToken;
    durations: DurationsToken;
    easings: EasingsToken;
    fonts: FontsToken;
    fontSizes: FontSizesToken;
    fontWeights: FontWeightsToken;
    letterSpacings: LetterSpacingsToken;
    lineHeights: LineHeightsToken;
    radii: RadiiToken;
    spacing: SpacingToken;
    sizes: SizesToken;
    zIndex: ZIndexToken;
    cursor: CursorToken;
    breakpoints: BreakpointsToken;
    shadows: ShadowsToken;
} & { [token: string]: never };

type UseBreakpointValueOptions

type UseBreakpointValueOptions = Omit<UseBreakpointOptions, 'breakpoints'>;

type UseDisclosureReturn

type UseDisclosureReturn = ReturnType<typeof useDisclosure>;

Namespaces

namespace Accordion

module 'dist/types/components/accordion/namespace.d.ts' {}

variable Item

const Item: any;

variable ItemBody

const ItemBody: any;

variable ItemContent

const ItemContent: any;

variable ItemIndicator

const ItemIndicator: any;

variable ItemTrigger

const ItemTrigger: any;

variable PropsProvider

const PropsProvider: React.Provider<ArkAccordion.RootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

function Context

Context: (props: ArkAccordion.ContextProps) => any;

function ItemContext

ItemContext: (props: ArkAccordion.ItemContextProps) => any;

interface FocusChangeDetails

interface AccordionFocusChangeDetails extends ArkAccordion.FocusChangeDetails {}

interface ItemBodyProps

interface AccordionItemBodyProps extends HTMLChakraProps<'div'> {}

interface ItemContentProps

interface AccordionItemContentProps
    extends HTMLChakraProps<'div', ArkAccordion.ItemContentBaseProps> {}

interface ItemIndicatorProps

interface AccordionItemIndicatorProps
    extends HTMLChakraProps<'button', ArkAccordion.ItemIndicatorBaseProps> {}

interface ItemProps

interface AccordionItemProps
    extends HTMLChakraProps<'div', ArkAccordion.ItemBaseProps> {}

interface ItemTriggerProps

interface AccordionItemTriggerProps
    extends HTMLChakraProps<'button', ArkAccordion.ItemTriggerBaseProps> {}

interface RootProps

interface AccordionRootProps
    extends HTMLChakraProps<'div', AccordionRootBaseProps> {}

interface RootProviderProps

interface AccordionRootProviderProps
    extends HTMLChakraProps<'div', AccordionRootProviderBaseProps> {}

interface ValueChangeDetails

interface AccordionValueChangeDetails extends ArkAccordion.ValueChangeDetails {}

namespace ActionBar

module 'dist/types/components/action-bar/namespace.d.ts' {}

variable CloseTrigger

const CloseTrigger: any;

variable Content

const Content: any;

variable Positioner

const Positioner: any;

variable PropsProvider

const PropsProvider: React.Provider<ActionBarRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable SelectionTrigger

const SelectionTrigger: any;

variable Separator

const Separator: any;

function Context

Context: (props: ArkPopover.ContextProps) => any;

interface CloseTriggerProps

interface ActionBarCloseTriggerProps
    extends HTMLChakraProps<'button', ArkPopover.CloseTriggerProps> {}

interface ContentProps

interface ActionBarContentProps
    extends HTMLChakraProps<'div', ArkPopover.ContentBaseProps> {}

interface OpenChangeDetails

interface ActionBarOpenChangeDetails extends ArkPopover.OpenChangeDetails {}

interface PositionerProps

interface ActionBarPositionerProps extends HTMLChakraProps<'div'> {}

interface RootProps

interface ActionBarRootProps extends Omit<ActionBarRootBaseProps, 'positioning'> {}

property children

children: React.ReactNode;

interface RootProviderProps

interface ActionBarRootProviderProps extends ActionBarRootProviderBaseProps {}

interface SelectionTriggerProps

interface ActionBarSelectionTriggerProps extends HTMLChakraProps<'button'> {}

interface SeparatorProps

interface ActionBarSeparatorProps extends HTMLChakraProps<'div'> {}

namespace Alert

module 'dist/types/components/alert/namespace.d.ts' {}

variable Content

const Content: any;

variable Description

const Description: any;

variable Indicator

const Indicator: any;

variable Root

const Root: any;

variable RootPropsProvider

const RootPropsProvider: React.Provider<AlertRootBaseProps>;

variable Title

const Title: any;

interface ContentProps

interface AlertContentProps extends HTMLChakraProps<'div'> {}

interface DescriptionProps

interface AlertDescriptionProps extends HTMLChakraProps<'div'> {}

interface IndicatorProps

interface AlertIndicatorProps extends HTMLChakraProps<'span'> {}

interface RootProps

interface AlertRootProps extends HTMLChakraProps<'div', AlertRootBaseProps> {}

interface TitleProps

interface AlertTitleProps extends HTMLChakraProps<'div'> {}

namespace Avatar

module 'dist/types/components/avatar/namespace.d.ts' {}

variable Fallback

const Fallback: any;

variable Icon

const Icon: any;

variable Image

const Image: any;

variable PropsProvider

const PropsProvider: React.Provider<AvatarRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

function Context

Context: (props: ArkAvatar.ContextProps) => any;

interface FallbackProps

interface AvatarFallbackProps
    extends HTMLChakraProps<'div', ArkAvatar.FallbackProps> {}

property name

name?: string;

The name to derive the initials from. If not provided, the fallback will display a generic icon.

interface IconProps

interface AvatarIconProps extends HTMLChakraProps<'svg'> {}

interface ImageProps

interface AvatarImageProps extends HTMLChakraProps<'img', ArkAvatar.ImageProps> {}

interface RootProps

interface AvatarRootProps extends HTMLChakraProps<'div', AvatarRootBaseProps> {}

interface StatusChangeDetails

interface AvatarStatusChangeDetails extends ArkAvatar.StatusChangeDetails {}

namespace Blockquote

module 'dist/types/components/blockquote/namespace.d.ts' {}

variable Caption

const Caption: any;

variable Content

const Content: any;

variable Icon

const Icon: any;

variable PropsProvider

const PropsProvider: React.Provider<BlockquoteRootBaseProps>;

variable Root

const Root: any;

interface BlockquoteIconProps

interface BlockquoteIconProps extends HTMLChakraProps<'svg'> {}

interface CaptionProps

interface BlockquoteCaptionProps extends HTMLChakraProps<'figcaption'> {}

interface ContentProps

interface BlockquoteContentProps extends HTMLChakraProps<'blockquote'> {}

interface RootProps

interface BlockquoteRootProps
    extends HTMLChakraProps<'figure', BlockquoteRootBaseProps> {}

module 'dist/types/components/breadcrumb/namespace.d.ts' {}

const CurrentLink: any;

const Ellipsis: any;

const Item: any;

const Link: any;

const List: any;

const PropsProvider: React.Provider<BreadcrumbRootBaseProps>;

const Root: any;

const Separator: any;

interface BreadcrumbCurrentLinkProps extends HTMLChakraProps<'span'> {}

interface BreadcrumbEllipsisProps extends HTMLChakraProps<'span'> {}

interface BreadcrumbItemProps extends HTMLChakraProps<'li'> {}

interface BreadcrumbLinkProps extends HTMLChakraProps<'a'> {}

interface BreadcrumbListProps extends HTMLChakraProps<'ol'> {}

interface BreadcrumbRootProps
    extends HTMLChakraProps<'nav', BreadcrumbRootBaseProps> {}

interface BreadcrumbSeparatorProps extends HTMLChakraProps<'li'> {}

namespace Card

module 'dist/types/components/card/namespace.d.ts' {}

variable Body

const Body: any;

variable Description

const Description: any;

const Footer: any;

const Header: any;

variable PropsProvider

const PropsProvider: React.Provider<CardRootBaseProps>;

variable Root

const Root: any;

variable Title

const Title: any;

interface BodyProps

interface CardBodyProps extends HTMLChakraProps<'div'> {}

interface DescriptionProps

interface CardDescriptionProps extends HTMLChakraProps<'p'> {}

interface FooterProps

interface CardFooterProps extends HTMLChakraProps<'div'> {}

interface HeaderProps

interface CardHeaderProps extends HTMLChakraProps<'div'> {}

interface RootProps

interface CardRootProps extends HTMLChakraProps<'div', CardRootBaseProps> {}

interface TitleProps

interface CardTitleProps extends HTMLChakraProps<'h2'> {}

namespace Checkbox

module 'dist/types/components/checkbox/namespace.d.ts' {}

variable Control

const Control: any;

variable Group

const Group: FunctionComponent<any>;

variable HiddenInput

const HiddenInput: any;

variable Indicator

const Indicator: any;

variable Label

const Label: any;

variable PropsProvider

const PropsProvider: React.Provider<CheckboxRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

function Context

Context: (props: ArkCheckbox.ContextProps) => any;

interface CheckedChangeDetails

interface CheckboxCheckedChangeDetails extends ArkCheckbox.CheckedChangeDetails {}

interface ControlProps

interface CheckboxControlProps
    extends HTMLChakraProps<'div', ArkCheckbox.ControlBaseProps> {}

interface GroupProps

interface CheckboxGroupProps
    extends HTMLChakraProps<'div', ArkCheckbox.GroupBaseProps> {}

interface IndicatorProps

interface CheckboxIndicatorProps extends HTMLChakraProps<'svg'> {}

property checked

checked?: React.ReactElement;

property indeterminate

indeterminate?: React.ReactElement;

interface LabelProps

interface CheckboxLabelProps
    extends HTMLChakraProps<'span', ArkCheckbox.LabelBaseProps> {}

interface RootProps

interface CheckboxRootProps
    extends HTMLChakraProps<'label', CheckboxRootBaseProps> {}

interface RootProviderProps

interface CheckboxRootProviderProps
    extends HTMLChakraProps<'div', CheckboxRootProviderBaseProps> {}

namespace CheckboxCard

module 'dist/types/components/checkbox-card/namespace.d.ts' {}

variable Addon

const Addon: any;

variable Content

const Content: any;

variable Control

const Control: any;

variable Description

const Description: any;

variable HiddenInput

const HiddenInput: any;

variable Indicator

const Indicator: any;

variable Label

const Label: any;

variable Root

const Root: any;

variable RootPropsProvider

const RootPropsProvider: React.Provider<CheckboxCardRootBaseProps>;

variable RootProvider

const RootProvider: any;

function Context

Context: (props: ArkCheckbox.ContextProps) => any;

interface AddonProps

interface CheckboxCardAddonProps extends HTMLChakraProps<'div'> {}

interface CheckedChangeDetails

interface CheckboxCardCheckedChangeDetails
    extends ArkCheckbox.CheckedChangeDetails {}

interface ContentProps

interface CheckboxCardContentProps extends HTMLChakraProps<'div'> {}

interface ControlProps

interface CheckboxCardControlProps
    extends HTMLChakraProps<'div', ArkCheckbox.ControlBaseProps> {}

interface DescriptionProps

interface CheckboxCardDescriptionProps extends HTMLChakraProps<'div'> {}

interface IndicatorProps

interface CheckboxCardIndicatorProps extends HTMLChakraProps<'svg'> {}

interface LabelProps

interface CheckboxCardLabelProps
    extends HTMLChakraProps<'span', ArkCheckbox.LabelBaseProps> {}

interface RootProps

interface CheckboxCardRootProps
    extends HTMLChakraProps<'label', CheckboxCardRootBaseProps> {}

interface RootProviderProps

interface CheckboxCardRootProviderProps
    extends HTMLChakraProps<'label', CheckboxCardRootProviderBaseProps> {}

namespace Clipboard

module 'dist/types/components/clipboard/namespace.d.ts' {}

variable Control

const Control: any;

variable CopyText

const CopyText: any;

variable Indicator

const Indicator: any;

variable Input

const Input: any;

variable Label

const Label: any;

variable PropsProvider

const PropsProvider: React.Provider<ClipboardRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Trigger

const Trigger: any;

variable ValueText

const ValueText: any;

function Context

Context: (props: ArkClipboard.ContextProps) => any;

interface ControlProps

interface ClipboardControlProps
    extends HTMLChakraProps<'div', ArkClipboard.ControlProps> {}

interface CopyStatusDetails

interface ClipboardCopyStatusDetails extends ArkClipboard.CopyStatusDetails {}

interface IndicatorProps

interface ClipboardIndicatorProps
    extends HTMLChakraProps<'div', ArkClipboard.IndicatorProps> {}

interface InputProps

interface ClipboardInputProps
    extends HTMLChakraProps<'input', ArkClipboard.InputProps> {}

interface LabelProps

interface ClipboardLabelProps
    extends HTMLChakraProps<'label', ArkClipboard.LabelProps> {}

interface RootProps

interface ClipboardRootProps
    extends HTMLChakraProps<'div', ClipboardRootBaseProps> {}

interface RootProviderProps

interface ClipboardRootProviderProps
    extends HTMLChakraProps<'div', ClipboardRootProviderBaseProps> {}

interface TriggerProps

interface ClipboardTriggerProps
    extends HTMLChakraProps<'button', ArkClipboard.TriggerProps> {}

interface ValueTextProps

interface ClipboardValueTextProps
    extends HTMLChakraProps<'div', ArkClipboard.ValueTextProps> {}

namespace Collapsible

module 'dist/types/components/collapsible/namespace.d.ts' {}

variable Content

const Content: any;

variable PropsProvider

const PropsProvider: React.Provider<CollapsibleRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Trigger

const Trigger: any;

function Context

Context: (props: ArkCollapsible.ContextProps) => any;

interface ContentProps

interface CollapsibleContentProps
    extends HTMLChakraProps<'div', ArkCollapsible.ContentBaseProps> {}

interface OpenChangeDetails

interface CollapsibleOpenChangeDetails extends ArkCollapsible.OpenChangeDetails {}

interface RootProps

interface CollapsibleRootProps
    extends HTMLChakraProps<'div', CollapsibleRootBaseProps> {}

interface RootProviderProps

interface CollapsibleRootProviderProps
    extends HTMLChakraProps<'div', CollapsibleRootProviderBaseProps> {}

interface TriggerProps

interface CollapsibleTriggerProps
    extends HTMLChakraProps<'button', ArkCollapsible.TriggerBaseProps> {}

namespace ColorPicker

module 'dist/types/components/color-picker/namespace.d.ts' {}

variable Area

const Area: any;

variable AreaBackground

const AreaBackground: any;

variable AreaThumb

const AreaThumb: any;

variable ChannelInput

const ChannelInput: any;

variable ChannelSlider

const ChannelSlider: any;

variable ChannelSliderLabel

const ChannelSliderLabel: any;

variable ChannelSliderThumb

const ChannelSliderThumb: any;

variable ChannelSliderTrack

const ChannelSliderTrack: any;

variable ChannelSliderValueText

const ChannelSliderValueText: any;

variable ChannelText

const ChannelText: any;

variable Content

const Content: any;

variable Control

const Control: any;

variable EyeDropper

const EyeDropper: any;

variable EyeDropperTrigger

const EyeDropperTrigger: any;

variable FormatSelect

const FormatSelect: any;

variable FormatTrigger

const FormatTrigger: any;

variable HiddenInput

const HiddenInput: any;

variable Input

const Input: any;

variable Label

const Label: any;

variable Positioner

const Positioner: any;

variable PropsProvider

const PropsProvider: React.Provider<ColorPickerRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Sliders

const Sliders: any;

variable Swatch

const Swatch: any;

variable SwatchGroup

const SwatchGroup: any;

variable SwatchIndicator

const SwatchIndicator: any;

variable SwatchTrigger

const SwatchTrigger: any;

variable TransparencyGrid

const TransparencyGrid: any;

variable Trigger

const Trigger: any;

variable ValueSwatch

const ValueSwatch: any;

variable ValueText

const ValueText: any;

variable View

const View: any;

function Context

Context: (props: ArkColorPicker.ContextProps) => any;

interface AreaBackgroundProps

interface ColorPickerAreaBackgroundProps
    extends HTMLChakraProps<'div', ArkColorPicker.AreaBackgroundBaseProps> {}

interface AreaProps

interface ColorPickerAreaProps
    extends HTMLChakraProps<'div', ArkColorPicker.AreaBaseProps> {}

interface AreaThumbProps

interface ColorPickerAreaThumbProps
    extends HTMLChakraProps<'div', ArkColorPicker.AreaThumbBaseProps> {}

interface ChannelInputProps

interface ColorPickerChannelInputProps
    extends HTMLChakraProps<'input', ArkColorPicker.ChannelInputBaseProps> {}

interface ChannelSliderLabelProps

interface ColorPickerChannelSliderLabelProps
    extends HTMLChakraProps<'div', ArkColorPicker.ChannelSliderLabelBaseProps> {}

interface ChannelSliderProps

interface ColorPickerChannelSliderProps
    extends HTMLChakraProps<'div', ArkColorPicker.ChannelSliderBaseProps> {}

interface ChannelSliderThumbProps

interface ColorPickerChannelSliderThumbProps
    extends HTMLChakraProps<'div', ArkColorPicker.ChannelSliderThumbBaseProps> {}

interface ChannelSliderTrackProps

interface ColorPickerChannelSliderTrackProps
    extends HTMLChakraProps<'div', ArkColorPicker.ChannelSliderTrackBaseProps> {}

interface ChannelSliderValueTextProps

interface ColorPickerChannelSliderValueTextProps
    extends HTMLChakraProps<'div', ArkColorPicker.ChannelSliderValueTextBaseProps> {}

interface ChannelTextProps

interface ColorPickerChannelTextProps extends HTMLChakraProps<'span'> {}

interface ContentProps

interface ColorPickerContentProps
    extends HTMLChakraProps<'div', ArkColorPicker.ContentBaseProps> {}

interface ControlProps

interface ColorPickerControlProps
    extends HTMLChakraProps<'div', ArkColorPicker.ControlBaseProps> {}

interface EyeDropperProps

interface ColorPickerEyeDropperProps extends IconButtonProps {}

interface EyeDropperTriggerProps

interface ColorPickerEyeDropperTriggerProps extends IconButtonProps {}

interface FormatSelectProps

interface ColorPickerFormatSelectProps
    extends HTMLChakraProps<'select', ArkColorPicker.FormatSelectBaseProps> {}

interface FormatTriggerProps

interface ColorPickerFormatTriggerProps
    extends HTMLChakraProps<'button', ArkColorPicker.FormatTriggerBaseProps> {}

interface LabelProps

interface ColorPickerLabelProps
    extends HTMLChakraProps<'label', ArkColorPicker.LabelBaseProps> {}

interface PositionerProps

interface ColorPickerPositionerProps
    extends HTMLChakraProps<'div', ArkColorPicker.PositionerBaseProps> {}

interface RootProps

interface ColorPickerRootProps
    extends HTMLChakraProps<'div', ColorPickerRootBaseProps> {}

interface RootProviderProps

interface ColorPickerRootProviderProps
    extends HTMLChakraProps<'div', ColorPickerRootProviderBaseProps> {}

interface SwatchGroupProps

interface ColorPickerSwatchGroupProps
    extends HTMLChakraProps<'div', ArkColorPicker.SwatchGroupBaseProps> {}

interface SwatchIndicatorProps

interface ColorPickerSwatchIndicatorProps
    extends HTMLChakraProps<'div', ArkColorPicker.SwatchIndicatorBaseProps> {}

interface SwatchProps

interface ColorPickerSwatchProps
    extends HTMLChakraProps<'div', ArkColorPicker.SwatchBaseProps> {}

interface SwatchTriggerProps

interface ColorPickerSwatchTriggerProps
    extends HTMLChakraProps<'button', ArkColorPicker.SwatchTriggerBaseProps> {}

interface TransparencyGridProps

interface ColorPickerTransparencyGridProps
    extends HTMLChakraProps<'div', ArkColorPicker.TransparencyGridBaseProps> {}

interface TriggerProps

interface ColorPickerTriggerProps
    extends HTMLChakraProps<'button', ArkColorPicker.TriggerBaseProps> {}

interface ValueChangeDetails

interface ColorPickerValueChangeDetails extends ArkColorPicker.ValueChangeDetails {}

interface ValueSwatchProps

interface ColorPickerValueSwatchProps
    extends HTMLChakraProps<'div', ArkColorPicker.ValueSwatchBaseProps> {}

interface ValueTextProps

interface ColorPickerValueTextProps
    extends HTMLChakraProps<'div', ArkColorPicker.ValueTextBaseProps> {}

interface ViewProps

interface ColorPickerViewProps
    extends HTMLChakraProps<'div', ArkColorPicker.ViewBaseProps> {}

namespace Combobox

module 'dist/types/components/combobox/namespace.d.ts' {}

variable ClearTrigger

const ClearTrigger: any;

variable Content

const Content: any;

variable Control

const Control: any;

variable Empty

const Empty: any;

variable Indicator

const Indicator: any;

variable IndicatorGroup

const IndicatorGroup: any;

variable Input

const Input: any;

variable Item

const Item: any;

variable ItemGroup

const ItemGroup: any;

variable ItemGroupLabel

const ItemGroupLabel: any;

variable ItemIndicator

const ItemIndicator: any;

variable ItemText

const ItemText: any;

variable Label

const Label: any;

variable Positioner

const Positioner: any;

variable PropsProvider

const PropsProvider: React.Provider<ComboboxRootBaseProps<any>>;

variable Root

const Root: ComboboxRootComponent;

variable RootProvider

const RootProvider: ComboboxRootProviderComponent;

variable Trigger

const Trigger: any;

function Context

Context: <T extends unknown>(props: ArkCombobox.ContextProps<T>) => any;

function ItemContext

ItemContext: (props: ArkCombobox.ItemContextProps) => any;

interface ClearTriggerProps

interface ComboboxClearTriggerProps
    extends HTMLChakraProps<'button', ArkCombobox.ClearTriggerBaseProps> {}

interface ContentProps

interface ComboboxContentProps
    extends HTMLChakraProps<'div', ArkCombobox.ContentBaseProps> {}

interface ControlProps

interface ComboboxControlProps
    extends HTMLChakraProps<'div', ArkCombobox.ControlBaseProps> {}

interface EmptyProps

interface ComboboxEmptyProps extends HTMLChakraProps<'div'> {}

interface IndicatorGroupProps

interface ComboboxIndicatorGroupProps extends HTMLChakraProps<'div'> {}

interface IndicatorProps

interface ComboboxItemIndicatorProps
    extends HTMLChakraProps<'div', ArkCombobox.ItemIndicatorBaseProps> {}

interface InputProps

interface ComboboxInputProps
    extends HTMLChakraProps<'input', ArkCombobox.InputBaseProps> {}

interface InputValueChangeDetails

interface ComboboxInputValueChangeDetails
    extends ArkCombobox.InputValueChangeDetails {}

interface ItemGroupProps

interface ComboboxItemGroupProps
    extends HTMLChakraProps<'div', ArkCombobox.ItemGroupBaseProps> {}

interface ItemProps

interface ComboboxItemProps
    extends HTMLChakraProps<'div', ArkCombobox.ItemBaseProps> {}

interface LabelProps

interface ComboboxLabelProps
    extends HTMLChakraProps<'label', ArkCombobox.LabelBaseProps> {}

interface OpenChangeDetails

interface ComboboxOpenChangeDetails extends ArkCombobox.OpenChangeDetails {}

interface RootComponent

interface ComboboxRootComponent {}

call signature

<T extends CollectionItem>(
    props: ComboboxRootProps<T> & React.RefAttributes<HTMLDivElement>
): JSX.Element;

interface RootProps

interface ComboboxRootProps<T extends CollectionItem = any>
    extends HTMLChakraProps<'div', ComboboxRootBaseProps<T>> {}

interface RootProviderProps

interface ComboboxRootProviderProps<T extends CollectionItem = any>
    extends HTMLChakraProps<'div', ComboboxRootProviderBaseProps<T>> {}

interface TriggerProps

interface ComboboxTriggerProps
    extends HTMLChakraProps<'button', ArkCombobox.TriggerBaseProps> {}

interface ValueChangeDetails

interface ComboboxValueChangeDetails<T extends CollectionItem = any>
    extends ArkCombobox.ValueChangeDetails<T> {}

namespace DataList

module 'dist/types/components/data-list/namespace.d.ts' {}

variable Item

const Item: any;

variable ItemLabel

const ItemLabel: any;

variable ItemValue

const ItemValue: any;

variable PropsProvider

const PropsProvider: React.Provider<DataListRootBaseProps>;

variable Root

const Root: any;

interface ItemLabelProps

interface DataListItemLabelProps extends HTMLChakraProps<'dt'> {}

interface ItemProps

interface DataListItemProps extends HTMLChakraProps<'div'> {}

interface ItemValueProps

interface DataListItemValueProps extends HTMLChakraProps<'dd'> {}

interface RootProps

interface DataListRootProps extends HTMLChakraProps<'dl', DataListRootBaseProps> {}

namespace Dialog

module 'dist/types/components/dialog/namespace.d.ts' {}

variable ActionTrigger

const ActionTrigger: any;

variable Backdrop

const Backdrop: any;

variable Body

const Body: any;

variable CloseTrigger

const CloseTrigger: any;

variable Content

const Content: any;

variable Description

const Description: any;

const Footer: any;

const Header: any;

variable Positioner

const Positioner: any;

variable PropsProvider

const PropsProvider: React.Provider<DialogRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Title

const Title: any;

variable Trigger

const Trigger: any;

function Context

Context: (props: ArkDialog.ContextProps) => any;

interface ActionTriggerProps

interface DialogActionTriggerProps extends HTMLChakraProps<'button'> {}

interface BackdropProps

interface DialogBackdropProps
    extends HTMLChakraProps<'div', ArkDialog.BackdropBaseProps> {}

interface BodyProps

interface DialogBodyProps extends HTMLChakraProps<'div'> {}

interface CloseTriggerProps

interface DialogCloseTriggerProps
    extends HTMLChakraProps<'button', ArkDialog.CloseTriggerBaseProps> {}

interface ContentProps

interface DialogContentProps
    extends HTMLChakraProps<'section', ArkDialog.ContentBaseProps> {}

interface DescriptionProps

interface DialogDescriptionProps
    extends HTMLChakraProps<'p', ArkDialog.DescriptionBaseProps> {}

interface FooterProps

interface DialogFooterProps extends HTMLChakraProps<'footer'> {}

interface HeaderProps

interface DialogHeaderProps extends HTMLChakraProps<'div'> {}

interface OpenChangeDetails

interface DialogOpenChangeDetails extends ArkDialog.OpenChangeDetails {}

interface PositionerProps

interface DialogPositionerProps
    extends HTMLChakraProps<'div', ArkDialog.PositionerBaseProps> {}

interface RootProps

interface DialogRootProps extends DialogRootBaseProps {}

property children

children: React.ReactNode;

interface RootProviderProps

interface DialogRootProviderProps extends DialogRootProviderBaseProps {}

property children

children: React.ReactNode;

interface TitleProps

interface DialogTitleProps extends HTMLChakraProps<'h2', ArkDialog.TitleBaseProps> {}

interface TriggerProps

interface DialogTriggerProps
    extends HTMLChakraProps<'button', ArkDialog.TriggerBaseProps> {}

namespace Drawer

module 'dist/types/components/drawer/namespace.d.ts' {}

variable ActionTrigger

const ActionTrigger: any;

variable Backdrop

const Backdrop: any;

variable Body

const Body: any;

variable CloseTrigger

const CloseTrigger: any;

variable Content

const Content: any;

variable Description

const Description: any;

const Footer: any;

const Header: any;

variable Positioner

const Positioner: any;

variable Root

const Root: any;

variable RootPropsProvider

const RootPropsProvider: React.Provider<DrawerRootBaseProps>;

variable RootProvider

const RootProvider: any;

variable Title

const Title: any;

variable Trigger

const Trigger: any;

function Context

Context: (props: ArkDialog.ContextProps) => any;

interface ActionTriggerProps

interface DrawerActionTriggerProps extends HTMLChakraProps<'button'> {}

interface BackdropProps

interface DrawerBackdropProps
    extends HTMLChakraProps<'div', ArkDialog.BackdropBaseProps> {}

interface BodyProps

interface DrawerBodyProps extends HTMLChakraProps<'div'> {}

interface CloseTriggerProps

interface DrawerCloseTriggerProps
    extends HTMLChakraProps<'button', ArkDialog.CloseTriggerBaseProps> {}

interface ContentProps

interface DrawerContentProps
    extends HTMLChakraProps<'section', ArkDialog.ContentBaseProps> {}

interface DescriptionProps

interface DrawerDescriptionProps
    extends HTMLChakraProps<'p', ArkDialog.DescriptionBaseProps> {}

interface FooterProps

interface DrawerFooterProps extends HTMLChakraProps<'footer'> {}

interface HeaderProps

interface DrawerHeaderProps extends HTMLChakraProps<'div'> {}

interface OpenChangeDetails

interface DrawerOpenChangeDetails extends ArkDialog.OpenChangeDetails {}

interface PositionerProps

interface DrawerPositionerProps
    extends HTMLChakraProps<'div', ArkDialog.PositionerBaseProps> {}

interface RootProps

interface DrawerRootProps extends DrawerRootBaseProps {}

property children

children: React.ReactNode;

interface RootProviderProps

interface DrawerRootProviderProps extends DrawerRootProviderBaseProps {}

property children

children: React.ReactNode;

interface TitleProps

interface DrawerTitleProps extends HTMLChakraProps<'h2', ArkDialog.TitleBaseProps> {}

interface TriggerProps

interface DrawerTriggerProps
    extends HTMLChakraProps<'button', ArkDialog.TriggerBaseProps> {}

namespace Editable

module 'dist/types/components/editable/namespace.d.ts' {}

variable Area

const Area: any;

variable CancelTrigger

const CancelTrigger: any;

variable Control

const Control: any;

variable EditTrigger

const EditTrigger: any;

variable Input

const Input: any;

variable Preview

const Preview: any;

variable PropsProvider

const PropsProvider: React.Provider<EditableRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable SubmitTrigger

const SubmitTrigger: any;

variable Textarea

const Textarea: any;

function Context

Context: (props: ArkEditable.ContextProps) => any;

interface AreaProps

interface EditableAreaProps
    extends HTMLChakraProps<'div', ArkEditable.AreaBaseProps> {}

interface CancelTriggerProps

interface EditableCancelTriggerProps
    extends HTMLChakraProps<'button', ArkEditable.CancelTriggerBaseProps> {}

interface ControlProps

interface EditableControlProps
    extends HTMLChakraProps<'div', ArkEditable.ControlBaseProps> {}

interface EditTriggerProps

interface EditableEditTriggerProps
    extends HTMLChakraProps<'button', ArkEditable.EditTriggerBaseProps> {}

interface InputProps

interface EditableInputProps
    extends HTMLChakraProps<'input', ArkEditable.InputBaseProps> {}

interface PreviewProps

interface EditablePreviewProps
    extends HTMLChakraProps<'span', ArkEditable.PreviewBaseProps> {}

interface RootProps

interface EditableRootProps extends HTMLChakraProps<'div', EditableRootBaseProps> {}

interface RootProviderProps

interface EditableRootProviderProps
    extends HTMLChakraProps<'div', EditableRootProviderBaseProps> {}

interface SubmitTriggerProps

interface EditableSubmitTriggerProps
    extends HTMLChakraProps<'button', ArkEditable.SubmitTriggerBaseProps> {}

interface TextareaProps

interface EditableTextareaProps
    extends HTMLChakraProps<'textarea', ArkEditable.InputBaseProps> {}

interface ValueChangeDetails

interface EditableValueChangeDetails extends ArkEditable.ValueChangeDetails {}

namespace EmptyState

module 'dist/types/components/empty-state/namespace.d.ts' {}

variable Content

const Content: any;

variable Description

const Description: any;

variable Indicator

const Indicator: any;

variable PropsProvider

const PropsProvider: React.Provider<EmptyStateRootBaseProps>;

variable Root

const Root: any;

variable Title

const Title: any;

interface ContentProps

interface EmptyStateContentProps extends HTMLChakraProps<'div'> {}

interface DescriptionProps

interface EmptyStateDescriptionProps extends HTMLChakraProps<'p'> {}

interface IndicatorProps

interface EmptyStateIndicatorProps extends HTMLChakraProps<'div'> {}

interface RootProps

interface EmptyStateRootProps
    extends HTMLChakraProps<'div', EmptyStateRootBaseProps> {}

interface TitleProps

interface EmptyStateTitleProps extends HTMLChakraProps<'h3'> {}

namespace Field

module 'dist/types/components/field/namespace.d.ts' {}

variable ErrorIcon

const ErrorIcon: any;

variable ErrorText

const ErrorText: any;

variable HelperText

const HelperText: any;

variable Label

const Label: any;

variable PropsProvider

const PropsProvider: React.Provider<FieldRootBaseProps>;

variable RequiredIndicator

const RequiredIndicator: any;

variable Root

const Root: any;

interface ErrorIconProps

interface FieldErrorIconProps extends HTMLChakraProps<'svg'> {}

interface ErrorTextProps

interface FieldErrorTextProps
    extends HTMLChakraProps<'div', ArkField.ErrorTextBaseProps> {}

interface HelperTextProps

interface FieldHelperTextProps
    extends HTMLChakraProps<'div', ArkField.HelperTextBaseProps> {}

interface LabelProps

interface FieldLabelProps
    extends HTMLChakraProps<'label', ArkField.LabelBaseProps> {}

interface RequiredIndicatorProps

interface FieldRequiredIndicatorProps extends HTMLChakraProps<'span'> {}

property fallback

fallback?: React.ReactNode;

interface RootProps

interface FieldRootProps extends HTMLChakraProps<'div', FieldRootBaseProps> {}

namespace Fieldset

module 'dist/types/components/fieldset/namespace.d.ts' {}

variable Content

const Content: any;

variable ErrorText

const ErrorText: any;

variable HelperText

const HelperText: any;

variable Legend

const Legend: any;

variable Root

const Root: any;

function Context

Context: (props: Fieldset.ContextProps) => any;

interface ContentProps

interface FieldsetContentProps extends HTMLChakraProps<'div'> {}

interface ErrorTextProps

interface FieldsetErrorTextProps
    extends HTMLChakraProps<'span', Fieldset.ErrorTextBaseProps> {}

interface HelperTextProps

interface FieldsetHelperTextProps
    extends HTMLChakraProps<'span', Fieldset.HelperTextBaseProps> {}

interface LegendProps

interface FieldsetLegendProps
    extends HTMLChakraProps<'legend', Fieldset.LegendBaseProps> {}

interface RootProps

interface FieldsetRootProps
    extends HTMLChakraProps<'fieldset', FieldsetRootBaseProps> {}

namespace FileUpload

module 'dist/types/components/file-upload/namespace.d.ts' {}

variable ClearTrigger

const ClearTrigger: any;

variable Dropzone

const Dropzone: any;

variable DropzoneContent

const DropzoneContent: any;

variable FileText

const FileText: any;

variable HiddenInput

const HiddenInput: any;

variable Item

const Item: any;

variable ItemContent

const ItemContent: any;

variable ItemDeleteTrigger

const ItemDeleteTrigger: any;

variable ItemGroup

const ItemGroup: any;

variable ItemName

const ItemName: any;

variable ItemPreview

const ItemPreview: any;

variable ItemPreviewImage

const ItemPreviewImage: any;

variable ItemSizeText

const ItemSizeText: any;

variable Label

const Label: any;

variable List

const List: any;

variable PropsProvider

const PropsProvider: React.Provider<FileUploadRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Trigger

const Trigger: any;

function Context

Context: (props: ArkFileUpload.ContextProps) => any;

function Items

Items: (props: FileUploadItemsProps) => any;

interface DropzoneContentProps

interface FileUploadDropzoneContentProps extends HTMLChakraProps<'div'> {}

interface DropzoneProps

interface FileUploadDropzoneProps
    extends HTMLChakraProps<'li', ArkFileUpload.DropzoneBaseProps> {}

interface FileAcceptDetails

interface FileUploadFileAcceptDetails extends ArkFileUpload.FileAcceptDetails {}

interface FileChangeDetails

interface FileUploadFileChangeDetails extends ArkFileUpload.FileChangeDetails {}

interface FileRejectDetails

interface FileUploadFileRejectDetails extends ArkFileUpload.FileRejectDetails {}

interface FileTextProps

interface FileUploadFileTextProps extends HTMLChakraProps<'span'> {}

property fallback

fallback?: string;

interface ItemContentProps

interface FileUploadItemContentProps extends HTMLChakraProps<'div'> {}

interface ItemDeleteTriggerProps

interface FileUploadItemDeleteTriggerProps
    extends HTMLChakraProps<'button', ArkFileUpload.ItemDeleteTriggerBaseProps> {}

interface ItemGroupProps

interface FileUploadItemGroupProps
    extends HTMLChakraProps<'ul', ArkFileUpload.ItemGroupBaseProps> {}

interface ItemNameProps

interface FileUploadItemNameProps
    extends HTMLChakraProps<'span', ArkFileUpload.ItemNameBaseProps> {}

interface ItemPreviewImageProps

interface FileUploadItemPreviewImageProps
    extends HTMLChakraProps<'img', ArkFileUpload.ItemPreviewImageBaseProps> {}

interface ItemPreviewProps

interface FileUploadItemPreviewProps
    extends HTMLChakraProps<'div', ArkFileUpload.ItemPreviewBaseProps> {}

interface ItemProps

interface FileUploadItemProps
    extends HTMLChakraProps<'li', ArkFileUpload.ItemBaseProps> {}

interface ItemSizeTextProps

interface FileUploadItemSizeTextProps
    extends HTMLChakraProps<'span', ArkFileUpload.ItemSizeTextBaseProps> {}

interface ItemsProps

interface FileUploadItemsProps
    extends Omit<FileUploadItemProps, 'file'>,
        FileUploadItemsBaseProps {}

interface LabelProps

interface FileUploadLabelProps
    extends HTMLChakraProps<'label', ArkFileUpload.LabelBaseProps> {}

interface ListProps

interface FileUploadListProps extends FileUploadItemsBaseProps {}

interface RootProps

interface FileUploadRootProps
    extends HTMLChakraProps<'div', FileUploadRootBaseProps> {}

interface RootProviderProps

interface FileUploadRootProviderProps
    extends HTMLChakraProps<'div', FileUploadRootProviderBaseProps> {}

interface TriggerProps

interface FileUploadTriggerProps
    extends HTMLChakraProps<'button', ArkFileUpload.TriggerBaseProps> {}

module 'dist/types/components/hover-card/namespace.d.ts' {}

variable Arrow

const Arrow: any;

variable ArrowTip

const ArrowTip: any;

variable Content

const Content: any;

variable Positioner

const Positioner: any;

variable PropsProvider

const PropsProvider: React.Provider<HoverCardRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Trigger

const Trigger: any;

function Context

Context: (props: ArkHoverCard.ContextProps) => any;

interface ArrowProps

interface HoverCardArrowProps
    extends HTMLChakraProps<'div', ArkHoverCard.ArrowBaseProps> {}

interface ArrowTipProps

interface HoverCardArrowTipProps
    extends HTMLChakraProps<'div', ArkHoverCard.ArrowTipBaseProps> {}

interface ContentProps

interface HoverCardContentProps
    extends HTMLChakraProps<'section', ArkHoverCard.ContentBaseProps> {}

interface OpenChangeDetails

interface HoverCardOpenChangeDetails extends ArkHoverCard.OpenChangeDetails {}

interface PositionerProps

interface HoverCardPositionerProps
    extends HTMLChakraProps<'div', ArkHoverCard.PositionerBaseProps> {}

interface RootProps

interface HoverCardRootProps extends HoverCardRootBaseProps {}

property children

children: React.ReactNode;

interface RootProviderProps

interface HoverCardRootProviderProps extends HoverCardRootProviderBaseProps {}

property children

children: React.ReactNode;

interface TriggerProps

interface HoverCardTriggerProps
    extends HTMLChakraProps<'button', ArkHoverCard.TriggerBaseProps> {}

namespace List

module 'dist/types/components/list/namespace.d.ts' {}

variable Indicator

const Indicator: any;

variable IndicatorProps

const IndicatorProps: any;

variable Item

const Item: any;

variable Root

const Root: any;

variable RootPropsProvider

const RootPropsProvider: React.Provider<ListRootBaseProps>;

interface ItemProps

interface ListItemProps extends HTMLChakraProps<'li'> {}

interface RootProps

interface ListRootProps extends HTMLChakraProps<'ul', ListRootBaseProps> {}

module 'dist/types/components/menu/namespace.d.ts' {}

const Arrow: any;

const ArrowTip: any;

const CheckboxItem: any;

const Content: any;

const ContextTrigger: any;

const Indicator: any;

const Item: any;

const ItemCommand: any;

const ItemGroup: any;

const ItemGroupLabel: any;

const ItemIndicator: any;

const ItemText: any;

const Positioner: any;

const RadioItem: any;

const RadioItemGroup: any;

const Root: any;

const RootPropsProvider: React.Provider<MenuRootBaseProps>;

const RootProvider: any;

const Separator: any;

const Trigger: any;

const TriggerItem: any;

Context: (props: ArkMenu.ContextProps) => any;

ItemContext: (props: ArkMenu.ItemContextProps) => any;

interface MenuArrowProps extends HTMLChakraProps<'div', ArkMenu.ArrowBaseProps> {}

interface MenuArrowTipProps
    extends HTMLChakraProps<'div', ArkMenu.ArrowTipBaseProps> {}

interface MenuCheckboxItemProps
    extends HTMLChakraProps<'div', ArkMenu.CheckboxItemBaseProps> {}

interface MenuItemCommandProps extends HTMLChakraProps<'kbd'> {}

interface MenuContentProps
    extends HTMLChakraProps<'div', ArkMenu.ContentBaseProps> {}

interface MenuContextTriggerProps
    extends HTMLChakraProps<'div', ArkMenu.ContextTriggerBaseProps> {}

interface MenuHighlightChangeDetails extends ArkMenu.HighlightChangeDetails {}

interface MenuIndicatorProps
    extends HTMLChakraProps<'div', ArkMenu.IndicatorBaseProps> {}

interface MenuItemCommandProps extends HTMLChakraProps<'kbd'> {}

interface MenuItemGroupLabelProps
    extends HTMLChakraProps<'div', ArkMenu.ItemGroupLabelBaseProps> {}

interface MenuItemGroupProps
    extends HTMLChakraProps<'div', ArkMenu.ItemGroupBaseProps> {}

interface MenuItemIndicatorProps
    extends HTMLChakraProps<'div', ArkMenu.ItemIndicatorBaseProps> {}

interface MenuItemProps extends HTMLChakraProps<'div', ArkMenu.ItemBaseProps> {}

interface MenuItemTextProps
    extends HTMLChakraProps<'div', ArkMenu.ItemTextBaseProps> {}

interface MenuOpenChangeDetails extends ArkMenu.OpenChangeDetails {}

interface MenuPositionerProps
    extends HTMLChakraProps<'div', ArkMenu.PositionerBaseProps> {}

interface MenuRadioItemGroupProps
    extends HTMLChakraProps<'div', ArkMenu.RadioItemGroupBaseProps> {}

interface MenuRadioItemProps
    extends HTMLChakraProps<'div', ArkMenu.RadioItemBaseProps> {}

interface MenuRootProps extends MenuRootBaseProps {}

children: React.ReactNode;

interface MenuRootProviderProps extends MenuRootProviderBaseProps {}

children: React.ReactNode;

interface MenuSelectionDetails extends ArkMenu.SelectionDetails {}

interface MenuSeparatorProps
    extends HTMLChakraProps<'div', ArkMenu.SeparatorBaseProps> {}

interface MenuTriggerItemProps
    extends HTMLChakraProps<'div', ArkMenu.TriggerItemBaseProps> {}

interface MenuTriggerProps
    extends HTMLChakraProps<'button', ArkMenu.TriggerBaseProps> {}

namespace NativeSelect

module 'dist/types/components/native-select/namespace.d.ts' {}

variable Field

const Field: any;

variable PropsProvider

const PropsProvider: React.Provider<NativeSelectRootBaseProps>;

variable Root

const Root: any;

function Indicator

Indicator: (props: NativeSelectIndicatorProps) => any;

interface FieldProps

interface NativeSelectFieldProps extends Omit<HTMLChakraProps<'select'>, Omitted> {}

property placeholder

placeholder?: string;

interface IndicatorProps

interface NativeSelectIndicatorProps extends HTMLChakraProps<'div'> {}

interface RootProps

interface NativeSelectRootProps
    extends HTMLChakraProps<'div', NativeSelectRootBaseProps> {}

namespace NumberInput

module 'dist/types/components/number-input/namespace.d.ts' {}

variable Control

const Control: any;

variable DecrementTrigger

const DecrementTrigger: any;

variable IncrementTrigger

const IncrementTrigger: any;

variable Input

const Input: any;

variable Label

const Label: any;

variable PropsProvider

const PropsProvider: React.Provider<NumberInputRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Scrubber

const Scrubber: any;

variable ValueText

const ValueText: any;

function Context

Context: (props: ArkNumberInput.ContextProps) => any;

interface ControlProps

interface NumberInputControlProps
    extends HTMLChakraProps<'div', ArkNumberInput.ControlBaseProps> {}

interface DecrementTriggerProps

interface NumberInputDecrementTriggerProps
    extends HTMLChakraProps<'button', ArkNumberInput.DecrementTriggerBaseProps> {}

interface FocusChangeDetails

interface NumberInputFocusChangeDetails extends ArkNumberInput.FocusChangeDetails {}

interface IncrementTriggerProps

interface NumberInputIncrementTriggerProps
    extends HTMLChakraProps<'button', ArkNumberInput.IncrementTriggerBaseProps> {}

interface InputProps

interface NumberInputInputProps
    extends HTMLChakraProps<'input', ArkNumberInput.InputBaseProps> {}

interface LabelProps

interface NumberInputLabelProps
    extends HTMLChakraProps<'label', ArkNumberInput.LabelBaseProps> {}

interface RootProps

interface NumberInputRootProps
    extends HTMLChakraProps<'div', NumberInputRootBaseProps> {}

interface RootProviderProps

interface NumberInputRootProviderProps
    extends HTMLChakraProps<'div', NumberInputRootProviderBaseProps> {}

interface ScrubberProps

interface NumberInputScrubberProps
    extends HTMLChakraProps<'div', ArkNumberInput.ScrubberBaseProps> {}

interface ValueChangeDetails

interface NumberInputValueChangeDetails extends ArkNumberInput.ValueChangeDetails {}

interface ValueInvalidDetails

interface NumberInputValueInvalidDetails
    extends ArkNumberInput.ValueInvalidDetails {}

interface ValueTextProps

interface NumberInputValueTextProps
    extends HTMLChakraProps<'span', ArkNumberInput.ValueTextBaseProps> {}

module 'dist/types/components/pagination/namespace.d.ts' {}

const Ellipsis: any;

const Item: any;

const NextTrigger: any;

const PageText: any;

const PrevTrigger: any;

const PropsProvider: React.Provider<PaginationRootBaseProps>;

const Root: any;

const RootProvider: any;

Context: (props: ArkPagination.ContextProps) => any;

Items: (props: PaginationItemsProps) => any;

interface PaginationEllipsisProps
    extends HTMLChakraProps<'div', ArkPagination.EllipsisBaseProps> {}

interface PaginationItemProps
    extends HTMLChakraProps<'button', ArkPagination.ItemBaseProps> {}

interface PaginationItemsProps extends React.HTMLAttributes<HTMLElement> {}

ellipsis?: React.ReactElement;

render: (page: { type: 'page'; value: number }) => React.ReactNode;

interface PaginationNextTriggerProps
    extends HTMLChakraProps<'button', ArkPagination.NextTriggerBaseProps> {}

interface PaginationPageChangeDetails extends ArkPagination.PageChangeDetails {}

interface PaginationPageSizeChangeDetails
    extends ArkPagination.PageSizeChangeDetails {}

interface PaginationPageTextProps extends BoxProps {}

format?: 'short' | 'compact' | 'long';

interface PaginationPrevTriggerProps
    extends HTMLChakraProps<'button', ArkPagination.PrevTriggerBaseProps> {}

interface PaginationRootProps
    extends HTMLChakraProps<'div', PaginationRootBaseProps> {}

interface PaginationRootProviderProps
    extends HTMLChakraProps<'div', PaginationRootProviderBaseProps> {}

namespace PinInput

module 'dist/types/components/pin-input/namespace.d.ts' {}

variable Control

const Control: any;

variable HiddenInput

const HiddenInput: any;

variable Input

const Input: any;

variable Label

const Label: any;

variable PropsProvider

const PropsProvider: React.Provider<PinInputRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

function Context

Context: (props: ArkPinInput.ContextProps) => any;

interface ControlProps

interface PinInputControlProps
    extends HTMLChakraProps<'div', ArkPinInput.ControlBaseProps> {}

interface InputProps

interface PinInputInputProps
    extends HTMLChakraProps<'input', ArkPinInput.InputBaseProps> {}

interface LabelProps

interface PinInputLabelProps extends HTMLChakraProps<'label'> {}

interface RootProps

interface PinInputRootProps extends HTMLChakraProps<'div', PinInputRootBaseProps> {}

interface RootProviderProps

interface PinInputRootProviderProps
    extends HTMLChakraProps<'div', PinInputRootProviderBaseProps> {}

interface ValueChangeDetails

interface PinInputValueChangeDetails extends ArkPinInput.ValueChangeDetails {}

module 'dist/types/components/popover/namespace.d.ts' {}

variable Anchor

const Anchor: any;

variable Arrow

const Arrow: any;

variable ArrowTip

const ArrowTip: any;

variable Body

const Body: any;

variable CloseTrigger

const CloseTrigger: any;

variable Content

const Content: any;

variable Description

const Description: any;

const Footer: any;

const Header: any;

variable Positioner

const Positioner: any;

variable PropsProvider

const PropsProvider: React.Provider<PopoverRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Title

const Title: any;

variable Trigger

const Trigger: any;

function Context

Context: (props: ArkPopover.ContextProps) => any;

function usePopoverStyles

usePopoverStyles: () => Record<string, import('../..').SystemStyleObject>;

interface AnchorProps

interface PopoverAnchorProps
    extends HTMLChakraProps<'div', ArkPopover.AnchorBaseProps> {}

interface ArrowProps

interface PopoverArrowProps
    extends HTMLChakraProps<'div', ArkPopover.ArrowBaseProps> {}

interface ArrowTipProps

interface PopoverArrowTipProps
    extends HTMLChakraProps<'div', ArkPopover.ArrowTipBaseProps> {}

interface BodyProps

interface PopoverBodyProps extends HTMLChakraProps<'div'> {}

interface CloseTriggerProps

interface PopoverCloseTriggerProps
    extends HTMLChakraProps<'button', ArkPopover.CloseTriggerBaseProps> {}

interface ContentProps

interface PopoverContentProps
    extends HTMLChakraProps<'div', ArkPopover.ContentBaseProps> {}

interface DescriptionProps

interface PopoverDescriptionProps
    extends HTMLChakraProps<'div', ArkPopover.DescriptionBaseProps> {}

interface FooterProps

interface PopoverFooterProps extends HTMLChakraProps<'footer'> {}

interface HeaderProps

interface PopoverHeaderProps
    extends HTMLChakraProps<'div', ArkPopover.TitleBaseProps> {}

interface OpenChangeDetails

interface PopoverOpenChangeDetails extends ArkPopover.OpenChangeDetails {}

interface PositionerProps

interface PopoverPositionerProps
    extends HTMLChakraProps<'div', ArkPopover.PositionerBaseProps> {}

interface RootProps

interface PopoverRootProps extends PopoverRootBaseProps {}

property children

children: React.ReactNode;

interface RootProviderProps

interface PopoverRootProviderProps extends PopoverRootProviderBaseProps {}

property children

children: React.ReactNode;

interface TitleProps

interface PopoverTitleProps
    extends HTMLChakraProps<'div', ArkPopover.TitleBaseProps> {}

interface TriggerProps

interface PopoverTriggerProps
    extends HTMLChakraProps<'button', ArkPopover.TriggerBaseProps> {}

namespace Progress

module 'dist/types/components/progress/namespace.d.ts' {}

variable Label

const Label: any;

variable PropsProvider

const PropsProvider: React.Provider<ProgressRootBaseProps>;

variable Range

const Range: any;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Track

const Track: any;

variable ValueText

const ValueText: any;

function Context

Context: (props: ArkProgress.ContextProps) => any;

interface LabelProps

interface ProgressLabelProps
    extends HTMLChakraProps<'div', ArkProgress.LabelBaseProps> {}

interface RangeProps

interface ProgressRangeProps
    extends HTMLChakraProps<'div', ArkProgress.RangeBaseProps> {}

interface RootProps

interface ProgressRootProps extends HTMLChakraProps<'div', ProgressRootBaseProps> {}

interface RootProviderProps

interface ProgressRootProviderProps
    extends HTMLChakraProps<'div', ProgressRootProviderBaseProps> {}

interface TrackProps

interface ProgressTrackProps
    extends HTMLChakraProps<'div', ArkProgress.TrackBaseProps> {}

interface ValueTextProps

interface ProgressValueTextProps
    extends HTMLChakraProps<'div', ArkProgress.ValueTextBaseProps> {}

namespace ProgressCircle

module 'dist/types/components/progress-circle/namespace.d.ts' {}

variable Circle

const Circle: any;

variable Label

const Label: any;

variable PropsProvider

const PropsProvider: React.Provider<ProgressCircleRootBaseProps>;

variable Range

const Range: any;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Track

const Track: any;

variable ValueText

const ValueText: any;

interface CircleProps

interface ProgressCircleCircleProps
    extends HTMLChakraProps<'svg', ArkProgress.CircleBaseProps> {}

interface LabelProps

interface ProgressCircleLabelProps
    extends HTMLChakraProps<'div', ArkProgress.LabelBaseProps> {}

interface RangeProps

interface ProgressCircleRangeProps
    extends HTMLChakraProps<'circle', ArkProgress.RangeBaseProps> {}

interface RootProps

interface ProgressCircleRootProps
    extends HTMLChakraProps<'div', ProgressCircleRootBaseProps> {}

interface RootProviderProps

interface ProgressCircleRootProviderProps
    extends HTMLChakraProps<'div', ProgressCircleRootProviderBaseProps> {}

interface TrackProps

interface ProgressCircleTrackProps
    extends HTMLChakraProps<'circle', ArkProgress.TrackBaseProps> {}

interface ValueTextProps

interface ProgressCircleValueTextProps
    extends HTMLChakraProps<'div', ArkProgress.ValueTextBaseProps> {}

namespace QrCode

module 'dist/types/components/qr-code/namespace.d.ts' {}

variable DownloadTrigger

const DownloadTrigger: any;

variable Frame

const Frame: any;

variable Overlay

const Overlay: any;

variable Pattern

const Pattern: any;

variable PropsProvider

const PropsProvider: React.Provider<QrCodeRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

interface DownloadTriggerProps

interface QrCodeDownloadTriggerProps
    extends HTMLChakraProps<'button', ArkQrCode.DownloadTriggerBaseProps> {}

interface FrameProps

interface QrCodeFrameProps extends HTMLChakraProps<'svg'> {}

interface OverlayProps

interface QrCodeOverlayProps extends HTMLChakraProps<'div'> {}

interface PatternProps

interface QrCodePatternProps extends HTMLChakraProps<'path'> {}

interface RootProps

interface QrCodeRootProps extends HTMLChakraProps<'div', QrCodeRootBaseProps> {}

interface RootProviderProps

interface QrCodeRootProviderProps
    extends HTMLChakraProps<'div', QrCodeRootProviderBaseProps> {}

namespace RadioCard

module 'dist/types/components/radio-card/namespace.d.ts' {}

variable Context

const Context: React.FC<RadioCardContextProps>;

variable Item

const Item: any;

variable ItemAddon

const ItemAddon: any;

variable ItemContent

const ItemContent: any;

variable ItemContext

const ItemContext: React.FC<RadioCardItemContextProps>;

variable ItemControl

const ItemControl: any;

variable ItemDescription

const ItemDescription: any;

variable ItemHiddenInput

const ItemHiddenInput: any;

variable ItemIndicator

const ItemIndicator: any;

variable ItemText

const ItemText: any;

variable Label

const Label: any;

variable PropsProvider

const PropsProvider: React.Provider<RadioCardRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

interface ItemAddonProps

interface RadioCardItemAddonProps extends HTMLChakraProps<'div'> {}

interface ItemContentProps

interface RadioCardItemContentProps extends HTMLChakraProps<'div'> {}

interface ItemControlProps

interface RadioCardItemControlProps
    extends HTMLChakraProps<'div', ArkRadioGroup.ItemControlBaseProps> {}

interface ItemDescriptionProps

interface RadioCardItemDescriptionProps extends HTMLChakraProps<'div'> {}

interface ItemIndicatorProps

interface RadioCardItemIndicatorProps extends HTMLChakraProps<'span'> {}

property checked

checked?: React.ReactElement;

interface ItemProps

interface RadioCardItemProps
    extends HTMLChakraProps<'div', ArkRadioGroup.ItemBaseProps> {}

interface ItemTextProps

interface RadioCardItemTextProps
    extends HTMLChakraProps<'span', ArkRadioGroup.ItemTextBaseProps> {}

interface LabelProps

interface RadioCardLabelProps
    extends HTMLChakraProps<'div', ArkRadioGroup.LabelBaseProps> {}

interface RootProps

interface RadioCardRootProps
    extends HTMLChakraProps<'div', RadioCardRootBaseProps> {}

interface RootProviderProps

interface RadioCardRootProviderProps
    extends HTMLChakraProps<'div', RadioCardRootProviderBaseProps> {}

interface ValueChangeDetails

interface RadioCardValueChangeDetails extends ArkRadioGroup.ValueChangeDetails {}

namespace RadioGroup

module 'dist/types/components/radio-group/namespace.d.ts' {}

variable Context

const Context: React.FC<RadioGroupContextProps>;

variable Item

const Item: any;

variable ItemContext

const ItemContext: React.FC<RadioGroupItemContextProps>;

variable ItemControl

const ItemControl: any;

variable ItemHiddenInput

const ItemHiddenInput: any;

variable ItemIndicator

const ItemIndicator: any;

variable ItemText

const ItemText: any;

variable Label

const Label: any;

variable PropsProvider

const PropsProvider: React.Provider<RadioGroupRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

interface ItemControlProps

interface RadioGroupItemControlProps
    extends HTMLChakraProps<'div', ArkRadioGroup.ItemControlBaseProps> {}

interface ItemProps

interface RadioGroupItemProps
    extends HTMLChakraProps<'div', ArkRadioGroup.ItemBaseProps> {}

interface ItemTextProps

interface RadioGroupItemTextProps
    extends HTMLChakraProps<'span', ArkRadioGroup.ItemTextBaseProps> {}

interface LabelProps

interface RadioGroupLabelProps
    extends HTMLChakraProps<'div', ArkRadioGroup.LabelBaseProps> {}

interface RootProps

interface RadioGroupRootProps
    extends HTMLChakraProps<'div', RadioGroupRootBaseProps> {}

interface RootProviderProps

interface RadioGroupRootProviderProps
    extends HTMLChakraProps<'div', RadioGroupRootProviderBaseProps> {}

interface ValueChangeDetails

interface RadioGroupValueChangeDetails extends ArkRadioGroup.ValueChangeDetails {}

namespace RatingGroup

module 'dist/types/components/rating-group/namespace.d.ts' {}

variable Control

const Control: any;

variable HiddenInput

const HiddenInput: any;

variable Item

const Item: any;

variable ItemIndicator

const ItemIndicator: any;

variable Label

const Label: any;

variable PropsProvider

const PropsProvider: React.Provider<RatingGroupRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

function Context

Context: (props: ArkRatingGroup.ContextProps) => any;

function ItemContext

ItemContext: (props: ArkRatingGroup.ItemContextProps) => any;

function Items

Items: (props: RatingGroupItemsProps) => any;

function useRatingGroupStyles

useRatingGroupStyles: () => Record<string, import('../..').SystemStyleObject>;

interface ControlProps

interface RatingGroupControlProps
    extends HTMLChakraProps<'div', ArkRatingGroup.ControlBaseProps> {}

interface HoverChangeDetails

interface RatingGroupHoverChangeDetails extends ArkRatingGroup.HoverChangeDetails {}

interface ItemIndicatorProps

interface RatingGroupItemIndicatorProps extends HTMLChakraProps<'span'> {}

property icon

icon?: React.ReactElement;

interface ItemProps

interface RatingGroupItemProps
    extends HTMLChakraProps<'div', ArkRatingGroup.ItemBaseProps> {}

interface ItemsProps

interface RatingGroupItemsProps extends Omit<RatingGroupItemProps, 'index'> {}

interface LabelProps

interface RatingGroupLabelProps
    extends HTMLChakraProps<'div', ArkRatingGroup.LabelBaseProps> {}

interface RootProps

interface RatingGroupRootProps
    extends HTMLChakraProps<'div', RatingGroupRootBaseProps> {}

interface RootProviderProps

interface RatingGroupRootProviderProps
    extends HTMLChakraProps<'div', RatingGroupRootProviderBaseProps> {}

interface ValueChangeDetails

interface RatingGroupValueChangeDetails extends ArkRatingGroup.ValueChangeDetails {}

namespace SegmentGroup

module 'dist/types/components/segment-group/namespace.d.ts' {}

variable Indicator

const Indicator: any;

variable Item

const Item: any;

variable ItemHiddenInput

const ItemHiddenInput: any;

variable ItemText

const ItemText: any;

variable PropsProvider

const PropsProvider: React.Provider<SegmentGroupRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

function Context

Context: (props: ArkSegmentGroup.ContextProps) => any;

function ItemContext

ItemContext: (props: ArkSegmentGroup.ItemContextProps) => any;

function Items

Items: (props: SegmentGroupItemsProps) => any;

interface IndicatorProps

interface SegmentGroupIndicatorProps
    extends HTMLChakraProps<'div', ArkSegmentGroup.IndicatorBaseProps> {}

interface ItemProps

interface SegmentGroupItemProps
    extends HTMLChakraProps<'label', ArkSegmentGroup.ItemBaseProps> {}

interface ItemsProps

interface SegmentGroupItemsProps extends Omit<SegmentGroupItemProps, 'value'> {}

property items

items: Array<string | Item>;

interface ItemTextProps

interface SegmentGroupItemTextProps
    extends HTMLChakraProps<'span', ArkSegmentGroup.ItemTextBaseProps> {}

interface RootProps

interface SegmentGroupRootProps
    extends HTMLChakraProps<'div', SegmentGroupRootBaseProps> {}

interface RootProviderProps

interface SegmentGroupRootProviderProps
    extends HTMLChakraProps<'div', SegmentGroupRootProviderBaseProps> {}

interface ValueChangeDetails

interface SegmentGroupValueChangeDetails
    extends ArkSegmentGroup.ValueChangeDetails {}

namespace Select

module 'dist/types/components/select/namespace.d.ts' {}

variable ClearTrigger

const ClearTrigger: any;

variable Content

const Content: any;

variable Control

const Control: any;

variable HiddenSelect

const HiddenSelect: any;

variable Indicator

const Indicator: any;

variable IndicatorGroup

const IndicatorGroup: any;

variable Item

const Item: any;

variable ItemGroup

const ItemGroup: any;

variable ItemGroupLabel

const ItemGroupLabel: any;

variable ItemIndicator

const ItemIndicator: any;

variable ItemText

const ItemText: any;

variable Label

const Label: any;

variable Positioner

const Positioner: any;

variable PropsProvider

const PropsProvider: React.Provider<SelectRootBaseProps<any>>;

variable Root

const Root: SelectRootComponent;

variable RootProvider

const RootProvider: SelectRootProviderComponent;

variable Trigger

const Trigger: any;

variable ValueText

const ValueText: any;

function Context

Context: <T extends unknown>(props: ArkSelect.ContextProps<T>) => any;

function ItemContext

ItemContext: (props: ArkSelect.ItemContextProps) => any;

interface ClearTriggerProps

interface SelectClearTriggerProps
    extends HTMLChakraProps<'button', ArkSelect.ClearTriggerBaseProps> {}

interface ContentProps

interface SelectContentProps
    extends HTMLChakraProps<'div', ArkSelect.ContentBaseProps> {}

interface ControlProps

interface SelectControlProps
    extends HTMLChakraProps<'div', ArkSelect.ControlBaseProps> {}

interface HighlightChangeDetails

interface SelectHighlightChangeDetails<T extends CollectionItem = any>
    extends ArkSelect.HighlightChangeDetails<T> {}

interface IndicatorGroupProps

interface SelectIndicatorGroupProps extends HTMLChakraProps<'div'> {}

interface IndicatorProps

interface SelectIndicatorProps
    extends HTMLChakraProps<'div', ArkSelect.ItemIndicatorBaseProps> {}

interface ItemGroupLabelProps

interface SelectItemGroupLabelProps
    extends HTMLChakraProps<'div', ArkSelect.ItemGroupLabelBaseProps> {}

interface ItemGroupProps

interface SelectItemGroupProps
    extends HTMLChakraProps<'div', ArkSelect.ItemGroupBaseProps> {}

interface ItemIndicatorProps

interface SelectItemIndicatorProps
    extends HTMLChakraProps<'div', ArkSelect.ItemIndicatorBaseProps> {}

interface ItemProps

interface SelectItemProps extends HTMLChakraProps<'div', ArkSelect.ItemBaseProps> {}

interface ItemTextProps

interface SelectItemTextProps
    extends HTMLChakraProps<'div', ArkSelect.ItemTextBaseProps> {}

interface LabelProps

interface SelectLabelProps
    extends HTMLChakraProps<'label', ArkSelect.LabelBaseProps> {}

interface OpenChangeDetails

interface SelectOpenChangeDetails extends ArkSelect.OpenChangeDetails {}

interface PositionerProps

interface SelectPositionerProps
    extends HTMLChakraProps<'div', ArkSelect.PositionerBaseProps> {}

interface RootComponent

interface SelectRootComponent {}

call signature

<T extends CollectionItem>(
    props: SelectRootProps<T> & React.RefAttributes<HTMLDivElement>
): JSX.Element;

interface RootProps

interface SelectRootProps<T extends CollectionItem = any>
    extends HTMLChakraProps<'div', SelectRootBaseProps<T>> {}

interface RootProviderProps

interface SelectRootProviderProps<T extends CollectionItem = any>
    extends HTMLChakraProps<'div', SelectRootProviderBaseProps<T>> {}

interface TriggerProps

interface SelectTriggerProps
    extends HTMLChakraProps<'button', ArkSelect.TriggerBaseProps> {}

interface ValueChangeDetails

interface SelectValueChangeDetails<T extends CollectionItem = any>
    extends ArkSelect.ValueChangeDetails<T> {}

interface ValueTextProps

interface SelectValueTextProps
    extends HTMLChakraProps<'span', ArkSelect.ValueTextBaseProps> {}

namespace Slider

module 'dist/types/components/slider/namespace.d.ts' {}

variable Control

const Control: any;

variable DraggingIndicator

const DraggingIndicator: any;

variable HiddenInput

const HiddenInput: any;

variable Label

const Label: any;

variable Marker

const Marker: any;

variable MarkerGroup

const MarkerGroup: any;

variable MarkerIndicator

const MarkerIndicator: any;

variable Marks

const Marks: any;

variable PropsProvider

const PropsProvider: React.Provider<SliderRootBaseProps>;

variable Range

const Range: any;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Thumb

const Thumb: any;

variable Track

const Track: any;

variable ValueText

const ValueText: any;

function Context

Context: (props: ArkSlider.ContextProps) => any;

function Thumbs

Thumbs: (props: Omit<SliderThumbProps, 'index'>) => any;

interface ControlProps

interface SliderControlProps
    extends HTMLChakraProps<'div', ArkSlider.ControlBaseProps> {}

interface DraggingIndicatorProps

interface SliderDraggingIndicatorProps
    extends HTMLChakraProps<'div', ArkSlider.DraggingIndicatorBaseProps> {}

interface LabelProps

interface SliderLabelProps
    extends HTMLChakraProps<'label', ArkSlider.LabelBaseProps> {}

interface MarkerGroupProps

interface SliderMarkerGroupProps
    extends HTMLChakraProps<'div', ArkSlider.MarkerGroupBaseProps> {}

interface MarkerIndicatorProps

interface SliderMarkerIndicatorProps extends HTMLChakraProps<'div'> {}

interface MarkerProps

interface SliderMarkerProps
    extends HTMLChakraProps<'div', ArkSlider.MarkerBaseProps> {}

interface MarksProps

interface SliderMarksProps extends SliderMarkerGroupProps {}

property marks

marks?: Array<
    | number
    | {
          value: number;
          label: React.ReactNode;
      }
>;

interface RangeProps

interface SliderRangeProps
    extends HTMLChakraProps<'div', ArkSlider.RangeBaseProps> {}

interface RootProps

interface SliderRootProps extends HTMLChakraProps<'div', SliderRootBaseProps> {}

interface RootProviderProps

interface SliderRootProviderProps
    extends HTMLChakraProps<'div', SliderRootProviderBaseProps> {}

interface ThumbProps

interface SliderThumbProps
    extends HTMLChakraProps<'div', ArkSlider.ThumbBaseProps> {}

interface TrackProps

interface SliderTrackProps
    extends HTMLChakraProps<'div', ArkSlider.TrackBaseProps> {}

interface ValueChangeDetails

interface SliderValueChangeDetails extends ArkSlider.ValueChangeDetails {}

interface ValueTextProps

interface SliderValueTextProps
    extends HTMLChakraProps<'div', ArkSlider.ValueTextBaseProps> {}

namespace Stat

module 'dist/types/components/stat/namespace.d.ts' {}

variable DownIndicator

const DownIndicator: any;

variable HelpText

const HelpText: any;

variable Label

const Label: any;

variable PropsProvider

const PropsProvider: React.Provider<StatRootBaseProps>;

variable Root

const Root: any;

variable UpIndicator

const UpIndicator: any;

variable ValueText

const ValueText: any;

variable ValueUnit

const ValueUnit: any;

interface DownIndicatorProps

interface StatDownIndicatorProps extends HTMLChakraProps<'span'> {}

interface HelpTextProps

interface StatHelpTextProps extends HTMLChakraProps<'span'> {}

interface LabelProps

interface StatLabelProps extends HTMLChakraProps<'dt'> {}

interface RootProps

interface StatRootProps extends HTMLChakraProps<'dl', StatRootBaseProps> {}

interface UpIndicatorProps

interface StatUpIndicatorProps extends HTMLChakraProps<'span'> {}

interface ValueTextProps

interface StatValueTextProps extends HTMLChakraProps<'dd'> {}

interface ValueUnitProps

interface StatValueUnitProps extends HTMLChakraProps<'span'> {}

namespace Status

module 'dist/types/components/status/namespace.d.ts' {}

variable Indicator

const Indicator: any;

variable PropsProvider

const PropsProvider: React.Provider<StatusRootBaseProps>;

variable Root

const Root: any;

interface IndicatorProps

interface StatusIndicatorProps extends HTMLChakraProps<'div'> {}

interface RootProps

interface StatusRootProps extends HTMLChakraProps<'div', StatusRootBaseProps> {}

namespace Steps

module 'dist/types/components/steps/namespace.d.ts' {}

variable CompletedContent

const CompletedContent: any;

variable Content

const Content: any;

variable Context

const Context: { (props: ArkSteps.ContextProps): any; displayName: string };

variable Description

const Description: any;

variable Indicator

const Indicator: any;

variable Item

const Item: any;

variable ItemContext

const ItemContext: { (props: ArkSteps.ItemContextProps): any; displayName: string };

variable List

const List: any;

variable NextTrigger

const NextTrigger: any;

variable Number

const Number: any;

variable PrevTrigger

const PrevTrigger: any;

variable PropsProvider

const PropsProvider: React.Provider<StepsRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Separator

const Separator: any;

variable Title

const Title: any;

variable Trigger

const Trigger: any;

function Status

Status: (props: StepsStatusProps) => any;

interface ChangeDetails

interface StepsChangeDetails extends ArkSteps.ChangeDetails {}

interface CompletedContentProps

interface StepsCompletedContentProps extends HTMLChakraProps<'div'> {}

interface ContentProps

interface StepsContentProps
    extends HTMLChakraProps<'div', ArkSteps.ContentBaseProps> {}

interface DescriptionProps

interface StepsDescriptionProps extends HTMLChakraProps<'div'> {}

interface IndicatorProps

interface StepsIndicatorProps
    extends HTMLChakraProps<'div', ArkSteps.IndicatorBaseProps> {}

interface ItemProps

interface StepsItemProps extends HTMLChakraProps<'div', ArkSteps.ItemBaseProps> {}

interface ListProps

interface StepsListProps extends HTMLChakraProps<'div', ArkSteps.ListBaseProps> {}

interface NextTriggerProps

interface StepsNextTriggerProps
    extends HTMLChakraProps<'button', ArkSteps.NextTriggerBaseProps> {}

interface NumberProps

interface StepsNumberProps extends HTMLChakraProps<'div'> {}

interface PrevTriggerProps

interface StepsPrevTriggerProps
    extends HTMLChakraProps<'button', ArkSteps.PrevTriggerBaseProps> {}

interface RootProps

interface StepsRootProps extends HTMLChakraProps<'div', StepsRootBaseProps> {}

interface RootProviderProps

interface StepsRootProviderProps
    extends HTMLChakraProps<'div', StepsRootProviderBaseProps> {}

interface SeparatorProps

interface StepsSeparatorProps
    extends HTMLChakraProps<'div', ArkSteps.SeparatorBaseProps> {}

interface StatusProps

interface StepsStatusProps {}

property complete

complete: React.ReactNode;

property current

current?: React.ReactNode;

property incomplete

incomplete: React.ReactNode;

interface TitleProps

interface StepsTitleProps extends HTMLChakraProps<'div'> {}

interface TriggerProps

interface StepsTriggerProps
    extends HTMLChakraProps<'button', ArkSteps.TriggerBaseProps> {}

namespace Switch

module 'dist/types/components/switch/namespace.d.ts' {}

variable Control

const Control: any;

variable HiddenInput

const HiddenInput: any;

variable Indicator

const Indicator: any;

variable Label

const Label: any;

variable PropsProvider

const PropsProvider: React.Provider<SwitchRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Thumb

const Thumb: any;

variable ThumbIndicator

const ThumbIndicator: any;

function Context

Context: (props: ArkSwitch.ContextProps) => any;

interface CheckedChangeDetails

interface SwitchCheckedChangeDetails extends ArkSwitch.CheckedChangeDetails {}

interface ControlProps

interface SwitchControlProps
    extends HTMLChakraProps<'span', ArkSwitch.ControlBaseProps> {}

interface IndicatorProps

interface SwitchIndicatorProps extends HTMLChakraProps<'span'> {}

property fallback

fallback?: React.ReactNode;

interface LabelProps

interface SwitchLabelProps
    extends HTMLChakraProps<'span', ArkSwitch.LabelBaseProps> {}

interface RootProps

interface SwitchRootProps extends HTMLChakraProps<'label', SwitchRootBaseProps> {}

interface RootProviderProps

interface SwitchRootProviderProps
    extends HTMLChakraProps<'label', SwitchRootProviderBaseProps> {}

interface ThumbIndicatorProps

interface SwitchThumbIndicatorProps extends HTMLChakraProps<'span'> {}

property fallback

fallback?: React.ReactNode;

interface ThumbProps

interface SwitchThumbProps
    extends HTMLChakraProps<'span', ArkSwitch.ThumbBaseProps> {}

namespace Table

module 'dist/types/components/table/namespace.d.ts' {}

variable Body

const Body: any;

variable Caption

const Caption: any;

variable Cell

const Cell: any;

variable Column

const Column: any;

variable ColumnGroup

const ColumnGroup: any;

variable ColumnHeader

const ColumnHeader: any;

const Footer: any;

const Header: any;

variable Root

const Root: any;

variable RootPropsProvider

const RootPropsProvider: React.Provider<TableRootBaseProps>;

variable Row

const Row: any;

variable ScrollArea

const ScrollArea: FunctionComponent<any>;

interface BodyProps

interface TableBodyProps extends HTMLChakraProps<'tbody'> {}

interface CaptionProps

interface TableCaptionProps extends HTMLChakraProps<'caption'> {}

interface CellProps

interface TableCellProps extends HTMLChakraProps<'td'> {}

interface ColumnGroupProps

interface TableColumnGroupProps extends HTMLChakraProps<'colgroup'> {}

interface ColumnHeaderProps

interface TableColumnHeaderProps extends HTMLChakraProps<'th'> {}

interface ColumnProps

interface TableColumnProps extends HTMLChakraProps<'col'> {}

interface FooterProps

interface TableFooterProps extends HTMLChakraProps<'tfoot'> {}

interface HeaderProps

interface TableHeaderProps extends HTMLChakraProps<'thead'> {}

interface RootProps

interface TableRootProps extends HTMLChakraProps<'table', TableRootBaseProps> {}

property native

native?: boolean;

If true, the table will style its descendants with nested selectors

interface RowProps

interface TableRowProps extends HTMLChakraProps<'tr'> {}

interface ScrollAreaProps

interface TableScrollAreaProps extends HTMLChakraProps<'div'> {}

namespace Tabs

module 'dist/types/components/tabs/namespace.d.ts' {}

variable Content

const Content: any;

variable ContentGroup

const ContentGroup: any;

variable Indicator

const Indicator: any;

variable List

const List: any;

variable PropsProvider

const PropsProvider: React.Provider<TabsRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Trigger

const Trigger: any;

function Context

Context: (props: ArkTabs.ContextProps) => any;

interface ContentGroupProps

interface TabsContentGroupProps extends HTMLChakraProps<'div'> {}

interface ContentProps

interface TabsContentProps
    extends HTMLChakraProps<'div', ArkTabs.ContentBaseProps> {}

interface IndicatorProps

interface TabsIndicatorProps extends HTMLChakraProps<'div', ArkTabs.ListBaseProps> {}

interface ListProps

interface TabsListProps extends HTMLChakraProps<'div', ArkTabs.ListBaseProps> {}

interface RootProps

interface TabsRootProps extends HTMLChakraProps<'div', TabsRootBaseProps> {}

interface RootProviderProps

interface TabsRootProviderProps
    extends HTMLChakraProps<'div', TabsRootProviderBaseProps> {}

interface TriggerProps

interface TabsTriggerProps
    extends HTMLChakraProps<'button', ArkTabs.TriggerBaseProps> {}

interface ValueChangeDetails

interface TabsValueChangeDetails extends ArkTabs.ValueChangeDetails {}

namespace Tag

module 'dist/types/components/tag/namespace.d.ts' {}

variable CloseTrigger

const CloseTrigger: any;

variable EndElement

const EndElement: any;

variable Label

const Label: any;

variable Root

const Root: any;

variable RootPropsProvider

const RootPropsProvider: React.Provider<TagRootBaseProps>;

variable StartElement

const StartElement: any;

interface CloseTriggerProps

interface TagCloseTriggerProps extends HTMLChakraProps<'button'> {}

interface EndElementProps

interface TagEndElementProps extends HTMLChakraProps<'span'> {}

interface LabelProps

interface TagLabelProps extends HTMLChakraProps<'span'> {}

interface RootProps

interface TagRootProps extends HTMLChakraProps<'span', TagRootBaseProps> {}

interface StartElementProps

interface TagStartElementProps extends HTMLChakraProps<'span'> {}

namespace Timeline

module 'dist/types/components/timeline/namespace.d.ts' {}

variable Connector

const Connector: any;

variable Content

const Content: any;

variable Description

const Description: any;

variable Indicator

const Indicator: any;

variable Item

const Item: any;

variable Root

const Root: any;

variable RootPropsProvider

const RootPropsProvider: React.Provider<TimelineRootBaseProps>;

variable Separator

const Separator: any;

variable Title

const Title: any;

interface ConnectorProps

interface TimelineConnectorProps extends HTMLChakraProps<'div'> {}

interface ContentProps

interface TimelineContentProps extends HTMLChakraProps<'div'> {}

interface DescriptionProps

interface TimelineDescriptionProps extends HTMLChakraProps<'div'> {}

interface IndicatorProps

interface TimelineIndicatorProps extends HTMLChakraProps<'div'> {}

interface ItemProps

interface TimelineItemProps extends HTMLChakraProps<'div'> {}

interface RootProps

interface TimelineRootProps extends HTMLChakraProps<'div', TimelineRootBaseProps> {}

interface SeparatorProps

interface TimelineSeparatorProps extends HTMLChakraProps<'div'> {}

interface TitleProps

interface TimelineTitleProps extends HTMLChakraProps<'div'> {}

namespace Toast

module 'dist/types/components/toast/namespace.d.ts' {}

variable ActionTrigger

const ActionTrigger: any;

variable CloseTrigger

const CloseTrigger: any;

variable Description

const Description: any;

variable Indicator

const Indicator: any;

variable Root

const Root: any;

variable Title

const Title: any;

interface ActionTriggerProps

interface ToastActionTriggerProps
    extends HTMLChakraProps<'button', ArkToast.ActionTriggerProps> {}

interface CloseTriggerProps

interface ToastCloseTriggerProps
    extends HTMLChakraProps<'button', ArkToast.CloseTriggerProps> {}

interface DescriptionProps

interface ToastDescriptionProps
    extends HTMLChakraProps<'div', ArkToast.DescriptionProps> {}

interface IndicatorProps

interface ToastIndicatorProps extends HTMLChakraProps<'span'> {}

interface RootProps

interface ToastRootProps extends HTMLChakraProps<'div', ToastRootBaseProps> {}

interface TitleProps

interface ToastTitleProps extends HTMLChakraProps<'div', ArkToast.TitleProps> {}

namespace Toggle

module 'dist/types/components/toggle/namespace.d.ts' {}

variable Indicator

const Indicator: any;

variable PropsProvider

const PropsProvider: React.Provider<ToggleRootBaseProps>;

variable Root

const Root: any;

function Context

Context: (props: ArkToggle.ContextProps) => any;

interface IndicatorProps

interface ToggleIndicatorProps
    extends HTMLChakraProps<'div', ArkToggle.IndicatorBaseProps> {}

interface RootBaseProps

interface ToggleRootBaseProps
    extends Assign<ArkToggle.RootBaseProps, SlotRecipeProps<'toggle'>>,
        UnstyledProp {}

interface RootProps

interface ToggleRootProps extends HTMLChakraProps<'button', ToggleRootBaseProps> {}

module 'dist/types/components/tooltip/namespace.d.ts' {}

variable Arrow

const Arrow: any;

variable ArrowTip

const ArrowTip: any;

variable Content

const Content: any;

variable Positioner

const Positioner: any;

variable PropsProvider

const PropsProvider: React.Provider<TooltipRootBaseProps>;

variable Root

const Root: any;

variable RootProvider

const RootProvider: any;

variable Trigger

const Trigger: any;

function Context

Context: (props: ArkTooltip.ContextProps) => any;

interface ArrowProps

interface TooltipArrowProps extends HTMLChakraProps<'div', ArkTooltip.ArrowProps> {}

interface ArrowTipProps

interface TooltipArrowTipProps
    extends HTMLChakraProps<'div', ArkTooltip.ArrowTipProps> {}

interface ContentProps

interface TooltipContentProps
    extends HTMLChakraProps<'section', ArkTooltip.ContentProps> {}

interface OpenChangeDetails

interface TooltipOpenChangeDetails extends ArkTooltip.OpenChangeDetails {}

interface PositionerProps

interface TooltipPositionerProps
    extends HTMLChakraProps<'div', ArkTooltip.PositionerProps> {}

interface RootProps

interface TooltipRootProps extends TooltipRootBaseProps {}

property children

children?: React.ReactNode;

interface RootProviderProps

interface TooltipRootProviderProps extends TooltipRootProviderBaseProps {}

property children

children?: React.ReactNode;

interface TriggerProps

interface TooltipTriggerProps
    extends HTMLChakraProps<'button', ArkTooltip.TriggerProps> {}

Package Files (201)

Dependencies (8)

Dev Dependencies (4)

Peer Dependencies (3)

Badge

To add a badge like this oneto your package's README, use the codes available below.

You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@chakra-ui/react.

Markdown

[![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/@chakra-ui/react)

HTML

<a href="https://www.jsdocs.io/package/@chakra-ui/react"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>

Updated 2 seconds ago.
Package analyzed in 17425 ms.
Missing or incorrect documentation? Open an issue for this package.

@chakra-ui/react

Install

Overview

Index

Variables

Functions

Interfaces

Type Aliases

Namespaces

Variables

variable AbsoluteCenter

See Also

variable AccordionItem

variable AccordionItemBody

variable AccordionItemContent

variable AccordionItemIndicator

variable AccordionItemTrigger

variable AccordionPropsProvider

variable AccordionRoot

variable AccordionRootProvider

variable ActionBarCloseTrigger

variable ActionBarContent

variable ActionBarPositioner

variable ActionBarPropsProvider

variable ActionBarRoot

variable ActionBarRootProvider

variable ActionBarSelectionTrigger

variable ActionBarSeparator

variable AlertContent

variable AlertDescription

variable AlertIndicator

variable AlertPropsProvider

variable AlertRoot

variable AlertTitle

variable AspectRatio

variable AvatarFallback

variable AvatarGroup

variable AvatarIcon

variable AvatarImage

variable AvatarPropsProvider

variable AvatarRoot

variable AvatarRootProvider

variable Badge

variable BadgePropsProvider

variable Bleed

variable BlockquoteCaption

variable BlockquoteContent

variable BlockquoteIcon

variable BlockquotePropsProvider

variable BlockquoteRoot

variable Box

See Also

variable BreadcrumbCurrentLink

variable BreadcrumbEllipsis

variable BreadcrumbItem

variable BreadcrumbLink

variable BreadcrumbList

variable BreadcrumbPropsProvider

variable BreadcrumbRoot

variable BreadcrumbSeparator

variable Button

variable ButtonGroup

variable ButtonPropsProvider

variable CardBody

variable CardDescription

variable CardFooter

variable CardHeader

variable CardPropsProvider

variable CardRoot

variable CardTitle

variable Center

See Also

variable chakra

variable CheckboxCardAddon

variable CheckboxCardContent

variable CheckboxCardControl

variable CheckboxCardDescription

variable CheckboxCardHiddenInput

variable CheckboxCardIndicator

variable CheckboxCardLabel