npm - @ampless/runtime - Versions diffs - 0.2.0-alpha.5 → 0.2.0-alpha.7 - Mend

@ampless/runtime 0.2.0-alpha.5 → 0.2.0-alpha.7

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 (4) hide show

package/dist/index.d.ts CHANGED Viewed

@@ -109,6 +109,22 @@ interface ThemeActiveApi {
     resolveActiveTheme(siteId?: string): Promise<ResolvedTheme>;
 }
+type ColorScheme = 'auto' | 'light' | 'dark';
+declare const DEFAULT_COLOR_SCHEME: ColorScheme;
+/**
+ * Storage key for the per-site color-scheme override. Lives under the
+ * same `theme.*` namespace as manifest fields so it flows through the
+ * existing KvStore → S3 cache pipeline, but is read separately from
+ * the manifest field set (it's a site-wide concern, not theme-specific).
+ */
+declare const COLOR_SCHEME_SETTING_KEY = "theme.colorScheme";
+/**
+ * Narrow an arbitrary stored value to a known `ColorScheme`. Anything
+ * unrecognised (including `undefined`, malformed strings, accidental
+ * objects) falls back to `'auto'` so a typo never strands a site
+ * forced into a mode it can't undo.
+ */
+declare function validateColorScheme(raw: unknown): ColorScheme;
 interface EffectiveThemeConfig {
     /** Resolved active theme name (e.g. 'blog'). */
     activeTheme: string;
@@ -117,6 +133,16 @@ interface EffectiveThemeConfig {
     values: Record<string, string>;
     /** Subset of `values` for fields that have a `cssVar`. */
     cssVars: Record<string, string>;
+    /**
+     * Per-site color-scheme override. `'auto'` (default) lets the
+     * visitor's system `prefers-color-scheme` decide; `'light'` /
+     * `'dark'` pin one mode regardless of system preference.
+     *
+     * Consumed by the root layout to set `<html data-color-scheme>`,
+     * which the theme tokens.css files key off in combination with the
+     * `light-dark()` CSS function.
+     */
+    colorScheme: ColorScheme;
 }
 interface ThemeConfigApi {
     loadThemeConfig(siteId?: string): Promise<EffectiveThemeConfig>;
@@ -204,4 +230,4 @@ interface Ampless {
  */
 declare function createAmpless(opts: CreateAmplessOpts): Ampless;
-export { type Ampless, type AmplessOutputs, type CreateAmplessOpts, type DataOutput, type EffectiveSiteSettings, type EffectiveThemeConfig, type ListPostsByTagOptions, type ListPostsOptions, type ListPostsResult, type PostsApi, type PublicPostConnectionShape, type PublicPostShape, type ResolvedTheme, type SeoApi, type SiteSettingsApi, type StorageOutput, type ThemeActiveApi, type ThemeConfigApi, type ThemesRegistry, createAmpless, htmlToMarkdown, markdownToHtml, renderBody, renderThemeCss, tiptapToHtml, tiptapToMarkdown };
+export { type Ampless, type AmplessOutputs, COLOR_SCHEME_SETTING_KEY, type ColorScheme, type CreateAmplessOpts, DEFAULT_COLOR_SCHEME, type DataOutput, type EffectiveSiteSettings, type EffectiveThemeConfig, type ListPostsByTagOptions, type ListPostsOptions, type ListPostsResult, type PostsApi, type PublicPostConnectionShape, type PublicPostShape, type ResolvedTheme, type SeoApi, type SiteSettingsApi, type StorageOutput, type ThemeActiveApi, type ThemeConfigApi, type ThemesRegistry, createAmpless, htmlToMarkdown, markdownToHtml, renderBody, renderThemeCss, tiptapToHtml, tiptapToMarkdown, validateColorScheme };

package/dist/index.js CHANGED Viewed

@@ -240,6 +240,12 @@ import {
   resolveThemeValues,
   themeSettingKey
 } from "ampless";
+var DEFAULT_COLOR_SCHEME = "auto";
+var COLOR_SCHEME_SETTING_KEY = "theme.colorScheme";
+function validateColorScheme(raw) {
+  if (raw === "light" || raw === "dark" || raw === "auto") return raw;
+  return DEFAULT_COLOR_SCHEME;
+}
 function createThemeConfig(themeActive, storage) {
   async function fetchRemote(siteId) {
     if (!storage.isStorageConfigured()) return null;
@@ -269,7 +275,8 @@ function createThemeConfig(themeActive, storage) {
       }
       const values = resolveThemeValues(manifest, stored);
       const cssVars = collectCssVars(manifest.fields, values);
-      return { activeTheme: active.name, manifest, values, cssVars };
+      const colorScheme = validateColorScheme(flat?.[COLOR_SCHEME_SETTING_KEY]);
+      return { activeTheme: active.name, manifest, values, cssVars, colorScheme };
     }
   };
 }
@@ -533,11 +540,14 @@ function createAmpless(opts) {
   };
 }
 export {
+  COLOR_SCHEME_SETTING_KEY,
+  DEFAULT_COLOR_SCHEME,
   createAmpless,
   htmlToMarkdown,
   markdownToHtml,
   renderBody,
   renderThemeCss,
   tiptapToHtml,
-  tiptapToMarkdown
+  tiptapToMarkdown,
+  validateColorScheme
 };

package/dist/middleware.js CHANGED Viewed

@@ -15,9 +15,11 @@ function createAmplessMiddleware({ cmsConfig }) {
       url.pathname = `/site/${siteId}${tail}`;
     }
     const previewTheme = url.searchParams.get("previewTheme");
+    const previewColorScheme = url.searchParams.get("previewColorScheme");
     const requestHeaders = new Headers(request.headers);
     requestHeaders.set("x-site-id", siteId);
     if (previewTheme) requestHeaders.set("x-preview-theme", previewTheme);
+    if (previewColorScheme) requestHeaders.set("x-preview-color-scheme", previewColorScheme);
     const response = NextResponse.rewrite(url, { request: { headers: requestHeaders } });
     response.headers.set("x-site-id", siteId);
     if (MULTI_SITE) {

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@ampless/runtime",
-  "version": "0.2.0-alpha.5",
+  "version": "0.2.0-alpha.7",
   "description": "Public-side runtime for ampless: post fetching, theme dispatch, middleware, public route handlers",
   "license": "MIT",
   "type": "module",
@@ -48,8 +48,8 @@
     "clsx": "^2.1.1",
     "lucide-react": "^1.16.0",
     "tailwind-merge": "^3.6.0",
-    "ampless": "0.2.0-alpha.3",
-    "@ampless/plugin-og-image": "0.2.0-alpha.3"
+    "ampless": "0.2.0-alpha.4",
+    "@ampless/plugin-og-image": "0.2.0-alpha.4"
   },
   "peerDependencies": {
     "next": "^15 || ^16",