@homebound/truss 2.0.13 → 2.1.0-next.2

package/build/runtime.d.ts

@@ -1,18 +1,28 @@
-import * as stylex from '@stylexjs/stylex';
-
+/** A compact source label for a Truss CSS expression, used in debug mode. */
 declare class TrussDebugInfo {
-    /** A compact `FileName.tsx:line` source label for a Truss CSS expression. */
+    /** I.e. `"FileName.tsx:line"` */
     readonly src: string;
     constructor(src: string);
 }
-/** Call StyleX while stripping Truss debug sentinels from the style list. */
-declare function trussProps(stylexNs: typeof stylex, ...styles: unknown[]): Record<string, unknown>;
-declare function mergeProps(stylexNs: typeof stylex, explicitClassName: string, ...styles: unknown[]): Record<string, unknown>;
 /**
- * Coerce maybe-array StyleX inputs into arrays, guarding against nullish/false and plain object values.
+ * Space-separated atomic class names, or a variable tuple with class names + CSS variable map.
+ *
+ * In debug mode, the transform appends a TrussDebugInfo as an extra tuple element:
+ * - static with debug: `[classNames, debugInfo]`
+ * - variable with debug: `[classNames, vars, debugInfo]`
+ */
+type TrussStyleValue = string | [classNames: string, vars: Record<string, string>] | [classNames: string, debugInfo: TrussDebugInfo] | [classNames: string, vars: Record<string, string>, debugInfo: TrussDebugInfo];
+/** A property-keyed style hash where each key owns one logical CSS property. */
+type TrussStyleHash = Record<string, TrussStyleValue>;
+/** Merge one or more Truss style hashes into `{ className, style?, data-truss-src? }`. */
+declare function trussProps(...hashes: ReadonlyArray<TrussStyleHash | false | null | undefined>): Record<string, unknown>;
+/** Merge explicit className/style with Truss style hashes. */
+declare function mergeProps(explicitClassName: string | undefined, explicitStyle: Record<string, unknown> | undefined, ...hashes: ReadonlyArray<TrussStyleHash | false | null | undefined>): Record<string, unknown>;
+/**
+ * Inject CSS text into the document for jsdom/test environments.
  *
- * I.e. `...asStyleArray(xss)` stays safe when destructured `xss` is `undefined`.
+ * In browser dev mode, CSS is served via the Vite virtual endpoint instead.
  */
-declare function asStyleArray(styles: unknown): ReadonlyArray<unknown>;
+declare function __injectTrussCSS(cssText: string): void;
 
-export { TrussDebugInfo, asStyleArray, mergeProps, trussProps };
+export { TrussDebugInfo, type TrussStyleHash, type TrussStyleValue, __injectTrussCSS, mergeProps, trussProps };

package/build/runtime.js

@@ -1,60 +1,76 @@
 // src/runtime.ts
 var TrussDebugInfo = class {
-  /** A compact `FileName.tsx:line` source label for a Truss CSS expression. */
+  /** I.e. `"FileName.tsx:line"` */
   src;
   constructor(src) {
     this.src = src;
   }
 };
-function trussProps(stylexNs, ...styles) {
-  const { debugSources, styleArgs } = splitDebugInfo(styles);
-  const sx = stylexNs.props(...styleArgs);
-  return applyDebugSources(sx, debugSources);
-}
-function mergeProps(stylexNs, explicitClassName, ...styles) {
-  const { debugSources, styleArgs } = splitDebugInfo(styles);
-  const sx = stylexNs.props(...styleArgs);
-  return {
-    ...applyDebugSources(sx, debugSources),
-    className: `${explicitClassName} ${sx.className ?? ""}`.trim()
+function trussProps(...hashes) {
+  const merged = {};
+  for (const hash of hashes) {
+    if (!hash || typeof hash !== "object") continue;
+    Object.assign(merged, hash);
+  }
+  const classNames = [];
+  const inlineStyle = {};
+  const debugSources = [];
+  for (const [key, value] of Object.entries(merged)) {
+    if (key === "__marker") {
+      if (typeof value === "string") classNames.push(value);
+      continue;
+    }
+    if (typeof value === "string") {
+      classNames.push(value);
+      continue;
+    }
+    classNames.push(value[0]);
+    for (let i = 1; i < value.length; i++) {
+      const el = value[i];
+      if (el instanceof TrussDebugInfo) {
+        debugSources.push(el.src);
+      } else if (typeof el === "object" && el !== null) {
+        Object.assign(inlineStyle, el);
+      }
+    }
+  }
+  const props = {
+    className: classNames.join(" ")
   };
-}
-function asStyleArray(styles) {
-  if (Array.isArray(styles)) {
-    return styles;
+  if (Object.keys(inlineStyle).length > 0) {
+    props.style = inlineStyle;
   }
-  if (styles && typeof styles === "object" && Object.keys(styles).length > 0) {
-    console.error(
-      "[truss] asStyleArray received a non-empty object \u2014 this likely means a style value was not rewritten to an array. Use a style array (e.g. Css.df.$) or an empty array [] instead of {}."
-    );
+  if (debugSources.length > 0) {
+    props["data-truss-src"] = [...new Set(debugSources)].join("; ");
   }
-  return styles ? [styles] : [];
+  return props;
 }
-function splitDebugInfo(styles) {
-  const debugSources = [];
-  const styleArgs = [];
-  for (const style of styles) {
-    if (style instanceof TrussDebugInfo) {
-      debugSources.push(style.src);
-    } else {
-      styleArgs.push(style);
-    }
+function mergeProps(explicitClassName, explicitStyle, ...hashes) {
+  const result = trussProps(...hashes);
+  if (explicitClassName) {
+    result.className = `${explicitClassName} ${result.className ?? ""}`.trim();
+  }
+  if (explicitStyle) {
+    result.style = { ...explicitStyle, ...result.style };
   }
-  return { debugSources, styleArgs };
+  return result;
 }
-function applyDebugSources(props, debugSources) {
-  if (debugSources.length === 0) {
-    return props;
-  }
-  const uniqueSources = Array.from(new Set(debugSources));
-  return {
-    ...props,
-    "data-truss-src": uniqueSources.join("; ")
-  };
+function __injectTrussCSS(cssText) {
+  if (typeof document === "undefined") return;
+  const id = "data-truss";
+  let style = document.querySelector(`style[${id}]`);
+  if (!style) {
+    style = document.createElement("style");
+    style.setAttribute(id, "");
+    document.head.appendChild(style);
+  }
+  if (!style.textContent?.includes(cssText)) {
+    style.textContent = (style.textContent ?? "") + cssText;
+  }
 }
 export {
   TrussDebugInfo,
-  asStyleArray,
+  __injectTrussCSS,
   mergeProps,
   trussProps
 };

package/build/runtime.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/runtime.ts"],"sourcesContent":["import type * as stylex from \"@stylexjs/stylex\";\n\nexport class TrussDebugInfo {\n  /** A compact `FileName.tsx:line` source label for a Truss CSS expression. */\n  readonly src: string;\n\n  constructor(src: string) {\n    this.src = src;\n  }\n}\n\ntype StylexPropArg = Parameters<typeof stylex.props>[number];\n\n/** Call StyleX while stripping Truss debug sentinels from the style list. */\nexport function trussProps(stylexNs: typeof stylex, ...styles: unknown[]): Record<string, unknown> {\n  const { debugSources, styleArgs } = splitDebugInfo(styles);\n  const sx = stylexNs.props(...styleArgs);\n  return applyDebugSources(sx, debugSources);\n}\n\nexport function mergeProps(\n  stylexNs: typeof stylex,\n  explicitClassName: string,\n  ...styles: unknown[]\n): Record<string, unknown> {\n  const { debugSources, styleArgs } = splitDebugInfo(styles);\n  const sx = stylexNs.props(...styleArgs);\n  return {\n    ...applyDebugSources(sx, debugSources),\n    className: `${explicitClassName} ${sx.className ?? \"\"}`.trim(),\n  };\n}\n\n/**\n * Coerce maybe-array StyleX inputs into arrays, guarding against nullish/false and plain object values.\n *\n * I.e. `...asStyleArray(xss)` stays safe when destructured `xss` is `undefined`.\n */\nexport function asStyleArray(styles: unknown): ReadonlyArray<unknown> {\n  if (Array.isArray(styles)) {\n    return styles;\n  }\n  if (styles && typeof styles === \"object\" && Object.keys(styles).length > 0) {\n    console.error(\n      \"[truss] asStyleArray received a non-empty object — this likely means a style value was not rewritten to an array. \" +\n        \"Use a style array (e.g. Css.df.$) or an empty array [] instead of {}.\",\n    );\n  }\n  return styles ? [styles] : [];\n}\n\n/** Collect Truss debug info while preserving the original StyleX argument order. */\nfunction splitDebugInfo(styles: ReadonlyArray<unknown>): {\n  debugSources: string[];\n  styleArgs: StylexPropArg[];\n} {\n  const debugSources: string[] = [];\n  const styleArgs: StylexPropArg[] = [];\n\n  for (const style of styles) {\n    if (style instanceof TrussDebugInfo) {\n      debugSources.push(style.src);\n    } else {\n      styleArgs.push(style as StylexPropArg);\n    }\n  }\n\n  return { debugSources, styleArgs };\n}\n\n/** Deduplicate and attach compact Truss source labels to emitted props. */\nfunction applyDebugSources(\n  props: Record<string, unknown>,\n  debugSources: ReadonlyArray<string>,\n): Record<string, unknown> {\n  if (debugSources.length === 0) {\n    return props;\n  }\n\n  const uniqueSources = Array.from(new Set(debugSources));\n  return {\n    ...props,\n    \"data-truss-src\": uniqueSources.join(\"; \"),\n  };\n}\n"],"mappings":";AAEO,IAAM,iBAAN,MAAqB;AAAA;AAAA,EAEjB;AAAA,EAET,YAAY,KAAa;AACvB,SAAK,MAAM;AAAA,EACb;AACF;AAKO,SAAS,WAAW,aAA4B,QAA4C;AACjG,QAAM,EAAE,cAAc,UAAU,IAAI,eAAe,MAAM;AACzD,QAAM,KAAK,SAAS,MAAM,GAAG,SAAS;AACtC,SAAO,kBAAkB,IAAI,YAAY;AAC3C;AAEO,SAAS,WACd,UACA,sBACG,QACsB;AACzB,QAAM,EAAE,cAAc,UAAU,IAAI,eAAe,MAAM;AACzD,QAAM,KAAK,SAAS,MAAM,GAAG,SAAS;AACtC,SAAO;AAAA,IACL,GAAG,kBAAkB,IAAI,YAAY;AAAA,IACrC,WAAW,GAAG,iBAAiB,IAAI,GAAG,aAAa,EAAE,GAAG,KAAK;AAAA,EAC/D;AACF;AAOO,SAAS,aAAa,QAAyC;AACpE,MAAI,MAAM,QAAQ,MAAM,GAAG;AACzB,WAAO;AAAA,EACT;AACA,MAAI,UAAU,OAAO,WAAW,YAAY,OAAO,KAAK,MAAM,EAAE,SAAS,GAAG;AAC1E,YAAQ;AAAA,MACN;AAAA,IAEF;AAAA,EACF;AACA,SAAO,SAAS,CAAC,MAAM,IAAI,CAAC;AAC9B;AAGA,SAAS,eAAe,QAGtB;AACA,QAAM,eAAyB,CAAC;AAChC,QAAM,YAA6B,CAAC;AAEpC,aAAW,SAAS,QAAQ;AAC1B,QAAI,iBAAiB,gBAAgB;AACnC,mBAAa,KAAK,MAAM,GAAG;AAAA,IAC7B,OAAO;AACL,gBAAU,KAAK,KAAsB;AAAA,IACvC;AAAA,EACF;AAEA,SAAO,EAAE,cAAc,UAAU;AACnC;AAGA,SAAS,kBACP,OACA,cACyB;AACzB,MAAI,aAAa,WAAW,GAAG;AAC7B,WAAO;AAAA,EACT;AAEA,QAAM,gBAAgB,MAAM,KAAK,IAAI,IAAI,YAAY,CAAC;AACtD,SAAO;AAAA,IACL,GAAG;AAAA,IACH,kBAAkB,cAAc,KAAK,IAAI;AAAA,EAC3C;AACF;","names":[]}
+{"version":3,"sources":["../src/runtime.ts"],"sourcesContent":["/** A compact source label for a Truss CSS expression, used in debug mode. */\nexport class TrussDebugInfo {\n  /** I.e. `\"FileName.tsx:line\"` */\n  readonly src: string;\n\n  constructor(src: string) {\n    this.src = src;\n  }\n}\n\n/**\n * Space-separated atomic class names, or a variable tuple with class names + CSS variable map.\n *\n * In debug mode, the transform appends a TrussDebugInfo as an extra tuple element:\n * - static with debug: `[classNames, debugInfo]`\n * - variable with debug: `[classNames, vars, debugInfo]`\n */\nexport type TrussStyleValue =\n  | string\n  | [classNames: string, vars: Record<string, string>]\n  | [classNames: string, debugInfo: TrussDebugInfo]\n  | [classNames: string, vars: Record<string, string>, debugInfo: TrussDebugInfo];\n\n/** A property-keyed style hash where each key owns one logical CSS property. */\nexport type TrussStyleHash = Record<string, TrussStyleValue>;\n\n/** Merge one or more Truss style hashes into `{ className, style?, data-truss-src? }`. */\nexport function trussProps(\n  ...hashes: ReadonlyArray<TrussStyleHash | false | null | undefined>\n): Record<string, unknown> {\n  const merged: Record<string, TrussStyleValue> = {};\n\n  for (const hash of hashes) {\n    if (!hash || typeof hash !== \"object\") continue;\n    Object.assign(merged, hash);\n  }\n\n  const classNames: string[] = [];\n  const inlineStyle: Record<string, string> = {};\n  const debugSources: string[] = [];\n\n  for (const [key, value] of Object.entries(merged)) {\n    // __marker is a special key — its value is a marker class name, not a CSS property\n    if (key === \"__marker\") {\n      if (typeof value === \"string\") classNames.push(value);\n      continue;\n    }\n    if (typeof value === \"string\") {\n      // I.e. \"df\" or \"black blue_h\"\n      classNames.push(value);\n      continue;\n    }\n\n    // Tuple: [classNames, varsOrDebug?, maybeDebug?]\n    classNames.push(value[0]);\n\n    for (let i = 1; i < value.length; i++) {\n      const el = value[i];\n      if (el instanceof TrussDebugInfo) {\n        debugSources.push(el.src);\n      } else if (typeof el === \"object\" && el !== null) {\n        Object.assign(inlineStyle, el);\n      }\n    }\n  }\n\n  const props: Record<string, unknown> = {\n    className: classNames.join(\" \"),\n  };\n\n  if (Object.keys(inlineStyle).length > 0) {\n    props.style = inlineStyle;\n  }\n\n  if (debugSources.length > 0) {\n    props[\"data-truss-src\"] = [...new Set(debugSources)].join(\"; \");\n  }\n\n  return props;\n}\n\n/** Merge explicit className/style with Truss style hashes. */\nexport function mergeProps(\n  explicitClassName: string | undefined,\n  explicitStyle: Record<string, unknown> | undefined,\n  ...hashes: ReadonlyArray<TrussStyleHash | false | null | undefined>\n): Record<string, unknown> {\n  const result = trussProps(...hashes);\n\n  if (explicitClassName) {\n    result.className = `${explicitClassName} ${result.className ?? \"\"}`.trim();\n  }\n\n  if (explicitStyle) {\n    result.style = { ...explicitStyle, ...(result.style as Record<string, unknown> | undefined) };\n  }\n\n  return result;\n}\n\n/**\n * Inject CSS text into the document for jsdom/test environments.\n *\n * In browser dev mode, CSS is served via the Vite virtual endpoint instead.\n */\nexport function __injectTrussCSS(cssText: string): void {\n  if (typeof document === \"undefined\") return;\n\n  const id = \"data-truss\";\n  let style = document.querySelector(`style[${id}]`) as HTMLStyleElement | null;\n  if (!style) {\n    style = document.createElement(\"style\");\n    style.setAttribute(id, \"\");\n    document.head.appendChild(style);\n  }\n\n  // Append if not already present (dedupe across HMR re-executions)\n  if (!style.textContent?.includes(cssText)) {\n    style.textContent = (style.textContent ?? \"\") + cssText;\n  }\n}\n"],"mappings":";AACO,IAAM,iBAAN,MAAqB;AAAA;AAAA,EAEjB;AAAA,EAET,YAAY,KAAa;AACvB,SAAK,MAAM;AAAA,EACb;AACF;AAmBO,SAAS,cACX,QACsB;AACzB,QAAM,SAA0C,CAAC;AAEjD,aAAW,QAAQ,QAAQ;AACzB,QAAI,CAAC,QAAQ,OAAO,SAAS,SAAU;AACvC,WAAO,OAAO,QAAQ,IAAI;AAAA,EAC5B;AAEA,QAAM,aAAuB,CAAC;AAC9B,QAAM,cAAsC,CAAC;AAC7C,QAAM,eAAyB,CAAC;AAEhC,aAAW,CAAC,KAAK,KAAK,KAAK,OAAO,QAAQ,MAAM,GAAG;AAEjD,QAAI,QAAQ,YAAY;AACtB,UAAI,OAAO,UAAU,SAAU,YAAW,KAAK,KAAK;AACpD;AAAA,IACF;AACA,QAAI,OAAO,UAAU,UAAU;AAE7B,iBAAW,KAAK,KAAK;AACrB;AAAA,IACF;AAGA,eAAW,KAAK,MAAM,CAAC,CAAC;AAExB,aAAS,IAAI,GAAG,IAAI,MAAM,QAAQ,KAAK;AACrC,YAAM,KAAK,MAAM,CAAC;AAClB,UAAI,cAAc,gBAAgB;AAChC,qBAAa,KAAK,GAAG,GAAG;AAAA,MAC1B,WAAW,OAAO,OAAO,YAAY,OAAO,MAAM;AAChD,eAAO,OAAO,aAAa,EAAE;AAAA,MAC/B;AAAA,IACF;AAAA,EACF;AAEA,QAAM,QAAiC;AAAA,IACrC,WAAW,WAAW,KAAK,GAAG;AAAA,EAChC;AAEA,MAAI,OAAO,KAAK,WAAW,EAAE,SAAS,GAAG;AACvC,UAAM,QAAQ;AAAA,EAChB;AAEA,MAAI,aAAa,SAAS,GAAG;AAC3B,UAAM,gBAAgB,IAAI,CAAC,GAAG,IAAI,IAAI,YAAY,CAAC,EAAE,KAAK,IAAI;AAAA,EAChE;AAEA,SAAO;AACT;AAGO,SAAS,WACd,mBACA,kBACG,QACsB;AACzB,QAAM,SAAS,WAAW,GAAG,MAAM;AAEnC,MAAI,mBAAmB;AACrB,WAAO,YAAY,GAAG,iBAAiB,IAAI,OAAO,aAAa,EAAE,GAAG,KAAK;AAAA,EAC3E;AAEA,MAAI,eAAe;AACjB,WAAO,QAAQ,EAAE,GAAG,eAAe,GAAI,OAAO,MAA8C;AAAA,EAC9F;AAEA,SAAO;AACT;AAOO,SAAS,iBAAiB,SAAuB;AACtD,MAAI,OAAO,aAAa,YAAa;AAErC,QAAM,KAAK;AACX,MAAI,QAAQ,SAAS,cAAc,SAAS,EAAE,GAAG;AACjD,MAAI,CAAC,OAAO;AACV,YAAQ,SAAS,cAAc,OAAO;AACtC,UAAM,aAAa,IAAI,EAAE;AACzB,aAAS,KAAK,YAAY,KAAK;AAAA,EACjC;AAGA,MAAI,CAAC,MAAM,aAAa,SAAS,OAAO,GAAG;AACzC,UAAM,eAAe,MAAM,eAAe,MAAM;AAAA,EAClD;AACF;","names":[]}

package/cli.js

@@ -1,16 +1,11 @@
 #!/usr/bin/env node
 
-import { join } from "node:path";
-import { pathToFileURL } from "node:url";
-import { register } from "tsx/esm/api";
-import { generate } from "./build/index.js";
-
-// Register tsx loader so we can import TypeScript config files
-// (handles both CJS and ESM projects, with extensionless .ts imports).
-const unregister = register();
+import { createJiti } from "jiti";
+import { join } from "path";
 
 const filename = process.argv[2] ?? "./truss-config.ts";
 const configPath = join(process.cwd(), filename);
+const jiti = createJiti(import.meta.url, { interopDefault: true });
 
 main().catch((err) => {
   console.error(err);
@@ -18,8 +13,8 @@ main().catch((err) => {
 });
 
 async function main() {
-  const config = (await import(pathToFileURL(configPath).href)).default;
-  unregister();
+  const config = await jiti.import(configPath, { default: true });
+  const { generate } = await import("./build/index.js");
   await generate(config);
   console.log(`Generated ${config.outputPath}`);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homebound/truss",
-  "version": "2.0.13",
+  "version": "2.1.0-next.2",
   "type": "module",
   "main": "build/index.js",
   "bin": "cli.js",
@@ -27,10 +27,14 @@
   },
   "license": "ISC",
   "dependencies": {
+    "@babel/generator": "^7.29.0",
+    "@babel/parser": "^7.29.0",
+    "@babel/traverse": "^7.29.0",
+    "@babel/types": "^7.29.0",
     "change-case": "^5.4.4",
     "csstype": "^3.2.3",
-    "ts-poet": "^6.12.0",
-    "tsx": "^4.19.0"
+    "jiti": "^2.6.1",
+    "ts-poet": "^6.12.0"
   },
   "devDependencies": {
     "@homebound/tsconfig": "^1.1.1",