@sanity/ui 3.0.0-static.4 → 3.0.0-static.6

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 (51) hide show
  1. package/dist/_chunks-cjs/_visual-editing.js +81 -31
  2. package/dist/_chunks-cjs/_visual-editing.js.map +1 -1
  3. package/dist/_chunks-es/_visual-editing.mjs +82 -32
  4. package/dist/_chunks-es/_visual-editing.mjs.map +1 -1
  5. package/dist/_visual-editing.d.mts +14 -11
  6. package/dist/_visual-editing.d.ts +14 -11
  7. package/dist/cli.js +1 -1
  8. package/dist/css.d.mts +144 -852
  9. package/dist/css.d.ts +144 -852
  10. package/dist/css.js +155 -141
  11. package/dist/css.js.map +1 -1
  12. package/dist/css.mjs +154 -141
  13. package/dist/css.mjs.map +1 -1
  14. package/dist/index.d.mts +14 -11
  15. package/dist/index.d.ts +14 -11
  16. package/dist/index.js +2 -4
  17. package/dist/index.js.map +1 -1
  18. package/dist/index.mjs +4 -6
  19. package/dist/index.mjs.map +1 -1
  20. package/dist/sanity-theme.css +1 -1
  21. package/dist/system.css +54 -49
  22. package/dist/theme.js +271 -33
  23. package/dist/theme.js.map +1 -1
  24. package/dist/theme.mjs +252 -16
  25. package/dist/theme.mjs.map +1 -1
  26. package/package.json +2 -2
  27. package/src/css/aspects/flex/flexJustify.style.ts +3 -3
  28. package/src/css/aspects/grid/types.ts +2 -2
  29. package/src/css/index.ts +2 -2
  30. package/src/css/primitives/_input/__workshop__/index.ts +1 -1
  31. package/src/css/primitives/button/button.style.ts +6 -4
  32. package/src/css/primitives/stack/index.ts +1 -0
  33. package/src/css/primitives/stack/stack.style.ts +9 -0
  34. package/src/css/primitives/stack/stack.ts +6 -0
  35. package/src/css/system.style.ts +2 -0
  36. package/src/theme/v3/defaults.ts +1 -1
  37. package/src/ui/components/autocomplete/__workshop__/index.ts +1 -1
  38. package/src/ui/components/dialog/dialog.tsx +3 -4
  39. package/src/ui/constants.ts +6 -0
  40. package/src/ui/hooks/useMediaIndex/useMediaIndex.ts +0 -2
  41. package/src/ui/primitives/box/box.tsx +6 -0
  42. package/src/ui/primitives/button/button.tsx +11 -10
  43. package/src/ui/primitives/code/code.tsx +1 -1
  44. package/src/ui/primitives/popover/popover.tsx +5 -75
  45. package/src/ui/primitives/stack/stack.tsx +10 -5
  46. package/src/ui/primitives/textInput/textInput.tsx +1 -1
  47. package/src/ui/primitives/tooltip/tooltip.tsx +2 -3
  48. package/dist/_chunks-cjs/v3_v2.js +0 -251
  49. package/dist/_chunks-cjs/v3_v2.js.map +0 -1
  50. package/dist/_chunks-es/v3_v2.mjs +0 -252
  51. package/dist/_chunks-es/v3_v2.mjs.map +0 -1
@@ -3,7 +3,7 @@ import { c } from "react-compiler-runtime";
3
3
  import { getScopedTheme, getTheme_v2, createColorTheme as createColorTheme$1, hexToRgb as hexToRgb$1, hslToRgb as hslToRgb$1, multiply as multiply$1, parseColor as parseColor$1, rgbToHex as rgbToHex$1, rgbToHsl as rgbToHsl$1, rgba as rgba$1, screen as screen$1, buildTheme } from "@sanity/ui/theme";
4
4
  import { createContext, useContext, useState, useEffect, useDebugValue, useSyncExternalStore, forwardRef, Children, isValidElement, cloneElement, createElement, useRef, useImperativeHandle, lazy, Suspense, memo, useMemo, useCallback, useId, useLayoutEffect } from "react";
5
5
  import { ThemeProvider as ThemeProvider$1, useTheme as useTheme$1 } from "styled-components";
6
- import { composeClassNames, box, label, textOverflow, avatar, avatarArrow, avatarInitials, avatarImage, avatarCounter, avatarStack, text, badge, animatedSpinnerIcon, spinner, buttonLoadingBox, button, _selectable, card, checkbox, checkboxInput, code, container, heading, kbd, _arrow, _arrowStroke, _arrowShape, srOnly, radio, select, _inputElement, selectPresentation, _switch, _switchElement, _switchPresentation, _switchTrack, _switchThumb, textArea, _inputPresentation, textInput, tooltipCard, tooltip, menu, menuDivider } from "@sanity/ui/css";
6
+ import { composeClassNames, box, label, textOverflow, avatar, avatarArrow, avatarInitials, avatarImage, avatarCounter, avatarStack, text, badge, animatedSpinnerIcon, spinner, buttonLoadingBox, button, _selectable, card, checkbox, checkboxInput, code, container, heading, kbd, _arrow, _arrowStroke, _arrowShape, srOnly, radio, select, _inputElement, selectPresentation, stack, _switch, _switchElement, _switchPresentation, _switchTrack, _switchThumb, textArea, _inputPresentation, textInput, tooltipCard, tooltip, menu, menuDivider } from "@sanity/ui/css";
7
7
  import ReactIs, { isValidElementType } from "react-is";
8
8
  import { SpinnerIcon, CheckmarkIcon, RemoveIcon, ChevronDownIcon, CloseIcon, ChevronRightIcon } from "@sanity/icons";
9
9
  import { detectOverflow, flip, offset, shift, arrow, hide, useFloating, autoUpdate } from "@floating-ui/react-dom";
@@ -142,6 +142,10 @@ const createColorTheme = createColorTheme$1, hexToRgb = hexToRgb$1, hslToRgb = h
142
142
  visualDuration: 0.2,
143
143
  bounce: 0.25
144
144
  }
145
+ }, Z_OFFSETS = {
146
+ dialog: 600,
147
+ popover: 400,
148
+ tooltip: 200
145
149
  };
146
150
  function _isEnterToClickElement(element) {
147
151
  return isHTMLAnchorElement(element) || isHTMLButtonElement(element);
@@ -365,11 +369,14 @@ function _temp$6() {
365
369
  return !1;
366
370
  }
367
371
  const Box = forwardRef(function(props, ref) {
368
- const $ = c(112);
369
- let align, border, borderBottom, borderLeft, borderRight, borderTop, className, column, columnEnd, columnStart, columns, direction, flex, gap, gapX, gapY, height, inset, insetBottom, insetLeft, insetRight, insetTop, justify, marginBottom, marginLeft, marginRight, marginTop, marginX, marginY, maxWidth, muted, overflow, paddingBottom, paddingLeft, paddingRight, paddingTop, paddingX, paddingY, pointerEvents, position, radius, restProps, row, rowEnd, rowStart, rows, t0, t1, t2, t3, t4, width, wrap;
372
+ const $ = c(118);
373
+ let align, autoCols, autoFlow, autoRows, border, borderBottom, borderLeft, borderRight, borderTop, className, column, columnEnd, columnStart, columns, direction, flex, gap, gapX, gapY, height, inset, insetBottom, insetLeft, insetRight, insetTop, justify, marginBottom, marginLeft, marginRight, marginTop, marginX, marginY, maxWidth, muted, overflow, paddingBottom, paddingLeft, paddingRight, paddingTop, paddingX, paddingY, pointerEvents, position, radius, restProps, row, rowEnd, rowStart, rows, t0, t1, t2, t3, t4, width, wrap;
370
374
  $[0] !== props ? ({
371
375
  align,
372
376
  as: t0,
377
+ autoCols,
378
+ autoFlow,
379
+ autoRows,
373
380
  border,
374
381
  borderTop,
375
382
  borderRight,
@@ -421,11 +428,14 @@ const Box = forwardRef(function(props, ref) {
421
428
  width,
422
429
  wrap,
423
430
  ...restProps
424
- } = props, $[0] = props, $[1] = align, $[2] = border, $[3] = borderBottom, $[4] = borderLeft, $[5] = borderRight, $[6] = borderTop, $[7] = className, $[8] = column, $[9] = columnEnd, $[10] = columnStart, $[11] = columns, $[12] = direction, $[13] = flex, $[14] = gap, $[15] = gapX, $[16] = gapY, $[17] = height, $[18] = inset, $[19] = insetBottom, $[20] = insetLeft, $[21] = insetRight, $[22] = insetTop, $[23] = justify, $[24] = marginBottom, $[25] = marginLeft, $[26] = marginRight, $[27] = marginTop, $[28] = marginX, $[29] = marginY, $[30] = maxWidth, $[31] = muted, $[32] = overflow, $[33] = paddingBottom, $[34] = paddingLeft, $[35] = paddingRight, $[36] = paddingTop, $[37] = paddingX, $[38] = paddingY, $[39] = pointerEvents, $[40] = position, $[41] = radius, $[42] = restProps, $[43] = row, $[44] = rowEnd, $[45] = rowStart, $[46] = rows, $[47] = t0, $[48] = t1, $[49] = t2, $[50] = t3, $[51] = t4, $[52] = width, $[53] = wrap) : (align = $[1], border = $[2], borderBottom = $[3], borderLeft = $[4], borderRight = $[5], borderTop = $[6], className = $[7], column = $[8], columnEnd = $[9], columnStart = $[10], columns = $[11], direction = $[12], flex = $[13], gap = $[14], gapX = $[15], gapY = $[16], height = $[17], inset = $[18], insetBottom = $[19], insetLeft = $[20], insetRight = $[21], insetTop = $[22], justify = $[23], marginBottom = $[24], marginLeft = $[25], marginRight = $[26], marginTop = $[27], marginX = $[28], marginY = $[29], maxWidth = $[30], muted = $[31], overflow = $[32], paddingBottom = $[33], paddingLeft = $[34], paddingRight = $[35], paddingTop = $[36], paddingX = $[37], paddingY = $[38], pointerEvents = $[39], position = $[40], radius = $[41], restProps = $[42], row = $[43], rowEnd = $[44], rowStart = $[45], rows = $[46], t0 = $[47], t1 = $[48], t2 = $[49], t3 = $[50], t4 = $[51], width = $[52], wrap = $[53]);
431
+ } = props, $[0] = props, $[1] = align, $[2] = autoCols, $[3] = autoFlow, $[4] = autoRows, $[5] = border, $[6] = borderBottom, $[7] = borderLeft, $[8] = borderRight, $[9] = borderTop, $[10] = className, $[11] = column, $[12] = columnEnd, $[13] = columnStart, $[14] = columns, $[15] = direction, $[16] = flex, $[17] = gap, $[18] = gapX, $[19] = gapY, $[20] = height, $[21] = inset, $[22] = insetBottom, $[23] = insetLeft, $[24] = insetRight, $[25] = insetTop, $[26] = justify, $[27] = marginBottom, $[28] = marginLeft, $[29] = marginRight, $[30] = marginTop, $[31] = marginX, $[32] = marginY, $[33] = maxWidth, $[34] = muted, $[35] = overflow, $[36] = paddingBottom, $[37] = paddingLeft, $[38] = paddingRight, $[39] = paddingTop, $[40] = paddingX, $[41] = paddingY, $[42] = pointerEvents, $[43] = position, $[44] = radius, $[45] = restProps, $[46] = row, $[47] = rowEnd, $[48] = rowStart, $[49] = rows, $[50] = t0, $[51] = t1, $[52] = t2, $[53] = t3, $[54] = t4, $[55] = width, $[56] = wrap) : (align = $[1], autoCols = $[2], autoFlow = $[3], autoRows = $[4], border = $[5], borderBottom = $[6], borderLeft = $[7], borderRight = $[8], borderTop = $[9], className = $[10], column = $[11], columnEnd = $[12], columnStart = $[13], columns = $[14], direction = $[15], flex = $[16], gap = $[17], gapX = $[18], gapY = $[19], height = $[20], inset = $[21], insetBottom = $[22], insetLeft = $[23], insetRight = $[24], insetTop = $[25], justify = $[26], marginBottom = $[27], marginLeft = $[28], marginRight = $[29], marginTop = $[30], marginX = $[31], marginY = $[32], maxWidth = $[33], muted = $[34], overflow = $[35], paddingBottom = $[36], paddingLeft = $[37], paddingRight = $[38], paddingTop = $[39], paddingX = $[40], paddingY = $[41], pointerEvents = $[42], position = $[43], radius = $[44], restProps = $[45], row = $[46], rowEnd = $[47], rowStart = $[48], rows = $[49], t0 = $[50], t1 = $[51], t2 = $[52], t3 = $[53], t4 = $[54], width = $[55], wrap = $[56]);
425
432
  const As = t0 === void 0 ? "div" : t0, display = t1 === void 0 ? "block" : t1, margin = t2 === void 0 ? 0 : t2, padding = t3 === void 0 ? 0 : t3, sizing = t4 === void 0 ? "border" : t4;
426
433
  let t5;
427
- $[54] !== align || $[55] !== border || $[56] !== borderBottom || $[57] !== borderLeft || $[58] !== borderRight || $[59] !== borderTop || $[60] !== className || $[61] !== column || $[62] !== columnEnd || $[63] !== columnStart || $[64] !== columns || $[65] !== direction || $[66] !== display || $[67] !== flex || $[68] !== gap || $[69] !== gapX || $[70] !== gapY || $[71] !== height || $[72] !== inset || $[73] !== insetBottom || $[74] !== insetLeft || $[75] !== insetRight || $[76] !== insetTop || $[77] !== justify || $[78] !== margin || $[79] !== marginBottom || $[80] !== marginLeft || $[81] !== marginRight || $[82] !== marginTop || $[83] !== marginX || $[84] !== marginY || $[85] !== maxWidth || $[86] !== muted || $[87] !== overflow || $[88] !== padding || $[89] !== paddingBottom || $[90] !== paddingLeft || $[91] !== paddingRight || $[92] !== paddingTop || $[93] !== paddingX || $[94] !== paddingY || $[95] !== pointerEvents || $[96] !== position || $[97] !== radius || $[98] !== row || $[99] !== rowEnd || $[100] !== rowStart || $[101] !== rows || $[102] !== sizing || $[103] !== width || $[104] !== wrap ? (t5 = composeClassNames(className, box({
434
+ $[57] !== align || $[58] !== autoCols || $[59] !== autoFlow || $[60] !== autoRows || $[61] !== border || $[62] !== borderBottom || $[63] !== borderLeft || $[64] !== borderRight || $[65] !== borderTop || $[66] !== className || $[67] !== column || $[68] !== columnEnd || $[69] !== columnStart || $[70] !== columns || $[71] !== direction || $[72] !== display || $[73] !== flex || $[74] !== gap || $[75] !== gapX || $[76] !== gapY || $[77] !== height || $[78] !== inset || $[79] !== insetBottom || $[80] !== insetLeft || $[81] !== insetRight || $[82] !== insetTop || $[83] !== justify || $[84] !== margin || $[85] !== marginBottom || $[86] !== marginLeft || $[87] !== marginRight || $[88] !== marginTop || $[89] !== marginX || $[90] !== marginY || $[91] !== maxWidth || $[92] !== muted || $[93] !== overflow || $[94] !== padding || $[95] !== paddingBottom || $[96] !== paddingLeft || $[97] !== paddingRight || $[98] !== paddingTop || $[99] !== paddingX || $[100] !== paddingY || $[101] !== pointerEvents || $[102] !== position || $[103] !== radius || $[104] !== row || $[105] !== rowEnd || $[106] !== rowStart || $[107] !== rows || $[108] !== sizing || $[109] !== width || $[110] !== wrap ? (t5 = composeClassNames(className, box({
428
435
  align,
436
+ autoCols,
437
+ autoFlow,
438
+ autoRows,
429
439
  border,
430
440
  borderTop,
431
441
  borderRight,
@@ -475,9 +485,9 @@ const Box = forwardRef(function(props, ref) {
475
485
  sizing,
476
486
  width,
477
487
  wrap
478
- })), $[54] = align, $[55] = border, $[56] = borderBottom, $[57] = borderLeft, $[58] = borderRight, $[59] = borderTop, $[60] = className, $[61] = column, $[62] = columnEnd, $[63] = columnStart, $[64] = columns, $[65] = direction, $[66] = display, $[67] = flex, $[68] = gap, $[69] = gapX, $[70] = gapY, $[71] = height, $[72] = inset, $[73] = insetBottom, $[74] = insetLeft, $[75] = insetRight, $[76] = insetTop, $[77] = justify, $[78] = margin, $[79] = marginBottom, $[80] = marginLeft, $[81] = marginRight, $[82] = marginTop, $[83] = marginX, $[84] = marginY, $[85] = maxWidth, $[86] = muted, $[87] = overflow, $[88] = padding, $[89] = paddingBottom, $[90] = paddingLeft, $[91] = paddingRight, $[92] = paddingTop, $[93] = paddingX, $[94] = paddingY, $[95] = pointerEvents, $[96] = position, $[97] = radius, $[98] = row, $[99] = rowEnd, $[100] = rowStart, $[101] = rows, $[102] = sizing, $[103] = width, $[104] = wrap, $[105] = t5) : t5 = $[105];
488
+ })), $[57] = align, $[58] = autoCols, $[59] = autoFlow, $[60] = autoRows, $[61] = border, $[62] = borderBottom, $[63] = borderLeft, $[64] = borderRight, $[65] = borderTop, $[66] = className, $[67] = column, $[68] = columnEnd, $[69] = columnStart, $[70] = columns, $[71] = direction, $[72] = display, $[73] = flex, $[74] = gap, $[75] = gapX, $[76] = gapY, $[77] = height, $[78] = inset, $[79] = insetBottom, $[80] = insetLeft, $[81] = insetRight, $[82] = insetTop, $[83] = justify, $[84] = margin, $[85] = marginBottom, $[86] = marginLeft, $[87] = marginRight, $[88] = marginTop, $[89] = marginX, $[90] = marginY, $[91] = maxWidth, $[92] = muted, $[93] = overflow, $[94] = padding, $[95] = paddingBottom, $[96] = paddingLeft, $[97] = paddingRight, $[98] = paddingTop, $[99] = paddingX, $[100] = paddingY, $[101] = pointerEvents, $[102] = position, $[103] = radius, $[104] = row, $[105] = rowEnd, $[106] = rowStart, $[107] = rows, $[108] = sizing, $[109] = width, $[110] = wrap, $[111] = t5) : t5 = $[111];
479
489
  let t6;
480
- return $[106] !== As || $[107] !== props.children || $[108] !== ref || $[109] !== restProps || $[110] !== t5 ? (t6 = /* @__PURE__ */ jsx(As, { "data-ui": "Box", ...restProps, className: t5, ref, children: props.children }), $[106] = As, $[107] = props.children, $[108] = ref, $[109] = restProps, $[110] = t5, $[111] = t6) : t6 = $[111], t6;
490
+ return $[112] !== As || $[113] !== props.children || $[114] !== ref || $[115] !== restProps || $[116] !== t5 ? (t6 = /* @__PURE__ */ jsx(As, { "data-ui": "Box", ...restProps, className: t5, ref, children: props.children }), $[112] = As, $[113] = props.children, $[114] = ref, $[115] = restProps, $[116] = t5, $[117] = t6) : t6 = $[117], t6;
481
491
  });
482
492
  Box.displayName = "ForwardRef(Box)";
483
493
  const Label = forwardRef(function(props, ref) {
@@ -780,19 +790,56 @@ const Button = forwardRef(function(props, ref) {
780
790
  tone,
781
791
  width
782
792
  })), "data-disabled": loading || disabled ? "" : void 0, "data-selected": selected ? "" : void 0, disabled: !!(loading || disabled), href: disabled ? void 0 : href, ref, type, children: [
783
- !!loading && /* @__PURE__ */ jsx(Box, { as: "span", className: buttonLoadingBox(), display: "flex", flex: 1, justify, width: "fill", children: /* @__PURE__ */ jsx(Spinner, { size: fontSize }) }),
784
- (IconComponent || text2 || IconRightComponent) && /* @__PURE__ */ jsxs(Box, { as: "span", align, direction, display: "flex", flex: 1, gap, gapX, gapY, justify, padding, paddingX, paddingY, paddingTop, paddingBottom, paddingLeft, paddingRight, width: "fill", wrap, children: [
785
- IconComponent && /* @__PURE__ */ jsxs(Text, { as: "span", flex: "none", muted: !0, size: fontSize, children: [
786
- isValidElement(IconComponent) && IconComponent,
787
- isValidElementType(IconComponent) && /* @__PURE__ */ jsx(IconComponent, {})
788
- ] }),
789
- text2 && /* @__PURE__ */ jsx(Text, { align: textAlign, as: "span", flex: "none", muted, size: fontSize, textOverflow: textOverflow2, weight: textWeight, children: text2 }),
790
- IconRightComponent && /* @__PURE__ */ jsxs(Text, { as: "span", flex: "none", muted: !0, size: fontSize, children: [
791
- isValidElement(IconRightComponent) && IconRightComponent,
792
- isValidElementType(IconRightComponent) && /* @__PURE__ */ jsx(IconRightComponent, {})
793
- ] })
794
- ] }),
795
- children && /* @__PURE__ */ jsx(Box, { align, as: "span", direction, display: "flex", flex: 1, gap, gapX, gapY, justify, padding, paddingX, paddingY, paddingTop, paddingBottom, paddingLeft, paddingRight, width: "fill", wrap, children })
793
+ !!loading && /* @__PURE__ */ jsx(Box, { align: "center", as: "span", className: buttonLoadingBox(), display: "flex", flex: 1, justify: "center", width: "fill", children: /* @__PURE__ */ jsx(Spinner, { size: fontSize }) }),
794
+ (IconComponent || text2 || IconRightComponent) && /* @__PURE__ */ jsxs(
795
+ Box,
796
+ {
797
+ as: "span",
798
+ direction,
799
+ display: "flex",
800
+ flex: 1,
801
+ gap,
802
+ gapX,
803
+ gapY,
804
+ justify,
805
+ padding,
806
+ paddingX,
807
+ paddingY,
808
+ paddingTop,
809
+ paddingBottom,
810
+ paddingLeft,
811
+ paddingRight,
812
+ children: [
813
+ IconComponent && /* @__PURE__ */ jsxs(Text, { as: "span", flex: "none", muted: !0, size: fontSize, children: [
814
+ isValidElement(IconComponent) && IconComponent,
815
+ isValidElementType(IconComponent) && /* @__PURE__ */ jsx(IconComponent, {})
816
+ ] }),
817
+ text2 && /* @__PURE__ */ jsx(Text, { align: textAlign, as: "span", flex: "none", muted, size: fontSize, textOverflow: textOverflow2, weight: textWeight, children: text2 }),
818
+ IconRightComponent && /* @__PURE__ */ jsxs(Text, { as: "span", flex: "none", muted: !0, size: fontSize, children: [
819
+ isValidElement(IconRightComponent) && IconRightComponent,
820
+ isValidElementType(IconRightComponent) && /* @__PURE__ */ jsx(IconRightComponent, {})
821
+ ] })
822
+ ]
823
+ }
824
+ ),
825
+ children && /* @__PURE__ */ jsx(
826
+ Box,
827
+ {
828
+ as: "span",
829
+ flex: 1,
830
+ gap,
831
+ gapX,
832
+ gapY,
833
+ padding,
834
+ paddingX,
835
+ paddingY,
836
+ paddingTop,
837
+ paddingBottom,
838
+ paddingLeft,
839
+ paddingRight,
840
+ children
841
+ }
842
+ )
796
843
  ] });
797
844
  });
798
845
  Button.displayName = "ForwardRef(Button)";
@@ -907,7 +954,7 @@ const LazyRefractor = lazy(() => import("./refractor.mjs")), Code = forwardRef(f
907
954
  weight,
908
955
  ...restProps
909
956
  } = props, $[0] = props, $[1] = children, $[2] = className, $[3] = languageProp, $[4] = restProps, $[5] = t0, $[6] = t1, $[7] = weight) : (children = $[1], className = $[2], languageProp = $[3], restProps = $[4], t0 = $[5], t1 = $[6], weight = $[7]);
910
- const As = t0 === void 0 ? "pre" : t0, size2 = t1 === void 0 ? 1 : t1, language = typeof languageProp == "string" ? languageProp : void 0;
957
+ const As = t0 === void 0 ? "pre" : t0, size2 = t1 === void 0 ? 2 : t1, language = typeof languageProp == "string" ? languageProp : void 0;
911
958
  let t2;
912
959
  $[8] !== className || $[9] !== size2 || $[10] !== weight ? (t2 = composeClassNames(className, code({
913
960
  size: size2,
@@ -1743,6 +1790,7 @@ const ViewportOverlay = () => {
1743
1790
  __unstable_margins: margins = DEFAULT_POPOVER_MARGINS,
1744
1791
  animate: _animate = !1,
1745
1792
  arrow: arrowProp = !1,
1793
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
1746
1794
  boundaryElement = boundaryElementContext.element,
1747
1795
  children: childProp,
1748
1796
  constrainSize = !1,
@@ -1768,7 +1816,7 @@ const ViewportOverlay = () => {
1768
1816
  tone = "inherit",
1769
1817
  width: widthProp = "auto",
1770
1818
  // zOffset: zOffsetProp = layer.popover.zOffset,
1771
- zOffset: zOffsetProp,
1819
+ zOffset: zOffsetProp = Z_OFFSETS.popover,
1772
1820
  updateRef,
1773
1821
  ...restProps
1774
1822
  } = props, animate = usePrefersReducedMotion() ? !1 : _animate, zOffset = useArrayProp(zOffsetProp), ref = useRef(null), arrowRef = useRef(null), rootBoundary = "viewport";
@@ -1955,17 +2003,20 @@ const Select = forwardRef(function(props, forwardedRef) {
1955
2003
  });
1956
2004
  Select.displayName = "ForwardRef(Select)";
1957
2005
  const Stack = forwardRef(function(props, ref) {
1958
- const $ = c(10);
1959
- let as, gap, restProps, space;
2006
+ const $ = c(14);
2007
+ let as, className, gap, restProps, space;
1960
2008
  $[0] !== props ? ({
1961
2009
  as,
2010
+ className,
1962
2011
  gap,
1963
2012
  space,
1964
2013
  ...restProps
1965
- } = props, $[0] = props, $[1] = as, $[2] = gap, $[3] = restProps, $[4] = space) : (as = $[1], gap = $[2], restProps = $[3], space = $[4]);
1966
- const t0 = gap ?? space;
1967
- let t1;
1968
- return $[5] !== as || $[6] !== ref || $[7] !== restProps || $[8] !== t0 ? (t1 = /* @__PURE__ */ jsx(Box, { "data-ui": "Stack", ...restProps, as, direction: "column", display: "flex", gap: t0, ref }), $[5] = as, $[6] = ref, $[7] = restProps, $[8] = t0, $[9] = t1) : t1 = $[9], t1;
2014
+ } = props, $[0] = props, $[1] = as, $[2] = className, $[3] = gap, $[4] = restProps, $[5] = space) : (as = $[1], className = $[2], gap = $[3], restProps = $[4], space = $[5]);
2015
+ let t0;
2016
+ $[6] !== className ? (t0 = composeClassNames(className, stack()), $[6] = className, $[7] = t0) : t0 = $[7];
2017
+ const t1 = gap ?? space;
2018
+ let t2;
2019
+ return $[8] !== as || $[9] !== ref || $[10] !== restProps || $[11] !== t0 || $[12] !== t1 ? (t2 = /* @__PURE__ */ jsx(Box, { "data-ui": "Stack", ...restProps, as, autoRows: "min", className: t0, display: "grid", gap: t1, ref }), $[8] = as, $[9] = ref, $[10] = restProps, $[11] = t0, $[12] = t1, $[13] = t2) : t2 = $[13], t2;
1969
2020
  });
1970
2021
  Stack.displayName = "ForwardRef(Stack)";
1971
2022
  const Switch = forwardRef(function(props, forwardedRef) {
@@ -2081,7 +2132,7 @@ const CLEAR_BUTTON_BOX_STYLE = {
2081
2132
  __unstable_disableFocusRing = t72, t0 = t82, className = t92, clearButton = t102, t1 = t112, t2 = t122, gap = t132, IconComponent = t142, IconRightComponent = t152, onClear = t162, t3 = t172, prefix = t182, t4 = t192, readOnly = t202, t5 = t212, suffix = t222, customValidity = t232, t6 = t242, width = t252, restProps = t262, $[0] = props, $[1] = IconComponent, $[2] = IconRightComponent, $[3] = __unstable_disableFocusRing, $[4] = className, $[5] = clearButton, $[6] = customValidity, $[7] = gap, $[8] = onClear, $[9] = prefix, $[10] = readOnly, $[11] = restProps, $[12] = suffix, $[13] = t0, $[14] = t1, $[15] = t2, $[16] = t3, $[17] = t4, $[18] = t5, $[19] = t6, $[20] = width;
2082
2133
  } else
2083
2134
  IconComponent = $[1], IconRightComponent = $[2], __unstable_disableFocusRing = $[3], className = $[4], clearButton = $[5], customValidity = $[6], gap = $[7], onClear = $[8], prefix = $[9], readOnly = $[10], restProps = $[11], suffix = $[12], t0 = $[13], t1 = $[14], t2 = $[15], t3 = $[16], t4 = $[17], t5 = $[18], t6 = $[19], width = $[20];
2084
- const border = t0 === void 0 ? !0 : t0, disabled = t1 === void 0 ? !1 : t1, fontSize = t2 === void 0 ? 1 : t2, padding = t3 === void 0 ? 3 : t3, radius = t4 === void 0 ? 2 : t4, space = t5 === void 0 ? 3 : t5, type = t6 === void 0 ? "text" : t6, ref = useRef(null), paddingArray = useArrayProp(padding), withClearButton = !!clearButton;
2135
+ const border = t0 === void 0 ? !0 : t0, disabled = t1 === void 0 ? !1 : t1, fontSize = t2 === void 0 ? 2 : t2, padding = t3 === void 0 ? 3 : t3, radius = t4 === void 0 ? 2 : t4, space = t5 === void 0 ? 3 : t5, type = t6 === void 0 ? "text" : t6, ref = useRef(null), paddingArray = useArrayProp(padding), withClearButton = !!clearButton;
2085
2136
  let t7;
2086
2137
  $[21] === Symbol.for("react.memo_cache_sentinel") ? (t7 = () => ref.current, $[21] = t7) : t7 = $[21], useImperativeHandle(forwardedRef, t7), useCustomValidity(ref, customValidity);
2087
2138
  const handleClearMouseDown = _temp;
@@ -2282,8 +2333,6 @@ function useTooltipDelayGroup() {
2282
2333
  }
2283
2334
  const Tooltip = forwardRef(function(props, forwardedRef) {
2284
2335
  const boundaryElementContext = useBoundaryElement(), {
2285
- layer
2286
- } = useTheme_v2(), {
2287
2336
  animate: _animate = !1,
2288
2337
  arrow: arrowProp = !1,
2289
2338
  boundaryElement = boundaryElementContext?.element,
@@ -2299,7 +2348,7 @@ const Tooltip = forwardRef(function(props, forwardedRef) {
2299
2348
  radius = 3,
2300
2349
  scheme,
2301
2350
  shadow = 2,
2302
- zOffset = layer.tooltip.zOffset,
2351
+ zOffset = Z_OFFSETS.tooltip,
2303
2352
  tone,
2304
2353
  ...restProps
2305
2354
  } = props, animate = usePrefersReducedMotion() ? !1 : _animate, fallbackPlacements = useArrayProp(fallbackPlacementsProp), ref = useRef(null), [referenceElement, setReferenceElement] = useState(null), arrowRef = useRef(null), rootBoundary = "viewport", [tooltipMaxWidth, setTooltipMaxWidth] = useState(0);
@@ -3050,6 +3099,7 @@ export {
3050
3099
  TooltipDelayGroupContext,
3051
3100
  TooltipDelayGroupProvider,
3052
3101
  VirtualList,
3102
+ Z_OFFSETS,
3053
3103
  _ResizeObserver,
3054
3104
  _elementSizeObserver,
3055
3105
  _getArrayProp,