@boostdev/design-system-components 2.5.1 → 2.7.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.
- package/dist/client.cjs +257 -219
- package/dist/client.css +673 -626
- package/dist/client.d.cts +27 -1
- package/dist/client.d.ts +27 -1
- package/dist/client.js +220 -183
- package/dist/index.cjs +257 -219
- package/dist/index.css +673 -626
- package/dist/index.d.cts +27 -1
- package/dist/index.d.ts +27 -1
- package/dist/index.js +220 -183
- package/dist/web-components/{chunk-N3TN6WCH.js → chunk-GER5UJOF.js} +22 -15
- package/dist/web-components/chunk-QWPACK5L.js +72 -0
- package/dist/web-components/{chunk-YRXCVKHV.js → chunk-RTOS7LLG.js} +9 -7
- package/dist/web-components/{chunk-BX3IPVOB.js → chunk-ZNKEZIYE.js} +20 -16
- package/dist/web-components/index.d.ts +56 -1
- package/dist/web-components/index.js +121 -4
- package/dist/web-components/interaction/bds-button.js +1 -1
- package/dist/web-components/ui/bds-alert.js +1 -1
- package/dist/web-components/ui/bds-badge.js +1 -1
- package/dist/web-components/ui/bds-card.js +1 -1
- package/package.json +3 -2
- package/src/components/interaction/Button/Button.mdx +87 -13
- package/src/components/interaction/Button/Button.module.css +22 -17
- package/src/components/interaction/Toast/Toast.mdx +22 -3
- package/src/components/interaction/Toast/Toast.module.css +13 -10
- package/src/components/interaction/form/FieldGroup/FieldGroup.mdx +113 -0
- package/src/components/interaction/form/FieldGroup/FieldGroup.module.css +96 -0
- package/src/components/interaction/form/FieldGroup/FieldGroup.spec.tsx +196 -0
- package/src/components/interaction/form/FieldGroup/FieldGroup.stories.tsx +99 -0
- package/src/components/interaction/form/FieldGroup/FieldGroup.tsx +64 -0
- package/src/components/interaction/form/FieldGroup/index.ts +2 -0
- package/src/components/interaction/form/atoms/Message.module.css +4 -0
- package/src/components/layout/Card/Card.mdx +20 -8
- package/src/components/layout/Card/Card.module.css +5 -3
- package/src/components/ui/Alert/Alert.mdx +39 -5
- package/src/components/ui/Alert/Alert.module.css +21 -15
- package/src/components/ui/Badge/Badge.mdx +23 -3
- package/src/components/ui/Badge/Badge.module.css +15 -12
- package/src/components/ui/Link/Link.mdx +20 -2
- package/src/components/ui/Link/Link.module.css +12 -8
- package/src/components/ui/NotificationBanner/NotificationBanner.mdx +25 -6
- package/src/components/ui/NotificationBanner/NotificationBanner.module.css +18 -15
- package/src/components/ui/Pagination/Pagination.mdx +22 -9
- package/src/components/ui/Pagination/Pagination.module.css +10 -8
- package/src/components/ui/Tabs/Tabs.mdx +20 -5
- package/src/components/ui/Tabs/Tabs.module.css +8 -5
- package/src/index.ts +2 -0
- package/src/web-components/index.ts +2 -0
- package/src/web-components/interaction/bds-button.ts +22 -15
- package/src/web-components/interaction/form/BdsFieldGroup.mdx +67 -0
- package/src/web-components/interaction/form/BdsFieldGroup.stories.tsx +110 -0
- package/src/web-components/interaction/form/bds-checkbox-group.ts +1 -0
- package/src/web-components/interaction/form/bds-field-group.spec.ts +64 -0
- package/src/web-components/interaction/form/bds-field-group.ts +157 -0
- package/src/web-components/interaction/form/bds-form-input.ts +1 -0
- package/src/web-components/interaction/form/bds-radio-group.ts +1 -0
- package/src/web-components/ui/bds-alert.ts +20 -16
- package/src/web-components/ui/bds-badge.ts +16 -13
- package/src/web-components/ui/bds-card.ts +9 -7
- package/dist/web-components/chunk-OHUTLSIQ.js +0 -69
package/dist/client.d.cts
CHANGED
|
@@ -348,6 +348,32 @@ interface ComboboxProps extends WithClassName, Omit<HTMLAttributes<HTMLDivElemen
|
|
|
348
348
|
}
|
|
349
349
|
declare function Combobox({ label, name, options, placeholder, value, onChange, disabled, error, hint, className, ...rest }: Readonly<ComboboxProps>): react_jsx_runtime.JSX.Element;
|
|
350
350
|
|
|
351
|
+
/**
|
|
352
|
+
* Layout variants for FieldGroup.
|
|
353
|
+
*
|
|
354
|
+
* - `horizontal` (default) — fields flow into a row, each claiming at least
|
|
355
|
+
* `--fieldGroup_min-field-width`. When the container's inline-size is too
|
|
356
|
+
* narrow to fit the row, a CSS container query collapses the layout to a
|
|
357
|
+
* single column.
|
|
358
|
+
* - `vertical` — fields always stack one per row.
|
|
359
|
+
*/
|
|
360
|
+
type FieldGroupVariant = 'horizontal' | 'vertical';
|
|
361
|
+
interface FieldGroupProps extends WithClassName, FieldsetHTMLAttributes<HTMLFieldSetElement> {
|
|
362
|
+
/** Layout direction. Defaults to `horizontal`. */
|
|
363
|
+
variant?: FieldGroupVariant;
|
|
364
|
+
/**
|
|
365
|
+
* Optional legend rendered above the fields. When omitted, set
|
|
366
|
+
* `aria-label` or `aria-labelledby` on the fieldset for accessibility.
|
|
367
|
+
*/
|
|
368
|
+
legend?: ReactNode;
|
|
369
|
+
}
|
|
370
|
+
/**
|
|
371
|
+
* `FieldGroup` semantically groups related form fields under a single
|
|
372
|
+
* `<fieldset>` and lays them out either horizontally (with container-query
|
|
373
|
+
* fallback to vertical) or vertically.
|
|
374
|
+
*/
|
|
375
|
+
declare function FieldGroup({ variant, legend, children, className, style, ...rest }: Readonly<FieldGroupProps>): react_jsx_runtime.JSX.Element;
|
|
376
|
+
|
|
351
377
|
interface FileInputProps extends WithClassName, Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
|
|
352
378
|
label: string;
|
|
353
379
|
name: string;
|
|
@@ -558,4 +584,4 @@ interface IconWrapperProps extends WithClassName, HTMLAttributes<HTMLDivElement>
|
|
|
558
584
|
}
|
|
559
585
|
declare function IconWrapper({ children, className, ...rest }: IconWrapperProps): react_jsx_runtime.JSX.Element;
|
|
560
586
|
|
|
561
|
-
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 };
|
|
587
|
+
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/client.d.ts
CHANGED
|
@@ -348,6 +348,32 @@ interface ComboboxProps extends WithClassName, Omit<HTMLAttributes<HTMLDivElemen
|
|
|
348
348
|
}
|
|
349
349
|
declare function Combobox({ label, name, options, placeholder, value, onChange, disabled, error, hint, className, ...rest }: Readonly<ComboboxProps>): react_jsx_runtime.JSX.Element;
|
|
350
350
|
|
|
351
|
+
/**
|
|
352
|
+
* Layout variants for FieldGroup.
|
|
353
|
+
*
|
|
354
|
+
* - `horizontal` (default) — fields flow into a row, each claiming at least
|
|
355
|
+
* `--fieldGroup_min-field-width`. When the container's inline-size is too
|
|
356
|
+
* narrow to fit the row, a CSS container query collapses the layout to a
|
|
357
|
+
* single column.
|
|
358
|
+
* - `vertical` — fields always stack one per row.
|
|
359
|
+
*/
|
|
360
|
+
type FieldGroupVariant = 'horizontal' | 'vertical';
|
|
361
|
+
interface FieldGroupProps extends WithClassName, FieldsetHTMLAttributes<HTMLFieldSetElement> {
|
|
362
|
+
/** Layout direction. Defaults to `horizontal`. */
|
|
363
|
+
variant?: FieldGroupVariant;
|
|
364
|
+
/**
|
|
365
|
+
* Optional legend rendered above the fields. When omitted, set
|
|
366
|
+
* `aria-label` or `aria-labelledby` on the fieldset for accessibility.
|
|
367
|
+
*/
|
|
368
|
+
legend?: ReactNode;
|
|
369
|
+
}
|
|
370
|
+
/**
|
|
371
|
+
* `FieldGroup` semantically groups related form fields under a single
|
|
372
|
+
* `<fieldset>` and lays them out either horizontally (with container-query
|
|
373
|
+
* fallback to vertical) or vertically.
|
|
374
|
+
*/
|
|
375
|
+
declare function FieldGroup({ variant, legend, children, className, style, ...rest }: Readonly<FieldGroupProps>): react_jsx_runtime.JSX.Element;
|
|
376
|
+
|
|
351
377
|
interface FileInputProps extends WithClassName, Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
|
|
352
378
|
label: string;
|
|
353
379
|
name: string;
|
|
@@ -558,4 +584,4 @@ interface IconWrapperProps extends WithClassName, HTMLAttributes<HTMLDivElement>
|
|
|
558
584
|
}
|
|
559
585
|
declare function IconWrapper({ children, className, ...rest }: IconWrapperProps): react_jsx_runtime.JSX.Element;
|
|
560
586
|
|
|
561
|
-
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 };
|
|
587
|
+
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 };
|