@nextworks/blocks-core 0.1.0-alpha.0

package/README.md

@@ -0,0 +1,29 @@
+# @nextworks/blocks-core
+
+Core UI primitives and theme utilities used by the Nextworks Blocks kits.
+
+This package provides:
+
+- Base UI components (Button, Input, Card, Checkbox, Select, Switch, etc.)
+- Theme helpers and providers
+- Types and helpers shared by other `@nextworks/blocks-*` packages
+
+## Installation
+
+```bash
+npm install @nextworks/blocks-core
+# or
+pnpm add @nextworks/blocks-core
+# or
+yarn add @nextworks/blocks-core
+```
+
+You will typically not use this package directly unless you are composing your own blocks or building on top of `@nextworks/blocks-sections` or `@nextworks/blocks-templates`.
+
+For a higher-level experience with copyable files and Next.js app wiring, consider using the `nextworks` CLI:
+
+```bash
+npx nextworks add blocks
+```
+
+which copies a curated set of components and templates into your app.

package/dist/components/AppProviders.server.d.ts

@@ -0,0 +1,4 @@
+export default function AppProviders({ children, }: Readonly<{
+    children: React.ReactNode;
+}>): Promise<import("react/jsx-runtime").JSX.Element>;
+//# sourceMappingURL=AppProviders.server.d.ts.map

package/dist/components/AppProviders.server.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppProviders.server.d.ts","sourceRoot":"","sources":["../../src/components/AppProviders.server.tsx"],"names":[],"mappings":"AAwDA,wBAA8B,YAAY,CAAC,EACzC,QAAQ,GACT,EAAE,QAAQ,CAAC;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CAAC,oDA0CzC"}

package/dist/components/AppProviders.server.js

@@ -0,0 +1,60 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Geist, Geist_Mono, Outfit, Inter, Poppins } from "next/font/google";
+import { EnhancedThemeProvider } from "./enhanced-theme-provider";
+import { cookies } from "next/headers";
+import { themes, darkThemes, } from "../lib/themes";
+const geistSans = Geist({
+    variable: "--font-geist-sans",
+    subsets: ["latin"],
+});
+const geistMono = Geist_Mono({
+    variable: "--font-geist-mono",
+    subsets: ["latin"],
+});
+const outfit = Outfit({
+    variable: "--font-outfit",
+    subsets: ["latin"],
+});
+const inter = Inter({
+    variable: "--font-inter",
+    subsets: ["latin"],
+});
+const poppins = Poppins({
+    variable: "--font-poppins",
+    subsets: ["latin"],
+    weight: ["100", "200", "300", "400", "500", "600", "700", "800", "900"],
+});
+function toCssVars(colors) {
+    return Object.entries(colors)
+        .map(([key, value]) => `--${key.replace(/([A-Z])/g, "-$1").toLowerCase()}: ${value};`)
+        .join("");
+}
+function safeParseCustomTokens(value) {
+    if (!value)
+        return null;
+    try {
+        return JSON.parse(decodeURIComponent(value));
+    }
+    catch (_a) {
+        return null;
+    }
+}
+export default async function AppProviders({ children, }) {
+    var _a, _b;
+    // Read cookies for SSR: chosen variant and optional custom tokens
+    const cookieStore = await cookies();
+    const cookieVariant = (_a = cookieStore.get("theme-variant")) === null || _a === void 0 ? void 0 : _a.value;
+    const variant = cookieVariant && cookieVariant in themes ? cookieVariant : "default";
+    const cookieCustom = variant === "custom"
+        ? safeParseCustomTokens((_b = cookieStore.get("theme-custom")) === null || _b === void 0 ? void 0 : _b.value)
+        : null;
+    const baseLight = themes[variant].colors;
+    const baseDark = darkThemes[variant].colors;
+    const lightMerged = cookieCustom
+        ? Object.assign(Object.assign({}, baseLight), cookieCustom) : baseLight;
+    const darkMerged = cookieCustom ? Object.assign(Object.assign({}, baseDark), cookieCustom) : baseDark;
+    const lightVars = toCssVars(lightMerged);
+    const darkVars = toCssVars(darkMerged);
+    const inlineThemeCss = `:root{${lightVars}}.dark{${darkVars}}`;
+    return (_jsxs(_Fragment, { children: [_jsx("style", { id: "theme-variant-vars", dangerouslySetInnerHTML: { __html: inlineThemeCss } }), _jsx("div", { className: `${geistSans.variable} ${geistMono.variable} ${outfit.variable} ${inter.variable} ${poppins.variable} antialiased`, children: _jsx(EnhancedThemeProvider, { defaultThemeVariant: variant, children: children }) })] }));
+}

package/dist/components/enhanced-theme-provider.d.ts

@@ -0,0 +1,25 @@
+import * as React from "react";
+import type { ThemeProviderProps as NextThemesProviderProps } from "next-themes";
+import { ThemeVariant, type ThemeConfig } from "../lib/themes";
+type ColorTokens = ThemeConfig["colors"];
+interface EnhancedThemeProviderProps {
+    children: React.ReactNode;
+    attribute?: NextThemesProviderProps["attribute"];
+    defaultTheme?: NextThemesProviderProps["defaultTheme"];
+    enableSystem?: NextThemesProviderProps["enableSystem"];
+    disableTransitionOnChange?: NextThemesProviderProps["disableTransitionOnChange"];
+    defaultThemeVariant?: ThemeVariant;
+    defaultCustomTokens?: Partial<ColorTokens> | null;
+}
+interface ThemeContextType {
+    themeVariant: ThemeVariant;
+    setThemeVariant: (variant: ThemeVariant) => void;
+    customTheme: Partial<ColorTokens> | null;
+    setCustomTheme: (tokens: Partial<ColorTokens> | null) => void;
+    setCustomBrandColors: (tokens: Partial<ColorTokens>) => void;
+    applyTheme: (variant: ThemeVariant, isDark?: boolean) => void;
+}
+export declare function useThemeVariant(): ThemeContextType;
+export declare function EnhancedThemeProvider({ children, attribute, defaultTheme, enableSystem, disableTransitionOnChange, defaultThemeVariant, defaultCustomTokens, }: EnhancedThemeProviderProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=enhanced-theme-provider.d.ts.map

package/dist/components/enhanced-theme-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"enhanced-theme-provider.d.ts","sourceRoot":"","sources":["../../src/components/enhanced-theme-provider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,kBAAkB,IAAI,uBAAuB,EAAE,MAAM,aAAa,CAAC;AACjF,OAAO,EACL,YAAY,EAGZ,KAAK,WAAW,EACjB,MAAM,eAAe,CAAC;AAEvB,KAAK,WAAW,GAAG,WAAW,CAAC,QAAQ,CAAC,CAAC;AAGzC,UAAU,0BAA0B;IAClC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,uBAAuB,CAAC,WAAW,CAAC,CAAC;IACjD,YAAY,CAAC,EAAE,uBAAuB,CAAC,cAAc,CAAC,CAAC;IACvD,YAAY,CAAC,EAAE,uBAAuB,CAAC,cAAc,CAAC,CAAC;IACvD,yBAAyB,CAAC,EAAE,uBAAuB,CAAC,2BAA2B,CAAC,CAAC;IACjF,mBAAmB,CAAC,EAAE,YAAY,CAAC;IAEnC,mBAAmB,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;CACnD;AAED,UAAU,gBAAgB;IACxB,YAAY,EAAE,YAAY,CAAC;IAC3B,eAAe,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;IAEjD,WAAW,EAAE,OAAO,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;IACzC,cAAc,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,WAAW,CAAC,GAAG,IAAI,KAAK,IAAI,CAAC;IAC9D,oBAAoB,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAE7D,UAAU,EAAE,CAAC,OAAO,EAAE,YAAY,EAAE,MAAM,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;CAC/D;AAMD,wBAAgB,eAAe,qBAQ9B;AAED,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,SAAmB,EACnB,YAAuB,EACvB,YAAmB,EACnB,yBAAiC,EACjC,mBAAkC,EAClC,mBAA0B,GAC3B,EAAE,0BAA0B,2CAqI5B"}

package/dist/components/enhanced-theme-provider.js

@@ -0,0 +1,105 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { ThemeProvider as NextThemesProvider } from "next-themes";
+import { themes, darkThemes, } from "../lib/themes";
+const CUSTOM_STORAGE_KEY = "nxw-theme-custom";
+const ThemeContext = React.createContext(undefined);
+export function useThemeVariant() {
+    const context = React.useContext(ThemeContext);
+    if (context === undefined) {
+        throw new Error("useThemeVariant must be used within an EnhancedThemeProvider");
+    }
+    return context;
+}
+export function EnhancedThemeProvider({ children, attribute = "class", defaultTheme = "system", enableSystem = true, disableTransitionOnChange = false, defaultThemeVariant = "monochrome", defaultCustomTokens = null, }) {
+    const [themeVariant, setThemeVariant] = React.useState(defaultThemeVariant);
+    const [customTheme, setCustomThemeState] = React.useState(defaultCustomTokens);
+    const writeCustomCookies = React.useCallback((tokens) => {
+        if (tokens) {
+            document.cookie = `theme-variant=custom; Path=/; Max-Age=31536000; SameSite=Lax`;
+            document.cookie = `theme-custom=${encodeURIComponent(JSON.stringify(tokens))}; Path=/; Max-Age=31536000; SameSite=Lax`;
+        }
+        else {
+            document.cookie = `theme-custom=; Path=/; Max-Age=0; SameSite=Lax`;
+        }
+    }, []);
+    const setCustomTheme = React.useCallback((tokens) => {
+        setCustomThemeState(tokens);
+        try {
+            if (tokens) {
+                localStorage.setItem(CUSTOM_STORAGE_KEY, JSON.stringify(tokens));
+            }
+            else {
+                localStorage.removeItem(CUSTOM_STORAGE_KEY);
+            }
+        }
+        catch (_a) { }
+        writeCustomCookies(tokens !== null && tokens !== void 0 ? tokens : null);
+    }, [writeCustomCookies]);
+    const setCustomBrandColors = React.useCallback((tokens) => {
+        setThemeVariant("custom");
+        setCustomTheme(tokens);
+    }, [setCustomTheme]);
+    const applyTheme = React.useCallback((variant, isDark = false) => {
+        const base = isDark ? darkThemes[variant].colors : themes[variant].colors;
+        const merged = variant === "custom" && customTheme
+            ? Object.assign(Object.assign({}, base), customTheme) : base;
+        // Apply CSS custom properties to the document root
+        const root = document.documentElement;
+        // Reflect the current variant for CSS selectors
+        root.setAttribute("data-theme-variant", variant);
+        Object.entries(merged).forEach(([key, value]) => {
+            const cssVar = `--${key.replace(/([A-Z])/g, "-$1").toLowerCase()}`;
+            root.style.setProperty(cssVar, value);
+        });
+    }, [customTheme]);
+    // Apply theme when variant or custom tokens change
+    React.useEffect(() => {
+        const isDark = document.documentElement.classList.contains("dark");
+        applyTheme(themeVariant, isDark);
+    }, [themeVariant, customTheme, applyTheme]);
+    // Load custom tokens from localStorage on mount (overrides defaultCustomTokens if present)
+    React.useEffect(() => {
+        try {
+            const raw = localStorage.getItem(CUSTOM_STORAGE_KEY);
+            if (raw) {
+                const parsed = JSON.parse(raw);
+                setCustomThemeState(parsed);
+            }
+        }
+        catch (_a) { }
+    }, []);
+    // Listen for theme changes from next-themes
+    React.useEffect(() => {
+        const observer = new MutationObserver((mutations) => {
+            mutations.forEach((mutation) => {
+                if (mutation.type === "attributes" &&
+                    mutation.attributeName === "class") {
+                    const isDark = document.documentElement.classList.contains("dark");
+                    applyTheme(themeVariant, isDark);
+                }
+            });
+        });
+        observer.observe(document.documentElement, {
+            attributes: true,
+            attributeFilter: ["class"],
+        });
+        return () => observer.disconnect();
+    }, [themeVariant, applyTheme]);
+    const contextValue = React.useMemo(() => ({
+        themeVariant,
+        setThemeVariant,
+        customTheme,
+        setCustomTheme,
+        setCustomBrandColors,
+        applyTheme,
+    }), [
+        themeVariant,
+        customTheme,
+        setCustomTheme,
+        setCustomBrandColors,
+        applyTheme,
+    ]);
+    return (_jsx(NextThemesProvider, { attribute: attribute, defaultTheme: defaultTheme, enableSystem: enableSystem, disableTransitionOnChange: disableTransitionOnChange, children: _jsx(ThemeContext.Provider, { value: contextValue, children: children }) }));
+}

package/dist/components/theme-provider.d.ts

@@ -0,0 +1,12 @@
+import * as React from "react";
+import type { ThemeProviderProps as NextThemesProviderProps } from "next-themes";
+interface ThemeProviderProps {
+    children: React.ReactNode;
+    attribute?: NextThemesProviderProps["attribute"];
+    defaultTheme?: NextThemesProviderProps["defaultTheme"];
+    enableSystem?: NextThemesProviderProps["enableSystem"];
+    disableTransitionOnChange?: NextThemesProviderProps["disableTransitionOnChange"];
+}
+export declare function ThemeProvider({ children, attribute, defaultTheme, enableSystem, disableTransitionOnChange, }: ThemeProviderProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=theme-provider.d.ts.map

package/dist/components/theme-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-provider.d.ts","sourceRoot":"","sources":["../../src/components/theme-provider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,kBAAkB,IAAI,uBAAuB,EAAE,MAAM,aAAa,CAAC;AAEjF,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,uBAAuB,CAAC,WAAW,CAAC,CAAC;IACjD,YAAY,CAAC,EAAE,uBAAuB,CAAC,cAAc,CAAC,CAAC;IACvD,YAAY,CAAC,EAAE,uBAAuB,CAAC,cAAc,CAAC,CAAC;IACvD,yBAAyB,CAAC,EAAE,uBAAuB,CAAC,2BAA2B,CAAC,CAAC;CAClF;AAED,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,SAAmB,EACnB,YAAuB,EACvB,YAAmB,EACnB,yBAAiC,GAClC,EAAE,kBAAkB,2CAWpB"}

package/dist/components/theme-provider.js

@@ -0,0 +1,6 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ThemeProvider as NextThemesProvider } from "next-themes";
+export function ThemeProvider({ children, attribute = "class", defaultTheme = "system", enableSystem = true, disableTransitionOnChange = false, }) {
+    return (_jsx(NextThemesProvider, { attribute: attribute, defaultTheme: defaultTheme, enableSystem: enableSystem, disableTransitionOnChange: disableTransitionOnChange, children: children }));
+}

package/dist/index.d.ts

@@ -0,0 +1,26 @@
+
+// Auto-generated by scripts/postbuild.js
+export * from "./lib/themes";
+export * from "./lib/utils";
+export * from "./components/enhanced-theme-provider";
+export * from "./components/theme-provider";
+export * from "./ui/alert-dialog";
+export * from "./ui/brand-node";
+export * from "./ui/button";
+export * from "./ui/card";
+export * from "./ui/checkbox";
+export * from "./ui/cta-button";
+export * from "./ui/dropdown-menu";
+export * from "./ui/feature-card";
+export * from "./ui/input";
+export * from "./ui/label";
+export * from "./ui/pricing-card";
+export * from "./ui/select";
+export * from "./ui/skeleton";
+export * from "./ui/switch";
+export * from "./ui/table";
+export * from "./ui/testimonial-card";
+export * from "./ui/textarea";
+export * from "./ui/theme-selector";
+export * from "./ui/theme-toggle";
+export * from "./ui/toaster";

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAKA,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAG5B,cAAc,sCAAsC,CAAC;AACrD,cAAc,6BAA6B,CAAC;AAG5C,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,uBAAuB,CAAC;AACtC,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,cAAc,CAAC"}

package/dist/index.js

@@ -0,0 +1,30 @@
+// Public exports for @nextworks/blocks-core
+// NOTE: This entry is safe for client and server usage. Server-only
+// components like AppProviders are exported from a separate entry.
+// Theme data & utilities
+export * from "./lib/themes";
+export * from "./lib/utils";
+// Client-safe providers/hooks
+export * from "./components/enhanced-theme-provider";
+export * from "./components/theme-provider";
+// UI primitives
+export * from "./ui/alert-dialog";
+export * from "./ui/brand-node";
+export * from "./ui/button";
+export * from "./ui/card";
+export * from "./ui/checkbox";
+export * from "./ui/cta-button";
+export * from "./ui/dropdown-menu";
+export * from "./ui/feature-card";
+export * from "./ui/input";
+export * from "./ui/label";
+export * from "./ui/pricing-card";
+export * from "./ui/select";
+export * from "./ui/skeleton";
+export * from "./ui/switch";
+export * from "./ui/table";
+export * from "./ui/testimonial-card";
+export * from "./ui/textarea";
+export * from "./ui/theme-selector";
+export * from "./ui/theme-toggle";
+export * from "./ui/toaster";

package/dist/lib/themes.d.ts

@@ -0,0 +1,32 @@
+export type ThemeVariant = "default" | "monochrome" | "blue" | "green" | "purple" | "orange" | "custom";
+export interface ThemeConfig {
+    name: string;
+    colors: {
+        primary: string;
+        primaryForeground: string;
+        secondary: string;
+        secondaryForeground: string;
+        accent: string;
+        accentForeground: string;
+        background: string;
+        foreground: string;
+        card: string;
+        cardForeground: string;
+        popover: string;
+        popoverForeground: string;
+        muted: string;
+        mutedForeground: string;
+        border: string;
+        input: string;
+        ring: string;
+        destructive: string;
+        chart1: string;
+        chart2: string;
+        chart3: string;
+        chart4: string;
+        chart5: string;
+    };
+}
+export declare const themes: Record<ThemeVariant, ThemeConfig>;
+export declare const darkThemes: Record<ThemeVariant, ThemeConfig>;
+//# sourceMappingURL=themes.d.ts.map

package/dist/lib/themes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"themes.d.ts","sourceRoot":"","sources":["../../src/lib/themes.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,YAAY,GACpB,SAAS,GACT,YAAY,GACZ,MAAM,GACN,OAAO,GACP,QAAQ,GACR,QAAQ,GACR,QAAQ,CAAC;AAEb,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE;QACN,OAAO,EAAE,MAAM,CAAC;QAChB,iBAAiB,EAAE,MAAM,CAAC;QAC1B,SAAS,EAAE,MAAM,CAAC;QAClB,mBAAmB,EAAE,MAAM,CAAC;QAC5B,MAAM,EAAE,MAAM,CAAC;QACf,gBAAgB,EAAE,MAAM,CAAC;QACzB,UAAU,EAAE,MAAM,CAAC;QACnB,UAAU,EAAE,MAAM,CAAC;QACnB,IAAI,EAAE,MAAM,CAAC;QACb,cAAc,EAAE,MAAM,CAAC;QACvB,OAAO,EAAE,MAAM,CAAC;QAChB,iBAAiB,EAAE,MAAM,CAAC;QAC1B,KAAK,EAAE,MAAM,CAAC;QACd,eAAe,EAAE,MAAM,CAAC;QACxB,MAAM,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;QACb,WAAW,EAAE,MAAM,CAAC;QACpB,MAAM,EAAE,MAAM,CAAC;QACf,MAAM,EAAE,MAAM,CAAC;QACf,MAAM,EAAE,MAAM,CAAC;QACf,MAAM,EAAE,MAAM,CAAC;QACf,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;CACH;AAED,eAAO,MAAM,MAAM,EAAE,MAAM,CAAC,YAAY,EAAE,WAAW,CAqMpD,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,YAAY,EAAE,WAAW,CAqMxD,CAAC"}