@astryxdesign/core 0.1.4 → 0.1.5-canary.76e6697

package/dist/TimeInput/TimeInput.js

@@ -30,7 +30,7 @@ import { useInputGroup } from "../InputGroup/InputGroupContext.js";
 import { groupStyles } from "../InputGroup/groupStyles.js";
 import { useTooltip } from "../Tooltip/index.js";
 import { themeProps } from "../utils/themeProps.js";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV, Fragment as _Fragment } from "react/jsx-dev-runtime";
 const sizeStyles = {
   sm: {
     kZKoxP: "x6k0iem",
@@ -281,7 +281,7 @@ export function TimeInput({
     inputRef,
     disabled: isDisabled
   });
-  const inputWrapper = /*#__PURE__*/_jsxs("div", {
+  const inputWrapper = /*#__PURE__*/_jsxDEV("div", {
     ref: el => {
       containerRef.current = el;
       // Anchor + hover/focus listeners for the disabled-message tooltip.
@@ -295,29 +295,29 @@ export function TimeInput({
       size,
       status: status?.type ?? null
     }), stylex.props(inputWrapperStyles.base, sizeStyles[size], isDisabled && inputWrapperStyles.disabled, status && inputStatusBorderStyles[status.type], status && inputStatusHoverShadowStyles[status.type], status && inputStatusFocusWithinStyles[status.type], inputGroup && groupStyles.inGroup, xstyle), className, style),
-    children: [/*#__PURE__*/_jsx("div", {
+    children: [/*#__PURE__*/_jsxDEV("div", {
       ...{
         className: "x78zum5 x6s0dn4 xl56j7k x2lah0s"
       },
-      children: /*#__PURE__*/_jsx(Icon, {
+      children: /*#__PURE__*/_jsxDEV(Icon, {
         icon: "clock",
         size: "sm",
         color: "secondary"
-      })
-    }), inputGroup && /*#__PURE__*/_jsx(VisuallyHidden, {
+      }, void 0, false)
+    }, void 0, false), inputGroup && /*#__PURE__*/_jsxDEV(VisuallyHidden, {
       id: inputLabelID,
       children: label
-    }), inputGroup && description && /*#__PURE__*/_jsx(VisuallyHidden, {
+    }, void 0, false), inputGroup && description && /*#__PURE__*/_jsxDEV(VisuallyHidden, {
       as: "div",
       id: descriptionID,
       children: description
-    }), inputGroup && status?.message && /*#__PURE__*/_jsx(VisuallyHidden, {
+    }, void 0, false), inputGroup && status?.message && /*#__PURE__*/_jsxDEV(VisuallyHidden, {
       as: "div",
       id: statusMessageID,
       role: status.type === 'error' ? 'alert' : 'status',
       "aria-live": status.type === 'error' ? 'assertive' : 'polite',
       children: status.message
-    }), /*#__PURE__*/_jsx("input", {
+    }, void 0, false), /*#__PURE__*/_jsxDEV("input", {
       ref: mergeRefs(ref, inputRef),
       id: id,
       type: "text",
@@ -338,7 +338,7 @@ export function TimeInput({
       "data-autofocus": hasAutoFocus || undefined,
       "aria-describedby": ariaDescribedBy,
       "aria-required": isRequired === true ? 'true' : undefined,
-      "aria-invalid": status?.type === 'error' ? 'true' : undefined,
+      "aria-invalid": status?.type === 'error' || !isInputValid ? 'true' : undefined,
       "aria-busy": isBusy || undefined,
       "aria-labelledby": ariaLabelledBy,
       ...{
@@ -355,32 +355,37 @@ export function TimeInput({
           className: "x1lliihq x98rzlu xeuugli xc342km xng3xce x1717udv x9ynric xjm74w1 x6pjikd xw6l6zx xjbqb8w x1a2a7pz xeyghm5 x1h6gzvc xv1l7n4"
         }
       }[!!isDisabled << 1 | !!!isInputValid << 0]
-    }), isBusy && /*#__PURE__*/_jsx(Spinner, {
+    }, void 0, false), /*#__PURE__*/_jsxDEV(VisuallyHidden, {
+      as: "div",
+      role: "alert",
+      "aria-live": "assertive",
+      children: !isInputValid ? 'Invalid time' : ''
+    }, void 0, false), isBusy && /*#__PURE__*/_jsxDEV(Spinner, {
       size: "sm"
-    }), hasClear && value && !isDisabled && /*#__PURE__*/_jsx("button", {
+    }, void 0, false), hasClear && value && !isDisabled && /*#__PURE__*/_jsxDEV("button", {
       type: "button",
       onClick: handleClear,
       "aria-label": `Clear ${label}`,
       ...{
         className: "x78zum5 x6s0dn4 xl56j7k x1717udv x1ghz6dp xc342km xng3xce xjbqb8w x1ypdohk xh6dtrn x1a2a7pz x1p25gnr x1y3gkto"
       },
-      children: /*#__PURE__*/_jsx(Icon, {
+      children: /*#__PURE__*/_jsxDEV(Icon, {
         icon: "close",
         size: "sm",
         color: "secondary"
-      })
-    }), status && !inputGroup && /*#__PURE__*/_jsx(Icon, {
+      }, void 0, false)
+    }, void 0, false), status && !inputGroup && /*#__PURE__*/_jsxDEV(Icon, {
       icon: statusIconMap[status.type],
       size: "md",
       color: statusIconColorMap[status.type]
-    })]
-  });
+    }, void 0, false)]
+  }, void 0, true);
   if (inputGroup) {
-    return /*#__PURE__*/_jsxs(_Fragment, {
+    return /*#__PURE__*/_jsxDEV(_Fragment, {
       children: [inputWrapper, showsDisabledMessage && disabledMessageTooltip.renderTooltip(disabledMessage)]
-    });
+    }, void 0, true);
   }
-  return /*#__PURE__*/_jsxs(Field, {
+  return /*#__PURE__*/_jsxDEV(Field, {
     label: label,
     isLabelHidden: isLabelHidden,
     description: description,
@@ -397,6 +402,6 @@ export function TimeInput({
     labelTooltip: labelTooltip,
     width: width,
     children: [inputWrapper, showsDisabledMessage && disabledMessageTooltip.renderTooltip(disabledMessage)]
-  });
+  }, void 0, true);
 }
 TimeInput.displayName = 'TimeInput';

package/dist/Timestamp/Timestamp.d.ts

@@ -77,7 +77,7 @@ export interface TimestampProps extends BaseProps<HTMLTimeElement> {
  * <Timestamp value={event.timestamp} format="system_date_time" />
  * ```
  */
-export declare function Timestamp({ value, format, autoThreshold, hasTooltip, isTimezoneShown, isLive, type, size, color, weight, xstyle, className, style, ref, 'data-testid': testId, }: TimestampProps): import("react").JSX.Element;
+export declare function Timestamp({ value, format, autoThreshold, hasTooltip, isTimezoneShown, isLive, type, size, color, weight, xstyle, className, style, ref, 'data-testid': testId, }: TimestampProps): import("react").JSX.Element | null;
 export declare namespace Timestamp {
     var displayName: string;
 }

package/dist/Timestamp/Timestamp.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Timestamp.d.ts","sourceRoot":"","sources":["../../src/Timestamp/Timestamp.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAC,MAAM,gBAAgB,CAAC;AAE9E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAW5C,MAAM,MAAM,eAAe,GACvB,UAAU,GACV,MAAM,GACN,MAAM,GACN,WAAW,GACX,MAAM,GACN,aAAa,GACb,kBAAkB,GAClB,aAAa,CAAC;AAElB,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,eAAe,CAAC;IAChE,kDAAkD;IAClD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC,uFAAuF;IACvF,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB;;;;;;;;;;;OAWG;IACH,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,sCAAsC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AA8ND;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,MAAe,EACf,aAAsC,EACtC,UAAiB,EACjB,eAAuB,EACvB,MAAc,EACd,IAAmB,EACnB,IAAI,EACJ,KAAmB,EACnB,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,aAAa,EAAE,MAAM,GACtB,EAAE,cAAc,+BAqFhB;yBArGe,SAAS"}
+{"version":3,"file":"Timestamp.d.ts","sourceRoot":"","sources":["../../src/Timestamp/Timestamp.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAC,MAAM,gBAAgB,CAAC;AAE9E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAW5C,MAAM,MAAM,eAAe,GACvB,UAAU,GACV,MAAM,GACN,MAAM,GACN,WAAW,GACX,MAAM,GACN,aAAa,GACb,kBAAkB,GAClB,aAAa,CAAC;AAElB,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,eAAe,CAAC;IAChE,kDAAkD;IAClD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC,uFAAuF;IACvF,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB;;;;;;;;;;;OAWG;IACH,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,sCAAsC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AA8ND;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,MAAe,EACf,aAAsC,EACtC,UAAiB,EACjB,eAAuB,EACvB,MAAc,EACd,IAAmB,EACnB,IAAI,EACJ,KAAmB,EACnB,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,aAAa,EAAE,MAAM,GACtB,EAAE,cAAc,sCAmGhB;yBAnHe,SAAS"}

package/dist/Timestamp/Timestamp.js

@@ -20,7 +20,7 @@ import * as stylex from '@stylexjs/stylex';
 import { Text } from "../Text/index.js";
 import { mergeProps, mergeRefs } from "../utils/index.js";
 import { themeProps } from "../utils/themeProps.js";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV, Fragment as _Fragment } from "react/jsx-dev-runtime";
 const LazyXDSTooltip = /*#__PURE__*/lazy(async () => import('../Tooltip/Tooltip').then(mod => ({
   default: mod.Tooltip
 })));
@@ -90,47 +90,47 @@ function getRelativeTimeString(date, now) {
       return 'in a few seconds';
     }
     if (absDiff < HOUR) {
-      const mins = Math.round(absDiff / MINUTE);
+      const mins = Math.floor(absDiff / MINUTE);
       return `in ${mins} ${mins === 1 ? 'minute' : 'minutes'}`;
     }
     if (absDiff < DAY) {
-      const hours = Math.round(absDiff / HOUR);
+      const hours = Math.floor(absDiff / HOUR);
       return `in ${hours} ${hours === 1 ? 'hour' : 'hours'}`;
     }
     if (absDiff < MONTH) {
-      const days = Math.round(absDiff / DAY);
+      const days = Math.floor(absDiff / DAY);
       return `in ${days} ${days === 1 ? 'day' : 'days'}`;
     }
     if (absDiff < YEAR) {
-      const months = Math.round(absDiff / MONTH);
+      const months = Math.floor(absDiff / MONTH);
       return `in ${months} ${months === 1 ? 'month' : 'months'}`;
     }
-    const years = Math.round(absDiff / YEAR);
+    const years = Math.floor(absDiff / YEAR);
     return `in ${years} ${years === 1 ? 'year' : 'years'}`;
   }
   if (diffSeconds < MINUTE) {
     return `${diffSeconds} seconds ago`;
   }
   if (diffSeconds < HOUR) {
-    const mins = Math.round(diffSeconds / MINUTE);
+    const mins = Math.floor(diffSeconds / MINUTE);
     return `${mins} ${mins === 1 ? 'minute' : 'minutes'} ago`;
   }
   if (diffSeconds < DAY) {
-    const hours = Math.round(diffSeconds / HOUR);
+    const hours = Math.floor(diffSeconds / HOUR);
     return `${hours} ${hours === 1 ? 'hour' : 'hours'} ago`;
   }
   if (diffSeconds < 2 * DAY) {
     return 'yesterday';
   }
   if (diffSeconds < MONTH) {
-    const days = Math.round(diffSeconds / DAY);
+    const days = Math.floor(diffSeconds / DAY);
     return `${days} days ago`;
   }
   if (diffSeconds < YEAR) {
-    const months = Math.round(diffSeconds / MONTH);
+    const months = Math.floor(diffSeconds / MONTH);
     return `${months} ${months === 1 ? 'month' : 'months'} ago`;
   }
-  const years = Math.round(diffSeconds / YEAR);
+  const years = Math.floor(diffSeconds / YEAR);
   return `${years} ${years === 1 ? 'year' : 'years'} ago`;
 }
 function pad(n) {
@@ -261,21 +261,26 @@ export function Timestamp({
   const timeRef = useRef(null);
   const [now, setNow] = useState(() => new Date());
   const date = parseValue(value);
-  const isoString = date.toISOString();
+  // An unparseable value (a malformed date string, or a NaN timestamp from
+  // missing data) yields an Invalid Date, and formatting one throws "Invalid
+  // time value" — crashing the whole tree. Compute nothing from it here and
+  // bail out below (after the hooks) instead.
+  const isValidDate = !Number.isNaN(date.getTime());
+  const isoString = isValidDate ? date.toISOString() : '';
 
   // Determine effective format
   const diffSeconds = Math.round((now.getTime() - date.getTime()) / 1000);
   const effectiveFormat = format === 'auto' ? Math.abs(diffSeconds) <= autoThreshold ? 'relative' : 'date_time' : format;
 
   // Format the display text
-  const displayText = effectiveFormat === 'relative' ? getRelativeTimeString(date, now) : isAbsoluteFormat(effectiveFormat) ? formatTimestamp(date, effectiveFormat, isTimezoneShown) : '';
+  const displayText = !isValidDate ? '' : effectiveFormat === 'relative' ? getRelativeTimeString(date, now) : isAbsoluteFormat(effectiveFormat) ? formatTimestamp(date, effectiveFormat, isTimezoneShown) : '';
 
   // Full absolute text for tooltip and aria-label
-  const fullAbsoluteText = getFullAbsoluteString(date);
+  const fullAbsoluteText = isValidDate ? getFullAbsoluteString(date) : '';
 
   // Live updates
   useEffect(() => {
-    if (!isLive || effectiveFormat !== 'relative') {
+    if (!isLive || !isValidDate || effectiveFormat !== 'relative') {
       return;
     }
     const interval = getLiveInterval(diffSeconds);
@@ -283,7 +288,13 @@ export function Timestamp({
       setNow(new Date());
     }, interval);
     return () => clearInterval(timer);
-  }, [isLive, effectiveFormat, diffSeconds]);
+  }, [isLive, isValidDate, effectiveFormat, diffSeconds]);
+
+  // Placed after all hooks so the hook order stays stable across renders.
+  if (!isValidDate) {
+    console.warn(`Timestamp: could not parse value ${JSON.stringify(value)} as a date. Rendering nothing.`);
+    return null;
+  }
   const showTooltip = hasTooltip && effectiveFormat === 'relative';
   const timestampProps = mergeProps(themeProps('timestamp', {
     format: effectiveFormat
@@ -291,14 +302,14 @@ export function Timestamp({
     className,
     style
   });
-  const timeElement = /*#__PURE__*/_jsx(Text, {
+  const timeElement = /*#__PURE__*/_jsxDEV(Text, {
     type: type,
     size: size,
     color: color,
     weight: weight,
     xstyle: xstyle,
     ...timestampProps,
-    children: /*#__PURE__*/_jsx("time", {
+    children: /*#__PURE__*/_jsxDEV("time", {
       ref: mergeRefs(ref, timeRef),
       dateTime: isoString,
       "aria-label": effectiveFormat === 'relative' ? fullAbsoluteText : undefined,
@@ -307,19 +318,19 @@ export function Timestamp({
         className: "xt0psk2 xjb2p0i x1j61x8r x1qlqyl8 x15bjb6t x1heor9g x1pd3egz"
       },
       children: displayText
-    })
-  });
+    }, void 0, false)
+  }, void 0, false);
   if (showTooltip) {
-    return /*#__PURE__*/_jsxs(_Fragment, {
-      children: [timeElement, /*#__PURE__*/_jsx(Suspense, {
+    return /*#__PURE__*/_jsxDEV(_Fragment, {
+      children: [timeElement, /*#__PURE__*/_jsxDEV(Suspense, {
         fallback: null,
-        children: /*#__PURE__*/_jsx(LazyXDSTooltip, {
+        children: /*#__PURE__*/_jsxDEV(LazyXDSTooltip, {
           anchorRef: timeRef,
           content: fullAbsoluteText,
           placement: "above"
-        })
-      })]
-    });
+        }, void 0, false)
+      }, void 0, false)]
+    }, void 0, true);
   }
   return timeElement;
 }

package/dist/Toast/Toast.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../src/Toast/Toast.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAiBrC,OAAO,KAAK,EAAC,SAAS,EAAE,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAyD3D,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE,SAAS,CAAC;IAChB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,UAAU,EAAE,OAAO,CAAC;IACpB,gBAAgB,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAC;CACjD;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,KAAK,CAAC,EACpB,IAAI,EACJ,IAAI,EACJ,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,SAAiB,EACjB,SAAS,GACV,EAAE,UAAU,+BAiHZ;yBAzHe,KAAK"}
+{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../src/Toast/Toast.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAiBrC,OAAO,KAAK,EAAC,SAAS,EAAE,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAyD3D,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE,SAAS,CAAC;IAChB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,UAAU,EAAE,OAAO,CAAC;IACpB,gBAAgB,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,CAAC,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAC;CACjD;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,KAAK,CAAC,EACpB,IAAI,EACJ,IAAI,EACJ,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,SAAiB,EACjB,SAAS,GACV,EAAE,UAAU,+BAyHZ;yBAjIe,KAAK"}

package/dist/Toast/Toast.js

@@ -12,7 +12,7 @@ import { mergeProps } from "../utils/index.js";
 import { useTheme } from "../theme/index.js";
 import { MediaTheme } from "../theme/MediaTheme.js";
 import { themeProps } from "../utils/themeProps.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 /**
  * Individual toast notification.
  *
@@ -46,8 +46,14 @@ export function Toast({
   const remainingRef = useRef(autoHideDuration);
   // Will be initialized by startTimer when actually used
   const startTimeRef = useRef(null);
+
+  // Read onDismiss through a ref: the viewport re-creates it on every render
+  // (another toast arriving/exiting), and a startTimer that depends on it
+  // would restart — and un-pause — this toast's timer on unrelated renders.
+  const onDismissRef = useRef(onDismiss);
+  onDismissRef.current = onDismiss;
   const startTimer = useCallback(() => {
-    if (!isAutoHide) {
+    if (!isAutoHide || isPausedRef.current) {
       return;
     }
     if (timerRef.current) {
@@ -55,9 +61,9 @@ export function Toast({
     }
     startTimeRef.current = Date.now();
     timerRef.current = setTimeout(() => {
-      onDismiss('auto');
+      onDismissRef.current('auto');
     }, remainingRef.current);
-  }, [isAutoHide, onDismiss]);
+  }, [isAutoHide]);
   const pauseTimer = useCallback(() => {
     if (!isAutoHide || isPausedRef.current) {
       return;
@@ -87,6 +93,8 @@ export function Toast({
         clearTimeout(timerRef.current);
       }
     };
+    // startTimer's identity is stable per isAutoHide, so this runs on mount
+    // and on a genuine duration change — not on unrelated viewport renders.
   }, [autoHideDuration, startTimer]);
 
   // Pause the auto-hide timer while the window is not focused, so a toast
@@ -112,7 +120,7 @@ export function Toast({
     mode
   } = useTheme();
   const mediaMode = isError || mode === 'light' ? 'dark' : 'light';
-  return /*#__PURE__*/_jsx("div", {
+  return /*#__PURE__*/_jsxDEV("div", {
     role: isError ? 'alert' : 'status',
     "aria-live": isError ? 'assertive' : 'polite',
     "aria-atomic": "true",
@@ -136,36 +144,36 @@ export function Toast({
         className: "x1na6nto x1pzlopt x1hviunn x1l2rt3b xxtfdz8 x14hfi27 x9ynric xjm74w1 xw6l6zx x6o7n8i xuedmi6 xsagj69 xlr8y92 x4itv7f x1tswlu5 x1l5t2a3 xg01cxk x1lm5u"
       }
     }[!!isError << 1 | !!isExiting << 0]),
-    children: /*#__PURE__*/_jsx(MediaTheme, {
+    children: /*#__PURE__*/_jsxDEV(MediaTheme, {
       mode: mediaMode,
-      children: /*#__PURE__*/_jsxs("div", {
+      children: /*#__PURE__*/_jsxDEV("div", {
         ...{
           className: "x78zum5 x1cy8zhl xjcht0a xh8yej3"
         },
-        children: [/*#__PURE__*/_jsx("div", {
+        children: [/*#__PURE__*/_jsxDEV("div", {
           ...{
             className: "x98rzlu xeuugli"
           },
           children: body
-        }), /*#__PURE__*/_jsxs("div", {
+        }, void 0, false), /*#__PURE__*/_jsxDEV("div", {
           ...{
             className: "x2lah0s x78zum5 x6s0dn4 x1txdalj xacfrgf xmequkd"
           },
-          children: [endContent, /*#__PURE__*/_jsx(Button, {
+          children: [endContent, /*#__PURE__*/_jsxDEV(Button, {
             variant: "ghost",
             size: "sm",
-            icon: /*#__PURE__*/_jsx(Icon, {
+            icon: /*#__PURE__*/_jsxDEV(Icon, {
               icon: "close",
               size: "sm",
               color: "inherit"
-            }),
+            }, void 0, false),
             label: "Dismiss notification",
             onClick: handleDismiss,
             isIconOnly: true
-          })]
-        })]
-      })
-    })
-  });
+          }, void 0, false)]
+        }, void 0, true)]
+      }, void 0, true)
+    }, void 0, false)
+  }, void 0, false);
 }
 Toast.displayName = 'Toast';

package/dist/Toast/ToastViewport.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToastViewport.d.ts","sourceRoot":"","sources":["../../src/Toast/ToastViewport.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAK,EAAa,aAAa,EAAqB,MAAM,SAAS,CAAC;AA2D3E,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE;QAAC,GAAG,CAAC,EAAE,MAAM,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,GAAG,CAAC,EAAE,MAAM,CAAA;KAAC,CAAC;IACtE;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,aAAa,CAAC,EAC5B,QAAsB,EACtB,UAAc,EACd,KAAK,EACL,UAAiB,EACjB,QAAQ,GACT,EAAE,kBAAkB,+BAqSpB;yBA3Se,aAAa"}
+{"version":3,"file":"ToastViewport.d.ts","sourceRoot":"","sources":["../../src/Toast/ToastViewport.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAK,EAAa,aAAa,EAAqB,MAAM,SAAS,CAAC;AA2D3E,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE;QAAC,GAAG,CAAC,EAAE,MAAM,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,GAAG,CAAC,EAAE,MAAM,CAAA;KAAC,CAAC;IACtE;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,aAAa,CAAC,EAC5B,QAAsB,EACtB,UAAc,EACd,KAAK,EACL,UAAiB,EACjB,QAAQ,GACT,EAAE,kBAAkB,+BAiTpB;yBAvTe,aAAa"}

package/dist/Toast/ToastViewport.js

@@ -10,7 +10,7 @@ import { mergeProps } from "../utils/index.js";
 import { INTERACTIVE_SELECTORS } from "../hooks/useClickableContainer.js";
 import { Toast } from "./Toast.js";
 import { ToastContext } from "./ToastContext.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 const styles = {
   viewport: {
     kVAEAm: "xixxii4",
@@ -78,6 +78,9 @@ export function ToastViewport({
 
   // Show the popover on mount so it enters the top layer.
   const viewportRef = useRef(null);
+  // Toast ids whose exit has begun — guards onHide from double-firing (see
+  // removeToast). Mirrors exitingIds state, readable synchronously.
+  const exitingIdsRef = useRef(new Set());
   // The element that was focused before the user jumped into the viewport
   // (via F6). Used to restore focus once all toasts are dismissed so focus
   // never falls to <body>.
@@ -127,6 +130,14 @@ export function ToastViewport({
     });
   }, []);
   const removeToast = useCallback((id, reason) => {
+    // An exiting toast stays in toastsRef until its exit transition ends, so
+    // a second dismissal inside that window (double-click, auto-timer plus
+    // manual dismiss()) would re-fire onHide. Track exiting ids in a ref —
+    // the exitingIds state dedupe below runs too late to protect onHide.
+    if (exitingIdsRef.current.has(id)) {
+      return;
+    }
+    exitingIdsRef.current.add(id);
     const entry = toastsRef.current.find(t => t.id === id);
     if (entry) {
       entry.options.onHide?.(reason);
@@ -158,6 +169,7 @@ export function ToastViewport({
     });
   }, []);
   const handleExited = useCallback(id => {
+    exitingIdsRef.current.delete(id);
     setExitingIds(prev => {
       if (!prev.has(id)) {
         return prev;
@@ -280,9 +292,9 @@ export function ToastViewport({
     };
   }, [hasToasts, getFocusable]);
   const posStyle = position === 'topEnd' ? styles.topEnd : position === 'topStart' ? styles.topStart : position === 'bottomStart' ? styles.bottomStart : styles.bottomEnd;
-  return /*#__PURE__*/_jsxs(ToastContext, {
+  return /*#__PURE__*/_jsxDEV(ToastContext, {
     value: contextValue,
-    children: [children, /*#__PURE__*/_jsx("div", {
+    children: [children, /*#__PURE__*/_jsxDEV("div", {
       ref: viewportRef,
       role: "region",
       "aria-label": "Notifications",
@@ -300,7 +312,7 @@ export function ToastViewport({
         const isAutoHide = o.isAutoHide ?? (type === 'error' ? false : true);
         const dur = o.autoHideDuration ?? 5000;
         const isExiting = exitingIds.has(entry.id);
-        return /*#__PURE__*/_jsx("div", {
+        return /*#__PURE__*/_jsxDEV("div", {
           "data-toast-id": entry.id,
           ...{
             0: {
@@ -315,11 +327,11 @@ export function ToastViewport({
               handleExited(entry.id);
             }
           } : undefined,
-          children: /*#__PURE__*/_jsx("div", {
+          children: /*#__PURE__*/_jsxDEV("div", {
             ...{
               className: "xb3r6kr"
             },
-            children: /*#__PURE__*/_jsx(Toast, {
+            children: /*#__PURE__*/_jsxDEV(Toast, {
               type: type,
               body: o.body,
               endContent: o.endContent,
@@ -327,11 +339,11 @@ export function ToastViewport({
               autoHideDuration: dur,
               isExiting: isExiting,
               onDismiss: reason => removeToast(entry.id, reason)
-            })
-          })
-        }, entry.id);
+            }, void 0, false)
+          }, void 0, false)
+        }, entry.id, false);
       })
-    })]
-  });
+    }, void 0, false)]
+  }, void 0, true);
 }
 ToastViewport.displayName = 'ToastViewport';

package/dist/Toast/useToast.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useToast.d.ts","sourceRoot":"","sources":["../../src/Toast/useToast.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAGV,WAAW,EAEZ,MAAM,SAAS,CAAC;AA8FjB;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,QAAQ,IAAI,WAAW,CAetC"}
+{"version":3,"file":"useToast.d.ts","sourceRoot":"","sources":["../../src/Toast/useToast.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAGV,WAAW,EAEZ,MAAM,SAAS,CAAC;AAsIjB;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,QAAQ,IAAI,WAAW,CAetC"}

package/dist/Toast/useToast.js

@@ -4,13 +4,52 @@
 
 import { useCallback, use, useEffect, useRef } from 'react';
 import { createRoot } from 'react-dom/client';
+import { dataAttr } from "../naming.js";
 import { ToastContext } from "./ToastContext.js";
 import { ToastViewport } from "./ToastViewport.js";
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 // Fallback singleton
 let fallbackContext = null;
 let fallbackRoot = null;
 let fallbackWarned = false;
+const ROOT_THEME_ATTRS = ['data-theme', dataAttr('theme')];
+
+// The fallback container is a detached tree with no ThemeContext, so this
+// mirrors <html>'s theme attributes onto it directly (live via
+// MutationObserver) for the theme's @scope'd CSS to reach it. It's a
+// lifetime-of-app singleton that's never torn down, so there's nothing to
+// disconnect — this returns void.
+function syncRootThemeAttrs(container) {
+  const sync = () => {
+    let mirroredMode = null;
+    for (const attr of ROOT_THEME_ATTRS) {
+      const value = document.documentElement.getAttribute(attr);
+      if (value == null) {
+        container.removeAttribute(attr);
+      } else {
+        container.setAttribute(attr, value);
+        if (attr === 'data-theme') {
+          mirroredMode = value;
+        }
+      }
+    }
+    // Pages whose built theme CSS pins color-scheme unconditionally (#3658)
+    // would otherwise resolve light-dark() tokens by OS preference while the
+    // mirrored mode above follows the app theme; the inline style wins over
+    // that CSS.
+    if (mirroredMode === 'light' || mirroredMode === 'dark') {
+      container.style.colorScheme = mirroredMode;
+    } else {
+      container.style.removeProperty('color-scheme');
+    }
+  };
+  sync();
+  const observer = new MutationObserver(sync);
+  observer.observe(document.documentElement, {
+    attributes: true,
+    attributeFilter: [...ROOT_THEME_ATTRS]
+  });
+}
 function getFallbackContext() {
   if (fallbackContext) {
     return fallbackContext;
@@ -25,6 +64,7 @@ function getFallbackContext() {
   const container = document.createElement('div');
   container.setAttribute('data-astryx-toast-fallback', '');
   document.body.appendChild(container);
+  syncRootThemeAttrs(container);
   let resolveCtx;
   const ctxReady = new Promise(r => {
     resolveCtx = r;
@@ -42,9 +82,9 @@ function getFallbackContext() {
     return null;
   };
   fallbackRoot = createRoot(container);
-  fallbackRoot.render(/*#__PURE__*/_jsx(ToastViewport, {
-    children: /*#__PURE__*/_jsx(FallbackCapture, {})
-  }));
+  fallbackRoot.render(/*#__PURE__*/_jsxDEV(ToastViewport, {
+    children: /*#__PURE__*/_jsxDEV(FallbackCapture, {}, void 0, false)
+  }, void 0, false));
 
   // Proxy that queues calls until real context is captured
   const pending = [];

package/dist/ToggleButton/ToggleButton.js

@@ -36,7 +36,7 @@ import { themeProps } from "../utils/themeProps.js";
  * A hidden span renders the same text at semibold weight to reserve
  * the wider width, preventing layout shift when toggling.
  */
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
 const pressedStyles = {
   background: {
     kWkggS: "xi89dp7",
@@ -141,11 +141,11 @@ export function ToggleButton({
   };
 
   // isIconOnly prop is the source of truth for icon-only rendering.
-  const labelContent = children != null ? /*#__PURE__*/_jsxs("span", {
+  const labelContent = children != null ? /*#__PURE__*/_jsxDEV("span", {
     ...{
       className: "x3nfvp2 xdt5ytf x6s0dn4 xl56j7k"
     },
-    children: [/*#__PURE__*/_jsx("span", {
+    children: [/*#__PURE__*/_jsxDEV("span", {
       ...{
         0: {},
         1: {
@@ -153,18 +153,18 @@ export function ToggleButton({
         }
       }[!!isPressed << 0],
       children: children
-    }), /*#__PURE__*/_jsx("span", {
+    }, void 0, false), /*#__PURE__*/_jsxDEV("span", {
       ...{
         className: "x1lliihq x2mo6ok xqtp20y xb3r6kr xlshs6z x47corl"
       },
       "aria-hidden": "true",
       children: children
-    })]
-  }) : !isIconOnly ? /*#__PURE__*/_jsxs("span", {
+    }, void 0, false)]
+  }, void 0, true) : !isIconOnly ? /*#__PURE__*/_jsxDEV("span", {
     ...{
       className: "x3nfvp2 xdt5ytf x6s0dn4 xl56j7k"
     },
-    children: [/*#__PURE__*/_jsx("span", {
+    children: [/*#__PURE__*/_jsxDEV("span", {
       ...{
         0: {},
         1: {
@@ -172,15 +172,15 @@ export function ToggleButton({
         }
       }[!!isPressed << 0],
       children: label
-    }), /*#__PURE__*/_jsx("span", {
+    }, void 0, false), /*#__PURE__*/_jsxDEV("span", {
       ...{
         className: "x1lliihq x2mo6ok xqtp20y xb3r6kr xlshs6z x47corl"
       },
       "aria-hidden": "true",
       children: label
-    })]
-  }) : undefined;
-  return /*#__PURE__*/_jsx(Button, {
+    }, void 0, false)]
+  }, void 0, true) : undefined;
+  return /*#__PURE__*/_jsxDEV(Button, {
     ref: ref,
     label: label,
     variant: "ghost",
@@ -201,6 +201,6 @@ export function ToggleButton({
     clickAction: clickAction,
     ...props,
     children: labelContent
-  });
+  }, void 0, false);
 }
 ToggleButton.displayName = 'ToggleButton';