@sanity/ui 3.0.0-static.10 → 3.0.0-static.3

package/dist/index.d.mts

@@ -1558,16 +1558,16 @@ export declare interface PopoverProps extends CardProps, LayerProps {
     ref: ForwardedRef<HTMLElement>
   }>
   /**
-   * When `true`, prevent overflow within the current boundary:
-   * - by flipping on its side axis
-   * - by resizing
-   *
-   * Note that:
-   * - setting `preventOverflow` to `true` also prevents overflow on its side axis
-   * - setting `matchReferenceWidth` to `true` also causes the popover to resize
-   *
-   * @defaultValue false
-   */
+     * When `true`, prevent overflow within the current boundary:
+     * - by flipping on its side axis
+     * - by resizing
+     /*
+     * Note that:
+     * - setting `preventOverflow` to `true` also prevents overflow on its side axis
+     * - setting `matchReferenceWidth` to `true` also causes the popover to resize
+     *
+     * @defaultValue false
+     */
   constrainSize?: boolean
   content?: ReactNode
   disabled?: boolean
@@ -1992,10 +1992,7 @@ export declare const Stack: ForwardRefExoticComponent<
  * @public
  */
 export declare interface StackProps
-  extends Omit<
-    BoxProps,
-    'align' | 'columns' | 'direction' | 'display' | 'gapX' | 'gapY' | 'justify'
-  > {
+  extends Omit<BoxProps, 'direction' | 'display' | 'gapX' | 'gapY'> {
   /** @deprecated Use `gap` instead. */
   space?: ResponsiveProp<Space>
 }

package/dist/index.d.ts

@@ -1558,16 +1558,16 @@ export declare interface PopoverProps extends CardProps, LayerProps {
     ref: ForwardedRef<HTMLElement>
   }>
   /**
-   * When `true`, prevent overflow within the current boundary:
-   * - by flipping on its side axis
-   * - by resizing
-   *
-   * Note that:
-   * - setting `preventOverflow` to `true` also prevents overflow on its side axis
-   * - setting `matchReferenceWidth` to `true` also causes the popover to resize
-   *
-   * @defaultValue false
-   */
+     * When `true`, prevent overflow within the current boundary:
+     * - by flipping on its side axis
+     * - by resizing
+     /*
+     * Note that:
+     * - setting `preventOverflow` to `true` also prevents overflow on its side axis
+     * - setting `matchReferenceWidth` to `true` also causes the popover to resize
+     *
+     * @defaultValue false
+     */
   constrainSize?: boolean
   content?: ReactNode
   disabled?: boolean
@@ -1992,10 +1992,7 @@ export declare const Stack: ForwardRefExoticComponent<
  * @public
  */
 export declare interface StackProps
-  extends Omit<
-    BoxProps,
-    'align' | 'columns' | 'direction' | 'display' | 'gapX' | 'gapY' | 'justify'
-  > {
+  extends Omit<BoxProps, 'direction' | 'display' | 'gapX' | 'gapY'> {
   /** @deprecated Use `gap` instead. */
   space?: ResponsiveProp<Space>
 }

package/dist/index.js

@@ -201,7 +201,7 @@ const AUTOCOMPLETE_LISTBOX_IGNORE_KEYS = ["Control", "Shift", "Alt", "Enter", "H
     customValidity,
     disabled,
     filterOption: filterOptionProp,
-    fontSize = 2,
+    fontSize = 1,
     icon,
     id,
     listBox = _visualEditing.EMPTY_RECORD,
@@ -240,7 +240,16 @@ const AUTOCOMPLETE_LISTBOX_IGNORE_KEYS = ["Control", "Shift", "Alt", "Enter", "H
     value
   } = state, defaultRenderOption = react.useCallback(({
     value: value_0
-  }) => /* @__PURE__ */ jsxRuntime.jsx(_visualEditing.Card, { as: "button", padding: paddingProp, radius: 2, tone: "inherit", children: /* @__PURE__ */ jsxRuntime.jsx(_visualEditing.Text, { size: fontSize, textOverflow: "ellipsis", children: value_0 }) }), [fontSize, paddingProp]), renderOption = typeof renderOptionProp == "function" ? renderOptionProp : defaultRenderOption, filterOption = typeof filterOptionProp == "function" ? filterOptionProp : DEFAULT_FILTER_OPTION, rootElementRef = react.useRef(null), resultsPopoverElementRef = react.useRef(null), inputElementRef = react.useRef(null), listBoxElementRef = react.useRef(null), listFocusedRef = react.useRef(!1), valueRef = react.useRef(value), valuePropRef = react.useRef(valueProp), popoverMouseWithinRef = react.useRef(!1);
+  }) => /* @__PURE__ */ jsxRuntime.jsx(
+    _visualEditing.Card,
+    {
+      as: "button",
+      padding: paddingProp,
+      radius: 2,
+      selectable: !0,
+      children: /* @__PURE__ */ jsxRuntime.jsx(_visualEditing.Text, { size: fontSize, textOverflow: "ellipsis", children: value_0 })
+    }
+  ), [fontSize, paddingProp]), renderOption = typeof renderOptionProp == "function" ? renderOptionProp : defaultRenderOption, filterOption = typeof filterOptionProp == "function" ? filterOptionProp : DEFAULT_FILTER_OPTION, rootElementRef = react.useRef(null), resultsPopoverElementRef = react.useRef(null), inputElementRef = react.useRef(null), listBoxElementRef = react.useRef(null), listFocusedRef = react.useRef(!1), valueRef = react.useRef(value), valuePropRef = react.useRef(valueProp), popoverMouseWithinRef = react.useRef(!1);
   react.useImperativeHandle(forwardedRef, () => inputElementRef.current);
   const listBoxId = `${id}-listbox`, options = Array.isArray(optionsProp) ? optionsProp : _visualEditing.EMPTY_ARRAY, padding = _visualEditing.useArrayProp(paddingProp), currentOption = react.useMemo(() => value !== null ? options.find((o) => o.value === value) : void 0, [options, value]), filteredOptions = react.useMemo(() => options.filter((option) => query ? filterOption(query, option) : !0), [filterOption, options, query]), filteredOptionsLen = filteredOptions.length, activeItemId = activeValue ? `${id}-option-${activeValue}` : void 0, expanded = query !== null && loading || focused && query !== null, handleRootBlur = react.useCallback((event) => {
     setTimeout(() => {
@@ -375,6 +384,7 @@ const AUTOCOMPLETE_LISTBOX_IGNORE_KEYS = ["Control", "Shift", "Alt", "Enter", "H
     return /* @__PURE__ */ jsxRuntime.jsx(AutocompleteOption, { id: `${id}-option-${option_0.value}`, onSelect: handleOptionSelect, selected: active, value: option_0.value, children: react.cloneElement(renderOption(option_0), {
       disabled: loading,
       selected: active,
+      selectable: !0,
       tabIndex: listFocused && active ? 0 : -1
     }) }, option_0.value);
   }) }) }), [activeValue, currentOption, filteredOptions, handleOptionSelect, handleListBoxKeyDown, id, listBox, listBoxId, listFocused, loading, renderOption]), results = react.useMemo(() => renderPopover ? renderPopover({
@@ -383,7 +393,7 @@ const AUTOCOMPLETE_LISTBOX_IGNORE_KEYS = ["Control", "Shift", "Alt", "Enter", "H
     inputElement: inputElementRef.current,
     onMouseEnter: handlePopoverMouseEnter,
     onMouseLeave: handlePopoverMouseLeave
-  }, resultsPopoverElementRef) : filteredOptionsLen === 0 ? null : /* @__PURE__ */ jsxRuntime.jsx(_visualEditing.Popover, { arrow: !1, constrainSize: !0, content: content2, fallbackPlacements: AUTOCOMPLETE_POPOVER_FALLBACK_PLACEMENTS, matchReferenceWidth: !0, onMouseEnter: handlePopoverMouseEnter, onMouseLeave: handlePopoverMouseLeave, open: expanded, overflow: "auto", placement: AUTOCOMPLETE_POPOVER_PLACEMENT, portal: !0, radius: 3, ref: resultsPopoverElementRef, referenceElement: inputElementRef.current, ...popover }), [content2, expanded, filteredOptionsLen, handlePopoverMouseEnter, handlePopoverMouseLeave, popover, renderPopover]);
+  }, resultsPopoverElementRef) : filteredOptionsLen === 0 ? null : /* @__PURE__ */ jsxRuntime.jsx(_visualEditing.Popover, { arrow: !1, constrainSize: !0, content: content2, fallbackPlacements: AUTOCOMPLETE_POPOVER_FALLBACK_PLACEMENTS, matchReferenceWidth: !0, onMouseEnter: handlePopoverMouseEnter, onMouseLeave: handlePopoverMouseLeave, open: expanded, overflow: "auto", placement: AUTOCOMPLETE_POPOVER_PLACEMENT, portal: !0, radius: 3, ref: resultsPopoverElementRef, referenceElement: inputElementRef.current, ...popover }), [content2, expanded, filteredOptionsLen, handlePopoverMouseEnter, handlePopoverMouseLeave, popover, radius, renderPopover]);
   return (
     // eslint-disable-next-line jsx-a11y/no-static-element-interactions
     /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-ui": "Autocomplete", onBlur: handleRootBlur, onFocus: handleRootFocus, onKeyDown: handleRootKeyDown, ref: rootElementRef, children: [
@@ -504,7 +514,9 @@ const DialogCard = react.forwardRef(function(props, forwardedRef) {
 });
 DialogCard.displayName = "ForwardRef(DialogCard)";
 const Dialog = react.forwardRef(function(props, ref) {
-  const $ = reactCompilerRuntime.c(66), context = useDialog();
+  const $ = reactCompilerRuntime.c(66), context = useDialog(), {
+    layer
+  } = _visualEditing.useTheme_v2();
   let _positionProp, _zOffsetProp, cardShadow, children, className, contentRef, footer, header, id, onActivate, onClickOutside, onClose, onFocus, portalProp, restProps, scheme, t0, t1, t2, t3, t4, t5, tone;
   $[0] !== props ? ({
     __unstable_autoFocus: t0,
@@ -531,7 +543,7 @@ const Dialog = react.forwardRef(function(props, ref) {
     tone,
     ...restProps
   } = props, $[0] = props, $[1] = _positionProp, $[2] = _zOffsetProp, $[3] = cardShadow, $[4] = children, $[5] = className, $[6] = contentRef, $[7] = footer, $[8] = header, $[9] = id, $[10] = onActivate, $[11] = onClickOutside, $[12] = onClose, $[13] = onFocus, $[14] = portalProp, $[15] = restProps, $[16] = scheme, $[17] = t0, $[18] = t1, $[19] = t2, $[20] = t3, $[21] = t4, $[22] = t5, $[23] = tone) : (_positionProp = $[1], _zOffsetProp = $[2], cardShadow = $[3], children = $[4], className = $[5], contentRef = $[6], footer = $[7], header = $[8], id = $[9], onActivate = $[10], onClickOutside = $[11], onClose = $[12], onFocus = $[13], portalProp = $[14], restProps = $[15], scheme = $[16], t0 = $[17], t1 = $[18], t2 = $[19], t3 = $[20], t4 = $[21], t5 = $[22], tone = $[23]);
-  const autoFocus = t0 === void 0 ? !0 : t0, hideCloseButton = t1 === void 0 ? !1 : t1, _animate = t2 === void 0 ? !1 : t2, cardRadiusProp = t3 === void 0 ? 4 : t3, padding = t4 === void 0 ? 3 : t4, widthProp = t5 === void 0 ? 0 : t5, positionProp = _positionProp ?? context.position ?? "fixed", zOffsetProp = _zOffsetProp ?? context.zOffset ?? _visualEditing.Z_OFFSETS.dialog, animate = _visualEditing.usePrefersReducedMotion() ? !1 : _animate, portal = _visualEditing.usePortal(), portalElement = portalProp ? portal.elements?.[portalProp] || null : portal.element, boundaryElement = _visualEditing.useBoundaryElement().element, cardRadius = _visualEditing.useArrayProp(cardRadiusProp), position = _visualEditing.useArrayProp(positionProp), width = _visualEditing.useArrayProp(widthProp), zOffset = _visualEditing.useArrayProp(zOffsetProp), preDivRef = react.useRef(null), postDivRef = react.useRef(null), cardRef = react.useRef(null), focusedElementRef = react.useRef(null);
+  const autoFocus = t0 === void 0 ? !0 : t0, hideCloseButton = t1 === void 0 ? !1 : t1, _animate = t2 === void 0 ? !1 : t2, cardRadiusProp = t3 === void 0 ? 4 : t3, padding = t4 === void 0 ? 3 : t4, widthProp = t5 === void 0 ? 0 : t5, positionProp = _positionProp ?? (context.position || "fixed"), zOffsetProp = _zOffsetProp ?? (context.zOffset || layer.dialog.zOffset), animate = _visualEditing.usePrefersReducedMotion() ? !1 : _animate, portal = _visualEditing.usePortal(), portalElement = portalProp ? portal.elements?.[portalProp] || null : portal.element, boundaryElement = _visualEditing.useBoundaryElement().element, cardRadius = _visualEditing.useArrayProp(cardRadiusProp), position = _visualEditing.useArrayProp(positionProp), width = _visualEditing.useArrayProp(widthProp), zOffset = _visualEditing.useArrayProp(zOffsetProp), preDivRef = react.useRef(null), postDivRef = react.useRef(null), cardRef = react.useRef(null), focusedElementRef = react.useRef(null);
   let t6;
   $[24] !== onFocus ? (t6 = (event) => {
     onFocus?.(event);
@@ -1375,28 +1387,30 @@ const TreeGroup = react.memo(function(props) {
 });
 TreeItem.displayName = "Memo(TreeItem)";
 function StyleTags(props) {
-  const $ = reactCompilerRuntime.c(10), {
+  const $ = reactCompilerRuntime.c(14), {
     theme: themeProp
   } = props;
   let t0;
   $[0] !== themeProp ? (t0 = themeProp ?? theme.buildTheme_v3(), $[0] = themeProp, $[1] = t0) : t0 = $[1];
   const theme$1 = t0;
   let t1;
-  $[2] === Symbol.for("react.memo_cache_sentinel") ? (t1 = /* @__PURE__ */ jsxRuntime.jsx("style", { href: "sanity-palette", precedence: "palette", children: css.compilePalette() }), $[2] = t1) : t1 = $[2];
+  $[2] !== theme$1._palette ? (t1 = css.compilePalette(theme$1._palette), $[2] = theme$1._palette, $[3] = t1) : t1 = $[3];
   let t2;
-  $[3] !== theme$1 ? (t2 = css.compileTheme({
-    v3: theme$1
-  }), $[3] = theme$1, $[4] = t2) : t2 = $[4];
+  $[4] !== t1 ? (t2 = /* @__PURE__ */ jsxRuntime.jsx("style", { href: "sanity-palette", precedence: "palette", children: t1 }), $[4] = t1, $[5] = t2) : t2 = $[5];
   let t3;
-  $[5] !== t2 ? (t3 = /* @__PURE__ */ jsxRuntime.jsx("style", { href: "sanity-theme", precedence: "theme", children: t2 }), $[5] = t2, $[6] = t3) : t3 = $[6];
+  $[6] !== theme$1 ? (t3 = css.compileTheme({
+    v3: theme$1
+  }), $[6] = theme$1, $[7] = t3) : t3 = $[7];
   let t4;
-  $[7] === Symbol.for("react.memo_cache_sentinel") ? (t4 = /* @__PURE__ */ jsxRuntime.jsx("style", { href: "sanity-system", precedence: "system", children: css.compileSystem() }), $[7] = t4) : t4 = $[7];
+  $[8] !== t3 ? (t4 = /* @__PURE__ */ jsxRuntime.jsx("style", { href: "sanity-theme", precedence: "theme", children: t3 }), $[8] = t3, $[9] = t4) : t4 = $[9];
   let t5;
-  return $[8] !== t3 ? (t5 = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    t1,
-    t3,
-    t4
-  ] }), $[8] = t3, $[9] = t5) : t5 = $[9], t5;
+  $[10] === Symbol.for("react.memo_cache_sentinel") ? (t5 = /* @__PURE__ */ jsxRuntime.jsx("style", { href: "sanity-system", precedence: "system", children: css.compileSystem() }), $[10] = t5) : t5 = $[10];
+  let t6;
+  return $[11] !== t2 || $[12] !== t4 ? (t6 = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    t2,
+    t4,
+    t5
+  ] }), $[11] = t2, $[12] = t4, $[13] = t6) : t6 = $[13], t6;
 }
 exports.Arrow = _visualEditing.Arrow;
 exports.Avatar = _visualEditing.Avatar;