@vistagenic/vista 0.3.4 → 0.3.6

package/dist/server/static-generator.js

@@ -431,9 +431,8 @@ async function attachFlightPayload(page, flightData, _cwd) {
         return;
     page.flightData = flightData;
     page.html = injectInlineFlightBootstrap(page.html, flightData);
-    if (page.shellHtml) {
-        page.shellHtml = injectInlineFlightBootstrap(page.shellHtml, flightData);
-    }
+    // PPR shells are loading-only. Inlining the full-page Flight would leak
+    // resumed content (e.g. ppr-page-content) into the shell response.
 }
 function getCSSLinks(cwd) {
     const links = ['<link rel="stylesheet" href="/styles.css" />'];

package/dist/theme/index.d.ts

@@ -1,2 +1,3 @@
 export { ThemeProvider, applyTheme, useTheme, type ResolvedTheme, type ThemeMode } from './theme-provider';
 export { ThemeScript } from './theme-script';
+export { ThemeToggle, type ThemeToggleProps } from './theme-toggle';

package/dist/theme/index.js

@@ -1,9 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ThemeScript = exports.useTheme = exports.applyTheme = exports.ThemeProvider = void 0;
+exports.ThemeToggle = exports.ThemeScript = exports.useTheme = exports.applyTheme = exports.ThemeProvider = void 0;
 var theme_provider_1 = require("./theme-provider");
 Object.defineProperty(exports, "ThemeProvider", { enumerable: true, get: function () { return theme_provider_1.ThemeProvider; } });
 Object.defineProperty(exports, "applyTheme", { enumerable: true, get: function () { return theme_provider_1.applyTheme; } });
 Object.defineProperty(exports, "useTheme", { enumerable: true, get: function () { return theme_provider_1.useTheme; } });
 var theme_script_1 = require("./theme-script");
 Object.defineProperty(exports, "ThemeScript", { enumerable: true, get: function () { return theme_script_1.ThemeScript; } });
+var theme_toggle_1 = require("./theme-toggle");
+Object.defineProperty(exports, "ThemeToggle", { enumerable: true, get: function () { return theme_toggle_1.ThemeToggle; } });

package/dist/theme/react-server.d.ts

@@ -2,9 +2,11 @@
  * React-server entry for `vista/theme`.
  *
  * ThemeScript is a real Server Component (inline blocking script).
- * ThemeProvider/useTheme are Client Components; the compile hook turns
- * `theme-provider` into a Flight client proxy under `--conditions react-server`.
+ * ThemeProvider/useTheme/ThemeToggle are Client Components; the compile hook
+ * turns those modules into Flight client proxies under `--conditions react-server`.
  */
 export { ThemeScript } from './theme-script';
 export { ThemeProvider, applyTheme, useTheme } from './theme-provider';
+export { ThemeToggle } from './theme-toggle';
 export type { ResolvedTheme, ThemeMode } from './theme-provider';
+export type { ThemeToggleProps } from './theme-toggle';

package/dist/theme/react-server.js

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useTheme = exports.applyTheme = exports.ThemeProvider = exports.ThemeScript = void 0;
+exports.ThemeToggle = exports.useTheme = exports.applyTheme = exports.ThemeProvider = exports.ThemeScript = void 0;
 /**
  * React-server entry for `vista/theme`.
  *
  * ThemeScript is a real Server Component (inline blocking script).
- * ThemeProvider/useTheme are Client Components; the compile hook turns
- * `theme-provider` into a Flight client proxy under `--conditions react-server`.
+ * ThemeProvider/useTheme/ThemeToggle are Client Components; the compile hook
+ * turns those modules into Flight client proxies under `--conditions react-server`.
  */
 var theme_script_1 = require("./theme-script");
 Object.defineProperty(exports, "ThemeScript", { enumerable: true, get: function () { return theme_script_1.ThemeScript; } });
@@ -14,3 +14,5 @@ var theme_provider_1 = require("./theme-provider");
 Object.defineProperty(exports, "ThemeProvider", { enumerable: true, get: function () { return theme_provider_1.ThemeProvider; } });
 Object.defineProperty(exports, "applyTheme", { enumerable: true, get: function () { return theme_provider_1.applyTheme; } });
 Object.defineProperty(exports, "useTheme", { enumerable: true, get: function () { return theme_provider_1.useTheme; } });
+var theme_toggle_1 = require("./theme-toggle");
+Object.defineProperty(exports, "ThemeToggle", { enumerable: true, get: function () { return theme_toggle_1.ThemeToggle; } });

package/dist/theme/theme-toggle.d.ts

@@ -0,0 +1,5 @@
+export interface ThemeToggleProps {
+    compact?: boolean;
+    className?: string;
+}
+export declare function ThemeToggle({ compact, className }: ThemeToggleProps): import("react/jsx-runtime").JSX.Element;

package/dist/theme/theme-toggle.js

@@ -0,0 +1,39 @@
+'use client';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ThemeToggle = ThemeToggle;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const theme_provider_1 = require("./theme-provider");
+function Icon(props) {
+    return ((0, jsx_runtime_1.jsx)("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", className: "h-full w-full", "aria-hidden": "true", ...props }));
+}
+function SystemIcon() {
+    return ((0, jsx_runtime_1.jsxs)(Icon, { children: [(0, jsx_runtime_1.jsx)("rect", { x: "3.5", y: "4.5", width: "17", height: "12", rx: "2" }), (0, jsx_runtime_1.jsx)("path", { d: "M8 19.5h8" })] }));
+}
+function SunIcon() {
+    return ((0, jsx_runtime_1.jsxs)(Icon, { children: [(0, jsx_runtime_1.jsx)("circle", { cx: "12", cy: "12", r: "4" }), (0, jsx_runtime_1.jsx)("path", { d: "M12 3v2.2M12 18.8V21M4.9 4.9l1.6 1.6M17.5 17.5l1.6 1.6M3 12h2.2M18.8 12H21M4.9 19.1l1.6-1.6M17.5 6.5l1.6-1.6" })] }));
+}
+function MoonIcon() {
+    return ((0, jsx_runtime_1.jsx)(Icon, { children: (0, jsx_runtime_1.jsx)("path", { d: "M16.5 13.5A7 7 0 0 1 10.2 4.4 7.2 7.2 0 1 0 19.6 14.8 7 7 0 0 1 16.5 13.5z" }) }));
+}
+const OPTIONS = [
+    { value: 'system', label: 'System', icon: SystemIcon },
+    { value: 'light', label: 'Light', icon: SunIcon },
+    { value: 'dark', label: 'Dark', icon: MoonIcon },
+];
+function ThemeToggle({ compact = false, className }) {
+    const { mounted, theme, setTheme } = (0, theme_provider_1.useTheme)();
+    const rootClassName = [
+        'inline-flex items-center gap-1 rounded-full border border-border/80 bg-panel-elevated/90 p-1 shadow-[0_10px_30px_rgba(15,23,42,0.08)] backdrop-blur',
+        className,
+    ]
+        .filter(Boolean)
+        .join(' ');
+    return ((0, jsx_runtime_1.jsx)("div", { className: rootClassName, "aria-label": "Theme switcher", children: OPTIONS.map((option) => {
+            const isActive = theme === option.value;
+            const IconNode = option.icon;
+            return ((0, jsx_runtime_1.jsxs)("button", { type: "button", onClick: () => setTheme(option.value), className: `inline-flex items-center justify-center gap-2 rounded-full py-2 text-xs font-medium transition-colors ${isActive
+                    ? 'bg-foreground text-background'
+                    : 'text-muted-foreground hover:bg-background/80 hover:text-foreground'} ${compact ? 'px-2.5' : 'px-3'}`, "aria-pressed": isActive, title: mounted ? option.label : undefined, children: [(0, jsx_runtime_1.jsx)("span", { className: "inline-flex h-3.5 w-3.5 items-center justify-center", children: (0, jsx_runtime_1.jsx)(IconNode, {}) }), !compact ? (0, jsx_runtime_1.jsx)("span", { children: option.label }) : null] }, option.value));
+        }) }));
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vistagenic/vista",
-  "version": "0.3.4",
+  "version": "0.3.6",
   "description": "The React Framework for Visionaries - Rust-powered SSR with Server Components",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",