@omnitron-dev/prism 0.1.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 LuxQuant
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,44 @@
+# @omnitron-dev/prism
+
+> Design system constructor — high-level UI building blocks for complex frontends
+
+Part of the [Omni](../../README.md) monorepo — Fullstack Type-Safe RPC Framework.
+
+## Installation
+
+```bash
+pnpm add @omnitron-dev/prism
+```
+
+## Overview
+
+Prism is a design system built on MUI v7, providing pre-composed, theme-aware components for building production frontends. All reusable UI — layouts, forms, navigation, data display — lives here so that application code stays thin.
+
+### Key Features
+
+- **MUI v7 foundation** — themed components with full customization
+- **Layout system** — `DashboardLayout`, navigation items, sidebar, breadcrumbs
+- **Form components** — integrated with react-hook-form + zod validation
+- **Auth-aware** — components that respect authentication state
+- **OTP input** — standalone OTP code input component
+- **Avatar system** — default avatars, upload, presigned URL support
+
+## Usage
+
+```tsx
+import { PrismProvider, DashboardLayout } from '@omnitron-dev/prism';
+
+function App() {
+  return (
+    <PrismProvider>
+      <DashboardLayout navItems={items}>
+        <Outlet />
+      </DashboardLayout>
+    </PrismProvider>
+  );
+}
+```
+
+## License
+
+MIT

package/bin/prism.js

@@ -0,0 +1,13 @@
+#!/usr/bin/env node
+/**
+ * Prism CLI Entry Point
+ *
+ * @module @omnitron-dev/prism/cli
+ */
+
+import('../dist/cli/index.js').then(({ cli }) => {
+  cli().catch((error) => {
+    console.error('Error:', error.message);
+    process.exit(1);
+  });
+});

package/dist/accessibility/index.d.ts

@@ -0,0 +1,157 @@
+import { PropsWithChildren, ReactNode } from 'react';
+
+/**
+ * Vision Mode Accessibility System
+ *
+ * Simulates color vision deficiencies to help designers and developers
+ * test their applications for accessibility. Uses SVG color matrix filters
+ * applied globally to simulate how users with different types of color
+ * blindness perceive content.
+ *
+ * Vision Deficiency Types:
+ * - Protanopia: Red-blind (affects ~1% of males)
+ * - Deuteranopia: Green-blind (affects ~1% of males)
+ * - Tritanopia: Blue-blind (rare, affects <0.01% of population)
+ * - Achromatopsia: Complete color blindness (grayscale)
+ *
+ * @module @omnitron-dev/prism/accessibility
+ */
+
+/**
+ * Available vision modes for color blindness simulation.
+ */
+type VisionMode = 'normal' | 'protanopia' | 'deuteranopia' | 'tritanopia' | 'achromatopsia';
+/**
+ * Vision mode metadata for UI display.
+ */
+interface VisionModeOption {
+    /** Mode identifier */
+    value: VisionMode;
+    /** Human-readable label */
+    label: string;
+    /** Description of the vision deficiency */
+    description: string;
+    /** Percentage of population affected (for educational purposes) */
+    prevalence?: string;
+}
+/**
+ * Vision mode context value.
+ */
+interface VisionModeContextValue {
+    /** Current vision mode */
+    mode: VisionMode;
+    /** Set the vision mode */
+    setMode: (mode: VisionMode) => void;
+    /** Toggle between normal and a specific mode */
+    toggle: (mode?: VisionMode) => void;
+    /** Reset to normal vision */
+    reset: () => void;
+    /** Whether vision filters are active */
+    isFiltered: boolean;
+}
+/**
+ * Available vision mode options with descriptions.
+ */
+declare const VISION_MODE_OPTIONS: VisionModeOption[];
+/**
+ * Props for VisionModeProvider.
+ */
+interface VisionModeProviderProps extends PropsWithChildren {
+    /** Initial vision mode (default: 'normal' or from localStorage) */
+    defaultMode?: VisionMode;
+    /** Storage key for persistence (default: 'prism-vision-mode') */
+    storageKey?: string;
+    /** Disable persistence to localStorage */
+    disablePersistence?: boolean;
+    /** CSS selector attribute name (default: 'data-vision') */
+    attributeName?: string;
+}
+/**
+ * VisionModeProvider - Provides vision mode context and renders filters.
+ *
+ * @example
+ * ```tsx
+ * // In your app root
+ * import { VisionModeProvider } from '@omnitron-dev/prism/accessibility';
+ *
+ * function App() {
+ *   return (
+ *     <VisionModeProvider>
+ *       <YourApp />
+ *     </VisionModeProvider>
+ *   );
+ * }
+ *
+ * // In a component
+ * import { useVisionMode, VISION_MODE_OPTIONS } from '@omnitron-dev/prism/accessibility';
+ *
+ * function AccessibilityPanel() {
+ *   const { mode, setMode } = useVisionMode();
+ *
+ *   return (
+ *     <select value={mode} onChange={(e) => setMode(e.target.value as VisionMode)}>
+ *       {VISION_MODE_OPTIONS.map((option) => (
+ *         <option key={option.value} value={option.value}>
+ *           {option.label}
+ *         </option>
+ *       ))}
+ *     </select>
+ *   );
+ * }
+ * ```
+ */
+declare function VisionModeProvider({ children, defaultMode, storageKey, disablePersistence, attributeName, }: VisionModeProviderProps): ReactNode;
+/**
+ * useVisionMode - Hook to access vision mode context.
+ *
+ * @throws Error if used outside of VisionModeProvider
+ *
+ * @example
+ * ```tsx
+ * function AccessibilityToggle() {
+ *   const { mode, setMode, isFiltered, reset } = useVisionMode();
+ *
+ *   return (
+ *     <div>
+ *       <p>Current mode: {mode}</p>
+ *       <button onClick={() => setMode('protanopia')}>
+ *         Simulate Protanopia
+ *       </button>
+ *       {isFiltered && (
+ *         <button onClick={reset}>Reset to Normal</button>
+ *       )}
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+declare function useVisionMode(): VisionModeContextValue;
+/**
+ * Generate CSS styles for vision mode filters.
+ * Use this in your theme's CssBaseline or global styles.
+ *
+ * @param attributeName - The data attribute name (default: 'data-vision')
+ * @returns CSS styles object for MUI CssBaseline styleOverrides
+ *
+ * @example
+ * ```tsx
+ * // In your theme configuration
+ * import { getVisionModeStyles } from '@omnitron-dev/prism/accessibility';
+ *
+ * const theme = createTheme({
+ *   components: {
+ *     MuiCssBaseline: {
+ *       styleOverrides: (theme) => ({
+ *         ...getVisionModeStyles(),
+ *         // ... other styles
+ *       }),
+ *     },
+ *   },
+ * });
+ * ```
+ */
+declare function getVisionModeStyles(attributeName?: string): Record<string, {
+    filter: string;
+}>;
+
+export { VISION_MODE_OPTIONS, type VisionMode, type VisionModeContextValue, type VisionModeOption, VisionModeProvider, type VisionModeProviderProps, getVisionModeStyles, useVisionMode };

package/dist/accessibility/index.js

@@ -0,0 +1,186 @@
+import '../chunk-77KIJLPP.js';
+import { createContext, useState, useEffect, useCallback, useContext } from 'react';
+import { createPortal } from 'react-dom';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var STORAGE_KEY = "prism-vision-mode";
+var FILTER_CONTAINER_ID = "prism-vision-filters";
+var VISION_MODE_OPTIONS = [
+  {
+    value: "normal",
+    label: "Normal Vision",
+    description: "Shows all colors normally"
+  },
+  {
+    value: "protanopia",
+    label: "Protanopia",
+    description: "Difficulty distinguishing red from green (red-blind)",
+    prevalence: "~1% of males"
+  },
+  {
+    value: "deuteranopia",
+    label: "Deuteranopia",
+    description: "Difficulty distinguishing green from red (green-blind)",
+    prevalence: "~1% of males"
+  },
+  {
+    value: "tritanopia",
+    label: "Tritanopia",
+    description: "Difficulty distinguishing blue from yellow (blue-blind)",
+    prevalence: "<0.01%"
+  },
+  {
+    value: "achromatopsia",
+    label: "Achromatopsia",
+    description: "Complete color blindness (grayscale only)",
+    prevalence: "~0.003%"
+  }
+];
+var FILTER_MATRICES = {
+  // Protanopia: Reduced sensitivity to red light
+  protanopia: `
+    0.10889 0.89111 0.00000 0 0
+    0.10889 0.89111 0.00000 0 0
+    0.00447 -0.00447 1.00000 0 0
+    0 0 0 1 0
+  `,
+  // Deuteranopia: Reduced sensitivity to green light
+  deuteranopia: `
+    0.4251 0.6934 -0.1147 0 0
+    0.3417 0.5882 0.0692 0 0
+    -0.0105 0.0234 0.9870 0 0
+    0 0 0 1 0
+  `,
+  // Tritanopia: Reduced sensitivity to blue light
+  tritanopia: `
+    0.95 0.05 0 0 0
+    0 0.433 0.567 0 0
+    0 0.475 0.525 0 0
+    0 0 0 1 0
+  `,
+  // Achromatopsia: Complete color blindness (luminance only)
+  achromatopsia: `
+    0.299 0.587 0.114 0 0
+    0.299 0.587 0.114 0 0
+    0.299 0.587 0.114 0 0
+    0 0 0 1 0
+  `
+};
+function VisionFilters() {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      id: FILTER_CONTAINER_ID,
+      style: {
+        position: "absolute",
+        width: 0,
+        height: 0,
+        overflow: "hidden",
+        pointerEvents: "none"
+      },
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: /* @__PURE__ */ jsx("defs", { children: Object.entries(FILTER_MATRICES).map(([mode, matrix]) => /* @__PURE__ */ jsx("filter", { id: `${mode}-filter`, children: /* @__PURE__ */ jsx("feColorMatrix", { type: "matrix", in: "SourceGraphic", values: matrix }) }, mode)) }) })
+    }
+  );
+}
+var VisionModeContext = createContext(null);
+function VisionModeProvider({
+  children,
+  defaultMode,
+  storageKey = STORAGE_KEY,
+  disablePersistence = false,
+  attributeName = "data-vision"
+}) {
+  const [mode, setModeState] = useState(() => {
+    if (typeof window === "undefined") return defaultMode ?? "normal";
+    if (disablePersistence) return defaultMode ?? "normal";
+    try {
+      const stored = localStorage.getItem(storageKey);
+      if (stored) {
+        const parsed = JSON.parse(stored);
+        if (VISION_MODE_OPTIONS.some((opt) => opt.value === parsed)) {
+          return parsed;
+        }
+      }
+    } catch {
+    }
+    return defaultMode ?? "normal";
+  });
+  const [needsFilters, setNeedsFilters] = useState(false);
+  useEffect(() => {
+    if (typeof document !== "undefined" && !document.getElementById(FILTER_CONTAINER_ID)) {
+      setNeedsFilters(true);
+    }
+  }, []);
+  useEffect(() => {
+    if (typeof document === "undefined") return void 0;
+    if (mode === "normal") {
+      document.documentElement.removeAttribute(attributeName);
+    } else {
+      document.documentElement.setAttribute(attributeName, mode);
+    }
+    return () => {
+      document.documentElement.removeAttribute(attributeName);
+    };
+  }, [mode, attributeName]);
+  useEffect(() => {
+    if (disablePersistence || typeof localStorage === "undefined") return void 0;
+    try {
+      localStorage.setItem(storageKey, JSON.stringify(mode));
+    } catch {
+    }
+    return void 0;
+  }, [mode, storageKey, disablePersistence]);
+  useEffect(() => {
+    if (disablePersistence || typeof window === "undefined") return void 0;
+    const handleStorage = (e) => {
+      if (e.key !== storageKey || !e.newValue) return;
+      try {
+        const parsed = JSON.parse(e.newValue);
+        if (VISION_MODE_OPTIONS.some((opt) => opt.value === parsed)) {
+          setModeState(parsed);
+        }
+      } catch {
+      }
+    };
+    window.addEventListener("storage", handleStorage);
+    return () => window.removeEventListener("storage", handleStorage);
+  }, [storageKey, disablePersistence]);
+  const setMode = useCallback((newMode) => {
+    setModeState(newMode);
+  }, []);
+  const toggle = useCallback((targetMode = "protanopia") => {
+    setModeState((current) => current === "normal" ? targetMode : "normal");
+  }, []);
+  const reset = useCallback(() => {
+    setModeState("normal");
+  }, []);
+  const value = {
+    mode,
+    setMode,
+    toggle,
+    reset,
+    isFiltered: mode !== "normal"
+  };
+  return /* @__PURE__ */ jsxs(VisionModeContext.Provider, { value, children: [
+    needsFilters && typeof document !== "undefined" && document.body ? createPortal(/* @__PURE__ */ jsx(VisionFilters, {}), document.body) : null,
+    children
+  ] });
+}
+function useVisionMode() {
+  const context = useContext(VisionModeContext);
+  if (!context) {
+    throw new Error("useVisionMode must be used within a VisionModeProvider");
+  }
+  return context;
+}
+function getVisionModeStyles(attributeName = "data-vision") {
+  const modes = ["protanopia", "deuteranopia", "tritanopia", "achromatopsia"];
+  return Object.fromEntries(
+    modes.map((mode) => [`html[${attributeName}="${mode}"]:not([data-showcase])`, { filter: `url("#${mode}-filter")` }])
+  );
+}
+
+export { VISION_MODE_OPTIONS, VisionModeProvider, getVisionModeStyles, useVisionMode };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/accessibility/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/accessibility/vision-mode.tsx"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["'use client';\n\n/**\n * Vision Mode Accessibility System\n *\n * Simulates color vision deficiencies to help designers and developers\n * test their applications for accessibility. Uses SVG color matrix filters\n * applied globally to simulate how users with different types of color\n * blindness perceive content.\n *\n * Vision Deficiency Types:\n * - Protanopia: Red-blind (affects ~1% of males)\n * - Deuteranopia: Green-blind (affects ~1% of males)\n * - Tritanopia: Blue-blind (rare, affects <0.01% of population)\n * - Achromatopsia: Complete color blindness (grayscale)\n *\n * @module @omnitron-dev/prism/accessibility\n */\n\nimport {\n  createContext,\n  useContext,\n  useState,\n  useEffect,\n  useCallback,\n  type PropsWithChildren,\n  type ReactNode,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\n// =============================================================================\n// TYPES\n// =============================================================================\n\n/**\n * Available vision modes for color blindness simulation.\n */\nexport type VisionMode = 'normal' | 'protanopia' | 'deuteranopia' | 'tritanopia' | 'achromatopsia';\n\n/**\n * Vision mode metadata for UI display.\n */\nexport interface VisionModeOption {\n  /** Mode identifier */\n  value: VisionMode;\n  /** Human-readable label */\n  label: string;\n  /** Description of the vision deficiency */\n  description: string;\n  /** Percentage of population affected (for educational purposes) */\n  prevalence?: string;\n}\n\n/**\n * Vision mode context value.\n */\nexport interface VisionModeContextValue {\n  /** Current vision mode */\n  mode: VisionMode;\n  /** Set the vision mode */\n  setMode: (mode: VisionMode) => void;\n  /** Toggle between normal and a specific mode */\n  toggle: (mode?: VisionMode) => void;\n  /** Reset to normal vision */\n  reset: () => void;\n  /** Whether vision filters are active */\n  isFiltered: boolean;\n}\n\n// =============================================================================\n// CONSTANTS\n// =============================================================================\n\nconst STORAGE_KEY = 'prism-vision-mode';\nconst FILTER_CONTAINER_ID = 'prism-vision-filters';\n\n/**\n * Available vision mode options with descriptions.\n */\nexport const VISION_MODE_OPTIONS: VisionModeOption[] = [\n  {\n    value: 'normal',\n    label: 'Normal Vision',\n    description: 'Shows all colors normally',\n  },\n  {\n    value: 'protanopia',\n    label: 'Protanopia',\n    description: 'Difficulty distinguishing red from green (red-blind)',\n    prevalence: '~1% of males',\n  },\n  {\n    value: 'deuteranopia',\n    label: 'Deuteranopia',\n    description: 'Difficulty distinguishing green from red (green-blind)',\n    prevalence: '~1% of males',\n  },\n  {\n    value: 'tritanopia',\n    label: 'Tritanopia',\n    description: 'Difficulty distinguishing blue from yellow (blue-blind)',\n    prevalence: '<0.01%',\n  },\n  {\n    value: 'achromatopsia',\n    label: 'Achromatopsia',\n    description: 'Complete color blindness (grayscale only)',\n    prevalence: '~0.003%',\n  },\n];\n\n// =============================================================================\n// SVG FILTERS\n// =============================================================================\n\n/**\n * Color matrix values for vision deficiency simulation.\n * These matrices transform colors to simulate how they appear to people\n * with various types of color blindness.\n */\nconst FILTER_MATRICES = {\n  // Protanopia: Reduced sensitivity to red light\n  protanopia: `\n    0.10889 0.89111 0.00000 0 0\n    0.10889 0.89111 0.00000 0 0\n    0.00447 -0.00447 1.00000 0 0\n    0 0 0 1 0\n  `,\n  // Deuteranopia: Reduced sensitivity to green light\n  deuteranopia: `\n    0.4251 0.6934 -0.1147 0 0\n    0.3417 0.5882 0.0692 0 0\n    -0.0105 0.0234 0.9870 0 0\n    0 0 0 1 0\n  `,\n  // Tritanopia: Reduced sensitivity to blue light\n  tritanopia: `\n    0.95 0.05 0 0 0\n    0 0.433 0.567 0 0\n    0 0.475 0.525 0 0\n    0 0 0 1 0\n  `,\n  // Achromatopsia: Complete color blindness (luminance only)\n  achromatopsia: `\n    0.299 0.587 0.114 0 0\n    0.299 0.587 0.114 0 0\n    0.299 0.587 0.114 0 0\n    0 0 0 1 0\n  `,\n} as const;\n\n/**\n * SVG filters for vision mode simulation.\n * Rendered as a hidden element and referenced by CSS.\n */\nfunction VisionFilters(): ReactNode {\n  return (\n    <div\n      id={FILTER_CONTAINER_ID}\n      style={{\n        position: 'absolute',\n        width: 0,\n        height: 0,\n        overflow: 'hidden',\n        pointerEvents: 'none',\n      }}\n      aria-hidden=\"true\"\n    >\n      <svg xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\">\n        <defs>\n          {Object.entries(FILTER_MATRICES).map(([mode, matrix]) => (\n            <filter key={mode} id={`${mode}-filter`}>\n              <feColorMatrix type=\"matrix\" in=\"SourceGraphic\" values={matrix} />\n            </filter>\n          ))}\n        </defs>\n      </svg>\n    </div>\n  );\n}\n\n// =============================================================================\n// CONTEXT\n// =============================================================================\n\nconst VisionModeContext = createContext<VisionModeContextValue | null>(null);\n\n// =============================================================================\n// PROVIDER\n// =============================================================================\n\n/**\n * Props for VisionModeProvider.\n */\nexport interface VisionModeProviderProps extends PropsWithChildren {\n  /** Initial vision mode (default: 'normal' or from localStorage) */\n  defaultMode?: VisionMode;\n  /** Storage key for persistence (default: 'prism-vision-mode') */\n  storageKey?: string;\n  /** Disable persistence to localStorage */\n  disablePersistence?: boolean;\n  /** CSS selector attribute name (default: 'data-vision') */\n  attributeName?: string;\n}\n\n/**\n * VisionModeProvider - Provides vision mode context and renders filters.\n *\n * @example\n * ```tsx\n * // In your app root\n * import { VisionModeProvider } from '@omnitron-dev/prism/accessibility';\n *\n * function App() {\n *   return (\n *     <VisionModeProvider>\n *       <YourApp />\n *     </VisionModeProvider>\n *   );\n * }\n *\n * // In a component\n * import { useVisionMode, VISION_MODE_OPTIONS } from '@omnitron-dev/prism/accessibility';\n *\n * function AccessibilityPanel() {\n *   const { mode, setMode } = useVisionMode();\n *\n *   return (\n *     <select value={mode} onChange={(e) => setMode(e.target.value as VisionMode)}>\n *       {VISION_MODE_OPTIONS.map((option) => (\n *         <option key={option.value} value={option.value}>\n *           {option.label}\n *         </option>\n *       ))}\n *     </select>\n *   );\n * }\n * ```\n */\nexport function VisionModeProvider({\n  children,\n  defaultMode,\n  storageKey = STORAGE_KEY,\n  disablePersistence = false,\n  attributeName = 'data-vision',\n}: VisionModeProviderProps): ReactNode {\n  // Initialize from localStorage or default\n  const [mode, setModeState] = useState<VisionMode>(() => {\n    if (typeof window === 'undefined') return defaultMode ?? 'normal';\n    if (disablePersistence) return defaultMode ?? 'normal';\n\n    try {\n      const stored = localStorage.getItem(storageKey);\n      if (stored) {\n        const parsed = JSON.parse(stored) as VisionMode;\n        if (VISION_MODE_OPTIONS.some((opt) => opt.value === parsed)) {\n          return parsed;\n        }\n      }\n    } catch {\n      // Ignore localStorage errors\n    }\n    return defaultMode ?? 'normal';\n  });\n\n  const [needsFilters, setNeedsFilters] = useState(false);\n\n  // Check if filters need to be rendered\n  useEffect(() => {\n    if (typeof document !== 'undefined' && !document.getElementById(FILTER_CONTAINER_ID)) {\n      setNeedsFilters(true);\n    }\n  }, []);\n\n  // Apply data attribute to document element\n  useEffect(() => {\n    if (typeof document === 'undefined') return undefined;\n\n    if (mode === 'normal') {\n      document.documentElement.removeAttribute(attributeName);\n    } else {\n      document.documentElement.setAttribute(attributeName, mode);\n    }\n\n    return () => {\n      document.documentElement.removeAttribute(attributeName);\n    };\n  }, [mode, attributeName]);\n\n  // Persist to localStorage\n  useEffect(() => {\n    if (disablePersistence || typeof localStorage === 'undefined') return undefined;\n\n    try {\n      localStorage.setItem(storageKey, JSON.stringify(mode));\n    } catch {\n      // Ignore localStorage errors\n    }\n    return undefined;\n  }, [mode, storageKey, disablePersistence]);\n\n  // Cross-tab sync via storage event\n  useEffect(() => {\n    if (disablePersistence || typeof window === 'undefined') return undefined;\n\n    const handleStorage = (e: StorageEvent) => {\n      if (e.key !== storageKey || !e.newValue) return;\n      try {\n        const parsed = JSON.parse(e.newValue) as VisionMode;\n        if (VISION_MODE_OPTIONS.some((opt) => opt.value === parsed)) {\n          setModeState(parsed);\n        }\n      } catch {\n        // Ignore parse errors\n      }\n    };\n\n    window.addEventListener('storage', handleStorage);\n    return () => window.removeEventListener('storage', handleStorage);\n  }, [storageKey, disablePersistence]);\n\n  const setMode = useCallback((newMode: VisionMode) => {\n    setModeState(newMode);\n  }, []);\n\n  const toggle = useCallback((targetMode: VisionMode = 'protanopia') => {\n    setModeState((current) => (current === 'normal' ? targetMode : 'normal'));\n  }, []);\n\n  const reset = useCallback(() => {\n    setModeState('normal');\n  }, []);\n\n  const value: VisionModeContextValue = {\n    mode,\n    setMode,\n    toggle,\n    reset,\n    isFiltered: mode !== 'normal',\n  };\n\n  return (\n    <VisionModeContext.Provider value={value}>\n      {needsFilters && typeof document !== 'undefined' && document.body\n        ? createPortal(<VisionFilters />, document.body)\n        : null}\n      {children}\n    </VisionModeContext.Provider>\n  );\n}\n\n// =============================================================================\n// HOOK\n// =============================================================================\n\n/**\n * useVisionMode - Hook to access vision mode context.\n *\n * @throws Error if used outside of VisionModeProvider\n *\n * @example\n * ```tsx\n * function AccessibilityToggle() {\n *   const { mode, setMode, isFiltered, reset } = useVisionMode();\n *\n *   return (\n *     <div>\n *       <p>Current mode: {mode}</p>\n *       <button onClick={() => setMode('protanopia')}>\n *         Simulate Protanopia\n *       </button>\n *       {isFiltered && (\n *         <button onClick={reset}>Reset to Normal</button>\n *       )}\n *     </div>\n *   );\n * }\n * ```\n */\nexport function useVisionMode(): VisionModeContextValue {\n  const context = useContext(VisionModeContext);\n\n  if (!context) {\n    throw new Error('useVisionMode must be used within a VisionModeProvider');\n  }\n\n  return context;\n}\n\n// =============================================================================\n// CSS STYLES HELPER\n// =============================================================================\n\n/**\n * Generate CSS styles for vision mode filters.\n * Use this in your theme's CssBaseline or global styles.\n *\n * @param attributeName - The data attribute name (default: 'data-vision')\n * @returns CSS styles object for MUI CssBaseline styleOverrides\n *\n * @example\n * ```tsx\n * // In your theme configuration\n * import { getVisionModeStyles } from '@omnitron-dev/prism/accessibility';\n *\n * const theme = createTheme({\n *   components: {\n *     MuiCssBaseline: {\n *       styleOverrides: (theme) => ({\n *         ...getVisionModeStyles(),\n *         // ... other styles\n *       }),\n *     },\n *   },\n * });\n * ```\n */\nexport function getVisionModeStyles(attributeName = 'data-vision'): Record<string, { filter: string }> {\n  const modes: Array<Exclude<VisionMode, 'normal'>> = ['protanopia', 'deuteranopia', 'tritanopia', 'achromatopsia'];\n\n  return Object.fromEntries(\n    modes.map((mode) => [`html[${attributeName}=\"${mode}\"]:not([data-showcase])`, { filter: `url(\"#${mode}-filter\")` }])\n  ) as Record<string, { filter: string }>;\n}\n"]}