@bubo-squared/ui-framework 0.2.13 → 0.2.15

package/dist/index.d.ts

@@ -2,7 +2,9 @@ import * as class_variance_authority_types from 'class-variance-authority/types'
 import * as React$1 from 'react';
 import { FC } from 'react';
 import { VariantProps } from 'class-variance-authority';
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import * as RPNInput from 'react-phone-number-input';
 import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
@@ -71,6 +73,14 @@ type MessageButtonProps = Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>,
 };
 declare const MessageButton: React$1.FC<MessageButtonProps>;
 
+declare const Accordion: React$1.ForwardRefExoticComponent<Omit<Omit<AccordionPrimitive.AccordionSingleProps & React$1.RefAttributes<HTMLDivElement>, "ref">, "children" | "type" | "title" | "collapsible"> & {
+    title: React$1.ReactNode;
+    expandIcon?: React$1.ReactNode;
+    defaultOpen?: boolean;
+    children: React$1.ReactNode;
+    bordered?: boolean;
+} & React$1.RefAttributes<HTMLDivElement>>;
+
 type AvatarVariant = "initial" | "icon" | "image";
 declare const avatarVariants: (props?: ({
     size?: "20" | "24" | "32" | "40" | "48" | "56" | "64" | null | undefined;
@@ -265,37 +275,141 @@ interface TagProps extends VariantProps<typeof tagVariants> {
 }
 declare const Tag: React$1.ForwardRefExoticComponent<TagProps & React$1.RefAttributes<HTMLDivElement>>;
 
+type DropdownSize = "sm" | "md" | "lg" | "xl";
+
+declare function DropdownMenuPortal({ ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.Portal>): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuGroup({ ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.Group>): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuItem({ className, inset, size, variant, ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
+    inset?: boolean;
+    size?: DropdownSize;
+    variant?: "default" | "destructive";
+}): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuLabel({ className, inset, size, ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.Label> & {
+    inset?: boolean;
+    size?: DropdownSize;
+}): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuSeparator({ className, ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.Separator>): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuShortcut({ className, ...props }: React$1.ComponentProps<"span">): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuSub({ ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.Sub>): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuSubTrigger({ className, inset, size, children, ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {
+    inset?: boolean;
+    size?: DropdownSize;
+}): react_jsx_runtime.JSX.Element;
+declare function DropdownMenuSubContent({ className, size, ...props }: React$1.ComponentProps<typeof DropdownMenuPrimitive.SubContent> & {
+    size?: DropdownSize;
+}): react_jsx_runtime.JSX.Element;
+
+interface MenuProps {
+    trigger: React$1.ReactElement;
+    children: React$1.ReactNode;
+    size?: DropdownSize;
+    align?: DropdownMenuPrimitive.DropdownMenuContentProps["align"];
+    side?: DropdownMenuPrimitive.DropdownMenuContentProps["side"];
+    offset?: number;
+    className?: string;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    modal?: boolean;
+}
+declare const Menu: React$1.FC<MenuProps>;
+declare const MenuGroup: typeof DropdownMenuGroup;
+declare const MenuItem: typeof DropdownMenuItem;
+declare const MenuLabel: typeof DropdownMenuLabel;
+declare const MenuPortal: typeof DropdownMenuPortal;
+declare const MenuSeparator: typeof DropdownMenuSeparator;
+declare const MenuShortcut: typeof DropdownMenuShortcut;
+declare const MenuSub: typeof DropdownMenuSub;
+declare const MenuSubContent: typeof DropdownMenuSubContent;
+declare const MenuSubTrigger: typeof DropdownMenuSubTrigger;
+
 interface CheckboxProps extends React$1.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root> {
+    /** Only needed when the component is a part of a native form. */
+    name?: string;
     label?: string;
 }
 declare function Checkbox({ label, className, ...props }: CheckboxProps): react_jsx_runtime.JSX.Element;
 
-type DropdownStatus = "default" | "success" | "error";
-interface DropdownOption {
+type TextInputSize = "sm" | "md" | "lg" | "xl";
+type TextInputStatus = "default" | "success" | "error";
+interface TextInputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, "size" | "disabled"> {
+    label?: string;
+    hint?: string;
+    /**
+     * If true, the hint will not be rendered even if provided.
+     */
+    hideHint?: boolean;
+    /**
+     * Only needed when the component is a part of a native form.
+     * Provide this to include the value in native form submission / FormData.
+     */
+    name?: string;
+    placeholder?: string;
+    status?: TextInputStatus;
+    size?: TextInputSize;
+    disabled?: boolean;
+    leadingIcon?: React$1.ReactNode | null;
+    trailingIcon?: React$1.ReactNode | null;
+}
+declare const TextInput: React$1.FC<TextInputProps>;
+
+interface AutocompleteProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, "size" | "disabled" | "value" | "defaultValue" | "onChange"> {
+    label?: string;
+    hint?: string;
+    /** If true, the hint will not be rendered even if provided. */
+    hideHint?: boolean;
+    status?: TextInputStatus;
+    size?: TextInputSize;
+    disabled?: boolean;
+    leadingIcon?: React$1.ReactNode | null;
+    trailingIcon?: React$1.ReactNode | null;
+    /** Options to render (assumed already server-filtered). */
+    options: string[];
+    loading?: boolean;
+    loadingText?: React$1.ReactNode;
+    noOptionsText?: React$1.ReactNode;
+    /** Committed value (e.g. selected option). */
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    /** Current input text (used as query). */
+    inputValue?: string;
+    defaultInputValue?: string;
+    onInputChange?: (value: string) => void;
+}
+declare const Autocomplete: React$1.FC<AutocompleteProps>;
+
+type SelectStatus = "default" | "success" | "error";
+interface SelectOption {
     label: string;
     value: string;
 }
-declare const dropdownTriggerVariants: (props?: ({
+declare const selectTriggerVariants: (props?: ({
     size?: "sm" | "md" | "lg" | "xl" | null | undefined;
     status?: "success" | "error" | "default" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-interface DropdownProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "onChange">, VariantProps<typeof dropdownTriggerVariants> {
+interface SelectProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "onChange">, VariantProps<typeof selectTriggerVariants> {
     label?: string;
     hint?: string;
     /**
      * If true, the hint will not be rendered even if provided.
      */
     hideHint?: boolean;
+    /**
+     * Only needed when the component is a part of a native form.
+     * Provide this to include the value in native form submission / FormData.
+     */
+    name?: string;
     placeholder?: string;
-    status?: DropdownStatus;
-    options: DropdownOption[];
+    status?: SelectStatus;
+    options: SelectOption[];
     value?: string;
     defaultValue?: string;
+    required?: boolean;
     onChange?: (value: string) => void;
     /** Force the menu open (used mainly for docs/Storybook states). */
     showMenu?: boolean;
 }
-declare const Dropdown: React$1.FC<DropdownProps>;
+declare const Select: React$1.FC<SelectProps>;
 
 type FieldStatus = "default" | "success" | "error";
 interface FieldProps {
@@ -323,6 +437,11 @@ interface PasswordInputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputE
      * If true, the hint will not be rendered even if provided.
      */
     hideHint?: boolean;
+    /**
+     * Only needed when the component is a part of a native form.
+     * Provide this to include the value in native form submission / FormData.
+     */
+    name?: string;
     placeholder?: string;
     status?: PasswordInputStatus;
     size?: PasswordInputSize;
@@ -332,25 +451,7 @@ interface PasswordInputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputE
 }
 declare const PasswordInput: React$1.FC<PasswordInputProps>;
 
-type TextInputSize = "sm" | "md" | "lg" | "xl";
-type TextInputStatus = "default" | "success" | "error";
-interface TextInputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, "size" | "disabled"> {
-    label?: string;
-    hint?: string;
-    /**
-     * If true, the hint will not be rendered even if provided.
-     */
-    hideHint?: boolean;
-    placeholder?: string;
-    status?: TextInputStatus;
-    size?: TextInputSize;
-    disabled?: boolean;
-    leadingIcon?: React$1.ReactNode | null;
-    trailingIcon?: React$1.ReactNode | null;
-}
-declare const TextInput: React$1.FC<TextInputProps>;
-
-type PhoneInputProps = Omit<React$1.ComponentProps<"input">, "onChange" | "value" | "ref"> & Omit<RPNInput.Props<typeof RPNInput.default>, "onChange"> & {
+type PhoneInputProps = Omit<React$1.ComponentProps<"input">, "onChange" | "value" | "ref" | "size"> & Omit<RPNInput.Props<typeof RPNInput.default>, "onChange"> & {
     onChange?: (value: RPNInput.Value) => void;
 } & {
     className?: string;
@@ -360,6 +461,11 @@ type PhoneInputProps = Omit<React$1.ComponentProps<"input">, "onChange" | "value
      * If true, the hint will not be rendered even if provided.
      */
     hideHint?: boolean;
+    /**
+     * Only needed when the component is a part of a native form.
+     * Provide this to include the value in native form submission / FormData.
+     */
+    name?: string;
     placeholder?: string;
     disabled?: boolean;
     status?: TextInputStatus;
@@ -376,6 +482,10 @@ interface RadioGroupOption {
 interface RadioGroupProps extends Omit<RadioGroupPrimitive.RadioGroupProps, "children" | "orientation" | "onValueChange"> {
     label?: string;
     hint?: string;
+    /** Only needed when the component is a part of a native form. */
+    name?: string;
+    /** Only needed when the component is a part of a native form. */
+    required?: boolean;
     /**
      * If true, the hint will not be rendered even if provided.
      */
@@ -389,6 +499,11 @@ declare const RadioGroup: React$1.FC<RadioGroupProps>;
 
 type SearchInputSize = "sm" | "md" | "lg" | "xl";
 interface SearchInputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, "size" | "disabled"> {
+    /**
+     * Only needed when the component is a part of a native form.
+     * Provide this to include the value in native form submission / FormData.
+     */
+    name?: string;
     placeholder?: string;
     leadingIcon?: React$1.ReactNode;
     showLeadingIcon?: boolean;
@@ -401,6 +516,13 @@ declare const SearchInput: React$1.FC<SearchInputProps>;
 type SliderDisplay = "flat" | "numeric" | "tooltip";
 type SliderTooltipPlacement = "top" | "bottom";
 type SliderBaseProps = {
+    /**
+     * Only needed when the component is a part of a native form.
+     * Provide this to include the value in native form submission / FormData.
+     *
+     * Note: range sliders submit two values under the same name.
+     */
+    name?: string;
     display?: SliderDisplay;
     tooltipPlacement?: SliderTooltipPlacement;
     /**
@@ -442,6 +564,11 @@ interface TextAreaProps extends Omit<React$1.TextareaHTMLAttributes<HTMLTextArea
      * If true, the hint will not be rendered even if provided.
      */
     hideHint?: boolean;
+    /**
+     * Only needed when the component is a part of a native form.
+     * Provide this to include the value in native form submission / FormData.
+     */
+    name?: string;
     status?: TextInputStatus;
     /**
      * Visual/behavioural variant.
@@ -463,6 +590,11 @@ interface TextAreaProps extends Omit<React$1.TextareaHTMLAttributes<HTMLTextArea
 declare const TextArea: React$1.FC<TextAreaProps>;
 
 interface ToggleProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, "type"> {
+    /**
+     * Only needed when the component is a part of a native form.
+     * Provide this to include the checked value in native form submission / FormData.
+     */
+    name?: string;
     label?: string;
 }
 declare const Toggle: React$1.FC<ToggleProps>;
@@ -512,19 +644,46 @@ interface PopoverProps {
 }
 declare const Popover: React$1.FC<PopoverProps>;
 
-interface BreadcrumbProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
-    variant?: "flat" | "colored";
-    asChild?: boolean;
-    /** Label text shown in the breadcrumb item. */
-    label?: string;
-    /** Whether to render the leading chevron icon. */
-    showIcon?: boolean;
-    /** Optional custom icon to use instead of the default chevron. */
-    icon?: React$1.ReactNode;
-    /** Whether to render the label text. */
-    showText?: boolean;
+type TooltipPlacement = "top" | "topLeft" | "topRight" | "bottom" | "bottomLeft" | "bottomRight" | "left" | "leftTop" | "leftBottom" | "right" | "rightTop" | "rightBottom";
+interface TooltipProps {
+    children: React$1.ReactNode;
+    strapline?: string;
+    title: string;
+    description?: string;
+    showArrow?: boolean;
+    className?: string;
+    placement?: TooltipPlacement;
+    offset?: number;
+    disableHoverableContent?: boolean;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}
+declare const Tooltip: React$1.FC<TooltipProps>;
+
+interface TooltipProviderProps {
+    children: React$1.ReactNode;
+    delayDuration?: number;
+    skipDelayDuration?: number;
+    disableHoverableContent?: boolean;
+}
+declare const TooltipProvider: React$1.FC<TooltipProviderProps>;
+
+declare function Breadcrumb({ ...props }: React$1.ComponentProps<"nav">): react_jsx_runtime.JSX.Element;
+
+interface BreadcrumbsProps extends React$1.ComponentProps<typeof Breadcrumb> {
+    separator?: React$1.ReactNode;
+    /**
+     * When true and there are >= 5 breadcrumb items, replaces all items except
+     * the first one and the last two with an ellipsis dropdown menu.
+     */
+    ellipsis?: boolean;
+    children: React$1.ReactNode;
+    separatorClassName?: string;
+    breadcrumbItemClassName?: string;
+    breadcrumbPageClassName?: string;
 }
-declare const Breadcrumb: React$1.ForwardRefExoticComponent<BreadcrumbProps & React$1.RefAttributes<HTMLButtonElement>>;
+declare const Breadcrumbs: React$1.ForwardRefExoticComponent<Omit<BreadcrumbsProps, "ref"> & React$1.RefAttributes<HTMLElement>>;
 
 interface LogoBaseProps {
     className?: string;
@@ -548,4 +707,4 @@ declare const Logo: FC<LogoProps>;
 
 declare function cn(...inputs: ClassValue[]): string;
 
-export { Avatar, Badge, BadgeDigit, BadgeDot, BadgeStatus, Breadcrumb, Button, ButtonGroup, Checkbox, Divider, Dropdown, Field, IconButton, IconButtonGroup, LinkButton, Logo, LogoIcon, MessageButton, PasswordInput, PhoneInput, Popover, Progress, RadioGroup, SearchInput, Slider, StatusAvatar, Tag, TextArea, TextInput, Toggle, Typography, WebsiteInput, cn };
+export { Accordion, Autocomplete, Avatar, Badge, BadgeDigit, BadgeDot, BadgeStatus, Breadcrumbs, Button, ButtonGroup, Checkbox, Divider, Field, IconButton, IconButtonGroup, LinkButton, Logo, LogoIcon, Menu, MenuGroup, MenuItem, MenuLabel, MenuPortal, MenuSeparator, MenuShortcut, MenuSub, MenuSubContent, MenuSubTrigger, MessageButton, PasswordInput, PhoneInput, Popover, Progress, RadioGroup, SearchInput, Select, Slider, StatusAvatar, Tag, TextArea, TextInput, Toggle, Tooltip, TooltipProvider, Typography, WebsiteInput, cn };