@aprovan/patchwork-image-shadcn 0.1.0-dev.ba8f277 → 0.1.0-dev.c680591

package/dist/{chunk-7LFKP2EW.js → chunk-LHCX4D5M.js}

@@ -199,4 +199,4 @@ export {
   setup,
   cleanup
 };
-//# sourceMappingURL=chunk-7LFKP2EW.js.map
+//# sourceMappingURL=chunk-LHCX4D5M.js.map

package/dist/chunk-LHCX4D5M.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/setup.ts"],"sourcesContent":["/**\n * @aprovan/patchwork-image-shadcn\n *\n * Setup function for the ShadCN/ui image.\n * Uses Tailwind Play CDN for runtime CSS generation.\n */\n\nexport interface SetupOptions {\n  /** Enable dark mode (default: false - respects system preference) */\n  darkMode?: boolean | \"system\";\n  /** Inject CSS runtime (default: true) */\n  cssRuntime?: boolean;\n  /** Custom CSS variable overrides */\n  cssVariables?: Record<string, string>;\n}\n\nexport const DEFAULT_CSS_VARIABLES = {\n  \"--background\": \"0 0% 100%\",\n  \"--foreground\": \"222.2 84% 4.9%\",\n  \"--card\": \"0 0% 100%\",\n  \"--card-foreground\": \"222.2 84% 4.9%\",\n  \"--popover\": \"0 0% 100%\",\n  \"--popover-foreground\": \"222.2 84% 4.9%\",\n  \"--primary\": \"222.2 47.4% 11.2%\",\n  \"--primary-foreground\": \"210 40% 98%\",\n  \"--secondary\": \"210 40% 96.1%\",\n  \"--secondary-foreground\": \"222.2 47.4% 11.2%\",\n  \"--muted\": \"210 40% 96.1%\",\n  \"--muted-foreground\": \"215.4 16.3% 46.9%\",\n  \"--accent\": \"210 40% 96.1%\",\n  \"--accent-foreground\": \"222.2 47.4% 11.2%\",\n  \"--destructive\": \"0 84.2% 60.2%\",\n  \"--destructive-foreground\": \"210 40% 98%\",\n  \"--border\": \"214.3 31.8% 91.4%\",\n  \"--input\": \"214.3 31.8% 91.4%\",\n  \"--ring\": \"222.2 84% 4.9%\",\n  \"--radius\": \"0.5rem\",\n};\n\nexport const DARK_CSS_VARIABLES = {\n  \"--background\": \"222.2 84% 4.9%\",\n  \"--foreground\": \"210 40% 98%\",\n  \"--card\": \"222.2 84% 4.9%\",\n  \"--card-foreground\": \"210 40% 98%\",\n  \"--popover\": \"222.2 84% 4.9%\",\n  \"--popover-foreground\": \"210 40% 98%\",\n  \"--primary\": \"210 40% 98%\",\n  \"--primary-foreground\": \"222.2 47.4% 11.2%\",\n  \"--secondary\": \"217.2 32.6% 17.5%\",\n  \"--secondary-foreground\": \"210 40% 98%\",\n  \"--muted\": \"217.2 32.6% 17.5%\",\n  \"--muted-foreground\": \"215 20.2% 65.1%\",\n  \"--accent\": \"217.2 32.6% 17.5%\",\n  \"--accent-foreground\": \"210 40% 98%\",\n  \"--destructive\": \"0 62.8% 30.6%\",\n  \"--destructive-foreground\": \"210 40% 98%\",\n  \"--border\": \"217.2 32.6% 17.5%\",\n  \"--input\": \"217.2 32.6% 17.5%\",\n  \"--ring\": \"212.7 26.8% 83.9%\",\n  \"--radius\": \"0.5rem\",\n};\n\n// Track CSS runtime state\nlet tailwindLoadPromise: Promise<void> | null = null;\nlet themeStyleElement: HTMLStyleElement | null = null;\nconst containerObservers: Map<HTMLElement, MutationObserver> = new Map();\n\n// Window type augmentation for Tailwind Play CDN\ndeclare global {\n  interface Window {\n    tailwind?: {\n      config?: Record<string, unknown>;\n    };\n  }\n}\n\n/**\n * Setup the ShadCN/ui image runtime environment\n *\n * Injects Tailwind Play CDN and theme CSS variables.\n * Sets up a MutationObserver to trigger CSS regeneration when content changes.\n *\n * @param root - Root element where the widget will be mounted\n * @param options - Optional configuration\n */\nexport async function setup(\n  root: HTMLElement,\n  options: SetupOptions = {},\n): Promise<void> {\n  const { darkMode = \"system\", cssRuntime = true, cssVariables = {} } = options;\n\n  // Inject Tailwind Play CDN and wait for it to load\n  if (cssRuntime) {\n    await injectTailwindPlayCdn();\n  }\n\n  // Determine if dark mode\n  let isDark = false;\n  if (darkMode === true) {\n    isDark = true;\n  } else if (darkMode === \"system\") {\n    isDark =\n      window.matchMedia?.(\"(prefers-color-scheme: dark)\").matches ?? false;\n  }\n\n  // Create or update theme style element\n  if (!themeStyleElement) {\n    themeStyleElement = document.createElement(\"style\");\n    themeStyleElement.id = \"patchwork-image-shadcn-theme\";\n    document.head.appendChild(themeStyleElement);\n  }\n\n  // Build CSS variables\n  const baseVars = isDark ? DARK_CSS_VARIABLES : DEFAULT_CSS_VARIABLES;\n  const mergedVars = { ...baseVars, ...cssVariables };\n  const cssVarsString = Object.entries(mergedVars)\n    .map(([key, value]) => `${key}: ${value};`)\n    .join(\"\\n    \");\n\n  themeStyleElement.textContent = `\n    /* Patchwork ShadCN Theme */\n    :root {\n      ${cssVarsString}\n    }\n\n    .patchwork-widget {\n      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\n      line-height: 1.5;\n      color: hsl(var(--foreground));\n      background-color: hsl(var(--background));\n    }\n\n    .patchwork-widget *, .patchwork-widget *::before, .patchwork-widget *::after {\n      box-sizing: border-box;\n      border-color: hsl(var(--border));\n    }\n  `;\n\n  // Mark root as patchwork widget container\n  root.classList.add(\"patchwork-widget\");\n\n  // Set dark mode class if needed\n  if (isDark) {\n    root.classList.add(\"dark\");\n  } else {\n    root.classList.remove(\"dark\");\n  }\n\n  // Set up MutationObserver to trigger Tailwind re-compile on content changes\n  if (cssRuntime && !containerObservers.has(root)) {\n    const observer = new MutationObserver(() => {\n      // Trigger Tailwind to re-scan by dispatching a custom event\n      // The Play CDN listens for this internally\n      requestAnimationFrame(() => {\n        // Force Tailwind to re-process by triggering a mutation\n        const tempNode = document.createTextNode(\"\");\n        document.body.appendChild(tempNode);\n        document.body.removeChild(tempNode);\n      });\n    });\n\n    observer.observe(root, {\n      childList: true,\n      subtree: true,\n      attributes: true,\n      attributeFilter: [\"class\"],\n    });\n\n    containerObservers.set(root, observer);\n  }\n}\n\n/**\n * Inject Tailwind Play CDN script\n *\n * The Play CDN automatically observes the DOM and generates CSS\n * for any Tailwind classes it finds.\n *\n * Returns a promise that resolves when Tailwind is fully loaded.\n */\nfunction injectTailwindPlayCdn(): Promise<void> {\n  // Return existing promise if already loading/loaded\n  if (tailwindLoadPromise) {\n    return tailwindLoadPromise;\n  }\n\n  // Check if already injected\n  if (document.getElementById(\"patchwork-tailwind-cdn\")) {\n    return Promise.resolve();\n  }\n\n  tailwindLoadPromise = new Promise((resolve, reject) => {\n    // First, set up the config object BEFORE loading Tailwind\n    // Tailwind Play CDN reads window.tailwind.config on load\n    window.tailwind = {\n      config: {\n        darkMode: \"class\",\n        theme: {\n          extend: {\n            colors: {\n              border: \"hsl(var(--border))\",\n              input: \"hsl(var(--input))\",\n              ring: \"hsl(var(--ring))\",\n              background: \"hsl(var(--background))\",\n              foreground: \"hsl(var(--foreground))\",\n              primary: {\n                DEFAULT: \"hsl(var(--primary))\",\n                foreground: \"hsl(var(--primary-foreground))\",\n              },\n              secondary: {\n                DEFAULT: \"hsl(var(--secondary))\",\n                foreground: \"hsl(var(--secondary-foreground))\",\n              },\n              destructive: {\n                DEFAULT: \"hsl(var(--destructive))\",\n                foreground: \"hsl(var(--destructive-foreground))\",\n              },\n              muted: {\n                DEFAULT: \"hsl(var(--muted))\",\n                foreground: \"hsl(var(--muted-foreground))\",\n              },\n              accent: {\n                DEFAULT: \"hsl(var(--accent))\",\n                foreground: \"hsl(var(--accent-foreground))\",\n              },\n              popover: {\n                DEFAULT: \"hsl(var(--popover))\",\n                foreground: \"hsl(var(--popover-foreground))\",\n              },\n              card: {\n                DEFAULT: \"hsl(var(--card))\",\n                foreground: \"hsl(var(--card-foreground))\",\n              },\n            },\n            borderRadius: {\n              lg: \"var(--radius)\",\n              md: \"calc(var(--radius) - 2px)\",\n              sm: \"calc(var(--radius) - 4px)\",\n            },\n          },\n        },\n      },\n    };\n\n    // Load Tailwind Play CDN\n    const script = document.createElement(\"script\");\n    script.id = \"patchwork-tailwind-cdn\";\n    script.src = \"https://cdn.tailwindcss.com\";\n\n    // Wait for script to load before resolving\n    script.onload = () => {\n      resolve();\n    };\n    script.onerror = () => {\n      reject(new Error(\"Failed to load Tailwind Play CDN\"));\n    };\n\n    document.head.appendChild(script);\n  });\n\n  return tailwindLoadPromise;\n}\n\n/**\n * Cleanup any global resources added by setup\n */\nexport function cleanup(): void {\n  if (themeStyleElement) {\n    themeStyleElement.remove();\n    themeStyleElement = null;\n  }\n\n  const tailwindScript = document.getElementById(\"patchwork-tailwind-cdn\");\n  if (tailwindScript) {\n    tailwindScript.remove();\n    tailwindLoadPromise = null;\n  }\n\n  // Clean up the tailwind config from window\n  if (window.tailwind) {\n    delete window.tailwind;\n  }\n\n  // Clean up observers\n  containerObservers.forEach((observer) => observer.disconnect());\n  containerObservers.clear();\n}\n"],"mappings":"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","names":[]}

package/dist/index.d.ts

@@ -1,5 +1,4 @@
 export { DARK_CSS_VARIABLES, DEFAULT_CSS_VARIABLES, SetupOptions, cleanup, setup } from './setup.js';
-export { HtmlOptions, ImportMapEntry, generateHtml, getDefaultImportMap, getFrameworkDependencies, transformWidgetCode } from './html.js';
 import { ClassValue } from 'clsx';
 export { clsx } from 'clsx';
 export { twMerge } from 'tailwind-merge';

package/dist/index.js

@@ -1,15 +1,9 @@
-import {
-  generateHtml,
-  getDefaultImportMap,
-  getFrameworkDependencies,
-  transformWidgetCode
-} from "./chunk-4QNUSFQA.js";
 import {
   DARK_CSS_VARIABLES,
   DEFAULT_CSS_VARIABLES,
   cleanup,
   setup
-} from "./chunk-7LFKP2EW.js";
+} from "./chunk-LHCX4D5M.js";
 
 // ../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs
 function r(e) {
@@ -2539,11 +2533,7 @@ export {
   clsx,
   cn,
   cva,
-  generateHtml,
-  getDefaultImportMap,
-  getFrameworkDependencies,
   setup,
-  transformWidgetCode,
   twMerge
 };
 //# sourceMappingURL=index.js.map