@sanity/ui 1.0.11 → 1.0.13

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 (6) hide show
  1. package/dist/index.cjs.mjs +2 -0
  2. package/dist/index.esm.js +856 -835
  3. package/dist/index.esm.js.map +1 -1
  4. package/dist/index.js +856 -835
  5. package/dist/index.js.map +1 -1
  6. package/package.json +19 -19
package/dist/index.js CHANGED
@@ -1,65 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38, _templateObject39, _templateObject40, _templateObject41, _templateObject42, _templateObject43, _templateObject44, _templateObject45, _templateObject46, _templateObject47, _templateObject48, _templateObject49, _templateObject50, _templateObject51, _templateObject52, _templateObject53, _templateObject54, _templateObject55, _templateObject56, _templateObject57, _templateObject58, _templateObject59, _templateObject60, _templateObject61, _templateObject62, _templateObject63, _templateObject64, _templateObject65, _templateObject66, _templateObject67, _templateObject68, _templateObject69, _templateObject70, _templateObject71, _templateObject72, _templateObject73, _templateObject74, _templateObject75, _templateObject76, _templateObject77, _templateObject78, _templateObject79, _templateObject80, _templateObject81, _templateObject82, _templateObject83, _templateObject84, _templateObject85, _templateObject86, _templateObject87, _templateObject88, _templateObject89, _templateObject90;
4
- const _excluded = ["color", "layer"],
5
- _excluded2 = ["accent", "align", "children", "muted", "size", "textOverflow", "weight"],
6
- _excluded3 = ["as", "color", "src", "title", "initials", "onImageLoadError", "arrowPosition", "animateArrowFrom", "status", "size"],
7
- _excluded4 = ["children", "maxLength", "size"],
8
- _excluded5 = ["as", "column", "columnStart", "columnEnd", "display", "flex", "height", "margin", "marginX", "marginY", "marginTop", "marginRight", "marginBottom", "marginLeft", "overflow", "padding", "paddingX", "paddingY", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "row", "rowStart", "rowEnd", "sizing"],
9
- _excluded6 = ["accent", "align", "children", "muted", "size", "textOverflow", "weight"],
10
- _excluded7 = ["children", "fontSize", "mode", "padding", "radius", "tone"],
11
- _excluded8 = ["align", "as", "direction", "gap", "justify", "wrap"],
12
- _excluded9 = ["children", "disabled", "fontSize", "icon", "iconRight", "justify", "loading", "mode", "padding", "paddingX", "paddingY", "paddingTop", "paddingBottom", "paddingLeft", "paddingRight", "radius", "selected", "space", "text", "textAlign", "tone", "type"],
13
- _excluded10 = ["__unstable_checkered", "__unstable_focusRing", "as", "border", "borderTop", "borderRight", "borderBottom", "borderLeft", "pressed", "radius", "scheme", "selected", "shadow", "tone"],
14
- _excluded11 = ["checked", "className", "disabled", "indeterminate", "customValidity", "readOnly", "style"],
15
- _excluded12 = ["children", "language", "size", "weight"],
16
- _excluded13 = ["as", "width"],
17
- _excluded14 = ["as", "autoRows", "autoCols", "autoFlow", "columns", "gap", "gapX", "gapY", "rows", "children"],
18
- _excluded15 = ["accent", "align", "children", "muted", "size", "textOverflow", "weight"],
19
- _excluded16 = ["as", "children", "space"],
20
- _excluded17 = ["children", "fontSize", "padding", "radius"],
21
- _excluded18 = ["children", "media"],
22
- _excluded19 = ["children", "style"],
23
- _excluded20 = ["children", "zOffset"],
24
- _excluded21 = ["as", "gap", "getItemKey", "items", "onChange", "renderItem"],
25
- _excluded22 = ["__unstable_margins", "arrow", "arrowRef", "arrowX", "arrowY", "boundaryWidth", "children", "padding", "placement", "overflow", "radius", "scheme", "shadow", "strategy", "style", "tone", "width", "x", "y"],
26
- _excluded23 = ["__unstable_margins", "arrow", "boundaryElement", "children", "constrainSize", "content", "disabled", "fallbackPlacements", "matchReferenceWidth", "open", "overflow", "padding", "placement", "portal", "preventOverflow", "radius", "referenceElement", "scheme", "shadow", "tone", "width", "zOffset"],
27
- _excluded24 = ["className", "disabled", "style", "customValidity", "readOnly"],
28
- _excluded25 = ["children", "customValidity", "disabled", "fontSize", "padding", "radius", "readOnly", "space"],
29
- _excluded26 = ["as", "space"],
30
- _excluded27 = ["checked", "className", "disabled", "indeterminate", "readOnly", "style"],
31
- _excluded28 = ["border", "customValidity", "disabled", "fontSize", "padding", "radius", "weight"],
32
- _excluded29 = ["border", "clearButton", "disabled", "fontSize", "icon", "iconRight", "onClear", "padding", "prefix", "radius", "readOnly", "space", "suffix", "customValidity", "type", "weight"],
33
- _excluded30 = ["boundaryElement", "children", "content", "disabled", "fallbackPlacements", "padding", "placement", "portal", "scheme", "shadow", "zOffset"],
34
- _excluded31 = ["border", "customValidity", "disabled", "filterOption", "fontSize", "icon", "id", "listBox", "loading", "onBlur", "onChange", "onFocus", "onQueryChange", "onSelect", "openButton", "options", "padding", "popover", "prefix", "radius", "readOnly", "relatedElements", "renderOption", "renderPopover", "renderValue", "suffix", "value"],
35
- _excluded32 = ["children", "maxLength", "separator", "space"],
36
- _excluded33 = ["__unstable_autoFocus", "__unstable_hideCloseButton", "cardRadius", "cardShadow", "children", "contentRef", "footer", "header", "id", "onClickOutside", "onClose", "padding", "portal", "position", "scheme", "width", "zOffset"],
37
- _excluded34 = ["fontSize", "keys", "padding", "radius", "space"],
38
- _excluded35 = ["children", "focusFirst", "focusLast", "onClickOutside", "onEscape", "onItemClick", "onItemSelect", "onKeyDown", "originElement", "padding", "registerElement", "shouldFocus", "space"],
39
- _excluded36 = ["as", "children", "fontSize", "icon", "onClick", "padding", "popover", "radius", "space", "text", "tone"],
40
- _excluded37 = ["as", "children", "disabled", "fontSize", "hotkeys", "icon", "iconRight", "onClick", "padding", "paddingX", "paddingY", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "pressed", "radius", "selected", "space", "text", "tone"],
41
- _excluded38 = ["animated", "delay", "radius"],
42
- _excluded39 = ["size"],
43
- _excluded40 = ["size"],
44
- _excluded41 = ["size"],
45
- _excluded42 = ["size"],
46
- _excluded43 = ["icon", "id", "focused", "fontSize", "label", "onClick", "onFocus", "padding", "selected"],
47
- _excluded44 = ["children"],
48
- _excluded45 = ["flex"],
49
- _excluded46 = ["closable", "description", "onClose", "title", "status"],
50
- _excluded47 = ["children", "space"],
51
- _excluded48 = ["children", "expanded"],
52
- _excluded49 = ["children", "expanded", "fontSize", "href", "icon", "id", "muted", "onClick", "padding", "selected", "space", "text", "weight"];
53
- function _objectDestructuringEmpty(obj) { if (obj == null) throw new TypeError("Cannot destructure " + obj); }
54
- function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
55
4
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
56
- function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
57
- function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
58
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
59
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
60
- function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
61
- function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
62
- function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
63
5
  Object.defineProperty(exports, '__esModule', {
64
6
  value: true
65
7
  });
@@ -236,7 +178,10 @@ function responsiveTextFont(props) {
236
178
  }
237
179
  function useArrayProp(val, defaultVal) {
238
180
  const __perf_hash__ = react.useMemo(() => JSON.stringify(val != null ? val : defaultVal), [defaultVal, val]);
239
- return react.useMemo(() => _getArrayProp(val, defaultVal), [__perf_hash__]);
181
+ return react.useMemo(() => _getArrayProp(val, defaultVal),
182
+ // Improve performance: Keep object identify for a given hash of the value
183
+ // eslint-disable-next-line react-hooks/exhaustive-deps
184
+ [__perf_hash__]);
240
185
  }
241
186
  function _getElements(element, elementsArg) {
242
187
  const ret = [element];
@@ -1409,7 +1354,8 @@ const defaultOpts = {
1409
1354
  solid
1410
1355
  } = _ref7;
1411
1356
  if (mode === "bleed") {
1412
- return _objectSpread(_objectSpread({}, muted), {}, {
1357
+ return {
1358
+ ...muted,
1413
1359
  enabled: {
1414
1360
  bg: "transparent",
1415
1361
  bg2: "transparent",
@@ -1450,11 +1396,12 @@ const defaultOpts = {
1450
1396
  },
1451
1397
  skeleton: base.skeleton
1452
1398
  }
1453
- });
1399
+ };
1454
1400
  }
1455
- if (mode === "ghost") return _objectSpread(_objectSpread({}, solid), {}, {
1401
+ if (mode === "ghost") return {
1402
+ ...solid,
1456
1403
  enabled: muted.enabled
1457
- });
1404
+ };
1458
1405
  return solid;
1459
1406
  },
1460
1407
  card: _ref8 => {
@@ -2171,7 +2118,10 @@ function createSpot(opts, base, dark) {
2171
2118
  }
2172
2119
  function createColorTheme() {
2173
2120
  let partialOpts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
2174
- const builders = _objectSpread(_objectSpread({}, defaultOpts), partialOpts);
2121
+ const builders = {
2122
+ ...defaultOpts,
2123
+ ...partialOpts
2124
+ };
2175
2125
  return {
2176
2126
  light: _createColorScheme(builders, false),
2177
2127
  dark: _createColorScheme(builders, true)
@@ -2609,30 +2559,37 @@ const color = createColorTheme({
2609
2559
  } = _ref14;
2610
2560
  if (mode === "bleed") {
2611
2561
  return {
2612
- enabled: _objectSpread(_objectSpread({}, muted.enabled), {}, {
2562
+ enabled: {
2563
+ ...muted.enabled,
2613
2564
  border: muted.enabled.bg
2614
- }),
2615
- hovered: _objectSpread(_objectSpread({}, muted.hovered), {}, {
2565
+ },
2566
+ hovered: {
2567
+ ...muted.hovered,
2616
2568
  border: muted.hovered.bg
2617
- }),
2618
- pressed: _objectSpread(_objectSpread({}, muted.pressed), {}, {
2569
+ },
2570
+ pressed: {
2571
+ ...muted.pressed,
2619
2572
  border: muted.pressed.bg
2620
- }),
2621
- selected: _objectSpread(_objectSpread({}, muted.selected), {}, {
2573
+ },
2574
+ selected: {
2575
+ ...muted.selected,
2622
2576
  border: muted.selected.bg
2623
- }),
2624
- disabled: _objectSpread(_objectSpread({}, muted.disabled), {}, {
2577
+ },
2578
+ disabled: {
2579
+ ...muted.disabled,
2625
2580
  border: muted.disabled.bg
2626
- })
2581
+ }
2627
2582
  };
2628
2583
  }
2629
2584
  if (mode === "ghost") {
2630
- return _objectSpread(_objectSpread({}, solid), {}, {
2631
- enabled: _objectSpread(_objectSpread({}, muted.enabled), {}, {
2585
+ return {
2586
+ ...solid,
2587
+ enabled: {
2588
+ ...muted.enabled,
2632
2589
  border: base.border
2633
- }),
2590
+ },
2634
2591
  disabled: muted.disabled
2635
- });
2592
+ };
2636
2593
  }
2637
2594
  return solid;
2638
2595
  },
@@ -2749,9 +2706,10 @@ const color = createColorTheme({
2749
2706
  state
2750
2707
  } = _ref17;
2751
2708
  if (state === "enabled") {
2752
- return _objectSpread(_objectSpread({}, muted[tone].enabled), {}, {
2709
+ return {
2710
+ ...muted[tone].enabled,
2753
2711
  bg: base.bg
2754
- });
2712
+ };
2755
2713
  }
2756
2714
  if (state === "pressed") {
2757
2715
  if (tone === "default") {
@@ -2766,9 +2724,10 @@ const color = createColorTheme({
2766
2724
  return solid[tone].enabled;
2767
2725
  }
2768
2726
  if (state === "disabled") {
2769
- return _objectSpread(_objectSpread({}, muted[tone].disabled), {}, {
2727
+ return {
2728
+ ...muted[tone].disabled,
2770
2729
  bg: base.bg
2771
- });
2730
+ };
2772
2731
  }
2773
2732
  return muted[tone][state];
2774
2733
  },
@@ -3084,7 +3043,20 @@ const studioTheme = {
3084
3043
  width: 1
3085
3044
  }
3086
3045
  }
3046
+ // styles: {
3047
+ // button: {
3048
+ // root: {
3049
+ // transition: 'background-color 100ms,border-color 100ms,color 100ms',
3050
+ // },
3051
+ // },
3052
+ // card: {
3053
+ // root: {
3054
+ // transition: 'background-color 100ms,border-color 100ms,color 100ms',
3055
+ // },
3056
+ // },
3057
+ // },
3087
3058
  };
3059
+
3088
3060
  const DEFAULT_THEME_LAYER = {
3089
3061
  dialog: {
3090
3062
  zOffset: 600
@@ -3118,18 +3090,19 @@ function ThemeProvider(props) {
3118
3090
  const theme = react.useMemo(() => {
3119
3091
  if (!themeProp) return null;
3120
3092
  const {
3121
- color: rootColor,
3122
- layer: rootLayer
3123
- } = themeProp,
3124
- restTheme = _objectWithoutProperties(themeProp, _excluded);
3093
+ color: rootColor,
3094
+ layer: rootLayer,
3095
+ ...restTheme
3096
+ } = themeProp;
3125
3097
  const colorScheme = rootColor[scheme] || rootColor.light;
3126
3098
  const color = colorScheme[tone] || colorScheme.default;
3127
3099
  const layer = rootLayer || DEFAULT_THEME_LAYER;
3128
3100
  return {
3129
- sanity: _objectSpread(_objectSpread({}, restTheme), {}, {
3101
+ sanity: {
3102
+ ...restTheme,
3130
3103
  color,
3131
3104
  layer
3132
- })
3105
+ }
3133
3106
  };
3134
3107
  }, [scheme, themeProp, tone]);
3135
3108
  const value = react.useMemo(() => themeProp && {
@@ -3798,9 +3771,10 @@ function responsiveInputPaddingStyle(props) {
3798
3771
  });
3799
3772
  }
3800
3773
  function responsiveInputPaddingIconRightStyle(props) {
3801
- return responsiveInputPaddingStyle(_objectSpread(_objectSpread({}, props), {}, {
3774
+ return responsiveInputPaddingStyle({
3775
+ ...props,
3802
3776
  $iconRight: true
3803
- }));
3777
+ });
3804
3778
  }
3805
3779
  const ROOT_STYLE = styled.css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n &:not([hidden]) {\n display: flex;\n }\n\n align-items: center;\n"])));
3806
3780
  function textInputRootStyle() {
@@ -3930,24 +3904,24 @@ const Root$E = styled__default.default.div(responsiveTextFont, responsiveTextAli
3930
3904
  const SpanWithTextOverflow$2 = styled__default.default.span(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n display: block;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n"])));
3931
3905
  const Text = react.forwardRef(function Text2(props, ref) {
3932
3906
  const {
3933
- accent = false,
3934
- align,
3935
- children: childrenProp,
3936
- muted = false,
3937
- size = 2,
3938
- textOverflow,
3939
- weight
3940
- } = props,
3941
- restProps = _objectWithoutProperties(props, _excluded2);
3907
+ accent = false,
3908
+ align,
3909
+ children: childrenProp,
3910
+ muted = false,
3911
+ size = 2,
3912
+ textOverflow,
3913
+ weight,
3914
+ ...restProps
3915
+ } = props;
3942
3916
  let children = childrenProp;
3943
3917
  if (textOverflow === "ellipsis") {
3944
3918
  children = /* @__PURE__ */jsxRuntime.jsx(SpanWithTextOverflow$2, {
3945
3919
  children
3946
3920
  });
3947
3921
  }
3948
- return /* @__PURE__ */jsxRuntime.jsx(Root$E, _objectSpread(_objectSpread({
3949
- "data-ui": "Text"
3950
- }, restProps), {}, {
3922
+ return /* @__PURE__ */jsxRuntime.jsx(Root$E, {
3923
+ "data-ui": "Text",
3924
+ ...restProps,
3951
3925
  $accent: accent,
3952
3926
  $align: useArrayProp(align),
3953
3927
  $muted: muted,
@@ -3957,7 +3931,7 @@ const Text = react.forwardRef(function Text2(props, ref) {
3957
3931
  children: /* @__PURE__ */jsxRuntime.jsx("span", {
3958
3932
  children
3959
3933
  })
3960
- }));
3934
+ });
3961
3935
  });
3962
3936
  const avatarStyle = {
3963
3937
  root: avatarRootStyle,
@@ -4025,6 +3999,7 @@ function avatarRootStyle(props) {
4025
3999
  display: "block"
4026
4000
  }
4027
4001
  },
4002
+ /* &:is(button) */
4028
4003
  '&[data-as="button"]': {
4029
4004
  "-webkit-font-smoothing": "inherit",
4030
4005
  appearance: "none",
@@ -4110,18 +4085,18 @@ const Stroke = styled__default.default.ellipse(avatarStyle.stroke);
4110
4085
  const Initials = styled__default.default.div(avatarStyle.initials);
4111
4086
  const Avatar = react.forwardRef(function Avatar2(props, ref) {
4112
4087
  const {
4113
- as: asProp,
4114
- color: colorKey = "gray",
4115
- src,
4116
- title,
4117
- initials,
4118
- onImageLoadError,
4119
- arrowPosition: arrowPositionProp,
4120
- animateArrowFrom,
4121
- status = "online",
4122
- size: sizeProp = 0
4123
- } = props,
4124
- restProps = _objectWithoutProperties(props, _excluded3);
4088
+ as: asProp,
4089
+ color: colorKey = "gray",
4090
+ src,
4091
+ title,
4092
+ initials,
4093
+ onImageLoadError,
4094
+ arrowPosition: arrowPositionProp,
4095
+ animateArrowFrom,
4096
+ status = "online",
4097
+ size: sizeProp = 0,
4098
+ ...restProps
4099
+ } = props;
4125
4100
  const as = ReactIs__default.default.isValidElementType(asProp) ? asProp : "div";
4126
4101
  const size = useArrayProp(sizeProp);
4127
4102
  const theme = useTheme();
@@ -4148,11 +4123,11 @@ const Avatar = react.forwardRef(function Avatar2(props, ref) {
4148
4123
  }
4149
4124
  }, [onImageLoadError]);
4150
4125
  const initialsSize = react.useMemo(() => size.map(s => s === 0 ? 0 : s + 1), [size]);
4151
- return /* @__PURE__ */jsxRuntime.jsxs(Root$D, _objectSpread(_objectSpread({
4126
+ return /* @__PURE__ */jsxRuntime.jsxs(Root$D, {
4152
4127
  as,
4153
4128
  "data-as": typeof as === "string" ? as : void 0,
4154
- "data-ui": "Avatar"
4155
- }, restProps), {}, {
4129
+ "data-ui": "Avatar",
4130
+ ...restProps,
4156
4131
  $size: size,
4157
4132
  $color: color,
4158
4133
  "aria-label": title,
@@ -4217,7 +4192,7 @@ const Avatar = react.forwardRef(function Avatar2(props, ref) {
4217
4192
  })
4218
4193
  })
4219
4194
  })]
4220
- }));
4195
+ });
4221
4196
  });
4222
4197
  function _responsiveAvatarCounterSizeStyle(props) {
4223
4198
  const {
@@ -4293,11 +4268,11 @@ function responsiveAvatarStackSizeStyle(props) {
4293
4268
  const Root$B = styled__default.default.div(responsiveAvatarStackSizeStyle, avatarStackStyle);
4294
4269
  const AvatarStack = react.forwardRef(function AvatarStack2(props, ref) {
4295
4270
  const {
4296
- children: childrenProp,
4297
- maxLength: maxLengthProp = 4,
4298
- size: sizeProp = 0
4299
- } = props,
4300
- restProps = _objectWithoutProperties(props, _excluded4);
4271
+ children: childrenProp,
4272
+ maxLength: maxLengthProp = 4,
4273
+ size: sizeProp = 0,
4274
+ ...restProps
4275
+ } = props;
4301
4276
  const children = childrenToElementArray(childrenProp).filter(child => typeof child !== "string");
4302
4277
  const maxLength = Math.max(maxLengthProp, 0);
4303
4278
  const size = useArrayProp(sizeProp);
@@ -4305,9 +4280,9 @@ const AvatarStack = react.forwardRef(function AvatarStack2(props, ref) {
4305
4280
  const visibleCount = maxLength - 1;
4306
4281
  const extraCount = len - visibleCount;
4307
4282
  const visibleChildren = extraCount > 1 ? children.slice(extraCount, len) : children;
4308
- return /* @__PURE__ */jsxRuntime.jsxs(Root$B, _objectSpread(_objectSpread({
4309
- "data-ui": "AvatarStack"
4310
- }, restProps), {}, {
4283
+ return /* @__PURE__ */jsxRuntime.jsxs(Root$B, {
4284
+ "data-ui": "AvatarStack",
4285
+ ...restProps,
4311
4286
  ref,
4312
4287
  $size: size,
4313
4288
  children: [len === 0 && /* @__PURE__ */jsxRuntime.jsx("div", {
@@ -4324,43 +4299,43 @@ const AvatarStack = react.forwardRef(function AvatarStack2(props, ref) {
4324
4299
  size
4325
4300
  })
4326
4301
  }, String(childIndex)))]
4327
- }));
4302
+ });
4328
4303
  });
4329
4304
  const Root$A = styled__default.default.div(boxStyle, flexItemStyle, responsiveBoxStyle, responsiveGridItemStyle, responsiveMarginStyle, responsivePaddingStyle);
4330
4305
  const Box = react.forwardRef(function Box2(props, ref) {
4331
4306
  const {
4332
- as: asProp = "div",
4333
- column,
4334
- columnStart,
4335
- columnEnd,
4336
- display = "block",
4337
- flex,
4338
- height,
4339
- margin = 0,
4340
- marginX,
4341
- marginY,
4342
- marginTop,
4343
- marginRight,
4344
- marginBottom,
4345
- marginLeft,
4346
- overflow,
4347
- padding = 0,
4348
- paddingX,
4349
- paddingY,
4350
- paddingTop,
4351
- paddingRight,
4352
- paddingBottom,
4353
- paddingLeft,
4354
- row,
4355
- rowStart,
4356
- rowEnd,
4357
- sizing
4358
- } = props,
4359
- restProps = _objectWithoutProperties(props, _excluded5);
4360
- return /* @__PURE__ */jsxRuntime.jsx(Root$A, _objectSpread(_objectSpread({
4307
+ as: asProp = "div",
4308
+ column,
4309
+ columnStart,
4310
+ columnEnd,
4311
+ display = "block",
4312
+ flex,
4313
+ height,
4314
+ margin = 0,
4315
+ marginX,
4316
+ marginY,
4317
+ marginTop,
4318
+ marginRight,
4319
+ marginBottom,
4320
+ marginLeft,
4321
+ overflow,
4322
+ padding = 0,
4323
+ paddingX,
4324
+ paddingY,
4325
+ paddingTop,
4326
+ paddingRight,
4327
+ paddingBottom,
4328
+ paddingLeft,
4329
+ row,
4330
+ rowStart,
4331
+ rowEnd,
4332
+ sizing,
4333
+ ...restProps
4334
+ } = props;
4335
+ return /* @__PURE__ */jsxRuntime.jsx(Root$A, {
4361
4336
  "data-as": typeof asProp === "string" ? asProp : void 0,
4362
- "data-ui": "Box"
4363
- }, restProps), {}, {
4337
+ "data-ui": "Box",
4338
+ ...restProps,
4364
4339
  $column: useArrayProp(column),
4365
4340
  $columnStart: useArrayProp(columnStart),
4366
4341
  $columnEnd: useArrayProp(columnEnd),
@@ -4389,7 +4364,7 @@ const Box = react.forwardRef(function Box2(props, ref) {
4389
4364
  as: asProp,
4390
4365
  ref,
4391
4366
  children: props.children
4392
- }));
4367
+ });
4393
4368
  });
4394
4369
  function labelBaseStyle(props) {
4395
4370
  const {
@@ -4406,15 +4381,15 @@ const Root$z = styled__default.default.div(responsiveLabelFont, responsiveTextAl
4406
4381
  const SpanWithTextOverflow$1 = styled__default.default.span(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n display: block;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n"])));
4407
4382
  const Label = react.forwardRef(function Label2(props, ref) {
4408
4383
  const {
4409
- accent,
4410
- align,
4411
- children: childrenProp,
4412
- muted = false,
4413
- size = 2,
4414
- textOverflow,
4415
- weight
4416
- } = props,
4417
- restProps = _objectWithoutProperties(props, _excluded6);
4384
+ accent,
4385
+ align,
4386
+ children: childrenProp,
4387
+ muted = false,
4388
+ size = 2,
4389
+ textOverflow,
4390
+ weight,
4391
+ ...restProps
4392
+ } = props;
4418
4393
  let children = childrenProp;
4419
4394
  if (textOverflow === "ellipsis") {
4420
4395
  children = /* @__PURE__ */jsxRuntime.jsx(SpanWithTextOverflow$1, {
@@ -4425,9 +4400,9 @@ const Label = react.forwardRef(function Label2(props, ref) {
4425
4400
  children
4426
4401
  });
4427
4402
  }
4428
- return /* @__PURE__ */jsxRuntime.jsx(Root$z, _objectSpread(_objectSpread({
4429
- "data-ui": "Label"
4430
- }, restProps), {}, {
4403
+ return /* @__PURE__ */jsxRuntime.jsx(Root$z, {
4404
+ "data-ui": "Label",
4405
+ ...restProps,
4431
4406
  $accent: accent,
4432
4407
  $align: useArrayProp(align),
4433
4408
  $muted: muted,
@@ -4435,7 +4410,7 @@ const Label = react.forwardRef(function Label2(props, ref) {
4435
4410
  $weight: weight,
4436
4411
  ref,
4437
4412
  children
4438
- }));
4413
+ });
4439
4414
  });
4440
4415
  function badgeStyle(props) {
4441
4416
  const {
@@ -4458,17 +4433,17 @@ function badgeStyle(props) {
4458
4433
  const Root$y = styled__default.default(Box)(responsiveRadiusStyle, badgeStyle);
4459
4434
  const Badge = react.forwardRef(function Badge2(props, ref) {
4460
4435
  const {
4461
- children,
4462
- fontSize,
4463
- mode = "default",
4464
- padding = 1,
4465
- radius = 2,
4466
- tone = "default"
4467
- } = props,
4468
- restProps = _objectWithoutProperties(props, _excluded7);
4469
- return /* @__PURE__ */jsxRuntime.jsx(Root$y, _objectSpread(_objectSpread({
4470
- "data-ui": "Badge"
4471
- }, restProps), {}, {
4436
+ children,
4437
+ fontSize,
4438
+ mode = "default",
4439
+ padding = 1,
4440
+ radius = 2,
4441
+ tone = "default",
4442
+ ...restProps
4443
+ } = props;
4444
+ return /* @__PURE__ */jsxRuntime.jsx(Root$y, {
4445
+ "data-ui": "Badge",
4446
+ ...restProps,
4472
4447
  $mode: mode,
4473
4448
  $tone: tone,
4474
4449
  $radius: useArrayProp(radius),
@@ -4478,22 +4453,22 @@ const Badge = react.forwardRef(function Badge2(props, ref) {
4478
4453
  size: fontSize,
4479
4454
  children
4480
4455
  })
4481
- }));
4456
+ });
4482
4457
  });
4483
4458
  const Root$x = styled__default.default(Box)(flexItemStyle, responsiveFlexStyle);
4484
4459
  const Flex = react.forwardRef(function Flex2(props, ref) {
4485
4460
  const {
4486
- align,
4487
- as,
4488
- direction = "row",
4489
- gap,
4490
- justify,
4491
- wrap
4492
- } = props,
4493
- restProps = _objectWithoutProperties(props, _excluded8);
4494
- return /* @__PURE__ */jsxRuntime.jsx(Root$x, _objectSpread(_objectSpread({
4495
- "data-ui": "Flex"
4496
- }, restProps), {}, {
4461
+ align,
4462
+ as,
4463
+ direction = "row",
4464
+ gap,
4465
+ justify,
4466
+ wrap,
4467
+ ...restProps
4468
+ } = props;
4469
+ return /* @__PURE__ */jsxRuntime.jsx(Root$x, {
4470
+ "data-ui": "Flex",
4471
+ ...restProps,
4497
4472
  $align: useArrayProp(align),
4498
4473
  $direction: useArrayProp(direction),
4499
4474
  $gap: useArrayProp(gap),
@@ -4501,27 +4476,30 @@ const Flex = react.forwardRef(function Flex2(props, ref) {
4501
4476
  $wrap: useArrayProp(wrap),
4502
4477
  forwardedAs: as,
4503
4478
  ref
4504
- }));
4479
+ });
4505
4480
  });
4506
4481
  const rotate$1 = styled.keyframes(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n from {\n transform: rotate(0deg);\n }\n\n to {\n transform: rotate(360deg);\n }\n"])));
4507
4482
  const Root$w = styled__default.default(Text)(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n & > span > svg {\n animation: ", " 500ms linear infinite;\n }\n"])), rotate$1);
4508
4483
  const Spinner = react.forwardRef(function Spinner2(props, ref) {
4509
- return /* @__PURE__ */jsxRuntime.jsx(Root$w, _objectSpread(_objectSpread({
4510
- "data-ui": "Spinner"
4511
- }, props), {}, {
4484
+ return /* @__PURE__ */jsxRuntime.jsx(Root$w, {
4485
+ "data-ui": "Spinner",
4486
+ ...props,
4512
4487
  ref,
4513
4488
  children: /* @__PURE__ */jsxRuntime.jsx(icons.SpinnerIcon, {})
4514
- }));
4489
+ });
4515
4490
  });
4516
4491
  function _colorVarsStyle(base, color) {
4517
4492
  let checkered = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
4518
4493
  var _a, _b, _c, _d, _e, _f, _g, _h;
4519
4494
  return {
4495
+ // Base
4496
+ // @todo: rename to "--base-"?
4520
4497
  "--card-shadow-outline-color": base.shadow.outline,
4521
4498
  "--card-shadow-umbra-color": base.shadow.umbra,
4522
4499
  "--card-shadow-penumbra-color": base.shadow.penumbra,
4523
4500
  "--card-shadow-ambient-color": base.shadow.ambient,
4524
4501
  "--card-focus-ring-color": base.focusRing,
4502
+ // Card
4525
4503
  "--card-bg-color": color.bg,
4526
4504
  "--card-bg-image": checkered ? "repeating-conic-gradient(".concat(color.bg, " 0% 25%, ").concat(color.bg2 || color.bg, " 0% 50%)") : void 0,
4527
4505
  "--card-fg-color": color.fg,
@@ -4533,6 +4511,7 @@ function _colorVarsStyle(base, color) {
4533
4511
  "--card-code-fg-color": (_e = color.code) == null ? void 0 : _e.fg,
4534
4512
  "--card-skeleton-color-from": (_f = color.skeleton) == null ? void 0 : _f.from,
4535
4513
  "--card-skeleton-color-to": (_g = color.skeleton) == null ? void 0 : _g.to,
4514
+ // @todo: deprecate
4536
4515
  "--card-link-color": (_h = color.link) == null ? void 0 : _h.fg,
4537
4516
  "--card-hairline-soft-color": color.border,
4538
4517
  "--card-hairline-hard-color": color.border
@@ -4590,30 +4569,30 @@ const Root$v = styled__default.default.button(responsiveRadiusStyle, buttonBaseS
4590
4569
  const LoadingBox = styled__default.default.div(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--card-bg-color);\n border-radius: inherit;\n z-index: 1;\n box-shadow: inherit;\n"])));
4591
4570
  const Button = react.forwardRef(function Button2(props, ref) {
4592
4571
  const {
4593
- children,
4594
- disabled,
4595
- fontSize,
4596
- icon,
4597
- iconRight,
4598
- justify: justifyProp = "center",
4599
- loading,
4600
- mode = "default",
4601
- padding: paddingProp = 3,
4602
- paddingX: paddingXProp,
4603
- paddingY: paddingYProp,
4604
- paddingTop: paddingTopProp,
4605
- paddingBottom: paddingBottomProp,
4606
- paddingLeft: paddingLeftProp,
4607
- paddingRight: paddingRightProp,
4608
- radius: radiusProp = 2,
4609
- selected,
4610
- space: spaceProp = 3,
4611
- text,
4612
- textAlign,
4613
- tone = "default",
4614
- type = "button"
4615
- } = props,
4616
- restProps = _objectWithoutProperties(props, _excluded9);
4572
+ children,
4573
+ disabled,
4574
+ fontSize,
4575
+ icon,
4576
+ iconRight,
4577
+ justify: justifyProp = "center",
4578
+ loading,
4579
+ mode = "default",
4580
+ padding: paddingProp = 3,
4581
+ paddingX: paddingXProp,
4582
+ paddingY: paddingYProp,
4583
+ paddingTop: paddingTopProp,
4584
+ paddingBottom: paddingBottomProp,
4585
+ paddingLeft: paddingLeftProp,
4586
+ paddingRight: paddingRightProp,
4587
+ radius: radiusProp = 2,
4588
+ selected,
4589
+ space: spaceProp = 3,
4590
+ text,
4591
+ textAlign,
4592
+ tone = "default",
4593
+ type = "button",
4594
+ ...restProps
4595
+ } = props;
4617
4596
  const justify = useArrayProp(justifyProp);
4618
4597
  const padding = useArrayProp(paddingProp);
4619
4598
  const paddingX = useArrayProp(paddingXProp);
@@ -4626,6 +4605,7 @@ const Button = react.forwardRef(function Button2(props, ref) {
4626
4605
  const space = useArrayProp(spaceProp);
4627
4606
  const theme = useTheme();
4628
4607
  const boxProps = react.useMemo(() => ({
4608
+ // flex: 1,
4629
4609
  padding,
4630
4610
  paddingX,
4631
4611
  paddingY,
@@ -4634,9 +4614,9 @@ const Button = react.forwardRef(function Button2(props, ref) {
4634
4614
  paddingLeft,
4635
4615
  paddingRight
4636
4616
  }), [padding, paddingX, paddingY, paddingTop, paddingBottom, paddingLeft, paddingRight]);
4637
- return /* @__PURE__ */jsxRuntime.jsxs(Root$v, _objectSpread(_objectSpread({
4638
- "data-ui": "Button"
4639
- }, restProps), {}, {
4617
+ return /* @__PURE__ */jsxRuntime.jsxs(Root$v, {
4618
+ "data-ui": "Button",
4619
+ ...restProps,
4640
4620
  $mode: mode,
4641
4621
  $radius: radius,
4642
4622
  $tone: tone,
@@ -4647,9 +4627,9 @@ const Button = react.forwardRef(function Button2(props, ref) {
4647
4627
  type,
4648
4628
  children: [Boolean(loading) && /* @__PURE__ */jsxRuntime.jsx(LoadingBox, {
4649
4629
  children: /* @__PURE__ */jsxRuntime.jsx(Spinner, {})
4650
- }), (icon || text || iconRight) && /* @__PURE__ */jsxRuntime.jsx(Box, _objectSpread(_objectSpread({
4651
- as: "span"
4652
- }, boxProps), {}, {
4630
+ }), (icon || text || iconRight) && /* @__PURE__ */jsxRuntime.jsx(Box, {
4631
+ as: "span",
4632
+ ...boxProps,
4653
4633
  children: /* @__PURE__ */jsxRuntime.jsxs(Flex, {
4654
4634
  as: "span",
4655
4635
  justify,
@@ -4672,12 +4652,12 @@ const Button = react.forwardRef(function Button2(props, ref) {
4672
4652
  children: [react.isValidElement(iconRight) && iconRight, ReactIs.isValidElementType(iconRight) && react.createElement(iconRight)]
4673
4653
  })]
4674
4654
  })
4675
- })), children && /* @__PURE__ */jsxRuntime.jsx(Box, _objectSpread(_objectSpread({
4676
- as: "span"
4677
- }, boxProps), {}, {
4655
+ }), children && /* @__PURE__ */jsxRuntime.jsx(Box, {
4656
+ as: "span",
4657
+ ...boxProps,
4678
4658
  children
4679
- }))]
4680
- }));
4659
+ })]
4660
+ });
4681
4661
  });
4682
4662
  function cardStyle(props) {
4683
4663
  return [cardBaseStyle(props), cardColorStyle(props)];
@@ -4722,34 +4702,34 @@ function cardColorStyle(props) {
4722
4702
  const Root$u = styled__default.default(Box)(responsiveBorderStyle, responsiveRadiusStyle, responsiveShadowStyle, cardStyle);
4723
4703
  const Card = react.forwardRef(function Card2(props, ref) {
4724
4704
  const {
4725
- __unstable_checkered: checkered = false,
4726
- __unstable_focusRing: focusRing = false,
4727
- as: asProp,
4728
- border,
4729
- borderTop,
4730
- borderRight,
4731
- borderBottom,
4732
- borderLeft,
4733
- pressed,
4734
- radius = 0,
4735
- scheme,
4736
- selected,
4737
- shadow,
4738
- tone: toneProp = "default"
4739
- } = props,
4740
- restProps = _objectWithoutProperties(props, _excluded10);
4705
+ __unstable_checkered: checkered = false,
4706
+ __unstable_focusRing: focusRing = false,
4707
+ as: asProp,
4708
+ border,
4709
+ borderTop,
4710
+ borderRight,
4711
+ borderBottom,
4712
+ borderLeft,
4713
+ pressed,
4714
+ radius = 0,
4715
+ scheme,
4716
+ selected,
4717
+ shadow,
4718
+ tone: toneProp = "default",
4719
+ ...restProps
4720
+ } = props;
4741
4721
  const as = ReactIs.isValidElementType(asProp) ? asProp : "div";
4742
4722
  const rootTheme = useRootTheme();
4743
4723
  const tone = toneProp === "inherit" ? rootTheme.tone : toneProp;
4744
4724
  return /* @__PURE__ */jsxRuntime.jsx(ThemeColorProvider, {
4745
4725
  scheme,
4746
4726
  tone,
4747
- children: /* @__PURE__ */jsxRuntime.jsx(Root$u, _objectSpread(_objectSpread({
4727
+ children: /* @__PURE__ */jsxRuntime.jsx(Root$u, {
4748
4728
  "data-as": typeof as === "string" ? as : void 0,
4749
4729
  "data-scheme": rootTheme.scheme,
4750
4730
  "data-ui": "Card",
4751
- "data-tone": tone
4752
- }, restProps), {}, {
4731
+ "data-tone": tone,
4732
+ ...restProps,
4753
4733
  $border: useArrayProp(border),
4754
4734
  $borderTop: useArrayProp(borderTop),
4755
4735
  $borderRight: useArrayProp(borderRight),
@@ -4766,7 +4746,7 @@ const Card = react.forwardRef(function Card2(props, ref) {
4766
4746
  forwardedAs: as,
4767
4747
  ref,
4768
4748
  selected
4769
- }))
4749
+ })
4770
4750
  });
4771
4751
  });
4772
4752
  function checkboxBaseStyles() {
@@ -4806,15 +4786,15 @@ const Root$t = styled__default.default.div(checkboxBaseStyles);
4806
4786
  const Input$5 = styled__default.default.input(inputElementStyles);
4807
4787
  const Checkbox = react.forwardRef(function Checkbox2(props, forwardedRef) {
4808
4788
  const {
4809
- checked,
4810
- className,
4811
- disabled,
4812
- indeterminate,
4813
- customValidity,
4814
- readOnly,
4815
- style
4816
- } = props,
4817
- restProps = _objectWithoutProperties(props, _excluded11);
4789
+ checked,
4790
+ className,
4791
+ disabled,
4792
+ indeterminate,
4793
+ customValidity,
4794
+ readOnly,
4795
+ style,
4796
+ ...restProps
4797
+ } = props;
4818
4798
  const ref = useForwardedRef(forwardedRef);
4819
4799
  useCustomValidity(ref, customValidity);
4820
4800
  react.useEffect(() => {
@@ -4826,15 +4806,15 @@ const Checkbox = react.forwardRef(function Checkbox2(props, forwardedRef) {
4826
4806
  className,
4827
4807
  "data-ui": "Checkbox",
4828
4808
  style,
4829
- children: [/* @__PURE__ */jsxRuntime.jsx(Input$5, _objectSpread(_objectSpread({
4830
- "data-read-only": !disabled && readOnly ? "" : void 0
4831
- }, restProps), {}, {
4809
+ children: [/* @__PURE__ */jsxRuntime.jsx(Input$5, {
4810
+ "data-read-only": !disabled && readOnly ? "" : void 0,
4811
+ ...restProps,
4832
4812
  checked,
4833
4813
  disabled: disabled || readOnly,
4834
4814
  type: "checkbox",
4835
4815
  readOnly,
4836
4816
  ref
4837
- })), /* @__PURE__ */jsxRuntime.jsxs("span", {
4817
+ }), /* @__PURE__ */jsxRuntime.jsxs("span", {
4838
4818
  children: [/* @__PURE__ */jsxRuntime.jsx(icons.CheckmarkIcon, {}), /* @__PURE__ */jsxRuntime.jsx(icons.RemoveIcon, {})]
4839
4819
  })]
4840
4820
  });
@@ -4961,17 +4941,17 @@ function codeBaseStyle() {
4961
4941
  const Root$s = styled__default.default.pre(codeBaseStyle, responsiveCodeFontStyle);
4962
4942
  const Code = react.forwardRef(function Code2(props, ref) {
4963
4943
  const {
4964
- children,
4965
- language: languageProp,
4966
- size = 2,
4967
- weight
4968
- } = props,
4969
- restProps = _objectWithoutProperties(props, _excluded12);
4944
+ children,
4945
+ language: languageProp,
4946
+ size = 2,
4947
+ weight,
4948
+ ...restProps
4949
+ } = props;
4970
4950
  const language = typeof languageProp === "string" ? languageProp : void 0;
4971
4951
  const registered = language ? Refractor__default.default.hasLanguage(language) : false;
4972
- return /* @__PURE__ */jsxRuntime.jsxs(Root$s, _objectSpread(_objectSpread({
4973
- "data-ui": "Code"
4974
- }, restProps), {}, {
4952
+ return /* @__PURE__ */jsxRuntime.jsxs(Root$s, {
4953
+ "data-ui": "Code",
4954
+ ...restProps,
4975
4955
  $size: useArrayProp(size),
4976
4956
  $weight: weight,
4977
4957
  ref,
@@ -4982,7 +4962,7 @@ const Code = react.forwardRef(function Code2(props, ref) {
4982
4962
  language,
4983
4963
  value: String(children)
4984
4964
  })]
4985
- }));
4965
+ });
4986
4966
  });
4987
4967
  const BASE_STYLE$1 = {
4988
4968
  width: "100%",
@@ -5006,37 +4986,37 @@ function responsiveContainerWidthStyle(props) {
5006
4986
  const Root$r = styled__default.default(Box)(containerBaseStyle, responsiveContainerWidthStyle);
5007
4987
  const Container = react.forwardRef(function Container2(props, ref) {
5008
4988
  const {
5009
- as,
5010
- width = 2
5011
- } = props,
5012
- restProps = _objectWithoutProperties(props, _excluded13);
5013
- return /* @__PURE__ */jsxRuntime.jsx(Root$r, _objectSpread(_objectSpread({
5014
- "data-ui": "Container"
5015
- }, restProps), {}, {
4989
+ as,
4990
+ width = 2,
4991
+ ...restProps
4992
+ } = props;
4993
+ return /* @__PURE__ */jsxRuntime.jsx(Root$r, {
4994
+ "data-ui": "Container",
4995
+ ...restProps,
5016
4996
  $width: useArrayProp(width),
5017
4997
  forwardedAs: as,
5018
4998
  ref
5019
- }));
4999
+ });
5020
5000
  });
5021
5001
  const Root$q = styled__default.default(Box)(responsiveGridStyle);
5022
5002
  const Grid = react.forwardRef(function Grid2(props, ref) {
5023
5003
  const {
5024
- as,
5025
- autoRows,
5026
- autoCols,
5027
- autoFlow,
5028
- columns,
5029
- gap,
5030
- gapX,
5031
- gapY,
5032
- rows,
5033
- children
5034
- } = props,
5035
- restProps = _objectWithoutProperties(props, _excluded14);
5036
- return /* @__PURE__ */jsxRuntime.jsx(Root$q, _objectSpread(_objectSpread({
5004
+ as,
5005
+ autoRows,
5006
+ autoCols,
5007
+ autoFlow,
5008
+ columns,
5009
+ gap,
5010
+ gapX,
5011
+ gapY,
5012
+ rows,
5013
+ children,
5014
+ ...restProps
5015
+ } = props;
5016
+ return /* @__PURE__ */jsxRuntime.jsx(Root$q, {
5037
5017
  "data-as": typeof as === "string" ? as : void 0,
5038
- "data-ui": "Grid"
5039
- }, restProps), {}, {
5018
+ "data-ui": "Grid",
5019
+ ...restProps,
5040
5020
  $autoRows: useArrayProp(autoRows),
5041
5021
  $autoCols: useArrayProp(autoCols),
5042
5022
  $autoFlow: useArrayProp(autoFlow),
@@ -5048,7 +5028,7 @@ const Grid = react.forwardRef(function Grid2(props, ref) {
5048
5028
  forwardedAs: as,
5049
5029
  ref,
5050
5030
  children
5051
- }));
5031
+ });
5052
5032
  });
5053
5033
  function headingBaseStyle(props) {
5054
5034
  const {
@@ -5062,24 +5042,24 @@ const Root$p = styled__default.default.div(headingBaseStyle, responsiveTextAlign
5062
5042
  const SpanWithTextOverflow = styled__default.default.span(_templateObject27 || (_templateObject27 = _taggedTemplateLiteral(["\n display: block;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n"])));
5063
5043
  const Heading = react.forwardRef(function Heading2(props, ref) {
5064
5044
  const {
5065
- accent = false,
5066
- align,
5067
- children: childrenProp,
5068
- muted = false,
5069
- size = 2,
5070
- textOverflow,
5071
- weight
5072
- } = props,
5073
- restProps = _objectWithoutProperties(props, _excluded15);
5045
+ accent = false,
5046
+ align,
5047
+ children: childrenProp,
5048
+ muted = false,
5049
+ size = 2,
5050
+ textOverflow,
5051
+ weight,
5052
+ ...restProps
5053
+ } = props;
5074
5054
  let children = childrenProp;
5075
5055
  if (textOverflow === "ellipsis") {
5076
5056
  children = /* @__PURE__ */jsxRuntime.jsx(SpanWithTextOverflow, {
5077
5057
  children
5078
5058
  });
5079
5059
  }
5080
- return /* @__PURE__ */jsxRuntime.jsx(Root$p, _objectSpread(_objectSpread({
5081
- "data-ui": "Heading"
5082
- }, restProps), {}, {
5060
+ return /* @__PURE__ */jsxRuntime.jsx(Root$p, {
5061
+ "data-ui": "Heading",
5062
+ ...restProps,
5083
5063
  $accent: accent,
5084
5064
  $align: useArrayProp(align),
5085
5065
  $muted: muted,
@@ -5089,7 +5069,7 @@ const Heading = react.forwardRef(function Heading2(props, ref) {
5089
5069
  children: /* @__PURE__ */jsxRuntime.jsx("span", {
5090
5070
  children
5091
5071
  })
5092
- }));
5072
+ });
5093
5073
  });
5094
5074
  function inlineBaseStyle() {
5095
5075
  return {
@@ -5120,22 +5100,22 @@ function inlineSpaceStyle(props) {
5120
5100
  const Root$o = styled__default.default(Box)(inlineBaseStyle, inlineSpaceStyle);
5121
5101
  const Inline = react.forwardRef(function Inline2(props, ref) {
5122
5102
  const {
5123
- as,
5124
- children: childrenProp,
5125
- space
5126
- } = props,
5127
- restProps = _objectWithoutProperties(props, _excluded16);
5103
+ as,
5104
+ children: childrenProp,
5105
+ space,
5106
+ ...restProps
5107
+ } = props;
5128
5108
  const children = react.useMemo(() => childrenToElementArray(childrenProp).filter(Boolean).map((child, idx) => /* @__PURE__ */jsxRuntime.jsx("div", {
5129
5109
  children: child
5130
5110
  }, idx)), [childrenProp]);
5131
- return /* @__PURE__ */jsxRuntime.jsx(Root$o, _objectSpread(_objectSpread({
5132
- "data-ui": "Inline"
5133
- }, restProps), {}, {
5111
+ return /* @__PURE__ */jsxRuntime.jsx(Root$o, {
5112
+ "data-ui": "Inline",
5113
+ ...restProps,
5134
5114
  $space: useArrayProp(space),
5135
5115
  forwardedAs: as,
5136
5116
  ref,
5137
5117
  children
5138
- }));
5118
+ });
5139
5119
  });
5140
5120
  function kbdStyle() {
5141
5121
  return styled.css(_templateObject28 || (_templateObject28 = _taggedTemplateLiteral(["\n background: var(--card-bg-color);\n font: inherit;\n box-shadow: inset 0 0 0 1px var(--card-hairline-hard-color);\n\n &:not([hidden]) {\n display: inline-block;\n }\n "])));
@@ -5143,15 +5123,15 @@ function kbdStyle() {
5143
5123
  const Root$n = styled__default.default.kbd(responsiveRadiusStyle, kbdStyle);
5144
5124
  const KBD = react.forwardRef(function KBD2(props, ref) {
5145
5125
  const {
5146
- children,
5147
- fontSize = 1,
5148
- padding = 1,
5149
- radius = 2
5150
- } = props,
5151
- restProps = _objectWithoutProperties(props, _excluded17);
5152
- return /* @__PURE__ */jsxRuntime.jsx(Root$n, _objectSpread(_objectSpread({
5153
- "data-ui": "KBD"
5154
- }, restProps), {}, {
5126
+ children,
5127
+ fontSize = 1,
5128
+ padding = 1,
5129
+ radius = 2,
5130
+ ...restProps
5131
+ } = props;
5132
+ return /* @__PURE__ */jsxRuntime.jsx(Root$n, {
5133
+ "data-ui": "KBD",
5134
+ ...restProps,
5155
5135
  $radius: useArrayProp(radius),
5156
5136
  ref,
5157
5137
  children: /* @__PURE__ */jsxRuntime.jsx(Box, {
@@ -5164,7 +5144,7 @@ const KBD = react.forwardRef(function KBD2(props, ref) {
5164
5144
  children
5165
5145
  })
5166
5146
  })
5167
- }));
5147
+ });
5168
5148
  });
5169
5149
  const key$6 = Symbol.for("@sanity/ui/context/boundaryElement");
5170
5150
  globalScope[key$6] = globalScope[key$6] || react.createContext(null);
@@ -5217,10 +5197,10 @@ function findMinBreakpoints(media, width) {
5217
5197
  const ElementQuery = react.forwardRef(function ElementQuery2(props, ref) {
5218
5198
  const theme = useTheme();
5219
5199
  const {
5220
- children,
5221
- media = theme.sanity.media
5222
- } = props,
5223
- restProps = _objectWithoutProperties(props, _excluded18);
5200
+ children,
5201
+ media = theme.sanity.media,
5202
+ ...restProps
5203
+ } = props;
5224
5204
  const forwardedRef = useForwardedRef(ref);
5225
5205
  const [element, setElement] = react.useState(null);
5226
5206
  const elementSize = useElementSize(element);
@@ -5234,14 +5214,14 @@ const ElementQuery = react.forwardRef(function ElementQuery2(props, ref) {
5234
5214
  forwardedRef.current = el;
5235
5215
  setElement(el);
5236
5216
  }, [forwardedRef]);
5237
- return /* @__PURE__ */jsxRuntime.jsx("div", _objectSpread(_objectSpread({
5238
- "data-ui": "ElementQuery"
5239
- }, restProps), {}, {
5217
+ return /* @__PURE__ */jsxRuntime.jsx("div", {
5218
+ "data-ui": "ElementQuery",
5219
+ ...restProps,
5240
5220
  "data-eq-max": max.length ? max.join(" ") : void 0,
5241
5221
  "data-eq-min": min.length ? min.join(" ") : void 0,
5242
5222
  ref: setRef,
5243
5223
  children
5244
- }));
5224
+ });
5245
5225
  });
5246
5226
  class ErrorBoundary extends react.Component {
5247
5227
  constructor() {
@@ -5322,34 +5302,37 @@ function LayerProvider(props) {
5322
5302
  const Root$m = styled__default.default.div(_templateObject29 || (_templateObject29 = _taggedTemplateLiteral(["\n position: relative;\n"])));
5323
5303
  const LayerChildren = react.forwardRef(function LayerChildren2(props, ref) {
5324
5304
  const {
5325
- children,
5326
- style = EMPTY_RECORD
5327
- } = props,
5328
- restProps = _objectWithoutProperties(props, _excluded19);
5305
+ children,
5306
+ style = EMPTY_RECORD,
5307
+ ...restProps
5308
+ } = props;
5329
5309
  const {
5330
5310
  zIndex
5331
5311
  } = useLayer();
5332
- return /* @__PURE__ */jsxRuntime.jsx(Root$m, _objectSpread(_objectSpread({}, restProps), {}, {
5312
+ return /* @__PURE__ */jsxRuntime.jsx(Root$m, {
5313
+ ...restProps,
5333
5314
  "data-ui": "Layer",
5334
5315
  ref,
5335
- style: _objectSpread(_objectSpread({}, style), {}, {
5316
+ style: {
5317
+ ...style,
5336
5318
  zIndex
5337
- }),
5319
+ },
5338
5320
  children
5339
- }));
5321
+ });
5340
5322
  });
5341
5323
  const Layer = react.forwardRef(function Layer2(props, ref) {
5342
5324
  const {
5343
- children,
5344
- zOffset = 1
5345
- } = props,
5346
- restProps = _objectWithoutProperties(props, _excluded20);
5325
+ children,
5326
+ zOffset = 1,
5327
+ ...restProps
5328
+ } = props;
5347
5329
  return /* @__PURE__ */jsxRuntime.jsx(LayerProvider, {
5348
5330
  zOffset,
5349
- children: /* @__PURE__ */jsxRuntime.jsx(LayerChildren, _objectSpread(_objectSpread({}, restProps), {}, {
5331
+ children: /* @__PURE__ */jsxRuntime.jsx(LayerChildren, {
5332
+ ...restProps,
5350
5333
  ref,
5351
5334
  children
5352
- }))
5335
+ })
5353
5336
  });
5354
5337
  });
5355
5338
  const key$4 = Symbol.for("@sanity/ui/context/portal");
@@ -5541,14 +5524,14 @@ const Root$k = styled__default.default.div(_templateObject31 || (_templateObject
5541
5524
  const ItemWrapper = styled__default.default.div(_templateObject32 || (_templateObject32 = _taggedTemplateLiteral(["\n position: absolute;\n left: 0;\n right: 0;\n"])));
5542
5525
  const VirtualList = react.forwardRef(function VirtualList2(props, ref) {
5543
5526
  const {
5544
- as = "div",
5545
- gap = 0,
5546
- getItemKey,
5547
- items = [],
5548
- onChange,
5549
- renderItem
5550
- } = props,
5551
- restProps = _objectWithoutProperties(props, _excluded21);
5527
+ as = "div",
5528
+ gap = 0,
5529
+ getItemKey,
5530
+ items = [],
5531
+ onChange,
5532
+ renderItem,
5533
+ ...restProps
5534
+ } = props;
5552
5535
  const {
5553
5536
  space
5554
5537
  } = useTheme().sanity;
@@ -5644,17 +5627,17 @@ const VirtualList = react.forwardRef(function VirtualList2(props, ref) {
5644
5627
  const wrapperStyle = react.useMemo(() => ({
5645
5628
  height
5646
5629
  }), [height]);
5647
- return /* @__PURE__ */jsxRuntime.jsx(Root$k, _objectSpread(_objectSpread({
5630
+ return /* @__PURE__ */jsxRuntime.jsx(Root$k, {
5648
5631
  as,
5649
- "data-ui": "VirtualList"
5650
- }, restProps), {}, {
5632
+ "data-ui": "VirtualList",
5633
+ ...restProps,
5651
5634
  ref: forwardedRef,
5652
5635
  children: /* @__PURE__ */jsxRuntime.jsx("div", {
5653
5636
  ref: wrapperRef,
5654
5637
  style: wrapperStyle,
5655
5638
  children
5656
5639
  })
5657
- }));
5640
+ });
5658
5641
  });
5659
5642
  const DEFAULT_POPOVER_DISTANCE = 4;
5660
5643
  const DEFAULT_POPOVER_PADDING = 4;
@@ -5731,9 +5714,9 @@ const Root$j = styled__default.default.div(_templateObject33 || (_templateObject
5731
5714
  const BorderPath = styled__default.default.path(_templateObject34 || (_templateObject34 = _taggedTemplateLiteral(["\n fill: var(--card-shadow-outline-color);\n"])));
5732
5715
  const ShapePath = styled__default.default.path(_templateObject35 || (_templateObject35 = _taggedTemplateLiteral(["\n fill: var(--card-bg-color);\n"])));
5733
5716
  const PopoverArrow = react.forwardRef(function PopoverArrow2(props, ref) {
5734
- return /* @__PURE__ */jsxRuntime.jsx(Root$j, _objectSpread(_objectSpread({
5735
- "data-ui": "Popover__arrow"
5736
- }, props), {}, {
5717
+ return /* @__PURE__ */jsxRuntime.jsx(Root$j, {
5718
+ "data-ui": "Popover__arrow",
5719
+ ...props,
5737
5720
  ref,
5738
5721
  children: /* @__PURE__ */jsxRuntime.jsxs("svg", {
5739
5722
  width: DEFAULT_POPOVER_ARROW_WIDTH,
@@ -5747,7 +5730,7 @@ const PopoverArrow = react.forwardRef(function PopoverArrow2(props, ref) {
5747
5730
  d: "M1.18342 0C3.59749 0 5.88246 1.0901 7.40138 2.96642L11.9455 8.57975C12.746 9.56855 14.254 9.56855 15.0545 8.57975L19.5986 2.96641C21.1175 1.0901 23.4025 0 25.8166 0H27H0H1.18342Z"
5748
5731
  })]
5749
5732
  })
5750
- }));
5733
+ });
5751
5734
  });
5752
5735
  function popoverCardStyle(props) {
5753
5736
  const {
@@ -5767,39 +5750,40 @@ const Root$i = react.memo(styled__default.default(Card)(popoverCardStyle));
5767
5750
  const PopoverContainer = react.memo(styled__default.default(Container)(_templateObject36 || (_templateObject36 = _taggedTemplateLiteral(["\n max-height: inherit;\n max-width: inherit;\n"]))));
5768
5751
  const PopoverCard = react.memo(react.forwardRef(function PopoverCard2(props, ref) {
5769
5752
  const {
5770
- __unstable_margins: marginsProp,
5771
- arrow,
5772
- arrowRef,
5773
- arrowX,
5774
- arrowY,
5775
- boundaryWidth,
5776
- children,
5777
- padding,
5778
- placement,
5779
- overflow,
5780
- radius,
5781
- scheme,
5782
- shadow,
5783
- strategy,
5784
- style,
5785
- tone,
5786
- width = "auto",
5787
- x: xProp,
5788
- y: yProp
5789
- } = props,
5790
- restProps = _objectWithoutProperties(props, _excluded22);
5753
+ __unstable_margins: marginsProp,
5754
+ arrow,
5755
+ arrowRef,
5756
+ arrowX,
5757
+ arrowY,
5758
+ boundaryWidth,
5759
+ children,
5760
+ padding,
5761
+ placement,
5762
+ overflow,
5763
+ radius,
5764
+ scheme,
5765
+ shadow,
5766
+ strategy,
5767
+ style,
5768
+ tone,
5769
+ width = "auto",
5770
+ x: xProp,
5771
+ y: yProp,
5772
+ ...restProps
5773
+ } = props;
5791
5774
  const {
5792
5775
  zIndex
5793
5776
  } = useLayer();
5794
5777
  const margins = react.useMemo(() => marginsProp || DEFAULT_POPOVER_MARGINS, [marginsProp]);
5795
5778
  const x = (xProp != null ? xProp : 0) + margins[3];
5796
5779
  const y = (yProp != null ? yProp : 0) + margins[0];
5797
- const rootStyle = react.useMemo(() => _objectSpread({
5780
+ const rootStyle = react.useMemo(() => ({
5798
5781
  position: strategy,
5799
5782
  top: y,
5800
5783
  left: x,
5801
- zIndex
5802
- }, style), [strategy, style, x, y, zIndex]);
5784
+ zIndex,
5785
+ ...style
5786
+ }), [strategy, style, x, y, zIndex]);
5803
5787
  const staticSide = placement && FLOATING_STATIC_SIDES[placement.split("-")[0]];
5804
5788
  const arrowStyle = react.useMemo(() => {
5805
5789
  const style2 = {
@@ -5811,7 +5795,8 @@ const PopoverCard = react.memo(react.forwardRef(function PopoverCard2(props, ref
5811
5795
  if (staticSide) style2[staticSide] = 0 - DEFAULT_POPOVER_ARROW_WIDTH;
5812
5796
  return style2;
5813
5797
  }, [arrowX, arrowY, staticSide]);
5814
- return /* @__PURE__ */jsxRuntime.jsxs(Root$i, _objectSpread(_objectSpread({}, restProps), {}, {
5798
+ return /* @__PURE__ */jsxRuntime.jsxs(Root$i, {
5799
+ ...restProps,
5815
5800
  $boundaryWidth: boundaryWidth,
5816
5801
  "data-placement": placement,
5817
5802
  "data-ui": "Popover",
@@ -5834,7 +5819,7 @@ const PopoverCard = react.memo(react.forwardRef(function PopoverCard2(props, ref
5834
5819
  ref: arrowRef,
5835
5820
  style: arrowStyle
5836
5821
  })]
5837
- }));
5822
+ });
5838
5823
  }));
5839
5824
  PopoverCard.displayName = "PopoverCard";
5840
5825
  const Popover = react.memo(react.forwardRef(function Popover2(props, ref) {
@@ -5842,30 +5827,30 @@ const Popover = react.memo(react.forwardRef(function Popover2(props, ref) {
5842
5827
  const theme = useTheme();
5843
5828
  const boundaryElementContext = useBoundaryElement();
5844
5829
  const {
5845
- __unstable_margins: margins = DEFAULT_POPOVER_MARGINS,
5846
- arrow: arrowProp = true,
5847
- boundaryElement = boundaryElementContext.element,
5848
- children: childProp,
5849
- constrainSize = false,
5850
- content,
5851
- disabled,
5852
- fallbackPlacements,
5853
- matchReferenceWidth: matchReferenceWidthProp,
5854
- open,
5855
- overflow = "hidden",
5856
- padding: paddingProp,
5857
- placement: placementProp = "bottom",
5858
- portal,
5859
- preventOverflow = true,
5860
- radius: radiusProp = 3,
5861
- referenceElement,
5862
- scheme,
5863
- shadow: shadowProp = 3,
5864
- tone = "inherit",
5865
- width: widthProp = "auto",
5866
- zOffset: zOffsetProp = (_a = theme.sanity.layer) == null ? void 0 : _a.popover.zOffset
5867
- } = props,
5868
- restProps = _objectWithoutProperties(props, _excluded23);
5830
+ __unstable_margins: margins = DEFAULT_POPOVER_MARGINS,
5831
+ arrow: arrowProp = true,
5832
+ boundaryElement = boundaryElementContext.element,
5833
+ children: childProp,
5834
+ constrainSize = false,
5835
+ content,
5836
+ disabled,
5837
+ fallbackPlacements,
5838
+ matchReferenceWidth: matchReferenceWidthProp,
5839
+ open,
5840
+ overflow = "hidden",
5841
+ padding: paddingProp,
5842
+ placement: placementProp = "bottom",
5843
+ portal,
5844
+ preventOverflow = true,
5845
+ radius: radiusProp = 3,
5846
+ referenceElement,
5847
+ scheme,
5848
+ shadow: shadowProp = 3,
5849
+ tone = "inherit",
5850
+ width: widthProp = "auto",
5851
+ zOffset: zOffsetProp = (_a = theme.sanity.layer) == null ? void 0 : _a.popover.zOffset,
5852
+ ...restProps
5853
+ } = props;
5869
5854
  const boundarySize = (_b = useElementSize(boundaryElement)) == null ? void 0 : _b.border;
5870
5855
  const padding = useArrayProp(paddingProp);
5871
5856
  const radius = useArrayProp(radiusProp);
@@ -5979,7 +5964,8 @@ const Popover = react.memo(react.forwardRef(function Popover2(props, ref) {
5979
5964
  }
5980
5965
  const popover = /* @__PURE__ */jsxRuntime.jsx(LayerProvider, {
5981
5966
  zOffset,
5982
- children: /* @__PURE__ */jsxRuntime.jsx(PopoverCard, _objectSpread(_objectSpread({}, restProps), {}, {
5967
+ children: /* @__PURE__ */jsxRuntime.jsx(PopoverCard, {
5968
+ ...restProps,
5983
5969
  __unstable_margins: margins,
5984
5970
  arrow: arrowProp,
5985
5971
  arrowRef: setArrow,
@@ -6000,7 +5986,7 @@ const Popover = react.memo(react.forwardRef(function Popover2(props, ref) {
6000
5986
  y,
6001
5987
  width,
6002
5988
  children: content
6003
- }))
5989
+ })
6004
5990
  });
6005
5991
  return /* @__PURE__ */jsxRuntime.jsxs(jsxRuntime.Fragment, {
6006
5992
  children: [open && /* @__PURE__ */jsxRuntime.jsx(jsxRuntime.Fragment, {
@@ -6043,27 +6029,27 @@ const Root$h = styled__default.default.div(radioBaseStyle);
6043
6029
  const Input$4 = styled__default.default.input(inputElementStyle);
6044
6030
  const Radio = react.forwardRef(function Radio2(props, forwardedRef) {
6045
6031
  const {
6046
- className,
6047
- disabled,
6048
- style,
6049
- customValidity,
6050
- readOnly
6051
- } = props,
6052
- restProps = _objectWithoutProperties(props, _excluded24);
6032
+ className,
6033
+ disabled,
6034
+ style,
6035
+ customValidity,
6036
+ readOnly,
6037
+ ...restProps
6038
+ } = props;
6053
6039
  const ref = useForwardedRef(forwardedRef);
6054
6040
  useCustomValidity(ref, customValidity);
6055
6041
  return /* @__PURE__ */jsxRuntime.jsxs(Root$h, {
6056
6042
  className,
6057
6043
  "data-ui": "Radio",
6058
6044
  style,
6059
- children: [/* @__PURE__ */jsxRuntime.jsx(Input$4, _objectSpread(_objectSpread({
6060
- "data-read-only": !disabled && readOnly ? "" : void 0
6061
- }, restProps), {}, {
6045
+ children: [/* @__PURE__ */jsxRuntime.jsx(Input$4, {
6046
+ "data-read-only": !disabled && readOnly ? "" : void 0,
6047
+ ...restProps,
6062
6048
  disabled: disabled || readOnly,
6063
6049
  readOnly,
6064
6050
  ref,
6065
6051
  type: "radio"
6066
- })), /* @__PURE__ */jsxRuntime.jsx("span", {})]
6052
+ }), /* @__PURE__ */jsxRuntime.jsx("span", {})]
6067
6053
  });
6068
6054
  });
6069
6055
  function rootStyle() {
@@ -6141,24 +6127,24 @@ const Input$3 = styled__default.default.select(selectStyle.input);
6141
6127
  const IconBox = styled__default.default(Box)(selectStyle.iconBox);
6142
6128
  const Select = react.forwardRef(function Select2(props, forwardedRef) {
6143
6129
  const {
6144
- children,
6145
- customValidity,
6146
- disabled,
6147
- fontSize = 2,
6148
- padding = 3,
6149
- radius = 1,
6150
- readOnly,
6151
- space = 3
6152
- } = props,
6153
- restProps = _objectWithoutProperties(props, _excluded25);
6130
+ children,
6131
+ customValidity,
6132
+ disabled,
6133
+ fontSize = 2,
6134
+ padding = 3,
6135
+ radius = 1,
6136
+ readOnly,
6137
+ space = 3,
6138
+ ...restProps
6139
+ } = props;
6154
6140
  const ref = useForwardedRef(forwardedRef);
6155
6141
  useCustomValidity(ref, customValidity);
6156
6142
  return /* @__PURE__ */jsxRuntime.jsxs(Root$g, {
6157
6143
  "data-ui": "Select",
6158
- children: [/* @__PURE__ */jsxRuntime.jsx(Input$3, _objectSpread(_objectSpread({
6144
+ children: [/* @__PURE__ */jsxRuntime.jsx(Input$3, {
6159
6145
  "data-read-only": !disabled && readOnly ? "" : void 0,
6160
- "data-ui": "Select"
6161
- }, restProps), {}, {
6146
+ "data-ui": "Select",
6147
+ ...restProps,
6162
6148
  $fontSize: useArrayProp(fontSize),
6163
6149
  $padding: useArrayProp(padding),
6164
6150
  $radius: useArrayProp(radius),
@@ -6166,7 +6152,7 @@ const Select = react.forwardRef(function Select2(props, forwardedRef) {
6166
6152
  disabled: disabled || readOnly,
6167
6153
  ref,
6168
6154
  children
6169
- })), /* @__PURE__ */jsxRuntime.jsx(IconBox, {
6155
+ }), /* @__PURE__ */jsxRuntime.jsx(IconBox, {
6170
6156
  padding,
6171
6157
  children: /* @__PURE__ */jsxRuntime.jsx(Text, {
6172
6158
  size: fontSize,
@@ -6203,18 +6189,18 @@ function responsiveStackSpaceStyle(props) {
6203
6189
  const Root$f = styled__default.default(Box)(stackBaseStyle, responsiveStackSpaceStyle);
6204
6190
  const Stack = react.forwardRef(function Stack2(props, ref) {
6205
6191
  const {
6206
- as,
6207
- space
6208
- } = props,
6209
- restProps = _objectWithoutProperties(props, _excluded26);
6210
- return /* @__PURE__ */jsxRuntime.jsx(Root$f, _objectSpread(_objectSpread({
6192
+ as,
6193
+ space,
6194
+ ...restProps
6195
+ } = props;
6196
+ return /* @__PURE__ */jsxRuntime.jsx(Root$f, {
6211
6197
  "data-as": typeof as === "string" ? as : void 0,
6212
- "data-ui": "Stack"
6213
- }, restProps), {}, {
6198
+ "data-ui": "Stack",
6199
+ ...restProps,
6214
6200
  $space: useArrayProp(space),
6215
6201
  forwardedAs: as,
6216
6202
  ref
6217
- }));
6203
+ });
6218
6204
  });
6219
6205
  function switchBaseStyles() {
6220
6206
  return styled.css(_templateObject43 || (_templateObject43 = _taggedTemplateLiteral(["\n position: relative;\n &:not([hidden]) {\n display: inline-block;\n }\n "])));
@@ -6268,14 +6254,14 @@ const Track = styled__default.default.span(switchTrackStyles);
6268
6254
  const Thumb = styled__default.default.span(switchThumbStyles);
6269
6255
  const Switch = react.forwardRef(function Switch2(props, forwardedRef) {
6270
6256
  const {
6271
- checked,
6272
- className,
6273
- disabled,
6274
- indeterminate,
6275
- readOnly,
6276
- style
6277
- } = props,
6278
- restProps = _objectWithoutProperties(props, _excluded27);
6257
+ checked,
6258
+ className,
6259
+ disabled,
6260
+ indeterminate,
6261
+ readOnly,
6262
+ style,
6263
+ ...restProps
6264
+ } = props;
6279
6265
  const ref = useForwardedRef(forwardedRef);
6280
6266
  react.useEffect(() => {
6281
6267
  if (ref.current) {
@@ -6286,14 +6272,14 @@ const Switch = react.forwardRef(function Switch2(props, forwardedRef) {
6286
6272
  className,
6287
6273
  "data-ui": "Switch",
6288
6274
  style,
6289
- children: [/* @__PURE__ */jsxRuntime.jsx(Input$2, _objectSpread(_objectSpread({
6290
- "data-read-only": !disabled && readOnly ? "" : void 0
6291
- }, restProps), {}, {
6275
+ children: [/* @__PURE__ */jsxRuntime.jsx(Input$2, {
6276
+ "data-read-only": !disabled && readOnly ? "" : void 0,
6277
+ ...restProps,
6292
6278
  checked: indeterminate !== true && checked,
6293
6279
  disabled: disabled || readOnly,
6294
6280
  type: "checkbox",
6295
6281
  ref
6296
- })), /* @__PURE__ */jsxRuntime.jsxs(Representation, {
6282
+ }), /* @__PURE__ */jsxRuntime.jsxs(Representation, {
6297
6283
  "aria-hidden": true,
6298
6284
  "data-name": "representation",
6299
6285
  children: [/* @__PURE__ */jsxRuntime.jsx(Track, {}), /* @__PURE__ */jsxRuntime.jsx(Thumb, {
@@ -6309,26 +6295,26 @@ const Input$1 = styled__default.default.textarea(responsiveInputPaddingStyle, te
6309
6295
  const Presentation$1 = styled__default.default.div(responsiveRadiusStyle, textInputRepresentationStyle);
6310
6296
  const TextArea = react.forwardRef(function TextArea2(props, forwardedRef) {
6311
6297
  const {
6312
- border = true,
6313
- customValidity,
6314
- disabled = false,
6315
- fontSize = 2,
6316
- padding = 3,
6317
- radius = 1,
6318
- weight
6319
- } = props,
6320
- restProps = _objectWithoutProperties(props, _excluded28);
6298
+ border = true,
6299
+ customValidity,
6300
+ disabled = false,
6301
+ fontSize = 2,
6302
+ padding = 3,
6303
+ radius = 1,
6304
+ weight,
6305
+ ...restProps
6306
+ } = props;
6321
6307
  const ref = useForwardedRef(forwardedRef);
6322
6308
  const rootTheme = useRootTheme();
6323
6309
  useCustomValidity(ref, customValidity);
6324
6310
  return /* @__PURE__ */jsxRuntime.jsx(Root$d, {
6325
6311
  "data-ui": "TextArea",
6326
6312
  children: /* @__PURE__ */jsxRuntime.jsxs(InputRoot$1, {
6327
- children: [/* @__PURE__ */jsxRuntime.jsx(Input$1, _objectSpread(_objectSpread({
6313
+ children: [/* @__PURE__ */jsxRuntime.jsx(Input$1, {
6328
6314
  "data-as": "textarea",
6329
6315
  "data-scheme": rootTheme.scheme,
6330
- "data-tone": rootTheme.tone
6331
- }, restProps), {}, {
6316
+ "data-tone": rootTheme.tone,
6317
+ ...restProps,
6332
6318
  $fontSize: useArrayProp(fontSize),
6333
6319
  $padding: useArrayProp(padding),
6334
6320
  $scheme: rootTheme.scheme,
@@ -6337,7 +6323,7 @@ const TextArea = react.forwardRef(function TextArea2(props, forwardedRef) {
6337
6323
  $weight: weight,
6338
6324
  disabled,
6339
6325
  ref
6340
- })), /* @__PURE__ */jsxRuntime.jsx(Presentation$1, {
6326
+ }), /* @__PURE__ */jsxRuntime.jsx(Presentation$1, {
6341
6327
  $radius: useArrayProp(radius),
6342
6328
  $scheme: rootTheme.scheme,
6343
6329
  $tone: rootTheme.tone,
@@ -6368,24 +6354,24 @@ const RightBox = styled__default.default(Box)(_templateObject55 || (_templateObj
6368
6354
  const RightCard = styled__default.default(Card)(_templateObject56 || (_templateObject56 = _taggedTemplateLiteral(["\n background-color: transparent;\n position: absolute;\n top: 0;\n right: 0;\n"])));
6369
6355
  const TextInput = react.forwardRef(function TextInput2(props, forwardedRef) {
6370
6356
  const {
6371
- border = true,
6372
- clearButton,
6373
- disabled = false,
6374
- fontSize: fontSizeProp = 2,
6375
- icon,
6376
- iconRight,
6377
- onClear,
6378
- padding: paddingProp = 3,
6379
- prefix,
6380
- radius: radiusProp = 1,
6381
- readOnly,
6382
- space: spaceProp = 3,
6383
- suffix,
6384
- customValidity,
6385
- type = "text",
6386
- weight
6387
- } = props,
6388
- restProps = _objectWithoutProperties(props, _excluded29);
6357
+ border = true,
6358
+ clearButton,
6359
+ disabled = false,
6360
+ fontSize: fontSizeProp = 2,
6361
+ icon,
6362
+ iconRight,
6363
+ onClear,
6364
+ padding: paddingProp = 3,
6365
+ prefix,
6366
+ radius: radiusProp = 1,
6367
+ readOnly,
6368
+ space: spaceProp = 3,
6369
+ suffix,
6370
+ customValidity,
6371
+ type = "text",
6372
+ weight,
6373
+ ...restProps
6374
+ } = props;
6389
6375
  const ref = useForwardedRef(forwardedRef);
6390
6376
  const rootTheme = useRootTheme();
6391
6377
  const fontSize = useArrayProp(fontSizeProp);
@@ -6461,18 +6447,18 @@ const TextInput = react.forwardRef(function TextInput2(props, forwardedRef) {
6461
6447
  padding: clearButtonBoxPadding,
6462
6448
  style: CLEAR_BUTTON_BOX_STYLE,
6463
6449
  tone: customValidity ? "critical" : "inherit",
6464
- children: /* @__PURE__ */jsxRuntime.jsx(Button, _objectSpread(_objectSpread({
6450
+ children: /* @__PURE__ */jsxRuntime.jsx(Button, {
6465
6451
  "aria-label": "Clear",
6466
6452
  "data-qa": "clear-button",
6467
6453
  fontSize,
6468
6454
  icon: icons.CloseIcon,
6469
6455
  mode: "bleed",
6470
6456
  padding: clearButtonPadding,
6471
- radius
6472
- }, clearButtonProps), {}, {
6457
+ radius,
6458
+ ...clearButtonProps,
6473
6459
  onClick: handleClearClick,
6474
6460
  onMouseDown: handleClearMouseDown
6475
- }))
6461
+ })
6476
6462
  }), [clearButton, clearButtonBoxPadding, clearButtonPadding, clearButtonProps, customValidity, disabled, fontSize, handleClearClick, handleClearMouseDown, radius, readOnly]);
6477
6463
  const suffixNode = react.useMemo(() => suffix && /* @__PURE__ */jsxRuntime.jsx(Suffix, {
6478
6464
  borderTop: true,
@@ -6489,11 +6475,11 @@ const TextInput = react.forwardRef(function TextInput2(props, forwardedRef) {
6489
6475
  "data-ui": "TextInput",
6490
6476
  tone: rootTheme.tone,
6491
6477
  children: [prefixNode, /* @__PURE__ */jsxRuntime.jsxs(InputRoot, {
6492
- children: [/* @__PURE__ */jsxRuntime.jsx(Input, _objectSpread(_objectSpread({
6478
+ children: [/* @__PURE__ */jsxRuntime.jsx(Input, {
6493
6479
  "data-as": "input",
6494
6480
  "data-scheme": rootTheme.scheme,
6495
- "data-tone": rootTheme.tone
6496
- }, restProps), {}, {
6481
+ "data-tone": rootTheme.tone,
6482
+ ...restProps,
6497
6483
  $fontSize: fontSize,
6498
6484
  $iconLeft: $hasIcon,
6499
6485
  $iconRight: $hasIconRight || $hasClearButton,
@@ -6506,7 +6492,7 @@ const TextInput = react.forwardRef(function TextInput2(props, forwardedRef) {
6506
6492
  readOnly,
6507
6493
  ref,
6508
6494
  type
6509
- })), presentationNode, clearButtonNode]
6495
+ }), presentationNode, clearButtonNode]
6510
6496
  }), suffixNode]
6511
6497
  });
6512
6498
  });
@@ -6514,10 +6500,12 @@ const Root$b = styled__default.default.div(_templateObject57 || (_templateObject
6514
6500
  const Border = styled__default.default.path(_templateObject58 || (_templateObject58 = _taggedTemplateLiteral(["\n fill: var(--card-shadow-outline-color);\n"])));
6515
6501
  const Shape = styled__default.default.path(_templateObject59 || (_templateObject59 = _taggedTemplateLiteral(["\n fill: var(--card-bg-color);\n"])));
6516
6502
  const TooltipArrow = react.forwardRef(function TooltipArrow2(props, ref) {
6517
- const restProps = _extends({}, (_objectDestructuringEmpty(props), props));
6518
- return /* @__PURE__ */jsxRuntime.jsx(Root$b, _objectSpread(_objectSpread({
6519
- "data-ui": "Tooltip__arrow"
6520
- }, restProps), {}, {
6503
+ const {
6504
+ ...restProps
6505
+ } = props;
6506
+ return /* @__PURE__ */jsxRuntime.jsx(Root$b, {
6507
+ "data-ui": "Tooltip__arrow",
6508
+ ...restProps,
6521
6509
  ref,
6522
6510
  children: /* @__PURE__ */jsxRuntime.jsxs("svg", {
6523
6511
  width: "15",
@@ -6529,7 +6517,7 @@ const TooltipArrow = react.forwardRef(function TooltipArrow2(props, ref) {
6529
6517
  d: "M0.156725 0C1.95632 0 3.66089 0.80776 4.80047 2.20057L5.95209 3.6081C6.75229 4.58614 8.24771 4.58614 9.04791 3.6081L10.1995 2.20057C11.3391 0.80776 13.0437 0 14.8433 0H15H0H0.156725Z"
6530
6518
  })]
6531
6519
  })
6532
- }));
6520
+ });
6533
6521
  });
6534
6522
  const Root$a = styled__default.default(Layer)(_templateObject60 || (_templateObject60 = _taggedTemplateLiteral(["\n pointer-events: none;\n"])));
6535
6523
  const Tooltip = react.forwardRef(function Tooltip2(props, ref) {
@@ -6537,19 +6525,19 @@ const Tooltip = react.forwardRef(function Tooltip2(props, ref) {
6537
6525
  const boundaryElementContext = useBoundaryElement();
6538
6526
  const theme = useTheme();
6539
6527
  const {
6540
- boundaryElement = boundaryElementContext == null ? void 0 : boundaryElementContext.element,
6541
- children: childProp,
6542
- content,
6543
- disabled,
6544
- fallbackPlacements: fallbackPlacementsProp,
6545
- padding,
6546
- placement: placementProp = "bottom",
6547
- portal,
6548
- scheme,
6549
- shadow = 2,
6550
- zOffset = (_a = theme.sanity.layer) == null ? void 0 : _a.tooltip.zOffset
6551
- } = props,
6552
- restProps = _objectWithoutProperties(props, _excluded30);
6528
+ boundaryElement = boundaryElementContext == null ? void 0 : boundaryElementContext.element,
6529
+ children: childProp,
6530
+ content,
6531
+ disabled,
6532
+ fallbackPlacements: fallbackPlacementsProp,
6533
+ padding,
6534
+ placement: placementProp = "bottom",
6535
+ portal,
6536
+ scheme,
6537
+ shadow = 2,
6538
+ zOffset = (_a = theme.sanity.layer) == null ? void 0 : _a.tooltip.zOffset,
6539
+ ...restProps
6540
+ } = props;
6553
6541
  const fallbackPlacements = useArrayProp(fallbackPlacementsProp);
6554
6542
  const forwardedRef = useForwardedRef(ref);
6555
6543
  const [referenceElement, setReferenceElement] = react.useState(null);
@@ -6665,9 +6653,9 @@ const Tooltip = react.forwardRef(function Tooltip2(props, ref) {
6665
6653
  }, [childProp, handleBlur, handleFocus, handleMouseEnter, handleMouseLeave, setReference]);
6666
6654
  if (!child) return /* @__PURE__ */jsxRuntime.jsx(jsxRuntime.Fragment, {});
6667
6655
  if (disabled) return child;
6668
- const root = /* @__PURE__ */jsxRuntime.jsx(Root$a, _objectSpread(_objectSpread({
6669
- "data-ui": "Tooltip"
6670
- }, restProps), {}, {
6656
+ const root = /* @__PURE__ */jsxRuntime.jsx(Root$a, {
6657
+ "data-ui": "Tooltip",
6658
+ ...restProps,
6671
6659
  ref: setFloating,
6672
6660
  style: rootStyle,
6673
6661
  zOffset,
@@ -6683,7 +6671,7 @@ const Tooltip = react.forwardRef(function Tooltip2(props, ref) {
6683
6671
  style: arrowStyle
6684
6672
  })]
6685
6673
  })
6686
- }));
6674
+ });
6687
6675
  return /* @__PURE__ */jsxRuntime.jsxs(jsxRuntime.Fragment, {
6688
6676
  children: [child, isOpen && /* @__PURE__ */jsxRuntime.jsx(jsxRuntime.Fragment, {
6689
6677
  children: portal ? /* @__PURE__ */jsxRuntime.jsx(Portal, {
@@ -6727,58 +6715,67 @@ function AutocompleteOption(props) {
6727
6715
  }
6728
6716
  function autocompleteReducer(state, msg) {
6729
6717
  if (msg.type === "input/change") {
6730
- return _objectSpread(_objectSpread({}, state), {}, {
6718
+ return {
6719
+ ...state,
6731
6720
  activeValue: null,
6732
6721
  focused: true,
6733
6722
  query: msg.query
6734
- });
6723
+ };
6735
6724
  }
6736
6725
  if (msg.type === "input/focus") {
6737
- return _objectSpread(_objectSpread({}, state), {}, {
6726
+ return {
6727
+ ...state,
6738
6728
  focused: true
6739
- });
6729
+ };
6740
6730
  }
6741
6731
  if (msg.type === "root/blur") {
6742
- return _objectSpread(_objectSpread({}, state), {}, {
6732
+ return {
6733
+ ...state,
6743
6734
  focused: false,
6744
6735
  query: null
6745
- });
6736
+ };
6746
6737
  }
6747
6738
  if (msg.type === "root/clear") {
6748
- return _objectSpread(_objectSpread({}, state), {}, {
6739
+ return {
6740
+ ...state,
6749
6741
  activeValue: null,
6750
6742
  query: null,
6751
6743
  value: null
6752
- });
6744
+ };
6753
6745
  }
6754
6746
  if (msg.type === "root/escape") {
6755
- return _objectSpread(_objectSpread({}, state), {}, {
6747
+ return {
6748
+ ...state,
6756
6749
  focused: false,
6757
6750
  query: null
6758
- });
6751
+ };
6759
6752
  }
6760
6753
  if (msg.type === "root/open") {
6761
- return _objectSpread(_objectSpread({}, state), {}, {
6754
+ return {
6755
+ ...state,
6762
6756
  query: state.query || msg.query
6763
- });
6757
+ };
6764
6758
  }
6765
6759
  if (msg.type === "root/setActiveValue") {
6766
- return _objectSpread(_objectSpread({}, state), {}, {
6760
+ return {
6761
+ ...state,
6767
6762
  activeValue: msg.value,
6768
6763
  listFocused: msg.listFocused || state.listFocused
6769
- });
6764
+ };
6770
6765
  }
6771
6766
  if (msg.type === "root/setListFocused") {
6772
- return _objectSpread(_objectSpread({}, state), {}, {
6767
+ return {
6768
+ ...state,
6773
6769
  listFocused: msg.listFocused
6774
- });
6770
+ };
6775
6771
  }
6776
6772
  if (msg.type === "value/change") {
6777
- return _objectSpread(_objectSpread({}, state), {}, {
6773
+ return {
6774
+ ...state,
6778
6775
  activeValue: msg.value,
6779
6776
  query: null,
6780
6777
  value: msg.value
6781
- });
6778
+ };
6782
6779
  }
6783
6780
  return state;
6784
6781
  }
@@ -6789,35 +6786,35 @@ const DEFAULT_RENDER_VALUE = (value, option) => option ? option.value : value;
6789
6786
  const DEFAULT_FILTER_OPTION = (query, option) => option.value.toLowerCase().indexOf(query.toLowerCase()) > -1;
6790
6787
  const InnerAutocomplete = react.forwardRef(function InnerAutocomplete2(props, ref) {
6791
6788
  const {
6792
- border = true,
6793
- customValidity,
6794
- disabled,
6795
- filterOption: filterOptionProp,
6796
- fontSize = 2,
6797
- icon,
6798
- id,
6799
- listBox = EMPTY_RECORD,
6800
- loading,
6801
- onBlur,
6802
- onChange,
6803
- onFocus,
6804
- onQueryChange,
6805
- onSelect,
6806
- openButton,
6807
- options: optionsProp,
6808
- padding: paddingProp = 3,
6809
- popover = EMPTY_RECORD,
6810
- prefix,
6811
- radius = 3,
6812
- readOnly,
6813
- relatedElements,
6814
- renderOption: renderOptionProp,
6815
- renderPopover,
6816
- renderValue = DEFAULT_RENDER_VALUE,
6817
- suffix,
6818
- value: valueProp
6819
- } = props,
6820
- restProps = _objectWithoutProperties(props, _excluded31);
6789
+ border = true,
6790
+ customValidity,
6791
+ disabled,
6792
+ filterOption: filterOptionProp,
6793
+ fontSize = 2,
6794
+ icon,
6795
+ id,
6796
+ listBox = EMPTY_RECORD,
6797
+ loading,
6798
+ onBlur,
6799
+ onChange,
6800
+ onFocus,
6801
+ onQueryChange,
6802
+ onSelect,
6803
+ openButton,
6804
+ options: optionsProp,
6805
+ padding: paddingProp = 3,
6806
+ popover = EMPTY_RECORD,
6807
+ prefix,
6808
+ radius = 3,
6809
+ readOnly,
6810
+ relatedElements,
6811
+ renderOption: renderOptionProp,
6812
+ renderPopover,
6813
+ renderValue = DEFAULT_RENDER_VALUE,
6814
+ suffix,
6815
+ value: valueProp,
6816
+ ...restProps
6817
+ } = props;
6821
6818
  const [state, dispatch] = react.useReducer(autocompleteReducer, {
6822
6819
  activeValue: valueProp || null,
6823
6820
  focused: false,
@@ -7080,16 +7077,16 @@ const InnerAutocomplete = react.forwardRef(function InnerAutocomplete2(props, re
7080
7077
  const openButtonNode = react.useMemo(() => !disabled && !readOnly && openButton ? /* @__PURE__ */jsxRuntime.jsx(Box, {
7081
7078
  "aria-hidden": expanded,
7082
7079
  padding: openButtonBoxPadding,
7083
- children: /* @__PURE__ */jsxRuntime.jsx(Button, _objectSpread(_objectSpread({
7080
+ children: /* @__PURE__ */jsxRuntime.jsx(Button, {
7084
7081
  "aria-label": "Open",
7085
7082
  disabled: expanded,
7086
7083
  fontSize,
7087
7084
  icon: icons.ChevronDownIcon,
7088
7085
  mode: "bleed",
7089
- padding: openButtonPadding
7090
- }, openButtonProps), {}, {
7086
+ padding: openButtonPadding,
7087
+ ...openButtonProps,
7091
7088
  onClick: handleOpenClick
7092
- }))
7089
+ })
7093
7090
  }) : void 0, [disabled, expanded, fontSize, handleOpenClick, openButton, openButtonBoxPadding, openButtonPadding, openButtonProps, readOnly]);
7094
7091
  const inputValue = react.useMemo(() => {
7095
7092
  if (query === null) {
@@ -7100,7 +7097,8 @@ const InnerAutocomplete = react.forwardRef(function InnerAutocomplete2(props, re
7100
7097
  }
7101
7098
  return query;
7102
7099
  }, [currentOption, query, renderValue, value]);
7103
- const input = /* @__PURE__ */jsxRuntime.jsx(TextInput, _objectSpread(_objectSpread({}, restProps), {}, {
7100
+ const input = /* @__PURE__ */jsxRuntime.jsx(TextInput, {
7101
+ ...restProps,
7104
7102
  "aria-activedescendant": activeItemId,
7105
7103
  "aria-autocomplete": "list",
7106
7104
  "aria-expanded": expanded,
@@ -7129,7 +7127,7 @@ const InnerAutocomplete = react.forwardRef(function InnerAutocomplete2(props, re
7129
7127
  spellCheck: false,
7130
7128
  suffix: suffix || openButtonNode,
7131
7129
  value: inputValue
7132
- }));
7130
+ });
7133
7131
  const handleListBoxKeyDown = react.useCallback(event => {
7134
7132
  var _a;
7135
7133
  if (event.key === "Tab") {
@@ -7138,11 +7136,11 @@ const InnerAutocomplete = react.forwardRef(function InnerAutocomplete2(props, re
7138
7136
  }, [listFocused]);
7139
7137
  const content = react.useMemo(() => {
7140
7138
  if (filteredOptions.length === 0) return null;
7141
- return /* @__PURE__ */jsxRuntime.jsx(ListBox, _objectSpread(_objectSpread({
7139
+ return /* @__PURE__ */jsxRuntime.jsx(ListBox, {
7142
7140
  "data-ui": "AutoComplete__results",
7143
7141
  onKeyDown: handleListBoxKeyDown,
7144
- padding: 1
7145
- }, listBox), {}, {
7142
+ padding: 1,
7143
+ ...listBox,
7146
7144
  tabIndex: -1,
7147
7145
  children: /* @__PURE__ */jsxRuntime.jsx(Stack, {
7148
7146
  as: "ul",
@@ -7167,7 +7165,7 @@ const InnerAutocomplete = react.forwardRef(function InnerAutocomplete2(props, re
7167
7165
  }, option.value);
7168
7166
  })
7169
7167
  })
7170
- }));
7168
+ });
7171
7169
  }, [activeValue, currentOption, filteredOptions, handleOptionSelect, handleListBoxKeyDown, id, listBox, listBoxId, listFocused, loading, renderOption]);
7172
7170
  const results = react.useMemo(() => {
7173
7171
  if (renderPopover) {
@@ -7182,7 +7180,7 @@ const InnerAutocomplete = react.forwardRef(function InnerAutocomplete2(props, re
7182
7180
  if (filteredOptionsLen === 0) {
7183
7181
  return null;
7184
7182
  }
7185
- return /* @__PURE__ */jsxRuntime.jsx(Popover, _objectSpread({
7183
+ return /* @__PURE__ */jsxRuntime.jsx(Popover, {
7186
7184
  arrow: false,
7187
7185
  constrainSize: true,
7188
7186
  content,
@@ -7196,8 +7194,9 @@ const InnerAutocomplete = react.forwardRef(function InnerAutocomplete2(props, re
7196
7194
  portal: true,
7197
7195
  radius,
7198
7196
  ref: resultsPopoverElementRef,
7199
- referenceElement: inputElementRef.current
7200
- }, popover));
7197
+ referenceElement: inputElementRef.current,
7198
+ ...popover
7199
+ });
7201
7200
  }, [content, expanded, filteredOptionsLen, handlePopoverMouseEnter, handlePopoverMouseLeave, popover, radius, renderPopover]);
7202
7201
  return /* @__PURE__ */jsxRuntime.jsxs(Root$9, {
7203
7202
  "data-ui": "Autocomplete",
@@ -7213,12 +7212,12 @@ const Root$8 = styled__default.default.ol(_templateObject65 || (_templateObject6
7213
7212
  const ExpandButton = styled__default.default(Button)(_templateObject66 || (_templateObject66 = _taggedTemplateLiteral(["\n appearance: none;\n margin: -4px;\n"])));
7214
7213
  const Breadcrumbs = react.forwardRef(function Breadcrumbs2(props, ref) {
7215
7214
  const {
7216
- children,
7217
- maxLength,
7218
- separator,
7219
- space: spaceRaw = 2
7220
- } = props,
7221
- restProps = _objectWithoutProperties(props, _excluded32);
7215
+ children,
7216
+ maxLength,
7217
+ separator,
7218
+ space: spaceRaw = 2,
7219
+ ...restProps
7220
+ } = props;
7222
7221
  const space = useArrayProp(spaceRaw);
7223
7222
  const [open, setOpen] = react.useState(false);
7224
7223
  const [expandElement, setExpandElement] = react.useState(null);
@@ -7260,9 +7259,9 @@ const Breadcrumbs = react.forwardRef(function Breadcrumbs2(props, ref) {
7260
7259
  }
7261
7260
  return rawItems;
7262
7261
  }, [collapse, expand, maxLength, open, rawItems, space]);
7263
- return /* @__PURE__ */jsxRuntime.jsx(Root$8, _objectSpread(_objectSpread({
7264
- "data-ui": "Breadcrumbs"
7265
- }, restProps), {}, {
7262
+ return /* @__PURE__ */jsxRuntime.jsx(Root$8, {
7263
+ "data-ui": "Breadcrumbs",
7264
+ ...restProps,
7266
7265
  ref,
7267
7266
  children: items.map((item, itemIndex) => /* @__PURE__ */jsxRuntime.jsxs(react.Fragment, {
7268
7267
  children: [itemIndex > 0 && /* @__PURE__ */jsxRuntime.jsx(Box, {
@@ -7278,7 +7277,7 @@ const Breadcrumbs = react.forwardRef(function Breadcrumbs2(props, ref) {
7278
7277
  children: item
7279
7278
  })]
7280
7279
  }, itemIndex))
7281
- }));
7280
+ });
7282
7281
  });
7283
7282
  function dialogStyle(_ref23) {
7284
7283
  let {
@@ -7431,25 +7430,25 @@ const Dialog = react.forwardRef(function Dialog2(props, ref) {
7431
7430
  const dialog = useDialog();
7432
7431
  const theme = useTheme();
7433
7432
  const {
7434
- __unstable_autoFocus: autoFocus = true,
7435
- __unstable_hideCloseButton: hideCloseButton = false,
7436
- cardRadius: cardRadiusProp = 3,
7437
- cardShadow = 4,
7438
- children,
7439
- contentRef,
7440
- footer,
7441
- header,
7442
- id,
7443
- onClickOutside,
7444
- onClose,
7445
- padding: paddingProp = 4,
7446
- portal,
7447
- position: positionProp = dialog.position || "fixed",
7448
- scheme,
7449
- width: widthProp = 0,
7450
- zOffset: zOffsetProp = dialog.zOffset || ((_a = theme.sanity.layer) == null ? void 0 : _a.dialog.zOffset)
7451
- } = props,
7452
- restProps = _objectWithoutProperties(props, _excluded33);
7433
+ __unstable_autoFocus: autoFocus = true,
7434
+ __unstable_hideCloseButton: hideCloseButton = false,
7435
+ cardRadius: cardRadiusProp = 3,
7436
+ cardShadow = 4,
7437
+ children,
7438
+ contentRef,
7439
+ footer,
7440
+ header,
7441
+ id,
7442
+ onClickOutside,
7443
+ onClose,
7444
+ padding: paddingProp = 4,
7445
+ portal,
7446
+ position: positionProp = dialog.position || "fixed",
7447
+ scheme,
7448
+ width: widthProp = 0,
7449
+ zOffset: zOffsetProp = dialog.zOffset || ((_a = theme.sanity.layer) == null ? void 0 : _a.dialog.zOffset),
7450
+ ...restProps
7451
+ } = props;
7453
7452
  const cardRadius = useArrayProp(cardRadiusProp);
7454
7453
  const padding = useArrayProp(paddingProp);
7455
7454
  const position = useArrayProp(positionProp);
@@ -7476,7 +7475,8 @@ const Dialog = react.forwardRef(function Dialog2(props, ref) {
7476
7475
  const labelId = "".concat(id, "_label");
7477
7476
  return /* @__PURE__ */jsxRuntime.jsx(Portal, {
7478
7477
  __unstable_name: portal,
7479
- children: /* @__PURE__ */jsxRuntime.jsxs(Root$7, _objectSpread(_objectSpread({}, restProps), {}, {
7478
+ children: /* @__PURE__ */jsxRuntime.jsxs(Root$7, {
7479
+ ...restProps,
7480
7480
  $padding: padding,
7481
7481
  $position: position,
7482
7482
  "aria-labelledby": labelId,
@@ -7509,7 +7509,7 @@ const Dialog = react.forwardRef(function Dialog2(props, ref) {
7509
7509
  ref: postDivRef,
7510
7510
  tabIndex: 0
7511
7511
  })]
7512
- }))
7512
+ })
7513
7513
  });
7514
7514
  });
7515
7515
  function DialogProvider(props) {
@@ -7532,20 +7532,20 @@ const Root$6 = styled__default.default.kbd(_templateObject73 || (_templateObject
7532
7532
  const Key = styled__default.default(KBD)(_templateObject74 || (_templateObject74 = _taggedTemplateLiteral(["\n &:not([hidden]) {\n display: block;\n }\n"])));
7533
7533
  const Hotkeys = react.forwardRef(function Hotkeys2(props, ref) {
7534
7534
  const {
7535
- fontSize,
7536
- keys,
7537
- padding,
7538
- radius,
7539
- space: spaceProp = 1
7540
- } = props,
7541
- restProps = _objectWithoutProperties(props, _excluded34);
7535
+ fontSize,
7536
+ keys,
7537
+ padding,
7538
+ radius,
7539
+ space: spaceProp = 1,
7540
+ ...restProps
7541
+ } = props;
7542
7542
  const space = useArrayProp(spaceProp);
7543
7543
  if (!keys || keys.length === 0) {
7544
7544
  return /* @__PURE__ */jsxRuntime.jsx(jsxRuntime.Fragment, {});
7545
7545
  }
7546
- return /* @__PURE__ */jsxRuntime.jsx(Root$6, _objectSpread(_objectSpread({
7547
- "data-ui": "Hotkeys"
7548
- }, restProps), {}, {
7546
+ return /* @__PURE__ */jsxRuntime.jsx(Root$6, {
7547
+ "data-ui": "Hotkeys",
7548
+ ...restProps,
7549
7549
  ref,
7550
7550
  children: /* @__PURE__ */jsxRuntime.jsx(Inline, {
7551
7551
  as: "span",
@@ -7557,7 +7557,7 @@ const Hotkeys = react.forwardRef(function Hotkeys2(props, ref) {
7557
7557
  children: key
7558
7558
  }, i))
7559
7559
  })
7560
- }));
7560
+ });
7561
7561
  });
7562
7562
  const key$2 = Symbol.for("@sanity/ui/context/menu");
7563
7563
  globalScope[key$2] = globalScope[key$2] || react.createContext(null);
@@ -7753,21 +7753,23 @@ function useMenuController(props) {
7753
7753
  const Root$5 = styled__default.default(Box)(_templateObject75 || (_templateObject75 = _taggedTemplateLiteral(["\n outline: none;\n overflow: auto;\n"])));
7754
7754
  const Menu = react.forwardRef(function Menu2(props, ref) {
7755
7755
  const {
7756
- children,
7757
- focusFirst,
7758
- focusLast,
7759
- onClickOutside,
7760
- onEscape,
7761
- onItemClick,
7762
- onItemSelect,
7763
- onKeyDown,
7764
- originElement,
7765
- padding = 1,
7766
- registerElement,
7767
- shouldFocus = props.focusFirst && "first" || props.focusLast && "last" || null,
7768
- space = 1
7769
- } = props,
7770
- restProps = _objectWithoutProperties(props, _excluded35);
7756
+ children,
7757
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
7758
+ focusFirst,
7759
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
7760
+ focusLast,
7761
+ onClickOutside,
7762
+ onEscape,
7763
+ onItemClick,
7764
+ onItemSelect,
7765
+ onKeyDown,
7766
+ originElement,
7767
+ padding = 1,
7768
+ registerElement,
7769
+ shouldFocus = props.focusFirst && "first" || props.focusLast && "last" || null,
7770
+ space = 1,
7771
+ ...restProps
7772
+ } = props;
7771
7773
  const forwardedRef = useForwardedRef(ref);
7772
7774
  const {
7773
7775
  isTopLayer
@@ -7816,14 +7818,15 @@ const Menu = react.forwardRef(function Menu2(props, ref) {
7816
7818
  onItemMouseEnter: handleItemMouseEnter,
7817
7819
  onItemMouseLeave: handleItemMouseLeave,
7818
7820
  registerElement,
7821
+ // deprecated
7819
7822
  onMouseEnter: handleItemMouseEnter,
7820
7823
  onMouseLeave: handleItemMouseLeave
7821
7824
  }), [activeElement, activeIndex, mount, handleItemMouseEnter, handleItemMouseLeave, onClickOutside, onEscape, onItemClick, registerElement]);
7822
7825
  return /* @__PURE__ */jsxRuntime.jsx(MenuContext.Provider, {
7823
7826
  value,
7824
- children: /* @__PURE__ */jsxRuntime.jsx(Root$5, _objectSpread(_objectSpread({
7825
- "data-ui": "Menu"
7826
- }, restProps), {}, {
7827
+ children: /* @__PURE__ */jsxRuntime.jsx(Root$5, {
7828
+ "data-ui": "Menu",
7829
+ ...restProps,
7827
7830
  onKeyDown: handleKeyDown,
7828
7831
  padding,
7829
7832
  ref: handleRefChange,
@@ -7833,7 +7836,7 @@ const Menu = react.forwardRef(function Menu2(props, ref) {
7833
7836
  space,
7834
7837
  children
7835
7838
  })
7836
- }))
7839
+ })
7837
7840
  });
7838
7841
  });
7839
7842
  const MenuButton = react.forwardRef(function MenuButton2(props, ref) {
@@ -7956,22 +7959,23 @@ const MenuButton = react.forwardRef(function MenuButton2(props, ref) {
7956
7959
  ref: setButtonRef,
7957
7960
  selected: open
7958
7961
  }) : null, [buttonProp, handleButtonClick, handleButtonKeyDown, id, open, setButtonRef]);
7959
- const popoverProps = react.useMemo(() => _objectSpread({
7962
+ const popoverProps = react.useMemo(() => ({
7960
7963
  boundaryElement: deprecated_boundaryElement,
7961
7964
  overflow: "auto",
7962
7965
  placement: deprecated_placement,
7963
7966
  portal: deprecated_portal,
7964
7967
  preventOverflow: deprecated_preventOverflow,
7965
7968
  radius: deprecated_popoverRadius,
7966
- scheme: deprecated_popoverScheme
7967
- }, popover || {}), [deprecated_boundaryElement, deprecated_placement, deprecated_popoverRadius, deprecated_popoverScheme, deprecated_portal, deprecated_preventOverflow, popover]);
7968
- return /* @__PURE__ */jsxRuntime.jsx(Popover, _objectSpread(_objectSpread({
7969
- "data-ui": "MenuButton__popover"
7970
- }, popoverProps), {}, {
7969
+ scheme: deprecated_popoverScheme,
7970
+ ...(popover || {})
7971
+ }), [deprecated_boundaryElement, deprecated_placement, deprecated_popoverRadius, deprecated_popoverScheme, deprecated_portal, deprecated_preventOverflow, popover]);
7972
+ return /* @__PURE__ */jsxRuntime.jsx(Popover, {
7973
+ "data-ui": "MenuButton__popover",
7974
+ ...popoverProps,
7971
7975
  content: menu,
7972
7976
  open,
7973
7977
  children: button || /* @__PURE__ */jsxRuntime.jsx(jsxRuntime.Fragment, {})
7974
- }));
7978
+ });
7975
7979
  });
7976
7980
  const MenuDivider = styled__default.default.hr(_templateObject76 || (_templateObject76 = _taggedTemplateLiteral(["\n height: 1px;\n border: 0;\n background: var(--card-hairline-soft-color);\n margin: 0;\n"])));
7977
7981
  function selectableBaseStyle() {
@@ -8004,19 +8008,19 @@ function useMenu() {
8004
8008
  }
8005
8009
  function MenuGroup(props) {
8006
8010
  const {
8007
- as = "button",
8008
- children,
8009
- fontSize,
8010
- icon,
8011
- onClick,
8012
- padding = 3,
8013
- popover,
8014
- radius = 2,
8015
- space = 3,
8016
- text,
8017
- tone = "default"
8018
- } = props,
8019
- restProps = _objectWithoutProperties(props, _excluded36);
8011
+ as = "button",
8012
+ children,
8013
+ fontSize,
8014
+ icon,
8015
+ onClick,
8016
+ padding = 3,
8017
+ popover,
8018
+ radius = 2,
8019
+ space = 3,
8020
+ text,
8021
+ tone = "default",
8022
+ ...restProps
8023
+ } = props;
8020
8024
  const menu = useMenu();
8021
8025
  const {
8022
8026
  activeElement,
@@ -8091,15 +8095,16 @@ function MenuGroup(props) {
8091
8095
  return;
8092
8096
  }
8093
8097
  }, []);
8094
- return /* @__PURE__ */jsxRuntime.jsx(Popover, _objectSpread(_objectSpread({}, popover), {}, {
8098
+ return /* @__PURE__ */jsxRuntime.jsx(Popover, {
8099
+ ...popover,
8095
8100
  content: childMenu,
8096
8101
  "data-ui": "MenuGroup__popover",
8097
8102
  open,
8098
- children: /* @__PURE__ */jsxRuntime.jsx(Selectable, _objectSpread(_objectSpread({
8103
+ children: /* @__PURE__ */jsxRuntime.jsx(Selectable, {
8099
8104
  "data-as": as,
8100
8105
  "data-ui": "MenuGroup",
8101
- forwardedAs: as
8102
- }, restProps), {}, {
8106
+ forwardedAs: as,
8107
+ ...restProps,
8103
8108
  "aria-pressed": as === "button" ? withinMenu : void 0,
8104
8109
  "data-pressed": as !== "button" ? withinMenu : void 0,
8105
8110
  "data-selected": !withinMenu && active ? "" : void 0,
@@ -8134,34 +8139,34 @@ function MenuGroup(props) {
8134
8139
  })]
8135
8140
  })
8136
8141
  })
8137
- }))
8138
- }));
8142
+ })
8143
+ });
8139
8144
  }
8140
8145
  const MenuItem = react.forwardRef(function MenuItem2(props, forwardedRef) {
8141
8146
  const {
8142
- as = "button",
8143
- children,
8144
- disabled,
8145
- fontSize = 2,
8146
- hotkeys,
8147
- icon,
8148
- iconRight,
8149
- onClick,
8150
- padding = 3,
8151
- paddingX,
8152
- paddingY,
8153
- paddingTop,
8154
- paddingRight,
8155
- paddingBottom,
8156
- paddingLeft,
8157
- pressed,
8158
- radius = 2,
8159
- selected: selectedProp,
8160
- space = 3,
8161
- text,
8162
- tone = "default"
8163
- } = props,
8164
- restProps = _objectWithoutProperties(props, _excluded37);
8147
+ as = "button",
8148
+ children,
8149
+ disabled,
8150
+ fontSize = 2,
8151
+ hotkeys,
8152
+ icon,
8153
+ iconRight,
8154
+ onClick,
8155
+ padding = 3,
8156
+ paddingX,
8157
+ paddingY,
8158
+ paddingTop,
8159
+ paddingRight,
8160
+ paddingBottom,
8161
+ paddingLeft,
8162
+ pressed,
8163
+ radius = 2,
8164
+ selected: selectedProp,
8165
+ space = 3,
8166
+ text,
8167
+ tone = "default",
8168
+ ...restProps
8169
+ } = props;
8165
8170
  const menu = useMenu();
8166
8171
  const {
8167
8172
  activeElement,
@@ -8192,9 +8197,9 @@ const MenuItem = react.forwardRef(function MenuItem2(props, forwardedRef) {
8192
8197
  ref.current = el;
8193
8198
  setRootElement(el);
8194
8199
  }, [ref]);
8195
- return /* @__PURE__ */jsxRuntime.jsxs(Selectable, _objectSpread(_objectSpread({
8196
- "data-ui": "MenuItem"
8197
- }, restProps), {}, {
8200
+ return /* @__PURE__ */jsxRuntime.jsxs(Selectable, {
8201
+ "data-ui": "MenuItem",
8202
+ ...restProps,
8198
8203
  "aria-pressed": as === "button" && pressed,
8199
8204
  "data-pressed": as !== "button" && pressed ? "" : void 0,
8200
8205
  "data-selected": active ? "" : void 0,
@@ -8211,9 +8216,9 @@ const MenuItem = react.forwardRef(function MenuItem2(props, forwardedRef) {
8211
8216
  role: "menuitem",
8212
8217
  tabIndex: -1,
8213
8218
  type: as === "button" ? "button" : void 0,
8214
- children: [(icon || text || iconRight) && /* @__PURE__ */jsxRuntime.jsx(Box, _objectSpread(_objectSpread({
8215
- as: "span"
8216
- }, paddingProps), {}, {
8219
+ children: [(icon || text || iconRight) && /* @__PURE__ */jsxRuntime.jsx(Box, {
8220
+ as: "span",
8221
+ ...paddingProps,
8217
8222
  children: /* @__PURE__ */jsxRuntime.jsxs(Flex, {
8218
8223
  as: "span",
8219
8224
  children: [icon && /* @__PURE__ */jsxRuntime.jsxs(Text, {
@@ -8243,12 +8248,12 @@ const MenuItem = react.forwardRef(function MenuItem2(props, forwardedRef) {
8243
8248
  children: [react.isValidElement(iconRight) && iconRight, ReactIs.isValidElementType(iconRight) && react.createElement(iconRight)]
8244
8249
  })]
8245
8250
  })
8246
- })), children && /* @__PURE__ */jsxRuntime.jsx(Box, _objectSpread(_objectSpread({
8247
- as: "span"
8248
- }, paddingProps), {}, {
8251
+ }), children && /* @__PURE__ */jsxRuntime.jsx(Box, {
8252
+ as: "span",
8253
+ ...paddingProps,
8249
8254
  children
8250
- }))]
8251
- }));
8255
+ })]
8256
+ });
8252
8257
  });
8253
8258
  const keyframe = styled.keyframes(_templateObject79 || (_templateObject79 = _taggedTemplateLiteral(["\n 0% {\n background-position: 100%;\n }\n 100% {\n background-position: -100%;\n }\n"])));
8254
8259
  const animation = styled.css(_templateObject80 || (_templateObject80 = _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);
@@ -8266,11 +8271,11 @@ const skeletonStyle = styled.css(_templateObject81 || (_templateObject81 = _tagg
8266
8271
  const Root$4 = styled__default.default(Box)(responsiveRadiusStyle, skeletonStyle);
8267
8272
  const Skeleton = react.forwardRef(function Skeleton2(props, ref) {
8268
8273
  const {
8269
- animated = false,
8270
- delay,
8271
- radius
8272
- } = props,
8273
- restProps = _objectWithoutProperties(props, _excluded38);
8274
+ animated = false,
8275
+ delay,
8276
+ radius,
8277
+ ...restProps
8278
+ } = props;
8274
8279
  const [visible, setVisible] = react.useState(delay ? false : true);
8275
8280
  react.useEffect(() => {
8276
8281
  if (!delay) {
@@ -8283,12 +8288,13 @@ const Skeleton = react.forwardRef(function Skeleton2(props, ref) {
8283
8288
  clearTimeout(timeout);
8284
8289
  };
8285
8290
  }, [delay]);
8286
- return /* @__PURE__ */jsxRuntime.jsx(Root$4, _objectSpread(_objectSpread({}, restProps), {}, {
8291
+ return /* @__PURE__ */jsxRuntime.jsx(Root$4, {
8292
+ ...restProps,
8287
8293
  $animated: animated,
8288
8294
  $radius: useArrayProp(radius),
8289
8295
  $visible: visible,
8290
8296
  ref
8291
- }));
8297
+ });
8292
8298
  });
8293
8299
  const Root$3 = styled__default.default(Skeleton)(_ref26 => {
8294
8300
  let {
@@ -8311,65 +8317,69 @@ const Root$3 = styled__default.default(Skeleton)(_ref26 => {
8311
8317
  });
8312
8318
  const TextSkeleton = react.forwardRef(function TextSkeleton2(props, ref) {
8313
8319
  const {
8314
- size = 2
8315
- } = props,
8316
- restProps = _objectWithoutProperties(props, _excluded39);
8320
+ size = 2,
8321
+ ...restProps
8322
+ } = props;
8317
8323
  const $size = useArrayProp(size);
8318
- return /* @__PURE__ */jsxRuntime.jsx(Root$3, _objectSpread(_objectSpread({}, restProps), {}, {
8324
+ return /* @__PURE__ */jsxRuntime.jsx(Root$3, {
8325
+ ...restProps,
8319
8326
  $size,
8320
8327
  ref,
8321
8328
  $style: "text"
8322
- }));
8329
+ });
8323
8330
  });
8324
8331
  const LabelSkeleton = react.forwardRef(function TextSkeleton3(props, ref) {
8325
8332
  const {
8326
- size = 2
8327
- } = props,
8328
- restProps = _objectWithoutProperties(props, _excluded40);
8333
+ size = 2,
8334
+ ...restProps
8335
+ } = props;
8329
8336
  const $size = useArrayProp(size);
8330
- return /* @__PURE__ */jsxRuntime.jsx(Root$3, _objectSpread(_objectSpread({}, restProps), {}, {
8337
+ return /* @__PURE__ */jsxRuntime.jsx(Root$3, {
8338
+ ...restProps,
8331
8339
  $size,
8332
8340
  ref,
8333
8341
  $style: "label"
8334
- }));
8342
+ });
8335
8343
  });
8336
8344
  const HeadingSkeleton = react.forwardRef(function TextSkeleton4(props, ref) {
8337
8345
  const {
8338
- size = 2
8339
- } = props,
8340
- restProps = _objectWithoutProperties(props, _excluded41);
8346
+ size = 2,
8347
+ ...restProps
8348
+ } = props;
8341
8349
  const $size = useArrayProp(size);
8342
- return /* @__PURE__ */jsxRuntime.jsx(Root$3, _objectSpread(_objectSpread({}, restProps), {}, {
8350
+ return /* @__PURE__ */jsxRuntime.jsx(Root$3, {
8351
+ ...restProps,
8343
8352
  $size,
8344
8353
  ref,
8345
8354
  $style: "heading"
8346
- }));
8355
+ });
8347
8356
  });
8348
8357
  const CodeSkeleton = react.forwardRef(function TextSkeleton5(props, ref) {
8349
8358
  const {
8350
- size = 2
8351
- } = props,
8352
- restProps = _objectWithoutProperties(props, _excluded42);
8359
+ size = 2,
8360
+ ...restProps
8361
+ } = props;
8353
8362
  const $size = useArrayProp(size);
8354
- return /* @__PURE__ */jsxRuntime.jsx(Root$3, _objectSpread(_objectSpread({}, restProps), {}, {
8363
+ return /* @__PURE__ */jsxRuntime.jsx(Root$3, {
8364
+ ...restProps,
8355
8365
  $size,
8356
8366
  ref,
8357
8367
  $style: "code"
8358
- }));
8368
+ });
8359
8369
  });
8360
8370
  const Tab = react.forwardRef(function Tab2(props, forwardedRef) {
8361
8371
  const {
8362
- icon,
8363
- id,
8364
- focused,
8365
- fontSize,
8366
- label,
8367
- onClick,
8368
- onFocus,
8369
- padding = 2,
8370
- selected
8371
- } = props,
8372
- restProps = _objectWithoutProperties(props, _excluded43);
8372
+ icon,
8373
+ id,
8374
+ focused,
8375
+ fontSize,
8376
+ label,
8377
+ onClick,
8378
+ onFocus,
8379
+ padding = 2,
8380
+ selected,
8381
+ ...restProps
8382
+ } = props;
8373
8383
  const elementRef = react.useRef(null);
8374
8384
  const focusedRef = react.useRef(false);
8375
8385
  const handleBlur = react.useCallback(() => {
@@ -8390,9 +8400,9 @@ const Tab = react.forwardRef(function Tab2(props, forwardedRef) {
8390
8400
  elementRef.current = el;
8391
8401
  ref.current = el;
8392
8402
  };
8393
- return /* @__PURE__ */jsxRuntime.jsx(Button, _objectSpread(_objectSpread({
8394
- "data-ui": "Tab"
8395
- }, restProps), {}, {
8403
+ return /* @__PURE__ */jsxRuntime.jsx(Button, {
8404
+ "data-ui": "Tab",
8405
+ ...restProps,
8396
8406
  "aria-selected": selected ? "true" : "false",
8397
8407
  fontSize,
8398
8408
  icon,
@@ -8408,16 +8418,16 @@ const Tab = react.forwardRef(function Tab2(props, forwardedRef) {
8408
8418
  tabIndex: selected ? 0 : -1,
8409
8419
  text: label,
8410
8420
  type: "button"
8411
- }));
8421
+ });
8412
8422
  });
8413
8423
  function _isReactElement(node) {
8414
8424
  return Boolean(node);
8415
8425
  }
8416
8426
  const TabList = react.forwardRef(function TabList2(props, ref) {
8417
8427
  const {
8418
- children: childrenProp
8419
- } = props,
8420
- restProps = _objectWithoutProperties(props, _excluded44);
8428
+ children: childrenProp,
8429
+ ...restProps
8430
+ } = props;
8421
8431
  const [focusedIndex, setFocusedIndex] = react.useState(-1);
8422
8432
  const children = react.useMemo(() => childrenProp.filter(_isReactElement), [childrenProp]);
8423
8433
  const tabs = children.map((child, childIndex) => react.cloneElement(child, {
@@ -8437,29 +8447,29 @@ const TabList = react.forwardRef(function TabList2(props, ref) {
8437
8447
  setFocusedIndex(prevIndex => (prevIndex + 1) % numTabs);
8438
8448
  }
8439
8449
  }, [numTabs]);
8440
- return /* @__PURE__ */jsxRuntime.jsx(Inline, _objectSpread(_objectSpread({
8441
- "data-ui": "TabList"
8442
- }, restProps), {}, {
8450
+ return /* @__PURE__ */jsxRuntime.jsx(Inline, {
8451
+ "data-ui": "TabList",
8452
+ ...restProps,
8443
8453
  onKeyDown: handleKeyDown,
8444
8454
  ref,
8445
8455
  role: "tablist",
8446
8456
  children: tabs
8447
- }));
8457
+ });
8448
8458
  });
8449
8459
  const TabPanel = react.forwardRef(function TabPanel2(props, ref) {
8450
8460
  const {
8451
- flex
8452
- } = props,
8453
- restProps = _objectWithoutProperties(props, _excluded45);
8454
- return /* @__PURE__ */jsxRuntime.jsx(Box, _objectSpread(_objectSpread({
8455
- "data-ui": "TabPanel"
8456
- }, restProps), {}, {
8461
+ flex,
8462
+ ...restProps
8463
+ } = props;
8464
+ return /* @__PURE__ */jsxRuntime.jsx(Box, {
8465
+ "data-ui": "TabPanel",
8466
+ ...restProps,
8457
8467
  flex,
8458
8468
  ref,
8459
8469
  role: "tabpanel",
8460
8470
  tabIndex: props.tabIndex === void 0 ? 0 : props.tabIndex,
8461
8471
  children: props.children
8462
- }));
8472
+ });
8463
8473
  });
8464
8474
  const STATUS_CARD_TONE = {
8465
8475
  error: "critical",
@@ -8477,19 +8487,19 @@ const Root$2 = styled__default.default(Card)(_templateObject83 || (_templateObje
8477
8487
  const TextBox = styled__default.default(Flex)(_templateObject84 || (_templateObject84 = _taggedTemplateLiteral(["\n overflow-x: auto;\n"])));
8478
8488
  function Toast(props) {
8479
8489
  const {
8480
- closable,
8481
- description,
8482
- onClose,
8483
- title,
8484
- status
8485
- } = props,
8486
- restProps = _objectWithoutProperties(props, _excluded46);
8490
+ closable,
8491
+ description,
8492
+ onClose,
8493
+ title,
8494
+ status,
8495
+ ...restProps
8496
+ } = props;
8487
8497
  const cardTone = status ? STATUS_CARD_TONE[status] : "default";
8488
8498
  const role = status ? ROLES[status] : "status";
8489
- return /* @__PURE__ */jsxRuntime.jsx(Root$2, _objectSpread(_objectSpread({
8499
+ return /* @__PURE__ */jsxRuntime.jsx(Root$2, {
8490
8500
  "data-ui": "Toast",
8491
- role
8492
- }, restProps), {}, {
8501
+ role,
8502
+ ...restProps,
8493
8503
  marginTop: 3,
8494
8504
  radius: 2,
8495
8505
  shadow: 2,
@@ -8524,7 +8534,7 @@ function Toast(props) {
8524
8534
  })
8525
8535
  })]
8526
8536
  })
8527
- }));
8537
+ });
8528
8538
  }
8529
8539
  function useMounted() {
8530
8540
  const [mounted, mount] = react.useReducer(() => true, false);
@@ -8572,9 +8582,10 @@ function ToastProvider(props) {
8572
8582
  return prevState.filter(t => t.id !== id).concat([{
8573
8583
  dismiss,
8574
8584
  id,
8575
- params: _objectSpread(_objectSpread({}, params), {}, {
8585
+ params: {
8586
+ ...params,
8576
8587
  duration
8577
- })
8588
+ }
8578
8589
  }]);
8579
8590
  });
8580
8591
  if (toastsRef.current[id]) {
@@ -8741,10 +8752,10 @@ globalScope[key] = globalScope[key] || react.createContext(null);
8741
8752
  const TreeContext = globalScope[key];
8742
8753
  const Tree = react.memo(react.forwardRef(function Tree2(props, ref) {
8743
8754
  const {
8744
- children,
8745
- space = 1
8746
- } = props,
8747
- restProps = _objectWithoutProperties(props, _excluded47);
8755
+ children,
8756
+ space = 1,
8757
+ ...restProps
8758
+ } = props;
8748
8759
  const forwardedRef = useForwardedRef(ref);
8749
8760
  const [focusedElement, setFocusedElement] = react.useState(null);
8750
8761
  const focusedElementRef = react.useRef(focusedElement);
@@ -8759,7 +8770,8 @@ const Tree = react.memo(react.forwardRef(function Tree2(props, ref) {
8759
8770
  stateRef.current = state;
8760
8771
  }, [state]);
8761
8772
  const registerItem = react.useCallback((element, path2, expanded, selected) => {
8762
- setState(s => _objectSpread(_objectSpread({}, s), {}, {
8773
+ setState(s => ({
8774
+ ...s,
8763
8775
  [path2]: {
8764
8776
  element,
8765
8777
  expanded
@@ -8770,7 +8782,9 @@ const Tree = react.memo(react.forwardRef(function Tree2(props, ref) {
8770
8782
  }
8771
8783
  return () => {
8772
8784
  setState(s => {
8773
- const newState = _objectSpread({}, s);
8785
+ const newState = {
8786
+ ...s
8787
+ };
8774
8788
  delete newState[path2];
8775
8789
  return newState;
8776
8790
  });
@@ -8780,11 +8794,13 @@ const Tree = react.memo(react.forwardRef(function Tree2(props, ref) {
8780
8794
  setState(s => {
8781
8795
  const itemState = s[path2];
8782
8796
  if (!itemState) return s;
8783
- return _objectSpread(_objectSpread({}, s), {}, {
8784
- [path2]: _objectSpread(_objectSpread({}, itemState), {}, {
8797
+ return {
8798
+ ...s,
8799
+ [path2]: {
8800
+ ...itemState,
8785
8801
  expanded
8786
- })
8787
- });
8802
+ }
8803
+ };
8788
8804
  });
8789
8805
  }, []);
8790
8806
  const contextValue = react.useMemo(() => ({
@@ -8829,11 +8845,13 @@ const Tree = react.memo(react.forwardRef(function Tree2(props, ref) {
8829
8845
  setState(s => {
8830
8846
  const itemState2 = s[itemKey];
8831
8847
  if (!itemState2) return s;
8832
- return _objectSpread(_objectSpread({}, s), {}, {
8833
- [itemKey]: _objectSpread(_objectSpread({}, itemState2), {}, {
8848
+ return {
8849
+ ...s,
8850
+ [itemKey]: {
8851
+ ...itemState2,
8834
8852
  expanded: false
8835
- })
8836
- });
8853
+ }
8854
+ };
8837
8855
  });
8838
8856
  } else {
8839
8857
  const itemPath = itemKey.split("/");
@@ -8855,11 +8873,13 @@ const Tree = react.memo(react.forwardRef(function Tree2(props, ref) {
8855
8873
  setState(s => {
8856
8874
  const itemState = s[focusedKey];
8857
8875
  if (!itemState) return s;
8858
- return _objectSpread(_objectSpread({}, s), {}, {
8859
- [focusedKey]: _objectSpread(_objectSpread({}, itemState), {}, {
8876
+ return {
8877
+ ...s,
8878
+ [focusedKey]: {
8879
+ ...itemState,
8860
8880
  expanded: true
8861
- })
8862
- });
8881
+ }
8882
+ };
8863
8883
  });
8864
8884
  }
8865
8885
  return;
@@ -8872,16 +8892,16 @@ const Tree = react.memo(react.forwardRef(function Tree2(props, ref) {
8872
8892
  }, [children, forwardedRef]);
8873
8893
  return /* @__PURE__ */jsxRuntime.jsx(TreeContext.Provider, {
8874
8894
  value: contextValue,
8875
- children: /* @__PURE__ */jsxRuntime.jsx(Stack, _objectSpread(_objectSpread({
8895
+ children: /* @__PURE__ */jsxRuntime.jsx(Stack, {
8876
8896
  as: "ul",
8877
- "data-ui": "Tree"
8878
- }, restProps), {}, {
8897
+ "data-ui": "Tree",
8898
+ ...restProps,
8879
8899
  onKeyDown: handleKeyDown,
8880
8900
  ref: forwardedRef,
8881
8901
  role: "tree",
8882
8902
  space,
8883
8903
  children
8884
- }))
8904
+ })
8885
8905
  });
8886
8906
  }));
8887
8907
  Tree.displayName = "Tree";
@@ -8920,21 +8940,21 @@ function useTree() {
8920
8940
  }
8921
8941
  const TreeGroup = react.memo(function TreeGroup2(props) {
8922
8942
  const {
8923
- children,
8924
- expanded = false
8925
- } = props,
8926
- restProps = _objectWithoutProperties(props, _excluded48);
8943
+ children,
8944
+ expanded = false,
8945
+ ...restProps
8946
+ } = props;
8927
8947
  const tree = useTree();
8928
- return /* @__PURE__ */jsxRuntime.jsx(Stack, _objectSpread(_objectSpread({
8948
+ return /* @__PURE__ */jsxRuntime.jsx(Stack, {
8929
8949
  as: "ul",
8930
- "data-ui": "TreeGroup"
8931
- }, restProps), {}, {
8950
+ "data-ui": "TreeGroup",
8951
+ ...restProps,
8932
8952
  hidden: !expanded,
8933
8953
  marginTop: tree.space,
8934
8954
  role: "group",
8935
8955
  space: tree.space,
8936
8956
  children
8937
- }));
8957
+ });
8938
8958
  });
8939
8959
  const Root = react.memo(styled__default.default.li(treeItemRootStyle, treeItemRootColorStyle));
8940
8960
  const TreeItemBox = styled__default.default(Box).attrs({
@@ -8943,21 +8963,21 @@ const TreeItemBox = styled__default.default(Box).attrs({
8943
8963
  const ToggleArrowText = styled__default.default(Text)(_templateObject90 || (_templateObject90 = _taggedTemplateLiteral(["\n & > svg {\n transition: transform 100ms;\n }\n"])));
8944
8964
  const TreeItem = react.memo(function TreeItem2(props) {
8945
8965
  const {
8946
- children,
8947
- expanded: expandedProp = false,
8948
- fontSize,
8949
- href,
8950
- icon,
8951
- id: idProp,
8952
- muted,
8953
- onClick,
8954
- padding = 3,
8955
- selected = false,
8956
- space = 2,
8957
- text,
8958
- weight
8959
- } = props,
8960
- restProps = _objectWithoutProperties(props, _excluded49);
8966
+ children,
8967
+ expanded: expandedProp = false,
8968
+ fontSize,
8969
+ href,
8970
+ icon,
8971
+ id: idProp,
8972
+ muted,
8973
+ onClick,
8974
+ padding = 3,
8975
+ selected = false,
8976
+ space = 2,
8977
+ text,
8978
+ weight,
8979
+ ...restProps
8980
+ } = props;
8961
8981
  const rootRef = react.useRef(null);
8962
8982
  const treeitemRef = react.useRef(null);
8963
8983
  const tree = useTree();
@@ -8975,7 +8995,8 @@ const TreeItem = react.memo(function TreeItem2(props) {
8975
8995
  const focused = tree.focusedElement === rootRef.current;
8976
8996
  const expanded = (itemState == null ? void 0 : itemState.expanded) === void 0 ? expandedProp : (itemState == null ? void 0 : itemState.expanded) || false;
8977
8997
  const tabIndex = tree.focusedElement && tree.focusedElement === rootRef.current ? 0 : -1;
8978
- const contextValue = react.useMemo(() => _objectSpread(_objectSpread({}, tree), {}, {
8998
+ const contextValue = react.useMemo(() => ({
8999
+ ...tree,
8979
9000
  level: tree.level + 1,
8980
9001
  path: itemPath
8981
9002
  }), [itemPath, tree]);
@@ -9033,12 +9054,12 @@ const TreeItem = react.memo(function TreeItem2(props) {
9033
9054
  })]
9034
9055
  });
9035
9056
  if (href) {
9036
- return /* @__PURE__ */jsxRuntime.jsxs(Root, _objectSpread(_objectSpread({
9057
+ return /* @__PURE__ */jsxRuntime.jsxs(Root, {
9037
9058
  "data-selected": selected ? "" : void 0,
9038
9059
  "data-tree-id": id,
9039
9060
  "data-tree-key": itemKey,
9040
- "data-ui": "TreeItem"
9041
- }, restProps), {}, {
9061
+ "data-ui": "TreeItem",
9062
+ ...restProps,
9042
9063
  onClick: handleClick,
9043
9064
  ref: rootRef,
9044
9065
  role: "none",
@@ -9058,14 +9079,14 @@ const TreeItem = react.memo(function TreeItem2(props) {
9058
9079
  children
9059
9080
  })
9060
9081
  })]
9061
- }));
9082
+ });
9062
9083
  }
9063
- return /* @__PURE__ */jsxRuntime.jsxs(Root, _objectSpread(_objectSpread({
9084
+ return /* @__PURE__ */jsxRuntime.jsxs(Root, {
9064
9085
  "data-selected": selected ? "" : void 0,
9065
9086
  "data-ui": "TreeItem",
9066
9087
  "data-tree-id": id,
9067
- "data-tree-key": itemKey
9068
- }, restProps), {}, {
9088
+ "data-tree-key": itemKey,
9089
+ ...restProps,
9069
9090
  "aria-expanded": expanded,
9070
9091
  onClick: handleClick,
9071
9092
  onKeyDown: handleKeyDown,
@@ -9084,7 +9105,7 @@ const TreeItem = react.memo(function TreeItem2(props) {
9084
9105
  children
9085
9106
  })
9086
9107
  })]
9087
- }));
9108
+ });
9088
9109
  });
9089
9110
  exports.Autocomplete = Autocomplete;
9090
9111
  exports.Avatar = Avatar;