npm - @boostdev/design-system-components - Versions diffs - 0.1.18 → 1.0.0 - Mend

@boostdev/design-system-components 0.1.18 → 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (137) hide show

package/dist/index.d.cts CHANGED Viewed

@@ -220,7 +220,7 @@ declare function Typography({ variant, component, children, className }: Typogra
 interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement | HTMLAnchorElement> {
     href?: string;
-    variant?: 'primary' | 'secondary';
+    variant?: 'default' | 'ghost';
     type?: 'button' | 'submit' | 'reset';
     size?: 'small' | 'medium' | 'large';
     iconStart?: ReactNode;
@@ -269,9 +269,9 @@ interface DrawerProps {
     children: ReactNode;
     side?: 'left' | 'right';
     className?: string;
-    arialLabel?: string;
+    ariaLabel?: string;
 }
-declare function Drawer({ isOpen, onClose, title, children, side, arialLabel, className, }: Readonly<DrawerProps>): react_jsx_runtime.JSX.Element;
+declare function Drawer({ isOpen, onClose, title, children, side, ariaLabel, className, }: Readonly<DrawerProps>): react_jsx_runtime.JSX.Element;
 interface DropdownMenuItem {
     id: string;
@@ -294,8 +294,9 @@ interface PopoverProps {
     content: ReactNode;
     placement?: 'top' | 'bottom' | 'left' | 'right';
     className?: string;
+    'aria-label'?: string;
 }
-declare function Popover({ children, content, placement, className, }: Readonly<PopoverProps>): react_jsx_runtime.JSX.Element;
+declare function Popover({ children, content, placement, className, 'aria-label': ariaLabel, }: Readonly<PopoverProps>): react_jsx_runtime.JSX.Element;
 interface RatingProps {
     value: number;
@@ -314,7 +315,7 @@ declare function ToastProvider({ children }: {
 declare function useToast(): ToastContextType;
 interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
-    label: string;
+    label: ReactNode;
     name: string;
     error?: string;
     hint?: string;
@@ -322,6 +323,17 @@ interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'typ
 }
 declare function Checkbox({ label, name, error, hint, className, ...props }: CheckboxProps): react_jsx_runtime.JSX.Element;
+interface CheckboxGroupProps {
+    legend: string;
+    children: ReactNode;
+    error?: string;
+    hint?: string;
+    required?: boolean;
+    disabled?: boolean;
+    className?: string;
+}
+declare function CheckboxGroup({ legend, children, error, hint, required, disabled, className, }: Readonly<CheckboxGroupProps>): react_jsx_runtime.JSX.Element;
 interface ComboboxOption {
     value: string;
     label: string;
@@ -347,12 +359,13 @@ interface FileInputProps {
     accept?: string;
     multiple?: boolean;
     disabled?: boolean;
+    required?: boolean;
     error?: string;
     hint?: string;
     onChange?: (files: FileList | null) => void;
     className?: string;
 }
-declare function FileInput({ label, name, accept, multiple, disabled, error, hint, onChange, className, }: Readonly<FileInputProps>): react_jsx_runtime.JSX.Element;
+declare function FileInput({ label, name, accept, multiple, disabled, required, error, hint, onChange, className, }: Readonly<FileInputProps>): react_jsx_runtime.JSX.Element;
 interface FormInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
     label: ReactNode;
@@ -363,7 +376,7 @@ interface FormInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'ty
     hint?: string;
     className?: string;
 }
-declare function FormInput({ label, name, ariaLabel, error, hint, className, ...props }: FormInputProps): react_jsx_runtime.JSX.Element;
+declare function FormInput({ label, name, ariaLabel, error, hint, className, required, ...props }: FormInputProps): react_jsx_runtime.JSX.Element;
 interface NumberInputProps {
     label: string;
@@ -382,7 +395,7 @@ interface NumberInputProps {
 declare function NumberInput({ label, name, value, defaultValue, min, max, step, disabled, error, hint, onChange, className, }: Readonly<NumberInputProps>): react_jsx_runtime.JSX.Element;
 interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
-    label: string;
+    label: ReactNode;
     name: string;
     description?: string;
     error?: string;
@@ -391,6 +404,17 @@ interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'>
 }
 declare function Radio({ label, name, description, error, hint, className, ...props }: RadioProps): react_jsx_runtime.JSX.Element;
+interface RadioGroupProps {
+    legend: string;
+    children: ReactNode;
+    error?: string;
+    hint?: string;
+    required?: boolean;
+    disabled?: boolean;
+    className?: string;
+}
+declare function RadioGroup({ legend, children, error, hint, required, disabled, className, }: Readonly<RadioGroupProps>): react_jsx_runtime.JSX.Element;
 interface SegmentedControlOption {
     value: string;
     label: ReactNode;
@@ -407,8 +431,9 @@ interface SegmentedControlProps extends Omit<InputHTMLAttributes<HTMLInputElemen
     disabled?: boolean;
     size?: 'small' | 'medium' | 'large';
     className?: string;
+    'aria-label'?: string;
 }
-declare function SegmentedControl({ name, options, value, defaultValue, onChange, disabled, size, className, ...rest }: Readonly<SegmentedControlProps>): react_jsx_runtime.JSX.Element;
+declare function SegmentedControl({ name, options, value, defaultValue, onChange, disabled, size, className, 'aria-label': ariaLabel, ...rest }: Readonly<SegmentedControlProps>): react_jsx_runtime.JSX.Element;
 interface SelectOption {
     value: string;
@@ -424,7 +449,7 @@ interface SelectProps extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'chi
     hint?: string;
     className?: string;
 }
-declare function Select({ label, name, options, placeholder, error, hint, className, ...props }: Readonly<SelectProps>): react_jsx_runtime.JSX.Element;
+declare function Select({ label, name, options, placeholder, error, hint, className, required, ...props }: Readonly<SelectProps>): react_jsx_runtime.JSX.Element;
 interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
     label: string;
@@ -456,18 +481,19 @@ interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
     hint?: string;
     className?: string;
 }
-declare function Textarea({ label, name, error, hint, className, ...props }: Readonly<TextareaProps>): react_jsx_runtime.JSX.Element;
+declare function Textarea({ label, name, error, hint, className, required, ...props }: Readonly<TextareaProps>): react_jsx_runtime.JSX.Element;
 interface ButtonGroupProps {
     children: ReactNode;
     className?: string;
     variant?: 'flow' | 'card' | 'modal' | 'content';
+    'aria-label'?: string;
 }
-declare function ButtonGroup({ children, className, variant }: ButtonGroupProps): react_jsx_runtime.JSX.Element;
+declare function ButtonGroup({ children, className, variant, 'aria-label': ariaLabel }: ButtonGroupProps): react_jsx_runtime.JSX.Element;
 interface CardProps {
     children: ReactNode;
-    className?: string;
+    className?: string | undefined;
     variant?: 'default' | 'elevated' | 'outlined';
     padding?: 'none' | 'small' | 'medium' | 'large';
     textAlign?: 'start' | 'center' | 'end';
@@ -488,10 +514,11 @@ type SectionHeaderProps = {
 };
 declare function SectionHeader({ title, subtitle, className, alignment, size, titleAs }: Readonly<SectionHeaderProps>): react_jsx_runtime.JSX.Element;
-interface Props {
+interface IconWrapperProps {
     children: ReactNode;
     className?: string;
+    'aria-hidden'?: boolean | 'true' | 'false';
 }
-declare function IconWrapper({ children, className }: Props): react_jsx_runtime.JSX.Element;
+declare function IconWrapper({ children, className, 'aria-hidden': ariaHidden }: IconWrapperProps): react_jsx_runtime.JSX.Element;
-export { Accordion, type AccordionItem, Alert, Avatar, Badge, Breadcrumb, type BreadcrumbItem, Button, ButtonGroup, Calendar, Card, Carousel, Checkbox, Collapsible, type CollapsibleProps, Combobox, type ComboboxOption, Command, type CommandItem, type DescriptionItem, DescriptionList, Dialog, Drawer, DropdownMenu, type DropdownMenuItem, FileInput, FormInput, IconWrapper, Link, Loading, NotificationBanner, NumberInput, Pagination, Popover, Progress, ProgressCircle, Radio, Rating, SectionHeader, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, Select, type SelectOption, Separator, Skeleton, SkipLink, Slider, Switch, type TabItem, Table, type TableColumn, Tabs, Textarea, ToastProvider, Tooltip, Typography, useToast };
+export { Accordion, type AccordionItem, Alert, Avatar, Badge, Breadcrumb, type BreadcrumbItem, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, Calendar, Card, Carousel, Checkbox, CheckboxGroup, type CheckboxGroupProps, Collapsible, type CollapsibleProps, Combobox, type ComboboxOption, Command, type CommandItem, type DescriptionItem, DescriptionList, Dialog, Drawer, DropdownMenu, type DropdownMenuItem, FileInput, FormInput, IconWrapper, type IconWrapperProps, Link, Loading, NotificationBanner, NumberInput, Pagination, Popover, Progress, ProgressCircle, Radio, RadioGroup, type RadioGroupProps, Rating, SectionHeader, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, Select, type SelectOption, Separator, Skeleton, SkipLink, Slider, Switch, type TabItem, Table, type TableColumn, Tabs, Textarea, ToastProvider, Tooltip, Typography, useToast };

package/dist/index.d.ts CHANGED Viewed

@@ -220,7 +220,7 @@ declare function Typography({ variant, component, children, className }: Typogra
 interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement | HTMLAnchorElement> {
     href?: string;
-    variant?: 'primary' | 'secondary';
+    variant?: 'default' | 'ghost';
     type?: 'button' | 'submit' | 'reset';
     size?: 'small' | 'medium' | 'large';
     iconStart?: ReactNode;
@@ -269,9 +269,9 @@ interface DrawerProps {
     children: ReactNode;
     side?: 'left' | 'right';
     className?: string;
-    arialLabel?: string;
+    ariaLabel?: string;
 }
-declare function Drawer({ isOpen, onClose, title, children, side, arialLabel, className, }: Readonly<DrawerProps>): react_jsx_runtime.JSX.Element;
+declare function Drawer({ isOpen, onClose, title, children, side, ariaLabel, className, }: Readonly<DrawerProps>): react_jsx_runtime.JSX.Element;
 interface DropdownMenuItem {
     id: string;
@@ -294,8 +294,9 @@ interface PopoverProps {
     content: ReactNode;
     placement?: 'top' | 'bottom' | 'left' | 'right';
     className?: string;
+    'aria-label'?: string;
 }
-declare function Popover({ children, content, placement, className, }: Readonly<PopoverProps>): react_jsx_runtime.JSX.Element;
+declare function Popover({ children, content, placement, className, 'aria-label': ariaLabel, }: Readonly<PopoverProps>): react_jsx_runtime.JSX.Element;
 interface RatingProps {
     value: number;
@@ -314,7 +315,7 @@ declare function ToastProvider({ children }: {
 declare function useToast(): ToastContextType;
 interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
-    label: string;
+    label: ReactNode;
     name: string;
     error?: string;
     hint?: string;
@@ -322,6 +323,17 @@ interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'typ
 }
 declare function Checkbox({ label, name, error, hint, className, ...props }: CheckboxProps): react_jsx_runtime.JSX.Element;
+interface CheckboxGroupProps {
+    legend: string;
+    children: ReactNode;
+    error?: string;
+    hint?: string;
+    required?: boolean;
+    disabled?: boolean;
+    className?: string;
+}
+declare function CheckboxGroup({ legend, children, error, hint, required, disabled, className, }: Readonly<CheckboxGroupProps>): react_jsx_runtime.JSX.Element;
 interface ComboboxOption {
     value: string;
     label: string;
@@ -347,12 +359,13 @@ interface FileInputProps {
     accept?: string;
     multiple?: boolean;
     disabled?: boolean;
+    required?: boolean;
     error?: string;
     hint?: string;
     onChange?: (files: FileList | null) => void;
     className?: string;
 }
-declare function FileInput({ label, name, accept, multiple, disabled, error, hint, onChange, className, }: Readonly<FileInputProps>): react_jsx_runtime.JSX.Element;
+declare function FileInput({ label, name, accept, multiple, disabled, required, error, hint, onChange, className, }: Readonly<FileInputProps>): react_jsx_runtime.JSX.Element;
 interface FormInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
     label: ReactNode;
@@ -363,7 +376,7 @@ interface FormInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'ty
     hint?: string;
     className?: string;
 }
-declare function FormInput({ label, name, ariaLabel, error, hint, className, ...props }: FormInputProps): react_jsx_runtime.JSX.Element;
+declare function FormInput({ label, name, ariaLabel, error, hint, className, required, ...props }: FormInputProps): react_jsx_runtime.JSX.Element;
 interface NumberInputProps {
     label: string;
@@ -382,7 +395,7 @@ interface NumberInputProps {
 declare function NumberInput({ label, name, value, defaultValue, min, max, step, disabled, error, hint, onChange, className, }: Readonly<NumberInputProps>): react_jsx_runtime.JSX.Element;
 interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
-    label: string;
+    label: ReactNode;
     name: string;
     description?: string;
     error?: string;
@@ -391,6 +404,17 @@ interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'>
 }
 declare function Radio({ label, name, description, error, hint, className, ...props }: RadioProps): react_jsx_runtime.JSX.Element;
+interface RadioGroupProps {
+    legend: string;
+    children: ReactNode;
+    error?: string;
+    hint?: string;
+    required?: boolean;
+    disabled?: boolean;
+    className?: string;
+}
+declare function RadioGroup({ legend, children, error, hint, required, disabled, className, }: Readonly<RadioGroupProps>): react_jsx_runtime.JSX.Element;
 interface SegmentedControlOption {
     value: string;
     label: ReactNode;
@@ -407,8 +431,9 @@ interface SegmentedControlProps extends Omit<InputHTMLAttributes<HTMLInputElemen
     disabled?: boolean;
     size?: 'small' | 'medium' | 'large';
     className?: string;
+    'aria-label'?: string;
 }
-declare function SegmentedControl({ name, options, value, defaultValue, onChange, disabled, size, className, ...rest }: Readonly<SegmentedControlProps>): react_jsx_runtime.JSX.Element;
+declare function SegmentedControl({ name, options, value, defaultValue, onChange, disabled, size, className, 'aria-label': ariaLabel, ...rest }: Readonly<SegmentedControlProps>): react_jsx_runtime.JSX.Element;
 interface SelectOption {
     value: string;
@@ -424,7 +449,7 @@ interface SelectProps extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'chi
     hint?: string;
     className?: string;
 }
-declare function Select({ label, name, options, placeholder, error, hint, className, ...props }: Readonly<SelectProps>): react_jsx_runtime.JSX.Element;
+declare function Select({ label, name, options, placeholder, error, hint, className, required, ...props }: Readonly<SelectProps>): react_jsx_runtime.JSX.Element;
 interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
     label: string;
@@ -456,18 +481,19 @@ interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
     hint?: string;
     className?: string;
 }
-declare function Textarea({ label, name, error, hint, className, ...props }: Readonly<TextareaProps>): react_jsx_runtime.JSX.Element;
+declare function Textarea({ label, name, error, hint, className, required, ...props }: Readonly<TextareaProps>): react_jsx_runtime.JSX.Element;
 interface ButtonGroupProps {
     children: ReactNode;
     className?: string;
     variant?: 'flow' | 'card' | 'modal' | 'content';
+    'aria-label'?: string;
 }
-declare function ButtonGroup({ children, className, variant }: ButtonGroupProps): react_jsx_runtime.JSX.Element;
+declare function ButtonGroup({ children, className, variant, 'aria-label': ariaLabel }: ButtonGroupProps): react_jsx_runtime.JSX.Element;
 interface CardProps {
     children: ReactNode;
-    className?: string;
+    className?: string | undefined;
     variant?: 'default' | 'elevated' | 'outlined';
     padding?: 'none' | 'small' | 'medium' | 'large';
     textAlign?: 'start' | 'center' | 'end';
@@ -488,10 +514,11 @@ type SectionHeaderProps = {
 };
 declare function SectionHeader({ title, subtitle, className, alignment, size, titleAs }: Readonly<SectionHeaderProps>): react_jsx_runtime.JSX.Element;
-interface Props {
+interface IconWrapperProps {
     children: ReactNode;
     className?: string;
+    'aria-hidden'?: boolean | 'true' | 'false';
 }
-declare function IconWrapper({ children, className }: Props): react_jsx_runtime.JSX.Element;
+declare function IconWrapper({ children, className, 'aria-hidden': ariaHidden }: IconWrapperProps): react_jsx_runtime.JSX.Element;
-export { Accordion, type AccordionItem, Alert, Avatar, Badge, Breadcrumb, type BreadcrumbItem, Button, ButtonGroup, Calendar, Card, Carousel, Checkbox, Collapsible, type CollapsibleProps, Combobox, type ComboboxOption, Command, type CommandItem, type DescriptionItem, DescriptionList, Dialog, Drawer, DropdownMenu, type DropdownMenuItem, FileInput, FormInput, IconWrapper, Link, Loading, NotificationBanner, NumberInput, Pagination, Popover, Progress, ProgressCircle, Radio, Rating, SectionHeader, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, Select, type SelectOption, Separator, Skeleton, SkipLink, Slider, Switch, type TabItem, Table, type TableColumn, Tabs, Textarea, ToastProvider, Tooltip, Typography, useToast };
+export { Accordion, type AccordionItem, Alert, Avatar, Badge, Breadcrumb, type BreadcrumbItem, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, Calendar, Card, Carousel, Checkbox, CheckboxGroup, type CheckboxGroupProps, Collapsible, type CollapsibleProps, Combobox, type ComboboxOption, Command, type CommandItem, type DescriptionItem, DescriptionList, Dialog, Drawer, DropdownMenu, type DropdownMenuItem, FileInput, FormInput, IconWrapper, type IconWrapperProps, Link, Loading, NotificationBanner, NumberInput, Pagination, Popover, Progress, ProgressCircle, Radio, RadioGroup, type RadioGroupProps, Rating, SectionHeader, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, Select, type SelectOption, Separator, Skeleton, SkipLink, Slider, Switch, type TabItem, Table, type TableColumn, Tabs, Textarea, ToastProvider, Tooltip, Typography, useToast };