@digdir/designsystemet-react 0.55.1-alpha.0 → 0.56.0

package/dist/cjs/react-css-modules.css

@@ -79,7 +79,7 @@
   gap: var(--fds-sizing-1);
   font: var(--fds-typography-paragraph-short-small);
   font-family: inherit;
-  min-height: var(--fds-sizing-10);
+  min-height: var(--fds-sizing-8);
 }
 
 .fds-button-medium-8fa00f0f {
@@ -88,7 +88,7 @@
   gap: var(--fds-sizing-2);
   font: var(--fds-typography-paragraph-short-medium);
   font-family: inherit;
-  min-height: var(--fds-sizing-12);
+  min-height: var(--fds-sizing-10);
 }
 
 .fds-button-large-8fa00f0f {
@@ -97,7 +97,7 @@
   gap: var(--fds-sizing-2);
   font: var(--fds-typography-paragraph-short-large);
   font-family: inherit;
-  min-height: var(--fds-sizing-14);
+  min-height: var(--fds-sizing-12);
 }
 
 .fds-button-fullWidth-8fa00f0f {
@@ -1064,19 +1064,19 @@
 .fds-nativeselect-select-2e95d79c.fds-nativeselect-small-2e95d79c {
   padding: 0 var(--fds-spacing-2);
   padding-right: var(--fds-spacing-8);
-  height: var(--fds-sizing-10);
+  height: var(--fds-sizing-8);
 }
 
 .fds-nativeselect-select-2e95d79c.fds-nativeselect-medium-2e95d79c {
   padding: 0 var(--fds-spacing-3);
   padding-right: var(--fds-spacing-10);
-  height: var(--fds-sizing-12);
+  height: var(--fds-sizing-10);
 }
 
 .fds-nativeselect-select-2e95d79c.fds-nativeselect-large-2e95d79c {
   padding: 0 var(--fds-spacing-4);
   padding-right: var(--fds-spacing-12);
-  height: var(--fds-sizing-14);
+  height: var(--fds-sizing-12);
 }
 
 .fds-nativeselect-formField-2e95d79c {
@@ -1179,18 +1179,18 @@
 }
 
 .fds-tag-small-40d841d9 {
-  --fdsc-tag-padding: var(--fds-spacing-2);
-  --fdsc-tag-min-height: var(--fds-sizing-7);
+  --fdsc-tag-padding: var(--fds-spacing-1);
+  --fdsc-tag-min-height: var(--fds-sizing-5);
 }
 
 .fds-tag-medium-40d841d9 {
-  --fdsc-tag-padding: var(--fds-spacing-2);
-  --fdsc-tag-min-height: var(--fds-sizing-8);
+  --fdsc-tag-padding: var(--fds-spacing-1);
+  --fdsc-tag-min-height: var(--fds-sizing-6);
 }
 
 .fds-tag-large-40d841d9 {
-  --fdsc-tag-padding: var(--fds-spacing-3);
-  --fdsc-tag-min-height: var(--fds-sizing-9);
+  --fdsc-tag-padding: var(--fds-spacing-2);
+  --fdsc-tag-min-height: var(--fds-sizing-7);
 }
 
 .fds-tag-neutral-40d841d9 {
@@ -1292,7 +1292,7 @@
   background: var(--fdsc-removable-background);
   border: 0;
   padding-right: 0;
-  min-height: var(--fdsc-chip-height);
+  min-height: var(--fdsc-removable-chip-size);
 }
 
 .fds-chip-xMark-4563db0f {
@@ -1302,6 +1302,18 @@
   padding-right: var(--fdsc-removable-chip-xmark-padding_right);
 }
 
+.fds-chip-removable-4563db0f.fds-chip-small-4563db0f {
+  --fdsc-removable-chip-size: var(--fds-sizing-6);
+}
+
+.fds-chip-removable-4563db0f.fds-chip-medium-4563db0f {
+  --fdsc-removable-chip-size: var(--fds-sizing-7);
+}
+
+.fds-chip-removable-4563db0f.fds-chip-large-4563db0f {
+  --fdsc-removable-chip-size: var(--fds-sizing-8);
+}
+
 .fds-chip-xMark-4563db0f .fds-chip-icon-4563db0f {
   height: var(--fdsc-removable-chip-xmark-size);
   width: var(--fdsc-removable-chip-xmark-size);
@@ -1375,20 +1387,20 @@
 }
 
 .fds-chip-small-4563db0f {
-  --fdsc-chip-height: var(--fds-sizing-7);
-  --fdsc-chip-padding: var(--fds-spacing-3);
+  --fdsc-chip-height: var(--fds-sizing-6);
+  --fdsc-chip-padding: var(--fds-spacing-2);
   --fdsc-removable-chip-xmark-size: var(--fds-sizing-5);
 }
 
 .fds-chip-medium-4563db0f {
-  --fdsc-chip-height: var(--fds-sizing-8);
+  --fdsc-chip-height: var(--fds-sizing-7);
   --fdsc-chip-padding: var(--fds-spacing-3);
   --fdsc-removable-chip-xmark-size: var(--fds-sizing-6);
 }
 
 .fds-chip-large-4563db0f {
-  --fdsc-chip-height: var(--fds-sizing-9);
-  --fdsc-chip-padding: var(--fds-spacing-4);
+  --fdsc-chip-height: var(--fds-sizing-8);
+  --fdsc-chip-padding: var(--fds-spacing-3);
   --fdsc-removable-chip-xmark-size: var(--fds-sizing-7);
 }
 
@@ -1432,17 +1444,17 @@
 
 .fds-pagination-listitem-ddc0278f:where(.fds-pagination-small-ddc0278f) {
   --fsdc-pagination-listitem-margin: var(--fds-spacing-2);
-  --fdsc-pagination-ellipsis-width: var(--fds-sizing-10);
+  --fdsc-pagination-ellipsis-width: var(--fds-sizing-8);
 }
 
 .fds-pagination-listitem-ddc0278f:where(.fds-pagination-medium-ddc0278f) {
   --fsdc-pagination-listitem-margin: var(--fds-spacing-4);
-  --fdsc-pagination-ellipsis-width: var(--fds-sizing-12);
+  --fdsc-pagination-ellipsis-width: var(--fds-sizing-10);
 }
 
 .fds-pagination-listitem-ddc0278f:where(.fds-pagination-large-ddc0278f) {
   --fsdc-pagination-listitem-margin: var(--fds-spacing-6);
-  --fdsc-pagination-ellipsis-width: var(--fds-sizing-14);
+  --fdsc-pagination-ellipsis-width: var(--fds-sizing-12);
 }
 
 .fds-pagination-listitem-ddc0278f:where(.fds-pagination-compact-ddc0278f) {
@@ -1635,23 +1647,23 @@
 
 .fds-checkbox-small-ad9a8b9c,
 .fds-checkbox-small-ad9a8b9c .fds-checkbox-label-ad9a8b9c {
-  min-height: var(--fds-sizing-5);
+  min-height: var(--fds-sizing-8);
 }
 
 .fds-checkbox-medium-ad9a8b9c,
 .fds-checkbox-medium-ad9a8b9c .fds-checkbox-label-ad9a8b9c {
-  min-height: var(--fds-sizing-6);
+  min-height: var(--fds-sizing-10);
 }
 
 .fds-checkbox-large-ad9a8b9c,
 .fds-checkbox-large-ad9a8b9c .fds-checkbox-label-ad9a8b9c {
-  min-height: var(--fds-sizing-7);
+  min-height: var(--fds-sizing-12);
 }
 
 .fds-checkbox-small-ad9a8b9c {
-  --fds-checkbox-size: var(--fds-sizing-5);
+  --fds-checkbox-size: 1.5rem;
 
-  min-width: var(--fds-sizing-5);
+  min-width: var(--fds-sizing-8);
 }
 
 .fds-checkbox-small-ad9a8b9c .fds-checkbox-input-ad9a8b9c {
@@ -1660,9 +1672,9 @@
 }
 
 .fds-checkbox-medium-ad9a8b9c {
-  --fds-checkbox-size: var(--fds-sizing-6);
+  --fds-checkbox-size: 1.75rem;
 
-  min-width: var(--fds-sizing-6);
+  min-width: var(--fds-sizing-10);
 }
 
 .fds-checkbox-medium-ad9a8b9c .fds-checkbox-input-ad9a8b9c {
@@ -1671,9 +1683,9 @@
 }
 
 .fds-checkbox-large-ad9a8b9c {
-  --fds-checkbox-size: var(--fds-sizing-7);
+  --fds-checkbox-size: 2rem;
 
-  min-width: var(--fds-sizing-7);
+  min-width: var(--fds-sizing-12);
 }
 
 .fds-checkbox-large-ad9a8b9c .fds-checkbox-input-ad9a8b9c {
@@ -1805,23 +1817,23 @@
 
 .fds-radio-small-7a9bd584,
 .fds-radio-small-7a9bd584 .fds-radio-label-7a9bd584 {
-  min-height: var(--fds-sizing-5);
+  min-height: var(--fds-sizing-8);
 }
 
 .fds-radio-medium-7a9bd584,
 .fds-radio-medium-7a9bd584 .fds-radio-label-7a9bd584 {
-  min-height: var(--fds-sizing-6);
+  min-height: var(--fds-sizing-10);
 }
 
 .fds-radio-large-7a9bd584,
 .fds-radio-large-7a9bd584 .fds-radio-label-7a9bd584 {
-  min-height: var(--fds-sizing-7);
+  min-height: var(--fds-sizing-12);
 }
 
 .fds-radio-small-7a9bd584 {
-  --fds-radio-size: var(--fds-sizing-5);
+  --fds-radio-size: 1.5rem;
 
-  min-width: var(--fds-sizing-5);
+  min-width: var(--fds-sizing-8);
 }
 
 .fds-radio-small-7a9bd584 .fds-radio-input-7a9bd584 {
@@ -1830,9 +1842,9 @@
 }
 
 .fds-radio-medium-7a9bd584 {
-  --fds-radio-size: var(--fds-sizing-6);
+  --fds-radio-size: 1.75rem;
 
-  min-width: var(--fds-sizing-6);
+  min-width: var(--fds-sizing-10);
 }
 
 .fds-radio-medium-7a9bd584 .fds-radio-input-7a9bd584 {
@@ -1841,9 +1853,9 @@
 }
 
 .fds-radio-large-7a9bd584 {
-  --fds-radio-size: var(--fds-sizing-7);
+  --fds-radio-size: 2rem;
 
-  min-width: var(--fds-sizing-7);
+  min-width: var(--fds-sizing-12);
 }
 
 .fds-radio-large-7a9bd584 .fds-radio-input-7a9bd584 {
@@ -1961,22 +1973,22 @@
 
 .fds-switch-small-9a6b03bc,
 .fds-switch-small-9a6b03bc .fds-switch-label-9a6b03bc {
-  min-height: var(--fds-sizing-6);
+  min-height: var(--fds-sizing-8);
 }
 
 .fds-switch-medium-9a6b03bc,
 .fds-switch-medium-9a6b03bc .fds-switch-label-9a6b03bc {
-  min-height: var(--fds-sizing-7);
+  min-height: var(--fds-sizing-10);
 }
 
 .fds-switch-large-9a6b03bc,
 .fds-switch-large-9a6b03bc .fds-switch-label-9a6b03bc {
-  min-height: var(--fds-sizing-8);
+  min-height: var(--fds-sizing-12);
 }
 
 .fds-switch-small-9a6b03bc {
-  --fds-switch-height: var(--fds-sizing-6);
-  --fds-switch-width: var(--fds-sizing-11);
+  --fds-switch-height: 1.5rem;
+  --fds-switch-width: 2.5rem;
 }
 
 .fds-switch-small-9a6b03bc .fds-switch-input-9a6b03bc {
@@ -1985,8 +1997,8 @@
 }
 
 .fds-switch-medium-9a6b03bc {
-  --fds-switch-height: var(--fds-sizing-7);
-  --fds-switch-width: var(--fds-sizing-13);
+  --fds-switch-height: 1.75rem;
+  --fds-switch-width: 3rem;
 }
 
 .fds-switch-medium-9a6b03bc .fds-switch-input-9a6b03bc {
@@ -1995,8 +2007,8 @@
 }
 
 .fds-switch-large-9a6b03bc {
-  --fds-switch-height: var(--fds-sizing-8);
-  --fds-switch-width: var(--fds-sizing-15);
+  --fds-switch-height: 2rem;
+  --fds-switch-width: 3.5rem;
 }
 
 .fds-switch-large-9a6b03bc .fds-switch-input-9a6b03bc {
@@ -2126,27 +2138,27 @@
 }
 
 .fds-textfield-formField-d98267a0.fds-textfield-small-d98267a0 .fds-textfield-adornment-d98267a0 {
-  padding: var(--fds-sizing-2) var(--fds-spacing-3);
+  padding: 6.5px var(--fds-spacing-3);
 }
 
 .fds-textfield-formField-d98267a0.fds-textfield-medium-d98267a0 .fds-textfield-adornment-d98267a0 {
-  padding: 0.65rem var(--fds-spacing-4);
+  padding: 9px var(--fds-spacing-4);
 }
 
 .fds-textfield-formField-d98267a0.fds-textfield-large-d98267a0 .fds-textfield-adornment-d98267a0 {
-  padding: 0.85rem var(--fds-spacing-5);
+  padding: 11px var(--fds-spacing-5);
 }
 
 .fds-textfield-formField-d98267a0.fds-textfield-small-d98267a0 .fds-textfield-field-d98267a0 {
-  height: var(--fds-sizing-10);
+  height: var(--fds-sizing-8);
 }
 
 .fds-textfield-formField-d98267a0.fds-textfield-medium-d98267a0 .fds-textfield-field-d98267a0 {
-  height: var(--fds-sizing-12);
+  height: var(--fds-sizing-10);
 }
 
 .fds-textfield-formField-d98267a0.fds-textfield-large-d98267a0 .fds-textfield-field-d98267a0 {
-  height: var(--fds-sizing-14);
+  height: var(--fds-sizing-12);
 }
 
 .fds-textfield-label-d98267a0 {
@@ -2634,7 +2646,7 @@
   position: absolute;
   height: 100%;
   z-index: 2;
-  left: var(--fds-spacing-4);
+  left: var(--fds-spacing-3);
   transform: scale(1.5);
   pointer-events: none;
 }
@@ -2705,42 +2717,30 @@
   z-index: 2;
 }
 
-.fds-search-small-a6b5fe3c .fds-search-input-a6b5fe3c {
+.fds-search-input-a6b5fe3c.fds-search-small-a6b5fe3c {
   --f-search-button-clear-size: var(--fds-sizing-4);
 
-  height: var(--fds-sizing-10);
-  padding: 0 var(--fds-spacing-3);
+  height: var(--fds-sizing-8);
+  padding: 0 var(--fds-spacing-2);
   padding-right: 2.5em;
 }
 
-.fds-search-small-a6b5fe3c .fds-search-icon-a6b5fe3c {
-  left: var(--fds-spacing-3);
-}
-
-.fds-search-medium-a6b5fe3c .fds-search-input-a6b5fe3c {
+.fds-search-input-a6b5fe3c.fds-search-medium-a6b5fe3c {
   --f-search-button-clear-size: var(--fds-sizing-6);
 
-  height: var(--fds-sizing-12);
-  padding: 0 var(--fds-spacing-4);
+  height: var(--fds-sizing-10);
+  padding: 0 var(--fds-spacing-3);
   padding-right: 2.2em;
 }
 
-.fds-search-medium-a6b5fe3c .fds-search-icon-a6b5fe3c {
-  left: var(--fds-spacing-4);
-}
-
-.fds-search-large-a6b5fe3c .fds-search-input-a6b5fe3c {
+.fds-search-input-a6b5fe3c.fds-search-large-a6b5fe3c {
   --f-search-button-clear-size: var(--fds-sizing-12);
 
-  height: var(--fds-sizing-14);
-  padding: 0 var(--fds-spacing-5);
+  height: var(--fds-sizing-12);
+  padding: 0 var(--fds-spacing-4);
   padding-right: 2em;
 }
 
-.fds-search-large-a6b5fe3c .fds-search-icon-a6b5fe3c {
-  left: var(--fds-spacing-5);
-}
-
 .fds-search-input-a6b5fe3c.fds-search-simple-a6b5fe3c {
   padding-left: 2.4em;
 }
@@ -3236,7 +3236,6 @@
 }
 
 .fds-combobox-inputWrapper-249a725c.fds-combobox-small-249a725c {
-  min-height: var(--fds-sizing-10);
   font: var(--fds-typography-paragraph-small);
   font-family: inherit;
   padding: 5px var(--fds-spacing-2);
@@ -3248,7 +3247,6 @@
 }
 
 .fds-combobox-inputWrapper-249a725c.fds-combobox-medium-249a725c {
-  min-height: var(--fds-sizing-12);
   font: var(--fds-typography-paragraph-medium);
   font-family: inherit;
   padding: 7px var(--fds-spacing-3);
@@ -3260,7 +3258,6 @@
 }
 
 .fds-combobox-inputWrapper-249a725c.fds-combobox-large-249a725c {
-  min-height: var(--fds-sizing-14);
   font: var(--fds-typography-paragraph-large);
   font-family: inherit;
   padding: 7px var(--fds-spacing-4);

package/dist/esm/components/Chip/Chip.module.css.js

@@ -1,4 +1,4 @@
 'use client';
-var classes = {"chip":"fds-chip-chip-4563db0f","chipButton":"fds-chip-chipButton-4563db0f","label":"fds-chip-label-4563db0f","removable":"fds-chip-removable-4563db0f","xMark":"fds-chip-xMark-4563db0f","icon":"fds-chip-icon-4563db0f","spacing":"fds-chip-spacing-4563db0f","small":"fds-chip-small-4563db0f","checkmarkIcon":"fds-chip-checkmarkIcon-4563db0f","medium":"fds-chip-medium-4563db0f","large":"fds-chip-large-4563db0f","groupContainer":"fds-chip-groupContainer-4563db0f"};
+var classes = {"chip":"fds-chip-chip-4563db0f","chipButton":"fds-chip-chipButton-4563db0f","label":"fds-chip-label-4563db0f","removable":"fds-chip-removable-4563db0f","xMark":"fds-chip-xMark-4563db0f","small":"fds-chip-small-4563db0f","medium":"fds-chip-medium-4563db0f","large":"fds-chip-large-4563db0f","icon":"fds-chip-icon-4563db0f","spacing":"fds-chip-spacing-4563db0f","checkmarkIcon":"fds-chip-checkmarkIcon-4563db0f","groupContainer":"fds-chip-groupContainer-4563db0f"};
 
 export { classes as default };

package/dist/esm/components/DropdownMenu/DropdownMenu.js

@@ -2,10 +2,10 @@
 import { jsx } from 'react/jsx-runtime';
 import { useRef, useState, useEffect, createContext } from 'react';
 
-const DropdownMenu = ({ open, onClose, placement = 'bottom-end', size = 'medium', portal, children, ...rest }) => {
+const DropdownMenu = ({ open, onClose, placement = 'bottom-end', size = 'medium', portal, children, }) => {
     const triggerRef = useRef(null);
     const [internalOpen, setInternalOpen] = useState(open ?? false);
-    const anchorEl = rest.anchorEl ?? triggerRef.current;
+    const anchorEl = triggerRef.current;
     const isControlled = typeof open === 'boolean';
     useEffect(() => {
         setInternalOpen(open ?? false);

package/dist/esm/components/Popover/Popover.js

@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
 import * as React from 'react';
 import { useRef, useState, useId } from 'react';
 
-const Popover = ({ children, placement = 'top', open, variant = 'default', size = 'medium', portal, onOpenChange, onClose, ...rest }) => {
+const Popover = ({ children, placement = 'top', open, variant = 'default', size = 'medium', portal, onOpenChange, onClose, }) => {
     const triggerRef = useRef(null);
     const [internalOpen, setInternalOpen] = useState(open ?? false);
     const randomPopoverId = useId();
@@ -14,7 +14,7 @@ const Popover = ({ children, placement = 'top', open, variant = 'default', size
     React.useEffect(() => {
         setInternalOpen(open ?? false);
     }, [open]);
-    const anchorEl = rest.anchorEl ?? triggerRef.current;
+    const anchorEl = triggerRef.current;
     return (jsx(PopoverContext.Provider, { value: {
             triggerRef,
             anchorEl,

package/dist/esm/components/Popover/PopoverContent.js

@@ -8,7 +8,7 @@ import { PopoverContext } from './Popover.js';
 import classes from './Popover.module.css.js';
 import { autoUpdate } from '../../node_modules/@floating-ui/dom/dist/floating-ui.dom.js';
 import { offset, flip, shift } from '../../node_modules/@floating-ui/core/dist/floating-ui.core.js';
-import { arrow } from '../../node_modules/@floating-ui/react/node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js';
+import { arrow } from '../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js';
 import { useIsomorphicLayoutEffect } from '../../hooks/useIsomorphicLayoutEffect.js';
 import { Paragraph } from '../Typography/Paragraph/Paragraph.js';
 
@@ -40,7 +40,7 @@ const PopoverContent = forwardRef(({ className, children, style, id, ...rest },
         },
         whileElementsMounted: autoUpdate,
         elements: {
-            reference: anchorEl,
+            reference: anchorEl ?? undefined,
             floating: floatingEl.current,
         },
         middleware: [

package/dist/esm/components/Tooltip/Tooltip.js

@@ -7,7 +7,7 @@ import { useFloating, useTransitionStyles, useInteractions, useHover, useFocus,
 import classes from './Tooltip.module.css.js';
 import { autoUpdate } from '../../node_modules/@floating-ui/dom/dist/floating-ui.dom.js';
 import { offset, flip, shift } from '../../node_modules/@floating-ui/core/dist/floating-ui.core.js';
-import { arrow } from '../../node_modules/@floating-ui/react/node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js';
+import { arrow } from '../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js';
 
 const ARROW_HEIGHT = 7;
 const ARROW_GAP = 4;

package/dist/esm/components/form/Checkbox/Checkbox.js

@@ -10,7 +10,7 @@ import { omit } from '../../../utilities/objectUtils.js';
 import { Label } from '../../Typography/Label/Label.js';
 
 const Checkbox = forwardRef((props, ref) => {
-    const { children, description, className, ...rest } = props;
+    const { children, description, className, style, ...rest } = props;
     const { inputProps, descriptionId, hasError, size = 'medium', readOnly, } = useCheckbox(props);
     const inputRef = useMergeRefs([
         ref,
@@ -20,7 +20,7 @@ const Checkbox = forwardRef((props, ref) => {
             }
         },
     ]);
-    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { className: clsx(classes.container, classes[size], inputProps.disabled && classes.disabled, hasError && classes.error, readOnly && classes.readonly, className), children: [jsx("input", { className: classes.input, ref: inputRef, ...omit(['size', 'error', 'indeterminate'], rest), ...inputProps, type: 'checkbox', "aria-checked": rest.indeterminate ? 'mixed' : inputProps.checked }), jsx(Label, { className: classes.label, htmlFor: inputProps.id, size: size, weight: 'regular', children: jsx("span", { children: children }) }), description && (jsx(Paragraph, { asChild: true, size: size, children: jsx("div", { id: descriptionId, className: classes.description, children: description }) }))] }) }));
+    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { className: clsx(classes.container, classes[size], inputProps.disabled && classes.disabled, hasError && classes.error, readOnly && classes.readonly, className), style: style, children: [jsx("input", { className: classes.input, ref: inputRef, ...omit(['size', 'error', 'indeterminate'], rest), ...inputProps, type: 'checkbox', "aria-checked": rest.indeterminate ? 'mixed' : inputProps.checked }), jsx(Label, { className: classes.label, htmlFor: inputProps.id, size: size, weight: 'regular', children: jsx("span", { children: children }) }), description && (jsx(Paragraph, { asChild: true, size: size, children: jsx("div", { id: descriptionId, className: classes.description, children: description }) }))] }) }));
 });
 Checkbox.displayName = 'Checkbox';
 

package/dist/esm/components/form/Combobox/Combobox.js

@@ -3,7 +3,8 @@ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { forwardRef, useRef, useId, useState, useEffect, createContext } from 'react';
 import { useFloating, useRole, useDismiss, useListNavigation, useInteractions, FloatingPortal, FloatingFocusManager } from '../../../node_modules/@floating-ui/react/dist/floating-ui.react.js';
 import { clsx } from '../../../node_modules/clsx/dist/clsx.js';
-import { useVirtualizer } from '../../../node_modules/@tanstack/react-virtual/build/lib/index.js';
+import { useVirtualizer } from '../../../node_modules/@tanstack/react-virtual/dist/esm/index.js';
+import { flushSync } from 'react-dom';
 import { useFormField } from '../useFormField.js';
 import useDebounce from '../../../utilities/useDebounce.js';
 import useCombobox, { isInteractiveComboboxCustom, isComboboxOption } from './useCombobox.js';
@@ -60,9 +61,23 @@ const Combobox = forwardRef(({ value, initialValue = [], onValueChange, label, h
     }, [multiple, value, options]);
     // floating UI
     const { refs, floatingStyles, context } = useFloating({
-        whileElementsMounted: autoUpdate,
         open,
-        onOpenChange: setOpen,
+        onOpenChange: (newOpen) => {
+            flushSync(() => {
+                if (refs.floating.current && !newOpen) {
+                    refs.floating.current.scrollTop = 0;
+                }
+                setTimeout(() => {
+                    setOpen(newOpen);
+                }, 1);
+            });
+        },
+        whileElementsMounted: (reference, floating, update) => {
+            autoUpdate(reference, floating, update);
+            return () => {
+                floating.scrollTop = 0;
+            };
+        },
         middleware: [
             flip({ padding: 10 }),
             size({
@@ -221,7 +236,7 @@ const Combobox = forwardRef(({ value, initialValue = [], onValueChange, label, h
     const rowVirtualizer = useVirtualizer({
         count: optionsChildren.length,
         getScrollElement: () => refs.floating.current,
-        estimateSize: () => 40,
+        estimateSize: () => 70,
         measureElement: (elem) => {
             return elem.getBoundingClientRect().height;
         },

package/dist/esm/components/form/Radio/Radio.js

@@ -9,9 +9,9 @@ import { omit } from '../../../utilities/objectUtils.js';
 import { Label } from '../../Typography/Label/Label.js';
 
 const Radio = forwardRef((props, ref) => {
-    const { children, description, className, ...rest } = props;
+    const { children, description, className, style, ...rest } = props;
     const { inputProps, descriptionId, hasError, size = 'medium', readOnly, } = useRadio(props);
-    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { className: clsx(classes.container, classes[size], inputProps.disabled && classes.disabled, hasError && classes.error, readOnly && classes.readonly, className), children: [jsx("input", { className: classes.input, ref: ref, ...omit(['size', 'error'], rest), ...inputProps }), jsx(Label, { className: classes.label, htmlFor: inputProps.id, size: size, weight: 'regular', children: jsx("span", { children: children }) }), description && (jsx(Paragraph, { asChild: true, size: size, children: jsx("div", { id: descriptionId, className: classes.description, children: description }) }))] }) }));
+    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { className: clsx(classes.container, classes[size], inputProps.disabled && classes.disabled, hasError && classes.error, readOnly && classes.readonly, className), style: style, children: [jsx("input", { className: classes.input, ref: ref, ...omit(['size', 'error'], rest), ...inputProps }), jsx(Label, { className: classes.label, htmlFor: inputProps.id, size: size, weight: 'regular', children: jsx("span", { children: children }) }), description && (jsx(Paragraph, { asChild: true, size: size, children: jsx("div", { id: descriptionId, className: classes.description, children: description }) }))] }) }));
 });
 Radio.displayName = 'Radio';
 

package/dist/esm/components/form/Search/Search.js

@@ -41,7 +41,7 @@ const Search = forwardRef((props, ref) => {
     };
     const isSimple = variant === 'simple';
     const showClearButton = Boolean(value ?? internalValue) && !disabled;
-    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { style: style, className: clsx(classes.formField, inputProps.disabled && classes.disabled, classes[size], className), children: [label && (jsx(Label, { size: size, weight: 'medium', htmlFor: inputProps.id, className: clsx(classes.label, hideLabel && utilityClasses.visuallyHidden), children: jsx("span", { children: label }) })), jsxs("div", { className: classes.field, children: [jsxs("div", { className: clsx(classes.field, classes[size]), children: [isSimple && (jsx(MagnifyingGlassIcon, { className: classes.icon, "aria-hidden": true })), jsx("input", { ref: mergedRef, size: htmlSize, value: value ?? internalValue, disabled: disabled, className: clsx(classes.input, utilityClasses.focusable, isSimple && classes.simple, !isSimple && classes.withSearchButton), ...omit(['size', 'error', 'errorId', 'readOnly'], rest), ...inputProps, onChange: handleChange }), showClearButton && (jsxs("button", { className: clsx(classes.clearButton, utilityClasses.focusable), type: 'button', onClick: handleClear, disabled: disabled, children: [jsx("span", { className: utilityClasses.visuallyHidden, children: clearButtonLabel }), jsx(XMarkIcon, { "aria-hidden": true })] }))] }), !isSimple && (jsx(Button, { className: classes.searchButton, size: size, variant: variant, type: 'submit', onClick: handleSearchClick, disabled: disabled, children: searchButtonLabel }))] }), jsx("div", { className: classes.errorMessage, id: errorId, "aria-live": 'polite', "aria-relevant": 'additions removals', children: hasError && jsx(ErrorMessage, { size: size, children: props.error }) })] }) }));
+    return (jsx(Paragraph, { asChild: true, size: size, children: jsxs("div", { style: style, className: clsx(classes.formField, inputProps.disabled && classes.disabled, classes[size], className), children: [label && (jsx(Label, { size: size, weight: 'medium', htmlFor: inputProps.id, className: clsx(classes.label, hideLabel && utilityClasses.visuallyHidden), children: jsx("span", { children: label }) })), jsxs("div", { className: classes.field, children: [jsxs("div", { className: classes.field, children: [isSimple && (jsx(MagnifyingGlassIcon, { className: classes.icon, "aria-hidden": true })), jsx("input", { ref: mergedRef, size: htmlSize, value: value ?? internalValue, disabled: disabled, className: clsx(classes.input, utilityClasses.focusable, classes[size], isSimple && classes.simple, !isSimple && classes.withSearchButton), ...omit(['size', 'error', 'errorId', 'readOnly'], rest), ...inputProps, onChange: handleChange }), showClearButton && (jsxs("button", { className: clsx(classes.clearButton, utilityClasses.focusable), type: 'button', onClick: handleClear, disabled: disabled, children: [jsx("span", { className: utilityClasses.visuallyHidden, children: clearButtonLabel }), jsx(XMarkIcon, { "aria-hidden": true })] }))] }), !isSimple && (jsx(Button, { className: classes.searchButton, size: size, variant: variant, type: 'submit', onClick: handleSearchClick, disabled: disabled, children: searchButtonLabel }))] }), jsx("div", { className: classes.errorMessage, id: errorId, "aria-live": 'polite', "aria-relevant": 'additions removals', children: hasError && jsx(ErrorMessage, { size: size, children: props.error }) })] }) }));
 });
 Search.displayName = 'Search';
 

package/dist/esm/node_modules/@floating-ui/react/dist/floating-ui.react.js

@@ -3,8 +3,8 @@ import * as React from 'react';
 import { useLayoutEffect, useEffect, useRef } from 'react';
 import { getDocument, isTypeableCombobox, activeElement, contains, isVirtualClick, isVirtualPointerEvent, isMouseLikePointerType, getTarget, isSafari, isMac, isTypeableElement, stopEvent, isReactEvent, isRootElement, isEventTargetWithin } from '../utils/dist/floating-ui.react.utils.js';
 import { floor } from '../node_modules/@floating-ui/utils/dist/floating-ui.utils.js';
-import { useFloating as useFloating$1 } from '../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js';
-export { arrow } from '../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js';
+import { useFloating as useFloating$1 } from '../../react-dom/dist/floating-ui.react-dom.js';
+export { arrow } from '../../react-dom/dist/floating-ui.react-dom.js';
 import { isElement, isHTMLElement, getWindow, getNodeName, isLastTraversableNode, getParentNode, getComputedStyle } from '../node_modules/@floating-ui/utils/dom/dist/floating-ui.utils.dom.js';
 import { tabbable } from '../../../tabbable/dist/index.esm.js';
 import { createPortal } from 'react-dom';

package/dist/esm/node_modules/@floating-ui/{react/node_modules/@floating-ui/react-dom → react-dom}/dist/floating-ui.react-dom.js

@@ -1,11 +1,11 @@
 'use client';
-import { computePosition } from '../../../../../dom/dist/floating-ui.dom.js';
-export { autoUpdate, platform } from '../../../../../dom/dist/floating-ui.dom.js';
+import { computePosition } from '../../dom/dist/floating-ui.dom.js';
+export { autoUpdate, platform } from '../../dom/dist/floating-ui.dom.js';
 import * as React from 'react';
 import { useLayoutEffect, useEffect } from 'react';
 import * as ReactDOM from 'react-dom';
-import { arrow as arrow$1 } from '../../../../../core/dist/floating-ui.core.js';
-export { detectOverflow, flip, offset, shift, size } from '../../../../../core/dist/floating-ui.core.js';
+import { arrow as arrow$1 } from '../../core/dist/floating-ui.core.js';
+export { detectOverflow, flip, offset, shift, size } from '../../core/dist/floating-ui.core.js';
 
 /**
  * Provides data to position an inner element of the floating element so that it

package/dist/esm/node_modules/@tanstack/react-virtual/dist/esm/index.js

@@ -0,0 +1,43 @@
+'use client';
+import * as React from 'react';
+import { flushSync } from 'react-dom';
+import { observeElementRect, observeElementOffset, elementScroll, Virtualizer } from '../../../virtual-core/dist/esm/index.js';
+export { defaultKeyExtractor, defaultRangeExtractor, measureElement } from '../../../virtual-core/dist/esm/index.js';
+
+const useIsomorphicLayoutEffect = typeof document !== "undefined" ? React.useLayoutEffect : React.useEffect;
+function useVirtualizerBase(options) {
+  const rerender = React.useReducer(() => ({}), {})[1];
+  const resolvedOptions = {
+    ...options,
+    onChange: (instance2, sync) => {
+      var _a;
+      if (sync) {
+        flushSync(rerender);
+      } else {
+        rerender();
+      }
+      (_a = options.onChange) == null ? void 0 : _a.call(options, instance2, sync);
+    }
+  };
+  const [instance] = React.useState(
+    () => new Virtualizer(resolvedOptions)
+  );
+  instance.setOptions(resolvedOptions);
+  React.useEffect(() => {
+    return instance._didMount();
+  }, []);
+  useIsomorphicLayoutEffect(() => {
+    return instance._willUpdate();
+  });
+  return instance;
+}
+function useVirtualizer(options) {
+  return useVirtualizerBase({
+    observeElementRect,
+    observeElementOffset,
+    scrollToFn: elementScroll,
+    ...options
+  });
+}
+
+export { Virtualizer, elementScroll, observeElementOffset, observeElementRect, useVirtualizer };