@sanity/ui 2.1.2 → 2.1.3-canary.1

package/dist/index.d.mts

@@ -2,6 +2,7 @@
 
 import {BaseTheme as BaseTheme_2} from '@sanity/ui/theme'
 import {Component} from 'react'
+import {Context} from 'react'
 import {CSSObject} from '@sanity/ui/theme'
 import {DetailedHTMLProps} from 'react'
 import {ElementType} from 'react'
@@ -718,7 +719,7 @@ export declare const Dialog: ForwardRefExoticComponent<
 /**
  * @internal
  */
-export declare const DialogContext: React.Context<DialogContextValue>
+export declare const DialogContext: Context<DialogContextValue>
 
 /**
  * This API might change. DO NOT USE IN PRODUCTION.
@@ -2465,7 +2466,7 @@ export declare const Tooltip: ForwardRefExoticComponent<
 /**
  * @beta
  */
-export declare const TooltipDelayGroupContext: React.Context<TooltipDelayGroupContextValue | null>
+export declare const TooltipDelayGroupContext: Context<TooltipDelayGroupContextValue | null>
 
 /**
  * @beta

package/dist/index.d.ts

@@ -2,6 +2,7 @@
 
 import {BaseTheme as BaseTheme_2} from '@sanity/ui/theme'
 import {Component} from 'react'
+import {Context} from 'react'
 import {CSSObject} from '@sanity/ui/theme'
 import {DetailedHTMLProps} from 'react'
 import {ElementType} from 'react'
@@ -718,7 +719,7 @@ export declare const Dialog: ForwardRefExoticComponent<
 /**
  * @internal
  */
-export declare const DialogContext: React.Context<DialogContextValue>
+export declare const DialogContext: Context<DialogContextValue>
 
 /**
  * This API might change. DO NOT USE IN PRODUCTION.
@@ -2465,7 +2466,7 @@ export declare const Tooltip: ForwardRefExoticComponent<
 /**
  * @beta
  */
-export declare const TooltipDelayGroupContext: React.Context<TooltipDelayGroupContextValue | null>
+export declare const TooltipDelayGroupContext: Context<TooltipDelayGroupContextValue | null>
 
 /**
  * @beta

package/dist/index.esm.js

@@ -517,9 +517,11 @@ function getGlobalScope() {
     return global;
   throw new Error("@sanity/ui: could not locate global scope");
 }
-const globalScope = getGlobalScope(), key$8 = Symbol.for("@sanity/ui/context/theme");
-globalScope[key$8] = globalScope[key$8] || createContext(null);
-const ThemeContext = globalScope[key$8];
+const globalScope = getGlobalScope();
+function createGlobalScopedContext(key2, defaultValue) {
+  return typeof document > "u" ? createContext(defaultValue) : (globalScope[key2] = globalScope[key2] || createContext(defaultValue), globalScope[key2]);
+}
+const key$8 = Symbol.for("@sanity/ui/context/theme"), ThemeContext = createGlobalScopedContext(key$8, null);
 function ThemeProvider(props) {
   const parentTheme = useContext(ThemeContext), {
     children,
@@ -2819,9 +2821,10 @@ const Root$k = styled.div(
     /* @__PURE__ */ jsx(StrokePath, { d: strokePath, mask: "url(#stroke-mask)", strokeWidth: strokeWidth * 2 }),
     /* @__PURE__ */ jsx(ShapePath, { d: fillPath })
   ] }) });
-}), key$7 = Symbol.for("@sanity/ui/context/boundaryElement");
-globalScope[key$7] = globalScope[key$7] || createContext(null);
-const BoundaryElementContext = globalScope[key$7];
+}), key$7 = Symbol.for("@sanity/ui/context/boundaryElement"), BoundaryElementContext = createGlobalScopedContext(
+  key$7,
+  null
+);
 function BoundaryElementProvider(props) {
   const { children, element } = props, value = useMemo(() => ({ version: 0, element }), [element]);
   return /* @__PURE__ */ jsx(BoundaryElementContext.Provider, { value, children });
@@ -2909,9 +2912,7 @@ function getLayerContext(contextValue) {
     return contextValue;
   throw new Error("could not get layer context");
 }
-const key$6 = Symbol.for("@sanity/ui/context/layer");
-globalScope[key$6] = globalScope[key$6] || createContext(null);
-const LayerContext = globalScope[key$6];
+const key$6 = Symbol.for("@sanity/ui/context/layer"), LayerContext = createGlobalScopedContext(key$6, null);
 function useLayer() {
   const value = useContext(LayerContext);
   if (!value)
@@ -3065,9 +3066,7 @@ const defaultContextValue = {
   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]);
   }
-};
-globalScope[key$5] = globalScope[key$5] || createContext(defaultContextValue);
-const PortalContext = globalScope[key$5];
+}, PortalContext = createGlobalScopedContext(key$5, defaultContextValue);
 function usePortal() {
   const value = useContext(PortalContext);
   if (!value)
@@ -3091,17 +3090,21 @@ function _isEqual(objA, objB) {
   const keysA = Object.keys(objA), keysB = Object.keys(objB);
   return keysA.length !== keysB.length ? !1 : keysA.every((key2) => objA[key2] === objB[key2]);
 }
-const __BROWSER__ = typeof document < "u";
 function PortalProvider(props) {
-  const { boundaryElement, children, element, __unstable_elements: elementsProp } = props, elements = useUnique(elementsProp), value = useMemo(() => ({
+  const { boundaryElement, children, element, __unstable_elements: elementsProp } = props, elements = useUnique(elementsProp), fallbackElement = useSyncExternalStore(
+    emptySubscribe$1,
+    () => document.body,
+    () => null
+  ), value = useMemo(() => ({
     version: 0,
     boundaryElement: boundaryElement || null,
-    element: element || __BROWSER__ && document.body || null,
+    element: element || fallbackElement,
     elements
-  }), [boundaryElement, element, elements]);
+  }), [boundaryElement, element, elements, fallbackElement]);
   return /* @__PURE__ */ jsx(PortalContext.Provider, { value, children });
 }
-const Root$i = styled.div`
+const emptySubscribe$1 = () => () => {
+}, Root$i = styled.div`
   display: block;
   width: 0;
   height: 0;
@@ -4318,9 +4321,7 @@ const DEFAULT_TOOLTIP_ARROW_WIDTH = 15, DEFAULT_TOOLTIP_ARROW_HEIGHT = 6, DEFAUL
   })
 );
 TooltipCard.displayName = "TooltipCard";
-const key$4 = Symbol.for("@sanity/ui/context/tooltipDelayGroup");
-globalScope[key$4] = globalScope[key$4] || createContext(null);
-const TooltipDelayGroupContext = globalScope[key$4];
+const key$4 = Symbol.for("@sanity/ui/context/tooltipDelayGroup"), TooltipDelayGroupContext = createGlobalScopedContext(key$4, null);
 function useTooltipDelayGroup() {
   return useContext(TooltipDelayGroupContext);
 }
@@ -5057,9 +5058,9 @@ function animationDialogStyle(props) {
     }
   ` : css``;
 }
-const key$3 = Symbol.for("@sanity/ui/context/dialog");
-globalScope[key$3] = globalScope[key$3] || createContext({ version: 0 });
-const DialogContext = globalScope[key$3];
+const key$3 = Symbol.for("@sanity/ui/context/dialog"), DialogContext = createGlobalScopedContext(key$3, {
+  version: 0
+});
 function useDialog() {
   return useContext(DialogContext);
 }
@@ -5292,9 +5293,7 @@ const Root$6 = styled.kbd`
 `, Hotkeys = forwardRef(function(props, ref) {
   const { fontSize: fontSize2, keys, padding, radius, space: spaceProp = 0.5, ...restProps } = props, space = useArrayProp(spaceProp);
   return !keys || keys.length === 0 ? /* @__PURE__ */ jsx(Fragment, {}) : /* @__PURE__ */ jsx(Root$6, { "data-ui": "Hotkeys", ...restProps, ref, children: /* @__PURE__ */ jsx(Inline, { as: "span", space, children: keys.map((key2, i) => /* @__PURE__ */ jsx(Key, { fontSize: fontSize2, padding, radius, children: key2 }, i)) }) });
-}), key$2 = Symbol.for("@sanity/ui/context/menu");
-globalScope[key$2] = globalScope[key$2] || createContext(null);
-const MenuContext = globalScope[key$2];
+}), key$2 = Symbol.for("@sanity/ui/context/menu"), MenuContext = createGlobalScopedContext(key$2, null);
 function _isFocusable(element) {
   return isHTMLAnchorElement(element) && element.getAttribute("data-disabled") !== "true" || isHTMLButtonElement(element) && !element.disabled;
 }
@@ -6231,9 +6230,7 @@ function useMounted() {
   );
 }
 const subscribe = () => () => {
-}, key$1 = Symbol.for("@sanity/ui/context/toast");
-globalScope[key$1] = globalScope[key$1] || createContext(null);
-const ToastContext = globalScope[key$1], Root$1 = styled(Layer)`
+}, key$1 = Symbol.for("@sanity/ui/context/toast"), ToastContext = createGlobalScopedContext(key$1, null), Root$1 = styled(Layer)`
   position: fixed;
   top: 0;
   left: 0;
@@ -6391,9 +6388,7 @@ function _focusItemElement(el) {
     firstChild && firstChild instanceof HTMLElement && firstChild.focus();
   }
 }
-const key = Symbol.for("@sanity/ui/context/tree");
-globalScope[key] = globalScope[key] || createContext(null);
-const TreeContext = globalScope[key], Tree = memo(
+const key = Symbol.for("@sanity/ui/context/tree"), TreeContext = createGlobalScopedContext(key, null), Tree = memo(
   forwardRef(function(props, ref) {
     const { children, space = 1, onFocus, ...restProps } = props, forwardedRef = useForwardedRef(ref), [focusedElement, setFocusedElement] = useState(null), focusedElementRef = useRef(focusedElement), path = useMemo(() => [], []), [itemElements, setItemElements] = useState([]), [state, setState] = useState({}), stateRef = useRef(state);
     useEffect(() => {