@bubo-squared/ui-framework 0.2.13 → 0.2.14

package/dist/index.d.cts

@@ -266,36 +266,44 @@ interface TagProps extends VariantProps<typeof tagVariants> {
 declare const Tag: React$1.ForwardRefExoticComponent<TagProps & React$1.RefAttributes<HTMLDivElement>>;
 
 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 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 +331,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;
@@ -341,6 +354,11 @@ interface TextInputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputEleme
      * 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;
@@ -350,7 +368,7 @@ interface TextInputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputEleme
 }
 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 +378,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 +399,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 +416,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 +433,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 +481,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 +507,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 +561,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 +624,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 { Avatar, Badge, BadgeDigit, BadgeDot, BadgeStatus, Breadcrumbs, Button, ButtonGroup, Checkbox, Divider, Field, IconButton, IconButtonGroup, LinkButton, Logo, LogoIcon, MessageButton, PasswordInput, PhoneInput, Popover, Progress, RadioGroup, SearchInput, Select, Slider, StatusAvatar, Tag, TextArea, TextInput, Toggle, Tooltip, TooltipProvider, Typography, WebsiteInput, cn };

package/dist/index.d.ts

@@ -266,36 +266,44 @@ interface TagProps extends VariantProps<typeof tagVariants> {
 declare const Tag: React$1.ForwardRefExoticComponent<TagProps & React$1.RefAttributes<HTMLDivElement>>;
 
 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 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 +331,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;
@@ -341,6 +354,11 @@ interface TextInputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputEleme
      * 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;
@@ -350,7 +368,7 @@ interface TextInputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputEleme
 }
 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 +378,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 +399,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 +416,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 +433,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 +481,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 +507,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 +561,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 +624,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 { Avatar, Badge, BadgeDigit, BadgeDot, BadgeStatus, Breadcrumbs, Button, ButtonGroup, Checkbox, Divider, Field, IconButton, IconButtonGroup, LinkButton, Logo, LogoIcon, MessageButton, PasswordInput, PhoneInput, Popover, Progress, RadioGroup, SearchInput, Select, Slider, StatusAvatar, Tag, TextArea, TextInput, Toggle, Tooltip, TooltipProvider, Typography, WebsiteInput, cn };