@sanity/ui 3.0.0-static.10 → 3.0.0-static.11

package/dist/index.d.mts

@@ -1883,6 +1883,8 @@ export declare const rgbToHex: typeof rgbToHex_2
  */
 export declare const rgbToHsl: typeof rgbToHsl_2
 
+export declare function RootClassNames(props: {element: HTMLElement}): null
+
 /**
  * @public
  * @deprecated Use `RootTheme` from `@sanity/ui/theme` instead.
@@ -2004,9 +2006,7 @@ export declare interface StackProps
  * @public
  * @deprecated Use `buildTheme` from `@sanity/ui/theme` instead.
  */
-export declare const studioTheme: {
-  readonly value: RootTheme_2
-}
+export declare const studioTheme: RootTheme_2
 
 /**
  * @public
@@ -2862,7 +2862,7 @@ export declare interface VirtualListChangeOpts {
  * @beta
  */
 export declare interface VirtualListProps<Item = any> extends Omit<StackProps, 'gap'> {
-  gap?: number
+  gap?: Space
   getItemKey?: (item: Item, itemIndex: number) => string
   items?: Item[]
   onChange?: (opts: VirtualListChangeOpts) => void

package/dist/index.d.ts

@@ -1883,6 +1883,8 @@ export declare const rgbToHex: typeof rgbToHex_2
  */
 export declare const rgbToHsl: typeof rgbToHsl_2
 
+export declare function RootClassNames(props: {element: HTMLElement}): null
+
 /**
  * @public
  * @deprecated Use `RootTheme` from `@sanity/ui/theme` instead.
@@ -2004,9 +2006,7 @@ export declare interface StackProps
  * @public
  * @deprecated Use `buildTheme` from `@sanity/ui/theme` instead.
  */
-export declare const studioTheme: {
-  readonly value: RootTheme_2
-}
+export declare const studioTheme: RootTheme_2
 
 /**
  * @public
@@ -2862,7 +2862,7 @@ export declare interface VirtualListChangeOpts {
  * @beta
  */
 export declare interface VirtualListProps<Item = any> extends Omit<StackProps, 'gap'> {
-  gap?: number
+  gap?: Space
   getItemKey?: (item: Item, itemIndex: number) => string
   items?: Item[]
   onChange?: (opts: VirtualListChangeOpts) => void

package/dist/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: !0 });
-var _visualEditing = require("./_chunks-cjs/_visual-editing.js"), css = require("@sanity/ui/css"), jsxRuntime = require("react/jsx-runtime"), icons = require("@sanity/icons"), react = require("react"), reactCompilerRuntime = require("react-compiler-runtime"), framerMotion = require("framer-motion"), theme = require("@sanity/ui/theme");
+var theme = require("@sanity/ui/theme"), _visualEditing = require("./_chunks-cjs/_visual-editing.js"), jsxRuntime = require("react/jsx-runtime"), icons = require("@sanity/icons"), react = require("react"), reactCompilerRuntime = require("react-compiler-runtime"), css = require("@sanity/ui/css"), framerMotion = require("framer-motion");
+const createColorTheme = theme.createColorTheme, hexToRgb = theme.hexToRgb, hslToRgb = theme.hslToRgb, multiply = theme.multiply, parseColor = theme.parseColor, rgbToHex = theme.rgbToHex, rgbToHsl = theme.rgbToHsl, rgba = theme.rgba, screen = theme.screen;
 function _responsive(media, values, callback) {
   return (values?.map(callback) || []).map((statement, mediaIndex) => mediaIndex === 0 ? statement : {
     [`@media screen and (min-width: ${media[mediaIndex - 1]}px)`]: statement
@@ -632,7 +633,7 @@ const MenuButton = react.forwardRef(function(props, forwardedRef) {
   }, t8 = [open], $[9] = open, $[10] = t7, $[11] = t8) : (t7 = $[10], t8 = $[11]), react.useEffect(t7, t8);
   let t9;
   $[12] === Symbol.for("react.memo_cache_sentinel") ? (t9 = () => {
-    setOpen(_temp$2), setShouldFocus(null);
+    setOpen(_temp$3), setShouldFocus(null);
   }, $[12] = t9) : t9 = $[12];
   const handleButtonClick = t9;
   let t10;
@@ -742,7 +743,7 @@ const MenuButton = react.forwardRef(function(props, forwardedRef) {
   return $[58] !== menu || $[59] !== open || $[60] !== popoverProps || $[61] !== t24 ? (t25 = /* @__PURE__ */ jsxRuntime.jsx(_visualEditing.Popover, { "data-ui": "MenuButton__popover", ...popoverProps, content: menu, open, children: t24 }), $[58] = menu, $[59] = open, $[60] = popoverProps, $[61] = t24, $[62] = t25) : t25 = $[62], t25;
 });
 MenuButton.displayName = "ForwardRef(MenuButton)";
-function _temp$2(v) {
+function _temp$3(v) {
   return !v;
 }
 const Skeleton = react.forwardRef(function(props, ref) {
@@ -985,12 +986,12 @@ const container = {
   }
 }, MotionCard = framerMotion.motion.create(_visualEditing.Card), MotionFlex = framerMotion.motion.create(_visualEditing.Flex), MotionText = framerMotion.motion.create(_visualEditing.Text), MotionBox = framerMotion.motion.create(_visualEditing.Box);
 function useMounted() {
-  return react.useSyncExternalStore(subscribe, _temp$1, _temp2);
+  return react.useSyncExternalStore(subscribe, _temp$2, _temp2$1);
 }
-function _temp2() {
+function _temp2$1() {
   return !1;
 }
-function _temp$1() {
+function _temp$2() {
   return !0;
 }
 const subscribe = () => () => {
@@ -1056,14 +1057,14 @@ function ToastProvider(props) {
   }, $[1] = t3) : t3 = $[1], t2 = t3;
   const value = t2;
   let t4;
-  $[2] !== gap || $[3] !== mounted || $[4] !== padding || $[5] !== paddingX || $[6] !== paddingY || $[7] !== state || $[8] !== zOffset ? (t4 = mounted && /* @__PURE__ */ jsxRuntime.jsx(_visualEditing.LayerProvider, { zOffset, children: /* @__PURE__ */ jsxRuntime.jsx(ToastLayer, { padding, paddingX, paddingY, gap, children: /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { initial: !1, mode: "popLayout", children: state.map(_temp) }) }) }), $[2] = gap, $[3] = mounted, $[4] = padding, $[5] = paddingX, $[6] = paddingY, $[7] = state, $[8] = zOffset, $[9] = t4) : t4 = $[9];
+  $[2] !== gap || $[3] !== mounted || $[4] !== padding || $[5] !== paddingX || $[6] !== paddingY || $[7] !== state || $[8] !== zOffset ? (t4 = mounted && /* @__PURE__ */ jsxRuntime.jsx(_visualEditing.LayerProvider, { zOffset, children: /* @__PURE__ */ jsxRuntime.jsx(ToastLayer, { padding, paddingX, paddingY, gap, children: /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { initial: !1, mode: "popLayout", children: state.map(_temp$1) }) }) }), $[2] = gap, $[3] = mounted, $[4] = padding, $[5] = paddingX, $[6] = paddingY, $[7] = state, $[8] = zOffset, $[9] = t4) : t4 = $[9];
   let t5;
   return $[10] !== children || $[11] !== t4 ? (t5 = /* @__PURE__ */ jsxRuntime.jsxs(ToastContext.Provider, { value, children: [
     children,
     t4
   ] }), $[10] = children, $[11] = t4, $[12] = t5) : t5 = $[12], t5;
 }
-function _temp(t0) {
+function _temp$1(t0) {
   const {
     dismiss: dismiss_0,
     id: id_0,
@@ -1374,6 +1375,37 @@ const TreeGroup = react.memo(function(props) {
   ] });
 });
 TreeItem.displayName = "Memo(TreeItem)";
+function RootClassNames(props) {
+  const $ = reactCompilerRuntime.c(7), {
+    element
+  } = props, {
+    scheme,
+    tone
+  } = _visualEditing.useCard() ?? {};
+  let t0;
+  $[0] !== scheme || $[1] !== tone ? (t0 = () => {
+    const els = document.querySelectorAll([css.scopeClassName("button"), css.scopeClassName("card"), css.scopeClassName("font")].map(_temp).join(", "));
+    for (const el of els)
+      el instanceof HTMLElement && (el.style.transition = "none");
+    return _raf2(() => {
+      document.documentElement.className = css.card({
+        scheme,
+        tone
+      }) ?? "", _raf2(() => {
+        for (const el_0 of els)
+          el_0 instanceof HTMLElement && (el_0.style.transition = "");
+      });
+    }), _temp2;
+  }, $[0] = scheme, $[1] = tone, $[2] = t0) : t0 = $[2];
+  let t1;
+  return $[3] !== element || $[4] !== scheme || $[5] !== tone ? (t1 = [element, scheme, tone], $[3] = element, $[4] = scheme, $[5] = tone, $[6] = t1) : t1 = $[6], react.useEffect(t0, t1), null;
+}
+function _temp2() {
+  document.documentElement.className = "";
+}
+function _temp(n) {
+  return `.${n}`;
+}
 function StyleTags(props) {
   const $ = reactCompilerRuntime.c(10), {
     theme: themeProp
@@ -1452,21 +1484,12 @@ exports._getArrayProp = _visualEditing._getArrayProp;
 exports._isEnterToClickElement = _visualEditing._isEnterToClickElement;
 exports._isScrollable = _visualEditing._isScrollable;
 exports.containsOrEqualsElement = _visualEditing.containsOrEqualsElement;
-exports.createColorTheme = _visualEditing.createColorTheme;
-exports.hexToRgb = _visualEditing.hexToRgb;
-exports.hslToRgb = _visualEditing.hslToRgb;
 exports.isHTMLAnchorElement = _visualEditing.isHTMLAnchorElement;
 exports.isHTMLButtonElement = _visualEditing.isHTMLButtonElement;
 exports.isHTMLElement = _visualEditing.isHTMLElement;
 exports.isHTMLInputElement = _visualEditing.isHTMLInputElement;
 exports.isHTMLSelectElement = _visualEditing.isHTMLSelectElement;
 exports.isHTMLTextAreaElement = _visualEditing.isHTMLTextAreaElement;
-exports.multiply = _visualEditing.multiply;
-exports.parseColor = _visualEditing.parseColor;
-exports.rgbToHex = _visualEditing.rgbToHex;
-exports.rgbToHsl = _visualEditing.rgbToHsl;
-exports.rgba = _visualEditing.rgba;
-exports.screen = _visualEditing.screen;
 exports.studioTheme = _visualEditing.studioTheme;
 exports.useArrayProp = _visualEditing.useArrayProp;
 exports.useBoundaryElement = _visualEditing.useBoundaryElement;
@@ -1507,6 +1530,7 @@ exports.ErrorBoundary = ErrorBoundary;
 exports.HeadingSkeleton = HeadingSkeleton;
 exports.LabelSkeleton = LabelSkeleton;
 exports.MenuButton = MenuButton;
+exports.RootClassNames = RootClassNames;
 exports.Skeleton = Skeleton;
 exports.StyleTags = StyleTags;
 exports.TabPanel = TabPanel;
@@ -1520,9 +1544,18 @@ exports._raf = _raf;
 exports._raf2 = _raf2;
 exports._responsive = _responsive;
 exports.attemptFocus = attemptFocus;
+exports.createColorTheme = createColorTheme;
 exports.focusFirstDescendant = focusFirstDescendant;
 exports.focusLastDescendant = focusLastDescendant;
+exports.hexToRgb = hexToRgb;
+exports.hslToRgb = hslToRgb;
 exports.isFocusable = isFocusable;
+exports.multiply = multiply;
+exports.parseColor = parseColor;
+exports.rgbToHex = rgbToHex;
+exports.rgbToHsl = rgbToHsl;
+exports.rgba = rgba;
+exports.screen = screen;
 exports.useClickOutside = useClickOutside;
 exports.useDialog = useDialog;
 exports.useElementRect = useElementRect;