@sanity/ui 2.8.8 → 2.8.9

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.
package/dist/index.mjs CHANGED
@@ -37,7 +37,7 @@ function rem(pixelValue) {
37
37
  return pixelValue === 0 ? 0 : `${pixelValue / 16}rem`;
38
38
  }
39
39
  function _responsive(media, values, callback) {
40
- return ((values == null ? void 0 : values.map(callback)) || []).map((statement, mediaIndex) => mediaIndex === 0 ? statement : { [`@media screen and (min-width: ${media[mediaIndex - 1]}px)`]: statement });
40
+ return (values?.map(callback) || []).map((statement, mediaIndex) => mediaIndex === 0 ? statement : { [`@media screen and (min-width: ${media[mediaIndex - 1]}px)`]: statement });
41
41
  }
42
42
  function _getArrayProp(val, defaultVal) {
43
43
  return val === void 0 ? defaultVal || EMPTY_ARRAY : Array.isArray(val) ? val : [val];
@@ -123,7 +123,7 @@ function responsiveTextFont(props) {
123
123
  return responsiveFont("text", props);
124
124
  }
125
125
  function useArrayProp(val, defaultVal) {
126
- const __perf_hash__ = useMemo(() => JSON.stringify(val != null ? val : defaultVal), [defaultVal, val]);
126
+ const __perf_hash__ = useMemo(() => JSON.stringify(val ?? defaultVal), [defaultVal, val]);
127
127
  return useMemo(
128
128
  () => _getArrayProp(val, defaultVal),
129
129
  // Improve performance: Keep object identify for a given hash of the value
@@ -178,7 +178,7 @@ function useClickOutsideEvent(listener, elementsArg = () => EMPTY_ARRAY, boundar
178
178
  const target = evt.target;
179
179
  if (!(target instanceof Node))
180
180
  return;
181
- const resolvedBoundaryElement = boundaryElement == null ? void 0 : boundaryElement();
181
+ const resolvedBoundaryElement = boundaryElement?.();
182
182
  if (resolvedBoundaryElement && !resolvedBoundaryElement.contains(target))
183
183
  return;
184
184
  const elements = elementsArg().flat();
@@ -197,8 +197,7 @@ function useClickOutsideEvent(listener, elementsArg = () => EMPTY_ARRAY, boundar
197
197
  }
198
198
  function useCustomValidity(ref, customValidity) {
199
199
  useEffect(() => {
200
- var _a;
201
- (_a = ref.current) == null || _a.setCustomValidity(customValidity || "");
200
+ ref.current?.setCustomValidity(customValidity || "");
202
201
  }, [customValidity, ref]);
203
202
  }
204
203
  var resizeObservers = [], hasActiveObservations = function() {
@@ -248,7 +247,7 @@ var freeze = function(obj) {
248
247
  var _a;
249
248
  if (obj instanceof Element)
250
249
  return !0;
251
- var scope = (_a = obj == null ? void 0 : obj.ownerDocument) === null || _a === void 0 ? void 0 : _a.defaultView;
250
+ var scope = (_a = obj?.ownerDocument) === null || _a === void 0 ? void 0 : _a.defaultView;
252
251
  return !!(scope && obj instanceof scope.Element);
253
252
  }, isReplacedElement = function(target) {
254
253
  switch (target.tagName) {
@@ -531,8 +530,7 @@ function useElementSize(element) {
531
530
  }, [element]), size2;
532
531
  }
533
532
  function useElementRect(element) {
534
- const elementSize = useElementSize(element);
535
- return (elementSize == null ? void 0 : elementSize._contentRect) || null;
533
+ return useElementSize(element)?._contentRect || null;
536
534
  }
537
535
  function useForwardedRef(ref) {
538
536
  const innerRef = useRef(null);
@@ -574,9 +572,9 @@ const ThemeContext = createGlobalScopedContext(
574
572
  function ThemeProvider(props) {
575
573
  const parentTheme = useContext(ThemeContext), {
576
574
  children,
577
- scheme = (parentTheme == null ? void 0 : parentTheme.scheme) || "light",
578
- theme: rootTheme = (parentTheme == null ? void 0 : parentTheme.theme) || null,
579
- tone = (parentTheme == null ? void 0 : parentTheme.tone) || "default"
575
+ scheme = parentTheme?.scheme || "light",
576
+ theme: rootTheme = parentTheme?.theme || null,
577
+ tone = parentTheme?.tone || "default"
580
578
  } = props, themeContext = useMemo(() => rootTheme ? {
581
579
  version: 0,
582
580
  theme: rootTheme,
@@ -654,8 +652,7 @@ function responsiveBorderStyle() {
654
652
  return [border, borderTop, borderRight, borderBottom, borderLeft];
655
653
  }
656
654
  function border(props) {
657
- var _a, _b;
658
- const { card, media } = getTheme_v2(props.theme), borderStyle = `${(_b = (_a = card.border) == null ? void 0 : _a.width) != null ? _b : 1}px solid var(--card-border-color)`;
655
+ const { card, media } = getTheme_v2(props.theme), borderStyle = `${card.border?.width ?? 1}px solid var(--card-border-color)`;
659
656
  return _responsive(
660
657
  media,
661
658
  props.$border,
@@ -663,8 +660,7 @@ function border(props) {
663
660
  );
664
661
  }
665
662
  function borderTop(props) {
666
- var _a, _b;
667
- const { card, media } = getTheme_v2(props.theme), borderStyle = `${(_b = (_a = card.border) == null ? void 0 : _a.width) != null ? _b : 1}px solid var(--card-border-color)`;
663
+ const { card, media } = getTheme_v2(props.theme), borderStyle = `${card.border?.width ?? 1}px solid var(--card-border-color)`;
668
664
  return _responsive(
669
665
  media,
670
666
  props.$borderTop,
@@ -672,8 +668,7 @@ function borderTop(props) {
672
668
  );
673
669
  }
674
670
  function borderRight(props) {
675
- var _a, _b;
676
- const { card, media } = getTheme_v2(props.theme), borderStyle = `${(_b = (_a = card.border) == null ? void 0 : _a.width) != null ? _b : 1}px solid var(--card-border-color)`;
671
+ const { card, media } = getTheme_v2(props.theme), borderStyle = `${card.border?.width ?? 1}px solid var(--card-border-color)`;
677
672
  return _responsive(
678
673
  media,
679
674
  props.$borderRight,
@@ -681,8 +676,7 @@ function borderRight(props) {
681
676
  );
682
677
  }
683
678
  function borderBottom(props) {
684
- var _a, _b;
685
- const { card, media } = getTheme_v2(props.theme), borderStyle = `${(_b = (_a = card.border) == null ? void 0 : _a.width) != null ? _b : 1}px solid var(--card-border-color)`;
679
+ const { card, media } = getTheme_v2(props.theme), borderStyle = `${card.border?.width ?? 1}px solid var(--card-border-color)`;
686
680
  return _responsive(
687
681
  media,
688
682
  props.$borderBottom,
@@ -690,8 +684,7 @@ function borderBottom(props) {
690
684
  );
691
685
  }
692
686
  function borderLeft(props) {
693
- var _a, _b;
694
- const { card, media } = getTheme_v2(props.theme), borderStyle = `${(_b = (_a = card.border) == null ? void 0 : _a.width) != null ? _b : 1}px solid var(--card-border-color)`;
687
+ const { card, media } = getTheme_v2(props.theme), borderStyle = `${card.border?.width ?? 1}px solid var(--card-border-color)`;
695
688
  return _responsive(
696
689
  media,
697
690
  props.$borderLeft,
@@ -1919,7 +1912,7 @@ function _cardColorStyle(base, color, checkered = !1) {
1919
1912
  function buttonBaseStyles(props) {
1920
1913
  const { $width } = props, { style } = getTheme_v2(props.theme);
1921
1914
  return css`
1922
- ${style == null ? void 0 : style.button};
1915
+ ${style?.button};
1923
1916
 
1924
1917
  -webkit-font-smoothing: inherit;
1925
1918
  appearance: none;
@@ -1962,7 +1955,6 @@ function combineBoxShadow(...boxShadows) {
1962
1955
  return boxShadows.filter(Boolean).join(",");
1963
1956
  }
1964
1957
  function buttonColorStyles(props) {
1965
- var _a;
1966
1958
  const { $mode } = props, { button, color: baseColor, style } = getTheme_v2(props.theme), shadow = props.$mode === "ghost", mode = baseColor.button[$mode] || baseColor.button.default, color = mode[props.$tone] || mode.default, border2 = {
1967
1959
  width: button.border.width,
1968
1960
  color: "var(--card-border-color)"
@@ -2000,7 +1992,7 @@ function buttonColorStyles(props) {
2000
1992
  "&[data-selected]": _cardColorStyle(baseColor, color.pressed)
2001
1993
  }
2002
1994
  },
2003
- (_a = style == null ? void 0 : style.button) == null ? void 0 : _a.root
1995
+ style?.button?.root
2004
1996
  ].filter(Boolean);
2005
1997
  }
2006
1998
  const Root$t = styled.button(responsiveRadiusStyle, buttonBaseStyles, buttonColorStyles), LoadingBox = styled.div`
@@ -2136,7 +2128,6 @@ function cardBaseStyle(props) {
2136
2128
  `;
2137
2129
  }
2138
2130
  function cardColorStyle(props) {
2139
- var _a;
2140
2131
  const { $checkered, $focusRing, $muted } = props, { card, color, style } = getTheme_v2(props.theme), border2 = { width: card.border.width, color: "var(--card-border-color)" };
2141
2132
  return css`
2142
2133
  color-scheme: ${color._dark ? "dark" : "light"};
@@ -2222,7 +2213,7 @@ function cardColorStyle(props) {
2222
2213
  }
2223
2214
  }
2224
2215
 
2225
- ${(_a = style == null ? void 0 : style.card) == null ? void 0 : _a.root}
2216
+ ${style?.card?.root}
2226
2217
  `;
2227
2218
  }
2228
2219
  const Root$s = styled(Box)(responsiveBorderStyle, responsiveRadiusStyle, responsiveShadowStyle, cardStyle), Card = forwardRef(function(props, ref) {
@@ -2715,8 +2706,7 @@ KBD.displayName = "ForwardRef(KBD)";
2715
2706
  const origin = {
2716
2707
  name: "@sanity/ui/origin",
2717
2708
  fn({ middlewareData, placement, rects }) {
2718
- var _a, _b;
2719
- const [side] = placement.split("-"), floatingWidth = rects.floating.width, floatingHeight = rects.floating.height, shiftX = ((_a = middlewareData.shift) == null ? void 0 : _a.x) || 0, shiftY = ((_b = middlewareData.shift) == null ? void 0 : _b.y) || 0;
2709
+ const [side] = placement.split("-"), floatingWidth = rects.floating.width, floatingHeight = rects.floating.height, shiftX = middlewareData.shift?.x || 0, shiftY = middlewareData.shift?.y || 0;
2720
2710
  if (floatingWidth <= 0 || floatingHeight <= 0)
2721
2711
  return {};
2722
2712
  const isVerticalPlacement = ["bottom", "top"].includes(side), { originX, originY } = isVerticalPlacement ? {
@@ -2898,10 +2888,7 @@ function findMinBreakpoints(media, width) {
2898
2888
  return ret;
2899
2889
  }
2900
2890
  const ElementQuery = forwardRef(function(props, forwardedRef) {
2901
- const theme = useTheme_v2(), { children, media = theme.media, ...restProps } = props, ref = useRef(null), [element, setElement] = useState(null), elementSize = useElementSize(element), width = useMemo(() => {
2902
- var _a;
2903
- return (_a = elementSize == null ? void 0 : elementSize.border.width) != null ? _a : window.innerWidth;
2904
- }, [elementSize]), max = useMemo(() => findMaxBreakpoints(media, width), [media, width]), min = useMemo(() => findMinBreakpoints(media, width), [media, width]);
2891
+ const theme = useTheme_v2(), { children, media = theme.media, ...restProps } = props, ref = useRef(null), [element, setElement] = useState(null), elementSize = useElementSize(element), width = useMemo(() => elementSize?.border.width ?? window.innerWidth, [elementSize]), max = useMemo(() => findMaxBreakpoints(media, width), [media, width]), min = useMemo(() => findMinBreakpoints(media, width), [media, width]);
2905
2892
  useImperativeHandle(forwardedRef, () => ref.current);
2906
2893
  const setRef = useCallback((el) => {
2907
2894
  ref.current = el, setElement(el);
@@ -2919,11 +2906,8 @@ const ElementQuery = forwardRef(function(props, forwardedRef) {
2919
2906
  );
2920
2907
  });
2921
2908
  ElementQuery.displayName = "ForwardRef(ElementQuery)";
2922
- var __defProp = Object.defineProperty, __defNormalProp = (obj, key2, value) => key2 in obj ? __defProp(obj, key2, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key2] = value, __publicField = (obj, key2, value) => __defNormalProp(obj, key2 + "", value);
2923
2909
  class ErrorBoundary extends Component {
2924
- constructor() {
2925
- super(...arguments), __publicField(this, "state", { error: null });
2926
- }
2910
+ state = { error: null };
2927
2911
  static getDerivedStateFromError(error) {
2928
2912
  return { error };
2929
2913
  }
@@ -2933,7 +2917,7 @@ class ErrorBoundary extends Component {
2933
2917
  render() {
2934
2918
  const { error } = this.state;
2935
2919
  if (error) {
2936
- const message = typeof (error == null ? void 0 : error.message) == "string" ? error.message : "Error";
2920
+ const message = typeof error?.message == "string" ? error.message : "Error";
2937
2921
  return /* @__PURE__ */ jsx(Code, { children: message });
2938
2922
  }
2939
2923
  return this.props.children;
@@ -3038,24 +3022,22 @@ function _isScrollable(el) {
3038
3022
  return style.overflowX.includes("auto") || style.overflowX.includes("scroll") || style.overflowY.includes("auto") || style.overflowY.includes("scroll");
3039
3023
  }
3040
3024
  function LayerProvider(props) {
3041
- var _a;
3042
- const { children, zOffset: zOffsetProp = 0 } = props, parentContextValue = useContext(LayerContext), parent = parentContextValue && getLayerContext(parentContextValue), parentRegisterChild = parent == null ? void 0 : parent.registerChild, level = ((_a = parent == null ? void 0 : parent.level) != null ? _a : 0) + 1, zOffset = useArrayProp(zOffsetProp), maxMediaIndex = zOffset.length - 1, mediaIndex = Math.min(useMediaIndex(), maxMediaIndex), zIndex = parent ? parent.zIndex + zOffset[mediaIndex] : zOffset[mediaIndex], [, setChildLayers] = useState({}), [size2, setSize] = useState(0), isTopLayer = size2 === 0, registerChild = useCallback(
3025
+ const { children, zOffset: zOffsetProp = 0 } = props, parentContextValue = useContext(LayerContext), parent = parentContextValue && getLayerContext(parentContextValue), parentRegisterChild = parent?.registerChild, level = (parent?.level ?? 0) + 1, zOffset = useArrayProp(zOffsetProp), maxMediaIndex = zOffset.length - 1, mediaIndex = Math.min(useMediaIndex(), maxMediaIndex), zIndex = parent ? parent.zIndex + zOffset[mediaIndex] : zOffset[mediaIndex], [, setChildLayers] = useState({}), [size2, setSize] = useState(0), isTopLayer = size2 === 0, registerChild = useCallback(
3043
3026
  (childLevel) => {
3044
- const parentDispose = parentRegisterChild == null ? void 0 : parentRegisterChild(childLevel);
3027
+ const parentDispose = parentRegisterChild?.(childLevel);
3045
3028
  return childLevel !== void 0 ? setChildLayers((state) => {
3046
- var _a2;
3047
- const prevLen = (_a2 = state[childLevel]) != null ? _a2 : 0, nextState = { ...state, [childLevel]: prevLen + 1 };
3029
+ const prevLen = state[childLevel] ?? 0, nextState = { ...state, [childLevel]: prevLen + 1 };
3048
3030
  return setSize(Object.keys(nextState).length), nextState;
3049
3031
  }) : setSize((v) => v + 1), () => {
3050
3032
  childLevel !== void 0 ? setChildLayers((state) => {
3051
3033
  const nextState = { ...state };
3052
3034
  return nextState[childLevel] === 1 ? (delete nextState[childLevel], setSize(Object.keys(nextState).length)) : nextState[childLevel] -= 1, nextState;
3053
- }) : setSize((v) => v - 1), parentDispose == null || parentDispose();
3035
+ }) : setSize((v) => v - 1), parentDispose?.();
3054
3036
  };
3055
3037
  },
3056
3038
  [parentRegisterChild]
3057
3039
  );
3058
- useEffect(() => parentRegisterChild == null ? void 0 : parentRegisterChild(level), [level, parentRegisterChild]);
3040
+ useEffect(() => parentRegisterChild?.(level), [level, parentRegisterChild]);
3059
3041
  const value = useMemo(
3060
3042
  () => ({
3061
3043
  version: 0,
@@ -3073,11 +3055,11 @@ LayerProvider.displayName = "LayerProvider";
3073
3055
  const Root$j = styled.div({ position: "relative" }), LayerChildren = forwardRef(function(props, forwardedRef) {
3074
3056
  const { children, onActivate, onFocus, style = EMPTY_RECORD, ...restProps } = props, { zIndex, isTopLayer } = useLayer(), lastFocusedRef = useRef(null), ref = useRef(null), isTopLayerRef = useRef(isTopLayer);
3075
3057
  useImperativeHandle(forwardedRef, () => ref.current), useEffect(() => {
3076
- isTopLayerRef.current !== isTopLayer && isTopLayer && (onActivate == null || onActivate({ activeElement: lastFocusedRef.current })), isTopLayerRef.current = isTopLayer;
3058
+ isTopLayerRef.current !== isTopLayer && isTopLayer && onActivate?.({ activeElement: lastFocusedRef.current }), isTopLayerRef.current = isTopLayer;
3077
3059
  }, [isTopLayer, onActivate]);
3078
3060
  const handleFocus = useCallback(
3079
3061
  (event) => {
3080
- onFocus == null || onFocus(event);
3062
+ onFocus?.(event);
3081
3063
  const rootElement = ref.current, target = document.activeElement;
3082
3064
  !isTopLayer || !rootElement || !target || isHTMLElement(target) && containsOrEqualsElement(rootElement, target) && (lastFocusedRef.current = target);
3083
3065
  },
@@ -3107,8 +3089,7 @@ function usePortal() {
3107
3089
  return value;
3108
3090
  }
3109
3091
  function Portal(props) {
3110
- var _a;
3111
- const { children, __unstable_name: name } = props, portal = usePortal(), portalElement = (name ? portal.elements && portal.elements[name] : portal.element) || ((_a = portal.elements) == null ? void 0 : _a.default);
3092
+ const { children, __unstable_name: name } = props, portal = usePortal(), portalElement = (name ? portal.elements && portal.elements[name] : portal.element) || portal.elements?.default;
3112
3093
  return portalElement ? createPortal(children, portalElement) : null;
3113
3094
  }
3114
3095
  Portal.displayName = "Portal";
@@ -3248,7 +3229,7 @@ function calcMaxWidth(params) {
3248
3229
  const { boundaryWidth, currentWidth } = params;
3249
3230
  if (!(currentWidth === void 0 && boundaryWidth === void 0))
3250
3231
  return Math.min(
3251
- currentWidth != null ? currentWidth : 1 / 0,
3232
+ currentWidth ?? 1 / 0,
3252
3233
  (boundaryWidth || 1 / 0) - DEFAULT_POPOVER_PADDING * 2
3253
3234
  );
3254
3235
  }
@@ -3291,7 +3272,7 @@ const MotionCard$1 = styled(motion(Card))`
3291
3272
  } = props, { zIndex } = useLayer(), margins = useMemo(
3292
3273
  () => marginsProp || DEFAULT_POPOVER_MARGINS,
3293
3274
  [marginsProp]
3294
- ), x = (xProp != null ? xProp : 0) + margins[3], y = (yProp != null ? yProp : 0) + margins[0], rootStyle2 = useMemo(
3275
+ ), x = (xProp ?? 0) + margins[3], y = (yProp ?? 0) + margins[0], rootStyle2 = useMemo(
3295
3276
  () => ({
3296
3277
  left: x,
3297
3278
  originX,
@@ -3347,7 +3328,6 @@ const MotionCard$1 = styled(motion(Card))`
3347
3328
  PopoverCard.displayName = "Memo(ForwardRef(PopoverCard))";
3348
3329
  const Popover = memo(
3349
3330
  forwardRef(function(props, forwardedRef) {
3350
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
3351
3331
  const { container, layer } = useTheme_v2(), boundaryElementContext = useBoundaryElement(), {
3352
3332
  __unstable_margins: margins = DEFAULT_POPOVER_MARGINS,
3353
3333
  animate: _animate = !1,
@@ -3357,9 +3337,9 @@ const Popover = memo(
3357
3337
  constrainSize = !1,
3358
3338
  content,
3359
3339
  disabled,
3360
- fallbackPlacements = (_b = props.fallbackPlacements) != null ? _b : DEFAULT_FALLBACK_PLACEMENTS$1[(_a = props.placement) != null ? _a : "bottom"],
3340
+ fallbackPlacements = props.fallbackPlacements ?? DEFAULT_FALLBACK_PLACEMENTS$1[props.placement ?? "bottom"],
3361
3341
  matchReferenceWidth,
3362
- floatingBoundary = (_c = props.boundaryElement) != null ? _c : boundaryElementContext.element,
3342
+ floatingBoundary = props.boundaryElement ?? boundaryElementContext.element,
3363
3343
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
3364
3344
  onActivate,
3365
3345
  open,
@@ -3369,7 +3349,7 @@ const Popover = memo(
3369
3349
  portal,
3370
3350
  preventOverflow = !0,
3371
3351
  radius: radiusProp = 3,
3372
- referenceBoundary = (_d = props.boundaryElement) != null ? _d : boundaryElementContext.element,
3352
+ referenceBoundary = props.boundaryElement ?? boundaryElementContext.element,
3373
3353
  referenceElement,
3374
3354
  scheme,
3375
3355
  shadow: shadowProp = 3,
@@ -3378,12 +3358,12 @@ const Popover = memo(
3378
3358
  zOffset: zOffsetProp = layer.popover.zOffset,
3379
3359
  updateRef,
3380
3360
  ...restProps
3381
- } = props, animate = usePrefersReducedMotion() ? !1 : _animate, boundarySize = (_e = useElementSize(boundaryElement)) == null ? void 0 : _e.border, padding = useArrayProp(paddingProp), radius = useArrayProp(radiusProp), shadow = useArrayProp(shadowProp), widthArrayProp = useArrayProp(widthProp), zOffset = useArrayProp(zOffsetProp), ref = useRef(null), arrowRef = useRef(null), rootBoundary = "viewport";
3361
+ } = props, animate = usePrefersReducedMotion() ? !1 : _animate, boundarySize = useElementSize(boundaryElement)?.border, padding = useArrayProp(paddingProp), radius = useArrayProp(radiusProp), shadow = useArrayProp(shadowProp), widthArrayProp = useArrayProp(widthProp), zOffset = useArrayProp(zOffsetProp), ref = useRef(null), arrowRef = useRef(null), rootBoundary = "viewport";
3382
3362
  useImperativeHandle(
3383
3363
  forwardedRef,
3384
3364
  () => ref.current
3385
3365
  );
3386
- const mediaIndex = useMediaIndex(), boundaryWidth = constrainSize || preventOverflow ? boundarySize == null ? void 0 : boundarySize.width : void 0, width = calcCurrentWidth({
3366
+ const mediaIndex = useMediaIndex(), boundaryWidth = constrainSize || preventOverflow ? boundarySize?.width : void 0, width = calcCurrentWidth({
3387
3367
  container,
3388
3368
  mediaIndex,
3389
3369
  width: widthArrayProp
@@ -3418,7 +3398,7 @@ const Popover = memo(
3418
3398
  const _currentWidth = widthRef.current, _maxWidth = maxWidthRef.current;
3419
3399
  matchReferenceWidth ? elements.floating.style.width = `${referenceWidth}px` : _currentWidth !== void 0 && (elements.floating.style.width = `${_currentWidth}px`), constrainSize && (elements.floating.style.maxWidth = `${Math.min(
3420
3400
  availableWidth,
3421
- _maxWidth != null ? _maxWidth : 1 / 0
3401
+ _maxWidth ?? 1 / 0
3422
3402
  )}px`, elements.floating.style.maxHeight = `${availableHeight}px`);
3423
3403
  },
3424
3404
  boundaryElement: floatingBoundary || void 0,
@@ -3459,7 +3439,7 @@ const Popover = memo(
3459
3439
  middleware,
3460
3440
  placement: placementProp,
3461
3441
  whileElementsMounted: autoUpdate
3462
- }), referenceHidden = (_f = middlewareData.hide) == null ? void 0 : _f.referenceHidden, arrowX = (_g = middlewareData.arrow) == null ? void 0 : _g.x, arrowY = (_h = middlewareData.arrow) == null ? void 0 : _h.y, originX = (_i = middlewareData["@sanity/ui/origin"]) == null ? void 0 : _i.originX, originY = (_j = middlewareData["@sanity/ui/origin"]) == null ? void 0 : _j.originY, setArrow = useCallback((arrowEl) => {
3442
+ }), referenceHidden = middlewareData.hide?.referenceHidden, arrowX = middlewareData.arrow?.x, arrowY = middlewareData.arrow?.y, originX = middlewareData["@sanity/ui/origin"]?.originX, originY = middlewareData["@sanity/ui/origin"]?.originY, setArrow = useCallback((arrowEl) => {
3463
3443
  arrowRef.current = arrowEl;
3464
3444
  }, []), setFloating = useCallback(
3465
3445
  (node) => {
@@ -3469,7 +3449,7 @@ const Popover = memo(
3469
3449
  ), setReference = useCallback(
3470
3450
  (node) => {
3471
3451
  refs.setReference(node);
3472
- const childRef = childProp == null ? void 0 : childProp.ref;
3452
+ const childRef = childProp?.ref;
3473
3453
  typeof childRef == "function" ? childRef(node) : childRef && (childRef.current = node);
3474
3454
  },
3475
3455
  [childProp, refs]
@@ -4164,8 +4144,7 @@ const CLEAR_BUTTON_BOX_STYLE = { zIndex: 2 }, Root$b = styled(Card).attrs({ forw
4164
4144
  event.preventDefault(), event.stopPropagation();
4165
4145
  }, []), handleClearClick = useCallback(
4166
4146
  (event) => {
4167
- var _a;
4168
- event.preventDefault(), event.stopPropagation(), onClear && onClear(), (_a = ref.current) == null || _a.focus();
4147
+ event.preventDefault(), event.stopPropagation(), onClear && onClear(), ref.current?.focus();
4169
4148
  },
4170
4149
  [onClear, ref]
4171
4150
  ), prefixNode = useMemo(
@@ -4393,7 +4372,7 @@ function useTooltipDelayGroup() {
4393
4372
  return useContext(TooltipDelayGroupContext);
4394
4373
  }
4395
4374
  function TooltipDelayGroupProvider(props) {
4396
- const { children, delay } = props, [isGroupActive, setIsGroupActive] = useDelayedState(!1), [openTooltipId, setOpenTooltipId] = useDelayedState(null), openDelay = typeof delay == "number" ? delay : (delay == null ? void 0 : delay.open) || 0, closeDelay = typeof delay == "number" ? delay : (delay == null ? void 0 : delay.close) || 0, value = useMemo(
4375
+ const { children, delay } = props, [isGroupActive, setIsGroupActive] = useDelayedState(!1), [openTooltipId, setOpenTooltipId] = useDelayedState(null), openDelay = typeof delay == "number" ? delay : delay?.open || 0, closeDelay = typeof delay == "number" ? delay : delay?.close || 0, value = useMemo(
4397
4376
  () => ({
4398
4377
  isGroupActive,
4399
4378
  setIsGroupActive,
@@ -4411,15 +4390,14 @@ TooltipDelayGroupProvider.displayName = "TooltipDelayGroupProvider";
4411
4390
  const Root$a = styled(Layer)`
4412
4391
  pointer-events: none;
4413
4392
  `, Tooltip = forwardRef(function(props, forwardedRef) {
4414
- var _a, _b, _c, _d, _e, _f, _g;
4415
4393
  const boundaryElementContext = useBoundaryElement(), { layer } = useTheme_v2(), {
4416
4394
  animate: _animate = !1,
4417
4395
  arrow: arrowProp = !1,
4418
- boundaryElement = boundaryElementContext == null ? void 0 : boundaryElementContext.element,
4396
+ boundaryElement = boundaryElementContext?.element,
4419
4397
  children: childProp,
4420
4398
  content,
4421
4399
  disabled,
4422
- fallbackPlacements: fallbackPlacementsProp = (_b = props.fallbackPlacements) != null ? _b : DEFAULT_FALLBACK_PLACEMENTS[(_a = props.placement) != null ? _a : "bottom"],
4400
+ fallbackPlacements: fallbackPlacementsProp = props.fallbackPlacements ?? DEFAULT_FALLBACK_PLACEMENTS[props.placement ?? "bottom"],
4423
4401
  padding = 2,
4424
4402
  placement: placementProp = "bottom",
4425
4403
  portal: portalProp,
@@ -4431,7 +4409,7 @@ const Root$a = styled(Layer)`
4431
4409
  ...restProps
4432
4410
  } = props, animate = usePrefersReducedMotion() ? !1 : _animate, fallbackPlacements = useArrayProp(fallbackPlacementsProp), ref = useRef(null), [referenceElement, setReferenceElement] = useState(null), arrowRef = useRef(null), rootBoundary = "viewport", [tooltipMaxWidth, setTooltipMaxWidth] = useState(0);
4433
4411
  useImperativeHandle(forwardedRef, () => ref.current);
4434
- const portal = usePortal(), portalElement = typeof portalProp == "string" ? ((_c = portal.elements) == null ? void 0 : _c[portalProp]) || null : portal.element, middleware = useMemo(() => {
4412
+ const portal = usePortal(), portalElement = typeof portalProp == "string" ? portal.elements?.[portalProp] || null : portal.element, middleware = useMemo(() => {
4435
4413
  const ret = [];
4436
4414
  return ret.push(
4437
4415
  flip({
@@ -4451,7 +4429,7 @@ const Root$a = styled(Layer)`
4451
4429
  middleware,
4452
4430
  placement: placementProp,
4453
4431
  whileElementsMounted: autoUpdate
4454
- }), arrowX = (_d = middlewareData.arrow) == null ? void 0 : _d.x, arrowY = (_e = middlewareData.arrow) == null ? void 0 : _e.y, originX = (_f = middlewareData["@sanity/ui/origin"]) == null ? void 0 : _f.originX, originY = (_g = middlewareData["@sanity/ui/origin"]) == null ? void 0 : _g.originY, tooltipId = useId(), [isOpen, setIsOpen] = useDelayedState(!1), delayGroupContext = useTooltipDelayGroup(), showTooltip = isOpen || (delayGroupContext == null ? void 0 : delayGroupContext.openTooltipId) === tooltipId, isInsideGroup = delayGroupContext !== null, openDelayProp = typeof delay == "number" ? delay : (delay == null ? void 0 : delay.open) || 0, closeDelayProp = typeof delay == "number" ? delay : (delay == null ? void 0 : delay.close) || 0, openDelay = isInsideGroup ? delayGroupContext.openDelay : openDelayProp, closeDelay = isInsideGroup ? delayGroupContext.closeDelay : closeDelayProp, handleIsOpenChange = useCallback(
4432
+ }), arrowX = middlewareData.arrow?.x, arrowY = middlewareData.arrow?.y, originX = middlewareData["@sanity/ui/origin"]?.originX, originY = middlewareData["@sanity/ui/origin"]?.originY, tooltipId = useId(), [isOpen, setIsOpen] = useDelayedState(!1), delayGroupContext = useTooltipDelayGroup(), showTooltip = isOpen || delayGroupContext?.openTooltipId === tooltipId, isInsideGroup = delayGroupContext !== null, openDelayProp = typeof delay == "number" ? delay : delay?.open || 0, closeDelayProp = typeof delay == "number" ? delay : delay?.close || 0, openDelay = isInsideGroup ? delayGroupContext.openDelay : openDelayProp, closeDelay = isInsideGroup ? delayGroupContext.closeDelay : closeDelayProp, handleIsOpenChange = useCallback(
4455
4433
  (open, immediate) => {
4456
4434
  if (isInsideGroup)
4457
4435
  if (open) {
@@ -4467,40 +4445,34 @@ const Root$a = styled(Layer)`
4467
4445
  [isInsideGroup, delayGroupContext, openDelay, tooltipId, closeDelay, setIsOpen]
4468
4446
  ), handleBlur = useCallback(
4469
4447
  (e) => {
4470
- var _a2, _b2;
4471
- handleIsOpenChange(!1), (_b2 = (_a2 = childProp == null ? void 0 : childProp.props) == null ? void 0 : _a2.onBlur) == null || _b2.call(_a2, e);
4448
+ handleIsOpenChange(!1), childProp?.props?.onBlur?.(e);
4472
4449
  },
4473
- [childProp == null ? void 0 : childProp.props, handleIsOpenChange]
4450
+ [childProp?.props, handleIsOpenChange]
4474
4451
  ), handleClick = useCallback(
4475
4452
  (e) => {
4476
- var _a2, _b2;
4477
- handleIsOpenChange(!1, !0), (_b2 = childProp == null ? void 0 : (_a2 = childProp.props).onClick) == null || _b2.call(_a2, e);
4453
+ handleIsOpenChange(!1, !0), childProp?.props.onClick?.(e);
4478
4454
  },
4479
- [childProp == null ? void 0 : childProp.props, handleIsOpenChange]
4455
+ [childProp?.props, handleIsOpenChange]
4480
4456
  ), handleContextMenu = useCallback(
4481
4457
  (e) => {
4482
- var _a2, _b2;
4483
- handleIsOpenChange(!1, !0), (_b2 = childProp == null ? void 0 : (_a2 = childProp.props).onContextMenu) == null || _b2.call(_a2, e);
4458
+ handleIsOpenChange(!1, !0), childProp?.props.onContextMenu?.(e);
4484
4459
  },
4485
- [childProp == null ? void 0 : childProp.props, handleIsOpenChange]
4460
+ [childProp?.props, handleIsOpenChange]
4486
4461
  ), handleFocus = useCallback(
4487
4462
  (e) => {
4488
- var _a2, _b2;
4489
- handleIsOpenChange(!0), (_b2 = (_a2 = childProp == null ? void 0 : childProp.props) == null ? void 0 : _a2.onFocus) == null || _b2.call(_a2, e);
4463
+ handleIsOpenChange(!0), childProp?.props?.onFocus?.(e);
4490
4464
  },
4491
- [childProp == null ? void 0 : childProp.props, handleIsOpenChange]
4465
+ [childProp?.props, handleIsOpenChange]
4492
4466
  ), handleMouseEnter = useCallback(
4493
4467
  (e) => {
4494
- var _a2, _b2;
4495
- handleIsOpenChange(!0), (_b2 = (_a2 = childProp == null ? void 0 : childProp.props) == null ? void 0 : _a2.onMouseEnter) == null || _b2.call(_a2, e);
4468
+ handleIsOpenChange(!0), childProp?.props?.onMouseEnter?.(e);
4496
4469
  },
4497
- [childProp == null ? void 0 : childProp.props, handleIsOpenChange]
4470
+ [childProp?.props, handleIsOpenChange]
4498
4471
  ), handleMouseLeave = useCallback(
4499
4472
  (e) => {
4500
- var _a2, _b2;
4501
- handleIsOpenChange(!1), (_b2 = (_a2 = childProp == null ? void 0 : childProp.props) == null ? void 0 : _a2.onMouseLeave) == null || _b2.call(_a2, e);
4473
+ handleIsOpenChange(!1), childProp?.props?.onMouseLeave?.(e);
4502
4474
  },
4503
- [childProp == null ? void 0 : childProp.props, handleIsOpenChange]
4475
+ [childProp?.props, handleIsOpenChange]
4504
4476
  );
4505
4477
  useCloseOnMouseLeave({ handleIsOpenChange, referenceElement, showTooltip }), useEffect(() => {
4506
4478
  disabled && showTooltip && handleIsOpenChange(!1);
@@ -4517,7 +4489,7 @@ const Root$a = styled(Layer)`
4517
4489
  }, [handleIsOpenChange, showTooltip]), useLayoutEffect(() => {
4518
4490
  const availableWidths = [
4519
4491
  ...boundaryElement ? [boundaryElement.offsetWidth] : [],
4520
- (portalElement == null ? void 0 : portalElement.offsetWidth) || document.body.offsetWidth
4492
+ portalElement?.offsetWidth || document.body.offsetWidth
4521
4493
  ];
4522
4494
  setTooltipMaxWidth(Math.min(...availableWidths) - DEFAULT_TOOLTIP_PADDING * 2);
4523
4495
  }, [boundaryElement, portalElement]);
@@ -4532,7 +4504,7 @@ const Root$a = styled(Layer)`
4532
4504
  },
4533
4505
  [refs]
4534
4506
  ), childRef = useRef(null);
4535
- useImperativeHandle(childProp == null ? void 0 : childProp.ref, () => childRef.current);
4507
+ useImperativeHandle(childProp?.ref, () => childRef.current);
4536
4508
  const child = useMemo(() => childProp ? cloneElement(childProp, {
4537
4509
  onBlur: handleBlur,
4538
4510
  onFocus: handleFocus,
@@ -4755,17 +4727,15 @@ const AUTOCOMPLETE_LISTBOX_IGNORE_KEYS = [
4755
4727
  },
4756
4728
  [onBlur, onQueryChange, relatedElements]
4757
4729
  ), handleRootFocus = useCallback((event) => {
4758
- const listBoxElement = listBoxElementRef.current, focusedElement = event.target instanceof HTMLElement ? event.target : null, listFocused2 = (listBoxElement == null ? void 0 : listBoxElement.contains(focusedElement)) || !1;
4730
+ const listBoxElement = listBoxElementRef.current, focusedElement = event.target instanceof HTMLElement ? event.target : null, listFocused2 = listBoxElement?.contains(focusedElement) || !1;
4759
4731
  listFocused2 !== listFocusedRef.current && (listFocusedRef.current = listFocused2, dispatch({ type: "root/setListFocused", listFocused: listFocused2 }));
4760
4732
  }, []), handleOptionSelect = useCallback(
4761
4733
  (v) => {
4762
- var _a;
4763
- dispatch({ type: "value/change", value: v }), popoverMouseWithinRef.current = !1, onSelect && onSelect(v), valueRef.current = v, onChange && onChange(v), onQueryChange && onQueryChange(null), (_a = inputElementRef.current) == null || _a.focus();
4734
+ dispatch({ type: "value/change", value: v }), popoverMouseWithinRef.current = !1, onSelect && onSelect(v), valueRef.current = v, onChange && onChange(v), onQueryChange && onQueryChange(null), inputElementRef.current?.focus();
4764
4735
  },
4765
4736
  [onChange, onSelect, onQueryChange]
4766
4737
  ), handleRootKeyDown = useCallback(
4767
4738
  (event) => {
4768
- var _a, _b;
4769
4739
  if (event.key === "ArrowDown") {
4770
4740
  if (event.preventDefault(), !filteredOptionsLen) return;
4771
4741
  const activeOption = filteredOptions.find((o) => o.value === activeValue), activeIndex = activeOption ? filteredOptions.indexOf(activeOption) : -1, nextActiveOption = filteredOptions[(activeIndex + 1) % filteredOptionsLen];
@@ -4779,12 +4749,12 @@ const AUTOCOMPLETE_LISTBOX_IGNORE_KEYS = [
4779
4749
  return;
4780
4750
  }
4781
4751
  if (event.key === "Escape") {
4782
- dispatch({ type: "root/escape" }), popoverMouseWithinRef.current = !1, onQueryChange && onQueryChange(null), (_a = inputElementRef.current) == null || _a.focus();
4752
+ dispatch({ type: "root/escape" }), popoverMouseWithinRef.current = !1, onQueryChange && onQueryChange(null), inputElementRef.current?.focus();
4783
4753
  return;
4784
4754
  }
4785
4755
  const target = event.target, listEl = listBoxElementRef.current;
4786
- if ((listEl === target || listEl != null && listEl.contains(target)) && !AUTOCOMPLETE_LISTBOX_IGNORE_KEYS.includes(event.key)) {
4787
- (_b = inputElementRef.current) == null || _b.focus();
4756
+ if ((listEl === target || listEl?.contains(target)) && !AUTOCOMPLETE_LISTBOX_IGNORE_KEYS.includes(event.key)) {
4757
+ inputElementRef.current?.focus();
4788
4758
  return;
4789
4759
  }
4790
4760
  },
@@ -4810,8 +4780,7 @@ const AUTOCOMPLETE_LISTBOX_IGNORE_KEYS = [
4810
4780
  }, []), handlePopoverMouseLeave = useCallback(() => {
4811
4781
  popoverMouseWithinRef.current = !1;
4812
4782
  }, []), handleClearButtonClick = useCallback(() => {
4813
- var _a;
4814
- dispatch({ type: "root/clear" }), valueRef.current = "", onChange && onChange(""), onQueryChange && onQueryChange(null), (_a = inputElementRef.current) == null || _a.focus();
4783
+ dispatch({ type: "root/clear" }), valueRef.current = "", onChange && onChange(""), onQueryChange && onQueryChange(null), inputElementRef.current?.focus();
4815
4784
  }, [onChange, onQueryChange]), handleClearButtonFocus = useCallback(() => {
4816
4785
  dispatch({ type: "input/focus" });
4817
4786
  }, []);
@@ -4850,10 +4819,7 @@ const AUTOCOMPLETE_LISTBOX_IGNORE_KEYS = [
4850
4819
  [openButton]
4851
4820
  ), handleOpenClick = useCallback(
4852
4821
  (event) => {
4853
- dispatchOpen(), openButtonProps.onClick && openButtonProps.onClick(event), _raf(() => {
4854
- var _a;
4855
- return (_a = inputElementRef.current) == null ? void 0 : _a.focus();
4856
- });
4822
+ dispatchOpen(), openButtonProps.onClick && openButtonProps.onClick(event), _raf(() => inputElementRef.current?.focus());
4857
4823
  },
4858
4824
  [openButtonProps, dispatchOpen]
4859
4825
  ), openButtonNode = useMemo(
@@ -4916,8 +4882,7 @@ const AUTOCOMPLETE_LISTBOX_IGNORE_KEYS = [
4916
4882
  }
4917
4883
  ), handleListBoxKeyDown = useCallback(
4918
4884
  (event) => {
4919
- var _a;
4920
- event.key === "Tab" && listFocused && ((_a = inputElementRef.current) == null || _a.focus());
4885
+ event.key === "Tab" && listFocused && inputElementRef.current?.focus();
4921
4886
  },
4922
4887
  [listFocused]
4923
4888
  ), content = useMemo(() => filteredOptions.length === 0 ? null : /* @__PURE__ */ jsx(
@@ -5172,7 +5137,6 @@ const Root$7 = styled(Layer)(responsivePaddingStyle, dialogStyle, responsiveDial
5172
5137
  position: relative;
5173
5138
  z-index: 3;
5174
5139
  `, DialogCard = forwardRef(function(props, forwardedRef) {
5175
- var _a;
5176
5140
  const {
5177
5141
  __unstable_autoFocus: autoFocus,
5178
5142
  __unstable_hideCloseButton: hideCloseButton,
@@ -5188,7 +5152,7 @@ const Root$7 = styled(Layer)(responsivePaddingStyle, dialogStyle, responsiveDial
5188
5152
  scheme,
5189
5153
  shadow: shadowProp,
5190
5154
  width: widthProp
5191
- } = props, portal = usePortal(), portalElement = portalProp ? ((_a = portal.elements) == null ? void 0 : _a[portalProp]) || null : portal.element, boundaryElement = useBoundaryElement().element, radius = useArrayProp(radiusProp), shadow = useArrayProp(shadowProp), width = useArrayProp(widthProp), ref = useRef(null), contentRef = useRef(null), layer = useLayer(), { isTopLayer } = layer, labelId = `${id}_label`, showCloseButton = !!onClose && hideCloseButton === !1, showHeader = !!header || showCloseButton;
5155
+ } = props, portal = usePortal(), portalElement = portalProp ? portal.elements?.[portalProp] || null : portal.element, boundaryElement = useBoundaryElement().element, radius = useArrayProp(radiusProp), shadow = useArrayProp(shadowProp), width = useArrayProp(widthProp), ref = useRef(null), contentRef = useRef(null), layer = useLayer(), { isTopLayer } = layer, labelId = `${id}_label`, showCloseButton = !!onClose && hideCloseButton === !1, showHeader = !!header || showCloseButton;
5192
5156
  return useImperativeHandle(forwardedRef, () => ref.current), useImperativeHandle(
5193
5157
  forwardedContentRef,
5194
5158
  () => contentRef.current
@@ -5230,7 +5194,6 @@ const Root$7 = styled(Layer)(responsivePaddingStyle, dialogStyle, responsiveDial
5230
5194
  });
5231
5195
  DialogCard.displayName = "ForwardRef(DialogCard)";
5232
5196
  const Dialog = forwardRef(function(props, ref) {
5233
- var _a;
5234
5197
  const dialog = useDialog(), { layer } = useTheme_v2(), {
5235
5198
  __unstable_autoFocus: autoFocus = !0,
5236
5199
  __unstable_hideCloseButton: hideCloseButton = !1,
@@ -5253,9 +5216,9 @@ const Dialog = forwardRef(function(props, ref) {
5253
5216
  zOffset: zOffsetProp = dialog.zOffset || layer.dialog.zOffset,
5254
5217
  animate: _animate = !1,
5255
5218
  ...restProps
5256
- } = props, animate = usePrefersReducedMotion() ? !1 : _animate, portal = usePortal(), portalElement = portalProp ? ((_a = portal.elements) == null ? void 0 : _a[portalProp]) || null : portal.element, boundaryElement = useBoundaryElement().element, cardRadius = useArrayProp(cardRadiusProp), padding = useArrayProp(paddingProp), position = useArrayProp(positionProp), width = useArrayProp(widthProp), zOffset = useArrayProp(zOffsetProp), preDivRef = useRef(null), postDivRef = useRef(null), cardRef = useRef(null), focusedElementRef = useRef(null), handleFocus = useCallback(
5219
+ } = props, animate = usePrefersReducedMotion() ? !1 : _animate, portal = usePortal(), portalElement = portalProp ? portal.elements?.[portalProp] || null : portal.element, boundaryElement = useBoundaryElement().element, cardRadius = useArrayProp(cardRadiusProp), padding = useArrayProp(paddingProp), position = useArrayProp(positionProp), width = useArrayProp(widthProp), zOffset = useArrayProp(zOffsetProp), preDivRef = useRef(null), postDivRef = useRef(null), cardRef = useRef(null), focusedElementRef = useRef(null), handleFocus = useCallback(
5257
5220
  (event) => {
5258
- onFocus == null || onFocus(event);
5221
+ onFocus?.(event);
5259
5222
  const target = event.target, cardElement = cardRef.current;
5260
5223
  if (cardElement && target === preDivRef.current) {
5261
5224
  focusLastDescendant(cardElement);
@@ -5466,8 +5429,7 @@ function useMenuController(props) {
5466
5429
  },
5467
5430
  [setActiveIndex]
5468
5431
  ), handleItemMouseLeave = useCallback(() => {
5469
- var _a;
5470
- setActiveIndex(-2), (_a = rootElementRef.current) == null || _a.focus();
5432
+ setActiveIndex(-2), rootElementRef.current?.focus();
5471
5433
  }, [rootElementRef, setActiveIndex]);
5472
5434
  return useEffect(() => {
5473
5435
  if (!mounted) return;
@@ -5489,8 +5451,7 @@ function useMenuController(props) {
5489
5451
  }
5490
5452
  return;
5491
5453
  }
5492
- const element = elementsRef.current[activeIndex] || null;
5493
- element == null || element.focus();
5454
+ (elementsRef.current[activeIndex] || null)?.focus();
5494
5455
  });
5495
5456
  return () => cancelAnimationFrame(rafId);
5496
5457
  }, [activeIndex, mounted, setActiveIndex, shouldFocus]), {
@@ -5678,20 +5639,17 @@ const MenuButton = forwardRef(function(props, forwardedRef) {
5678
5639
  shouldFocus
5679
5640
  ]
5680
5641
  ), menu = menuProp && cloneElement(menuProp, menuProps), ref = useRef(null), button = useMemo(
5681
- () => {
5682
- var _a;
5683
- return buttonProp && cloneElement(buttonProp, {
5684
- "data-ui": "MenuButton",
5685
- id,
5686
- onClick: handleButtonClick,
5687
- onKeyDown: handleButtonKeyDown,
5688
- onMouseDown: handleMouseDown,
5689
- "aria-haspopup": !0,
5690
- "aria-expanded": open,
5691
- ref,
5692
- selected: (_a = buttonProp.props.selected) != null ? _a : open
5693
- });
5694
- },
5642
+ () => buttonProp && cloneElement(buttonProp, {
5643
+ "data-ui": "MenuButton",
5644
+ id,
5645
+ onClick: handleButtonClick,
5646
+ onKeyDown: handleButtonKeyDown,
5647
+ onMouseDown: handleMouseDown,
5648
+ "aria-haspopup": !0,
5649
+ "aria-expanded": open,
5650
+ ref,
5651
+ selected: buttonProp.props.selected ?? open
5652
+ }),
5695
5653
  [buttonProp, handleButtonClick, handleButtonKeyDown, handleMouseDown, id, open]
5696
5654
  );
5697
5655
  useImperativeHandle(
@@ -5756,7 +5714,6 @@ function selectableBaseStyle() {
5756
5714
  `;
5757
5715
  }
5758
5716
  function selectableColorStyle(props) {
5759
- var _a;
5760
5717
  const { $tone } = props, { color, style } = getTheme_v2(props.theme), tone = color.selectable[$tone];
5761
5718
  return css`
5762
5719
  ${_cardColorStyle(color, tone.enabled)}
@@ -5825,7 +5782,7 @@ function selectableColorStyle(props) {
5825
5782
  }
5826
5783
  }
5827
5784
 
5828
- ${(_a = style == null ? void 0 : style.card) == null ? void 0 : _a.root}
5785
+ ${style?.card?.root}
5829
5786
  `;
5830
5787
  }
5831
5788
  const Selectable = styled(Box)(
@@ -5872,17 +5829,17 @@ function MenuGroup(props) {
5872
5829
  ), handleMenuKeyDown = useCallback(
5873
5830
  (event) => {
5874
5831
  event.key === "ArrowLeft" && (event.stopPropagation(), setOpen(!1), requestAnimationFrame(() => {
5875
- rootElement == null || rootElement.focus();
5832
+ rootElement?.focus();
5876
5833
  }));
5877
5834
  },
5878
5835
  [rootElement]
5879
5836
  ), handleClick = useCallback(
5880
5837
  (event) => {
5881
- onClick == null || onClick(event), setShouldFocus("first"), setOpen(!0);
5838
+ onClick?.(event), setShouldFocus("first"), setOpen(!0);
5882
5839
  },
5883
5840
  [onClick]
5884
5841
  ), handleChildItemClick = useCallback(() => {
5885
- setOpen(!1), onItemClick == null || onItemClick();
5842
+ setOpen(!1), onItemClick?.();
5886
5843
  }, [onItemClick]), handleMenuMouseEnter = useCallback(() => setWithinMenu(!0), []);
5887
5844
  useEffect(() => mount(rootElement), [mount, rootElement]), useEffect(() => {
5888
5845
  active || setOpen(!1);
@@ -6385,8 +6342,7 @@ function ToastProvider(props) {
6385
6342
  [prefersReducedMotion]
6386
6343
  ), value = useMemo(() => ({ version: 0, push: (params) => {
6387
6344
  const setState = (state2) => startTransition(() => _setState(state2)), id = params.id || String(toastId++), duration = params.duration || 5e3, dismiss = () => {
6388
- var _a;
6389
- const timeoutId = (_a = toastsRef.current[id]) == null ? void 0 : _a.timeoutId;
6345
+ const timeoutId = toastsRef.current[id]?.timeoutId;
6390
6346
  setState((prevState) => {
6391
6347
  const idx = prevState.findIndex((t) => t.id === id);
6392
6348
  if (idx > -1) {
@@ -6448,7 +6404,6 @@ function useToast() {
6448
6404
  return value;
6449
6405
  }
6450
6406
  function _findPrevItemElement(state, itemElements, focusedElement) {
6451
- var _a;
6452
6407
  const idx = itemElements.indexOf(focusedElement), els = itemElements.slice(0, idx), len = els.length;
6453
6408
  for (let i = len - 1; i >= 0; i -= 1) {
6454
6409
  const itemKey = els[i].getAttribute("data-tree-key");
@@ -6461,7 +6416,7 @@ function _findPrevItemElement(state, itemElements, focusedElement) {
6461
6416
  for (let j = 0; j < segments.length; j += 1) {
6462
6417
  p.push(segments[j]);
6463
6418
  const k = p.join("/");
6464
- if (!((_a = state[k]) != null && _a.expanded)) {
6419
+ if (!state[k]?.expanded) {
6465
6420
  expanded = !1;
6466
6421
  break;
6467
6422
  }
@@ -6472,7 +6427,6 @@ function _findPrevItemElement(state, itemElements, focusedElement) {
6472
6427
  return null;
6473
6428
  }
6474
6429
  function _findNextItemElement(state, itemElements, focusedElement) {
6475
- var _a;
6476
6430
  const idx = itemElements.indexOf(focusedElement), els = itemElements.slice(idx), len = itemElements.length;
6477
6431
  for (let i = 1; i < len; i += 1) {
6478
6432
  if (!els[i])
@@ -6487,7 +6441,7 @@ function _findNextItemElement(state, itemElements, focusedElement) {
6487
6441
  for (let j = 0; j < segments.length; j += 1) {
6488
6442
  p.push(segments[j]);
6489
6443
  const k = p.join("/");
6490
- if (!((_a = state[k]) != null && _a.expanded)) {
6444
+ if (!state[k]?.expanded) {
6491
6445
  expanded = !1;
6492
6446
  break;
6493
6447
  }
@@ -6545,7 +6499,6 @@ const TreeContext = createGlobalScopedContext(
6545
6499
  [focusedElement, itemElements, path, registerItem, setExpanded, space, state]
6546
6500
  ), handleKeyDown = useCallback(
6547
6501
  (event) => {
6548
- var _a;
6549
6502
  if (focusedElementRef.current) {
6550
6503
  if (event.key === "ArrowDown") {
6551
6504
  event.preventDefault();
@@ -6590,7 +6543,7 @@ const TreeContext = createGlobalScopedContext(
6590
6543
  event.preventDefault();
6591
6544
  const focusedKey = focusedElementRef.current.getAttribute("data-tree-key");
6592
6545
  if (!focusedKey) return;
6593
- (_a = stateRef.current[focusedKey]) != null && _a.expanded || setState((s) => {
6546
+ stateRef.current[focusedKey]?.expanded || setState((s) => {
6594
6547
  const itemState = s[focusedKey];
6595
6548
  return itemState ? { ...s, [focusedKey]: { ...itemState, expanded: !0 } } : s;
6596
6549
  });
@@ -6601,7 +6554,7 @@ const TreeContext = createGlobalScopedContext(
6601
6554
  [itemElements]
6602
6555
  ), handleFocus = useCallback(
6603
6556
  (event) => {
6604
- setFocusedElement(event.target), onFocus == null || onFocus(event);
6557
+ setFocusedElement(event.target), onFocus?.(event);
6605
6558
  },
6606
6559
  [onFocus]
6607
6560
  );
@@ -6756,7 +6709,7 @@ const TreeGroup = memo(function(props) {
6756
6709
  text,
6757
6710
  weight,
6758
6711
  ...restProps
6759
- } = props, rootRef = useRef(null), treeitemRef = useRef(null), tree = useTree(), { path, registerItem, setExpanded, setFocusedElement } = tree, _id = useId(), id = idProp || _id, itemPath = useMemo(() => path.concat([id || ""]), [id, path]), itemKey = itemPath.join("/"), itemState = tree.state[itemKey], focused = tree.focusedElement === rootRef.current, expanded = (itemState == null ? void 0 : itemState.expanded) === void 0 ? expandedProp : (itemState == null ? void 0 : itemState.expanded) || !1, tabIndex = tree.focusedElement && tree.focusedElement === rootRef.current ? 0 : -1, contextValue = useMemo(
6712
+ } = props, rootRef = useRef(null), treeitemRef = useRef(null), tree = useTree(), { path, registerItem, setExpanded, setFocusedElement } = tree, _id = useId(), id = idProp || _id, itemPath = useMemo(() => path.concat([id || ""]), [id, path]), itemKey = itemPath.join("/"), itemState = tree.state[itemKey], focused = tree.focusedElement === rootRef.current, expanded = itemState?.expanded === void 0 ? expandedProp : itemState?.expanded || !1, tabIndex = tree.focusedElement && tree.focusedElement === rootRef.current ? 0 : -1, contextValue = useMemo(
6760
6713
  () => ({ ...tree, level: tree.level + 1, path: itemPath }),
6761
6714
  [itemPath, tree]
6762
6715
  ), handleClick = useCallback(
@@ -6768,10 +6721,7 @@ const TreeGroup = memo(function(props) {
6768
6721
  [expanded, itemKey, onClick, setExpanded, setFocusedElement]
6769
6722
  ), handleKeyDown = useCallback(
6770
6723
  (event) => {
6771
- if (focused && event.key === "Enter") {
6772
- const el = treeitemRef.current || rootRef.current;
6773
- el == null || el.click();
6774
- }
6724
+ focused && event.key === "Enter" && (treeitemRef.current || rootRef.current)?.click();
6775
6725
  },
6776
6726
  [focused]
6777
6727
  );