@sanity/ui 3.3.6 → 3.4.0

package/dist/index.mjs

@@ -1,12 +1,17 @@
 import { X as getTheme_v2 } from "./_chunks/theme.mjs";
 import { $ as responsiveInputPaddingStyle, A as useMediaIndex, At as parseColor, B as _cardColorStyle, C as BoundaryElementContext, Ct as isHTMLTextAreaElement, D as Grid, Dt as hexToRgb, E as Inline, Et as createColorTheme, F as _ResizeObserver, Ft as studioTheme, G as SpanWithTextOverflow, H as Flex, I as useCustomValidity, J as textInputBaseStyle, K as responsiveRadiusStyle, L as useClickOutsideEvent, M as useGlobalKeyDown, Mt as rgbToHsl, N as useElementSize, Nt as rgba, O as usePrefersReducedMotion, Ot as hslToRgb, P as _elementSizeObserver, Pt as screen, Q as responsiveInputPaddingIconRightStyle, R as Card, S as isRecord, St as isHTMLSelectElement, T as KBD, Tt as EMPTY_RECORD, U as Text, V as Spinner, W as Box, X as textInputRepresentationStyle, Y as textInputFontSizeStyle, Z as textInputRootStyle, _ as usePortal, _t as containsOrEqualsElement, a as MenuDivider, at as useRootTheme, b as LayerProvider, bt as isHTMLElement, c as Tooltip, ct as responsiveTextFont, d as useDelayedState, dt as _fillCSSObject, et as focusRingBorderStyle, f as TextInput, ft as _getArrayProp, g as Portal, gt as _isEnterToClickElement, h as PortalProvider, ht as rem, i as MenuGroup, it as ThemeColorProvider, j as useMatchMedia, jt as rgbToHex, k as usePrefersDark, kt as multiply, l as useTooltipDelayGroup, lt as responsiveTextAlignStyle, m as Popover, mt as _responsive, n as Tab, nt as useTheme, o as Menu, ot as ThemeProvider, p as Stack, pt as _getResponsiveSpace, q as responsivePaddingStyle, r as MenuItem, rt as useTheme_v2, s as Hotkeys, st as createGlobalScopedContext, t as TabList, tt as focusRingStyle, u as TooltipDelayGroupContext, ut as responsiveFont, v as Layer, vt as isHTMLAnchorElement, w as Arrow, wt as EMPTY_ARRAY, x as useBoundaryElement, xt as isHTMLInputElement, y as useLayer, yt as isHTMLButtonElement, z as Button } from "./_chunks/tabList.mjs";
 import { c } from "react-compiler-runtime";
-import { CheckmarkIcon, ChevronDownIcon, CloseIcon, RemoveIcon, SpinnerIcon, ToggleArrowRightIcon } from "@sanity/icons";
+import { ChevronDownIcon } from "@sanity/icons/ChevronDown";
 import { Children, Component, Fragment, Suspense, cloneElement, forwardRef, isValidElement, lazy, startTransition, useContext, useEffect, useId, useImperativeHandle, useMemo, useReducer, useRef, useState, useSyncExternalStore } from "react";
 import ReactIs from "react-is";
 import { css, keyframes, styled } from "styled-components";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { SpinnerIcon } from "@sanity/icons/Spinner";
+import { CheckmarkIcon } from "@sanity/icons/Checkmark";
+import { RemoveIcon } from "@sanity/icons/Remove";
 import { AnimatePresence, motion } from "motion/react";
+import { CloseIcon } from "@sanity/icons/Close";
+import { ToggleArrowRightIcon } from "@sanity/icons/ToggleArrowRight";
 /**
 * @internal
 */
@@ -637,10 +642,10 @@ function inputElementStyles(props) {
 }
 const StyledCheckbox = /* @__PURE__ */ styled.div.withConfig({
 	displayName: "StyledCheckbox",
-	componentId: "sc-mje2ol-0"
+	componentId: "sc-eqpl40-0"
 })(checkboxBaseStyles), Input$4 = /* @__PURE__ */ styled.input.withConfig({
 	displayName: "Input",
-	componentId: "sc-mje2ol-1"
+	componentId: "sc-eqpl40-1"
 })(inputElementStyles), Checkbox = forwardRef(function(props, forwardedRef) {
 	let $ = c(25), checked, className, customValidity, disabled, indeterminate, readOnly, restProps, style;
 	$[0] === props ? (checked = $[1], className = $[2], customValidity = $[3], disabled = $[4], indeterminate = $[5], readOnly = $[6], restProps = $[7], style = $[8]) : ({checked, className, disabled, indeterminate, customValidity, readOnly, style, ...restProps} = props, $[0] = props, $[1] = checked, $[2] = className, $[3] = customValidity, $[4] = disabled, $[5] = indeterminate, $[6] = readOnly, $[7] = restProps, $[8] = style);
@@ -1159,13 +1164,13 @@ const selectStyle = {
 	iconBox: iconBoxStyle
 }, StyledSelect = /* @__PURE__ */ styled.div.withConfig({
 	displayName: "StyledSelect",
-	componentId: "sc-a3ltm7-0"
+	componentId: "sc-gi1uze-0"
 })(selectStyle.root), Input$2 = /* @__PURE__ */ styled.select.withConfig({
 	displayName: "Input",
-	componentId: "sc-a3ltm7-1"
+	componentId: "sc-gi1uze-1"
 })(selectStyle.input), IconBox = /* @__PURE__ */ styled(Box).withConfig({
 	displayName: "IconBox",
-	componentId: "sc-a3ltm7-2"
+	componentId: "sc-gi1uze-2"
 })(selectStyle.iconBox), Select = forwardRef(function(props, forwardedRef) {
 	let $ = c(38), children, customValidity, disabled, gap, readOnly, restProps, t0, t1, t2, t3;
 	$[0] === props ? (children = $[1], customValidity = $[2], disabled = $[3], gap = $[4], readOnly = $[5], restProps = $[6], t0 = $[7], t1 = $[8], t2 = $[9], t3 = $[10]) : ({children, customValidity, disabled, fontSize: t0, gap, padding: t1, radius: t2, readOnly, space: t3, ...restProps} = props, $[0] = props, $[1] = children, $[2] = customValidity, $[3] = disabled, $[4] = gap, $[5] = readOnly, $[6] = restProps, $[7] = t0, $[8] = t1, $[9] = t2, $[10] = t3);
@@ -1365,13 +1370,13 @@ TooltipDelayGroupProvider.displayName = "TooltipDelayGroupProvider";
 */
 const StyledAutocomplete = styled.div.withConfig({
 	displayName: "StyledAutocomplete",
-	componentId: "sc-890276-0"
+	componentId: "sc-hv7uk8-0"
 })`line-height:0;`, ListBox = styled(Box).withConfig({
 	displayName: "ListBox",
-	componentId: "sc-890276-1"
+	componentId: "sc-hv7uk8-1"
 })`& > ul{list-style:none;padding:0;margin:0;}`, rotate = keyframes`from{transform:rotate(0deg);}to{transform:rotate(360deg);}`, AnimatedSpinnerIcon = styled(SpinnerIcon).withConfig({
 	displayName: "AnimatedSpinnerIcon",
-	componentId: "sc-890276-2"
+	componentId: "sc-hv7uk8-2"
 })`animation:${rotate} 500ms linear infinite;`;
 function AutocompleteOption(props) {
 	let $ = c(11), { children, id, onSelect, selected, value } = props, t0;
@@ -1955,25 +1960,25 @@ function isTargetWithinScope(boundaryElement, portalElement, target) {
 }
 const StyledDialog = /* @__PURE__ */ styled(Layer).withConfig({
 	displayName: "StyledDialog",
-	componentId: "sc-7l6kmb-0"
+	componentId: "sc-r9i1m3-0"
 })(responsivePaddingStyle, dialogStyle, responsiveDialogPositionStyle, animationDialogStyle), DialogContainer = styled(Container).withConfig({
 	displayName: "DialogContainer",
-	componentId: "sc-7l6kmb-1"
+	componentId: "sc-r9i1m3-1"
 })`&:not([hidden]){display:flex;}width:100%;height:100%;flex-direction:column;align-items:center;justify-content:center;`, DialogCardRoot = styled(Card).withConfig({
 	displayName: "DialogCardRoot",
-	componentId: "sc-7l6kmb-2"
+	componentId: "sc-r9i1m3-2"
 })`&:not([hidden]){display:flex;}width:100%;min-height:0;max-height:100%;overflow:hidden;overflow:clip;`, DialogLayout = styled(Flex).withConfig({
 	displayName: "DialogLayout",
-	componentId: "sc-7l6kmb-3"
+	componentId: "sc-r9i1m3-3"
 })`flex:1;min-height:0;width:100%;`, DialogHeader = styled(Box).withConfig({
 	displayName: "DialogHeader",
-	componentId: "sc-7l6kmb-4"
+	componentId: "sc-r9i1m3-4"
 })`position:relative;z-index:2;`, DialogContent = styled(Box).withConfig({
 	displayName: "DialogContent",
-	componentId: "sc-7l6kmb-5"
+	componentId: "sc-r9i1m3-5"
 })`position:relative;z-index:1;overflow:auto;outline:none;`, DialogFooter = styled(Box).withConfig({
 	displayName: "DialogFooter",
-	componentId: "sc-7l6kmb-6"
+	componentId: "sc-r9i1m3-6"
 })`position:relative;z-index:3;`, DialogCard = forwardRef(function(props, forwardedRef) {
 	let $ = c(44), { __unstable_autoFocus: autoFocus, __unstable_hideCloseButton: hideCloseButton, children, contentRef: forwardedContentRef, footer, header, id, onClickOutside, onClose, portal: portalProp, radius: radiusProp, scheme, shadow: shadowProp, width: widthProp } = props, portal = usePortal(), portalElement = portalProp ? portal.elements?.[portalProp] || null : portal.element, boundaryElement = useBoundaryElement().element, t0;
 	$[0] === radiusProp ? t0 = $[1] : (t0 = _getArrayProp(radiusProp), $[0] = radiusProp, $[1] = t0);
@@ -2923,13 +2928,13 @@ function TreeGroup(props) {
 }
 const StyledTreeItem = /* @__PURE__ */ styled.li.withConfig({
 	displayName: "StyledTreeItem",
-	componentId: "sc-v9loy0-0"
+	componentId: "sc-arsnlr-0"
 })(treeItemRootStyle, treeItemRootColorStyle), TreeItemBox = /* @__PURE__ */ styled(Box).attrs({ forwardedAs: "a" }).withConfig({
 	displayName: "TreeItemBox",
-	componentId: "sc-v9loy0-1"
+	componentId: "sc-arsnlr-1"
 })(treeItemBoxStyle), ToggleArrowText = styled(Text).withConfig({
 	displayName: "ToggleArrowText",
-	componentId: "sc-v9loy0-2"
+	componentId: "sc-arsnlr-2"
 })`& > svg{transition:transform 100ms;}`;
 /**
 * This API might change. DO NOT USE IN PRODUCTION.