@yahoo/uds 0.1.14 → 0.1.16

package/dist/index.d.cts

@@ -1,16 +1,16 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { j as UniversalAvatarProps, k as UniversalBoxProps, l as UniversalPressableProps, m as UniversalButtonProps, I as IconName, O as Overflow, n as UniversalTextProps, o as ButtonVariant, p as ButtonSize, q as UniversalStackProps, r as UniversalIconProps, s as UniversalIconButtonProps, t as ForegroundColor, u as UniversalImageProps, v as UniversalTextInputProps } from './types-hirL9Qk5.cjs';
-export { A as AlwaysPalette, x as AlwaysPaletteAlias, y as Animation, z as AriaAttribute, D as AspectRatioAlias, G as AspectRatioConfig, J as AvatarSizeAlias, K as AvatarSizeConfig, M as BackgroundColor, d as BackgroundPalette, N as BackgroundPaletteAlias, Q as BackgroundStyleProps, e as BackgroundWashPalette, R as BackgroundWashPaletteAlias, T as BorderStyleProps, V as BorderWidthAlias, B as BorderWidthConfig, W as BoxShadowConfig, C as ColorMode, X as ColorModeForApp, a as ColorsConfig, c as CorePalette, Y as CorePaletteAlias, Z as DataAttribute, h as ElevationAlias, E as ElevationConfig, _ as ElevationPaletteAlias, $ as FlexStyleProps, a0 as FontFamilyConfig, a1 as FontFamilyGlobalAlias, i as FontFamilyGlobalConfig, a2 as FontSizeConfig, f as FontWeightConfig, a3 as FontWeightDescriptiveAlias, g as FontWeightNumericAlias, F as ForegroundPalette, a4 as ForegroundPaletteAlias, a5 as HighContrastMode, H as Hue, b as HueStep, a6 as IconSizeAlias, a7 as IconSizeConfig, a8 as LayoutStyleProps, a9 as LetterSpacingAlias, aa as LineClampAlias, ab as LineColor, ac as LineHeightConfig, L as LinePalette, ad as LinePaletteAlias, ae as Modes, af as OpacityAlias, ag as OpacityStyleProps, ah as Palette, ai as PaletteConfig, aj as PaletteType, P as PaletteValue, ak as PlatformMode, al as RegionMode, am as ScaleConfig, S as ScaleMode, an as ScaleModeConfig, ao as ScaleModeForApp, ap as ShapeAlias, aq as ShapeConfig, ar as SizingStyleProps, as as SpacingAlias, at as SpacingConfig, au as SpacingStyleProps, av as SpectrumColor, aw as SpectrumConfig, ax as StateStyleProps, ay as StyleProps, az as TextConfig, aA as TextStyleProps, aB as TextTransformAlias, aC as TextTransformConfig, aD as TextVariant, aE as TransitionDelay, aF as TransitionDuration, aG as TransitionTiming, U as UniversalTokensConfig, aH as ZIndexAlias, aI as ZIndexConfig, w as alwaysPalette } from './types-hirL9Qk5.cjs';
+import { k as UniversalAvatarProps, l as UniversalBoxProps, m as UniversalPressableProps, n as UniversalButtonProps, ay as IconName, p as UniversalTextProps, aK as Overflow, ab as ButtonVariant, aa as ButtonSize, o as UniversalStackProps, q as UniversalIconProps, r as UniversalIconButtonProps, au as ForegroundColor, j as UniversalImageProps, af as Display, b0 as UniversalTextInputProps } from './types-_E6o7OhU.cjs';
+export { _ as AlwaysPalette, $ as AlwaysPaletteAlias, a0 as Animation, a1 as AriaAttribute, a2 as AspectRatio, a3 as AspectRatioConfig, a4 as AvatarSize, G as AvatarSizeConfig, a5 as BackgroundColor, d as BackgroundPalette, a6 as BackgroundPaletteAlias, v as BackgroundStyleProps, e as BackgroundWashPalette, a7 as BackgroundWashPaletteAlias, w as BorderStyleProps, a8 as BorderWidth, B as BorderWidthConfig, a9 as BoxShadowConfig, C as ColorMode, s as ColorModeForApp, a as ColorsConfig, ac as ConfigurableTextProperty, c as CorePalette, ad as CorePaletteAlias, D as CustomSizingStyleProps, ae as DataAttribute, h as Elevation, E as ElevationConfig, ag as ElevationPaletteAlias, ah as Flex, ai as FlexAlignContent, aj as FlexAlignItems, ak as FlexAlignSelf, al as FlexBasis, am as FlexDirection, an as FlexGrow, ao as FlexJustifyContent, ap as FlexShrink, y as FlexStyleProps, aq as FlexWrap, Q as FontFamilyConfig, ar as FontFamilyGlobalAlias, i as FontFamilyGlobalConfig, as as FontSize, R as FontSizeConfig, f as FontWeightConfig, at as FontWeightDescriptive, g as FontWeightNumeric, F as ForegroundPalette, av as ForegroundPaletteAlias, aw as Height, ax as HighContrastMode, H as Hue, b as HueStep, az as IconSize, J as IconSizeConfig, I as ImageStyleProps, x as LayoutStyleProps, aA as LetterSpacing, aB as LineClampAlias, aC as LineColor, aD as LineHeight, V as LineHeightConfig, L as LinePalette, aE as LinePaletteAlias, aF as MaxHeight, aG as MaxWidth, aH as MinHeight, aI as MinWidth, M as Modes, aJ as Opacity, O as OpacityStyleProps, aL as Palette, aM as PaletteConfig, aN as PaletteType, P as PaletteValue, aO as PlatformMode, aP as Position, aQ as RegionMode, aR as ScaleConfig, S as ScaleMode, u as ScaleModeConfig, t as ScaleModeForApp, aS as Shape, N as ShapeConfig, A as SizingStyleProps, aT as SpacingAlias, K as SpacingConfig, z as SpacingStyleProps, aU as SpectrumColor, aV as SpectrumConfig, aW as StateStyleProps, X as StyleProps, T as TextStyleProps, aX as TextTransform, W as TextTransformConfig, aY as TextVariant, aZ as TransitionDelay, a_ as TransitionDuration, a$ as TransitionTiming, U as UniversalTokensConfig, b1 as Width, b2 as ZIndex, Z as ZIndexConfig, Y as alwaysPalette } from './types-_E6o7OhU.cjs';
 import * as react from 'react';
-import react__default, { PropsWithChildren } from 'react';
+import react__default, { PropsWithChildren, TdHTMLAttributes } from 'react';
 import * as _ariakit_react from '@ariakit/react';
-import { PopoverProps, PopoverProviderProps, DialogProps, useDialogStore, DialogStore, DialogDismiss, Popover as Popover$1, PopoverArrow as PopoverArrow$1, PopoverAnchor as PopoverAnchor$1, PopoverDescription as PopoverDescription$1, PopoverDismiss as PopoverDismiss$1, PopoverProvider as PopoverProvider$1, PopoverDisclosure as PopoverDisclosure$1, PopoverDisclosureArrow as PopoverDisclosureArrow$1, TabProviderProps, TabListProps, TabPanelProps } from '@ariakit/react';
+import { PopoverProviderProps, PopoverProps, DialogProps, useDialogStore, DialogStore, DialogDismiss, Popover as Popover$1, PopoverArrow as PopoverArrow$1, PopoverAnchor as PopoverAnchor$1, PopoverDescription as PopoverDescription$1, PopoverDismiss as PopoverDismiss$1, PopoverProvider as PopoverProvider$1, PopoverDisclosure as PopoverDisclosure$1, PopoverDisclosureArrow as PopoverDisclosureArrow$1, TabProviderProps, TabListProps, TabPanelProps } from '@ariakit/react';
 export { DialogStore as ModalStore, TabListProps, TabPanelProps, TabProviderProps as TabsProps, usePopoverStore } from '@ariakit/react';
 import { ToastContainerProps } from 'react-toastify';
 export { toast } from 'react-toastify';
-import { C as CX, a as CVA } from './types-J4DLS6Xj.cjs';
-export { S as SetState } from './types-J4DLS6Xj.cjs';
-export { c as DEFAULT_COLOR_MODE, D as DEFAULT_COLOR_MODE_FOR_APP, g as DEFAULT_HIGH_CONTRAST_MODE, h as DEFAULT_REGION_MODE, e as DEFAULT_SCALE_MODE, b as DEFAULT_SCALE_MODE_FOR_APP, d as defaultTokensConfig, f as fontFamilyGlobal, a as fontWeightMap } from './index.native-3ww4C4UV.cjs';
+import { a as CX, C as CVA } from './types-3GXulqnG.cjs';
+export { S as SetState } from './types-3GXulqnG.cjs';
+export { c as DEFAULT_COLOR_MODE, D as DEFAULT_COLOR_MODE_FOR_APP, g as DEFAULT_HIGH_CONTRAST_MODE, h as DEFAULT_REGION_MODE, e as DEFAULT_SCALE_MODE, b as DEFAULT_SCALE_MODE_FOR_APP, d as defaultTokensConfig, f as fontFamilyGlobal, a as fontWeightMap } from './index.native-fciGC1AQ.cjs';
 export { AVATAR_SIZE_PREFIX, DARK_COLOR_MODE_CLASSNAME, DEFAULT_COLOR_MODE_CLASSNAME, DEFAULT_SCALE_MODE_CLASSNAME, FONT_FAMILY_PREFIX, FONT_ICONS_CSS_VAR, FONT_SANS_BETA_CSS_VAR, FONT_SANS_CONDENSED_CSS_VAR, FONT_SANS_CSS_VAR, FONT_SERIF_DISPLAY_CSS_VAR, FONT_SERIF_TEXT_CSS_VAR, FONT_SIZE_PREFIX, FONT_WEIGHT_PREFIX, ICON_SIZE_PREFIX, LARGE_SCALE_MODE_CLASSNAME, LIGHT_COLOR_MODE_CLASSNAME, LINE_HEIGHT_PREFIX, MEDIUM_SCALE_MODE_CLASSNAME, SHAPE_PREFIX, SMALL_SCALE_MODE_CLASSNAME, SPACING_PREFIX, SPECTRUM_COLOR_PREFIX, TEXT_TRANSFORM_PREFIX, UDS_PREFIX, XLARGE_SCALE_MODE_CLASSNAME, XSMALL_SCALE_MODE_CLASSNAME, XXLARGE_SCALE_MODE_CLASSNAME, XXXLARGE_SCALE_MODE_CLASSNAME, entries, getColorModeClassName, getScaleModeClassName } from './tokens/index.cjs';
 
 interface AccordionProps extends React.PropsWithChildren {
@@ -109,14 +109,11 @@ interface ChipProps {
 }
 declare function Chip({ children, variant, startIcon, startContent, endIcon, endContent, }: ChipProps): react_jsx_runtime.JSX.Element;
 
-interface DropdownItemsProps extends React.PropsWithChildren, Omit<PopoverProps, 'children'> {
-    overflow?: Overflow;
-}
-declare const DropdownItems: react.ForwardRefExoticComponent<Omit<DropdownItemsProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
-interface DropdownItemPressableProps extends Omit<PressableProps, 'onClick'> {
-    onClick?: (close: () => void) => void;
+interface DropdownProps extends PopoverProviderProps {
+    children: React.ReactNode;
 }
-declare const DropdownItemPressable: react.ForwardRefExoticComponent<DropdownItemPressableProps & react.RefAttributes<HTMLButtonElement>>;
+declare const Dropdown: typeof _ariakit_react.PopoverProvider;
+
 interface DropdownItemProps extends DropdownItemPressableProps {
     startIcon?: IconName;
     endIcon?: IconName;
@@ -126,17 +123,26 @@ interface DropdownItemProps extends DropdownItemPressableProps {
     _description?: UniversalTextProps;
 }
 declare function DropdownItem({ title, description, _title, _description, startIcon, endIcon, ...props }: DropdownItemProps): react_jsx_runtime.JSX.Element;
-declare function DropdownTrigger({ children, variant, size, ...props }: {
+
+interface DropdownItemPressableProps extends Omit<PressableProps, 'onClick'> {
+    onClick?: (close: () => void) => void;
+}
+declare const DropdownItemPressable: react.ForwardRefExoticComponent<DropdownItemPressableProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface DropdownItemsProps extends React.PropsWithChildren, Omit<PopoverProps, 'children'> {
+    overflow?: Overflow;
+}
+declare const DropdownItems: react.ForwardRefExoticComponent<Omit<DropdownItemsProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+interface DropdownTriggerProps extends PressableProps {
     children: React.ReactNode;
     variant?: ButtonVariant;
     size?: ButtonSize;
-} & PressableProps): react_jsx_runtime.JSX.Element;
-interface DropdownProps extends PopoverProviderProps {
-    children: React.ReactNode;
 }
-declare const Dropdown: typeof _ariakit_react.PopoverProvider;
+declare function DropdownTrigger({ children, variant, size, ...props }: DropdownTriggerProps): react_jsx_runtime.JSX.Element;
 
-type HStackProps = UniversalStackProps & DivProps$1;
+interface HStackProps extends UniversalStackProps, DivProps$1 {
+}
 /**
  * @example
   A layout primitive that can be used to compose other components.
@@ -237,7 +243,7 @@ type HStackProps = UniversalStackProps & DivProps$1;
   }
   ```
  */
-declare const HStack: react.ForwardRefExoticComponent<UniversalStackProps & DivProps$1 & react.RefAttributes<HTMLDivElement>>;
+declare const HStack: react.ForwardRefExoticComponent<HStackProps & react.RefAttributes<HTMLDivElement>>;
 
 type HtmlSpanProps = Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'>;
 interface IconProps extends UniversalIconProps, HtmlSpanProps {
@@ -311,6 +317,68 @@ interface SpinnerProps extends DivProps {
 }
 declare function Spinner({ className, ...props }: SpinnerProps): react_jsx_runtime.JSX.Element;
 
+/**
+ * TableColumn
+ * A TableColumn is a definition of a column in a table.
+ */
+type TableColumn<T> = {
+    title?: string;
+    dataIndex: keyof T;
+    render?: (value: T[keyof T], record: T, index: number) => react__default.ReactNode;
+};
+interface HTMLTableCellProps extends Omit<TdHTMLAttributes<HTMLTableCellElement>, 'color' | 'height' | 'width'> {
+}
+interface TableCellProps extends UniversalTextProps, HTMLTableCellProps {
+    /** asHeaderCell will return a th element instead of a td element.
+     *  If asHeaderCell is row, it will return a th element with scope="row"
+     *  @default false
+     */
+    asHeaderCell?: boolean | 'column' | 'row';
+}
+/**
+ * Table component props
+ * @template T The type of data in the table.
+ */
+type TableProps<T> = {
+    /** An array of data for the table. Each item represents a row in the table.
+     * The keys of each item should match the `dataIndex` of the columns.
+     */
+    data: T[];
+    /** An array of columns for the table. Each item defines a column in the table.
+     * The `dataIndex` should match the key of the data item.
+     */
+    columns: TableColumn<T>[];
+};
+/**
+ * The Table component renders a table with the given data and columns.
+ * If you want more control over the table, or want to handle virtualization,
+ * drag-n-drop, etc, Please can use the sub-components directly and build your own!
+ */
+declare function Table<T>({ data, columns }: TableProps<T>): react_jsx_runtime.JSX.Element;
+declare namespace Table {
+    var Root: react__default.ForwardRefExoticComponent<react__default.TableHTMLAttributes<HTMLTableElement> & BoxProps & {
+        /** Sets whether an element is treated as a block or inline box and the
+         *  layout used for its children, such as flow layout, grid or flex.
+         *  @default "table"
+         */
+        display?: Display | undefined;
+    } & {
+        children?: react__default.ReactNode;
+    } & react__default.RefAttributes<HTMLTableElement>>;
+    var Row: react__default.ForwardRefExoticComponent<react__default.HTMLAttributes<HTMLTableRowElement> & BoxProps & {
+        children?: react__default.ReactNode;
+    } & react__default.RefAttributes<HTMLTableRowElement>>;
+    var Header: react__default.ForwardRefExoticComponent<react__default.HTMLAttributes<HTMLTableSectionElement> & BoxProps & {
+        children?: react__default.ReactNode;
+    } & react__default.RefAttributes<HTMLTableSectionElement>>;
+    var Body: react__default.ForwardRefExoticComponent<react__default.HTMLAttributes<HTMLTableSectionElement> & BoxProps & {
+        children?: react__default.ReactNode;
+    } & react__default.RefAttributes<HTMLTableSectionElement>>;
+    var Cell: react__default.ForwardRefExoticComponent<TableCellProps & {
+        children?: react__default.ReactNode;
+    } & react__default.RefAttributes<HTMLTableCellElement | HTMLTableHeaderCellElement>>;
+}
+
 interface TabProps extends React.PropsWithChildren {
     asChild?: boolean;
     value: string;
@@ -425,16 +493,18 @@ declare const Text: react.ForwardRefExoticComponent<Omit<TextProps<TextElement>,
 type NativeTextInputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'height' | 'size' | 'width' | ''>;
 interface TextInputProps extends NativeTextInputProps, UniversalTextInputProps {
 }
-interface TextInputLabelProps extends React.PropsWithChildren {
-    required?: boolean;
-}
+declare function TextInput({ className, disabled, ...props }: TextInputProps): react_jsx_runtime.JSX.Element;
+
 interface TextInputGroupProps extends TextInputProps {
     label?: string;
 }
-declare function TextInputLabel({ children, required }: TextInputLabelProps): react_jsx_runtime.JSX.Element;
-declare function TextInput({ className, disabled, ...props }: TextInputProps): react_jsx_runtime.JSX.Element;
 declare function TextInputGroup({ label, required, ...props }: TextInputGroupProps): react_jsx_runtime.JSX.Element;
 
+interface TextInputLabelProps extends React.PropsWithChildren {
+    required?: boolean;
+}
+declare function TextInputLabel({ children, required }: TextInputLabelProps): react_jsx_runtime.JSX.Element;
+
 interface ToastProps extends ToastContainerProps {
 }
 declare function ToastContainer(props: ToastProps): react_jsx_runtime.JSX.Element;
@@ -503,12 +573,12 @@ declare const cva: CVA<string>;
 declare const getStyles: (props?: ({
     color?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "tertiary" | "muted" | "on-color" | "white" | "black" | undefined;
     colorChecked?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "tertiary" | "muted" | "on-color" | "white" | "black" | undefined;
-    fontFamily?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "icons" | "sans" | "sans-beta" | "sans-condensed" | "serif-text" | "serif-display" | "display2" | undefined;
-    fontSize?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "display2" | undefined;
-    fontWeight?: "bold" | "black" | "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "thin" | "extralight" | "light" | "regular" | "medium" | "semibold" | "extrabold" | "display2" | undefined;
-    lineHeight?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "display2" | undefined;
+    fontFamily?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "icons" | "sans" | "sans-beta" | "sans-condensed" | "serif-text" | "serif-display" | undefined;
+    fontSize?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | undefined;
+    fontWeight?: "bold" | "black" | "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "thin" | "extralight" | "light" | "regular" | "medium" | "semibold" | "extrabold" | undefined;
+    lineHeight?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | undefined;
     textAlign?: "center" | "justify" | "start" | "end" | undefined;
-    textTransform?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "none" | "uppercase" | "lowercase" | "capitalize" | "display2" | undefined;
+    textTransform?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "none" | "uppercase" | "lowercase" | "capitalize" | undefined;
     spacing?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "13" | "14" | undefined;
     spacingHorizontal?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "13" | "14" | undefined;
     spacingVertical?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "13" | "14" | undefined;
@@ -529,6 +599,7 @@ declare const getStyles: (props?: ({
     backgroundColorOnActive?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "white" | "black" | "accent-wash" | "alert-wash" | "brand-wash" | "positive-wash" | "warning-wash" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-3-inverse" | "overlay" | undefined;
     backgroundColorOnHover?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "white" | "black" | "accent-wash" | "alert-wash" | "brand-wash" | "positive-wash" | "warning-wash" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-3-inverse" | "overlay" | undefined;
     backgroundColorOnChecked?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "white" | "black" | "accent-wash" | "alert-wash" | "brand-wash" | "positive-wash" | "warning-wash" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-3-inverse" | "overlay" | undefined;
+    backgroundColorOnFocus?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "white" | "black" | "accent-wash" | "alert-wash" | "brand-wash" | "positive-wash" | "warning-wash" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-3-inverse" | "overlay" | undefined;
     elevation?: "1" | "2" | "3" | undefined;
     opacity?: "0" | "5" | "10" | "100" | "20" | "30" | "40" | "50" | "25" | "60" | "70" | "75" | "80" | "90" | "95" | undefined;
     borderColor?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "tertiary" | "muted" | "white" | "black" | undefined;
@@ -588,4 +659,4 @@ declare const getStyles: (props?: ({
     className?: string | undefined;
 }) | undefined) => string;
 
-export { Accordion, type AccordionProps, Avatar, type AvatarProps, Box, type BoxProps, Button, type ButtonProps, ButtonSize, ButtonVariant, Chip, type ChipProps, Dropdown, DropdownItem, DropdownItemPressable, type DropdownItemProps, DropdownItems, type DropdownItemsProps, type DropdownProps, DropdownTrigger, ForegroundColor, HStack, type HStackProps, Icon, IconButton, type IconButtonProps, IconName, type IconProps, Image, type ImageProps, Modal, ModalDismiss, ModalHeader, type ModalProps, Overflow, Popover, PopoverAnchor, PopoverArrow, PopoverDescription, PopoverDisclosure, PopoverDisclosureArrow, PopoverDismiss, PopoverHeading, type PopoverHeadingProps, PopoverProvider, Pressable, type PressableProps, Spinner, type SpinnerProps, Tab, TabList, TabPanel, type TabProps, Tabs, Text, TextInput, TextInputGroup, type TextInputGroupProps, TextInputLabel, type TextInputLabelProps, type TextInputProps, type TextProps, ToastContainer, UniversalAvatarProps, UniversalBoxProps, UniversalButtonProps, UniversalIconButtonProps, UniversalIconProps, UniversalImageProps, UniversalPressableProps, UniversalStackProps, UniversalTextInputProps, UniversalTextProps, VStack, type VStackProps, cva, cx, getStyles, useModalStore };
+export { Accordion, type AccordionProps, Avatar, type AvatarProps, Box, type BoxProps, Button, type ButtonProps, ButtonSize, ButtonVariant, Chip, type ChipProps, Display, Dropdown, DropdownItem, DropdownItemPressable, type DropdownItemPressableProps, type DropdownItemProps, DropdownItems, type DropdownItemsProps, type DropdownProps, DropdownTrigger, type DropdownTriggerProps, ForegroundColor, HStack, type HStackProps, Icon, IconButton, type IconButtonProps, IconName, type IconProps, Image, type ImageProps, Modal, ModalDismiss, ModalHeader, type ModalProps, Overflow, Popover, PopoverAnchor, PopoverArrow, PopoverDescription, PopoverDisclosure, PopoverDisclosureArrow, PopoverDismiss, PopoverHeading, type PopoverHeadingProps, PopoverProvider, Pressable, type PressableProps, Spinner, type SpinnerProps, Tab, TabList, TabPanel, type TabProps, Table, type TableProps, Tabs, Text, TextInput, TextInputGroup, type TextInputGroupProps, TextInputLabel, type TextInputLabelProps, type TextInputProps, type TextProps, ToastContainer, UniversalAvatarProps, UniversalBoxProps, UniversalButtonProps, UniversalIconButtonProps, UniversalIconProps, UniversalImageProps, UniversalPressableProps, UniversalStackProps, UniversalTextInputProps, UniversalTextProps, VStack, type VStackProps, cva, cx, getStyles, useModalStore };

package/dist/index.d.ts

@@ -1,16 +1,16 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { j as UniversalAvatarProps, k as UniversalBoxProps, l as UniversalPressableProps, m as UniversalButtonProps, I as IconName, O as Overflow, n as UniversalTextProps, o as ButtonVariant, p as ButtonSize, q as UniversalStackProps, r as UniversalIconProps, s as UniversalIconButtonProps, t as ForegroundColor, u as UniversalImageProps, v as UniversalTextInputProps } from './types-hirL9Qk5.js';
-export { A as AlwaysPalette, x as AlwaysPaletteAlias, y as Animation, z as AriaAttribute, D as AspectRatioAlias, G as AspectRatioConfig, J as AvatarSizeAlias, K as AvatarSizeConfig, M as BackgroundColor, d as BackgroundPalette, N as BackgroundPaletteAlias, Q as BackgroundStyleProps, e as BackgroundWashPalette, R as BackgroundWashPaletteAlias, T as BorderStyleProps, V as BorderWidthAlias, B as BorderWidthConfig, W as BoxShadowConfig, C as ColorMode, X as ColorModeForApp, a as ColorsConfig, c as CorePalette, Y as CorePaletteAlias, Z as DataAttribute, h as ElevationAlias, E as ElevationConfig, _ as ElevationPaletteAlias, $ as FlexStyleProps, a0 as FontFamilyConfig, a1 as FontFamilyGlobalAlias, i as FontFamilyGlobalConfig, a2 as FontSizeConfig, f as FontWeightConfig, a3 as FontWeightDescriptiveAlias, g as FontWeightNumericAlias, F as ForegroundPalette, a4 as ForegroundPaletteAlias, a5 as HighContrastMode, H as Hue, b as HueStep, a6 as IconSizeAlias, a7 as IconSizeConfig, a8 as LayoutStyleProps, a9 as LetterSpacingAlias, aa as LineClampAlias, ab as LineColor, ac as LineHeightConfig, L as LinePalette, ad as LinePaletteAlias, ae as Modes, af as OpacityAlias, ag as OpacityStyleProps, ah as Palette, ai as PaletteConfig, aj as PaletteType, P as PaletteValue, ak as PlatformMode, al as RegionMode, am as ScaleConfig, S as ScaleMode, an as ScaleModeConfig, ao as ScaleModeForApp, ap as ShapeAlias, aq as ShapeConfig, ar as SizingStyleProps, as as SpacingAlias, at as SpacingConfig, au as SpacingStyleProps, av as SpectrumColor, aw as SpectrumConfig, ax as StateStyleProps, ay as StyleProps, az as TextConfig, aA as TextStyleProps, aB as TextTransformAlias, aC as TextTransformConfig, aD as TextVariant, aE as TransitionDelay, aF as TransitionDuration, aG as TransitionTiming, U as UniversalTokensConfig, aH as ZIndexAlias, aI as ZIndexConfig, w as alwaysPalette } from './types-hirL9Qk5.js';
+import { k as UniversalAvatarProps, l as UniversalBoxProps, m as UniversalPressableProps, n as UniversalButtonProps, ay as IconName, p as UniversalTextProps, aK as Overflow, ab as ButtonVariant, aa as ButtonSize, o as UniversalStackProps, q as UniversalIconProps, r as UniversalIconButtonProps, au as ForegroundColor, j as UniversalImageProps, af as Display, b0 as UniversalTextInputProps } from './types-_E6o7OhU.js';
+export { _ as AlwaysPalette, $ as AlwaysPaletteAlias, a0 as Animation, a1 as AriaAttribute, a2 as AspectRatio, a3 as AspectRatioConfig, a4 as AvatarSize, G as AvatarSizeConfig, a5 as BackgroundColor, d as BackgroundPalette, a6 as BackgroundPaletteAlias, v as BackgroundStyleProps, e as BackgroundWashPalette, a7 as BackgroundWashPaletteAlias, w as BorderStyleProps, a8 as BorderWidth, B as BorderWidthConfig, a9 as BoxShadowConfig, C as ColorMode, s as ColorModeForApp, a as ColorsConfig, ac as ConfigurableTextProperty, c as CorePalette, ad as CorePaletteAlias, D as CustomSizingStyleProps, ae as DataAttribute, h as Elevation, E as ElevationConfig, ag as ElevationPaletteAlias, ah as Flex, ai as FlexAlignContent, aj as FlexAlignItems, ak as FlexAlignSelf, al as FlexBasis, am as FlexDirection, an as FlexGrow, ao as FlexJustifyContent, ap as FlexShrink, y as FlexStyleProps, aq as FlexWrap, Q as FontFamilyConfig, ar as FontFamilyGlobalAlias, i as FontFamilyGlobalConfig, as as FontSize, R as FontSizeConfig, f as FontWeightConfig, at as FontWeightDescriptive, g as FontWeightNumeric, F as ForegroundPalette, av as ForegroundPaletteAlias, aw as Height, ax as HighContrastMode, H as Hue, b as HueStep, az as IconSize, J as IconSizeConfig, I as ImageStyleProps, x as LayoutStyleProps, aA as LetterSpacing, aB as LineClampAlias, aC as LineColor, aD as LineHeight, V as LineHeightConfig, L as LinePalette, aE as LinePaletteAlias, aF as MaxHeight, aG as MaxWidth, aH as MinHeight, aI as MinWidth, M as Modes, aJ as Opacity, O as OpacityStyleProps, aL as Palette, aM as PaletteConfig, aN as PaletteType, P as PaletteValue, aO as PlatformMode, aP as Position, aQ as RegionMode, aR as ScaleConfig, S as ScaleMode, u as ScaleModeConfig, t as ScaleModeForApp, aS as Shape, N as ShapeConfig, A as SizingStyleProps, aT as SpacingAlias, K as SpacingConfig, z as SpacingStyleProps, aU as SpectrumColor, aV as SpectrumConfig, aW as StateStyleProps, X as StyleProps, T as TextStyleProps, aX as TextTransform, W as TextTransformConfig, aY as TextVariant, aZ as TransitionDelay, a_ as TransitionDuration, a$ as TransitionTiming, U as UniversalTokensConfig, b1 as Width, b2 as ZIndex, Z as ZIndexConfig, Y as alwaysPalette } from './types-_E6o7OhU.js';
 import * as react from 'react';
-import react__default, { PropsWithChildren } from 'react';
+import react__default, { PropsWithChildren, TdHTMLAttributes } from 'react';
 import * as _ariakit_react from '@ariakit/react';
-import { PopoverProps, PopoverProviderProps, DialogProps, useDialogStore, DialogStore, DialogDismiss, Popover as Popover$1, PopoverArrow as PopoverArrow$1, PopoverAnchor as PopoverAnchor$1, PopoverDescription as PopoverDescription$1, PopoverDismiss as PopoverDismiss$1, PopoverProvider as PopoverProvider$1, PopoverDisclosure as PopoverDisclosure$1, PopoverDisclosureArrow as PopoverDisclosureArrow$1, TabProviderProps, TabListProps, TabPanelProps } from '@ariakit/react';
+import { PopoverProviderProps, PopoverProps, DialogProps, useDialogStore, DialogStore, DialogDismiss, Popover as Popover$1, PopoverArrow as PopoverArrow$1, PopoverAnchor as PopoverAnchor$1, PopoverDescription as PopoverDescription$1, PopoverDismiss as PopoverDismiss$1, PopoverProvider as PopoverProvider$1, PopoverDisclosure as PopoverDisclosure$1, PopoverDisclosureArrow as PopoverDisclosureArrow$1, TabProviderProps, TabListProps, TabPanelProps } from '@ariakit/react';
 export { DialogStore as ModalStore, TabListProps, TabPanelProps, TabProviderProps as TabsProps, usePopoverStore } from '@ariakit/react';
 import { ToastContainerProps } from 'react-toastify';
 export { toast } from 'react-toastify';
-import { C as CX, a as CVA } from './types-J4DLS6Xj.js';
-export { S as SetState } from './types-J4DLS6Xj.js';
-export { c as DEFAULT_COLOR_MODE, D as DEFAULT_COLOR_MODE_FOR_APP, g as DEFAULT_HIGH_CONTRAST_MODE, h as DEFAULT_REGION_MODE, e as DEFAULT_SCALE_MODE, b as DEFAULT_SCALE_MODE_FOR_APP, d as defaultTokensConfig, f as fontFamilyGlobal, a as fontWeightMap } from './index.native-9kYJrUPa.js';
+import { a as CX, C as CVA } from './types-3GXulqnG.js';
+export { S as SetState } from './types-3GXulqnG.js';
+export { c as DEFAULT_COLOR_MODE, D as DEFAULT_COLOR_MODE_FOR_APP, g as DEFAULT_HIGH_CONTRAST_MODE, h as DEFAULT_REGION_MODE, e as DEFAULT_SCALE_MODE, b as DEFAULT_SCALE_MODE_FOR_APP, d as defaultTokensConfig, f as fontFamilyGlobal, a as fontWeightMap } from './index.native-hIYZ_ma-.js';
 export { AVATAR_SIZE_PREFIX, DARK_COLOR_MODE_CLASSNAME, DEFAULT_COLOR_MODE_CLASSNAME, DEFAULT_SCALE_MODE_CLASSNAME, FONT_FAMILY_PREFIX, FONT_ICONS_CSS_VAR, FONT_SANS_BETA_CSS_VAR, FONT_SANS_CONDENSED_CSS_VAR, FONT_SANS_CSS_VAR, FONT_SERIF_DISPLAY_CSS_VAR, FONT_SERIF_TEXT_CSS_VAR, FONT_SIZE_PREFIX, FONT_WEIGHT_PREFIX, ICON_SIZE_PREFIX, LARGE_SCALE_MODE_CLASSNAME, LIGHT_COLOR_MODE_CLASSNAME, LINE_HEIGHT_PREFIX, MEDIUM_SCALE_MODE_CLASSNAME, SHAPE_PREFIX, SMALL_SCALE_MODE_CLASSNAME, SPACING_PREFIX, SPECTRUM_COLOR_PREFIX, TEXT_TRANSFORM_PREFIX, UDS_PREFIX, XLARGE_SCALE_MODE_CLASSNAME, XSMALL_SCALE_MODE_CLASSNAME, XXLARGE_SCALE_MODE_CLASSNAME, XXXLARGE_SCALE_MODE_CLASSNAME, entries, getColorModeClassName, getScaleModeClassName } from './tokens/index.js';
 
 interface AccordionProps extends React.PropsWithChildren {
@@ -109,14 +109,11 @@ interface ChipProps {
 }
 declare function Chip({ children, variant, startIcon, startContent, endIcon, endContent, }: ChipProps): react_jsx_runtime.JSX.Element;
 
-interface DropdownItemsProps extends React.PropsWithChildren, Omit<PopoverProps, 'children'> {
-    overflow?: Overflow;
-}
-declare const DropdownItems: react.ForwardRefExoticComponent<Omit<DropdownItemsProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
-interface DropdownItemPressableProps extends Omit<PressableProps, 'onClick'> {
-    onClick?: (close: () => void) => void;
+interface DropdownProps extends PopoverProviderProps {
+    children: React.ReactNode;
 }
-declare const DropdownItemPressable: react.ForwardRefExoticComponent<DropdownItemPressableProps & react.RefAttributes<HTMLButtonElement>>;
+declare const Dropdown: typeof _ariakit_react.PopoverProvider;
+
 interface DropdownItemProps extends DropdownItemPressableProps {
     startIcon?: IconName;
     endIcon?: IconName;
@@ -126,17 +123,26 @@ interface DropdownItemProps extends DropdownItemPressableProps {
     _description?: UniversalTextProps;
 }
 declare function DropdownItem({ title, description, _title, _description, startIcon, endIcon, ...props }: DropdownItemProps): react_jsx_runtime.JSX.Element;
-declare function DropdownTrigger({ children, variant, size, ...props }: {
+
+interface DropdownItemPressableProps extends Omit<PressableProps, 'onClick'> {
+    onClick?: (close: () => void) => void;
+}
+declare const DropdownItemPressable: react.ForwardRefExoticComponent<DropdownItemPressableProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface DropdownItemsProps extends React.PropsWithChildren, Omit<PopoverProps, 'children'> {
+    overflow?: Overflow;
+}
+declare const DropdownItems: react.ForwardRefExoticComponent<Omit<DropdownItemsProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+interface DropdownTriggerProps extends PressableProps {
     children: React.ReactNode;
     variant?: ButtonVariant;
     size?: ButtonSize;
-} & PressableProps): react_jsx_runtime.JSX.Element;
-interface DropdownProps extends PopoverProviderProps {
-    children: React.ReactNode;
 }
-declare const Dropdown: typeof _ariakit_react.PopoverProvider;
+declare function DropdownTrigger({ children, variant, size, ...props }: DropdownTriggerProps): react_jsx_runtime.JSX.Element;
 
-type HStackProps = UniversalStackProps & DivProps$1;
+interface HStackProps extends UniversalStackProps, DivProps$1 {
+}
 /**
  * @example
   A layout primitive that can be used to compose other components.
@@ -237,7 +243,7 @@ type HStackProps = UniversalStackProps & DivProps$1;
   }
   ```
  */
-declare const HStack: react.ForwardRefExoticComponent<UniversalStackProps & DivProps$1 & react.RefAttributes<HTMLDivElement>>;
+declare const HStack: react.ForwardRefExoticComponent<HStackProps & react.RefAttributes<HTMLDivElement>>;
 
 type HtmlSpanProps = Omit<React.HTMLAttributes<HTMLSpanElement>, 'color'>;
 interface IconProps extends UniversalIconProps, HtmlSpanProps {
@@ -311,6 +317,68 @@ interface SpinnerProps extends DivProps {
 }
 declare function Spinner({ className, ...props }: SpinnerProps): react_jsx_runtime.JSX.Element;
 
+/**
+ * TableColumn
+ * A TableColumn is a definition of a column in a table.
+ */
+type TableColumn<T> = {
+    title?: string;
+    dataIndex: keyof T;
+    render?: (value: T[keyof T], record: T, index: number) => react__default.ReactNode;
+};
+interface HTMLTableCellProps extends Omit<TdHTMLAttributes<HTMLTableCellElement>, 'color' | 'height' | 'width'> {
+}
+interface TableCellProps extends UniversalTextProps, HTMLTableCellProps {
+    /** asHeaderCell will return a th element instead of a td element.
+     *  If asHeaderCell is row, it will return a th element with scope="row"
+     *  @default false
+     */
+    asHeaderCell?: boolean | 'column' | 'row';
+}
+/**
+ * Table component props
+ * @template T The type of data in the table.
+ */
+type TableProps<T> = {
+    /** An array of data for the table. Each item represents a row in the table.
+     * The keys of each item should match the `dataIndex` of the columns.
+     */
+    data: T[];
+    /** An array of columns for the table. Each item defines a column in the table.
+     * The `dataIndex` should match the key of the data item.
+     */
+    columns: TableColumn<T>[];
+};
+/**
+ * The Table component renders a table with the given data and columns.
+ * If you want more control over the table, or want to handle virtualization,
+ * drag-n-drop, etc, Please can use the sub-components directly and build your own!
+ */
+declare function Table<T>({ data, columns }: TableProps<T>): react_jsx_runtime.JSX.Element;
+declare namespace Table {
+    var Root: react__default.ForwardRefExoticComponent<react__default.TableHTMLAttributes<HTMLTableElement> & BoxProps & {
+        /** Sets whether an element is treated as a block or inline box and the
+         *  layout used for its children, such as flow layout, grid or flex.
+         *  @default "table"
+         */
+        display?: Display | undefined;
+    } & {
+        children?: react__default.ReactNode;
+    } & react__default.RefAttributes<HTMLTableElement>>;
+    var Row: react__default.ForwardRefExoticComponent<react__default.HTMLAttributes<HTMLTableRowElement> & BoxProps & {
+        children?: react__default.ReactNode;
+    } & react__default.RefAttributes<HTMLTableRowElement>>;
+    var Header: react__default.ForwardRefExoticComponent<react__default.HTMLAttributes<HTMLTableSectionElement> & BoxProps & {
+        children?: react__default.ReactNode;
+    } & react__default.RefAttributes<HTMLTableSectionElement>>;
+    var Body: react__default.ForwardRefExoticComponent<react__default.HTMLAttributes<HTMLTableSectionElement> & BoxProps & {
+        children?: react__default.ReactNode;
+    } & react__default.RefAttributes<HTMLTableSectionElement>>;
+    var Cell: react__default.ForwardRefExoticComponent<TableCellProps & {
+        children?: react__default.ReactNode;
+    } & react__default.RefAttributes<HTMLTableCellElement | HTMLTableHeaderCellElement>>;
+}
+
 interface TabProps extends React.PropsWithChildren {
     asChild?: boolean;
     value: string;
@@ -425,16 +493,18 @@ declare const Text: react.ForwardRefExoticComponent<Omit<TextProps<TextElement>,
 type NativeTextInputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'height' | 'size' | 'width' | ''>;
 interface TextInputProps extends NativeTextInputProps, UniversalTextInputProps {
 }
-interface TextInputLabelProps extends React.PropsWithChildren {
-    required?: boolean;
-}
+declare function TextInput({ className, disabled, ...props }: TextInputProps): react_jsx_runtime.JSX.Element;
+
 interface TextInputGroupProps extends TextInputProps {
     label?: string;
 }
-declare function TextInputLabel({ children, required }: TextInputLabelProps): react_jsx_runtime.JSX.Element;
-declare function TextInput({ className, disabled, ...props }: TextInputProps): react_jsx_runtime.JSX.Element;
 declare function TextInputGroup({ label, required, ...props }: TextInputGroupProps): react_jsx_runtime.JSX.Element;
 
+interface TextInputLabelProps extends React.PropsWithChildren {
+    required?: boolean;
+}
+declare function TextInputLabel({ children, required }: TextInputLabelProps): react_jsx_runtime.JSX.Element;
+
 interface ToastProps extends ToastContainerProps {
 }
 declare function ToastContainer(props: ToastProps): react_jsx_runtime.JSX.Element;
@@ -503,12 +573,12 @@ declare const cva: CVA<string>;
 declare const getStyles: (props?: ({
     color?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "tertiary" | "muted" | "on-color" | "white" | "black" | undefined;
     colorChecked?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "tertiary" | "muted" | "on-color" | "white" | "black" | undefined;
-    fontFamily?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "icons" | "sans" | "sans-beta" | "sans-condensed" | "serif-text" | "serif-display" | "display2" | undefined;
-    fontSize?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "display2" | undefined;
-    fontWeight?: "bold" | "black" | "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "thin" | "extralight" | "light" | "regular" | "medium" | "semibold" | "extrabold" | "display2" | undefined;
-    lineHeight?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "display2" | undefined;
+    fontFamily?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "icons" | "sans" | "sans-beta" | "sans-condensed" | "serif-text" | "serif-display" | undefined;
+    fontSize?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | undefined;
+    fontWeight?: "bold" | "black" | "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "thin" | "extralight" | "light" | "regular" | "medium" | "semibold" | "extrabold" | undefined;
+    lineHeight?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | undefined;
     textAlign?: "center" | "justify" | "start" | "end" | undefined;
-    textTransform?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "none" | "uppercase" | "lowercase" | "capitalize" | "display2" | undefined;
+    textTransform?: "display1" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "caption1" | "caption2" | "legal1" | "none" | "uppercase" | "lowercase" | "capitalize" | undefined;
     spacing?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "13" | "14" | undefined;
     spacingHorizontal?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "13" | "14" | undefined;
     spacingVertical?: "9" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "10" | "11" | "12" | "13" | "14" | undefined;
@@ -529,6 +599,7 @@ declare const getStyles: (props?: ({
     backgroundColorOnActive?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "white" | "black" | "accent-wash" | "alert-wash" | "brand-wash" | "positive-wash" | "warning-wash" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-3-inverse" | "overlay" | undefined;
     backgroundColorOnHover?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "white" | "black" | "accent-wash" | "alert-wash" | "brand-wash" | "positive-wash" | "warning-wash" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-3-inverse" | "overlay" | undefined;
     backgroundColorOnChecked?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "white" | "black" | "accent-wash" | "alert-wash" | "brand-wash" | "positive-wash" | "warning-wash" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-3-inverse" | "overlay" | undefined;
+    backgroundColorOnFocus?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "white" | "black" | "accent-wash" | "alert-wash" | "brand-wash" | "positive-wash" | "warning-wash" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-3-inverse" | "overlay" | undefined;
     elevation?: "1" | "2" | "3" | undefined;
     opacity?: "0" | "5" | "10" | "100" | "20" | "30" | "40" | "50" | "25" | "60" | "70" | "75" | "80" | "90" | "95" | undefined;
     borderColor?: "transparent" | "accent" | "alert" | "brand" | "positive" | "warning" | "primary" | "secondary" | "tertiary" | "muted" | "white" | "black" | undefined;
@@ -588,4 +659,4 @@ declare const getStyles: (props?: ({
     className?: string | undefined;
 }) | undefined) => string;
 
-export { Accordion, type AccordionProps, Avatar, type AvatarProps, Box, type BoxProps, Button, type ButtonProps, ButtonSize, ButtonVariant, Chip, type ChipProps, Dropdown, DropdownItem, DropdownItemPressable, type DropdownItemProps, DropdownItems, type DropdownItemsProps, type DropdownProps, DropdownTrigger, ForegroundColor, HStack, type HStackProps, Icon, IconButton, type IconButtonProps, IconName, type IconProps, Image, type ImageProps, Modal, ModalDismiss, ModalHeader, type ModalProps, Overflow, Popover, PopoverAnchor, PopoverArrow, PopoverDescription, PopoverDisclosure, PopoverDisclosureArrow, PopoverDismiss, PopoverHeading, type PopoverHeadingProps, PopoverProvider, Pressable, type PressableProps, Spinner, type SpinnerProps, Tab, TabList, TabPanel, type TabProps, Tabs, Text, TextInput, TextInputGroup, type TextInputGroupProps, TextInputLabel, type TextInputLabelProps, type TextInputProps, type TextProps, ToastContainer, UniversalAvatarProps, UniversalBoxProps, UniversalButtonProps, UniversalIconButtonProps, UniversalIconProps, UniversalImageProps, UniversalPressableProps, UniversalStackProps, UniversalTextInputProps, UniversalTextProps, VStack, type VStackProps, cva, cx, getStyles, useModalStore };
+export { Accordion, type AccordionProps, Avatar, type AvatarProps, Box, type BoxProps, Button, type ButtonProps, ButtonSize, ButtonVariant, Chip, type ChipProps, Display, Dropdown, DropdownItem, DropdownItemPressable, type DropdownItemPressableProps, type DropdownItemProps, DropdownItems, type DropdownItemsProps, type DropdownProps, DropdownTrigger, type DropdownTriggerProps, ForegroundColor, HStack, type HStackProps, Icon, IconButton, type IconButtonProps, IconName, type IconProps, Image, type ImageProps, Modal, ModalDismiss, ModalHeader, type ModalProps, Overflow, Popover, PopoverAnchor, PopoverArrow, PopoverDescription, PopoverDisclosure, PopoverDisclosureArrow, PopoverDismiss, PopoverHeading, type PopoverHeadingProps, PopoverProvider, Pressable, type PressableProps, Spinner, type SpinnerProps, Tab, TabList, TabPanel, type TabProps, Table, type TableProps, Tabs, Text, TextInput, TextInputGroup, type TextInputGroupProps, TextInputLabel, type TextInputLabelProps, type TextInputProps, type TextProps, ToastContainer, UniversalAvatarProps, UniversalBoxProps, UniversalButtonProps, UniversalIconButtonProps, UniversalIconProps, UniversalImageProps, UniversalPressableProps, UniversalStackProps, UniversalTextInputProps, UniversalTextProps, VStack, type VStackProps, cva, cx, getStyles, useModalStore };