@boostdev/design-system-components 2.6.0 → 2.7.0

package/dist/index.d.cts

@@ -348,6 +348,32 @@ interface ComboboxProps extends WithClassName, Omit<HTMLAttributes<HTMLDivElemen
 }
 declare function Combobox({ label, name, options, placeholder, value, onChange, disabled, error, hint, className, ...rest }: Readonly<ComboboxProps>): react_jsx_runtime.JSX.Element;
 
+/**
+ * Layout variants for FieldGroup.
+ *
+ * - `horizontal` (default) — fields flow into a row, each claiming at least
+ *   `--fieldGroup_min-field-width`. When the container's inline-size is too
+ *   narrow to fit the row, a CSS container query collapses the layout to a
+ *   single column.
+ * - `vertical` — fields always stack one per row.
+ */
+type FieldGroupVariant = 'horizontal' | 'vertical';
+interface FieldGroupProps extends WithClassName, FieldsetHTMLAttributes<HTMLFieldSetElement> {
+    /** Layout direction. Defaults to `horizontal`. */
+    variant?: FieldGroupVariant;
+    /**
+     * Optional legend rendered above the fields. When omitted, set
+     * `aria-label` or `aria-labelledby` on the fieldset for accessibility.
+     */
+    legend?: ReactNode;
+}
+/**
+ * `FieldGroup` semantically groups related form fields under a single
+ * `<fieldset>` and lays them out either horizontally (with container-query
+ * fallback to vertical) or vertically.
+ */
+declare function FieldGroup({ variant, legend, children, className, style, ...rest }: Readonly<FieldGroupProps>): react_jsx_runtime.JSX.Element;
+
 interface FileInputProps extends WithClassName, Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
     label: string;
     name: string;
@@ -558,4 +584,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, 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 };
+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, FieldGroup, type FieldGroupProps, type FieldGroupVariant, 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

@@ -348,6 +348,32 @@ interface ComboboxProps extends WithClassName, Omit<HTMLAttributes<HTMLDivElemen
 }
 declare function Combobox({ label, name, options, placeholder, value, onChange, disabled, error, hint, className, ...rest }: Readonly<ComboboxProps>): react_jsx_runtime.JSX.Element;
 
+/**
+ * Layout variants for FieldGroup.
+ *
+ * - `horizontal` (default) — fields flow into a row, each claiming at least
+ *   `--fieldGroup_min-field-width`. When the container's inline-size is too
+ *   narrow to fit the row, a CSS container query collapses the layout to a
+ *   single column.
+ * - `vertical` — fields always stack one per row.
+ */
+type FieldGroupVariant = 'horizontal' | 'vertical';
+interface FieldGroupProps extends WithClassName, FieldsetHTMLAttributes<HTMLFieldSetElement> {
+    /** Layout direction. Defaults to `horizontal`. */
+    variant?: FieldGroupVariant;
+    /**
+     * Optional legend rendered above the fields. When omitted, set
+     * `aria-label` or `aria-labelledby` on the fieldset for accessibility.
+     */
+    legend?: ReactNode;
+}
+/**
+ * `FieldGroup` semantically groups related form fields under a single
+ * `<fieldset>` and lays them out either horizontally (with container-query
+ * fallback to vertical) or vertically.
+ */
+declare function FieldGroup({ variant, legend, children, className, style, ...rest }: Readonly<FieldGroupProps>): react_jsx_runtime.JSX.Element;
+
 interface FileInputProps extends WithClassName, Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
     label: string;
     name: string;
@@ -558,4 +584,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, 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 };
+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, FieldGroup, type FieldGroupProps, type FieldGroupVariant, 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 };