@digdir/designsystemet-react 0.62.0 → 1.0.0-next.14
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/cjs/components/Accordion/{AccordionContent/AccordionContent.js → AccordionContent.js} +10 -5
- package/dist/cjs/components/Accordion/AccordionHeading.js +31 -0
- package/dist/cjs/components/Accordion/{AccordionItem/AccordionItem.js → AccordionItem.js} +10 -2
- package/dist/cjs/components/Accordion/AccordionRoot.js +16 -0
- package/dist/cjs/components/Accordion/index.js +22 -9
- package/dist/cjs/components/Alert/Alert.js +7 -4
- package/dist/cjs/components/Box/Box.js +1 -4
- package/dist/cjs/components/Button/Button.js +5 -4
- package/dist/cjs/components/Card/Card.js +11 -2
- package/dist/cjs/components/Card/CardContent.js +2 -1
- package/dist/cjs/components/Card/CardFooter.js +2 -1
- package/dist/cjs/components/Card/CardHeader.js +2 -1
- package/dist/cjs/components/Card/CardMedia.js +1 -1
- package/dist/cjs/components/Chip/Group/Group.js +2 -4
- package/dist/cjs/components/Chip/Removable/Removable.js +2 -4
- package/dist/cjs/components/Chip/Toggle/Toggle.js +2 -4
- package/dist/cjs/components/Divider/Divider.js +1 -1
- package/dist/cjs/components/DropdownMenu/DropdownMenuContent.js +4 -4
- package/dist/cjs/components/DropdownMenu/DropdownMenuGroup.js +3 -3
- package/dist/cjs/components/DropdownMenu/DropdownMenuItem.js +3 -3
- package/dist/cjs/components/DropdownMenu/{DropdownMenu.js → DropdownMenuRoot.js} +15 -5
- package/dist/cjs/components/DropdownMenu/DropdownMenuTrigger.js +2 -2
- package/dist/cjs/components/DropdownMenu/index.js +16 -2
- package/dist/cjs/components/ErrorSummary/ErrorSummaryHeading.js +1 -1
- package/dist/cjs/components/ErrorSummary/ErrorSummaryRoot.js +1 -1
- package/dist/cjs/components/ErrorSummary/index.js +9 -0
- package/dist/cjs/components/HelpText/HelpText.js +4 -5
- package/dist/cjs/components/Link/Link.js +2 -2
- package/dist/cjs/components/List/ListItem.js +1 -1
- package/dist/cjs/components/List/ListRoot.js +1 -3
- package/dist/cjs/components/List/Lists.js +4 -4
- package/dist/cjs/components/Modal/ModaContent.js +1 -1
- package/dist/cjs/components/Modal/ModalDialog.js +10 -9
- package/dist/cjs/components/Modal/ModalFooter.js +1 -1
- package/dist/cjs/components/Modal/ModalHeader.js +2 -2
- package/dist/cjs/components/Modal/ModalRoot.js +7 -1
- package/dist/cjs/components/Modal/index.js +1 -1
- package/dist/cjs/components/Pagination/Pagination.js +3 -5
- package/dist/cjs/components/Pagination/PaginationButton.js +2 -1
- package/dist/cjs/components/Pagination/PaginationContent.js +2 -1
- package/dist/cjs/components/Pagination/PaginationEllipsis.js +2 -5
- package/dist/cjs/components/Pagination/PaginationItem.js +2 -5
- package/dist/cjs/components/Pagination/PaginationNextPrev.js +2 -0
- package/dist/cjs/components/Pagination/PaginationRoot.js +2 -7
- package/dist/cjs/components/Pagination/index.js +6 -6
- package/dist/cjs/components/Popover/PopoverContent.js +5 -5
- package/dist/cjs/components/Popover/{Popover.js → PopoverRoot.js} +3 -5
- package/dist/cjs/components/Popover/PopoverTrigger.js +2 -2
- package/dist/cjs/components/Popover/index.js +5 -2
- package/dist/cjs/components/Skeleton/Circle/Circle.js +3 -3
- package/dist/cjs/components/Skeleton/Rectangle/Rectangle.js +3 -3
- package/dist/cjs/components/Skeleton/Text/Text.js +3 -3
- package/dist/cjs/components/SkipLink/SkipLink.js +1 -1
- package/dist/cjs/components/Spinner/Spinner.js +5 -7
- package/dist/cjs/components/Table/Table.js +2 -4
- package/dist/cjs/components/Table/TableCell.js +1 -1
- package/dist/cjs/components/Table/TableHead.js +1 -1
- package/dist/cjs/components/Table/TableHeaderCell.js +1 -1
- package/dist/cjs/components/Table/TableRow.js +1 -1
- package/dist/cjs/components/Tabs/Tab.js +23 -0
- package/dist/cjs/components/Tabs/TabContent.js +24 -0
- package/dist/cjs/components/Tabs/TabList.js +26 -0
- package/dist/cjs/components/Tabs/{Tabs.js → TabsRoot.js} +21 -6
- package/dist/cjs/components/Tabs/index.js +24 -5
- package/dist/cjs/components/Tabs/{Tab/useTab.js → useTab.js} +3 -2
- package/dist/cjs/components/Tag/Tag.js +7 -4
- package/dist/cjs/components/ToggleGroup/ToggleGroupItem/ToggleGroupItem.js +8 -3
- package/dist/cjs/components/ToggleGroup/ToggleGroupItem/useToggleGroupitem.js +8 -6
- package/dist/cjs/components/ToggleGroup/{ToggleGroup.js → ToggleGroupRoot.js} +10 -13
- package/dist/cjs/components/ToggleGroup/index.js +16 -2
- package/dist/cjs/components/Tooltip/Tooltip.js +14 -6
- package/dist/cjs/components/Typography/ErrorMessage/ErrorMessage.js +2 -4
- package/dist/cjs/components/Typography/Heading/Heading.js +8 -5
- package/dist/cjs/components/Typography/Ingress/Ingress.js +8 -5
- package/dist/cjs/components/Typography/Label/Label.js +8 -5
- package/dist/cjs/components/Typography/Paragraph/Paragraph.js +13 -5
- package/dist/cjs/components/form/CharacterCounter.js +1 -1
- package/dist/cjs/components/form/Checkbox/Checkbox.js +2 -2
- package/dist/cjs/components/form/Checkbox/Group/Group.js +1 -1
- package/dist/cjs/components/form/Combobox/Combobox.js +22 -21
- package/dist/cjs/components/form/Combobox/Custom.js +5 -8
- package/dist/cjs/components/form/Combobox/Empty.js +3 -5
- package/dist/cjs/components/form/Combobox/Option/Description.js +2 -5
- package/dist/cjs/components/form/Combobox/Option/Option.js +5 -5
- package/dist/cjs/components/form/Combobox/Option/SelectedIcon.js +1 -4
- package/dist/cjs/components/form/Combobox/Option/useComboboxOption.js +7 -6
- package/dist/cjs/components/form/Combobox/internal/ComboboxChips.js +1 -4
- package/dist/cjs/components/form/Combobox/internal/ComboboxClearButton.js +4 -7
- package/dist/cjs/components/form/Combobox/internal/ComboboxError.js +3 -6
- package/dist/cjs/components/form/Combobox/internal/ComboboxInput.js +25 -21
- package/dist/cjs/components/form/Combobox/internal/ComboboxLabel.js +2 -5
- package/dist/cjs/components/form/Combobox/internal/ComboboxNative.js +4 -7
- package/dist/cjs/components/form/Combobox/useCombobox.js +38 -12
- package/dist/cjs/components/form/Combobox/useComboboxKeyboard.js +2 -2
- package/dist/cjs/components/form/Combobox/useFloatingCombobox.js +1 -1
- package/dist/cjs/components/form/Fieldset/Fieldset.js +1 -1
- package/dist/cjs/components/form/NativeSelect/NativeSelect.js +2 -2
- package/dist/cjs/components/form/NativeSelect/useNativeSelect.js +1 -3
- package/dist/cjs/components/form/Radio/Group/Group.js +1 -1
- package/dist/cjs/components/form/Radio/Radio.js +2 -2
- package/dist/cjs/components/form/Search/Search.js +5 -6
- package/dist/cjs/components/form/Search/useSearch.js +1 -3
- package/dist/cjs/components/form/Switch/Switch.js +2 -2
- package/dist/cjs/components/form/Switch/useSwitch.js +1 -0
- package/dist/cjs/components/form/Textarea/Textarea.js +3 -3
- package/dist/cjs/components/form/Textarea/useTextarea.js +1 -3
- package/dist/cjs/components/form/Textfield/Textfield.js +3 -3
- package/dist/cjs/components/form/Textfield/useTextfield.js +1 -3
- package/dist/cjs/components/form/useFormField.js +4 -3
- package/dist/cjs/index.js +34 -10
- package/dist/cjs/node_modules/@radix-ui/react-slot/dist/index.js +1 -1
- package/dist/cjs/node_modules/@tanstack/virtual-core/dist/esm/index.js +77 -71
- package/dist/cjs/node_modules/@tanstack/virtual-core/dist/esm/utils.js +8 -0
- package/dist/cjs/utilities/AnimateHeight/AnimateHeight.js +3 -3
- package/dist/cjs/utilities/{RovingTabIndex/RovingTabindexItem.js → RovingFocus/RovingFocusItem.js} +6 -6
- package/dist/cjs/utilities/{RovingTabIndex/RovingTabindexRoot.js → RovingFocus/RovingFocusRoot.js} +11 -7
- package/dist/cjs/utilities/{RovingTabIndex/useRovingTabindex.js → RovingFocus/useRovingFocus.js} +5 -5
- package/dist/cjs/utilities/{useDebounce.js → hooks/useDebounceCallback/useDebounceCallback.js} +2 -2
- package/dist/cjs/{hooks → utilities/hooks/useIsomorphicLayoutEffect}/useIsomorphicLayoutEffect.js +1 -0
- package/dist/cjs/utilities/hooks/useMediaQuery/useMediaQuery.js +49 -0
- package/dist/cjs/utilities/hooks/useSynchronizedAnimation/useSynchronizedAnimation.js +46 -0
- package/dist/esm/components/Accordion/{AccordionContent/AccordionContent.js → AccordionContent.js} +10 -5
- package/dist/esm/components/Accordion/AccordionHeading.js +29 -0
- package/dist/esm/components/Accordion/{AccordionItem/AccordionItem.js → AccordionItem.js} +10 -2
- package/dist/esm/components/Accordion/AccordionRoot.js +14 -0
- package/dist/esm/components/Accordion/index.js +20 -8
- package/dist/esm/components/Alert/Alert.js +7 -4
- package/dist/esm/components/Box/Box.js +1 -4
- package/dist/esm/components/Button/Button.js +5 -4
- package/dist/esm/components/Card/Card.js +11 -2
- package/dist/esm/components/Card/CardContent.js +2 -1
- package/dist/esm/components/Card/CardFooter.js +2 -1
- package/dist/esm/components/Card/CardHeader.js +2 -1
- package/dist/esm/components/Card/CardMedia.js +1 -1
- package/dist/esm/components/Chip/Group/Group.js +2 -4
- package/dist/esm/components/Chip/Removable/Removable.js +2 -4
- package/dist/esm/components/Chip/Toggle/Toggle.js +2 -4
- package/dist/esm/components/Divider/Divider.js +1 -1
- package/dist/esm/components/DropdownMenu/DropdownMenuContent.js +3 -3
- package/dist/esm/components/DropdownMenu/DropdownMenuGroup.js +2 -2
- package/dist/esm/components/DropdownMenu/DropdownMenuItem.js +2 -2
- package/dist/esm/components/DropdownMenu/{DropdownMenu.js → DropdownMenuRoot.js} +15 -5
- package/dist/esm/components/DropdownMenu/DropdownMenuTrigger.js +1 -1
- package/dist/esm/components/DropdownMenu/index.js +16 -3
- package/dist/esm/components/ErrorSummary/ErrorSummaryHeading.js +1 -1
- package/dist/esm/components/ErrorSummary/ErrorSummaryRoot.js +1 -1
- package/dist/esm/components/ErrorSummary/index.js +9 -0
- package/dist/esm/components/HelpText/HelpText.js +4 -5
- package/dist/esm/components/Link/Link.js +2 -2
- package/dist/esm/components/List/ListItem.js +1 -1
- package/dist/esm/components/List/ListRoot.js +1 -3
- package/dist/esm/components/List/Lists.js +4 -4
- package/dist/esm/components/Modal/ModaContent.js +1 -1
- package/dist/esm/components/Modal/ModalDialog.js +10 -9
- package/dist/esm/components/Modal/ModalFooter.js +1 -1
- package/dist/esm/components/Modal/ModalHeader.js +2 -2
- package/dist/esm/components/Modal/ModalRoot.js +8 -2
- package/dist/esm/components/Modal/index.js +1 -1
- package/dist/esm/components/Pagination/Pagination.js +3 -5
- package/dist/esm/components/Pagination/PaginationButton.js +2 -1
- package/dist/esm/components/Pagination/PaginationContent.js +2 -1
- package/dist/esm/components/Pagination/PaginationEllipsis.js +3 -3
- package/dist/esm/components/Pagination/PaginationItem.js +3 -3
- package/dist/esm/components/Pagination/PaginationNextPrev.js +2 -0
- package/dist/esm/components/Pagination/PaginationRoot.js +3 -5
- package/dist/esm/components/Pagination/index.js +3 -3
- package/dist/esm/components/Popover/PopoverContent.js +4 -4
- package/dist/esm/components/Popover/{Popover.js → PopoverRoot.js} +3 -5
- package/dist/esm/components/Popover/PopoverTrigger.js +1 -1
- package/dist/esm/components/Popover/index.js +5 -3
- package/dist/esm/components/Skeleton/Circle/Circle.js +3 -3
- package/dist/esm/components/Skeleton/Rectangle/Rectangle.js +3 -3
- package/dist/esm/components/Skeleton/Text/Text.js +3 -3
- package/dist/esm/components/SkipLink/SkipLink.js +1 -1
- package/dist/esm/components/Spinner/Spinner.js +5 -7
- package/dist/esm/components/Table/Table.js +2 -4
- package/dist/esm/components/Table/TableCell.js +1 -1
- package/dist/esm/components/Table/TableHead.js +1 -1
- package/dist/esm/components/Table/TableHeaderCell.js +1 -1
- package/dist/esm/components/Table/TableRow.js +1 -1
- package/dist/esm/components/Tabs/Tab.js +21 -0
- package/dist/esm/components/Tabs/TabContent.js +22 -0
- package/dist/esm/components/Tabs/TabList.js +24 -0
- package/dist/esm/components/Tabs/TabsRoot.js +43 -0
- package/dist/esm/components/Tabs/index.js +24 -6
- package/dist/esm/components/Tabs/{Tab/useTab.js → useTab.js} +2 -1
- package/dist/esm/components/Tag/Tag.js +7 -4
- package/dist/esm/components/ToggleGroup/ToggleGroupItem/ToggleGroupItem.js +8 -3
- package/dist/esm/components/ToggleGroup/ToggleGroupItem/useToggleGroupitem.js +8 -6
- package/dist/esm/components/ToggleGroup/{ToggleGroup.js → ToggleGroupRoot.js} +10 -13
- package/dist/esm/components/ToggleGroup/index.js +16 -3
- package/dist/esm/components/Tooltip/Tooltip.js +14 -6
- package/dist/esm/components/Typography/ErrorMessage/ErrorMessage.js +2 -4
- package/dist/esm/components/Typography/Heading/Heading.js +8 -5
- package/dist/esm/components/Typography/Ingress/Ingress.js +8 -5
- package/dist/esm/components/Typography/Label/Label.js +8 -5
- package/dist/esm/components/Typography/Paragraph/Paragraph.js +13 -5
- package/dist/esm/components/form/CharacterCounter.js +1 -1
- package/dist/esm/components/form/Checkbox/Checkbox.js +2 -2
- package/dist/esm/components/form/Checkbox/Group/Group.js +1 -1
- package/dist/esm/components/form/Combobox/Combobox.js +24 -23
- package/dist/esm/components/form/Combobox/Custom.js +6 -6
- package/dist/esm/components/form/Combobox/Empty.js +4 -3
- package/dist/esm/components/form/Combobox/Option/Description.js +2 -2
- package/dist/esm/components/form/Combobox/Option/Option.js +6 -6
- package/dist/esm/components/form/Combobox/Option/SelectedIcon.js +2 -2
- package/dist/esm/components/form/Combobox/Option/useComboboxOption.js +7 -6
- package/dist/esm/components/form/Combobox/internal/ComboboxChips.js +1 -1
- package/dist/esm/components/form/Combobox/internal/ComboboxClearButton.js +5 -5
- package/dist/esm/components/form/Combobox/internal/ComboboxError.js +3 -3
- package/dist/esm/components/form/Combobox/internal/ComboboxInput.js +27 -20
- package/dist/esm/components/form/Combobox/internal/ComboboxLabel.js +2 -2
- package/dist/esm/components/form/Combobox/internal/ComboboxNative.js +4 -4
- package/dist/esm/components/form/Combobox/useCombobox.js +38 -14
- package/dist/esm/components/form/Combobox/useComboboxKeyboard.js +2 -2
- package/dist/esm/components/form/Combobox/useFloatingCombobox.js +1 -1
- package/dist/esm/components/form/Fieldset/Fieldset.js +1 -1
- package/dist/esm/components/form/NativeSelect/NativeSelect.js +2 -2
- package/dist/esm/components/form/NativeSelect/useNativeSelect.js +1 -3
- package/dist/esm/components/form/Radio/Group/Group.js +1 -1
- package/dist/esm/components/form/Radio/Radio.js +2 -2
- package/dist/esm/components/form/Search/Search.js +5 -6
- package/dist/esm/components/form/Search/useSearch.js +1 -3
- package/dist/esm/components/form/Switch/Switch.js +2 -2
- package/dist/esm/components/form/Switch/useSwitch.js +1 -0
- package/dist/esm/components/form/Textarea/Textarea.js +3 -3
- package/dist/esm/components/form/Textarea/useTextarea.js +1 -3
- package/dist/esm/components/form/Textfield/Textfield.js +3 -3
- package/dist/esm/components/form/Textfield/useTextfield.js +1 -3
- package/dist/esm/components/form/useFormField.js +4 -3
- package/dist/esm/index.js +20 -9
- package/dist/esm/node_modules/@radix-ui/react-slot/dist/index.js +1 -1
- package/dist/esm/node_modules/@tanstack/virtual-core/dist/esm/index.js +78 -73
- package/dist/esm/node_modules/@tanstack/virtual-core/dist/esm/utils.js +8 -1
- package/dist/esm/utilities/AnimateHeight/AnimateHeight.js +3 -3
- package/dist/esm/utilities/{RovingTabIndex/RovingTabindexItem.js → RovingFocus/RovingFocusItem.js} +6 -6
- package/dist/esm/utilities/{RovingTabIndex/RovingTabindexRoot.js → RovingFocus/RovingFocusRoot.js} +11 -7
- package/dist/esm/utilities/{RovingTabIndex/useRovingTabindex.js → RovingFocus/useRovingFocus.js} +5 -5
- package/dist/esm/utilities/{useDebounce.js → hooks/useDebounceCallback/useDebounceCallback.js} +2 -2
- package/dist/esm/{hooks → utilities/hooks/useIsomorphicLayoutEffect}/useIsomorphicLayoutEffect.js +1 -0
- package/dist/esm/utilities/hooks/useMediaQuery/useMediaQuery.js +47 -0
- package/dist/esm/utilities/hooks/useSynchronizedAnimation/useSynchronizedAnimation.js +44 -0
- package/dist/types/components/Accordion/AccordionContent.d.ts +9 -0
- package/dist/types/components/Accordion/AccordionContent.d.ts.map +1 -0
- package/dist/types/components/Accordion/{AccordionHeader/AccordionHeader.d.ts → AccordionHeading.d.ts} +15 -4
- package/dist/types/components/Accordion/AccordionHeading.d.ts.map +1 -0
- package/dist/types/components/Accordion/{AccordionItem/AccordionItem.d.ts → AccordionItem.d.ts} +22 -3
- package/dist/types/components/Accordion/AccordionItem.d.ts.map +1 -0
- package/dist/types/components/Accordion/AccordionRoot.d.ts +33 -0
- package/dist/types/components/Accordion/AccordionRoot.d.ts.map +1 -0
- package/dist/types/components/Accordion/index.d.ts +19 -8
- package/dist/types/components/Accordion/index.d.ts.map +1 -1
- package/dist/types/components/Alert/Alert.d.ts +23 -17
- package/dist/types/components/Alert/Alert.d.ts.map +1 -1
- package/dist/types/components/Box/Box.d.ts +5 -8
- package/dist/types/components/Box/Box.d.ts.map +1 -1
- package/dist/types/components/Button/Button.d.ts +30 -16
- package/dist/types/components/Button/Button.d.ts.map +1 -1
- package/dist/types/components/Card/Card.d.ts +11 -10
- package/dist/types/components/Card/Card.d.ts.map +1 -1
- package/dist/types/components/Card/CardContent.d.ts.map +1 -1
- package/dist/types/components/Card/CardFooter.d.ts.map +1 -1
- package/dist/types/components/Card/CardHeader.d.ts.map +1 -1
- package/dist/types/components/Chip/Group/Group.d.ts +1 -5
- package/dist/types/components/Chip/Group/Group.d.ts.map +1 -1
- package/dist/types/components/Chip/Removable/Removable.d.ts +0 -2
- package/dist/types/components/Chip/Removable/Removable.d.ts.map +1 -1
- package/dist/types/components/Chip/Toggle/Toggle.d.ts +0 -2
- package/dist/types/components/Chip/Toggle/Toggle.d.ts.map +1 -1
- package/dist/types/components/Divider/Divider.d.ts +1 -1
- package/dist/types/components/DropdownMenu/{DropdownMenu.d.ts → DropdownMenuRoot.d.ts} +20 -10
- package/dist/types/components/DropdownMenu/DropdownMenuRoot.d.ts.map +1 -0
- package/dist/types/components/DropdownMenu/DropdownMenuTrigger.d.ts +6 -4
- package/dist/types/components/DropdownMenu/DropdownMenuTrigger.d.ts.map +1 -1
- package/dist/types/components/DropdownMenu/index.d.ts +16 -4
- package/dist/types/components/DropdownMenu/index.d.ts.map +1 -1
- package/dist/types/components/ErrorSummary/ErrorSummaryHeading.d.ts.map +1 -1
- package/dist/types/components/ErrorSummary/index.d.ts +9 -0
- package/dist/types/components/ErrorSummary/index.d.ts.map +1 -1
- package/dist/types/components/HelpText/HelpText.d.ts +3 -4
- package/dist/types/components/HelpText/HelpText.d.ts.map +1 -1
- package/dist/types/components/Link/Link.d.ts +10 -4
- package/dist/types/components/Link/Link.d.ts.map +1 -1
- package/dist/types/components/List/ListHeading.d.ts +1 -1
- package/dist/types/components/List/ListRoot.d.ts +2 -5
- package/dist/types/components/List/ListRoot.d.ts.map +1 -1
- package/dist/types/components/Modal/ModalRoot.d.ts +1 -0
- package/dist/types/components/Modal/ModalRoot.d.ts.map +1 -1
- package/dist/types/components/Modal/ModalTrigger.d.ts +6 -4
- package/dist/types/components/Modal/ModalTrigger.d.ts.map +1 -1
- package/dist/types/components/Modal/index.d.ts +1 -1
- package/dist/types/components/Modal/index.d.ts.map +1 -1
- package/dist/types/components/Pagination/Pagination.d.ts +4 -7
- package/dist/types/components/Pagination/Pagination.d.ts.map +1 -1
- package/dist/types/components/Pagination/PaginationButton.d.ts +1 -1
- package/dist/types/components/Pagination/PaginationButton.d.ts.map +1 -1
- package/dist/types/components/Pagination/PaginationEllipsis.d.ts +2 -2
- package/dist/types/components/Pagination/PaginationEllipsis.d.ts.map +1 -1
- package/dist/types/components/Pagination/PaginationItem.d.ts +2 -2
- package/dist/types/components/Pagination/PaginationItem.d.ts.map +1 -1
- package/dist/types/components/Pagination/PaginationNextPrev.d.ts +5 -4
- package/dist/types/components/Pagination/PaginationNextPrev.d.ts.map +1 -1
- package/dist/types/components/Pagination/PaginationRoot.d.ts +2 -4
- package/dist/types/components/Pagination/PaginationRoot.d.ts.map +1 -1
- package/dist/types/components/Pagination/index.d.ts +7 -7
- package/dist/types/components/Pagination/index.d.ts.map +1 -1
- package/dist/types/components/Popover/{Popover.d.ts → PopoverRoot.d.ts} +9 -12
- package/dist/types/components/Popover/PopoverRoot.d.ts.map +1 -0
- package/dist/types/components/Popover/PopoverTrigger.d.ts +6 -4
- package/dist/types/components/Popover/PopoverTrigger.d.ts.map +1 -1
- package/dist/types/components/Popover/index.d.ts +6 -5
- package/dist/types/components/Popover/index.d.ts.map +1 -1
- package/dist/types/components/Spinner/Spinner.d.ts +7 -7
- package/dist/types/components/Spinner/Spinner.d.ts.map +1 -1
- package/dist/types/components/Table/Table.d.ts +2 -6
- package/dist/types/components/Table/Table.d.ts.map +1 -1
- package/dist/types/components/Table/index.d.ts +7 -0
- package/dist/types/components/Table/index.d.ts.map +1 -1
- package/dist/types/components/Tabs/{Tab/Tab.d.ts → Tab.d.ts} +7 -2
- package/dist/types/components/Tabs/Tab.d.ts.map +1 -0
- package/dist/types/components/Tabs/{TabContent/TabContent.d.ts → TabContent.d.ts} +7 -0
- package/dist/types/components/Tabs/TabContent.d.ts.map +1 -0
- package/dist/types/components/Tabs/TabList.d.ts +13 -0
- package/dist/types/components/Tabs/TabList.d.ts.map +1 -0
- package/dist/types/components/Tabs/{Tabs.d.ts → TabsRoot.d.ts} +19 -21
- package/dist/types/components/Tabs/TabsRoot.d.ts.map +1 -0
- package/dist/types/components/Tabs/index.d.ts +21 -4
- package/dist/types/components/Tabs/index.d.ts.map +1 -1
- package/dist/types/components/Tabs/useTab.d.ts +10 -0
- package/dist/types/components/Tabs/useTab.d.ts.map +1 -0
- package/dist/types/components/Tag/Tag.d.ts +12 -7
- package/dist/types/components/Tag/Tag.d.ts.map +1 -1
- package/dist/types/components/Tag/index.d.ts +1 -2
- package/dist/types/components/Tag/index.d.ts.map +1 -1
- package/dist/types/components/ToggleGroup/ToggleGroupItem/ToggleGroupItem.d.ts +13 -2
- package/dist/types/components/ToggleGroup/ToggleGroupItem/ToggleGroupItem.d.ts.map +1 -1
- package/dist/types/components/ToggleGroup/ToggleGroupItem/useToggleGroupitem.d.ts +3 -2
- package/dist/types/components/ToggleGroup/ToggleGroupItem/useToggleGroupitem.d.ts.map +1 -1
- package/dist/types/components/ToggleGroup/{ToggleGroup.d.ts → ToggleGroupRoot.d.ts} +7 -10
- package/dist/types/components/ToggleGroup/ToggleGroupRoot.d.ts.map +1 -0
- package/dist/types/components/ToggleGroup/index.d.ts +16 -4
- package/dist/types/components/ToggleGroup/index.d.ts.map +1 -1
- package/dist/types/components/Tooltip/Tooltip.d.ts +24 -22
- package/dist/types/components/Tooltip/Tooltip.d.ts.map +1 -1
- package/dist/types/components/Typography/ErrorMessage/ErrorMessage.d.ts +2 -6
- package/dist/types/components/Typography/ErrorMessage/ErrorMessage.d.ts.map +1 -1
- package/dist/types/components/Typography/Heading/Heading.d.ts +16 -9
- package/dist/types/components/Typography/Heading/Heading.d.ts.map +1 -1
- package/dist/types/components/Typography/Ingress/Ingress.d.ts +8 -7
- package/dist/types/components/Typography/Ingress/Ingress.d.ts.map +1 -1
- package/dist/types/components/Typography/Label/Label.d.ts +18 -14
- package/dist/types/components/Typography/Label/Label.d.ts.map +1 -1
- package/dist/types/components/Typography/Paragraph/Paragraph.d.ts +20 -13
- package/dist/types/components/Typography/Paragraph/Paragraph.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/Combobox.d.ts +24 -18
- package/dist/types/components/form/Combobox/Combobox.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/ComboboxContext.d.ts +1 -0
- package/dist/types/components/form/Combobox/ComboboxContext.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/Custom.d.ts +2 -2
- package/dist/types/components/form/Combobox/Custom.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/Empty.d.ts +2 -2
- package/dist/types/components/form/Combobox/Empty.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/Option/Description.d.ts +1 -1
- package/dist/types/components/form/Combobox/Option/Description.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/Option/Option.d.ts +2 -1
- package/dist/types/components/form/Combobox/Option/Option.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/Option/SelectedIcon.d.ts +2 -2
- package/dist/types/components/form/Combobox/Option/SelectedIcon.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/Option/useComboboxOption.d.ts +1 -1
- package/dist/types/components/form/Combobox/Option/useComboboxOption.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/internal/ComboboxChips.d.ts +1 -1
- package/dist/types/components/form/Combobox/internal/ComboboxChips.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/internal/ComboboxClearButton.d.ts +1 -4
- package/dist/types/components/form/Combobox/internal/ComboboxClearButton.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/internal/ComboboxError.d.ts +2 -2
- package/dist/types/components/form/Combobox/internal/ComboboxError.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/internal/ComboboxInput.d.ts +1 -1
- package/dist/types/components/form/Combobox/internal/ComboboxInput.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/internal/ComboboxLabel.d.ts +1 -1
- package/dist/types/components/form/Combobox/internal/ComboboxLabel.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/internal/ComboboxNative.d.ts +1 -1
- package/dist/types/components/form/Combobox/internal/ComboboxNative.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/useCombobox.d.ts +7 -0
- package/dist/types/components/form/Combobox/useCombobox.d.ts.map +1 -1
- package/dist/types/components/form/Combobox/useFloatingCombobox.d.ts +1 -1
- package/dist/types/components/form/Fieldset/Fieldset.d.ts.map +1 -1
- package/dist/types/components/form/Fieldset/useFieldset.d.ts +2 -2
- package/dist/types/components/form/NativeSelect/NativeSelect.d.ts +2 -6
- package/dist/types/components/form/NativeSelect/NativeSelect.d.ts.map +1 -1
- package/dist/types/components/form/NativeSelect/useNativeSelect.d.ts.map +1 -1
- package/dist/types/components/form/Search/Search.d.ts +4 -8
- package/dist/types/components/form/Search/Search.d.ts.map +1 -1
- package/dist/types/components/form/Search/useSearch.d.ts.map +1 -1
- package/dist/types/components/form/Switch/Switch.d.ts.map +1 -1
- package/dist/types/components/form/Switch/useSwitch.d.ts.map +1 -1
- package/dist/types/components/form/Textarea/Textarea.d.ts +1 -1
- package/dist/types/components/form/Textarea/useTextarea.d.ts.map +1 -1
- package/dist/types/components/form/Textfield/Textfield.d.ts +2 -6
- package/dist/types/components/form/Textfield/Textfield.d.ts.map +1 -1
- package/dist/types/components/form/Textfield/useTextfield.d.ts.map +1 -1
- package/dist/types/components/form/useFormField.d.ts +1 -4
- package/dist/types/components/form/useFormField.d.ts.map +1 -1
- package/dist/types/index.d.ts +1 -0
- package/dist/types/index.d.ts.map +1 -1
- package/dist/types/types/Portal.d.ts +1 -1
- package/dist/types/utilities/RovingFocus/RovingFocusItem.d.ts +16 -0
- package/dist/types/utilities/RovingFocus/RovingFocusItem.d.ts.map +1 -0
- package/dist/types/utilities/{RovingTabIndex/RovingTabindexRoot.d.ts → RovingFocus/RovingFocusRoot.d.ts} +9 -9
- package/dist/types/utilities/RovingFocus/RovingFocusRoot.d.ts.map +1 -0
- package/dist/types/utilities/RovingFocus/index.d.ts +4 -0
- package/dist/types/utilities/RovingFocus/index.d.ts.map +1 -0
- package/dist/types/utilities/{RovingTabIndex/useRovingTabindex.d.ts → RovingFocus/useRovingFocus.d.ts} +8 -10
- package/dist/types/utilities/RovingFocus/useRovingFocus.d.ts.map +1 -0
- package/dist/types/utilities/hooks/index.d.ts +6 -0
- package/dist/types/utilities/hooks/index.d.ts.map +1 -0
- package/dist/types/utilities/hooks/useDebounceCallback/useDebounceCallback.d.ts +4 -0
- package/dist/types/utilities/hooks/useDebounceCallback/useDebounceCallback.d.ts.map +1 -0
- package/dist/types/utilities/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.d.ts.map +1 -0
- package/dist/types/utilities/hooks/useMediaQuery/useMediaQuery.d.ts +7 -0
- package/dist/types/utilities/hooks/useMediaQuery/useMediaQuery.d.ts.map +1 -0
- package/dist/types/utilities/hooks/usePrevious.d.ts.map +1 -0
- package/dist/types/utilities/hooks/useSynchronizedAnimation/useSynchronizedAnimation.d.ts +14 -0
- package/dist/types/utilities/hooks/useSynchronizedAnimation/useSynchronizedAnimation.d.ts.map +1 -0
- package/dist/types/utilities/index.d.ts +3 -1
- package/dist/types/utilities/index.d.ts.map +1 -1
- package/dist/types/utilities/{objectUtils.d.ts → omit/omit.d.ts} +1 -1
- package/dist/types/utilities/omit/omit.d.ts.map +1 -0
- package/package.json +10 -7
- package/LICENSE +0 -7
- package/dist/cjs/components/Accordion/Accordion.js +0 -11
- package/dist/cjs/components/Accordion/AccordionHeader/AccordionHeader.js +0 -26
- package/dist/cjs/components/Tabs/Tab/Tab.js +0 -17
- package/dist/cjs/components/Tabs/TabContent/TabContent.js +0 -16
- package/dist/cjs/components/Tabs/TabList/TabList.js +0 -14
- package/dist/cjs/hooks/useMediaQuery.js +0 -27
- package/dist/cjs/hooks/useSynchronizedAnimation.js +0 -33
- package/dist/cjs/utilities/getSize.js +0 -31
- package/dist/esm/components/Accordion/Accordion.js +0 -9
- package/dist/esm/components/Accordion/AccordionHeader/AccordionHeader.js +0 -24
- package/dist/esm/components/Tabs/Tab/Tab.js +0 -15
- package/dist/esm/components/Tabs/TabContent/TabContent.js +0 -14
- package/dist/esm/components/Tabs/TabList/TabList.js +0 -12
- package/dist/esm/components/Tabs/Tabs.js +0 -28
- package/dist/esm/hooks/useMediaQuery.js +0 -25
- package/dist/esm/hooks/useSynchronizedAnimation.js +0 -31
- package/dist/esm/utilities/getSize.js +0 -29
- package/dist/types/components/Accordion/Accordion.d.ts +0 -18
- package/dist/types/components/Accordion/Accordion.d.ts.map +0 -1
- package/dist/types/components/Accordion/AccordionContent/AccordionContent.d.ts +0 -10
- package/dist/types/components/Accordion/AccordionContent/AccordionContent.d.ts.map +0 -1
- package/dist/types/components/Accordion/AccordionContent/index.d.ts +0 -2
- package/dist/types/components/Accordion/AccordionContent/index.d.ts.map +0 -1
- package/dist/types/components/Accordion/AccordionHeader/AccordionHeader.d.ts.map +0 -1
- package/dist/types/components/Accordion/AccordionHeader/index.d.ts +0 -2
- package/dist/types/components/Accordion/AccordionHeader/index.d.ts.map +0 -1
- package/dist/types/components/Accordion/AccordionItem/AccordionItem.d.ts.map +0 -1
- package/dist/types/components/Accordion/AccordionItem/index.d.ts +0 -2
- package/dist/types/components/Accordion/AccordionItem/index.d.ts.map +0 -1
- package/dist/types/components/DropdownMenu/DropdownMenu.d.ts.map +0 -1
- package/dist/types/components/Popover/Popover.d.ts.map +0 -1
- package/dist/types/components/Tabs/Tab/Tab.d.ts.map +0 -1
- package/dist/types/components/Tabs/Tab/index.d.ts +0 -2
- package/dist/types/components/Tabs/Tab/index.d.ts.map +0 -1
- package/dist/types/components/Tabs/Tab/useTab.d.ts +0 -7
- package/dist/types/components/Tabs/Tab/useTab.d.ts.map +0 -1
- package/dist/types/components/Tabs/TabContent/TabContent.d.ts.map +0 -1
- package/dist/types/components/Tabs/TabContent/index.d.ts +0 -2
- package/dist/types/components/Tabs/TabContent/index.d.ts.map +0 -1
- package/dist/types/components/Tabs/TabList/TabList.d.ts +0 -3
- package/dist/types/components/Tabs/TabList/TabList.d.ts.map +0 -1
- package/dist/types/components/Tabs/TabList/index.d.ts +0 -2
- package/dist/types/components/Tabs/TabList/index.d.ts.map +0 -1
- package/dist/types/components/Tabs/Tabs.d.ts.map +0 -1
- package/dist/types/components/ToggleGroup/ToggleGroup.d.ts.map +0 -1
- package/dist/types/hooks/index.d.ts +0 -5
- package/dist/types/hooks/index.d.ts.map +0 -1
- package/dist/types/hooks/useIsomorphicLayoutEffect.d.ts.map +0 -1
- package/dist/types/hooks/useMediaQuery.d.ts +0 -2
- package/dist/types/hooks/useMediaQuery.d.ts.map +0 -1
- package/dist/types/hooks/usePrevious.d.ts.map +0 -1
- package/dist/types/hooks/useSynchronizedAnimation.d.ts +0 -2
- package/dist/types/hooks/useSynchronizedAnimation.d.ts.map +0 -1
- package/dist/types/utilities/RovingTabIndex/RovingTabindexItem.d.ts +0 -16
- package/dist/types/utilities/RovingTabIndex/RovingTabindexItem.d.ts.map +0 -1
- package/dist/types/utilities/RovingTabIndex/RovingTabindexRoot.d.ts.map +0 -1
- package/dist/types/utilities/RovingTabIndex/index.d.ts +0 -4
- package/dist/types/utilities/RovingTabIndex/index.d.ts.map +0 -1
- package/dist/types/utilities/RovingTabIndex/useRovingTabindex.d.ts.map +0 -1
- package/dist/types/utilities/getSize.d.ts +0 -2
- package/dist/types/utilities/getSize.d.ts.map +0 -1
- package/dist/types/utilities/objectUtils.d.ts.map +0 -1
- package/dist/types/utilities/useDebounce.d.ts +0 -4
- package/dist/types/utilities/useDebounce.d.ts.map +0 -1
- /package/dist/cjs/node_modules/{@radix-ui/react-slot/node_modules/@babel → @babel}/runtime/helpers/esm/extends.js +0 -0
- /package/dist/cjs/{hooks → utilities/hooks}/usePrevious.js +0 -0
- /package/dist/cjs/utilities/{objectUtils.js → omit/omit.js} +0 -0
- /package/dist/esm/node_modules/{@radix-ui/react-slot/node_modules/@babel → @babel}/runtime/helpers/esm/extends.js +0 -0
- /package/dist/esm/{hooks → utilities/hooks}/usePrevious.js +0 -0
- /package/dist/esm/utilities/{objectUtils.js → omit/omit.js} +0 -0
- /package/dist/types/{hooks → utilities/hooks/useIsomorphicLayoutEffect}/useIsomorphicLayoutEffect.d.ts +0 -0
- /package/dist/types/{hooks → utilities/hooks}/usePrevious.d.ts +0 -0
|
@@ -12,14 +12,27 @@ function isComboboxOption(child) {
|
|
|
12
12
|
return React.isValidElement(child) && child.type === Option.ComboboxOption;
|
|
13
13
|
}
|
|
14
14
|
function isComboboxCustom(child) {
|
|
15
|
-
return React.isValidElement(child) && child.type === Custom.
|
|
15
|
+
return React.isValidElement(child) && child.type === Custom.ComboboxCustom;
|
|
16
16
|
}
|
|
17
17
|
function isInteractiveComboboxCustom(child) {
|
|
18
18
|
return isComboboxCustom(child) && child.props.interactive === true;
|
|
19
19
|
}
|
|
20
|
+
const INTERNAL_OPTION_PREFIX = 'internal-option-';
|
|
21
|
+
/**
|
|
22
|
+
* We use this function to prefix the value of the options so we can make sure numbers as strings are not parsed as numbers in objects
|
|
23
|
+
* @param value
|
|
24
|
+
* @returns
|
|
25
|
+
*/
|
|
26
|
+
const prefix = (value) => {
|
|
27
|
+
return INTERNAL_OPTION_PREFIX + value;
|
|
28
|
+
};
|
|
29
|
+
const removePrefix = (value) => {
|
|
30
|
+
return value.slice(INTERNAL_OPTION_PREFIX.length);
|
|
31
|
+
};
|
|
20
32
|
function useCombobox({ children, inputValue, multiple, filter = (inputValue, option) => {
|
|
21
33
|
return option.label.toLowerCase().startsWith(inputValue.toLowerCase());
|
|
22
34
|
}, initialValue, }) {
|
|
35
|
+
const filterCallback = React.useCallback(filter, [filter]);
|
|
23
36
|
const { optionsChildren, customIds, restChildren, interactiveChildren } = React.useMemo(() => {
|
|
24
37
|
const allChildren = React.Children.toArray(children);
|
|
25
38
|
const result = allChildren.reduce((acc, child) => {
|
|
@@ -64,8 +77,8 @@ function useCombobox({ children, inputValue, multiple, filter = (inputValue, opt
|
|
|
64
77
|
});
|
|
65
78
|
label = childrenLabel;
|
|
66
79
|
}
|
|
67
|
-
allOptions[props.value] = {
|
|
68
|
-
value: props.value,
|
|
80
|
+
allOptions[prefix(String(props.value))] = {
|
|
81
|
+
value: String(props.value),
|
|
69
82
|
label,
|
|
70
83
|
displayValue: props.displayValue,
|
|
71
84
|
description: props.description,
|
|
@@ -73,7 +86,9 @@ function useCombobox({ children, inputValue, multiple, filter = (inputValue, opt
|
|
|
73
86
|
});
|
|
74
87
|
return allOptions;
|
|
75
88
|
}, [optionsChildren]);
|
|
76
|
-
const preSelectedOptions = React.useMemo(() => (initialValue
|
|
89
|
+
const preSelectedOptions = React.useMemo(() => (initialValue?.map((key) => {
|
|
90
|
+
return prefix(key);
|
|
91
|
+
}) || []).reduce((acc, value) => {
|
|
77
92
|
const option = options[value];
|
|
78
93
|
if (isOption(option)) {
|
|
79
94
|
acc[value] = option;
|
|
@@ -83,24 +98,33 @@ function useCombobox({ children, inputValue, multiple, filter = (inputValue, opt
|
|
|
83
98
|
const [selectedOptions, setSelectedOptions] = React.useState(preSelectedOptions);
|
|
84
99
|
const { filteredOptions, filteredOptionsChildren } = React.useMemo(() => {
|
|
85
100
|
const filteredOptions = [];
|
|
86
|
-
const filteredOptionsChildren = Object.keys(options)
|
|
101
|
+
const filteredOptionsChildren = Object.keys(options)
|
|
102
|
+
.map((option, index) => {
|
|
87
103
|
/* If we have a selected value in single mode and the input matches an option, return all children */
|
|
88
104
|
if (!multiple && Object.keys(selectedOptions).length === 1) {
|
|
89
|
-
filteredOptions.push(
|
|
105
|
+
filteredOptions.push(option);
|
|
90
106
|
return optionsChildren[index];
|
|
91
107
|
}
|
|
92
108
|
if (multiple && selectedOptions[option]) {
|
|
93
|
-
filteredOptions.push(
|
|
109
|
+
filteredOptions.push(option);
|
|
94
110
|
return optionsChildren[index];
|
|
95
111
|
}
|
|
96
|
-
if (
|
|
97
|
-
filteredOptions.push(
|
|
112
|
+
if (filterCallback(inputValue, options[option])) {
|
|
113
|
+
filteredOptions.push(option);
|
|
98
114
|
return optionsChildren[index];
|
|
99
115
|
}
|
|
100
|
-
|
|
116
|
+
return;
|
|
117
|
+
})
|
|
118
|
+
.filter((child) => child);
|
|
101
119
|
return { filteredOptions, filteredOptionsChildren };
|
|
102
|
-
|
|
103
|
-
|
|
120
|
+
}, [
|
|
121
|
+
filterCallback,
|
|
122
|
+
inputValue,
|
|
123
|
+
multiple,
|
|
124
|
+
options,
|
|
125
|
+
optionsChildren,
|
|
126
|
+
selectedOptions,
|
|
127
|
+
]);
|
|
104
128
|
return {
|
|
105
129
|
filteredOptionsChildren,
|
|
106
130
|
filteredOptions,
|
|
@@ -117,3 +141,5 @@ exports.default = useCombobox;
|
|
|
117
141
|
exports.isComboboxCustom = isComboboxCustom;
|
|
118
142
|
exports.isComboboxOption = isComboboxOption;
|
|
119
143
|
exports.isInteractiveComboboxCustom = isInteractiveComboboxCustom;
|
|
144
|
+
exports.prefix = prefix;
|
|
145
|
+
exports.removePrefix = removePrefix;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
|
-
var useDebounce = require('../../../utilities/useDebounce.js');
|
|
5
4
|
var ComboboxIdContext = require('./ComboboxIdContext.js');
|
|
5
|
+
var useDebounceCallback = require('../../../utilities/hooks/useDebounceCallback/useDebounceCallback.js');
|
|
6
6
|
|
|
7
7
|
const useComboboxKeyboard = ({ readOnly, disabled, interactiveChildren, filteredOptions, inputValue, selectedOptions, multiple, open, options, setOpen, handleSelectOption, }) => {
|
|
8
8
|
const { activeIndex } = ComboboxIdContext.useComboboxId();
|
|
@@ -69,7 +69,7 @@ const useComboboxKeyboard = ({ readOnly, disabled, interactiveChildren, filtered
|
|
|
69
69
|
break;
|
|
70
70
|
}
|
|
71
71
|
};
|
|
72
|
-
const handleKeyDown =
|
|
72
|
+
const handleKeyDown = useDebounceCallback.useDebounceCallback(handleKeyDownFunc, 20);
|
|
73
73
|
return handleKeyDown;
|
|
74
74
|
};
|
|
75
75
|
|
|
@@ -39,7 +39,7 @@ const useFloatingCombobox = ({ listRef }) => {
|
|
|
39
39
|
apply({ rects, elements }) {
|
|
40
40
|
requestAnimationFrame(() => {
|
|
41
41
|
Object.assign(elements.floating.style, {
|
|
42
|
-
width:
|
|
42
|
+
width: `${rects.reference.width}px`,
|
|
43
43
|
maxHeight: `200px`,
|
|
44
44
|
});
|
|
45
45
|
});
|
|
@@ -21,7 +21,7 @@ const Fieldset = React.forwardRef((props, ref) => {
|
|
|
21
21
|
size,
|
|
22
22
|
disabled: props?.disabled,
|
|
23
23
|
readOnly,
|
|
24
|
-
}, children: jsxRuntime.jsxs("fieldset", { ...fieldsetProps, className: lite.clsx('
|
|
24
|
+
}, children: jsxRuntime.jsxs("fieldset", { ...fieldsetProps, className: lite.clsx('ds-fieldset', !hideLegend && 'ds-fieldset--spacing', readOnly && 'ds-fieldset--readonly', className), disabled: props?.disabled, ref: ref, ...rest, children: [jsxRuntime.jsx(Label.Label, { asChild: true, size: size, children: jsxRuntime.jsx("legend", { className: 'ds-fieldset__legend', children: jsxRuntime.jsxs("span", { className: lite.clsx('ds-fieldset__legend__content', hideLegend && `ds-sr-only`), children: [readOnly && (jsxRuntime.jsx(akselIcons.PadlockLockedFillIcon, { className: 'ds-fieldset__readonly__icon', "aria-hidden": true })), legend] }) }) }), description && (jsxRuntime.jsx(Paragraph.Paragraph, { size: size, variant: 'short', asChild: true, children: jsxRuntime.jsx("div", { id: descriptionId, className: lite.clsx('ds-fieldset__description', 'ds-font-weight--regular', hideLegend && `ds-sr-only`), children: description }) })), children, jsxRuntime.jsx("div", { id: errorId, "aria-live": 'polite', "aria-relevant": 'additions removals', className: 'ds-fieldset__error-message', children: hasError && jsxRuntime.jsx(ErrorMessage.ErrorMessage, { size: size, children: error }) })] }) }));
|
|
25
25
|
});
|
|
26
26
|
Fieldset.displayName = 'Fieldset';
|
|
27
27
|
|
|
@@ -7,14 +7,14 @@ var lite = require('../../../node_modules/clsx/dist/lite.js');
|
|
|
7
7
|
var akselIcons = require('@navikt/aksel-icons');
|
|
8
8
|
var useNativeSelect = require('./useNativeSelect.js');
|
|
9
9
|
var Label = require('../../Typography/Label/Label.js');
|
|
10
|
-
var
|
|
10
|
+
var omit = require('../../../utilities/omit/omit.js');
|
|
11
11
|
var ErrorMessage = require('../../Typography/ErrorMessage/ErrorMessage.js');
|
|
12
12
|
var Paragraph = require('../../Typography/Paragraph/Paragraph.js');
|
|
13
13
|
|
|
14
14
|
const NativeSelect = React.forwardRef((props, ref) => {
|
|
15
15
|
const { children, disabled = false, label, description, hideLabel = false, error, className, htmlSize = 0, ...rest } = props;
|
|
16
16
|
const { selectProps, descriptionId, errorId, readOnly = false, size = 'md', } = useNativeSelect.useNativeSelect(props);
|
|
17
|
-
return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { className: lite.clsx('
|
|
17
|
+
return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { className: lite.clsx('ds-native-select--container', readOnly && 'ds-native-select--readonly', error && 'ds-native-select--error'), children: [label && (jsxRuntime.jsxs(Label.Label, { weight: 'medium', size: size, htmlFor: selectProps.id, className: lite.clsx('ds-native-select__label', hideLabel && 'ds-sr-only'), children: [readOnly && (jsxRuntime.jsx(akselIcons.PadlockLockedFillIcon, { "aria-hidden": true, className: 'ds-native-select__readonly__icon' })), label] })), description && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsx("div", { id: descriptionId, className: lite.clsx(`ds-native-select__description`, hideLabel && `ds-sr-only`), children: description }) })), jsxRuntime.jsx("div", { className: 'ds-native-select__wrapper', children: jsxRuntime.jsx("select", { disabled: disabled || readOnly, ref: ref, size: htmlSize, className: lite.clsx('ds-native-select', `ds-native-select--${size}`, `ds-focus`, props.multiple && 'ds-native-select--multiple', className), ...omit.omit(['size', 'error', 'errorId'], rest), ...omit.omit(['readOnly', 'disabled'], selectProps), children: children }) }), error && (jsxRuntime.jsx("div", { id: errorId, className: 'ds-native-select__error-message', "aria-live": 'polite', "aria-relevant": 'additions removals', children: jsxRuntime.jsx(ErrorMessage.ErrorMessage, { size: size, children: error }) }))] }) }));
|
|
18
18
|
});
|
|
19
19
|
NativeSelect.displayName = 'NativeSelect';
|
|
20
20
|
|
|
@@ -4,13 +4,11 @@
|
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var useFormField = require('../useFormField.js');
|
|
6
6
|
var FieldsetContext = require('../Fieldset/FieldsetContext.js');
|
|
7
|
-
var getSize = require('../../../utilities/getSize.js');
|
|
8
7
|
|
|
9
8
|
/** Handles props for `NativeSelect` in context with `Fieldset` */
|
|
10
9
|
const useNativeSelect = (props) => {
|
|
11
10
|
const fieldset = React.useContext(FieldsetContext.FieldsetContext);
|
|
12
|
-
const { inputProps: selectProps, readOnly, ...rest } = useFormField.useFormField(props, 'select');
|
|
13
|
-
const size = getSize.getSize(fieldset?.size ?? props.size ?? 'md');
|
|
11
|
+
const { inputProps: selectProps, readOnly, size = fieldset?.size ?? 'md', ...rest } = useFormField.useFormField(props, 'select');
|
|
14
12
|
return {
|
|
15
13
|
...rest,
|
|
16
14
|
readOnly,
|
|
@@ -15,7 +15,7 @@ const RadioGroup = React.forwardRef(({ onChange, children, value, readOnly, defa
|
|
|
15
15
|
name: name ?? `radiogroup-name-${nameId}`,
|
|
16
16
|
onChange,
|
|
17
17
|
required,
|
|
18
|
-
}, children: jsxRuntime.jsx("div", { className: lite.clsx('
|
|
18
|
+
}, children: jsxRuntime.jsx("div", { className: lite.clsx('ds-radio-group', inline && 'ds-radio-group--horizontal'), children: children }) }) }));
|
|
19
19
|
});
|
|
20
20
|
RadioGroup.displayName = 'RadioGroup';
|
|
21
21
|
|
|
@@ -6,13 +6,13 @@ var React = require('react');
|
|
|
6
6
|
var lite = require('../../../node_modules/clsx/dist/lite.js');
|
|
7
7
|
var useRadio = require('./useRadio.js');
|
|
8
8
|
var Paragraph = require('../../Typography/Paragraph/Paragraph.js');
|
|
9
|
-
var
|
|
9
|
+
var omit = require('../../../utilities/omit/omit.js');
|
|
10
10
|
var Label = require('../../Typography/Label/Label.js');
|
|
11
11
|
|
|
12
12
|
const Radio = React.forwardRef((props, ref) => {
|
|
13
13
|
const { children, description, className, style, ...rest } = props;
|
|
14
14
|
const { inputProps, descriptionId, hasError, size = 'md', readOnly, } = useRadio.useRadio(props);
|
|
15
|
-
return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { className: lite.clsx('
|
|
15
|
+
return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { className: lite.clsx('ds-radio', `ds-radio--${size}`, hasError && `ds-radio--error`, readOnly && `ds-radio--readonly`, className), style: style, children: [jsxRuntime.jsx("input", { className: 'ds-radio__input', disabled: inputProps.disabled, ref: ref, ...omit.omit(['size', 'error'], rest), ...inputProps }), children && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Label.Label, { className: lite.clsx('ds-radio__label'), htmlFor: inputProps.id, size: size, weight: 'regular', children: jsxRuntime.jsx("span", { children: children }) }), description && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsx("div", { id: descriptionId, className: 'ds-radio__description', children: description }) }))] }))] }) }));
|
|
16
16
|
});
|
|
17
17
|
Radio.displayName = 'Radio';
|
|
18
18
|
|
|
@@ -10,8 +10,7 @@ var useSearch = require('./useSearch.js');
|
|
|
10
10
|
var Button = require('../../Button/Button.js');
|
|
11
11
|
var Paragraph = require('../../Typography/Paragraph/Paragraph.js');
|
|
12
12
|
var Label = require('../../Typography/Label/Label.js');
|
|
13
|
-
var
|
|
14
|
-
var ErrorMessage = require('../../Typography/ErrorMessage/ErrorMessage.js');
|
|
13
|
+
var omit = require('../../../utilities/omit/omit.js');
|
|
15
14
|
|
|
16
15
|
/** Search field
|
|
17
16
|
*
|
|
@@ -22,7 +21,7 @@ var ErrorMessage = require('../../Typography/ErrorMessage/ErrorMessage.js');
|
|
|
22
21
|
*/
|
|
23
22
|
const Search = React.forwardRef((props, ref) => {
|
|
24
23
|
const { label, style, hideLabel = true, variant = 'simple', searchButtonLabel = 'Søk', clearButtonLabel = 'Tøm', defaultValue, value, onChange, onClear, disabled, onSearchClick, htmlSize = 27, className, ...rest } = props;
|
|
25
|
-
const { inputProps,
|
|
24
|
+
const { inputProps, size = 'md' } = useSearch.useSearch(props);
|
|
26
25
|
const inputRef = React.useRef();
|
|
27
26
|
const mergedRef = floatingUi_react.useMergeRefs([ref, inputRef]);
|
|
28
27
|
const [internalValue, setInternalValue] = React.useState(defaultValue ?? '');
|
|
@@ -41,9 +40,9 @@ const Search = React.forwardRef((props, ref) => {
|
|
|
41
40
|
};
|
|
42
41
|
const isSimple = variant === 'simple';
|
|
43
42
|
const showClearButton = Boolean(value ?? internalValue) && !disabled;
|
|
44
|
-
return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { style: style, className: lite.clsx('
|
|
45
|
-
? '
|
|
46
|
-
: '
|
|
43
|
+
return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { style: style, className: lite.clsx('ds-search', inputProps.disabled && 'ds-search--disabled', `ds-search--${size}`, className), children: [label && (jsxRuntime.jsx(Label.Label, { size: size, weight: 'medium', htmlFor: inputProps.id, className: lite.clsx('ds-search__label', hideLabel && 'ds-sr-only'), children: jsxRuntime.jsx("span", { children: label }) })), jsxRuntime.jsxs("div", { className: 'ds-search__field', children: [jsxRuntime.jsxs("div", { className: lite.clsx('ds-search__field', `ds-search--${size}`), children: [isSimple && (jsxRuntime.jsx(akselIcons.MagnifyingGlassIcon, { className: 'ds-search__icon', "aria-hidden": true })), jsxRuntime.jsx("input", { ref: mergedRef, size: htmlSize, value: value ?? internalValue, disabled: disabled, className: lite.clsx('ds-search__input', `ds-focus`, isSimple
|
|
44
|
+
? 'ds-search__input--simple'
|
|
45
|
+
: 'ds-search__input--with-search-button'), ...omit.omit(['size', 'error', 'errorId', 'readOnly'], rest), ...inputProps, onChange: handleChange }), showClearButton && (jsxRuntime.jsxs("button", { className: lite.clsx('ds-search__clear-button', `ds-focus`), type: 'button', onClick: handleClear, disabled: disabled, children: [jsxRuntime.jsx("span", { className: `ds-sr-only`, children: clearButtonLabel }), jsxRuntime.jsx(akselIcons.XMarkIcon, { "aria-hidden": true })] }))] }), !isSimple && (jsxRuntime.jsx(Button.Button, { className: 'ds-search__search-button', size: size, variant: variant, type: 'submit', onClick: handleSearchClick, disabled: disabled, children: searchButtonLabel }))] })] }) }));
|
|
47
46
|
});
|
|
48
47
|
Search.displayName = 'Search';
|
|
49
48
|
|
|
@@ -4,13 +4,11 @@
|
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var useFormField = require('../useFormField.js');
|
|
6
6
|
var FieldsetContext = require('../Fieldset/FieldsetContext.js');
|
|
7
|
-
var getSize = require('../../../utilities/getSize.js');
|
|
8
7
|
|
|
9
8
|
/** Handles props for `Search` in context with `Fieldset` */
|
|
10
9
|
const useSearch = (props) => {
|
|
11
10
|
const fieldset = React.useContext(FieldsetContext.FieldsetContext);
|
|
12
|
-
const { inputProps, readOnly, ...rest } = useFormField.useFormField(props, 'search');
|
|
13
|
-
const size = fieldset?.size ?? getSize.getSize(props.size || 'md');
|
|
11
|
+
const { inputProps, readOnly, size = fieldset?.size ?? 'md', ...rest } = useFormField.useFormField(props, 'search');
|
|
14
12
|
return {
|
|
15
13
|
...rest,
|
|
16
14
|
readOnly,
|
|
@@ -7,13 +7,13 @@ var lite = require('../../../node_modules/clsx/dist/lite.js');
|
|
|
7
7
|
var akselIcons = require('@navikt/aksel-icons');
|
|
8
8
|
var useSwitch = require('./useSwitch.js');
|
|
9
9
|
var Paragraph = require('../../Typography/Paragraph/Paragraph.js');
|
|
10
|
-
var
|
|
10
|
+
var omit = require('../../../utilities/omit/omit.js');
|
|
11
11
|
var Label = require('../../Typography/Label/Label.js');
|
|
12
12
|
|
|
13
13
|
const Switch = React.forwardRef((props, ref) => {
|
|
14
14
|
const { children, description, position = 'left', className, ...rest } = props;
|
|
15
15
|
const { inputProps, descriptionId, size = 'md', readOnly, } = useSwitch.useSwitch(props);
|
|
16
|
-
return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { className: lite.clsx(`
|
|
16
|
+
return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { className: lite.clsx(`ds-switch`, `ds-switch--${size}`, inputProps.disabled && `ds-switch--disabled`, readOnly && `ds-switch--readonly`, className), children: [jsxRuntime.jsx("input", { className: `ds-switch__input`, disabled: inputProps.disabled, ref: ref, ...omit.omit(['size', 'error'], rest), ...inputProps }), jsxRuntime.jsxs(Label.Label, { className: lite.clsx(`ds-switch__label`, position === 'right' && `ds-switch__label--right`), htmlFor: inputProps.id, size: size, weight: 'regular', children: [jsxRuntime.jsx("span", { className: `ds-switch__track`, children: jsxRuntime.jsx("span", { className: `ds-switch__thumb` }) }), readOnly && (jsxRuntime.jsx(akselIcons.PadlockLockedFillIcon, { "aria-hidden": true, className: `ds-switch__readonly__icon` })), children && jsxRuntime.jsx("span", { children: children })] }), description && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsx("div", { id: descriptionId, className: `ds-switch__description`, children: description }) }))] }) }));
|
|
17
17
|
});
|
|
18
18
|
Switch.displayName = 'Switch';
|
|
19
19
|
|
|
@@ -9,7 +9,7 @@ var CharacterCounter = require('../CharacterCounter.js');
|
|
|
9
9
|
var useTextarea = require('./useTextarea.js');
|
|
10
10
|
var Paragraph = require('../../Typography/Paragraph/Paragraph.js');
|
|
11
11
|
var Label = require('../../Typography/Label/Label.js');
|
|
12
|
-
var
|
|
12
|
+
var omit = require('../../../utilities/omit/omit.js');
|
|
13
13
|
var ErrorMessage = require('../../Typography/ErrorMessage/ErrorMessage.js');
|
|
14
14
|
|
|
15
15
|
/** Textarea field
|
|
@@ -26,10 +26,10 @@ const Textarea = React.forwardRef((props, ref) => {
|
|
|
26
26
|
const characterLimitId = `${textareaProps.id}-charactercount}`;
|
|
27
27
|
const hasCharacterLimit = characterLimit != null;
|
|
28
28
|
const describedBy = lite.clsx(textareaProps['aria-describedby'], hasCharacterLimit && characterLimitId) || undefined;
|
|
29
|
-
return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { style: style, className: lite.clsx('
|
|
29
|
+
return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { style: style, className: lite.clsx('ds-textarea', `ds-textarea--${size}`, hasError && `ds-textarea--error`, className), children: [label && (jsxRuntime.jsxs(Label.Label, { size: size, weight: 'medium', htmlFor: textareaProps.id, className: lite.clsx('ds-textarea__label', hideLabel && `ds-sr-only`), children: [readOnly && (jsxRuntime.jsx(akselIcons.PadlockLockedFillIcon, { "aria-hidden": true, className: 'ds-textarea__readonly-icon' })), jsxRuntime.jsx("span", { children: label })] })), description && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsx("div", { id: descriptionId, className: lite.clsx('ds-textarea__description', hideLabel && `ds-sr-only`), children: description }) })), jsxRuntime.jsx("textarea", { className: lite.clsx('ds-textarea__input', `ds-focus`), ref: ref, "aria-describedby": describedBy, disabled: textareaProps.disabled, readOnly: readOnly, ...omit.omit(['size', 'error', 'errorId'], rest), ...textareaProps, onChange: (e) => {
|
|
30
30
|
textareaProps?.onChange?.(e);
|
|
31
31
|
setValue(e.target.value);
|
|
32
|
-
} }), hasCharacterLimit && (jsxRuntime.jsx(CharacterCounter.CharacterCounter, { size: size, value: value ? value.toString() : '', id: characterLimitId, ...characterLimit })), jsxRuntime.jsx("div", { className: '
|
|
32
|
+
} }), hasCharacterLimit && (jsxRuntime.jsx(CharacterCounter.CharacterCounter, { size: size, value: value ? value.toString() : '', id: characterLimitId, ...characterLimit })), jsxRuntime.jsx("div", { className: 'ds-textarea__error-message', id: errorId, "aria-live": 'polite', "aria-relevant": 'additions removals', children: hasError && jsxRuntime.jsx(ErrorMessage.ErrorMessage, { size: size, children: props.error }) })] }) }));
|
|
33
33
|
});
|
|
34
34
|
Textarea.displayName = 'Textarea';
|
|
35
35
|
|
|
@@ -4,13 +4,11 @@
|
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var useFormField = require('../useFormField.js');
|
|
6
6
|
var FieldsetContext = require('../Fieldset/FieldsetContext.js');
|
|
7
|
-
var getSize = require('../../../utilities/getSize.js');
|
|
8
7
|
|
|
9
8
|
/** Handles props for `Textarea` in context with `Fieldset` */
|
|
10
9
|
const useTextarea = (props) => {
|
|
11
10
|
const fieldset = React.useContext(FieldsetContext.FieldsetContext);
|
|
12
|
-
const { inputProps, readOnly, ...rest } = useFormField.useFormField(props, 'textarea');
|
|
13
|
-
const size = fieldset?.size ?? getSize.getSize(props.size ?? 'md');
|
|
11
|
+
const { inputProps, readOnly, size = fieldset?.size ?? 'md', ...rest } = useFormField.useFormField(props, 'textarea');
|
|
14
12
|
return {
|
|
15
13
|
...rest,
|
|
16
14
|
readOnly,
|
|
@@ -9,7 +9,7 @@ var CharacterCounter = require('../CharacterCounter.js');
|
|
|
9
9
|
var useTextfield = require('./useTextfield.js');
|
|
10
10
|
var Paragraph = require('../../Typography/Paragraph/Paragraph.js');
|
|
11
11
|
var Label = require('../../Typography/Label/Label.js');
|
|
12
|
-
var
|
|
12
|
+
var omit = require('../../../utilities/omit/omit.js');
|
|
13
13
|
var ErrorMessage = require('../../Typography/ErrorMessage/ErrorMessage.js');
|
|
14
14
|
|
|
15
15
|
/** Text input field
|
|
@@ -26,10 +26,10 @@ const Textfield = React.forwardRef((props, ref) => {
|
|
|
26
26
|
const characterLimitId = `textfield-charactercount-${React.useId()}`;
|
|
27
27
|
const hasCharacterLimit = characterLimit != null;
|
|
28
28
|
const describedBy = lite.clsx(inputProps['aria-describedby'], hasCharacterLimit && characterLimitId) || undefined;
|
|
29
|
-
return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { style: style, className: lite.clsx(`
|
|
29
|
+
return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { style: style, className: lite.clsx(`ds-textfield`, `ds-textfield--${size}`, readOnly && `ds-textfield--readonly`, hasError && `ds-textfield--error`, className), children: [label && (jsxRuntime.jsxs(Label.Label, { size: size, weight: 'medium', htmlFor: inputProps.id, className: lite.clsx(`ds-textfield__label`, hideLabel && `ds-sr-only`), children: [readOnly && (jsxRuntime.jsx(akselIcons.PadlockLockedFillIcon, { "aria-hidden": true, className: 'ds-textfield__readonly__icon' })), jsxRuntime.jsx("span", { children: label })] })), description && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsx("div", { id: descriptionId, className: lite.clsx(`ds-textfield__description`, hideLabel && `ds-sr-only`), children: description }) })), jsxRuntime.jsxs("div", { className: 'ds-textfield__field', children: [prefix && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, variant: 'short', children: jsxRuntime.jsx("div", { className: lite.clsx(`ds-textfield__adornment`, `ds-textfield__prefix`), "aria-hidden": 'true', children: prefix }) })), jsxRuntime.jsx("input", { className: lite.clsx(`ds-textfield__input`, `ds-focus`, prefix && `ds-textfield__input--with-prefix`, suffix && `ds-textfield__input--with-suffix`), ref: ref, type: type, disabled: inputProps.disabled, "aria-describedby": describedBy, size: htmlSize, ...omit.omit(['size', 'error', 'errorId'], rest), ...inputProps, onChange: (e) => {
|
|
30
30
|
inputProps?.onChange?.(e);
|
|
31
31
|
setInputValue(e.target.value);
|
|
32
|
-
} }), suffix && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, variant: 'short', children: jsxRuntime.jsx("div", { className: lite.clsx(`
|
|
32
|
+
} }), suffix && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, variant: 'short', children: jsxRuntime.jsx("div", { className: lite.clsx(`ds-textfield__adornment`, `ds-textfield__suffix`), "aria-hidden": 'true', children: suffix }) }))] }), hasCharacterLimit && (jsxRuntime.jsx(CharacterCounter.CharacterCounter, { size: size, value: inputValue ? inputValue.toString() : '', id: characterLimitId, ...characterLimit })), jsxRuntime.jsx("div", { className: 'ds-textfield__error-message', id: errorId, "aria-live": 'polite', "aria-relevant": 'additions removals', children: hasError && jsxRuntime.jsx(ErrorMessage.ErrorMessage, { size: size, children: props.error }) })] }) }));
|
|
33
33
|
});
|
|
34
34
|
Textfield.displayName = 'Textfield';
|
|
35
35
|
|
|
@@ -4,13 +4,11 @@
|
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var useFormField = require('../useFormField.js');
|
|
6
6
|
var FieldsetContext = require('../Fieldset/FieldsetContext.js');
|
|
7
|
-
var getSize = require('../../../utilities/getSize.js');
|
|
8
7
|
|
|
9
8
|
/** Handles props for `Textfield` in context with `Fieldset` */
|
|
10
9
|
const useTextfield = (props) => {
|
|
11
10
|
const fieldset = React.useContext(FieldsetContext.FieldsetContext);
|
|
12
|
-
const { inputProps, readOnly, ...rest } = useFormField.useFormField(props, 'textfield');
|
|
13
|
-
const size = getSize.getSize(fieldset?.size ?? props.size ?? 'md');
|
|
11
|
+
const { inputProps, readOnly, size = fieldset?.size ?? 'md', ...rest } = useFormField.useFormField(props, 'textfield');
|
|
14
12
|
return {
|
|
15
13
|
...rest,
|
|
16
14
|
readOnly,
|
|
@@ -3,7 +3,6 @@
|
|
|
3
3
|
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var lite = require('../../node_modules/clsx/dist/lite.js');
|
|
6
|
-
var getSize = require('../../utilities/getSize.js');
|
|
7
6
|
var FieldsetContext = require('./Fieldset/FieldsetContext.js');
|
|
8
7
|
|
|
9
8
|
/**
|
|
@@ -15,10 +14,10 @@ const useFormField = (props, prefix) => {
|
|
|
15
14
|
const id = props.id ?? `${prefix}-${randomId}`;
|
|
16
15
|
const errorId = props.errorId ?? `${prefix}-error-${randomId}`;
|
|
17
16
|
const descriptionId = `${prefix}-description-${randomId}`;
|
|
17
|
+
const size = props.size ?? fieldset?.size ?? 'md';
|
|
18
18
|
const disabled = fieldset?.disabled || props?.disabled;
|
|
19
19
|
const readOnly = ((fieldset?.readOnly || props?.readOnly) && !disabled) || undefined;
|
|
20
20
|
const hasError = !disabled && !readOnly && !!(props.error || fieldset?.error);
|
|
21
|
-
const size = getSize.getSize(props.size || fieldset?.size || 'md');
|
|
22
21
|
return {
|
|
23
22
|
readOnly,
|
|
24
23
|
hasError,
|
|
@@ -29,7 +28,9 @@ const useFormField = (props, prefix) => {
|
|
|
29
28
|
id,
|
|
30
29
|
disabled,
|
|
31
30
|
'aria-invalid': hasError ? true : undefined,
|
|
32
|
-
'aria-describedby': lite.clsx(props['aria-describedby'],
|
|
31
|
+
'aria-describedby': lite.clsx(props['aria-describedby'], !!props?.description &&
|
|
32
|
+
typeof props?.description === 'string' &&
|
|
33
|
+
descriptionId, hasError && !fieldset?.error && errorId, hasError && !!fieldset?.error && fieldset?.errorId) || undefined,
|
|
33
34
|
},
|
|
34
35
|
};
|
|
35
36
|
};
|
package/dist/cjs/index.js
CHANGED
|
@@ -2,6 +2,12 @@
|
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
4
|
var ErrorSummaryList = require('./components/ErrorSummary/ErrorSummaryList.js');
|
|
5
|
+
var useSynchronizedAnimation = require('./utilities/hooks/useSynchronizedAnimation/useSynchronizedAnimation.js');
|
|
6
|
+
var useIsomorphicLayoutEffect = require('./utilities/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.js');
|
|
7
|
+
var RovingFocusRoot = require('./utilities/RovingFocus/RovingFocusRoot.js');
|
|
8
|
+
var useRovingFocus = require('./utilities/RovingFocus/useRovingFocus.js');
|
|
9
|
+
var RovingFocusItem = require('./utilities/RovingFocus/RovingFocusItem.js');
|
|
10
|
+
var omit = require('./utilities/omit/omit.js');
|
|
5
11
|
var Button = require('./components/Button/Button.js');
|
|
6
12
|
var HelpText = require('./components/HelpText/HelpText.js');
|
|
7
13
|
var Spinner = require('./components/Spinner/Spinner.js');
|
|
@@ -17,9 +23,10 @@ var Ingress = require('./components/Typography/Ingress/Ingress.js');
|
|
|
17
23
|
var Label = require('./components/Typography/Label/Label.js');
|
|
18
24
|
var ErrorMessage = require('./components/Typography/ErrorMessage/ErrorMessage.js');
|
|
19
25
|
var index$1 = require('./components/Accordion/index.js');
|
|
20
|
-
var
|
|
21
|
-
var
|
|
22
|
-
var
|
|
26
|
+
var AccordionRoot = require('./components/Accordion/AccordionRoot.js');
|
|
27
|
+
var AccordionItem = require('./components/Accordion/AccordionItem.js');
|
|
28
|
+
var AccordionContent = require('./components/Accordion/AccordionContent.js');
|
|
29
|
+
var AccordionHeading = require('./components/Accordion/AccordionHeading.js');
|
|
23
30
|
var NativeSelect = require('./components/form/NativeSelect/NativeSelect.js');
|
|
24
31
|
var Alert = require('./components/Alert/Alert.js');
|
|
25
32
|
var Tag = require('./components/Tag/Tag.js');
|
|
@@ -46,12 +53,15 @@ var Switch = require('./components/form/Switch/Switch.js');
|
|
|
46
53
|
var Textfield = require('./components/form/Textfield/Textfield.js');
|
|
47
54
|
var Textarea = require('./components/form/Textarea/Textarea.js');
|
|
48
55
|
var index$6 = require('./components/Tabs/index.js');
|
|
49
|
-
var
|
|
50
|
-
var
|
|
51
|
-
var
|
|
56
|
+
var TabsRoot = require('./components/Tabs/TabsRoot.js');
|
|
57
|
+
var Tab = require('./components/Tabs/Tab.js');
|
|
58
|
+
var TabList = require('./components/Tabs/TabList.js');
|
|
59
|
+
var TabContent = require('./components/Tabs/TabContent.js');
|
|
52
60
|
var index$7 = require('./components/ToggleGroup/index.js');
|
|
61
|
+
var ToggleGroupRoot = require('./components/ToggleGroup/ToggleGroupRoot.js');
|
|
53
62
|
var ToggleGroupItem = require('./components/ToggleGroup/ToggleGroupItem/ToggleGroupItem.js');
|
|
54
63
|
var index$8 = require('./components/Popover/index.js');
|
|
64
|
+
var PopoverRoot = require('./components/Popover/PopoverRoot.js');
|
|
55
65
|
var PopoverContent = require('./components/Popover/PopoverContent.js');
|
|
56
66
|
var PopoverTrigger = require('./components/Popover/PopoverTrigger.js');
|
|
57
67
|
var Divider = require('./components/Divider/Divider.js');
|
|
@@ -62,6 +72,7 @@ var ModalHeader = require('./components/Modal/ModalHeader.js');
|
|
|
62
72
|
var ModalTrigger = require('./components/Modal/ModalTrigger.js');
|
|
63
73
|
var ModalDialog = require('./components/Modal/ModalDialog.js');
|
|
64
74
|
var index$a = require('./components/DropdownMenu/index.js');
|
|
75
|
+
var DropdownMenuRoot = require('./components/DropdownMenu/DropdownMenuRoot.js');
|
|
65
76
|
var DropdownMenuContent = require('./components/DropdownMenu/DropdownMenuContent.js');
|
|
66
77
|
var DropdownMenuGroup = require('./components/DropdownMenu/DropdownMenuGroup.js');
|
|
67
78
|
var DropdownMenuItem = require('./components/DropdownMenu/DropdownMenuItem.js');
|
|
@@ -94,6 +105,14 @@ var ErrorSummaryHeading = require('./components/ErrorSummary/ErrorSummaryHeading
|
|
|
94
105
|
|
|
95
106
|
|
|
96
107
|
exports.ErrorSummaryList = ErrorSummaryList;
|
|
108
|
+
exports.useSynchronizedAnimation = useSynchronizedAnimation.useSynchronizedAnimation;
|
|
109
|
+
exports.useIsomorphicLayoutEffect = useIsomorphicLayoutEffect.useIsomorphicLayoutEffect;
|
|
110
|
+
exports.RovingFocusRoot = RovingFocusRoot.RovingFocusRoot;
|
|
111
|
+
exports.useRovingFocus = useRovingFocus.useRovingFocus;
|
|
112
|
+
exports.RovingFocusItem = RovingFocusItem.RovingFocusItem;
|
|
113
|
+
exports.getNextFocusableValue = RovingFocusItem.getNextFocusableValue;
|
|
114
|
+
exports.getPrevFocusableValue = RovingFocusItem.getPrevFocusableValue;
|
|
115
|
+
exports.omit = omit.omit;
|
|
97
116
|
exports.Button = Button.Button;
|
|
98
117
|
exports.HelpText = HelpText.HelpText;
|
|
99
118
|
exports.Spinner = Spinner.Spinner;
|
|
@@ -110,9 +129,10 @@ exports.Ingress = Ingress.Ingress;
|
|
|
110
129
|
exports.Label = Label.Label;
|
|
111
130
|
exports.ErrorMessage = ErrorMessage.ErrorMessage;
|
|
112
131
|
exports.Accordion = index$1.Accordion;
|
|
132
|
+
exports.AccordionRoot = AccordionRoot.AccordionRoot;
|
|
113
133
|
exports.AccordionItem = AccordionItem.AccordionItem;
|
|
114
134
|
exports.AccordionContent = AccordionContent.AccordionContent;
|
|
115
|
-
exports.
|
|
135
|
+
exports.AccordionHeading = AccordionHeading.AccordionHeading;
|
|
116
136
|
exports.NativeSelect = NativeSelect.NativeSelect;
|
|
117
137
|
exports.Alert = Alert.Alert;
|
|
118
138
|
exports.Tag = Tag.Tag;
|
|
@@ -122,11 +142,11 @@ exports.ChipRemovable = Removable.RemovableChip;
|
|
|
122
142
|
exports.ChipToggle = Toggle.ToggleChip;
|
|
123
143
|
exports.usePagination = usePagination.usePagination;
|
|
124
144
|
exports.Pagination = index$3.Pagination;
|
|
125
|
-
exports.PaginationRoot = PaginationRoot.
|
|
145
|
+
exports.PaginationRoot = PaginationRoot.PaginationRoot;
|
|
126
146
|
exports.PaginationContent = PaginationContent.PaginationContent;
|
|
127
|
-
exports.PaginationItem = PaginationItem.
|
|
147
|
+
exports.PaginationItem = PaginationItem.PaginationItem;
|
|
128
148
|
exports.PaginationButton = PaginationButton.PaginationButton;
|
|
129
|
-
exports.PaginationEllipsis = PaginationEllipsis.
|
|
149
|
+
exports.PaginationEllipsis = PaginationEllipsis.PaginationEllipsis;
|
|
130
150
|
exports.PaginationNext = PaginationNextPrev.PaginationNext;
|
|
131
151
|
exports.PaginationPrevious = PaginationNextPrev.PaginationPrevious;
|
|
132
152
|
exports.SkipLink = SkipLink.SkipLink;
|
|
@@ -140,12 +160,15 @@ exports.Switch = Switch.Switch;
|
|
|
140
160
|
exports.Textfield = Textfield.Textfield;
|
|
141
161
|
exports.Textarea = Textarea.Textarea;
|
|
142
162
|
exports.Tabs = index$6.Tabs;
|
|
163
|
+
exports.TabsRoot = TabsRoot.TabsRoot;
|
|
143
164
|
exports.Tab = Tab.Tab;
|
|
144
165
|
exports.TabList = TabList.TabList;
|
|
145
166
|
exports.TabContent = TabContent.TabContent;
|
|
146
167
|
exports.ToggleGroup = index$7.ToggleGroup;
|
|
168
|
+
exports.ToggleGroupRoot = ToggleGroupRoot.ToggleGroupRoot;
|
|
147
169
|
exports.ToggleGroupItem = ToggleGroupItem.ToggleGroupItem;
|
|
148
170
|
exports.Popover = index$8.Popover;
|
|
171
|
+
exports.PopoverRoot = PopoverRoot.PopoverRoot;
|
|
149
172
|
exports.PopoverContent = PopoverContent.PopoverContent;
|
|
150
173
|
exports.PopoverTrigger = PopoverTrigger.PopoverTrigger;
|
|
151
174
|
exports.Divider = Divider.Divider;
|
|
@@ -156,6 +179,7 @@ exports.ModalHeader = ModalHeader.ModalHeader;
|
|
|
156
179
|
exports.ModalTrigger = ModalTrigger.ModalTrigger;
|
|
157
180
|
exports.ModalDialog = ModalDialog.ModalDialog;
|
|
158
181
|
exports.DropdownMenu = index$a.DropdownMenu;
|
|
182
|
+
exports.DropdownMenuRoot = DropdownMenuRoot.DropdownMenuRoot;
|
|
159
183
|
exports.DropdownMenuContent = DropdownMenuContent.DropdownMenuContent;
|
|
160
184
|
exports.DropdownMenuGroup = DropdownMenuGroup.DropdownMenuGroup;
|
|
161
185
|
exports.DropdownMenuItem = DropdownMenuItem.DropdownMenuItem;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
|
-
var _extends = require('
|
|
4
|
+
var _extends = require('../../../@babel/runtime/helpers/esm/extends.js');
|
|
5
5
|
var React = require('react');
|
|
6
6
|
var index = require('../../react-compose-refs/dist/index.js');
|
|
7
7
|
|