@cube-dev/ui-kit 0.145.4 → 0.146.0

package/dist/components/overlays/Notifications/PersistentNotificationsList.js.map

@@ -1 +1 @@
-{"version":3,"file":"PersistentNotificationsList.js","names":["Text"],"sources":["../../../../src/components/overlays/Notifications/PersistentNotificationsList.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport { Fragment, Key, useContext, useEffect, useRef, useState } from 'react';\n\nimport { useEvent } from '../../../_internal';\nimport { Divider } from '../../content/Divider';\nimport { Text } from '../../content/Text';\n\nimport { formatRelativeTime } from './format-relative-time';\nimport { NotificationActionInterceptorContext } from './NotificationAction';\nimport { NotificationCard } from './NotificationCard';\nimport { usePersistentNotifications } from './use-persistent-notifications';\n\nimport type {\n  DismissReason,\n  PersistentNotificationItem,\n  PersistentNotificationsListProps,\n} from './types';\n\n// ─── Constants ───────────────────────────────────────────────────────\n\nconst MARK_READ_DELAY = 2000;\n/** Interval (ms) at which relative timestamps refresh while the list is mounted. */\nconst TIMESTAMP_REFRESH_INTERVAL = 10_000;\n\n// ─── Styled Components ──────────────────────────────────────────────\n\nconst ListContainer = tasty({\n  qa: 'PersistentNotificationsList',\n  role: 'log',\n  'aria-label': 'Notifications',\n  styles: {\n    display: 'flex',\n    flow: 'column',\n  },\n});\n\nconst EmptyStateContainer = tasty({\n  styles: {\n    display: 'flex',\n    placeItems: 'center',\n    placeContent: 'center',\n    padding: '4x',\n    color: '#dark.5',\n    preset: 't3',\n  },\n});\n\n// ─── PersistentNotificationsList Component ───────────────────────────\n\n/**\n * Standardized rendering for archived/persistent notifications.\n * Always reads items from the notification context.\n * Composable with app-specific shells (popover, dialog, page section).\n *\n * Marks all items as read after being visible for 2 seconds.\n * Relative timestamps refresh every 10 seconds while the list is mounted.\n *\n * Items are always dismissible. Dismissing an item removes it from the\n * persistent list and marks its ID as \"fully dismissed\" — subsequent triggers\n * with the same ID will be completely ignored (no overlay, no re-archival).\n *\n * @example\n * ```tsx\n * <PersistentNotificationsList emptyState=\"No notifications\" />\n * ```\n */\nexport function PersistentNotificationsList({\n  onDismissItem,\n  onAction,\n  emptyState,\n}: PersistentNotificationsListProps) {\n  const { items, remove, markAllAsRead } = usePersistentNotifications();\n\n  // Default dismiss handler removes the item from the persistent list (which\n  // also marks the id as \"fully dismissed\" so it won't reappear).\n  // If a consumer provides `onDismissItem`, it is called *after* the built-in removal.\n  const handleDismiss = useEvent((item: PersistentNotificationItem) => {\n    remove(item.id);\n    onDismissItem?.(item);\n  });\n  const markReadTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  // Tick counter that increments every TIMESTAMP_REFRESH_INTERVAL to force\n  // re-render so relative timestamps (e.g. \"5 min ago\") stay up to date.\n  const [, setTick] = useState(0);\n\n  useEffect(() => {\n    if (items.length === 0) return;\n\n    const interval = setInterval(() => {\n      setTick((t) => t + 1);\n    }, TIMESTAMP_REFRESH_INTERVAL);\n\n    return () => clearInterval(interval);\n  }, [items.length]);\n\n  // Mark all persistent notifications as read after a 2s delay.\n  // Re-starts the timer whenever items change (e.g. new unread items arrive\n  // while the list is already visible).\n  useEffect(() => {\n    const hasUnread = items.some((i) => !i.isRead);\n\n    if (!hasUnread) return;\n\n    markReadTimerRef.current = setTimeout(() => {\n      markAllAsRead();\n    }, MARK_READ_DELAY);\n\n    return () => {\n      if (markReadTimerRef.current) {\n        clearTimeout(markReadTimerRef.current);\n        markReadTimerRef.current = null;\n      }\n    };\n  }, [markAllAsRead, items]);\n\n  if (items.length === 0) {\n    return (\n      <ListContainer>\n        <EmptyStateContainer>\n          {emptyState ?? 'No notifications'}\n        </EmptyStateContainer>\n      </ListContainer>\n    );\n  }\n\n  return (\n    <NotificationActionInterceptorContext.Provider value={onAction ?? null}>\n      <ListContainer>\n        {items.map((item, index) => (\n          <Fragment key={String(item.id)}>\n            {index > 0 && <Divider />}\n            <PersistentNotificationListItem\n              item={item}\n              onDismiss={handleDismiss}\n            />\n          </Fragment>\n        ))}\n      </ListContainer>\n    </NotificationActionInterceptorContext.Provider>\n  );\n}\n\n// ─── List Item ───────────────────────────────────────────────────────\n\ninterface PersistentNotificationListItemProps {\n  item: PersistentNotificationItem;\n  onDismiss?: (item: PersistentNotificationItem) => void;\n}\n\nfunction PersistentNotificationListItem({\n  item,\n  onDismiss,\n}: PersistentNotificationListItemProps) {\n  const suffix = (\n    <Text opacity={0.5} preset=\"c2\">\n      {formatRelativeTime(item.createdAt)}\n    </Text>\n  );\n\n  // useEvent keeps the callback stable across re-renders regardless of\n  // item reference changes (avoids unnecessary NotificationCard re-renders).\n  const handleDismiss = useEvent((_id: Key, _reason: DismissReason) => {\n    onDismiss?.(item);\n  });\n\n  const parentInterceptor = useContext(NotificationActionInterceptorContext);\n\n  // Chains with the list-level interceptor (e.g. closing the parent popover).\n  // Dismissal itself is handled by NotificationAction via the dismiss context\n  // to avoid double-firing onDismiss.\n  const handleItemAction = useEvent(() => {\n    parentInterceptor?.();\n  });\n\n  return (\n    <NotificationActionInterceptorContext.Provider value={handleItemAction}>\n      <NotificationCard\n        qa=\"PersistentNotificationItem\"\n        theme={item.theme}\n        title={item.title}\n        description={item.description}\n        icon={item.icon}\n        actions={item.actions}\n        isDismissable={!!onDismiss}\n        elevated={false}\n        notificationId={item.id}\n        suffix={suffix}\n        onDismiss={onDismiss ? handleDismiss : undefined}\n      />\n    </NotificationActionInterceptorContext.Provider>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;AAoBA,MAAM,kBAAkB;;AAExB,MAAM,6BAA6B;AAInC,MAAM,gBAAgB,MAAM;CAC1B,IAAI;CACJ,MAAM;CACN,cAAc;CACd,QAAQ;EACN,SAAS;EACT,MAAM;EACP;CACF,CAAC;AAEF,MAAM,sBAAsB,MAAM,EAChC,QAAQ;CACN,SAAS;CACT,YAAY;CACZ,cAAc;CACd,SAAS;CACT,OAAO;CACP,QAAQ;CACT,EACF,CAAC;;;;;;;;;;;;;;;;;;AAqBF,SAAgB,4BAA4B,EAC1C,eACA,UACA,cACmC;CACnC,MAAM,EAAE,OAAO,QAAQ,kBAAkB,4BAA4B;CAKrE,MAAM,gBAAgB,UAAU,SAAqC;AACnE,SAAO,KAAK,GAAG;AACf,kBAAgB,KAAK;GACrB;CACF,MAAM,mBAAmB,OAA6C,KAAK;CAI3E,MAAM,GAAG,WAAW,SAAS,EAAE;AAE/B,iBAAgB;AACd,MAAI,MAAM,WAAW,EAAG;EAExB,MAAM,WAAW,kBAAkB;AACjC,YAAS,MAAM,IAAI,EAAE;KACpB,2BAA2B;AAE9B,eAAa,cAAc,SAAS;IACnC,CAAC,MAAM,OAAO,CAAC;AAKlB,iBAAgB;AAGd,MAAI,CAFc,MAAM,MAAM,MAAM,CAAC,EAAE,OAAO,CAE9B;AAEhB,mBAAiB,UAAU,iBAAiB;AAC1C,kBAAe;KACd,gBAAgB;AAEnB,eAAa;AACX,OAAI,iBAAiB,SAAS;AAC5B,iBAAa,iBAAiB,QAAQ;AACtC,qBAAiB,UAAU;;;IAG9B,CAAC,eAAe,MAAM,CAAC;AAE1B,KAAI,MAAM,WAAW,EACnB,QACE,oBAAC,2BACC,oBAAC,iCACE,cAAc,qBACK,GACR;AAIpB,QACE,oBAAC,qCAAqC;EAAS,OAAO,YAAY;YAChE,oBAAC,2BACE,MAAM,KAAK,MAAM,UAChB,qBAAC,uBACE,QAAQ,KAAK,oBAAC,YAAU,EACzB,oBAAC;GACO;GACN,WAAW;IACX,KALW,OAAO,KAAK,GAAG,CAMnB,CACX,GACY;GAC8B;;AAWpD,SAAS,+BAA+B,EACtC,MACA,aACsC;CACtC,MAAM,SACJ,oBAACA;EAAK,SAAS;EAAK,QAAO;YACxB,mBAAmB,KAAK,UAAU;GAC9B;CAKT,MAAM,gBAAgB,UAAU,KAAU,YAA2B;AACnE,cAAY,KAAK;GACjB;CAEF,MAAM,oBAAoB,WAAW,qCAAqC;CAK1E,MAAM,mBAAmB,eAAe;AACtC,uBAAqB;GACrB;AAEF,QACE,oBAAC,qCAAqC;EAAS,OAAO;YACpD,oBAAC;GACC,IAAG;GACH,OAAO,KAAK;GACZ,OAAO,KAAK;GACZ,aAAa,KAAK;GAClB,MAAM,KAAK;GACX,SAAS,KAAK;GACd,eAAe,CAAC,CAAC;GACjB,UAAU;GACV,gBAAgB,KAAK;GACb;GACR,WAAW,YAAY,gBAAgB;IACvC;GAC4C"}
+{"version":3,"file":"PersistentNotificationsList.js","names":["Text"],"sources":["../../../../src/components/overlays/Notifications/PersistentNotificationsList.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport { Fragment, Key, useContext, useEffect, useRef, useState } from 'react';\n\nimport { useEvent } from '../../../_internal';\nimport { useI18n } from '../../../i18n';\nimport { Divider } from '../../content/Divider';\nimport { Text } from '../../content/Text';\n\nimport { formatRelativeTime } from './format-relative-time';\nimport { NotificationActionInterceptorContext } from './NotificationAction';\nimport { NotificationCard } from './NotificationCard';\nimport { usePersistentNotifications } from './use-persistent-notifications';\n\nimport type {\n  DismissReason,\n  PersistentNotificationItem,\n  PersistentNotificationsListProps,\n} from './types';\n\n// ─── Constants ───────────────────────────────────────────────────────\n\nconst MARK_READ_DELAY = 2000;\n/** Interval (ms) at which relative timestamps refresh while the list is mounted. */\nconst TIMESTAMP_REFRESH_INTERVAL = 10_000;\n\n// ─── Styled Components ──────────────────────────────────────────────\n\nconst ListContainer = tasty({\n  qa: 'PersistentNotificationsList',\n  role: 'log',\n  styles: {\n    display: 'flex',\n    flow: 'column',\n  },\n});\n\nconst EmptyStateContainer = tasty({\n  styles: {\n    display: 'flex',\n    placeItems: 'center',\n    placeContent: 'center',\n    padding: '4x',\n    color: '#dark.5',\n    preset: 't3',\n  },\n});\n\n// ─── PersistentNotificationsList Component ───────────────────────────\n\n/**\n * Standardized rendering for archived/persistent notifications.\n * Always reads items from the notification context.\n * Composable with app-specific shells (popover, dialog, page section).\n *\n * Marks all items as read after being visible for 2 seconds.\n * Relative timestamps refresh every 10 seconds while the list is mounted.\n *\n * Items are always dismissible. Dismissing an item removes it from the\n * persistent list and marks its ID as \"fully dismissed\" — subsequent triggers\n * with the same ID will be completely ignored (no overlay, no re-archival).\n *\n * @example\n * ```tsx\n * <PersistentNotificationsList emptyState=\"No notifications\" />\n * ```\n */\nexport function PersistentNotificationsList({\n  onDismissItem,\n  onAction,\n  emptyState,\n}: PersistentNotificationsListProps) {\n  const { t } = useI18n();\n  const { items, remove, markAllAsRead } = usePersistentNotifications();\n  const listAriaLabel = t('notifications.ariaLabel', 'Notifications');\n\n  // Default dismiss handler removes the item from the persistent list (which\n  // also marks the id as \"fully dismissed\" so it won't reappear).\n  // If a consumer provides `onDismissItem`, it is called *after* the built-in removal.\n  const handleDismiss = useEvent((item: PersistentNotificationItem) => {\n    remove(item.id);\n    onDismissItem?.(item);\n  });\n  const markReadTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  // Tick counter that increments every TIMESTAMP_REFRESH_INTERVAL to force\n  // re-render so relative timestamps (e.g. \"5 min ago\") stay up to date.\n  const [, setTick] = useState(0);\n\n  useEffect(() => {\n    if (items.length === 0) return;\n\n    const interval = setInterval(() => {\n      setTick((t) => t + 1);\n    }, TIMESTAMP_REFRESH_INTERVAL);\n\n    return () => clearInterval(interval);\n  }, [items.length]);\n\n  // Mark all persistent notifications as read after a 2s delay.\n  // Re-starts the timer whenever items change (e.g. new unread items arrive\n  // while the list is already visible).\n  useEffect(() => {\n    const hasUnread = items.some((i) => !i.isRead);\n\n    if (!hasUnread) return;\n\n    markReadTimerRef.current = setTimeout(() => {\n      markAllAsRead();\n    }, MARK_READ_DELAY);\n\n    return () => {\n      if (markReadTimerRef.current) {\n        clearTimeout(markReadTimerRef.current);\n        markReadTimerRef.current = null;\n      }\n    };\n  }, [markAllAsRead, items]);\n\n  if (items.length === 0) {\n    return (\n      <ListContainer aria-label={listAriaLabel}>\n        <EmptyStateContainer>\n          {emptyState ?? t('notifications.empty', 'No notifications')}\n        </EmptyStateContainer>\n      </ListContainer>\n    );\n  }\n\n  return (\n    <NotificationActionInterceptorContext.Provider value={onAction ?? null}>\n      <ListContainer aria-label={listAriaLabel}>\n        {items.map((item, index) => (\n          <Fragment key={String(item.id)}>\n            {index > 0 && <Divider />}\n            <PersistentNotificationListItem\n              item={item}\n              onDismiss={handleDismiss}\n            />\n          </Fragment>\n        ))}\n      </ListContainer>\n    </NotificationActionInterceptorContext.Provider>\n  );\n}\n\n// ─── List Item ───────────────────────────────────────────────────────\n\ninterface PersistentNotificationListItemProps {\n  item: PersistentNotificationItem;\n  onDismiss?: (item: PersistentNotificationItem) => void;\n}\n\nfunction PersistentNotificationListItem({\n  item,\n  onDismiss,\n}: PersistentNotificationListItemProps) {\n  const { t } = useI18n();\n  const suffix = (\n    <Text opacity={0.5} preset=\"c2\">\n      {formatRelativeTime(item.createdAt, t)}\n    </Text>\n  );\n\n  // useEvent keeps the callback stable across re-renders regardless of\n  // item reference changes (avoids unnecessary NotificationCard re-renders).\n  const handleDismiss = useEvent((_id: Key, _reason: DismissReason) => {\n    onDismiss?.(item);\n  });\n\n  const parentInterceptor = useContext(NotificationActionInterceptorContext);\n\n  // Chains with the list-level interceptor (e.g. closing the parent popover).\n  // Dismissal itself is handled by NotificationAction via the dismiss context\n  // to avoid double-firing onDismiss.\n  const handleItemAction = useEvent(() => {\n    parentInterceptor?.();\n  });\n\n  return (\n    <NotificationActionInterceptorContext.Provider value={handleItemAction}>\n      <NotificationCard\n        qa=\"PersistentNotificationItem\"\n        theme={item.theme}\n        title={item.title}\n        description={item.description}\n        icon={item.icon}\n        actions={item.actions}\n        isDismissable={!!onDismiss}\n        elevated={false}\n        notificationId={item.id}\n        suffix={suffix}\n        onDismiss={onDismiss ? handleDismiss : undefined}\n      />\n    </NotificationActionInterceptorContext.Provider>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;AAqBA,MAAM,kBAAkB;;AAExB,MAAM,6BAA6B;AAInC,MAAM,gBAAgB,MAAM;CAC1B,IAAI;CACJ,MAAM;CACN,QAAQ;EACN,SAAS;EACT,MAAM;EACP;CACF,CAAC;AAEF,MAAM,sBAAsB,MAAM,EAChC,QAAQ;CACN,SAAS;CACT,YAAY;CACZ,cAAc;CACd,SAAS;CACT,OAAO;CACP,QAAQ;CACT,EACF,CAAC;;;;;;;;;;;;;;;;;;AAqBF,SAAgB,4BAA4B,EAC1C,eACA,UACA,cACmC;CACnC,MAAM,EAAE,MAAM,SAAS;CACvB,MAAM,EAAE,OAAO,QAAQ,kBAAkB,4BAA4B;CACrE,MAAM,gBAAgB,EAAE,2BAA2B,gBAAgB;CAKnE,MAAM,gBAAgB,UAAU,SAAqC;AACnE,SAAO,KAAK,GAAG;AACf,kBAAgB,KAAK;GACrB;CACF,MAAM,mBAAmB,OAA6C,KAAK;CAI3E,MAAM,GAAG,WAAW,SAAS,EAAE;AAE/B,iBAAgB;AACd,MAAI,MAAM,WAAW,EAAG;EAExB,MAAM,WAAW,kBAAkB;AACjC,YAAS,MAAM,IAAI,EAAE;KACpB,2BAA2B;AAE9B,eAAa,cAAc,SAAS;IACnC,CAAC,MAAM,OAAO,CAAC;AAKlB,iBAAgB;AAGd,MAAI,CAFc,MAAM,MAAM,MAAM,CAAC,EAAE,OAAO,CAE9B;AAEhB,mBAAiB,UAAU,iBAAiB;AAC1C,kBAAe;KACd,gBAAgB;AAEnB,eAAa;AACX,OAAI,iBAAiB,SAAS;AAC5B,iBAAa,iBAAiB,QAAQ;AACtC,qBAAiB,UAAU;;;IAG9B,CAAC,eAAe,MAAM,CAAC;AAE1B,KAAI,MAAM,WAAW,EACnB,QACE,oBAAC;EAAc,cAAY;YACzB,oBAAC,iCACE,cAAc,EAAE,uBAAuB,mBAAmB,GACvC;GACR;AAIpB,QACE,oBAAC,qCAAqC;EAAS,OAAO,YAAY;YAChE,oBAAC;GAAc,cAAY;aACxB,MAAM,KAAK,MAAM,UAChB,qBAAC,uBACE,QAAQ,KAAK,oBAAC,YAAU,EACzB,oBAAC;IACO;IACN,WAAW;KACX,KALW,OAAO,KAAK,GAAG,CAMnB,CACX;IACY;GAC8B;;AAWpD,SAAS,+BAA+B,EACtC,MACA,aACsC;CACtC,MAAM,EAAE,MAAM,SAAS;CACvB,MAAM,SACJ,oBAACA;EAAK,SAAS;EAAK,QAAO;YACxB,mBAAmB,KAAK,WAAW,EAAE;GACjC;CAKT,MAAM,gBAAgB,UAAU,KAAU,YAA2B;AACnE,cAAY,KAAK;GACjB;CAEF,MAAM,oBAAoB,WAAW,qCAAqC;CAK1E,MAAM,mBAAmB,eAAe;AACtC,uBAAqB;GACrB;AAEF,QACE,oBAAC,qCAAqC;EAAS,OAAO;YACpD,oBAAC;GACC,IAAG;GACH,OAAO,KAAK;GACZ,OAAO,KAAK;GACZ,aAAa,KAAK;GAClB,MAAM,KAAK;GACX,SAAS,KAAK;GACd,eAAe,CAAC,CAAC;GACjB,UAAU;GACV,gBAAgB,KAAK;GACb;GACR,WAAW,YAAY,gBAAgB;IACvC;GAC4C"}

package/dist/components/overlays/Notifications/dismissed-storage.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 //#region src/components/overlays/Notifications/dismissed-storage.ts
 const STORAGE_KEY = "cube-ui-dismissed-notifications";
 const TTL_MS = 864e5;

package/dist/components/overlays/Notifications/format-relative-time.d.ts

@@ -1,10 +1,12 @@
 
+import { TFunction } from "i18next";
+
 //#region src/components/overlays/Notifications/format-relative-time.d.ts
 /**
  * Lightweight relative time formatter.
- * No external dependencies.
  *
- * Output format:
+ * Output format (English source; localized via the `uikit` bundle's
+ * `relativeTime.*` keys):
  * - `just now` (< 1 minute)
  * - `N min ago` (1–59 minutes)
  * - `N h ago` (1–23 hours)
@@ -12,8 +14,12 @@
  * - `N w ago` (1–4 weeks)
  * - `N mo ago` (1–11 months)
  * - `N y ago` (1+ years)
+ *
+ * `t` is the UI Kit translation function (from `useI18n`), passed
+ * in so the string reacts to the active language. When omitted (non-component
+ * callers), English defaults are used.
  */
-declare function formatRelativeTime(timestamp: number): string;
+declare function formatRelativeTime(timestamp: number, t?: TFunction): string;
 //#endregion
 export { formatRelativeTime };
 //# sourceMappingURL=format-relative-time.d.ts.map

package/dist/components/overlays/Notifications/format-relative-time.js

@@ -1,10 +1,10 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 //#region src/components/overlays/Notifications/format-relative-time.ts
 /**
 * Lightweight relative time formatter.
-* No external dependencies.
 *
-* Output format:
+* Output format (English source; localized via the `uikit` bundle's
+* `relativeTime.*` keys):
 * - `just now` (< 1 minute)
 * - `N min ago` (1–59 minutes)
 * - `N h ago` (1–23 hours)
@@ -12,23 +12,31 @@
 * - `N w ago` (1–4 weeks)
 * - `N mo ago` (1–11 months)
 * - `N y ago` (1+ years)
+*
+* `t` is the UI Kit translation function (from `useI18n`), passed
+* in so the string reacts to the active language. When omitted (non-component
+* callers), English defaults are used.
 */
-function formatRelativeTime(timestamp) {
+function formatRelativeTime(timestamp, t) {
+	const translate = (key, defaultValue, count) => {
+		if (t) return t(key, defaultValue, count != null ? { count } : void 0);
+		return count != null ? defaultValue.replace("{{count}}", String(count)) : defaultValue;
+	};
 	const diffMs = Date.now() - timestamp;
-	if (diffMs < 0) return "just now";
+	if (diffMs < 0) return translate("relativeTime.justNow", "just now");
 	const diffSeconds = Math.floor(diffMs / 1e3);
 	const diffMinutes = Math.floor(diffSeconds / 60);
 	const diffHours = Math.floor(diffMinutes / 60);
 	const diffDays = Math.floor(diffHours / 24);
-	if (diffMinutes < 1) return "just now";
-	if (diffHours < 1) return `${diffMinutes} min ago`;
-	if (diffDays < 1) return `${diffHours} h ago`;
-	if (diffDays < 7) return `${diffDays} d ago`;
+	if (diffMinutes < 1) return translate("relativeTime.justNow", "just now");
+	if (diffHours < 1) return translate("relativeTime.minAgo", "{{count}} min ago", diffMinutes);
+	if (diffDays < 1) return translate("relativeTime.hoursAgo", "{{count}} h ago", diffHours);
+	if (diffDays < 7) return translate("relativeTime.daysAgo", "{{count}} d ago", diffDays);
 	const diffWeeks = Math.floor(diffDays / 7);
-	if (diffDays < 30) return `${diffWeeks} w ago`;
+	if (diffDays < 30) return translate("relativeTime.weeksAgo", "{{count}} w ago", diffWeeks);
 	const diffMonths = Math.floor(diffDays / 30);
-	if (diffDays < 365) return `${diffMonths} mo ago`;
-	return `${Math.floor(diffDays / 365)} y ago`;
+	if (diffDays < 365) return translate("relativeTime.monthsAgo", "{{count}} mo ago", diffMonths);
+	return translate("relativeTime.yearsAgo", "{{count}} y ago", Math.floor(diffDays / 365));
 }
 
 //#endregion

package/dist/components/overlays/Notifications/format-relative-time.js.map

@@ -1 +1 @@
-{"version":3,"file":"format-relative-time.js","names":[],"sources":["../../../../src/components/overlays/Notifications/format-relative-time.ts"],"sourcesContent":["/**\n * Lightweight relative time formatter.\n * No external dependencies.\n *\n * Output format:\n * - `just now` (< 1 minute)\n * - `N min ago` (1–59 minutes)\n * - `N h ago` (1–23 hours)\n * - `N d ago` (1–6 days)\n * - `N w ago` (1–4 weeks)\n * - `N mo ago` (1–11 months)\n * - `N y ago` (1+ years)\n */\nexport function formatRelativeTime(timestamp: number): string {\n  const now = Date.now();\n  const diffMs = now - timestamp;\n\n  if (diffMs < 0) {\n    return 'just now';\n  }\n\n  const diffSeconds = Math.floor(diffMs / 1000);\n  const diffMinutes = Math.floor(diffSeconds / 60);\n  const diffHours = Math.floor(diffMinutes / 60);\n  const diffDays = Math.floor(diffHours / 24);\n\n  if (diffMinutes < 1) {\n    return 'just now';\n  }\n\n  if (diffHours < 1) {\n    return `${diffMinutes} min ago`;\n  }\n\n  if (diffDays < 1) {\n    return `${diffHours} h ago`;\n  }\n\n  if (diffDays < 7) {\n    return `${diffDays} d ago`;\n  }\n\n  const diffWeeks = Math.floor(diffDays / 7);\n\n  if (diffDays < 30) {\n    return `${diffWeeks} w ago`;\n  }\n\n  const diffMonths = Math.floor(diffDays / 30);\n\n  if (diffDays < 365) {\n    return `${diffMonths} mo ago`;\n  }\n\n  const diffYears = Math.floor(diffDays / 365);\n\n  return `${diffYears} y ago`;\n}\n"],"mappings":";;;;;;;;;;;;;;;AAaA,SAAgB,mBAAmB,WAA2B;CAE5D,MAAM,SADM,KAAK,KAAK,GACD;AAErB,KAAI,SAAS,EACX,QAAO;CAGT,MAAM,cAAc,KAAK,MAAM,SAAS,IAAK;CAC7C,MAAM,cAAc,KAAK,MAAM,cAAc,GAAG;CAChD,MAAM,YAAY,KAAK,MAAM,cAAc,GAAG;CAC9C,MAAM,WAAW,KAAK,MAAM,YAAY,GAAG;AAE3C,KAAI,cAAc,EAChB,QAAO;AAGT,KAAI,YAAY,EACd,QAAO,GAAG,YAAY;AAGxB,KAAI,WAAW,EACb,QAAO,GAAG,UAAU;AAGtB,KAAI,WAAW,EACb,QAAO,GAAG,SAAS;CAGrB,MAAM,YAAY,KAAK,MAAM,WAAW,EAAE;AAE1C,KAAI,WAAW,GACb,QAAO,GAAG,UAAU;CAGtB,MAAM,aAAa,KAAK,MAAM,WAAW,GAAG;AAE5C,KAAI,WAAW,IACb,QAAO,GAAG,WAAW;AAKvB,QAAO,GAFW,KAAK,MAAM,WAAW,IAAI,CAExB"}
+{"version":3,"file":"format-relative-time.js","names":[],"sources":["../../../../src/components/overlays/Notifications/format-relative-time.ts"],"sourcesContent":["import type { TFunction } from 'i18next';\n\n/**\n * Lightweight relative time formatter.\n *\n * Output format (English source; localized via the `uikit` bundle's\n * `relativeTime.*` keys):\n * - `just now` (< 1 minute)\n * - `N min ago` (1–59 minutes)\n * - `N h ago` (1–23 hours)\n * - `N d ago` (1–6 days)\n * - `N w ago` (1–4 weeks)\n * - `N mo ago` (1–11 months)\n * - `N y ago` (1+ years)\n *\n * `t` is the UI Kit translation function (from `useI18n`), passed\n * in so the string reacts to the active language. When omitted (non-component\n * callers), English defaults are used.\n */\nexport function formatRelativeTime(timestamp: number, t?: TFunction): string {\n  const translate = (\n    key: string,\n    defaultValue: string,\n    count?: number,\n  ): string => {\n    if (t) {\n      return t(key, defaultValue, count != null ? { count } : undefined);\n    }\n\n    return count != null\n      ? defaultValue.replace('{{count}}', String(count))\n      : defaultValue;\n  };\n\n  const now = Date.now();\n  const diffMs = now - timestamp;\n\n  if (diffMs < 0) {\n    return translate('relativeTime.justNow', 'just now');\n  }\n\n  const diffSeconds = Math.floor(diffMs / 1000);\n  const diffMinutes = Math.floor(diffSeconds / 60);\n  const diffHours = Math.floor(diffMinutes / 60);\n  const diffDays = Math.floor(diffHours / 24);\n\n  if (diffMinutes < 1) {\n    return translate('relativeTime.justNow', 'just now');\n  }\n\n  if (diffHours < 1) {\n    return translate('relativeTime.minAgo', '{{count}} min ago', diffMinutes);\n  }\n\n  if (diffDays < 1) {\n    return translate('relativeTime.hoursAgo', '{{count}} h ago', diffHours);\n  }\n\n  if (diffDays < 7) {\n    return translate('relativeTime.daysAgo', '{{count}} d ago', diffDays);\n  }\n\n  const diffWeeks = Math.floor(diffDays / 7);\n\n  if (diffDays < 30) {\n    return translate('relativeTime.weeksAgo', '{{count}} w ago', diffWeeks);\n  }\n\n  const diffMonths = Math.floor(diffDays / 30);\n\n  if (diffDays < 365) {\n    return translate('relativeTime.monthsAgo', '{{count}} mo ago', diffMonths);\n  }\n\n  const diffYears = Math.floor(diffDays / 365);\n\n  return translate('relativeTime.yearsAgo', '{{count}} y ago', diffYears);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAmBA,SAAgB,mBAAmB,WAAmB,GAAuB;CAC3E,MAAM,aACJ,KACA,cACA,UACW;AACX,MAAI,EACF,QAAO,EAAE,KAAK,cAAc,SAAS,OAAO,EAAE,OAAO,GAAG,OAAU;AAGpE,SAAO,SAAS,OACZ,aAAa,QAAQ,aAAa,OAAO,MAAM,CAAC,GAChD;;CAIN,MAAM,SADM,KAAK,KAAK,GACD;AAErB,KAAI,SAAS,EACX,QAAO,UAAU,wBAAwB,WAAW;CAGtD,MAAM,cAAc,KAAK,MAAM,SAAS,IAAK;CAC7C,MAAM,cAAc,KAAK,MAAM,cAAc,GAAG;CAChD,MAAM,YAAY,KAAK,MAAM,cAAc,GAAG;CAC9C,MAAM,WAAW,KAAK,MAAM,YAAY,GAAG;AAE3C,KAAI,cAAc,EAChB,QAAO,UAAU,wBAAwB,WAAW;AAGtD,KAAI,YAAY,EACd,QAAO,UAAU,uBAAuB,qBAAqB,YAAY;AAG3E,KAAI,WAAW,EACb,QAAO,UAAU,yBAAyB,mBAAmB,UAAU;AAGzE,KAAI,WAAW,EACb,QAAO,UAAU,wBAAwB,mBAAmB,SAAS;CAGvE,MAAM,YAAY,KAAK,MAAM,WAAW,EAAE;AAE1C,KAAI,WAAW,GACb,QAAO,UAAU,yBAAyB,mBAAmB,UAAU;CAGzE,MAAM,aAAa,KAAK,MAAM,WAAW,GAAG;AAE5C,KAAI,WAAW,IACb,QAAO,UAAU,0BAA0B,oBAAoB,WAAW;AAK5E,QAAO,UAAU,yBAAyB,mBAFxB,KAAK,MAAM,WAAW,IAAI,CAE2B"}

package/dist/components/overlays/Notifications/index.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { useToastContext } from "./NotificationContext.js";
 import { NotificationAction } from "./NotificationAction.js";
 import { NotificationCard } from "./NotificationCard.js";

package/dist/components/overlays/Notifications/use-notification-state.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useRef, useState } from "react";
 

package/dist/components/overlays/Notifications/use-notifications.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useWarn } from "../../../_internal/hooks/use-warn.js";
 import { useNotificationContext } from "./NotificationContext.js";

package/dist/components/overlays/Notifications/use-overlay-timers.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useEffect, useRef } from "react";
 

package/dist/components/overlays/Notifications/use-persistent-notifications.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { usePersistentNotificationsContext } from "./NotificationContext.js";
 import { useMemo } from "react";
 

package/dist/components/overlays/Notifications/use-persistent-state.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { cleanupAndGetValidIds, saveDismissedId } from "./dismissed-storage.js";
 import { useRef, useState } from "react";

package/dist/components/overlays/Notifications/use-toast-state.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useRef, useState } from "react";
 

package/dist/components/overlays/Toast/ToastItem.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { _Item } from "../../content/Item/Item.js";
 import { getThemeIcon } from "./useToast.js";
 import { tasty } from "@tenphi/tasty";

package/dist/components/overlays/Toast/index.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { useToastContext } from "../Notifications/NotificationContext.js";
 import { useProgressToast } from "./useProgressToast.js";
 import { getThemeIcon, useToast } from "./useToast.js";

package/dist/components/overlays/Toast/useProgressToast.js

@@ -1,6 +1,7 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
+import { useI18n } from "../../../i18n/useI18n.js";
 import { useToastContext } from "../Notifications/NotificationContext.js";
 import { useEffect, useRef } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -48,6 +49,7 @@ function getStringValue(value) {
 */
 function useProgressToast(options) {
 	const { addToast, removeToast, updateToast } = useToastContext();
+	const { t } = useI18n();
 	const toastIdRef = useRef(null);
 	const wasLoadingRef = useRef(null);
 	const hideTimerRef = useRef(null);
@@ -106,7 +108,7 @@ function useProgressToast(options) {
 			isSelected: true,
 			type: "outline",
 			onPress: handleHide,
-			children: "Hide"
+			children: t("toast.hide", "Hide")
 		}) : null;
 		const mergedActions = hideAction ? /* @__PURE__ */ jsxs(Fragment$1, { children: [currentToastData.actions, hideAction] }) : currentToastData.actions;
 		const toastData = {
@@ -169,7 +171,8 @@ function useProgressToast(options) {
 		addToast,
 		removeToast,
 		updateToast,
-		handleHide
+		handleHide,
+		t
 	]);
 	useEffect(() => {
 		return () => {

package/dist/components/overlays/Toast/useProgressToast.js.map

@@ -1 +1 @@
-{"version":3,"file":"useProgressToast.js","names":[],"sources":["../../../../src/components/overlays/Toast/useProgressToast.tsx"],"sourcesContent":["import { Key, useEffect, useRef } from 'react';\n\nimport { useEvent } from '../../../_internal';\nimport { ItemAction } from '../../actions/ItemAction/ItemAction';\n\nimport { useToastContext } from './ToastProvider';\n\nimport type {\n  ProgressToastEmpty,\n  ProgressToastOptions,\n  ToastData,\n} from './types';\n\nconst RESULT_DURATION = 3000;\n\n/**\n * Check if the options represent an \"empty\" value (null, undefined, false, or empty object).\n * When empty, the hook should immediately remove any existing toast.\n */\nfunction isEmptyOptions(\n  options: ProgressToastOptions | ProgressToastEmpty,\n): options is ProgressToastEmpty {\n  if (options == null || options === false) return true;\n  if (typeof options === 'object' && Object.keys(options).length === 0)\n    return true;\n  return false;\n}\n\n// Get string value for comparison (only strings are compared for re-show logic)\nfunction getStringValue(value: unknown): string | undefined {\n  return typeof value === 'string' ? value : undefined;\n}\n\n/**\n * Hook to display a progress toast that persists while loading.\n *\n * @example\n * ```tsx\n * useProgressToast(\n *   isLoading\n *     ? { isLoading: true, title: 'Saving...', icon: <Spinner /> }\n *     : { isLoading: false, title: 'Saved!', icon: <IconCheck />, theme: 'success' }\n * );\n *\n * // Or with error handling:\n * useProgressToast(\n *   isLoading\n *     ? { isLoading: true, title: 'Saving...', icon: <Spinner /> }\n *     : isError\n *       ? { isLoading: false, title: 'Error', description: errorMessage, theme: 'danger' }\n *       : { isLoading: false, title: 'Saved!', theme: 'success' }\n * );\n *\n * // Pass empty value to immediately remove any existing toast:\n * useProgressToast(shouldShow ? { isLoading: true, title: 'Loading...' } : null);\n *\n * // Or call with no argument to dismiss:\n * useProgressToast();\n * ```\n */\nexport function useProgressToast(\n  options?: ProgressToastOptions | ProgressToastEmpty,\n): void {\n  const { addToast, removeToast, updateToast } = useToastContext();\n\n  const toastIdRef = useRef<Key | null>(null);\n  const wasLoadingRef = useRef<boolean | null>(null);\n  const hideTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const isFirstRenderRef = useRef(true);\n  const optionsRef = useRef(options);\n  const hasBeenLoadingRef = useRef(false);\n  const hiddenByUserRef = useRef(false);\n\n  // Track previous string values for re-show comparison\n  const prevThemeRef = useRef<string | undefined>(undefined);\n  const prevTitleRef = useRef<string | undefined>(undefined);\n  const prevDescriptionRef = useRef<string | undefined>(undefined);\n\n  // Always update optionsRef to latest\n  optionsRef.current = options;\n\n  // Clear any pending hide timer\n  const clearHideTimer = () => {\n    if (hideTimerRef.current) {\n      clearTimeout(hideTimerRef.current);\n      hideTimerRef.current = null;\n    }\n  };\n\n  // Check if current options are empty\n  const isEmpty = isEmptyOptions(options);\n\n  // Extract values only when options are not empty\n  const isLoading = isEmpty ? false : options.isLoading;\n  const isDismissable = isEmpty ? false : !!options.isDismissable;\n  const currentTheme = isEmpty ? undefined : options.theme;\n  const currentTitle = isEmpty ? undefined : getStringValue(options.title);\n  const currentDescription = isEmpty\n    ? undefined\n    : getStringValue(options.description);\n\n  const handleHide = useEvent(() => {\n    if (toastIdRef.current != null) {\n      removeToast(toastIdRef.current);\n      toastIdRef.current = null;\n    }\n\n    hiddenByUserRef.current = true;\n  });\n\n  useEffect(() => {\n    const wasLoading = wasLoadingRef.current;\n    const isFirstRender = isFirstRenderRef.current;\n    const currentOptions = optionsRef.current;\n    const currentIsEmpty = isEmptyOptions(currentOptions);\n\n    // Handle empty options - immediately remove any existing toast\n    if (currentIsEmpty) {\n      clearHideTimer();\n\n      if (toastIdRef.current != null) {\n        removeToast(toastIdRef.current);\n        toastIdRef.current = null;\n      }\n\n      // Reset loading gate so the next cycle requires isLoading again\n      hasBeenLoadingRef.current = false;\n      hiddenByUserRef.current = false;\n      wasLoadingRef.current = null;\n      isFirstRenderRef.current = false;\n      prevThemeRef.current = undefined;\n      prevTitleRef.current = undefined;\n      prevDescriptionRef.current = undefined;\n      return;\n    }\n\n    // From here, we know options is a valid ProgressToastOptions\n    const {\n      isLoading: currentIsLoading,\n      isDismissable: _isDismissable,\n      ...currentToastData\n    } = currentOptions;\n\n    // Check if meaningful data changed (only string values)\n    const themeChanged = currentTheme !== prevThemeRef.current;\n    const titleChanged = currentTitle !== prevTitleRef.current;\n    const descriptionChanged =\n      currentDescription !== prevDescriptionRef.current;\n    const dataChanged = themeChanged || titleChanged || descriptionChanged;\n\n    const hideAction =\n      isDismissable && currentIsLoading ? (\n        <ItemAction isSelected type=\"outline\" onPress={handleHide}>\n          Hide\n        </ItemAction>\n      ) : null;\n\n    const mergedActions = hideAction ? (\n      <>\n        {currentToastData.actions}\n        {hideAction}\n      </>\n    ) : (\n      currentToastData.actions\n    );\n\n    const toastData: ToastData = {\n      title: undefined,\n      description: undefined,\n      theme: undefined,\n      icon: undefined,\n      itemProps: undefined,\n      ...currentToastData,\n      actions: mergedActions,\n      isLoading: currentIsLoading,\n      duration: null,\n    };\n\n    // Show a new toast or update an existing one in-place (no exit/enter animation).\n    const showToast = () => {\n      if (toastIdRef.current != null) {\n        updateToast(toastIdRef.current, toastData);\n      } else {\n        toastIdRef.current = addToast(toastData, true);\n      }\n    };\n\n    // Show/update toast and schedule removal after RESULT_DURATION.\n    const showToastWithTimer = () => {\n      showToast();\n\n      hideTimerRef.current = setTimeout(() => {\n        if (toastIdRef.current != null) {\n          removeToast(toastIdRef.current);\n          toastIdRef.current = null;\n        }\n      }, RESULT_DURATION);\n    };\n\n    if (currentIsLoading) {\n      // Starting or continuing loading\n      hasBeenLoadingRef.current = true;\n      clearHideTimer();\n\n      if (hiddenByUserRef.current) {\n        // User dismissed the loading toast; don't re-show during this loading cycle.\n      } else if (toastIdRef.current == null) {\n        // Create new toast\n        showToast();\n      } else if (dataChanged) {\n        // Toast exists but data changed (e.g., switching back to loading from another state)\n        showToast();\n      }\n    } else if (wasLoading === true && !currentIsLoading) {\n      // Transitioning from loading to not loading\n      hiddenByUserRef.current = false;\n      clearHideTimer();\n\n      if (currentTitle) {\n        // Show result toast with timer\n        showToastWithTimer();\n      } else {\n        // No content - just remove the loading toast immediately\n        if (toastIdRef.current != null) {\n          removeToast(toastIdRef.current);\n          toastIdRef.current = null;\n        }\n      }\n    } else if (\n      !currentIsLoading &&\n      !isFirstRender &&\n      hasBeenLoadingRef.current &&\n      dataChanged &&\n      toastIdRef.current != null\n    ) {\n      // Not loading, data changed while toast is still visible — update it.\n      if (currentTitle) {\n        clearHideTimer();\n        showToastWithTimer();\n      } else {\n        clearHideTimer();\n        removeToast(toastIdRef.current);\n        toastIdRef.current = null;\n      }\n    }\n\n    // Update refs for next comparison\n    wasLoadingRef.current = currentIsLoading;\n    isFirstRenderRef.current = false;\n    prevThemeRef.current = currentTheme;\n    prevTitleRef.current = currentTitle;\n    prevDescriptionRef.current = currentDescription;\n  }, [\n    isEmpty,\n    isLoading,\n    isDismissable,\n    currentTheme,\n    currentTitle,\n    currentDescription,\n    addToast,\n    removeToast,\n    updateToast,\n    handleHide,\n  ]);\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      clearHideTimer();\n\n      if (toastIdRef.current != null) {\n        removeToast(toastIdRef.current);\n        toastIdRef.current = null;\n      }\n    };\n  }, [removeToast]);\n}\n"],"mappings":"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"}
+{"version":3,"file":"useProgressToast.js","names":[],"sources":["../../../../src/components/overlays/Toast/useProgressToast.tsx"],"sourcesContent":["import { Key, useEffect, useRef } from 'react';\n\nimport { useEvent } from '../../../_internal';\nimport { useI18n } from '../../../i18n';\nimport { ItemAction } from '../../actions/ItemAction/ItemAction';\n\nimport { useToastContext } from './ToastProvider';\n\nimport type {\n  ProgressToastEmpty,\n  ProgressToastOptions,\n  ToastData,\n} from './types';\n\nconst RESULT_DURATION = 3000;\n\n/**\n * Check if the options represent an \"empty\" value (null, undefined, false, or empty object).\n * When empty, the hook should immediately remove any existing toast.\n */\nfunction isEmptyOptions(\n  options: ProgressToastOptions | ProgressToastEmpty,\n): options is ProgressToastEmpty {\n  if (options == null || options === false) return true;\n  if (typeof options === 'object' && Object.keys(options).length === 0)\n    return true;\n  return false;\n}\n\n// Get string value for comparison (only strings are compared for re-show logic)\nfunction getStringValue(value: unknown): string | undefined {\n  return typeof value === 'string' ? value : undefined;\n}\n\n/**\n * Hook to display a progress toast that persists while loading.\n *\n * @example\n * ```tsx\n * useProgressToast(\n *   isLoading\n *     ? { isLoading: true, title: 'Saving...', icon: <Spinner /> }\n *     : { isLoading: false, title: 'Saved!', icon: <IconCheck />, theme: 'success' }\n * );\n *\n * // Or with error handling:\n * useProgressToast(\n *   isLoading\n *     ? { isLoading: true, title: 'Saving...', icon: <Spinner /> }\n *     : isError\n *       ? { isLoading: false, title: 'Error', description: errorMessage, theme: 'danger' }\n *       : { isLoading: false, title: 'Saved!', theme: 'success' }\n * );\n *\n * // Pass empty value to immediately remove any existing toast:\n * useProgressToast(shouldShow ? { isLoading: true, title: 'Loading...' } : null);\n *\n * // Or call with no argument to dismiss:\n * useProgressToast();\n * ```\n */\nexport function useProgressToast(\n  options?: ProgressToastOptions | ProgressToastEmpty,\n): void {\n  const { addToast, removeToast, updateToast } = useToastContext();\n  const { t } = useI18n();\n\n  const toastIdRef = useRef<Key | null>(null);\n  const wasLoadingRef = useRef<boolean | null>(null);\n  const hideTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const isFirstRenderRef = useRef(true);\n  const optionsRef = useRef(options);\n  const hasBeenLoadingRef = useRef(false);\n  const hiddenByUserRef = useRef(false);\n\n  // Track previous string values for re-show comparison\n  const prevThemeRef = useRef<string | undefined>(undefined);\n  const prevTitleRef = useRef<string | undefined>(undefined);\n  const prevDescriptionRef = useRef<string | undefined>(undefined);\n\n  // Always update optionsRef to latest\n  optionsRef.current = options;\n\n  // Clear any pending hide timer\n  const clearHideTimer = () => {\n    if (hideTimerRef.current) {\n      clearTimeout(hideTimerRef.current);\n      hideTimerRef.current = null;\n    }\n  };\n\n  // Check if current options are empty\n  const isEmpty = isEmptyOptions(options);\n\n  // Extract values only when options are not empty\n  const isLoading = isEmpty ? false : options.isLoading;\n  const isDismissable = isEmpty ? false : !!options.isDismissable;\n  const currentTheme = isEmpty ? undefined : options.theme;\n  const currentTitle = isEmpty ? undefined : getStringValue(options.title);\n  const currentDescription = isEmpty\n    ? undefined\n    : getStringValue(options.description);\n\n  const handleHide = useEvent(() => {\n    if (toastIdRef.current != null) {\n      removeToast(toastIdRef.current);\n      toastIdRef.current = null;\n    }\n\n    hiddenByUserRef.current = true;\n  });\n\n  useEffect(() => {\n    const wasLoading = wasLoadingRef.current;\n    const isFirstRender = isFirstRenderRef.current;\n    const currentOptions = optionsRef.current;\n    const currentIsEmpty = isEmptyOptions(currentOptions);\n\n    // Handle empty options - immediately remove any existing toast\n    if (currentIsEmpty) {\n      clearHideTimer();\n\n      if (toastIdRef.current != null) {\n        removeToast(toastIdRef.current);\n        toastIdRef.current = null;\n      }\n\n      // Reset loading gate so the next cycle requires isLoading again\n      hasBeenLoadingRef.current = false;\n      hiddenByUserRef.current = false;\n      wasLoadingRef.current = null;\n      isFirstRenderRef.current = false;\n      prevThemeRef.current = undefined;\n      prevTitleRef.current = undefined;\n      prevDescriptionRef.current = undefined;\n      return;\n    }\n\n    // From here, we know options is a valid ProgressToastOptions\n    const {\n      isLoading: currentIsLoading,\n      isDismissable: _isDismissable,\n      ...currentToastData\n    } = currentOptions;\n\n    // Check if meaningful data changed (only string values)\n    const themeChanged = currentTheme !== prevThemeRef.current;\n    const titleChanged = currentTitle !== prevTitleRef.current;\n    const descriptionChanged =\n      currentDescription !== prevDescriptionRef.current;\n    const dataChanged = themeChanged || titleChanged || descriptionChanged;\n\n    const hideAction =\n      isDismissable && currentIsLoading ? (\n        <ItemAction isSelected type=\"outline\" onPress={handleHide}>\n          {t('toast.hide', 'Hide')}\n        </ItemAction>\n      ) : null;\n\n    const mergedActions = hideAction ? (\n      <>\n        {currentToastData.actions}\n        {hideAction}\n      </>\n    ) : (\n      currentToastData.actions\n    );\n\n    const toastData: ToastData = {\n      title: undefined,\n      description: undefined,\n      theme: undefined,\n      icon: undefined,\n      itemProps: undefined,\n      ...currentToastData,\n      actions: mergedActions,\n      isLoading: currentIsLoading,\n      duration: null,\n    };\n\n    // Show a new toast or update an existing one in-place (no exit/enter animation).\n    const showToast = () => {\n      if (toastIdRef.current != null) {\n        updateToast(toastIdRef.current, toastData);\n      } else {\n        toastIdRef.current = addToast(toastData, true);\n      }\n    };\n\n    // Show/update toast and schedule removal after RESULT_DURATION.\n    const showToastWithTimer = () => {\n      showToast();\n\n      hideTimerRef.current = setTimeout(() => {\n        if (toastIdRef.current != null) {\n          removeToast(toastIdRef.current);\n          toastIdRef.current = null;\n        }\n      }, RESULT_DURATION);\n    };\n\n    if (currentIsLoading) {\n      // Starting or continuing loading\n      hasBeenLoadingRef.current = true;\n      clearHideTimer();\n\n      if (hiddenByUserRef.current) {\n        // User dismissed the loading toast; don't re-show during this loading cycle.\n      } else if (toastIdRef.current == null) {\n        // Create new toast\n        showToast();\n      } else if (dataChanged) {\n        // Toast exists but data changed (e.g., switching back to loading from another state)\n        showToast();\n      }\n    } else if (wasLoading === true && !currentIsLoading) {\n      // Transitioning from loading to not loading\n      hiddenByUserRef.current = false;\n      clearHideTimer();\n\n      if (currentTitle) {\n        // Show result toast with timer\n        showToastWithTimer();\n      } else {\n        // No content - just remove the loading toast immediately\n        if (toastIdRef.current != null) {\n          removeToast(toastIdRef.current);\n          toastIdRef.current = null;\n        }\n      }\n    } else if (\n      !currentIsLoading &&\n      !isFirstRender &&\n      hasBeenLoadingRef.current &&\n      dataChanged &&\n      toastIdRef.current != null\n    ) {\n      // Not loading, data changed while toast is still visible — update it.\n      if (currentTitle) {\n        clearHideTimer();\n        showToastWithTimer();\n      } else {\n        clearHideTimer();\n        removeToast(toastIdRef.current);\n        toastIdRef.current = null;\n      }\n    }\n\n    // Update refs for next comparison\n    wasLoadingRef.current = currentIsLoading;\n    isFirstRenderRef.current = false;\n    prevThemeRef.current = currentTheme;\n    prevTitleRef.current = currentTitle;\n    prevDescriptionRef.current = currentDescription;\n  }, [\n    isEmpty,\n    isLoading,\n    isDismissable,\n    currentTheme,\n    currentTitle,\n    currentDescription,\n    addToast,\n    removeToast,\n    updateToast,\n    handleHide,\n    t,\n  ]);\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      clearHideTimer();\n\n      if (toastIdRef.current != null) {\n        removeToast(toastIdRef.current);\n        toastIdRef.current = null;\n      }\n    };\n  }, [removeToast]);\n}\n"],"mappings":"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"}

package/dist/components/overlays/Toast/useToast.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { CheckIcon } from "../../../icons/CheckIcon.js";
 import { DangerIcon } from "../../../icons/DangerIcon.js";
 import { InfoCircleIcon } from "../../../icons/InfoCircleIcon.js";

package/dist/components/overlays/Tooltip/Tooltip.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useLayoutEffect as useLayoutEffect$1 } from "../../../utils/react/useLayoutEffect.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";

package/dist/components/overlays/Tooltip/TooltipProvider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { _Tooltip } from "./Tooltip.js";
 import { TooltipTrigger } from "./TooltipTrigger.js";
 import { isValidElement, useEffect, useState } from "react";

package/dist/components/overlays/Tooltip/TooltipTrigger.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { TooltipContext } from "./context.js";
 import { Block } from "../../Block.js";
 import { _ActiveZone } from "../../content/ActiveZone/ActiveZone.js";

package/dist/components/overlays/Tooltip/context.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import React from "react";
 
 //#region src/components/overlays/Tooltip/context.ts

package/dist/components/portal/Portal.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { usePortal } from "./usePortal.js";
 import { Fragment, jsx } from "react/jsx-runtime";
 import { createPortal } from "react-dom";

package/dist/components/portal/PortalProvider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { createContext, useContext } from "react";
 
 //#region src/components/portal/PortalProvider.ts

package/dist/components/portal/usePortal.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { usePortalContext } from "./PortalProvider.js";
 import { useEffect, useRef, useState } from "react";
 import invariant from "tiny-invariant";

package/dist/components/shared/DraggableCollection.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { useEvent } from "../../_internal/hooks/use-event.js";
 import { useCallback, useEffect, useMemo, useRef } from "react";
 import { ListDropTargetDelegate, ListKeyboardDelegate, mergeProps, useDraggableCollection, useDroppableCollection } from "react-aria";

package/dist/components/shared/InvalidIcon.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { WarningIcon } from "../../icons/WarningIcon.js";
 import { jsx } from "react/jsx-runtime";
 

package/dist/components/shared/ValidIcon.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { CheckIcon } from "../../icons/CheckIcon.js";
 import { jsx } from "react/jsx-runtime";
 

package/dist/components/status/LoadingAnimation/LoadingAnimation.js

@@ -1,5 +1,6 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { Block } from "../../Block.js";
+import { useI18n } from "../../../i18n/useI18n.js";
 import { tasty } from "@tenphi/tasty";
 import { jsx, jsxs } from "react/jsx-runtime";
 
@@ -124,10 +125,11 @@ const SIZE_MAP = {
 	large: 96
 };
 function LoadingAnimation({ size = "medium", ...props }) {
+	const { t } = useI18n();
 	const numSize = SIZE_MAP[size] || size || SIZE_MAP.medium;
 	return /* @__PURE__ */ jsxs(Block, {
 		role: "img",
-		"aria-label": "Loading animation",
+		"aria-label": t("loadingAnimation.ariaLabel", "Loading animation"),
 		width: numSize,
 		height: numSize * 1.1388888889,
 		style: { position: "relative" },

package/dist/components/status/LoadingAnimation/LoadingAnimation.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingAnimation.js","names":[],"sources":["../../../../src/components/status/LoadingAnimation/LoadingAnimation.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport { CSSProperties } from 'react';\n\nimport { Block, CubeBlockProps } from '../../Block';\n\nconst CubeElement = tasty({\n  as: 'svg',\n  styles: {\n    display: 'block',\n    position: 'absolute',\n    width: '50%',\n    height: '50%',\n\n    // The three visible faces of the cube get their colors via the SVG\n    // `fill=\"…\"` attribute on each `<path>` (see the JSX below), NOT via a\n    // tasty `fill` style. Tasty's `fill` is a typed shorthand for\n    // `background-color` — applying it to an SVG `<path>` would inject\n    // `background-color: …` which paths simply ignore (this was the\n    // \"invisible cube\" bug). Pointing the SVG `fill` attribute at the\n    // adaptive `--loading-face-N-color` CSS variables published by Glaze\n    // (defined in `src/tokens/palette.ts`) keeps the three faces driven by\n    // the design system without going through a style property tasty would\n    // re-route to the wrong CSS slot.\n\n    animationName: {\n      '': 'none',\n      'index=0': 'dice0',\n      'index=1': 'dice1',\n      'index=2': 'dice2',\n    },\n    animationDuration: {\n      '': '0s',\n      'index=0 | index=1 | index=2': '2s',\n    },\n    animationIterationCount: {\n      '': 1,\n      'index=0 | index=1 | index=2': 'infinite',\n    },\n    animationTimingFunction: {\n      '': 'ease',\n      'index=0 | index=1 | index=2': 'ease',\n    },\n    zIndex: {\n      '': 0,\n      'index=0 | index=1 | index=2': 0,\n    },\n\n    '@keyframes': {\n      dice0: {\n        from: { transform: 'translate(49%, 0.5%)', zIndex: 0 },\n        '25%': { transform: 'translate(49%, 0.5%)', zIndex: 0 },\n        '50%': { transform: 'translate(0%, 25%)', zIndex: 0 },\n        '51%': { zIndex: 1 },\n        '75%': { zIndex: 1 },\n        to: { transform: 'translate(0%, 25%)', zIndex: 1 },\n      },\n      dice1: {\n        from: { transform: 'translate(0%, 25%)', zIndex: 3 },\n        '25%': { transform: 'translate(49%, 49%)', zIndex: 3 },\n        '75%': { transform: 'translate(49%, 49%)', zIndex: 2 },\n        to: { transform: 'translate(98%, 25%)', zIndex: 1 },\n      },\n      dice2: {\n        from: { transform: 'translate(98%, 25%)', zIndex: 1 },\n        '50%': { transform: 'translate(98%, 25%)', zIndex: 0 },\n        '75%': { transform: 'translate(49%, 0.5%)', zIndex: 0 },\n        to: { transform: 'translate(49%, 0.5%)', zIndex: 0 },\n      },\n    },\n  },\n});\n\ninterface CubeProps {\n  index?: 0 | 1 | 2;\n  style?: CSSProperties;\n}\n\nfunction Cube({ index, style }: CubeProps) {\n  return (\n    <CubeElement\n      mods={index != null ? { index } : undefined}\n      style={style}\n      viewBox=\"0 0 36 41\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      role=\"presentation\"\n      aria-hidden=\"true\"\n    >\n      <path\n        fill=\"var(--loading-face-1-color)\"\n        d=\"M35.899 10.351l-18 10.25L.1 10.25l18-10.25L35.9 10.351z\"\n      />\n      <path\n        fill=\"var(--loading-face-2-color)\"\n        d=\"M18 41L0 30.75l.101-20.5L18 20.5\"\n      />\n      <path\n        fill=\"var(--loading-face-3-color)\"\n        d=\"M36 30.75L18 41V20.6l17.899-10.25L36 30.75z\"\n      />\n    </CubeElement>\n  );\n}\n\nconst SIZE_MAP = {\n  small: 32,\n  medium: 64,\n  large: 96,\n};\n\nexport interface CubeLoadingAnimationProps extends CubeBlockProps {\n  size?: 'small' | 'medium' | 'large' | number;\n}\n\nexport function LoadingAnimation({\n  size = 'medium',\n  ...props\n}: CubeLoadingAnimationProps) {\n  const numSize: number = SIZE_MAP[size] || size || SIZE_MAP.medium;\n\n  return (\n    <Block\n      role=\"img\"\n      aria-label=\"Loading animation\"\n      width={numSize}\n      height={numSize * 1.1388888889}\n      style={{ position: 'relative' }}\n      {...props}\n    >\n      <Cube style={{ transform: 'translate(0%, 72.5%)' }} />\n      <Cube style={{ transform: 'translate(98%, 72.5%)' }} />\n      <Cube style={{ transform: 'translate(49%, 96.5%)' }} />\n      <Cube index={0} />\n      <Cube index={1} />\n      <Cube index={2} />\n    </Block>\n  );\n}\n"],"mappings":";;;;;;AAKA,MAAM,cAAc,MAAM;CACxB,IAAI;CACJ,QAAQ;EACN,SAAS;EACT,UAAU;EACV,OAAO;EACP,QAAQ;EAaR,eAAe;GACb,IAAI;GACJ,WAAW;GACX,WAAW;GACX,WAAW;GACZ;EACD,mBAAmB;GACjB,IAAI;GACJ,+BAA+B;GAChC;EACD,yBAAyB;GACvB,IAAI;GACJ,+BAA+B;GAChC;EACD,yBAAyB;GACvB,IAAI;GACJ,+BAA+B;GAChC;EACD,QAAQ;GACN,IAAI;GACJ,+BAA+B;GAChC;EAED,cAAc;GACZ,OAAO;IACL,MAAM;KAAE,WAAW;KAAwB,QAAQ;KAAG;IACtD,OAAO;KAAE,WAAW;KAAwB,QAAQ;KAAG;IACvD,OAAO;KAAE,WAAW;KAAsB,QAAQ;KAAG;IACrD,OAAO,EAAE,QAAQ,GAAG;IACpB,OAAO,EAAE,QAAQ,GAAG;IACpB,IAAI;KAAE,WAAW;KAAsB,QAAQ;KAAG;IACnD;GACD,OAAO;IACL,MAAM;KAAE,WAAW;KAAsB,QAAQ;KAAG;IACpD,OAAO;KAAE,WAAW;KAAuB,QAAQ;KAAG;IACtD,OAAO;KAAE,WAAW;KAAuB,QAAQ;KAAG;IACtD,IAAI;KAAE,WAAW;KAAuB,QAAQ;KAAG;IACpD;GACD,OAAO;IACL,MAAM;KAAE,WAAW;KAAuB,QAAQ;KAAG;IACrD,OAAO;KAAE,WAAW;KAAuB,QAAQ;KAAG;IACtD,OAAO;KAAE,WAAW;KAAwB,QAAQ;KAAG;IACvD,IAAI;KAAE,WAAW;KAAwB,QAAQ;KAAG;IACrD;GACF;EACF;CACF,CAAC;AAOF,SAAS,KAAK,EAAE,OAAO,SAAoB;AACzC,QACE,qBAAC;EACC,MAAM,SAAS,OAAO,EAAE,OAAO,GAAG;EAC3B;EACP,SAAQ;EACR,MAAK;EACL,OAAM;EACN,MAAK;EACL,eAAY;;GAEZ,oBAAC;IACC,MAAK;IACL,GAAE;KACF;GACF,oBAAC;IACC,MAAK;IACL,GAAE;KACF;GACF,oBAAC;IACC,MAAK;IACL,GAAE;KACF;;GACU;;AAIlB,MAAM,WAAW;CACf,OAAO;CACP,QAAQ;CACR,OAAO;CACR;AAMD,SAAgB,iBAAiB,EAC/B,OAAO,UACP,GAAG,SACyB;CAC5B,MAAM,UAAkB,SAAS,SAAS,QAAQ,SAAS;AAE3D,QACE,qBAAC;EACC,MAAK;EACL,cAAW;EACX,OAAO;EACP,QAAQ,UAAU;EAClB,OAAO,EAAE,UAAU,YAAY;EAC/B,GAAI;;GAEJ,oBAAC,QAAK,OAAO,EAAE,WAAW,wBAAwB,GAAI;GACtD,oBAAC,QAAK,OAAO,EAAE,WAAW,yBAAyB,GAAI;GACvD,oBAAC,QAAK,OAAO,EAAE,WAAW,yBAAyB,GAAI;GACvD,oBAAC,QAAK,OAAO,IAAK;GAClB,oBAAC,QAAK,OAAO,IAAK;GAClB,oBAAC,QAAK,OAAO,IAAK;;GACZ"}
+{"version":3,"file":"LoadingAnimation.js","names":[],"sources":["../../../../src/components/status/LoadingAnimation/LoadingAnimation.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport { CSSProperties } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { Block, CubeBlockProps } from '../../Block';\n\nconst CubeElement = tasty({\n  as: 'svg',\n  styles: {\n    display: 'block',\n    position: 'absolute',\n    width: '50%',\n    height: '50%',\n\n    // The three visible faces of the cube get their colors via the SVG\n    // `fill=\"…\"` attribute on each `<path>` (see the JSX below), NOT via a\n    // tasty `fill` style. Tasty's `fill` is a typed shorthand for\n    // `background-color` — applying it to an SVG `<path>` would inject\n    // `background-color: …` which paths simply ignore (this was the\n    // \"invisible cube\" bug). Pointing the SVG `fill` attribute at the\n    // adaptive `--loading-face-N-color` CSS variables published by Glaze\n    // (defined in `src/tokens/palette.ts`) keeps the three faces driven by\n    // the design system without going through a style property tasty would\n    // re-route to the wrong CSS slot.\n\n    animationName: {\n      '': 'none',\n      'index=0': 'dice0',\n      'index=1': 'dice1',\n      'index=2': 'dice2',\n    },\n    animationDuration: {\n      '': '0s',\n      'index=0 | index=1 | index=2': '2s',\n    },\n    animationIterationCount: {\n      '': 1,\n      'index=0 | index=1 | index=2': 'infinite',\n    },\n    animationTimingFunction: {\n      '': 'ease',\n      'index=0 | index=1 | index=2': 'ease',\n    },\n    zIndex: {\n      '': 0,\n      'index=0 | index=1 | index=2': 0,\n    },\n\n    '@keyframes': {\n      dice0: {\n        from: { transform: 'translate(49%, 0.5%)', zIndex: 0 },\n        '25%': { transform: 'translate(49%, 0.5%)', zIndex: 0 },\n        '50%': { transform: 'translate(0%, 25%)', zIndex: 0 },\n        '51%': { zIndex: 1 },\n        '75%': { zIndex: 1 },\n        to: { transform: 'translate(0%, 25%)', zIndex: 1 },\n      },\n      dice1: {\n        from: { transform: 'translate(0%, 25%)', zIndex: 3 },\n        '25%': { transform: 'translate(49%, 49%)', zIndex: 3 },\n        '75%': { transform: 'translate(49%, 49%)', zIndex: 2 },\n        to: { transform: 'translate(98%, 25%)', zIndex: 1 },\n      },\n      dice2: {\n        from: { transform: 'translate(98%, 25%)', zIndex: 1 },\n        '50%': { transform: 'translate(98%, 25%)', zIndex: 0 },\n        '75%': { transform: 'translate(49%, 0.5%)', zIndex: 0 },\n        to: { transform: 'translate(49%, 0.5%)', zIndex: 0 },\n      },\n    },\n  },\n});\n\ninterface CubeProps {\n  index?: 0 | 1 | 2;\n  style?: CSSProperties;\n}\n\nfunction Cube({ index, style }: CubeProps) {\n  return (\n    <CubeElement\n      mods={index != null ? { index } : undefined}\n      style={style}\n      viewBox=\"0 0 36 41\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      role=\"presentation\"\n      aria-hidden=\"true\"\n    >\n      <path\n        fill=\"var(--loading-face-1-color)\"\n        d=\"M35.899 10.351l-18 10.25L.1 10.25l18-10.25L35.9 10.351z\"\n      />\n      <path\n        fill=\"var(--loading-face-2-color)\"\n        d=\"M18 41L0 30.75l.101-20.5L18 20.5\"\n      />\n      <path\n        fill=\"var(--loading-face-3-color)\"\n        d=\"M36 30.75L18 41V20.6l17.899-10.25L36 30.75z\"\n      />\n    </CubeElement>\n  );\n}\n\nconst SIZE_MAP = {\n  small: 32,\n  medium: 64,\n  large: 96,\n};\n\nexport interface CubeLoadingAnimationProps extends CubeBlockProps {\n  size?: 'small' | 'medium' | 'large' | number;\n}\n\nexport function LoadingAnimation({\n  size = 'medium',\n  ...props\n}: CubeLoadingAnimationProps) {\n  const { t } = useI18n();\n  const numSize: number = SIZE_MAP[size] || size || SIZE_MAP.medium;\n\n  return (\n    <Block\n      role=\"img\"\n      aria-label={t('loadingAnimation.ariaLabel', 'Loading animation')}\n      width={numSize}\n      height={numSize * 1.1388888889}\n      style={{ position: 'relative' }}\n      {...props}\n    >\n      <Cube style={{ transform: 'translate(0%, 72.5%)' }} />\n      <Cube style={{ transform: 'translate(98%, 72.5%)' }} />\n      <Cube style={{ transform: 'translate(49%, 96.5%)' }} />\n      <Cube index={0} />\n      <Cube index={1} />\n      <Cube index={2} />\n    </Block>\n  );\n}\n"],"mappings":";;;;;;;AAMA,MAAM,cAAc,MAAM;CACxB,IAAI;CACJ,QAAQ;EACN,SAAS;EACT,UAAU;EACV,OAAO;EACP,QAAQ;EAaR,eAAe;GACb,IAAI;GACJ,WAAW;GACX,WAAW;GACX,WAAW;GACZ;EACD,mBAAmB;GACjB,IAAI;GACJ,+BAA+B;GAChC;EACD,yBAAyB;GACvB,IAAI;GACJ,+BAA+B;GAChC;EACD,yBAAyB;GACvB,IAAI;GACJ,+BAA+B;GAChC;EACD,QAAQ;GACN,IAAI;GACJ,+BAA+B;GAChC;EAED,cAAc;GACZ,OAAO;IACL,MAAM;KAAE,WAAW;KAAwB,QAAQ;KAAG;IACtD,OAAO;KAAE,WAAW;KAAwB,QAAQ;KAAG;IACvD,OAAO;KAAE,WAAW;KAAsB,QAAQ;KAAG;IACrD,OAAO,EAAE,QAAQ,GAAG;IACpB,OAAO,EAAE,QAAQ,GAAG;IACpB,IAAI;KAAE,WAAW;KAAsB,QAAQ;KAAG;IACnD;GACD,OAAO;IACL,MAAM;KAAE,WAAW;KAAsB,QAAQ;KAAG;IACpD,OAAO;KAAE,WAAW;KAAuB,QAAQ;KAAG;IACtD,OAAO;KAAE,WAAW;KAAuB,QAAQ;KAAG;IACtD,IAAI;KAAE,WAAW;KAAuB,QAAQ;KAAG;IACpD;GACD,OAAO;IACL,MAAM;KAAE,WAAW;KAAuB,QAAQ;KAAG;IACrD,OAAO;KAAE,WAAW;KAAuB,QAAQ;KAAG;IACtD,OAAO;KAAE,WAAW;KAAwB,QAAQ;KAAG;IACvD,IAAI;KAAE,WAAW;KAAwB,QAAQ;KAAG;IACrD;GACF;EACF;CACF,CAAC;AAOF,SAAS,KAAK,EAAE,OAAO,SAAoB;AACzC,QACE,qBAAC;EACC,MAAM,SAAS,OAAO,EAAE,OAAO,GAAG;EAC3B;EACP,SAAQ;EACR,MAAK;EACL,OAAM;EACN,MAAK;EACL,eAAY;;GAEZ,oBAAC;IACC,MAAK;IACL,GAAE;KACF;GACF,oBAAC;IACC,MAAK;IACL,GAAE;KACF;GACF,oBAAC;IACC,MAAK;IACL,GAAE;KACF;;GACU;;AAIlB,MAAM,WAAW;CACf,OAAO;CACP,QAAQ;CACR,OAAO;CACR;AAMD,SAAgB,iBAAiB,EAC/B,OAAO,UACP,GAAG,SACyB;CAC5B,MAAM,EAAE,MAAM,SAAS;CACvB,MAAM,UAAkB,SAAS,SAAS,QAAQ,SAAS;AAE3D,QACE,qBAAC;EACC,MAAK;EACL,cAAY,EAAE,8BAA8B,oBAAoB;EAChE,OAAO;EACP,QAAQ,UAAU;EAClB,OAAO,EAAE,UAAU,YAAY;EAC/B,GAAI;;GAEJ,oBAAC,QAAK,OAAO,EAAE,WAAW,wBAAwB,GAAI;GACtD,oBAAC,QAAK,OAAO,EAAE,WAAW,yBAAyB,GAAI;GACvD,oBAAC,QAAK,OAAO,EAAE,WAAW,yBAAyB,GAAI;GACvD,oBAAC,QAAK,OAAO,IAAK;GAClB,oBAAC,QAAK,OAAO,IAAK;GAClB,oBAAC,QAAK,OAAO,IAAK;;GACZ"}

package/dist/components/status/Spin/Cube.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { tasty } from "@tenphi/tasty";
 import { memo } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/components/status/Spin/InternalSpinner.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { Cube } from "./Cube.js";
 import { SpinsContainer } from "./SpinsContainer.js";
 import { tasty } from "@tenphi/tasty";

package/dist/components/status/Spin/Spin.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { Block } from "../../Block.js";
 import { InternalSpinner } from "./InternalSpinner.js";
 import { tasty } from "@tenphi/tasty";

package/dist/components/status/Spin/SpinsContainer.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 import { tasty } from "@tenphi/tasty";
 import { jsx } from "react/jsx-runtime";
 

package/dist/data/item-themes.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 //#region src/data/item-themes.ts
 const VALIDATION_STYLES = { border: {
 	invalid: "#danger-accent-text",

package/dist/data/themes.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.145.4 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
 //#region src/data/themes.ts
 var themes_default = {
 	special: {

package/dist/i18n/I18nProvider.d.ts

@@ -0,0 +1,29 @@
+
+import { ReactNode } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { i18n as i18n$1 } from "i18next";
+
+//#region src/i18n/I18nProvider.d.ts
+interface I18nProviderProps {
+  children: ReactNode;
+  /**
+   * i18next instance used by this tree. Pass a request-local instance from
+   * `createUIKitI18n()` during SSR to prevent concurrent requests from sharing
+   * mutable language state. Defaults to the browser-friendly shared instance.
+   */
+  i18n?: i18n$1;
+  /**
+   * Force a specific BCP-47 locale for React Aria formatting instead of
+   * following the active i18next language. Rarely needed — omit it so
+   * date/number/collation formatting stays in sync with translated strings.
+   */
+  locale?: string;
+}
+declare function I18nProvider({
+  children,
+  i18n,
+  locale
+}: I18nProviderProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { I18nProvider, I18nProviderProps };
+//# sourceMappingURL=I18nProvider.d.ts.map

package/dist/i18n/I18nProvider.js

@@ -0,0 +1,46 @@
+/** @license MIT | @cube-dev/ui-kit v0.146.0 | Cube Dev Team */
+import { UIKIT_I18N_NAMESPACE, getI18n } from "./instance.js";
+import { jsx } from "react/jsx-runtime";
+import { I18nProvider } from "react-aria";
+import { I18nextProvider, useTranslation } from "react-i18next";
+
+//#region src/i18n/I18nProvider.tsx
+/**
+* The UI Kit's single i18n provider. It wires up **both** localization layers
+* from one place:
+*
+* - `<I18nextProvider>` — supplies the selected i18next instance for translated
+*   strings (`useTranslation`, `Trans`, ...).
+* - React Aria's `<I18nProvider>` — supplies the locale that React Aria's
+*   formatting hooks read (`useLocale`, `useDateFormatter`, `useNumberFormatter`,
+*   `useCollator`, `useFilter`, ...).
+*
+* These are two independent library contexts, so they can't be a single physical
+* provider — but the language is one concept, owned by the i18next instance. This
+* component makes the instance the single source of truth and *derives* React
+* Aria's locale from it, so a host calling `getI18n().changeLanguage('de-DE')`
+* gets German labels **and** German number/date formatting with no extra setup.
+* The locale bridge re-renders on `languageChanged`, keeping the two in sync
+* automatically.
+*/
+function AriaLocaleBridge({ children, i18n, locale }) {
+	const { i18n: activeI18n } = useTranslation(UIKIT_I18N_NAMESPACE, { i18n });
+	return /* @__PURE__ */ jsx(I18nProvider, {
+		locale: locale ?? activeI18n.resolvedLanguage ?? activeI18n.language,
+		children
+	});
+}
+function I18nProvider$1({ children, i18n = getI18n(), locale }) {
+	return /* @__PURE__ */ jsx(I18nextProvider, {
+		i18n,
+		children: /* @__PURE__ */ jsx(AriaLocaleBridge, {
+			i18n,
+			locale,
+			children
+		})
+	});
+}
+
+//#endregion
+export { I18nProvider$1 as I18nProvider };
+//# sourceMappingURL=I18nProvider.js.map

package/dist/i18n/I18nProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"I18nProvider.js","names":["AriaI18nProvider","I18nProvider"],"sources":["../../src/i18n/I18nProvider.tsx"],"sourcesContent":["import { I18nProvider as AriaI18nProvider } from 'react-aria';\nimport { I18nextProvider, useTranslation } from 'react-i18next';\n\nimport { getI18n, UIKIT_I18N_NAMESPACE } from './instance';\n\nimport type { i18n as I18nInstance } from 'i18next';\nimport type { ReactNode } from 'react';\n\nexport interface I18nProviderProps {\n  children: ReactNode;\n  /**\n   * i18next instance used by this tree. Pass a request-local instance from\n   * `createUIKitI18n()` during SSR to prevent concurrent requests from sharing\n   * mutable language state. Defaults to the browser-friendly shared instance.\n   */\n  i18n?: I18nInstance;\n  /**\n   * Force a specific BCP-47 locale for React Aria formatting instead of\n   * following the active i18next language. Rarely needed — omit it so\n   * date/number/collation formatting stays in sync with translated strings.\n   */\n  locale?: string;\n}\n\n/**\n * The UI Kit's single i18n provider. It wires up **both** localization layers\n * from one place:\n *\n * - `<I18nextProvider>` — supplies the selected i18next instance for translated\n *   strings (`useTranslation`, `Trans`, ...).\n * - React Aria's `<I18nProvider>` — supplies the locale that React Aria's\n *   formatting hooks read (`useLocale`, `useDateFormatter`, `useNumberFormatter`,\n *   `useCollator`, `useFilter`, ...).\n *\n * These are two independent library contexts, so they can't be a single physical\n * provider — but the language is one concept, owned by the i18next instance. This\n * component makes the instance the single source of truth and *derives* React\n * Aria's locale from it, so a host calling `getI18n().changeLanguage('de-DE')`\n * gets German labels **and** German number/date formatting with no extra setup.\n * The locale bridge re-renders on `languageChanged`, keeping the two in sync\n * automatically.\n */\nfunction AriaLocaleBridge({\n  children,\n  i18n,\n  locale,\n}: Required<Pick<I18nProviderProps, 'children' | 'i18n'>> &\n  Pick<I18nProviderProps, 'locale'>) {\n  const { i18n: activeI18n } = useTranslation(UIKIT_I18N_NAMESPACE, { i18n });\n  const resolvedLocale =\n    locale ?? activeI18n.resolvedLanguage ?? activeI18n.language;\n\n  return (\n    <AriaI18nProvider locale={resolvedLocale}>{children}</AriaI18nProvider>\n  );\n}\n\nexport function I18nProvider({\n  children,\n  i18n = getI18n(),\n  locale,\n}: I18nProviderProps) {\n  return (\n    <I18nextProvider i18n={i18n}>\n      <AriaLocaleBridge i18n={i18n} locale={locale}>\n        {children}\n      </AriaLocaleBridge>\n    </I18nextProvider>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,SAAS,iBAAiB,EACxB,UACA,MACA,UAEmC;CACnC,MAAM,EAAE,MAAM,eAAe,eAAe,sBAAsB,EAAE,MAAM,CAAC;AAI3E,QACE,oBAACA;EAAiB,QAHlB,UAAU,WAAW,oBAAoB,WAAW;EAGT;GAA4B;;AAI3E,SAAgBC,eAAa,EAC3B,UACA,OAAO,SAAS,EAChB,UACoB;AACpB,QACE,oBAAC;EAAsB;YACrB,oBAAC;GAAuB;GAAc;GACnC;IACgB;GACH"}