@sanity/ui 2.8.6 → 2.8.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (70) hide show
  1. package/dist/index.d.mts +48 -0
  2. package/dist/index.d.ts +48 -0
  3. package/dist/index.esm.js +121 -32
  4. package/dist/index.esm.js.map +1 -1
  5. package/dist/index.js +121 -32
  6. package/dist/index.js.map +1 -1
  7. package/dist/index.mjs +121 -32
  8. package/dist/index.mjs.map +1 -1
  9. package/package.json +2 -2
  10. package/src/core/components/autocomplete/autocomplete.tsx +2 -0
  11. package/src/core/components/breadcrumbs/breadcrumbs.tsx +1 -0
  12. package/src/core/components/dialog/dialog.tsx +3 -0
  13. package/src/core/components/dialog/dialogProvider.tsx +2 -0
  14. package/src/core/components/hotkeys/hotkeys.tsx +1 -0
  15. package/src/core/components/menu/menu.tsx +1 -0
  16. package/src/core/components/menu/menuButton.tsx +1 -0
  17. package/src/core/components/menu/menuDivider.ts +1 -0
  18. package/src/core/components/menu/menuGroup.tsx +2 -0
  19. package/src/core/components/menu/menuItem.tsx +1 -0
  20. package/src/core/components/skeleton/skeleton.tsx +1 -0
  21. package/src/core/components/skeleton/textSkeleton.tsx +4 -0
  22. package/src/core/components/tab/tab.tsx +1 -0
  23. package/src/core/components/tab/tabList.tsx +1 -0
  24. package/src/core/components/tab/tabPanel.tsx +1 -0
  25. package/src/core/components/toast/toast.tsx +2 -0
  26. package/src/core/components/toast/toastProvider.tsx +2 -0
  27. package/src/core/components/tree/tree.tsx +1 -2
  28. package/src/core/components/tree/treeItem.tsx +1 -0
  29. package/src/core/primitives/_selectable/selectable.tsx +1 -0
  30. package/src/core/primitives/avatar/avatar.tsx +1 -0
  31. package/src/core/primitives/avatar/avatarCounter.tsx +1 -0
  32. package/src/core/primitives/avatar/avatarStack.tsx +1 -0
  33. package/src/core/primitives/badge/badge.tsx +1 -0
  34. package/src/core/primitives/box/box.tsx +1 -0
  35. package/src/core/primitives/button/button.tsx +1 -0
  36. package/src/core/primitives/card/card.tsx +1 -0
  37. package/src/core/primitives/checkbox/checkbox.tsx +1 -0
  38. package/src/core/primitives/code/code.tsx +1 -0
  39. package/src/core/primitives/container/container.tsx +1 -0
  40. package/src/core/primitives/flex/flex.tsx +1 -0
  41. package/src/core/primitives/grid/grid.tsx +1 -0
  42. package/src/core/primitives/heading/heading.tsx +1 -0
  43. package/src/core/primitives/inline/inline.tsx +1 -0
  44. package/src/core/primitives/kbd/kbd.tsx +1 -0
  45. package/src/core/primitives/label/label.tsx +1 -0
  46. package/src/core/primitives/popover/popover.tsx +1 -2
  47. package/src/core/primitives/popover/popoverCard.tsx +1 -2
  48. package/src/core/primitives/radio/radio.tsx +1 -0
  49. package/src/core/primitives/select/select.tsx +1 -0
  50. package/src/core/primitives/spinner/spinner.tsx +1 -0
  51. package/src/core/primitives/stack/stack.tsx +1 -0
  52. package/src/core/primitives/switch/switch.tsx +1 -0
  53. package/src/core/primitives/text/text.tsx +1 -0
  54. package/src/core/primitives/textArea/textArea.tsx +1 -0
  55. package/src/core/primitives/textInput/textInput.tsx +1 -0
  56. package/src/core/primitives/tooltip/tooltip.tsx +1 -0
  57. package/src/core/primitives/tooltip/tooltipCard.tsx +1 -2
  58. package/src/core/primitives/tooltip/tooltipDelayGroup/tooltipDelayGroupProvider.tsx +2 -0
  59. package/src/core/theme/themeColorProvider.tsx +2 -0
  60. package/src/core/theme/themeProvider.tsx +2 -0
  61. package/src/core/utils/arrow/arrow.tsx +1 -0
  62. package/src/core/utils/boundaryElement/boundaryElementProvider.tsx +2 -0
  63. package/src/core/utils/conditionalWrapper/conditionalWrapper.tsx +2 -0
  64. package/src/core/utils/elementQuery/elementQuery.tsx +1 -0
  65. package/src/core/utils/layer/layer.tsx +1 -0
  66. package/src/core/utils/layer/layerProvider.tsx +2 -0
  67. package/src/core/utils/portal/portal.ts +2 -0
  68. package/src/core/utils/portal/portalProvider.tsx +2 -0
  69. package/src/core/utils/srOnly/srOnly.tsx +1 -0
  70. package/src/core/utils/virtualList/virtualList.tsx +1 -0
package/dist/index.js CHANGED
@@ -580,6 +580,7 @@ function ThemeProvider(props) {
580
580
  } : null, [rootTheme, scheme, tone]), theme$1 = react.useMemo(() => rootTheme ? theme.getScopedTheme(rootTheme, scheme, tone) : null, [scheme, rootTheme, tone]);
581
581
  return theme$1 ? /* @__PURE__ */ jsxRuntime.jsx(ThemeContext.Provider, { value: themeContext, children: /* @__PURE__ */ jsxRuntime.jsx(styledComponents.ThemeProvider, { theme: theme$1, children }) }) : /* @__PURE__ */ jsxRuntime.jsx("pre", { children: 'ThemeProvider: no "theme" property provided' });
582
582
  }
583
+ ThemeProvider.displayName = "ThemeProvider";
583
584
  function useRootTheme() {
584
585
  const value = react.useContext(ThemeContext);
585
586
  if (!value)
@@ -590,6 +591,7 @@ function ThemeColorProvider(props) {
590
591
  const { children, scheme, tone } = props, root = useRootTheme();
591
592
  return /* @__PURE__ */ jsxRuntime.jsx(ThemeProvider, { scheme: scheme || root.scheme, theme: root.theme, tone, children });
592
593
  }
594
+ ThemeColorProvider.displayName = "ThemeColorProvider";
593
595
  function useTheme() {
594
596
  return styledComponents.useTheme();
595
597
  }
@@ -1269,7 +1271,9 @@ const Root$C = styledComponents.styled.div(responsiveLabelFont, responsiveTextAl
1269
1271
  children
1270
1272
  }
1271
1273
  );
1272
- }), avatarStyle = {
1274
+ });
1275
+ Label.displayName = "ForwardRef(Label)";
1276
+ const avatarStyle = {
1273
1277
  root: avatarRootStyle,
1274
1278
  arrow: avatarArrowStyle,
1275
1279
  bgStroke: avatarBgStrokeStyle,
@@ -1497,6 +1501,7 @@ const Root$B = styledComponents.styled.div(
1497
1501
  }
1498
1502
  );
1499
1503
  });
1504
+ Avatar.displayName = "ForwardRef(Avatar)";
1500
1505
  function _responsiveAvatarCounterSizeStyle(props) {
1501
1506
  const { avatar, media } = theme.getTheme_v2(props.theme);
1502
1507
  return _responsive(media, props.$size, (size2) => {
@@ -1537,7 +1542,9 @@ const Root$A = styledComponents.styled.div(
1537
1542
  [size2]
1538
1543
  );
1539
1544
  return /* @__PURE__ */ jsxRuntime.jsx(Root$A, { $size: size2, "data-ui": "AvatarCounter", ref, children: /* @__PURE__ */ jsxRuntime.jsx(Label, { as: "span", size: fontSize2, weight: "medium", children: count }) });
1540
- }), BASE_STYLES = styledComponents.css`
1545
+ });
1546
+ AvatarCounter.displayName = "ForwardRef(AvatarCounter)";
1547
+ const BASE_STYLES = styledComponents.css`
1541
1548
  white-space: nowrap;
1542
1549
 
1543
1550
  & > div {
@@ -1577,7 +1584,9 @@ const Root$z = styledComponents.styled.div(responsiveAvatarStackSizeStyle, avata
1577
1584
  len !== 0 && extraCount > 1 && /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(AvatarCounter, { count: extraCount, size: size2 }) }),
1578
1585
  visibleChildren.map((child, childIndex) => /* @__PURE__ */ jsxRuntime.jsx("div", { children: react.cloneElement(child, { size: size2 }) }, String(childIndex)))
1579
1586
  ] });
1580
- }), Root$y = styledComponents.styled.div(
1587
+ });
1588
+ AvatarStack.displayName = "ForwardRef(AvatarStack)";
1589
+ const Root$y = styledComponents.styled.div(
1581
1590
  boxStyle,
1582
1591
  flexItemStyle,
1583
1592
  responsiveBoxStyle,
@@ -1651,6 +1660,7 @@ const Root$z = styledComponents.styled.div(responsiveAvatarStackSizeStyle, avata
1651
1660
  }
1652
1661
  );
1653
1662
  });
1663
+ Box.displayName = "ForwardRef(Box)";
1654
1664
  function textBaseStyle(props) {
1655
1665
  const { $accent, $muted } = props, { font } = theme.getTheme_v2(props.theme);
1656
1666
  return styledComponents.css`
@@ -1751,6 +1761,7 @@ const Root$x = styledComponents.styled.div(
1751
1761
  }
1752
1762
  );
1753
1763
  });
1764
+ Text.displayName = "ForwardRef(Text)";
1754
1765
  function badgeStyle(props) {
1755
1766
  const { $tone } = props;
1756
1767
  return {
@@ -1790,7 +1801,9 @@ const Root$w = styledComponents.styled(Box)(
1790
1801
  children: /* @__PURE__ */ jsxRuntime.jsx(Text, { size: fontSize2, children })
1791
1802
  }
1792
1803
  );
1793
- }), Root$v = styledComponents.styled(Box)(
1804
+ });
1805
+ Badge.displayName = "ForwardRef(Badge)";
1806
+ const Root$v = styledComponents.styled(Box)(
1794
1807
  flexItemStyle,
1795
1808
  responsiveFlexStyle
1796
1809
  ), Flex = react.forwardRef(function(props, ref) {
@@ -1809,7 +1822,9 @@ const Root$w = styledComponents.styled(Box)(
1809
1822
  ref
1810
1823
  }
1811
1824
  );
1812
- }), rotate$1 = styledComponents.keyframes`
1825
+ });
1826
+ Flex.displayName = "ForwardRef(Flex)";
1827
+ const rotate$1 = styledComponents.keyframes`
1813
1828
  from {
1814
1829
  transform: rotate(0deg);
1815
1830
  }
@@ -1824,6 +1839,7 @@ const Root$w = styledComponents.styled(Box)(
1824
1839
  `, Spinner = react.forwardRef(function(props, ref) {
1825
1840
  return /* @__PURE__ */ jsxRuntime.jsx(Root$u, { "data-ui": "Spinner", ...props, ref, children: /* @__PURE__ */ jsxRuntime.jsx(icons.SpinnerIcon, {}) });
1826
1841
  });
1842
+ Spinner.displayName = "ForwardRef(Spinner)";
1827
1843
  function _cardColorStyle(base, color, checkered = !1) {
1828
1844
  return {
1829
1845
  // from base
@@ -2077,6 +2093,7 @@ const Root$t = styledComponents.styled.button(responsiveRadiusStyle, buttonBaseS
2077
2093
  }
2078
2094
  );
2079
2095
  });
2096
+ Button.displayName = "ForwardRef(Button)";
2080
2097
  function cardStyle(props) {
2081
2098
  return [cardBaseStyle(props), cardColorStyle(props)];
2082
2099
  }
@@ -2250,6 +2267,7 @@ const Root$s = styledComponents.styled(Box)(responsiveBorderStyle, responsiveRad
2250
2267
  }
2251
2268
  ) });
2252
2269
  });
2270
+ Card.displayName = "ForwardRef(Card)";
2253
2271
  function checkboxBaseStyles() {
2254
2272
  return styledComponents.css`
2255
2273
  position: relative;
@@ -2405,6 +2423,7 @@ const Root$r = styledComponents.styled.div(checkboxBaseStyles), Input$5 = styled
2405
2423
  ] })
2406
2424
  ] });
2407
2425
  });
2426
+ Checkbox.displayName = "ForwardRef(Checkbox)";
2408
2427
  function codeSyntaxHighlightingStyle({ theme: theme$1 }) {
2409
2428
  const {
2410
2429
  color: { syntax: color }
@@ -2483,7 +2502,9 @@ const Root$q = styledComponents.styled.pre(codeBaseStyle, responsiveCodeFontStyl
2483
2502
  !(language && registered) && /* @__PURE__ */ jsxRuntime.jsx("code", { children }),
2484
2503
  language && registered && /* @__PURE__ */ jsxRuntime.jsx(Refractor__default.default, { inline: !0, language, value: String(children) })
2485
2504
  ] });
2486
- }), BASE_STYLE$1 = {
2505
+ });
2506
+ Code.displayName = "ForwardRef(Code)";
2507
+ const BASE_STYLE$1 = {
2487
2508
  width: "100%",
2488
2509
  margin: "0 auto"
2489
2510
  };
@@ -2511,7 +2532,9 @@ const Root$p = styledComponents.styled(Box)(
2511
2532
  ref
2512
2533
  }
2513
2534
  );
2514
- }), Root$o = styledComponents.styled(Box)(responsiveGridStyle), Grid = react.forwardRef(function(props, ref) {
2535
+ });
2536
+ Container.displayName = "ForwardRef(Container)";
2537
+ const Root$o = styledComponents.styled(Box)(responsiveGridStyle), Grid = react.forwardRef(function(props, ref) {
2515
2538
  const { as, autoRows, autoCols, autoFlow, columns, gap, gapX, gapY, rows, children, ...restProps } = props;
2516
2539
  return /* @__PURE__ */ jsxRuntime.jsx(
2517
2540
  Root$o,
@@ -2533,6 +2556,7 @@ const Root$p = styledComponents.styled(Box)(
2533
2556
  }
2534
2557
  );
2535
2558
  });
2559
+ Grid.displayName = "ForwardRef(Grid)";
2536
2560
  function headingBaseStyle(props) {
2537
2561
  const { $accent, $muted } = props, { font } = theme.getTheme_v2(props.theme);
2538
2562
  return styledComponents.css`
@@ -2620,6 +2644,7 @@ const Root$n = styledComponents.styled.div(headingBaseStyle, responsiveTextAlign
2620
2644
  }
2621
2645
  );
2622
2646
  });
2647
+ Heading.displayName = "ForwardRef(Heading)";
2623
2648
  function inlineBaseStyle() {
2624
2649
  return {
2625
2650
  lineHeight: 0,
@@ -2659,6 +2684,7 @@ const Root$m = styledComponents.styled(Box)(inlineBaseStyle, inlineSpaceStyle),
2659
2684
  }
2660
2685
  );
2661
2686
  });
2687
+ Inline.displayName = "ForwardRef(Inline)";
2662
2688
  function kbdStyle() {
2663
2689
  return styledComponents.css`
2664
2690
  --card-bg-color: var(--card-kbd-bg-color);
@@ -2679,7 +2705,9 @@ function kbdStyle() {
2679
2705
  const Root$l = styledComponents.styled.kbd(responsiveRadiusStyle, kbdStyle), KBD = react.forwardRef(function(props, ref) {
2680
2706
  const { children, fontSize: fontSize2 = 0, padding = 1, radius = 2, ...restProps } = props;
2681
2707
  return /* @__PURE__ */ jsxRuntime.jsx(Root$l, { "data-ui": "KBD", ...restProps, $radius: useArrayProp(radius), ref, children: /* @__PURE__ */ jsxRuntime.jsx(Box, { as: "span", padding, children: /* @__PURE__ */ jsxRuntime.jsx(Text, { as: "span", size: fontSize2, weight: "semibold", children }) }) });
2682
- }), origin = {
2708
+ });
2709
+ KBD.displayName = "ForwardRef(KBD)";
2710
+ const origin = {
2683
2711
  name: "@sanity/ui/origin",
2684
2712
  fn({ middlewareData, placement, rects }) {
2685
2713
  var _a, _b;
@@ -2820,7 +2848,9 @@ const Root$k = styledComponents.styled.div(
2820
2848
  /* @__PURE__ */ jsxRuntime.jsx(StrokePath, { d: strokePath, mask: "url(#stroke-mask)", strokeWidth: strokeWidth * 2 }),
2821
2849
  /* @__PURE__ */ jsxRuntime.jsx(ShapePath, { d: fillPath })
2822
2850
  ] }) });
2823
- }), BoundaryElementContext = createGlobalScopedContext(
2851
+ });
2852
+ Arrow.displayName = "ForwardRef(Arrow)";
2853
+ const BoundaryElementContext = createGlobalScopedContext(
2824
2854
  "@sanity/ui/context/boundaryElement",
2825
2855
  null
2826
2856
  );
@@ -2828,6 +2858,7 @@ function BoundaryElementProvider(props) {
2828
2858
  const { children, element } = props, value = react.useMemo(() => ({ version: 0, element }), [element]);
2829
2859
  return /* @__PURE__ */ jsxRuntime.jsx(BoundaryElementContext.Provider, { value, children });
2830
2860
  }
2861
+ BoundaryElementProvider.displayName = "BoundaryElementProvider";
2831
2862
  function isRecord(value) {
2832
2863
  return !!(value && typeof value == "object" && !Array.isArray(value));
2833
2864
  }
@@ -2848,6 +2879,7 @@ function ConditionalWrapper({
2848
2879
  }) {
2849
2880
  return condition ? wrapper(children) : children;
2850
2881
  }
2882
+ ConditionalWrapper.displayName = "ConditionalWrapper";
2851
2883
  function findMaxBreakpoints(media, width) {
2852
2884
  const ret = [];
2853
2885
  for (let i = 0; i < media.length; i += 1)
@@ -2881,6 +2913,7 @@ const ElementQuery = react.forwardRef(function(props, forwardedRef) {
2881
2913
  }
2882
2914
  );
2883
2915
  });
2916
+ ElementQuery.displayName = "ForwardRef(ElementQuery)";
2884
2917
  var __defProp = Object.defineProperty, __defNormalProp = (obj, key2, value) => key2 in obj ? __defProp(obj, key2, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key2] = value, __publicField = (obj, key2, value) => __defNormalProp(obj, key2 + "", value);
2885
2918
  class ErrorBoundary extends react.Component {
2886
2919
  constructor() {
@@ -3031,6 +3064,7 @@ function LayerProvider(props) {
3031
3064
  );
3032
3065
  return /* @__PURE__ */ jsxRuntime.jsx(LayerContext.Provider, { value, children });
3033
3066
  }
3067
+ LayerProvider.displayName = "LayerProvider";
3034
3068
  const Root$j = styledComponents.styled.div({ position: "relative" }), LayerChildren = react.forwardRef(function(props, forwardedRef) {
3035
3069
  const { children, onActivate, onFocus, style = EMPTY_RECORD, ...restProps } = props, { zIndex, isTopLayer } = useLayer(), lastFocusedRef = react.useRef(null), ref = react.useRef(null), isTopLayerRef = react.useRef(isTopLayer);
3036
3070
  react.useImperativeHandle(forwardedRef, () => ref.current), react.useEffect(() => {
@@ -3048,7 +3082,9 @@ const Root$j = styledComponents.styled.div({ position: "relative" }), LayerChild
3048
3082
  }), Layer = react.forwardRef(function(props, ref) {
3049
3083
  const { children, zOffset = 1, ...restProps } = props;
3050
3084
  return /* @__PURE__ */ jsxRuntime.jsx(LayerProvider, { zOffset, children: /* @__PURE__ */ jsxRuntime.jsx(LayerChildren, { ...restProps, ref, children }) });
3051
- }), key = "@sanity/ui/context/portal", elementKey = Symbol.for(`${key}/element`);
3085
+ });
3086
+ Layer.displayName = "ForwardRef(Layer)";
3087
+ const key = "@sanity/ui/context/portal", elementKey = Symbol.for(`${key}/element`);
3052
3088
  globalScope[elementKey] = null;
3053
3089
  const defaultContextValue = {
3054
3090
  version: 0,
@@ -3070,6 +3106,7 @@ function Portal(props) {
3070
3106
  const { children, __unstable_name: name } = props, portal = usePortal(), portalElement = (name ? portal.elements && portal.elements[name] : portal.element) || ((_a = portal.elements) == null ? void 0 : _a.default);
3071
3107
  return portalElement ? reactDom.createPortal(children, portalElement) : null;
3072
3108
  }
3109
+ Portal.displayName = "Portal";
3073
3110
  function PortalProvider(props) {
3074
3111
  const { boundaryElement, children, element, __unstable_elements: elementsProp } = props, elements = useUnique(elementsProp), fallbackElement = react.useSyncExternalStore(
3075
3112
  emptySubscribe,
@@ -3083,6 +3120,7 @@ function PortalProvider(props) {
3083
3120
  }), [boundaryElement, element, elements, fallbackElement]);
3084
3121
  return /* @__PURE__ */ jsxRuntime.jsx(PortalContext.Provider, { value, children });
3085
3122
  }
3123
+ PortalProvider.displayName = "PortalProvider";
3086
3124
  const emptySubscribe = () => () => {
3087
3125
  };
3088
3126
  function useUnique(value) {
@@ -3105,7 +3143,9 @@ const Root$i = styledComponents.styled.div`
3105
3143
  `, SrOnly = react.forwardRef(function(props, ref) {
3106
3144
  const { as, children } = props;
3107
3145
  return /* @__PURE__ */ jsxRuntime.jsx(Root$i, { "aria-hidden": !0, as, "data-ui": "SrOnly", ref, children });
3108
- }), Root$h = styledComponents.styled.div`
3146
+ });
3147
+ SrOnly.displayName = "ForwardRef(SrOnly)";
3148
+ const Root$h = styledComponents.styled.div`
3109
3149
  position: relative;
3110
3150
  `, ItemWrapper = styledComponents.styled.div`
3111
3151
  position: absolute;
@@ -3154,7 +3194,9 @@ const Root$i = styledComponents.styled.div`
3154
3194
  return /* @__PURE__ */ jsxRuntime.jsx(ItemWrapper, { style: { top: itemIndex * (itemHeight + space[gap]) }, children: node }, key2);
3155
3195
  }), [fromIndex, gap, getItemKey, itemHeight, items, renderItem, space, toIndex]), wrapperStyle = react.useMemo(() => ({ height }), [height]);
3156
3196
  return /* @__PURE__ */ jsxRuntime.jsx(Root$h, { as, "data-ui": "VirtualList", ...restProps, ref, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref: wrapperRef, style: wrapperStyle, children }) });
3157
- }), DEFAULT_POPOVER_DISTANCE = 4, DEFAULT_POPOVER_PADDING = 4, DEFAULT_POPOVER_ARROW_WIDTH = 19, DEFAULT_POPOVER_ARROW_HEIGHT = 8, DEFAULT_POPOVER_ARROW_RADIUS = 2, DEFAULT_POPOVER_MARGINS = [0, 0, 0, 0], DEFAULT_FALLBACK_PLACEMENTS$1 = {
3197
+ });
3198
+ VirtualList.displayName = "ForwardRef(VirtualList)";
3199
+ const DEFAULT_POPOVER_DISTANCE = 4, DEFAULT_POPOVER_PADDING = 4, DEFAULT_POPOVER_ARROW_WIDTH = 19, DEFAULT_POPOVER_ARROW_HEIGHT = 8, DEFAULT_POPOVER_ARROW_RADIUS = 2, DEFAULT_POPOVER_MARGINS = [0, 0, 0, 0], DEFAULT_FALLBACK_PLACEMENTS$1 = {
3158
3200
  top: ["bottom", "left", "right"],
3159
3201
  "top-start": ["bottom-start", "left-start", "right-start"],
3160
3202
  "top-end": ["bottom-end", "left-end", "right-end"],
@@ -3297,7 +3339,7 @@ const MotionCard$1 = styledComponents.styled(framerMotion.motion(Card))`
3297
3339
  );
3298
3340
  })
3299
3341
  );
3300
- PopoverCard.displayName = "PopoverCard";
3342
+ PopoverCard.displayName = "Memo(ForwardRef(PopoverCard))";
3301
3343
  const Popover = react.memo(
3302
3344
  react.forwardRef(function(props, forwardedRef) {
3303
3345
  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
@@ -3481,7 +3523,7 @@ const Popover = react.memo(
3481
3523
  ] });
3482
3524
  })
3483
3525
  );
3484
- Popover.displayName = "Popover";
3526
+ Popover.displayName = "Memo(ForwardRef(Popover))";
3485
3527
  function radioBaseStyle() {
3486
3528
  return styledComponents.css`
3487
3529
  position: relative;
@@ -3611,6 +3653,7 @@ const Root$g = styledComponents.styled.div(radioBaseStyle), Input$4 = styledComp
3611
3653
  /* @__PURE__ */ jsxRuntime.jsx("span", {})
3612
3654
  ] });
3613
3655
  });
3656
+ Radio.displayName = "ForwardRef(Radio)";
3614
3657
  function rootStyle() {
3615
3658
  return styledComponents.css`
3616
3659
  position: relative;
@@ -3778,7 +3821,9 @@ const selectStyle = {
3778
3821
  ),
3779
3822
  /* @__PURE__ */ jsxRuntime.jsx(IconBox, { padding, children: /* @__PURE__ */ jsxRuntime.jsx(Text, { size: fontSize2, children: /* @__PURE__ */ jsxRuntime.jsx(icons.ChevronDownIcon, {}) }) })
3780
3823
  ] });
3781
- }), BASE_STYLE = {
3824
+ });
3825
+ Select.displayName = "ForwardRef(Select)";
3826
+ const BASE_STYLE = {
3782
3827
  "&&:not([hidden])": {
3783
3828
  display: "grid"
3784
3829
  },
@@ -3811,6 +3856,7 @@ const Root$e = styledComponents.styled(Box)(stackBaseStyle, responsiveStackSpace
3811
3856
  }
3812
3857
  );
3813
3858
  });
3859
+ Stack.displayName = "ForwardRef(Stack)";
3814
3860
  function switchBaseStyles() {
3815
3861
  return styledComponents.css`
3816
3862
  position: relative;
@@ -3977,7 +4023,9 @@ const Root$d = styledComponents.styled.span(switchBaseStyles), Input$2 = styledC
3977
4023
  /* @__PURE__ */ jsxRuntime.jsx(Thumb, { $checked: checked, $indeterminate: indeterminate })
3978
4024
  ] })
3979
4025
  ] });
3980
- }), Root$c = styledComponents.styled.span(textInputRootStyle), InputRoot$1 = styledComponents.styled.span`
4026
+ });
4027
+ Switch.displayName = "ForwardRef(Switch)";
4028
+ const Root$c = styledComponents.styled.span(textInputRootStyle), InputRoot$1 = styledComponents.styled.span`
3981
4029
  flex: 1;
3982
4030
  min-width: 0;
3983
4031
  display: block;
@@ -4035,7 +4083,9 @@ const Root$d = styledComponents.styled.span(switchBaseStyles), Input$2 = styledC
4035
4083
  }
4036
4084
  )
4037
4085
  ] }) });
4038
- }), CLEAR_BUTTON_BOX_STYLE = { zIndex: 2 }, Root$b = styledComponents.styled(Card).attrs({ forwardedAs: "span" })(textInputRootStyle), InputRoot = styledComponents.styled.span`
4086
+ });
4087
+ TextArea.displayName = "ForwardRef(TextArea)";
4088
+ const CLEAR_BUTTON_BOX_STYLE = { zIndex: 2 }, Root$b = styledComponents.styled(Card).attrs({ forwardedAs: "span" })(textInputRootStyle), InputRoot = styledComponents.styled.span`
4039
4089
  flex: 1;
4040
4090
  min-width: 0;
4041
4091
  display: block;
@@ -4235,6 +4285,7 @@ const Root$d = styledComponents.styled.span(switchBaseStyles), Input$2 = styledC
4235
4285
  suffixNode
4236
4286
  ] });
4237
4287
  });
4288
+ TextInput.displayName = "ForwardRef(TextInput)";
4238
4289
  function useDelayedState(initialState) {
4239
4290
  const [state, setState] = react.useState(initialState), delayedAction = react.useRef(), onStateChange = react.useCallback((nextState, delay) => {
4240
4291
  const action = () => {
@@ -4328,7 +4379,7 @@ const DEFAULT_TOOLTIP_ARROW_WIDTH = 15, DEFAULT_TOOLTIP_ARROW_HEIGHT = 6, DEFAUL
4328
4379
  );
4329
4380
  })
4330
4381
  );
4331
- TooltipCard.displayName = "TooltipCard";
4382
+ TooltipCard.displayName = "Memo(ForwardRef(TooltipCard))";
4332
4383
  const TooltipDelayGroupContext = createGlobalScopedContext(
4333
4384
  "@sanity/ui/context/tooltipDelayGroup",
4334
4385
  null
@@ -4351,6 +4402,7 @@ function TooltipDelayGroupProvider(props) {
4351
4402
  );
4352
4403
  return /* @__PURE__ */ jsxRuntime.jsx(TooltipDelayGroupContext.Provider, { value, children });
4353
4404
  }
4405
+ TooltipDelayGroupProvider.displayName = "TooltipDelayGroupProvider";
4354
4406
  const Root$a = styledComponents.styled(Layer)`
4355
4407
  pointer-events: none;
4356
4408
  `, Tooltip = react.forwardRef(function(props, forwardedRef) {
@@ -4550,6 +4602,7 @@ const Root$a = styledComponents.styled(Layer)`
4550
4602
  child
4551
4603
  ] });
4552
4604
  });
4605
+ Tooltip.displayName = "ForwardRef(Tooltip)";
4553
4606
  function useCloseOnMouseLeave({
4554
4607
  handleIsOpenChange,
4555
4608
  referenceElement,
@@ -4965,7 +5018,9 @@ const AUTOCOMPLETE_LISTBOX_IGNORE_KEYS = [
4965
5018
  ]
4966
5019
  }
4967
5020
  );
4968
- }), Autocomplete = InnerAutocomplete, Root$8 = styledComponents.styled.ol`
5021
+ });
5022
+ InnerAutocomplete.displayName = "ForwardRef(Autocomplete)";
5023
+ const Autocomplete = InnerAutocomplete, Root$8 = styledComponents.styled.ol`
4969
5024
  margin: 0;
4970
5025
  padding: 0;
4971
5026
  display: flex;
@@ -5019,6 +5074,7 @@ const AUTOCOMPLETE_LISTBOX_IGNORE_KEYS = [
5019
5074
  /* @__PURE__ */ jsxRuntime.jsx(Box, { as: "li", children: item })
5020
5075
  ] }, itemIndex)) });
5021
5076
  });
5077
+ Breadcrumbs.displayName = "ForwardRef(Breadcrumbs)";
5022
5078
  function dialogStyle({ theme: theme$1 }) {
5023
5079
  const { color } = theme.getTheme_v2(theme$1);
5024
5080
  return {
@@ -5166,7 +5222,9 @@ const Root$7 = styledComponents.styled(Layer)(responsivePaddingStyle, dialogStyl
5166
5222
  /* @__PURE__ */ jsxRuntime.jsx(DialogContent, { flex: 1, ref: contentRef, tabIndex: -1, children }),
5167
5223
  footer && /* @__PURE__ */ jsxRuntime.jsx(DialogFooter, { children: footer })
5168
5224
  ] }) }) });
5169
- }), Dialog = react.forwardRef(function(props, ref) {
5225
+ });
5226
+ DialogCard.displayName = "ForwardRef(DialogCard)";
5227
+ const Dialog = react.forwardRef(function(props, ref) {
5170
5228
  var _a;
5171
5229
  const dialog = useDialog(), { layer } = useTheme_v2(), {
5172
5230
  __unstable_autoFocus: autoFocus = !0,
@@ -5263,6 +5321,7 @@ const Root$7 = styledComponents.styled(Layer)(responsivePaddingStyle, dialogStyl
5263
5321
  }
5264
5322
  ) });
5265
5323
  });
5324
+ Dialog.displayName = "ForwardRef(Dialog)";
5266
5325
  function DialogProvider(props) {
5267
5326
  const { children, position, zOffset } = props, contextValue = react.useMemo(
5268
5327
  () => ({
@@ -5274,6 +5333,7 @@ function DialogProvider(props) {
5274
5333
  );
5275
5334
  return /* @__PURE__ */ jsxRuntime.jsx(DialogContext.Provider, { value: contextValue, children });
5276
5335
  }
5336
+ DialogProvider.displayName = "DialogProvider";
5277
5337
  const Root$6 = styledComponents.styled.kbd`
5278
5338
  font: inherit;
5279
5339
  padding: 1px;
@@ -5288,7 +5348,9 @@ const Root$6 = styledComponents.styled.kbd`
5288
5348
  `, Hotkeys = react.forwardRef(function(props, ref) {
5289
5349
  const { fontSize: fontSize2, keys, padding, radius, space: spaceProp = 0.5, ...restProps } = props, space = useArrayProp(spaceProp);
5290
5350
  return !keys || keys.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {}) : /* @__PURE__ */ jsxRuntime.jsx(Root$6, { "data-ui": "Hotkeys", ...restProps, ref, children: /* @__PURE__ */ jsxRuntime.jsx(Inline, { as: "span", space, children: keys.map((key2, i) => /* @__PURE__ */ jsxRuntime.jsx(Key, { fontSize: fontSize2, padding, radius, children: key2 }, i)) }) });
5291
- }), MenuContext = createGlobalScopedContext(
5351
+ });
5352
+ Hotkeys.displayName = "ForwardRef(Hotkeys)";
5353
+ const MenuContext = createGlobalScopedContext(
5292
5354
  "@sanity/ui/context/menu",
5293
5355
  null
5294
5356
  );
@@ -5522,7 +5584,9 @@ const Root$5 = styledComponents.styled(Box)`
5522
5584
  children: /* @__PURE__ */ jsxRuntime.jsx(Stack, { space, children })
5523
5585
  }
5524
5586
  ) });
5525
- }), MenuButton = react.forwardRef(function(props, forwardedRef) {
5587
+ });
5588
+ Menu.displayName = "ForwardRef(Menu)";
5589
+ const MenuButton = react.forwardRef(function(props, forwardedRef) {
5526
5590
  const {
5527
5591
  __unstable_disableRestoreFocusOnClose: disableRestoreFocusOnClose = !1,
5528
5592
  boundaryElement: deprecated_boundaryElement,
@@ -5654,12 +5718,15 @@ const Root$5 = styledComponents.styled(Box)`
5654
5718
  ]
5655
5719
  );
5656
5720
  return /* @__PURE__ */ jsxRuntime.jsx(Popover, { "data-ui": "MenuButton__popover", ...popoverProps, content: menu, open, children: button || /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {}) });
5657
- }), MenuDivider = styledComponents.styled.hr`
5721
+ });
5722
+ MenuButton.displayName = "ForwardRef(MenuButton)";
5723
+ const MenuDivider = styledComponents.styled.hr`
5658
5724
  height: 1px;
5659
5725
  border: 0;
5660
5726
  background: var(--card-hairline-soft-color);
5661
5727
  margin: 0;
5662
5728
  `;
5729
+ MenuDivider.displayName = "MenuDivider";
5663
5730
  function selectableBaseStyle() {
5664
5731
  return styledComponents.css`
5665
5732
  background-color: inherit;
@@ -5761,6 +5828,7 @@ const Selectable = styledComponents.styled(Box)(
5761
5828
  selectableBaseStyle,
5762
5829
  selectableColorStyle
5763
5830
  );
5831
+ Selectable.displayName = "Selectable";
5764
5832
  function useMenu() {
5765
5833
  const value = react.useContext(MenuContext);
5766
5834
  if (!value)
@@ -5869,6 +5937,7 @@ function MenuGroup(props) {
5869
5937
  }
5870
5938
  ) });
5871
5939
  }
5940
+ MenuGroup.displayName = "MenuGroup";
5872
5941
  const MenuItem = react.forwardRef(function(props, forwardedRef) {
5873
5942
  const {
5874
5943
  as = "button",
@@ -5966,7 +6035,9 @@ const MenuItem = react.forwardRef(function(props, forwardedRef) {
5966
6035
  ]
5967
6036
  }
5968
6037
  );
5969
- }), keyframe = styledComponents.keyframes`
6038
+ });
6039
+ MenuItem.displayName = "ForwardRef(MenuItem)";
6040
+ const keyframe = styledComponents.keyframes`
5970
6041
  0% {
5971
6042
  background-position: 100%;
5972
6043
  }
@@ -6026,7 +6097,9 @@ const MenuItem = react.forwardRef(function(props, forwardedRef) {
6026
6097
  ref
6027
6098
  }
6028
6099
  );
6029
- }), Root$3 = styledComponents.styled(Skeleton)((props) => {
6100
+ });
6101
+ Skeleton.displayName = "ForwardRef(Skeleton)";
6102
+ const Root$3 = styledComponents.styled(Skeleton)((props) => {
6030
6103
  const { $size, $style } = props, { font, media } = theme.getTheme_v2(props.theme), fontStyle = font[$style];
6031
6104
  return _responsive(media, $size, (sizeIndex) => {
6032
6105
  const fontSize2 = fontStyle.sizes[sizeIndex];
@@ -6035,16 +6108,24 @@ const MenuItem = react.forwardRef(function(props, forwardedRef) {
6035
6108
  }), TextSkeleton = react.forwardRef(function(props, ref) {
6036
6109
  const { size: size2 = 2, ...restProps } = props, $size = useArrayProp(size2);
6037
6110
  return /* @__PURE__ */ jsxRuntime.jsx(Root$3, { ...restProps, $size, ref, $style: "text" });
6038
- }), LabelSkeleton = react.forwardRef(function(props, ref) {
6111
+ });
6112
+ TextSkeleton.displayName = "ForwardRef(TextSkeleton)";
6113
+ const LabelSkeleton = react.forwardRef(function(props, ref) {
6039
6114
  const { size: size2 = 2, ...restProps } = props, $size = useArrayProp(size2);
6040
6115
  return /* @__PURE__ */ jsxRuntime.jsx(Root$3, { ...restProps, $size, ref, $style: "label" });
6041
- }), HeadingSkeleton = react.forwardRef(function(props, ref) {
6116
+ });
6117
+ LabelSkeleton.displayName = "ForwardRef(LabelSkeleton)";
6118
+ const HeadingSkeleton = react.forwardRef(function(props, ref) {
6042
6119
  const { size: size2 = 2, ...restProps } = props, $size = useArrayProp(size2);
6043
6120
  return /* @__PURE__ */ jsxRuntime.jsx(Root$3, { ...restProps, $size, ref, $style: "heading" });
6044
- }), CodeSkeleton = react.forwardRef(function(props, ref) {
6121
+ });
6122
+ HeadingSkeleton.displayName = "ForwardRef(HeadingSkeleton)";
6123
+ const CodeSkeleton = react.forwardRef(function(props, ref) {
6045
6124
  const { size: size2 = 2, ...restProps } = props, $size = useArrayProp(size2);
6046
6125
  return /* @__PURE__ */ jsxRuntime.jsx(Root$3, { ...restProps, $size, ref, $style: "code" });
6047
- }), CustomButton = styledComponents.styled(Button)`
6126
+ });
6127
+ CodeSkeleton.displayName = "ForwardRef(CodeSkeleton)";
6128
+ const CustomButton = styledComponents.styled(Button)`
6048
6129
  max-width: 100%;
6049
6130
  `, Tab = react.forwardRef(function(props, forwardedRef) {
6050
6131
  const {
@@ -6096,6 +6177,7 @@ const MenuItem = react.forwardRef(function(props, forwardedRef) {
6096
6177
  }
6097
6178
  );
6098
6179
  });
6180
+ Tab.displayName = "ForwardRef(Tab)";
6099
6181
  function _isReactElement(node) {
6100
6182
  return !!node;
6101
6183
  }
@@ -6132,7 +6214,9 @@ const CustomInline = styledComponents.styled(Inline)`
6132
6214
  children: tabs
6133
6215
  }
6134
6216
  );
6135
- }), TabPanel = react.forwardRef(function(props, ref) {
6217
+ });
6218
+ TabList.displayName = "ForwardRef(TabList)";
6219
+ const TabPanel = react.forwardRef(function(props, ref) {
6136
6220
  const { flex, ...restProps } = props;
6137
6221
  return /* @__PURE__ */ jsxRuntime.jsx(
6138
6222
  Box,
@@ -6146,7 +6230,9 @@ const CustomInline = styledComponents.styled(Inline)`
6146
6230
  children: props.children
6147
6231
  }
6148
6232
  );
6149
- }), TextBox = styledComponents.styled(Flex)`
6233
+ });
6234
+ TabPanel.displayName = "ForwardRef(TabPanel)";
6235
+ const TextBox = styledComponents.styled(Flex)`
6150
6236
  overflow-x: auto;
6151
6237
  `, loadingAnimation = styledComponents.keyframes`
6152
6238
  0% {
@@ -6240,6 +6326,7 @@ function Toast(props) {
6240
6326
  }
6241
6327
  );
6242
6328
  }
6329
+ Toast.displayName = "Toast";
6243
6330
  function useMounted() {
6244
6331
  return react.useSyncExternalStore(
6245
6332
  subscribe,
@@ -6346,6 +6433,7 @@ function ToastProvider(props) {
6346
6433
  )) }) }) }) })
6347
6434
  ] });
6348
6435
  }
6436
+ ToastProvider.displayName = "ToastProvider";
6349
6437
  function useToast() {
6350
6438
  const value = react.useContext(ToastContext);
6351
6439
  if (!value)
@@ -6534,7 +6622,7 @@ const TreeContext = createGlobalScopedContext(
6534
6622
  ) });
6535
6623
  })
6536
6624
  );
6537
- Tree.displayName = "Tree";
6625
+ Tree.displayName = "Memo(ForwardRef(Tree))";
6538
6626
  function treeItemRootStyle() {
6539
6627
  return styledComponents.css`
6540
6628
  &[role='none'] > [role='treeitem'] {
@@ -6753,6 +6841,7 @@ const TreeGroup = react.memo(function(props) {
6753
6841
  }
6754
6842
  );
6755
6843
  });
6844
+ TreeItem.displayName = "Memo(TreeItem)";
6756
6845
  exports.Arrow = Arrow;
6757
6846
  exports.Autocomplete = Autocomplete;
6758
6847
  exports.Avatar = Avatar;