@sanity/ui 2.8.24-canary.1 → 2.8.24

package/dist/index.d.mts

@@ -983,7 +983,7 @@ export declare interface FontWeightStyleProps {
 /**
  * @internal
  */
-export declare function _getArrayProp<T = number>(val: T | T[] | undefined): T[]
+export declare function _getArrayProp<T = number>(val: T | T[] | undefined, defaultVal?: T[]): T[]
 
 /**
  * @internal
@@ -2706,6 +2706,7 @@ export declare interface TreeState {
  */
 export declare function useArrayProp<T extends ArrayPropPrimitive = ArrayPropPrimitive>(
   val: T | T[] | undefined,
+  defaultVal?: T[],
 ): T[]
 
 /**

package/dist/index.d.ts

@@ -983,7 +983,7 @@ export declare interface FontWeightStyleProps {
 /**
  * @internal
  */
-export declare function _getArrayProp<T = number>(val: T | T[] | undefined): T[]
+export declare function _getArrayProp<T = number>(val: T | T[] | undefined, defaultVal?: T[]): T[]
 
 /**
  * @internal
@@ -2706,6 +2706,7 @@ export declare interface TreeState {
  */
 export declare function useArrayProp<T extends ArrayPropPrimitive = ArrayPropPrimitive>(
   val: T | T[] | undefined,
+  defaultVal?: T[],
 ): T[]
 
 /**

package/dist/index.esm.js

@@ -45,8 +45,8 @@ function _responsive(media, values, callback) {
     [`@media screen and (min-width: ${media[mediaIndex - 1]}px)`]: statement
   });
 }
-function _getArrayProp(val) {
-  return val === void 0 ? EMPTY_ARRAY : Array.isArray(val) ? val : [val];
+function _getArrayProp(val, defaultVal) {
+  return val === void 0 ? defaultVal || EMPTY_ARRAY : Array.isArray(val) ? val : [val];
 }
 function _getResponsiveSpace(theme, props, spaceIndexes = EMPTY_ARRAY) {
   if (!Array.isArray(spaceIndexes))
@@ -153,21 +153,12 @@ function responsiveTextAlignStyle(props) {
 function responsiveTextFont(props) {
   return responsiveFont("text", props);
 }
-function useArrayProp(val) {
-  const $ = c(6);
+function useArrayProp(val, defaultVal) {
+  const $ = c(3);
   let t0;
-  $[0] !== val ? (t0 = () => [_getArrayProp(val), JSON.stringify(val)], $[0] = val, $[1] = t0) : t0 = $[1];
-  const [t1, setCache] = useState(t0), [cachedVal, cachedHash] = t1;
-  let result = cachedVal, t2;
-  $[2] !== val ? (t2 = JSON.stringify(val), $[2] = val, $[3] = t2) : t2 = $[3];
-  const hash = t2;
-  if (hash !== cachedHash) {
-    let t3;
-    $[4] !== val ? (t3 = _getArrayProp(val), $[4] = val, $[5] = t3) : t3 = $[5];
-    const current = t3;
-    setCache([current, hash]), result = current;
-  }
-  return result;
+  $[0] !== defaultVal || $[1] !== val ? (t0 = () => [_getArrayProp(val, defaultVal), JSON.stringify(val ?? defaultVal)], $[0] = defaultVal, $[1] = val, $[2] = t0) : t0 = $[2];
+  const [t1, setCache] = useState(t0), [cachedVal, cachedHash] = t1, hash = JSON.stringify(val ?? defaultVal);
+  return hash !== cachedHash && setCache([_getArrayProp(val, defaultVal), hash]), cachedVal;
 }
 function _getElements(element, elementsArg) {
   const ret = [element];
@@ -217,7 +208,7 @@ function useClickOutside(listener, t0, boundaryElement) {
   }, t5 = [boundaryElement, listener, elements], $[7] = boundaryElement, $[8] = elements, $[9] = listener, $[10] = t4, $[11] = t5) : (t4 = $[10], t5 = $[11]), useEffect(t4, t5), setElement;
 }
 function useClickOutsideEvent(listener, t0, boundaryElement) {
-  const $ = c(8), elementsArg = t0 === void 0 ? _temp$6 : t0;
+  const $ = c(8), elementsArg = t0 === void 0 ? _temp$b : t0;
   let t1;
   $[0] !== boundaryElement || $[1] !== elementsArg || $[2] !== listener ? (t1 = (evt) => {
     if (!listener)
@@ -245,7 +236,7 @@ function useClickOutsideEvent(listener, t0, boundaryElement) {
     };
   }, t3 = [hasListener, onEvent], $[4] = hasListener, $[5] = onEvent, $[6] = t2, $[7] = t3) : (t2 = $[6], t3 = $[7]), useEffect(t2, t3), useDebugValue(listener ? "MouseDown On" : "MouseDown Off");
 }
-function _temp$6() {
+function _temp$b() {
   return EMPTY_ARRAY;
 }
 function useCustomValidity(ref, customValidity) {
@@ -752,15 +743,15 @@ function useMediaIndex() {
   return useSyncExternalStore(store.subscribe, store.getSnapshot, getServerSnapshot);
 }
 function usePrefersDark(t0) {
-  return useMatchMedia("(prefers-color-scheme: dark)", t0 === void 0 ? _temp$5 : t0);
+  return useMatchMedia("(prefers-color-scheme: dark)", t0 === void 0 ? _temp$a : t0);
 }
-function _temp$5() {
+function _temp$a() {
   return !1;
 }
 function usePrefersReducedMotion(t0) {
-  return useMatchMedia("(prefers-reduced-motion: reduce)", t0 === void 0 ? _temp$4 : t0);
+  return useMatchMedia("(prefers-reduced-motion: reduce)", t0 === void 0 ? _temp$9 : t0);
 }
-function _temp$4() {
+function _temp$9() {
   return !1;
 }
 function responsiveBorderStyle() {
@@ -1647,7 +1638,7 @@ function avatarStrokeStyle() {
 const Root$B = styled.div(responsiveAvatarSizeStyle, avatarStyle.root), Arrow$1 = styled.div(avatarStyle.arrow), BgStroke = styled.ellipse(avatarStyle.bgStroke), Stroke = styled.ellipse(avatarStyle.stroke), Initials = styled.div(avatarStyle.initials), InitialsLabel = styled(Label)({
   color: "inherit"
 }), Image = styled.svg(avatarStyle.image), Avatar = forwardRef(function(props, ref) {
-  const $ = c(53);
+  const $ = c(52);
   let __unstable_hideInnerStroke, animateArrowFrom, arrowPositionProp, asProp, initials, onImageLoadError, restProps, src, t0, t1, t2, title;
   $[0] !== props ? ({
     __unstable_hideInnerStroke,
@@ -1683,32 +1674,30 @@ const Root$B = styled.div(responsiveAvatarSizeStyle, avatarStyle.root), Arrow$1
   }, $[20] = onImageLoadError, $[21] = t7) : t7 = $[21];
   const handleImageError = t7;
   let t8, t9;
-  if ($[22] !== size2) {
-    let t102;
-    $[24] === Symbol.for("react.memo_cache_sentinel") ? (t102 = (s) => s === 1 ? 1 : s === 2 ? 3 : s === 3 ? 5 : 0, $[24] = t102) : t102 = $[24], t9 = size2.map(t102), $[22] = size2, $[23] = t9;
-  } else
-    t9 = $[23];
-  t8 = t9;
+  $[22] !== size2 ? (t9 = size2.map(_temp$8), $[22] = size2, $[23] = t9) : t9 = $[23], t8 = t9;
   const initialsSize = t8, t10 = typeof as == "string" ? as : void 0;
   let t11;
-  $[25] !== color ? (t11 = /* @__PURE__ */ jsx(Arrow$1, { children: /* @__PURE__ */ jsx("svg", { width: "11", height: "7", viewBox: "0 0 11 7", fill: "none", children: /* @__PURE__ */ jsx("path", { d: "M6.67948 1.50115L11 7L0 7L4.32052 1.50115C4.92109 0.736796 6.07891 0.736795 6.67948 1.50115Z", fill: color }) }) }), $[25] = color, $[26] = t11) : t11 = $[26];
+  $[24] !== color ? (t11 = /* @__PURE__ */ jsx(Arrow$1, { children: /* @__PURE__ */ jsx("svg", { width: "11", height: "7", viewBox: "0 0 11 7", fill: "none", children: /* @__PURE__ */ jsx("path", { d: "M6.67948 1.50115L11 7L0 7L4.32052 1.50115C4.92109 0.736796 6.07891 0.736795 6.67948 1.50115Z", fill: color }) }) }), $[24] = color, $[25] = t11) : t11 = $[25];
   let t12;
-  $[27] !== __unstable_hideInnerStroke || $[28] !== _radius || $[29] !== _sizeRem || $[30] !== handleImageError || $[31] !== imageFailed || $[32] !== imageId || $[33] !== src ? (t12 = !imageFailed && src && /* @__PURE__ */ jsxs(Image, { viewBox: `0 0 ${_sizeRem} ${_sizeRem}`, fill: "none", children: [
+  $[26] !== __unstable_hideInnerStroke || $[27] !== _radius || $[28] !== _sizeRem || $[29] !== handleImageError || $[30] !== imageFailed || $[31] !== imageId || $[32] !== src ? (t12 = !imageFailed && src && /* @__PURE__ */ jsxs(Image, { viewBox: `0 0 ${_sizeRem} ${_sizeRem}`, fill: "none", children: [
     /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("pattern", { id: imageId, patternContentUnits: "objectBoundingBox", width: "1", height: "1", children: /* @__PURE__ */ jsx("image", { href: src, width: "1", height: "1", onError: handleImageError }) }) }),
     /* @__PURE__ */ jsx("circle", { cx: _radius, cy: _radius, r: _radius, fill: `url(#${imageId})` }),
     !__unstable_hideInnerStroke && /* @__PURE__ */ jsx(BgStroke, { cx: _radius, cy: _radius, rx: _radius, ry: _radius, vectorEffect: "non-scaling-stroke" }),
     /* @__PURE__ */ jsx(Stroke, { cx: _radius, cy: _radius, rx: _radius, ry: _radius, vectorEffect: "non-scaling-stroke" })
-  ] }), $[27] = __unstable_hideInnerStroke, $[28] = _radius, $[29] = _sizeRem, $[30] = handleImageError, $[31] = imageFailed, $[32] = imageId, $[33] = src, $[34] = t12) : t12 = $[34];
+  ] }), $[26] = __unstable_hideInnerStroke, $[27] = _radius, $[28] = _sizeRem, $[29] = handleImageError, $[30] = imageFailed, $[31] = imageId, $[32] = src, $[33] = t12) : t12 = $[33];
   let t13;
-  $[35] !== imageFailed || $[36] !== initials || $[37] !== initialsSize || $[38] !== src ? (t13 = (imageFailed || !src) && initials && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(Initials, { children: /* @__PURE__ */ jsx(InitialsLabel, { forwardedAs: "span", size: initialsSize, weight: "medium", children: initials }) }) }), $[35] = imageFailed, $[36] = initials, $[37] = initialsSize, $[38] = src, $[39] = t13) : t13 = $[39];
+  $[34] !== imageFailed || $[35] !== initials || $[36] !== initialsSize || $[37] !== src ? (t13 = (imageFailed || !src) && initials && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(Initials, { children: /* @__PURE__ */ jsx(InitialsLabel, { forwardedAs: "span", size: initialsSize, weight: "medium", children: initials }) }) }), $[34] = imageFailed, $[35] = initials, $[36] = initialsSize, $[37] = src, $[38] = t13) : t13 = $[38];
   let t14;
-  return $[40] !== arrowPosition || $[41] !== as || $[42] !== color || $[43] !== ref || $[44] !== restProps || $[45] !== size2 || $[46] !== status || $[47] !== t10 || $[48] !== t11 || $[49] !== t12 || $[50] !== t13 || $[51] !== title ? (t14 = /* @__PURE__ */ jsxs(Root$B, { as, "data-as": t10, "data-ui": "Avatar", ...restProps, $color: color, $size: size2, "aria-label": title, "data-arrow-position": arrowPosition, "data-status": status, ref, title, children: [
+  return $[39] !== arrowPosition || $[40] !== as || $[41] !== color || $[42] !== ref || $[43] !== restProps || $[44] !== size2 || $[45] !== status || $[46] !== t10 || $[47] !== t11 || $[48] !== t12 || $[49] !== t13 || $[50] !== title ? (t14 = /* @__PURE__ */ jsxs(Root$B, { as, "data-as": t10, "data-ui": "Avatar", ...restProps, $color: color, $size: size2, "aria-label": title, "data-arrow-position": arrowPosition, "data-status": status, ref, title, children: [
     t11,
     t12,
     t13
-  ] }), $[40] = arrowPosition, $[41] = as, $[42] = color, $[43] = ref, $[44] = restProps, $[45] = size2, $[46] = status, $[47] = t10, $[48] = t11, $[49] = t12, $[50] = t13, $[51] = title, $[52] = t14) : t14 = $[52], t14;
+  ] }), $[39] = arrowPosition, $[40] = as, $[41] = color, $[42] = ref, $[43] = restProps, $[44] = size2, $[45] = status, $[46] = t10, $[47] = t11, $[48] = t12, $[49] = t13, $[50] = title, $[51] = t14) : t14 = $[51], t14;
 });
 Avatar.displayName = "ForwardRef(Avatar)";
+function _temp$8(s) {
+  return s === 1 ? 1 : s === 2 ? 3 : s === 3 ? 5 : 0;
+}
 function _responsiveAvatarCounterSizeStyle(props) {
   const {
     avatar,
@@ -1746,24 +1735,22 @@ function _avatarCounterBaseStyle(props) {
   `;
 }
 const Root$A = styled.div(_responsiveAvatarCounterSizeStyle, _avatarCounterBaseStyle), AvatarCounter = forwardRef(function(props, ref) {
-  const $ = c(10), {
+  const $ = c(9), {
     count,
     size: t0
   } = props, size2 = useArrayProp(t0 === void 0 ? 1 : t0);
   let t1, t2;
-  if ($[0] !== size2) {
-    let t32;
-    $[2] === Symbol.for("react.memo_cache_sentinel") ? (t32 = (s) => s === 1 ? 1 : s === 2 ? 3 : s === 3 ? 5 : 0, $[2] = t32) : t32 = $[2], t2 = size2.map(t32), $[0] = size2, $[1] = t2;
-  } else
-    t2 = $[1];
-  t1 = t2;
+  $[0] !== size2 ? (t2 = size2.map(_temp$7), $[0] = size2, $[1] = t2) : t2 = $[1], t1 = t2;
   const fontSize2 = t1;
   let t3;
-  $[3] !== count || $[4] !== fontSize2 ? (t3 = /* @__PURE__ */ jsx(Label, { as: "span", size: fontSize2, weight: "medium", children: count }), $[3] = count, $[4] = fontSize2, $[5] = t3) : t3 = $[5];
+  $[2] !== count || $[3] !== fontSize2 ? (t3 = /* @__PURE__ */ jsx(Label, { as: "span", size: fontSize2, weight: "medium", children: count }), $[2] = count, $[3] = fontSize2, $[4] = t3) : t3 = $[4];
   let t4;
-  return $[6] !== ref || $[7] !== size2 || $[8] !== t3 ? (t4 = /* @__PURE__ */ jsx(Root$A, { $size: size2, "data-ui": "AvatarCounter", ref, children: t3 }), $[6] = ref, $[7] = size2, $[8] = t3, $[9] = t4) : t4 = $[9], t4;
+  return $[5] !== ref || $[6] !== size2 || $[7] !== t3 ? (t4 = /* @__PURE__ */ jsx(Root$A, { $size: size2, "data-ui": "AvatarCounter", ref, children: t3 }), $[5] = ref, $[6] = size2, $[7] = t3, $[8] = t4) : t4 = $[8], t4;
 });
 AvatarCounter.displayName = "ForwardRef(AvatarCounter)";
+function _temp$7(s) {
+  return s === 1 ? 1 : s === 2 ? 3 : s === 3 ? 5 : 0;
+}
 const BASE_STYLES = css`
   white-space: nowrap;
 
@@ -2959,7 +2946,7 @@ function inlineSpaceStyle(props) {
   });
 }
 const Root$m = styled(Box)(inlineBaseStyle, inlineSpaceStyle), Inline = forwardRef(function(props, ref) {
-  const $ = c(13);
+  const $ = c(12);
   let as, childrenProp, restProps, space;
   $[0] !== props ? ({
     as,
@@ -2968,17 +2955,15 @@ const Root$m = styled(Box)(inlineBaseStyle, inlineSpaceStyle), Inline = forwardR
     ...restProps
   } = props, $[0] = props, $[1] = as, $[2] = childrenProp, $[3] = restProps, $[4] = space) : (as = $[1], childrenProp = $[2], restProps = $[3], space = $[4]);
   let t0, t1;
-  if ($[5] !== childrenProp) {
-    let t22;
-    $[7] === Symbol.for("react.memo_cache_sentinel") ? (t22 = (child) => child && /* @__PURE__ */ jsx("div", { children: child }), $[7] = t22) : t22 = $[7], t1 = Children.map(childrenProp, t22), $[5] = childrenProp, $[6] = t1;
-  } else
-    t1 = $[6];
-  t0 = t1;
+  $[5] !== childrenProp ? (t1 = Children.map(childrenProp, _temp$6), $[5] = childrenProp, $[6] = t1) : t1 = $[6], t0 = t1;
   const children = t0, t2 = useArrayProp(space);
   let t3;
-  return $[8] !== as || $[9] !== children || $[10] !== restProps || $[11] !== t2 ? (t3 = /* @__PURE__ */ jsx(Root$m, { "data-ui": "Inline", ...restProps, $space: t2, forwardedAs: as, ref, children }), $[8] = as, $[9] = children, $[10] = restProps, $[11] = t2, $[12] = t3) : t3 = $[12], t3;
+  return $[7] !== as || $[8] !== children || $[9] !== restProps || $[10] !== t2 ? (t3 = /* @__PURE__ */ jsx(Root$m, { "data-ui": "Inline", ...restProps, $space: t2, forwardedAs: as, ref, children }), $[7] = as, $[8] = children, $[9] = restProps, $[10] = t2, $[11] = t3) : t3 = $[11], t3;
 });
 Inline.displayName = "ForwardRef(Inline)";
+function _temp$6(child) {
+  return child && /* @__PURE__ */ jsx("div", { children: child });
+}
 function kbdStyle() {
   return css`
     --card-bg-color: var(--card-kbd-bg-color);
@@ -3407,13 +3392,13 @@ function LayerProvider(props) {
         [childLevel]: prevLen + 1
       };
       return setSize(Object.keys(nextState).length), nextState;
-    }) : setSize((v) => v + 1), () => {
+    }) : setSize(_temp$5), () => {
       childLevel !== void 0 ? setChildLayers((state_0) => {
         const nextState_0 = {
           ...state_0
         };
         return nextState_0[childLevel] === 1 ? (delete nextState_0[childLevel], setSize(Object.keys(nextState_0).length)) : nextState_0[childLevel] = nextState_0[childLevel] - 1, nextState_0;
-      }) : setSize((v_0) => v_0 - 1), parentDispose?.();
+      }) : setSize(_temp2$3), parentDispose?.();
     };
   }, $[3] = parentRegisterChild, $[4] = setChildLayers, $[5] = t3) : t3 = $[5];
   const registerChild = t3;
@@ -3432,6 +3417,12 @@ function LayerProvider(props) {
   let t8;
   return $[16] !== children || $[17] !== value ? (t8 = /* @__PURE__ */ jsx(LayerContext.Provider, { value, children }), $[16] = children, $[17] = value, $[18] = t8) : t8 = $[18], t8;
 }
+function _temp2$3(v_0) {
+  return v_0 - 1;
+}
+function _temp$5(v) {
+  return v + 1;
+}
 LayerProvider.displayName = "LayerProvider";
 const Root$j = styled.div({
   position: "relative"
@@ -3518,8 +3509,9 @@ function PortalProvider(props) {
   const $ = c(7), {
     boundaryElement,
     children,
-    element
-  } = props, elements = useUnique(props.__unstable_elements), fallbackElement = useSyncExternalStore(emptySubscribe, _temp$3, _temp2$1);
+    element,
+    __unstable_elements: elementsProp
+  } = props, elements = useUnique(elementsProp), fallbackElement = useSyncExternalStore(emptySubscribe, _temp$4, _temp2$2);
   let t0;
   const t1 = boundaryElement || null, t2 = element || fallbackElement;
   let t3;
@@ -3533,21 +3525,20 @@ function PortalProvider(props) {
   let t4;
   return $[4] !== children || $[5] !== value ? (t4 = /* @__PURE__ */ jsx(PortalContext.Provider, { value, children }), $[4] = children, $[5] = value, $[6] = t4) : t4 = $[6], t4;
 }
-function _temp2$1() {
+function _temp2$2() {
   return null;
 }
-function _temp$3() {
+function _temp$4() {
   return document.body;
 }
 PortalProvider.displayName = "PortalProvider";
 const emptySubscribe = () => () => {
 };
 function useUnique(value) {
-  const [cachedValue, setCachedValue] = useState(value);
-  let result = cachedValue;
-  return isEqual(cachedValue, value) || (setCachedValue(value), result = value), result;
+  const valueRef = useRef(value);
+  return _isEqual(valueRef.current, value) || (valueRef.current = value), valueRef.current;
 }
-function isEqual(objA, objB) {
+function _isEqual(objA, objB) {
   if (!objA || !objB)
     return objA === objB;
   const keysA = Object.keys(objA), keysB = Object.keys(objB);
@@ -4601,7 +4592,7 @@ const CLEAR_BUTTON_BOX_STYLE = {
     display: "block"
   }
 }), TextInput = forwardRef(function(props, forwardedRef) {
-  const $ = c(86);
+  const $ = c(84);
   let IconComponent, IconRightComponent, __unstable_disableFocusRing, clearButton, customValidity, onClear, prefix, readOnly, restProps, suffix, t0, t1, t2, t3, t4, t5, t6, weight;
   $[0] !== props ? ({
     __unstable_disableFocusRing,
@@ -4626,7 +4617,7 @@ const CLEAR_BUTTON_BOX_STYLE = {
   const border2 = t0 === void 0 ? !0 : t0, disabled = t1 === void 0 ? !1 : t1, fontSizeProp = t2 === void 0 ? 2 : t2, paddingProp = t3 === void 0 ? 3 : t3, radiusProp = t4 === void 0 ? 2 : t4, spaceProp = t5 === void 0 ? 3 : t5, type = t6 === void 0 ? "text" : t6, ref = useRef(null), rootTheme = useRootTheme(), fontSize2 = useArrayProp(fontSizeProp), padding = useArrayProp(paddingProp), radius = useArrayProp(radiusProp), space = useArrayProp(spaceProp), $hasClearButton = !!clearButton, $hasIcon = !!IconComponent, $hasIconRight = !!IconRightComponent, $hasSuffix = !!suffix, $hasPrefix = !!prefix;
   let t7;
   $[19] === Symbol.for("react.memo_cache_sentinel") ? (t7 = () => ref.current, $[19] = t7) : t7 = $[19], useImperativeHandle(forwardedRef, t7), useCustomValidity(ref, customValidity);
-  const handleClearMouseDown = _temp$2;
+  const handleClearMouseDown = _temp$3;
   let t8;
   $[20] !== onClear ? (t8 = (event_0) => {
     event_0.preventDefault(), event_0.stopPropagation(), onClear && onClear(), ref.current?.focus();
@@ -4654,49 +4645,45 @@ const CLEAR_BUTTON_BOX_STYLE = {
   ] }), $[34] = $hasPrefix, $[35] = $hasSuffix, $[36] = __unstable_disableFocusRing, $[37] = radius, $[38] = rootTheme.scheme, $[39] = rootTheme.tone, $[40] = t12, $[41] = t13, $[42] = t14, $[43] = t15) : t15 = $[43], t11 = t15;
   const presentationNode = t11;
   let t16, t17;
-  if ($[44] !== padding) {
-    let t182;
-    $[46] === Symbol.for("react.memo_cache_sentinel") ? (t182 = (v) => v === 0 ? 0 : v === 1 || v === 2 ? 1 : v - 2, $[46] = t182) : t182 = $[46], t17 = padding.map(t182), $[44] = padding, $[45] = t17;
-  } else
-    t17 = $[45];
-  t16 = t17;
+  $[44] !== padding ? (t17 = padding.map(_temp2$1), $[44] = padding, $[45] = t17) : t17 = $[45], t16 = t17;
   const clearButtonBoxPadding = t16;
   let t18, t19;
-  if ($[47] !== padding) {
-    let t202;
-    $[49] === Symbol.for("react.memo_cache_sentinel") ? (t202 = (v_0) => v_0 === 0 || v_0 === 1 ? 0 : v_0 === 2 ? 1 : v_0 - 1, $[49] = t202) : t202 = $[49], t19 = padding.map(t202), $[47] = padding, $[48] = t19;
-  } else
-    t19 = $[48];
-  t18 = t19;
+  $[46] !== padding ? (t19 = padding.map(_temp3), $[46] = padding, $[47] = t19) : t19 = $[47], t18 = t19;
   const clearButtonPadding = t18;
   let t20;
   t20 = typeof clearButton == "object" ? clearButton : EMPTY_RECORD;
   const clearButtonProps = t20;
   let t21, t22;
-  $[50] !== clearButton || $[51] !== clearButtonBoxPadding || $[52] !== clearButtonPadding || $[53] !== clearButtonProps || $[54] !== customValidity || $[55] !== disabled || $[56] !== fontSize2 || $[57] !== handleClearClick || $[58] !== radius || $[59] !== readOnly ? (t22 = !disabled && !readOnly && clearButton && /* @__PURE__ */ jsx(RightCard, { forwardedAs: "span", padding: clearButtonBoxPadding, style: CLEAR_BUTTON_BOX_STYLE, tone: customValidity ? "critical" : "inherit", children: /* @__PURE__ */ jsx(TextInputClearButton, { "aria-label": "Clear", "data-qa": "clear-button", fontSize: fontSize2, icon: CloseIcon, mode: "bleed", padding: clearButtonPadding, radius, ...clearButtonProps, onClick: handleClearClick, onMouseDown: handleClearMouseDown }) }), $[50] = clearButton, $[51] = clearButtonBoxPadding, $[52] = clearButtonPadding, $[53] = clearButtonProps, $[54] = customValidity, $[55] = disabled, $[56] = fontSize2, $[57] = handleClearClick, $[58] = radius, $[59] = readOnly, $[60] = t22) : t22 = $[60], t21 = t22;
+  $[48] !== clearButton || $[49] !== clearButtonBoxPadding || $[50] !== clearButtonPadding || $[51] !== clearButtonProps || $[52] !== customValidity || $[53] !== disabled || $[54] !== fontSize2 || $[55] !== handleClearClick || $[56] !== radius || $[57] !== readOnly ? (t22 = !disabled && !readOnly && clearButton && /* @__PURE__ */ jsx(RightCard, { forwardedAs: "span", padding: clearButtonBoxPadding, style: CLEAR_BUTTON_BOX_STYLE, tone: customValidity ? "critical" : "inherit", children: /* @__PURE__ */ jsx(TextInputClearButton, { "aria-label": "Clear", "data-qa": "clear-button", fontSize: fontSize2, icon: CloseIcon, mode: "bleed", padding: clearButtonPadding, radius, ...clearButtonProps, onClick: handleClearClick, onMouseDown: handleClearMouseDown }) }), $[48] = clearButton, $[49] = clearButtonBoxPadding, $[50] = clearButtonPadding, $[51] = clearButtonProps, $[52] = customValidity, $[53] = disabled, $[54] = fontSize2, $[55] = handleClearClick, $[56] = radius, $[57] = readOnly, $[58] = t22) : t22 = $[58], t21 = t22;
   const clearButtonNode = t21;
   let t23, t24;
-  $[61] !== radius || $[62] !== suffix ? (t24 = suffix && /* @__PURE__ */ jsx(Suffix, { borderTop: !0, borderRight: !0, borderBottom: !0, radius, sizing: "border", tone: "inherit", children: /* @__PURE__ */ jsx("span", { children: suffix }) }), $[61] = radius, $[62] = suffix, $[63] = t24) : t24 = $[63], t23 = t24;
+  $[59] !== radius || $[60] !== suffix ? (t24 = suffix && /* @__PURE__ */ jsx(Suffix, { borderTop: !0, borderRight: !0, borderBottom: !0, radius, sizing: "border", tone: "inherit", children: /* @__PURE__ */ jsx("span", { children: suffix }) }), $[59] = radius, $[60] = suffix, $[61] = t24) : t24 = $[61], t23 = t24;
   const suffixNode = t23, t25 = $hasIconRight || $hasClearButton;
   let t26;
-  $[64] !== $hasIcon || $[65] !== disabled || $[66] !== fontSize2 || $[67] !== padding || $[68] !== readOnly || $[69] !== restProps || $[70] !== rootTheme.scheme || $[71] !== rootTheme.tone || $[72] !== space || $[73] !== t25 || $[74] !== type || $[75] !== weight ? (t26 = /* @__PURE__ */ jsx(Input, { "data-as": "input", "data-scheme": rootTheme.scheme, "data-tone": rootTheme.tone, ...restProps, $fontSize: fontSize2, $iconLeft: $hasIcon, $iconRight: t25, $padding: padding, $scheme: rootTheme.scheme, $space: space, $tone: rootTheme.tone, $weight: weight, disabled, readOnly, ref, type }), $[64] = $hasIcon, $[65] = disabled, $[66] = fontSize2, $[67] = padding, $[68] = readOnly, $[69] = restProps, $[70] = rootTheme.scheme, $[71] = rootTheme.tone, $[72] = space, $[73] = t25, $[74] = type, $[75] = weight, $[76] = t26) : t26 = $[76];
+  $[62] !== $hasIcon || $[63] !== disabled || $[64] !== fontSize2 || $[65] !== padding || $[66] !== readOnly || $[67] !== restProps || $[68] !== rootTheme.scheme || $[69] !== rootTheme.tone || $[70] !== space || $[71] !== t25 || $[72] !== type || $[73] !== weight ? (t26 = /* @__PURE__ */ jsx(Input, { "data-as": "input", "data-scheme": rootTheme.scheme, "data-tone": rootTheme.tone, ...restProps, $fontSize: fontSize2, $iconLeft: $hasIcon, $iconRight: t25, $padding: padding, $scheme: rootTheme.scheme, $space: space, $tone: rootTheme.tone, $weight: weight, disabled, readOnly, ref, type }), $[62] = $hasIcon, $[63] = disabled, $[64] = fontSize2, $[65] = padding, $[66] = readOnly, $[67] = restProps, $[68] = rootTheme.scheme, $[69] = rootTheme.tone, $[70] = space, $[71] = t25, $[72] = type, $[73] = weight, $[74] = t26) : t26 = $[74];
   let t27;
-  $[77] !== clearButtonNode || $[78] !== presentationNode || $[79] !== t26 ? (t27 = /* @__PURE__ */ jsxs(InputRoot, { children: [
+  $[75] !== clearButtonNode || $[76] !== presentationNode || $[77] !== t26 ? (t27 = /* @__PURE__ */ jsxs(InputRoot, { children: [
     t26,
     presentationNode,
     clearButtonNode
-  ] }), $[77] = clearButtonNode, $[78] = presentationNode, $[79] = t26, $[80] = t27) : t27 = $[80];
+  ] }), $[75] = clearButtonNode, $[76] = presentationNode, $[77] = t26, $[78] = t27) : t27 = $[78];
   let t28;
-  return $[81] !== prefixNode || $[82] !== rootTheme.tone || $[83] !== suffixNode || $[84] !== t27 ? (t28 = /* @__PURE__ */ jsxs(Root$b, { "data-ui": "TextInput", tone: rootTheme.tone, children: [
+  return $[79] !== prefixNode || $[80] !== rootTheme.tone || $[81] !== suffixNode || $[82] !== t27 ? (t28 = /* @__PURE__ */ jsxs(Root$b, { "data-ui": "TextInput", tone: rootTheme.tone, children: [
     prefixNode,
     t27,
     suffixNode
-  ] }), $[81] = prefixNode, $[82] = rootTheme.tone, $[83] = suffixNode, $[84] = t27, $[85] = t28) : t28 = $[85], t28;
+  ] }), $[79] = prefixNode, $[80] = rootTheme.tone, $[81] = suffixNode, $[82] = t27, $[83] = t28) : t28 = $[83], t28;
 });
 TextInput.displayName = "ForwardRef(TextInput)";
-function _temp$2(event) {
+function _temp$3(event) {
   event.preventDefault(), event.stopPropagation();
 }
+function _temp2$1(v) {
+  return v === 0 ? 0 : v === 1 || v === 2 ? 1 : v - 2;
+}
+function _temp3(v_0) {
+  return v_0 === 0 || v_0 === 1 ? 0 : v_0 === 2 ? 1 : v_0 - 1;
+}
 function useDelayedState(initialState) {
   const $ = c(3), [state, setState] = useState(initialState), delayedAction = useRef();
   let t0;
@@ -5813,7 +5800,7 @@ const MenuButton = forwardRef(function(props, forwardedRef) {
   }, t8 = [open], $[9] = open, $[10] = t7, $[11] = t8) : (t7 = $[10], t8 = $[11]), useEffect(t7, t8);
   let t9;
   $[12] === Symbol.for("react.memo_cache_sentinel") ? (t9 = () => {
-    setOpen((v) => !v), setShouldFocus(null);
+    setOpen(_temp$2), setShouldFocus(null);
   }, $[12] = t9) : t9 = $[12];
   const handleButtonClick = t9;
   let t10;
@@ -5915,6 +5902,9 @@ const MenuButton = forwardRef(function(props, forwardedRef) {
   return $[57] !== menu || $[58] !== open || $[59] !== popoverProps || $[60] !== t25 ? (t26 = /* @__PURE__ */ jsx(Popover, { "data-ui": "MenuButton__popover", ...popoverProps, content: menu, open, children: t25 }), $[57] = menu, $[58] = open, $[59] = popoverProps, $[60] = t25, $[61] = t26) : t26 = $[61], t26;
 });
 MenuButton.displayName = "ForwardRef(MenuButton)";
+function _temp$2(v) {
+  return !v;
+}
 const MenuDivider = styled.hr`
   height: 1px;
   border: 0;