@shepai/cli 1.156.0 → 1.157.0-pr496.7e3ce96

package/dist/src/presentation/web/components/ui/sidebar.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { cva } from 'class-variance-authority';
 import { PanelLeftIcon } from 'lucide-react';
-import { Slot } from 'radix-ui';
+import { Direction, Slot } from 'radix-ui';
 import { useIsMobile } from '../../hooks/use-mobile.js';
 import { cn } from '../../lib/utils.js';
 import { Button } from '../ui/button.js';
@@ -112,15 +112,13 @@ function Sidebar({ side = 'left', variant = 'sidebar', collapsible = 'offcanvas'
                     '--sidebar-width': SIDEBAR_WIDTH_MOBILE,
                 }, side: side, children: [_jsxs(SheetHeader, { className: "sr-only", children: [_jsx(SheetTitle, { children: "Sidebar" }), _jsx(SheetDescription, { children: "Displays the mobile sidebar." })] }), _jsx("div", { className: "flex h-full w-full flex-col", children: children })] }) }));
     }
-    return (_jsxs("div", { className: "group peer text-sidebar-foreground hidden md:block", "data-state": state, "data-collapsible": state === 'collapsed' ? collapsible : '', "data-variant": variant, "data-side": side, "data-slot": "sidebar", children: [_jsx("div", { "data-slot": "sidebar-gap", className: cn('relative w-(--sidebar-width) bg-transparent', animated && 'transition-[width] duration-200 ease-linear', 'group-data-[collapsible=offcanvas]:w-0', 'group-data-[side=right]:rotate-180', variant === 'floating' || variant === 'inset'
+    return (_jsxs("div", { className: "group peer text-sidebar-foreground hidden md:block", "data-state": state, "data-collapsible": state === 'collapsed' ? collapsible : '', "data-variant": variant, "data-side": side, "data-slot": "sidebar", children: [_jsx("div", { "data-slot": "sidebar-gap", className: cn('relative w-(--sidebar-width) bg-transparent', animated && 'transition-[width] duration-200 ease-linear', 'group-data-[collapsible=offcanvas]:w-0', variant === 'floating' || variant === 'inset'
                     ? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]'
-                    : 'group-data-[collapsible=icon]:w-(--sidebar-width-icon)') }), _jsx("div", { "data-slot": "sidebar-container", className: cn('fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) md:flex', animated && 'transition-[left,right,width] duration-200 ease-linear', side === 'left'
-                    ? 'left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]'
-                    : 'right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]', 
+                    : 'group-data-[collapsible=icon]:w-(--sidebar-width-icon)') }), _jsx("div", { "data-slot": "sidebar-container", className: cn('fixed inset-y-0 start-0 z-10 hidden h-svh w-(--sidebar-width) md:flex', animated && 'transition-[inset-inline-start,width] duration-200 ease-linear', 'group-data-[collapsible=offcanvas]:start-[calc(var(--sidebar-width)*-1)]', 
                 // Adjust the padding for floating and inset variants.
                 variant === 'floating' || variant === 'inset'
                     ? 'p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]'
-                    : 'group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l', className), ...props, children: _jsx("div", { "data-sidebar": "sidebar", "data-slot": "sidebar-inner", className: "bg-sidebar group-data-[variant=floating]:border-sidebar-border flex h-full w-full flex-col group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:shadow-sm", children: children }) })] }));
+                    : 'border-e group-data-[collapsible=icon]:w-(--sidebar-width-icon)', className), ...props, children: _jsx("div", { "data-sidebar": "sidebar", "data-slot": "sidebar-inner", className: "bg-sidebar group-data-[variant=floating]:border-sidebar-border flex h-full w-full flex-col group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:shadow-sm", children: children }) })] }));
 }
 function SidebarTrigger({ className, onClick, ...props }) {
     const { toggleSidebar } = useSidebar();
@@ -131,10 +129,10 @@ function SidebarTrigger({ className, onClick, ...props }) {
 }
 function SidebarRail({ className, ...props }) {
     const { toggleSidebar } = useSidebar();
-    return (_jsx("button", { "data-sidebar": "rail", "data-slot": "sidebar-rail", "aria-label": "Toggle Sidebar", tabIndex: -1, onClick: toggleSidebar, title: "Toggle Sidebar", className: cn('hover:after:bg-sidebar-border absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] sm:flex', 'in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize', '[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize', 'hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full', '[[data-side=left][data-collapsible=offcanvas]_&]:-right-2', '[[data-side=right][data-collapsible=offcanvas]_&]:-left-2', className), ...props }));
+    return (_jsx("button", { "data-sidebar": "rail", "data-slot": "sidebar-rail", "aria-label": "Toggle Sidebar", tabIndex: -1, onClick: toggleSidebar, title: "Toggle Sidebar", className: cn('hover:after:bg-sidebar-border absolute inset-y-0 -end-4 z-20 hidden w-4 transition-all ease-linear after:absolute after:inset-y-0 after:start-1/2 after:w-0.5 sm:flex', 'cursor-w-resize rtl:cursor-e-resize', 'in-data-[state=collapsed]:cursor-e-resize rtl:in-data-[state=collapsed]:cursor-w-resize', 'hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:start-full', 'in-data-[collapsible=offcanvas]:-end-2', className), ...props }));
 }
 function SidebarInset({ className, ...props }) {
-    return (_jsx("main", { "data-slot": "sidebar-inset", className: cn('bg-background relative flex w-full flex-1 flex-col', 'md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2', className), ...props }));
+    return (_jsx("main", { "data-slot": "sidebar-inset", className: cn('bg-background relative flex w-full flex-1 flex-col', 'md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ms-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ms-2', className), ...props }));
 }
 function SidebarInput({ className, ...props }) {
     return (_jsx(Input, { "data-slot": "sidebar-input", "data-sidebar": "input", className: cn('bg-background h-8 w-full shadow-none', className), ...props }));
@@ -160,7 +158,7 @@ function SidebarGroupLabel({ className, asChild = false, ...props }) {
 }
 function SidebarGroupAction({ className, asChild = false, ...props }) {
     const Comp = asChild ? Slot.Root : 'button';
-    return (_jsx(Comp, { "data-slot": "sidebar-group-action", "data-sidebar": "group-action", className: cn('text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0', 
+    return (_jsx(Comp, { "data-slot": "sidebar-group-action", "data-sidebar": "group-action", className: cn('text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute end-3 top-3.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0', 
         // Increases the hit area of the button on mobile.
         'after:absolute after:-inset-2 md:after:hidden', 'group-data-[collapsible=icon]:hidden', className), ...props }));
 }
@@ -173,7 +171,7 @@ function SidebarMenu({ className, ...props }) {
 function SidebarMenuItem({ className, ...props }) {
     return (_jsx("li", { "data-slot": "sidebar-menu-item", "data-sidebar": "menu-item", className: cn('group/menu-item relative', className), ...props }));
 }
-const sidebarMenuButtonVariants = cva('peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pr-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0', {
+const sidebarMenuButtonVariants = cva('peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-start text-sm ring-sidebar-ring outline-hidden transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pe-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0', {
     variants: {
         variant: {
             default: 'hover:bg-sidebar-accent hover:text-sidebar-accent-foreground',
@@ -193,6 +191,8 @@ const sidebarMenuButtonVariants = cva('peer/menu-button flex w-full items-center
 function SidebarMenuButton({ asChild = false, isActive = false, variant = 'default', size = 'default', tooltip, className, ...props }) {
     const Comp = asChild ? Slot.Root : 'button';
     const { isMobile, state } = useSidebar();
+    const dir = Direction.useDirection();
+    const tooltipSide = dir === 'rtl' ? 'left' : 'right';
     const button = (_jsx(Comp, { "data-slot": "sidebar-menu-button", "data-sidebar": "menu-button", "data-size": size, "data-active": isActive, className: cn(sidebarMenuButtonVariants({ variant, size }), className), ...props }));
     if (!tooltip) {
         return button;
@@ -202,17 +202,17 @@ function SidebarMenuButton({ asChild = false, isActive = false, variant = 'defau
             children: tooltip,
         };
     }
-    return (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: button }), _jsx(TooltipContent, { side: "right", align: "center", hidden: state !== 'collapsed' || isMobile, ...tooltip })] }));
+    return (_jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: button }), _jsx(TooltipContent, { side: tooltipSide, align: "center", hidden: state !== 'collapsed' || isMobile, ...tooltip })] }));
 }
 function SidebarMenuAction({ className, asChild = false, showOnHover = false, ...props }) {
     const Comp = asChild ? Slot.Root : 'button';
-    return (_jsx(Comp, { "data-slot": "sidebar-menu-action", "data-sidebar": "menu-action", className: cn('text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0', 
+    return (_jsx(Comp, { "data-slot": "sidebar-menu-action", "data-sidebar": "menu-action", className: cn('text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute end-1 top-1.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0', 
         // Increases the hit area of the button on mobile.
         'after:absolute after:-inset-2 md:after:hidden', 'peer-data-[size=sm]/menu-button:top-1', 'peer-data-[size=default]/menu-button:top-1.5', 'peer-data-[size=lg]/menu-button:top-2.5', 'group-data-[collapsible=icon]:hidden', showOnHover &&
             'peer-data-[active=true]/menu-button:text-sidebar-accent-foreground group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 md:opacity-0', className), ...props }));
 }
 function SidebarMenuBadge({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "sidebar-menu-badge", "data-sidebar": "menu-badge", className: cn('text-sidebar-foreground pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums select-none', 'peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground', 'peer-data-[size=sm]/menu-button:top-1', 'peer-data-[size=default]/menu-button:top-1.5', 'peer-data-[size=lg]/menu-button:top-2.5', 'group-data-[collapsible=icon]:hidden', className), ...props }));
+    return (_jsx("div", { "data-slot": "sidebar-menu-badge", "data-sidebar": "menu-badge", className: cn('text-sidebar-foreground pointer-events-none absolute end-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums select-none', 'peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground', 'peer-data-[size=sm]/menu-button:top-1', 'peer-data-[size=default]/menu-button:top-1.5', 'peer-data-[size=lg]/menu-button:top-2.5', 'group-data-[collapsible=icon]:hidden', className), ...props }));
 }
 function SidebarMenuSkeleton({ className, showIcon = false, ...props }) {
     // Random width between 50 to 90%.
@@ -224,13 +224,13 @@ function SidebarMenuSkeleton({ className, showIcon = false, ...props }) {
                 } })] }));
 }
 function SidebarMenuSub({ className, ...props }) {
-    return (_jsx("ul", { "data-slot": "sidebar-menu-sub", "data-sidebar": "menu-sub", className: cn('border-sidebar-border mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l px-2.5 py-0.5', 'group-data-[collapsible=icon]:hidden', className), ...props }));
+    return (_jsx("ul", { "data-slot": "sidebar-menu-sub", "data-sidebar": "menu-sub", className: cn('border-sidebar-border mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-s px-2.5 py-0.5 rtl:-translate-x-px', 'group-data-[collapsible=icon]:hidden', className), ...props }));
 }
 function SidebarMenuSubItem({ className, ...props }) {
     return (_jsx("li", { "data-slot": "sidebar-menu-sub-item", "data-sidebar": "menu-sub-item", className: cn('group/menu-sub-item relative', className), ...props }));
 }
 function SidebarMenuSubButton({ asChild = false, size = 'md', isActive = false, className, ...props }) {
     const Comp = asChild ? Slot.Root : 'a';
-    return (_jsx(Comp, { "data-slot": "sidebar-menu-sub-button", "data-sidebar": "menu-sub-button", "data-size": size, "data-active": isActive, className: cn('text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0', 'data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground', size === 'sm' && 'text-xs', size === 'md' && 'text-sm', 'group-data-[collapsible=icon]:hidden', className), ...props }));
+    return (_jsx(Comp, { "data-slot": "sidebar-menu-sub-button", "data-sidebar": "menu-sub-button", "data-size": size, "data-active": isActive, className: cn('text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 rtl:translate-x-px [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0', 'data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground', size === 'sm' && 'text-xs', size === 'md' && 'text-sm', 'group-data-[collapsible=icon]:hidden', className), ...props }));
 }
 export { SIDEBAR_STORAGE_KEY, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar, };

package/dist/src/presentation/web/components/ui/switch.js

@@ -3,6 +3,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Switch as SwitchPrimitive } from 'radix-ui';
 import { cn } from '../../lib/utils.js';
 function Switch({ className, size = 'default', ...props }) {
-    return (_jsx(SwitchPrimitive.Root, { "data-slot": "switch", "data-size": size, className: cn('peer group/switch focus-visible:border-ring focus-visible:ring-ring/50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input dark:data-[state=unchecked]:bg-input/80 inline-flex shrink-0 cursor-pointer items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-[1.15rem] data-[size=default]:w-8 data-[size=sm]:h-3.5 data-[size=sm]:w-6', className), ...props, children: _jsx(SwitchPrimitive.Thumb, { "data-slot": "switch-thumb", className: cn('bg-background dark:data-[state=checked]:bg-primary-foreground dark:data-[state=unchecked]:bg-foreground pointer-events-none block rounded-full ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0') }) }));
+    return (_jsx(SwitchPrimitive.Root, { "data-slot": "switch", "data-size": size, className: cn('peer group/switch focus-visible:border-ring focus-visible:ring-ring/50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input dark:data-[state=unchecked]:bg-input/80 inline-flex shrink-0 cursor-pointer items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-[1.15rem] data-[size=default]:w-8 data-[size=sm]:h-3.5 data-[size=sm]:w-6', className), ...props, children: _jsx(SwitchPrimitive.Thumb, { "data-slot": "switch-thumb", className: cn('bg-background dark:data-[state=checked]:bg-primary-foreground dark:data-[state=unchecked]:bg-foreground pointer-events-none block rounded-full ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0 rtl:data-[state=checked]:-translate-x-[calc(100%-2px)]') }) }));
 }
 export { Switch };

package/dist/src/presentation/web/dev-server.js

@@ -20,6 +20,7 @@ import { initializeSettings } from '../../../packages/core/src/infrastructure/se
 import { initializeNotificationWatcher, getNotificationWatcher, } from '../../../packages/core/src/infrastructure/services/notifications/notification-watcher.service.js';
 import { initializePrSyncWatcher, getPrSyncWatcher, } from '../../../packages/core/src/infrastructure/services/pr-sync/pr-sync-watcher.service.js';
 import { getExistingConnection } from '../../../packages/core/src/infrastructure/persistence/sqlite/connection.js';
+import { initializeAutoArchiveWatcher, getAutoArchiveWatcher, } from '../../../packages/core/src/infrastructure/services/auto-archive/auto-archive-watcher.service.js';
 const DEFAULT_PORT = 3000;
 async function isPortAvailable(port) {
     return new Promise((resolve) => {
@@ -69,6 +70,9 @@ async function main() {
         const db = getExistingConnection();
         initializePrSyncWatcher(featureRepo, runRepo, gitPrService, notificationService, undefined, db, gitForkService);
         getPrSyncWatcher().start();
+        // Start auto-archive watcher for completed features
+        initializeAutoArchiveWatcher(featureRepo);
+        getAutoArchiveWatcher().start();
     }
     catch (error) {
         console.warn('[dev-server] DI initialization failed — features will be empty:', error);
@@ -127,6 +131,12 @@ async function main() {
             catch {
                 /* not initialized */
             }
+            try {
+                getAutoArchiveWatcher().stop();
+            }
+            catch {
+                /* not initialized */
+            }
             server.closeAllConnections();
             await Promise.all([
                 new Promise((resolve) => server.close(() => resolve())),

package/dist/src/presentation/web/hooks/use-graph-state.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-graph-state.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/hooks/use-graph-state.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,IAAI,EAAY,MAAM,eAAe,CAAC;AACpD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AACxE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAC9E,OAAO,EAEL,KAAK,YAAY,EAEjB,KAAK,cAAc,EACpB,MAAM,oBAAoB,CAAC;AAG5B,YAAY,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEzD,MAAM,WAAW,mBAAmB;IAClC,mDAAmD;IACnD,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,mDAAmD;IACnD,KAAK,EAAE,IAAI,EAAE,CAAC;IACd;;;;OAIG;IACH,SAAS,EAAE,CAAC,QAAQ,EAAE,cAAc,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IAClE,uEAAuE;IACvE,aAAa,EAAE,CAAC,aAAa,EAAE,MAAM,EAAE,OAAO,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC5E,kEAAkE;IAClE,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1F,yDAAyD;IACzD,oBAAoB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,sDAAsD;IACtD,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,uDAAuD;IACvD,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAC9D,2DAA2D;IAC3D,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAClE,gCAAgC;IAChC,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,yDAAyD;IACzD,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IACtF,gEAAgE;IAChE,wBAAwB,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IACxE,yDAAyD;IACzD,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,kBAAkB,GAAG,SAAS,CAAC;IACtE,+EAA+E;IAC/E,cAAc,EAAE,MAAM,MAAM,CAAC;IAC7B,6EAA6E;IAC7E,YAAY,EAAE,CAAC,SAAS,EAAE,cAAc,KAAK,IAAI,CAAC;IAClD;;;;OAIG;IACH,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B;;;OAGG;IACH,WAAW,EAAE,CAAC,UAAU,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,0EAA0E;IAC1E,UAAU,EAAE,MAAM,OAAO,CAAC;CAC3B;AAuCD,KAAK,kBAAkB,GAAG,OAAO,CAC/B,IAAI,CAAC,eAAe,EAAE,OAAO,GAAG,WAAW,GAAG,MAAM,GAAG,aAAa,CAAC,CACtE,CAAC;AA8BF,wBAAgB,aAAa,CAC3B,YAAY,EAAE,cAAc,EAAE,EAC9B,YAAY,EAAE,IAAI,EAAE,EACpB,YAAY,UAAQ,GACnB,mBAAmB,CA8arB"}
+{"version":3,"file":"use-graph-state.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/hooks/use-graph-state.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,IAAI,EAAY,MAAM,eAAe,CAAC;AACpD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAC;AACxE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AAC9E,OAAO,EAEL,KAAK,YAAY,EAEjB,KAAK,cAAc,EACpB,MAAM,oBAAoB,CAAC;AAG5B,YAAY,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEzD,MAAM,WAAW,mBAAmB;IAClC,mDAAmD;IACnD,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,mDAAmD;IACnD,KAAK,EAAE,IAAI,EAAE,CAAC;IACd;;;;OAIG;IACH,SAAS,EAAE,CAAC,QAAQ,EAAE,cAAc,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;IAClE,uEAAuE;IACvE,aAAa,EAAE,CAAC,aAAa,EAAE,MAAM,EAAE,OAAO,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC5E,kEAAkE;IAClE,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,eAAe,EAAE,YAAY,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1F,yDAAyD;IACzD,oBAAoB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,sDAAsD;IACtD,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,uDAAuD;IACvD,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAC9D,2DAA2D;IAC3D,aAAa,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAClE,gCAAgC;IAChC,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,yDAAyD;IACzD,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IACtF,gEAAgE;IAChE,wBAAwB,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IACxE,yDAAyD;IACzD,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,kBAAkB,GAAG,SAAS,CAAC;IACtE,+EAA+E;IAC/E,cAAc,EAAE,MAAM,MAAM,CAAC;IAC7B,6EAA6E;IAC7E,YAAY,EAAE,CAAC,SAAS,EAAE,cAAc,KAAK,IAAI,CAAC;IAClD;;;;OAIG;IACH,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B;;;OAGG;IACH,WAAW,EAAE,CAAC,UAAU,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,0EAA0E;IAC1E,UAAU,EAAE,MAAM,OAAO,CAAC;CAC3B;AAuCD,KAAK,kBAAkB,GAAG,OAAO,CAC/B,IAAI,CAAC,eAAe,EAAE,OAAO,GAAG,WAAW,GAAG,MAAM,GAAG,aAAa,CAAC,CACtE,CAAC;AA8BF,wBAAgB,aAAa,CAC3B,YAAY,EAAE,cAAc,EAAE,EAC9B,YAAY,EAAE,IAAI,EAAE,EACpB,YAAY,UAAQ,GACnB,mBAAmB,CAgbrB"}

package/dist/src/presentation/web/hooks/use-graph-state.js

@@ -1,7 +1,8 @@
 'use client';
 import { useState, useMemo, useCallback, useRef, useEffect } from 'react';
+import { useTranslation } from 'react-i18next';
 import { deriveGraph, } from '../lib/derive-graph.js';
-import { layoutWithDagre, CANVAS_LAYOUT_DEFAULTS } from '../lib/layout-with-dagre.js';
+import { layoutWithDagre, getCanvasLayoutDefaults } from '../lib/layout-with-dagre.js';
 /** Parse initialNodes + initialEdges into domain Maps. */
 function parseMaps(initialNodes, initialEdges) {
     // Build parentNodeId map from dependency edges
@@ -57,6 +58,8 @@ function mapsEqual(a, b) {
     return true;
 }
 export function useGraphState(initialNodes, initialEdges, showArchived = false) {
+    const { i18n } = useTranslation();
+    const layoutDefaults = useMemo(() => getCanvasLayoutDefaults(i18n.dir()), [i18n]);
     // eslint-disable-next-line react-hooks/exhaustive-deps -- intentional: parse only on mount (like useState initializer)
     const init = useMemo(() => parseMaps(initialNodes, initialEdges), []);
     const [featureMap, setFeatureMap] = useState(init.featureMap);
@@ -125,10 +128,10 @@ export function useGraphState(initialNodes, initialEdges, showArchived = false)
             .map((e) => `${e.source}-${e.target}`)
             .sort()
             .join(',');
-        const topologyKey = `${nodeIds}|${edgeKeys}`;
+        const topologyKey = `${nodeIds}|${edgeKeys}|${layoutDefaults.direction}`;
         if (topologyKey !== layoutCacheRef.current.key) {
             // Topology changed — re-run dagre
-            const result = layoutWithDagre(derived.nodes, derived.edges, CANVAS_LAYOUT_DEFAULTS);
+            const result = layoutWithDagre(derived.nodes, derived.edges, layoutDefaults);
             const positions = new Map();
             for (const node of result.nodes) {
                 positions.set(node.id, {
@@ -171,7 +174,7 @@ export function useGraphState(initialNodes, initialEdges, showArchived = false)
             return cached ? { ...node, ...cached } : node;
         });
         return { nodes, edges: derived.edges };
-    }, [derived]);
+    }, [derived, layoutDefaults]);
     // --- Mutations ---
     const reconcile = useCallback((newNodes, newEdges) => {
         // Skip reconciliation while an optimistic mutation is in-flight.

package/dist/src/presentation/web/hooks/use-sound-action.stories.js

@@ -39,7 +39,7 @@ function ActionSoundButton({ action }) {
         setPlaying(true);
         setTimeout(() => setPlaying(false), 600);
     };
-    return (_jsxs(Button, { size: "sm", variant: playing ? 'default' : 'outline', onClick: handleClick, className: "min-w-[160px] font-mono text-xs", children: [action, _jsxs("span", { className: "text-muted-foreground ml-1 text-[10px]", children: ["(", entry.sound, " @ ", entry.volume, ")"] })] }));
+    return (_jsxs(Button, { size: "sm", variant: playing ? 'default' : 'outline', onClick: handleClick, className: "min-w-[160px] font-mono text-xs", children: [action, _jsxs("span", { className: "text-muted-foreground ms-1 text-[10px]", children: ["(", entry.sound, " @ ", entry.volume, ")"] })] }));
 }
 /* ------------------------------------------------------------------ */
 /*  Full catalog                                                      */

package/dist/src/presentation/web/lib/i18n.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Web UI i18n configuration.
+ *
+ * Initializes i18next with react-i18next for the web presentation layer.
+ * Uses the common and web namespaces. All supported language translations
+ * are bundled inline so language switching works immediately.
+ */
+import { type i18n } from 'i18next';
+declare const FALLBACK_LANGUAGE = "en";
+declare const NAMESPACES: readonly ["common", "web"];
+/** Singleton web i18next instance. */
+declare const webI18n: i18n;
+export default webI18n;
+export { FALLBACK_LANGUAGE, NAMESPACES };
+//# sourceMappingURL=i18n.d.ts.map

package/dist/src/presentation/web/lib/i18n.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"i18n.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/lib/i18n.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAgB,EAAE,KAAK,IAAI,EAAE,MAAM,SAAS,CAAC;AAqB7C,QAAA,MAAM,iBAAiB,OAAO,CAAC;AAC/B,QAAA,MAAM,UAAU,4BAA6B,CAAC;AAqC9C,sCAAsC;AACtC,QAAA,MAAM,OAAO,EAAE,IAA2B,CAAC;AAE3C,eAAe,OAAO,CAAC;AACvB,OAAO,EAAE,iBAAiB,EAAE,UAAU,EAAE,CAAC"}

package/dist/src/presentation/web/lib/i18n.js

@@ -0,0 +1,64 @@
+/**
+ * Web UI i18n configuration.
+ *
+ * Initializes i18next with react-i18next for the web presentation layer.
+ * Uses the common and web namespaces. All supported language translations
+ * are bundled inline so language switching works immediately.
+ */
+import i18next from 'i18next';
+import { initReactI18next } from 'react-i18next';
+// Import all language translations inline
+import commonEn from '../../../../translations/en/common.json';
+import webEn from '../../../../translations/en/web.json';
+import commonRu from '../../../../translations/ru/common.json';
+import webRu from '../../../../translations/ru/web.json';
+import commonPt from '../../../../translations/pt/common.json';
+import webPt from '../../../../translations/pt/web.json';
+import commonEs from '../../../../translations/es/common.json';
+import webEs from '../../../../translations/es/web.json';
+import commonAr from '../../../../translations/ar/common.json';
+import webAr from '../../../../translations/ar/web.json';
+import commonHe from '../../../../translations/he/common.json';
+import webHe from '../../../../translations/he/web.json';
+import commonFr from '../../../../translations/fr/common.json';
+import webFr from '../../../../translations/fr/web.json';
+import commonDe from '../../../../translations/de/common.json';
+import webDe from '../../../../translations/de/web.json';
+const FALLBACK_LANGUAGE = 'en';
+const NAMESPACES = ['common', 'web'];
+/**
+ * Create and configure the web i18next instance.
+ *
+ * Returns a singleton instance — multiple calls return the same object.
+ * Use `changeLanguage()` on the returned instance to switch locales at runtime.
+ */
+function createI18nInstance() {
+    const instance = i18next.createInstance();
+    instance.use(initReactI18next).init({
+        lng: FALLBACK_LANGUAGE,
+        fallbackLng: FALLBACK_LANGUAGE,
+        defaultNS: 'common',
+        ns: [...NAMESPACES],
+        resources: {
+            en: { common: commonEn, web: webEn },
+            ru: { common: commonRu, web: webRu },
+            pt: { common: commonPt, web: webPt },
+            es: { common: commonEs, web: webEs },
+            ar: { common: commonAr, web: webAr },
+            he: { common: commonHe, web: webHe },
+            fr: { common: commonFr, web: webFr },
+            de: { common: commonDe, web: webDe },
+        },
+        interpolation: {
+            escapeValue: false, // React already escapes output
+        },
+        react: {
+            useSuspense: false, // Avoid suspense boundaries for i18n
+        },
+    });
+    return instance;
+}
+/** Singleton web i18next instance. */
+const webI18n = createI18nInstance();
+export default webI18n;
+export { FALLBACK_LANGUAGE, NAMESPACES };

package/dist/src/presentation/web/lib/language.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Server-side language preference utilities for the Web UI.
+ *
+ * Reads the language preference from the Settings singleton
+ * and determines the text direction (LTR/RTL).
+ */
+/**
+ * Check whether a language code requires right-to-left text direction.
+ */
+export declare function isRtlLanguage(language: string): boolean;
+interface LanguagePreference {
+    language: string;
+    dir: 'ltr' | 'rtl';
+}
+/**
+ * Get the user's language preference and computed text direction.
+ *
+ * Reads from the Settings singleton (better-sqlite3, synchronous).
+ * Falls back to English if settings are not available (e.g. during build).
+ */
+export declare function getLanguagePreference(): LanguagePreference;
+export {};
+//# sourceMappingURL=language.d.ts.map

package/dist/src/presentation/web/lib/language.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"language.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/lib/language.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAQH;;GAEG;AACH,wBAAgB,aAAa,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAEvD;AAED,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,MAAM,CAAC;IACjB,GAAG,EAAE,KAAK,GAAG,KAAK,CAAC;CACpB;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,IAAI,kBAAkB,CAe1D"}

package/dist/src/presentation/web/lib/language.js

@@ -0,0 +1,37 @@
+/**
+ * Server-side language preference utilities for the Web UI.
+ *
+ * Reads the language preference from the Settings singleton
+ * and determines the text direction (LTR/RTL).
+ */
+import { hasSettings, getSettings } from '../../../../packages/core/src/infrastructure/services/settings.service.js';
+import { Language } from '../../../../packages/core/src/domain/generated/output.js';
+const RTL_LANGUAGES = new Set([Language.Arabic, Language.Hebrew]);
+const DEFAULT_LANGUAGE = Language.English;
+/**
+ * Check whether a language code requires right-to-left text direction.
+ */
+export function isRtlLanguage(language) {
+    return RTL_LANGUAGES.has(language);
+}
+/**
+ * Get the user's language preference and computed text direction.
+ *
+ * Reads from the Settings singleton (better-sqlite3, synchronous).
+ * Falls back to English if settings are not available (e.g. during build).
+ */
+export function getLanguagePreference() {
+    let language = DEFAULT_LANGUAGE;
+    try {
+        if (hasSettings()) {
+            language = getSettings().user.preferredLanguage ?? DEFAULT_LANGUAGE;
+        }
+    }
+    catch {
+        // Settings not initialized (build, SSG, or first run)
+    }
+    return {
+        language,
+        dir: isRtlLanguage(language) ? 'rtl' : 'ltr',
+    };
+}

package/dist/src/presentation/web/lib/layout-with-dagre.d.ts

@@ -15,6 +15,8 @@ export interface LayoutOptions {
 }
 /** Canonical layout defaults for the control-center canvas. */
 export declare const CANVAS_LAYOUT_DEFAULTS: LayoutOptions;
+/** Returns canvas layout defaults with direction adjusted for text direction. */
+export declare function getCanvasLayoutDefaults(dir?: 'ltr' | 'rtl'): LayoutOptions;
 /**
  * Compute an automatic hierarchical layout for React Flow nodes and edges
  * using Dagre. Returns new node/edge arrays — never mutates the originals.

package/dist/src/presentation/web/lib/layout-with-dagre.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"layout-with-dagre.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/lib/layout-with-dagre.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEhD,MAAM,MAAM,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAExD,MAAM,WAAW,aAAa;IAC5B,iEAAiE;IACjE,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,0DAA0D;IAC1D,QAAQ,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IAC7C,qDAAqD;IACrD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,wEAAwE;IACxE,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,+DAA+D;AAC/D,eAAO,MAAM,sBAAsB,EAAE,aAIpC,CAAC;AAkCF;;;;;;GAMG;AACH,wBAAgB,eAAe,CAAC,CAAC,SAAS,IAAI,EAC5C,KAAK,EAAE,CAAC,EAAE,EACV,KAAK,EAAE,IAAI,EAAE,EACb,IAAI,GAAE,aAAkB,GACvB;IAAE,KAAK,EAAE,CAAC,EAAE,CAAC;IAAC,KAAK,EAAE,IAAI,EAAE,CAAA;CAAE,CAqL/B"}
+{"version":3,"file":"layout-with-dagre.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/lib/layout-with-dagre.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEhD,MAAM,MAAM,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAExD,MAAM,WAAW,aAAa;IAC5B,iEAAiE;IACjE,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,0DAA0D;IAC1D,QAAQ,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;IAC7C,qDAAqD;IACrD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,wEAAwE;IACxE,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,+DAA+D;AAC/D,eAAO,MAAM,sBAAsB,EAAE,aAIpC,CAAC;AAEF,iFAAiF;AACjF,wBAAgB,uBAAuB,CAAC,GAAG,GAAE,KAAK,GAAG,KAAa,GAAG,aAAa,CAEjF;AAkCD;;;;;;GAMG;AACH,wBAAgB,eAAe,CAAC,CAAC,SAAS,IAAI,EAC5C,KAAK,EAAE,CAAC,EAAE,EACV,KAAK,EAAE,IAAI,EAAE,EACb,IAAI,GAAE,aAAkB,GACvB;IAAE,KAAK,EAAE,CAAC,EAAE,CAAC;IAAC,KAAK,EAAE,IAAI,EAAE,CAAA;CAAE,CAqL/B"}

package/dist/src/presentation/web/lib/layout-with-dagre.js

@@ -5,6 +5,10 @@ export const CANVAS_LAYOUT_DEFAULTS = {
     ranksep: 200,
     nodesep: 30,
 };
+/** Returns canvas layout defaults with direction adjusted for text direction. */
+export function getCanvasLayoutDefaults(dir = 'ltr') {
+    return { ...CANVAS_LAYOUT_DEFAULTS, direction: dir === 'rtl' ? 'RL' : 'LR' };
+}
 /** Known node-type dimensions for the canvas node types */
 const NODE_DIMENSIONS = {
     featureNode: { width: 388, height: 140 },

package/dist/src/presentation/web/lib/rtl-fonts.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Lazy font loader for RTL languages (Arabic and Hebrew).
+ *
+ * Dynamically loads Noto Sans Arabic or Noto Sans Hebrew from Google Fonts
+ * when the user switches to an RTL language. Fonts are cached after first
+ * load — subsequent calls for the same language are no-ops.
+ *
+ * This module must only be imported in client components (uses DOM APIs).
+ */
+/**
+ * Load the appropriate font for an RTL language and apply it to the document.
+ *
+ * For non-RTL languages this removes any previously applied RTL font class.
+ * The Google Fonts stylesheet is injected as a `<link>` element in `<head>`,
+ * which the browser caches normally (no re-download on subsequent visits).
+ * Duplicate link elements are avoided by checking DOM existence.
+ */
+export declare function applyRtlFont(language: string): void;
+//# sourceMappingURL=rtl-fonts.d.ts.map

package/dist/src/presentation/web/lib/rtl-fonts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rtl-fonts.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/lib/rtl-fonts.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAeH;;;;;;;GAOG;AACH,wBAAgB,YAAY,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,CA4BnD"}

package/dist/src/presentation/web/lib/rtl-fonts.js

@@ -0,0 +1,51 @@
+/**
+ * Lazy font loader for RTL languages (Arabic and Hebrew).
+ *
+ * Dynamically loads Noto Sans Arabic or Noto Sans Hebrew from Google Fonts
+ * when the user switches to an RTL language. Fonts are cached after first
+ * load — subsequent calls for the same language are no-ops.
+ *
+ * This module must only be imported in client components (uses DOM APIs).
+ */
+const FONT_CONFIG = {
+    ar: {
+        family: 'Noto Sans Arabic',
+        cssUrl: 'https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@400;500;600;700&display=swap',
+    },
+    he: {
+        family: 'Noto Sans Hebrew',
+        cssUrl: 'https://fonts.googleapis.com/css2?family=Noto+Sans+Hebrew:wght@400;500;600;700&display=swap',
+    },
+};
+/**
+ * Load the appropriate font for an RTL language and apply it to the document.
+ *
+ * For non-RTL languages this removes any previously applied RTL font class.
+ * The Google Fonts stylesheet is injected as a `<link>` element in `<head>`,
+ * which the browser caches normally (no re-download on subsequent visits).
+ * Duplicate link elements are avoided by checking DOM existence.
+ */
+export function applyRtlFont(language) {
+    const config = FONT_CONFIG[language];
+    // Remove any existing RTL font class
+    document.documentElement.classList.remove('font-rtl-arabic', 'font-rtl-hebrew');
+    if (!config) {
+        // LTR language — clear RTL font override
+        document.documentElement.style.removeProperty('--font-rtl');
+        return;
+    }
+    // Set the CSS custom property for the RTL font family
+    document.documentElement.style.setProperty('--font-rtl', `"${config.family}"`);
+    // Add language-specific font class
+    const fontClass = language === 'ar' ? 'font-rtl-arabic' : 'font-rtl-hebrew';
+    document.documentElement.classList.add(fontClass);
+    // Load the font stylesheet if not already present in the DOM
+    const linkId = `rtl-font-${language}`;
+    if (!document.getElementById(linkId)) {
+        const link = document.createElement('link');
+        link.id = linkId;
+        link.rel = 'stylesheet';
+        link.href = config.cssUrl;
+        document.head.appendChild(link);
+    }
+}