@sanity/ui 1.4.0 → 1.5.0

package/dist/index.js

@@ -3076,9 +3076,9 @@ function getGlobalScope() {
   throw new Error("@sanity/ui: could not locate global scope");
 }
 const globalScope = getGlobalScope();
-const key$8 = Symbol.for("@sanity/ui/context/theme");
-globalScope[key$8] = globalScope[key$8] || react.createContext(null);
-const ThemeContext = globalScope[key$8];
+const key$7 = Symbol.for("@sanity/ui/context/theme");
+globalScope[key$7] = globalScope[key$7] || react.createContext(null);
+const ThemeContext = globalScope[key$7];
 function ThemeProvider(props) {
   const parentTheme = react.useContext(ThemeContext);
   const {
@@ -5168,9 +5168,9 @@ const KBD = react.forwardRef(function KBD2(props, ref) {
     })
   });
 });
-const key$7 = Symbol.for("@sanity/ui/context/boundaryElement");
-globalScope[key$7] = globalScope[key$7] || react.createContext(null);
-const BoundaryElementContext = globalScope[key$7];
+const key$6 = Symbol.for("@sanity/ui/context/boundaryElement");
+globalScope[key$6] = globalScope[key$6] || react.createContext(null);
+const BoundaryElementContext = globalScope[key$6];
 function BoundaryElementProvider(props) {
   const {
     children,
@@ -5288,9 +5288,9 @@ function getLayerContext(contextValue) {
   }
   throw new Error("could not get layer context");
 }
-const key$6 = Symbol.for("@sanity/ui/context/layer");
-globalScope[key$6] = globalScope[key$6] || react.createContext(null);
-const LayerContext = globalScope[key$6];
+const key$5 = Symbol.for("@sanity/ui/context/layer");
+globalScope[key$5] = globalScope[key$5] || react.createContext(null);
+const LayerContext = globalScope[key$5];
 function useLayer() {
   const value = react.useContext(LayerContext);
   if (!value) {
@@ -5527,7 +5527,7 @@ const Layer = react.forwardRef(function Layer2(props, ref) {
     })
   });
 });
-const key$5 = Symbol.for("@sanity/ui/context/portal");
+const key$4 = Symbol.for("@sanity/ui/context/portal");
 const elementKey = Symbol.for("@sanity/ui/context/portal/element");
 globalScope[elementKey] = null;
 const defaultContextValue = {
@@ -5546,8 +5546,8 @@ const defaultContextValue = {
     return globalScope[elementKey];
   }
 };
-globalScope[key$5] = globalScope[key$5] || react.createContext(defaultContextValue);
-const PortalContext = globalScope[key$5];
+globalScope[key$4] = globalScope[key$4] || react.createContext(defaultContextValue);
+const PortalContext = globalScope[key$4];
 function usePortal() {
   const value = react.useContext(PortalContext);
   if (!value) {
@@ -5927,17 +5927,6 @@ const PopoverCard = react.memo(react.forwardRef(function PopoverCard2(props, ref
   });
 }));
 PopoverCard.displayName = "PopoverCard";
-const key$4 = Symbol.for("@sanity/ui/context/popover");
-globalScope[key$4] = globalScope[key$4] || react.createContext(null);
-const PopoverContext = globalScope[key$4];
-const useOnForcedUpdate = eventHandler => {
-  const contextValue = react.useContext(PopoverContext);
-  react.useEffect(() => {
-    if ((contextValue == null ? void 0 : contextValue.lastUpdateId) !== null) {
-      eventHandler == null ? void 0 : eventHandler();
-    }
-  }, [contextValue == null ? void 0 : contextValue.lastUpdateId]);
-};
 const Popover = react.memo(react.forwardRef(function Popover2(props, ref) {
   var _a, _b, _c, _d, _e;
   const theme = useTheme();
@@ -6044,13 +6033,9 @@ const Popover = react.memo(react.forwardRef(function Popover2(props, ref) {
     placement,
     reference: referenceRef,
     floating: floatingRef,
-    update: floatingUpdate,
     middlewareData,
     strategy
   } = reactDom$1.useFloating(floatingProps);
-  const handleForcedUpdate = react.useCallback(() => {
-    floatingUpdate();
-  }, [floatingUpdate]);
   const referenceHidden = (_c = middlewareData.hide) == null ? void 0 : _c.referenceHidden;
   const arrowX = (_d = middlewareData.arrow) == null ? void 0 : _d.x;
   const arrowY = (_e = middlewareData.arrow) == null ? void 0 : _e.y;
@@ -6079,7 +6064,6 @@ const Popover = react.memo(react.forwardRef(function Popover2(props, ref) {
   react.useEffect(() => {
     referenceRef(referenceElement || null);
   }, [referenceRef, referenceElement]);
-  useOnForcedUpdate(handleForcedUpdate);
   if (disabled) {
     return childProp || /* @__PURE__ */jsxRuntime.jsx(jsxRuntime.Fragment, {});
   }
@@ -6119,35 +6103,6 @@ const Popover = react.memo(react.forwardRef(function Popover2(props, ref) {
   });
 }));
 Popover.displayName = "Popover";
-const PopoverProvider = _ref22 => {
-  let {
-    children
-  } = _ref22;
-  const [lastUpdateId, setUpdateId] = react.useState(null);
-  const forceUpdate = react.useCallback(() => {
-    const newId = Math.random().toString(36).substr(2, 9);
-    setUpdateId(newId);
-  }, []);
-  const value = react.useMemo(() => ({
-    version: 0,
-    lastUpdateId,
-    forceUpdate
-  }), [lastUpdateId, forceUpdate]);
-  return /* @__PURE__ */jsxRuntime.jsx(PopoverContext.Provider, {
-    value,
-    children
-  });
-};
-function usePopover() {
-  const value = react.useContext(PopoverContext);
-  if (!value) {
-    throw new Error("usePopover(): missing context value");
-  }
-  if (!isRecord(value) || value.version !== 0) {
-    throw new Error("usePopover(): the context value is not compatible");
-  }
-  return value;
-}
 function radioBaseStyle() {
   return styled.css(_templateObject36 || (_templateObject36 = _taggedTemplateLiteral(["\n    position: relative;\n\n    &:not([hidden]) {\n      display: inline-block;\n    }\n\n    &[data-read-only] {\n      outline: 1px solid red;\n    }\n  "])));
 }
@@ -6979,10 +6934,10 @@ const InnerAutocomplete = react.forwardRef(function InnerAutocomplete2(props, re
     query,
     value
   } = state;
-  const defaultRenderOption = react.useCallback(_ref23 => {
+  const defaultRenderOption = react.useCallback(_ref22 => {
     let {
       value: value2
-    } = _ref23;
+    } = _ref22;
     return /* @__PURE__ */jsxRuntime.jsx(Card, {
       "data-as": "button",
       padding: paddingProp,
@@ -7429,10 +7384,10 @@ const Breadcrumbs = react.forwardRef(function Breadcrumbs2(props, ref) {
     }, itemIndex))
   });
 });
-function dialogStyle(_ref24) {
+function dialogStyle(_ref23) {
   let {
     theme
-  } = _ref24;
+  } = _ref23;
   const color = theme.sanity.color.base;
   return {
     "&:not([hidden])": {
@@ -8042,6 +7997,7 @@ const MenuButton = react.forwardRef(function MenuButton2(props, ref) {
     id,
     menu: menuProp,
     onClose,
+    onOpen,
     placement: deprecated_placement,
     popoverScheme: deprecated_popoverScheme,
     portal: deprecated_portal = true,
@@ -8054,6 +8010,11 @@ const MenuButton = react.forwardRef(function MenuButton2(props, ref) {
   const [buttonElement, setButtonElement] = react.useState(null);
   const [menuElements, setChildMenuElements] = react.useState([]);
   const openRef = react.useRef(open);
+  react.useEffect(() => {
+    if (onOpen && open && !openRef.current) {
+      onOpen();
+    }
+  }, [onOpen, open]);
   react.useEffect(() => {
     if (onClose && !open && openRef.current) {
       onClose();
@@ -8452,15 +8413,15 @@ const MenuItem = react.forwardRef(function MenuItem2(props, forwardedRef) {
 });
 const keyframe = styled.keyframes(_templateObject78 || (_templateObject78 = _taggedTemplateLiteral(["\n  0% {\n    background-position: 100%;\n  }\n  100% {\n    background-position: -100%;\n  }\n"])));
 const animation = styled.css(_templateObject79 || (_templateObject79 = _taggedTemplateLiteral(["\n  background-image: linear-gradient(\n    to right,\n    var(--card-skeleton-color-from),\n    var(--card-skeleton-color-to),\n    var(--card-skeleton-color-from),\n    var(--card-skeleton-color-from),\n    var(--card-skeleton-color-from)\n  );\n  background-position: 100%;\n  background-size: 200% 100%;\n  background-attachment: fixed;\n  animation-name: ", ";\n  animation-timing-function: ease-in-out;\n  animation-iteration-count: infinite;\n  animation-duration: 2000ms;\n"])), keyframe);
-const skeletonStyle = styled.css(_templateObject80 || (_templateObject80 = _taggedTemplateLiteral(["\n  opacity: ", ";\n  transition: opacity 200ms ease-in;\n\n  @media screen and (prefers-reduced-motion: no-preference) {\n    ", "\n  }\n\n  @media screen and (prefers-reduced-motion: reduce) {\n    background-color: var(--card-skeleton-color-from);\n  }\n"])), _ref25 => {
+const skeletonStyle = styled.css(_templateObject80 || (_templateObject80 = _taggedTemplateLiteral(["\n  opacity: ", ";\n  transition: opacity 200ms ease-in;\n\n  @media screen and (prefers-reduced-motion: no-preference) {\n    ", "\n  }\n\n  @media screen and (prefers-reduced-motion: reduce) {\n    background-color: var(--card-skeleton-color-from);\n  }\n"])), _ref24 => {
   let {
     $visible
-  } = _ref25;
+  } = _ref24;
   return $visible ? 1 : 0;
-}, _ref26 => {
+}, _ref25 => {
   let {
     $animated
-  } = _ref26;
+  } = _ref25;
   return $animated ? animation : styled.css(_templateObject81 || (_templateObject81 = _taggedTemplateLiteral(["\n            background-color: var(--card-skeleton-color-from);\n          "])));
 });
 const Root$4 = styled__default.default(Box)(responsiveRadiusStyle, skeletonStyle);
@@ -8491,12 +8452,12 @@ const Skeleton = react.forwardRef(function Skeleton2(props, ref) {
     ref
   });
 });
-const Root$3 = styled__default.default(Skeleton)(_ref27 => {
+const Root$3 = styled__default.default(Skeleton)(_ref26 => {
   let {
     $size,
     $style,
     theme
-  } = _ref27;
+  } = _ref26;
   const {
     media
   } = theme.sanity;
@@ -8817,12 +8778,12 @@ function ToastProvider(props) {
           paddingY,
           children: /* @__PURE__ */jsxRuntime.jsx(framerMotion.AnimatePresence, {
             initial: false,
-            children: state.map(_ref28 => {
+            children: state.map(_ref27 => {
               let {
                 dismiss,
                 id,
                 params
-              } = _ref28;
+              } = _ref27;
               return /* @__PURE__ */jsxRuntime.jsx(framerMotion.motion.div, {
                 animate: {
                   opacity: 1,
@@ -9338,7 +9299,6 @@ exports.MenuDivider = MenuDivider;
 exports.MenuGroup = MenuGroup;
 exports.MenuItem = MenuItem;
 exports.Popover = Popover;
-exports.PopoverProvider = PopoverProvider;
 exports.Portal = Portal;
 exports.PortalProvider = PortalProvider;
 exports.Radio = Radio;
@@ -9412,7 +9372,6 @@ exports.useForwardedRef = useForwardedRef;
 exports.useGlobalKeyDown = useGlobalKeyDown;
 exports.useLayer = useLayer;
 exports.useMediaIndex = useMediaIndex;
-exports.usePopover = usePopover;
 exports.usePortal = usePortal;
 exports.usePrefersDark = usePrefersDark;
 exports.usePrefersReducedMotion = usePrefersReducedMotion;