@sanity/ui 4.1.1 → 4.2.0

package/dist/{layer-BfwisMR6.js → layer-Bl5R3uNR.js}

@@ -30,9 +30,9 @@ function LayerChildren(props) {
 	}, $[19] = style, $[20] = zIndex, $[21] = t7) : t7 = $[21];
 	let t8;
 	return $[22] !== Component || $[23] !== children || $[24] !== handleFocus || $[25] !== restProps || $[26] !== t6 || $[27] !== t7 ? (t8 = /* @__PURE__ */ jsx(Component, {
+		"data-ui": "Layer",
 		...restProps,
 		className: t6,
-		"data-ui": "Layer",
 		onFocus: handleFocus,
 		ref,
 		style: t7,
@@ -58,4 +58,4 @@ function Layer(props) {
 }
 export { Layer as t };
 
-//# sourceMappingURL=layer-BfwisMR6.js.map
+//# sourceMappingURL=layer-Bl5R3uNR.js.map

package/dist/{layer-BfwisMR6.js.map → layer-Bl5R3uNR.js.map}

@@ -1 +1 @@
-{"version":3,"file":"layer-BfwisMR6.js","names":["as = 'div'","style = EMPTY_RECORD","() => ref.current","() => {\n    const becameTopLayer = isTopLayerRef.current !== isTopLayer && isTopLayer\n\n    if (becameTopLayer) {\n      onActivate?.({activeElement: lastFocusedRef.current})\n    }\n\n    isTopLayerRef.current = isTopLayer\n  }","[isTopLayer, onActivate]","(event: FocusEvent<HTMLDivElement, Element>) => {\n      // Call the user-provided onFocus handler if any\n      onFocus?.(event)\n\n      const rootElement = ref.current\n      const target = document.activeElement\n\n      if (!isTopLayer || !rootElement || !target) return\n\n      if (isHTMLElement(target) && containsOrEqualsElement(rootElement, target)) {\n        lastFocusedRef.current = target\n      }\n    }","useCallback(\n    // oxlint-disable-next-line no-unnecessary-type-arguments\n    (event: FocusEvent<HTMLDivElement, Element>) => {\n      // Call the user-provided onFocus handler if any\n      onFocus?.(event)\n\n      const rootElement = ref.current\n      const target = document.activeElement\n\n      if (!isTopLayer || !rootElement || !target) return\n\n      if (isHTMLElement(target) && containsOrEqualsElement(rootElement, target)) {\n        lastFocusedRef.current = target\n      }\n    },\n    [isTopLayer, onFocus],\n  )","clsx(layer, className)","{...style, zIndex}","<Component\n      {...restProps}\n      className={clsx(layer, className)}\n      data-ui=\"Layer\"\n      onFocus={handleFocus}\n      ref={ref}\n      style={{...style, zIndex}}\n    >\n      {children}\n    </Component>","zOffset = 1","<LayerChildren {...restProps}>{children}</LayerChildren>","<LayerProvider zOffset={zOffset}>\n      <LayerChildren {...restProps}>{children}</LayerChildren>\n    </LayerProvider>"],"sources":["../src/core/utils/layer/layer.css.ts","../src/core/utils/layer/layer.tsx"],"sourcesContent":["import {style} from '@vanilla-extract/css'\n\nexport const layer = style({\n  position: 'relative',\n})\n","import {clsx} from 'clsx/lite'\nimport {FocusEvent, useCallback, useEffect, useImperativeHandle, useRef} from 'react'\n\nimport {EMPTY_RECORD} from '../../constants'\nimport {containsOrEqualsElement, isHTMLElement} from '../../helpers/element'\nimport {LayerProvider} from './layerProvider'\nimport {useLayer} from './useLayer'\n\nimport {layer} from './layer.css'\n\n/**\n * @public\n */\nexport interface LayerProps {\n  as?: React.ElementType | keyof React.JSX.IntrinsicElements\n  /** A callback that fires when the layer becomes the top layer when it was not the top layer before. */\n  onActivate?: (props: {activeElement: HTMLElement | null}) => void\n  zOffset?: number | number[]\n}\n\ninterface LayerChildrenProps {\n  as?: React.ElementType | keyof React.JSX.IntrinsicElements\n  onActivate?: LayerProps['onActivate']\n}\n\nfunction LayerChildren(props: LayerChildrenProps & Omit<React.HTMLProps<HTMLDivElement>, 'as'>) {\n  const {\n    as = 'div',\n    children,\n    className,\n    onActivate,\n    onFocus,\n    ref: forwardedRef,\n    style = EMPTY_RECORD,\n    ...restProps\n  } = props\n  const {zIndex, isTopLayer} = useLayer()\n  const lastFocusedRef = useRef<HTMLElement | null>(null)\n  const ref = useRef<HTMLDivElement | null>(null)\n  const isTopLayerRef = useRef<boolean>(isTopLayer)\n\n  useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(forwardedRef, () => ref.current)\n\n  // When the layer very first mounts, it will be the top layer, but we don't want to fire\n  // the callback in that case. We use a ref to track the previous value of isTopLayer to\n  // determine if the layer has become the top layer since the last render.\n  useEffect(() => {\n    const becameTopLayer = isTopLayerRef.current !== isTopLayer && isTopLayer\n\n    if (becameTopLayer) {\n      onActivate?.({activeElement: lastFocusedRef.current})\n    }\n\n    isTopLayerRef.current = isTopLayer\n  }, [isTopLayer, onActivate])\n\n  const handleFocus = useCallback(\n    // oxlint-disable-next-line no-unnecessary-type-arguments\n    (event: FocusEvent<HTMLDivElement, Element>) => {\n      // Call the user-provided onFocus handler if any\n      onFocus?.(event)\n\n      const rootElement = ref.current\n      const target = document.activeElement\n\n      if (!isTopLayer || !rootElement || !target) return\n\n      if (isHTMLElement(target) && containsOrEqualsElement(rootElement, target)) {\n        lastFocusedRef.current = target\n      }\n    },\n    [isTopLayer, onFocus],\n  )\n\n  // Rendering the polymorphic `as` needs one concrete element type for JSX to\n  // type-check the div-flavored props (the same widening styled-components'\n  // `as` prop performed here before).\n  // oxlint-disable-next-line no-unsafe-type-assertion\n  const Component = as as 'div'\n\n  return (\n    <Component\n      {...restProps}\n      className={clsx(layer, className)}\n      data-ui=\"Layer\"\n      onFocus={handleFocus}\n      ref={ref}\n      style={{...style, zIndex}}\n    >\n      {children}\n    </Component>\n  )\n}\n\n/**\n * @public\n */\nexport function Layer(props: LayerProps & Omit<React.HTMLProps<HTMLDivElement>, 'as'>) {\n  const {children, zOffset = 1, ...restProps} = props\n\n  return (\n    <LayerProvider zOffset={zOffset}>\n      <LayerChildren {...restProps}>{children}</LayerChildren>\n    </LayerProvider>\n  )\n}\n"],"mappings":";;;;;;;;ACyBA,SAAS,cAAc,OAAyE;gBAG5F,UACA,WAGK,cAFL,YACA,SAGG,WAPHA,IAMAC;CAEE,AAAA,EAAA,OAAA,+IATE,CACJ,IAAA,IACA,UACA,WACA,YACA,SACA,KAAK,cACL,OAAA,IACA,GAAA,aACE;CARF,IAAA,KAAA,OAAA,KAAA,IAAK,QAALD,IAMA,QAAA,OAAA,KAAA,IAAQ,eAARC,IAGI,EAAC,QAAQ,eAAc,SAAS,GAChC,iBAAiB,OAA2B,IAAI,GAChD,MAAM,OAA8B,IAAI,GACxC,gBAAgB,OAAgB,UAAU,GAEgCC;CAAhF,oDAAsF,WAAA,IAAI,iCAA1F,oBAAkE,cAAcA,EAAiB;CAKvFC,IAAAA,IAQPC;CARH,AACmD,EAAA,QAAA,cAAA,EAAA,QAG/C,cAJM,WAAM;EAOd,AANuB,cAAc,YAAY,cAAc,cAG7D,aAAa,EAAC,eAAe,eAAe,QAAO,CAAC,GAGtD,cAAc,UAAU;CAC1B,GAAG,KAAA,CAAC,YAAY,UAAU,GAPyB,EAAA,MAAA,YAG/C,EAAA,MAAA,gEAJJ,UAAUD,IAQPC,EAAwB;CAIzBC,IAAAA;CAOO,AAAA,EAAA,QAAA,cAAA,EAAA,QALL,WAFF,MAAC,UAA+C;EAE9C,UAAU,KAAK;EAEf,IAAM,cAAc,IAAI,SAClB,SAAS,SAAS;EAEpB,AAAC,cAAe,eAAgB,UAEhC,cAAc,MAAM,KAAK,wBAAwB,aAAa,MAAM,MACtE,eAAe,UAAU;CAE7B,GALO,EAAA,MAAA,YALL,EAAA,MAAA;CAJJ,IAAM,cAAcC,IAsBd,YAAY,IAKHC;CAAY,AAAA,EAAA,QAAA,0BAAZ,KAAA,KAAK,OAAO,SAAS,GAAT,EAAA,MAAA;CAIhBC,IAAAA;CAAI,AAAA,EAAA,QAAA,SAAA,EAAA,QAAO,UAAX,KAAA;EAAC,GAAG;EAAO;CAAM,GAAb,EAAA,MAAA,OAAO,EAAA,MAAA;CANpBC,IAAAA;CADF,OACG,EAAA,QAAA,aAAA,EAAA,QAQE,YAAA,EAAA,QAJQ,eAAA,EAAA,QAHL,aAAA,EAAA,QACOF,MAAAA,EAAAA,QAIJC,MANT,KAAA,oBAAC,WAAD;EACE,GAAI;EACJ,WAAWD;EACX,WAAQ;EACR,SAAS;EACJ;EACL,OAAOC;EAEN;CACQ,CAAA,GATV,EAAA,MAAA,WAQE,EAAA,MAAA,UAJQ,EAAA,MAAA,aAHL,EAAA,MAAA,WACOD,EAAAA,MAAAA,IAIJC,EAAAA,MAAAA,8BANTC;AAWJ;;;;AAKA,SAAgB,MAAM,OAAiE;gBAC9E,UAA0B,WAAhBC;CAA6B,AAAA,EAAA,OAAA,0DAAxC,CAAC,UAAU,SAAA,IAAa,GAAA,aAAgB;CAA7B,IAAA,UAAA,OAAA,KAAA,IAAU,IAAVA,IAIbC;CAA+B,AAAA,EAAA,OAAA,YAAA,EAAA,OAAZ,aAAnB,KAAA,oBAAC,eAAD;EAAe,GAAI;EAAY;CAAwB,CAAA,GAAxB,EAAA,KAAA,UAAZ,EAAA,KAAA;CADrBC,IAAAA;CADF,OAEID,EAAAA,OAAAA,MAAAA,EAAAA,OADsB,WAAxB,KAAA,oBAAC,eAAD;EAAwB;EACtBA,UAAAA;CACa,CAAA,GADbA,EAAAA,KAAAA,IADsB,EAAA,KAAA,iCAAxBC;AAIJ"}
+{"version":3,"file":"layer-Bl5R3uNR.js","names":["as = 'div'","style = EMPTY_RECORD","() => ref.current","() => {\n    const becameTopLayer = isTopLayerRef.current !== isTopLayer && isTopLayer\n\n    if (becameTopLayer) {\n      onActivate?.({activeElement: lastFocusedRef.current})\n    }\n\n    isTopLayerRef.current = isTopLayer\n  }","[isTopLayer, onActivate]","(event: FocusEvent<HTMLDivElement, Element>) => {\n      // Call the user-provided onFocus handler if any\n      onFocus?.(event)\n\n      const rootElement = ref.current\n      const target = document.activeElement\n\n      if (!isTopLayer || !rootElement || !target) return\n\n      if (isHTMLElement(target) && containsOrEqualsElement(rootElement, target)) {\n        lastFocusedRef.current = target\n      }\n    }","useCallback(\n    // oxlint-disable-next-line no-unnecessary-type-arguments\n    (event: FocusEvent<HTMLDivElement, Element>) => {\n      // Call the user-provided onFocus handler if any\n      onFocus?.(event)\n\n      const rootElement = ref.current\n      const target = document.activeElement\n\n      if (!isTopLayer || !rootElement || !target) return\n\n      if (isHTMLElement(target) && containsOrEqualsElement(rootElement, target)) {\n        lastFocusedRef.current = target\n      }\n    },\n    [isTopLayer, onFocus],\n  )","clsx(layer, className)","{...style, zIndex}","<Component\n      data-ui=\"Layer\"\n      {...restProps}\n      className={clsx(layer, className)}\n      onFocus={handleFocus}\n      ref={ref}\n      style={{...style, zIndex}}\n    >\n      {children}\n    </Component>","zOffset = 1","<LayerChildren {...restProps}>{children}</LayerChildren>","<LayerProvider zOffset={zOffset}>\n      <LayerChildren {...restProps}>{children}</LayerChildren>\n    </LayerProvider>"],"sources":["../src/core/utils/layer/layer.css.ts","../src/core/utils/layer/layer.tsx"],"sourcesContent":["import {style} from '@vanilla-extract/css'\n\nexport const layer = style({\n  position: 'relative',\n})\n","import {clsx} from 'clsx/lite'\nimport {FocusEvent, useCallback, useEffect, useImperativeHandle, useRef} from 'react'\n\nimport {EMPTY_RECORD} from '../../constants'\nimport {containsOrEqualsElement, isHTMLElement} from '../../helpers/element'\nimport {LayerProvider} from './layerProvider'\nimport {useLayer} from './useLayer'\n\nimport {layer} from './layer.css'\n\n/**\n * @public\n */\nexport interface LayerProps {\n  as?: React.ElementType | keyof React.JSX.IntrinsicElements\n  /** A callback that fires when the layer becomes the top layer when it was not the top layer before. */\n  onActivate?: (props: {activeElement: HTMLElement | null}) => void\n  zOffset?: number | number[]\n}\n\ninterface LayerChildrenProps {\n  as?: React.ElementType | keyof React.JSX.IntrinsicElements\n  onActivate?: LayerProps['onActivate']\n}\n\nfunction LayerChildren(props: LayerChildrenProps & Omit<React.HTMLProps<HTMLDivElement>, 'as'>) {\n  const {\n    as = 'div',\n    children,\n    className,\n    onActivate,\n    onFocus,\n    ref: forwardedRef,\n    style = EMPTY_RECORD,\n    ...restProps\n  } = props\n  const {zIndex, isTopLayer} = useLayer()\n  const lastFocusedRef = useRef<HTMLElement | null>(null)\n  const ref = useRef<HTMLDivElement | null>(null)\n  const isTopLayerRef = useRef<boolean>(isTopLayer)\n\n  useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(forwardedRef, () => ref.current)\n\n  // When the layer very first mounts, it will be the top layer, but we don't want to fire\n  // the callback in that case. We use a ref to track the previous value of isTopLayer to\n  // determine if the layer has become the top layer since the last render.\n  useEffect(() => {\n    const becameTopLayer = isTopLayerRef.current !== isTopLayer && isTopLayer\n\n    if (becameTopLayer) {\n      onActivate?.({activeElement: lastFocusedRef.current})\n    }\n\n    isTopLayerRef.current = isTopLayer\n  }, [isTopLayer, onActivate])\n\n  const handleFocus = useCallback(\n    // oxlint-disable-next-line no-unnecessary-type-arguments\n    (event: FocusEvent<HTMLDivElement, Element>) => {\n      // Call the user-provided onFocus handler if any\n      onFocus?.(event)\n\n      const rootElement = ref.current\n      const target = document.activeElement\n\n      if (!isTopLayer || !rootElement || !target) return\n\n      if (isHTMLElement(target) && containsOrEqualsElement(rootElement, target)) {\n        lastFocusedRef.current = target\n      }\n    },\n    [isTopLayer, onFocus],\n  )\n\n  // Rendering the polymorphic `as` needs one concrete element type for JSX to\n  // type-check the div-flavored props (the same widening styled-components'\n  // `as` prop performed here before).\n  // oxlint-disable-next-line no-unsafe-type-assertion\n  const Component = as as 'div'\n\n  return (\n    <Component\n      data-ui=\"Layer\"\n      {...restProps}\n      className={clsx(layer, className)}\n      onFocus={handleFocus}\n      ref={ref}\n      style={{...style, zIndex}}\n    >\n      {children}\n    </Component>\n  )\n}\n\n/**\n * @public\n */\nexport function Layer(props: LayerProps & Omit<React.HTMLProps<HTMLDivElement>, 'as'>) {\n  const {children, zOffset = 1, ...restProps} = props\n\n  return (\n    <LayerProvider zOffset={zOffset}>\n      <LayerChildren {...restProps}>{children}</LayerChildren>\n    </LayerProvider>\n  )\n}\n"],"mappings":";;;;;;;;ACyBA,SAAS,cAAc,OAAyE;gBAG5F,UACA,WAGK,cAFL,YACA,SAGG,WAPHA,IAMAC;CAEE,AAAA,EAAA,OAAA,+IATE,CACJ,IAAA,IACA,UACA,WACA,YACA,SACA,KAAK,cACL,OAAA,IACA,GAAA,aACE;CARF,IAAA,KAAA,OAAA,KAAA,IAAK,QAALD,IAMA,QAAA,OAAA,KAAA,IAAQ,eAARC,IAGI,EAAC,QAAQ,eAAc,SAAS,GAChC,iBAAiB,OAA2B,IAAI,GAChD,MAAM,OAA8B,IAAI,GACxC,gBAAgB,OAAgB,UAAU,GAEgCC;CAAhF,oDAAsF,WAAA,IAAI,iCAA1F,oBAAkE,cAAcA,EAAiB;CAKvFC,IAAAA,IAQPC;CARH,AACmD,EAAA,QAAA,cAAA,EAAA,QAG/C,cAJM,WAAM;EAOd,AANuB,cAAc,YAAY,cAAc,cAG7D,aAAa,EAAC,eAAe,eAAe,QAAO,CAAC,GAGtD,cAAc,UAAU;CAC1B,GAAG,KAAA,CAAC,YAAY,UAAU,GAPyB,EAAA,MAAA,YAG/C,EAAA,MAAA,gEAJJ,UAAUD,IAQPC,EAAwB;CAIzBC,IAAAA;CAOO,AAAA,EAAA,QAAA,cAAA,EAAA,QALL,WAFF,MAAC,UAA+C;EAE9C,UAAU,KAAK;EAEf,IAAM,cAAc,IAAI,SAClB,SAAS,SAAS;EAEpB,AAAC,cAAe,eAAgB,UAEhC,cAAc,MAAM,KAAK,wBAAwB,aAAa,MAAM,MACtE,eAAe,UAAU;CAE7B,GALO,EAAA,MAAA,YALL,EAAA,MAAA;CAJJ,IAAM,cAAcC,IAsBd,YAAY,IAMHC;CAAY,AAAA,EAAA,QAAA,0BAAZ,KAAA,KAAK,OAAO,SAAS,GAAT,EAAA,MAAA;CAGhBC,IAAAA;CAAI,AAAA,EAAA,QAAA,SAAA,EAAA,QAAO,UAAX,KAAA;EAAC,GAAG;EAAO;CAAM,GAAb,EAAA,MAAA,OAAO,EAAA,MAAA;CANpBC,IAAAA;CADF,OACG,EAAA,QAAA,aAAA,EAAA,QAQE,YAAA,EAAA,QAJQ,eAAA,EAAA,QAFL,aAAA,EAAA,QACOF,MAAAA,EAAAA,QAGJC,MANT,KAAA,oBAAC,WAAD;EACE,WAAQ;EACR,GAAI;EACJ,WAAWD;EACX,SAAS;EACJ;EACL,OAAOC;EAEN;CACQ,CAAA,GATV,EAAA,MAAA,WAQE,EAAA,MAAA,UAJQ,EAAA,MAAA,aAFL,EAAA,MAAA,WACOD,EAAAA,MAAAA,IAGJC,EAAAA,MAAAA,8BANTC;AAWJ;;;;AAKA,SAAgB,MAAM,OAAiE;gBAC9E,UAA0B,WAAhBC;CAA6B,AAAA,EAAA,OAAA,0DAAxC,CAAC,UAAU,SAAA,IAAa,GAAA,aAAgB;CAA7B,IAAA,UAAA,OAAA,KAAA,IAAU,IAAVA,IAIbC;CAA+B,AAAA,EAAA,OAAA,YAAA,EAAA,OAAZ,aAAnB,KAAA,oBAAC,eAAD;EAAe,GAAI;EAAY;CAAwB,CAAA,GAAxB,EAAA,KAAA,UAAZ,EAAA,KAAA;CADrBC,IAAAA;CADF,OAEID,EAAAA,OAAAA,MAAAA,EAAAA,OADsB,WAAxB,KAAA,oBAAC,eAAD;EAAwB;EACtBA,UAAAA;CACa,CAAA,GADbA,EAAAA,KAAAA,IADsB,EAAA,KAAA,iCAAxBC;AAIJ"}

package/dist/menu.js

@@ -5,9 +5,9 @@ import { t as getTheme_v2 } from "./getTheme_v2-y09KqtEb.js";
 import { d as createGlobalScopedContext, h as _cardColorStyle, l as useRootTheme, r as isRecord, t as useLayer, v as responsiveRadiusStyle, y as Box } from "./useLayer-D1usxIE0.js";
 import { t as Flex } from "./flex-DmbDG2ks.js";
 import { n as Text, t as Stack } from "./stack-rsNFPq2-.js";
-import { t as Popover } from "./popover-myCXZV_F.js";
+import { t as Popover } from "./popover-B7-28L8y.js";
 import { t as useClickOutsideEvent } from "./useClickOutsideEvent-wGLGWBZN.js";
-import { i as useGlobalKeyDown, t as Hotkeys } from "./hotkeys-uSArGPzR.js";
+import { i as useGlobalKeyDown, t as Hotkeys } from "./hotkeys-CaHsQlsO.js";
 import { c } from "react/compiler-runtime";
 import { clsx } from "clsx/lite";
 import { cloneElement, isValidElement, useContext, useEffect, useImperativeHandle, useRef, useState } from "react";

package/dist/{popover-myCXZV_F.js → popover-B7-28L8y.js}

@@ -3,7 +3,7 @@ import { _ as useTheme_v2, i as usePrefersReducedMotion, n as LayerProvider, o a
 import { t as Flex } from "./flex-DmbDG2ks.js";
 import { t as useElementSize } from "./useElementSize-BJvbGHq8.js";
 import { i as origin, n as AnimateActivity, r as getTransformOrigin, t as getElementRef } from "./getElementRef-Jw7gY0eV.js";
-import { a as useBoundaryElement, n as Portal, t as Arrow } from "./arrow-DKn5YKdy.js";
+import { a as useBoundaryElement, n as Portal, t as Arrow } from "./arrow-BmX6qbAS.js";
 import { c } from "react/compiler-runtime";
 import { Activity, cloneElement, useEffect, useImperativeHandle, useRef, useState } from "react";
 import { styled } from "styled-components";
@@ -176,13 +176,16 @@ function PopoverCard(props) {
 }
 const ViewportOverlay = () => {
 	let $ = c(2), { zIndex } = useLayer(), t0;
-	return $[0] === zIndex ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx("div", { style: {
-		height: "100vh",
-		inset: 0,
-		position: "fixed",
-		width: "100vw",
-		zIndex
-	} }), $[0] = zIndex, $[1] = t0), t0;
+	return $[0] === zIndex ? t0 = $[1] : (t0 = /* @__PURE__ */ jsx("div", {
+		"data-ui": "PopoverOverlay",
+		style: {
+			height: "100vh",
+			inset: 0,
+			position: "fixed",
+			width: "100vw",
+			zIndex
+		}
+	}), $[0] = zIndex, $[1] = t0), t0;
 };
 /**
 * The `Popover` component is used to display some content on top of another.
@@ -402,4 +405,4 @@ function useMiddleware(t0) {
 }
 export { Popover as t };
 
-//# sourceMappingURL=popover-myCXZV_F.js.map
+//# sourceMappingURL=popover-B7-28L8y.js.map

package/dist/popover-B7-28L8y.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover-B7-28L8y.js","names":["getTransformOrigin(originX, originY)","{\n      left: x,\n      position: strategy,\n      top: y,\n      transformOrigin: getTransformOrigin(originX, originY),\n      width,\n      zIndex,\n      willChange: animate ? 'transform' : undefined,\n      ...style,\n    }","animate ? 'transform' : undefined","useMemo(\n    () => ({\n      left: x,\n      position: strategy,\n      top: y,\n      transformOrigin: getTransformOrigin(originX, originY),\n      width,\n      zIndex,\n      willChange: animate ? 'transform' : undefined,\n      ...style,\n    }),\n    [animate, originX, originY, strategy, style, width, x, y, zIndex],\n  )","{\n      left: arrowX !== null ? arrowX : undefined,\n      top: arrowY !== null ? arrowY : undefined,\n      right: undefined,\n      bottom: undefined,\n    }","arrowX !== null ? arrowX : undefined","arrowY !== null ? arrowY : undefined","useMemo(\n    () => ({\n      left: arrowX !== null ? arrowX : undefined,\n      top: arrowY !== null ? arrowY : undefined,\n      right: undefined,\n      bottom: undefined,\n    }),\n    [arrowX, arrowY],\n  )","<Flex direction=\"column\" flex={1} padding={padding}>\n          {children}\n        </Flex>","<Flex data-ui=\"Popover__wrapper\" direction=\"column\" flex={1} overflow={overflow}>\n        <Flex direction=\"column\" flex={1} padding={padding}>\n          {children}\n        </Flex>\n      </Flex>","arrow && (\n        <Arrow\n          ref={arrowRef}\n          style={arrowStyle}\n          width={DEFAULT_POPOVER_ARROW_WIDTH}\n          height={DEFAULT_POPOVER_ARROW_HEIGHT}\n          radius={DEFAULT_POPOVER_ARROW_RADIUS}\n        />\n      )","<MotionCard\n      data-ui=\"Popover\"\n      {...restProps}\n      data-placement={placement}\n      radius={radius}\n      ref={ref}\n      scheme={scheme}\n      shadow={shadow}\n      sizing=\"border\"\n      style={rootStyle}\n      tone={tone}\n      {...(animate ? POPOVER_MOTION_PROPS : undefined)}\n    >\n      <Flex data-ui=\"Popover__wrapper\" direction=\"column\" flex={1} overflow={overflow}>\n        <Flex direction=\"column\" flex={1} padding={padding}>\n          {children}\n        </Flex>\n      </Flex>\n\n      {arrow && (\n        <Arrow\n          ref={arrowRef}\n          style={arrowStyle}\n          width={DEFAULT_POPOVER_ARROW_WIDTH}\n          height={DEFAULT_POPOVER_ARROW_HEIGHT}\n          radius={DEFAULT_POPOVER_ARROW_RADIUS}\n        />\n      )}\n    </MotionCard>","animate ? POPOVER_MOTION_PROPS : undefined","<div\n      data-ui=\"PopoverOverlay\"\n      style={{height: '100vh', inset: 0, position: 'fixed', width: '100vw', zIndex}}\n    />","margins = DEFAULT_POPOVER_MARGINS","_animate = false","tone = 'inherit'","widthProp = 'auto'","arrowProp = false","constrainSize = false","overflow = 'hidden'","placementProp = 'bottom'","placementStrategy = 'flip'","preventOverflow = true","radiusProp = 3","shadowProp = 3","childProp","_fallbackPlacements","_floatingBoundary","paddingProp","forwardedRef","_referenceBoundary","_zOffsetProp","...restProps","_getArrayProp(paddingProp)","_getArrayProp(radiusProp)","_getArrayProp(shadowProp)","_getArrayProp(zOffsetProp)","() => ref.current","() => {\n    widthRef.current = width\n  }","[width]","calcMaxWidth({boundaryWidth, currentWidth: width})","() => {\n    maxWidthRef.current = maxWidth\n  }","[maxWidth]","() => {\n    const floatingElement = ref.current\n\n    if (!open || !floatingElement) return\n\n    const referenceWidth = referenceWidthRef.current\n\n    if (matchReferenceWidth) {\n      if (referenceWidth !== undefined) {\n        floatingElement.style.width = `${referenceWidth}px`\n      }\n    } else if (width !== undefined) {\n      floatingElement.style.width = `${width}px`\n    }\n\n    if (typeof maxWidth === 'number') {\n      floatingElement.style.maxWidth = `${maxWidth}px`\n    }\n  }","[width, matchReferenceWidth, maxWidth, open]","referenceWidth","{\n    animate,\n    arrowProp,\n    arrowRef,\n    constrainSize,\n    fallbackPlacements,\n    floatingBoundary,\n    margins,\n    matchReferenceWidth,\n    maxWidthRef,\n    placementProp,\n    placementStrategy,\n    preventOverflow,\n    referenceBoundary,\n    referenceWidthRef,\n    rootBoundary,\n    setReferenceWidth,\n    widthRef,\n  }","referenceElement\n      ? {\n          reference: referenceElement,\n        }\n      : undefined","{\n    middleware,\n    placement: placementProp,\n    whileElementsMounted: autoUpdate,\n    elements: referenceElement\n      ? {\n          reference: referenceElement,\n        }\n      : undefined,\n  }","(arrowEl: HTMLDivElement | null) => {\n    arrowRef.current = arrowEl\n  }","useCallback((arrowEl: HTMLDivElement | null) => {\n    arrowRef.current = arrowEl\n  }, [])","(node: HTMLDivElement | null) => {\n      ref.current = node\n      refs.setFloating(node)\n    }","useCallback(\n    (node: HTMLDivElement | null) => {\n      ref.current = node\n      refs.setFloating(node)\n    },\n    [refs],\n  )","childProp ? getElementRef(childProp) : null","() => refs.reference.current","current","useMemo(() => {\n    // If a reference element is defined, we don't need to clone the child\n    if (referenceElement) return childProp\n\n    if (!childProp) return null\n\n    return cloneElement(childProp, {ref: refs.setReference})\n  }, [childProp, referenceElement, refs.setReference])","cloneElement(childProp, {ref: refs.setReference})","setReference","() => update","[update]","childProp || <></>","modal && <ViewportOverlay />","<PopoverCard\n        {...restProps}\n        __unstable_margins={margins}\n        animate={animate}\n        arrow={arrowProp}\n        arrowRef={setArrow}\n        arrowX={arrowX}\n        arrowY={arrowY}\n        hidden={referenceHidden}\n        overflow={overflow}\n        padding={padding}\n        placement={placement}\n        radius={radius}\n        ref={setFloating}\n        scheme={scheme}\n        shadow={shadow}\n        originX={originX}\n        originY={originY}\n        strategy={strategy}\n        tone={tone}\n        width={matchReferenceWidth ? referenceWidth : width}\n        x={x}\n        y={y}\n      >\n        {content}\n      </PopoverCard>","matchReferenceWidth ? referenceWidth : width","<LayerProvider zOffset={zOffset}>\n      {/* Optional transparent blocking overlay at the top-most z-index layer. Must be positioned before the below popover card. */}\n      {modal && <ViewportOverlay />}\n\n      <PopoverCard\n        {...restProps}\n        __unstable_margins={margins}\n        animate={animate}\n        arrow={arrowProp}\n        arrowRef={setArrow}\n        arrowX={arrowX}\n        arrowY={arrowY}\n        hidden={referenceHidden}\n        overflow={overflow}\n        padding={padding}\n        placement={placement}\n        radius={radius}\n        ref={setFloating}\n        scheme={scheme}\n        shadow={shadow}\n        originX={originX}\n        originY={originY}\n        strategy={strategy}\n        tone={tone}\n        width={matchReferenceWidth ? referenceWidth : width}\n        x={x}\n        y={y}\n      >\n        {content}\n      </PopoverCard>\n    </LayerProvider>","portal ? (\n    <Portal __unstable_name={typeof portal === 'string' ? portal : undefined}>{popover}</Portal>\n  ) : (\n    popover\n  )","animate ? (\n        <AnimateActivity layoutMode=\"default\" mode={open ? 'visible' : 'hidden'}>\n          {popoverNode}\n        </AnimateActivity>\n      ) : (\n        <Activity mode={open ? 'visible' : 'hidden'}>{popoverNode}</Activity>\n      )","<>\n      {/* the popover */}\n      {animate ? (\n        <AnimateActivity layoutMode=\"default\" mode={open ? 'visible' : 'hidden'}>\n          {popoverNode}\n        </AnimateActivity>\n      ) : (\n        <Activity mode={open ? 'visible' : 'hidden'}>{popoverNode}</Activity>\n      )}\n\n      {/* the referred element */}\n      {child}\n    </>","{\n  animate,\n  arrowProp,\n  arrowRef,\n  constrainSize,\n  fallbackPlacements,\n  floatingBoundary,\n  margins,\n  matchReferenceWidth,\n  maxWidthRef,\n  placementProp,\n  placementStrategy,\n  preventOverflow,\n  referenceBoundary,\n  referenceWidthRef,\n  rootBoundary,\n  setReferenceWidth,\n  widthRef,\n}: {\n  animate: boolean\n  arrowProp: boolean\n  arrowRef: React.RefObject<HTMLDivElement | null>\n  constrainSize: boolean\n  fallbackPlacements: Placement[]\n  floatingBoundary: HTMLElement | null\n  margins: PopoverMargins\n  matchReferenceWidth: boolean | undefined\n  maxWidthRef: React.RefObject<number | undefined>\n  placementProp: Placement\n  placementStrategy: 'flip' | 'autoPlacement'\n  preventOverflow: boolean\n  referenceBoundary: HTMLElement | null\n  referenceWidthRef: React.RefObject<number | undefined>\n  rootBoundary: RootBoundary\n  setReferenceWidth: (referenceWidth: number) => void\n  widthRef: React.RefObject<number | undefined>\n}","autoPlacement({\n            allowedPlacements: [placementProp].concat(fallbackPlacements),\n          })","flip({\n            boundary: floatingBoundary || undefined,\n            fallbackPlacements,\n            padding: DEFAULT_POPOVER_PADDING,\n            rootBoundary,\n          })","floatingBoundary || undefined","offset({mainAxis: DEFAULT_POPOVER_DISTANCE})","size({\n          boundaryElement: floatingBoundary || undefined,\n          constrainSize,\n          margins,\n          matchReferenceWidth,\n          maxWidthRef,\n          padding: DEFAULT_POPOVER_PADDING,\n          referenceWidthRef,\n          setReferenceWidth,\n          widthRef,\n        })","shift({\n          boundary: floatingBoundary || undefined,\n          rootBoundary,\n          padding: DEFAULT_POPOVER_PADDING,\n        })","arrow({\n          element: arrowRef,\n          padding: DEFAULT_POPOVER_PADDING,\n        })","hide({\n        boundary: referenceBoundary || undefined,\n        padding: DEFAULT_POPOVER_PADDING,\n        strategy: 'referenceHidden',\n      })","referenceBoundary || undefined","useMemo(() => {\n    const ret: Middleware[] = []\n\n    // Flip the floating element when leaving the boundary box\n    if (constrainSize || preventOverflow) {\n      if (placementStrategy === 'autoPlacement') {\n        ret.push(\n          autoPlacement({\n            allowedPlacements: [placementProp].concat(fallbackPlacements),\n          }),\n        )\n      } else {\n        ret.push(\n          flip({\n            boundary: floatingBoundary || undefined,\n            fallbackPlacements,\n            padding: DEFAULT_POPOVER_PADDING,\n            rootBoundary,\n          }),\n        )\n      }\n    }\n\n    // Define distance between reference and floating element\n    ret.push(offset({mainAxis: DEFAULT_POPOVER_DISTANCE}))\n\n    // Track sizes\n    if (constrainSize || matchReferenceWidth) {\n      ret.push(\n        size({\n          boundaryElement: floatingBoundary || undefined,\n          constrainSize,\n          margins,\n          matchReferenceWidth,\n          maxWidthRef,\n          padding: DEFAULT_POPOVER_PADDING,\n          referenceWidthRef,\n          setReferenceWidth,\n          widthRef,\n        }),\n      )\n    }\n\n    // Shift the popover so its sits within the boundary element\n    if (preventOverflow) {\n      ret.push(\n        shift({\n          boundary: floatingBoundary || undefined,\n          rootBoundary,\n          padding: DEFAULT_POPOVER_PADDING,\n        }),\n      )\n    }\n\n    // Place arrow\n    if (arrowProp) {\n      ret.push(\n        arrow({\n          element: arrowRef,\n          padding: DEFAULT_POPOVER_PADDING,\n        }),\n      )\n    }\n\n    // Determine the origin to scale from.\n    // Must be placed after `@sanity/ui/size` and `shift` middleware.\n    if (animate) {\n      ret.push(origin)\n    }\n\n    ret.push(\n      hide({\n        boundary: referenceBoundary || undefined,\n        padding: DEFAULT_POPOVER_PADDING,\n        strategy: 'referenceHidden',\n      }),\n    )\n\n    return ret\n  }, [\n    animate,\n    arrowProp,\n    arrowRef,\n    constrainSize,\n    fallbackPlacements,\n    floatingBoundary,\n    margins,\n    matchReferenceWidth,\n    maxWidthRef,\n    placementProp,\n    placementStrategy,\n    preventOverflow,\n    referenceBoundary,\n    referenceWidthRef,\n    rootBoundary,\n    setReferenceWidth,\n    widthRef,\n  ])"],"sources":["../src/core/primitives/popover/constants.ts","../src/core/primitives/popover/floating-ui/size.ts","../src/core/primitives/popover/helpers.ts","../src/core/primitives/popover/popoverCard.tsx","../src/core/primitives/popover/popover.tsx"],"sourcesContent":["import {Placement} from '../../types/placement'\nimport {PopoverMargins} from '../../types/popover'\n\nexport const DEFAULT_POPOVER_DISTANCE = 4\nexport const DEFAULT_POPOVER_PADDING = 4\nexport const DEFAULT_POPOVER_ARROW_WIDTH = 19\nexport const DEFAULT_POPOVER_ARROW_HEIGHT = 8\nexport const DEFAULT_POPOVER_ARROW_RADIUS = 2\nexport const DEFAULT_POPOVER_MARGINS: PopoverMargins = [0, 0, 0, 0]\nexport const DEFAULT_FALLBACK_PLACEMENTS: Record<Placement, Placement[]> = {\n  'top': ['bottom', 'left', 'right'],\n  'top-start': ['bottom-start', 'left-start', 'right-start'],\n  'top-end': ['bottom-end', 'left-end', 'right-end'],\n  'bottom': ['top', 'left', 'right'],\n  'bottom-start': ['top-start', 'left-start', 'right-start'],\n  'bottom-end': ['top-end', 'left-end', 'right-end'],\n  'left': ['right', 'top', 'bottom'],\n  'left-start': ['right-start', 'top-start', 'bottom-start'],\n  'left-end': ['right-end', 'top-end', 'bottom-end'],\n  'right': ['left', 'top', 'bottom'],\n  'right-start': ['left-start', 'top-start', 'bottom-start'],\n  'right-end': ['left-end', 'top-end', 'bottom-end'],\n}\n","import {detectOverflow, Middleware} from '@floating-ui/react-dom'\n\nimport {PopoverMargins} from '../../../types/popover'\n\nexport function size(options: {\n  boundaryElement?: HTMLElement | null\n  constrainSize: boolean\n  margins: PopoverMargins\n  matchReferenceWidth?: boolean\n  maxWidthRef: React.RefObject<number | undefined>\n  padding?: number\n  referenceWidthRef: React.RefObject<number | undefined>\n  setReferenceWidth: (referenceWidth: number) => void\n  widthRef: React.RefObject<number | undefined>\n}): Middleware {\n  const {\n    constrainSize,\n    margins,\n    matchReferenceWidth,\n    maxWidthRef,\n    padding = 0,\n    referenceWidthRef,\n    setReferenceWidth,\n    widthRef,\n  } = options\n\n  return {\n    name: '@sanity/ui/size',\n    async fn(args) {\n      const {elements, placement, platform, rects} = args\n      const {floating, reference} = rects\n\n      const overflow = await detectOverflow(args, {\n        altBoundary: true,\n        boundary: options.boundaryElement || undefined,\n        elementContext: 'floating',\n        padding,\n        rootBoundary: 'viewport',\n      })\n\n      let maxWidth = Infinity\n      let maxHeight = Infinity\n\n      const floatingW = floating.width\n      const floatingH = floating.height\n\n      if (placement.includes('top')) {\n        maxWidth = floatingW - (overflow.left + overflow.right)\n        maxHeight = floatingH - overflow.top\n      }\n\n      if (placement.includes('right')) {\n        maxWidth = floatingW - overflow.right\n        maxHeight = floatingH - (overflow.top + overflow.bottom)\n      }\n\n      if (placement.includes('bottom')) {\n        maxWidth = floatingW - (overflow.left + overflow.right)\n        maxHeight = floatingH - overflow.bottom\n      }\n\n      if (placement.includes('left')) {\n        maxWidth = floatingW - overflow.left\n        maxHeight = floatingH - (overflow.top + overflow.bottom)\n      }\n\n      // IMPORTANT – APPLY ELEMENT STYLES HERE\n      // Elements need to be resized BEFORE the `platform.getDimensions` call below\n      const availableWidth = maxWidth - margins[1] - margins[3]\n      const availableHeight = maxHeight - margins[0] - margins[2]\n      const referenceWidth = reference.width - margins[1] - margins[3]\n      referenceWidthRef.current = referenceWidth\n      setReferenceWidth(referenceWidth)\n\n      if (matchReferenceWidth) {\n        elements.floating.style.width = `${referenceWidth}px`\n      } else if (widthRef.current !== undefined) {\n        elements.floating.style.width = `${widthRef.current}px`\n      }\n\n      if (constrainSize) {\n        elements.floating.style.maxWidth = `${Math.min(availableWidth, maxWidthRef.current ?? Infinity)}px`\n\n        elements.floating.style.maxHeight = `${availableHeight}px`\n      }\n\n      const nextDimensions = await platform.getDimensions(elements.floating)\n\n      const targetH = nextDimensions.height\n      const targetW = nextDimensions.width\n\n      if (floatingW !== targetW || floatingH !== targetH) {\n        return {reset: {rects: true}}\n      }\n\n      return {}\n    },\n  }\n}\n","import {DEFAULT_POPOVER_PADDING} from './constants'\nimport {PopoverWidth} from './types'\n\nexport function calcCurrentWidth(params: {\n  mediaIndex: number\n  container: number[]\n  width: PopoverWidth[]\n}): number | undefined {\n  const {container, mediaIndex, width} = params\n\n  const w = width[mediaIndex]\n  const currentWidth: PopoverWidth | undefined = w === undefined ? width[width.length - 1] : w\n\n  return typeof currentWidth === 'number' ? container[currentWidth] : undefined\n}\n\nexport function calcMaxWidth(params: {\n  boundaryWidth: number | undefined\n  currentWidth: number | undefined\n}): number | undefined {\n  const {boundaryWidth, currentWidth} = params\n\n  if (currentWidth === undefined && boundaryWidth === undefined) {\n    return undefined\n  }\n\n  return Math.min(\n    currentWidth ?? Infinity,\n    (boundaryWidth || Infinity) - DEFAULT_POPOVER_PADDING * 2,\n  )\n}\n","import {Strategy} from '@floating-ui/react-dom'\nimport {motion} from 'motion/react'\nimport React, {CSSProperties, useMemo} from 'react'\nimport {styled} from 'styled-components'\n\nimport {ThemeColorSchemeKey} from '../../../theme/system/color/_system'\nimport {POPOVER_MOTION_PROPS} from '../../constants'\nimport {getTransformOrigin} from '../../middleware/origin'\nimport {BoxOverflow} from '../../types/box'\nimport {CardTone} from '../../types/card'\nimport {Placement} from '../../types/placement'\nimport {PopoverMargins} from '../../types/popover'\nimport {Radius} from '../../types/radius'\nimport {Arrow} from '../../utils/arrow/arrow'\nimport {useLayer} from '../../utils/layer/useLayer'\nimport {Card} from '../card/card'\nimport {Flex} from '../flex/flex'\nimport {\n  DEFAULT_POPOVER_ARROW_HEIGHT,\n  DEFAULT_POPOVER_ARROW_RADIUS,\n  DEFAULT_POPOVER_ARROW_WIDTH,\n  DEFAULT_POPOVER_MARGINS,\n} from './constants'\n\nconst MotionCard = styled(motion.create(Card))`\n  &:not([hidden]) {\n    display: flex;\n  }\n  flex-direction: column;\n  width: max-content;\n  min-width: min-content;\n  will-change: transform;\n`\n\n/**\n * @internal\n */\nexport function PopoverCard(\n  props: {\n    /** @beta*/\n    __unstable_margins?: PopoverMargins\n    animate?: boolean\n    arrow: boolean\n    arrowRef: React.Ref<HTMLDivElement>\n    arrowX?: number\n    arrowY?: number\n    originX?: number\n    originY?: number\n    overflow?: BoxOverflow\n    padding?: number | number[]\n    placement: Placement\n    radius?: Radius | Radius[]\n    scheme?: ThemeColorSchemeKey\n    shadow?: number | number[]\n    strategy: Strategy\n    tone: CardTone\n    width: number | undefined\n    x: number | null\n    y: number | null\n  } & Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'height' | 'width'>,\n) {\n  const {\n    __unstable_margins: marginsProp,\n    animate,\n    arrow,\n    arrowRef,\n    arrowX,\n    arrowY,\n    children,\n    padding,\n    placement,\n    originX,\n    originY,\n    overflow,\n    radius,\n    ref,\n    scheme,\n    shadow,\n    strategy,\n    style,\n    tone,\n    width,\n    x: xProp,\n    y: yProp,\n    ...restProps\n  } = props\n\n  const {zIndex} = useLayer()\n\n  // Get margins: [top, right, bottom, left]\n  const margins: PopoverMargins = useMemo(\n    () => marginsProp || DEFAULT_POPOVER_MARGINS,\n    [marginsProp],\n  )\n\n  // Translate according to margins\n  const x = (xProp ?? 0) + margins[3]\n  const y = (yProp ?? 0) + margins[0]\n\n  const rootStyle: CSSProperties = useMemo(\n    () => ({\n      left: x,\n      position: strategy,\n      top: y,\n      transformOrigin: getTransformOrigin(originX, originY),\n      width,\n      zIndex,\n      willChange: animate ? 'transform' : undefined,\n      ...style,\n    }),\n    [animate, originX, originY, strategy, style, width, x, y, zIndex],\n  )\n\n  const arrowStyle: CSSProperties = useMemo(\n    () => ({\n      left: arrowX !== null ? arrowX : undefined,\n      top: arrowY !== null ? arrowY : undefined,\n      right: undefined,\n      bottom: undefined,\n    }),\n    [arrowX, arrowY],\n  )\n\n  return (\n    <MotionCard\n      data-ui=\"Popover\"\n      {...restProps}\n      data-placement={placement}\n      radius={radius}\n      ref={ref}\n      scheme={scheme}\n      shadow={shadow}\n      sizing=\"border\"\n      style={rootStyle}\n      tone={tone}\n      {...(animate ? POPOVER_MOTION_PROPS : undefined)}\n    >\n      <Flex data-ui=\"Popover__wrapper\" direction=\"column\" flex={1} overflow={overflow}>\n        <Flex direction=\"column\" flex={1} padding={padding}>\n          {children}\n        </Flex>\n      </Flex>\n\n      {arrow && (\n        <Arrow\n          ref={arrowRef}\n          style={arrowStyle}\n          width={DEFAULT_POPOVER_ARROW_WIDTH}\n          height={DEFAULT_POPOVER_ARROW_HEIGHT}\n          radius={DEFAULT_POPOVER_ARROW_RADIUS}\n        />\n      )}\n    </MotionCard>\n  )\n}\n","import {\n  arrow,\n  autoPlacement,\n  autoUpdate,\n  flip,\n  hide,\n  Middleware,\n  offset,\n  RootBoundary,\n  shift,\n  useFloating,\n} from '@floating-ui/react-dom'\nimport {\n  Activity,\n  cloneElement,\n  type Ref,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\n\nimport {ThemeColorSchemeKey} from '../../../theme/system/color/_system'\nimport {useElementSize} from '../../hooks/useElementSize'\nimport {useMediaIndex} from '../../hooks/useMediaIndex/useMediaIndex'\nimport {usePrefersReducedMotion} from '../../hooks/usePrefersReducedMotion'\nimport {origin} from '../../middleware/origin'\nimport {_getArrayProp} from '../../styles/helpers'\nimport {useTheme_v2} from '../../theme/useTheme'\nimport {BoxOverflow} from '../../types/box'\nimport {CardTone} from '../../types/card'\nimport {Placement} from '../../types/placement'\nimport {PopoverMargins} from '../../types/popover'\nimport {AnimateActivity} from '../../utils/animateActivity'\nimport {useBoundaryElement} from '../../utils/boundaryElement/useBoundaryElement'\nimport {getElementRef} from '../../utils/getElementRef'\nimport {LayerProps} from '../../utils/layer/layer'\nimport {LayerProvider} from '../../utils/layer/layerProvider'\nimport {useLayer} from '../../utils/layer/useLayer'\nimport {Portal} from '../../utils/portal/portal'\nimport {ResponsiveRadiusProps, ResponsiveShadowProps} from '../types'\nimport {\n  DEFAULT_FALLBACK_PLACEMENTS,\n  DEFAULT_POPOVER_DISTANCE,\n  DEFAULT_POPOVER_MARGINS,\n  DEFAULT_POPOVER_PADDING,\n} from './constants'\nimport {size} from './floating-ui/size'\nimport {calcCurrentWidth, calcMaxWidth} from './helpers'\nimport {PopoverCard} from './popoverCard'\nimport {PopoverUpdateCallback, PopoverWidth} from './types'\n\n/** @public */\nexport interface PopoverProps\n  extends Omit<LayerProps, 'as'>, ResponsiveRadiusProps, ResponsiveShadowProps {\n  /** @beta */\n  __unstable_margins?: PopoverMargins\n  /**\n   * Whether the popover should animate in and out.\n   *\n   * @beta\n   * @defaultValue false\n   */\n  animate?: boolean\n  arrow?: boolean\n  /** @deprecated Use `floatingBoundary` and/or `referenceBoundary` instead */\n  boundaryElement?: never\n  children?: React.JSX.Element\n  /**\n   * When `true`, prevent overflow within the current boundary:\n   * - by flipping on its side axis\n   * - by resizing\n  /*\n   * Note that:\n   * - setting `preventOverflow` to `true` also prevents overflow on its side axis\n   * - setting `matchReferenceWidth` to `true` also causes the popover to resize\n   *\n   * @defaultValue false\n   */\n  constrainSize?: boolean\n  content?: React.ReactNode\n  disabled?: boolean\n  fallbackPlacements?: Placement[]\n  floatingBoundary?: HTMLElement | null\n  /**\n   * When `true`, set the maximum width to match the reference element, and also prevent overflow within\n   * the current boundary by resizing.\n   *\n   * Note that setting `constrainSize` to `true` also causes the popover to resize\n   *\n   * @defaultValue false\n   */\n  matchReferenceWidth?: boolean\n  /**\n   * When true, blocks all pointer interaction with elements beneath the popover until closed.\n   *\n   * @beta\n   * @defaultValue false\n   */\n  modal?: boolean\n  open?: boolean\n  overflow?: BoxOverflow\n  padding?: number | number[]\n  placement?: Placement\n  /**\n   * When 'flip' (default), the placement is determined from the initial placement and the\n   * fallback placements in order. Whichever fits in the viewport first.\n   *\n   * When 'autoPlacement', the initial placement and all fallback placements are evaluated\n   * and the placement with the most viewport space available.\n   *\n   * Option is only relevant if either `constrainSize` or `preventOverflow` is `true`\n   */\n  placementStrategy?: 'flip' | 'autoPlacement'\n  /** Whether or not to render the popover in a portal element. */\n  portal?: boolean | string\n  preventOverflow?: boolean\n  referenceBoundary?: HTMLElement | null\n  /**\n   * When defined, the popover will be positioned relative to this element.\n   * The children of the popover won't be rendered.\n   */\n  referenceElement?: HTMLElement | null\n  scheme?: ThemeColorSchemeKey\n  tone?: CardTone\n  /** @beta */\n  updateRef?: Ref<PopoverUpdateCallback | undefined>\n  width?: PopoverWidth | PopoverWidth[]\n}\n\nconst ViewportOverlay = () => {\n  const {zIndex} = useLayer()\n\n  return (\n    <div\n      data-ui=\"PopoverOverlay\"\n      style={{height: '100vh', inset: 0, position: 'fixed', width: '100vw', zIndex}}\n    />\n  )\n}\n\n/**\n * The `Popover` component is used to display some content on top of another.\n *\n * @public\n */\nexport function Popover(\n  props: PopoverProps &\n    Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'children' | 'content' | 'width'>,\n): React.JSX.Element {\n  const {container, layer} = useTheme_v2()\n  const boundaryElementContext = useBoundaryElement()\n\n  const {\n    __unstable_margins: margins = DEFAULT_POPOVER_MARGINS,\n    animate: _animate = false,\n    arrow: arrowProp = false,\n    children: childProp,\n    constrainSize = false,\n    content,\n    disabled,\n    fallbackPlacements: _fallbackPlacements,\n    matchReferenceWidth,\n    floatingBoundary: _floatingBoundary,\n    modal,\n    // oxlint-disable-next-line no-unused-vars\n    onActivate,\n    open,\n    overflow = 'hidden',\n    padding: paddingProp,\n    placement: placementProp = 'bottom',\n    placementStrategy = 'flip',\n    portal,\n    preventOverflow = true,\n    radius: radiusProp = 3,\n    ref: forwardedRef,\n    referenceBoundary: _referenceBoundary,\n    referenceElement,\n    scheme,\n    shadow: shadowProp = 3,\n    tone = 'inherit',\n    width: widthProp = 'auto',\n    zOffset: _zOffsetProp,\n    updateRef,\n    ...restProps\n  } = props\n  const fallbackPlacements =\n    _fallbackPlacements ?? DEFAULT_FALLBACK_PLACEMENTS[props.placement ?? 'bottom']\n  const floatingBoundary = _floatingBoundary ?? boundaryElementContext.element\n  const referenceBoundary = _referenceBoundary ?? boundaryElementContext.element\n  // Max-width uses BoundaryElementProvider when present; otherwise the floating\n  // boundary (same element the old `boundaryElement` prop used for both).\n  const boundaryElement = boundaryElementContext.element ?? floatingBoundary\n  const zOffsetProp = _zOffsetProp ?? layer.popover.zOffset\n  const prefersReducedMotion = usePrefersReducedMotion()\n  const animate = prefersReducedMotion ? false : _animate\n  const boundarySize = useElementSize(boundaryElement)?.border\n  const padding = _getArrayProp(paddingProp)\n  const radius = _getArrayProp(radiusProp)\n  const shadow = _getArrayProp(shadowProp)\n  const widthArrayProp = _getArrayProp(widthProp)\n  const zOffset = _getArrayProp(zOffsetProp)\n  const ref = useRef<HTMLDivElement | null>(null)\n  const arrowRef = useRef<HTMLDivElement | null>(null)\n  const rootBoundary: RootBoundary = 'viewport'\n\n  useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(forwardedRef, () => ref.current)\n\n  const mediaIndex = useMediaIndex()\n  const boundaryWidth = constrainSize || preventOverflow ? boundarySize?.width : undefined\n\n  // Update width when\n  // - media index changes\n  // - `width` property changes\n  const width = calcCurrentWidth({\n    container,\n    mediaIndex,\n    width: widthArrayProp,\n  })\n  const widthRef = useRef(width)\n\n  useEffect(() => {\n    widthRef.current = width\n  }, [width])\n\n  // Update max width when\n  // - boundary width changes\n  // - `width` property changes\n  const maxWidth = calcMaxWidth({boundaryWidth, currentWidth: width})\n  const maxWidthRef = useRef(maxWidth)\n\n  useEffect(() => {\n    maxWidthRef.current = maxWidth\n  }, [maxWidth])\n\n  // Keep track of reference element width (see `size` middleware below)\n  const referenceWidthRef = useRef<number>(undefined)\n\n  // Force apply width & max width to floating element\n  useEffect(() => {\n    const floatingElement = ref.current\n\n    if (!open || !floatingElement) return\n\n    const referenceWidth = referenceWidthRef.current\n\n    if (matchReferenceWidth) {\n      if (referenceWidth !== undefined) {\n        floatingElement.style.width = `${referenceWidth}px`\n      }\n    } else if (width !== undefined) {\n      floatingElement.style.width = `${width}px`\n    }\n\n    if (typeof maxWidth === 'number') {\n      floatingElement.style.maxWidth = `${maxWidth}px`\n    }\n  }, [width, matchReferenceWidth, maxWidth, open])\n\n  const [referenceWidth, setReferenceWidth] = useState<number | undefined>(undefined)\n  const middleware = useMiddleware({\n    animate,\n    arrowProp,\n    arrowRef,\n    constrainSize,\n    fallbackPlacements,\n    floatingBoundary,\n    margins,\n    matchReferenceWidth,\n    maxWidthRef,\n    placementProp,\n    placementStrategy,\n    preventOverflow,\n    referenceBoundary,\n    referenceWidthRef,\n    rootBoundary,\n    setReferenceWidth,\n    widthRef,\n  })\n\n  const {x, y, middlewareData, placement, refs, strategy, update} = useFloating({\n    middleware,\n    placement: placementProp,\n    whileElementsMounted: autoUpdate,\n    elements: referenceElement\n      ? {\n          reference: referenceElement,\n        }\n      : undefined,\n  })\n\n  const referenceHidden = middlewareData.hide?.referenceHidden\n\n  const arrowX = middlewareData.arrow?.x\n  const arrowY = middlewareData.arrow?.y\n\n  const originX = middlewareData['@sanity/ui/origin']?.originX\n  const originY = middlewareData['@sanity/ui/origin']?.originY\n\n  const setArrow = useCallback((arrowEl: HTMLDivElement | null) => {\n    arrowRef.current = arrowEl\n  }, [])\n\n  const setFloating = useCallback(\n    (node: HTMLDivElement | null) => {\n      ref.current = node\n      refs.setFloating(node)\n    },\n    [refs],\n  )\n\n  // If there's a child then we need to set the reference element to the cloned child ref\n  // and if child changes we make sure to update or remove the reference element.\n  useImperativeHandle(childProp ? getElementRef(childProp) : null, () => refs.reference.current)\n\n  const child = useMemo(() => {\n    // If a reference element is defined, we don't need to clone the child\n    if (referenceElement) return childProp\n\n    if (!childProp) return null\n\n    return cloneElement(childProp, {ref: refs.setReference})\n  }, [childProp, referenceElement, refs.setReference])\n\n  useImperativeHandle(updateRef, () => update, [update])\n\n  if (disabled) {\n    return childProp || <></>\n  }\n\n  const popover = (\n    <LayerProvider zOffset={zOffset}>\n      {/* Optional transparent blocking overlay at the top-most z-index layer. Must be positioned before the below popover card. */}\n      {modal && <ViewportOverlay />}\n\n      <PopoverCard\n        {...restProps}\n        __unstable_margins={margins}\n        animate={animate}\n        arrow={arrowProp}\n        arrowRef={setArrow}\n        arrowX={arrowX}\n        arrowY={arrowY}\n        hidden={referenceHidden}\n        overflow={overflow}\n        padding={padding}\n        placement={placement}\n        radius={radius}\n        ref={setFloating}\n        scheme={scheme}\n        shadow={shadow}\n        originX={originX}\n        originY={originY}\n        strategy={strategy}\n        tone={tone}\n        width={matchReferenceWidth ? referenceWidth : width}\n        x={x}\n        y={y}\n      >\n        {content}\n      </PopoverCard>\n    </LayerProvider>\n  )\n\n  const popoverNode = portal ? (\n    <Portal __unstable_name={typeof portal === 'string' ? portal : undefined}>{popover}</Portal>\n  ) : (\n    popover\n  )\n\n  return (\n    <>\n      {/* the popover */}\n      {animate ? (\n        <AnimateActivity layoutMode=\"default\" mode={open ? 'visible' : 'hidden'}>\n          {popoverNode}\n        </AnimateActivity>\n      ) : (\n        <Activity mode={open ? 'visible' : 'hidden'}>{popoverNode}</Activity>\n      )}\n\n      {/* the referred element */}\n      {child}\n    </>\n  )\n}\n\nfunction useMiddleware({\n  animate,\n  arrowProp,\n  arrowRef,\n  constrainSize,\n  fallbackPlacements,\n  floatingBoundary,\n  margins,\n  matchReferenceWidth,\n  maxWidthRef,\n  placementProp,\n  placementStrategy,\n  preventOverflow,\n  referenceBoundary,\n  referenceWidthRef,\n  rootBoundary,\n  setReferenceWidth,\n  widthRef,\n}: {\n  animate: boolean\n  arrowProp: boolean\n  arrowRef: React.RefObject<HTMLDivElement | null>\n  constrainSize: boolean\n  fallbackPlacements: Placement[]\n  floatingBoundary: HTMLElement | null\n  margins: PopoverMargins\n  matchReferenceWidth: boolean | undefined\n  maxWidthRef: React.RefObject<number | undefined>\n  placementProp: Placement\n  placementStrategy: 'flip' | 'autoPlacement'\n  preventOverflow: boolean\n  referenceBoundary: HTMLElement | null\n  referenceWidthRef: React.RefObject<number | undefined>\n  rootBoundary: RootBoundary\n  setReferenceWidth: (referenceWidth: number) => void\n  widthRef: React.RefObject<number | undefined>\n}) {\n  return useMemo(() => {\n    const ret: Middleware[] = []\n\n    // Flip the floating element when leaving the boundary box\n    if (constrainSize || preventOverflow) {\n      if (placementStrategy === 'autoPlacement') {\n        ret.push(\n          autoPlacement({\n            allowedPlacements: [placementProp].concat(fallbackPlacements),\n          }),\n        )\n      } else {\n        ret.push(\n          flip({\n            boundary: floatingBoundary || undefined,\n            fallbackPlacements,\n            padding: DEFAULT_POPOVER_PADDING,\n            rootBoundary,\n          }),\n        )\n      }\n    }\n\n    // Define distance between reference and floating element\n    ret.push(offset({mainAxis: DEFAULT_POPOVER_DISTANCE}))\n\n    // Track sizes\n    if (constrainSize || matchReferenceWidth) {\n      ret.push(\n        size({\n          boundaryElement: floatingBoundary || undefined,\n          constrainSize,\n          margins,\n          matchReferenceWidth,\n          maxWidthRef,\n          padding: DEFAULT_POPOVER_PADDING,\n          referenceWidthRef,\n          setReferenceWidth,\n          widthRef,\n        }),\n      )\n    }\n\n    // Shift the popover so its sits within the boundary element\n    if (preventOverflow) {\n      ret.push(\n        shift({\n          boundary: floatingBoundary || undefined,\n          rootBoundary,\n          padding: DEFAULT_POPOVER_PADDING,\n        }),\n      )\n    }\n\n    // Place arrow\n    if (arrowProp) {\n      ret.push(\n        arrow({\n          element: arrowRef,\n          padding: DEFAULT_POPOVER_PADDING,\n        }),\n      )\n    }\n\n    // Determine the origin to scale from.\n    // Must be placed after `@sanity/ui/size` and `shift` middleware.\n    if (animate) {\n      ret.push(origin)\n    }\n\n    ret.push(\n      hide({\n        boundary: referenceBoundary || undefined,\n        padding: DEFAULT_POPOVER_PADDING,\n        strategy: 'referenceHidden',\n      }),\n    )\n\n    return ret\n  }, [\n    animate,\n    arrowProp,\n    arrowRef,\n    constrainSize,\n    fallbackPlacements,\n    floatingBoundary,\n    margins,\n    matchReferenceWidth,\n    maxWidthRef,\n    placementProp,\n    placementStrategy,\n    preventOverflow,\n    referenceBoundary,\n    referenceWidthRef,\n    rootBoundary,\n    setReferenceWidth,\n    widthRef,\n  ])\n}\n"],"mappings":"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"}

package/dist/popover-CMlQeKn0.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"popover-CMlQeKn0.d.ts","names":[],"sources":["../src/core/types/popover.ts","../src/core/primitives/popover/types.ts","../src/core/primitives/popover/popover.tsx"],"mappings":";;;;;;;KAGY;;KCFA;;KAIA;;UCkDK,qBACP,KAAK,mBAAmB,uBAAuB;;EAEvD,qBAAqB;;;;;;;EAOrB;EACA;;EAEA;EACA,WAAW,MAAM,IAAI;;;;;;;;;;;;EAYrB;EACA,UAAU,MAAM;EAChB;EACA,qBAAqB;EACrB,mBAAmB;;;;;;;;;EASnB;;;;;;;EAOA;EACA;EACA,WAAW;EACX;EACA,YAAY;;;;;;;;;;EAUZ;;EAEA;EACA;EACA,oBAAoB;;;;;EAKpB,mBAAmB;EACnB,SAAS;EACT,OAAO;;EAEP,YAAY,IAAI;EAChB,QAAQ,eAAe;;;;;;;iBAcT,QACd,OAAO,eACL,KAAK,MAAM,UAAU,4DACtB,MAAM,IAAI"}
+{"version":3,"file":"popover-CMlQeKn0.d.ts","names":[],"sources":["../src/core/types/popover.ts","../src/core/primitives/popover/types.ts","../src/core/primitives/popover/popover.tsx"],"mappings":";;;;;;;KAGY;;KCFA;;KAIA;;UCkDK,qBACP,KAAK,mBAAmB,uBAAuB;;EAEvD,qBAAqB;;;;;;;EAOrB;EACA;;EAEA;EACA,WAAW,MAAM,IAAI;;;;;;;;;;;;EAYrB;EACA,UAAU,MAAM;EAChB;EACA,qBAAqB;EACrB,mBAAmB;;;;;;;;;EASnB;;;;;;;EAOA;EACA;EACA,WAAW;EACX;EACA,YAAY;;;;;;;;;;EAUZ;;EAEA;EACA;EACA,oBAAoB;;;;;EAKpB,mBAAmB;EACnB,SAAS;EACT,OAAO;;EAEP,YAAY,IAAI;EAChB,QAAQ,eAAe;;;;;;;iBAmBT,QACd,OAAO,eACL,KAAK,MAAM,UAAU,4DACtB,MAAM,IAAI"}

package/dist/popover.js

@@ -1,3 +1,3 @@
 "use client";
-import { t as Popover } from "./popover-myCXZV_F.js";
+import { t as Popover } from "./popover-B7-28L8y.js";
 export { Popover };

package/dist/styles.css

@@ -35,11 +35,11 @@
   align-items: center;
 }
 
-._1lyk8y0:not([hidden]) {
+._1lyk8y1:not([hidden]) {
   display: flex;
 }
 
-._1lyk8y1 {
+._1lyk8y2 {
   flex: 1;
   min-width: 0;
   display: block;
@@ -62,34 +62,60 @@
   display: block;
 }
 
-._8fnjkq3._8fnjkq3 {
-  border-top-right-radius: 0;
-  border-bottom-right-radius: 0;
+._62mlcb1 {
+  width: var(--_62mlcb0);
+  height: var(--_62mlcb0);
+  position: absolute;
 }
 
-._8fnjkq3 > span {
-  margin: -1px;
-  display: block;
+:empty + ._62mlcb1 {
+  display: none;
 }
 
-._8fnjkq4._8fnjkq4 {
-  border-top-left-radius: 0;
-  border-bottom-left-radius: 0;
+[data-placement^="top"] > ._62mlcb1 {
+  bottom: calc(-1 * var(--_62mlcb0));
 }
 
-._8fnjkq4 > span {
-  margin: -1px;
+[data-placement^="right"] > ._62mlcb1 {
+  left: calc(-1 * var(--_62mlcb0));
+}
+
+[data-placement^="left"] > ._62mlcb1 {
+  right: calc(-1 * var(--_62mlcb0));
+}
+
+[data-placement^="bottom"] > ._62mlcb1 {
+  top: calc(-1 * var(--_62mlcb0));
+}
+
+._62mlcb1 > svg {
+  transform-origin: calc(var(--_62mlcb0) / 2) calc(var(--_62mlcb0) / 2);
+  line-height: 0;
   display: block;
 }
 
-._8fnjkq5 {
-  position: absolute;
-  top: 0;
-  right: 0;
+[data-placement^="top"] > ._62mlcb1 > svg {
+  transform: rotate(0);
+}
+
+[data-placement^="right"] > ._62mlcb1 > svg {
+  transform: rotate(90deg);
+}
+
+[data-placement^="left"] > ._62mlcb1 > svg {
+  transform: rotate(-90deg);
+}
+
+[data-placement^="bottom"] > ._62mlcb1 > svg {
+  transform: rotate(180deg);
 }
 
-._8fnjkq5._8fnjkq5 {
-  background-color: #0000;
+._62mlcb2 {
+  stroke: var(--card-shadow-outline-color);
+}
+
+._62mlcb3 {
+  fill: var(--card-bg-color);
 }
 
 ._4c0fmk0 {
@@ -116,16 +142,12 @@
   appearance: none;
 }
 
-._1alqbl41._1alqbl41 {
-  margin: -4px;
-}
-
 ._1ljw6pi0 {
   font: inherit;
   padding: 1px;
 }
 
-._1ljw6pi0:not([hidden]), ._1ljw6pi1._1ljw6pi1:not([hidden]) {
+._1ljw6pi0:not([hidden]) {
   display: block;
 }
 
@@ -178,6 +200,7 @@
   flex-direction: column;
   justify-content: center;
   align-items: center;
+  width: 100%;
   height: 100%;
 }
 
@@ -298,6 +321,94 @@
   position: relative;
 }
 
+._14vatmh1 {
+  transition: transform .1s;
+}
+
+._1jezl1b0 {
+  box-sizing: border-box;
+  z-index: 0;
+  opacity: 0;
+  transition: all .2s linear;
+  position: absolute;
+  inset: 0;
+  transform: rotate(-90deg) translate3d(0, 6px, 0);
+}
+
+[data-arrow-position="inside"] > ._1jezl1b0 {
+  opacity: 0;
+  transform: rotate(-90deg) translate3d(0, 6px, 0);
+}
+
+[data-arrow-position="top"] > ._1jezl1b0 {
+  opacity: 1;
+  transform: rotate(0);
+}
+
+[data-arrow-position="bottom"] > ._1jezl1b0 {
+  opacity: 1;
+  transform: rotate(-180deg);
+}
+
+._1jezl1b0 > svg {
+  width: 11px;
+  height: 7px;
+  position: absolute;
+  top: -5px;
+  left: 50%;
+  transform: translateX(-6px);
+}
+
+._1jezl1b0 > svg:not([hidden]) {
+  display: block;
+}
+
+._1jezl1b1 {
+  position: relative;
+}
+
+._1jezl1b2 {
+  stroke-width: 4px;
+  stroke: var(--card-bg-color);
+}
+
+._1jezl1b3 {
+  stroke-width: 2px;
+  stroke: var(--avatar-bg-color);
+}
+
+[data-status="editing"] ._1jezl1b3 {
+  stroke-dasharray: 2 4;
+  stroke-linecap: round;
+}
+
+._1jezl1b4 {
+  white-space: nowrap;
+}
+
+._1jezl1b4 > div {
+  vertical-align: top;
+}
+
+._1jezl1b4 > div:not([hidden]) {
+  display: inline-block;
+}
+
+._1jezl1b5 {
+  width: 100%;
+  height: 100%;
+  color: var(--avatar-fg-color);
+  text-transform: uppercase;
+  text-align: center;
+  border-radius: 50%;
+  justify-content: center;
+  align-items: center;
+}
+
+._1jezl1b5:not([hidden]) {
+  display: flex;
+}
+
 .ycv36y0 {
   display: inline-block;
   position: relative;

package/dist/{textInput-DAaORuky.js → textInput-pSfQjkmx.js}

@@ -3,7 +3,7 @@ import { a as isHTMLElement, c as isHTMLTextAreaElement, i as isHTMLButtonElemen
 import { t as getTheme_v2 } from "./getTheme_v2-y09KqtEb.js";
 import { l as useRootTheme, m as focusRingStyle, p as focusRingBorderStyle, s as Card, v as responsiveRadiusStyle, y as Box } from "./useLayer-D1usxIE0.js";
 import { n as Text } from "./stack-rsNFPq2-.js";
-import { t as Button } from "./button-Dh_M2fYx.js";
+import { t as Button } from "./button-BNyKSDyA.js";
 import { c } from "react/compiler-runtime";
 import { clsx } from "clsx/lite";
 import { isValidElement, useEffect, useImperativeHandle, useRef } from "react";
@@ -143,14 +143,23 @@ function textInputRepresentationStyle(props) {
 		width: input.border.width
 	})};}}}`;
 }
-var inputRoot = "_1lyk8y1", textInputRoot = "_1lyk8y0";
-const CLEAR_BUTTON_BOX_STYLE = { zIndex: 2 }, Input = /* @__PURE__ */ styled.input.withConfig({
+var inputRoot = "_1lyk8y2", textAreaRoot = "_1lyk8y1 _1lyk8y0", textInputRoot = "_1lyk8y0";
+const CLEAR_BUTTON_BOX_STYLE = { zIndex: 2 }, Prefix = styled(Card).attrs({ forwardedAs: "span" }).withConfig({
+	displayName: "Prefix",
+	componentId: "sc-k29dck-0"
+})`border-top-right-radius:0;border-bottom-right-radius:0;& > span{display:block;margin:-1px;}`, Suffix = styled(Card).attrs({ forwardedAs: "span" }).withConfig({
+	displayName: "Suffix",
+	componentId: "sc-k29dck-1"
+})`border-top-left-radius:0;border-bottom-left-radius:0;& > span{display:block;margin:-1px;}`, Input = /* @__PURE__ */ styled.input.withConfig({
 	displayName: "Input",
-	componentId: "sc-fkdyjt-0"
+	componentId: "sc-k29dck-2"
 })(responsiveInputPaddingStyle, textInputBaseStyle, textInputFontSizeStyle), Presentation = /* @__PURE__ */ styled.span.withConfig({
 	displayName: "Presentation",
-	componentId: "sc-fkdyjt-1"
-})(responsiveRadiusStyle, textInputRepresentationStyle);
+	componentId: "sc-k29dck-3"
+})(responsiveRadiusStyle, textInputRepresentationStyle), RightCard = styled(Card).withConfig({
+	displayName: "RightCard",
+	componentId: "sc-k29dck-4"
+})`background-color:transparent;position:absolute;top:0;right:0;`;
 /**
 * Single line text input.
 *
@@ -174,12 +183,10 @@ function TextInput(props) {
 		event_0.preventDefault(), event_0.stopPropagation(), onClear && onClear(), ref.current?.focus();
 	}, $[29] = onClear, $[30] = t12);
 	let handleClearClick = t12, t13;
-	$[31] !== prefix || $[32] !== radius ? (t13 = prefix && /* @__PURE__ */ jsx(Card, {
+	$[31] !== prefix || $[32] !== radius ? (t13 = prefix && /* @__PURE__ */ jsx(Prefix, {
 		borderTop: !0,
 		borderLeft: !0,
 		borderBottom: !0,
-		className: "_8fnjkq3",
-		as: "span",
 		radius,
 		sizing: "border",
 		tone: "inherit",
@@ -221,9 +228,8 @@ function TextInput(props) {
 	let clearButtonBoxPadding = t18, t19;
 	$[55] === padding ? t19 = $[56] : (t19 = padding.map(_temp3), $[55] = padding, $[56] = t19);
 	let clearButtonPadding = t19, clearButtonProps = typeof clearButton == "object" ? clearButton : EMPTY_RECORD, t20;
-	$[57] !== clearButton || $[58] !== clearButtonBoxPadding || $[59] !== clearButtonPadding || $[60] !== clearButtonProps || $[61] !== customValidity || $[62] !== disabled || $[63] !== fontSize || $[64] !== handleClearClick || $[65] !== radius || $[66] !== readOnly ? (t20 = !disabled && !readOnly && clearButton && /* @__PURE__ */ jsx(Card, {
-		className: "_8fnjkq5",
-		as: "span",
+	$[57] !== clearButton || $[58] !== clearButtonBoxPadding || $[59] !== clearButtonPadding || $[60] !== clearButtonProps || $[61] !== customValidity || $[62] !== disabled || $[63] !== fontSize || $[64] !== handleClearClick || $[65] !== radius || $[66] !== readOnly ? (t20 = !disabled && !readOnly && clearButton && /* @__PURE__ */ jsx(RightCard, {
+		forwardedAs: "span",
 		padding: clearButtonBoxPadding,
 		style: CLEAR_BUTTON_BOX_STYLE,
 		tone: customValidity ? "critical" : "inherit",
@@ -242,12 +248,10 @@ function TextInput(props) {
 		})
 	}), $[57] = clearButton, $[58] = clearButtonBoxPadding, $[59] = clearButtonPadding, $[60] = clearButtonProps, $[61] = customValidity, $[62] = disabled, $[63] = fontSize, $[64] = handleClearClick, $[65] = radius, $[66] = readOnly, $[67] = t20) : t20 = $[67];
 	let clearButtonNode = t20, t21;
-	$[68] !== radius || $[69] !== suffix ? (t21 = suffix && /* @__PURE__ */ jsx(Card, {
+	$[68] !== radius || $[69] !== suffix ? (t21 = suffix && /* @__PURE__ */ jsx(Suffix, {
 		borderTop: !0,
 		borderRight: !0,
 		borderBottom: !0,
-		className: "_8fnjkq4",
-		as: "span",
 		radius,
 		sizing: "border",
 		tone: "inherit",
@@ -304,6 +308,6 @@ function _temp2(v) {
 function _temp(event) {
 	event.preventDefault(), event.stopPropagation();
 }
-export { textInputFontSizeStyle as a, responsiveInputPaddingStyle as c, attemptFocus as d, focusFirstDescendant as f, _raf2 as g, _raf as h, textInputBaseStyle as i, useCustomValidity as l, isFocusable as m, inputRoot as n, textInputRepresentationStyle as o, focusLastDescendant as p, textInputRoot as r, responsiveInputPaddingIconRightStyle as s, TextInput as t, _hasFocus as u };
+export { textInputFontSizeStyle as a, responsiveInputPaddingStyle as c, attemptFocus as d, focusFirstDescendant as f, _raf2 as g, _raf as h, textInputBaseStyle as i, useCustomValidity as l, isFocusable as m, inputRoot as n, textInputRepresentationStyle as o, focusLastDescendant as p, textAreaRoot as r, responsiveInputPaddingIconRightStyle as s, TextInput as t, _hasFocus as u };
 
-//# sourceMappingURL=textInput-DAaORuky.js.map
+//# sourceMappingURL=textInput-pSfQjkmx.js.map