@sanity/ui 2.10.18 → 2.11.1

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 (36) hide show
  1. package/dist/index.d.mts +29 -19
  2. package/dist/index.d.ts +29 -19
  3. package/dist/index.esm.js +32 -31
  4. package/dist/index.esm.js.map +1 -1
  5. package/dist/index.js +32 -31
  6. package/dist/index.js.map +1 -1
  7. package/dist/index.mjs +32 -31
  8. package/dist/index.mjs.map +1 -1
  9. package/package.json +9 -9
  10. package/src/core/components/autocomplete/__workshop__/constrainedHeight.tsx +1 -1
  11. package/src/core/components/autocomplete/autocomplete.tsx +3 -4
  12. package/src/core/components/autocomplete/autocompleteOption.tsx +1 -1
  13. package/src/core/components/dialog/dialogProvider.tsx +1 -1
  14. package/src/core/components/menu/__workshop__/asComponent.tsx +1 -1
  15. package/src/core/components/menu/menuButton.tsx +2 -2
  16. package/src/core/components/menu/menuGroup.tsx +15 -2
  17. package/src/core/components/tab/tabList.tsx +2 -2
  18. package/src/core/components/toast/toast.tsx +1 -1
  19. package/src/core/components/toast/toastProvider.tsx +1 -1
  20. package/src/core/components/tree/tree.tsx +1 -1
  21. package/src/core/components/tree/treeGroup.tsx +1 -1
  22. package/src/core/components/tree/treeItem.tsx +1 -1
  23. package/src/core/primitives/avatar/avatarStack.tsx +1 -1
  24. package/src/core/primitives/card/__workshop__/asComponent.tsx +1 -1
  25. package/src/core/primitives/popover/__workshop__/TestStory.tsx +2 -2
  26. package/src/core/primitives/popover/popover.tsx +3 -3
  27. package/src/core/primitives/tooltip/tooltip.tsx +1 -1
  28. package/src/core/primitives/tooltip/tooltipDelayGroup/tooltipDelayGroupProvider.tsx +1 -1
  29. package/src/core/theme/__workshop__/build/story.tsx +1 -2
  30. package/src/core/theme/themeColorProvider.tsx +1 -1
  31. package/src/core/theme/themeProvider.tsx +1 -1
  32. package/src/core/utils/arrow/arrow.tsx +2 -2
  33. package/src/core/utils/boundaryElement/boundaryElementProvider.tsx +1 -3
  34. package/src/core/utils/layer/layerProvider.tsx +1 -1
  35. package/src/core/utils/portal/portalProvider.tsx +1 -1
  36. package/src/core/utils/virtualList/virtualList.tsx +1 -1
package/dist/index.mjs CHANGED
@@ -6097,13 +6097,14 @@ function useMenu() {
6097
6097
  return value;
6098
6098
  }
6099
6099
  function MenuGroup(props) {
6100
- const $ = c(77);
6101
- let IconComponent, children, onClick, popover, restProps, t0, t1, t2, t3, t4, t5, text;
6100
+ const $ = c(79);
6101
+ let IconComponent, children, menuProps, onClick, popover, restProps, t0, t1, t2, t3, t4, t5, text;
6102
6102
  $[0] !== props ? ({
6103
6103
  as: t0,
6104
6104
  children,
6105
6105
  fontSize: t1,
6106
6106
  icon: IconComponent,
6107
+ menu: menuProps,
6107
6108
  onClick,
6108
6109
  padding: t2,
6109
6110
  popover,
@@ -6112,7 +6113,7 @@ function MenuGroup(props) {
6112
6113
  text,
6113
6114
  tone: t5,
6114
6115
  ...restProps
6115
- } = props, $[0] = props, $[1] = IconComponent, $[2] = children, $[3] = onClick, $[4] = popover, $[5] = restProps, $[6] = t0, $[7] = t1, $[8] = t2, $[9] = t3, $[10] = t4, $[11] = t5, $[12] = text) : (IconComponent = $[1], children = $[2], onClick = $[3], popover = $[4], restProps = $[5], t0 = $[6], t1 = $[7], t2 = $[8], t3 = $[9], t4 = $[10], t5 = $[11], text = $[12]);
6116
+ } = props, $[0] = props, $[1] = IconComponent, $[2] = children, $[3] = menuProps, $[4] = onClick, $[5] = popover, $[6] = restProps, $[7] = t0, $[8] = t1, $[9] = t2, $[10] = t3, $[11] = t4, $[12] = t5, $[13] = text) : (IconComponent = $[1], children = $[2], menuProps = $[3], onClick = $[4], popover = $[5], restProps = $[6], t0 = $[7], t1 = $[8], t2 = $[9], t3 = $[10], t4 = $[11], t5 = $[12], text = $[13]);
6116
6117
  const as = t0 === void 0 ? "button" : t0, fontSize2 = t1 === void 0 ? 1 : t1, padding = t2 === void 0 ? 3 : t2, radius = t3 === void 0 ? 2 : t3, space = t4 === void 0 ? 3 : t4, tone = t5 === void 0 ? "default" : t5, menu = useMenu(), {
6117
6118
  scheme
6118
6119
  } = useRootTheme(), {
@@ -6125,80 +6126,80 @@ function MenuGroup(props) {
6125
6126
  registerElement
6126
6127
  } = menu, onItemMouseEnter = _onItemMouseEnter ?? menu.onMouseEnter, [rootElement, setRootElement] = useState(null), [open, setOpen] = useState(!1), [shouldFocus, setShouldFocus] = useState(null), active = !!activeElement && activeElement === rootElement, [withinMenu, setWithinMenu] = useState(!1);
6127
6128
  let t6;
6128
- $[13] !== onItemMouseEnter ? (t6 = (event) => {
6129
+ $[14] !== onItemMouseEnter ? (t6 = (event) => {
6129
6130
  setWithinMenu(!1), onItemMouseEnter(event), setOpen(!0);
6130
- }, $[13] = onItemMouseEnter, $[14] = t6) : t6 = $[14];
6131
+ }, $[14] = onItemMouseEnter, $[15] = t6) : t6 = $[15];
6131
6132
  const handleMouseEnter = t6;
6132
6133
  let t7;
6133
- $[15] !== rootElement ? (t7 = (event_0) => {
6134
+ $[16] !== rootElement ? (t7 = (event_0) => {
6134
6135
  event_0.key === "ArrowLeft" && (event_0.stopPropagation(), setOpen(!1), requestAnimationFrame(() => {
6135
6136
  rootElement?.focus();
6136
6137
  }));
6137
- }, $[15] = rootElement, $[16] = t7) : t7 = $[16];
6138
+ }, $[16] = rootElement, $[17] = t7) : t7 = $[17];
6138
6139
  const handleMenuKeyDown = t7;
6139
6140
  let t8;
6140
- $[17] !== onClick ? (t8 = (event_1) => {
6141
+ $[18] !== onClick ? (t8 = (event_1) => {
6141
6142
  onClick?.(event_1), setShouldFocus("first"), setOpen(!0);
6142
- }, $[17] = onClick, $[18] = t8) : t8 = $[18];
6143
+ }, $[18] = onClick, $[19] = t8) : t8 = $[19];
6143
6144
  const handleClick = t8;
6144
6145
  let t9;
6145
- $[19] !== onItemClick ? (t9 = () => {
6146
+ $[20] !== onItemClick ? (t9 = () => {
6146
6147
  setOpen(!1), onItemClick?.();
6147
- }, $[19] = onItemClick, $[20] = t9) : t9 = $[20];
6148
+ }, $[20] = onItemClick, $[21] = t9) : t9 = $[21];
6148
6149
  const handleChildItemClick = t9;
6149
6150
  let t10;
6150
- $[21] === Symbol.for("react.memo_cache_sentinel") ? (t10 = () => setWithinMenu(!0), $[21] = t10) : t10 = $[21];
6151
+ $[22] === Symbol.for("react.memo_cache_sentinel") ? (t10 = () => setWithinMenu(!0), $[22] = t10) : t10 = $[22];
6151
6152
  const handleMenuMouseEnter = t10;
6152
6153
  let t11, t12;
6153
- $[22] !== mount || $[23] !== rootElement ? (t11 = () => mount(rootElement), t12 = [mount, rootElement], $[22] = mount, $[23] = rootElement, $[24] = t11, $[25] = t12) : (t11 = $[24], t12 = $[25]), useEffect(t11, t12);
6154
+ $[23] !== mount || $[24] !== rootElement ? (t11 = () => mount(rootElement), t12 = [mount, rootElement], $[23] = mount, $[24] = rootElement, $[25] = t11, $[26] = t12) : (t11 = $[25], t12 = $[26]), useEffect(t11, t12);
6154
6155
  let t13, t14;
6155
- $[26] !== active ? (t13 = () => {
6156
+ $[27] !== active ? (t13 = () => {
6156
6157
  active || setOpen(!1);
6157
- }, t14 = [active], $[26] = active, $[27] = t13, $[28] = t14) : (t13 = $[27], t14 = $[28]), useEffect(t13, t14);
6158
+ }, t14 = [active], $[27] = active, $[28] = t13, $[29] = t14) : (t13 = $[28], t14 = $[29]), useEffect(t13, t14);
6158
6159
  let t15, t16;
6159
- $[29] !== open ? (t15 = () => {
6160
+ $[30] !== open ? (t15 = () => {
6160
6161
  open || setWithinMenu(!1);
6161
- }, t16 = [open], $[29] = open, $[30] = t15, $[31] = t16) : (t15 = $[30], t16 = $[31]), useEffect(t15, t16);
6162
+ }, t16 = [open], $[30] = open, $[31] = t15, $[32] = t16) : (t15 = $[31], t16 = $[32]), useEffect(t15, t16);
6162
6163
  let t17, t18;
6163
- $[32] !== shouldFocus ? (t17 = () => {
6164
+ $[33] !== shouldFocus ? (t17 = () => {
6164
6165
  if (!shouldFocus)
6165
6166
  return;
6166
6167
  const rafId = requestAnimationFrame(() => setShouldFocus(null));
6167
6168
  return () => cancelAnimationFrame(rafId);
6168
- }, t18 = [shouldFocus], $[32] = shouldFocus, $[33] = t17, $[34] = t18) : (t17 = $[33], t18 = $[34]), useEffect(t17, t18);
6169
+ }, t18 = [shouldFocus], $[33] = shouldFocus, $[34] = t17, $[35] = t18) : (t17 = $[34], t18 = $[35]), useEffect(t17, t18);
6169
6170
  let t19;
6170
- $[35] !== children || $[36] !== handleChildItemClick || $[37] !== handleMenuKeyDown || $[38] !== onClickOutside || $[39] !== onEscape || $[40] !== registerElement || $[41] !== shouldFocus ? (t19 = /* @__PURE__ */ jsx(Menu, { onClickOutside, onEscape, onItemClick: handleChildItemClick, onKeyDown: handleMenuKeyDown, onMouseEnter: handleMenuMouseEnter, registerElement, shouldFocus, children }), $[35] = children, $[36] = handleChildItemClick, $[37] = handleMenuKeyDown, $[38] = onClickOutside, $[39] = onEscape, $[40] = registerElement, $[41] = shouldFocus, $[42] = t19) : t19 = $[42];
6171
+ $[36] !== children || $[37] !== handleChildItemClick || $[38] !== handleMenuKeyDown || $[39] !== menuProps || $[40] !== onClickOutside || $[41] !== onEscape || $[42] !== registerElement || $[43] !== shouldFocus ? (t19 = /* @__PURE__ */ jsx(Menu, { ...menuProps, onClickOutside, onEscape, onItemClick: handleChildItemClick, onKeyDown: handleMenuKeyDown, onMouseEnter: handleMenuMouseEnter, registerElement, shouldFocus, children }), $[36] = children, $[37] = handleChildItemClick, $[38] = handleMenuKeyDown, $[39] = menuProps, $[40] = onClickOutside, $[41] = onEscape, $[42] = registerElement, $[43] = shouldFocus, $[44] = t19) : t19 = $[44];
6171
6172
  const childMenu = t19;
6172
6173
  let t20;
6173
- $[43] === Symbol.for("react.memo_cache_sentinel") ? (t20 = (event_2) => {
6174
+ $[45] === Symbol.for("react.memo_cache_sentinel") ? (t20 = (event_2) => {
6174
6175
  const target = event_2.currentTarget;
6175
6176
  if (document.activeElement === target && event_2.key === "ArrowRight") {
6176
6177
  setShouldFocus("first"), setOpen(!0), setWithinMenu(!0);
6177
6178
  return;
6178
6179
  }
6179
- }, $[43] = t20) : t20 = $[43];
6180
+ }, $[45] = t20) : t20 = $[45];
6180
6181
  const handleKeyDown = t20, t21 = as === "button" ? withinMenu : void 0, t22 = as !== "button" ? withinMenu : void 0, t23 = !withinMenu && active ? "" : void 0, t24 = useArrayProp(radius), t25 = as === "button" ? "button" : void 0;
6181
6182
  let t26;
6182
- $[44] !== IconComponent || $[45] !== fontSize2 ? (t26 = IconComponent && /* @__PURE__ */ jsxs(Text, { size: fontSize2, children: [
6183
+ $[46] !== IconComponent || $[47] !== fontSize2 ? (t26 = IconComponent && /* @__PURE__ */ jsxs(Text, { size: fontSize2, children: [
6183
6184
  isValidElement(IconComponent) && IconComponent,
6184
6185
  isValidElementType(IconComponent) && /* @__PURE__ */ jsx(IconComponent, {})
6185
- ] }), $[44] = IconComponent, $[45] = fontSize2, $[46] = t26) : t26 = $[46];
6186
+ ] }), $[46] = IconComponent, $[47] = fontSize2, $[48] = t26) : t26 = $[48];
6186
6187
  let t27;
6187
- $[47] !== fontSize2 || $[48] !== text ? (t27 = /* @__PURE__ */ jsx(Box, { flex: 1, children: /* @__PURE__ */ jsx(Text, { size: fontSize2, textOverflow: "ellipsis", weight: "medium", children: text }) }), $[47] = fontSize2, $[48] = text, $[49] = t27) : t27 = $[49];
6188
+ $[49] !== fontSize2 || $[50] !== text ? (t27 = /* @__PURE__ */ jsx(Box, { flex: 1, children: /* @__PURE__ */ jsx(Text, { size: fontSize2, textOverflow: "ellipsis", weight: "medium", children: text }) }), $[49] = fontSize2, $[50] = text, $[51] = t27) : t27 = $[51];
6188
6189
  let t28;
6189
- $[50] === Symbol.for("react.memo_cache_sentinel") ? (t28 = /* @__PURE__ */ jsx(ChevronRightIcon, {}), $[50] = t28) : t28 = $[50];
6190
+ $[52] === Symbol.for("react.memo_cache_sentinel") ? (t28 = /* @__PURE__ */ jsx(ChevronRightIcon, {}), $[52] = t28) : t28 = $[52];
6190
6191
  let t29;
6191
- $[51] !== fontSize2 ? (t29 = /* @__PURE__ */ jsx(Text, { size: fontSize2, children: t28 }), $[51] = fontSize2, $[52] = t29) : t29 = $[52];
6192
+ $[53] !== fontSize2 ? (t29 = /* @__PURE__ */ jsx(Text, { size: fontSize2, children: t28 }), $[53] = fontSize2, $[54] = t29) : t29 = $[54];
6192
6193
  let t30;
6193
- $[53] !== padding || $[54] !== space || $[55] !== t26 || $[56] !== t27 || $[57] !== t29 ? (t30 = /* @__PURE__ */ jsxs(Flex, { gap: space, padding, children: [
6194
+ $[55] !== padding || $[56] !== space || $[57] !== t26 || $[58] !== t27 || $[59] !== t29 ? (t30 = /* @__PURE__ */ jsxs(Flex, { gap: space, padding, children: [
6194
6195
  t26,
6195
6196
  t27,
6196
6197
  t29
6197
- ] }), $[53] = padding, $[54] = space, $[55] = t26, $[56] = t27, $[57] = t29, $[58] = t30) : t30 = $[58];
6198
+ ] }), $[55] = padding, $[56] = space, $[57] = t26, $[58] = t27, $[59] = t29, $[60] = t30) : t30 = $[60];
6198
6199
  let t31;
6199
- $[59] !== as || $[60] !== handleClick || $[61] !== handleMouseEnter || $[62] !== restProps || $[63] !== scheme || $[64] !== t21 || $[65] !== t22 || $[66] !== t23 || $[67] !== t24 || $[68] !== t25 || $[69] !== t30 || $[70] !== tone ? (t31 = /* @__PURE__ */ jsx(Selectable, { "data-as": as, "data-ui": "MenuGroup", forwardedAs: as, ...restProps, "aria-pressed": t21, "data-pressed": t22, "data-selected": t23, $radius: t24, $tone: tone, $scheme: scheme, onClick: handleClick, onKeyDown: handleKeyDown, onMouseEnter: handleMouseEnter, ref: setRootElement, tabIndex: -1, type: t25, children: t30 }), $[59] = as, $[60] = handleClick, $[61] = handleMouseEnter, $[62] = restProps, $[63] = scheme, $[64] = t21, $[65] = t22, $[66] = t23, $[67] = t24, $[68] = t25, $[69] = t30, $[70] = tone, $[71] = t31) : t31 = $[71];
6200
+ $[61] !== as || $[62] !== handleClick || $[63] !== handleMouseEnter || $[64] !== restProps || $[65] !== scheme || $[66] !== t21 || $[67] !== t22 || $[68] !== t23 || $[69] !== t24 || $[70] !== t25 || $[71] !== t30 || $[72] !== tone ? (t31 = /* @__PURE__ */ jsx(Selectable, { "data-as": as, "data-ui": "MenuGroup", forwardedAs: as, ...restProps, "aria-pressed": t21, "data-pressed": t22, "data-selected": t23, $radius: t24, $tone: tone, $scheme: scheme, onClick: handleClick, onKeyDown: handleKeyDown, onMouseEnter: handleMouseEnter, ref: setRootElement, tabIndex: -1, type: t25, children: t30 }), $[61] = as, $[62] = handleClick, $[63] = handleMouseEnter, $[64] = restProps, $[65] = scheme, $[66] = t21, $[67] = t22, $[68] = t23, $[69] = t24, $[70] = t25, $[71] = t30, $[72] = tone, $[73] = t31) : t31 = $[73];
6200
6201
  let t32;
6201
- return $[72] !== childMenu || $[73] !== open || $[74] !== popover || $[75] !== t31 ? (t32 = /* @__PURE__ */ jsx(Popover, { ...popover, content: childMenu, "data-ui": "MenuGroup__popover", open, children: t31 }), $[72] = childMenu, $[73] = open, $[74] = popover, $[75] = t31, $[76] = t32) : t32 = $[76], t32;
6202
+ return $[74] !== childMenu || $[75] !== open || $[76] !== popover || $[77] !== t31 ? (t32 = /* @__PURE__ */ jsx(Popover, { ...popover, content: childMenu, "data-ui": "MenuGroup__popover", open, children: t31 }), $[74] = childMenu, $[75] = open, $[76] = popover, $[77] = t31, $[78] = t32) : t32 = $[78], t32;
6202
6203
  }
6203
6204
  MenuGroup.displayName = "MenuGroup";
6204
6205
  const MenuItem = forwardRef(function(props, forwardedRef) {