@deneb-ui/ui 2.0.0

package/dist/SiteDataProvider.d.ts

@@ -0,0 +1,61 @@
+import React, { type ReactNode } from 'react';
+export declare const DENEB_PREVIEW_DATA_MESSAGE = "DENEB_PREVIEW_SITE_DATA";
+export declare const PREVIEW_DATA_MESSAGE = "FIVORA_PREVIEW_SITE_DATA";
+export declare const LEGACY_PREVIEW_DATA_MESSAGE: string;
+export declare const DENEB_PREVIEW_READY_MESSAGE = "DENEB_PREVIEW_READY";
+export declare const PREVIEW_READY_MESSAGE = "FIVORA_PREVIEW_READY";
+export declare const LEGACY_PREVIEW_READY_MESSAGE: string;
+export declare const DENEB_PREVIEW_FOCUS_MESSAGE = "DENEB_PREVIEW_FOCUS_PAGE";
+export declare const PREVIEW_FOCUS_MESSAGE = "FIVORA_PREVIEW_FOCUS_PAGE";
+export declare const LEGACY_PREVIEW_FOCUS_MESSAGE: string;
+export declare const PREVIEW_FIELD_ATTRIBUTE = "data-preview-field-path";
+export type GenericRecord = Record<string, unknown>;
+export type SiteData = {
+    project?: {
+        id?: string | null;
+    } | null;
+    merchant?: GenericRecord | null;
+    template?: {
+        structure?: {
+            pages?: string[] | null;
+            theme?: GenericRecord | null;
+        } | null;
+    } | null;
+    requirements?: {
+        requiredPages?: string[] | null;
+    } | null;
+    content?: GenericRecord | null;
+    [key: string]: unknown;
+};
+export declare const SiteDataContext: React.Context<SiteData>;
+export declare function isRecord(value: unknown): value is GenericRecord;
+export declare function mergeSiteData(current: unknown, incoming: unknown): unknown;
+export declare function normalizeOrigin(value?: string | null, baseOrigin?: string | null): string | null;
+/**
+ * Match the injected preview focus bridge: after in-iframe navigations,
+ * document.referrer becomes the previous preview page (same origin), so we
+ * must retain the real parent origin from the first embed.
+ */
+export declare function resolveParentOrigin(): string | null;
+export declare function readCachedSiteData<T = SiteData>(): T | null;
+export interface SiteDataProviderProps<T = SiteData> {
+    children: ReactNode;
+    initialSiteData?: T;
+    fallbackSiteData?: T;
+}
+export declare function SiteDataProvider<T extends SiteData = SiteData>({ children, initialSiteData, fallbackSiteData, }: SiteDataProviderProps<T>): React.JSX.Element;
+export declare function useSiteData<T = SiteData>(): T;
+export declare function contentObject(value: unknown): GenericRecord;
+export declare function contentText(value: unknown): string;
+export declare function contentList<Item = unknown>(value: unknown): Item[];
+export declare function parseFieldPath(path: string): Array<string | number>;
+export declare function getFieldStyle(content: unknown, path?: string): GenericRecord | null;
+export declare function useFieldStyle(path?: string): GenericRecord | null;
+/**
+ * Official DENEB UI data aliases for modern storefront development.
+ * Fully compatible with Fivora visual editing engine and marketplace preview.
+ */
+export declare const DenebDataProvider: typeof SiteDataProvider;
+export declare const useDenebData: typeof useSiteData;
+export declare const DenebDataContext: React.Context<SiteData>;
+export type DenebData = SiteData;

package/dist/SiteDataProvider.js

@@ -0,0 +1,316 @@
+"use strict";
+'use client';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DenebDataContext = exports.useDenebData = exports.DenebDataProvider = exports.SiteDataContext = exports.PREVIEW_FIELD_ATTRIBUTE = exports.LEGACY_PREVIEW_FOCUS_MESSAGE = exports.PREVIEW_FOCUS_MESSAGE = exports.DENEB_PREVIEW_FOCUS_MESSAGE = exports.LEGACY_PREVIEW_READY_MESSAGE = exports.PREVIEW_READY_MESSAGE = exports.DENEB_PREVIEW_READY_MESSAGE = exports.LEGACY_PREVIEW_DATA_MESSAGE = exports.PREVIEW_DATA_MESSAGE = exports.DENEB_PREVIEW_DATA_MESSAGE = void 0;
+exports.isRecord = isRecord;
+exports.mergeSiteData = mergeSiteData;
+exports.normalizeOrigin = normalizeOrigin;
+exports.resolveParentOrigin = resolveParentOrigin;
+exports.readCachedSiteData = readCachedSiteData;
+exports.SiteDataProvider = SiteDataProvider;
+exports.useSiteData = useSiteData;
+exports.contentObject = contentObject;
+exports.contentText = contentText;
+exports.contentList = contentList;
+exports.parseFieldPath = parseFieldPath;
+exports.getFieldStyle = getFieldStyle;
+exports.useFieldStyle = useFieldStyle;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+exports.DENEB_PREVIEW_DATA_MESSAGE = 'DENEB_PREVIEW_SITE_DATA';
+exports.PREVIEW_DATA_MESSAGE = 'FIVORA_PREVIEW_SITE_DATA';
+const PREVIOUS_PREVIEW_PREFIX = `${['MARKET', 'PLACE'].join('')}_PREVIEW_`;
+const previousPreviewMessage = (suffix) => `${PREVIOUS_PREVIEW_PREFIX}${suffix}`;
+const previousPreviewStorageKey = (suffix) => `__${PREVIOUS_PREVIEW_PREFIX}${suffix}__`;
+exports.LEGACY_PREVIEW_DATA_MESSAGE = previousPreviewMessage('SITE_DATA');
+exports.DENEB_PREVIEW_READY_MESSAGE = 'DENEB_PREVIEW_READY';
+exports.PREVIEW_READY_MESSAGE = 'FIVORA_PREVIEW_READY';
+exports.LEGACY_PREVIEW_READY_MESSAGE = previousPreviewMessage('READY');
+exports.DENEB_PREVIEW_FOCUS_MESSAGE = 'DENEB_PREVIEW_FOCUS_PAGE';
+exports.PREVIEW_FOCUS_MESSAGE = 'FIVORA_PREVIEW_FOCUS_PAGE';
+exports.LEGACY_PREVIEW_FOCUS_MESSAGE = previousPreviewMessage('FOCUS_PAGE');
+exports.PREVIEW_FIELD_ATTRIBUTE = 'data-preview-field-path';
+const PARENT_ORIGIN_KEY = '__FIVORA_PREVIEW_PARENT_ORIGIN__';
+const LEGACY_PARENT_ORIGIN_KEY = previousPreviewStorageKey('PARENT_ORIGIN');
+const SITE_DATA_CACHE_KEY = '__FIVORA_PREVIEW_SITE_DATA_CACHE__';
+const LEGACY_SITE_DATA_CACHE_KEY = previousPreviewStorageKey('SITE_DATA_CACHE');
+const SITE_DATA_GLOBAL_KEY = '__FIVORA_PREVIEW_SITE_DATA__';
+const LEGACY_SITE_DATA_GLOBAL_KEY = previousPreviewStorageKey('SITE_DATA');
+exports.SiteDataContext = (0, react_1.createContext)({});
+function isRecord(value) {
+    return Boolean(value) && typeof value === 'object' && !Array.isArray(value);
+}
+function mergeSiteData(current, incoming) {
+    if (Array.isArray(incoming))
+        return incoming;
+    if (!isRecord(incoming))
+        return incoming;
+    const base = isRecord(current) ? current : {};
+    const next = { ...base };
+    for (const key of Object.keys(incoming)) {
+        // Parent preview always sends complete content/media snapshots. Replacing
+        // them wholesale avoids deep-cloning large collections on every keystroke.
+        if (key === 'content' || key === 'media') {
+            next[key] = incoming[key];
+            continue;
+        }
+        next[key] = mergeSiteData(base[key], incoming[key]);
+    }
+    return next;
+}
+function normalizeOrigin(value, baseOrigin) {
+    if (!value || value.trim() === 'null')
+        return null;
+    try {
+        const origin = new URL(value, baseOrigin ?? undefined).origin;
+        return origin === 'null' ? null : origin;
+    }
+    catch {
+        return null;
+    }
+}
+function readRememberedParentOrigin() {
+    try {
+        return (window.sessionStorage.getItem(PARENT_ORIGIN_KEY) ||
+            window.sessionStorage.getItem(LEGACY_PARENT_ORIGIN_KEY));
+    }
+    catch {
+        return null;
+    }
+}
+function rememberParentOrigin(origin) {
+    if (!origin)
+        return;
+    try {
+        window.sessionStorage.setItem(PARENT_ORIGIN_KEY, origin);
+        window.sessionStorage.setItem(LEGACY_PARENT_ORIGIN_KEY, origin);
+    }
+    catch {
+        // Messaging still works without session storage.
+    }
+}
+/**
+ * Match the injected preview focus bridge: after in-iframe navigations,
+ * document.referrer becomes the previous preview page (same origin), so we
+ * must retain the real parent origin from the first embed.
+ */
+function resolveParentOrigin() {
+    if (typeof window === 'undefined')
+        return null;
+    const currentOrigin = normalizeOrigin(window.location.origin);
+    let ancestorOrigin = null;
+    try {
+        ancestorOrigin = normalizeOrigin(window.location
+            .ancestorOrigins?.item(0), currentOrigin);
+    }
+    catch {
+        ancestorOrigin = null;
+    }
+    let accessibleParentOrigin = null;
+    try {
+        accessibleParentOrigin =
+            window.parent !== window
+                ? normalizeOrigin(window.parent.location.origin, currentOrigin)
+                : null;
+    }
+    catch {
+        accessibleParentOrigin = null;
+    }
+    const referrerOrigin = normalizeOrigin(document.referrer, currentOrigin);
+    const rememberedOrigin = normalizeOrigin(readRememberedParentOrigin());
+    const resolved = ancestorOrigin ??
+        accessibleParentOrigin ??
+        (referrerOrigin && referrerOrigin !== currentOrigin
+            ? referrerOrigin
+            : null) ??
+        rememberedOrigin ??
+        referrerOrigin;
+    rememberParentOrigin(resolved);
+    return resolved;
+}
+function readCachedSiteData() {
+    if (typeof window === 'undefined')
+        return null;
+    try {
+        const globalStore = window;
+        const globalData = globalStore[SITE_DATA_GLOBAL_KEY] ??
+            globalStore[LEGACY_SITE_DATA_GLOBAL_KEY];
+        if (isRecord(globalData)) {
+            return globalData;
+        }
+    }
+    catch {
+        // Ignore non-extensible window environments.
+    }
+    try {
+        const raw = window.sessionStorage.getItem(SITE_DATA_CACHE_KEY) ||
+            window.sessionStorage.getItem(LEGACY_SITE_DATA_CACHE_KEY);
+        if (!raw)
+            return null;
+        const parsed = JSON.parse(raw);
+        return isRecord(parsed) ? parsed : null;
+    }
+    catch {
+        return null;
+    }
+}
+function SiteDataProvider({ children, initialSiteData, fallbackSiteData, }) {
+    // SSR HTML and the first client paint must match. Reading sessionStorage here
+    // causes React hydration error #418 when a previous preview left merchant
+    // content in the cache. Cache is applied after mount in useEffect instead.
+    const [siteData, setSiteData] = (0, react_1.useState)(() => {
+        return (initialSiteData ?? fallbackSiteData ?? {});
+    });
+    (0, react_1.useEffect)(() => {
+        let parentOrigin = resolveParentOrigin();
+        const applyIncomingSiteData = (incoming) => {
+            if (!isRecord(incoming))
+                return;
+            setSiteData((current) => mergeSiteData(current, incoming));
+            try {
+                window[SITE_DATA_GLOBAL_KEY] =
+                    incoming;
+                window[LEGACY_SITE_DATA_GLOBAL_KEY] = incoming;
+            }
+            catch {
+                // Ignore non-extensible window environments.
+            }
+            // Debounce session cache writes — stringify of large templates is costly.
+            const win = window;
+            window.clearTimeout(win.__fivoraSiteDataPersistTimer);
+            win.__fivoraSiteDataPersistTimer = window.setTimeout(() => {
+                try {
+                    const serialized = JSON.stringify(incoming);
+                    window.sessionStorage.setItem(SITE_DATA_CACHE_KEY, serialized);
+                    window.sessionStorage.setItem(LEGACY_SITE_DATA_CACHE_KEY, serialized);
+                }
+                catch {
+                    // Cache is best-effort.
+                }
+            }, 750);
+        };
+        const onMessage = (event) => {
+            if (event.source !== window.parent)
+                return;
+            if (!isRecord(event.data))
+                return;
+            const isData = event.data.type === exports.DENEB_PREVIEW_DATA_MESSAGE ||
+                event.data.type === exports.PREVIEW_DATA_MESSAGE ||
+                event.data.type === exports.LEGACY_PREVIEW_DATA_MESSAGE;
+            const isFocus = event.data.type === exports.DENEB_PREVIEW_FOCUS_MESSAGE ||
+                event.data.type === exports.PREVIEW_FOCUS_MESSAGE ||
+                event.data.type === exports.LEGACY_PREVIEW_FOCUS_MESSAGE;
+            if (!isData && !isFocus) {
+                return;
+            }
+            // Pin the first concrete parent origin when referrer was suppressed.
+            if (!parentOrigin) {
+                try {
+                    const candidateOrigin = new URL(event.origin).origin;
+                    if (candidateOrigin !== 'null') {
+                        parentOrigin = candidateOrigin;
+                        rememberParentOrigin(candidateOrigin);
+                    }
+                }
+                catch {
+                    return;
+                }
+            }
+            // Accept the remembered/resolved parent origin, or a same-origin relay
+            // from the injected focus bridge (used after in-iframe navigations).
+            const trustedOrigins = new Set([parentOrigin, window.location.origin].filter(Boolean));
+            if (!trustedOrigins.has(event.origin))
+                return;
+            if (isData && isRecord(event.data.siteData)) {
+                applyIncomingSiteData(event.data.siteData);
+                return;
+            }
+            if (isFocus) {
+                const fieldPath = typeof event.data.fieldPath === 'string' ? event.data.fieldPath : '';
+                if (!fieldPath)
+                    return;
+                requestAnimationFrame(() => {
+                    const target = document.querySelector(`[${exports.PREVIEW_FIELD_ATTRIBUTE}="${CSS.escape(fieldPath)}"]`);
+                    target?.scrollIntoView({ behavior: 'smooth', block: 'center' });
+                });
+            }
+        };
+        window.addEventListener('message', onMessage);
+        // Re-apply cache after mount in case the bridge published between
+        // useState init and listener registration.
+        const cached = readCachedSiteData();
+        if (cached) {
+            applyIncomingSiteData(cached);
+        }
+        window.parent.postMessage({ type: exports.DENEB_PREVIEW_READY_MESSAGE, pathname: window.location.pathname }, parentOrigin ?? '*');
+        window.parent.postMessage({ type: exports.PREVIEW_READY_MESSAGE, pathname: window.location.pathname }, parentOrigin ?? '*');
+        window.parent.postMessage({ type: exports.LEGACY_PREVIEW_READY_MESSAGE, pathname: window.location.pathname }, parentOrigin ?? '*');
+        return () => window.removeEventListener('message', onMessage);
+    }, []);
+    const value = (0, react_1.useMemo)(() => siteData, [siteData]);
+    return ((0, jsx_runtime_1.jsx)(exports.SiteDataContext.Provider, { value: value, children: children }));
+}
+function useSiteData() {
+    return (0, react_1.useContext)(exports.SiteDataContext);
+}
+function contentObject(value) {
+    return isRecord(value) ? value : {};
+}
+function contentText(value) {
+    return typeof value === 'string' ? value : '';
+}
+function contentList(value) {
+    return Array.isArray(value) ? value : [];
+}
+function parseFieldPath(path) {
+    if (!path)
+        return [];
+    return path
+        .replace(/\[(\d+)\]/g, ".$1")
+        .split(".")
+        .filter(Boolean)
+        .map((part) => (/^\d+$/.test(part) ? Number(part) : part));
+}
+function getFieldStyle(content, path) {
+    if (!content || !path || typeof content !== "object")
+        return null;
+    const parts = parseFieldPath(path);
+    if (parts.length === 0)
+        return null;
+    const last = parts.pop();
+    if (last === undefined)
+        return null;
+    let current = content;
+    for (const part of parts) {
+        if (typeof part === "number") {
+            if (!Array.isArray(current))
+                return null;
+            current = current[part];
+        }
+        else {
+            if (!isRecord(current))
+                return null;
+            current = current[part];
+        }
+    }
+    if (!isRecord(current))
+        return null;
+    const styleKey = `${String(last)}Style`;
+    const styleObj = current[styleKey];
+    return isRecord(styleObj) ? styleObj : null;
+}
+function useFieldStyle(path) {
+    const siteData = useSiteData();
+    return (0, react_1.useMemo)(() => {
+        if (!path || !siteData?.content)
+            return null;
+        return getFieldStyle(siteData.content, path);
+    }, [siteData?.content, path]);
+}
+/**
+ * Official DENEB UI data aliases for modern storefront development.
+ * Fully compatible with Fivora visual editing engine and marketplace preview.
+ */
+exports.DenebDataProvider = SiteDataProvider;
+exports.useDenebData = useSiteData;
+exports.DenebDataContext = exports.SiteDataContext;

package/dist/ThemeStyles.d.ts

@@ -0,0 +1,46 @@
+import React from 'react';
+export interface TemplateTheme {
+    primaryColor?: string;
+    secondaryColor?: string;
+    accentColor?: string;
+    backgroundColor?: string;
+    textColor?: string;
+    headingColor?: string;
+    mutedTextColor?: string;
+    linkColor?: string;
+    heroMinHeight?: string;
+    sectionPadding?: string;
+    baseSize?: string;
+    headingFont?: string;
+    bodyFont?: string;
+    borderRadius?: string;
+    align?: 'left' | 'center' | 'right';
+    [key: string]: unknown;
+}
+/**
+ * Pre-configured, high-converting theme presets tailored for different business categories.
+ * Allows developers and AI agents to instantly generate distinct designs without copy-pasting styles.
+ */
+export declare const THEME_PRESETS: Record<string, TemplateTheme>;
+/**
+ * Merges category presets with custom developer/agent overrides.
+ */
+export declare function getCategoryTheme(category: keyof typeof THEME_PRESETS | string, overrides?: Partial<TemplateTheme>): TemplateTheme;
+/**
+ * Extracts a typed CSSProperties object containing both standard and custom theme tokens.
+ * Any custom property defined by a developer in `theme` (e.g. cardBg: "#111")
+ * is automatically converted to a CSS variable (e.g. --card-bg: #111).
+ */
+export declare function getThemeCssProperties(theme?: TemplateTheme | null): React.CSSProperties;
+export interface ThemeStylesProps {
+    theme?: TemplateTheme | null;
+    defaultPrimary?: string;
+    defaultSecondary?: string;
+    defaultAccent?: string;
+    defaultBg?: string;
+    defaultText?: string;
+}
+/**
+ * Automatically injects standard and custom fivora theme variables into the document.
+ */
+export declare function ThemeStyles({ theme, defaultPrimary, defaultSecondary, defaultAccent, defaultBg, defaultText, }: ThemeStylesProps): React.JSX.Element;

package/dist/ThemeStyles.js

@@ -0,0 +1,181 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.THEME_PRESETS = void 0;
+exports.getCategoryTheme = getCategoryTheme;
+exports.getThemeCssProperties = getThemeCssProperties;
+exports.ThemeStyles = ThemeStyles;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * Pre-configured, high-converting theme presets tailored for different business categories.
+ * Allows developers and AI agents to instantly generate distinct designs without copy-pasting styles.
+ */
+exports.THEME_PRESETS = {
+    restaurant: {
+        primaryColor: '#b45309', // Warm amber
+        secondaryColor: '#1c1917', // Deep charcoal
+        accentColor: '#f59e0b', // Golden yellow
+        backgroundColor: '#0c0a09', // Dark atmospheric background
+        textColor: '#f5f5f4', // Off-white
+        headingFont: 'Playfair Display, Georgia, serif',
+        bodyFont: 'Inter, sans-serif',
+        borderRadius: '12px',
+        align: 'left',
+    },
+    medical: {
+        primaryColor: '#0284c7', // Serene ocean blue
+        secondaryColor: '#0f172a', // Deep slate
+        accentColor: '#0d9488', // Teal accent
+        backgroundColor: '#ffffff', // Pure clean white
+        textColor: '#334155', // Slate body text
+        headingFont: 'Plus Jakarta Sans, sans-serif',
+        bodyFont: 'Inter, sans-serif',
+        borderRadius: '8px',
+        align: 'left',
+    },
+    luxury: {
+        primaryColor: '#d4af37', // Metallic gold
+        secondaryColor: '#000000', // Jet black
+        accentColor: '#e5e5e5', // Platinum silver
+        backgroundColor: '#0a0a0a', // Obsidian dark
+        textColor: '#ffffff',
+        headingFont: 'Cormorant Garamond, serif',
+        bodyFont: 'Montserrat, sans-serif',
+        borderRadius: '4px',
+        align: 'center',
+    },
+    tech: {
+        primaryColor: '#6366f1', // Electric indigo
+        secondaryColor: '#0f172a', // Dark slate
+        accentColor: '#06b6d4', // Neon cyan
+        backgroundColor: '#030712', // Midnight abyss
+        textColor: '#f8fafc',
+        headingFont: 'Inter, system-ui, sans-serif',
+        bodyFont: 'Inter, sans-serif',
+        borderRadius: '16px',
+        align: 'left',
+    },
+    retail: {
+        primaryColor: '#e11d48', // Vibrant rose/coral
+        secondaryColor: '#18181b', // Zinc
+        accentColor: '#fbbf24', // Sunny amber
+        backgroundColor: '#ffffff',
+        textColor: '#27272a',
+        headingFont: 'Outfit, sans-serif',
+        bodyFont: 'Inter, sans-serif',
+        borderRadius: '12px',
+        align: 'left',
+    },
+    corporate: {
+        primaryColor: '#1e3a8a', // Corporate navy
+        secondaryColor: '#0f172a', // Slate
+        accentColor: '#3b82f6', // Bright cobalt
+        backgroundColor: '#f8fafc', // Soft light gray
+        textColor: '#1e293b',
+        headingFont: 'Merriweather, serif',
+        bodyFont: 'Inter, sans-serif',
+        borderRadius: '6px',
+        align: 'left',
+    },
+    cyberpunk: {
+        primaryColor: '#f43f5e', // Neon crimson
+        secondaryColor: '#09090b', // Deep zinc
+        accentColor: '#06b6d4', // Electric cyan
+        backgroundColor: '#09090b', // Dark void
+        textColor: '#f4f4f5',
+        headingFont: 'Outfit, sans-serif',
+        bodyFont: 'Inter, sans-serif',
+        borderRadius: '4px',
+        align: 'left',
+    },
+    minimalDark: {
+        primaryColor: '#e2e8f0', // Clean silver
+        secondaryColor: '#000000', // Pitch black
+        accentColor: '#38bdf8', // Sky accent
+        backgroundColor: '#0c0a09', // Dark basalt
+        textColor: '#f1f5f9',
+        headingFont: 'Plus Jakarta Sans, sans-serif',
+        bodyFont: 'Inter, sans-serif',
+        borderRadius: '12px',
+        align: 'left',
+    },
+    nordicPastel: {
+        primaryColor: '#0f766e', // Nordic pine
+        secondaryColor: '#1e293b', // Deep slate
+        accentColor: '#f59e0b', // Amber sun
+        backgroundColor: '#fafaf9', // Crisp stone
+        textColor: '#334155',
+        headingFont: 'Playfair Display, serif',
+        bodyFont: 'Inter, sans-serif',
+        borderRadius: '16px',
+        align: 'left',
+    },
+    emeraldGold: {
+        primaryColor: '#059669', // Emerald
+        secondaryColor: '#064e3b', // Deep forest
+        accentColor: '#d97706', // Imperial gold
+        backgroundColor: '#022c22', // Emerald dark
+        textColor: '#ecfdf5',
+        headingFont: 'Cormorant Garamond, serif',
+        bodyFont: 'Montserrat, sans-serif',
+        borderRadius: '10px',
+        align: 'center',
+    },
+};
+/**
+ * Merges category presets with custom developer/agent overrides.
+ */
+function getCategoryTheme(category, overrides) {
+    const base = exports.THEME_PRESETS[category] || exports.THEME_PRESETS.tech;
+    return { ...base, ...overrides };
+}
+/**
+ * Extracts a typed CSSProperties object containing both standard and custom theme tokens.
+ * Any custom property defined by a developer in `theme` (e.g. cardBg: "#111")
+ * is automatically converted to a CSS variable (e.g. --card-bg: #111).
+ */
+function getThemeCssProperties(theme) {
+    const customVars = {};
+    if (theme) {
+        for (const [key, val] of Object.entries(theme)) {
+            if (typeof val === 'string' || typeof val === 'number') {
+                const cssVarName = `--${key.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase()}`;
+                customVars[cssVarName] = String(val);
+            }
+        }
+    }
+    return {
+        '--brand-color': theme?.primaryColor || '#2563eb',
+        '--brand-secondary': theme?.secondaryColor || '#0f172a',
+        '--brand-accent': theme?.accentColor || '#14b8a6',
+        '--page-background': theme?.backgroundColor || '#ffffff',
+        '--page-text': theme?.textColor || '#0f172a',
+        '--heading-color': theme?.headingColor || theme?.secondaryColor || '#0f172a',
+        '--muted-text': theme?.mutedTextColor || '#64748b',
+        '--link-color': theme?.linkColor || theme?.primaryColor || '#2563eb',
+        '--hero-min-height': theme?.heroMinHeight || '72vh',
+        '--section-padding': theme?.sectionPadding || '5rem',
+        '--base-size': theme?.baseSize || '16px',
+        '--heading-font': theme?.headingFont || 'Inter, sans-serif',
+        '--body-font': theme?.bodyFont || 'Inter, sans-serif',
+        '--border-radius': theme?.borderRadius || '8px',
+        '--content-align': theme?.align || 'left',
+        fontFamily: theme?.bodyFont || 'Inter, sans-serif',
+        ...customVars,
+    };
+}
+/**
+ * Automatically injects standard and custom fivora theme variables into the document.
+ */
+function ThemeStyles({ theme, defaultPrimary = '#2563eb', defaultSecondary = '#0f172a', defaultAccent = '#14b8a6', defaultBg = '#ffffff', defaultText = '#0f172a', }) {
+    const styleProps = getThemeCssProperties(theme);
+    const cssLines = Object.entries(styleProps)
+        .filter(([key]) => key.startsWith('--'))
+        .map(([key, value]) => `  ${key}: ${value};`)
+        .join('\n');
+    const css = `
+    :root {
+${cssLines}
+    }
+  `;
+    return (0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: { __html: css } });
+}

package/dist/business/BusinessHours.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+export interface DaySchedule {
+    open?: string | null;
+    close?: string | null;
+    closed?: boolean | null;
+}
+export type WeeklyHours = Record<string, DaySchedule | string | null | undefined>;
+export interface BusinessHoursProps {
+    hours?: WeeklyHours | null;
+    title?: string;
+    fieldPath?: string;
+    showStatusBadge?: boolean;
+    compact?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * BusinessHours component displaying weekly operating schedule with live Open/Closed status.
+ */
+export declare function BusinessHours({ hours, title, fieldPath, showStatusBadge, compact, className, style, }: BusinessHoursProps): React.JSX.Element | null;