@sanity/ui 3.0.0-static.26 → 3.0.0-static.27

package/dist/index.d.cts

@@ -2280,6 +2280,7 @@ export declare type StackOwnProps = Omit<
   | 'direction'
   | 'display'
   | 'flexDirection'
+  | 'flexWrap'
   | 'gapX'
   | 'gapY'
   | 'justify'

package/dist/index.d.ts

@@ -2280,6 +2280,7 @@ export declare type StackOwnProps = Omit<
   | 'direction'
   | 'display'
   | 'flexDirection'
+  | 'flexWrap'
   | 'gapX'
   | 'gapY'
   | 'justify'

package/dist/index.js

@@ -1,11 +1,11 @@
 import { createColorTheme as createColorTheme$1, hexToRgb as hexToRgb$1, hslToRgb as hslToRgb$1, multiply as multiply$1, parseColor as parseColor$1, rgbToHex as rgbToHex$1, rgbToHsl as rgbToHsl$1, rgba as rgba$1, screen as screen$1 } from "@sanity/ui/theme";
-import { isHTMLAnchorElement, isHTMLInputElement, isHTMLButtonElement, isHTMLSelectElement, isHTMLTextAreaElement, isHTMLElement, _getArrayProp, EMPTY_ARRAY, useElementSize, useResponsiveProp, Box, Text, useCustomValidity, BoundaryElementContext, Code, _ResizeObserver, useDelayedState, TooltipDelayGroupContext, _isEnterToClickElement, Card, EMPTY_RECORD, Button, Stack, Popover, TextInput, AnimatedSpinnerIcon, useClickOutsideEvent, Flex, containsOrEqualsElement, usePortal, useBoundaryElement, useLayer, useGlobalKeyDown, createGlobalScopedContext, usePrefersReducedMotion, Portal, Z_OFFSETS, Layer, Grid, LayerProvider, isRecord, Selectable } from "./_chunks-es/_visual-editing.js";
+import { isHTMLAnchorElement, isHTMLInputElement, isHTMLButtonElement, isHTMLSelectElement, isHTMLTextAreaElement, isHTMLElement, _getArrayProp, EMPTY_ARRAY, useElementSize, useResponsiveProp, Box, Text, useCustomValidity, BoundaryElementContext, Code, useDelayedState, TooltipDelayGroupContext, _isEnterToClickElement, Card, EMPTY_RECORD, Button, Stack, Popover, TextInput, AnimatedSpinnerIcon, useClickOutsideEvent, Flex, containsOrEqualsElement, usePortal, useBoundaryElement, useLayer, useGlobalKeyDown, createGlobalScopedContext, usePrefersReducedMotion, Portal, Z_OFFSETS, Layer, Grid, LayerProvider, isRecord, Selectable, _ResizeObserver } from "./_chunks-es/_visual-editing.js";
 import { Arrow, CardProvider, DEFAULT_ARROW_ELEMENT, DEFAULT_BOX_ELEMENT, DEFAULT_BUTTON_ELEMENT, DEFAULT_CARD_ELEMENT, DEFAULT_CODE_ELEMENT, DEFAULT_ELEMENT_QUERY_ELEMENT, DEFAULT_FLEX_ELEMENT, DEFAULT_GRID_ELEMENT, DEFAULT_HOTKEYS_ELEMENT, DEFAULT_KBD_ELEMENT, DEFAULT_LAYER_ELEMENT, DEFAULT_MENU_DIVIDER_ELEMENT, DEFAULT_MENU_ELEMENT, DEFAULT_MENU_GROUP_ELEMENT, DEFAULT_MENU_ITEM_ELEMENT, DEFAULT_POPOVER_ELEMENT, DEFAULT_SPINNER_ELEMENT, DEFAULT_STACK_ELEMENT, DEFAULT_TAB_ELEMENT, DEFAULT_TAB_LIST_ELEMENT, DEFAULT_TEXT_ELEMENT, DEFAULT_TEXT_INPUT_ELEMENT, DEFAULT_TOOLTIP_ELEMENT, ElementQuery, Hotkeys, KBD, Menu, MenuDivider, MenuGroup, MenuItem, PortalProvider, Spinner, Tab, TabList, ThemeColorProvider, ThemeProvider, Tooltip, _elementSizeObserver, _getResponsiveProp, useCard, useMatchMedia, useMediaIndex, usePrefersDark, useRootTheme, useTheme, useTheme_v2, useTooltipDelayGroup } from "./_chunks-es/_visual-editing.js";
 import { jsx, jsxs, Fragment as Fragment$1 } from "react/jsx-runtime";
 import { CheckmarkIcon, RemoveIcon, ChevronDownIcon, CloseIcon, ToggleArrowRightIcon } from "@sanity/icons";
 import { useState, useRef, useEffect, useImperativeHandle, Children, isValidElement, Fragment, cloneElement, Component, useReducer, useCallback, useMemo, useContext, useSyncExternalStore, startTransition, memo, useId } from "react";
 import { c } from "react-compiler-runtime";
-import { label, textOverflow, avatar, avatarArrow, avatarInitials, avatarImage, avatarImageOutline, avatarCounter, avatarStack, badge, checkbox, checkboxInput, checkboxPresentation, container as container$1, heading, srOnly, vars, radio, radioInput, radioPresentation, select, _inputElement, selectPresentation, _switch, _switchElement, _switchPresentation, _switchTrack, _switchThumb, textArea, _inputPresentation, breadcrumbs, dialogCard, dialogLayout, dialogHeader, dialogContent, dialogFooter, dialog, dialogContainer, skeleton, codeSkeleton, headingSkeleton, labelSkeleton, textSkeleton, toast, toastLayer, treeItem } from "@sanity/ui/css";
+import { label, textOverflow, avatar, avatarArrow, avatarInitials, avatarImage, avatarImageOutline, avatarCounter, avatarStack, badge, checkbox, checkboxInput, checkboxPresentation, container as container$1, heading, radio, radioInput, radioPresentation, select, _inputElement, selectPresentation, srOnly, _switch, _switchElement, _switchPresentation, _switchTrack, _switchThumb, textArea, _inputPresentation, breadcrumbs, dialogCard, dialogLayout, dialogHeader, dialogContent, dialogFooter, dialog, dialogContainer, skeleton, codeSkeleton, headingSkeleton, labelSkeleton, textSkeleton, toast, toastLayer, treeItem, vars } from "@sanity/ui/css";
 import { px, rem } from "@sanity/ui/css";
 import { motion, AnimatePresence } from "framer-motion";
 const createColorTheme = createColorTheme$1, hexToRgb = hexToRgb$1, hslToRgb = hslToRgb$1, multiply = multiply$1, parseColor = parseColor$1, rgbToHex = rgbToHex$1, rgbToHsl = rgbToHsl$1, rgba = rgba$1, screen = screen$1;
@@ -313,7 +313,7 @@ function Badge(props) {
   let t7;
   $[12] !== children || $[13] !== fontSize ? (t7 = /* @__PURE__ */ jsx(Text, { size: fontSize, children }), $[12] = children, $[13] = fontSize, $[14] = t7) : t7 = $[14];
   let t8;
-  return $[15] !== as || $[16] !== padding || $[17] !== radius || $[18] !== rest || $[19] !== t6 || $[20] !== t7 ? (t8 = /* @__PURE__ */ jsx(Box, { "data-ui": "Badge", ...rest, as, className: t6, display: "inline-flex", maxWidth: "fill", padding, radius, children: t7 }), $[15] = as, $[16] = padding, $[17] = radius, $[18] = rest, $[19] = t6, $[20] = t7, $[21] = t8) : t8 = $[21], t8;
+  return $[15] !== as || $[16] !== padding || $[17] !== radius || $[18] !== rest || $[19] !== t6 || $[20] !== t7 ? (t8 = /* @__PURE__ */ jsx(Box, { "data-ui": "Badge", ...rest, as, className: t6, display: "flex", maxWidth: "fill", padding, radius, width: "min", children: t7 }), $[15] = as, $[16] = padding, $[17] = radius, $[18] = rest, $[19] = t6, $[20] = t7, $[21] = t8) : t8 = $[21], t8;
 }
 const DEFAULT_CHECKBOX_ELEMENT = "input";
 function Checkbox(props) {
@@ -470,145 +470,6 @@ class ErrorBoundary extends Component {
     return this.props.children;
   }
 }
-const DEFAULT_SR_ONLY_ELEMENT = "span";
-function SrOnly(props) {
-  const $ = c(12), t0 = props;
-  let children, className, rest, t1;
-  $[0] !== t0 ? ({
-    as: t1,
-    children,
-    className,
-    ...rest
-  } = t0, $[0] = t0, $[1] = children, $[2] = className, $[3] = rest, $[4] = t1) : (children = $[1], className = $[2], rest = $[3], t1 = $[4]);
-  const Element2 = t1 === void 0 ? DEFAULT_SR_ONLY_ELEMENT : t1;
-  let t2;
-  $[5] !== className ? (t2 = srOnly({
-    className
-  }), $[5] = className, $[6] = t2) : t2 = $[6];
-  let t3;
-  return $[7] !== Element2 || $[8] !== children || $[9] !== rest || $[10] !== t2 ? (t3 = /* @__PURE__ */ jsx(Element2, { "data-ui": "SrOnly", ...rest, "aria-hidden": !0, className: t2, children }), $[7] = Element2, $[8] = children, $[9] = rest, $[10] = t2, $[11] = t3) : t3 = $[11], t3;
-}
-const DEFAULT_VIRTUAL_LIST_ELEMENT = "div";
-function VirtualList(props) {
-  const $ = c(58), t0 = props;
-  let forwardedRef, getItemKey, onChange, renderItem, rest, t1, t2, t3;
-  $[0] !== t0 ? ({
-    as: t1,
-    gap: t2,
-    getItemKey,
-    items: t3,
-    onChange,
-    renderItem,
-    ref: forwardedRef,
-    ...rest
-  } = t0, $[0] = t0, $[1] = forwardedRef, $[2] = getItemKey, $[3] = onChange, $[4] = renderItem, $[5] = rest, $[6] = t1, $[7] = t2, $[8] = t3) : (forwardedRef = $[1], getItemKey = $[2], onChange = $[3], renderItem = $[4], rest = $[5], t1 = $[6], t2 = $[7], t3 = $[8]);
-  const as = t1 === void 0 ? DEFAULT_VIRTUAL_LIST_ELEMENT : t1, gap = t2 === void 0 ? 0 : t2;
-  let t4;
-  $[9] !== t3 ? (t4 = t3 === void 0 ? [] : t3, $[9] = t3, $[10] = t4) : t4 = $[10];
-  const items = t4, ref = useRef(null), wrapperRef = useRef(null), [scrollTop, setScrollTop] = useState(0), [scrollHeight, setScrollHeight] = useState(0), [itemHeight, setItemHeight] = useState(-1), [gapValue, setGapValue] = useState(0);
-  let t5;
-  $[11] === Symbol.for("react.memo_cache_sentinel") ? (t5 = () => ref.current, $[11] = t5) : t5 = $[11], useImperativeHandle(forwardedRef, t5);
-  let t6, t7;
-  $[12] === Symbol.for("react.memo_cache_sentinel") ? (t6 = () => {
-    if (!ref.current)
-      return;
-    const scrollEl = findScrollable(ref.current.parentNode);
-    if (scrollEl) {
-      if (!(scrollEl instanceof HTMLElement))
-        return;
-      const handleScroll = () => {
-        setScrollTop(scrollEl.scrollTop);
-      };
-      scrollEl.addEventListener("scroll", handleScroll, {
-        passive: !0
-      });
-      const ro = new _ResizeObserver((entries) => {
-        setScrollHeight(entries[0].contentRect.height);
-      });
-      return ro.observe(scrollEl), handleScroll(), () => {
-        scrollEl.removeEventListener("scroll", handleScroll), ro.unobserve(scrollEl), ro.disconnect();
-      };
-    }
-    const handleScroll_0 = () => {
-      setScrollTop(window.scrollY);
-    }, handleResize = () => {
-      setScrollHeight(window.innerHeight);
-    };
-    return window.addEventListener("scroll", handleScroll_0, {
-      passive: !0
-    }), window.addEventListener("resize", handleResize), setScrollHeight(window.innerHeight), handleScroll_0(), () => {
-      window.removeEventListener("scroll", handleScroll_0), window.removeEventListener("resize", handleResize);
-    };
-  }, t7 = [], $[12] = t6, $[13] = t7) : (t6 = $[12], t7 = $[13]), useEffect(t6, t7);
-  const len = items.length, height = itemHeight ? len * (itemHeight + gapValue) - gapValue : 0, fromIndex = height ? Math.max(Math.floor(scrollTop / height * len) - 2, 0) : 0, toIndex = height ? Math.ceil((scrollTop + scrollHeight) / height * len) + 1 : 0;
-  let t8, t9;
-  $[14] !== fromIndex || $[15] !== gapValue || $[16] !== itemHeight || $[17] !== onChange || $[18] !== scrollHeight || $[19] !== scrollTop || $[20] !== toIndex ? (t8 = () => {
-    onChange?.({
-      fromIndex,
-      gap: gapValue,
-      itemHeight,
-      scrollHeight,
-      scrollTop,
-      toIndex
-    });
-  }, t9 = [fromIndex, gapValue, itemHeight, onChange, scrollHeight, scrollTop, toIndex], $[14] = fromIndex, $[15] = gapValue, $[16] = itemHeight, $[17] = onChange, $[18] = scrollHeight, $[19] = scrollTop, $[20] = toIndex, $[21] = t8, $[22] = t9) : (t8 = $[21], t9 = $[22]), useEffect(t8, t9);
-  let t10;
-  bb0: {
-    if (!renderItem || items.length === 0) {
-      t10 = null;
-      break bb0;
-    }
-    if (itemHeight === -1) {
-      let t113;
-      $[23] === Symbol.for("react.memo_cache_sentinel") ? (t113 = (el) => el ? setItemHeight(el.offsetHeight) : void 0, $[23] = t113) : t113 = $[23];
-      let t122;
-      $[24] !== items[0] || $[25] !== renderItem ? (t122 = renderItem(items[0]), $[24] = items[0], $[25] = renderItem, $[26] = t122) : t122 = $[26];
-      let t132;
-      $[27] !== t122 ? (t132 = /* @__PURE__ */ jsx(Box, { ref: t113, insetTop: 0, insetLeft: 0, insetRight: 0, position: "absolute", children: t122 }, 0), $[27] = t122, $[28] = t132) : t132 = $[28];
-      let t142;
-      $[29] === Symbol.for("react.memo_cache_sentinel") ? (t142 = (el_0) => el_0 ? setGapValue(el_0.offsetHeight) : void 0, $[29] = t142) : t142 = $[29];
-      const t15 = vars.space[gap];
-      let t16;
-      $[30] !== t15 ? (t16 = /* @__PURE__ */ jsx("div", { ref: t142, style: {
-        height: t15
-      } }), $[30] = t15, $[31] = t16) : t16 = $[31];
-      let t17;
-      $[32] !== t132 || $[33] !== t16 ? (t17 = [/* @__PURE__ */ jsxs(Fragment$1, { children: [
-        t132,
-        t16
-      ] })], $[32] = t132, $[33] = t16, $[34] = t17) : t17 = $[34], t10 = t17;
-      break bb0;
-    }
-    let t112;
-    if ($[35] !== fromIndex || $[36] !== gapValue || $[37] !== getItemKey || $[38] !== itemHeight || $[39] !== items || $[40] !== renderItem || $[41] !== toIndex) {
-      let t122;
-      $[43] !== fromIndex || $[44] !== gapValue || $[45] !== getItemKey || $[46] !== itemHeight || $[47] !== renderItem ? (t122 = (item, _itemIndex) => {
-        const itemIndex = fromIndex + _itemIndex, node = renderItem(item), key = getItemKey ? getItemKey(item, itemIndex) : itemIndex;
-        return /* @__PURE__ */ jsx(Box, { insetLeft: 0, insetRight: 0, position: "absolute", style: {
-          top: itemIndex * (itemHeight + gapValue) - gapValue
-        }, children: node }, key);
-      }, $[43] = fromIndex, $[44] = gapValue, $[45] = getItemKey, $[46] = itemHeight, $[47] = renderItem, $[48] = t122) : t122 = $[48], t112 = items.slice(fromIndex, toIndex).map(t122), $[35] = fromIndex, $[36] = gapValue, $[37] = getItemKey, $[38] = itemHeight, $[39] = items, $[40] = renderItem, $[41] = toIndex, $[42] = t112;
-    } else
-      t112 = $[42];
-    t10 = t112;
-  }
-  const children = t10;
-  let t11, t12;
-  $[49] !== height ? (t12 = {
-    height
-  }, $[49] = height, $[50] = t12) : t12 = $[50], t11 = t12;
-  const wrapperStyle = t11;
-  let t13;
-  $[51] !== children || $[52] !== wrapperStyle ? (t13 = /* @__PURE__ */ jsx("div", { ref: wrapperRef, style: wrapperStyle, children }), $[51] = children, $[52] = wrapperStyle, $[53] = t13) : t13 = $[53];
-  let t14;
-  return $[54] !== as || $[55] !== rest || $[56] !== t13 ? (t14 = /* @__PURE__ */ jsx(Box, { "data-ui": "VirtualList", ...rest, as, position: "relative", ref, children: t13 }), $[54] = as, $[55] = rest, $[56] = t13, $[57] = t14) : t14 = $[57], t14;
-}
-function findScrollable(parentNode) {
-  let _scrollEl = parentNode;
-  for (; _scrollEl && !_isScrollable(_scrollEl); )
-    _scrollEl = _scrollEl.parentNode;
-  return _scrollEl;
-}
 const DEFAULT_RADIO_ELEMENT = "input";
 function Radio(props) {
   const $ = c(25), t0 = props;
@@ -693,6 +554,24 @@ function Select(props) {
     t16
   ] }), $[34] = t12, $[35] = t16, $[36] = t9, $[37] = t17) : t17 = $[37], t17;
 }
+const DEFAULT_SR_ONLY_ELEMENT = "span";
+function SrOnly(props) {
+  const $ = c(12), t0 = props;
+  let children, className, rest, t1;
+  $[0] !== t0 ? ({
+    as: t1,
+    children,
+    className,
+    ...rest
+  } = t0, $[0] = t0, $[1] = children, $[2] = className, $[3] = rest, $[4] = t1) : (children = $[1], className = $[2], rest = $[3], t1 = $[4]);
+  const Element2 = t1 === void 0 ? DEFAULT_SR_ONLY_ELEMENT : t1;
+  let t2;
+  $[5] !== className ? (t2 = srOnly({
+    className
+  }), $[5] = className, $[6] = t2) : t2 = $[6];
+  let t3;
+  return $[7] !== Element2 || $[8] !== children || $[9] !== rest || $[10] !== t2 ? (t3 = /* @__PURE__ */ jsx(Element2, { "data-ui": "SrOnly", ...rest, "aria-hidden": !0, className: t2, children }), $[7] = Element2, $[8] = children, $[9] = rest, $[10] = t2, $[11] = t3) : t3 = $[11], t3;
+}
 const DEFAULT_SWITCH_ELEMENT = "input";
 function Switch(props) {
   const $ = c(31), t0 = props;
@@ -731,7 +610,7 @@ function Switch(props) {
     /* @__PURE__ */ jsx("span", { className: _switchThumb() })
   ] }), $[24] = t14) : t14 = $[24];
   let t15;
-  return $[25] !== style || $[26] !== t13 || $[27] !== t5 || $[28] !== t6 || $[29] !== t7 ? (t15 = /* @__PURE__ */ jsxs(Box, { className: t5, "data-checked": t6, "data-indeterminate": t7, "data-ui": "Switch", display: "inline-block", position: "relative", style, children: [
+  return $[25] !== style || $[26] !== t13 || $[27] !== t5 || $[28] !== t6 || $[29] !== t7 ? (t15 = /* @__PURE__ */ jsxs(Box, { className: t5, "data-checked": t6, "data-indeterminate": t7, "data-ui": "Switch", display: "block", position: "relative", style, children: [
     t13,
     t14
   ] }), $[25] = style, $[26] = t13, $[27] = t5, $[28] = t6, $[29] = t7, $[30] = t15) : t15 = $[30], t15;
@@ -2046,6 +1925,127 @@ function TreeItem(props) {
     /* @__PURE__ */ jsx(TreeContext.Provider, { value: contextValue, children: children && /* @__PURE__ */ jsx(TreeGroup, { expanded, children }) })
   ] });
 }
+const DEFAULT_VIRTUAL_LIST_ELEMENT = "div";
+function VirtualList(props) {
+  const $ = c(58), t0 = props;
+  let forwardedRef, getItemKey, onChange, renderItem, rest, t1, t2, t3;
+  $[0] !== t0 ? ({
+    as: t1,
+    gap: t2,
+    getItemKey,
+    items: t3,
+    onChange,
+    renderItem,
+    ref: forwardedRef,
+    ...rest
+  } = t0, $[0] = t0, $[1] = forwardedRef, $[2] = getItemKey, $[3] = onChange, $[4] = renderItem, $[5] = rest, $[6] = t1, $[7] = t2, $[8] = t3) : (forwardedRef = $[1], getItemKey = $[2], onChange = $[3], renderItem = $[4], rest = $[5], t1 = $[6], t2 = $[7], t3 = $[8]);
+  const as = t1 === void 0 ? DEFAULT_VIRTUAL_LIST_ELEMENT : t1, gap = t2 === void 0 ? 0 : t2;
+  let t4;
+  $[9] !== t3 ? (t4 = t3 === void 0 ? [] : t3, $[9] = t3, $[10] = t4) : t4 = $[10];
+  const items = t4, ref = useRef(null), wrapperRef = useRef(null), [scrollTop, setScrollTop] = useState(0), [scrollHeight, setScrollHeight] = useState(0), [itemHeight, setItemHeight] = useState(-1), [gapValue, setGapValue] = useState(0);
+  let t5;
+  $[11] === Symbol.for("react.memo_cache_sentinel") ? (t5 = () => ref.current, $[11] = t5) : t5 = $[11], useImperativeHandle(forwardedRef, t5);
+  let t6, t7;
+  $[12] === Symbol.for("react.memo_cache_sentinel") ? (t6 = () => {
+    if (!ref.current)
+      return;
+    const scrollEl = findScrollable(ref.current.parentNode);
+    if (scrollEl) {
+      if (!(scrollEl instanceof HTMLElement))
+        return;
+      const handleScroll = () => {
+        setScrollTop(scrollEl.scrollTop);
+      };
+      scrollEl.addEventListener("scroll", handleScroll, {
+        passive: !0
+      });
+      const ro = new _ResizeObserver((entries) => {
+        setScrollHeight(entries[0].contentRect.height);
+      });
+      return ro.observe(scrollEl), handleScroll(), () => {
+        scrollEl.removeEventListener("scroll", handleScroll), ro.unobserve(scrollEl), ro.disconnect();
+      };
+    }
+    const handleScroll_0 = () => {
+      setScrollTop(window.scrollY);
+    }, handleResize = () => {
+      setScrollHeight(window.innerHeight);
+    };
+    return window.addEventListener("scroll", handleScroll_0, {
+      passive: !0
+    }), window.addEventListener("resize", handleResize), setScrollHeight(window.innerHeight), handleScroll_0(), () => {
+      window.removeEventListener("scroll", handleScroll_0), window.removeEventListener("resize", handleResize);
+    };
+  }, t7 = [], $[12] = t6, $[13] = t7) : (t6 = $[12], t7 = $[13]), useEffect(t6, t7);
+  const len = items.length, height = itemHeight ? len * (itemHeight + gapValue) - gapValue : 0, fromIndex = height ? Math.max(Math.floor(scrollTop / height * len) - 2, 0) : 0, toIndex = height ? Math.ceil((scrollTop + scrollHeight) / height * len) + 1 : 0;
+  let t8, t9;
+  $[14] !== fromIndex || $[15] !== gapValue || $[16] !== itemHeight || $[17] !== onChange || $[18] !== scrollHeight || $[19] !== scrollTop || $[20] !== toIndex ? (t8 = () => {
+    onChange?.({
+      fromIndex,
+      gap: gapValue,
+      itemHeight,
+      scrollHeight,
+      scrollTop,
+      toIndex
+    });
+  }, t9 = [fromIndex, gapValue, itemHeight, onChange, scrollHeight, scrollTop, toIndex], $[14] = fromIndex, $[15] = gapValue, $[16] = itemHeight, $[17] = onChange, $[18] = scrollHeight, $[19] = scrollTop, $[20] = toIndex, $[21] = t8, $[22] = t9) : (t8 = $[21], t9 = $[22]), useEffect(t8, t9);
+  let t10;
+  bb0: {
+    if (!renderItem || items.length === 0) {
+      t10 = null;
+      break bb0;
+    }
+    if (itemHeight === -1) {
+      let t113;
+      $[23] === Symbol.for("react.memo_cache_sentinel") ? (t113 = (el) => el ? setItemHeight(el.offsetHeight) : void 0, $[23] = t113) : t113 = $[23];
+      let t122;
+      $[24] !== items[0] || $[25] !== renderItem ? (t122 = renderItem(items[0]), $[24] = items[0], $[25] = renderItem, $[26] = t122) : t122 = $[26];
+      let t132;
+      $[27] !== t122 ? (t132 = /* @__PURE__ */ jsx(Box, { ref: t113, insetTop: 0, insetLeft: 0, insetRight: 0, position: "absolute", children: t122 }, 0), $[27] = t122, $[28] = t132) : t132 = $[28];
+      let t142;
+      $[29] === Symbol.for("react.memo_cache_sentinel") ? (t142 = (el_0) => el_0 ? setGapValue(el_0.offsetHeight) : void 0, $[29] = t142) : t142 = $[29];
+      const t15 = vars.space[gap];
+      let t16;
+      $[30] !== t15 ? (t16 = /* @__PURE__ */ jsx("div", { ref: t142, style: {
+        height: t15
+      } }), $[30] = t15, $[31] = t16) : t16 = $[31];
+      let t17;
+      $[32] !== t132 || $[33] !== t16 ? (t17 = [/* @__PURE__ */ jsxs(Fragment$1, { children: [
+        t132,
+        t16
+      ] })], $[32] = t132, $[33] = t16, $[34] = t17) : t17 = $[34], t10 = t17;
+      break bb0;
+    }
+    let t112;
+    if ($[35] !== fromIndex || $[36] !== gapValue || $[37] !== getItemKey || $[38] !== itemHeight || $[39] !== items || $[40] !== renderItem || $[41] !== toIndex) {
+      let t122;
+      $[43] !== fromIndex || $[44] !== gapValue || $[45] !== getItemKey || $[46] !== itemHeight || $[47] !== renderItem ? (t122 = (item, _itemIndex) => {
+        const itemIndex = fromIndex + _itemIndex, node = renderItem(item), key = getItemKey ? getItemKey(item, itemIndex) : itemIndex;
+        return /* @__PURE__ */ jsx(Box, { insetLeft: 0, insetRight: 0, position: "absolute", style: {
+          top: itemIndex * (itemHeight + gapValue) - gapValue
+        }, children: node }, key);
+      }, $[43] = fromIndex, $[44] = gapValue, $[45] = getItemKey, $[46] = itemHeight, $[47] = renderItem, $[48] = t122) : t122 = $[48], t112 = items.slice(fromIndex, toIndex).map(t122), $[35] = fromIndex, $[36] = gapValue, $[37] = getItemKey, $[38] = itemHeight, $[39] = items, $[40] = renderItem, $[41] = toIndex, $[42] = t112;
+    } else
+      t112 = $[42];
+    t10 = t112;
+  }
+  const children = t10;
+  let t11, t12;
+  $[49] !== height ? (t12 = {
+    height
+  }, $[49] = height, $[50] = t12) : t12 = $[50], t11 = t12;
+  const wrapperStyle = t11;
+  let t13;
+  $[51] !== children || $[52] !== wrapperStyle ? (t13 = /* @__PURE__ */ jsx("div", { ref: wrapperRef, style: wrapperStyle, children }), $[51] = children, $[52] = wrapperStyle, $[53] = t13) : t13 = $[53];
+  let t14;
+  return $[54] !== as || $[55] !== rest || $[56] !== t13 ? (t14 = /* @__PURE__ */ jsx(Box, { "data-ui": "VirtualList", ...rest, as, position: "relative", ref, children: t13 }), $[54] = as, $[55] = rest, $[56] = t13, $[57] = t14) : t14 = $[57], t14;
+}
+function findScrollable(parentNode) {
+  let _scrollEl = parentNode;
+  for (; _scrollEl && !_isScrollable(_scrollEl); )
+    _scrollEl = _scrollEl.parentNode;
+  return _scrollEl;
+}
 export {
   Arrow,
   Autocomplete,