@sanity/ui 4.0.7 → 4.1.1

package/dist/toast.js

@@ -1,13 +1,12 @@
 "use client";
-import { t as getTheme_v2 } from "./getTheme_v2-y09KqtEb.js";
-import { d as createGlobalScopedContext, i as usePrefersReducedMotion, n as LayerProvider, r as isRecord, s as Card, t as useLayer, y as Box } from "./useLayer-jUJIz8mh.js";
-import { t as Flex } from "./flex-CySCBzQm.js";
-import { n as Text, t as Stack } from "./stack-BGFEokua.js";
-import { t as Button } from "./button-DQH2KIbq.js";
-import { t as Grid } from "./grid-I2TNptX-.js";
+import { _ as useTheme_v2, d as createGlobalScopedContext, i as usePrefersReducedMotion, n as LayerProvider, r as isRecord, s as Card, t as useLayer, y as Box } from "./useLayer-D1usxIE0.js";
+import { t as Flex } from "./flex-DmbDG2ks.js";
+import { n as Text, t as Stack } from "./stack-rsNFPq2-.js";
+import { t as Button } from "./button-Dh_M2fYx.js";
+import { t as Grid } from "./grid-6JSgMj1O.js";
 import { c } from "react/compiler-runtime";
+import { clsx } from "clsx/lite";
 import { startTransition, useContext, useState, useSyncExternalStore } from "react";
-import { styled } from "styled-components";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { AnimatePresence, motion, stagger } from "motion/react";
 import { CloseIcon } from "@sanity/icons/Close";
@@ -21,25 +20,9 @@ const STATUS_CARD_TONE = {
 	warning: "caution",
 	success: "positive",
 	info: "neutral"
-}, TextBox = styled(Flex).withConfig({
-	displayName: "TextBox",
-	componentId: "sc-iyk5nq-0"
-})`overflow-x:auto;`, StyledToast = styled(Card).withConfig({
-	displayName: "StyledToast",
-	componentId: "sc-iyk5nq-1"
-})`pointer-events:all;width:100%;position:relative;overflow:hidden;overflow:clip;&[data-has-duration]{padding-bottom:calc(${2}px / 2);}`, LoadingBar = styled.div.withConfig({
-	displayName: "LoadingBar",
-	componentId: "sc-iyk5nq-2"
-})`display:flex;position:absolute;bottom:0px;top:0px;left:0px;right:0px;pointer-events:none;z-index:-1;overflow:hidden;overflow:clip;background:transparent;align-items:flex-end;will-change:opacity;`, LoadingBarMask = styled(Card).withConfig({
-	displayName: "LoadingBarMask",
-	componentId: "sc-iyk5nq-3"
-})`position:absolute;top:0;left:-${2}px;right:-${2}px;bottom:${2}px;z-index:1;`, LoadingBarProgress = styled(Card).withConfig({
-	displayName: "LoadingBarProgress",
-	componentId: "sc-iyk5nq-4"
-})`display:block;height:100%;width:100%;transform-origin:0% 50%;background-color:${(props) => {
-	let { color } = getTheme_v2(props.theme);
-	return color.button.default[props.tone].enabled.bg;
-}};`, ROLES = {
+};
+var loadingBarProgress = "_1a5lj7y4", toast = "_1a5lj7y0", toastText = "_1a5lj7y1";
+const ROLES = {
 	error: "alert",
 	warning: "alert",
 	success: "alert",
@@ -53,45 +36,48 @@ const STATUS_CARD_TONE = {
 * @public
 */
 function Toast(props) {
-	let $ = c(50), closable, description, duration, onClose, restProps, status, t0, title, updatedAt;
-	$[0] === props ? (closable = $[1], description = $[2], duration = $[3], onClose = $[4], restProps = $[5], status = $[6], t0 = $[7], title = $[8], updatedAt = $[9]) : ({closable, description, duration, onClose, radius: t0, title, status, updatedAt, ...restProps} = props, $[0] = props, $[1] = closable, $[2] = description, $[3] = duration, $[4] = onClose, $[5] = restProps, $[6] = status, $[7] = t0, $[8] = title, $[9] = updatedAt);
+	let $ = c(54), className, closable, description, duration, onClose, restProps, status, t0, title, updatedAt;
+	$[0] === props ? (className = $[1], closable = $[2], description = $[3], duration = $[4], onClose = $[5], restProps = $[6], status = $[7], t0 = $[8], title = $[9], updatedAt = $[10]) : ({className, closable, description, duration, onClose, radius: t0, title, status, updatedAt, ...restProps} = props, $[0] = props, $[1] = className, $[2] = closable, $[3] = description, $[4] = duration, $[5] = onClose, $[6] = restProps, $[7] = status, $[8] = t0, $[9] = title, $[10] = updatedAt);
 	let radius = t0 === void 0 ? 3 : t0, cardTone = status ? STATUS_CARD_TONE[status] : "default", buttonTone = status ? BUTTON_TONE[status] : "default", role = status ? ROLES[status] : "status", visualDuration = usePrefersReducedMotion() ? 0 : .26, t1;
-	$[10] === visualDuration ? t1 = $[11] : (t1 = visualDuration ? {
+	$[11] === visualDuration ? t1 = $[12] : (t1 = visualDuration ? {
 		type: "spring",
 		visualDuration,
 		bounce: .25
-	} : { duration: 0 }, $[10] = visualDuration, $[11] = t1);
+	} : { duration: 0 }, $[11] = visualDuration, $[12] = t1);
 	let transition = t1, hasDuration = duration && isFinite(duration) && duration < 20736e5, t2;
-	$[12] === Symbol.for("react.memo_cache_sentinel") ? (t2 = ["hidden", "initial"], $[12] = t2) : t2 = $[12];
+	$[13] === Symbol.for("react.memo_cache_sentinel") ? (t2 = ["hidden", "initial"], $[13] = t2) : t2 = $[13];
 	let initial = t2, t3;
-	$[13] === Symbol.for("react.memo_cache_sentinel") ? (t3 = ["visible", "slideIn"], $[13] = t3) : t3 = $[13];
+	$[14] === Symbol.for("react.memo_cache_sentinel") ? (t3 = ["visible", "slideIn"], $[14] = t3) : t3 = $[14];
 	let animate = t3, t4;
-	$[14] === Symbol.for("react.memo_cache_sentinel") ? (t4 = ["hidden", "slideOut"], $[14] = t4) : t4 = $[14];
-	let exit = t4, t5 = hasDuration ? "" : void 0, t6;
-	$[15] === title ? t6 = $[16] : (t6 = title && /* @__PURE__ */ jsx(Text, {
+	$[15] === Symbol.for("react.memo_cache_sentinel") ? (t4 = ["hidden", "slideOut"], $[15] = t4) : t4 = $[15];
+	let exit = t4, t5;
+	$[16] === className ? t5 = $[17] : (t5 = clsx(toast, className), $[16] = className, $[17] = t5);
+	let t6 = hasDuration ? "" : void 0, t7;
+	$[18] === title ? t7 = $[19] : (t7 = title && /* @__PURE__ */ jsx(Text, {
 		size: 1,
 		weight: "medium",
 		children: title
-	}), $[15] = title, $[16] = t6);
-	let t7;
-	$[17] !== description || $[18] !== transition ? (t7 = description && /* @__PURE__ */ jsx(MotionText, {
+	}), $[18] = title, $[19] = t7);
+	let t8;
+	$[20] !== description || $[21] !== transition ? (t8 = description && /* @__PURE__ */ jsx(MotionText, {
 		muted: !0,
 		size: 1,
 		variants: content,
 		transition,
 		children: description
-	}), $[17] = description, $[18] = transition, $[19] = t7) : t7 = $[19];
-	let t8;
-	$[20] !== t6 || $[21] !== t7 ? (t8 = /* @__PURE__ */ jsx(TextBox, {
+	}), $[20] = description, $[21] = transition, $[22] = t8) : t8 = $[22];
+	let t9;
+	$[23] !== t7 || $[24] !== t8 ? (t9 = /* @__PURE__ */ jsx(Flex, {
+		className: toastText,
 		flex: 1,
 		padding: 3,
 		children: /* @__PURE__ */ jsxs(Stack, {
 			gap: 3,
-			children: [t6, t7]
+			children: [t7, t8]
 		})
-	}), $[20] = t6, $[21] = t7, $[22] = t8) : t8 = $[22];
-	let t9;
-	$[23] !== buttonTone || $[24] !== closable || $[25] !== onClose ? (t9 = closable && /* @__PURE__ */ jsx(Box, {
+	}), $[23] = t7, $[24] = t8, $[25] = t9) : t9 = $[25];
+	let t10;
+	$[26] !== buttonTone || $[27] !== closable || $[28] !== onClose ? (t10 = closable && /* @__PURE__ */ jsx(Box, {
 		padding: 1,
 		children: /* @__PURE__ */ jsx(Button, {
 			as: "button",
@@ -102,52 +88,72 @@ function Toast(props) {
 			onClick: onClose,
 			style: { verticalAlign: "top" }
 		})
-	}), $[23] = buttonTone, $[24] = closable, $[25] = onClose, $[26] = t9) : t9 = $[26];
-	let t10;
-	$[27] !== t8 || $[28] !== t9 || $[29] !== transition ? (t10 = /* @__PURE__ */ jsxs(MotionFlex, {
+	}), $[26] = buttonTone, $[27] = closable, $[28] = onClose, $[29] = t10) : t10 = $[29];
+	let t11;
+	$[30] !== t10 || $[31] !== t9 || $[32] !== transition ? (t11 = /* @__PURE__ */ jsxs(MotionFlex, {
 		align: "flex-start",
 		variants: content,
 		transition,
-		children: [t8, t9]
-	}), $[27] = t8, $[28] = t9, $[29] = transition, $[30] = t10) : t10 = $[30];
-	let t11;
-	$[31] !== cardTone || $[32] !== duration || $[33] !== hasDuration || $[34] !== onClose || $[35] !== radius || $[36] !== transition || $[37] !== updatedAt || $[38] !== visualDuration ? (t11 = hasDuration && /* @__PURE__ */ jsxs(MotionLoadingBar, {
+		children: [t9, t10]
+	}), $[30] = t10, $[31] = t9, $[32] = transition, $[33] = t11) : t11 = $[33];
+	let t12;
+	$[34] !== cardTone || $[35] !== duration || $[36] !== hasDuration || $[37] !== onClose || $[38] !== radius || $[39] !== transition || $[40] !== updatedAt || $[41] !== visualDuration ? (t12 = hasDuration && /* @__PURE__ */ jsxs(motion.div, {
+		className: "_1a5lj7y2",
 		variants: content,
 		transition,
-		children: [/* @__PURE__ */ jsx(LoadingBarMask, {
+		children: [/* @__PURE__ */ jsx(Card, {
+			className: "_1a5lj7y3",
 			tone: cardTone,
 			radius
-		}), /* @__PURE__ */ jsx(MotionLoadingBarProgress, {
+		}), /* @__PURE__ */ jsx(LoadingBarProgress, {
+			duration,
+			onComplete: onClose,
 			tone: cardTone,
-			initial: { scaleX: 0 },
-			animate: { scaleX: 1 },
-			transition: {
-				delay: visualDuration,
-				duration: duration / 1e3,
-				ease: "linear"
-			},
-			onAnimationComplete: onClose
+			visualDuration
 		}, `progress-${updatedAt}`)]
-	}), $[31] = cardTone, $[32] = duration, $[33] = hasDuration, $[34] = onClose, $[35] = radius, $[36] = transition, $[37] = updatedAt, $[38] = visualDuration, $[39] = t11) : t11 = $[39];
-	let t12;
-	return $[40] !== cardTone || $[41] !== radius || $[42] !== restProps || $[43] !== role || $[44] !== t10 || $[45] !== t11 || $[46] !== t5 || $[47] !== transition || $[48] !== visualDuration ? (t12 = /* @__PURE__ */ jsxs(MotionToast, {
+	}), $[34] = cardTone, $[35] = duration, $[36] = hasDuration, $[37] = onClose, $[38] = radius, $[39] = transition, $[40] = updatedAt, $[41] = visualDuration, $[42] = t12) : t12 = $[42];
+	let t13;
+	return $[43] !== cardTone || $[44] !== radius || $[45] !== restProps || $[46] !== role || $[47] !== t11 || $[48] !== t12 || $[49] !== t5 || $[50] !== t6 || $[51] !== transition || $[52] !== visualDuration ? (t13 = /* @__PURE__ */ jsxs(MotionCard, {
+		className: t5,
 		"data-ui": "Toast",
 		role,
 		...restProps,
-		"data-has-duration": t5,
+		"data-has-duration": t6,
 		custom: visualDuration,
 		radius,
 		shadow: 2,
 		tone: cardTone,
-		forwardedAs: "li",
+		as: "li",
 		layout: "position",
 		variants: container,
 		initial,
 		animate,
 		exit,
 		transition,
-		children: [t10, t11]
-	}), $[40] = cardTone, $[41] = radius, $[42] = restProps, $[43] = role, $[44] = t10, $[45] = t11, $[46] = t5, $[47] = transition, $[48] = visualDuration, $[49] = t12) : t12 = $[49], t12;
+		children: [t11, t12]
+	}), $[43] = cardTone, $[44] = radius, $[45] = restProps, $[46] = role, $[47] = t11, $[48] = t12, $[49] = t5, $[50] = t6, $[51] = transition, $[52] = visualDuration, $[53] = t13) : t13 = $[53], t13;
+}
+function LoadingBarProgress(props) {
+	let $ = c(12), { duration, onComplete, tone, visualDuration } = props, { color } = useTheme_v2(), t0 = color.button.default[tone], t1;
+	$[0] === t0.enabled.bg ? t1 = $[1] : (t1 = { "--toast-loading-bar-bg": t0.enabled.bg }, $[0] = t0.enabled.bg, $[1] = t1);
+	let t2, t3;
+	$[2] === Symbol.for("react.memo_cache_sentinel") ? (t2 = { scaleX: 0 }, t3 = { scaleX: 1 }, $[2] = t2, $[3] = t3) : (t2 = $[2], t3 = $[3]);
+	let t4 = duration / 1e3, t5;
+	$[4] !== t4 || $[5] !== visualDuration ? (t5 = {
+		delay: visualDuration,
+		duration: t4,
+		ease: "linear"
+	}, $[4] = t4, $[5] = visualDuration, $[6] = t5) : t5 = $[6];
+	let t6;
+	return $[7] !== onComplete || $[8] !== t1 || $[9] !== t5 || $[10] !== tone ? (t6 = /* @__PURE__ */ jsx(MotionCard, {
+		className: loadingBarProgress,
+		tone,
+		style: t1,
+		initial: t2,
+		animate: t3,
+		transition: t5,
+		onAnimationComplete: onComplete
+	}), $[7] = onComplete, $[8] = t1, $[9] = t5, $[10] = tone, $[11] = t6) : t6 = $[11], t6;
 }
 const container = {
 	initial: {
@@ -176,7 +182,7 @@ const container = {
 	initial: { willChange: "transform" },
 	hidden: { opacity: 0 },
 	visible: { opacity: 1 }
-}, MotionToast = motion.create(StyledToast), MotionFlex = motion.create(Flex), MotionText = motion.create(Text), MotionLoadingBar = motion.create(LoadingBar), MotionLoadingBarProgress = motion.create(LoadingBarProgress);
+}, MotionCard = motion.create(Card), MotionFlex = motion.create(Flex), MotionText = motion.create(Text);
 /**
 * Some components should only render after mounting to the DOM, and not be rendered at all during SSR renderToString or equivalent.
 * @public
@@ -191,6 +197,7 @@ function _temp$1() {
 	return !0;
 }
 const subscribe = () => () => {}, ToastContext = createGlobalScopedContext("@sanity/ui/context/toast", null);
+var toastLayer = "_1ojgmwx0";
 /**
 * @internal
 */
@@ -198,8 +205,9 @@ function ToastLayer(props) {
 	let $ = c(9), { children, padding: t0, paddingX, paddingY, gap: t1 } = props, padding = t0 === void 0 ? 4 : t0, gap = t1 === void 0 ? 3 : t1, { zIndex } = useLayer(), t2;
 	$[0] === zIndex ? t2 = $[1] : (t2 = { zIndex }, $[0] = zIndex, $[1] = t2);
 	let t3;
-	return $[2] !== children || $[3] !== gap || $[4] !== padding || $[5] !== paddingX || $[6] !== paddingY || $[7] !== t2 ? (t3 = /* @__PURE__ */ jsx(StyledLayer, {
-		forwardedAs: "ul",
+	return $[2] !== children || $[3] !== gap || $[4] !== padding || $[5] !== paddingX || $[6] !== paddingY || $[7] !== t2 ? (t3 = /* @__PURE__ */ jsx(Grid, {
+		as: "ul",
+		className: toastLayer,
 		"data-ui": "ToastProvider",
 		padding,
 		paddingX,
@@ -210,10 +218,6 @@ function ToastLayer(props) {
 		children
 	}), $[2] = children, $[3] = gap, $[4] = padding, $[5] = paddingX, $[6] = paddingY, $[7] = t2, $[8] = t3) : t3 = $[8], t3;
 }
-const StyledLayer = styled(Grid).withConfig({
-	displayName: "StyledLayer",
-	componentId: "sc-7muzlg-0"
-})`box-sizing:border-box;position:fixed;right:0;bottom:0;list-style:none;pointer-events:none;max-width:420px;width:100%;`;
 let toastId = 0;
 /** @internal */
 function generateToastId() {

package/dist/toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"toast.js","names":["radius = 3","visualDuration\n    ? {type: 'spring' as const, visualDuration, bounce: 0.25}\n    : {duration: 0}","['hidden', 'initial']","['visible', 'slideIn']","['hidden', 'slideOut']","title && (\n              <Text size={1} weight=\"medium\">\n                {title}\n              </Text>\n            )","description && (\n              <MotionText muted size={1} variants={content} transition={transition}>\n                {description}\n              </MotionText>\n            )","<TextBox flex={1} padding={3}>\n          <Stack gap={3}>\n            {title && (\n              <Text size={1} weight=\"medium\">\n                {title}\n              </Text>\n            )}\n            {description && (\n              <MotionText muted size={1} variants={content} transition={transition}>\n                {description}\n              </MotionText>\n            )}\n          </Stack>\n        </TextBox>","closable && (\n          <Box padding={1}>\n            <Button\n              as=\"button\"\n              icon={CloseIcon}\n              mode=\"bleed\"\n              padding={2}\n              tone={buttonTone}\n              onClick={onClose}\n              style={{verticalAlign: 'top'}}\n            />\n          </Box>\n        )","<MotionFlex align=\"flex-start\" variants={content} transition={transition}>\n        <TextBox flex={1} padding={3}>\n          <Stack gap={3}>\n            {title && (\n              <Text size={1} weight=\"medium\">\n                {title}\n              </Text>\n            )}\n            {description && (\n              <MotionText muted size={1} variants={content} transition={transition}>\n                {description}\n              </MotionText>\n            )}\n          </Stack>\n        </TextBox>\n\n        {closable && (\n          <Box padding={1}>\n            <Button\n              as=\"button\"\n              icon={CloseIcon}\n              mode=\"bleed\"\n              padding={2}\n              tone={buttonTone}\n              onClick={onClose}\n              style={{verticalAlign: 'top'}}\n            />\n          </Box>\n        )}\n      </MotionFlex>","hasDuration && (\n        <MotionLoadingBar variants={content} transition={transition}>\n          <LoadingBarMask tone={cardTone} radius={radius} />\n          <MotionLoadingBarProgress\n            key={`progress-${updatedAt}`}\n            tone={cardTone}\n            initial={{scaleX: 0}}\n            animate={{scaleX: 1}}\n            transition={{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}}\n            onAnimationComplete={onClose}\n          />\n        </MotionLoadingBar>\n      )","<MotionToast\n      data-ui=\"Toast\"\n      role={role}\n      {...restProps}\n      data-has-duration={hasDuration ? '' : undefined}\n      custom={visualDuration}\n      radius={radius}\n      shadow={2}\n      tone={cardTone}\n      forwardedAs=\"li\"\n      layout=\"position\"\n      variants={container}\n      initial={initial}\n      animate={animate}\n      exit={exit}\n      transition={transition}\n    >\n      <MotionFlex align=\"flex-start\" variants={content} transition={transition}>\n        <TextBox flex={1} padding={3}>\n          <Stack gap={3}>\n            {title && (\n              <Text size={1} weight=\"medium\">\n                {title}\n              </Text>\n            )}\n            {description && (\n              <MotionText muted size={1} variants={content} transition={transition}>\n                {description}\n              </MotionText>\n            )}\n          </Stack>\n        </TextBox>\n\n        {closable && (\n          <Box padding={1}>\n            <Button\n              as=\"button\"\n              icon={CloseIcon}\n              mode=\"bleed\"\n              padding={2}\n              tone={buttonTone}\n              onClick={onClose}\n              style={{verticalAlign: 'top'}}\n            />\n          </Box>\n        )}\n      </MotionFlex>\n      {hasDuration && (\n        <MotionLoadingBar variants={content} transition={transition}>\n          <LoadingBarMask tone={cardTone} radius={radius} />\n          <MotionLoadingBarProgress\n            key={`progress-${updatedAt}`}\n            tone={cardTone}\n            initial={{scaleX: 0}}\n            animate={{scaleX: 1}}\n            transition={{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}}\n            onAnimationComplete={onClose}\n          />\n        </MotionLoadingBar>\n      )}\n    </MotionToast>","hasDuration ? '' : undefined","() => true","() => false","padding = 4","gap = 3","{zIndex}","<StyledLayer\n      forwardedAs=\"ul\"\n      data-ui=\"ToastProvider\"\n      padding={padding}\n      paddingX={paddingX}\n      paddingY={paddingY}\n      gap={gap}\n      gridTemplateColumns={1}\n      style={{zIndex}}\n    >\n      {children}\n    </StyledLayer>","zOffset = 1","[]","{version: 0.0, push}","toast","useMemo(() => {\n    const push = (params: ToastParams) => {\n      const id = params.id || generateToastId()\n      const duration = params.duration || 5000\n\n      startTransition(() => {\n        setState((prevState): ToastState => {\n          /**\n           * Backwards compatibility for `sanity` patterns workaround a lack of programatically dismissible toasts.\n           * It uses a super short duration that closes the toast immediately in previous versions of `@sanity/ui`.\n           * We interpret this as a request to dismiss the toast immediately, and remove it from the state right away.\n           * Even once we support programatic dismissal we'll need to keep this for backwards compatibility with v2 and v1.\n           */\n          if (duration === 0.01) {\n            return prevState.filter((toast) => toast.id !== id)\n          }\n\n          /**\n           * Creates a function to dismiss this specific toast.\n           * This function will be passed to the Toast component\n           * and called either on close button click or after duration.\n           */\n          const dismiss = () =>\n            startTransition(() =>\n              setState((currentState) => currentState.filter((toast) => toast.id !== id)),\n            )\n\n          /**\n           * Create updated state by:\n           * 1. Removing any existing toast with the same ID (prevents duplicates)\n           * 2. Adding the new toast with its dismiss handler\n           * 3. Updates the `updatedAt` timestamp, which resets progress bar count downs.\n           */\n          return [\n            ...prevState.filter((toast) => toast.id !== id),\n            {\n              dismiss,\n              id,\n              updatedAt: Date.now(),\n              params: {...params, duration},\n            },\n          ]\n        })\n      })\n\n      return id\n    }\n\n    return {version: 0.0, push}\n  }, [])","mounted && (\n        <LayerProvider zOffset={zOffset}>\n          <ToastLayer padding={padding} paddingX={paddingX} paddingY={paddingY} gap={gap}>\n            <AnimatePresence initial={false} mode=\"popLayout\">\n              {state.map(({dismiss, id, params, updatedAt}) => (\n                <Toast\n                  key={id}\n                  closable={params.closable}\n                  description={params.description}\n                  onClose={dismiss}\n                  status={params.status}\n                  title={params.title}\n                  duration={params.duration}\n                  updatedAt={updatedAt}\n                />\n              ))}\n            </AnimatePresence>\n          </ToastLayer>\n        </LayerProvider>\n      )","({dismiss, id, params, updatedAt}) => (\n                <Toast\n                  key={id}\n                  closable={params.closable}\n                  description={params.description}\n                  onClose={dismiss}\n                  status={params.status}\n                  title={params.title}\n                  duration={params.duration}\n                  updatedAt={updatedAt}\n                />\n              )","<ToastContext.Provider value={value}>\n      {children}\n      {mounted && (\n        <LayerProvider zOffset={zOffset}>\n          <ToastLayer padding={padding} paddingX={paddingX} paddingY={paddingY} gap={gap}>\n            <AnimatePresence initial={false} mode=\"popLayout\">\n              {state.map(({dismiss, id, params, updatedAt}) => (\n                <Toast\n                  key={id}\n                  closable={params.closable}\n                  description={params.description}\n                  onClose={dismiss}\n                  status={params.status}\n                  title={params.title}\n                  duration={params.duration}\n                  updatedAt={updatedAt}\n                />\n              ))}\n            </AnimatePresence>\n          </ToastLayer>\n        </LayerProvider>\n      )}\n    </ToastContext.Provider>","ToastContext.Provider","{dismiss, id, params, updatedAt}","params","dismiss","id"],"sources":["../src/core/components/toast/styles.ts","../src/core/components/toast/toast.tsx","../src/core/hooks/useMounted.ts","../src/core/components/toast/toastContext.ts","../src/core/components/toast/toastLayer.tsx","../src/core/components/toast/toastState.ts","../src/core/components/toast/toastProvider.tsx","../src/core/components/toast/useToast.ts"],"sourcesContent":["import {styled} from 'styled-components'\n\nimport {ThemeColorStateToneKey} from '../../../theme/system/color/_system'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {Card, type CardProps} from '../../primitives/card/card'\nimport {Flex} from '../../primitives/flex/flex'\nimport type {ButtonTone} from '../../types/button'\n\nconst LOADING_BAR_HEIGHT = 2\n\nexport const STATUS_CARD_TONE = {\n  error: 'critical',\n  warning: 'caution',\n  success: 'positive',\n  info: 'neutral',\n} satisfies {[key: string]: ThemeColorStateToneKey}\n\nexport const BUTTON_TONE = {\n  error: 'critical',\n  warning: 'caution',\n  success: 'positive',\n  info: 'neutral',\n} satisfies {[key: string]: ButtonTone}\n\nexport const TextBox = styled(Flex)`\n  overflow-x: auto;\n`\n\nexport const StyledToast = styled(Card)`\n  pointer-events: all;\n  width: 100%;\n  position: relative;\n  overflow: hidden;\n  overflow: clip;\n\n  &[data-has-duration] {\n    padding-bottom: calc(${LOADING_BAR_HEIGHT}px / 2);\n  }\n`\n\nexport const LoadingBar = styled.div`\n  display: flex;\n  position: absolute;\n  bottom: 0px;\n  top: 0px;\n  left: 0px;\n  right: 0px;\n  pointer-events: none;\n  z-index: -1;\n  overflow: hidden;\n  overflow: clip;\n  background: transparent;\n  align-items: flex-end;\n  will-change: opacity;\n`\n\nexport const LoadingBarMask = styled(Card)`\n  position: absolute;\n  top: 0;\n  left: -${LOADING_BAR_HEIGHT}px;\n  right: -${LOADING_BAR_HEIGHT}px;\n  bottom: ${LOADING_BAR_HEIGHT}px;\n  z-index: 1;\n`\n\ntype LoadingBarProgressProps = Omit<CardProps, 'tone'> & {\n  tone: ThemeColorStateToneKey\n}\nexport const LoadingBarProgress = styled<React.ComponentType<LoadingBarProgressProps>>(Card)`\n  display: block;\n  height: 100%;\n  width: 100%;\n  transform-origin: 0% 50%;\n  background-color: ${(props) => {\n    const {color} = getTheme_v2(props.theme)\n\n    return color.button.default[props.tone].enabled.bg\n  }};\n`\n","import {CloseIcon} from '@sanity/icons/Close'\nimport {motion, stagger, type Variant, type Variants} from 'motion/react'\n\nimport {usePrefersReducedMotion} from '../../hooks/usePrefersReducedMotion'\nimport {Box} from '../../primitives/box/box'\nimport {Button} from '../../primitives/button/button'\nimport {Flex} from '../../primitives/flex/flex'\nimport {Stack} from '../../primitives/stack/stack'\nimport {Text} from '../../primitives/text/text'\nimport {\n  BUTTON_TONE,\n  LoadingBar,\n  LoadingBarMask,\n  LoadingBarProgress,\n  STATUS_CARD_TONE,\n  StyledToast,\n  TextBox,\n} from './styles'\n\n/**\n * @public\n */\nexport interface ToastProps {\n  closable?: boolean\n  description?: React.ReactNode\n  onClose: () => void\n  radius?: number | number[]\n  title?: React.ReactNode\n  status?: 'error' | 'warning' | 'success' | 'info'\n  duration?: number\n  updatedAt?: number\n}\n\nconst ROLES = {\n  error: 'alert',\n  warning: 'alert',\n  success: 'alert',\n  info: 'alert',\n} as const\n\n// Support pattern used by Sanity Studio, that works around the lack of `duration: Infinity` support in older @sanity/ui versions\n// https://developer.mozilla.org/en-US/docs/Web/API/setTimeout#maximum_delay_value\nconst LONG_ENOUGH_BUT_NOT_TOO_LONG = 1000 * 60 * 60 * 24 * 24\n\n/**\n * The `Toast` component gives feedback to users when an action has taken place.\n *\n * Toasts can be closed with a close button, or auto-dismiss after a certain timeout.\n *\n * @public\n */\nexport function Toast(\n  props: ToastProps &\n    Omit<\n      React.HTMLProps<HTMLDivElement>,\n      | 'as'\n      | 'height'\n      | 'ref'\n      | 'title'\n      | 'onAnimationStart'\n      | 'onDragStart'\n      | 'onDragEnd'\n      | 'onDrag'\n    >,\n): React.JSX.Element {\n  const {\n    closable,\n    description,\n    duration,\n    onClose,\n    radius = 3,\n    title,\n    status,\n    updatedAt,\n    ...restProps\n  } = props\n  const cardTone = status ? STATUS_CARD_TONE[status] : 'default'\n  const buttonTone = status ? BUTTON_TONE[status] : 'default'\n  const role = status ? ROLES[status] : 'status'\n\n  const prefersReducedMotion = usePrefersReducedMotion()\n\n  const visualDuration: number = prefersReducedMotion ? 0 : 0.26\n  const transition = visualDuration\n    ? {type: 'spring' as const, visualDuration, bounce: 0.25}\n    : {duration: 0}\n\n  const hasDuration = duration && isFinite(duration) && duration < LONG_ENOUGH_BUT_NOT_TOO_LONG\n  const initial: ContainerVariants[] = ['hidden', 'initial']\n  const animate: ContainerVariants[] = ['visible', 'slideIn']\n  const exit: ContainerVariants[] = ['hidden', 'slideOut']\n\n  return (\n    <MotionToast\n      data-ui=\"Toast\"\n      role={role}\n      {...restProps}\n      data-has-duration={hasDuration ? '' : undefined}\n      custom={visualDuration}\n      radius={radius}\n      shadow={2}\n      tone={cardTone}\n      forwardedAs=\"li\"\n      layout=\"position\"\n      variants={container}\n      initial={initial}\n      animate={animate}\n      exit={exit}\n      transition={transition}\n    >\n      <MotionFlex align=\"flex-start\" variants={content} transition={transition}>\n        <TextBox flex={1} padding={3}>\n          <Stack gap={3}>\n            {title && (\n              <Text size={1} weight=\"medium\">\n                {title}\n              </Text>\n            )}\n            {description && (\n              <MotionText muted size={1} variants={content} transition={transition}>\n                {description}\n              </MotionText>\n            )}\n          </Stack>\n        </TextBox>\n\n        {closable && (\n          <Box padding={1}>\n            <Button\n              as=\"button\"\n              icon={CloseIcon}\n              mode=\"bleed\"\n              padding={2}\n              tone={buttonTone}\n              onClick={onClose}\n              style={{verticalAlign: 'top'}}\n            />\n          </Box>\n        )}\n      </MotionFlex>\n      {hasDuration && (\n        <MotionLoadingBar variants={content} transition={transition}>\n          <LoadingBarMask tone={cardTone} radius={radius} />\n          <MotionLoadingBarProgress\n            key={`progress-${updatedAt}`}\n            tone={cardTone}\n            initial={{scaleX: 0}}\n            animate={{scaleX: 1}}\n            transition={{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}}\n            onAnimationComplete={onClose}\n          />\n        </MotionLoadingBar>\n      )}\n    </MotionToast>\n  )\n}\n\nconst container = {\n  initial: {y: 32, scale: 0.5, zIndex: 1},\n  hidden: {opacity: 0},\n  visible: (visualDuration: number) => {\n    if (!visualDuration) return {opacity: 1}\n\n    return {\n      opacity: 1,\n      transition: {\n        when: 'beforeChildren',\n        delayChildren: stagger(visualDuration / 3),\n        duration: visualDuration / 3,\n      },\n    }\n  },\n  slideIn: {\n    y: 0,\n    scale: 1,\n  },\n  slideOut: {\n    zIndex: 0,\n    scale: 0.75,\n  },\n} satisfies Variants\ntype ContainerVariants = keyof typeof container\n\nconst content = {\n  initial: {\n    willChange: 'transform',\n  },\n  hidden: {\n    opacity: 0,\n  },\n  visible: {\n    opacity: 1,\n  },\n} satisfies Partial<Record<ContainerVariants, Variant>>\n\nconst MotionToast = motion.create(StyledToast)\nconst MotionFlex = motion.create(Flex)\nconst MotionText = motion.create(Text)\nconst MotionLoadingBar = motion.create(LoadingBar)\nconst MotionLoadingBarProgress = motion.create(LoadingBarProgress)\n","import {useSyncExternalStore} from 'react'\n\n/**\n * Some components should only render after mounting to the DOM, and not be rendered at all during SSR renderToString or equivalent.\n * @public\n */\nexport function useMounted(): boolean {\n  return useSyncExternalStore(\n    subscribe,\n    () => true,\n    () => false,\n  )\n}\n\nconst subscribe = () => () => {}\n","import {createGlobalScopedContext} from '../../lib/createGlobalScopedContext'\nimport {ToastContextValue} from './types'\n\nexport const ToastContext = createGlobalScopedContext<ToastContextValue | null>(\n  '@sanity/ui/context/toast',\n  null,\n)\n","import {styled} from 'styled-components'\n\nimport {Grid} from '../../primitives/grid/grid'\nimport {useLayer} from '../../utils/layer/useLayer'\n\n/**\n * @public\n */\nexport interface ToastLayerProps {\n  children: React.ReactNode\n  padding?: number | number[]\n  paddingX?: number | number[]\n  paddingY?: number | number[]\n  gap?: number | number[]\n}\n\n/**\n * @internal\n */\nexport function ToastLayer(props: ToastLayerProps): React.JSX.Element {\n  const {children, padding = 4, paddingX, paddingY, gap = 3} = props\n  const {zIndex} = useLayer()\n\n  return (\n    <StyledLayer\n      forwardedAs=\"ul\"\n      data-ui=\"ToastProvider\"\n      padding={padding}\n      paddingX={paddingX}\n      paddingY={paddingY}\n      gap={gap}\n      gridTemplateColumns={1}\n      style={{zIndex}}\n    >\n      {children}\n    </StyledLayer>\n  )\n}\n\nconst StyledLayer = styled(Grid)`\n  box-sizing: border-box;\n  position: fixed;\n  right: 0;\n  bottom: 0;\n  list-style: none;\n  pointer-events: none;\n  max-width: 420px;\n  width: 100%;\n`\n","let toastId = 0\n\n/** @internal */\nexport function generateToastId(): string {\n  return String(toastId++)\n}\n","import {AnimatePresence} from 'motion/react'\nimport {startTransition, useMemo, useState} from 'react'\n\nimport {useMounted} from '../../hooks/useMounted'\nimport {LayerProvider} from '../../utils/layer/layerProvider'\nimport {Toast} from './toast'\nimport {ToastContext} from './toastContext'\nimport {ToastLayer, type ToastLayerProps} from './toastLayer'\nimport {generateToastId} from './toastState'\nimport {ToastContextValue, ToastParams} from './types'\n\ntype ToastState = {\n  dismiss: () => void\n  id: string\n  updatedAt: number\n  params: ToastParams\n}[]\n\n/**\n * @public\n */\nexport interface ToastProviderProps extends Omit<ToastLayerProps, 'children'> {\n  children?: React.ReactNode\n  zOffset?: number | number[]\n}\n\n/**\n * @public\n */\nexport function ToastProvider(props: ToastProviderProps): React.JSX.Element {\n  const {children, padding, paddingX, paddingY, gap, zOffset = 1} = props\n  const [state, setState] = useState<ToastState>([])\n  const mounted = useMounted()\n\n  const value: ToastContextValue = useMemo(() => {\n    const push = (params: ToastParams) => {\n      const id = params.id || generateToastId()\n      const duration = params.duration || 5000\n\n      startTransition(() => {\n        setState((prevState): ToastState => {\n          /**\n           * Backwards compatibility for `sanity` patterns workaround a lack of programatically dismissible toasts.\n           * It uses a super short duration that closes the toast immediately in previous versions of `@sanity/ui`.\n           * We interpret this as a request to dismiss the toast immediately, and remove it from the state right away.\n           * Even once we support programatic dismissal we'll need to keep this for backwards compatibility with v2 and v1.\n           */\n          if (duration === 0.01) {\n            return prevState.filter((toast) => toast.id !== id)\n          }\n\n          /**\n           * Creates a function to dismiss this specific toast.\n           * This function will be passed to the Toast component\n           * and called either on close button click or after duration.\n           */\n          const dismiss = () =>\n            startTransition(() =>\n              setState((currentState) => currentState.filter((toast) => toast.id !== id)),\n            )\n\n          /**\n           * Create updated state by:\n           * 1. Removing any existing toast with the same ID (prevents duplicates)\n           * 2. Adding the new toast with its dismiss handler\n           * 3. Updates the `updatedAt` timestamp, which resets progress bar count downs.\n           */\n          return [\n            ...prevState.filter((toast) => toast.id !== id),\n            {\n              dismiss,\n              id,\n              updatedAt: Date.now(),\n              params: {...params, duration},\n            },\n          ]\n        })\n      })\n\n      return id\n    }\n\n    return {version: 0.0, push}\n  }, [])\n\n  return (\n    <ToastContext.Provider value={value}>\n      {children}\n      {mounted && (\n        <LayerProvider zOffset={zOffset}>\n          <ToastLayer padding={padding} paddingX={paddingX} paddingY={paddingY} gap={gap}>\n            <AnimatePresence initial={false} mode=\"popLayout\">\n              {state.map(({dismiss, id, params, updatedAt}) => (\n                <Toast\n                  key={id}\n                  closable={params.closable}\n                  description={params.description}\n                  onClose={dismiss}\n                  status={params.status}\n                  title={params.title}\n                  duration={params.duration}\n                  updatedAt={updatedAt}\n                />\n              ))}\n            </AnimatePresence>\n          </ToastLayer>\n        </LayerProvider>\n      )}\n    </ToastContext.Provider>\n  )\n}\n","import {useContext} from 'react'\n\nimport {isRecord} from '../../lib/isRecord'\nimport {ToastContext} from './toastContext'\nimport {ToastContextValue} from './types'\n\n/**\n * @public\n */\nexport function useToast(): ToastContextValue {\n  const value = useContext(ToastContext)\n\n  if (!value) {\n    throw new Error('useToast(): missing context value')\n  }\n\n  // NOTE: This check is for future-compatiblity\n  // - If the value is not an object, it’s not compatible with the current version\n  // - If the value is an object, but doesn’t have `version: 0.0`, it’s not compatible with the current version\n  if (!isRecord(value) || value.version !== 0.0) {\n    throw new Error('useToast(): the context value is not compatible')\n  }\n\n  return value\n}\n"],"mappings":"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"}
+{"version":3,"file":"toast.js","names":["radius = 3","visualDuration\n    ? {type: 'spring' as const, visualDuration, bounce: 0.25}\n    : {duration: 0}","['hidden', 'initial']","['visible', 'slideIn']","['hidden', 'slideOut']","clsx(toast, className)","title && (\n              <Text size={1} weight=\"medium\">\n                {title}\n              </Text>\n            )","description && (\n              <MotionText muted size={1} variants={content} transition={transition}>\n                {description}\n              </MotionText>\n            )","<Flex className={toastText} flex={1} padding={3}>\n          <Stack gap={3}>\n            {title && (\n              <Text size={1} weight=\"medium\">\n                {title}\n              </Text>\n            )}\n            {description && (\n              <MotionText muted size={1} variants={content} transition={transition}>\n                {description}\n              </MotionText>\n            )}\n          </Stack>\n        </Flex>","closable && (\n          <Box padding={1}>\n            <Button\n              as=\"button\"\n              icon={CloseIcon}\n              mode=\"bleed\"\n              padding={2}\n              tone={buttonTone}\n              onClick={onClose}\n              style={{verticalAlign: 'top'}}\n            />\n          </Box>\n        )","<MotionFlex align=\"flex-start\" variants={content} transition={transition}>\n        <Flex className={toastText} flex={1} padding={3}>\n          <Stack gap={3}>\n            {title && (\n              <Text size={1} weight=\"medium\">\n                {title}\n              </Text>\n            )}\n            {description && (\n              <MotionText muted size={1} variants={content} transition={transition}>\n                {description}\n              </MotionText>\n            )}\n          </Stack>\n        </Flex>\n\n        {closable && (\n          <Box padding={1}>\n            <Button\n              as=\"button\"\n              icon={CloseIcon}\n              mode=\"bleed\"\n              padding={2}\n              tone={buttonTone}\n              onClick={onClose}\n              style={{verticalAlign: 'top'}}\n            />\n          </Box>\n        )}\n      </MotionFlex>","hasDuration && (\n        <motion.div className={loadingBar} variants={content} transition={transition}>\n          <Card className={loadingBarMask} tone={cardTone} radius={radius} />\n          <LoadingBarProgress\n            key={`progress-${updatedAt}`}\n            duration={duration}\n            onComplete={onClose}\n            tone={cardTone}\n            visualDuration={visualDuration}\n          />\n        </motion.div>\n      )","motion.div","<MotionCard\n      className={clsx(toast, className)}\n      data-ui=\"Toast\"\n      role={role}\n      {...restProps}\n      data-has-duration={hasDuration ? '' : undefined}\n      custom={visualDuration}\n      radius={radius}\n      shadow={2}\n      tone={cardTone}\n      as=\"li\"\n      layout=\"position\"\n      variants={container}\n      initial={initial}\n      animate={animate}\n      exit={exit}\n      transition={transition}\n    >\n      <MotionFlex align=\"flex-start\" variants={content} transition={transition}>\n        <Flex className={toastText} flex={1} padding={3}>\n          <Stack gap={3}>\n            {title && (\n              <Text size={1} weight=\"medium\">\n                {title}\n              </Text>\n            )}\n            {description && (\n              <MotionText muted size={1} variants={content} transition={transition}>\n                {description}\n              </MotionText>\n            )}\n          </Stack>\n        </Flex>\n\n        {closable && (\n          <Box padding={1}>\n            <Button\n              as=\"button\"\n              icon={CloseIcon}\n              mode=\"bleed\"\n              padding={2}\n              tone={buttonTone}\n              onClick={onClose}\n              style={{verticalAlign: 'top'}}\n            />\n          </Box>\n        )}\n      </MotionFlex>\n      {hasDuration && (\n        <motion.div className={loadingBar} variants={content} transition={transition}>\n          <Card className={loadingBarMask} tone={cardTone} radius={radius} />\n          <LoadingBarProgress\n            key={`progress-${updatedAt}`}\n            duration={duration}\n            onComplete={onClose}\n            tone={cardTone}\n            visualDuration={visualDuration}\n          />\n        </motion.div>\n      )}\n    </MotionCard>","hasDuration ? '' : undefined","{'--toast-loading-bar-bg': color.button.default[tone].enabled.bg}","bg","color.button.default[tone]","{scaleX: 0}","{scaleX: 1}","{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}","duration / 1_000","<MotionCard\n      className={loadingBarProgress}\n      tone={tone}\n      style={{'--toast-loading-bar-bg': color.button.default[tone].enabled.bg}}\n      initial={{scaleX: 0}}\n      animate={{scaleX: 1}}\n      transition={{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}}\n      onAnimationComplete={onComplete}\n    />","() => true","() => false","padding = 4","gap = 3","{zIndex}","<Grid\n      as=\"ul\"\n      className={toastLayer}\n      data-ui=\"ToastProvider\"\n      padding={padding}\n      paddingX={paddingX}\n      paddingY={paddingY}\n      gap={gap}\n      gridTemplateColumns={1}\n      style={{zIndex}}\n    >\n      {children}\n    </Grid>","zOffset = 1","[]","{version: 0.0, push}","toast","useMemo(() => {\n    const push = (params: ToastParams) => {\n      const id = params.id || generateToastId()\n      const duration = params.duration || 5000\n\n      startTransition(() => {\n        setState((prevState): ToastState => {\n          /**\n           * Backwards compatibility for `sanity` patterns workaround a lack of programatically dismissible toasts.\n           * It uses a super short duration that closes the toast immediately in previous versions of `@sanity/ui`.\n           * We interpret this as a request to dismiss the toast immediately, and remove it from the state right away.\n           * Even once we support programatic dismissal we'll need to keep this for backwards compatibility with v2 and v1.\n           */\n          if (duration === 0.01) {\n            return prevState.filter((toast) => toast.id !== id)\n          }\n\n          /**\n           * Creates a function to dismiss this specific toast.\n           * This function will be passed to the Toast component\n           * and called either on close button click or after duration.\n           */\n          const dismiss = () =>\n            startTransition(() =>\n              setState((currentState) => currentState.filter((toast) => toast.id !== id)),\n            )\n\n          /**\n           * Create updated state by:\n           * 1. Removing any existing toast with the same ID (prevents duplicates)\n           * 2. Adding the new toast with its dismiss handler\n           * 3. Updates the `updatedAt` timestamp, which resets progress bar count downs.\n           */\n          return [\n            ...prevState.filter((toast) => toast.id !== id),\n            {\n              dismiss,\n              id,\n              updatedAt: Date.now(),\n              params: {...params, duration},\n            },\n          ]\n        })\n      })\n\n      return id\n    }\n\n    return {version: 0.0, push}\n  }, [])","mounted && (\n        <LayerProvider zOffset={zOffset}>\n          <ToastLayer padding={padding} paddingX={paddingX} paddingY={paddingY} gap={gap}>\n            <AnimatePresence initial={false} mode=\"popLayout\">\n              {state.map(({dismiss, id, params, updatedAt}) => (\n                <Toast\n                  key={id}\n                  closable={params.closable}\n                  description={params.description}\n                  onClose={dismiss}\n                  status={params.status}\n                  title={params.title}\n                  duration={params.duration}\n                  updatedAt={updatedAt}\n                />\n              ))}\n            </AnimatePresence>\n          </ToastLayer>\n        </LayerProvider>\n      )","({dismiss, id, params, updatedAt}) => (\n                <Toast\n                  key={id}\n                  closable={params.closable}\n                  description={params.description}\n                  onClose={dismiss}\n                  status={params.status}\n                  title={params.title}\n                  duration={params.duration}\n                  updatedAt={updatedAt}\n                />\n              )","<ToastContext.Provider value={value}>\n      {children}\n      {mounted && (\n        <LayerProvider zOffset={zOffset}>\n          <ToastLayer padding={padding} paddingX={paddingX} paddingY={paddingY} gap={gap}>\n            <AnimatePresence initial={false} mode=\"popLayout\">\n              {state.map(({dismiss, id, params, updatedAt}) => (\n                <Toast\n                  key={id}\n                  closable={params.closable}\n                  description={params.description}\n                  onClose={dismiss}\n                  status={params.status}\n                  title={params.title}\n                  duration={params.duration}\n                  updatedAt={updatedAt}\n                />\n              ))}\n            </AnimatePresence>\n          </ToastLayer>\n        </LayerProvider>\n      )}\n    </ToastContext.Provider>","ToastContext.Provider","{dismiss, id, params, updatedAt}","params","dismiss","id"],"sources":["../src/core/components/toast/styles.ts","../src/core/components/toast/toast.css.ts","../src/core/components/toast/toast.tsx","../src/core/hooks/useMounted.ts","../src/core/components/toast/toastContext.ts","../src/core/components/toast/toastLayer.css.ts","../src/core/components/toast/toastLayer.tsx","../src/core/components/toast/toastState.ts","../src/core/components/toast/toastProvider.tsx","../src/core/components/toast/useToast.ts"],"sourcesContent":["import {ThemeColorStateToneKey} from '../../../theme/system/color/_system'\nimport type {ButtonTone} from '../../types/button'\n\nexport const STATUS_CARD_TONE = {\n  error: 'critical',\n  warning: 'caution',\n  success: 'positive',\n  info: 'neutral',\n} satisfies {[key: string]: ThemeColorStateToneKey}\n\nexport const BUTTON_TONE = {\n  error: 'critical',\n  warning: 'caution',\n  success: 'positive',\n  info: 'neutral',\n} satisfies {[key: string]: ButtonTone}\n","import {style} from '@vanilla-extract/css'\n\nconst LOADING_BAR_HEIGHT = 2\n\nexport const toast = style({\n  pointerEvents: 'all',\n  width: '100%',\n  position: 'relative',\n  overflow: 'clip',\n  selectors: {\n    '&[data-has-duration]': {\n      paddingBottom: `calc(${LOADING_BAR_HEIGHT}px / 2)`,\n    },\n  },\n})\n\nexport const toastText = style({\n  overflowX: 'auto',\n})\n\nexport const loadingBar = style({\n  display: 'flex',\n  position: 'absolute',\n  bottom: '0px',\n  top: '0px',\n  left: '0px',\n  right: '0px',\n  pointerEvents: 'none',\n  zIndex: -1,\n  overflow: 'clip',\n  background: 'transparent',\n  alignItems: 'flex-end',\n  willChange: 'opacity',\n})\n\nexport const loadingBarMask = style({\n  position: 'absolute',\n  top: 0,\n  left: `-${LOADING_BAR_HEIGHT}px`,\n  right: `-${LOADING_BAR_HEIGHT}px`,\n  bottom: `${LOADING_BAR_HEIGHT}px`,\n  zIndex: 1,\n})\n\nexport const loadingBarProgress = style({\n  display: 'block',\n  height: '100%',\n  width: '100%',\n  transformOrigin: '0% 50%',\n  selectors: {\n    '&&': {\n      backgroundColor: 'var(--toast-loading-bar-bg)',\n    },\n  },\n})\n","import {CloseIcon} from '@sanity/icons/Close'\nimport {clsx} from 'clsx/lite'\nimport {motion, stagger, type Variant, type Variants} from 'motion/react'\n\nimport {ThemeColorStateToneKey} from '../../../theme/system/color/_system'\nimport {usePrefersReducedMotion} from '../../hooks/usePrefersReducedMotion'\nimport {Box} from '../../primitives/box/box'\nimport {Button} from '../../primitives/button/button'\nimport {Card} from '../../primitives/card/card'\nimport {Flex} from '../../primitives/flex/flex'\nimport {Stack} from '../../primitives/stack/stack'\nimport {Text} from '../../primitives/text/text'\nimport {useTheme_v2} from '../../theme/useTheme'\nimport {BUTTON_TONE, STATUS_CARD_TONE} from './styles'\n\nimport {loadingBar, loadingBarMask, loadingBarProgress, toast, toastText} from './toast.css'\n\n/**\n * @public\n */\nexport interface ToastProps {\n  closable?: boolean\n  description?: React.ReactNode\n  onClose: () => void\n  radius?: number | number[]\n  title?: React.ReactNode\n  status?: 'error' | 'warning' | 'success' | 'info'\n  duration?: number\n  updatedAt?: number\n}\n\nconst ROLES = {\n  error: 'alert',\n  warning: 'alert',\n  success: 'alert',\n  info: 'alert',\n} as const\n\n// Support pattern used by Sanity Studio, that works around the lack of `duration: Infinity` support in older @sanity/ui versions\n// https://developer.mozilla.org/en-US/docs/Web/API/setTimeout#maximum_delay_value\nconst LONG_ENOUGH_BUT_NOT_TOO_LONG = 1000 * 60 * 60 * 24 * 24\n\n/**\n * The `Toast` component gives feedback to users when an action has taken place.\n *\n * Toasts can be closed with a close button, or auto-dismiss after a certain timeout.\n *\n * @public\n */\nexport function Toast(\n  props: ToastProps &\n    Omit<\n      React.HTMLProps<HTMLDivElement>,\n      | 'as'\n      | 'height'\n      | 'ref'\n      | 'title'\n      | 'onAnimationStart'\n      | 'onDragStart'\n      | 'onDragEnd'\n      | 'onDrag'\n    >,\n): React.JSX.Element {\n  const {\n    className,\n    closable,\n    description,\n    duration,\n    onClose,\n    radius = 3,\n    title,\n    status,\n    updatedAt,\n    ...restProps\n  } = props\n  const cardTone = status ? STATUS_CARD_TONE[status] : 'default'\n  const buttonTone = status ? BUTTON_TONE[status] : 'default'\n  const role = status ? ROLES[status] : 'status'\n\n  const prefersReducedMotion = usePrefersReducedMotion()\n\n  const visualDuration: number = prefersReducedMotion ? 0 : 0.26\n  const transition = visualDuration\n    ? {type: 'spring' as const, visualDuration, bounce: 0.25}\n    : {duration: 0}\n\n  const hasDuration = duration && isFinite(duration) && duration < LONG_ENOUGH_BUT_NOT_TOO_LONG\n  const initial: ContainerVariants[] = ['hidden', 'initial']\n  const animate: ContainerVariants[] = ['visible', 'slideIn']\n  const exit: ContainerVariants[] = ['hidden', 'slideOut']\n\n  return (\n    <MotionCard\n      className={clsx(toast, className)}\n      data-ui=\"Toast\"\n      role={role}\n      {...restProps}\n      data-has-duration={hasDuration ? '' : undefined}\n      custom={visualDuration}\n      radius={radius}\n      shadow={2}\n      tone={cardTone}\n      as=\"li\"\n      layout=\"position\"\n      variants={container}\n      initial={initial}\n      animate={animate}\n      exit={exit}\n      transition={transition}\n    >\n      <MotionFlex align=\"flex-start\" variants={content} transition={transition}>\n        <Flex className={toastText} flex={1} padding={3}>\n          <Stack gap={3}>\n            {title && (\n              <Text size={1} weight=\"medium\">\n                {title}\n              </Text>\n            )}\n            {description && (\n              <MotionText muted size={1} variants={content} transition={transition}>\n                {description}\n              </MotionText>\n            )}\n          </Stack>\n        </Flex>\n\n        {closable && (\n          <Box padding={1}>\n            <Button\n              as=\"button\"\n              icon={CloseIcon}\n              mode=\"bleed\"\n              padding={2}\n              tone={buttonTone}\n              onClick={onClose}\n              style={{verticalAlign: 'top'}}\n            />\n          </Box>\n        )}\n      </MotionFlex>\n      {hasDuration && (\n        <motion.div className={loadingBar} variants={content} transition={transition}>\n          <Card className={loadingBarMask} tone={cardTone} radius={radius} />\n          <LoadingBarProgress\n            key={`progress-${updatedAt}`}\n            duration={duration}\n            onComplete={onClose}\n            tone={cardTone}\n            visualDuration={visualDuration}\n          />\n        </motion.div>\n      )}\n    </MotionCard>\n  )\n}\n\ninterface LoadingBarProgressProps {\n  duration: number\n  onComplete: () => void\n  tone: ThemeColorStateToneKey\n  visualDuration: number\n}\n\nfunction LoadingBarProgress(props: LoadingBarProgressProps) {\n  const {duration, onComplete, tone, visualDuration} = props\n  const {color} = useTheme_v2()\n\n  return (\n    <MotionCard\n      className={loadingBarProgress}\n      tone={tone}\n      style={{'--toast-loading-bar-bg': color.button.default[tone].enabled.bg}}\n      initial={{scaleX: 0}}\n      animate={{scaleX: 1}}\n      transition={{delay: visualDuration, duration: duration / 1_000, ease: 'linear'}}\n      onAnimationComplete={onComplete}\n    />\n  )\n}\n\nconst container = {\n  initial: {y: 32, scale: 0.5, zIndex: 1},\n  hidden: {opacity: 0},\n  visible: (visualDuration: number) => {\n    if (!visualDuration) return {opacity: 1}\n\n    return {\n      opacity: 1,\n      transition: {\n        when: 'beforeChildren',\n        delayChildren: stagger(visualDuration / 3),\n        duration: visualDuration / 3,\n      },\n    }\n  },\n  slideIn: {\n    y: 0,\n    scale: 1,\n  },\n  slideOut: {\n    zIndex: 0,\n    scale: 0.75,\n  },\n} satisfies Variants\ntype ContainerVariants = keyof typeof container\n\nconst content = {\n  initial: {\n    willChange: 'transform',\n  },\n  hidden: {\n    opacity: 0,\n  },\n  visible: {\n    opacity: 1,\n  },\n} satisfies Partial<Record<ContainerVariants, Variant>>\n\nconst MotionCard = motion.create(Card)\nconst MotionFlex = motion.create(Flex)\nconst MotionText = motion.create(Text)\n","import {useSyncExternalStore} from 'react'\n\n/**\n * Some components should only render after mounting to the DOM, and not be rendered at all during SSR renderToString or equivalent.\n * @public\n */\nexport function useMounted(): boolean {\n  return useSyncExternalStore(\n    subscribe,\n    () => true,\n    () => false,\n  )\n}\n\nconst subscribe = () => () => {}\n","import {createGlobalScopedContext} from '../../lib/createGlobalScopedContext'\nimport {ToastContextValue} from './types'\n\nexport const ToastContext = createGlobalScopedContext<ToastContextValue | null>(\n  '@sanity/ui/context/toast',\n  null,\n)\n","import {style} from '@vanilla-extract/css'\n\nexport const toastLayer = style({\n  boxSizing: 'border-box',\n  position: 'fixed',\n  right: 0,\n  bottom: 0,\n  listStyle: 'none',\n  pointerEvents: 'none',\n  maxWidth: '420px',\n  width: '100%',\n})\n","import {Grid} from '../../primitives/grid/grid'\nimport {useLayer} from '../../utils/layer/useLayer'\n\nimport {toastLayer} from './toastLayer.css'\n\n/**\n * @public\n */\nexport interface ToastLayerProps {\n  children: React.ReactNode\n  padding?: number | number[]\n  paddingX?: number | number[]\n  paddingY?: number | number[]\n  gap?: number | number[]\n}\n\n/**\n * @internal\n */\nexport function ToastLayer(props: ToastLayerProps): React.JSX.Element {\n  const {children, padding = 4, paddingX, paddingY, gap = 3} = props\n  const {zIndex} = useLayer()\n\n  return (\n    <Grid\n      as=\"ul\"\n      className={toastLayer}\n      data-ui=\"ToastProvider\"\n      padding={padding}\n      paddingX={paddingX}\n      paddingY={paddingY}\n      gap={gap}\n      gridTemplateColumns={1}\n      style={{zIndex}}\n    >\n      {children}\n    </Grid>\n  )\n}\n","let toastId = 0\n\n/** @internal */\nexport function generateToastId(): string {\n  return String(toastId++)\n}\n","import {AnimatePresence} from 'motion/react'\nimport {startTransition, useMemo, useState} from 'react'\n\nimport {useMounted} from '../../hooks/useMounted'\nimport {LayerProvider} from '../../utils/layer/layerProvider'\nimport {Toast} from './toast'\nimport {ToastContext} from './toastContext'\nimport {ToastLayer, type ToastLayerProps} from './toastLayer'\nimport {generateToastId} from './toastState'\nimport {ToastContextValue, ToastParams} from './types'\n\ntype ToastState = {\n  dismiss: () => void\n  id: string\n  updatedAt: number\n  params: ToastParams\n}[]\n\n/**\n * @public\n */\nexport interface ToastProviderProps extends Omit<ToastLayerProps, 'children'> {\n  children?: React.ReactNode\n  zOffset?: number | number[]\n}\n\n/**\n * @public\n */\nexport function ToastProvider(props: ToastProviderProps): React.JSX.Element {\n  const {children, padding, paddingX, paddingY, gap, zOffset = 1} = props\n  const [state, setState] = useState<ToastState>([])\n  const mounted = useMounted()\n\n  const value: ToastContextValue = useMemo(() => {\n    const push = (params: ToastParams) => {\n      const id = params.id || generateToastId()\n      const duration = params.duration || 5000\n\n      startTransition(() => {\n        setState((prevState): ToastState => {\n          /**\n           * Backwards compatibility for `sanity` patterns workaround a lack of programatically dismissible toasts.\n           * It uses a super short duration that closes the toast immediately in previous versions of `@sanity/ui`.\n           * We interpret this as a request to dismiss the toast immediately, and remove it from the state right away.\n           * Even once we support programatic dismissal we'll need to keep this for backwards compatibility with v2 and v1.\n           */\n          if (duration === 0.01) {\n            return prevState.filter((toast) => toast.id !== id)\n          }\n\n          /**\n           * Creates a function to dismiss this specific toast.\n           * This function will be passed to the Toast component\n           * and called either on close button click or after duration.\n           */\n          const dismiss = () =>\n            startTransition(() =>\n              setState((currentState) => currentState.filter((toast) => toast.id !== id)),\n            )\n\n          /**\n           * Create updated state by:\n           * 1. Removing any existing toast with the same ID (prevents duplicates)\n           * 2. Adding the new toast with its dismiss handler\n           * 3. Updates the `updatedAt` timestamp, which resets progress bar count downs.\n           */\n          return [\n            ...prevState.filter((toast) => toast.id !== id),\n            {\n              dismiss,\n              id,\n              updatedAt: Date.now(),\n              params: {...params, duration},\n            },\n          ]\n        })\n      })\n\n      return id\n    }\n\n    return {version: 0.0, push}\n  }, [])\n\n  return (\n    <ToastContext.Provider value={value}>\n      {children}\n      {mounted && (\n        <LayerProvider zOffset={zOffset}>\n          <ToastLayer padding={padding} paddingX={paddingX} paddingY={paddingY} gap={gap}>\n            <AnimatePresence initial={false} mode=\"popLayout\">\n              {state.map(({dismiss, id, params, updatedAt}) => (\n                <Toast\n                  key={id}\n                  closable={params.closable}\n                  description={params.description}\n                  onClose={dismiss}\n                  status={params.status}\n                  title={params.title}\n                  duration={params.duration}\n                  updatedAt={updatedAt}\n                />\n              ))}\n            </AnimatePresence>\n          </ToastLayer>\n        </LayerProvider>\n      )}\n    </ToastContext.Provider>\n  )\n}\n","import {useContext} from 'react'\n\nimport {isRecord} from '../../lib/isRecord'\nimport {ToastContext} from './toastContext'\nimport {ToastContextValue} from './types'\n\n/**\n * @public\n */\nexport function useToast(): ToastContextValue {\n  const value = useContext(ToastContext)\n\n  if (!value) {\n    throw new Error('useToast(): missing context value')\n  }\n\n  // NOTE: This check is for future-compatiblity\n  // - If the value is not an object, it’s not compatible with the current version\n  // - If the value is an object, but doesn’t have `version: 0.0`, it’s not compatible with the current version\n  if (!isRecord(value) || value.version !== 0.0) {\n    throw new Error('useToast(): the context value is not compatible')\n  }\n\n  return value\n}\n"],"mappings":";;;;;;;;;;;;AAGA,MAAa,mBAAmB;CAC9B,OAAO;CACP,SAAS;CACT,SAAS;CACT,MAAM;AACR,GAEa,cAAc;CACzB,OAAO;CACP,SAAS;CACT,SAAS;CACT,MAAM;AACR;;AEgBA,MAAM,QAAQ;CACZ,OAAO;CACP,SAAS;CACT,SAAS;CACT,MAAM;AACR;;;;;;;;AAaA,SAAgB,MACd,OAYmB;gBAEjB,WACA,UACA,aACA,UACA,SAKG,WAFH,QAFAA,IACA,OAEA;CAEE,AAAA,EAAA,OAAA,iLAXE,CACJ,WACA,UACA,aACA,UACA,SACA,QAAA,IACA,OACA,QACA,WACA,GAAA,aACE;CALF,IAAA,SAAA,OAAA,KAAA,IAAS,IAATA,IAMI,WAAW,SAAS,iBAAiB,UAAU,WAC/C,aAAa,SAAS,YAAY,UAAU,WAC5C,OAAO,SAAS,MAAM,UAAU,UAIhC,iBAFuB,wBAEE,IAAuB,IAAI,KACvCC;0CACf,KAAA,iBAAA;EAAC,MAAM;EAAmB;EAAgB,QAAQ;CAAI,IACtD,EAAC,UAAU,EAAC,GAFG,EAAA,MAAA;CAAnB,IAAM,aAAaA,IAIb,cAAc,YAAY,SAAS,QAAQ,KAAK,WAAW,SAC5BC;sDAAC,KAAA,CAAA,UAAU,SAAS;CAAzD,IAAM,UAA+BA,IACAC;sDAAC,KAAA,CAAA,WAAW,SAAS;CAA1D,IAAM,UAA+BA,IACHC;sDAAC,KAAA,CAAA,UAAU,UAAU;CAAvD,IAAM,OAA4BA,IAInBC;CAAY,AAAA,EAAA,QAAA,0BAAZ,KAAA,KAAK,OAAO,SAAS,GAAT,EAAA,MAAA;CAIJ,IAAA,KAAA,cAAc,KAAK,KAAA,GAgB/BC;iCACC,KAAA,SAAA,oBAAC,MAAD;EAAM,MAAM;EAAG,QAAO;EACnB,UAAA;CACG,CAAA,GAHP,EAAA,MAAA;CAKAC,IAAAA;CAC2D,AAAA,EAAA,QAAA,eAAA,EAAA,QAAA,cAD3D,KAAA,eACC,oBAAC,YAAD;EAAY,OAAA;EAAM,MAAM;EAAG,UAAU;EAAqB;EACvD,UAAA;CACS,CAAA,GAHb,EAAA,MAAA,aAC2D,EAAA,MAAA;CARhEC,IAAAA;CAEKF,AAAAA,EAAAA,QAAAA,MAAAA,EAAAA,QAKAC,MAPL,KAAA,oBAAC,MAAD;EAAM,WAAW;EAAW,MAAM;EAAG,SAAS;EAC5C,UAAA,qBAAC,OAAD;GAAO,KAAK;GAAZ,UAAA,CACGD,IAKAC,EAKI;;CACH,CAAA,GAXDD,EAAAA,MAAAA,IAKAC,EAAAA,MAAAA;CAQJE,IAAAA;CAOW,AAAA,EAAA,QAAA,cAAA,EAAA,QAPX,YAAA,EAAA,QAQc,WARd,MAAA,YACC,oBAAC,KAAD;EAAK,SAAS;EACZ,UAAA,oBAAC,QAAD;GACE,IAAG;GACH,MAAM;GACN,MAAK;GACL,SAAS;GACT,MAAM;GACN,SAAS;GACT,OAAO,EAAC,eAAe,MAAK;EAC7B,CAAA;CACE,CAAA,GAJK,EAAA,MAAA,YAPX,EAAA,MAAA,UAQc,EAAA,MAAA;CAxBjBC,IAAAA;CAgBGD,AAAAA,EAAAA,QAAAA,OAAAA,EAAAA,QAfDD,MAAAA,EAAAA,QAD4D,cAA9D,MAAA,qBAAC,YAAD;EAAY,OAAM;EAAa,UAAU;EAAqB;EAA9D,UAAA,CACEA,IAeCC,GAaS;KAbTA,EAAAA,MAAAA,KAfDD,EAAAA,MAAAA,IAD4D,EAAA,MAAA;CA8B7DG,IAAAA;CAE0C,AAAA,EAAA,QAAA,YAAA,EAAA,QAG3B,YAAA,EAAA,QALf,eAAA,EAAA,QAMiB,WAAA,EAAA,QAJ2C,UAAA,EAAA,QADO,cAAA,EAAA,QAG7C,aAAA,EAAA,QAID,kBARrB,MAAA,eACC,qBAACC,OAAAA,KAAD;EAAY,WAAA;EAAuB,UAAU;EAAqB;EAAlE,UAAA,CACE,oBAAC,MAAD;GAAM,WAAA;GAA2B,MAAM;GAAkB;EAAS,CAAA,GAClE,oBAAC,oBAAD;GAEY;GACV,YAAY;GACZ,MAAM;GACU;EACjB,GALM,YAAY,WAKlB,CACS;KAR6B,EAAA,MAAA,UAG3B,EAAA,MAAA,UALf,EAAA,MAAA,aAMiB,EAAA,MAAA,SAJ2C,EAAA,MAAA,QADO,EAAA,MAAA,YAG7C,EAAA,MAAA,WAID,EAAA,MAAA;CAxDxBC,IAAAA;CADF,OAUU,EAAA,QAAA,YAAA,EAAA,QAFE,UAAA,EAAA,QAHJ,aAAA,EAAA,QADE,QAAA,EAAA,QAeNH,OAAAA,EAAAA,QA8BCC,OAAAA,EAAAA,QA/CUN,MAAAA,EAAAA,QAIQS,MAAAA,EAAAA,QAWP,cAAA,EAAA,QAVJ,kBANV,MAAA,qBAAC,YAAD;EACE,WAAWT;EACX,WAAQ;EACF;EACN,GAAI;EACJ,qBAAmBS;EACnB,QAAQ;EACA;EACR,QAAQ;EACR,MAAM;EACN,IAAG;EACH,QAAO;EACP,UAAU;EACD;EACA;EACH;EACM;EAhBd,UAAA,CAkBEJ,KA8BCC,GAYS;KAnDJ,EAAA,MAAA,UAFE,EAAA,MAAA,QAHJ,EAAA,MAAA,WADE,EAAA,MAAA,MAeND,EAAAA,MAAAA,KA8BCC,EAAAA,MAAAA,KA/CUN,EAAAA,MAAAA,IAIQS,EAAAA,MAAAA,IAWP,EAAA,MAAA,YAVJ,EAAA,MAAA,4CANVD;AA8DJ;AASA,SAAS,mBAAmB,OAAgC;gBACpD,EAAC,UAAU,YAAY,MAAM,mBAAkB,OAC/C,EAAC,UAAS,YAAY,GAMU,KAAA,MAAM,OAAO,QAAQ,OAAhDE;CAA8DC,AAAAA,EAAAA,OAAAA,GAAR,QAAQ,kBAA9D,KAAA,EAAC,0BAA0BC,GAA2B,QAAQ,GAAE,GAAFD,EAAAA,KAAAA,GAAR,QAAQ;CAC5DE,IAAAA,IACAC;qDADA,KAAA,EAAC,QAAQ,EAAC,GACV,KAAA,EAAC,QAAQ,EAAC;CAC2B,IAAA,KAAA,WAAW,KAA7CC;CAAkCC,AAAAA,EAAAA,OAAAA,MAAAA,EAAAA,OAA1B,kBAAR,KAAA;EAAC,OAAO;EAAgB,UAAUA;EAAkB,MAAM;CAAQ,GAAhCA,EAAAA,KAAAA,IAA1B,EAAA,KAAA;CANtBC,IAAAA;CADF,OAQyB,EAAA,OAAA,cAAA,EAAA,OAJdP,MAAAA,EAAAA,OAGKK,MAAAA,EAAAA,QAJN,QAFR,KAAA,oBAAC,YAAD;EACE,WAAW;EACL;EACN,OAAOL;EACP,SAASG;EACT,SAASC;EACT,YAAYC;EACZ,qBAAqB;CACtB,CAAA,GADsB,EAAA,KAAA,YAJdL,EAAAA,KAAAA,IAGKK,EAAAA,KAAAA,IAJN,EAAA,MAAA,gCAFRE;AAUJ;AAEA,MAAM,YAAY;CAChB,SAAS;EAAC,GAAG;EAAI,OAAO;EAAK,QAAQ;CAAC;CACtC,QAAQ,EAAC,SAAS,EAAC;CACnB,UAAU,mBACH,iBAEE;EACL,SAAS;EACT,YAAY;GACV,MAAM;GACN,eAAe,QAAQ,iBAAiB,CAAC;GACzC,UAAU,iBAAiB;EAC7B;CACF,IAT4B,EAAC,SAAS,EAAC;CAWzC,SAAS;EACP,GAAG;EACH,OAAO;CACT;CACA,UAAU;EACR,QAAQ;EACR,OAAO;CACT;AACF,GAGM,UAAU;CACd,SAAS,EACP,YAAY,YACd;CACA,QAAQ,EACN,SAAS,EACX;CACA,SAAS,EACP,SAAS,EACX;AACF,GAEM,aAAa,OAAO,OAAO,IAAI,GAC/B,aAAa,OAAO,OAAO,IAAI,GAC/B,aAAa,OAAO,OAAO,IAAI;;;;;ACtNrC,SAAgB,aAAsB;CACpC,OAAO,qBACL,WACAC,SACAC,MACF;AACF;AAFI,SAAA,SAAA;CAAM,OAAA;;AADN,SAAA,UAAA;CAAM,OAAA;;AAKV,MAAM,wBAAwB,CAAC,GCXlB,eAAe,0BAC1B,4BACA,IACF;;;;;AEaA,SAAgB,WAAW,OAA2C;eAC9D,EAAC,UAAU,SAAA,IAAa,UAAU,UAAU,KAAA,OAAW,OAA5C,UAAA,OAAA,KAAA,IAAU,IAAVC,IAAiC,MAAA,OAAA,KAAA,IAAM,IAANC,IAC5C,EAAC,WAAU,SAAS,GAYfC;CAAC,AAAA,EAAA,OAAA,sBAAD,KAAA,EAAC,OAAM,GAAN,EAAA,KAAA;CATVC,IAAAA;CADF,OAYK,EAAA,OAAA,YAAA,EAAA,OAJI,OAAA,EAAA,OAHI,WAAA,EAAA,OACC,YAAA,EAAA,OACA,YAAA,EAAA,OAGHD,MATT,KAAA,oBAAC,MAAD;EACE,IAAG;EACH,WAAW;EACX,WAAQ;EACC;EACC;EACA;EACL;EACL,qBAAqB;EACrB,OAAOA;EAEN;CACG,CAAA,GADH,EAAA,KAAA,UAJI,EAAA,KAAA,KAHI,EAAA,KAAA,SACC,EAAA,KAAA,UACA,EAAA,KAAA,UAGHA,EAAAA,KAAAA,4BATTC;AAcJ;ACtCA,IAAI,UAAU;;AAGd,SAAgB,kBAA0B;CACxC,OAAO,OAAO,SAAS;AACzB;;;;ACwBA,SAAgB,cAAc,OAA8C;gBACpE,EAAC,UAAU,SAAS,UAAU,UAAU,KAAK,SAAA,OAAe,OAAf,UAAA,OAAA,KAAA,IAAU,IAAVC,IACJC;qDAAC,KAAA,CAAA;CAAhD,IAAM,CAAC,OAAO,YAAY,SAAqBA,EAAE,GAC3C,UAAU,WAAW,GAkDlBC;;EA/CP,IAAM,QAAQ,WAAwB;GACpC,IAAM,KAAK,OAAO,MAAM,gBAAgB,GAClC,WAAW,OAAO,YAAY;GA0CpC,OAxCA,sBAAsB;IACpB,UAAU,cAA0B;KAOlC,IAAI,aAAa,KACf,OAAO,UAAU,QAAQ,UAAU,MAAM,OAAO,EAAE;KAQpD,IAAM,gBACJ,sBACE,UAAU,iBAAiB,aAAa,QAAQ,YAAUC,QAAM,OAAO,EAAE,CAAC,CAC5E;KAQF,OAAO,CACL,GAAG,UAAU,QAAQ,YAAUA,QAAM,OAAO,EAAE,GAC9C;MACE;MACA;MACA,WAAW,KAAK,IAAI;MACpB,QAAQ;OAAC,GAAG;OAAQ;MAAQ;KAC9B,CACF;IACF,CAAC;GACH,CAAC,GAEM;EACT;EAEO,KAAA;GAAC,SAAS;GAAK;EAAI;;CAhD5B,IAAM,QAA2BC,IAsD5BC;CAE8E,AAAA,EAAA,OAAA,OAAA,EAAA,OAF9E,WAAA,EAAA,OAEwB,WAAA,EAAA,OAAmB,YAAA,EAAA,OAAoB,YAAA,EAAA,OAEvD,SAAA,EAAA,OAHiB,WADzB,KAAA,WACC,oBAAC,eAAD;EAAwB;EACtB,UAAA,oBAAC,YAAD;GAAqB;GAAmB;GAAoB;GAAe;GACzE,UAAA,oBAAC,iBAAD;IAAiB,SAAS;IAAO,MAAK;IACnC,UAAA,MAAM,IAAIC,KAWV;GACc,CAAA;EACP,CAAA;CACC,CAAA,GAhB8D,EAAA,KAAA,KAF9E,EAAA,KAAA,SAEwB,EAAA,KAAA,SAAmB,EAAA,KAAA,UAAoB,EAAA,KAAA,UAEvD,EAAA,KAAA,OAHiB,EAAA,KAAA;CAH5BC,IAAAA;CADF,OAEK,EAAA,QAAA,YAAA,EAAA,QACAF,MAFH,KAAA,qBAACG,aAAAA,UAAD;EAA8B;EAA9B,UAAA,CACG,UACAH,EAoBoB;KArBpB,EAAA,MAAA,UACAA,EAAAA,MAAAA,8BAFHE;AAwBJ;AAlByB,SAAA,MAAA,IAAC;CAAC,IAAA,EAAA,SAAA,WAAS,IAAA,MAAI,QAAA,UAAQ,cAAtBE;CACV,OAAA,oBAAC,OAAD;EAEE,UAAUC,SAAO;EACjB,aAAaA,SAAO;EACpB,SAASC;EACT,QAAQD,SAAO;EACf,OAAOA,SAAO;EACd,UAAUA,SAAO;EACN;CACZ,GARME,IAQN;AAVwC;;;;ACnFzD,SAAgB,WAA8B;CAC5C,IAAM,QAAQ,WAAW,YAAY;CAErC,IAAI,CAAC,OACH,MAAU,MAAM,mCAAmC;CAMrD,IAAI,CAAC,SAAS,KAAK,KAAK,MAAM,YAAY,GACxC,MAAU,MAAM,iDAAiD;CAGnE,OAAO;AACT"}

package/dist/tooltip.d.ts

@@ -43,7 +43,7 @@ interface TooltipProps extends Omit<LayerProps, 'as'> {
  *
  * @public
  */
-declare function Tooltip(props: TooltipProps & Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'children' | 'content'>): import("react").JSX.Element;
+export declare function Tooltip(props: TooltipProps & Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'children' | 'content'>): import("react").JSX.Element;
 /**
  * @beta
  */
@@ -57,7 +57,7 @@ interface TooltipDelayGroupContextValue {
 /**
  * @beta
  */
-declare const TooltipDelayGroupContext: import("react").Context<TooltipDelayGroupContextValue | null>;
+export declare const TooltipDelayGroupContext: import("react").Context<TooltipDelayGroupContextValue | null>;
 /**
  * @public
  * */
@@ -79,10 +79,10 @@ interface TooltipDelayGroupProviderProps {
  * Provides context for a group of tooltip elements that should share a delay
  * which temporarily becomes 1 ms after the first floating element of the group opens.
  */
-declare function TooltipDelayGroupProvider(props: TooltipDelayGroupProviderProps): React.JSX.Element;
+export declare function TooltipDelayGroupProvider(props: TooltipDelayGroupProviderProps): React.JSX.Element;
 /**
  * @beta
  */
-declare function useTooltipDelayGroup(): TooltipDelayGroupContextValue | null;
-export { Tooltip, TooltipDelayGroupContext, type TooltipDelayGroupContextValue, TooltipDelayGroupProvider, type TooltipDelayGroupProviderProps, type TooltipProps, useTooltipDelayGroup };
+export declare function useTooltipDelayGroup(): TooltipDelayGroupContextValue | null;
+export type { TooltipDelayGroupContextValue, TooltipDelayGroupProviderProps, TooltipProps };
 //# sourceMappingURL=tooltip.d.ts.map

package/dist/tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.d.ts","names":[],"sources":["../src/core/primitives/tooltip/tooltip.tsx","../src/core/primitives/tooltip/tooltipDelayGroup/types.ts","../src/core/primitives/tooltip/tooltipDelayGroup/tooltipDelayGroupContext.tsx","../src/core/primitives/tooltip/tooltipDelayGroup/tooltipDelayGroupProvider.tsx","../src/core/primitives/tooltip/tooltipDelayGroup/useTooltipDelayGroup.ts"],"mappings":";;;;;UAuDiB,qBAAqB,KAAK;;EAEzC;EACA;EACA,kBAAkB;EAClB,WAAW,MAAM,IAAI;EACrB,UAAU,MAAM;EAChB;EACA,qBAAqB;EACrB;EACA,YAAY;;EAEZ;EACA;EACA,SAAS;EACT;;;;;;;;;;;EAWA,QAAQ;;;;;;;EAOR;;;;;;;iBAYc,QACd,OAAO,eAAe,KAAK,MAAM,UAAU,kEAA+C,IAAA;;;;UClG3E;EAEf,mBAAmB,WAAW,MAAM,yBAAyB;EAE7D,mBAAmB,uBAAuB;EAC1C;EACA;EACA;;;;;cCJW,0CAAwB,QAAA;;;;UCIpB;EACf,WAAW,MAAM;;;;;;;;;;EAUjB,OAAO;;;;;;;iBAQO,0BACd,OAAO,iCACN,MAAM,IAAI;;;;iBCvBG,wBAAwB"}
+{"version":3,"file":"tooltip.d.ts","names":[],"sources":["../src/core/primitives/tooltip/tooltip.tsx","../src/core/primitives/tooltip/tooltipDelayGroup/types.ts","../src/core/primitives/tooltip/tooltipDelayGroup/tooltipDelayGroupContext.tsx","../src/core/primitives/tooltip/tooltipDelayGroup/tooltipDelayGroupProvider.tsx","../src/core/primitives/tooltip/tooltipDelayGroup/useTooltipDelayGroup.ts"],"mappings":";;;;;UAyDiB,qBAAqB,KAAK;;EAEzC;EACA;EACA,kBAAkB;EAClB,WAAW,MAAM,IAAI;EACrB,UAAU,MAAM;EAChB;EACA,qBAAqB;EACrB;EACA,YAAY;;EAEZ;EACA;EACA,SAAS;EACT;;;;;;;;;;;EAWA,QAAQ;;;;;;;EAOR;;;;;;;wBAQc,QACd,OAAO,eAAe,KAAK,MAAM,UAAU,kEAA+C,IAAA;;;;UChG3E;EAEf,mBAAmB,WAAW,MAAM,yBAAyB;EAE7D,mBAAmB,uBAAuB;EAC1C;EACA;EACA;;;;;qBCJW,0CAAwB,QAAA;;;;UCIpB;EACf,WAAW,MAAM;;;;;;;;;;EAUjB,OAAO;;;;;;;wBAQO,0BACd,OAAO,iCACN,MAAM,IAAI;;;;wBCvBG,wBAAwB"}