@sanity/ui 3.0.11 → 3.0.12-canary.0

package/dist/index.mjs

@@ -3,7 +3,7 @@ import { Arrow, Avatar, AvatarCounter, AvatarStack, Badge, BoundaryElementProvid
 import { jsx, jsxs, Fragment as Fragment$1 } from "react/jsx-runtime";
 import { c } from "react-compiler-runtime";
 import { SpinnerIcon, ChevronDownIcon, CloseIcon, ToggleArrowRightIcon } from "@sanity/icons";
-import { useState, useRef, useEffect, useImperativeHandle, Component, forwardRef, useReducer, cloneElement, useCallback, useMemo, Children, isValidElement, Fragment, useContext, useSyncExternalStore, startTransition, memo, useId } from "react";
+import { useState, useRef, useEffect, useImperativeHandle, Component, forwardRef, useReducer, cloneElement, Children, isValidElement, Fragment, useContext, useSyncExternalStore, startTransition, memo, useId } from "react";
 import { styled, keyframes, css } from "styled-components";
 import { getTheme_v2 } from "@sanity/ui/theme";
 import { motion, AnimatePresence } from "framer-motion";
@@ -572,28 +572,83 @@ const StyledBreadcrumbs = styled.ol.withConfig({
   displayName: "ExpandButton",
   componentId: "sc-1es8h8q-1"
 })`appearance:none;margin:-4px;`, Breadcrumbs = forwardRef(function(props, ref) {
-  const {
+  const $ = c(27);
+  let children, maxLength, restProps, separator, t0;
+  $[0] !== props ? ({
     children,
     maxLength,
     separator,
-    space: spaceRaw = 2,
+    space: t0,
     ...restProps
-  } = props, space = useArrayProp(spaceRaw), [open, setOpen] = useState(!1), expandElementRef = useRef(null), popoverElementRef = useRef(null), collapse = useCallback(() => setOpen(!1), []), expand = useCallback(() => setOpen(!0), []);
-  useClickOutsideEvent(collapse, () => [expandElementRef.current, popoverElementRef.current]);
-  const rawItems = useMemo(() => Children.toArray(children).filter(isValidElement), [children]), items = useMemo(() => {
-    const len = rawItems.length;
-    if (maxLength && len > maxLength) {
-      const beforeLength = Math.ceil(maxLength / 2), afterLength = Math.floor(maxLength / 2);
-      return [...rawItems.slice(0, beforeLength - 1), /* @__PURE__ */ jsx(Popover, { constrainSize: !0, content: /* @__PURE__ */ jsx(Stack, { as: "ol", overflow: "auto", padding: space, space, children: rawItems.slice(beforeLength - 1, len - afterLength) }), open, placement: "top", portal: !0, ref: popoverElementRef, children: /* @__PURE__ */ jsx(ExpandButton, { fontSize: 1, mode: "bleed", onClick: open ? collapse : expand, padding: 1, ref: expandElementRef, selected: open, text: "\u2026" }) }, "button"), ...rawItems.slice(len - afterLength)];
-    }
-    return rawItems;
-  }, [collapse, expand, maxLength, open, rawItems, space]);
-  return /* @__PURE__ */ jsx(StyledBreadcrumbs, { "data-ui": "Breadcrumbs", ...restProps, ref, children: items.map((item, itemIndex) => /* @__PURE__ */ jsxs(Fragment, { children: [
-    itemIndex > 0 && /* @__PURE__ */ jsx(Box, { "aria-hidden": !0, as: "li", paddingX: space, children: separator || /* @__PURE__ */ jsx(Text, { muted: !0, children: "/" }) }),
-    /* @__PURE__ */ jsx(Box, { as: "li", children: item })
-  ] }, itemIndex)) });
+  } = props, $[0] = props, $[1] = children, $[2] = maxLength, $[3] = restProps, $[4] = separator, $[5] = t0) : (children = $[1], maxLength = $[2], restProps = $[3], separator = $[4], t0 = $[5]);
+  const space = useArrayProp(t0 === void 0 ? 2 : t0), [open, setOpen] = useState(!1), expandElementRef = useRef(null), popoverElementRef = useRef(null);
+  let t1;
+  $[6] === Symbol.for("react.memo_cache_sentinel") ? (t1 = () => setOpen(!1), $[6] = t1) : t1 = $[6];
+  const collapse = t1;
+  let t2;
+  $[7] === Symbol.for("react.memo_cache_sentinel") ? (t2 = () => setOpen(!0), $[7] = t2) : t2 = $[7];
+  const expand = t2;
+  let t3;
+  $[8] === Symbol.for("react.memo_cache_sentinel") ? (t3 = () => [expandElementRef.current, popoverElementRef.current], $[8] = t3) : t3 = $[8], useClickOutsideEvent(collapse, t3);
+  let t4;
+  $[9] !== children ? (t4 = Children.toArray(children).filter(isValidElement), $[9] = children, $[10] = t4) : t4 = $[10];
+  const rawItems = t4;
+  let t5;
+  $[11] !== maxLength || $[12] !== open || $[13] !== rawItems || $[14] !== space ? (t5 = {
+    collapse,
+    expand,
+    expandElementRef,
+    maxLength,
+    open,
+    popoverElementRef,
+    rawItems,
+    space
+  }, $[11] = maxLength, $[12] = open, $[13] = rawItems, $[14] = space, $[15] = t5) : t5 = $[15];
+  const items = useItems(t5);
+  let t6;
+  if ($[16] !== items || $[17] !== separator || $[18] !== space) {
+    let t72;
+    $[20] !== separator || $[21] !== space ? (t72 = (item, itemIndex) => /* @__PURE__ */ jsxs(Fragment, { children: [
+      itemIndex > 0 && /* @__PURE__ */ jsx(Box, { "aria-hidden": !0, as: "li", paddingX: space, children: separator || /* @__PURE__ */ jsx(Text, { muted: !0, children: "/" }) }),
+      /* @__PURE__ */ jsx(Box, { as: "li", children: item })
+    ] }, itemIndex), $[20] = separator, $[21] = space, $[22] = t72) : t72 = $[22], t6 = items.map(t72), $[16] = items, $[17] = separator, $[18] = space, $[19] = t6;
+  } else
+    t6 = $[19];
+  let t7;
+  return $[23] !== ref || $[24] !== restProps || $[25] !== t6 ? (t7 = /* @__PURE__ */ jsx(StyledBreadcrumbs, { "data-ui": "Breadcrumbs", ...restProps, ref, children: t6 }), $[23] = ref, $[24] = restProps, $[25] = t6, $[26] = t7) : t7 = $[26], t7;
 });
 Breadcrumbs.displayName = "ForwardRef(Breadcrumbs)";
+function useItems(t0) {
+  const $ = c(28), {
+    collapse,
+    expand,
+    expandElementRef,
+    maxLength,
+    open,
+    popoverElementRef,
+    rawItems,
+    space
+  } = t0, len = rawItems.length;
+  if (maxLength && len > maxLength) {
+    const beforeLength = Math.ceil(maxLength / 2), afterLength = Math.floor(maxLength / 2);
+    let t1;
+    if ($[0] !== afterLength || $[1] !== beforeLength || $[2] !== collapse || $[3] !== expand || $[4] !== expandElementRef || $[5] !== len || $[6] !== open || $[7] !== popoverElementRef || $[8] !== rawItems || $[9] !== space) {
+      const t2 = rawItems.slice(0, beforeLength - 1);
+      let t3;
+      $[11] !== afterLength || $[12] !== beforeLength || $[13] !== len || $[14] !== rawItems ? (t3 = rawItems.slice(beforeLength - 1, len - afterLength), $[11] = afterLength, $[12] = beforeLength, $[13] = len, $[14] = rawItems, $[15] = t3) : t3 = $[15];
+      let t4;
+      $[16] !== space || $[17] !== t3 ? (t4 = /* @__PURE__ */ jsx(Stack, { as: "ol", overflow: "auto", padding: space, space, children: t3 }), $[16] = space, $[17] = t3, $[18] = t4) : t4 = $[18];
+      const t5 = open ? collapse : expand;
+      let t6;
+      $[19] !== expandElementRef || $[20] !== open || $[21] !== t5 ? (t6 = /* @__PURE__ */ jsx(ExpandButton, { fontSize: 1, mode: "bleed", onClick: t5, padding: 1, ref: expandElementRef, selected: open, text: "\u2026" }), $[19] = expandElementRef, $[20] = open, $[21] = t5, $[22] = t6) : t6 = $[22];
+      let t7;
+      $[23] !== open || $[24] !== popoverElementRef || $[25] !== t4 || $[26] !== t6 ? (t7 = /* @__PURE__ */ jsx(Popover, { constrainSize: !0, content: t4, open, placement: "top", portal: !0, ref: popoverElementRef, children: t6 }, "button"), $[23] = open, $[24] = popoverElementRef, $[25] = t4, $[26] = t6, $[27] = t7) : t7 = $[27], t1 = [...t2, t7, ...rawItems.slice(len - afterLength)], $[0] = afterLength, $[1] = beforeLength, $[2] = collapse, $[3] = expand, $[4] = expandElementRef, $[5] = len, $[6] = open, $[7] = popoverElementRef, $[8] = rawItems, $[9] = space, $[10] = t1;
+    } else
+      t1 = $[10];
+    return t1;
+  }
+  return rawItems;
+}
 function dialogStyle({
   theme
 }) {