typewritingclass-compiler 0.1.2 → 0.1.4

package/dist/chunk-Y33BZFTH.js

@@ -0,0 +1,114 @@
+// src/loadTheme.ts
+async function loadTheme() {
+  const [colorsModule, spacingModule, typographyModule, sizesModule, shadowsModule, bordersModule] = await Promise.all([
+    import("typewritingclass/theme/colors"),
+    import("typewritingclass/theme"),
+    import("typewritingclass/theme/typography"),
+    import("typewritingclass/theme/sizes"),
+    import("typewritingclass/theme/shadows"),
+    import("typewritingclass/theme/borders")
+  ]);
+  const colorScaleNames = [
+    "slate",
+    "gray",
+    "zinc",
+    "neutral",
+    "stone",
+    "red",
+    "orange",
+    "amber",
+    "yellow",
+    "lime",
+    "green",
+    "emerald",
+    "teal",
+    "cyan",
+    "sky",
+    "blue",
+    "indigo",
+    "violet",
+    "purple",
+    "fuchsia",
+    "pink",
+    "rose"
+  ];
+  const colors = {};
+  for (const name of colorScaleNames) {
+    const scale = colorsModule[name];
+    if (scale && typeof scale === "object") {
+      colors[name] = {};
+      for (const [shade, hex] of Object.entries(scale)) {
+        colors[name][String(shade)] = hex;
+      }
+    }
+  }
+  const namedColors = {
+    white: colorsModule.white,
+    black: colorsModule.black,
+    transparent: colorsModule.transparent,
+    currentColor: colorsModule.currentColor
+  };
+  const { spacing: spacingNs } = spacingModule;
+  const spacing = {};
+  if (spacingNs && spacingNs.spacingScale) {
+    for (const [key, val] of Object.entries(spacingNs.spacingScale)) {
+      spacing[String(key)] = val;
+    }
+  }
+  const textSizeNames = ["xs", "sm", "base", "lg", "xl", "_2xl", "_3xl", "_4xl", "_5xl", "_6xl", "_7xl", "_8xl", "_9xl"];
+  const textSizes = {};
+  for (const name of textSizeNames) {
+    const token = typographyModule[name];
+    if (token && typeof token === "object" && "fontSize" in token) {
+      textSizes[name] = { fontSize: token.fontSize, lineHeight: token.lineHeight };
+    }
+  }
+  const weightNames = ["thin", "extralight", "light", "normal", "medium", "semibold", "bold", "extrabold", "black_"];
+  const fontWeights = {};
+  for (const name of weightNames) {
+    const val = typographyModule[name];
+    if (typeof val === "string") {
+      fontWeights[name] = val;
+    }
+  }
+  const radiusNames = ["none", "sm", "DEFAULT", "md", "lg", "xl", "_2xl", "_3xl", "full"];
+  const radii = {};
+  for (const name of radiusNames) {
+    const val = bordersModule[name];
+    if (typeof val === "string") {
+      radii[name] = val;
+    }
+  }
+  const shadowNames = ["sm", "DEFAULT", "md", "lg", "xl", "_2xl", "inner", "none"];
+  const shadows = {};
+  for (const name of shadowNames) {
+    const val = shadowsModule[name];
+    if (typeof val === "string") {
+      shadows[name] = val;
+    }
+  }
+  const sizeNames = ["full", "screen", "screenH", "min", "max", "fit", "auto"];
+  const sizes = {};
+  for (const name of sizeNames) {
+    const val = sizesModule[name];
+    if (typeof val === "string") {
+      sizes[name] = val;
+    }
+  }
+  return {
+    colors: JSON.stringify(colors),
+    namedColors: JSON.stringify(namedColors),
+    spacing: JSON.stringify(spacing),
+    textSizes: JSON.stringify(textSizes),
+    fontWeights: JSON.stringify(fontWeights),
+    radii: JSON.stringify(radii),
+    shadows: JSON.stringify(shadows),
+    sizes: JSON.stringify(sizes),
+    defaultRadius: radii["DEFAULT"] ?? "0.25rem",
+    defaultShadow: shadows["DEFAULT"] ?? "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)"
+  };
+}
+
+export {
+  loadTheme
+};

package/dist/index.cjs

@@ -0,0 +1,290 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  default: () => twcPlugin,
+  generateCss: () => generateCss,
+  nativeTransform: () => nativeTransform
+});
+module.exports = __toCommonJS(src_exports);
+
+// ../../node_modules/.pnpm/tsup@8.5.1_postcss@8.5.6_typescript@5.9.3/node_modules/tsup/assets/cjs_shims.js
+var getImportMetaUrl = () => typeof document === "undefined" ? new URL(`file:${__filename}`).href : document.currentScript && document.currentScript.tagName.toUpperCase() === "SCRIPT" ? document.currentScript.src : new URL("main.js", document.baseURI).href;
+var importMetaUrl = /* @__PURE__ */ getImportMetaUrl();
+
+// src/index.ts
+var import_magic_string = __toESM(require("magic-string"), 1);
+var import_module = require("module");
+var import_path = require("path");
+var import_url = require("url");
+
+// src/loadTheme.ts
+async function loadTheme() {
+  const [colorsModule, spacingModule, typographyModule, sizesModule, shadowsModule, bordersModule] = await Promise.all([
+    import("typewritingclass/theme/colors"),
+    import("typewritingclass/theme"),
+    import("typewritingclass/theme/typography"),
+    import("typewritingclass/theme/sizes"),
+    import("typewritingclass/theme/shadows"),
+    import("typewritingclass/theme/borders")
+  ]);
+  const colorScaleNames = [
+    "slate",
+    "gray",
+    "zinc",
+    "neutral",
+    "stone",
+    "red",
+    "orange",
+    "amber",
+    "yellow",
+    "lime",
+    "green",
+    "emerald",
+    "teal",
+    "cyan",
+    "sky",
+    "blue",
+    "indigo",
+    "violet",
+    "purple",
+    "fuchsia",
+    "pink",
+    "rose"
+  ];
+  const colors = {};
+  for (const name of colorScaleNames) {
+    const scale = colorsModule[name];
+    if (scale && typeof scale === "object") {
+      colors[name] = {};
+      for (const [shade, hex] of Object.entries(scale)) {
+        colors[name][String(shade)] = hex;
+      }
+    }
+  }
+  const namedColors = {
+    white: colorsModule.white,
+    black: colorsModule.black,
+    transparent: colorsModule.transparent,
+    currentColor: colorsModule.currentColor
+  };
+  const { spacing: spacingNs } = spacingModule;
+  const spacing = {};
+  if (spacingNs && spacingNs.spacingScale) {
+    for (const [key, val] of Object.entries(spacingNs.spacingScale)) {
+      spacing[String(key)] = val;
+    }
+  }
+  const textSizeNames = ["xs", "sm", "base", "lg", "xl", "_2xl", "_3xl", "_4xl", "_5xl", "_6xl", "_7xl", "_8xl", "_9xl"];
+  const textSizes = {};
+  for (const name of textSizeNames) {
+    const token = typographyModule[name];
+    if (token && typeof token === "object" && "fontSize" in token) {
+      textSizes[name] = { fontSize: token.fontSize, lineHeight: token.lineHeight };
+    }
+  }
+  const weightNames = ["thin", "extralight", "light", "normal", "medium", "semibold", "bold", "extrabold", "black_"];
+  const fontWeights = {};
+  for (const name of weightNames) {
+    const val = typographyModule[name];
+    if (typeof val === "string") {
+      fontWeights[name] = val;
+    }
+  }
+  const radiusNames = ["none", "sm", "DEFAULT", "md", "lg", "xl", "_2xl", "_3xl", "full"];
+  const radii = {};
+  for (const name of radiusNames) {
+    const val = bordersModule[name];
+    if (typeof val === "string") {
+      radii[name] = val;
+    }
+  }
+  const shadowNames = ["sm", "DEFAULT", "md", "lg", "xl", "_2xl", "inner", "none"];
+  const shadows = {};
+  for (const name of shadowNames) {
+    const val = shadowsModule[name];
+    if (typeof val === "string") {
+      shadows[name] = val;
+    }
+  }
+  const sizeNames = ["full", "screen", "screenH", "min", "max", "fit", "auto"];
+  const sizes = {};
+  for (const name of sizeNames) {
+    const val = sizesModule[name];
+    if (typeof val === "string") {
+      sizes[name] = val;
+    }
+  }
+  return {
+    colors: JSON.stringify(colors),
+    namedColors: JSON.stringify(namedColors),
+    spacing: JSON.stringify(spacing),
+    textSizes: JSON.stringify(textSizes),
+    fontWeights: JSON.stringify(fontWeights),
+    radii: JSON.stringify(radii),
+    shadows: JSON.stringify(shadows),
+    sizes: JSON.stringify(sizes),
+    defaultRadius: radii["DEFAULT"] ?? "0.25rem",
+    defaultShadow: shadows["DEFAULT"] ?? "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)"
+  };
+}
+
+// src/index.ts
+var require2 = (0, import_module.createRequire)(importMetaUrl);
+var __dirname = (0, import_path.dirname)((0, import_url.fileURLToPath)(importMetaUrl));
+var native = require2((0, import_path.resolve)(__dirname, "..", "index.node"));
+var { transform: nativeTransform, generateCss } = native;
+var VIRTUAL_CSS_ID = "virtual:twc.css";
+var RESOLVED_VIRTUAL_CSS_ID = "\0" + VIRTUAL_CSS_ID;
+function twcPlugin(options) {
+  const strict = options?.strict ?? true;
+  let themeInput;
+  let layer = 0;
+  const fileRules = /* @__PURE__ */ new Map();
+  let devServer = null;
+  return {
+    name: "typewritingclass",
+    configureServer(server) {
+      devServer = server;
+    },
+    async buildStart() {
+      themeInput = await loadTheme();
+    },
+    resolveId(id) {
+      if (id === VIRTUAL_CSS_ID) {
+        return RESOLVED_VIRTUAL_CSS_ID;
+      }
+    },
+    load(id) {
+      if (id === RESOLVED_VIRTUAL_CSS_ID) {
+        return generateAllCss();
+      }
+    },
+    transform(code, id) {
+      if (!id.match(/\.[jt]sx?$/) || id.includes("node_modules")) return;
+      if (!code.includes("typewritingclass")) return;
+      try {
+        const result = native.transform(code, id, layer, themeInput, strict);
+        layer = result.nextLayer;
+        for (const diag of result.diagnostics) {
+          if (diag.severity === "error") {
+            this.error({
+              message: diag.message,
+              id,
+              pos: diag.line
+            });
+          } else {
+            this.warn({
+              message: diag.message,
+              id,
+              pos: diag.line
+            });
+          }
+        }
+        if (result.rules.length > 0) {
+          fileRules.set(
+            id,
+            result.rules.map((r) => r.cssText)
+          );
+          if (devServer) {
+            const mod = devServer.moduleGraph.getModuleById(RESOLVED_VIRTUAL_CSS_ID);
+            if (mod) {
+              devServer.moduleGraph.invalidateModule(mod);
+            }
+          }
+        }
+        const s = new import_magic_string.default(code);
+        if (result.code !== code) {
+          s.overwrite(0, code.length, result.code);
+        }
+        if (!result.code.includes(VIRTUAL_CSS_ID)) {
+          s.prepend(`import '${VIRTUAL_CSS_ID}';
+`);
+        }
+        return {
+          code: s.toString(),
+          map: s.generateMap({ source: id, includeContent: true })
+        };
+      } catch {
+        if (!code.includes("typewritingclass/inject")) {
+          const s = new import_magic_string.default(code);
+          s.prepend(`import 'typewritingclass/inject';
+`);
+          return {
+            code: s.toString(),
+            map: s.generateMap({ source: id, includeContent: true })
+          };
+        }
+      }
+    },
+    // Production builds: inject CSS into the output after all files are
+    // transformed. This fixes the timing issue where virtual:twc.css is
+    // loaded by Rollup before component files have been processed.
+    generateBundle(_, bundle) {
+      const css = generateAllCss();
+      if (!css) return;
+      for (const chunk of Object.values(bundle)) {
+        if (chunk.type === "asset" && chunk.fileName.endsWith(".css")) {
+          const existing = typeof chunk.source === "string" ? chunk.source : "";
+          chunk.source = existing ? existing + "\n" + css : css;
+          return;
+        }
+      }
+      this.emitFile({
+        type: "asset",
+        fileName: "assets/twc.css",
+        source: css
+      });
+    },
+    handleHotUpdate({ file, server }) {
+      if (file.match(/\.[jt]sx?$/) && fileRules.has(file)) {
+        const mod = server.moduleGraph.getModuleById(RESOLVED_VIRTUAL_CSS_ID);
+        if (mod) {
+          server.moduleGraph.invalidateModule(mod);
+          return [mod];
+        }
+      }
+    }
+  };
+  function generateAllCss() {
+    const allRules = [];
+    for (const rules of fileRules.values()) {
+      allRules.push(...rules);
+    }
+    if (allRules.length === 0) return "";
+    return native.generateCss(JSON.stringify(allRules));
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  generateCss,
+  nativeTransform
+});

package/dist/index.d-BP-BhWXf.d.cts

@@ -0,0 +1,52 @@
+/* auto-generated by NAPI-RS */
+/* eslint-disable */
+interface Diagnostic {
+  message: string
+  line: number
+  column: number
+  severity: string
+}
+
+interface ExtractedRule {
+  className: string
+  cssText: string
+  layer: number
+}
+
+declare function generateCss(rulesJson: string): string
+
+/** Theme data passed from the Vite plugin (loaded from the TS theme package) */
+interface ThemeInput {
+  /** JSON: { "blue": { "50": "#eff6ff", ... }, ... } */
+  colors: string
+  /** JSON: { "white": "#ffffff", ... } */
+  namedColors: string
+  /** JSON: { "0": "0px", "0.5": "0.125rem", ... } */
+  spacing: string
+  /** JSON: { "xs": { "fontSize": "0.75rem", "lineHeight": "1rem" }, ... } */
+  textSizes: string
+  /** JSON: { "thin": "100", "light": "300", ... } */
+  fontWeights: string
+  /** JSON: { "none": "0px", "sm": "0.125rem", "DEFAULT": "0.25rem", ... } */
+  radii: string
+  /** JSON: { "sm": "0 1px 2px ...", "DEFAULT": "0 1px 3px ...", ... } */
+  shadows: string
+  /** JSON: { "full": "100%", "screen": "100vw", ... } */
+  sizes: string
+  /** Default border-radius value */
+  defaultRadius: string
+  /** Default shadow value */
+  defaultShadow: string
+}
+
+declare function transform(code: string, filename: string, layerOffset: number, themeInput: ThemeInput, strict?: boolean | undefined | null): TransformOutput
+
+interface TransformOutput {
+  code: string
+  rules: Array<ExtractedRule>
+  nextLayer: number
+  hasDynamic: boolean
+  diagnostics: Array<Diagnostic>
+}
+
+export { type Diagnostic as D, type ExtractedRule as E, type ThemeInput as T, type TransformOutput as a, generateCss as g, transform as t };

package/dist/index.d-BP-BhWXf.d.ts

@@ -0,0 +1,52 @@
+/* auto-generated by NAPI-RS */
+/* eslint-disable */
+interface Diagnostic {
+  message: string
+  line: number
+  column: number
+  severity: string
+}
+
+interface ExtractedRule {
+  className: string
+  cssText: string
+  layer: number
+}
+
+declare function generateCss(rulesJson: string): string
+
+/** Theme data passed from the Vite plugin (loaded from the TS theme package) */
+interface ThemeInput {
+  /** JSON: { "blue": { "50": "#eff6ff", ... }, ... } */
+  colors: string
+  /** JSON: { "white": "#ffffff", ... } */
+  namedColors: string
+  /** JSON: { "0": "0px", "0.5": "0.125rem", ... } */
+  spacing: string
+  /** JSON: { "xs": { "fontSize": "0.75rem", "lineHeight": "1rem" }, ... } */
+  textSizes: string
+  /** JSON: { "thin": "100", "light": "300", ... } */
+  fontWeights: string
+  /** JSON: { "none": "0px", "sm": "0.125rem", "DEFAULT": "0.25rem", ... } */
+  radii: string
+  /** JSON: { "sm": "0 1px 2px ...", "DEFAULT": "0 1px 3px ...", ... } */
+  shadows: string
+  /** JSON: { "full": "100%", "screen": "100vw", ... } */
+  sizes: string
+  /** Default border-radius value */
+  defaultRadius: string
+  /** Default shadow value */
+  defaultShadow: string
+}
+
+declare function transform(code: string, filename: string, layerOffset: number, themeInput: ThemeInput, strict?: boolean | undefined | null): TransformOutput
+
+interface TransformOutput {
+  code: string
+  rules: Array<ExtractedRule>
+  nextLayer: number
+  hasDynamic: boolean
+  diagnostics: Array<Diagnostic>
+}
+
+export { type Diagnostic as D, type ExtractedRule as E, type ThemeInput as T, type TransformOutput as a, generateCss as g, transform as t };

package/dist/index.d.cts

@@ -0,0 +1,13 @@
+import { g as generateCss$1, t as transform } from './index.d-BP-BhWXf.cjs';
+export { D as Diagnostic, E as ExtractedRule, T as ThemeInput, a as TransformOutput } from './index.d-BP-BhWXf.cjs';
+import { Plugin } from 'vite';
+
+declare const nativeTransform: typeof transform;
+declare const generateCss: typeof generateCss$1;
+
+interface TwcPluginOptions {
+    strict?: boolean;
+}
+declare function twcPlugin(options?: TwcPluginOptions): Plugin;
+
+export { type TwcPluginOptions, twcPlugin as default, generateCss, nativeTransform };

package/dist/index.d.ts

@@ -0,0 +1,13 @@
+import { g as generateCss$1, t as transform } from './index.d-BP-BhWXf.js';
+export { D as Diagnostic, E as ExtractedRule, T as ThemeInput, a as TransformOutput } from './index.d-BP-BhWXf.js';
+import { Plugin } from 'vite';
+
+declare const nativeTransform: typeof transform;
+declare const generateCss: typeof generateCss$1;
+
+interface TwcPluginOptions {
+    strict?: boolean;
+}
+declare function twcPlugin(options?: TwcPluginOptions): Plugin;
+
+export { type TwcPluginOptions, twcPlugin as default, generateCss, nativeTransform };

package/dist/index.js

@@ -0,0 +1,139 @@
+import {
+  loadTheme
+} from "./chunk-Y33BZFTH.js";
+
+// src/index.ts
+import MagicString from "magic-string";
+import { createRequire } from "module";
+import { resolve, dirname } from "path";
+import { fileURLToPath } from "url";
+var require2 = createRequire(import.meta.url);
+var __dirname = dirname(fileURLToPath(import.meta.url));
+var native = require2(resolve(__dirname, "..", "index.node"));
+var { transform: nativeTransform, generateCss } = native;
+var VIRTUAL_CSS_ID = "virtual:twc.css";
+var RESOLVED_VIRTUAL_CSS_ID = "\0" + VIRTUAL_CSS_ID;
+function twcPlugin(options) {
+  const strict = options?.strict ?? true;
+  let themeInput;
+  let layer = 0;
+  const fileRules = /* @__PURE__ */ new Map();
+  let devServer = null;
+  return {
+    name: "typewritingclass",
+    configureServer(server) {
+      devServer = server;
+    },
+    async buildStart() {
+      themeInput = await loadTheme();
+    },
+    resolveId(id) {
+      if (id === VIRTUAL_CSS_ID) {
+        return RESOLVED_VIRTUAL_CSS_ID;
+      }
+    },
+    load(id) {
+      if (id === RESOLVED_VIRTUAL_CSS_ID) {
+        return generateAllCss();
+      }
+    },
+    transform(code, id) {
+      if (!id.match(/\.[jt]sx?$/) || id.includes("node_modules")) return;
+      if (!code.includes("typewritingclass")) return;
+      try {
+        const result = native.transform(code, id, layer, themeInput, strict);
+        layer = result.nextLayer;
+        for (const diag of result.diagnostics) {
+          if (diag.severity === "error") {
+            this.error({
+              message: diag.message,
+              id,
+              pos: diag.line
+            });
+          } else {
+            this.warn({
+              message: diag.message,
+              id,
+              pos: diag.line
+            });
+          }
+        }
+        if (result.rules.length > 0) {
+          fileRules.set(
+            id,
+            result.rules.map((r) => r.cssText)
+          );
+          if (devServer) {
+            const mod = devServer.moduleGraph.getModuleById(RESOLVED_VIRTUAL_CSS_ID);
+            if (mod) {
+              devServer.moduleGraph.invalidateModule(mod);
+            }
+          }
+        }
+        const s = new MagicString(code);
+        if (result.code !== code) {
+          s.overwrite(0, code.length, result.code);
+        }
+        if (!result.code.includes(VIRTUAL_CSS_ID)) {
+          s.prepend(`import '${VIRTUAL_CSS_ID}';
+`);
+        }
+        return {
+          code: s.toString(),
+          map: s.generateMap({ source: id, includeContent: true })
+        };
+      } catch {
+        if (!code.includes("typewritingclass/inject")) {
+          const s = new MagicString(code);
+          s.prepend(`import 'typewritingclass/inject';
+`);
+          return {
+            code: s.toString(),
+            map: s.generateMap({ source: id, includeContent: true })
+          };
+        }
+      }
+    },
+    // Production builds: inject CSS into the output after all files are
+    // transformed. This fixes the timing issue where virtual:twc.css is
+    // loaded by Rollup before component files have been processed.
+    generateBundle(_, bundle) {
+      const css = generateAllCss();
+      if (!css) return;
+      for (const chunk of Object.values(bundle)) {
+        if (chunk.type === "asset" && chunk.fileName.endsWith(".css")) {
+          const existing = typeof chunk.source === "string" ? chunk.source : "";
+          chunk.source = existing ? existing + "\n" + css : css;
+          return;
+        }
+      }
+      this.emitFile({
+        type: "asset",
+        fileName: "assets/twc.css",
+        source: css
+      });
+    },
+    handleHotUpdate({ file, server }) {
+      if (file.match(/\.[jt]sx?$/) && fileRules.has(file)) {
+        const mod = server.moduleGraph.getModuleById(RESOLVED_VIRTUAL_CSS_ID);
+        if (mod) {
+          server.moduleGraph.invalidateModule(mod);
+          return [mod];
+        }
+      }
+    }
+  };
+  function generateAllCss() {
+    const allRules = [];
+    for (const rules of fileRules.values()) {
+      allRules.push(...rules);
+    }
+    if (allRules.length === 0) return "";
+    return native.generateCss(JSON.stringify(allRules));
+  }
+}
+export {
+  twcPlugin as default,
+  generateCss,
+  nativeTransform
+};