rizzo-css 0.0.25 → 0.0.26

package/README.md

@@ -56,7 +56,7 @@ import 'rizzo-css';
 **Without a bundler (plain HTML):** Use a CDN. Both unpkg and jsDelivr resolve the package root to the built CSS (via the `unpkg` / `jsdelivr` fields in this package). For reliability or to pin a version, use the explicit path:
 
 ```html
-<!-- unpkg (pin version: replace @latest with @0.0.25 or any version) -->
+<!-- unpkg (pin version: replace @latest with @0.0.26 or any version) -->
 <link rel="stylesheet" href="https://unpkg.com/rizzo-css@latest/dist/rizzo.min.css" />
 
 <!-- or jsDelivr -->

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rizzo-css",
-  "version": "0.0.25",
+  "version": "0.0.26",
   "scripts": {
     "prepublishOnly": "cd ../.. && pnpm run lint:css:fix && pnpm run build:css && node scripts/copy-scaffold.js && node scripts/prepare-vanilla-scaffold.js"
   },
@@ -26,6 +26,7 @@
     ".env.example",
     "bin",
     "scaffold/astro",
+    "scaffold/utils",
     "scaffold/svelte",
     "scaffold/vanilla",
     "scaffold/astro-minimal",

package/scaffold/utils/theme.ts

@@ -0,0 +1,65 @@
+/**
+ * Theme utilities — apply theme, resolve system preference, get/set stored theme.
+ * Used by ThemeSwitcher, Layout (flash prevention), and any consumer that sets data-theme.
+ */
+import { ALL_THEMES } from '../astro/themes';
+
+export const THEME_SYSTEM = 'system';
+export const DEFAULT_THEME_DARK = 'github-dark-classic';
+export const DEFAULT_THEME_LIGHT = 'github-light';
+
+/** Current theme id from the DOM (data-theme on html). */
+export function getCurrentTheme(): string {
+  if (typeof document === 'undefined') return DEFAULT_THEME_DARK;
+  return document.documentElement.getAttribute('data-theme') || DEFAULT_THEME_DARK;
+}
+
+/** Stored theme from localStorage (may be 'system' or a theme id). */
+export function getStoredTheme(): string {
+  if (typeof localStorage === 'undefined') return getCurrentTheme();
+  return localStorage.getItem('theme') || getCurrentTheme();
+}
+
+/** Resolve system preference to a concrete theme id. */
+export function resolveSystemTheme(): string {
+  if (typeof window === 'undefined') return DEFAULT_THEME_DARK;
+  return window.matchMedia('(prefers-color-scheme: dark)').matches ? DEFAULT_THEME_DARK : DEFAULT_THEME_LIGHT;
+}
+
+/** Resolve stored theme to the effective theme id (for 'system', returns resolved dark/light). */
+export function getResolvedTheme(): string {
+  const stored = getStoredTheme();
+  if (!stored || stored === THEME_SYSTEM) return resolveSystemTheme();
+  return stored;
+}
+
+/** Get { value, label } for a theme (for UI display). */
+export function getThemeInfo(themeValue: string): { value: string; label: string } {
+  if (themeValue === THEME_SYSTEM) return { value: THEME_SYSTEM, label: 'System' };
+  const entry = ALL_THEMES.find((t) => t.value === themeValue);
+  return entry ? { value: entry.value, label: entry.label } : { value: themeValue, label: 'Theme' };
+}
+
+/** Get display label for a theme value (from config). */
+export function getThemeLabel(themeValue: string): string {
+  return getThemeInfo(themeValue).label;
+}
+
+/** Apply a theme: set data-theme and persist to localStorage. Use for ThemeSwitcher and programmatic changes. */
+export function applyTheme(themeValue: string): void {
+  if (typeof document === 'undefined' || typeof localStorage === 'undefined') return;
+  let effective: string;
+  if (themeValue === THEME_SYSTEM) {
+    effective = resolveSystemTheme();
+    document.documentElement.setAttribute('data-theme', effective);
+    localStorage.setItem('theme', THEME_SYSTEM);
+  } else {
+    document.documentElement.setAttribute('data-theme', themeValue);
+    localStorage.setItem('theme', themeValue);
+    effective = themeValue;
+  }
+  // Allow listeners to sync UI (e.g. ThemeSwitcher)
+  try {
+    window.dispatchEvent(new CustomEvent('rizzo-theme-change', { detail: { themeValue, effective } }));
+  } catch (_) {}
+}

package/scaffold/vanilla/README-RIZZO.md

@@ -13,7 +13,7 @@ If you prefer to load CSS from a CDN instead of the local file, replace the `<li
 - `<link rel="stylesheet" href="https://unpkg.com/rizzo-css@latest/dist/rizzo.min.css" />`  
 - Or jsDelivr: `https://cdn.jsdelivr.net/npm/rizzo-css@latest/dist/rizzo.min.css`  
 
-(Replace `@latest` with a specific version, e.g. `@0.0.25`, in production.)
+(Replace `@latest` with a specific version, e.g. `@0.0.26`, in production.)
 
 The CLI replaces placeholders in `index.html` (e.g. `{{DATA_THEME}}`, `{{TITLE}}`) when you run `rizzo-css init`. The theme selected during init is used on first load when you have no saved preference in the browser.
 

package/scaffold/vanilla/components/accordion.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/alert.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/avatar.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/badge.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/breadcrumb.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/button.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/cards.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/copy-to-clipboard.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/divider.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/dropdown.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/forms.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/icons.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/index.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -302,6 +306,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/modal.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/navbar.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/pagination.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/progress-bar.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/search.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/settings.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/spinner.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/table.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/tabs.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/theme-switcher.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/toast.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/components/tooltip.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -277,6 +281,10 @@
 
 
 
+
+
+
+
 
 
 

package/scaffold/vanilla/index.html

@@ -215,6 +215,10 @@
   
   
   
+  
+  
+  
+  
   
   
   
@@ -289,6 +293,10 @@
 
 
 
+
+
+
+