@donotdev/ui 0.0.12 → 0.0.14

package/dist/components/auth/AuthMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AuthMenu.d.ts","sourceRoot":"","sources":["../../../src/components/auth/AuthMenu.tsx"],"names":[],"mappings":"AA4EA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAEvD,OAAO,EAML,OAAO,EACR,MAAM,sBAAsB,CAAC;AAc9B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAqE3C;;;;;;;;;GASG;AACH,MAAM,WAAW,kBAAkB;IACjC,sBAAsB;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,mDAAmD;IACnD,IAAI,CAAC,EAAE,MAAM,GAAG,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACtD,6DAA6D;IAC7D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mBAAmB;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED;;;;;;GAMG;AACH,MAAM,WAAW,aAAa;IAC5B,qFAAqF;IACrF,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,CAAC,OAAO,OAAO,CAAC,CAAC,MAAM,OAAO,OAAO,CAAC,CAAC;IAEjD,sBAAsB;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;;;OAIG;IACH,WAAW,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAEnC,gDAAgD;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAsBD,eAAO,MAAM,QAAQ,GAAI,iFAOtB,aAAa,mDA0Of,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"AuthMenu.d.ts","sourceRoot":"","sources":["../../../src/components/auth/AuthMenu.tsx"],"names":[],"mappings":"AA4EA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAEvD,OAAO,EAML,OAAO,EACR,MAAM,sBAAsB,CAAC;AAc9B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AA8D3C;;;;;;;;;GASG;AACH,MAAM,WAAW,kBAAkB;IACjC,sBAAsB;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,mDAAmD;IACnD,IAAI,CAAC,EAAE,MAAM,GAAG,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACtD,6DAA6D;IAC7D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,8DAA8D;IAC9D,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mBAAmB;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED;;;;;;GAMG;AACH,MAAM,WAAW,aAAa;IAC5B,qFAAqF;IACrF,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,CAAC,OAAO,OAAO,CAAC,CAAC,MAAM,OAAO,OAAO,CAAC,CAAC;IAEjD,sBAAsB;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;;;OAIG;IACH,WAAW,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAEnC,gDAAgD;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAsBD,eAAO,MAAM,QAAQ,GAAI,iFAOtB,aAAa,mDA0Of,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/dist/components/auth/AuthMenu.js

@@ -102,18 +102,10 @@ const ConfirmDeleteDialog = lazy(async () => {
     }
 });
 // Graceful degradation for useDeleteAccount hook
-let realUseDeleteAccount = null;
-// Preload useDeleteAccount (non-blocking)
-if (isClient()) {
-    import('@donotdev/auth')
-        .then((module) => {
-        realUseDeleteAccount = module.useDeleteAccount;
-    })
-        .catch(() => { });
-}
-// Fallback hook that matches useDeleteAccount's hook structure
-function useDeleteAccountFallback() {
-    // Always call useState to maintain hook order (matches real hook structure)
+// Resolved at module level (not render level) to avoid Rules of Hooks violation.
+// Once set, useDeleteAccount never changes identity during the app lifecycle.
+let useDeleteAccount = () => {
+    // Fallback: always call useState to maintain stable hook order
     const [showConfirmDialog] = React.useState(false);
     const [showPasswordDialog] = React.useState(false);
     const [isDeleting] = React.useState(false);
@@ -127,13 +119,20 @@ function useDeleteAccountFallback() {
         confirmDelete: async () => { },
         cancel: () => { },
     };
-}
-// Hook wrapper that uses real hook if available, otherwise fallback
-function useDeleteAccountHook() {
-    if (realUseDeleteAccount) {
-        return realUseDeleteAccount();
-    }
-    return useDeleteAccountFallback();
+};
+// Preload useDeleteAccount (non-blocking)
+// The hook reference is swapped before the first render in practice,
+// but if the import resolves after first render, the fallback remains
+// stable for that session to avoid hook order changes mid-lifecycle.
+if (isClient()) {
+    import('@donotdev/auth')
+        .then((module) => {
+        useDeleteAccount = module.useDeleteAccount;
+    })
+        .catch((e) => {
+        if (process.env.NODE_ENV === 'development')
+            console.warn('Failed to load @donotdev/auth:', e);
+    });
 }
 /**
  * Resolves Lucide icon component from string name or component reference
@@ -167,7 +166,7 @@ export const AuthMenu = ({ loginPath, display = DISPLAY.AUTO, 'no-tooltip': noTo
     const profilePath = authConfig.profilePath;
     const configMenuItems = authConfig.authMenuItems || [];
     // Account deletion flow - managed by useDeleteAccount hook
-    const deletion = useDeleteAccountHook();
+    const deletion = useDeleteAccount();
     /**
      * Get user display name with fallbacks
      */

package/dist/components/common/FeatureCard.d.ts

@@ -13,6 +13,8 @@ export interface FeatureCardProps extends Omit<CardProps, 'content' | 'href' | '
     content?: CardContent;
     /** Route path - enables routing via Link */
     href?: string;
+    /** When true, apply clickable styling (cursor, hover) even without href/onClick. Use when card is a dialog trigger. */
+    clickable?: boolean;
 }
 /**
  * FeatureCard - Card wrapper with content array and routing
@@ -21,6 +23,6 @@ export interface FeatureCardProps extends Omit<CardProps, 'content' | 'href' | '
  * Uses Card component internally.
  * Routing via Link when href provided.
  */
-declare const FeatureCard: ({ icon, title, subtitle, content, href, variant, elevated, onClick, className, footer, style, ...cardProps }: FeatureCardProps) => import("react/jsx-runtime").JSX.Element;
+declare const FeatureCard: ({ icon, title, subtitle, content, href, variant, elevated, onClick, className, footer, style, clickable, ...cardProps }: FeatureCardProps) => import("react/jsx-runtime").JSX.Element;
 export default FeatureCard;
 //# sourceMappingURL=FeatureCard.d.ts.map

package/dist/components/common/FeatureCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FeatureCard.d.ts","sourceRoot":"","sources":["../../../src/components/common/FeatureCard.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAIhF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,MAAM,kBAAkB,GAAG,WAAW,CAAC;AAE7C,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAC5C,SAAS,EACT,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,UAAU,CACvD;IACC,kDAAkD;IAClD,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,qDAAqD;IACrD,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED;;;;;;GAMG;AACH,QAAA,MAAM,WAAW,GAAI,8GAalB,gBAAgB,4CAmIlB,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"FeatureCard.d.ts","sourceRoot":"","sources":["../../../src/components/common/FeatureCard.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAIhF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,MAAM,kBAAkB,GAAG,WAAW,CAAC;AAE7C,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAC5C,SAAS,EACT,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,UAAU,CACvD;IACC,kDAAkD;IAClD,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,qDAAqD;IACrD,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uHAAuH;IACvH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;GAMG;AACH,QAAA,MAAM,WAAW,GAAI,yHAclB,gBAAgB,4CA8HlB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/components/common/FeatureCard.js

@@ -21,7 +21,7 @@ import { Link } from '../../routing';
  * Uses Card component internally.
  * Routing via Link when href provided.
  */
-const FeatureCard = ({ icon, title, subtitle, content, href, variant, elevated, onClick, className, footer, style, ...cardProps }) => {
+const FeatureCard = ({ icon, title, subtitle, content, href, variant, elevated, onClick, className, footer, style, clickable, ...cardProps }) => {
     const contentNode = renderCardContent(content);
     // Fixed height constants for consistent text sizing (2 rows each)
     const titleRowHeight = `calc(var(--font-size-lg) * var(--line-height) * 2 + var(--gap-md))`;
@@ -56,8 +56,8 @@ const FeatureCard = ({ icon, title, subtitle, content, href, variant, elevated,
         margin: 0,
     };
     // Build title with icon if provided
-    const titleContent = icon ? (_jsxs(Stack, { direction: "row", align: "center", gap: "medium", style: { width: '100%' }, children: [_jsx(IconBox, { icon: icon }), _jsx(Text, { as: "div", level: "h3", style: titleStyle, children: title })] })) : (_jsx(Text, { as: "div", level: "h3", style: titleStyle, children: title }));
-    const card = (_jsx(Card, { variant: variant, elevated: elevated, onClick: onClick, className: className, "data-clickable": href || onClick ? 'true' : undefined, style: {
+    const titleContent = icon ? (_jsxs(Stack, { direction: "row", align: "center", style: { width: '100%' }, children: [_jsx(IconBox, { icon: icon }), _jsx(Text, { as: "div", level: "h3", style: titleStyle, children: title })] })) : (_jsx(Text, { as: "div", level: "h3", style: titleStyle, children: title }));
+    const card = (_jsx(Card, { variant: variant, elevated: elevated, onClick: onClick, className: className, "data-clickable": href || onClick || clickable ? 'true' : undefined, style: {
             paddingInlineStart: 'var(--gap-md)',
             paddingInlineEnd: 'var(--gap-md)',
             gap: 'var(--gap-md)',

package/dist/components/common/ProgressBar.js

@@ -67,8 +67,8 @@ const ProgressBar = ({ isActive = false, progress: controlledProgress, useFakePr
     }
     return (_jsx("div", { className: cn(className), style: {
             position: 'fixed',
-            left: 0,
-            right: 0,
+            insetInlineStart: 0,
+            insetInlineEnd: 0,
             zIndex: 9999,
             height: '4px',
             backgroundColor: 'transparent',

package/dist/components/common/RedirectOverlay.js

@@ -219,7 +219,7 @@ export function RedirectOverlay() {
                     textAlign: 'center',
                     maxWidth: '400px',
                     padding: 'var(--gap-lg)',
-                }, children: [_jsxs(Stack, { direction: "row", gap: "medium", align: "center", children: [IconComponent && (_jsx(IconComponent, { style: {
+                }, children: [_jsxs(Stack, { direction: "row", align: "center", children: [IconComponent && (_jsx(IconComponent, { style: {
                                     width: '1.5rem',
                                     height: '1.5rem',
                                     color: 'var(--primary)',

package/dist/components/common/TechBento.d.ts

@@ -1,4 +1,4 @@
-import type { BentoColumns, BentoGap, CardVariant, ResponsiveCols } from '@donotdev/components';
+import type { BentoColumns, BentoGap, CardVariant, ResponsiveCols, Tone } from '@donotdev/components';
 import { type TechKey } from '../../data/techLogos';
 export type TechBentoProps = {
     title?: string;
@@ -22,8 +22,20 @@ export type TechBentoProps = {
     columns?: BentoColumns;
     gap?: BentoGap;
     separator?: boolean;
+    /** Tone system for background colors (matches Section/CallToAction) */
+    tone?: Tone;
+    /** Content alignment @default 'center' */
+    align?: 'start' | 'center' | 'end';
+    /** Whether the section is collapsible */
+    collapsible?: boolean;
+    /** Controlled open state (when collapsible) */
+    open?: boolean;
+    /** Callback when open state changes (when collapsible) */
+    onOpenChange?: (open: boolean) => void;
+    /** Default open state (uncontrolled, when collapsible) */
+    defaultOpen?: boolean;
     className?: string;
 };
-export declare function TechBento({ title, techs, cols, columns, gap, separator, className, }: TechBentoProps): import("react/jsx-runtime").JSX.Element;
+export declare function TechBento({ title, techs, cols, columns, gap, separator, tone, align, collapsible, open, onOpenChange, defaultOpen, className, }: TechBentoProps): import("react/jsx-runtime").JSX.Element;
 export default TechBento;
 //# sourceMappingURL=TechBento.d.ts.map

package/dist/components/common/TechBento.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TechBento.d.ts","sourceRoot":"","sources":["../../../src/components/common/TechBento.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EACV,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,cAAc,EACf,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EAAa,KAAK,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAI/D,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,KAAK,CAAC;QACX,IAAI,EAAE,OAAO,CAAC;QACd,IAAI,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC;QAC3C,OAAO,CAAC,EAAE,WAAW,CAAC;KACvB,CAAC,CAAC;IACH;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,cAAc,CAAC;IAC/B;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,GAAG,CAAC,EAAE,QAAQ,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAwCF,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,KAAK,EACL,IAAQ,EACR,OAAO,EACP,GAAc,EACd,SAAiB,EACjB,SAAS,GACV,EAAE,cAAc,2CAsDhB;AAED,eAAe,SAAS,CAAC"}
+{"version":3,"file":"TechBento.d.ts","sourceRoot":"","sources":["../../../src/components/common/TechBento.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EACV,YAAY,EACZ,QAAQ,EACR,WAAW,EACX,cAAc,EACd,IAAI,EACL,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EAAa,KAAK,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAK/D,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,KAAK,CAAC;QACX,IAAI,EAAE,OAAO,CAAC;QACd,IAAI,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC;QAC3C,OAAO,CAAC,EAAE,WAAW,CAAC;KACvB,CAAC,CAAC;IACH;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,cAAc,CAAC;IAC/B;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,GAAG,CAAC,EAAE,QAAQ,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,uEAAuE;IACvE,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,0CAA0C;IAC1C,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IACnC,yCAAyC;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,+CAA+C;IAC/C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,0DAA0D;IAC1D,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,0DAA0D;IAC1D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAwCF,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,KAAK,EACL,IAAQ,EACR,OAAO,EACP,GAAc,EACd,SAAiB,EACjB,IAAiB,EACjB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,YAAY,EACZ,WAAW,EACX,SAAS,GACV,EAAE,cAAc,2CA4DhB;AAED,eAAe,SAAS,CAAC"}

package/dist/components/common/TechBento.js

@@ -1,18 +1,19 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // packages/ui/src/components/common/TechBento.tsx
 import { useState } from 'react';
-import { Bento, Card, Section, Stack, Text, cn } from '@donotdev/components';
+import { Bento, Card, Section, Stack, Text, TONE, cn } from '@donotdev/components';
 import { techLogos } from '../../data/techLogos';
+import { sanitizeSvg } from '../../utils/sanitizeSvg';
 function TechCard({ techKey, variant, }) {
     const logo = techLogos[techKey];
     const [isHovered, setIsHovered] = useState(false);
     if (!logo)
         return null;
-    const svgContent = logo.svg.replace('data:image/svg+xml,', '');
-    const decodedSvg = decodeURIComponent(svgContent);
+    const rawSvg = decodeURIComponent(logo.svg.replace('data:image/svg+xml,', ''));
+    const decodedSvg = sanitizeSvg(rawSvg);
     return (_jsx(Card, { variant: variant, className: "dndev-tech-card", style: { '--tech-color': logo.color }, "data-hover": isHovered, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), children: _jsxs(Stack, { direction: "column", align: "center", gap: "tight", children: [_jsx("div", { className: "dndev-tech-card-logo", "data-tech": techKey, dangerouslySetInnerHTML: { __html: decodedSvg } }), _jsx(Text, { as: "span", level: "small", children: logo.name })] }) }));
 }
-export function TechBento({ title, techs, cols = 3, columns, gap = 'medium', separator = false, className, }) {
+export function TechBento({ title, techs, cols = 3, columns, gap = 'medium', separator = false, tone = TONE.GHOST, align, collapsible, open, onOpenChange, defaultOpen, className, }) {
     // Convert Grid's cols format to Bento's columns format
     // Grid: [mobile, tablet, laptop, desktop]
     // Bento: { mobile, tablet, desktop, wide }
@@ -47,10 +48,8 @@ export function TechBento({ title, techs, cols = 3, columns, gap = 'medium', sep
         content: _jsx(TechCard, { techKey: tech.name, variant: tech.variant }),
         span: getSpan(tech.size),
     }));
-    const bento = (_jsx(Bento, { items: items, columns: bentoColumns, gap: gap, className: className, ariaLabel: "Technology stack" }));
-    if (title) {
-        return (_jsx(Section, { title: title, separator: separator, className: "dndev-tech-bento", children: _jsx("div", { className: "dndev-tech-bento-grid", children: bento }) }));
-    }
-    return _jsx("div", { className: cn('dndev-tech-bento', className), children: bento });
+    const bento = (_jsx(Bento, { items: items, columns: bentoColumns, gap: gap, ariaLabel: "Technology stack" }));
+    // Always use Section - TechBento is a Section with a Bento grid
+    return (_jsx(Section, { title: title, separator: separator, tone: tone, align: align, collapsible: collapsible, open: open, onOpenChange: onOpenChange, defaultOpen: defaultOpen, className: cn('dndev-tech-bento', className), children: _jsx("div", { className: "dndev-tech-bento-grid", children: bento }) }));
 }
 export default TechBento;

package/dist/components/cookie-consent/CookieConsent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CookieConsent.d.ts","sourceRoot":"","sources":["../../../src/components/cookie-consent/CookieConsent.tsx"],"names":[],"mappings":"AA6BA,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;IAC5B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,iBAAS,aAAa,CAAC,EACrB,QAAmB,EACnB,YAAmB,EACnB,YAA8C,EAC9C,SAAc,GACf,EAAE,kBAAkB,kDAuUpB;AAED,eAAe,aAAa,CAAC"}
+{"version":3,"file":"CookieConsent.d.ts","sourceRoot":"","sources":["../../../src/components/cookie-consent/CookieConsent.tsx"],"names":[],"mappings":"AA6BA,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;IAC5B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,iBAAS,aAAa,CAAC,EACrB,QAAmB,EACnB,YAAmB,EACnB,YAA8C,EAC9C,SAAc,GACf,EAAE,kBAAkB,kDAqUpB;AAED,eAAe,aAAa,CAAC"}

package/dist/components/cookie-consent/CookieConsent.js

@@ -14,7 +14,6 @@ function CookieConsent({ position = 'bottom', showBranding = true, brandingText
     const declineAll = useConsent('declineAll');
     const updateCategory = useConsent('updateCategory');
     const storeShowBanner = useConsent('showBanner');
-    const hideBanner = useConsent('showCookieBanner');
     const { t } = useTranslation('cookies');
     const [showPreferences, setShowPreferences] = useState(false);
     const [showBanner, setShowBanner] = useState(!hasConsented || storeShowBanner);
@@ -141,14 +140,14 @@ function CookieConsent({ position = 'bottom', showBranding = true, brandingText
         declineAll();
         setShowBanner(false);
     };
-    const bannerContent = (_jsxs(Stack, { gap: "medium", children: [_jsx(Text, { as: "p", variant: "muted", level: "small", children: t('cookieBannerDescription') }), hasOptionalCategories && (_jsx(Accordion, { type: "single", collapsible: true, value: showPreferences ? 'preferences' : '', onValueChange: (value) => setShowPreferences(value === 'preferences'), items: [
+    const bannerContent = (_jsxs(Stack, { children: [_jsx(Text, { as: "p", variant: "muted", level: "small", children: t('cookieBannerDescription') }), hasOptionalCategories && (_jsx(Accordion, { type: "single", collapsible: true, value: showPreferences ? 'preferences' : '', onValueChange: (value) => setShowPreferences(value === 'preferences'), items: [
                     {
                         value: 'preferences',
                         trigger: (_jsxs(Stack, { direction: "row", align: "center", gap: "tight", children: [_jsx(Settings, { className: "dndev-size-md" }), t('customize')] })),
-                        content: (_jsx(Stack, { gap: "medium", children: categoryDefs.map((cat) => {
+                        content: (_jsx(Stack, { children: categoryDefs.map((cat) => {
                                 const Icon = cat.icon;
                                 const enabled = preferenceCategories[cat.id] ?? false;
-                                return (_jsx(Card, { content: _jsxs(Stack, { direction: "row", align: "center", justify: "between", gap: "medium", children: [_jsxs(Stack, { direction: "row", align: "start", gap: "tight", style: { flex: 1 }, children: [_jsx(Icon, { className: "dndev-size-md", style: {
+                                return (_jsx(Card, { content: _jsxs(Stack, { direction: "row", align: "center", justify: "between", children: [_jsxs(Stack, { direction: "row", align: "start", gap: "tight", style: { flex: 1 }, children: [_jsx(Icon, { className: "dndev-size-md", style: {
                                                             color: 'var(--primary)',
                                                             marginTop: '0.125rem',
                                                         } }), _jsxs(Stack, { gap: "tight", children: [_jsx(Text, { as: "span", level: "body", style: { fontWeight: 600 }, children: cat.title }), _jsx(Text, { as: "span", variant: "muted", level: "small", children: cat.description }), cat.examples && (_jsx(Text, { as: "span", variant: "muted", level: "small", style: { fontStyle: 'italic' }, children: cat.examples }))] })] }), cat.locked ? (_jsx(Text, { as: "span", variant: "muted", level: "small", children: t('alwaysOn') })) : (_jsx(Switch, { checked: enabled, onCheckedChange: (val) => setPreferenceCategories((prev) => ({
@@ -161,10 +160,10 @@ function CookieConsent({ position = 'bottom', showBranding = true, brandingText
     const bannerFooter = showPreferences ? (_jsxs(Stack, { direction: "row", gap: "tight", style: { width: '100%' }, children: [_jsx(Button, { onClick: handleSave, variant: BUTTON_VARIANT.DEFAULT, style: { flex: 1 }, children: t('savePreferences', 'Save Preferences') }), _jsx(Button, { onClick: () => setShowPreferences(false), variant: BUTTON_VARIANT.OUTLINE, style: { flex: 1 }, children: t('form.cancel', 'Cancel') })] })) : (_jsxs(Stack, { direction: "row", gap: "tight", style: { width: '100%' }, children: [_jsx(Button, { onClick: handleAcceptAll, variant: BUTTON_VARIANT.DEFAULT, style: { flex: 1 }, children: t('acceptAll') }), hasOptionalCategories && (_jsx(Button, { onClick: handleDeclineAll, variant: BUTTON_VARIANT.OUTLINE, style: { flex: 1 }, children: t('declineOptional') }))] }));
     return (_jsxs(_Fragment, { children: [showBanner && (_jsx(Card, { ref: bannerRef, className: cn('dndev-fixed dndev-z-modal', className), icon: Cookie, title: t('cookiePreferences'), content: bannerContent, footer: bannerFooter, style: {
                     [position === 'top' ? 'top' : 'bottom']: 'var(--gap-md)',
-                    left: 'var(--gap-md)',
-                    right: 'var(--gap-md)',
+                    insetInlineStart: 'var(--gap-md)',
+                    insetInlineEnd: 'var(--gap-md)',
                     maxWidth: '100%',
                     width: 'calc(100% - var(--gap-md) * 2)',
-                } })), !showBanner && !hasConsented && (_jsx(Button, { onClick: () => setShowBanner(true), className: "dndev-fixed dndev-z-toast", style: { bottom: 'var(--gap-md)', left: 'var(--gap-md)' }, icon: Cookie, title: t('cookiePreferences') }))] }));
+                } })), !showBanner && !hasConsented && (_jsx(Button, { onClick: () => setShowBanner(true), className: "dndev-fixed dndev-z-toast", style: { bottom: 'var(--gap-md)', insetInlineStart: 'var(--gap-md)' }, icon: Cookie, title: t('cookiePreferences') }))] }));
 }
 export default CookieConsent;

package/dist/components/layout/GameContainer.d.ts

@@ -1,24 +1,28 @@
 import type { ReactNode } from 'react';
+/**
+ * CTA button definition
+ */
+export interface CTAButton {
+    label: string;
+    onClick: () => void;
+    disabled?: boolean;
+    variant?: 'default' | 'outline' | 'ghost' | 'link';
+}
 /**
  * GameContainer props
  */
 export interface GameContainerProps {
     /** Main content area (scrollable, centered by default) */
     content: ReactNode;
-    /** Optional fixed CTA button at bottom */
-    cta?: {
-        label: string;
-        onClick: () => void;
-        disabled?: boolean;
-        variant?: 'default' | 'outline' | 'ghost' | 'link';
-    };
+    /** Optional fixed CTA button(s) at bottom - single button or array for multiple buttons */
+    cta?: CTAButton | CTAButton[];
     /** Alignment variant for content area */
     align?: 'center' | 'start' | 'stretch';
     /** Justify variant for content area */
     justify?: 'center' | 'start' | 'end' | 'between';
     /** Disable ScrollArea (use plain overflow) - for interactive content */
     disableScrollArea?: boolean;
-    /** Content width: 'full' (default) or 'narrow' (constrained by --narrow-content-max) */
+    /** Content width: 'narrow' (default, constrained) or 'full' */
     contentVariant?: 'full' | 'narrow';
     /** Additional className for content wrapper */
     contentClassName?: string;
@@ -68,6 +72,18 @@ export interface GameContainerProps {
  * />
  * ```
  *
+ * @example
+ * Multiple CTA buttons (side by side)
+ * ```tsx
+ * <GameContainer
+ *   content={<ChallengeContent />}
+ *   cta={[
+ *     { label: 'Accept', onClick: handleAccept, variant: 'default' },
+ *     { label: 'Decline', onClick: handleDecline, variant: 'outline' }
+ *   ]}
+ * />
+ * ```
+ *
  * @version 0.0.1
  * @since 0.0.1
  * @author AMBROISE PARK Consulting

package/dist/components/layout/GameContainer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GameContainer.d.ts","sourceRoot":"","sources":["../../../src/components/layout/GameContainer.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,0DAA0D;IAC1D,OAAO,EAAE,SAAS,CAAC;IAEnB,0CAA0C;IAC1C,GAAG,CAAC,EAAE;QACJ,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,IAAI,CAAC;QACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;KACpD,CAAC;IAEF,yCAAyC;IACzC,KAAK,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;IAEvC,uCAAuC;IACvC,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,GAAG,SAAS,CAAC;IAEjD,wEAAwE;IACxE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B,wFAAwF;IACxF,cAAc,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAEnC,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,0CAA0C;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AACH,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,GAAG,EACH,KAAgB,EAChB,OAAkB,EAClB,iBAAyB,EACzB,cAAuB,EACvB,gBAAgB,EAChB,YAAY,GACb,EAAE,kBAAkB,2CA0CpB"}
+{"version":3,"file":"GameContainer.d.ts","sourceRoot":"","sources":["../../../src/components/layout/GameContainer.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC;;GAEG;AACH,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;CACpD;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,0DAA0D;IAC1D,OAAO,EAAE,SAAS,CAAC;IAEnB,2FAA2F;IAC3F,GAAG,CAAC,EAAE,SAAS,GAAG,SAAS,EAAE,CAAC;IAE9B,yCAAyC;IACzC,KAAK,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;IAEvC,uCAAuC;IACvC,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,GAAG,SAAS,CAAC;IAEjD,wEAAwE;IACxE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B,+DAA+D;IAC/D,cAAc,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAC;IAEnC,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,0CAA0C;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0DG;AACH,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,GAAG,EACH,KAAgB,EAChB,OAAkB,EAClB,iBAAyB,EACzB,cAAyB,EACzB,gBAAgB,EAChB,YAAY,GACb,EAAE,kBAAkB,2CAoEpB"}

package/dist/components/layout/GameContainer.js

@@ -53,11 +53,29 @@ import { cn } from '@donotdev/components';
  * />
  * ```
  *
+ * @example
+ * Multiple CTA buttons (side by side)
+ * ```tsx
+ * <GameContainer
+ *   content={<ChallengeContent />}
+ *   cta={[
+ *     { label: 'Accept', onClick: handleAccept, variant: 'default' },
+ *     { label: 'Decline', onClick: handleDecline, variant: 'outline' }
+ *   ]}
+ * />
+ * ```
+ *
  * @version 0.0.1
  * @since 0.0.1
  * @author AMBROISE PARK Consulting
  */
-export function GameContainer({ content, cta, align = 'center', justify = 'center', disableScrollArea = false, contentVariant = 'full', contentClassName, ctaClassName, }) {
-    const contentInner = disableScrollArea ? (_jsx("div", { style: { overflow: 'auto', overscrollBehavior: 'contain' }, children: content })) : (_jsx(ScrollArea, { className: "dndev-game-container__scroll", children: content }));
-    return (_jsxs("div", { className: "dndev-game-container", children: [_jsx("div", { className: cn('dndev-game-container__content', contentClassName), "data-align": align, "data-justify": justify, "data-content-variant": contentVariant, children: contentVariant === 'narrow' ? (_jsx("div", { className: "dndev-game-container__content-narrow", children: contentInner })) : (contentInner) }), cta && (_jsx("div", { className: cn('dndev-game-container__cta', ctaClassName), children: _jsx(Button, { onClick: cta.onClick, disabled: cta.disabled ?? false, variant: cta.variant ?? 'default', className: "dndev-game-container__cta-button", children: cta.label }) }))] }));
+export function GameContainer({ content, cta, align = 'center', justify = 'center', disableScrollArea = false, contentVariant = 'narrow', contentClassName, ctaClassName, }) {
+    const narrowWrapper = contentVariant === 'narrow' && (_jsx("div", { className: "dndev-game-container__content-narrow", children: content }));
+    const scrollContent = contentVariant === 'narrow' ? narrowWrapper : content;
+    const contentInner = disableScrollArea ? (_jsx("div", { style: {
+            overflow: 'auto',
+            overscrollBehavior: 'contain',
+            height: '100%',
+        }, children: scrollContent })) : (_jsx(ScrollArea, { className: "dndev-game-container__scroll", children: scrollContent }));
+    return (_jsxs("div", { className: "dndev-game-container", children: [_jsx("div", { className: cn('dndev-game-container__content', contentClassName), "data-align": align, "data-justify": justify, "data-content-variant": contentVariant, children: _jsx("div", { className: "dndev-game-container__scroll-wrapper", children: contentInner }) }), cta && (_jsx("div", { className: cn('dndev-game-container__cta', ctaClassName), children: Array.isArray(cta) ? (_jsx("div", { className: "dndev-game-container__cta-buttons", children: cta.map((button, index) => (_jsx(Button, { onClick: button.onClick, disabled: button.disabled ?? false, variant: button.variant ?? 'default', className: "dndev-game-container__cta-button", fullWidth: true, children: button.label }, index))) })) : (_jsx(Button, { onClick: cta.onClick, disabled: cta.disabled ?? false, variant: cta.variant ?? 'default', className: "dndev-game-container__cta-button", children: cta.label })) }))] }));
 }

package/dist/components/layout/GameFlow.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GameFlow.d.ts","sourceRoot":"","sources":["../../../src/components/layout/GameFlow.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,EAKL,KAAK,aAAa,EAClB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,MAAM,CACjC,MAAM,EACN,MAAM,OAAO,CAAC;IAAE,OAAO,EAAE,aAAa,CAAC,GAAG,CAAC,CAAA;CAAE,CAAC,CAC/C,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,6DAA6D;IAC7D,cAAc,EAAE,cAAc,CAAC;IAC/B,oCAAoC;IACpC,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,iDAAiD;IACjD,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,iDAAiD;IACjD,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAQD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,wBAAgB,QAAQ,CAAC,EACvB,cAAc,EACd,aAAa,EACb,UAAU,EACV,QAAe,GAChB,EAAE,aAAa,kDAqCf"}
+{"version":3,"file":"GameFlow.d.ts","sourceRoot":"","sources":["../../../src/components/layout/GameFlow.tsx"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,EAIL,KAAK,aAAa,EAClB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG,MAAM,CACjC,MAAM,EACN,MAAM,OAAO,CAAC;IAAE,OAAO,EAAE,aAAa,CAAC,GAAG,CAAC,CAAA;CAAE,CAAC,CAC/C,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,6DAA6D;IAC7D,cAAc,EAAE,cAAc,CAAC;IAC/B,oCAAoC;IACpC,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,iDAAiD;IACjD,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,iDAAiD;IACjD,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAmCD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,wBAAgB,QAAQ,CAAC,EACvB,cAAc,EACd,aAAa,EACb,UAAU,EACV,QAAe,GAChB,EAAE,aAAa,kDAgCf"}

package/dist/components/layout/GameFlow.js

@@ -8,12 +8,34 @@ import { jsx as _jsx } from "react/jsx-runtime";
  * @since 0.0.1
  * @author AMBROISE PARK Consulting
  */
-import { useEffect, useMemo, Suspense, lazy, } from 'react';
+import { useEffect, Suspense, lazy, } from 'react';
 /**
  * Module-level cache for preloaded screens
  * Tracks which screens have been preloaded to avoid duplicate preloading
  */
 const preloadedScreens = new Set();
+/**
+ * Module-level cache for lazy components.
+ * CRITICAL: lazy() must NOT be called inside a component (useMemo or otherwise).
+ * Doing so creates a new component TYPE on each call, which causes React to
+ * unmount/remount the entire subtree and can trigger Rules of Hooks violations.
+ * This cache ensures each screen name always resolves to the same lazy component ref.
+ */
+const lazyComponentCache = new Map();
+/**
+ * Get or create a cached lazy component for a screen name
+ */
+function getLazyComponent(screenName, registry) {
+    const cached = lazyComponentCache.get(screenName);
+    if (cached)
+        return cached;
+    const importer = registry[screenName];
+    if (!importer)
+        return null;
+    const component = lazy(importer);
+    lazyComponentCache.set(screenName, component);
+    return component;
+}
 /**
  * GameFlow - Screen router for game/session flows
  *
@@ -59,16 +81,10 @@ export function GameFlow({ screenRegistry, currentScreen, nextScreen, fallback =
             }
         }
     }, [nextScreen, screenRegistry]);
-    // Get lazy component for currentScreen
-    const ScreenComponent = useMemo(() => {
-        if (!currentScreen)
-            return null;
-        const importer = screenRegistry[currentScreen];
-        if (!importer)
-            return null;
-        // Create lazy component from registry
-        return lazy(importer);
-    }, [currentScreen, screenRegistry]);
+    // Get cached lazy component for currentScreen (stable reference per screen name)
+    const ScreenComponent = currentScreen
+        ? getLazyComponent(currentScreen, screenRegistry)
+        : null;
     // If no currentScreen or no component found, return null
     if (!currentScreen || !ScreenComponent) {
         return null;

package/dist/components/layout/components/DropdownNavigation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownNavigation.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/components/DropdownNavigation.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAKtD,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,eAAe,EAAE,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC,UAAU,EAAE,kBAAkB,EAAE,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;GAaG;AACH,QAAA,MAAM,kBAAkB,EAAE,aAAa,CAAC,uBAAuB,CAyF9D,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"DropdownNavigation.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/components/DropdownNavigation.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAKtD,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtD;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,eAAe,EAAE,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC,UAAU,EAAE,kBAAkB,EAAE,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;GAaG;AACH,QAAA,MAAM,kBAAkB,EAAE,aAAa,CAAC,uBAAuB,CAsD9D,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/components/layout/components/DropdownNavigation.js

@@ -34,20 +34,11 @@ import { NavigationItemComponent } from '../../../routing/NavigationItem';
  */
 const DropdownNavigation = ({ navigation, className, }) => {
     return (_jsx(Stack, { role: "navigation", direction: "row", align: "center", className: className, style: { gap: 'var(--gap-sm)' }, children: navigation.map((item, idx) => item.routes && item.routes.length > 0 ? (_jsx(DropdownMenu, { trigger: _jsx(Button, { icon: item.icon, children: item.label }), items: item.routes.map((route) => {
-                const content = route.path ? (route.external ? (_jsx("a", { href: route.path, target: "_blank", rel: "noopener noreferrer", style: {
-                        display: 'flex',
-                        alignItems: 'center',
-                        gap: 'var(--gap-sm)',
-                        width: '100%',
-                    }, children: _jsx(NavigationItemComponent, { route: route }) })) : (_jsx(Link, { path: route.path, style: {
-                        display: 'flex',
-                        alignItems: 'center',
-                        gap: 'var(--gap-sm)',
-                        width: '100%',
-                    }, children: _jsx(NavigationItemComponent, { route: route }) }))) : (_jsx(Stack, { direction: "row", align: "center", style: { gap: 'var(--gap-sm)', width: '100%' }, children: _jsx(NavigationItemComponent, { route: route }) }));
+                // NavigationItemComponent already renders a Link/anchor — use it directly.
+                // External links are handled via the route.external flag inside NavigationItemComponent.
                 return {
                     label: route.label,
-                    children: content,
+                    children: _jsx(NavigationItemComponent, { route: route }),
                     asChild: !!route.path,
                 };
             }), contentAlign: "start" }, item.label + idx)) : item.path ? (_jsx(Button, { icon: item.icon, "aria-label": item.label, render: ({ children, ...props }) => (_jsx(Link, { path: item.path, ...props, children: children })), children: item.label }, item.label + idx)) : (_jsx(Button, { icon: item.icon, disabled: true, "aria-label": item.label, children: item.label }, item.label + idx))) }));

package/dist/components/layout/components/FloatingLanguageSwitcher.js

@@ -20,7 +20,7 @@ const FloatingLanguageSwitcher = ({ languages, currentLanguage, onLanguageChange
     return (_jsx(Card, { className: cn('dndev-z-modal', className), style: {
             position: 'fixed',
             bottom: 'var(--gap-md)',
-            right: 'var(--gap-md)',
+            insetInlineEnd: 'var(--gap-md)',
             display: 'flex',
             alignItems: 'center',
             gap: 'var(--gap-sm)',

package/dist/components/layout/components/Notifications.d.ts

@@ -41,8 +41,6 @@ export interface NotificationsProps {
     loading?: boolean;
     /** Callback when notification is dismissed from toast */
     onNotificationClick?: (notification: NotificationItem) => void;
-    /** Callback when mark all as read is clicked */
-    onMarkAllRead?: () => void;
     /** Callback when dropdown opens */
     onDropdownOpen?: () => void;
     /** Maximum number of visible notifications */
@@ -112,6 +110,6 @@ export interface NotificationsProps {
  * @since 0.0.1
  * @author AMBROISE PARK Consulting
  */
-export declare const Notifications: ({ notifications, count, loading, onNotificationClick, onMarkAllRead, onDropdownOpen, className, maxVisible, alwaysShow, size, disabled, }: NotificationsProps) => import("react/jsx-runtime").JSX.Element | null;
+export declare const Notifications: ({ notifications, count, loading, onNotificationClick, onDropdownOpen, className, maxVisible, alwaysShow, size, disabled, }: NotificationsProps) => import("react/jsx-runtime").JSX.Element | null;
 export default Notifications;
 //# sourceMappingURL=Notifications.d.ts.map

package/dist/components/layout/components/Notifications.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Notifications.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/components/Notifications.tsx"],"names":[],"mappings":"AA+BA;;;;;;GAMG;AACH,MAAM,WAAW,gBAAgB;IAC/B,6BAA6B;IAC7B,EAAE,EAAE,MAAM,CAAC;IAEX,yBAAyB;IACzB,KAAK,EAAE,MAAM,CAAC;IAEd,uCAAuC;IACvC,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,oCAAoC;IACpC,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAEhD,6CAA6C;IAC7C,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf,8CAA8C;IAC9C,SAAS,CAAC,EAAE,IAAI,CAAC;IAEjB,yBAAyB;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IAEtB,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;GAMG;AACH,MAAM,WAAW,kBAAkB;IACjC,kCAAkC;IAClC,aAAa,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAEnC,sCAAsC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,kDAAkD;IAClD,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,yDAAyD;IACzD,mBAAmB,CAAC,EAAE,CAAC,YAAY,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAE/D,gDAAgD;IAChD,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAE3B,mCAAmC;IACnC,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAE5B,8CAA8C;IAC9C,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,6DAA6D;IAC7D,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,mBAAmB;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAE1B,wCAAwC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAmCD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AACH,eAAO,MAAM,aAAa,GAAI,2IAY3B,kBAAkB,mDA4FpB,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"Notifications.d.ts","sourceRoot":"","sources":["../../../../src/components/layout/components/Notifications.tsx"],"names":[],"mappings":"AA+BA;;;;;;GAMG;AACH,MAAM,WAAW,gBAAgB;IAC/B,6BAA6B;IAC7B,EAAE,EAAE,MAAM,CAAC;IAEX,yBAAyB;IACzB,KAAK,EAAE,MAAM,CAAC;IAEd,uCAAuC;IACvC,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,oCAAoC;IACpC,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAEhD,6CAA6C;IAC7C,IAAI,CAAC,EAAE,OAAO,CAAC;IAEf,8CAA8C;IAC9C,SAAS,CAAC,EAAE,IAAI,CAAC;IAEjB,yBAAyB;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,4BAA4B;IAC5B,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IAEtB,uCAAuC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;GAMG;AACH,MAAM,WAAW,kBAAkB;IACjC,kCAAkC;IAClC,aAAa,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAEnC,sCAAsC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,kDAAkD;IAClD,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,yDAAyD;IACzD,mBAAmB,CAAC,EAAE,CAAC,YAAY,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAE/D,mCAAmC;IACnC,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAE5B,8CAA8C;IAC9C,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,6DAA6D;IAC7D,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,mBAAmB;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAE1B,wCAAwC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAmCD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuDG;AACH,eAAO,MAAM,aAAa,GAAI,4HAW3B,kBAAkB,mDA+FpB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/components/layout/components/Notifications.js

@@ -113,7 +113,7 @@ const SIZE_VARIANTS = {
  * @since 0.0.1
  * @author AMBROISE PARK Consulting
  */
-export const Notifications = ({ notifications = [], count = 0, loading = false, onNotificationClick, onMarkAllRead, onDropdownOpen, className, maxVisible = 10, alwaysShow = false, size = 'md', disabled = false, }) => {
+export const Notifications = ({ notifications = [], count = 0, loading = false, onNotificationClick, onDropdownOpen, className, maxVisible = 10, alwaysShow = false, size = 'md', disabled = false, }) => {
     const sizeVariant = SIZE_VARIANTS[size];
     const shownNotificationIds = useRef(new Set());
     // Calculate display count (format large numbers)
@@ -159,6 +159,8 @@ export const Notifications = ({ notifications = [], count = 0, loading = false,
     return (_jsx("div", { className: cn(className), style: { position: 'relative' }, children: _jsx(Button, { disabled: disabled, style: {
                 ...sizeVariant.button,
                 position: 'relative',
+            }, onClick: () => {
+                onDropdownOpen?.();
             }, onFocus: (e) => {
                 e.currentTarget.style.outline = '2px solid var(--ring)';
                 e.currentTarget.style.outlineOffset = '2px';
@@ -167,7 +169,7 @@ export const Notifications = ({ notifications = [], count = 0, loading = false,
             }, "aria-label": `${count} notification${count !== 1 ? 's' : ''}`, icon: Bell, children: displayCount && (_jsx(Stack, { align: "center", justify: "center", style: {
                     position: 'absolute',
                     top: '-0.25rem',
-                    right: '-0.25rem',
+                    insetInlineEnd: '-0.25rem',
                     backgroundColor: 'var(--destructive)',
                     color: 'var(--destructive-foreground)',
                     borderRadius: 'var(--radius-full)',

package/dist/components/layout/components/header/AppBranding.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppBranding.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/components/header/AppBranding.tsx"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AAEH,OAAO,EAAM,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAMnD,MAAM,WAAW,gBAAgB;IAC/B;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,CAAC,OAAO,OAAO,CAAC,CAAC,MAAM,OAAO,OAAO,CAAC,CAAC;IACjD,8CAA8C;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,WAAW,GAAI,qCAIzB,gBAAgB,4CA2ClB,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"AppBranding.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/components/header/AppBranding.tsx"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AAEH,OAAO,EAAM,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAOnD,MAAM,WAAW,gBAAgB;IAC/B;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,CAAC,OAAO,OAAO,CAAC,CAAC,MAAM,OAAO,OAAO,CAAC,CAAC;IACjD,8CAA8C;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,WAAW,GAAI,qCAIzB,gBAAgB,4CA2ClB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/components/layout/components/header/AppBranding.js

@@ -13,6 +13,7 @@ import { cn, DISPLAY } from '@donotdev/components';
 import { useAppConfig } from '@donotdev/core';
 import { Link } from '../../../../routing/Link';
 import { AssetResolver } from '../../../../utils/assetResolver';
+import { sanitizeSvg } from '../../../../utils/sanitizeSvg';
 /**
  * AppBranding - Unified branding component
  *
@@ -42,7 +43,7 @@ export const AppBranding = ({ display = DISPLAY.AUTO, linkToHome = true, classNa
     const svgContent = AssetResolver.getLogoSvgContent();
     const logoPath = AssetResolver.resolveLogo();
     const showTitle = display === DISPLAY.FULL || display === DISPLAY.AUTO;
-    const logo = svgContent ? (_jsx("div", { className: "app-branding-logo", role: "img", "aria-label": displayTitle, dangerouslySetInnerHTML: { __html: svgContent } })) : AssetResolver.assetExists(logoPath) ? (_jsx("img", { src: logoPath, alt: displayTitle, className: "app-branding-logo" })) : null;
+    const logo = svgContent ? (_jsx("div", { className: "app-branding-logo", role: "img", "aria-label": displayTitle, dangerouslySetInnerHTML: { __html: sanitizeSvg(svgContent) } })) : AssetResolver.assetExists(logoPath) ? (_jsx("img", { src: logoPath, alt: displayTitle, className: "app-branding-logo" })) : null;
     const title = showTitle && (_jsx("span", { className: "app-branding-title", "data-display": display, children: displayTitle }));
     const content = (_jsxs("div", { className: cn('app-branding', className), "data-display": display, children: [logo, title] }));
     if (linkToHome) {

package/dist/components/layout/components/header/AppIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppIcon.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/components/header/AppIcon.tsx"],"names":[],"mappings":"AAkBA,MAAM,WAAW,YAAY;IAC3B,uDAAuD;IACvD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,iCAAiC;IACjC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,QAAQ,GAAG,MAAM,CAAC;IACrD,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAUD;;;;;;;;;;GAUG;AACH,eAAO,MAAM,OAAO,GAAI,0BAAqC,YAAY,4CA0CxE,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"AppIcon.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/components/header/AppIcon.tsx"],"names":[],"mappings":"AAmBA,MAAM,WAAW,YAAY;IAC3B,uDAAuD;IACvD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,iCAAiC;IACjC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,QAAQ,GAAG,MAAM,CAAC;IACrD,2BAA2B;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAUD;;;;;;;;;;GAUG;AACH,eAAO,MAAM,OAAO,GAAI,0BAAqC,YAAY,4CA2CxE,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/components/layout/components/header/AppIcon.js

@@ -13,6 +13,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from '@donotdev/components';
 import { useAppConfig } from '@donotdev/core';
 import { AssetResolver } from '../../../../utils/assetResolver';
+import { sanitizeSvg } from '../../../../utils/sanitizeSvg';
 const SIZE_STYLES = {
     sm: { width: 'var(--icon-md)', height: 'var(--icon-md)' },
     md: { width: 'var(--icon-touch)', height: 'var(--icon-touch)' },
@@ -32,7 +33,9 @@ const SIZE_STYLES = {
  * @author AMBROISE PARK Consulting
  */
 export const AppIcon = ({ alt, size = 'header', className }) => {
-    const resolvedAlt = alt || useAppConfig('name') || useAppConfig('shortName') || 'App';
+    const appName = useAppConfig('name');
+    const appShortName = useAppConfig('shortName');
+    const resolvedAlt = alt || appName || appShortName || 'App';
     const svgContent = AssetResolver.getLogoSvgContent();
     const logoPath = AssetResolver.resolveLogo();
     const sizeStyle = typeof size === 'string' && size in SIZE_STYLES
@@ -45,7 +48,7 @@ export const AppIcon = ({ alt, size = 'header', className }) => {
         return (_jsx("div", { className: cn('app-icon-header', className), style: {
                 display: 'inline-flex',
                 ...sizeStyle,
-            }, role: "img", "aria-label": resolvedAlt, dangerouslySetInnerHTML: { __html: svgContent } }));
+            }, role: "img", "aria-label": resolvedAlt, dangerouslySetInnerHTML: { __html: sanitizeSvg(svgContent) } }));
     }
     // Fallback to img tag if SVG content not available
     return (_jsx("img", { src: logoPath, alt: resolvedAlt, className: cn(className), style: {

package/dist/components/layout/components/header/CacheSettings.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CacheSettings.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/components/header/CacheSettings.tsx"],"names":[],"mappings":"AA0BA;;;;;;;;;GASG;AACH,iBAAS,aAAa,4CAqPrB;AAED,eAAe,aAAa,CAAC"}
+{"version":3,"file":"CacheSettings.d.ts","sourceRoot":"","sources":["../../../../../src/components/layout/components/header/CacheSettings.tsx"],"names":[],"mappings":"AA0BA;;;;;;;;;GASG;AACH,iBAAS,aAAa,4CAuPrB;AAED,eAAe,aAAa,CAAC"}