@yahoo/uds 0.1.20 → 0.2.0

package/dist/index.d.ts

@@ -1,147 +1,15 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import { D as DivProps } from './Pressable-LIDkIIAF.js';
+export { B as Box, a as BoxProps, P as Pressable, b as PressableProps } from './Pressable-LIDkIIAF.js';
 import * as react from 'react';
-import react__default, { PropsWithChildren, TdHTMLAttributes } from 'react';
-import { l as UniversalPressableProps, j as UniversalAvatarProps, k as UniversalBoxProps, m as UniversalButtonProps, aA as IconName, o as UniversalTextProps, aM as Overflow, ad as ButtonVariant, ac as ButtonSize, n as UniversalStackProps, p as UniversalIconProps, q as UniversalIconButtonProps, aw as ForegroundColor, i as UniversalImageProps, ah as Display, b1 as UniversalTextInputProps } from './types-ZrxnB4cM.js';
-export { _ as AlwaysPalette, $ as AlwaysPaletteAlias, a0 as Animation, a1 as AriaAttribute, a2 as AspectRatio, a3 as AspectRatioConfig, a4 as AvatarShape, a5 as AvatarSize, D as AvatarSizeConfig, a6 as BackgroundColor, B as BackgroundPalette, a7 as BackgroundPaletteAlias, u as BackgroundStyleProps, d as BackgroundWashPalette, a8 as BackgroundWashPaletteAlias, a9 as BorderRadius, K as BorderRadiusConfig, v as BorderStyleProps, aa as BorderWidth, N as BorderWidthConfig, ab as BoxShadowConfig, C as ColorMode, r as ColorModeForApp, a as ColorsConfig, ae as ConfigurableTextProperty, c as CorePalette, af as CorePaletteAlias, A as CustomSizingStyleProps, ag as DataAttribute, g as Elevation, E as ElevationConfig, ai as ElevationPaletteAlias, aj as Flex, ak as FlexAlignContent, al as FlexAlignItems, am as FlexAlignSelf, an as FlexBasis, ao as FlexDirection, ap as FlexGrow, aq as FlexJustifyContent, ar as FlexShrink, x as FlexStyleProps, as as FlexWrap, Q as FontFamilyConfig, at as FontFamilyGlobalAlias, h as FontFamilyGlobalConfig, au as FontSize, R as FontSizeConfig, e as FontWeightConfig, av as FontWeightDescriptive, f as FontWeightNumeric, F as ForegroundPalette, ax as ForegroundPaletteAlias, ay as Height, az as HighContrastMode, H as Hue, b as HueStep, aB as IconSize, G as IconSizeConfig, I as ImageStyleProps, w as LayoutStyleProps, aC as LetterSpacing, aD as LineClampAlias, aE as LineColor, aF as LineHeight, V as LineHeightConfig, L as LinePalette, aG as LinePaletteAlias, aH as MaxHeight, aI as MaxWidth, aJ as MinHeight, aK as MinWidth, M as Modes, aL as Opacity, O as OpacityStyleProps, aN as Palette, aO as PaletteConfig, aP as PaletteType, P as PaletteValue, aQ as PlatformMode, aR as Position, aS as RegionMode, aT as ScaleConfig, S as ScaleMode, t as ScaleModeConfig, s as ScaleModeForApp, z as SizingStyleProps, aU as SpacingAlias, J as SpacingConfig, y as SpacingStyleProps, aV as SpectrumColor, aW as SpectrumConfig, aX as StateStyleProps, X as StyleProps, T as TextStyleProps, aY as TextTransform, W as TextTransformConfig, aZ as TextVariant, a_ as TransitionDelay, a$ as TransitionDuration, b0 as TransitionTiming, U as UniversalTokensConfig, b2 as Width, b3 as ZIndex, Z as ZIndexConfig, Y as alwaysPalette } from './types-ZrxnB4cM.js';
-import * as _ariakit_react 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 { a as CX, C as CVA } from './types-BO2kLynl.js';
-export { S as SetState } from './types-BO2kLynl.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-DqJv5EjY.js';
+import { o as UniversalStackProps, p as UniversalIconProps, n as UniversalImageProps, q as UniversalTextProps } from './types-7oEBWtMQ.js';
+export { A as AlwaysPalette, s as AlwaysPaletteAlias, t as Animation, u as AriaAttribute, v as AspectRatio, w as AspectRatioConfig, x as AvatarShape, y as AvatarSize, z as AvatarSizeConfig, D as BackgroundColor, B as BackgroundPalette, G as BackgroundPaletteAlias, I as BackgroundStyleProps, d as BackgroundWashPalette, J as BackgroundWashPaletteAlias, K as BorderRadius, M as BorderRadiusConfig, N as BorderStyleProps, O as BorderWidth, Q as BorderWidthConfig, R as BoxShadowConfig, T as ButtonSize, V as ButtonVariant, C as ColorMode, W as ColorModeForApp, a as ColorsConfig, X as ConfigurableTextProperty, c as CorePalette, Y as CorePaletteAlias, Z as CustomSizingStyleProps, _ as DataAttribute, $ as Display, g as Elevation, E as ElevationConfig, a0 as ElevationPaletteAlias, a1 as Flex, a2 as FlexAlignContent, a3 as FlexAlignItems, a4 as FlexAlignSelf, a5 as FlexBasis, a6 as FlexDirection, a7 as FlexGrow, a8 as FlexJustifyContent, a9 as FlexShrink, aa as FlexStyleProps, ab as FlexWrap, ac as FontFamilyConfig, ad as FontFamilyGlobalAlias, h as FontFamilyGlobalConfig, ae as FontSize, af as FontSizeConfig, e as FontWeightConfig, ag as FontWeightDescriptive, f as FontWeightNumeric, ah as ForegroundColor, F as ForegroundPalette, ai as ForegroundPaletteAlias, aj as Height, ak as HighContrastMode, H as Hue, b as HueStep, al as IconName, am as IconSize, an as IconSizeConfig, ao as ImageStyleProps, ap as LayoutStyleProps, aq as LetterSpacing, ar as LineClampAlias, as as LineColor, at as LineHeight, au as LineHeightConfig, L as LinePalette, av as LinePaletteAlias, aw as MaxHeight, ax as MaxWidth, ay as MinHeight, az as MinWidth, aA as Modes, aB as Opacity, aC as OpacityStyleProps, aD as Overflow, aE as Palette, aF as PaletteConfig, aG as PaletteType, P as PaletteValue, aH as PlatformMode, aI as Position, aJ as RegionMode, aK as ScaleConfig, S as ScaleMode, aL as ScaleModeConfig, aM as ScaleModeForApp, aN as SizingStyleProps, aO as SpacingAlias, aP as SpacingConfig, aQ as SpacingStyleProps, aR as SpectrumColor, aS as SpectrumConfig, aT as StateStyleProps, aU as StyleProps, aV as TextStyleProps, aW as TextTransform, aX as TextTransformConfig, aY as TextVariant, aZ as TransitionDelay, a_ as TransitionDuration, a$ as TransitionTiming, k as UniversalAvatarProps, i as UniversalBoxProps, l as UniversalButtonProps, m as UniversalIconButtonProps, j as UniversalPressableProps, b0 as UniversalTextInputProps, U as UniversalTokensConfig, b1 as Width, b2 as ZIndex, b3 as ZIndexConfig, r as alwaysPalette } from './types-7oEBWtMQ.js';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+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-xVHqKK0u.js';
 export { AVATAR_SIZE_PREFIX, BORDER_RADIUS_PREFIX, BORDER_WIDTH_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, 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 } from './tokens/index.js';
 
-type HtmlButtonProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'color' | 'name'>;
-interface PressableProps extends UniversalPressableProps, HtmlButtonProps {
-}
-/**
- * Provides press interactions with accessibility support.
- * @example
- ```tsx
-   import { Pressable, Text } from "@yahoo/uds"
-
-  export function Demo() {
-    return (
-      <Pressable
-        onClick={console.log}
-        backgroundColor="secondary"
-        bordered
-        borderColor="primary"
-        borderRadius="lg"
-      >
-        <Text variant="body1" spacingHorizontal="7" spacingVertical="5">Click me...</Text>
-      </Pressable>
-    )
-  }
-  ```
- */
-declare const Pressable: react.ForwardRefExoticComponent<PressableProps & react.RefAttributes<HTMLButtonElement>>;
-
-interface AccordionProps extends PressableProps {
-    label: string;
-    open?: boolean;
-    onClick?: () => void;
-}
-declare function Accordion({ label, children, onClick, open, spacingHorizontal, ...pressableProps }: AccordionProps): react_jsx_runtime.JSX.Element;
-
-type NativeImageProps$1 = Omit<react__default.ImgHTMLAttributes<HTMLImageElement>, 'size' | 'color' | 'height' | 'width' | 'alt' | 'src'>;
-interface AvatarProps extends NativeImageProps$1, UniversalAvatarProps {
-}
-/**
- * Avatar can be used for profile images.
- */
-declare function Avatar({ size: avatarSize, shape: borderRadius, src, alt, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
-
-type DivProps$1 = React.HTMLAttributes<HTMLDivElement>;
-interface BoxProps extends UniversalBoxProps, DivProps$1 {
-}
-/**
- * A layout primitive that can be used to compose other components.
- * @example
- ```tsx
-  import { Box } from "@yahoo/uds"
-
-  export function Demo() {
-    return (
-      <Box
-        bordered
-        backgroundColor="primary"
-        borderRadius="md"
-        spacing='6'
-        >
-        Any kind of content can go here!
-      </Box>
-    )
-  }
-  ```
- */
-declare const Box: react.ForwardRefExoticComponent<BoxProps & react.RefAttributes<HTMLDivElement>>;
-
-interface ButtonProps extends PressableProps, UniversalButtonProps {
-}
-/**
- * A button element that can be used to trigger an action.
- * @example
- ```tsx
-  import { Button, HStack } from "@yahoo/uds"
-
-  export function Demo() {
-    return (
-      <HStack gap="2">
-        <Button variant="accent" onClick={console.log}>Save</Button>
-        <Button variant="accent-outline" onClick={console.log}>Cancel</Button>
-      </HStack>
-    )
-  }
- ```
- */
-declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
-
-interface ChipProps {
-    children?: string;
-    startContent?: React.ReactNode;
-    startIcon?: IconName;
-    endIcon?: IconName;
-    endContent?: React.ReactNode;
-    variant: 'accent' | 'secondary';
-}
-declare function Chip({ children, variant, startIcon, startContent, endIcon, endContent, }: ChipProps): react_jsx_runtime.JSX.Element;
-
-interface DropdownProps extends PopoverProviderProps {
-    children: React.ReactNode;
-}
-declare const Dropdown: typeof _ariakit_react.PopoverProvider;
-
-interface DropdownItemProps extends DropdownItemPressableProps {
-    startIcon?: IconName;
-    endIcon?: IconName;
-    title?: string;
-    description?: string;
-    _title?: UniversalTextProps;
-    _description?: UniversalTextProps;
-}
-declare function DropdownItem({ title, description, _title, _description, startIcon, endIcon, ...props }: DropdownItemProps): react_jsx_runtime.JSX.Element;
-
-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;
-}
-declare function DropdownTrigger({ children, variant, size, ...props }: DropdownTriggerProps): react_jsx_runtime.JSX.Element;
-
-interface HStackProps extends UniversalStackProps, DivProps$1 {
+interface HStackProps extends UniversalStackProps, DivProps {
 }
 /**
  * @example
@@ -262,24 +130,6 @@ interface IconProps extends UniversalIconProps, HtmlSpanProps {
  */
 declare const Icon: react.ForwardRefExoticComponent<IconProps & react.RefAttributes<HTMLSpanElement>>;
 
-interface IconButtonProps extends PressableProps, UniversalIconButtonProps {
-    color?: ForegroundColor;
-}
-/**
- * An icon button element that can be used to trigger an action.
- * @example
- ```tsx
-  import { IconButton } from "@yahoo/uds"
-
-  export function IconButtonDemo() {
-    return (
-      <IconButton variant="accent-outline" name="close" onPress={console.log} />
-    )
-  }
- ```
- */
-declare const IconButton: react.ForwardRefExoticComponent<IconButtonProps & react.RefAttributes<HTMLButtonElement>>;
-
 type NativeImageProps = Omit<React.ImgHTMLAttributes<HTMLImageElement>, 'size' | 'color' | 'height' | 'width' | 'alt' | 'src'>;
 interface ImageProps extends NativeImageProps, UniversalImageProps {
 }
@@ -288,108 +138,6 @@ interface ImageProps extends NativeImageProps, UniversalImageProps {
  */
 declare function Image({ width: imageWidth, height: imageHeight, src, alt, contentFit, elevation, backgroundColor, backgroundColorOnActive, backgroundColorOnHover, backgroundColorOnChecked, opacity, bordered, borderedTop, borderedBottom, borderedStart, borderedEnd, borderedHorizontal, borderedVertical, borderRadius, borderTopStartRadius, borderTopEndRadius, borderBottomStartRadius, borderBottomEndRadius, borderColor, borderColorOnActive, borderColorOnFocus, borderColorOnChecked, borderColorOnHover, borderStartColor, borderEndColor, borderTopColor, borderBottomColor, borderWidth, borderVerticalWidth, borderHorizontalWidth, borderStartWidth, borderEndWidth, borderTopWidth, borderBottomWidth, alignContent, alignItems, alignSelf, flex, flexDirection, flexGrow, flexShrink, flexWrap, justifyContent, flexBasis, display, zIndex, overflow, overflowX, overflowY, position, spacing, spacingHorizontal, spacingVertical, spacingBottom, spacingEnd, spacingStart, spacingTop, offset, offsetVertical, offsetHorizontal, offsetBottom, offsetEnd, offsetStart, offsetTop, columnGap, rowGap, minHeight, maxHeight, minWidth, maxWidth, ...props }: ImageProps): react_jsx_runtime.JSX.Element;
 
-interface ModalProps extends DialogProps {
-}
-declare function useModalStore(params?: Parameters<typeof useDialogStore>[0]): DialogStore;
-interface ModalHeaderProps extends React.PropsWithChildren {
-    handleClose?: () => void;
-}
-declare function ModalHeader({ children, handleClose }: ModalHeaderProps): react_jsx_runtime.JSX.Element;
-declare function Modal({ className, ...props }: ModalProps): react_jsx_runtime.JSX.Element;
-declare const ModalDismiss: typeof DialogDismiss;
-
-interface PopoverHeadingProps extends PropsWithChildren {
-    leading?: react__default.ReactNode;
-    trailing?: react__default.ReactNode;
-}
-declare function PopoverHeading({ children, leading, trailing }: PopoverHeadingProps): react_jsx_runtime.JSX.Element;
-declare const Popover: typeof Popover$1;
-declare const PopoverArrow: typeof PopoverArrow$1;
-declare const PopoverAnchor: typeof PopoverAnchor$1;
-declare const PopoverDescription: typeof PopoverDescription$1;
-declare const PopoverDismiss: typeof PopoverDismiss$1;
-declare const PopoverProvider: typeof PopoverProvider$1;
-declare const PopoverDisclosure: typeof PopoverDisclosure$1;
-declare const PopoverDisclosureArrow: typeof PopoverDisclosureArrow$1;
-
-type DivProps = React.HTMLAttributes<HTMLDivElement>;
-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;
-    label: string;
-    startIcon?: IconName;
-}
-declare function Tabs(props: TabProviderProps): react_jsx_runtime.JSX.Element;
-declare const TabList: react.ForwardRefExoticComponent<Omit<TabListProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
-declare const Tab: ({ asChild, label, value, startIcon }: TabProps) => react_jsx_runtime.JSX.Element;
-declare const TabPanel: react.ForwardRefExoticComponent<Omit<TabPanelProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
-
 type TextElement = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li';
 type TextProps<As extends TextElement = TextElement> = UniversalTextProps & {
     as?: As;
@@ -490,26 +238,7 @@ type TextProps<As extends TextElement = TextElement> = UniversalTextProps & {
  */
 declare const Text: react.ForwardRefExoticComponent<Omit<TextProps<TextElement>, "ref"> & react.RefAttributes<HTMLParagraphElement>>;
 
-type NativeTextInputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'height' | 'size' | 'width' | 'color'>;
-interface TextInputProps extends NativeTextInputProps, UniversalTextInputProps {
-}
-declare function TextInput({ className, disabled, backgroundColor, borderColor, borderWidth, borderRadius, color, placeholderColor, spacingVertical, spacingHorizontal, fontSize: textVariant, ...props }: TextInputProps): react_jsx_runtime.JSX.Element;
-
-interface TextInputGroupProps extends TextInputProps {
-    label?: string;
-}
-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;
-
-type VStackProps = UniversalStackProps & DivProps$1;
+type VStackProps = UniversalStackProps & DivProps;
 /**
  * @example
   The VStack is essentially the same component as [Box](/components/box) where it uses [flexbox](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox) but it lays out content in a column. VStack also allows for gaps between children via the `gap` prop.
@@ -566,7 +295,7 @@ type VStackProps = UniversalStackProps & DivProps$1;
   ```
 
  */
-declare const VStack: react.ForwardRefExoticComponent<UniversalStackProps & DivProps$1 & react.RefAttributes<HTMLDivElement>>;
+declare const VStack: react.ForwardRefExoticComponent<UniversalStackProps & DivProps & react.RefAttributes<HTMLDivElement>>;
 
 declare const cx: CX<string>;
 declare const cva: CVA<string>;
@@ -662,4 +391,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, 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 };
+export { HStack, type HStackProps, Icon, type IconProps, Image, type ImageProps, Text, type TextProps, UniversalIconProps, UniversalImageProps, UniversalStackProps, UniversalTextProps, VStack, type VStackProps, cva, cx, getStyles };