@helsenorge/designsystem-react 15.5.0 → 15.5.1

package/lib/components/VisualRadioGroup/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/VisualRadioGroup/VisualRadioGroup.tsx","../../../src/components/VisualRadioGroup/index.ts"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport type { VisualRadioProps, VisualRadioVariant } from './VisualRadio/VisualRadio';\n\nimport VisualRadio from './VisualRadio/VisualRadio';\nimport { useIdWithFallback } from '../../hooks/useIdWithFallback';\nimport { useIsMobileBreakpoint } from '../../hooks/useIsMobileBreakpoint';\nimport { isComponent } from '../../utils/component';\nimport ErrorWrapper from '../ErrorWrapper';\n\nimport styles from './styles.module.scss';\n\nexport interface VisualRadioGroupProps {\n  /** Items in the group. Should be VisualRadioGroup.VisualRadio elements. */\n  children?: React.ReactNode;\n  /** Name shared by all child VisualRadio elements (overridable per child). Auto-generated if omitted. */\n  name?: string;\n  /** Selected value (controlled). */\n  value?: string;\n  /** Initial selected value (uncontrolled). */\n  defaultValue?: string;\n  /** Called when the selected value changes. */\n  onChange?: (event: React.ChangeEvent<HTMLInputElement>, value: string) => void;\n  /** Variant applied to all child VisualRadio elements (overridable per child). */\n  variant?: VisualRadioVariant;\n  /** When set and the number of VisualRadio children exceeds this limit on the mobile breakpoint, the variant is forced to `line`. */\n  mobileLineVariantLimit?: number;\n  /** Error message shown above the group */\n  error?: string;\n  /** Error text id (auto-generated if omitted) */\n  errorTextId?: string;\n  /** Renders the error component (Default: true) */\n  renderError?: boolean;\n  /** Ref passed to the error message element */\n  errorMessageRef?: React.Ref<HTMLDivElement | null>;\n  /** Adds custom classes to the root element. */\n  className?: string;\n  /** Adds custom classes to the errorWrapper */\n  errorWrapperClassName?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Sets the data-testid attribute for the error wrapper */\n  errorWrapperTestId?: string;\n}\n\ninterface VisualRadioGroupComponent extends React.FC<VisualRadioGroupProps> {\n  VisualRadio: typeof VisualRadio;\n}\n\nexport const VisualRadioGroup: VisualRadioGroupComponent = props => {\n  const {\n    children,\n    name: nameProp,\n    value,\n    defaultValue,\n    onChange,\n    variant = 'rectangle',\n    mobileLineVariantLimit,\n    error,\n    errorTextId: errorTextIdProp,\n    renderError = true,\n    errorMessageRef,\n    className,\n    errorWrapperClassName,\n    testId,\n    errorWrapperTestId,\n  } = props;\n\n  const errorTextId = useIdWithFallback(errorTextIdProp);\n  const name = useIdWithFallback(nameProp);\n  const isMobile = useIsMobileBreakpoint();\n\n  const childArray = React.Children.toArray(children);\n  const radioChildren = childArray.filter((child): child is React.ReactElement<VisualRadioProps> =>\n    isComponent<VisualRadioProps>(child, VisualRadio)\n  );\n\n  const initialSelected =\n    value ?? defaultValue ?? radioChildren.find(child => child.props.defaultChecked || child.props.checked)?.props.value?.toString();\n\n  const [selectedValue, setSelectedValue] = React.useState<string | undefined>(initialSelected);\n  const [prevValue, setPrevValue] = React.useState<string | undefined>(value);\n  if (prevValue !== value) {\n    setPrevValue(value);\n    if (value !== undefined && value !== selectedValue) {\n      setSelectedValue(value);\n    }\n  }\n\n  const effectiveVariant: VisualRadioVariant | undefined =\n    isMobile && mobileLineVariantLimit !== undefined && radioChildren.length > mobileLineVariantLimit ? 'line' : variant;\n\n  const mapChild = (child: React.ReactNode): React.ReactNode => {\n    if (isComponent<VisualRadioProps>(child, VisualRadio)) {\n      const childValue = child.props.value?.toString();\n      const isSelected = selectedValue !== undefined && childValue !== undefined && childValue === selectedValue;\n      const childOnChange = child.props.onChange;\n\n      return React.cloneElement(child, {\n        name: child.props.name ?? name,\n        variant: child.props.variant ?? effectiveVariant,\n        error: !!error || child.props.error,\n        errorTextId: child.props.errorTextId ?? errorTextId,\n        checked: isSelected,\n        onChange: (e: React.ChangeEvent<HTMLInputElement>): void => {\n          if (childValue !== undefined) {\n            setSelectedValue(childValue);\n          }\n          childOnChange?.(e);\n          if (childValue !== undefined) {\n            onChange?.(e, childValue);\n          }\n        },\n      });\n    }\n    return child;\n  };\n\n  return (\n    <ErrorWrapper\n      className={classNames(errorWrapperClassName, className)}\n      errorText={error}\n      errorTextId={errorTextId}\n      renderError={renderError}\n      errorMessageRef={errorMessageRef}\n      testId={errorWrapperTestId}\n    >\n      <div\n        className={classNames(styles['visual-radio-group'], {\n          [styles['visual-radio-group--variant-line']]: effectiveVariant === 'line',\n        })}\n        data-testid={testId}\n        role={'radiogroup'}\n      >\n        {React.Children.map(children, mapChild)}\n      </div>\n    </ErrorWrapper>\n  );\n};\n\nVisualRadioGroup.VisualRadio = VisualRadio;\n\nexport default VisualRadioGroup;\n","import VisualRadioGroup from './VisualRadioGroup';\nexport * from './VisualRadioGroup';\nexport default VisualRadioGroup;\n"],"mappings":";;;;;;;;;;AAmDA,IAAa,oBAA8C,UAAS;CAClE,MAAM,EACJ,UACA,MAAM,UACN,OACA,cACA,UACA,UAAU,aACV,wBACA,OACA,aAAa,iBACb,cAAc,MACd,iBACA,WACA,uBACA,QACA,uBACE;CAEJ,MAAM,cAAc,kBAAkB,eAAe;CACrD,MAAM,OAAO,kBAAkB,QAAQ;CACvC,MAAM,WAAW,sBAAsB;CAGvC,MAAM,gBADa,MAAM,SAAS,QAAQ,QACpB,CAAA,CAAW,QAAQ,UACvC,YAA8B,OAAO,WAAW,CAClD;CAEA,MAAM,kBACJ,SAAS,gBAAgB,cAAc,MAAK,UAAS,MAAM,MAAM,kBAAkB,MAAM,MAAM,OAAO,CAAC,EAAE,MAAM,OAAO,SAAS;CAEjI,MAAM,CAAC,eAAe,oBAAoB,MAAM,SAA6B,eAAe;CAC5F,MAAM,CAAC,WAAW,gBAAgB,MAAM,SAA6B,KAAK;CAC1E,IAAI,cAAc,OAAO;EACvB,aAAa,KAAK;EAClB,IAAI,UAAU,KAAA,KAAa,UAAU,eACnC,iBAAiB,KAAK;CAE1B;CAEA,MAAM,mBACJ,YAAY,2BAA2B,KAAA,KAAa,cAAc,SAAS,yBAAyB,SAAS;CAE/G,MAAM,YAAY,UAA4C;EAC5D,IAAI,YAA8B,OAAO,WAAW,GAAG;GACrD,MAAM,aAAa,MAAM,MAAM,OAAO,SAAS;GAC/C,MAAM,aAAa,kBAAkB,KAAA,KAAa,eAAe,KAAA,KAAa,eAAe;GAC7F,MAAM,gBAAgB,MAAM,MAAM;GAElC,OAAO,MAAM,aAAa,OAAO;IAC/B,MAAM,MAAM,MAAM,QAAQ;IAC1B,SAAS,MAAM,MAAM,WAAW;IAChC,OAAO,CAAC,CAAC,SAAS,MAAM,MAAM;IAC9B,aAAa,MAAM,MAAM,eAAe;IACxC,SAAS;IACT,WAAW,MAAiD;KAC1D,IAAI,eAAe,KAAA,GACjB,iBAAiB,UAAU;KAE7B,gBAAgB,CAAC;KACjB,IAAI,eAAe,KAAA,GACjB,WAAW,GAAG,UAAU;IAE5B;GACF,CAAC;EACH;EACA,OAAO;CACT;CAEA,OACE,oBAAC,sBAAD;EACE,WAAW,WAAW,uBAAuB,SAAS;EACtD,WAAW;EACE;EACA;EACI;EACjB,QAAQ;YAER,oBAAC,OAAD;GACE,WAAW,WAAW,OAAO,uBAAuB,GACjD,OAAO,sCAAsC,qBAAqB,OACrE,CAAC;GACD,eAAa;GACb,MAAM;aAEL,MAAM,SAAS,IAAI,UAAU,QAAQ;EACnC,CAAA;CACO,CAAA;AAElB;AAEA,iBAAiB,cAAc;;;AC5I/B,IAAA,2BAAe"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/VisualRadioGroup/VisualRadioGroup.tsx","../../../src/components/VisualRadioGroup/index.ts"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport type { VisualRadioProps, VisualRadioVariant } from './VisualRadio/VisualRadio';\n\nimport VisualRadio from './VisualRadio/VisualRadio';\nimport { useIdWithFallback } from '../../hooks/useIdWithFallback';\nimport { useIsMobileBreakpoint } from '../../hooks/useIsMobileBreakpoint';\nimport { isComponent } from '../../utils/component';\nimport ErrorWrapper from '../ErrorWrapper';\n\nimport styles from './styles.module.scss';\n\nexport interface VisualRadioGroupProps {\n  /** Items in the group. Should be VisualRadioGroup.VisualRadio elements. */\n  children?: React.ReactNode;\n  /** Name shared by all child VisualRadio elements (overridable per child). Auto-generated if omitted. */\n  name?: string;\n  /** Selected value (controlled). */\n  value?: string;\n  /** Initial selected value (uncontrolled). */\n  defaultValue?: string;\n  /** Called when the selected value changes. */\n  onChange?: (event: React.ChangeEvent<HTMLInputElement>, value: string) => void;\n  /** Variant applied to all child VisualRadio elements (overridable per child). */\n  variant?: VisualRadioVariant;\n  /** When set and the number of VisualRadio children exceeds this limit on the mobile breakpoint, the variant is forced to `line`. */\n  mobileLineVariantLimit?: number;\n  /** Error message shown above the group */\n  error?: string;\n  /** Error text id (auto-generated if omitted) */\n  errorTextId?: string;\n  /** Renders the error component (Default: true) */\n  renderError?: boolean;\n  /** Ref passed to the error message element */\n  errorMessageRef?: React.Ref<HTMLDivElement | null>;\n  /** Adds custom classes to the root element. */\n  className?: string;\n  /** Adds custom classes to the errorWrapper */\n  errorWrapperClassName?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Sets the data-testid attribute for the error wrapper */\n  errorWrapperTestId?: string;\n}\n\ninterface VisualRadioGroupComponent extends React.FC<VisualRadioGroupProps> {\n  VisualRadio: typeof VisualRadio;\n}\n\nexport const VisualRadioGroup: VisualRadioGroupComponent = props => {\n  const {\n    children,\n    name: nameProp,\n    value,\n    defaultValue,\n    onChange,\n    variant = 'rectangle',\n    mobileLineVariantLimit,\n    error,\n    errorTextId: errorTextIdProp,\n    renderError = true,\n    errorMessageRef,\n    className,\n    errorWrapperClassName,\n    testId,\n    errorWrapperTestId,\n  } = props;\n\n  const errorTextId = useIdWithFallback(errorTextIdProp);\n  const name = useIdWithFallback(nameProp);\n  const isMobile = useIsMobileBreakpoint();\n\n  const childArray = React.Children.toArray(children);\n  const radioChildren = childArray.filter((child): child is React.ReactElement<VisualRadioProps> =>\n    isComponent<VisualRadioProps>(child, VisualRadio)\n  );\n\n  const initialSelected =\n    value ?? defaultValue ?? radioChildren.find(child => child.props.defaultChecked || child.props.checked)?.props.value?.toString();\n\n  const [selectedValue, setSelectedValue] = React.useState<string | undefined>(initialSelected);\n  const [prevValue, setPrevValue] = React.useState<string | undefined>(value);\n  if (prevValue !== value) {\n    setPrevValue(value);\n    if (value !== undefined && value !== selectedValue) {\n      setSelectedValue(value);\n    }\n  }\n\n  const effectiveVariant: VisualRadioVariant | undefined =\n    isMobile && mobileLineVariantLimit !== undefined && radioChildren.length > mobileLineVariantLimit ? 'line' : variant;\n\n  const mapChild = (child: React.ReactNode): React.ReactNode => {\n    if (isComponent<VisualRadioProps>(child, VisualRadio)) {\n      const childValue = child.props.value?.toString();\n      const isSelected = selectedValue !== undefined && childValue !== undefined && childValue === selectedValue;\n      const childOnChange = child.props.onChange;\n\n      return React.cloneElement(child, {\n        name: child.props.name ?? name,\n        variant: child.props.variant ?? effectiveVariant,\n        error: !!error || child.props.error,\n        errorTextId: child.props.errorTextId ?? errorTextId,\n        checked: isSelected,\n        onChange: (e: React.ChangeEvent<HTMLInputElement>): void => {\n          if (childValue !== undefined) {\n            setSelectedValue(childValue);\n          }\n          childOnChange?.(e);\n          if (childValue !== undefined) {\n            onChange?.(e, childValue);\n          }\n        },\n      });\n    }\n    return child;\n  };\n\n  return (\n    <ErrorWrapper\n      className={classNames(errorWrapperClassName, className)}\n      errorText={error}\n      errorTextId={errorTextId}\n      renderError={renderError}\n      errorMessageRef={errorMessageRef}\n      testId={errorWrapperTestId}\n    >\n      <div\n        className={classNames(styles['visual-radio-group'], {\n          [styles['visual-radio-group--variant-line']]: effectiveVariant === 'line',\n        })}\n        data-testid={testId}\n        role={'radiogroup'}\n      >\n        {React.Children.map(children, mapChild)}\n      </div>\n    </ErrorWrapper>\n  );\n};\n\nVisualRadioGroup.VisualRadio = VisualRadio;\n\nexport default VisualRadioGroup;\n","import VisualRadioGroup from './VisualRadioGroup';\nexport * from './VisualRadioGroup';\nexport default VisualRadioGroup;\n"],"mappings":";;;;;;;;;;AAmDA,IAAa,oBAA8C,UAAS;CAClE,MAAM,EACJ,UACA,MAAM,UACN,OACA,cACA,UACA,UAAU,aACV,wBACA,OACA,aAAa,iBACb,cAAc,MACd,iBACA,WACA,uBACA,QACA,uBACE;CAEJ,MAAM,cAAc,kBAAkB,eAAe;CACrD,MAAM,OAAO,kBAAkB,QAAQ;CACvC,MAAM,WAAW,sBAAsB;CAGvC,MAAM,gBADa,MAAM,SAAS,QAAQ,QACpB,CAAA,CAAW,QAAQ,UACvC,YAA8B,OAAO,WAAW,CAClD;CAEA,MAAM,kBACJ,SAAS,gBAAgB,cAAc,MAAK,UAAS,MAAM,MAAM,kBAAkB,MAAM,MAAM,OAAO,CAAC,EAAE,MAAM,OAAO,SAAS;CAEjI,MAAM,CAAC,eAAe,oBAAoB,MAAM,SAA6B,eAAe;CAC5F,MAAM,CAAC,WAAW,gBAAgB,MAAM,SAA6B,KAAK;CAC1E,IAAI,cAAc,OAAO;EACvB,aAAa,KAAK;EAClB,IAAI,UAAU,KAAA,KAAa,UAAU,eACnC,iBAAiB,KAAK;CAE1B;CAEA,MAAM,mBACJ,YAAY,2BAA2B,KAAA,KAAa,cAAc,SAAS,yBAAyB,SAAS;CAE/G,MAAM,YAAY,UAA4C;EAC5D,IAAI,YAA8B,OAAO,WAAW,GAAG;GACrD,MAAM,aAAa,MAAM,MAAM,OAAO,SAAS;GAC/C,MAAM,aAAa,kBAAkB,KAAA,KAAa,eAAe,KAAA,KAAa,eAAe;GAC7F,MAAM,gBAAgB,MAAM,MAAM;GAElC,OAAO,MAAM,aAAa,OAAO;IAC/B,MAAM,MAAM,MAAM,QAAQ;IAC1B,SAAS,MAAM,MAAM,WAAW;IAChC,OAAO,CAAC,CAAC,SAAS,MAAM,MAAM;IAC9B,aAAa,MAAM,MAAM,eAAe;IACxC,SAAS;IACT,WAAW,MAAiD;KAC1D,IAAI,eAAe,KAAA,GACjB,iBAAiB,UAAU;KAE7B,gBAAgB,CAAC;KACjB,IAAI,eAAe,KAAA,GACjB,WAAW,GAAG,UAAU;IAE5B;GACF,CAAC;EACH;EACA,OAAO;CACT;CAEA,OACE,oBAAC,sBAAD;EACE,WAAW,WAAW,uBAAuB,SAAS;EACtD,WAAW;EACE;EACA;EACI;EACjB,QAAQ;EAER,UAAA,oBAAC,OAAD;GACE,WAAW,WAAW,OAAO,uBAAuB,GACjD,OAAO,sCAAsC,qBAAqB,OACrE,CAAC;GACD,eAAa;GACb,MAAM;GAEL,UAAA,MAAM,SAAS,IAAI,UAAU,QAAQ;EACnC,CAAA;CACO,CAAA;AAElB;AAEA,iBAAiB,cAAc;;;AC5I/B,IAAA,2BAAe"}

package/lib/floating-ui.react.js

@@ -95,7 +95,7 @@ function getParentNode(node) {
 }
 function getNearestOverflowAncestor(node) {
 	const parentNode = getParentNode(node);
-	if (isLastTraversableNode(parentNode)) return node.ownerDocument ? node.ownerDocument.body : node.body;
+	if (isLastTraversableNode(parentNode)) return (node.ownerDocument || node).body;
 	if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) return parentNode;
 	return getNearestOverflowAncestor(parentNode);
 }
@@ -214,12 +214,12 @@ function getOppositePlacement(placement) {
 	return oppositeSideMap[side] + placement.slice(side.length);
 }
 function expandPaddingObject(padding) {
+	var _padding$top, _padding$right, _padding$bottom, _padding$left;
 	return {
-		top: 0,
-		right: 0,
-		bottom: 0,
-		left: 0,
-		...padding
+		top: (_padding$top = padding.top) != null ? _padding$top : 0,
+		right: (_padding$right = padding.right) != null ? _padding$right : 0,
+		bottom: (_padding$bottom = padding.bottom) != null ? _padding$bottom : 0,
+		left: (_padding$left = padding.left) != null ? _padding$left : 0
 	};
 }
 function getPaddingObject(padding) {
@@ -792,14 +792,8 @@ function computeCoordsFromPlacement(_ref, placement, rtl) {
 			y: reference.y
 		};
 	}
-	switch (getAlignment(placement)) {
-		case "start":
-			coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
-			break;
-		case "end":
-			coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
-			break;
-	}
+	const alignment = getAlignment(placement);
+	if (alignment) coords[alignmentAxis] += commonAlign * (alignment === "end" ? 1 : -1) * (rtl && isVertical ? -1 : 1);
 	return coords;
 }
 /**
@@ -830,10 +824,7 @@ async function detectOverflow(state, options) {
 		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)) || {
-		x: 1,
-		y: 1
-	} : {
+	const offsetScale = await (platform.isElement == null ? void 0 : platform.isElement(offsetParent)) && await (platform.getScale == null ? void 0 : platform.getScale(offsetParent)) || {
 		x: 1,
 		y: 1
 	};
@@ -953,12 +944,11 @@ var arrow$3 = (options) => ({
 		const largestPossiblePadding = clientSize / 2 - arrowDimensions[length] / 2 - 1;
 		const minPadding = min(paddingObject[minProp], largestPossiblePadding);
 		const maxPadding = min(paddingObject[maxProp], largestPossiblePadding);
-		const min$1 = minPadding;
 		const max = clientSize - arrowDimensions[length] - maxPadding;
 		const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
-		const offset = clamp(min$1, center, max);
-		const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset && rects.reference[length] / 2 - (center < min$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
-		const alignmentOffset = shouldAddOffset ? center < min$1 ? center - min$1 : center - max : 0;
+		const offset = clamp(minPadding, center, max);
+		const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset && rects.reference[length] / 2 - (center < minPadding ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
+		const alignmentOffset = shouldAddOffset ? center < minPadding ? center - minPadding : center - max : 0;
 		return {
 			[axis]: coords[axis] + alignmentOffset,
 			data: {
@@ -1033,9 +1023,7 @@ var flip$2 = function(options) {
 						if (placement) resetPlacement = placement;
 						break;
 					}
-					case "initialPlacement":
-						resetPlacement = initialPlacement;
-						break;
+					case "initialPlacement": resetPlacement = initialPlacement;
 				}
 				if (placement !== resetPlacement) return { reset: { placement: resetPlacement } };
 			}
@@ -1173,24 +1161,13 @@ var shift$2 = function(options) {
 				y
 			};
 			const overflow = await platform.detectOverflow(state, detectOverflowOptions);
-			const crossAxis = getSideAxis(getSide(placement));
+			const crossAxis = getSideAxis(placement);
 			const mainAxis = getOppositeAxis(crossAxis);
 			let mainAxisCoord = coords[mainAxis];
 			let crossAxisCoord = coords[crossAxis];
-			if (checkMainAxis) {
-				const minSide = mainAxis === "y" ? "top" : "left";
-				const maxSide = mainAxis === "y" ? "bottom" : "right";
-				const min = mainAxisCoord + overflow[minSide];
-				const max = mainAxisCoord - overflow[maxSide];
-				mainAxisCoord = clamp(min, mainAxisCoord, max);
-			}
-			if (checkCrossAxis) {
-				const minSide = crossAxis === "y" ? "top" : "left";
-				const maxSide = crossAxis === "y" ? "bottom" : "right";
-				const min = crossAxisCoord + overflow[minSide];
-				const max = crossAxisCoord - overflow[maxSide];
-				crossAxisCoord = clamp(min, crossAxisCoord, max);
-			}
+			const clampCoord = (axis, coord) => clamp(coord + overflow[axis === "y" ? "top" : "left"], coord, coord - overflow[axis === "y" ? "bottom" : "right"]);
+			if (checkMainAxis) mainAxisCoord = clampCoord(mainAxis, mainAxisCoord);
+			if (checkCrossAxis) crossAxisCoord = clampCoord(crossAxis, crossAxisCoord);
 			const limitedCoords = limiter.fn({
 				...state,
 				[mainAxis]: mainAxisCoord,
@@ -1222,7 +1199,6 @@ var size$2 = function(options) {
 		name: "size",
 		options,
 		async fn(state) {
-			var _state$middlewareData, _state$middlewareData2;
 			const { placement, rects, platform, elements } = state;
 			const { apply = () => {}, ...detectOverflowOptions } = evaluate(options, state);
 			const overflow = await platform.detectOverflow(state, detectOverflowOptions);
@@ -1243,18 +1219,15 @@ var size$2 = function(options) {
 			const maximumClippingWidth = width - overflow.left - overflow.right;
 			const overflowAvailableHeight = min(height - overflow[heightSide], maximumClippingHeight);
 			const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth);
-			const noShift = !state.middlewareData.shift;
+			const shiftData = state.middlewareData.shift;
+			const noShift = !shiftData;
 			let availableHeight = overflowAvailableHeight;
 			let availableWidth = overflowAvailableWidth;
-			if ((_state$middlewareData = state.middlewareData.shift) != null && _state$middlewareData.enabled.x) availableWidth = maximumClippingWidth;
-			if ((_state$middlewareData2 = state.middlewareData.shift) != null && _state$middlewareData2.enabled.y) availableHeight = maximumClippingHeight;
+			if (shiftData != null && shiftData.enabled.x) availableWidth = maximumClippingWidth;
+			if (shiftData != null && shiftData.enabled.y) availableHeight = maximumClippingHeight;
 			if (noShift && !alignment) {
-				const xMin = max(overflow.left, 0);
-				const xMax = max(overflow.right, 0);
-				const yMin = max(overflow.top, 0);
-				const yMax = max(overflow.bottom, 0);
-				if (isYAxis) availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right));
-				else availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom));
+				if (isYAxis) availableWidth = width - 2 * max(overflow.left, overflow.right);
+				else availableHeight = height - 2 * max(overflow.top, overflow.bottom);
 			}
 			await apply({
 				...state,
@@ -1315,8 +1288,7 @@ function getVisualOffsets(element) {
 }
 function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
 	if (isFixed === void 0) isFixed = false;
-	if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) return false;
-	return isFixed;
+	return !!floatingOffsetParent && isFixed && floatingOffsetParent === getWindow(element);
 }
 function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
 	if (includeScale === void 0) includeScale = false;
@@ -1324,20 +1296,22 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
 	const clientRect = element.getBoundingClientRect();
 	const domElement = unwrapElement(element);
 	let scale = createCoords(1);
-	if (includeScale) if (offsetParent) {
-		if (isElement(offsetParent)) scale = getScale(offsetParent);
-	} else scale = getScale(element);
+	if (includeScale) {
+		if (offsetParent) {
+			if (isElement(offsetParent)) scale = getScale(offsetParent);
+		} else scale = getScale(element);
+	}
 	const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
 	let x = (clientRect.left + visualOffsets.x) / scale.x;
 	let y = (clientRect.top + visualOffsets.y) / scale.y;
 	let width = clientRect.width / scale.x;
 	let height = clientRect.height / scale.y;
-	if (domElement) {
+	if (domElement && offsetParent) {
 		const win = getWindow(domElement);
-		const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
+		const offsetWin = isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
 		let currentWin = win;
 		let currentIFrame = getFrameElement(currentWin);
-		while (currentIFrame && offsetParent && offsetWin !== currentWin) {
+		while (currentIFrame && offsetWin !== currentWin) {
 			const iframeScale = getScale(currentIFrame);
 			const iframeRect = currentIFrame.getBoundingClientRect();
 			const css = getComputedStyle$1(currentIFrame);
@@ -1385,7 +1359,7 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
 	let scale = createCoords(1);
 	const offsets = createCoords(0);
 	const isOffsetParentAnElement = isHTMLElement(offsetParent);
-	if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
+	if (isOffsetParentAnElement || !isFixed) {
 		if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) scroll = getNodeScroll(offsetParent);
 		if (isOffsetParentAnElement) {
 			const offsetRect = getBoundingClientRect(offsetParent);
@@ -1403,15 +1377,14 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
 	};
 }
 function getClientRects(element) {
-	return Array.from(element.getClientRects());
+	return element.getClientRects ? Array.from(element.getClientRects()) : [];
 }
-function getDocumentRect(element) {
-	const html = getDocumentElement(element);
-	const scroll = getNodeScroll(element);
-	const body = element.ownerDocument.body;
+function getDocumentRect(html) {
+	const scroll = getNodeScroll(html);
+	const body = html.ownerDocument.body;
 	const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
 	const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
-	let x = -scroll.scrollLeft + getWindowScrollBarX(element);
+	let x = -scroll.scrollLeft + getWindowScrollBarX(html);
 	const y = -scroll.scrollTop;
 	if (getComputedStyle$1(body).direction === "rtl") x += max(html.clientWidth, body.clientWidth) - width;
 	return {
@@ -1422,7 +1395,9 @@ function getDocumentRect(element) {
 	};
 }
 var SCROLLBAR_MAX = 25;
-function getViewportRect(element, strategy) {
+function getViewportRect(element, strategy, rootBoundary) {
+	if (rootBoundary === void 0) rootBoundary = "viewport";
+	const isLayoutViewport = rootBoundary === "layoutViewport";
 	const win = getWindow(element);
 	const html = getDocumentElement(element);
 	const visualViewport = win.visualViewport;
@@ -1431,23 +1406,30 @@ function getViewportRect(element, strategy) {
 	let x = 0;
 	let y = 0;
 	if (visualViewport) {
-		width = visualViewport.width;
-		height = visualViewport.height;
-		const visualViewportBased = isWebKit();
-		if (!visualViewportBased || visualViewportBased && strategy === "fixed") {
-			x = visualViewport.offsetLeft;
-			y = visualViewport.offsetTop;
+		const layoutRelativeClientCoords = !isWebKit() || strategy === "fixed";
+		if (isLayoutViewport) {
+			if (!layoutRelativeClientCoords) {
+				x = -visualViewport.offsetLeft;
+				y = -visualViewport.offsetTop;
+			}
+		} else {
+			width = visualViewport.width;
+			height = visualViewport.height;
+			if (layoutRelativeClientCoords) {
+				x = visualViewport.offsetLeft;
+				y = visualViewport.offsetTop;
+			}
 		}
 	}
-	const windowScrollbarX = getWindowScrollBarX(html);
-	if (windowScrollbarX <= 0) {
+	if (getWindowScrollBarX(html) <= 0) {
 		const doc = html.ownerDocument;
 		const body = doc.body;
 		const bodyStyles = getComputedStyle(body);
 		const bodyMarginInline = doc.compatMode === "CSS1Compat" ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
-		const clippingStableScrollbarWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
-		if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) width -= clippingStableScrollbarWidth;
-	} else if (windowScrollbarX <= SCROLLBAR_MAX) width += windowScrollbarX;
+		const reservedWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
+		const gutter = getComputedStyle(html).scrollbarGutter === "stable both-edges" ? reservedWidth / 2 : reservedWidth;
+		if (gutter <= SCROLLBAR_MAX) width -= gutter;
+	}
 	return {
 		width,
 		height,
@@ -1459,7 +1441,7 @@ function getInnerBoundingClientRect(element, strategy) {
 	const clientRect = getBoundingClientRect(element, true, strategy === "fixed");
 	const top = clientRect.top + element.clientTop;
 	const left = clientRect.left + element.clientLeft;
-	const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
+	const scale = getScale(element);
 	return {
 		width: element.clientWidth * scale.x,
 		height: element.clientHeight * scale.y,
@@ -1469,7 +1451,7 @@ function getInnerBoundingClientRect(element, strategy) {
 }
 function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
 	let rect;
-	if (clippingAncestor === "viewport") rect = getViewportRect(element, strategy);
+	if (clippingAncestor === "viewport" || clippingAncestor === "layoutViewport") rect = getViewportRect(element, strategy, clippingAncestor);
 	else if (clippingAncestor === "document") rect = getDocumentRect(getDocumentElement(element));
 	else if (isElement(clippingAncestor)) rect = getInnerBoundingClientRect(clippingAncestor, strategy);
 	else {
@@ -1483,24 +1465,19 @@ function getClientRectFromClippingAncestor(element, clippingAncestor, strategy)
 	}
 	return rectToClientRect(rect);
 }
-function hasFixedPositionAncestor(element, stopNode) {
-	const parentNode = getParentNode(element);
-	if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) return false;
-	return getComputedStyle$1(parentNode).position === "fixed" || hasFixedPositionAncestor(parentNode, stopNode);
-}
 function getClippingElementAncestors(element, cache) {
 	const cachedResult = cache.get(element);
 	if (cachedResult) return cachedResult;
 	let result = getOverflowAncestors(element, [], false).filter((el) => isElement(el) && getNodeName(el) !== "body");
-	let currentContainingBlockComputedStyle = null;
+	let lastKeptComputedStyle = null;
 	const elementIsFixed = getComputedStyle$1(element).position === "fixed";
 	let currentNode = elementIsFixed ? getParentNode(element) : element;
 	while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
 		const computedStyle = getComputedStyle$1(currentNode);
 		const currentNodeIsContaining = isContainingBlock(currentNode);
-		if (!currentNodeIsContaining && computedStyle.position === "fixed") currentContainingBlockComputedStyle = null;
-		if (elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === "static" && !!currentContainingBlockComputedStyle && (currentContainingBlockComputedStyle.position === "absolute" || currentContainingBlockComputedStyle.position === "fixed") || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode)) result = result.filter((ancestor) => ancestor !== currentNode);
-		else currentContainingBlockComputedStyle = computedStyle;
+		const lastPosition = lastKeptComputedStyle ? lastKeptComputedStyle.position : elementIsFixed ? "fixed" : "";
+		if (!currentNodeIsContaining && (lastPosition === "fixed" || lastPosition === "absolute" && computedStyle.position === "static")) result = result.filter((ancestor) => ancestor !== currentNode);
+		else lastKeptComputedStyle = computedStyle;
 		currentNode = getParentNode(currentNode);
 	}
 	cache.set(element, result);
@@ -1545,18 +1522,15 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
 		scrollTop: 0
 	};
 	const offsets = createCoords(0);
-	function setLeftRTLScrollbarOffset() {
-		offsets.x = getWindowScrollBarX(documentElement);
-	}
-	if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
+	if (isOffsetParentAnElement || !isFixed) {
 		if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) scroll = getNodeScroll(offsetParent);
 		if (isOffsetParentAnElement) {
 			const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
 			offsets.x = offsetRect.x + offsetParent.clientLeft;
 			offsets.y = offsetRect.y + offsetParent.clientTop;
-		} else if (documentElement) setLeftRTLScrollbarOffset();
+		}
 	}
-	if (isFixed && !isOffsetParentAnElement && documentElement) setLeftRTLScrollbarOffset();
+	if (!isOffsetParentAnElement && documentElement) offsets.x = getWindowScrollBarX(documentElement);
 	const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
 	return {
 		x: rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x,
@@ -1623,7 +1597,7 @@ var platform = {
 function rectsAreEqual(a, b) {
 	return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
 }
-function observeMove(element, onMove) {
+function observeMove(element, onMove, ancestorResize) {
 	let io = null;
 	let timeoutId;
 	const root = getDocumentElement(element);
@@ -1652,6 +1626,7 @@ function observeMove(element, onMove) {
 		let isFirstUpdate = true;
 		function handleObserve(entries) {
 			const ratio = entries[0].intersectionRatio;
+			if (!rectsAreEqual(elementRectForRootMargin, element.getBoundingClientRect())) return refresh();
 			if (ratio !== threshold) {
 				if (!isFirstUpdate) return refresh();
 				if (!ratio) timeoutId = setTimeout(() => {
@@ -1659,7 +1634,6 @@ function observeMove(element, onMove) {
 				}, 1e3);
 				else refresh(false, ratio);
 			}
-			if (ratio === 1 && !rectsAreEqual(elementRectForRootMargin, element.getBoundingClientRect())) refresh();
 			isFirstUpdate = false;
 		}
 		try {
@@ -1672,8 +1646,14 @@ function observeMove(element, onMove) {
 		}
 		io.observe(element);
 	}
+	const win = getWindow(element);
+	const handleResize = () => refresh(ancestorResize);
+	win.addEventListener("resize", handleResize);
 	refresh(true);
-	return cleanup;
+	return () => {
+		win.removeEventListener("resize", handleResize);
+		cleanup();
+	};
 }
 /**
 * Automatically updates the position of the floating element when necessary.
@@ -1689,10 +1669,10 @@ function autoUpdate(reference, floating, update, options) {
 	const referenceEl = unwrapElement(reference);
 	const ancestors = ancestorScroll || ancestorResize ? [...referenceEl ? getOverflowAncestors(referenceEl) : [], ...floating ? getOverflowAncestors(floating) : []] : [];
 	ancestors.forEach((ancestor) => {
-		ancestorScroll && ancestor.addEventListener("scroll", update, { passive: true });
+		ancestorScroll && ancestor.addEventListener("scroll", update);
 		ancestorResize && ancestor.addEventListener("resize", update);
 	});
-	const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
+	const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update, ancestorResize) : null;
 	let reobserveFrame = -1;
 	let resizeObserver = null;
 	if (elementResize) {
@@ -1779,11 +1759,9 @@ var arrow$2 = arrow$3;
 */
 var computePosition = (reference, floating, options) => {
 	const cache = /* @__PURE__ */ new Map();
-	const mergedOptions = {
-		platform,
-		...options
-	};
+	const mergedOptions = options != null ? options : {};
 	const platformWithCache = {
+		...platform,
 		...mergedOptions.platform,
 		_c: cache
 	};
@@ -3280,8 +3258,10 @@ function useClick(context, props) {
 				didKeyDownRef.current = true;
 			}
 			if (isAnchorTarget(event)) return;
-			if (event.key === "Enter") if (open && toggle) onOpenChange(false, event.nativeEvent, "click");
-			else onOpenChange(true, event.nativeEvent, "click");
+			if (event.key === "Enter") {
+				if (open && toggle) onOpenChange(false, event.nativeEvent, "click");
+				else onOpenChange(true, event.nativeEvent, "click");
+			}
 		},
 		onKeyUp(event) {
 			if (event.defaultPrevented || !keyboardHandlers || isButtonTarget(event) || isSpaceIgnored(domReference)) return;
@@ -3464,7 +3444,7 @@ function useDismiss(context, props) {
 			return ancestor !== ((_doc$defaultView = doc.defaultView) == null ? void 0 : _doc$defaultView.visualViewport);
 		});
 		ancestors.forEach((ancestor) => {
-			ancestor.addEventListener("scroll", onScroll, { passive: true });
+			ancestor.addEventListener("scroll", onScroll);
 		});
 		return () => {
 			if (escapeKey) {
@@ -3599,15 +3579,15 @@ function useFloatingRootContext(options) {
 * Provides data to position a floating element and context to add interactions.
 * @see https://floating-ui.com/docs/useFloating
 */
-function useFloating(options) {
-	if (options === void 0) options = {};
+function useFloating(_temp) {
+	var _elementsOption$refer, _elementsOption$float;
+	let { elements: elementsOption, ...options } = _temp === void 0 ? {} : _temp;
 	const { nodeId } = options;
 	const internalRootContext = useFloatingRootContext({
 		...options,
 		elements: {
-			reference: null,
-			floating: null,
-			...options.elements
+			reference: (_elementsOption$refer = elementsOption == null ? void 0 : elementsOption.reference) != null ? _elementsOption$refer : null,
+			floating: (_elementsOption$float = elementsOption == null ? void 0 : elementsOption.floating) != null ? _elementsOption$float : null
 		}
 	});
 	const rootContext = options.rootContext || internalRootContext;