@urbicon-ui/blocks 6.19.3 → 6.21.0

package/dist/components/Calendar/Calendar.svelte

@@ -161,6 +161,9 @@
     if (month == null && year == null) return today;
     return new Date(year ?? today.getFullYear(), month ?? today.getMonth(), 1);
   }
+  // Uncontrolled seed: capture only the initial default*; later changes to the
+  // default* props must not move the user's navigated month.
+  // svelte-ignore state_referenced_locally
   let referenceDate = $state(
     resolveInitialReference(value, defaultDate, defaultMonth, defaultYear)
   );

package/dist/icons/IconProvider.svelte

@@ -4,6 +4,9 @@
 
   let { icons, children }: { icons: Partial<IconSet>; children: Snippet } = $props();
 
+  // Provider config is applied once at init — icon overrides are not meant to
+  // swap reactively after mount.
+  // svelte-ignore state_referenced_locally
   setIcons(icons);
 </script>
 

package/dist/mint/styles.css

@@ -177,7 +177,7 @@
 
 /* === HIGH CONTRAST MODE === */
 
-@media (prefers-contrast: high) {
+@media (prefers-contrast: more) {
   .blocks-mint-glow {
     box-shadow: 0 0 0 2px currentColor;
   }

package/dist/primitives/Accordion/Accordion.svelte

@@ -36,6 +36,9 @@
     return Array.isArray(v) ? v : [v];
   }
 
+  // Uncontrolled seed: capture only the initial `defaultValue`; later changes
+  // must not clobber user interaction.
+  // svelte-ignore state_referenced_locally
   let internalValue = $state<string[]>(normalise(defaultValue));
 
   const openItems = $derived(value !== undefined ? normalise(value) : internalValue);

package/dist/primitives/Avatar/Avatar.svelte

@@ -17,6 +17,7 @@
     intent = 'neutral',
     status,
     statusPosition = 'bottom-right',
+    pulse = false,
     ring = false,
     ringIntent = 'primary',
     ringColor,
@@ -38,7 +39,6 @@
 
   let avatarElement = $state<HTMLElement>();
   let imageError = $state(false);
-  let isHovered = $state(false);
 
   const isInteractive = $derived(clickable || interactive || !!onclick);
 
@@ -91,6 +91,7 @@
     intent: randomColor ? undefined : intent,
     status,
     statusPosition,
+    pulse,
     ring,
     ringIntent: ringColor ? undefined : ringIntent,
     interactive: isInteractive
@@ -102,31 +103,20 @@
     resolveSlotClasses(blocksConfig, 'Avatar', preset, variantProps, slotClassesProp)
   );
 
-  const dynamicStyles = $derived.by(() => {
-    const styles: Record<string, string> = {};
-
-    if (randomColor && randomBg) {
-      // Inline style property names must be kebab-case, not JS camelCase.
-      // Previously `styles.backgroundColor` serialised as-is, so browsers
-      // ignored it and the avatar fell back to surface-interactive + white
-      // text (1.15:1 contrast).
-      styles['background-color'] = randomBg;
-      styles.color = 'white';
-    }
-
-    if (ringColor) {
-      styles['border-color'] = ringColor;
-    }
-
-    return styles;
-  });
-
-  const styleString = $derived(
-    Object.entries(dynamicStyles)
-      .map(([key, value]) => `${key}: ${value}`)
-      .join('; ')
+  // `randomColor` paints the visible fill, so it targets the `frame` slot.
+  // Inline property names stay kebab-case — a previous camelCase
+  // `backgroundColor` was silently ignored by browsers, dropping the avatar back
+  // to surface-interactive + white text.
+  const frameStyle = $derived(
+    randomColor && randomBg ? `background-color: ${randomBg}; color: white` : undefined
   );
 
+  // `ringColor` recolours the ring on the outer `base`. The ring is a
+  // Tailwind `ring-2` box-shadow, so it reads `--tw-ring-color` — setting
+  // `border-color` (the previous approach) was a no-op, as the avatar has no
+  // border. Only meaningful together with `ring`.
+  const baseStyle = $derived(ringColor ? `--tw-ring-color: ${ringColor}` : undefined);
+
   $effect(() => {
     if (avatarElement && mint && mint !== 'none' && isInteractive) {
       return mintRegistry.apply(avatarElement, mint);
@@ -134,12 +124,10 @@
   });
 
   function handleMouseEnter() {
-    isHovered = true;
     onHover?.(true);
   }
 
   function handleMouseLeave() {
-    isHovered = false;
     onHover?.(false);
   }
 
@@ -165,12 +153,13 @@
 <div
   bind:this={avatarElement}
   class={[
+    'blocks-avatar',
     `blocks-intent-${intent}`,
     unstyled
       ? [slotClasses?.base, className].filter(Boolean).join(' ')
       : styles.base({ class: [slotClasses?.base, className] })
   ]}
-  style={styleString}
+  style={baseStyle}
   role={isInteractive ? 'button' : undefined}
   tabindex={isInteractive ? 0 : undefined}
   aria-label={isInteractive ? alt || name || bt('accessibility.avatar') : undefined}
@@ -180,24 +169,31 @@
   onkeydown={handleKeydown}
   {...restProps}
 >
-  {#if src && !imageError}
-    <img
-      {src}
-      alt={alt || name || bt('accessibility.avatar')}
-      class={unstyled ? (slotClasses?.image ?? '') : styles.image({ class: slotClasses?.image })}
-      onerror={handleImageError}
-    />
-  {:else if children}
-    {@render children()}
-  {:else}
-    <span
-      class={unstyled
-        ? (slotClasses?.fallback ?? '')
-        : styles.fallback({ class: slotClasses?.fallback })}
-    >
-      {getInitials(name)}
-    </span>
-  {/if}
+  <!-- `frame` clips the image/initials to the avatar shape; the status dot
+       below is a sibling so it renders outside the clip and stays whole. -->
+  <div
+    class={unstyled ? (slotClasses?.frame ?? '') : styles.frame({ class: slotClasses?.frame })}
+    style={frameStyle}
+  >
+    {#if src && !imageError}
+      <img
+        {src}
+        alt={alt || name || bt('accessibility.avatar')}
+        class={unstyled ? (slotClasses?.image ?? '') : styles.image({ class: slotClasses?.image })}
+        onerror={handleImageError}
+      />
+    {:else if children}
+      {@render children()}
+    {:else}
+      <span
+        class={unstyled
+          ? (slotClasses?.fallback ?? '')
+          : styles.fallback({ class: slotClasses?.fallback })}
+      >
+        {getInitials(name)}
+      </span>
+    {/if}
+  </div>
 
   {#if status}
     <span
@@ -229,14 +225,44 @@
     }
   }
 
+  /* AVT-3: opt-in "live" pulse on the status dot. A radar ring radiates via an
+     animated box-shadow — no extra DOM — coloured to match the status through
+     the per-status `--blocks-avatar-pulse-color` set in avatar.variants.ts.
+     The dot now sits outside the frame's overflow-hidden clip, so the ring is
+     never cut off. */
+  :global(.blocks-avatar-status-pulse) {
+    animation: avatar-status-pulse 1.6s var(--blocks-ease-confident) infinite;
+  }
+
+  /* The ring must reach its brightest while it is already clear of the dot —
+     a shadow at spread 0 hides behind the opaque dot, so a plain from/to fade
+     only ever shows the faint, expanded tail. The mid stop lights it up at a
+     visible radius; it then keeps growing and fades to nothing. */
+  @keyframes avatar-status-pulse {
+    0% {
+      box-shadow: 0 0 0 0 color-mix(in oklab, var(--blocks-avatar-pulse-color) 0%, transparent);
+    }
+    35% {
+      box-shadow: 0 0 0 0.22rem
+        color-mix(in oklab, var(--blocks-avatar-pulse-color) 60%, transparent);
+    }
+    100% {
+      box-shadow: 0 0 0 0.6rem color-mix(in oklab, var(--blocks-avatar-pulse-color) 0%, transparent);
+    }
+  }
+
   @media (prefers-reduced-motion: reduce) {
-    :global(.blocks-mint-pulse) {
+    :global(.blocks-mint-pulse),
+    :global(.blocks-avatar-status-pulse) {
       animation: none;
     }
   }
 
-  @media (prefers-contrast: high) {
-    :global([class*='blocks-avatar']) {
+  /* High-contrast delineation for the avatar disc. Targets the stable
+     `blocks-avatar` root marker exactly — not `[class*='blocks-avatar']`, which
+     would also catch the `blocks-avatar-status-pulse` dot and ring it. */
+  @media (prefers-contrast: more) {
+    :global(.blocks-avatar) {
       outline: 2px solid currentColor;
       outline-offset: -2px;
     }

package/dist/primitives/Avatar/avatar.variants.d.ts

@@ -29,35 +29,38 @@ export declare const avatarVariants: (props?: import("../../utils/variants.js").
     variant: {
         circle: {
             base: string;
+            frame: string;
             image: string;
         };
         rounded: {
             base: string;
+            frame: string;
             image: string;
         };
         square: {
             base: string;
+            frame: string;
             image: string;
         };
     };
     intent: {
         primary: {
-            base: string;
+            frame: string;
         };
         secondary: {
-            base: string;
+            frame: string;
         };
         success: {
-            base: string;
+            frame: string;
         };
         warning: {
-            base: string;
+            frame: string;
         };
         danger: {
-            base: string;
+            frame: string;
         };
         neutral: {
-            base: string;
+            frame: string;
         };
     };
     status: {
@@ -88,6 +91,11 @@ export declare const avatarVariants: (props?: import("../../utils/variants.js").
             status: string;
         };
     };
+    pulse: {
+        true: {
+            status: string;
+        };
+    };
     ring: {
         true: {
             base: string;
@@ -125,6 +133,21 @@ export declare const avatarVariants: (props?: import("../../utils/variants.js").
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
         status?: "offline" | "online" | "away" | "busy" | undefined;
         statusPosition?: "bottom-right" | "top-right" | "bottom-left" | "top-left" | undefined;
+        pulse?: boolean | undefined;
+        ring?: boolean | undefined;
+        ringIntent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
+        interactive?: boolean | undefined;
+    } & {
+        class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+        className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+    }) | undefined) => string;
+    frame: (props?: ({
+        size?: "sm" | "md" | "lg" | "xl" | "xs" | "2xl" | undefined;
+        variant?: "rounded" | "circle" | "square" | undefined;
+        intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
+        status?: "offline" | "online" | "away" | "busy" | undefined;
+        statusPosition?: "bottom-right" | "top-right" | "bottom-left" | "top-left" | undefined;
+        pulse?: boolean | undefined;
         ring?: boolean | undefined;
         ringIntent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
         interactive?: boolean | undefined;
@@ -138,6 +161,7 @@ export declare const avatarVariants: (props?: import("../../utils/variants.js").
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
         status?: "offline" | "online" | "away" | "busy" | undefined;
         statusPosition?: "bottom-right" | "top-right" | "bottom-left" | "top-left" | undefined;
+        pulse?: boolean | undefined;
         ring?: boolean | undefined;
         ringIntent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
         interactive?: boolean | undefined;
@@ -151,6 +175,7 @@ export declare const avatarVariants: (props?: import("../../utils/variants.js").
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
         status?: "offline" | "online" | "away" | "busy" | undefined;
         statusPosition?: "bottom-right" | "top-right" | "bottom-left" | "top-left" | undefined;
+        pulse?: boolean | undefined;
         ring?: boolean | undefined;
         ringIntent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
         interactive?: boolean | undefined;
@@ -164,6 +189,7 @@ export declare const avatarVariants: (props?: import("../../utils/variants.js").
         intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
         status?: "offline" | "online" | "away" | "busy" | undefined;
         statusPosition?: "bottom-right" | "top-right" | "bottom-left" | "top-left" | undefined;
+        pulse?: boolean | undefined;
         ring?: boolean | undefined;
         ringIntent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
         interactive?: boolean | undefined;

package/dist/primitives/Avatar/avatar.variants.js

@@ -1,10 +1,19 @@
 import { tv } from '../../utils/variants.js';
 export const avatarVariants = tv({
     slots: {
+        // Outer positioning context. Carries sizing, the ring, interactive/mint
+        // effects — but NOT `overflow-hidden`, so the status dot (a sibling of
+        // `frame`) is never clipped (AVT-1). The radius is mirrored here purely so
+        // the ring follows the avatar's shape.
         base: [
-            'relative inline-flex items-center justify-center',
-            'overflow-hidden font-semibold text-center select-none shrink-0',
-            'transition-[color,background-color,border-color,box-shadow,opacity] duration-[var(--blocks-duration-fast)] ease-out',
+            'relative inline-flex shrink-0',
+            'transition-[color,background-color,border-color,box-shadow,opacity] duration-[var(--blocks-duration-fast)] ease-out'
+        ],
+        // The visible disc. This is the element that clips the image/initials to
+        // the avatar shape; the status dot lives outside it so it stays whole.
+        frame: [
+            'flex items-center justify-center w-full h-full overflow-hidden',
+            'font-semibold text-center select-none',
             'bg-surface-interactive text-text-secondary'
         ],
         image: ['w-full h-full object-cover'],
@@ -42,61 +51,68 @@ export const avatarVariants = tv({
         // people and stand apart from the commit/modify/contain semantic system —
         // a brand that flattens commit-tier surfaces (e.g. squared pill-buttons)
         // should not also lose circular avatars. The radii below are physical
-        // shape tokens, not tier tokens.
+        // shape tokens, not tier tokens. `frame` clips the content to the shape;
+        // `base` mirrors it so the ring tracks the same silhouette.
         variant: {
             circle: {
                 base: 'rounded-full',
+                frame: 'rounded-full',
                 image: 'rounded-full'
             },
             rounded: {
                 // Avatar-specific soft-square. Maps to --radius-xl (foundation scale);
                 // brands tune via the foundation token, not via a tier override.
                 base: 'rounded-xl',
+                frame: 'rounded-xl',
                 image: 'rounded-xl'
             },
             square: {
                 base: 'rounded-none',
+                frame: 'rounded-none',
                 image: 'rounded-none'
             }
         },
         intent: {
             primary: {
-                base: 'bg-primary-subtle text-primary-emphasis'
+                frame: 'bg-primary-subtle text-primary-emphasis'
             },
             secondary: {
-                base: 'bg-secondary-subtle text-secondary-emphasis'
+                frame: 'bg-secondary-subtle text-secondary-emphasis'
             },
             success: {
-                base: 'bg-success-subtle text-success-emphasis'
+                frame: 'bg-success-subtle text-success-emphasis'
             },
             warning: {
-                base: 'bg-warning-subtle text-warning-emphasis'
+                frame: 'bg-warning-subtle text-warning-emphasis'
             },
             danger: {
-                base: 'bg-danger-subtle text-danger-emphasis'
+                frame: 'bg-danger-subtle text-danger-emphasis'
             },
             neutral: {
-                base: 'bg-surface-interactive text-text-secondary'
+                frame: 'bg-surface-interactive text-text-secondary'
             }
         },
+        // Each status also publishes its colour as `--blocks-avatar-pulse-color`
+        // so the opt-in `pulse` ring (see Avatar.svelte) radiates in the matching
+        // hue without a second colour source.
         status: {
             online: {
-                status: 'bg-success'
+                status: 'bg-success [--blocks-avatar-pulse-color:var(--color-success)]'
             },
             offline: {
-                status: 'bg-text-quaternary'
+                status: 'bg-text-quaternary [--blocks-avatar-pulse-color:var(--color-text-quaternary)]'
             },
             away: {
-                status: 'bg-warning'
+                status: 'bg-warning [--blocks-avatar-pulse-color:var(--color-warning)]'
             },
             busy: {
-                status: 'bg-danger'
+                status: 'bg-danger [--blocks-avatar-pulse-color:var(--color-danger)]'
             }
         },
-        // Status dot is translated out of the avatar's overflow-hidden edge so it
-        // remains fully visible on circular avatars (AVT-1). Translation magnitude
-        // is intentionally fractional — the dot sits half-overlapping the edge,
-        // which matches the conventional badge look (Slack, Discord, Linear).
+        // Status dot is translated out of the avatar's edge so it half-overlaps the
+        // corner (AVT-1). Translation magnitude is intentionally fractional — the
+        // dot sits half-overlapping the edge, which matches the conventional badge
+        // look (Slack, Discord, Linear).
         statusPosition: {
             'bottom-right': {
                 status: 'bottom-0 right-0 translate-x-1/4 translate-y-1/4'
@@ -111,6 +127,14 @@ export const avatarVariants = tv({
                 status: 'top-0 left-0 -translate-x-1/4 -translate-y-1/4'
             }
         },
+        // Opt-in "live" pulse on the status dot — a radar ring that draws the eye to
+        // presence changes. Only has a visible effect together with `status`; the
+        // animation itself + reduced-motion handling live in Avatar.svelte.
+        pulse: {
+            true: {
+                status: 'blocks-avatar-status-pulse'
+            }
+        },
         ring: {
             true: {
                 base: 'ring-2 ring-offset-2 ring-offset-surface-base'
@@ -184,6 +208,7 @@ export const avatarVariants = tv({
         variant: 'circle',
         intent: 'neutral',
         statusPosition: 'bottom-right',
+        pulse: false,
         ring: false,
         ringIntent: 'primary',
         interactive: false

package/dist/primitives/Avatar/index.d.ts

@@ -17,6 +17,11 @@ import type { AvatarSlots, AvatarVariants } from './avatar.variants.js';
  * ```svelte
  * <Avatar name="Jane Smith" randomColor clickable onclick={() => showProfile()} />
  * ```
+ *
+ * @example
+ * ```svelte
+ * <Avatar name="Ada Lovelace" status="online" pulse />
+ * ```
  */
 export interface AvatarProps extends AvatarVariants, Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
     /** Image URL. Falls back to initials or `children` when empty or on load error. */
@@ -43,7 +48,7 @@ export interface AvatarProps extends AvatarVariants, Omit<HTMLAttributes<HTMLDiv
     class?: string;
     /** Remove all default tv classes. */
     unstyled?: boolean;
-    /** Per-slot class overrides merged with tv styles. Slots: base | image | fallback | status */
+    /** Per-slot class overrides merged with tv styles. Slots: base | frame | image | fallback | status */
     slotClasses?: Partial<Record<AvatarSlots, string>>;
     /**
      * Apply a named preset registered via `<BlocksProvider presets={{ Avatar: {...} }}>`.

package/dist/primitives/Collapsible/Collapsible.svelte

@@ -28,6 +28,9 @@
   const blocksConfig = getBlocksConfig();
   const unstyled = $derived(unstyledProp || blocksConfig?.unstyled || false);
 
+  // Uncontrolled seed: capture only the initial `defaultOpen`; later changes
+  // must not clobber user interaction.
+  // svelte-ignore state_referenced_locally
   let internalOpen = $state(defaultOpen ?? false);
   const isOpen = $derived(open !== undefined ? open : internalOpen);
 

package/dist/primitives/ConfirmDialog/index.d.ts

@@ -74,6 +74,18 @@ export interface ConfirmDialogProps {
     closeOnBackdropClick?: boolean;
     /** Whether Escape cancels. @default true */
     closeOnEscape?: boolean;
+    /**
+     * Override the enter/exit animation duration in milliseconds, forwarded to
+     * the underlying {@link Dialog}. Defaults to the overlay token
+     * `--blocks-overlay-enter-duration` / `--blocks-overlay-exit-duration`
+     * (200ms / 180ms). Respects `prefers-reduced-motion`.
+     */
+    transitionDuration?: number;
+    /**
+     * Override the enter/exit easing function, forwarded to the underlying
+     * {@link Dialog}. Defaults to the overlay token easing (`quintOut`).
+     */
+    transitionEasing?: (t: number) => number;
     /** Optional richer markup rendered below `description`. */
     children?: Snippet;
 }

package/dist/primitives/Dialog/Dialog.svelte

@@ -41,6 +41,8 @@
     ...restProps
   }: DialogProps = $props();
 
+  // One-shot DEV sanity check on the initial close-path configuration.
+  // svelte-ignore state_referenced_locally
   if (
     import.meta.env?.DEV &&
     hideCloseButton &&

package/dist/primitives/Drawer/Drawer.svelte

@@ -41,6 +41,8 @@
     ...restProps
   }: DrawerProps = $props();
 
+  // One-shot DEV sanity check on the initial close-path configuration.
+  // svelte-ignore state_referenced_locally
   if (
     import.meta.env?.DEV &&
     hideCloseButton &&
@@ -61,7 +63,7 @@
   let previouslyFocused: HTMLElement | null = null;
 
   const uid = $props.id();
-  const titleId = title ? `drawer-title-${uid}` : undefined;
+  const titleId = $derived(title ? `drawer-title-${uid}` : undefined);
   const bodyId = `drawer-body-${uid}`;
   const overlayId = `drawer-${uid}`;
 

package/dist/primitives/Menu/MenuSubmenu.svelte

@@ -43,6 +43,7 @@
 
   // Provide parent id to descendants exactly once per component instance
   // so that nested MenuItem components can register with correct parent.
+  // svelte-ignore state_referenced_locally
   setMenuParentId(id);
 
   function toggleOpen() {

package/dist/primitives/Select/Select.svelte

@@ -63,7 +63,7 @@
   // `<Select bind:value={x: T | null}>` narrow correctly. Internally we
   // dispatch through a loose alias so the component code can hand either
   // shape into `onValueChange` without per-branch casts at every call site.
-  const dispatchValueChange = onValueChange as ((v: any) => void) | undefined;
+  const dispatchValueChange = $derived(onValueChange as ((v: any) => void) | undefined);
 
   /** Resolved null option config — `null` when prop is unset or `groups` is in use. */
   const nullOptionConfig = $derived.by(() => {

package/dist/primitives/Tab/Tab.svelte

@@ -38,6 +38,9 @@
   let tabListElement = $state<HTMLDivElement>();
   let indicatorStyle = $state('');
 
+  // Uncontrolled seed: capture only the initial `defaultValue`; later changes
+  // must not clobber user interaction.
+  // svelte-ignore state_referenced_locally
   let internalValue = $state(defaultValue || '');
 
   const activeValue = $derived(value !== undefined ? value : internalValue);

package/dist/style/interaction.css

@@ -157,7 +157,7 @@
 }
 
 /* ===== HIGH CONTRAST MODE ===== */
-@media (prefers-contrast: high) {
+@media (prefers-contrast: more) {
   :root {
     /* Increase contrast ratios — overrides the semantic tokens that
        components actually consume. */

package/dist/system/attachments/ContextIsolation.svelte

@@ -27,6 +27,8 @@
     buttonGroup: () => setButtonGroupContext(undefined)
   };
 
+  // Isolation is applied once at init — the prop is not meant to change reactively.
+  // svelte-ignore state_referenced_locally
   for (const key of isolate) {
     ISOLATIONS[key]?.();
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@urbicon-ui/blocks",
-  "version": "6.19.3",
+  "version": "6.21.0",
   "description": "Svelte 5 UI component library with Tailwind CSS 4, OKLCH design tokens and zero runtime dependencies",
   "license": "MIT",
   "repository": {
@@ -91,8 +91,8 @@
     "@sveltejs/package": "^2.5.8",
     "@sveltejs/vite-plugin-svelte": "^7.0.0",
     "@tailwindcss/vite": "^4.3.1",
-    "@urbicon-ui/i18n": "6.19.3",
-    "@urbicon-ui/shared-types": "6.19.3",
+    "@urbicon-ui/i18n": "6.21.0",
+    "@urbicon-ui/shared-types": "6.21.0",
     "prettier": "^3.8.4",
     "prettier-plugin-svelte": "^4.1.1",
     "prettier-plugin-tailwindcss": "^0.8.0",