@sanity/ui 2.3.4 → 2.3.5

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
@@ -1,7 +1,7 @@
1
1
  import { buildTheme, createColorTheme as createColorTheme$1, hexToRgb as hexToRgb$1, hslToRgb as hslToRgb$1, multiply as multiply$1, parseColor as parseColor$1, rgbToHex as rgbToHex$1, rgbToHsl as rgbToHsl$1, rgba as rgba$1, screen as screen$1, getTheme_v2, getScopedTheme } from "@sanity/ui/theme";
2
2
  import { jsx, jsxs, Fragment } from "react/jsx-runtime";
3
- import { useMemo, useState, useRef, useEffect, createContext, useContext, useSyncExternalStore, useImperativeHandle, forwardRef, useId, useCallback, cloneElement, isValidElement, Component, memo, useReducer, Children, Fragment as Fragment$1, startTransition } from "react";
4
- import ReactIs, { isElement as isElement$1, isFragment, isValidElementType } from "react-is";
3
+ import { useMemo, useState, useRef, useEffect, createContext, useContext, useSyncExternalStore, useImperativeHandle, forwardRef, useId, useCallback, Children, isValidElement, cloneElement, Component, memo, useReducer, Fragment as Fragment$1, startTransition } from "react";
4
+ import ReactIs, { isValidElementType } from "react-is";
5
5
  import { ThemeProvider as ThemeProvider$1, useTheme as useTheme$1, css, styled, keyframes } from "styled-components";
6
6
  import { SpinnerIcon, CheckmarkIcon, RemoveIcon, ChevronDownIcon, CloseIcon, ChevronRightIcon, ToggleArrowRightIcon } from "@sanity/icons";
7
7
  import Refractor from "react-refractor";
@@ -1528,13 +1528,7 @@ const Root$A = styled.div(
1528
1528
  [size2]
1529
1529
  );
1530
1530
  return /* @__PURE__ */ jsx(Root$A, { $size: size2, "data-ui": "AvatarCounter", ref, children: /* @__PURE__ */ jsx(Label, { as: "span", size: fontSize2, weight: "medium", children: count }) });
1531
- });
1532
- function childrenToElementArray(children) {
1533
- return (Array.isArray(children) ? children : [children]).filter(
1534
- (node) => isElement$1(node) || isFragment(node) || typeof node == "string"
1535
- );
1536
- }
1537
- const BASE_STYLES = css`
1531
+ }), BASE_STYLES = css`
1538
1532
  white-space: nowrap;
1539
1533
 
1540
1534
  & > div {
@@ -1565,8 +1559,9 @@ const Root$z = styled.div(responsiveAvatarStackSizeStyle, avatarStackStyle), Ava
1565
1559
  maxLength: maxLengthProp = 4,
1566
1560
  size: sizeProp = 1,
1567
1561
  ...restProps
1568
- } = props, children = childrenToElementArray(childrenProp).filter(
1569
- (child) => typeof child != "string"
1562
+ } = props, children = useMemo(
1563
+ () => Children.toArray(childrenProp).filter(isValidElement),
1564
+ [childrenProp]
1570
1565
  ), maxLength = Math.max(maxLengthProp, 0), size2 = useArrayProp(sizeProp), len = children.length, visibleCount = maxLength - 1, extraCount = len - visibleCount, visibleChildren = extraCount > 1 ? children.slice(extraCount, len) : children;
1571
1566
  return /* @__PURE__ */ jsxs(Root$z, { "data-ui": "AvatarStack", ...restProps, ref, $size: size2, children: [
1572
1567
  len === 0 && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(AvatarCounter, { count: len, size: size2 }) }),
@@ -2640,7 +2635,7 @@ function inlineSpaceStyle(props) {
2640
2635
  }
2641
2636
  const Root$m = styled(Box)(inlineBaseStyle, inlineSpaceStyle), Inline = forwardRef(function(props, ref) {
2642
2637
  const { as, children: childrenProp, space, ...restProps } = props, children = useMemo(
2643
- () => childrenToElementArray(childrenProp).filter(Boolean).map((child, idx) => /* @__PURE__ */ jsx("div", { children: child }, idx)),
2638
+ () => Children.map(childrenProp, (child) => child && /* @__PURE__ */ jsx("div", { children: child })),
2644
2639
  [childrenProp]
2645
2640
  );
2646
2641
  return /* @__PURE__ */ jsx(
@@ -4957,10 +4952,7 @@ const AUTOCOMPLETE_LISTBOX_IGNORE_KEYS = [
4957
4952
  `, Breadcrumbs = forwardRef(function(props, ref) {
4958
4953
  const { children, maxLength, separator, space: spaceRaw = 2, ...restProps } = props, space = useArrayProp(spaceRaw), [open, setOpen] = useState(!1), [expandElement, setExpandElement] = useState(null), [popoverElement, setPopoverElement] = useState(null), collapse = useCallback(() => setOpen(!1), []), expand = useCallback(() => setOpen(!0), []);
4959
4954
  useClickOutside(collapse, [expandElement, popoverElement]);
4960
- const rawItems = useMemo(
4961
- () => Children.toArray(children).filter((child) => isValidElement(child)),
4962
- [children]
4963
- ), items = useMemo(() => {
4955
+ const rawItems = useMemo(() => Children.toArray(children).filter(isValidElement), [children]), items = useMemo(() => {
4964
4956
  const len = rawItems.length;
4965
4957
  if (maxLength && len > maxLength) {
4966
4958
  const beforeLength = Math.ceil(maxLength / 2), afterLength = Math.floor(maxLength / 2);
@@ -6476,7 +6468,7 @@ const key = Symbol.for("@sanity/ui/context/tree"), TreeContext = createGlobalSco
6476
6468
  ref.current.querySelectorAll('[data-ui="TreeItem"]')
6477
6469
  );
6478
6470
  setItemElements(_itemElements);
6479
- }, [children, ref]), /* @__PURE__ */ jsx(TreeContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
6471
+ }, [children]), /* @__PURE__ */ jsx(TreeContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
6480
6472
  Stack,
6481
6473
  {
6482
6474
  as: "ul",