npm - origam - Versions diffs - 2.5.0 → 2.6.2 - Mend

origam 2.5.0 → 2.6.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (532) hide show

package/dist/src/interfaces/Theme/origam-theme.interface.d.ts ADDED Viewed

@@ -0,0 +1,114 @@
+import type { IThemeVars, TThemeVars } from '../../types';
+import type { TMode } from '../../types/Theme/theme.type';
+import type { IDefault } from '../DefaultProvider/default-provider.interface';
+/**
+ * Runtime theme object ingested by `createOrigam({ themes })`. At install time
+ * the DS resolves it to a block of `--origam-*` CSS variables injected into
+ * `<head>`, scoped to `:root` (or `[data-theme="<name>"]` when `name` is set,
+ * optionally narrowed by `[data-mode]` when `mode` is set).
+ *
+ * ## A theme has exactly THREE authoring surfaces
+ *
+ * 1. **`vars`** — the design tokens (the normal path). Plain nested JSON keyed
+ *    by token GROUP (`color` / `rounded` / `border` / `typo` / `shadow` /
+ *    `spacing` / `motion`). No `--origam-*` prefixes, no DTCG ceremony: the DS
+ *    walks each tree and derives the CSS-variable name from the leaf path, so a
+ *    hand-written theme resolves to the EXACT same `--origam-*` names as the
+ *    published token sheets.
+ *
+ * 2. **`cssVars`** — the escape hatch. A flat map of raw `--origam-*` custom
+ *    properties, for the rare var that has no group slot in `vars`.
+ *
+ * 3. **`component`** — per-component DEFAULT PROPS (not CSS): `{ global, 'origam-btn', … }`.
+ *
+ * ```ts
+ * {
+ *   name: 'sobre', mode: 'light', label: 'Sobre',
+ *   vars: {
+ *     color:   { surface: { default: '#ffffff' }, text: { primary: '#171717', secondary: '#525252' },
+ *                action: { primary: { bg: '#7c3aed', fg: '#ffffff' } } },
+ *     rounded: { md: '10px', lg: '14px' },
+ *     typo:    { family: { sans: 'Inter, sans-serif' } },
+ *     shadow:  { md: '0 2px 8px rgba(0,0,0,.12)' }
+ *   },
+ *   components: { 'origam-btn': { variant: 'flat', color: 'primary' } }
+ * }
+ * ```
+ *
+ * A COLOR slot accepts any CSS color OR a gradient (a gradient is an ordinary
+ * color value). Everything is plain JSON so a Theme Builder export round-trips
+ * without loss.
+ */
+export interface IOrigamTheme {
+    /**
+     * Brand name. When set, the injected variables are scoped to
+     * `[data-theme="<name>"]` instead of `:root`, so the theme activates only
+     * when `data-theme` matches (set it via `useTheme().setTheme(name)`).
+     */
+    name?: string;
+    /**
+     * Color mode this variable block applies to. When set alongside `name`,
+     * the selector becomes `[data-theme="<name>"][data-mode="<mode>"]`. When
+     * set without `name`, it becomes `[data-mode="<mode>"]`.
+     */
+    mode?: TMode;
+    /**
+     * Human-readable brand label for UI (e.g. a theme switcher). Falls back to
+     * `name` when absent. Surfaced through `useInstalledThemes()`.
+     */
+    label?: string;
+    /**
+     * Short brand description for UI (e.g. a switcher subtitle). Surfaced
+     * through `useInstalledThemes()`.
+     */
+    description?: string;
+    /**
+     * CSS background value for a brand swatch preview (a solid color or a
+     * `linear-gradient(...)`). Surfaced through `useInstalledThemes()` so a
+     * switcher can render a preview without a hard-coded metadata map.
+     */
+    swatch?: string;
+    /**
+     * THE token-configuration bucket — the normal way to author a theme's
+     * design tokens. Nested JSON keyed by token GROUP; each group's tree
+     * resolves to its `--origam-*` namespace via the shared naming grammar
+     * (see `IThemeVars`):
+     *   - `color`   → `--origam-color-*`   (`color.surface.default`, `color.action.primary.bg`, …)
+     *   - `rounded` → `--origam-radius-*`  (`rounded.md`, `rounded.lg`, …)
+     *   - `border`  → `--origam-border-*`  (`border.width.thin`, …)
+     *   - `typo`    → `--origam-font-*`    (`typo.family.sans`, `typo.size.md`, …)
+     *   - `shadow`  → `--origam-shadow-*`  (`shadow.md`, …)
+     *   - `spacing` → `--origam-space-*`   (`spacing.4`, …)
+     *   - `motion`  → `--origam-motion-*`  (`motion.duration.fast`, …)
+     *
+     * A color leaf accepts any CSS color OR a gradient (no dedicated gradient group).
+     */
+    vars?: IThemeVars;
+    /**
+     * ESCAPE HATCH — pre-resolved raw `--origam-*` custom-property map. Keys
+     * with or without the leading `--` are accepted. Use ONLY for a raw var
+     * that has no group slot in `vars`. Wins over `vars` on key collision.
+     *
+     *   cssVars: { '--origam-some-unmapped-var': '...' }
+     */
+    cssVars?: TThemeVars;
+    /**
+     * Per-component DEFAULT PROPS layer. Keyed by `global` (applies to every
+     * component) or by a component's kebab-case instance name (e.g.
+     * `'origam-btn'`, `'origam-card'`), exactly like `<OrigamDefaultsProvider>`.
+     *
+     * `createOrigam` collapses the `component` maps of the ACTIVE brand×mode
+     * themes into a single `IDefault` and provides it under
+     * `ORIGAM_DEFAULTS_KEY`, so a component rendered with no explicit prop
+     * inherits the theme's default. This is the "look comes from the theme,
+     * not from hard-coded `withDefaults`" mechanism.
+     *
+     * @example
+     * components: {
+     *   global:        { density: 'comfortable' },
+     *   'origam-btn':  { color: 'primary', rounded: 0 },
+     *   'origam-card': { rounded: 'lg', elevation: 2 }
+     * }
+     */
+    components?: IDefault;
+}

package/dist/src/interfaces/Theme/origam-theme.interface.js ADDED Viewed

File without changes

package/dist/src/interfaces/Timeline/timeline.interface.d.ts CHANGED Viewed

@@ -37,7 +37,7 @@ export interface ITimelineProps extends ICommonsComponentProps, ITagProps, IColo
     truncateLine?: boolean;
     ariaLabel?: string;
 }
-export interface ITimelineItemProps extends ICommonsComponentProps, IColorProps {
+export interface ITimelineItemProps extends ICommonsComponentProps, IColorProps, IDensityProps, ISizeProps {
     title?: string;
     subtitle?: string;
     icon?: TIcon;

package/dist/src/interfaces/Title/title.interface.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import type { IBorderProps, IBgColorProps, IColorProps, ICommonsComponentProps, IDensityProps, IMarginProps, IPaddingProps, ITagProps } from '../../interfaces';
-export interface ITitleProps extends ITagProps, ICommonsComponentProps, IColorProps, IBgColorProps, IDensityProps, IPaddingProps, IMarginProps, IBorderProps {
+import type { IBorderProps, IBgColorProps, IColorProps, ICommonsComponentProps, IDensityProps, IMarginProps, IPaddingProps, ITagProps, ITypographyProps } from '../../interfaces';
+export interface ITitleProps extends ITagProps, ICommonsComponentProps, IColorProps, IBgColorProps, IDensityProps, IPaddingProps, IMarginProps, IBorderProps, ITypographyProps {
     text?: string;
 }

package/dist/src/interfaces/Toolbar/toolbar.interface.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import type { IActiveProps, IBgColorProps, IBorderProps, IColorProps, ICommonsComponentProps, IDensityProps, IDimensionProps, IElevationProps, IHoverProps, IMarginProps, IPaddingProps, IPositionProps, IRoundedProps, ITagProps } from '../../interfaces';
-export interface IToolbarProps extends ITagProps, ICommonsComponentProps, IBorderProps, IRoundedProps, IElevationProps, IDensityProps, IColorProps, IBgColorProps, IPaddingProps, IMarginProps, IPositionProps, IDimensionProps, IActiveProps, IHoverProps {
+import type { IActiveProps, IBgColorProps, IBorderProps, IColorProps, ICommonsComponentProps, IDensityProps, IDimensionProps, IElevationProps, IHoverProps, IMarginProps, IPaddingProps, IPositionProps, IRoundedProps, ITagProps, ITypographyProps } from '../../interfaces';
+export interface IToolbarProps extends ITagProps, ICommonsComponentProps, IBorderProps, IRoundedProps, IElevationProps, IDensityProps, IColorProps, IBgColorProps, IPaddingProps, IMarginProps, IPositionProps, IDimensionProps, IActiveProps, IHoverProps, ITypographyProps {
     collapse?: boolean;
     flat?: boolean;
     floating?: boolean;

package/dist/src/interfaces/Tooltip/tooltip.interface.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import type { IActivatorProps, IBgColorProps, IColorProps, ICommonsComponentEmits, ICommonsComponentProps, IDimensionProps, ILazyProps, ILocationStrategyProps, IOverlayProps, IScrimProps, IScrollStrategyProps, ITransitionComponentProps } from '../../interfaces';
-export interface ITooltipProps extends ICommonsComponentProps, IOverlayProps, IColorProps, IBgColorProps, IDimensionProps, IActivatorProps, ILocationStrategyProps, IScrollStrategyProps, ILazyProps, ITransitionComponentProps, IScrimProps {
+import type { IActivatorProps, IBgColorProps, IColorProps, ICommonsComponentEmits, ICommonsComponentProps, IDimensionProps, ILazyProps, ILocationStrategyProps, IOverlayProps, IScrimProps, IScrollStrategyProps, ITransitionComponentProps, ITypographyProps } from '../../interfaces';
+export interface ITooltipProps extends ICommonsComponentProps, IOverlayProps, IColorProps, IBgColorProps, IDimensionProps, IActivatorProps, ILocationStrategyProps, IScrollStrategyProps, ILazyProps, ITransitionComponentProps, IScrimProps, ITypographyProps {
     id?: string;
     text?: string;
 }

package/dist/src/interfaces/Video/video.interface.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import type { Ref } from 'vue';
-import type { IBgColorProps, IBorderProps, IColorProps, ICommonsComponentProps, IDimensionProps, IElevationProps, IMarginProps, IMediaPlayerEmits, IMediaPlayerMethods, IMediaPlayerState, IPaddingProps, IRoundedProps, IUseMediaPlayerOptions, IVideoSource, IVideoTrack } from '../../interfaces';
+import type { IBgColorProps, IBorderProps, IColorProps, ICommonsComponentProps, IDimensionProps, IElevationProps, IMarginProps, IMediaPlayerEmits, IMediaPlayerMethods, IMediaPlayerState, IPaddingProps, IRoundedProps, ITypographyProps, IUseMediaPlayerOptions, IVideoSource, IVideoTrack } from '../../interfaces';
 import type { TVideoControls } from '../../types';
 /**
  * Bindings passed to the `#controls` scoped slot of `<OrigamVideo>`.
@@ -71,7 +71,7 @@ export interface IVideoSlots {
 /**
  * Props for `<OrigamVideo>`.
  */
-export interface IVideoProps extends ICommonsComponentProps, IColorProps, IBgColorProps, IDimensionProps, IRoundedProps, IBorderProps, IMarginProps, IPaddingProps, IElevationProps {
+export interface IVideoProps extends ICommonsComponentProps, IColorProps, IBgColorProps, IDimensionProps, IRoundedProps, IBorderProps, IMarginProps, IPaddingProps, IElevationProps, ITypographyProps {
     /**
      * Media URL — either a single string for `<video src>`, or an array
      * of `<source>` descriptors when multiple formats are provided. The

package/dist/src/interfaces/Window/window.interface.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
-import type { IBorderProps, ICommonsComponentEmits, ICommonsComponentProps, IDirectionProps, IElevationProps, IMarginProps, IPaddingProps, IRoundedProps, ITagProps, ITouchHandlers } from '../../interfaces';
+import type { IActiveProps, IBgColorProps, IBorderProps, ICommonsComponentEmits, ICommonsComponentProps, IDirectionProps, IElevationProps, IHoverProps, IMarginProps, IPaddingProps, IRoundedProps, ITagProps, ITouchHandlers } from '../../interfaces';
 import type { TIcon } from '../../types';
 import type { ComputedRef, Ref } from 'vue';
-export interface IWindowProps extends ICommonsComponentProps, ITagProps, IDirectionProps, IBorderProps, IPaddingProps, IMarginProps, IRoundedProps, IElevationProps {
+export interface IWindowProps extends ICommonsComponentProps, ITagProps, IDirectionProps, IBorderProps, IPaddingProps, IMarginProps, IRoundedProps, IElevationProps, IBgColorProps, IHoverProps, IActiveProps {
     continuous?: boolean;
     nextIcon?: TIcon;
     prevIcon?: TIcon;

package/dist/src/interfaces/index.cjs CHANGED Viewed

@@ -14,6 +14,17 @@ Object.keys(_alert).forEach(function (key) {
     }
   });
 });
+var _app = require("./App/app.interface.cjs");
+Object.keys(_app).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _app[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _app[key];
+    }
+  });
+});
 var _appBar = require("./App/app-bar.interface.cjs");
 Object.keys(_appBar).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -1015,6 +1026,17 @@ Object.keys(_touch).forEach(function (key) {
     }
   });
 });
+var _typography = require("./Commons/typography.interface.cjs");
+Object.keys(_typography).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _typography[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _typography[key];
+    }
+  });
+});
 var _validation = require("./Commons/validation.interface.cjs");
 Object.keys(_validation).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -2478,6 +2500,17 @@ Object.keys(_nuxtModule).forEach(function (key) {
     }
   });
 });
+var _origamTheme = require("./Theme/origam-theme.interface.cjs");
+Object.keys(_origamTheme).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _origamTheme[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _origamTheme[key];
+    }
+  });
+});
 var _qrCode = require("./QrCode/qr-code.interface.cjs");
 Object.keys(_qrCode).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/dist/src/interfaces/index.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
 export * from './Alert/alert.interface';
+export * from './App/app.interface';
 export * from './App/app-bar.interface';
 export * from './Avatar/avatar.interface';
 export * from './Avatar/avatar-group.interface';
@@ -90,6 +91,7 @@ export * from './Commons/status.interface';
 export * from './Commons/sticky.interface';
 export * from './Commons/style.interface';
 export * from './Commons/touch.interface';
+export * from './Commons/typography.interface';
 export * from './Commons/validation.interface';
 export * from './Commons/virtual.interface';
 export * from './ContextualMenu/contextual-menu.interface';
@@ -223,6 +225,7 @@ export * from './Timeline/timeline.interface';
 export * from './Treeview/treeview.interface';
 export * from './Mask/mask-options.interface';
 export * from './Nuxt/nuxt-module.interface';
+export * from './Theme/origam-theme.interface';
 export * from './QrCode/qr-code.interface';
 export * from './QrCode/qr-code-logo.interface';
 export * from './Watermark/watermark.interface';

package/dist/src/interfaces/index.js CHANGED Viewed

@@ -1,4 +1,5 @@
 export * from "./Alert/alert.interface.js";
+export * from "./App/app.interface.js";
 export * from "./App/app-bar.interface.js";
 export * from "./Avatar/avatar.interface.js";
 export * from "./Avatar/avatar-group.interface.js";
@@ -90,6 +91,7 @@ export * from "./Commons/status.interface.js";
 export * from "./Commons/sticky.interface.js";
 export * from "./Commons/style.interface.js";
 export * from "./Commons/touch.interface.js";
+export * from "./Commons/typography.interface.js";
 export * from "./Commons/validation.interface.js";
 export * from "./Commons/virtual.interface.js";
 export * from "./ContextualMenu/contextual-menu.interface.js";
@@ -223,6 +225,7 @@ export * from "./Timeline/timeline.interface.js";
 export * from "./Treeview/treeview.interface.js";
 export * from "./Mask/mask-options.interface.js";
 export * from "./Nuxt/nuxt-module.interface.js";
+export * from "./Theme/origam-theme.interface.js";
 export * from "./QrCode/qr-code.interface.js";
 export * from "./QrCode/qr-code-logo.interface.js";
 export * from "./Watermark/watermark.interface.js";

package/dist/src/nuxt/module.cjs CHANGED Viewed

@@ -4,18 +4,36 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
+var _nodeFs = require("node:fs");
+var _nodePath = require("node:path");
 var _kit = require("@nuxt/kit");
 const MODULE_NAME = "origam-nuxt";
 const CONFIG_KEY = "origam";
+const NUXT_COMPOSABLES_BLOCKLIST = /* @__PURE__ */new Set(["useRoute", "useRouter", "useLink", "useHydration"]);
+const DEFAULT_THEMES = [];
+const DEFAULT_MODES = ["light", "dark"];
 const DEFAULTS = {
-  themes: ["light", "dark"],
+  themes: DEFAULT_THEMES,
   defaultTheme: "auto",
+  modes: DEFAULT_MODES,
+  defaultMode: "auto",
   cookieName: "origam-theme",
+  modeCookieName: "origam-mode",
   cookieMaxAge: 60 * 60 * 24 * 365,
   autoImport: true,
   includeUtilities: true,
   prefix: "Origam"
 };
+const SCALAR_DEFAULTS = {
+  defaultTheme: DEFAULTS.defaultTheme,
+  defaultMode: DEFAULTS.defaultMode,
+  cookieName: DEFAULTS.cookieName,
+  modeCookieName: DEFAULTS.modeCookieName,
+  cookieMaxAge: DEFAULTS.cookieMaxAge,
+  autoImport: DEFAULTS.autoImport,
+  includeUtilities: DEFAULTS.includeUtilities,
+  prefix: DEFAULTS.prefix
+};
 module.exports = (0, _kit.defineNuxtModule)({
   meta: {
     name: MODULE_NAME,
@@ -24,12 +42,15 @@ module.exports = (0, _kit.defineNuxtModule)({
       nuxt: "^3.0.0 || ^4.0.0"
     }
   },
-  defaults: DEFAULTS,
+  defaults: SCALAR_DEFAULTS,
   setup(options, nuxt) {
     const resolver = (0, _kit.createResolver)(require('url').pathToFileURL(__filename).toString());
-    const themes = options.themes ?? DEFAULTS.themes;
+    const themes = options.themes ?? DEFAULT_THEMES;
     const defaultTheme = options.defaultTheme ?? DEFAULTS.defaultTheme;
+    const modes = options.modes ?? DEFAULT_MODES;
+    const defaultMode = options.defaultMode ?? DEFAULTS.defaultMode;
     const cookieName = options.cookieName ?? DEFAULTS.cookieName;
+    const modeCookieName = options.modeCookieName ?? DEFAULTS.modeCookieName;
     const cookieMaxAge = options.cookieMaxAge ?? DEFAULTS.cookieMaxAge;
     const autoImport = options.autoImport ?? DEFAULTS.autoImport;
     const includeUtilities = options.includeUtilities ?? DEFAULTS.includeUtilities;
@@ -37,10 +58,9 @@ module.exports = (0, _kit.defineNuxtModule)({
     if (!nuxt.options.css.includes("origam/tokens/css/primitive")) {
       nuxt.options.css.unshift("origam/tokens/css/primitive");
     }
-    for (const theme of themes) {
-      const cssId = `origam/tokens/css/${theme}`;
-      if (!nuxt.options.css.includes(cssId)) {
-        nuxt.options.css.push(cssId);
+    for (const sheet of ["origam/tokens/css/light", "origam/tokens/css/dark"]) {
+      if (!nuxt.options.css.includes(sheet)) {
+        nuxt.options.css.push(sheet);
       }
     }
     if (includeUtilities && !nuxt.options.css.includes("origam/tokens/css/utilities")) {
@@ -55,7 +75,52 @@ module.exports = (0, _kit.defineNuxtModule)({
       mode: "client"
     });
     if (autoImport) {
-      (0, _kit.addImportsDir)(resolver.resolve("../composables"));
+      const composablesRoot = resolver.resolve("../composables");
+      const exportNameRegex = /export\s+(?:async\s+)?(?:function|const|let|var)\s+([A-Za-z_$][\w$]*)/g;
+      const collect = (dir, acc) => {
+        let entries;
+        try {
+          entries = (0, _nodeFs.readdirSync)(dir);
+        } catch {
+          return;
+        }
+        for (const entry of entries) {
+          const full = (0, _nodePath.join)(dir, entry);
+          let s;
+          try {
+            s = (0, _nodeFs.statSync)(full);
+          } catch {
+            continue;
+          }
+          if (s.isDirectory()) {
+            collect(full, acc);
+            continue;
+          }
+          if (!/\.(?:m?js|ts)$/.test(entry)) continue;
+          if (entry.endsWith(".d.ts")) continue;
+          let src = "";
+          try {
+            src = (0, _nodeFs.readFileSync)(full, "utf-8");
+          } catch {
+            continue;
+          }
+          let m;
+          exportNameRegex.lastIndex = 0;
+          while (m = exportNameRegex.exec(src)) {
+            const name = m[1];
+            if (NUXT_COMPOSABLES_BLOCKLIST.has(name)) continue;
+            acc.push({
+              name,
+              from: full
+            });
+          }
+        }
+      };
+      const imports = [];
+      collect(composablesRoot, imports);
+      if (imports.length) {
+        (0, _kit.addImports)(imports);
+      }
       (0, _kit.addComponentsDir)({
         path: resolver.resolve("../components"),
         prefix: "",
@@ -65,9 +130,14 @@ module.exports = (0, _kit.defineNuxtModule)({
     }
     nuxt.options.runtimeConfig.public = nuxt.options.runtimeConfig.public || {};
     nuxt.options.runtimeConfig.public.origam = {
+      // Installed theme OBJECTS, passed straight to createOrigam in the
+      // plugins (ADR-004 — no preset-name resolution).
       themes,
       defaultTheme,
+      modes,
+      defaultMode,
       cookieName,
+      modeCookieName,
       cookieMaxAge
     };
   }

package/dist/src/nuxt/module.js CHANGED Viewed

@@ -1,15 +1,38 @@
-import { addComponentsDir, addImportsDir, addPlugin, createResolver, defineNuxtModule } from "@nuxt/kit";
+import { readdirSync, readFileSync, statSync } from "node:fs";
+import { join } from "node:path";
+import { addComponentsDir, addImports, addPlugin, createResolver, defineNuxtModule } from "@nuxt/kit";
 const MODULE_NAME = "origam-nuxt";
 const CONFIG_KEY = "origam";
+const NUXT_COMPOSABLES_BLOCKLIST = /* @__PURE__ */ new Set([
+  "useRoute",
+  "useRouter",
+  "useLink",
+  "useHydration"
+]);
+const DEFAULT_THEMES = [];
+const DEFAULT_MODES = ["light", "dark"];
 const DEFAULTS = {
-  themes: ["light", "dark"],
+  themes: DEFAULT_THEMES,
   defaultTheme: "auto",
+  modes: DEFAULT_MODES,
+  defaultMode: "auto",
   cookieName: "origam-theme",
+  modeCookieName: "origam-mode",
   cookieMaxAge: 60 * 60 * 24 * 365,
   autoImport: true,
   includeUtilities: true,
   prefix: "Origam"
 };
+const SCALAR_DEFAULTS = {
+  defaultTheme: DEFAULTS.defaultTheme,
+  defaultMode: DEFAULTS.defaultMode,
+  cookieName: DEFAULTS.cookieName,
+  modeCookieName: DEFAULTS.modeCookieName,
+  cookieMaxAge: DEFAULTS.cookieMaxAge,
+  autoImport: DEFAULTS.autoImport,
+  includeUtilities: DEFAULTS.includeUtilities,
+  prefix: DEFAULTS.prefix
+};
 export default defineNuxtModule({
   meta: {
     name: MODULE_NAME,
@@ -18,12 +41,15 @@ export default defineNuxtModule({
       nuxt: "^3.0.0 || ^4.0.0"
     }
   },
-  defaults: DEFAULTS,
+  defaults: SCALAR_DEFAULTS,
   setup(options, nuxt) {
     const resolver = createResolver(import.meta.url);
-    const themes = options.themes ?? DEFAULTS.themes;
+    const themes = options.themes ?? DEFAULT_THEMES;
     const defaultTheme = options.defaultTheme ?? DEFAULTS.defaultTheme;
+    const modes = options.modes ?? DEFAULT_MODES;
+    const defaultMode = options.defaultMode ?? DEFAULTS.defaultMode;
     const cookieName = options.cookieName ?? DEFAULTS.cookieName;
+    const modeCookieName = options.modeCookieName ?? DEFAULTS.modeCookieName;
     const cookieMaxAge = options.cookieMaxAge ?? DEFAULTS.cookieMaxAge;
     const autoImport = options.autoImport ?? DEFAULTS.autoImport;
     const includeUtilities = options.includeUtilities ?? DEFAULTS.includeUtilities;
@@ -31,10 +57,9 @@ export default defineNuxtModule({
     if (!nuxt.options.css.includes("origam/tokens/css/primitive")) {
       nuxt.options.css.unshift("origam/tokens/css/primitive");
     }
-    for (const theme of themes) {
-      const cssId = `origam/tokens/css/${theme}`;
-      if (!nuxt.options.css.includes(cssId)) {
-        nuxt.options.css.push(cssId);
+    for (const sheet of ["origam/tokens/css/light", "origam/tokens/css/dark"]) {
+      if (!nuxt.options.css.includes(sheet)) {
+        nuxt.options.css.push(sheet);
       }
     }
     if (includeUtilities && !nuxt.options.css.includes("origam/tokens/css/utilities")) {
@@ -49,7 +74,49 @@ export default defineNuxtModule({
       mode: "client"
     });
     if (autoImport) {
-      addImportsDir(resolver.resolve("../composables"));
+      const composablesRoot = resolver.resolve("../composables");
+      const exportNameRegex = /export\s+(?:async\s+)?(?:function|const|let|var)\s+([A-Za-z_$][\w$]*)/g;
+      const collect = (dir, acc) => {
+        let entries;
+        try {
+          entries = readdirSync(dir);
+        } catch {
+          return;
+        }
+        for (const entry of entries) {
+          const full = join(dir, entry);
+          let s;
+          try {
+            s = statSync(full);
+          } catch {
+            continue;
+          }
+          if (s.isDirectory()) {
+            collect(full, acc);
+            continue;
+          }
+          if (!/\.(?:m?js|ts)$/.test(entry)) continue;
+          if (entry.endsWith(".d.ts")) continue;
+          let src = "";
+          try {
+            src = readFileSync(full, "utf-8");
+          } catch {
+            continue;
+          }
+          let m;
+          exportNameRegex.lastIndex = 0;
+          while (m = exportNameRegex.exec(src)) {
+            const name = m[1];
+            if (NUXT_COMPOSABLES_BLOCKLIST.has(name)) continue;
+            acc.push({ name, from: full });
+          }
+        }
+      };
+      const imports = [];
+      collect(composablesRoot, imports);
+      if (imports.length) {
+        addImports(imports);
+      }
       addComponentsDir({
         path: resolver.resolve("../components"),
         prefix: "",
@@ -59,9 +126,14 @@ export default defineNuxtModule({
     }
     nuxt.options.runtimeConfig.public = nuxt.options.runtimeConfig.public || {};
     nuxt.options.runtimeConfig.public.origam = {
+      // Installed theme OBJECTS, passed straight to createOrigam in the
+      // plugins (ADR-004 — no preset-name resolution).
       themes,
       defaultTheme,
+      modes,
+      defaultMode,
       cookieName,
+      modeCookieName,
       cookieMaxAge
     };
   }

package/dist/src/nuxt/plugin.client.cjs CHANGED Viewed

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 var _vue = require("vue");
 var _composables = require("../composables/index.cjs");
-var _consts = require("../consts/index.cjs");
 var _origam = require("../origam.cjs");
 var _app = require("#app");
 module.exports = (0, _app.defineNuxtPlugin)({
@@ -14,29 +13,48 @@ module.exports = (0, _app.defineNuxtPlugin)({
   setup(nuxtApp) {
     const runtimeConfig = (0, _app.useRuntimeConfig)().public;
     const config = runtimeConfig.origam;
-    const cookie = (0, _app.useCookie)(config.cookieName, {
+    const themeCookie = (0, _app.useCookie)(config.cookieName, {
       maxAge: config.cookieMaxAge,
       sameSite: "lax",
       path: "/"
     });
-    const fromDom = typeof document !== "undefined" && document.documentElement.dataset.theme || null;
-    const initialTheme = fromDom ?? cookie.value ?? config.defaultTheme;
-    const origam = (0, _origam.createOrigam)();
+    const modeCookie = (0, _app.useCookie)(config.modeCookieName, {
+      maxAge: config.cookieMaxAge,
+      sameSite: "lax",
+      path: "/"
+    });
+    const themeFromDom = typeof document !== "undefined" && document.documentElement.dataset.theme || null;
+    const initialTheme = themeFromDom ?? themeCookie.value ?? config.defaultTheme;
+    const initialMode = modeCookie.value ?? config.defaultMode;
+    const themes = config.themes ?? [];
+    const origam = (0, _origam.createOrigam)({
+      themes,
+      ssr: true
+    });
     nuxtApp.vueApp.use(origam);
     const themeApi = (0, _composables.useTheme)();
     themeApi.setTheme(initialTheme);
+    themeApi.setMode(initialMode);
+    (0, _vue.watch)([themeApi.theme, themeApi.resolvedMode], ([brand, mode]) => {
+      origam._defaultsRef.value = origam._activeDefaultsFor(brand === "auto" ? "" : brand, mode);
+    }, {
+      immediate: true
+    });
     (0, _vue.watch)(themeApi.theme, next => {
-      cookie.value = next;
-      if (typeof document !== "undefined") {
-        document.documentElement.setAttribute(_consts.ORIGAM_THEME_ATTR, next);
-      }
+      themeCookie.value = next;
+    }, {
+      flush: "post"
+    });
+    (0, _vue.watch)(themeApi.mode, next => {
+      modeCookie.value = next;
     }, {
       flush: "post"
     });
     return {
       provide: {
         origam: {
-          theme: initialTheme
+          theme: initialTheme,
+          mode: initialMode
         }
       }
     };