@digdir/designsystemet-react 1.0.0-next.15 → 1.0.0-next.17

package/dist/cjs/components/form/Combobox/useFloatingCombobox.js

@@ -6,7 +6,7 @@ var React = require('react');
 var ReactDOM = require('react-dom');
 var ComboboxIdContext = require('./ComboboxIdContext.js');
 var floatingUi_dom = require('../../../node_modules/@floating-ui/dom/dist/floating-ui.dom.js');
-var floatingUi_core = require('../../../node_modules/@floating-ui/core/dist/floating-ui.core.js');
+var floatingUi_reactDom = require('../../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js');
 
 const useFloatingCombobox = ({ listRef }) => {
     const [open, setOpen] = React.useState(false);
@@ -34,8 +34,8 @@ const useFloatingCombobox = ({ listRef }) => {
             };
         },
         middleware: [
-            floatingUi_dom.flip({ padding: 10 }),
-            floatingUi_dom.size({
+            floatingUi_reactDom.flip({ padding: 10 }),
+            floatingUi_reactDom.size({
                 apply({ rects, elements }) {
                     requestAnimationFrame(() => {
                         Object.assign(elements.floating.style, {
@@ -45,7 +45,7 @@ const useFloatingCombobox = ({ listRef }) => {
                     });
                 },
             }),
-            floatingUi_core.offset(10),
+            floatingUi_reactDom.offset(10),
         ],
     });
     const role = floatingUi_react.useRole(context, { role: 'listbox' });

package/dist/cjs/components/form/Combobox/utilities.js

@@ -26,9 +26,20 @@ const prefix = (value) => {
 const removePrefix = (value) => {
     return value.slice(INTERNAL_OPTION_PREFIX.length);
 };
+const setReactInputValue = (input, value) => {
+    const previousValue = input.value;
+    input.value = value;
+    const tracker = input._valueTracker;
+    if (typeof tracker !== 'undefined') {
+        tracker.setValue(previousValue);
+    }
+    //'change' instead of 'input', see https://github.com/facebook/react/issues/11488#issuecomment-381590324
+    input.dispatchEvent(new Event('change', { bubbles: true }));
+};
 
 exports.isComboboxCustom = isComboboxCustom;
 exports.isComboboxOption = isComboboxOption;
 exports.isInteractiveComboboxCustom = isInteractiveComboboxCustom;
 exports.prefix = prefix;
 exports.removePrefix = removePrefix;
+exports.setReactInputValue = setReactInputValue;

package/dist/cjs/components/form/NativeSelect/NativeSelect.js

@@ -13,8 +13,8 @@ var Paragraph = require('../../Typography/Paragraph/Paragraph.js');
 
 const NativeSelect = React.forwardRef((props, ref) => {
     const { children, disabled = false, label, description, hideLabel = false, error, className, htmlSize = 0, ...rest } = props;
-    const { selectProps, descriptionId, errorId, readOnly = false, size = 'md', } = useNativeSelect.useNativeSelect(props);
-    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 }) }))] }) }));
+    const { selectProps, descriptionId, errorId, readOnly, size = 'md', } = useNativeSelect.useNativeSelect(props);
+    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, 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 }) }))] }) }));
 });
 NativeSelect.displayName = 'NativeSelect';
 

package/dist/cjs/components/form/NativeSelect/useNativeSelect.js

@@ -8,7 +8,7 @@ var useFormField = require('../useFormField.js');
 /** Handles props for `NativeSelect` in context with `Fieldset` */
 const useNativeSelect = (props) => {
     const fieldset = React.useContext(FieldsetContext.FieldsetContext);
-    const { inputProps: selectProps, readOnly, size = fieldset?.size ?? 'md', ...rest } = useFormField.useFormField(props, 'select');
+    const { inputProps: selectProps, readOnly = false, size = fieldset?.size ?? 'md', ...rest } = useFormField.useFormField(props, 'select');
     return {
         ...rest,
         readOnly,
@@ -23,6 +23,24 @@ const useNativeSelect = (props) => {
                 }
                 props?.onClick?.(e);
             },
+            onKeyDown: (e) => {
+                if (readOnly) {
+                    if (e.key === 'Tab')
+                        return;
+                    e.preventDefault();
+                    return;
+                }
+                props?.onKeyDown?.(e);
+            },
+            onMouseDown: (e) => {
+                if (readOnly) {
+                    e.preventDefault();
+                    if (e.target instanceof HTMLElement)
+                        e.target.focus();
+                    return;
+                }
+                props?.onMouseDown?.(e);
+            },
             onChange: (e) => {
                 if (readOnly) {
                     e.preventDefault();

package/dist/cjs/components/form/Radio/{Group/Group.js → RadioGroup.js}

@@ -2,9 +2,9 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var lite = require('../../../../node_modules/clsx/dist/lite.js');
+var lite = require('../../../node_modules/clsx/dist/lite.js');
 var React = require('react');
-var Fieldset = require('../../Fieldset/Fieldset.js');
+var Fieldset = require('../Fieldset/Fieldset.js');
 
 const RadioGroupContext = React.createContext(null);
 const RadioGroup = React.forwardRef(({ onChange, children, value, readOnly, defaultValue, name, size = 'md', required, inline, className, ...rest }, ref) => {
@@ -15,7 +15,7 @@ const RadioGroup = React.forwardRef(({ onChange, children, value, readOnly, defa
                 name: name ?? `radiogroup-name-${nameId}`,
                 onChange,
                 required,
-            }, children: jsxRuntime.jsx("div", { className: lite.clsx('ds-radio-group', inline && 'ds-radio-group--horizontal'), children: children }) }) }));
+            }, children: jsxRuntime.jsx("div", { className: lite.clsx('ds-radio__group', `ds-radio__group--${size}`, inline && 'ds-radio__group--horizontal'), children: children }) }) }));
 });
 RadioGroup.displayName = 'RadioGroup';
 

package/dist/cjs/components/form/Radio/index.js

@@ -2,12 +2,12 @@
 'use strict';
 
 var Radio$1 = require('./Radio.js');
-var Group = require('./Group/Group.js');
+var RadioGroup = require('./RadioGroup.js');
 
 /** `<input> element with `type="radio"` used for selecting one option */
 const Radio = Radio$1.Radio;
-Radio.Group = Group.RadioGroup;
+Radio.Group = RadioGroup.RadioGroup;
 Radio.Group.displayName = 'Radio.Group';
 
-exports.RadioGroup = Group.RadioGroup;
+exports.RadioGroup = RadioGroup.RadioGroup;
 exports.Radio = Radio;

package/dist/cjs/components/form/Radio/useRadio.js

@@ -3,11 +3,11 @@
 
 var React = require('react');
 var useFormField = require('../useFormField.js');
-var Group = require('./Group/Group.js');
+var RadioGroup = require('./RadioGroup.js');
 
 /** Handles props for `Radio` in context with `Radio.Group` (and `Fieldset`) */
 const useRadio = (props) => {
-    const radioGroup = React.useContext(Group.RadioGroupContext);
+    const radioGroup = React.useContext(RadioGroup.RadioGroupContext);
     const { inputProps, readOnly, ...rest } = useFormField.useFormField(props, 'radio');
     return {
         ...rest,

package/dist/cjs/components/form/Switch/useSwitch.js

@@ -2,12 +2,12 @@
 'use strict';
 
 var React = require('react');
+var CheckboxGroup = require('../Checkbox/CheckboxGroup.js');
 var useFormField = require('../useFormField.js');
-var Group = require('../Checkbox/Group/Group.js');
 
 /** Handles props for `Switch` in context with `Checkbox.Group` (and `Fieldset`) */
 const useSwitch = (props) => {
-    const checkboxGroup = React.useContext(Group.CheckboxGroupContext);
+    const checkboxGroup = React.useContext(CheckboxGroup.CheckboxGroupContext);
     const { inputProps, readOnly, ...rest } = useFormField.useFormField(props, 'switch');
     const propsValue = props.value || '';
     return {

package/dist/cjs/index.js

@@ -9,10 +9,17 @@ var useRovingFocus = require('./utilities/RovingFocus/useRovingFocus.js');
 var RovingFocusItem = require('./utilities/RovingFocus/RovingFocusItem.js');
 var omit = require('./utilities/omit/omit.js');
 var Button = require('./components/Button/Button.js');
+var Badge = require('./components/Badge/Badge.js');
+var index = require('./components/Breadcrumbs/index.js');
+var BreadcrumbsRoot = require('./components/Breadcrumbs/BreadcrumbsRoot.js');
+var BreadcrumbsNav = require('./components/Breadcrumbs/BreadcrumbsNav.js');
+var BreadcrumbsList = require('./components/Breadcrumbs/BreadcrumbsList.js');
+var BreadcrumbsItem = require('./components/Breadcrumbs/BreadcrumbsItem.js');
+var BreadcrumbsLink = require('./components/Breadcrumbs/BreadcrumbsLink.js');
 var HelpText = require('./components/HelpText/HelpText.js');
 var Spinner = require('./components/Spinner/Spinner.js');
 var Link = require('./components/Link/Link.js');
-var index = require('./components/List/index.js');
+var index$1 = require('./components/List/index.js');
 var ListRoot = require('./components/List/ListRoot.js');
 var ListItem = require('./components/List/ListItem.js');
 var ListHeading = require('./components/List/ListHeading.js');
@@ -22,7 +29,7 @@ var Heading = require('./components/Typography/Heading/Heading.js');
 var Ingress = require('./components/Typography/Ingress/Ingress.js');
 var Label = require('./components/Typography/Label/Label.js');
 var ErrorMessage = require('./components/Typography/ErrorMessage/ErrorMessage.js');
-var index$1 = require('./components/Accordion/index.js');
+var index$2 = require('./components/Accordion/index.js');
 var AccordionRoot = require('./components/Accordion/AccordionRoot.js');
 var AccordionItem = require('./components/Accordion/AccordionItem.js');
 var AccordionContent = require('./components/Accordion/AccordionContent.js');
@@ -30,12 +37,12 @@ var AccordionHeading = require('./components/Accordion/AccordionHeading.js');
 var NativeSelect = require('./components/form/NativeSelect/NativeSelect.js');
 var Alert = require('./components/Alert/Alert.js');
 var Tag = require('./components/Tag/Tag.js');
-var index$2 = require('./components/Chip/index.js');
+var index$3 = require('./components/Chip/index.js');
 var Group = require('./components/Chip/Group/Group.js');
 var Removable = require('./components/Chip/Removable/Removable.js');
 var Toggle = require('./components/Chip/Toggle/Toggle.js');
 var usePagination = require('./components/Pagination/usePagination.js');
-var index$3 = require('./components/Pagination/index.js');
+var index$4 = require('./components/Pagination/index.js');
 var PaginationRoot = require('./components/Pagination/PaginationRoot.js');
 var PaginationContent = require('./components/Pagination/PaginationContent.js');
 var PaginationItem = require('./components/Pagination/PaginationItem.js');
@@ -44,60 +51,61 @@ var PaginationEllipsis = require('./components/Pagination/PaginationEllipsis.js'
 var PaginationNextPrev = require('./components/Pagination/PaginationNextPrev.js');
 var SkipLink = require('./components/SkipLink/SkipLink.js');
 var Tooltip = require('./components/Tooltip/Tooltip.js');
-var index$4 = require('./components/form/Checkbox/index.js');
-var Group$1 = require('./components/form/Checkbox/Group/Group.js');
-var index$5 = require('./components/form/Radio/index.js');
-var Group$2 = require('./components/form/Radio/Group/Group.js');
+var index$5 = require('./components/form/Checkbox/index.js');
+var CheckboxGroup = require('./components/form/Checkbox/CheckboxGroup.js');
+var index$6 = require('./components/form/Radio/index.js');
+var RadioGroup = require('./components/form/Radio/RadioGroup.js');
 var Fieldset = require('./components/form/Fieldset/Fieldset.js');
 var Switch = require('./components/form/Switch/Switch.js');
 var Textfield = require('./components/form/Textfield/Textfield.js');
 var Textarea = require('./components/form/Textarea/Textarea.js');
-var index$6 = require('./components/Tabs/index.js');
+var index$7 = require('./components/Tabs/index.js');
 var TabsRoot = require('./components/Tabs/TabsRoot.js');
 var Tab = require('./components/Tabs/Tab.js');
 var TabList = require('./components/Tabs/TabList.js');
 var TabContent = require('./components/Tabs/TabContent.js');
-var index$7 = require('./components/ToggleGroup/index.js');
+var index$8 = require('./components/ToggleGroup/index.js');
 var ToggleGroupRoot = require('./components/ToggleGroup/ToggleGroupRoot.js');
 var ToggleGroupItem = require('./components/ToggleGroup/ToggleGroupItem/ToggleGroupItem.js');
-var index$8 = require('./components/Popover/index.js');
+var index$9 = require('./components/Popover/index.js');
 var PopoverRoot = require('./components/Popover/PopoverRoot.js');
 var PopoverContent = require('./components/Popover/PopoverContent.js');
 var PopoverTrigger = require('./components/Popover/PopoverTrigger.js');
 var Divider = require('./components/Divider/Divider.js');
-var index$9 = require('./components/Modal/index.js');
+var index$a = require('./components/Modal/index.js');
+var ModalRoot = require('./components/Modal/ModalRoot.js');
 var ModaContent = require('./components/Modal/ModaContent.js');
 var ModalFooter = require('./components/Modal/ModalFooter.js');
 var ModalHeader = require('./components/Modal/ModalHeader.js');
 var ModalTrigger = require('./components/Modal/ModalTrigger.js');
 var ModalDialog = require('./components/Modal/ModalDialog.js');
-var index$a = require('./components/DropdownMenu/index.js');
+var index$b = require('./components/DropdownMenu/index.js');
 var DropdownMenuRoot = require('./components/DropdownMenu/DropdownMenuRoot.js');
 var DropdownMenuContent = require('./components/DropdownMenu/DropdownMenuContent.js');
 var DropdownMenuGroup = require('./components/DropdownMenu/DropdownMenuGroup.js');
 var DropdownMenuItem = require('./components/DropdownMenu/DropdownMenuItem.js');
 var DropdownMenuTrigger = require('./components/DropdownMenu/DropdownMenuTrigger.js');
 var Search = require('./components/form/Search/Search.js');
-var index$b = require('./components/Skeleton/index.js');
+var index$c = require('./components/Skeleton/index.js');
 var Circle = require('./components/Skeleton/Circle/Circle.js');
 var Rectangle = require('./components/Skeleton/Rectangle/Rectangle.js');
 var Text = require('./components/Skeleton/Text/Text.js');
 var Box = require('./components/Box/Box.js');
-var index$c = require('./components/Card/index.js');
+var index$d = require('./components/Card/index.js');
 var CardHeader = require('./components/Card/CardHeader.js');
 var CardContent = require('./components/Card/CardContent.js');
 var CardFooter = require('./components/Card/CardFooter.js');
 var CardMedia = require('./components/Card/CardMedia.js');
-var index$d = require('./components/form/Combobox/index.js');
+var index$e = require('./components/form/Combobox/index.js');
 var Option = require('./components/form/Combobox/Option/Option.js');
 var Empty = require('./components/form/Combobox/Empty.js');
-var index$e = require('./components/Table/index.js');
+var index$f = require('./components/Table/index.js');
 var TableHead = require('./components/Table/TableHead.js');
 var TableBody = require('./components/Table/TableBody.js');
 var TableRow = require('./components/Table/TableRow.js');
 var TableCell = require('./components/Table/TableCell.js');
 var TableHeaderCell = require('./components/Table/TableHeaderCell.js');
-var index$f = require('./components/ErrorSummary/index.js');
+var index$g = require('./components/ErrorSummary/index.js');
 var ErrorSummaryRoot = require('./components/ErrorSummary/ErrorSummaryRoot.js');
 var ErrorSummaryItem = require('./components/ErrorSummary/ErrorSummaryItem.js');
 var ErrorSummaryHeading = require('./components/ErrorSummary/ErrorSummaryHeading.js');
@@ -114,10 +122,17 @@ exports.getNextFocusableValue = RovingFocusItem.getNextFocusableValue;
 exports.getPrevFocusableValue = RovingFocusItem.getPrevFocusableValue;
 exports.omit = omit.omit;
 exports.Button = Button.Button;
+exports.Badge = Badge.Badge;
+exports.Breadcrumbs = index.Breadcrumbs;
+exports.BreadcrumbsRoot = BreadcrumbsRoot.BreadcrumbsRoot;
+exports.BreadcrumbsNav = BreadcrumbsNav.BreadcrumbsNav;
+exports.BreadcrumbsList = BreadcrumbsList.BreadcrumbsList;
+exports.BreadcrumbsItem = BreadcrumbsItem.BreadcrumbsItem;
+exports.BreadcrumbsLink = BreadcrumbsLink.BreadcrumbsLink;
 exports.HelpText = HelpText.HelpText;
 exports.Spinner = Spinner.Spinner;
 exports.Link = Link.Link;
-exports.List = index.List;
+exports.List = index$1.List;
 exports.ListRoot = ListRoot.ListRoot;
 exports.ListItem = ListItem.ListItem;
 exports.ListHeading = ListHeading.ListHeading;
@@ -128,7 +143,7 @@ exports.Heading = Heading.Heading;
 exports.Ingress = Ingress.Ingress;
 exports.Label = Label.Label;
 exports.ErrorMessage = ErrorMessage.ErrorMessage;
-exports.Accordion = index$1.Accordion;
+exports.Accordion = index$2.Accordion;
 exports.AccordionRoot = AccordionRoot.AccordionRoot;
 exports.AccordionItem = AccordionItem.AccordionItem;
 exports.AccordionContent = AccordionContent.AccordionContent;
@@ -136,12 +151,12 @@ exports.AccordionHeading = AccordionHeading.AccordionHeading;
 exports.NativeSelect = NativeSelect.NativeSelect;
 exports.Alert = Alert.Alert;
 exports.Tag = Tag.Tag;
-exports.Chip = index$2.Chip;
+exports.Chip = index$3.Chip;
 exports.ChipGroup = Group.Group;
 exports.ChipRemovable = Removable.RemovableChip;
 exports.ChipToggle = Toggle.ToggleChip;
 exports.usePagination = usePagination.usePagination;
-exports.Pagination = index$3.Pagination;
+exports.Pagination = index$4.Pagination;
 exports.PaginationRoot = PaginationRoot.PaginationRoot;
 exports.PaginationContent = PaginationContent.PaginationContent;
 exports.PaginationItem = PaginationItem.PaginationItem;
@@ -151,60 +166,61 @@ exports.PaginationNext = PaginationNextPrev.PaginationNext;
 exports.PaginationPrevious = PaginationNextPrev.PaginationPrevious;
 exports.SkipLink = SkipLink.SkipLink;
 exports.Tooltip = Tooltip.Tooltip;
-exports.Checkbox = index$4.Checkbox;
-exports.CheckboxGroup = Group$1.CheckboxGroup;
-exports.Radio = index$5.Radio;
-exports.RadioGroup = Group$2.RadioGroup;
+exports.Checkbox = index$5.Checkbox;
+exports.CheckboxGroup = CheckboxGroup.CheckboxGroup;
+exports.Radio = index$6.Radio;
+exports.RadioGroup = RadioGroup.RadioGroup;
 exports.Fieldset = Fieldset.Fieldset;
 exports.Switch = Switch.Switch;
 exports.Textfield = Textfield.Textfield;
 exports.Textarea = Textarea.Textarea;
-exports.Tabs = index$6.Tabs;
+exports.Tabs = index$7.Tabs;
 exports.TabsRoot = TabsRoot.TabsRoot;
 exports.Tab = Tab.Tab;
 exports.TabList = TabList.TabList;
 exports.TabContent = TabContent.TabContent;
-exports.ToggleGroup = index$7.ToggleGroup;
+exports.ToggleGroup = index$8.ToggleGroup;
 exports.ToggleGroupRoot = ToggleGroupRoot.ToggleGroupRoot;
 exports.ToggleGroupItem = ToggleGroupItem.ToggleGroupItem;
-exports.Popover = index$8.Popover;
+exports.Popover = index$9.Popover;
 exports.PopoverRoot = PopoverRoot.PopoverRoot;
 exports.PopoverContent = PopoverContent.PopoverContent;
 exports.PopoverTrigger = PopoverTrigger.PopoverTrigger;
 exports.Divider = Divider.Divider;
-exports.Modal = index$9.Modal;
+exports.Modal = index$a.Modal;
+exports.ModalRoot = ModalRoot.ModalRoot;
 exports.ModalContent = ModaContent.ModalContent;
 exports.ModalFooter = ModalFooter.ModalFooter;
 exports.ModalHeader = ModalHeader.ModalHeader;
 exports.ModalTrigger = ModalTrigger.ModalTrigger;
 exports.ModalDialog = ModalDialog.ModalDialog;
-exports.DropdownMenu = index$a.DropdownMenu;
+exports.DropdownMenu = index$b.DropdownMenu;
 exports.DropdownMenuRoot = DropdownMenuRoot.DropdownMenuRoot;
 exports.DropdownMenuContent = DropdownMenuContent.DropdownMenuContent;
 exports.DropdownMenuGroup = DropdownMenuGroup.DropdownMenuGroup;
 exports.DropdownMenuItem = DropdownMenuItem.DropdownMenuItem;
 exports.DropdownMenuTrigger = DropdownMenuTrigger.DropdownMenuTrigger;
 exports.Search = Search.Search;
-exports.Skeleton = index$b.Skeleton;
+exports.Skeleton = index$c.Skeleton;
 exports.SkeletonCircle = Circle.Circle;
 exports.SkeletonRectangle = Rectangle.Rectangle;
 exports.SkeletonText = Text.Text;
 exports.Box = Box.Box;
-exports.Card = index$c.Card;
+exports.Card = index$d.Card;
 exports.CardHeader = CardHeader.CardHeader;
 exports.CardContent = CardContent.CardContent;
 exports.CardFooter = CardFooter.CardFooter;
 exports.CardMedia = CardMedia.CardMedia;
-exports.Combobox = index$d.Combobox;
+exports.Combobox = index$e.Combobox;
 exports.ComboboxOption = Option.ComboboxOption;
 exports.ComboboxEmpty = Empty.ComboboxEmpty;
-exports.Table = index$e.Table;
+exports.Table = index$f.Table;
 exports.TableHead = TableHead.TableHead;
 exports.TableBody = TableBody.TableBody;
 exports.TableRow = TableRow.TableRow;
 exports.TableCell = TableCell.TableCell;
 exports.TableHeaderCell = TableHeaderCell.TableHeaderCell;
-exports.ErrorSummary = index$f.ErrorSummary;
+exports.ErrorSummary = index$g.ErrorSummary;
 exports.ErrorSummaryRoot = ErrorSummaryRoot.ErrorSummaryRoot;
 exports.ErrorSummaryItem = ErrorSummaryItem.ErrorSummaryItem;
 exports.ErrorSummaryHeading = ErrorSummaryHeading.ErrorSummaryHeading;

package/dist/cjs/node_modules/@floating-ui/core/dist/floating-ui.core.js

@@ -188,9 +188,10 @@ async function detectOverflow(state, options) {
     strategy
   }));
   const rect = elementContext === 'floating' ? {
-    ...rects.floating,
     x,
-    y
+    y,
+    width: rects.floating.width,
+    height: rects.floating.height
   } : rects.reference;
   const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
   const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
@@ -337,10 +338,12 @@ const flip = function (options) {
         return {};
       }
       const side = floatingUi_utils.getSide(placement);
+      const initialSideAxis = floatingUi_utils.getSideAxis(initialPlacement);
       const isBasePlacement = floatingUi_utils.getSide(initialPlacement) === initialPlacement;
       const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
       const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [floatingUi_utils.getOppositePlacement(initialPlacement)] : floatingUi_utils.getExpandedPlacements(initialPlacement));
-      if (!specifiedFallbackPlacements && fallbackAxisSideDirection !== 'none') {
+      const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== 'none';
+      if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) {
         fallbackPlacements.push(...floatingUi_utils.getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
       }
       const placements = [initialPlacement, ...fallbackPlacements];
@@ -386,8 +389,17 @@ const flip = function (options) {
           switch (fallbackStrategy) {
             case 'bestFit':
               {
-                var _overflowsData$map$so;
-                const placement = (_overflowsData$map$so = overflowsData.map(d => [d.placement, d.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$map$so[0];
+                var _overflowsData$filter2;
+                const placement = (_overflowsData$filter2 = overflowsData.filter(d => {
+                  if (hasFallbackAxisSideDirection) {
+                    const currentSideAxis = floatingUi_utils.getSideAxis(d.placement);
+                    return currentSideAxis === initialSideAxis ||
+                    // Create a bias to the `y` side axis due to horizontal
+                    // reading directions favoring greater width.
+                    currentSideAxis === 'y';
+                  }
+                  return true;
+                }).map(d => [d.placement, d.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$filter2[0];
                 if (placement) {
                   resetPlacement = placement;
                 }
@@ -427,6 +439,8 @@ async function convertValueToCoords(state, options) {
   const mainAxisMulti = ['left', 'top'].includes(side) ? -1 : 1;
   const crossAxisMulti = rtl && isVertical ? -1 : 1;
   const rawValue = floatingUi_utils.evaluate(options, state);
+
+  // eslint-disable-next-line prefer-const
   let {
     mainAxis,
     crossAxis,
@@ -609,16 +623,16 @@ const size = function (options) {
         widthSide = side;
         heightSide = alignment === 'end' ? 'top' : 'bottom';
       }
-      const overflowAvailableHeight = height - overflow[heightSide];
-      const overflowAvailableWidth = width - overflow[widthSide];
+      const maximumClippingHeight = height - overflow.top - overflow.bottom;
+      const maximumClippingWidth = width - overflow.left - overflow.right;
+      const overflowAvailableHeight = floatingUi_utils.min(height - overflow[heightSide], maximumClippingHeight);
+      const overflowAvailableWidth = floatingUi_utils.min(width - overflow[widthSide], maximumClippingWidth);
       const noShift = !state.middlewareData.shift;
       let availableHeight = overflowAvailableHeight;
       let availableWidth = overflowAvailableWidth;
       if (isYAxis) {
-        const maximumClippingWidth = width - overflow.left - overflow.right;
         availableWidth = alignment || noShift ? floatingUi_utils.min(overflowAvailableWidth, maximumClippingWidth) : maximumClippingWidth;
       } else {
-        const maximumClippingHeight = height - overflow.top - overflow.bottom;
         availableHeight = alignment || noShift ? floatingUi_utils.min(overflowAvailableHeight, maximumClippingHeight) : maximumClippingHeight;
       }
       if (noShift && !alignment) {

package/dist/cjs/node_modules/@floating-ui/dom/dist/floating-ui.dom.js

@@ -132,17 +132,6 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
   });
 }
 
-const topLayerSelectors = [':popover-open', ':modal'];
-function isTopLayer(floating) {
-  return topLayerSelectors.some(selector => {
-    try {
-      return floating.matches(selector);
-    } catch (e) {
-      return false;
-    }
-  });
-}
-
 function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
   let {
     elements,
@@ -152,7 +141,7 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
   } = _ref;
   const isFixed = strategy === 'fixed';
   const documentElement = floatingUi_utils_dom.getDocumentElement(offsetParent);
-  const topLayer = elements ? isTopLayer(elements.floating) : false;
+  const topLayer = elements ? floatingUi_utils_dom.isTopLayer(elements.floating) : false;
   if (offsetParent === documentElement || topLayer && isFixed) {
     return rect;
   }
@@ -324,7 +313,7 @@ function getClippingRect(_ref) {
     rootBoundary,
     strategy
   } = _ref;
-  const elementClippingAncestors = boundary === 'clippingAncestors' ? getClippingElementAncestors(element, this._c) : [].concat(boundary);
+  const elementClippingAncestors = boundary === 'clippingAncestors' ? floatingUi_utils_dom.isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
   const clippingAncestors = [...elementClippingAncestors, rootBoundary];
   const firstClippingAncestor = clippingAncestors[0];
   const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
@@ -386,6 +375,10 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
   };
 }
 
+function isStaticPositioned(element) {
+  return floatingUi_utils_dom.getComputedStyle(element).position === 'static';
+}
+
 function getTrueOffsetParent(element, polyfill) {
   if (!floatingUi_utils_dom.isHTMLElement(element) || floatingUi_utils_dom.getComputedStyle(element).position === 'fixed') {
     return null;
@@ -399,29 +392,41 @@ function getTrueOffsetParent(element, polyfill) {
 // Gets the closest ancestor positioned element. Handles some edge cases,
 // such as table ancestors and cross browser bugs.
 function getOffsetParent(element, polyfill) {
-  const window = floatingUi_utils_dom.getWindow(element);
-  if (!floatingUi_utils_dom.isHTMLElement(element) || isTopLayer(element)) {
-    return window;
+  const win = floatingUi_utils_dom.getWindow(element);
+  if (floatingUi_utils_dom.isTopLayer(element)) {
+    return win;
+  }
+  if (!floatingUi_utils_dom.isHTMLElement(element)) {
+    let svgOffsetParent = floatingUi_utils_dom.getParentNode(element);
+    while (svgOffsetParent && !floatingUi_utils_dom.isLastTraversableNode(svgOffsetParent)) {
+      if (floatingUi_utils_dom.isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
+        return svgOffsetParent;
+      }
+      svgOffsetParent = floatingUi_utils_dom.getParentNode(svgOffsetParent);
+    }
+    return win;
   }
   let offsetParent = getTrueOffsetParent(element, polyfill);
-  while (offsetParent && floatingUi_utils_dom.isTableElement(offsetParent) && floatingUi_utils_dom.getComputedStyle(offsetParent).position === 'static') {
+  while (offsetParent && floatingUi_utils_dom.isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
     offsetParent = getTrueOffsetParent(offsetParent, polyfill);
   }
-  if (offsetParent && (floatingUi_utils_dom.getNodeName(offsetParent) === 'html' || floatingUi_utils_dom.getNodeName(offsetParent) === 'body' && floatingUi_utils_dom.getComputedStyle(offsetParent).position === 'static' && !floatingUi_utils_dom.isContainingBlock(offsetParent))) {
-    return window;
+  if (offsetParent && floatingUi_utils_dom.isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !floatingUi_utils_dom.isContainingBlock(offsetParent)) {
+    return win;
   }
-  return offsetParent || floatingUi_utils_dom.getContainingBlock(element) || window;
+  return offsetParent || floatingUi_utils_dom.getContainingBlock(element) || win;
 }
 
 const getElementRects = async function (data) {
   const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
   const getDimensionsFn = this.getDimensions;
+  const floatingDimensions = await getDimensionsFn(data.floating);
   return {
     reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
     floating: {
       x: 0,
       y: 0,
-      ...(await getDimensionsFn(data.floating))
+      width: floatingDimensions.width,
+      height: floatingDimensions.height
     }
   };
 };
@@ -491,9 +496,11 @@ function observeMove(element, onMove) {
           return refresh();
         }
         if (!ratio) {
+          // If the reference is clipped, the ratio is 0. Throttle the refresh
+          // to prevent an infinite loop of updates.
           timeoutId = setTimeout(() => {
             refresh(false, 1e-7);
-          }, 100);
+          }, 1000);
         } else {
           refresh(false, ratio);
         }
@@ -597,6 +604,15 @@ function autoUpdate(reference, floating, update, options) {
   };
 }
 
+/**
+ * Modifies the placement by translating the floating element along the
+ * specified axes.
+ * A number (shorthand for `mainAxis` or distance), or an axes configuration
+ * object may be passed.
+ * @see https://floating-ui.com/docs/offset
+ */
+const offset = floatingUi_core.offset;
+
 /**
  * Optimizes the visibility of the floating element by shifting it in order to
  * keep it in view when it will overflow the clipping boundary.
@@ -650,13 +666,12 @@ const computePosition = (reference, floating, options) => {
   });
 };
 
-exports.detectOverflow = floatingUi_core.detectOverflow;
-exports.offset = floatingUi_core.offset;
 exports.getOverflowAncestors = floatingUi_utils_dom.getOverflowAncestors;
 exports.arrow = arrow;
 exports.autoUpdate = autoUpdate;
 exports.computePosition = computePosition;
 exports.flip = flip;
+exports.offset = offset;
 exports.platform = platform;
 exports.shift = shift;
 exports.size = size;