@bubble-design-system/ui 0.2.0

package/dist/index.d.ts

@@ -0,0 +1,355 @@
+import { ClassValue } from 'clsx';
+import * as react from 'react';
+import { ComponentPropsWithoutRef, ReactNode, HTMLAttributes, TextareaHTMLAttributes } from 'react';
+import { Button as Button$1 } from '@base-ui/react/button';
+import { Input as Input$1 } from '@base-ui/react/input';
+import { Checkbox as Checkbox$1 } from '@base-ui/react/checkbox';
+import { Radio as Radio$1 } from '@base-ui/react/radio';
+import { RadioGroup as RadioGroup$1 } from '@base-ui/react/radio-group';
+import { Switch as Switch$1 } from '@base-ui/react/switch';
+import { Select as Select$1 } from '@base-ui/react/select';
+import { Avatar as Avatar$1 } from '@base-ui/react/avatar';
+import { Separator } from '@base-ui/react/separator';
+import * as _base_ui_react from '@base-ui/react';
+import { Dialog } from '@base-ui/react/dialog';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Toast as Toast$1 } from '@base-ui/react/toast';
+import { Tooltip as Tooltip$1 } from '@base-ui/react/tooltip';
+import { Tabs as Tabs$1 } from '@base-ui/react/tabs';
+import { Menu } from '@base-ui/react/menu';
+import { Toggle } from '@base-ui/react/toggle';
+import { ToggleGroup } from '@base-ui/react/toggle-group';
+
+/**
+ * Conditionally joins CSS class names.
+ *
+ * Example:
+ *   cn("pds-btn", "pds-btn--primary", isActive && "pds-btn--active", className)
+ */
+declare function cn(...inputs: ClassValue[]): string;
+
+type ButtonVariant = "primary" | "secondary" | "destructive" | "ghost";
+type ButtonSize = "sm" | "md" | "lg";
+type BaseButtonProps = ComponentPropsWithoutRef<typeof Button$1>;
+interface ButtonProps extends Omit<BaseButtonProps, "className"> {
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    className?: string;
+}
+declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLElement>>;
+
+type InputSize = "sm" | "md" | "lg";
+type BaseInputProps = ComponentPropsWithoutRef<typeof Input$1>;
+interface InputProps extends Omit<BaseInputProps, "className" | "size"> {
+    size?: InputSize;
+    invalid?: boolean;
+    className?: string;
+}
+declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
+
+type CheckboxSize = "sm" | "md" | "lg";
+type BaseCheckboxRootProps = ComponentPropsWithoutRef<typeof Checkbox$1.Root>;
+interface CheckboxProps extends Omit<BaseCheckboxRootProps, "className" | "render"> {
+    size?: CheckboxSize;
+    className?: string;
+}
+declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.RefAttributes<HTMLButtonElement>>;
+
+type RadioSize = "sm" | "md" | "lg";
+type BaseRadioRootProps = ComponentPropsWithoutRef<typeof Radio$1.Root>;
+type BaseRadioGroupProps = ComponentPropsWithoutRef<typeof RadioGroup$1>;
+interface RadioProps extends Omit<BaseRadioRootProps, "className" | "render"> {
+    size?: RadioSize;
+    className?: string;
+}
+declare const Radio: react.ForwardRefExoticComponent<RadioProps & react.RefAttributes<HTMLButtonElement>>;
+interface RadioGroupProps extends Omit<BaseRadioGroupProps, "className"> {
+    className?: string;
+}
+declare const RadioGroup: react.ForwardRefExoticComponent<RadioGroupProps & react.RefAttributes<HTMLDivElement>>;
+
+type SwitchSize = "sm" | "md" | "lg";
+type BaseSwitchRootProps = ComponentPropsWithoutRef<typeof Switch$1.Root>;
+interface SwitchProps extends Omit<BaseSwitchRootProps, "className" | "render"> {
+    size?: SwitchSize;
+    className?: string;
+}
+declare const Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<HTMLButtonElement>>;
+
+type SelectSize = "sm" | "md" | "lg";
+type BaseTriggerProps = ComponentPropsWithoutRef<typeof Select$1.Trigger>;
+type BasePopupProps$2 = ComponentPropsWithoutRef<typeof Select$1.Popup>;
+type BaseItemProps = ComponentPropsWithoutRef<typeof Select$1.Item>;
+type BaseValueProps = ComponentPropsWithoutRef<typeof Select$1.Value>;
+interface SelectTriggerProps extends Omit<BaseTriggerProps, "className" | "render"> {
+    size?: SelectSize;
+    className?: string;
+}
+interface SelectValueProps extends Omit<BaseValueProps, "className"> {
+    placeholder?: ReactNode;
+    className?: string;
+}
+interface SelectContentProps extends Omit<BasePopupProps$2, "className" | "render"> {
+    className?: string;
+    sideOffset?: number;
+}
+interface SelectItemProps extends Omit<BaseItemProps, "className" | "render"> {
+    className?: string;
+}
+declare const Select: {
+    Root: typeof Select$1.Root;
+    Trigger: react.ForwardRefExoticComponent<SelectTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+    Value: react.ForwardRefExoticComponent<SelectValueProps & react.RefAttributes<HTMLSpanElement>>;
+    Content: react.ForwardRefExoticComponent<SelectContentProps & react.RefAttributes<HTMLDivElement>>;
+    Item: react.ForwardRefExoticComponent<SelectItemProps & react.RefAttributes<HTMLDivElement>>;
+};
+
+type BadgeVariant = "neutral" | "brand" | "success" | "warning" | "danger";
+type BadgeSize = "sm" | "md" | "lg";
+interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
+    variant?: BadgeVariant;
+    size?: BadgeSize;
+}
+declare const Badge: react.ForwardRefExoticComponent<BadgeProps & react.RefAttributes<HTMLSpanElement>>;
+
+type AvatarSize = "sm" | "md" | "lg" | "xl";
+type BaseRootProps = ComponentPropsWithoutRef<typeof Avatar$1.Root>;
+type BaseImageProps = ComponentPropsWithoutRef<typeof Avatar$1.Image>;
+type BaseFallbackProps = ComponentPropsWithoutRef<typeof Avatar$1.Fallback>;
+interface AvatarProps extends Omit<BaseRootProps, "className" | "render"> {
+    size?: AvatarSize;
+    className?: string;
+}
+interface AvatarImageProps extends Omit<BaseImageProps, "className" | "render"> {
+    className?: string;
+}
+interface AvatarFallbackProps extends Omit<BaseFallbackProps, "className" | "render"> {
+    className?: string;
+}
+declare const Avatar: react.ForwardRefExoticComponent<AvatarProps & react.RefAttributes<HTMLSpanElement>> & {
+    Image: react.ForwardRefExoticComponent<AvatarImageProps & react.RefAttributes<HTMLImageElement>>;
+    Fallback: react.ForwardRefExoticComponent<AvatarFallbackProps & react.RefAttributes<HTMLSpanElement>>;
+};
+
+type BaseSeparatorProps = ComponentPropsWithoutRef<typeof Separator>;
+interface DividerProps extends Omit<BaseSeparatorProps, "className" | "render"> {
+    className?: string;
+}
+declare const Divider: react.ForwardRefExoticComponent<DividerProps & react.RefAttributes<HTMLDivElement>>;
+
+type BasePopupProps$1 = ComponentPropsWithoutRef<typeof Dialog.Popup>;
+type BaseTitleProps = ComponentPropsWithoutRef<typeof Dialog.Title>;
+type BaseDescProps = ComponentPropsWithoutRef<typeof Dialog.Description>;
+interface ModalContentProps extends Omit<BasePopupProps$1, "className" | "render"> {
+    className?: string;
+    backdropClassName?: string;
+}
+interface ModalTitleProps extends Omit<BaseTitleProps, "className" | "render"> {
+    className?: string;
+}
+interface ModalDescriptionProps extends Omit<BaseDescProps, "className" | "render"> {
+    className?: string;
+}
+declare const Modal: {
+    Root: typeof Dialog.Root;
+    Trigger: Dialog.Trigger;
+    Close: react.ForwardRefExoticComponent<Omit<_base_ui_react.AlertDialogCloseProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+    Content: react.ForwardRefExoticComponent<ModalContentProps & react.RefAttributes<HTMLDivElement>>;
+    Title: react.ForwardRefExoticComponent<ModalTitleProps & react.RefAttributes<HTMLHeadingElement>>;
+    Description: react.ForwardRefExoticComponent<ModalDescriptionProps & react.RefAttributes<HTMLParagraphElement>>;
+};
+
+declare const useToastManager: typeof Toast$1.useToastManager;
+type ProviderProps = ComponentPropsWithoutRef<typeof Toast$1.Provider>;
+declare const Toast: {
+    Provider: {
+        ({ children, ...props }: ProviderProps): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+    Viewport: react.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.ToastViewportProps, "ref"> & react.RefAttributes<HTMLDivElement>, "ref">, "className"> & {
+        className?: string;
+    } & react.RefAttributes<HTMLDivElement>>;
+    Toaster: {
+        (): react_jsx_runtime.JSX.Element;
+        displayName: string;
+    };
+};
+
+type BasePopupProps = ComponentPropsWithoutRef<typeof Tooltip$1.Popup>;
+interface TooltipContentProps extends Omit<BasePopupProps, "className" | "render"> {
+    className?: string;
+    sideOffset?: number;
+    side?: "top" | "bottom" | "left" | "right";
+    align?: "start" | "center" | "end";
+}
+declare const Tooltip: {
+    Provider: react.FC<_base_ui_react.TooltipProviderProps>;
+    Root: <Payload>(props: Tooltip$1.Root.Props<Payload>) => react_jsx_runtime.JSX.Element;
+    Trigger: Tooltip$1.Trigger;
+    Content: react.ForwardRefExoticComponent<TooltipContentProps & react.RefAttributes<HTMLDivElement>>;
+};
+
+type RootProps = ComponentPropsWithoutRef<typeof Tabs$1.Root>;
+type ListProps = ComponentPropsWithoutRef<typeof Tabs$1.List>;
+type TabProps = ComponentPropsWithoutRef<typeof Tabs$1.Tab>;
+type PanelProps = ComponentPropsWithoutRef<typeof Tabs$1.Panel>;
+interface TabsRootProps extends Omit<RootProps, "className" | "render"> {
+    className?: string;
+}
+interface TabsListProps extends Omit<ListProps, "className" | "render"> {
+    className?: string;
+}
+interface TabsTabProps extends Omit<TabProps, "className" | "render"> {
+    className?: string;
+}
+interface TabsPanelProps extends Omit<PanelProps, "className" | "render"> {
+    className?: string;
+}
+declare const Tabs: react.ForwardRefExoticComponent<TabsRootProps & react.RefAttributes<HTMLDivElement>> & {
+    List: react.ForwardRefExoticComponent<TabsListProps & react.RefAttributes<HTMLDivElement>>;
+    Tab: react.ForwardRefExoticComponent<TabsTabProps & react.RefAttributes<HTMLButtonElement>>;
+    Panel: react.ForwardRefExoticComponent<TabsPanelProps & react.RefAttributes<HTMLDivElement>>;
+};
+
+type AlertVariant = "info" | "success" | "warning" | "danger";
+interface AlertProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    variant?: AlertVariant;
+    icon?: ReactNode | false;
+    title?: ReactNode;
+}
+declare const Alert: react.ForwardRefExoticComponent<AlertProps & react.RefAttributes<HTMLDivElement>>;
+
+type PopupProps = ComponentPropsWithoutRef<typeof Menu.Popup>;
+type ItemProps = ComponentPropsWithoutRef<typeof Menu.Item>;
+type CheckboxItemProps = ComponentPropsWithoutRef<typeof Menu.CheckboxItem>;
+type RadioItemProps = ComponentPropsWithoutRef<typeof Menu.RadioItem>;
+type GroupLabelProps = ComponentPropsWithoutRef<typeof Menu.GroupLabel>;
+type SeparatorProps = ComponentPropsWithoutRef<typeof Menu.Separator>;
+interface DropdownMenuContentProps extends Omit<PopupProps, "className" | "render"> {
+    className?: string;
+    sideOffset?: number;
+    align?: "start" | "center" | "end";
+}
+interface DropdownMenuItemProps extends Omit<ItemProps, "className" | "render"> {
+    className?: string;
+}
+interface DropdownMenuCheckboxItemProps extends Omit<CheckboxItemProps, "className" | "render"> {
+    className?: string;
+}
+interface DropdownMenuRadioItemProps extends Omit<RadioItemProps, "className" | "render"> {
+    className?: string;
+}
+interface DropdownMenuLabelProps extends Omit<GroupLabelProps, "className" | "render"> {
+    className?: string;
+}
+interface DropdownMenuSeparatorProps extends Omit<SeparatorProps, "className" | "render"> {
+    className?: string;
+}
+declare const DropdownMenu: {
+    Root: <Payload>(props: Menu.Root.Props<Payload>) => react_jsx_runtime.JSX.Element;
+    Trigger: Menu.Trigger;
+    Content: react.ForwardRefExoticComponent<DropdownMenuContentProps & react.RefAttributes<HTMLDivElement>>;
+    Item: react.ForwardRefExoticComponent<DropdownMenuItemProps & react.RefAttributes<HTMLDivElement>>;
+    CheckboxItem: react.ForwardRefExoticComponent<DropdownMenuCheckboxItemProps & react.RefAttributes<HTMLDivElement>>;
+    RadioGroup: react.NamedExoticComponent<Omit<_base_ui_react.ContextMenuRadioGroupProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
+    RadioItem: react.ForwardRefExoticComponent<DropdownMenuRadioItemProps & react.RefAttributes<HTMLDivElement>>;
+    Group: react.ForwardRefExoticComponent<Omit<_base_ui_react.ContextMenuGroupProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
+    Label: react.ForwardRefExoticComponent<DropdownMenuLabelProps & react.RefAttributes<HTMLDivElement>>;
+    Separator: react.ForwardRefExoticComponent<DropdownMenuSeparatorProps & react.RefAttributes<HTMLDivElement>>;
+};
+
+type SkeletonShape = "line" | "circle" | "block";
+interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {
+    shape?: SkeletonShape;
+}
+declare const Skeleton: react.ForwardRefExoticComponent<SkeletonProps & react.RefAttributes<HTMLDivElement>>;
+
+type CardVariant = "elevated" | "muted";
+interface CardProps extends HTMLAttributes<HTMLDivElement> {
+    variant?: CardVariant;
+}
+interface CardHeaderProps extends HTMLAttributes<HTMLDivElement> {
+}
+interface CardTitleProps extends HTMLAttributes<HTMLHeadingElement> {
+}
+interface CardDescriptionProps extends HTMLAttributes<HTMLParagraphElement> {
+}
+interface CardActionProps extends HTMLAttributes<HTMLDivElement> {
+}
+interface CardBodyProps extends HTMLAttributes<HTMLDivElement> {
+}
+interface CardFooterProps extends HTMLAttributes<HTMLDivElement> {
+}
+declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>> & {
+    Header: react.ForwardRefExoticComponent<CardHeaderProps & react.RefAttributes<HTMLDivElement>>;
+    Title: react.ForwardRefExoticComponent<CardTitleProps & react.RefAttributes<HTMLHeadingElement>>;
+    Description: react.ForwardRefExoticComponent<CardDescriptionProps & react.RefAttributes<HTMLParagraphElement>>;
+    Action: react.ForwardRefExoticComponent<CardActionProps & react.RefAttributes<HTMLDivElement>>;
+    Body: react.ForwardRefExoticComponent<CardBodyProps & react.RefAttributes<HTMLDivElement>>;
+    Footer: react.ForwardRefExoticComponent<CardFooterProps & react.RefAttributes<HTMLDivElement>>;
+};
+
+type TextareaSize = "sm" | "md" | "lg";
+interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "size"> {
+    size?: TextareaSize;
+    invalid?: boolean;
+}
+declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
+
+type StatusPillIntent = "neutral" | "success" | "warning" | "danger" | "info";
+interface StatusPillProps extends HTMLAttributes<HTMLSpanElement> {
+    intent?: StatusPillIntent;
+}
+interface StatusPillIndicatorProps extends HTMLAttributes<HTMLSpanElement> {
+}
+interface StatusPillLabelProps extends HTMLAttributes<HTMLSpanElement> {
+}
+declare const StatusPill: react.ForwardRefExoticComponent<StatusPillProps & react.RefAttributes<HTMLSpanElement>> & {
+    Indicator: react.ForwardRefExoticComponent<StatusPillIndicatorProps & react.RefAttributes<HTMLSpanElement>>;
+    Label: react.ForwardRefExoticComponent<StatusPillLabelProps & react.RefAttributes<HTMLSpanElement>>;
+};
+
+type SegmentedSize = "sm" | "md" | "lg";
+type ToggleGroupProps = ComponentPropsWithoutRef<typeof ToggleGroup>;
+interface SegmentedProps extends Omit<ToggleGroupProps, "className" | "value" | "defaultValue" | "onValueChange" | "multiple"> {
+    /** Selected item value. */
+    value?: string;
+    /** Uncontrolled initial selected item. */
+    defaultValue?: string;
+    /** Fired with the newly selected value. */
+    onValueChange?: (value: string) => void;
+    /** Controls item heights — sm 24px / md 28px / lg 32px. */
+    size?: SegmentedSize;
+    className?: string;
+    children?: ReactNode;
+}
+type ToggleItemProps = ComponentPropsWithoutRef<typeof Toggle>;
+interface SegmentedItemProps extends Omit<ToggleItemProps, "className" | "value"> {
+    value: string;
+    className?: string;
+}
+declare const Segmented: react.ForwardRefExoticComponent<SegmentedProps & react.RefAttributes<HTMLDivElement>> & {
+    Item: react.ForwardRefExoticComponent<SegmentedItemProps & react.RefAttributes<HTMLButtonElement>>;
+};
+
+type ContainerSize = "sm" | "md" | "lg" | "xl" | "prose" | "fluid";
+interface ContainerProps extends HTMLAttributes<HTMLDivElement> {
+    size?: ContainerSize;
+}
+declare const Container: react.ForwardRefExoticComponent<ContainerProps & react.RefAttributes<HTMLDivElement>>;
+type GridGutter = "default" | "tight" | "flush";
+interface GridRootProps extends HTMLAttributes<HTMLDivElement> {
+    gutter?: GridGutter;
+}
+type Span = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | "full";
+interface GridColProps extends HTMLAttributes<HTMLDivElement> {
+    span?: Span;
+    smSpan?: Span;
+    mdSpan?: Span;
+    lgSpan?: Span;
+}
+declare const Grid: react.ForwardRefExoticComponent<GridRootProps & react.RefAttributes<HTMLDivElement>> & {
+    Col: react.ForwardRefExoticComponent<GridColProps & react.RefAttributes<HTMLDivElement>>;
+};
+
+export { Alert, type AlertProps, Avatar, type AvatarFallbackProps, type AvatarImageProps, type AvatarProps, Badge, type BadgeProps, Button, type ButtonProps, Card, type CardActionProps, type CardBodyProps, type CardDescriptionProps, type CardFooterProps, type CardHeaderProps, type CardProps, type CardTitleProps, Checkbox, type CheckboxProps, Container, type ContainerProps, Divider, type DividerProps, DropdownMenu, type DropdownMenuCheckboxItemProps, type DropdownMenuContentProps, type DropdownMenuItemProps, type DropdownMenuLabelProps, type DropdownMenuRadioItemProps, type DropdownMenuSeparatorProps, Grid, type GridColProps, type GridRootProps, Input, type InputProps, Modal, type ModalContentProps, type ModalDescriptionProps, type ModalTitleProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Segmented, type SegmentedItemProps, type SegmentedProps, Select, type SelectContentProps, type SelectItemProps, type SelectTriggerProps, type SelectValueProps, Skeleton, type SkeletonProps, StatusPill, type StatusPillIndicatorProps, type StatusPillLabelProps, type StatusPillProps, Switch, type SwitchProps, Tabs, type TabsListProps, type TabsPanelProps, type TabsRootProps, type TabsTabProps, Textarea, type TextareaProps, Toast, Tooltip, type TooltipContentProps, cn, useToastManager as useToast };