@sanity/ui 2.14.4-canary.2 → 2.14.4-canary.3

package/dist/index.js

@@ -975,7 +975,7 @@ const LOADING_BAR_HEIGHT = 2, STATUS_CARD_TONE = {
 })`overflow-x:auto;`, StyledToast = styledComponents.styled(_visualEditing.Card).withConfig({
   displayName: "StyledToast",
   componentId: "sc-1rr7rxo-1"
-})`pointer-events:all;width:100%;position:relative;overflow:hidden;overflow:clip;will-change:opacity,transform;&[data-has-duration]{padding-bottom:calc(${LOADING_BAR_HEIGHT}px / 2);}`, LoadingBar = styledComponents.styled.div.withConfig({
+})`pointer-events:all;width:100%;position:relative;overflow:hidden;overflow:clip;&[data-has-duration]{padding-bottom:calc(${LOADING_BAR_HEIGHT}px / 2);}`, LoadingBar = styledComponents.styled.div.withConfig({
   displayName: "LoadingBar",
   componentId: "sc-1rr7rxo-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;`, LoadingBarProgress = styledComponents.styled(_visualEditing.Card).withConfig({
@@ -991,7 +991,7 @@ const LOADING_BAR_HEIGHT = 2, STATUS_CARD_TONE = {
   warning: "alert",
   success: "alert",
   info: "alert"
-};
+}, LONG_ENOUGH_BUT_NOT_TOO_LONG = 1e3 * 60 * 60 * 24 * 24;
 function Toast(props) {
   const {
     closable,
@@ -1003,15 +1003,13 @@ function Toast(props) {
     status,
     updatedAt,
     ...restProps
-  } = props, cardTone = status ? STATUS_CARD_TONE[status] : "default", buttonTone = status ? BUTTON_TONE[status] : "default", role = status ? ROLES[status] : "status";
-  let visualDuration = _visualEditing.usePrefersReducedMotion() ? 0 : 0.26;
-  const transition = visualDuration ? {
+  } = props, cardTone = status ? STATUS_CARD_TONE[status] : "default", buttonTone = status ? BUTTON_TONE[status] : "default", role = status ? ROLES[status] : "status", visualDuration = _visualEditing.usePrefersReducedMotion() ? 0 : 0.26, transition = visualDuration ? {
     type: "spring",
     visualDuration,
     bounce: 0.25
   } : {
     duration: 0
-  }, hasDuration = duration && isFinite(duration);
+  }, hasDuration = duration && isFinite(duration) && duration < LONG_ENOUGH_BUT_NOT_TOO_LONG;
   return /* @__PURE__ */ jsxRuntime.jsxs(MotionToast, { "data-ui": "Toast", role, ...restProps, "data-has-duration": hasDuration ? "" : void 0, custom: visualDuration, radius, shadow: 2, tone: cardTone, forwardedAs: "li", layout: "position", variants: container, initial: ["hidden", "initial"], animate: ["visible", "slideIn"], exit: ["hidden", "slideOut"], transition, children: [
     /* @__PURE__ */ jsxRuntime.jsxs(MotionFlex, { align: "flex-start", variants: content, transition, children: [
       /* @__PURE__ */ jsxRuntime.jsx(TextBox, { flex: 1, padding: 3, children: /* @__PURE__ */ jsxRuntime.jsxs(_visualEditing.Stack, { space: 3, children: [
@@ -1039,7 +1037,7 @@ function Toast(props) {
         delay: visualDuration,
         duration: duration / 1e3,
         ease: "linear"
-      }, onAnimationComplete: onClose }, `${duration}-${updatedAt}`)
+      }, onAnimationComplete: onClose }, `progress-${updatedAt}`)
     ] })
   ] });
 }
@@ -1072,6 +1070,9 @@ const container = {
     scale: 0.75
   }
 }, content = {
+  initial: {
+    willChange: "transform"
+  },
   hidden: {
     opacity: 0
   },
@@ -1147,7 +1148,7 @@ function ToastProvider(props) {
               });
             });
           };
-          return prevState.filter((t_0) => t_0.id !== id).concat([{
+          return duration === 0.01 ? prevState.filter((t_0) => t_0.id !== id) : prevState.filter((t_1) => t_1.id !== id).concat([{
             dismiss,
             id,
             updatedAt: Date.now(),