@dsai-io/tools 1.2.5 → 1.3.1

package/dist/tokens/index.d.cts

@@ -223,6 +223,8 @@ interface BuildOptions {
     outputDir?: string;
     /** Output formats to generate (default: ['css', 'scss', 'json']) */
     formats?: Array<'css' | 'scss' | 'js' | 'ts' | 'json' | 'android' | 'ios'>;
+    /** CSS custom property prefix (default: '--dsai-') */
+    prefix?: string;
     /** Per-format output directories */
     outputDirs?: Partial<Record<string, string>>;
     /** Per-format output file names */
@@ -1372,6 +1374,8 @@ declare function autoDetectThemes(sourceDir: string, pattern?: string, selectorP
 interface ThemeBuildConfig {
     /** Output formats to generate */
     formats: OutputFormat[];
+    /** CSS custom property prefix (e.g., '--dsai-') */
+    prefix?: string;
     /** Theme definitions (used by buildAllThemes to lookup theme metadata) */
     themes?: {
         definitions?: Record<string, ThemeDefinition | ResolvedThemeDefinition>;
@@ -1421,6 +1425,8 @@ interface ThemeStyleDictionaryConfig {
     source: string[];
     /** Platform configurations */
     platforms: Record<string, StyleDictionaryPlatformConfig>;
+    /** Preprocessors to apply before building */
+    preprocessors?: string[];
     /** Whether tokens use DTCG format ($value, $type, etc.) */
     usesDtcg?: boolean;
     /** Logging configuration */

package/dist/tokens/index.d.ts

@@ -223,6 +223,8 @@ interface BuildOptions {
     outputDir?: string;
     /** Output formats to generate (default: ['css', 'scss', 'json']) */
     formats?: Array<'css' | 'scss' | 'js' | 'ts' | 'json' | 'android' | 'ios'>;
+    /** CSS custom property prefix (default: '--dsai-') */
+    prefix?: string;
     /** Per-format output directories */
     outputDirs?: Partial<Record<string, string>>;
     /** Per-format output file names */
@@ -1372,6 +1374,8 @@ declare function autoDetectThemes(sourceDir: string, pattern?: string, selectorP
 interface ThemeBuildConfig {
     /** Output formats to generate */
     formats: OutputFormat[];
+    /** CSS custom property prefix (e.g., '--dsai-') */
+    prefix?: string;
     /** Theme definitions (used by buildAllThemes to lookup theme metadata) */
     themes?: {
         definitions?: Record<string, ThemeDefinition | ResolvedThemeDefinition>;
@@ -1421,6 +1425,8 @@ interface ThemeStyleDictionaryConfig {
     source: string[];
     /** Platform configurations */
     platforms: Record<string, StyleDictionaryPlatformConfig>;
+    /** Preprocessors to apply before building */
+    preprocessors?: string[];
     /** Whether tokens use DTCG format ($value, $type, etc.) */
     usesDtcg?: boolean;
     /** Logging configuration */

package/dist/tokens/index.js

@@ -1154,6 +1154,85 @@ var init_groups = __esm({
   }
 });
 
+// src/tokens/style-dictionary/preprocessors/fix-references.ts
+function fixValue(value, mappings) {
+  if (typeof value !== "string" || !value.startsWith("{")) {
+    return value;
+  }
+  let result = value;
+  for (const mapping of mappings) {
+    result = result.split(mapping[0]).join(mapping[1]);
+  }
+  return result;
+}
+function processTokens(obj, mappings) {
+  for (const key of Object.keys(obj)) {
+    const value = obj[key];
+    if (value && typeof value === "object") {
+      const typedValue = value;
+      if ("$value" in typedValue) {
+        typedValue["$value"] = fixValue(typedValue["$value"], mappings);
+      } else if ("value" in typedValue) {
+        typedValue["value"] = fixValue(typedValue["value"], mappings);
+      } else {
+        processTokens(typedValue, mappings);
+      }
+    }
+  }
+}
+function createFixReferencesPreprocessor(mappings) {
+  return {
+    name: "fix-references-custom",
+    preprocessor: (dictionary) => {
+      processTokens(dictionary, mappings);
+      return dictionary;
+    }
+  };
+}
+var DEFAULT_PATH_MAPPINGS, fixReferences;
+var init_fix_references = __esm({
+  "src/tokens/style-dictionary/preprocessors/fix-references.ts"() {
+    DEFAULT_PATH_MAPPINGS = [
+      ["{colors.brand.", "{color."],
+      ["{colors.neutral.", "{neutral."],
+      ["{borders.width.", "{border.width."]
+    ];
+    fixReferences = {
+      name: "fix-references",
+      preprocessor: (dictionary) => {
+        processTokens(dictionary, DEFAULT_PATH_MAPPINGS);
+        return dictionary;
+      }
+    };
+  }
+});
+
+// src/tokens/style-dictionary/preprocessors/index.ts
+var preprocessors_exports = {};
+__export(preprocessors_exports, {
+  builtInPreprocessors: () => builtInPreprocessors,
+  createFixReferencesPreprocessor: () => createFixReferencesPreprocessor,
+  fixReferences: () => fixReferences,
+  registerPreprocessors: () => registerPreprocessors
+});
+function registerPreprocessors(sd, customPreprocessors = []) {
+  const allPreprocessors = [...builtInPreprocessors, ...customPreprocessors];
+  for (const preprocessor of allPreprocessors) {
+    sd.registerPreprocessor({
+      name: preprocessor.name,
+      preprocessor: preprocessor.preprocessor
+    });
+  }
+}
+var builtInPreprocessors;
+var init_preprocessors = __esm({
+  "src/tokens/style-dictionary/preprocessors/index.ts"() {
+    init_fix_references();
+    init_fix_references();
+    builtInPreprocessors = [fixReferences];
+  }
+});
+
 // src/tokens/diff.ts
 var diff_exports = {};
 __export(diff_exports, {
@@ -4674,7 +4753,7 @@ var FORMAT_MAPPING = /* @__PURE__ */ new Map([
   ["ios", { default: "ios/macros", themed: "ios/macros" }]
 ]);
 var TRANSFORM_GROUPS = /* @__PURE__ */ new Map([
-  ["css", "css"],
+  ["css", "custom/css"],
   ["scss", "scss"],
   ["js", "js-custom"],
   // Use custom transform group for valid JS identifiers
@@ -4691,7 +4770,13 @@ function generateThemeBuildConfig(options) {
   const platformsMap = /* @__PURE__ */ new Map();
   const enabledFormats = config.formats;
   for (const format of enabledFormats) {
-    const platformConfig = generatePlatformConfig(format, themeDefinition, outputDir, isDefault);
+    const platformConfig = generatePlatformConfig(
+      format,
+      themeDefinition,
+      outputDir,
+      isDefault,
+      config.prefix
+    );
     if (platformConfig) {
       platformsMap.set(format, platformConfig);
     }
@@ -4700,6 +4785,7 @@ function generateThemeBuildConfig(options) {
   return {
     source: files,
     platforms,
+    preprocessors: ["fix-references"],
     // Enable DTCG format support (tokens with $value, $type, etc.)
     usesDtcg: true,
     // Configure logging to not throw on broken references (they'll be logged but build continues)
@@ -4712,7 +4798,7 @@ function generateThemeBuildConfig(options) {
     }
   };
 }
-function generatePlatformConfig(format, themeDefinition, outputDir, isDefault) {
+function generatePlatformConfig(format, themeDefinition, outputDir, isDefault, prefix) {
   const formatConfig = FORMAT_MAPPING.get(format);
   if (!formatConfig) {
     console.warn(`Unknown format: ${format}`);
@@ -4727,8 +4813,15 @@ function generatePlatformConfig(format, themeDefinition, outputDir, isDefault) {
     destination: outputFile,
     format: sdFormat
   };
+  if (prefix && (format === "css" || format === "scss")) {
+    fileConfig.options = {
+      ...fileConfig.options,
+      prefix
+    };
+  }
   if (format === "css" && !isDefault) {
     fileConfig.options = {
+      ...fileConfig.options,
       selector: themeDefinition.selector
     };
   }
@@ -4841,6 +4934,8 @@ async function runStyleDictionaryBuild(sdConfig, options) {
   registerCustomTransforms(StyleDictionary);
   const { registerTransformGroups: registerTransformGroups2 } = await Promise.resolve().then(() => (init_groups(), groups_exports));
   registerTransformGroups2(StyleDictionary);
+  const { registerPreprocessors: registerPreprocessors2 } = await Promise.resolve().then(() => (init_preprocessors(), preprocessors_exports));
+  registerPreprocessors2(StyleDictionary);
   if (options.verbose) {
     console.warn(`   \u{1F527} Style Dictionary platforms:`);
     for (const [platform, config] of Object.entries(sdConfig.platforms)) {
@@ -5294,7 +5389,7 @@ var STEP_DISPLAY_NAMES = /* @__PURE__ */ new Map([
   ["sass-utilities-minified", "Compile DSAi Utilities (minified)"],
   ["bundle", "Bundle with tsup"]
 ]);
-function createStepFromName(stepName, tokensPackageDir, figmaExportsDir, tokensDir, paths, sdConfigFile, strict, snapshotService, themesConfig, outputDir, formats = ["css", "scss", "json"], cssOutputDir, postprocessConfig) {
+function createStepFromName(stepName, tokensPackageDir, figmaExportsDir, tokensDir, paths, sdConfigFile, strict, snapshotService, themesConfig, outputDir, formats = ["css", "scss", "json"], cssOutputDir, postprocessConfig, prefix) {
   const displayName = STEP_DISPLAY_NAMES.get(stepName) ?? `Unknown: ${stepName}`;
   switch (stepName) {
     case "validate":
@@ -5499,6 +5594,7 @@ function createStepFromName(stepName, tokensPackageDir, figmaExportsDir, tokensD
             const result = await buildAllThemes({
               config: {
                 formats,
+                prefix,
                 themes: {
                   definitions: themeDefinitions
                 }
@@ -5614,7 +5710,8 @@ function createBuildSteps(tokensDir, _toolsDir, options, pipeline) {
       options.outputDir,
       formats,
       options.cssOutputDir,
-      options.postprocessConfig
+      options.postprocessConfig,
+      options.prefix
     );
     if (stepName === "validate" && skipValidate) {
       step.skip = true;
@@ -6889,68 +6986,7 @@ function getSDTokenType(token) {
 // src/tokens/style-dictionary/config.ts
 init_formats();
 init_groups();
-
-// src/tokens/style-dictionary/preprocessors/fix-references.ts
-var DEFAULT_PATH_MAPPINGS = [
-  ["{colors.brand.", "{color."],
-  ["{colors.neutral.", "{neutral."],
-  ["{borders.width.", "{border.width."]
-];
-function fixValue(value, mappings) {
-  if (typeof value !== "string" || !value.startsWith("{")) {
-    return value;
-  }
-  let result = value;
-  for (const mapping of mappings) {
-    result = result.split(mapping[0]).join(mapping[1]);
-  }
-  return result;
-}
-function processTokens(obj, mappings) {
-  for (const key of Object.keys(obj)) {
-    const value = obj[key];
-    if (value && typeof value === "object") {
-      const typedValue = value;
-      if ("$value" in typedValue) {
-        typedValue["$value"] = fixValue(typedValue["$value"], mappings);
-      } else if ("value" in typedValue) {
-        typedValue["value"] = fixValue(typedValue["value"], mappings);
-      } else {
-        processTokens(typedValue, mappings);
-      }
-    }
-  }
-}
-var fixReferences = {
-  name: "fix-references",
-  preprocessor: (dictionary) => {
-    processTokens(dictionary, DEFAULT_PATH_MAPPINGS);
-    return dictionary;
-  }
-};
-function createFixReferencesPreprocessor(mappings) {
-  return {
-    name: "fix-references-custom",
-    preprocessor: (dictionary) => {
-      processTokens(dictionary, mappings);
-      return dictionary;
-    }
-  };
-}
-
-// src/tokens/style-dictionary/preprocessors/index.ts
-var builtInPreprocessors = [fixReferences];
-function registerPreprocessors(sd, customPreprocessors = []) {
-  const allPreprocessors = [...builtInPreprocessors, ...customPreprocessors];
-  for (const preprocessor of allPreprocessors) {
-    sd.registerPreprocessor({
-      name: preprocessor.name,
-      preprocessor: preprocessor.preprocessor
-    });
-  }
-}
-
-// src/tokens/style-dictionary/config.ts
+init_preprocessors();
 init_transforms();
 var DEFAULT_SOURCE_PATTERNS = [
   "collections/color/*.json",
@@ -7105,6 +7141,7 @@ function setupStyleDictionary(sd, dsaiConfig, options = {}) {
 // src/tokens/style-dictionary/index.ts
 init_transforms();
 init_formats();
+init_preprocessors();
 init_groups();
 
 // src/tokens/framework-mappers/index.ts