@react-types/shared

  • Version 3.18.0
  • Published
  • 80.6 kB
  • No dependencies
  • Apache-2.0 license

Install

npm i @react-types/shared
yarn add @react-types/shared
pnpm add @react-types/shared

Overview

Spectrum UI components in React

Index

Interfaces

Type Aliases

Interfaces

interface AriaLabelingProps

interface AriaLabelingProps {}

    property 'aria-describedby'

    'aria-describedby'?: string;
    • Identifies the element (or elements) that describes the object.

    property 'aria-details'

    'aria-details'?: string;
    • Identifies the element (or elements) that provide a detailed, extended description for the object.

    property 'aria-label'

    'aria-label'?: string;
    • Defines a string value that labels the current element.

    property 'aria-labelledby'

    'aria-labelledby'?: string;
    • Identifies the element (or elements) that labels the current element.

    interface AriaValidationProps

    interface AriaValidationProps {}

      property 'aria-errormessage'

      'aria-errormessage'?: string;
      • Identifies the element that provides an error message for the object.

      interface AsyncLoadable

      interface AsyncLoadable {}

        property isLoading

        isLoading?: boolean;
        • Whether the items are currently loading.

        property onLoadMore

        onLoadMore?: () => any;
        • Handler that is called when more items should be loaded, e.g. while scrolling near the bottom.

        interface BaseMoveEvent

        interface BaseMoveEvent {}

          property altKey

          altKey: boolean;
          • Whether the alt keyboard modifier was held during the move event.

          property ctrlKey

          ctrlKey: boolean;
          • Whether the ctrl keyboard modifier was held during the move event.

          property metaKey

          metaKey: boolean;
          • Whether the meta keyboard modifier was held during the move event.

          property pointerType

          pointerType: PointerType;
          • The pointer type that triggered the move event.

          property shiftKey

          shiftKey: boolean;
          • Whether the shift keyboard modifier was held during the move event.

          interface BoxAlignmentStyleProps

          interface BoxAlignmentStyleProps {}

            property alignContent

            alignContent?: Responsive<
            | 'start'
            | 'end'
            | 'center'
            | 'space-between'
            | 'space-around'
            | 'space-evenly'
            | 'stretch'
            | 'baseline'
            | 'first baseline'
            | 'last baseline'
            | 'safe center'
            | 'unsafe center'
            >;
            • The distribution of space around child items along the cross axis. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content). 'start'

            property alignItems

            alignItems?: Responsive<
            | 'start'
            | 'end'
            | 'center'
            | 'stretch'
            | 'self-start'
            | 'self-end'
            | 'baseline'
            | 'first baseline'
            | 'last baseline'
            | 'safe center'
            | 'unsafe center'
            >;
            • The alignment of children within their container. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items). 'stretch'

            property columnGap

            columnGap?: Responsive<DimensionValue>;
            • The space to display between columns. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/column-gap).

            property gap

            gap?: Responsive<DimensionValue>;
            • The space to display between both rows and columns. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/gap).

            property justifyContent

            justifyContent?: Responsive<
            | 'start'
            | 'end'
            | 'center'
            | 'left'
            | 'right'
            | 'space-between'
            | 'space-around'
            | 'space-evenly'
            | 'stretch'
            | 'baseline'
            | 'first baseline'
            | 'last baseline'
            | 'safe center'
            | 'unsafe center'
            >;
            • The distribution of space around items along the main axis. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content). 'stretch'

            property rowGap

            rowGap?: Responsive<DimensionValue>;
            • The space to display between rows. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/row-gap).

            interface Collection

            interface Collection<T> extends Iterable<T> {}
            • A generic interface to access a readonly sequential collection of unique keyed items.

            property size

            readonly size: number;
            • The number of items in the collection.

            method at

            at: (idx: number) => T | null;
            • Get an item by the index of its key.

            method getChildren

            getChildren: (key: Key) => Iterable<T>;
            • Iterate over the child items of the given key.

            method getFirstKey

            getFirstKey: () => Key | null;
            • Get the first key in the collection.

            method getItem

            getItem: (key: Key) => T | null;
            • Get an item by its key.

            method getKeyAfter

            getKeyAfter: (key: Key) => Key | null;
            • Get the key that comes after the given key in the collection.

            method getKeyBefore

            getKeyBefore: (key: Key) => Key | null;
            • Get the key that comes before the given key in the collection.

            method getKeys

            getKeys: () => Iterable<Key>;
            • Iterate over all keys in the collection.

            method getLastKey

            getLastKey: () => Key | null;
            • Get the last key in the collection.

            method getTextValue

            getTextValue: (key: Key) => string;
            • Returns a string representation of the item's contents.

            interface CollectionBase

            interface CollectionBase<T> {}

              property children

              children: CollectionChildren<T>;
              • The contents of the collection.

              property disabledKeys

              disabledKeys?: Iterable<Key>;
              • The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with.

              property items

              items?: Iterable<T>;
              • Item objects in the collection.

              interface CollectionStateBase

              interface CollectionStateBase<T, C extends Collection<Node<T>> = Collection<Node<T>>>
              extends Partial<CollectionBase<T>> {}

                property collection

                collection?: C;
                • A pre-constructed collection to use instead of building one from items and children.

                interface DirectoryDropItem

                interface DirectoryDropItem {}

                  property kind

                  kind: 'directory';
                  • The item kind.

                  property name

                  name: string;
                  • The directory name.

                  method getEntries

                  getEntries: () => AsyncIterable<FileDropItem | DirectoryDropItem>;
                  • Returns the entries contained within the directory.

                  interface DOMAttributes

                  interface DOMAttributes<T = FocusableElement>
                  extends AriaAttributes,
                  ReactDOMAttributes<T> {}
                  • All DOM attributes supported across both HTML and SVG elements.

                  property className

                  className?: string | undefined;

                    property id

                    id?: string | undefined;

                      property role

                      role?: AriaRole | undefined;

                        property style

                        style?: CSSProperties | undefined;

                          property tabIndex

                          tabIndex?: number | undefined;

                            interface DOMProps

                            interface DOMProps {}

                              property id

                              id?: string;
                              • The element's unique identifier. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id).

                              interface DOMRefValue

                              interface DOMRefValue<T extends HTMLElement = HTMLElement> {}

                                method UNSAFE_getDOMNode

                                UNSAFE_getDOMNode: () => T;

                                  interface DragDropEvent

                                  interface DragDropEvent {}

                                    property x

                                    x: number;
                                    • The x coordinate of the event, relative to the target element.

                                    property y

                                    y: number;
                                    • The y coordinate of the event, relative to the target element.

                                    interface DragEndEvent

                                    interface DragEndEvent extends DragDropEvent {}

                                      property dropOperation

                                      dropOperation: DropOperation;
                                      • The drop operation that occurred.

                                      property type

                                      type: 'dragend';
                                      • The event type.

                                      interface DraggableCollectionEndEvent

                                      interface DraggableCollectionEndEvent extends DragEndEvent {}

                                        property isInternal

                                        isInternal: boolean;
                                        • Whether the drop ended within the same collection as it originated.

                                        property keys

                                        keys: Set<Key>;
                                        • The keys of the items that were dragged.

                                        interface DraggableCollectionMoveEvent

                                        interface DraggableCollectionMoveEvent extends DragMoveEvent {}

                                          property keys

                                          keys: Set<Key>;
                                          • The keys of the items that were dragged.

                                          interface DraggableCollectionProps

                                          interface DraggableCollectionProps {}

                                            property getAllowedDropOperations

                                            getAllowedDropOperations?: () => DropOperation[];
                                            • Function that returns the drop operations that are allowed for the dragged items. If not provided, all drop operations are allowed.

                                            property getItems

                                            getItems: (keys: Set<Key>) => DragItem[];
                                            • A function that returns the items being dragged.

                                            property onDragEnd

                                            onDragEnd?: (e: DraggableCollectionEndEvent) => void;
                                            • Handler that is called when the drag operation is ended, either as a result of a drop or a cancellation.

                                            property onDragMove

                                            onDragMove?: (e: DraggableCollectionMoveEvent) => void;
                                            • Handler that is called when the drag is moved.

                                            property onDragStart

                                            onDragStart?: (e: DraggableCollectionStartEvent) => void;
                                            • Handler that is called when a drag operation is started.

                                            property preview

                                            preview?: RefObject<DragPreviewRenderer>;
                                            • The ref of the element that will be rendered as the drag preview while dragging.

                                            interface DraggableCollectionStartEvent

                                            interface DraggableCollectionStartEvent extends DragStartEvent {}

                                              property keys

                                              keys: Set<Key>;
                                              • The keys of the items that were dragged.

                                              interface DragItem

                                              interface DragItem {}

                                                index signature

                                                [type: string]: string;

                                                  interface DragMoveEvent

                                                  interface DragMoveEvent extends DragDropEvent {}

                                                    property type

                                                    type: 'dragmove';
                                                    • The event type.

                                                    interface DragStartEvent

                                                    interface DragStartEvent extends DragDropEvent {}

                                                      property type

                                                      type: 'dragstart';
                                                      • The event type.

                                                      interface DragTypes

                                                      interface DragTypes {}

                                                        method has

                                                        has: (type: string | symbol) => boolean;
                                                        • Returns whether the drag contains data of the given type.

                                                        interface DropActivateEvent

                                                        interface DropActivateEvent extends DragDropEvent {}

                                                          property type

                                                          type: 'dropactivate';
                                                          • The event type.

                                                          interface DropEnterEvent

                                                          interface DropEnterEvent extends DragDropEvent {}

                                                            property type

                                                            type: 'dropenter';
                                                            • The event type.

                                                            interface DropEvent

                                                            interface DropEvent extends DragDropEvent {}

                                                              property dropOperation

                                                              dropOperation: DropOperation;
                                                              • The drop operation that should occur.

                                                              property items

                                                              items: DropItem[];
                                                              • The dropped items.

                                                              property type

                                                              type: 'drop';
                                                              • The event type.

                                                              interface DropExitEvent

                                                              interface DropExitEvent extends DragDropEvent {}

                                                                property type

                                                                type: 'dropexit';
                                                                • The event type.

                                                                interface DropMoveEvent

                                                                interface DropMoveEvent extends DragDropEvent {}

                                                                  property type

                                                                  type: 'dropmove';
                                                                  • The event type.

                                                                  interface DroppableCollectionActivateEvent

                                                                  interface DroppableCollectionActivateEvent extends DropActivateEvent {}

                                                                    property target

                                                                    target: DropTarget;
                                                                    • The drop target.

                                                                    interface DroppableCollectionBaseProps

                                                                    interface DroppableCollectionBaseProps {}

                                                                      property getDropOperation

                                                                      getDropOperation?: (
                                                                      target: DropTarget,
                                                                      types: DragTypes,
                                                                      allowedOperations: DropOperation[]
                                                                      ) => DropOperation;
                                                                      • A function returning the drop operation to be performed when items matching the given types are dropped on the drop target.

                                                                      property onDrop

                                                                      onDrop?: (e: DroppableCollectionDropEvent) => void;
                                                                      • Handler that is called when a valid drag is dropped on a drop target. When defined, this overrides other drop handlers such as onInsert, and onItemDrop.

                                                                      property onDropActivate

                                                                      onDropActivate?: (e: DroppableCollectionActivateEvent) => void;
                                                                      • Handler that is called after a valid drag is held over a drop target for a period of time.

                                                                      property onDropEnter

                                                                      onDropEnter?: (e: DroppableCollectionEnterEvent) => void;
                                                                      • Handler that is called when a valid drag enters a drop target.

                                                                      property onDropExit

                                                                      onDropExit?: (e: DroppableCollectionExitEvent) => void;
                                                                      • Handler that is called when a valid drag exits a drop target.

                                                                      interface DroppableCollectionDropEvent

                                                                      interface DroppableCollectionDropEvent extends DropEvent {}

                                                                        property target

                                                                        target: DropTarget;
                                                                        • The drop target.

                                                                        interface DroppableCollectionEnterEvent

                                                                        interface DroppableCollectionEnterEvent extends DropEnterEvent {}

                                                                          property target

                                                                          target: DropTarget;
                                                                          • The drop target.

                                                                          interface DroppableCollectionExitEvent

                                                                          interface DroppableCollectionExitEvent extends DropExitEvent {}

                                                                            property target

                                                                            target: DropTarget;
                                                                            • The drop target.

                                                                            interface DroppableCollectionInsertDropEvent

                                                                            interface DroppableCollectionInsertDropEvent {}

                                                                              property dropOperation

                                                                              dropOperation: DropOperation;
                                                                              • The drop operation that should occur.

                                                                              property items

                                                                              items: DropItem[];
                                                                              • The dropped items.

                                                                              property target

                                                                              target: ItemDropTarget;
                                                                              • The drop target.

                                                                              interface DroppableCollectionMoveEvent

                                                                              interface DroppableCollectionMoveEvent extends DropMoveEvent {}

                                                                                property target

                                                                                target: DropTarget;
                                                                                • The drop target.

                                                                                interface DroppableCollectionOnItemDropEvent

                                                                                interface DroppableCollectionOnItemDropEvent {}

                                                                                  property dropOperation

                                                                                  dropOperation: DropOperation;
                                                                                  • The drop operation that should occur.

                                                                                  property isInternal

                                                                                  isInternal: boolean;
                                                                                  • Whether the drag originated within the same collection as the drop.

                                                                                  property items

                                                                                  items: DropItem[];
                                                                                  • The dropped items.

                                                                                  property target

                                                                                  target: ItemDropTarget;
                                                                                  • The drop target.

                                                                                  interface DroppableCollectionProps

                                                                                  interface DroppableCollectionProps
                                                                                  extends DroppableCollectionUtilityOptions,
                                                                                  DroppableCollectionBaseProps {}

                                                                                    interface DroppableCollectionReorderEvent

                                                                                    interface DroppableCollectionReorderEvent {}

                                                                                      property dropOperation

                                                                                      dropOperation: DropOperation;
                                                                                      • The drop operation that should occur.

                                                                                      property keys

                                                                                      keys: Set<Key>;
                                                                                      • The keys of the items that were reordered.

                                                                                      property target

                                                                                      target: ItemDropTarget;
                                                                                      • The drop target.

                                                                                      interface DroppableCollectionRootDropEvent

                                                                                      interface DroppableCollectionRootDropEvent {}

                                                                                        property dropOperation

                                                                                        dropOperation: DropOperation;
                                                                                        • The drop operation that should occur.

                                                                                        property items

                                                                                        items: DropItem[];
                                                                                        • The dropped items.

                                                                                        interface DroppableCollectionUtilityOptions

                                                                                        interface DroppableCollectionUtilityOptions {}

                                                                                          property acceptedDragTypes

                                                                                          acceptedDragTypes?: 'all' | Array<string | symbol>;
                                                                                          • The drag types that the droppable collection accepts. If the collection accepts directories, include DIRECTORY_DRAG_TYPE in your array of allowed types. 'all'

                                                                                          property onInsert

                                                                                          onInsert?: (e: DroppableCollectionInsertDropEvent) => void;
                                                                                          • Handler that is called when external items are dropped "between" items.

                                                                                          property onItemDrop

                                                                                          onItemDrop?: (e: DroppableCollectionOnItemDropEvent) => void;
                                                                                          • Handler that is called when items are dropped "on" an item.

                                                                                          property onReorder

                                                                                          onReorder?: (e: DroppableCollectionReorderEvent) => void;
                                                                                          • Handler that is called when items are reordered via drag in the source collection.

                                                                                          property onRootDrop

                                                                                          onRootDrop?: (e: DroppableCollectionRootDropEvent) => void;
                                                                                          • Handler that is called when external items are dropped on the droppable collection's root.

                                                                                          property shouldAcceptItemDrop

                                                                                          shouldAcceptItemDrop?: (target: ItemDropTarget, types: DragTypes) => boolean;
                                                                                          • A function returning whether a given target in the droppable collection is a valid "on" drop target for the current drag types.

                                                                                          interface DropTargetDelegate

                                                                                          interface DropTargetDelegate {}

                                                                                            method getDropTargetFromPoint

                                                                                            getDropTargetFromPoint: (
                                                                                            x: number,
                                                                                            y: number,
                                                                                            isValidDropTarget: (target: DropTarget) => boolean
                                                                                            ) => DropTarget | null;
                                                                                            • Returns a drop target within a collection for the given x and y coordinates. The point is provided relative to the top left corner of the collection container. A drop target can be checked to see if it is valid using the provided isValidDropTarget function.

                                                                                            interface Expandable

                                                                                            interface Expandable {}

                                                                                              property defaultExpandedKeys

                                                                                              defaultExpandedKeys?: Iterable<Key>;
                                                                                              • The initial expanded keys in the collection (uncontrolled).

                                                                                              property expandedKeys

                                                                                              expandedKeys?: Iterable<Key>;
                                                                                              • The currently expanded keys in the collection (controlled).

                                                                                              property onExpandedChange

                                                                                              onExpandedChange?: (keys: Set<Key>) => any;
                                                                                              • Handler that is called when items are expanded or collapsed.

                                                                                              interface FileDropItem

                                                                                              interface FileDropItem {}

                                                                                                property kind

                                                                                                kind: 'file';
                                                                                                • The item kind.

                                                                                                property name

                                                                                                name: string;
                                                                                                • The file name.

                                                                                                property type

                                                                                                type: string;
                                                                                                • The file type (usually a mime type).

                                                                                                method getFile

                                                                                                getFile: () => Promise<File>;
                                                                                                • Returns the contents of the file as a blob.

                                                                                                method getText

                                                                                                getText: () => Promise<string>;
                                                                                                • Returns the contents of the file as a string.

                                                                                                interface FlexStyleProps

                                                                                                interface FlexStyleProps extends BoxAlignmentStyleProps, StyleProps {}

                                                                                                  property direction

                                                                                                  direction?: Responsive<'row' | 'column' | 'row-reverse' | 'column-reverse'>;
                                                                                                  • The direction in which to layout children. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction). 'row'

                                                                                                  property wrap

                                                                                                  wrap?: Responsive<boolean | 'wrap' | 'nowrap' | 'wrap-reverse'>;
                                                                                                  • Whether to wrap items onto multiple lines. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-wrap). false

                                                                                                  interface FocusableDOMProps

                                                                                                  interface FocusableDOMProps extends DOMProps {}

                                                                                                    property excludeFromTabOrder

                                                                                                    excludeFromTabOrder?: boolean;
                                                                                                    • Whether to exclude the element from the sequential tab order. If true, the element will not be focusable via the keyboard by tabbing. This should be avoided except in rare scenarios where an alternative means of accessing the element or its functionality via the keyboard is available.

                                                                                                    interface FocusableElement

                                                                                                    interface FocusableElement extends Element, HTMLOrSVGElement {}
                                                                                                    • Any focusable element, including both HTML and SVG elements.

                                                                                                    interface FocusableProps

                                                                                                    interface FocusableProps<Target = Element>
                                                                                                    extends FocusEvents<Target>,
                                                                                                    KeyboardEvents {}

                                                                                                      property autoFocus

                                                                                                      autoFocus?: boolean;
                                                                                                      • Whether the element should receive focus on render.

                                                                                                      interface FocusableRefValue

                                                                                                      interface FocusableRefValue<
                                                                                                      T extends HTMLElement = HTMLElement,
                                                                                                      D extends HTMLElement = T
                                                                                                      > extends DOMRefValue<D> {}

                                                                                                        method focus

                                                                                                        focus: () => void;

                                                                                                          interface FocusEvents

                                                                                                          interface FocusEvents<Target = Element> {}

                                                                                                            property onBlur

                                                                                                            onBlur?: (e: FocusEvent<Target>) => void;
                                                                                                            • Handler that is called when the element loses focus.

                                                                                                            property onFocus

                                                                                                            onFocus?: (e: FocusEvent<Target>) => void;
                                                                                                            • Handler that is called when the element receives focus.

                                                                                                            property onFocusChange

                                                                                                            onFocusChange?: (isFocused: boolean) => void;
                                                                                                            • Handler that is called when the element's focus status changes.

                                                                                                            interface GridStyleProps

                                                                                                            interface GridStyleProps extends BoxAlignmentStyleProps, StyleProps {}

                                                                                                              property areas

                                                                                                              areas?: Responsive<string[]>;
                                                                                                              • Defines named grid areas. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-areas).

                                                                                                              property autoColumns

                                                                                                              autoColumns?: Responsive<DimensionValue>;
                                                                                                              • Defines the size of implicitly generated columns. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-columns).

                                                                                                              property autoFlow

                                                                                                              autoFlow?: Responsive<'row' | 'column' | 'row dense' | 'column dense'>;
                                                                                                              • Controls how auto-placed items are flowed into the grid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-flow).

                                                                                                              property autoRows

                                                                                                              autoRows?: Responsive<DimensionValue>;
                                                                                                              • Defines the size of implicitly generated rows. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-rows).

                                                                                                              property columns

                                                                                                              columns?: Responsive<string | DimensionValue[]>;
                                                                                                              • Defines the sizes of each column in the grid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns).

                                                                                                              property justifyItems

                                                                                                              justifyItems?: Responsive<
                                                                                                              | 'auto'
                                                                                                              | 'normal'
                                                                                                              | 'start'
                                                                                                              | 'end'
                                                                                                              | 'center'
                                                                                                              | 'left'
                                                                                                              | 'right'
                                                                                                              | 'stretch'
                                                                                                              | 'self-start'
                                                                                                              | 'self-end'
                                                                                                              | 'baseline'
                                                                                                              | 'first baseline'
                                                                                                              | 'last baseline'
                                                                                                              | 'safe center'
                                                                                                              | 'unsafe center'
                                                                                                              | 'legacy right'
                                                                                                              | 'legacy left'
                                                                                                              | 'legacy center'
                                                                                                              >;
                                                                                                              • Defines the default justifySelf for all items in the grid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items).

                                                                                                              property rows

                                                                                                              rows?: Responsive<string | DimensionValue[]>;
                                                                                                              • Defines the sizes of each row in the grid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-rows).

                                                                                                              interface HelpTextProps

                                                                                                              interface HelpTextProps {}

                                                                                                                property description

                                                                                                                description?: ReactNode;
                                                                                                                • A description for the field. Provides a hint such as specific requirements for what to choose.

                                                                                                                property errorMessage

                                                                                                                errorMessage?: ReactNode;
                                                                                                                • An error message for the field.

                                                                                                                interface HoverEvent

                                                                                                                interface HoverEvent {}

                                                                                                                  property pointerType

                                                                                                                  pointerType: 'mouse' | 'pen';
                                                                                                                  • The pointer type that triggered the hover event.

                                                                                                                  property target

                                                                                                                  target: HTMLElement;
                                                                                                                  • The target element of the hover event.

                                                                                                                  property type

                                                                                                                  type: 'hoverstart' | 'hoverend';
                                                                                                                  • The type of hover event being fired.

                                                                                                                  interface HoverEvents

                                                                                                                  interface HoverEvents {}

                                                                                                                    property onHoverChange

                                                                                                                    onHoverChange?: (isHovering: boolean) => void;
                                                                                                                    • Handler that is called when the hover state changes.

                                                                                                                    property onHoverEnd

                                                                                                                    onHoverEnd?: (e: HoverEvent) => void;
                                                                                                                    • Handler that is called when a hover interaction ends.

                                                                                                                    property onHoverStart

                                                                                                                    onHoverStart?: (e: HoverEvent) => void;
                                                                                                                    • Handler that is called when a hover interaction starts.

                                                                                                                    interface InputBase

                                                                                                                    interface InputBase {}

                                                                                                                      property isDisabled

                                                                                                                      isDisabled?: boolean;
                                                                                                                      • Whether the input is disabled.

                                                                                                                      property isReadOnly

                                                                                                                      isReadOnly?: boolean;
                                                                                                                      • Whether the input can be selected but not changed by the user.

                                                                                                                      interface ItemDropTarget

                                                                                                                      interface ItemDropTarget {}

                                                                                                                        property dropPosition

                                                                                                                        dropPosition: DropPosition;
                                                                                                                        • The drop position relative to the item.

                                                                                                                        property key

                                                                                                                        key: Key;
                                                                                                                        • The item key.

                                                                                                                        property type

                                                                                                                        type: 'item';
                                                                                                                        • The drop target type.

                                                                                                                        interface ItemProps

                                                                                                                        interface ItemProps<T> {}

                                                                                                                          property 'aria-label'

                                                                                                                          'aria-label'?: string;
                                                                                                                          • An accessibility label for this item.

                                                                                                                          property childItems

                                                                                                                          childItems?: Iterable<T>;
                                                                                                                          • A list of child item objects. Used for dynamic collections.

                                                                                                                          property children

                                                                                                                          children: ReactNode;
                                                                                                                          • Rendered contents of the item or child items.

                                                                                                                          property hasChildItems

                                                                                                                          hasChildItems?: boolean;
                                                                                                                          • Whether this item has children, even if not loaded yet.

                                                                                                                          property textValue

                                                                                                                          textValue?: string;
                                                                                                                          • A string representation of the item's contents, used for features like typeahead.

                                                                                                                          property title

                                                                                                                          title?: ReactNode;
                                                                                                                          • Rendered contents of the item if children contains child items.

                                                                                                                          interface KeyboardDelegate

                                                                                                                          interface KeyboardDelegate {}

                                                                                                                            method getFirstKey

                                                                                                                            getFirstKey: (key?: Key, global?: boolean) => Key | null;
                                                                                                                            • Returns the first key, or null for none.

                                                                                                                            method getKeyAbove

                                                                                                                            getKeyAbove: (key: Key) => Key | null;
                                                                                                                            • Returns the key visually above the given one, or null for none.

                                                                                                                            method getKeyBelow

                                                                                                                            getKeyBelow: (key: Key) => Key | null;
                                                                                                                            • Returns the key visually below the given one, or null for none.

                                                                                                                            method getKeyForSearch

                                                                                                                            getKeyForSearch: (search: string, fromKey?: Key) => Key | null;
                                                                                                                            • Returns the next key after fromKey that matches the given search string, or null for none.

                                                                                                                            method getKeyLeftOf

                                                                                                                            getKeyLeftOf: (key: Key) => Key | null;
                                                                                                                            • Returns the key visually to the left of the given one, or null for none.

                                                                                                                            method getKeyPageAbove

                                                                                                                            getKeyPageAbove: (key: Key) => Key | null;
                                                                                                                            • Returns the key visually one page above the given one, or null for none.

                                                                                                                            method getKeyPageBelow

                                                                                                                            getKeyPageBelow: (key: Key) => Key | null;
                                                                                                                            • Returns the key visually one page below the given one, or null for none.

                                                                                                                            method getKeyRightOf

                                                                                                                            getKeyRightOf: (key: Key) => Key | null;
                                                                                                                            • Returns the key visually to the right of the given one, or null for none.

                                                                                                                            method getLastKey

                                                                                                                            getLastKey: (key?: Key, global?: boolean) => Key | null;
                                                                                                                            • Returns the last key, or null for none.

                                                                                                                            interface KeyboardEvents

                                                                                                                            interface KeyboardEvents {}

                                                                                                                              property onKeyDown

                                                                                                                              onKeyDown?: (e: KeyboardEvent) => void;
                                                                                                                              • Handler that is called when a key is pressed.

                                                                                                                              property onKeyUp

                                                                                                                              onKeyUp?: (e: KeyboardEvent) => void;
                                                                                                                              • Handler that is called when a key is released.

                                                                                                                              interface LabelableProps

                                                                                                                              interface LabelableProps {}

                                                                                                                                property label

                                                                                                                                label?: ReactNode;
                                                                                                                                • The content to display as the label.

                                                                                                                                interface LongPressEvent

                                                                                                                                interface LongPressEvent extends Omit<PressEvent, 'type'> {}

                                                                                                                                  property type

                                                                                                                                  type: 'longpressstart' | 'longpressend' | 'longpress';
                                                                                                                                  • The type of long press event being fired.

                                                                                                                                  interface MoveEndEvent

                                                                                                                                  interface MoveEndEvent extends BaseMoveEvent {}

                                                                                                                                    property type

                                                                                                                                    type: 'moveend';
                                                                                                                                    • The type of move event being fired.

                                                                                                                                    interface MoveEvents

                                                                                                                                    interface MoveEvents {}

                                                                                                                                      property onMove

                                                                                                                                      onMove?: (e: MoveMoveEvent) => void;
                                                                                                                                      • Handler that is called when the element is moved.

                                                                                                                                      property onMoveEnd

                                                                                                                                      onMoveEnd?: (e: MoveEndEvent) => void;
                                                                                                                                      • Handler that is called when a move interaction ends.

                                                                                                                                      property onMoveStart

                                                                                                                                      onMoveStart?: (e: MoveStartEvent) => void;
                                                                                                                                      • Handler that is called when a move interaction starts.

                                                                                                                                      interface MoveMoveEvent

                                                                                                                                      interface MoveMoveEvent extends BaseMoveEvent {}

                                                                                                                                        property deltaX

                                                                                                                                        deltaX: number;
                                                                                                                                        • The amount moved in the X direction since the last event.

                                                                                                                                        property deltaY

                                                                                                                                        deltaY: number;
                                                                                                                                        • The amount moved in the Y direction since the last event.

                                                                                                                                        property type

                                                                                                                                        type: 'move';
                                                                                                                                        • The type of move event being fired.

                                                                                                                                        interface MoveStartEvent

                                                                                                                                        interface MoveStartEvent extends BaseMoveEvent {}

                                                                                                                                          property type

                                                                                                                                          type: 'movestart';
                                                                                                                                          • The type of move event being fired.

                                                                                                                                          interface MultipleSelection

                                                                                                                                          interface MultipleSelection {}

                                                                                                                                            property defaultSelectedKeys

                                                                                                                                            defaultSelectedKeys?: 'all' | Iterable<Key>;
                                                                                                                                            • The initial selected keys in the collection (uncontrolled).

                                                                                                                                            property disabledKeys

                                                                                                                                            disabledKeys?: Iterable<Key>;
                                                                                                                                            • The currently disabled keys in the collection (controlled).

                                                                                                                                            property disallowEmptySelection

                                                                                                                                            disallowEmptySelection?: boolean;
                                                                                                                                            • Whether the collection allows empty selection.

                                                                                                                                            property onSelectionChange

                                                                                                                                            onSelectionChange?: (keys: Selection) => any;
                                                                                                                                            • Handler that is called when the selection changes.

                                                                                                                                            property selectedKeys

                                                                                                                                            selectedKeys?: 'all' | Iterable<Key>;
                                                                                                                                            • The currently selected keys in the collection (controlled).

                                                                                                                                            property selectionMode

                                                                                                                                            selectionMode?: SelectionMode;
                                                                                                                                            • The type of selection that is allowed in the collection.

                                                                                                                                            interface Node

                                                                                                                                            interface Node<T> {}

                                                                                                                                              property 'aria-label'

                                                                                                                                              'aria-label'?: string;
                                                                                                                                              • An accessibility label for this node.

                                                                                                                                              property childNodes

                                                                                                                                              childNodes: Iterable<Node<T>>;
                                                                                                                                              • The loaded children of this node.

                                                                                                                                                Deprecated

                                                                                                                                                Use collection.getChildren(node.key) instead.

                                                                                                                                              property hasChildNodes

                                                                                                                                              hasChildNodes: boolean;
                                                                                                                                              • Whether this item has children, even if not loaded yet.

                                                                                                                                              property index

                                                                                                                                              index?: number;
                                                                                                                                              • The index of this node within its parent.

                                                                                                                                              property key

                                                                                                                                              key: Key;
                                                                                                                                              • A unique key for the node.

                                                                                                                                              property level

                                                                                                                                              level: number;
                                                                                                                                              • The level of depth this node is at in the heirarchy.

                                                                                                                                              property nextKey

                                                                                                                                              nextKey?: Key | null;
                                                                                                                                              • The key of the node after this node.

                                                                                                                                              property parentKey

                                                                                                                                              parentKey?: Key | null;
                                                                                                                                              • The key of the parent node.

                                                                                                                                              property prevKey

                                                                                                                                              prevKey?: Key | null;
                                                                                                                                              • The key of the node before this node.

                                                                                                                                              property props

                                                                                                                                              props?: any;
                                                                                                                                              • Additional properties specific to a particular node type.

                                                                                                                                              property rendered

                                                                                                                                              rendered: ReactNode;
                                                                                                                                              • The rendered contents of this node (e.g. JSX).

                                                                                                                                              property shouldInvalidate

                                                                                                                                              shouldInvalidate?: (context: unknown) => boolean;

                                                                                                                                              property textValue

                                                                                                                                              textValue: string;
                                                                                                                                              • A string value for this node, used for features like typeahead.

                                                                                                                                              property type

                                                                                                                                              type: string;
                                                                                                                                              • The type of item this node represents.

                                                                                                                                              property value

                                                                                                                                              value: T | null;
                                                                                                                                              • The object value the node was created from.

                                                                                                                                              property wrapper

                                                                                                                                              wrapper?: (element: ReactElement) => ReactElement;
                                                                                                                                              • A function that should be called to wrap the rendered node.

                                                                                                                                              interface PressEvent

                                                                                                                                              interface PressEvent {}

                                                                                                                                                property altKey

                                                                                                                                                altKey: boolean;
                                                                                                                                                • Whether the alt keyboard modifier was held during the press event.

                                                                                                                                                property ctrlKey

                                                                                                                                                ctrlKey: boolean;
                                                                                                                                                • Whether the ctrl keyboard modifier was held during the press event.

                                                                                                                                                property metaKey

                                                                                                                                                metaKey: boolean;
                                                                                                                                                • Whether the meta keyboard modifier was held during the press event.

                                                                                                                                                property pointerType

                                                                                                                                                pointerType: PointerType;
                                                                                                                                                • The pointer type that triggered the press event.

                                                                                                                                                property shiftKey

                                                                                                                                                shiftKey: boolean;
                                                                                                                                                • Whether the shift keyboard modifier was held during the press event.

                                                                                                                                                property target

                                                                                                                                                target: Element;
                                                                                                                                                • The target element of the press event.

                                                                                                                                                property type

                                                                                                                                                type: 'pressstart' | 'pressend' | 'pressup' | 'press';
                                                                                                                                                • The type of press event being fired.

                                                                                                                                                interface PressEvents

                                                                                                                                                interface PressEvents {}

                                                                                                                                                  property onPress

                                                                                                                                                  onPress?: (e: PressEvent) => void;
                                                                                                                                                  • Handler that is called when the press is released over the target.

                                                                                                                                                  property onPressChange

                                                                                                                                                  onPressChange?: (isPressed: boolean) => void;
                                                                                                                                                  • Handler that is called when the press state changes.

                                                                                                                                                  property onPressEnd

                                                                                                                                                  onPressEnd?: (e: PressEvent) => void;
                                                                                                                                                  • Handler that is called when a press interaction ends, either over the target or when the pointer leaves the target.

                                                                                                                                                  property onPressStart

                                                                                                                                                  onPressStart?: (e: PressEvent) => void;
                                                                                                                                                  • Handler that is called when a press interaction starts.

                                                                                                                                                  property onPressUp

                                                                                                                                                  onPressUp?: (e: PressEvent) => void;
                                                                                                                                                  • Handler that is called when a press is released over the target, regardless of whether it started on the target or not.

                                                                                                                                                  interface RangeInputBase

                                                                                                                                                  interface RangeInputBase<T> {}

                                                                                                                                                    property maxValue

                                                                                                                                                    maxValue?: T;
                                                                                                                                                    • The largest value allowed for the input.

                                                                                                                                                    property minValue

                                                                                                                                                    minValue?: T;
                                                                                                                                                    • The smallest value allowed for the input.

                                                                                                                                                    property step

                                                                                                                                                    step?: T;
                                                                                                                                                    • The amount that the input value changes with each increment or decrement "tick".

                                                                                                                                                    interface RangeValue

                                                                                                                                                    interface RangeValue<T> {}

                                                                                                                                                      property end

                                                                                                                                                      end: T;
                                                                                                                                                      • The end value of the range.

                                                                                                                                                      property start

                                                                                                                                                      start: T;
                                                                                                                                                      • The start value of the range.

                                                                                                                                                      interface Removable

                                                                                                                                                      interface Removable<T, R> {}

                                                                                                                                                        property isRemovable

                                                                                                                                                        isRemovable?: boolean;

                                                                                                                                                          property onRemove

                                                                                                                                                          onRemove?: (value: T, event?: SyntheticEvent) => R;

                                                                                                                                                            interface RootDropTarget

                                                                                                                                                            interface RootDropTarget {}

                                                                                                                                                              property type

                                                                                                                                                              type: 'root';
                                                                                                                                                              • The event type.

                                                                                                                                                              interface ScrollEvent

                                                                                                                                                              interface ScrollEvent {}

                                                                                                                                                                property deltaX

                                                                                                                                                                deltaX: number;
                                                                                                                                                                • The amount moved in the X direction since the last event.

                                                                                                                                                                property deltaY

                                                                                                                                                                deltaY: number;
                                                                                                                                                                • The amount moved in the Y direction since the last event.

                                                                                                                                                                interface ScrollEvents

                                                                                                                                                                interface ScrollEvents {}

                                                                                                                                                                  property onScroll

                                                                                                                                                                  onScroll?: (e: ScrollEvent) => void;
                                                                                                                                                                  • Handler that is called when the scroll wheel moves.

                                                                                                                                                                  interface SectionProps

                                                                                                                                                                  interface SectionProps<T> {}

                                                                                                                                                                    property 'aria-label'

                                                                                                                                                                    'aria-label'?: string;
                                                                                                                                                                    • An accessibility label for the section.

                                                                                                                                                                    property children

                                                                                                                                                                    children: ItemElement<T> | ItemElement<T>[] | ItemRenderer<T>;
                                                                                                                                                                    • Static child items or a function to render children.

                                                                                                                                                                    property items

                                                                                                                                                                    items?: Iterable<T>;
                                                                                                                                                                    • Item objects in the section.

                                                                                                                                                                    property title

                                                                                                                                                                    title?: ReactNode;
                                                                                                                                                                    • Rendered contents of the section, e.g. a header.

                                                                                                                                                                    interface SingleSelection

                                                                                                                                                                    interface SingleSelection {}

                                                                                                                                                                      property defaultSelectedKey

                                                                                                                                                                      defaultSelectedKey?: Key;
                                                                                                                                                                      • The initial selected key in the collection (uncontrolled).

                                                                                                                                                                      property disallowEmptySelection

                                                                                                                                                                      disallowEmptySelection?: boolean;
                                                                                                                                                                      • Whether the collection allows empty selection.

                                                                                                                                                                      property onSelectionChange

                                                                                                                                                                      onSelectionChange?: (key: Key) => any;
                                                                                                                                                                      • Handler that is called when the selection changes.

                                                                                                                                                                      property selectedKey

                                                                                                                                                                      selectedKey?: Key | null;
                                                                                                                                                                      • The currently selected key in the collection (controlled).

                                                                                                                                                                      interface Sortable

                                                                                                                                                                      interface Sortable {}

                                                                                                                                                                        property onSortChange

                                                                                                                                                                        onSortChange?: (descriptor: SortDescriptor) => any;
                                                                                                                                                                        • Handler that is called when the sorted column or direction changes.

                                                                                                                                                                        property sortDescriptor

                                                                                                                                                                        sortDescriptor?: SortDescriptor;
                                                                                                                                                                        • The current sorted column and direction.

                                                                                                                                                                        interface SortDescriptor

                                                                                                                                                                        interface SortDescriptor {}

                                                                                                                                                                          property column

                                                                                                                                                                          column?: Key;
                                                                                                                                                                          • The key of the column to sort by.

                                                                                                                                                                          property direction

                                                                                                                                                                          direction?: SortDirection;
                                                                                                                                                                          • The direction to sort by.

                                                                                                                                                                          interface SpectrumHelpTextProps

                                                                                                                                                                          interface SpectrumHelpTextProps extends HelpTextProps, Validation {}

                                                                                                                                                                            property isDisabled

                                                                                                                                                                            isDisabled?: boolean;
                                                                                                                                                                            • Whether the description is displayed with lighter text.

                                                                                                                                                                            property showErrorIcon

                                                                                                                                                                            showErrorIcon?: boolean;
                                                                                                                                                                            • Whether an error icon is rendered.

                                                                                                                                                                            interface SpectrumLabelableProps

                                                                                                                                                                            interface SpectrumLabelableProps extends LabelableProps {}

                                                                                                                                                                              property contextualHelp

                                                                                                                                                                              contextualHelp?: ReactNode;
                                                                                                                                                                              • A ContextualHelp element to place next to the label.

                                                                                                                                                                              property isRequired

                                                                                                                                                                              isRequired?: boolean;
                                                                                                                                                                              • Whether the label is labeling a required field or group.

                                                                                                                                                                              property labelAlign

                                                                                                                                                                              labelAlign?: Alignment;
                                                                                                                                                                              • The label's horizontal alignment relative to the element it is labeling. 'start'

                                                                                                                                                                              property labelPosition

                                                                                                                                                                              labelPosition?: LabelPosition;
                                                                                                                                                                              • The label's overall position relative to the element it is labeling. 'top'

                                                                                                                                                                              property necessityIndicator

                                                                                                                                                                              necessityIndicator?: NecessityIndicator;
                                                                                                                                                                              • Whether the required state should be shown as an icon or text. 'icon'

                                                                                                                                                                              interface SpectrumSelectionProps

                                                                                                                                                                              interface SpectrumSelectionProps {}

                                                                                                                                                                                property selectionStyle

                                                                                                                                                                                selectionStyle?: 'checkbox' | 'highlight';
                                                                                                                                                                                • How selection should be displayed.

                                                                                                                                                                                interface SpectrumTextInputBase

                                                                                                                                                                                interface SpectrumTextInputBase {}

                                                                                                                                                                                  property placeholder

                                                                                                                                                                                  placeholder?: string;
                                                                                                                                                                                  • Temporary text that occupies the text input when it is empty. Please use help text instead.

                                                                                                                                                                                    Deprecated

                                                                                                                                                                                  interface StyleProps

                                                                                                                                                                                  interface StyleProps {}

                                                                                                                                                                                    property alignSelf

                                                                                                                                                                                    alignSelf?: Responsive<
                                                                                                                                                                                    | 'auto'
                                                                                                                                                                                    | 'normal'
                                                                                                                                                                                    | 'start'
                                                                                                                                                                                    | 'end'
                                                                                                                                                                                    | 'center'
                                                                                                                                                                                    | 'flex-start'
                                                                                                                                                                                    | 'flex-end'
                                                                                                                                                                                    | 'self-start'
                                                                                                                                                                                    | 'self-end'
                                                                                                                                                                                    | 'stretch'
                                                                                                                                                                                    >;
                                                                                                                                                                                    • Overrides the alignItems property of a flex or grid container. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/align-self).

                                                                                                                                                                                    property bottom

                                                                                                                                                                                    bottom?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The bottom position for the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/bottom).

                                                                                                                                                                                    property end

                                                                                                                                                                                    end?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The logical end position for the element, depending on layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/inset-inline-end).

                                                                                                                                                                                    property flex

                                                                                                                                                                                    flex?: Responsive<string | number | boolean>;
                                                                                                                                                                                    • When used in a flex layout, specifies how the element will grow or shrink to fit the space available. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex).

                                                                                                                                                                                    property flexBasis

                                                                                                                                                                                    flexBasis?: Responsive<number | string>;
                                                                                                                                                                                    • When used in a flex layout, specifies the initial main size of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis).

                                                                                                                                                                                    property flexGrow

                                                                                                                                                                                    flexGrow?: Responsive<number>;
                                                                                                                                                                                    • When used in a flex layout, specifies how the element will grow to fit the space available. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-grow).

                                                                                                                                                                                    property flexShrink

                                                                                                                                                                                    flexShrink?: Responsive<number>;
                                                                                                                                                                                    • When used in a flex layout, specifies how the element will shrink to fit the space available. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-shrink).

                                                                                                                                                                                    property gridArea

                                                                                                                                                                                    gridArea?: Responsive<string>;
                                                                                                                                                                                    • When used in a grid layout, specifies the named grid area that the element should be placed in within the grid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-area).

                                                                                                                                                                                    property gridColumn

                                                                                                                                                                                    gridColumn?: Responsive<string>;
                                                                                                                                                                                    • When used in a grid layout, specifies the column the element should be placed in within the grid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column).

                                                                                                                                                                                    property gridColumnEnd

                                                                                                                                                                                    gridColumnEnd?: Responsive<string>;
                                                                                                                                                                                    • When used in a grid layout, specifies the ending column to span within the grid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column-end).

                                                                                                                                                                                    property gridColumnStart

                                                                                                                                                                                    gridColumnStart?: Responsive<string>;
                                                                                                                                                                                    • When used in a grid layout, specifies the starting column to span within the grid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-column-start).

                                                                                                                                                                                    property gridRow

                                                                                                                                                                                    gridRow?: Responsive<string>;
                                                                                                                                                                                    • When used in a grid layout, specifies the row the element should be placed in within the grid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row).

                                                                                                                                                                                    property gridRowEnd

                                                                                                                                                                                    gridRowEnd?: Responsive<string>;
                                                                                                                                                                                    • When used in a grid layout, specifies the ending row to span within the grid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row-end).

                                                                                                                                                                                    property gridRowStart

                                                                                                                                                                                    gridRowStart?: Responsive<string>;
                                                                                                                                                                                    • When used in a grid layout, specifies the starting row to span within the grid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-row-start).

                                                                                                                                                                                    property height

                                                                                                                                                                                    height?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The height of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/height).

                                                                                                                                                                                    property isHidden

                                                                                                                                                                                    isHidden?: Responsive<boolean>;
                                                                                                                                                                                    • Hides the element.

                                                                                                                                                                                    property justifySelf

                                                                                                                                                                                    justifySelf?: Responsive<
                                                                                                                                                                                    | 'auto'
                                                                                                                                                                                    | 'normal'
                                                                                                                                                                                    | 'start'
                                                                                                                                                                                    | 'end'
                                                                                                                                                                                    | 'flex-start'
                                                                                                                                                                                    | 'flex-end'
                                                                                                                                                                                    | 'self-start'
                                                                                                                                                                                    | 'self-end'
                                                                                                                                                                                    | 'center'
                                                                                                                                                                                    | 'left'
                                                                                                                                                                                    | 'right'
                                                                                                                                                                                    | 'stretch'
                                                                                                                                                                                    >;
                                                                                                                                                                                    • Specifies how the element is justified inside a flex or grid container. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-self).

                                                                                                                                                                                    property left

                                                                                                                                                                                    left?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The left position for the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/left). Consider using start instead for RTL support.

                                                                                                                                                                                    property margin

                                                                                                                                                                                    margin?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The margin for all four sides of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/margin).

                                                                                                                                                                                    property marginBottom

                                                                                                                                                                                    marginBottom?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The margin for the bottom side of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/margin-bottom).

                                                                                                                                                                                    property marginEnd

                                                                                                                                                                                    marginEnd?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The margin for the logical end side of an element, depending on layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/margin-inline-end).

                                                                                                                                                                                    property marginStart

                                                                                                                                                                                    marginStart?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The margin for the logical start side of the element, depending on layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/margin-inline-start).

                                                                                                                                                                                    property marginTop

                                                                                                                                                                                    marginTop?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The margin for the top side of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/margin-top).

                                                                                                                                                                                    property marginX

                                                                                                                                                                                    marginX?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The margin for both the left and right sides of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/margin).

                                                                                                                                                                                    property marginY

                                                                                                                                                                                    marginY?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The margin for both the top and bottom sides of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/margin).

                                                                                                                                                                                    property maxHeight

                                                                                                                                                                                    maxHeight?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The maximum height of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/max-height).

                                                                                                                                                                                    property maxWidth

                                                                                                                                                                                    maxWidth?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The maximum width of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/max-width).

                                                                                                                                                                                    property minHeight

                                                                                                                                                                                    minHeight?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The minimum height of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/min-height).

                                                                                                                                                                                    property minWidth

                                                                                                                                                                                    minWidth?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The minimum width of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/min-width).

                                                                                                                                                                                    property order

                                                                                                                                                                                    order?: Responsive<number>;
                                                                                                                                                                                    • The layout order for the element within a flex or grid container. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/order).

                                                                                                                                                                                    property position

                                                                                                                                                                                    position?: Responsive<'static' | 'relative' | 'absolute' | 'fixed' | 'sticky'>;
                                                                                                                                                                                    • Specifies how the element is positioned. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/position).

                                                                                                                                                                                    property right

                                                                                                                                                                                    right?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The right position for the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/right). Consider using start instead for RTL support.

                                                                                                                                                                                    property start

                                                                                                                                                                                    start?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The logical start position for the element, depending on layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/inset-inline-start).

                                                                                                                                                                                    property top

                                                                                                                                                                                    top?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The top position for the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/top).

                                                                                                                                                                                    property UNSAFE_className

                                                                                                                                                                                    UNSAFE_className?: string;
                                                                                                                                                                                    • Sets the CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. Only use as a **last resort**. Use style props instead.

                                                                                                                                                                                    property UNSAFE_style

                                                                                                                                                                                    UNSAFE_style?: CSSProperties;
                                                                                                                                                                                    • Sets inline [style](https://developer.mozilla.org/en-US/docs/Web/API/Element/style) for the element. Only use as a **last resort**. Use style props instead.

                                                                                                                                                                                    property width

                                                                                                                                                                                    width?: Responsive<DimensionValue>;
                                                                                                                                                                                    • The width of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/width).

                                                                                                                                                                                    property zIndex

                                                                                                                                                                                    zIndex?: Responsive<number>;
                                                                                                                                                                                    • The stacking order for the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/z-index).

                                                                                                                                                                                    interface TextDropItem

                                                                                                                                                                                    interface TextDropItem {}

                                                                                                                                                                                      property kind

                                                                                                                                                                                      kind: 'text';
                                                                                                                                                                                      • The item kind.

                                                                                                                                                                                      property types

                                                                                                                                                                                      types: Set<string>;
                                                                                                                                                                                      • The drag types available for this item. These are often mime types, but may be custom app-specific types.

                                                                                                                                                                                      method getText

                                                                                                                                                                                      getText: (type: string) => Promise<string>;
                                                                                                                                                                                      • Returns the data for the given type as a string.

                                                                                                                                                                                      interface TextInputBase

                                                                                                                                                                                      interface TextInputBase {}

                                                                                                                                                                                        property placeholder

                                                                                                                                                                                        placeholder?: string;
                                                                                                                                                                                        • Temporary text that occupies the text input when it is empty.

                                                                                                                                                                                        interface TextInputDOMEvents

                                                                                                                                                                                        interface TextInputDOMEvents {}

                                                                                                                                                                                          property onBeforeInput

                                                                                                                                                                                          onBeforeInput?: FormEventHandler<HTMLInputElement>;
                                                                                                                                                                                          • Handler that is called when the input value is about to be modified. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforeinput_event).

                                                                                                                                                                                          property onCompositionEnd

                                                                                                                                                                                          onCompositionEnd?: CompositionEventHandler<HTMLInputElement>;
                                                                                                                                                                                          • Handler that is called when a text composition system completes or cancels the current text composition session. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/compositionend_event).

                                                                                                                                                                                          property onCompositionStart

                                                                                                                                                                                          onCompositionStart?: CompositionEventHandler<HTMLInputElement>;
                                                                                                                                                                                          • Handler that is called when a text composition system starts a new text composition session. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/compositionstart_event).

                                                                                                                                                                                          property onCompositionUpdate

                                                                                                                                                                                          onCompositionUpdate?: CompositionEventHandler<HTMLInputElement>;
                                                                                                                                                                                          • Handler that is called when a new character is received in the current text composition session. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/compositionupdate_event).

                                                                                                                                                                                          property onCopy

                                                                                                                                                                                          onCopy?: ClipboardEventHandler<HTMLInputElement>;
                                                                                                                                                                                          • Handler that is called when the user copies text. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/oncopy).

                                                                                                                                                                                          property onCut

                                                                                                                                                                                          onCut?: ClipboardEventHandler<HTMLInputElement>;
                                                                                                                                                                                          • Handler that is called when the user cuts text. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/oncut).

                                                                                                                                                                                          property onInput

                                                                                                                                                                                          onInput?: FormEventHandler<HTMLInputElement>;
                                                                                                                                                                                          • Handler that is called when the input value is modified. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).

                                                                                                                                                                                          property onPaste

                                                                                                                                                                                          onPaste?: ClipboardEventHandler<HTMLInputElement>;
                                                                                                                                                                                          • Handler that is called when the user pastes text. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/onpaste).

                                                                                                                                                                                          property onSelect

                                                                                                                                                                                          onSelect?: ReactEventHandler<HTMLInputElement>;
                                                                                                                                                                                          • Handler that is called when text in the input is selected. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/select_event).

                                                                                                                                                                                          interface TextInputDOMProps

                                                                                                                                                                                          interface TextInputDOMProps extends DOMProps, TextInputDOMEvents {}

                                                                                                                                                                                            property autoComplete

                                                                                                                                                                                            autoComplete?: string;
                                                                                                                                                                                            • Describes the type of autocomplete functionality the input should provide if any. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefautocomplete).

                                                                                                                                                                                            property inputMode

                                                                                                                                                                                            inputMode?:
                                                                                                                                                                                            | 'none'
                                                                                                                                                                                            | 'text'
                                                                                                                                                                                            | 'tel'
                                                                                                                                                                                            | 'url'
                                                                                                                                                                                            | 'email'
                                                                                                                                                                                            | 'numeric'
                                                                                                                                                                                            | 'decimal'
                                                                                                                                                                                            | 'search';
                                                                                                                                                                                            • Hints at the type of data that might be entered by the user while editing the element or its contents. See [MDN](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute).

                                                                                                                                                                                            property maxLength

                                                                                                                                                                                            maxLength?: number;
                                                                                                                                                                                            • The maximum number of characters supported by the input. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefmaxlength).

                                                                                                                                                                                            property minLength

                                                                                                                                                                                            minLength?: number;
                                                                                                                                                                                            • The minimum number of characters required by the input. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefminlength).

                                                                                                                                                                                            property name

                                                                                                                                                                                            name?: string;
                                                                                                                                                                                            • The name of the input element, used when submitting an HTML form. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefname).

                                                                                                                                                                                            property pattern

                                                                                                                                                                                            pattern?: string;
                                                                                                                                                                                            • Regex pattern that the value of the input must match to be valid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefpattern).

                                                                                                                                                                                            property placeholder

                                                                                                                                                                                            placeholder?: string;
                                                                                                                                                                                            • Content that appears in the input when it is empty. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefplaceholder).

                                                                                                                                                                                            property type

                                                                                                                                                                                            type?: 'text' | 'search' | 'url' | 'tel' | 'email' | 'password' | (string & {});
                                                                                                                                                                                            • The type of input to render. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdeftype).

                                                                                                                                                                                            interface Validation

                                                                                                                                                                                            interface Validation {}

                                                                                                                                                                                              property isRequired

                                                                                                                                                                                              isRequired?: boolean;
                                                                                                                                                                                              • Whether user input is required on the input before form submission. Often paired with the necessityIndicator prop to add a visual indicator to the input.

                                                                                                                                                                                              property validationState

                                                                                                                                                                                              validationState?: ValidationState;
                                                                                                                                                                                              • Whether the input should display its "valid" or "invalid" visual styling.

                                                                                                                                                                                              interface ValueBase

                                                                                                                                                                                              interface ValueBase<T, C = T> {}

                                                                                                                                                                                                property defaultValue

                                                                                                                                                                                                defaultValue?: T;
                                                                                                                                                                                                • The default value (uncontrolled).

                                                                                                                                                                                                property onChange

                                                                                                                                                                                                onChange?: (value: C) => void;
                                                                                                                                                                                                • Handler that is called when the value changes.

                                                                                                                                                                                                property value

                                                                                                                                                                                                value?: T;
                                                                                                                                                                                                • The current value (controlled).

                                                                                                                                                                                                interface ViewStyleProps

                                                                                                                                                                                                interface ViewStyleProps<C extends ColorVersion> extends StyleProps {}

                                                                                                                                                                                                  property backgroundColor

                                                                                                                                                                                                  backgroundColor?: Responsive<BackgroundColor[C]>;
                                                                                                                                                                                                  • The background color for the element.

                                                                                                                                                                                                  property borderBottomColor

                                                                                                                                                                                                  borderBottomColor?: Responsive<BorderColor[C]>;
                                                                                                                                                                                                  • The color of the bottom border. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-color).

                                                                                                                                                                                                  property borderBottomEndRadius

                                                                                                                                                                                                  borderBottomEndRadius?: Responsive<BorderRadiusValue>;
                                                                                                                                                                                                  • The border radius for the bottom end corner of the element, depending on the layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-end-end-radius).

                                                                                                                                                                                                  property borderBottomStartRadius

                                                                                                                                                                                                  borderBottomStartRadius?: Responsive<BorderRadiusValue>;
                                                                                                                                                                                                  • The border radius for the bottom start corner of the element, depending on the layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-end-start-radius).

                                                                                                                                                                                                  property borderBottomWidth

                                                                                                                                                                                                  borderBottomWidth?: Responsive<BorderSizeValue>;
                                                                                                                                                                                                  • The width of the bottom border. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-width).

                                                                                                                                                                                                  property borderColor

                                                                                                                                                                                                  borderColor?: Responsive<BorderColor[C]>;
                                                                                                                                                                                                  • The color of the element's border on all four sides. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-color).

                                                                                                                                                                                                  property borderEndColor

                                                                                                                                                                                                  borderEndColor?: Responsive<BorderColor[C]>;
                                                                                                                                                                                                  • The color of the border on the logical end side, depending on the layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-end-color).

                                                                                                                                                                                                  property borderEndWidth

                                                                                                                                                                                                  borderEndWidth?: Responsive<BorderSizeValue>;
                                                                                                                                                                                                  • The width of the border on the logical end side, depending on the layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-end-width).

                                                                                                                                                                                                  property borderRadius

                                                                                                                                                                                                  borderRadius?: Responsive<BorderRadiusValue>;
                                                                                                                                                                                                  • The border radius on all four sides of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius).

                                                                                                                                                                                                  property borderStartColor

                                                                                                                                                                                                  borderStartColor?: Responsive<BorderColor[C]>;
                                                                                                                                                                                                  • The color of the border on the logical start side, depending on the layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-start-color).

                                                                                                                                                                                                  property borderStartWidth

                                                                                                                                                                                                  borderStartWidth?: Responsive<BorderSizeValue>;
                                                                                                                                                                                                  • The width of the border on the logical start side, depending on the layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-start-width).

                                                                                                                                                                                                  property borderTopColor

                                                                                                                                                                                                  borderTopColor?: Responsive<BorderColor[C]>;
                                                                                                                                                                                                  • The color of the top border. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-color).

                                                                                                                                                                                                  property borderTopEndRadius

                                                                                                                                                                                                  borderTopEndRadius?: Responsive<BorderRadiusValue>;
                                                                                                                                                                                                  • The border radius for the top end corner of the element, depending on the layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-start-end-radius).

                                                                                                                                                                                                  property borderTopStartRadius

                                                                                                                                                                                                  borderTopStartRadius?: Responsive<BorderRadiusValue>;
                                                                                                                                                                                                  • The border radius for the top start corner of the element, depending on the layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-start-start-radius).

                                                                                                                                                                                                  property borderTopWidth

                                                                                                                                                                                                  borderTopWidth?: Responsive<BorderSizeValue>;
                                                                                                                                                                                                  • The width of the top border. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-width).

                                                                                                                                                                                                  property borderWidth

                                                                                                                                                                                                  borderWidth?: Responsive<BorderSizeValue>;
                                                                                                                                                                                                  • The width of the element's border on all four sides. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-width).

                                                                                                                                                                                                  property borderXColor

                                                                                                                                                                                                  borderXColor?: Responsive<BorderColor[C]>;
                                                                                                                                                                                                  • The color of the left and right borders. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-color).

                                                                                                                                                                                                  property borderXWidth

                                                                                                                                                                                                  borderXWidth?: Responsive<BorderSizeValue>;
                                                                                                                                                                                                  • The width of the left and right borders. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-width).

                                                                                                                                                                                                  property borderYColor

                                                                                                                                                                                                  borderYColor?: Responsive<BorderColor[C]>;
                                                                                                                                                                                                  • The color of the top and bottom borders. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-width).

                                                                                                                                                                                                  property borderYWidth

                                                                                                                                                                                                  borderYWidth?: Responsive<BorderSizeValue>;
                                                                                                                                                                                                  • The width of the top and bottom borders. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/border-width).

                                                                                                                                                                                                  property colorVersion

                                                                                                                                                                                                  colorVersion?: C;
                                                                                                                                                                                                  • The Spectrum color token version number. 5

                                                                                                                                                                                                  property overflow

                                                                                                                                                                                                  overflow?: Responsive<string>;
                                                                                                                                                                                                  • Species what to do when the element's content is too long to fit its size. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/overflow).

                                                                                                                                                                                                  property padding

                                                                                                                                                                                                  padding?: Responsive<DimensionValue>;
                                                                                                                                                                                                  • The padding for all four sides of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/padding).

                                                                                                                                                                                                  property paddingBottom

                                                                                                                                                                                                  paddingBottom?: Responsive<DimensionValue>;
                                                                                                                                                                                                  • The padding for the bottom side of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/padding-bottom).

                                                                                                                                                                                                  property paddingEnd

                                                                                                                                                                                                  paddingEnd?: Responsive<DimensionValue>;
                                                                                                                                                                                                  • The padding for the logical end side of an element, depending on layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/padding-inline-end).

                                                                                                                                                                                                  property paddingStart

                                                                                                                                                                                                  paddingStart?: Responsive<DimensionValue>;
                                                                                                                                                                                                  • The padding for the logical start side of the element, depending on layout direction. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/padding-inline-start).

                                                                                                                                                                                                  property paddingTop

                                                                                                                                                                                                  paddingTop?: Responsive<DimensionValue>;
                                                                                                                                                                                                  • The padding for the top side of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/padding-top).

                                                                                                                                                                                                  property paddingX

                                                                                                                                                                                                  paddingX?: Responsive<DimensionValue>;
                                                                                                                                                                                                  • The padding for both the left and right sides of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/padding).

                                                                                                                                                                                                  property paddingY

                                                                                                                                                                                                  paddingY?: Responsive<DimensionValue>;
                                                                                                                                                                                                  • The padding for both the top and bottom sides of the element. See [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/padding).

                                                                                                                                                                                                  Type Aliases

                                                                                                                                                                                                  type Alignment

                                                                                                                                                                                                  type Alignment = 'start' | 'end';

                                                                                                                                                                                                    type BackgroundColor

                                                                                                                                                                                                    type BackgroundColor = {
                                                                                                                                                                                                    5: BackgroundColorValue;
                                                                                                                                                                                                    6: BackgroundColorValueV6;
                                                                                                                                                                                                    };

                                                                                                                                                                                                      type BackgroundColorAlias

                                                                                                                                                                                                      type BackgroundColorAlias = 'default' | 'disabled' | 'transparent' | 'label-gray';

                                                                                                                                                                                                        type BackgroundColorValue

                                                                                                                                                                                                        type BackgroundColorValue = BackgroundColorAlias | ColorValue;

                                                                                                                                                                                                          type BackgroundColorValueV6

                                                                                                                                                                                                          type BackgroundColorValueV6 = BackgroundColorAlias | ColorValueV6;

                                                                                                                                                                                                            type BaseEvent

                                                                                                                                                                                                            type BaseEvent<T extends SyntheticEvent> = T & {
                                                                                                                                                                                                            /**
                                                                                                                                                                                                            * Use continuePropagation.
                                                                                                                                                                                                            * @deprecated */
                                                                                                                                                                                                            stopPropagation(): void;
                                                                                                                                                                                                            continuePropagation(): void;
                                                                                                                                                                                                            };

                                                                                                                                                                                                              type BorderColor

                                                                                                                                                                                                              type BorderColor = {
                                                                                                                                                                                                              5: BorderColorValue;
                                                                                                                                                                                                              6: BorderColorValueV6;
                                                                                                                                                                                                              };

                                                                                                                                                                                                                type BorderColorAlias

                                                                                                                                                                                                                type BorderColorAlias =
                                                                                                                                                                                                                | 'negative'
                                                                                                                                                                                                                | 'notice'
                                                                                                                                                                                                                | 'positive'
                                                                                                                                                                                                                | 'informative'
                                                                                                                                                                                                                | 'hover'
                                                                                                                                                                                                                | 'down'
                                                                                                                                                                                                                | 'focus'
                                                                                                                                                                                                                | 'mouse-focus'
                                                                                                                                                                                                                | 'disabled'
                                                                                                                                                                                                                | 'extralight'
                                                                                                                                                                                                                | 'light'
                                                                                                                                                                                                                | 'mid'
                                                                                                                                                                                                                | 'dark'
                                                                                                                                                                                                                | 'transparent'
                                                                                                                                                                                                                | 'translucent-dark'
                                                                                                                                                                                                                | 'translucent-darker';

                                                                                                                                                                                                                  type BorderColorValue

                                                                                                                                                                                                                  type BorderColorValue = 'default' | BorderColorAlias | ColorValue;

                                                                                                                                                                                                                    type BorderColorValueV6

                                                                                                                                                                                                                    type BorderColorValueV6 = BorderColorAlias | ColorValueV6;

                                                                                                                                                                                                                      type BorderRadiusValue

                                                                                                                                                                                                                      type BorderRadiusValue = 'xsmall' | 'small' | 'regular' | 'medium' | 'large';

                                                                                                                                                                                                                        type BorderSizeValue

                                                                                                                                                                                                                        type BorderSizeValue = 'thin' | 'thick' | 'thicker' | 'thickest';

                                                                                                                                                                                                                          type CollectionChildren

                                                                                                                                                                                                                          type CollectionChildren<T> =
                                                                                                                                                                                                                          | CollectionElement<T>
                                                                                                                                                                                                                          | CollectionElement<T>[]
                                                                                                                                                                                                                          | ((item: T) => CollectionElement<T>);

                                                                                                                                                                                                                            type CollectionElement

                                                                                                                                                                                                                            type CollectionElement<T> = SectionElement<T> | ItemElement<T>;

                                                                                                                                                                                                                              type ColorValue

                                                                                                                                                                                                                              type ColorValue =
                                                                                                                                                                                                                              | 'celery-400'
                                                                                                                                                                                                                              | 'celery-500'
                                                                                                                                                                                                                              | 'celery-600'
                                                                                                                                                                                                                              | 'celery-700'
                                                                                                                                                                                                                              | 'chartreuse-400'
                                                                                                                                                                                                                              | 'chartreuse-500'
                                                                                                                                                                                                                              | 'chartreuse-600'
                                                                                                                                                                                                                              | 'chartreuse-700'
                                                                                                                                                                                                                              | 'yellow-400'
                                                                                                                                                                                                                              | 'yellow-500'
                                                                                                                                                                                                                              | 'yellow-600'
                                                                                                                                                                                                                              | 'yellow-700'
                                                                                                                                                                                                                              | 'magenta-400'
                                                                                                                                                                                                                              | 'magenta-500'
                                                                                                                                                                                                                              | 'magenta-600'
                                                                                                                                                                                                                              | 'magenta-700'
                                                                                                                                                                                                                              | 'fuchsia-400'
                                                                                                                                                                                                                              | 'fuchsia-500'
                                                                                                                                                                                                                              | 'fuchsia-600'
                                                                                                                                                                                                                              | 'fuchsia-700'
                                                                                                                                                                                                                              | 'purple-400'
                                                                                                                                                                                                                              | 'purple-500'
                                                                                                                                                                                                                              | 'purple-600'
                                                                                                                                                                                                                              | 'purple-700'
                                                                                                                                                                                                                              | 'indigo-400'
                                                                                                                                                                                                                              | 'indigo-500'
                                                                                                                                                                                                                              | 'indigo-600'
                                                                                                                                                                                                                              | 'indigo-700'
                                                                                                                                                                                                                              | 'seafoam-400'
                                                                                                                                                                                                                              | 'seafoam-500'
                                                                                                                                                                                                                              | 'seafoam-600'
                                                                                                                                                                                                                              | 'seafoam-700'
                                                                                                                                                                                                                              | 'red-400'
                                                                                                                                                                                                                              | 'red-500'
                                                                                                                                                                                                                              | 'red-600'
                                                                                                                                                                                                                              | 'red-700'
                                                                                                                                                                                                                              | 'orange-400'
                                                                                                                                                                                                                              | 'orange-500'
                                                                                                                                                                                                                              | 'orange-600'
                                                                                                                                                                                                                              | 'orange-700'
                                                                                                                                                                                                                              | 'green-400'
                                                                                                                                                                                                                              | 'green-500'
                                                                                                                                                                                                                              | 'green-600'
                                                                                                                                                                                                                              | 'green-700'
                                                                                                                                                                                                                              | 'blue-400'
                                                                                                                                                                                                                              | 'blue-500'
                                                                                                                                                                                                                              | 'blue-600'
                                                                                                                                                                                                                              | 'blue-700'
                                                                                                                                                                                                                              | 'gray-50'
                                                                                                                                                                                                                              | 'gray-75'
                                                                                                                                                                                                                              | 'gray-100'
                                                                                                                                                                                                                              | 'gray-200'
                                                                                                                                                                                                                              | 'gray-300'
                                                                                                                                                                                                                              | 'gray-400'
                                                                                                                                                                                                                              | 'gray-500'
                                                                                                                                                                                                                              | 'gray-600'
                                                                                                                                                                                                                              | 'gray-700'
                                                                                                                                                                                                                              | 'gray-800'
                                                                                                                                                                                                                              | 'gray-900'
                                                                                                                                                                                                                              | 'static-black'
                                                                                                                                                                                                                              | 'static-white'
                                                                                                                                                                                                                              | 'static-blue'
                                                                                                                                                                                                                              | 'static-gray-50'
                                                                                                                                                                                                                              | 'static-gray-75'
                                                                                                                                                                                                                              | 'static-gray-100'
                                                                                                                                                                                                                              | 'static-gray-200'
                                                                                                                                                                                                                              | 'static-gray-300'
                                                                                                                                                                                                                              | 'static-gray-400'
                                                                                                                                                                                                                              | 'static-gray-500'
                                                                                                                                                                                                                              | 'static-gray-600'
                                                                                                                                                                                                                              | 'static-gray-700'
                                                                                                                                                                                                                              | 'static-gray-800'
                                                                                                                                                                                                                              | 'static-gray-900'
                                                                                                                                                                                                                              | 'static-blue-200'
                                                                                                                                                                                                                              | 'static-blue-300'
                                                                                                                                                                                                                              | 'static-blue-400'
                                                                                                                                                                                                                              | 'static-blue-500'
                                                                                                                                                                                                                              | 'static-blue-600'
                                                                                                                                                                                                                              | 'static-blue-700'
                                                                                                                                                                                                                              | 'static-blue-800'
                                                                                                                                                                                                                              | 'static-red-400'
                                                                                                                                                                                                                              | 'static-red-500'
                                                                                                                                                                                                                              | 'static-red-600'
                                                                                                                                                                                                                              | 'static-red-700'
                                                                                                                                                                                                                              | 'static-orange-400'
                                                                                                                                                                                                                              | 'static-orange-500'
                                                                                                                                                                                                                              | 'static-orange-600'
                                                                                                                                                                                                                              | 'static-orange-700'
                                                                                                                                                                                                                              | 'static-green-400'
                                                                                                                                                                                                                              | 'static-green-500'
                                                                                                                                                                                                                              | 'static-green-600'
                                                                                                                                                                                                                              | 'static-green-700'
                                                                                                                                                                                                                              | 'static-celery-200'
                                                                                                                                                                                                                              | 'static-celery-300'
                                                                                                                                                                                                                              | 'static-celery-400'
                                                                                                                                                                                                                              | 'static-celery-500'
                                                                                                                                                                                                                              | 'static-celery-600'
                                                                                                                                                                                                                              | 'static-celery-700'
                                                                                                                                                                                                                              | 'static-chartreuse-300'
                                                                                                                                                                                                                              | 'static-chartreuse-400'
                                                                                                                                                                                                                              | 'static-chartreuse-500'
                                                                                                                                                                                                                              | 'static-chartreuse-600'
                                                                                                                                                                                                                              | 'static-chartreuse-700'
                                                                                                                                                                                                                              | 'static-yellow-200'
                                                                                                                                                                                                                              | 'static-yellow-300'
                                                                                                                                                                                                                              | 'static-yellow-400'
                                                                                                                                                                                                                              | 'static-yellow-500'
                                                                                                                                                                                                                              | 'static-yellow-600'
                                                                                                                                                                                                                              | 'static-yellow-700'
                                                                                                                                                                                                                              | 'static-magenta-200'
                                                                                                                                                                                                                              | 'static-magenta-300'
                                                                                                                                                                                                                              | 'static-magenta-400'
                                                                                                                                                                                                                              | 'static-magenta-500'
                                                                                                                                                                                                                              | 'static-magenta-600'
                                                                                                                                                                                                                              | 'static-magenta-700'
                                                                                                                                                                                                                              | 'static-fuchsia-400'
                                                                                                                                                                                                                              | 'static-fuchsia-500'
                                                                                                                                                                                                                              | 'static-fuchsia-600'
                                                                                                                                                                                                                              | 'static-fuchsia-700'
                                                                                                                                                                                                                              | 'static-purple-400'
                                                                                                                                                                                                                              | 'static-purple-500'
                                                                                                                                                                                                                              | 'static-purple-600'
                                                                                                                                                                                                                              | 'static-purple-700'
                                                                                                                                                                                                                              | 'static-purple-800'
                                                                                                                                                                                                                              | 'static-indigo-200'
                                                                                                                                                                                                                              | 'static-indigo-300'
                                                                                                                                                                                                                              | 'static-indigo-400'
                                                                                                                                                                                                                              | 'static-indigo-500'
                                                                                                                                                                                                                              | 'static-indigo-600'
                                                                                                                                                                                                                              | 'static-indigo-700'
                                                                                                                                                                                                                              | 'static-seafoam-200'
                                                                                                                                                                                                                              | 'static-seafoam-300'
                                                                                                                                                                                                                              | 'static-seafoam-400'
                                                                                                                                                                                                                              | 'static-seafoam-500'
                                                                                                                                                                                                                              | 'static-seafoam-600'
                                                                                                                                                                                                                              | 'static-seafoam-700'
                                                                                                                                                                                                                              | SemanticColorValue;

                                                                                                                                                                                                                                type ColorValueV6

                                                                                                                                                                                                                                type ColorValueV6 =
                                                                                                                                                                                                                                | 'gray-50'
                                                                                                                                                                                                                                | 'gray-75'
                                                                                                                                                                                                                                | 'gray-100'
                                                                                                                                                                                                                                | 'gray-200'
                                                                                                                                                                                                                                | 'gray-300'
                                                                                                                                                                                                                                | 'gray-400'
                                                                                                                                                                                                                                | 'gray-500'
                                                                                                                                                                                                                                | 'gray-600'
                                                                                                                                                                                                                                | 'gray-700'
                                                                                                                                                                                                                                | 'gray-800'
                                                                                                                                                                                                                                | 'gray-900'
                                                                                                                                                                                                                                | 'red-100'
                                                                                                                                                                                                                                | 'red-200'
                                                                                                                                                                                                                                | 'red-300'
                                                                                                                                                                                                                                | 'red-400'
                                                                                                                                                                                                                                | 'red-500'
                                                                                                                                                                                                                                | 'red-600'
                                                                                                                                                                                                                                | 'red-700'
                                                                                                                                                                                                                                | 'red-800'
                                                                                                                                                                                                                                | 'red-900'
                                                                                                                                                                                                                                | 'red-1000'
                                                                                                                                                                                                                                | 'red-1100'
                                                                                                                                                                                                                                | 'red-1200'
                                                                                                                                                                                                                                | 'red-1300'
                                                                                                                                                                                                                                | 'red-1400'
                                                                                                                                                                                                                                | 'orange-100'
                                                                                                                                                                                                                                | 'orange-200'
                                                                                                                                                                                                                                | 'orange-300'
                                                                                                                                                                                                                                | 'orange-400'
                                                                                                                                                                                                                                | 'orange-500'
                                                                                                                                                                                                                                | 'orange-600'
                                                                                                                                                                                                                                | 'orange-700'
                                                                                                                                                                                                                                | 'orange-800'
                                                                                                                                                                                                                                | 'orange-900'
                                                                                                                                                                                                                                | 'orange-1000'
                                                                                                                                                                                                                                | 'orange-1100'
                                                                                                                                                                                                                                | 'orange-1200'
                                                                                                                                                                                                                                | 'orange-1300'
                                                                                                                                                                                                                                | 'orange-1400'
                                                                                                                                                                                                                                | 'yellow-100'
                                                                                                                                                                                                                                | 'yellow-200'
                                                                                                                                                                                                                                | 'yellow-300'
                                                                                                                                                                                                                                | 'yellow-400'
                                                                                                                                                                                                                                | 'yellow-500'
                                                                                                                                                                                                                                | 'yellow-600'
                                                                                                                                                                                                                                | 'yellow-700'
                                                                                                                                                                                                                                | 'yellow-800'
                                                                                                                                                                                                                                | 'yellow-900'
                                                                                                                                                                                                                                | 'yellow-1000'
                                                                                                                                                                                                                                | 'yellow-1100'
                                                                                                                                                                                                                                | 'yellow-1200'
                                                                                                                                                                                                                                | 'yellow-1300'
                                                                                                                                                                                                                                | 'yellow-1400'
                                                                                                                                                                                                                                | 'chartreuse-100'
                                                                                                                                                                                                                                | 'chartreuse-200'
                                                                                                                                                                                                                                | 'chartreuse-300'
                                                                                                                                                                                                                                | 'chartreuse-400'
                                                                                                                                                                                                                                | 'chartreuse-500'
                                                                                                                                                                                                                                | 'chartreuse-600'
                                                                                                                                                                                                                                | 'chartreuse-700'
                                                                                                                                                                                                                                | 'chartreuse-800'
                                                                                                                                                                                                                                | 'chartreuse-900'
                                                                                                                                                                                                                                | 'chartreuse-1000'
                                                                                                                                                                                                                                | 'chartreuse-1100'
                                                                                                                                                                                                                                | 'chartreuse-1200'
                                                                                                                                                                                                                                | 'chartreuse-1300'
                                                                                                                                                                                                                                | 'chartreuse-1400'
                                                                                                                                                                                                                                | 'celery-100'
                                                                                                                                                                                                                                | 'celery-200'
                                                                                                                                                                                                                                | 'celery-300'
                                                                                                                                                                                                                                | 'celery-400'
                                                                                                                                                                                                                                | 'celery-500'
                                                                                                                                                                                                                                | 'celery-600'
                                                                                                                                                                                                                                | 'celery-700'
                                                                                                                                                                                                                                | 'celery-800'
                                                                                                                                                                                                                                | 'celery-900'
                                                                                                                                                                                                                                | 'celery-1000'
                                                                                                                                                                                                                                | 'celery-1100'
                                                                                                                                                                                                                                | 'celery-1200'
                                                                                                                                                                                                                                | 'celery-1300'
                                                                                                                                                                                                                                | 'celery-1400'
                                                                                                                                                                                                                                | 'green-100'
                                                                                                                                                                                                                                | 'green-200'
                                                                                                                                                                                                                                | 'green-300'
                                                                                                                                                                                                                                | 'green-400'
                                                                                                                                                                                                                                | 'green-500'
                                                                                                                                                                                                                                | 'green-600'
                                                                                                                                                                                                                                | 'green-700'
                                                                                                                                                                                                                                | 'green-800'
                                                                                                                                                                                                                                | 'green-900'
                                                                                                                                                                                                                                | 'green-1000'
                                                                                                                                                                                                                                | 'green-1100'
                                                                                                                                                                                                                                | 'green-1200'
                                                                                                                                                                                                                                | 'green-1300'
                                                                                                                                                                                                                                | 'green-1400'
                                                                                                                                                                                                                                | 'seafoam-100'
                                                                                                                                                                                                                                | 'seafoam-200'
                                                                                                                                                                                                                                | 'seafoam-300'
                                                                                                                                                                                                                                | 'seafoam-400'
                                                                                                                                                                                                                                | 'seafoam-500'
                                                                                                                                                                                                                                | 'seafoam-600'
                                                                                                                                                                                                                                | 'seafoam-700'
                                                                                                                                                                                                                                | 'seafoam-800'
                                                                                                                                                                                                                                | 'seafoam-900'
                                                                                                                                                                                                                                | 'seafoam-1000'
                                                                                                                                                                                                                                | 'seafoam-1100'
                                                                                                                                                                                                                                | 'seafoam-1200'
                                                                                                                                                                                                                                | 'seafoam-1300'
                                                                                                                                                                                                                                | 'seafoam-1400'
                                                                                                                                                                                                                                | 'cyan-100'
                                                                                                                                                                                                                                | 'cyan-200'
                                                                                                                                                                                                                                | 'cyan-300'
                                                                                                                                                                                                                                | 'cyan-400'
                                                                                                                                                                                                                                | 'cyan-500'
                                                                                                                                                                                                                                | 'cyan-600'
                                                                                                                                                                                                                                | 'cyan-700'
                                                                                                                                                                                                                                | 'cyan-800'
                                                                                                                                                                                                                                | 'cyan-900'
                                                                                                                                                                                                                                | 'cyan-1000'
                                                                                                                                                                                                                                | 'cyan-1100'
                                                                                                                                                                                                                                | 'cyan-1200'
                                                                                                                                                                                                                                | 'cyan-1300'
                                                                                                                                                                                                                                | 'cyan-1400'
                                                                                                                                                                                                                                | 'blue-100'
                                                                                                                                                                                                                                | 'blue-200'
                                                                                                                                                                                                                                | 'blue-300'
                                                                                                                                                                                                                                | 'blue-400'
                                                                                                                                                                                                                                | 'blue-500'
                                                                                                                                                                                                                                | 'blue-600'
                                                                                                                                                                                                                                | 'blue-700'
                                                                                                                                                                                                                                | 'blue-800'
                                                                                                                                                                                                                                | 'blue-900'
                                                                                                                                                                                                                                | 'blue-1000'
                                                                                                                                                                                                                                | 'blue-1100'
                                                                                                                                                                                                                                | 'blue-1200'
                                                                                                                                                                                                                                | 'blue-1300'
                                                                                                                                                                                                                                | 'blue-1400'
                                                                                                                                                                                                                                | 'indigo-100'
                                                                                                                                                                                                                                | 'indigo-200'
                                                                                                                                                                                                                                | 'indigo-300'
                                                                                                                                                                                                                                | 'indigo-400'
                                                                                                                                                                                                                                | 'indigo-500'
                                                                                                                                                                                                                                | 'indigo-600'
                                                                                                                                                                                                                                | 'indigo-700'
                                                                                                                                                                                                                                | 'indigo-800'
                                                                                                                                                                                                                                | 'indigo-900'
                                                                                                                                                                                                                                | 'indigo-1000'
                                                                                                                                                                                                                                | 'indigo-1100'
                                                                                                                                                                                                                                | 'indigo-1200'
                                                                                                                                                                                                                                | 'indigo-1300'
                                                                                                                                                                                                                                | 'indigo-1400'
                                                                                                                                                                                                                                | 'purple-100'
                                                                                                                                                                                                                                | 'purple-200'
                                                                                                                                                                                                                                | 'purple-300'
                                                                                                                                                                                                                                | 'purple-400'
                                                                                                                                                                                                                                | 'purple-500'
                                                                                                                                                                                                                                | 'purple-600'
                                                                                                                                                                                                                                | 'purple-700'
                                                                                                                                                                                                                                | 'purple-800'
                                                                                                                                                                                                                                | 'purple-900'
                                                                                                                                                                                                                                | 'purple-1000'
                                                                                                                                                                                                                                | 'purple-1100'
                                                                                                                                                                                                                                | 'purple-1200'
                                                                                                                                                                                                                                | 'purple-1300'
                                                                                                                                                                                                                                | 'purple-1400'
                                                                                                                                                                                                                                | 'fuchsia-100'
                                                                                                                                                                                                                                | 'fuchsia-200'
                                                                                                                                                                                                                                | 'fuchsia-300'
                                                                                                                                                                                                                                | 'fuchsia-400'
                                                                                                                                                                                                                                | 'fuchsia-500'
                                                                                                                                                                                                                                | 'fuchsia-600'
                                                                                                                                                                                                                                | 'fuchsia-700'
                                                                                                                                                                                                                                | 'fuchsia-800'
                                                                                                                                                                                                                                | 'fuchsia-900'
                                                                                                                                                                                                                                | 'fuchsia-1000'
                                                                                                                                                                                                                                | 'fuchsia-1100'
                                                                                                                                                                                                                                | 'fuchsia-1200'
                                                                                                                                                                                                                                | 'fuchsia-1300'
                                                                                                                                                                                                                                | 'fuchsia-1400'
                                                                                                                                                                                                                                | 'magenta-100'
                                                                                                                                                                                                                                | 'magenta-200'
                                                                                                                                                                                                                                | 'magenta-300'
                                                                                                                                                                                                                                | 'magenta-400'
                                                                                                                                                                                                                                | 'magenta-500'
                                                                                                                                                                                                                                | 'magenta-600'
                                                                                                                                                                                                                                | 'magenta-700'
                                                                                                                                                                                                                                | 'magenta-800'
                                                                                                                                                                                                                                | 'magenta-900'
                                                                                                                                                                                                                                | 'magenta-1000'
                                                                                                                                                                                                                                | 'magenta-1100'
                                                                                                                                                                                                                                | 'magenta-1200'
                                                                                                                                                                                                                                | 'magenta-1300'
                                                                                                                                                                                                                                | 'magenta-1400'
                                                                                                                                                                                                                                | SemanticColorValue;

                                                                                                                                                                                                                                  type ColorVersion

                                                                                                                                                                                                                                  type ColorVersion = 5 | 6;

                                                                                                                                                                                                                                    type DimensionValue

                                                                                                                                                                                                                                    type DimensionValue =
                                                                                                                                                                                                                                    | 'size-0'
                                                                                                                                                                                                                                    | 'size-10'
                                                                                                                                                                                                                                    | 'size-25'
                                                                                                                                                                                                                                    | 'size-40'
                                                                                                                                                                                                                                    | 'size-50'
                                                                                                                                                                                                                                    | 'size-65'
                                                                                                                                                                                                                                    | 'size-75'
                                                                                                                                                                                                                                    | 'size-85'
                                                                                                                                                                                                                                    | 'size-100'
                                                                                                                                                                                                                                    | 'size-115'
                                                                                                                                                                                                                                    | 'size-125'
                                                                                                                                                                                                                                    | 'size-130'
                                                                                                                                                                                                                                    | 'size-150'
                                                                                                                                                                                                                                    | 'size-160'
                                                                                                                                                                                                                                    | 'size-175'
                                                                                                                                                                                                                                    | 'size-200'
                                                                                                                                                                                                                                    | 'size-225'
                                                                                                                                                                                                                                    | 'size-250'
                                                                                                                                                                                                                                    | 'size-275'
                                                                                                                                                                                                                                    | 'size-300'
                                                                                                                                                                                                                                    | 'size-325'
                                                                                                                                                                                                                                    | 'size-350'
                                                                                                                                                                                                                                    | 'size-400'
                                                                                                                                                                                                                                    | 'size-450'
                                                                                                                                                                                                                                    | 'size-500'
                                                                                                                                                                                                                                    | 'size-550'
                                                                                                                                                                                                                                    | 'size-600'
                                                                                                                                                                                                                                    | 'size-675'
                                                                                                                                                                                                                                    | 'size-700'
                                                                                                                                                                                                                                    | 'size-800'
                                                                                                                                                                                                                                    | 'size-900'
                                                                                                                                                                                                                                    | 'size-1000'
                                                                                                                                                                                                                                    | 'size-1200'
                                                                                                                                                                                                                                    | 'size-1250'
                                                                                                                                                                                                                                    | 'size-1600'
                                                                                                                                                                                                                                    | 'size-1700'
                                                                                                                                                                                                                                    | 'size-2000'
                                                                                                                                                                                                                                    | 'size-2400'
                                                                                                                                                                                                                                    | 'size-3000'
                                                                                                                                                                                                                                    | 'size-3400'
                                                                                                                                                                                                                                    | 'size-3600'
                                                                                                                                                                                                                                    | 'size-4600'
                                                                                                                                                                                                                                    | 'size-5000'
                                                                                                                                                                                                                                    | 'size-6000'
                                                                                                                                                                                                                                    | 'static-size-0'
                                                                                                                                                                                                                                    | 'static-size-10'
                                                                                                                                                                                                                                    | 'static-size-25'
                                                                                                                                                                                                                                    | 'static-size-50'
                                                                                                                                                                                                                                    | 'static-size-40'
                                                                                                                                                                                                                                    | 'static-size-65'
                                                                                                                                                                                                                                    | 'static-size-100'
                                                                                                                                                                                                                                    | 'static-size-115'
                                                                                                                                                                                                                                    | 'static-size-125'
                                                                                                                                                                                                                                    | 'static-size-130'
                                                                                                                                                                                                                                    | 'static-size-150'
                                                                                                                                                                                                                                    | 'static-size-160'
                                                                                                                                                                                                                                    | 'static-size-175'
                                                                                                                                                                                                                                    | 'static-size-200'
                                                                                                                                                                                                                                    | 'static-size-225'
                                                                                                                                                                                                                                    | 'static-size-250'
                                                                                                                                                                                                                                    | 'static-size-300'
                                                                                                                                                                                                                                    | 'static-size-400'
                                                                                                                                                                                                                                    | 'static-size-450'
                                                                                                                                                                                                                                    | 'static-size-500'
                                                                                                                                                                                                                                    | 'static-size-550'
                                                                                                                                                                                                                                    | 'static-size-600'
                                                                                                                                                                                                                                    | 'static-size-700'
                                                                                                                                                                                                                                    | 'static-size-800'
                                                                                                                                                                                                                                    | 'static-size-900'
                                                                                                                                                                                                                                    | 'static-size-1000'
                                                                                                                                                                                                                                    | 'static-size-1200'
                                                                                                                                                                                                                                    | 'static-size-1700'
                                                                                                                                                                                                                                    | 'static-size-2400'
                                                                                                                                                                                                                                    | 'static-size-2600'
                                                                                                                                                                                                                                    | 'static-size-3400'
                                                                                                                                                                                                                                    | 'static-size-3600'
                                                                                                                                                                                                                                    | 'static-size-4600'
                                                                                                                                                                                                                                    | 'static-size-5000'
                                                                                                                                                                                                                                    | 'static-size-6000'
                                                                                                                                                                                                                                    | 'single-line-height'
                                                                                                                                                                                                                                    | 'single-line-width'
                                                                                                                                                                                                                                    // This allows autocomplete to work properly and not collapse the above options into just `string`.
                                                                                                                                                                                                                                    // See https://github.com/microsoft/TypeScript/issues/29729.
                                                                                                                                                                                                                                    | (string & {})
                                                                                                                                                                                                                                    | number;
                                                                                                                                                                                                                                    • See the [Styling docs](styling.html#dimension-values) for a visualization of these values.

                                                                                                                                                                                                                                    type Direction

                                                                                                                                                                                                                                    type Direction = 'ltr' | 'rtl';

                                                                                                                                                                                                                                      type DisabledBehavior

                                                                                                                                                                                                                                      type DisabledBehavior = 'selection' | 'all';

                                                                                                                                                                                                                                        type DOMRef

                                                                                                                                                                                                                                        type DOMRef<T extends HTMLElement = HTMLElement> = Ref<DOMRefValue<T>>;

                                                                                                                                                                                                                                          type DragPreviewRenderer

                                                                                                                                                                                                                                          type DragPreviewRenderer = (
                                                                                                                                                                                                                                          items: DragItem[],
                                                                                                                                                                                                                                          callback: (node: HTMLElement) => void
                                                                                                                                                                                                                                          ) => void;

                                                                                                                                                                                                                                            type DropItem

                                                                                                                                                                                                                                            type DropItem = TextDropItem | FileDropItem | DirectoryDropItem;

                                                                                                                                                                                                                                              type DropOperation

                                                                                                                                                                                                                                              type DropOperation = 'copy' | 'link' | 'move' | 'cancel';

                                                                                                                                                                                                                                                type DropPosition

                                                                                                                                                                                                                                                type DropPosition = 'on' | 'before' | 'after';

                                                                                                                                                                                                                                                  type DropTarget

                                                                                                                                                                                                                                                  type DropTarget = RootDropTarget | ItemDropTarget;

                                                                                                                                                                                                                                                    type FocusableRef

                                                                                                                                                                                                                                                    type FocusableRef<T extends HTMLElement = HTMLElement> = Ref<FocusableRefValue<T>>;

                                                                                                                                                                                                                                                      type FocusStrategy

                                                                                                                                                                                                                                                      type FocusStrategy = 'first' | 'last';

                                                                                                                                                                                                                                                        type IconColorValue

                                                                                                                                                                                                                                                        type IconColorValue = 'negative' | 'notice' | 'positive' | 'informative';

                                                                                                                                                                                                                                                          type ItemElement

                                                                                                                                                                                                                                                          type ItemElement<T> = ReactElement<ItemProps<T>>;

                                                                                                                                                                                                                                                            type ItemRenderer

                                                                                                                                                                                                                                                            type ItemRenderer<T> = (item: T) => ItemElement<T>;

                                                                                                                                                                                                                                                              type KeyboardEvent

                                                                                                                                                                                                                                                              type KeyboardEvent = BaseEvent<ReactKeyboardEvent<any>>;

                                                                                                                                                                                                                                                                type LabelPosition

                                                                                                                                                                                                                                                                type LabelPosition = 'top' | 'side';

                                                                                                                                                                                                                                                                  type LoadingState

                                                                                                                                                                                                                                                                  type LoadingState =
                                                                                                                                                                                                                                                                  | 'loading'
                                                                                                                                                                                                                                                                  | 'sorting'
                                                                                                                                                                                                                                                                  | 'loadingMore'
                                                                                                                                                                                                                                                                  | 'error'
                                                                                                                                                                                                                                                                  | 'idle'
                                                                                                                                                                                                                                                                  | 'filtering';

                                                                                                                                                                                                                                                                    type MoveEvent

                                                                                                                                                                                                                                                                    type MoveEvent = MoveStartEvent | MoveMoveEvent | MoveEndEvent;

                                                                                                                                                                                                                                                                      type NecessityIndicator

                                                                                                                                                                                                                                                                      type NecessityIndicator = 'icon' | 'label';

                                                                                                                                                                                                                                                                        type Orientation

                                                                                                                                                                                                                                                                        type Orientation = 'horizontal' | 'vertical';

                                                                                                                                                                                                                                                                          type PointerType

                                                                                                                                                                                                                                                                          type PointerType = 'mouse' | 'pen' | 'touch' | 'keyboard' | 'virtual';

                                                                                                                                                                                                                                                                            type Responsive

                                                                                                                                                                                                                                                                            type Responsive<T> = T | ResponsiveProp<T>;

                                                                                                                                                                                                                                                                              type ResponsiveProp

                                                                                                                                                                                                                                                                              type ResponsiveProp<T> = {
                                                                                                                                                                                                                                                                              base?: T;
                                                                                                                                                                                                                                                                              S?: T;
                                                                                                                                                                                                                                                                              M?: T;
                                                                                                                                                                                                                                                                              L?: T;
                                                                                                                                                                                                                                                                              [custom: string]: T | undefined;
                                                                                                                                                                                                                                                                              };

                                                                                                                                                                                                                                                                                type SectionElement

                                                                                                                                                                                                                                                                                type SectionElement<T> = ReactElement<SectionProps<T>>;

                                                                                                                                                                                                                                                                                  type Selection

                                                                                                                                                                                                                                                                                  type Selection = 'all' | Set<Key>;

                                                                                                                                                                                                                                                                                    type SelectionBehavior

                                                                                                                                                                                                                                                                                    type SelectionBehavior = 'toggle' | 'replace';

                                                                                                                                                                                                                                                                                      type SelectionMode

                                                                                                                                                                                                                                                                                      type SelectionMode = 'none' | 'single' | 'multiple';

                                                                                                                                                                                                                                                                                        type SemanticColorValue

                                                                                                                                                                                                                                                                                        type SemanticColorValue = 'negative' | 'notice' | 'positive' | 'informative';

                                                                                                                                                                                                                                                                                          type SortDirection

                                                                                                                                                                                                                                                                                          type SortDirection = 'ascending' | 'descending';

                                                                                                                                                                                                                                                                                            type ValidationState

                                                                                                                                                                                                                                                                                            type ValidationState = 'valid' | 'invalid';

                                                                                                                                                                                                                                                                                              Package Files (14)

                                                                                                                                                                                                                                                                                              Dependencies (0)

                                                                                                                                                                                                                                                                                              No dependencies.

                                                                                                                                                                                                                                                                                              Dev Dependencies (0)

                                                                                                                                                                                                                                                                                              No dev dependencies.

                                                                                                                                                                                                                                                                                              Peer Dependencies (1)

                                                                                                                                                                                                                                                                                              Badge

                                                                                                                                                                                                                                                                                              To add a badge like this onejsDocs.io badgeto 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/@react-types/shared.

                                                                                                                                                                                                                                                                                              • Markdown
                                                                                                                                                                                                                                                                                                [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/@react-types/shared)
                                                                                                                                                                                                                                                                                              • HTML
                                                                                                                                                                                                                                                                                                <a href="https://www.jsdocs.io/package/@react-types/shared"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>