@boostdev/design-system-components 2.0.0 → 2.2.0

package/dist/index.d.cts

@@ -229,6 +229,8 @@ interface ButtonProps extends WithClassName, ButtonHTMLAttributes<HTMLButtonElem
     disabled?: boolean;
     /** Adds a pulsing animation for call-to-action emphasis. Respects `prefers-reduced-motion`. */
     hasPulse?: boolean;
+    /** When true, forces a 1:1 aspect ratio with equal `xs` padding on both axes. Pass the icon as `children`; composable with any `variant`. Requires `aria-label`. */
+    isIconOnly?: boolean;
     /** Click handler. Typed as `HTMLElement` because the root may be `<button>` or `<a>`. */
     onClick?: MouseEventHandler<HTMLElement>;
     /** Anchor target (only applied when rendered as `<a>`). */
@@ -240,7 +242,7 @@ interface ButtonProps extends WithClassName, ButtonHTMLAttributes<HTMLButtonElem
     /** ID(s) of element(s) that describe the button (e.g. a tooltip or helper text). */
     'aria-describedby'?: string;
 }
-declare function Button({ children, className, variant, type, iconStart, iconEnd, size, hasPulse, href, target, rel, disabled, onClick, ...rest }: Readonly<ButtonProps>): react_jsx_runtime.JSX.Element;
+declare function Button({ children, className, variant, type, iconStart, iconEnd, size, hasPulse, isIconOnly, href, target, rel, disabled, onClick, ...rest }: Readonly<ButtonProps>): react_jsx_runtime.JSX.Element;
 
 interface CommandItem {
     id: string;
@@ -481,6 +483,44 @@ type CardOwnProps = WithClassName & {
 type CardProps<C extends ElementType = 'div'> = CardOwnProps & Omit<ComponentPropsWithoutRef<C>, keyof CardOwnProps>;
 declare function Card<C extends ElementType = 'div'>({ children, className, variant, padding, textAlign, as, onClick, ...rest }: CardProps<C>): react_jsx_runtime.JSX.Element;
 
+type GridVariant = 'main' | 'page' | 'funnel' | 'custom';
+type GridOwnProps = WithClassName & {
+    variant?: GridVariant;
+    columns?: number;
+    isCentered?: boolean;
+    isMasonry?: boolean;
+    /**
+     * When true, any child `GridItem` without an explicit `columnSpan` resolves
+     * to `"auto"` — column span is derived from the intrinsic aspect ratio of
+     * the first `<img>`/`<video>` child. Items that set `columnSpan` explicitly
+     * are unaffected.
+     */
+    autoSpanMedia?: boolean;
+    as?: ElementType;
+};
+type GridProps<C extends ElementType = 'div'> = GridOwnProps & Omit<ComponentPropsWithoutRef<C>, keyof GridOwnProps>;
+declare function Grid<C extends ElementType = 'div'>({ children, className, variant, columns, isCentered, isMasonry, autoSpanMedia, as, style, ...rest }: GridProps<C>): react_jsx_runtime.JSX.Element;
+
+type GridItemSpanValue = 'full' | 'three-quarters' | 'two-thirds' | 'half' | 'one-third' | 'one-quarter' | 'auto' | number;
+declare const GridItemSpan: {
+    readonly full: "full";
+    readonly threeQuarters: "three-quarters";
+    readonly twoThirds: "two-thirds";
+    readonly half: "half";
+    readonly oneThird: "one-third";
+    readonly oneQuarter: "one-quarter";
+    readonly auto: "auto";
+};
+type GridItemOwnProps = WithClassName & {
+    columnSpan?: GridItemSpanValue;
+    rowSpan?: number;
+    startColumn?: number;
+    endColumn?: number;
+    as?: ElementType;
+};
+type GridItemProps<C extends ElementType = 'div'> = GridItemOwnProps & Omit<ComponentPropsWithoutRef<C>, keyof GridItemOwnProps>;
+declare function GridItem<C extends ElementType = 'div'>({ children, className, columnSpan, rowSpan, startColumn, endColumn, as, style, ...rest }: GridItemProps<C>): react_jsx_runtime.JSX.Element;
+
 type IntrinsicElement = keyof JSX.IntrinsicElements;
 type SectionHeaderProps = WithClassName & Omit<HTMLAttributes<HTMLDivElement>, 'title'> & {
     title: string;
@@ -496,4 +536,4 @@ interface IconWrapperProps extends WithClassName, HTMLAttributes<HTMLDivElement>
 }
 declare function IconWrapper({ children, className, ...rest }: IconWrapperProps): react_jsx_runtime.JSX.Element;
 
-export { Accordion, type AccordionItem, Alert, Avatar, Badge, Breadcrumb, type BreadcrumbItem, Button, ButtonContainer, type ButtonContainerProps, 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 SegmentedControlProps, Select, type SelectOption, Separator, Skeleton, SkipLink, Slider, Switch, type TabItem, Table, type TableColumn, Tabs, Textarea, ToastProvider, Tooltip, Typography, type WithClassName, useToast };
+export { Accordion, type AccordionItem, Alert, Avatar, Badge, Breadcrumb, type BreadcrumbItem, Button, ButtonContainer, type ButtonContainerProps, 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, Grid, GridItem, GridItemSpan, type GridItemSpanValue, type GridVariant, IconWrapper, type IconWrapperProps, Link, Loading, NotificationBanner, NumberInput, Pagination, Popover, Progress, ProgressCircle, Radio, RadioGroup, type RadioGroupProps, Rating, SectionHeader, SegmentedControl, type SegmentedControlProps, Select, type SelectOption, Separator, Skeleton, SkipLink, Slider, Switch, type TabItem, Table, type TableColumn, Tabs, Textarea, ToastProvider, Tooltip, Typography, type WithClassName, useToast };

package/dist/index.d.ts

@@ -229,6 +229,8 @@ interface ButtonProps extends WithClassName, ButtonHTMLAttributes<HTMLButtonElem
     disabled?: boolean;
     /** Adds a pulsing animation for call-to-action emphasis. Respects `prefers-reduced-motion`. */
     hasPulse?: boolean;
+    /** When true, forces a 1:1 aspect ratio with equal `xs` padding on both axes. Pass the icon as `children`; composable with any `variant`. Requires `aria-label`. */
+    isIconOnly?: boolean;
     /** Click handler. Typed as `HTMLElement` because the root may be `<button>` or `<a>`. */
     onClick?: MouseEventHandler<HTMLElement>;
     /** Anchor target (only applied when rendered as `<a>`). */
@@ -240,7 +242,7 @@ interface ButtonProps extends WithClassName, ButtonHTMLAttributes<HTMLButtonElem
     /** ID(s) of element(s) that describe the button (e.g. a tooltip or helper text). */
     'aria-describedby'?: string;
 }
-declare function Button({ children, className, variant, type, iconStart, iconEnd, size, hasPulse, href, target, rel, disabled, onClick, ...rest }: Readonly<ButtonProps>): react_jsx_runtime.JSX.Element;
+declare function Button({ children, className, variant, type, iconStart, iconEnd, size, hasPulse, isIconOnly, href, target, rel, disabled, onClick, ...rest }: Readonly<ButtonProps>): react_jsx_runtime.JSX.Element;
 
 interface CommandItem {
     id: string;
@@ -481,6 +483,44 @@ type CardOwnProps = WithClassName & {
 type CardProps<C extends ElementType = 'div'> = CardOwnProps & Omit<ComponentPropsWithoutRef<C>, keyof CardOwnProps>;
 declare function Card<C extends ElementType = 'div'>({ children, className, variant, padding, textAlign, as, onClick, ...rest }: CardProps<C>): react_jsx_runtime.JSX.Element;
 
+type GridVariant = 'main' | 'page' | 'funnel' | 'custom';
+type GridOwnProps = WithClassName & {
+    variant?: GridVariant;
+    columns?: number;
+    isCentered?: boolean;
+    isMasonry?: boolean;
+    /**
+     * When true, any child `GridItem` without an explicit `columnSpan` resolves
+     * to `"auto"` — column span is derived from the intrinsic aspect ratio of
+     * the first `<img>`/`<video>` child. Items that set `columnSpan` explicitly
+     * are unaffected.
+     */
+    autoSpanMedia?: boolean;
+    as?: ElementType;
+};
+type GridProps<C extends ElementType = 'div'> = GridOwnProps & Omit<ComponentPropsWithoutRef<C>, keyof GridOwnProps>;
+declare function Grid<C extends ElementType = 'div'>({ children, className, variant, columns, isCentered, isMasonry, autoSpanMedia, as, style, ...rest }: GridProps<C>): react_jsx_runtime.JSX.Element;
+
+type GridItemSpanValue = 'full' | 'three-quarters' | 'two-thirds' | 'half' | 'one-third' | 'one-quarter' | 'auto' | number;
+declare const GridItemSpan: {
+    readonly full: "full";
+    readonly threeQuarters: "three-quarters";
+    readonly twoThirds: "two-thirds";
+    readonly half: "half";
+    readonly oneThird: "one-third";
+    readonly oneQuarter: "one-quarter";
+    readonly auto: "auto";
+};
+type GridItemOwnProps = WithClassName & {
+    columnSpan?: GridItemSpanValue;
+    rowSpan?: number;
+    startColumn?: number;
+    endColumn?: number;
+    as?: ElementType;
+};
+type GridItemProps<C extends ElementType = 'div'> = GridItemOwnProps & Omit<ComponentPropsWithoutRef<C>, keyof GridItemOwnProps>;
+declare function GridItem<C extends ElementType = 'div'>({ children, className, columnSpan, rowSpan, startColumn, endColumn, as, style, ...rest }: GridItemProps<C>): react_jsx_runtime.JSX.Element;
+
 type IntrinsicElement = keyof JSX.IntrinsicElements;
 type SectionHeaderProps = WithClassName & Omit<HTMLAttributes<HTMLDivElement>, 'title'> & {
     title: string;
@@ -496,4 +536,4 @@ interface IconWrapperProps extends WithClassName, HTMLAttributes<HTMLDivElement>
 }
 declare function IconWrapper({ children, className, ...rest }: IconWrapperProps): react_jsx_runtime.JSX.Element;
 
-export { Accordion, type AccordionItem, Alert, Avatar, Badge, Breadcrumb, type BreadcrumbItem, Button, ButtonContainer, type ButtonContainerProps, 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 SegmentedControlProps, Select, type SelectOption, Separator, Skeleton, SkipLink, Slider, Switch, type TabItem, Table, type TableColumn, Tabs, Textarea, ToastProvider, Tooltip, Typography, type WithClassName, useToast };
+export { Accordion, type AccordionItem, Alert, Avatar, Badge, Breadcrumb, type BreadcrumbItem, Button, ButtonContainer, type ButtonContainerProps, 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, Grid, GridItem, GridItemSpan, type GridItemSpanValue, type GridVariant, IconWrapper, type IconWrapperProps, Link, Loading, NotificationBanner, NumberInput, Pagination, Popover, Progress, ProgressCircle, Radio, RadioGroup, type RadioGroupProps, Rating, SectionHeader, SegmentedControl, type SegmentedControlProps, Select, type SelectOption, Separator, Skeleton, SkipLink, Slider, Switch, type TabItem, Table, type TableColumn, Tabs, Textarea, ToastProvider, Tooltip, Typography, type WithClassName, useToast };