@sanity/ui 3.0.0-static.30 → 3.0.0-static.32

package/dist/_chunks-cjs/_visual-editing.cjs

@@ -10,7 +10,10 @@ function getGlobalScope() {
 const globalScope = getGlobalScope();
 function createGlobalScopedContext(key2, defaultValue) {
   const symbol = Symbol.for(key2);
-  return typeof document > "u" ? react.createContext(defaultValue) : (globalScope[symbol] = globalScope[symbol] || react.createContext(defaultValue), globalScope[symbol]);
+  if (typeof document > "u")
+    return react.createContext(defaultValue);
+  const symbolMap = globalScope;
+  return symbolMap[symbol] = symbolMap[symbol] || react.createContext(defaultValue), symbolMap[symbol];
 }
 const CardContext = createGlobalScopedContext("@sanity/ui/context/card", null);
 function CardProvider(props) {
@@ -532,16 +535,23 @@ function useBoundaryElement() {
     throw new Error("useBoundaryElement(): the context value is not compatible");
   return value || DEFAULT_VALUE;
 }
+function getElementRef(element) {
+  let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
+  return mayWarn ? element.ref : (getter = Object.getOwnPropertyDescriptor(element, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning, mayWarn ? element.props.ref : element.props.ref || element.ref);
+}
 function useCard() {
-  return react.useContext(CardContext);
+  const card = react.useContext(CardContext);
+  if (!card)
+    throw new Error("useCard(): missing context value");
+  return card;
 }
-const key = "@sanity/ui/context/portal", elementKey = Symbol.for(`${key}/element`);
-globalScope[elementKey] = null;
+const key = "@sanity/ui/context/portal", elementKey = Symbol.for(`${key}/element`), elementMap = globalScope;
+elementMap[elementKey] = null;
 const defaultContextValue = {
   version: 0,
   boundaryElement: null,
   get element() {
-    return typeof document > "u" ? null : (globalScope[elementKey] || (globalScope[elementKey] = document.createElement("div"), globalScope[elementKey].setAttribute("data-portal", ""), document.body.appendChild(globalScope[elementKey])), globalScope[elementKey]);
+    return typeof document > "u" ? null : (elementMap[elementKey] || (elementMap[elementKey] = document.createElement("div"), elementMap[elementKey].setAttribute("data-portal", ""), document.body.appendChild(elementMap[elementKey])), elementMap[elementKey]);
   }
 }, PortalContext = createGlobalScopedContext(key, defaultContextValue);
 function usePortal() {
@@ -559,11 +569,10 @@ function Portal(props) {
   } = props, card = useCard(), portal = usePortal(), portalElement = (name ? portal.elements && portal.elements[name] : portal.element) || portal.elements?.default;
   if (!portalElement)
     return null;
-  const t0 = card?.scheme || "light";
+  let t0;
+  $[0] !== card.scheme || $[1] !== children ? (t0 = /* @__PURE__ */ jsxRuntime.jsx(CardProvider, { tone: "transparent", scheme: card.scheme, children }), $[0] = card.scheme, $[1] = children, $[2] = t0) : t0 = $[2];
   let t1;
-  $[0] !== children || $[1] !== t0 ? (t1 = /* @__PURE__ */ jsxRuntime.jsx(CardProvider, { tone: "transparent", scheme: t0, children }), $[0] = children, $[1] = t0, $[2] = t1) : t1 = $[2];
-  let t2;
-  return $[3] !== portalElement || $[4] !== t1 ? (t2 = reactDom.createPortal(t1, portalElement), $[3] = portalElement, $[4] = t1, $[5] = t2) : t2 = $[5], t2;
+  return $[3] !== portalElement || $[4] !== t0 ? (t1 = reactDom.createPortal(t0, portalElement), $[3] = portalElement, $[4] = t0, $[5] = t1) : t1 = $[5], t1;
 }
 function getLayerContext(contextValue) {
   if (!isRecord(contextValue) || contextValue.version !== 0)
@@ -783,7 +792,7 @@ function Card(props) {
     tone: t5,
     ...rest
   } = t0, $[0] = t0, $[1] = className, $[2] = disabled, $[3] = pressed, $[4] = rest, $[5] = schemeProp, $[6] = selected, $[7] = style, $[8] = t1, $[9] = t2, $[10] = t3, $[11] = t4, $[12] = t5) : (className = $[1], disabled = $[2], pressed = $[3], rest = $[4], schemeProp = $[5], selected = $[6], style = $[7], t1 = $[8], t2 = $[9], t3 = $[10], t4 = $[11], t5 = $[12]);
-  const checkered = t1 === void 0 ? !1 : t1, focusRing = t2 === void 0 ? !1 : t2, as = t3 === void 0 ? DEFAULT_CARD_ELEMENT : t3, radius = t4 === void 0 ? 0 : t4, toneProp = t5 === void 0 ? "default" : t5, parent = useCard(), tone = toneProp === "inherit" ? parent?.tone : toneProp, scheme = schemeProp === void 0 ? parent?.scheme : schemeProp, t6 = scheme === parent?.scheme ? void 0 : scheme;
+  const checkered = t1 === void 0 ? !1 : t1, focusRing = t2 === void 0 ? !1 : t2, as = t3 === void 0 ? DEFAULT_CARD_ELEMENT : t3, radius = t4 === void 0 ? 0 : t4, toneProp = t5 === void 0 ? "default" : t5, parent = react.useContext(CardContext), tone = toneProp === "inherit" ? parent?.tone : toneProp, scheme = schemeProp === void 0 ? parent?.scheme : schemeProp, t6 = scheme === parent?.scheme ? void 0 : scheme;
   let t7;
   $[13] !== className || $[14] !== t6 || $[15] !== tone ? (t7 = css.card({
     className,
@@ -799,7 +808,7 @@ function Card(props) {
   const t14 = scheme ?? "light", t15 = tone ?? "default", t16 = parent?.unstable_CompatProvider;
   let t17;
   if ($[28] !== node || $[29] !== t14 || $[30] !== t15 || $[31] !== t16 ? (t17 = /* @__PURE__ */ jsxRuntime.jsx(CardProvider, { scheme: t14, tone: t15, unstable_CompatProvider: t16, children: node }), $[28] = node, $[29] = t14, $[30] = t15, $[31] = t16, $[32] = t17) : t17 = $[32], node = t17, parent?.unstable_CompatProvider) {
-    const CompatProvider = parent.unstable_CompatProvider, t18 = scheme ?? "light", t19 = tone ?? parent?.tone ?? "default";
+    const CompatProvider = parent.unstable_CompatProvider, t18 = scheme ?? "light", t19 = tone ?? parent.tone;
     let t20;
     return $[33] !== CompatProvider || $[34] !== node || $[35] !== t18 || $[36] !== t19 ? (t20 = /* @__PURE__ */ jsxRuntime.jsx(CompatProvider, { scheme: t18, tone: t19, children: node }), $[33] = CompatProvider, $[34] = node, $[35] = t18, $[36] = t19, $[37] = t20) : t20 = $[37], t20;
   }
@@ -1148,8 +1157,8 @@ function Popover(props) {
   }, []), setFloating = react.useCallback((node) => {
     ref.current = node, refs.setFloating(node);
   }, [refs]), setReference = react.useCallback((node_0) => {
-    refs.setReference(node_0);
-    const childRef = getElementRef$1(childProp);
+    if (refs.setReference(node_0), !childProp) return;
+    const childRef = getElementRef(childProp);
     typeof childRef == "function" ? childRef(node_0) : childRef && (childRef.current = node_0);
   }, [childProp, refs]), child = react.useMemo(() => referenceElement ? childProp : childProp ? react.cloneElement(childProp, {
     ref: setReference
@@ -1163,16 +1172,12 @@ function Popover(props) {
     /* @__PURE__ */ jsxRuntime.jsx(PopoverLayer, { ...rest, __unstable_margins: margins, animate, arrow: arrowProp, arrowRef: setArrow, arrowX, arrowY, as, className: css.popover({
       className
     }), hidden: referenceHidden, maxWidth: widthProp, overflow, padding, placement, radius, ref: setFloating, scheme, shadow, originX, originY, strategy, x, y, zOffset, children: content })
-  ] }), children = open && (portal ? /* @__PURE__ */ jsxRuntime.jsx(Portal, { __unstable_name: typeof portal == "string" ? portal : void 0, children: /* @__PURE__ */ jsxRuntime.jsx(CardProvider, { tone: tone === "inherit" ? card?.tone ?? "default" : tone, scheme: scheme ?? "light", children: node_1 }) }) : node_1);
+  ] }), children = open && (portal ? /* @__PURE__ */ jsxRuntime.jsx(Portal, { __unstable_name: typeof portal == "string" ? portal : void 0, children: /* @__PURE__ */ jsxRuntime.jsx(CardProvider, { tone: tone === "inherit" ? card.tone : tone, scheme: scheme ?? "light", children: node_1 }) }) : node_1);
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     animate ? /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children }) : children,
     child
   ] });
 }
-function getElementRef$1(element) {
-  let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
-  return mayWarn ? element.ref : (getter = Object.getOwnPropertyDescriptor(element, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning, mayWarn ? element.props.ref : element.props.ref || element.ref);
-}
 const DEFAULT_SELECTABLE_ELEMENT = "button";
 function Selectable(props) {
   const $ = compilerRuntime.c(16), t0 = props;
@@ -1986,44 +1991,6 @@ function usePrefersDark(t0) {
 function _temp$1() {
   return !1;
 }
-function PortalProvider(props) {
-  const $ = compilerRuntime.c(7), {
-    boundaryElement,
-    children,
-    element,
-    __unstable_elements: elementsProp
-  } = props, elements = useUnique(elementsProp), fallbackElement = react.useSyncExternalStore(emptySubscribe, _temp, _temp2);
-  let t0;
-  const t1 = boundaryElement || null, t2 = element || fallbackElement;
-  let t3;
-  $[0] !== elements || $[1] !== t1 || $[2] !== t2 ? (t3 = {
-    version: 0,
-    boundaryElement: t1,
-    element: t2,
-    elements
-  }, $[0] = elements, $[1] = t1, $[2] = t2, $[3] = t3) : t3 = $[3], t0 = t3;
-  const value = t0;
-  let t4;
-  return $[4] !== children || $[5] !== value ? (t4 = /* @__PURE__ */ jsxRuntime.jsx(PortalContext.Provider, { value, children }), $[4] = children, $[5] = value, $[6] = t4) : t4 = $[6], t4;
-}
-function _temp2() {
-  return null;
-}
-function _temp() {
-  return document.body;
-}
-const emptySubscribe = () => () => {
-};
-function useUnique(value) {
-  const valueRef = react.useRef(value);
-  return _isEqual(valueRef.current, value) || (valueRef.current = value), valueRef.current;
-}
-function _isEqual(objA, objB) {
-  if (!objA || !objB)
-    return objA === objB;
-  const keysA = Object.keys(objA), keysB = Object.keys(objB);
-  return keysA.length !== keysB.length ? !1 : keysA.every((key2) => objA[key2] === objB[key2]);
-}
 function useDelayedState(initialState) {
   const $ = compilerRuntime.c(3), [state, setState] = react.useState(initialState), delayedAction = react.useRef(void 0);
   let t0;
@@ -2039,10 +2006,6 @@ function useDelayedState(initialState) {
   let t1;
   return $[1] !== state ? (t1 = [state, onStateChange], $[1] = state, $[2] = t1) : t1 = $[2], t1;
 }
-function getElementRef(element) {
-  let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
-  return mayWarn ? element.ref : (getter = Object.getOwnPropertyDescriptor(element, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning, mayWarn ? element.props.ref : element.props.ref || element.ref);
-}
 const DEFAULT_TOOLTIP_ARROW_WIDTH = 15, DEFAULT_TOOLTIP_ARROW_HEIGHT = 6, DEFAULT_TOOLTIP_ARROW_RADIUS = 2, DEFAULT_TOOLTIP_DISTANCE = 4, DEFAULT_TOOLTIP_PADDING = 4, DEFAULT_FALLBACK_PLACEMENTS = {
   top: ["top-end", "top-start", "bottom", "left", "right"],
   "top-start": ["top", "top-end", "bottom-start", "left-start", "right-start"],
@@ -2240,7 +2203,7 @@ function Tooltip(props) {
   }), originX, originY, padding, placement, radius, ref: setFloating, scheme, shadow, style: {
     ...floatingStyles,
     maxWidth: tooltipMaxWidth > 0 ? `${tooltipMaxWidth}px` : void 0
-  }, tone, zOffset, children: content }), children = showTooltip && (portalProp ? /* @__PURE__ */ jsxRuntime.jsx(Portal, { __unstable_name: typeof portalProp == "string" ? portalProp : void 0, children: /* @__PURE__ */ jsxRuntime.jsx(CardProvider, { tone: tone === "inherit" ? card?.tone ?? "default" : tone, scheme: scheme ?? "light", children: node_0 }) }) : node_0);
+  }, tone, zOffset, children: content }), children = showTooltip && (portalProp ? /* @__PURE__ */ jsxRuntime.jsx(Portal, { __unstable_name: typeof portalProp == "string" ? portalProp : void 0, children: /* @__PURE__ */ jsxRuntime.jsx(CardProvider, { tone: tone === "inherit" ? card.tone : tone, scheme: scheme ?? "light", children: node_0 }) }) : node_0);
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     animate ? /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { children }) : children,
     child
@@ -2270,6 +2233,44 @@ function useCloseOnMouseLeave(t0) {
   let t3;
   $[7] !== isInsideGroup || $[8] !== showTooltip ? (t3 = [isInsideGroup, showTooltip], $[7] = isInsideGroup, $[8] = showTooltip, $[9] = t3) : t3 = $[9], react.useEffect(t2, t3);
 }
+function PortalProvider(props) {
+  const $ = compilerRuntime.c(7), {
+    boundaryElement,
+    children,
+    element,
+    __unstable_elements: elementsProp
+  } = props, elements = useUnique(elementsProp), fallbackElement = react.useSyncExternalStore(emptySubscribe, _temp, _temp2);
+  let t0;
+  const t1 = boundaryElement || null, t2 = element || fallbackElement;
+  let t3;
+  $[0] !== elements || $[1] !== t1 || $[2] !== t2 ? (t3 = {
+    version: 0,
+    boundaryElement: t1,
+    element: t2,
+    elements
+  }, $[0] = elements, $[1] = t1, $[2] = t2, $[3] = t3) : t3 = $[3], t0 = t3;
+  const value = t0;
+  let t4;
+  return $[4] !== children || $[5] !== value ? (t4 = /* @__PURE__ */ jsxRuntime.jsx(PortalContext.Provider, { value, children }), $[4] = children, $[5] = value, $[6] = t4) : t4 = $[6], t4;
+}
+function _temp2() {
+  return null;
+}
+function _temp() {
+  return document.body;
+}
+const emptySubscribe = () => () => {
+};
+function useUnique(value) {
+  const valueRef = react.useRef(value);
+  return _isEqual(valueRef.current, value) || (valueRef.current = value), valueRef.current;
+}
+function _isEqual(objA, objB) {
+  if (!objA || !objB)
+    return objA === objB;
+  const keysA = Object.keys(objA), keysB = Object.keys(objB);
+  return keysA.length !== keysB.length ? !1 : keysA.every((key2) => objA[key2] === objB[key2]);
+}
 exports.AnimatedSpinnerIcon = AnimatedSpinnerIcon;
 exports.Arrow = Arrow;
 exports.BoundaryElementContext = BoundaryElementContext;