@khaledeltohamy14/token-pipeline-engine 1.0.0

package/generators/component-generator.js

@@ -0,0 +1,468 @@
+const {
+  flattenTokens,
+  getTokenValue,
+  getTokenType,
+  isReference,
+  cleanReference,
+  toDartIdentifier,
+  canonicalTokenKey,
+  colorValue,
+  dimensionValue,
+  dartType,
+} = require('./token-utils');
+
+const CATEGORY_CONFIG = {
+  spacing: {
+    className: 'SpacingTokens',
+    importPath: '../spacing/spacing_tokens.dart',
+  },
+
+  radius: {
+    className: 'RadiusTokens',
+    importPath: '../radius/radius_tokens.dart',
+  },
+
+  dimensions: {
+    className: 'DimensionTokens',
+    importPath: '../dimensions/dimensions_tokens.dart',
+  },
+
+  typography: {
+    className: 'TypographyTokens',
+    importPath: '../typography/typography_tokens.dart',
+  },
+
+  shadow: {
+    className: 'ShadowTokens',
+    importPath: '../shadow/shadow_tokens.dart',
+  },
+
+  alias: {
+    className: 'AliasTokens',
+    importPath: '../alias/alias_tokens.dart',
+  },
+
+  global: {
+    className: 'GlobalTokens',
+    importPath: '../global/global_tokens.dart',
+  },
+};
+
+function generateComponentTokens({
+  tokens,
+  aliasTokens,
+  globalTokens,
+  spacingTokens,
+  radiusTokens,
+  dimensionTokens,
+  typographyTokens,
+  shadowTokens,
+}) {
+  const rawMap =
+      flattenTokens(tokens || {});
+
+  const aliasMap =
+      flattenTokens(aliasTokens || {});
+
+  const globalMap =
+      flattenTokens(globalTokens || {});
+
+  const spacingMap =
+      flattenTokens(spacingTokens || {});
+
+  const radiusMap =
+      flattenTokens(radiusTokens || {});
+
+  const dimensionMap =
+      flattenTokens(dimensionTokens || {});
+
+  const typographyMap =
+      flattenTokens(
+        typographyTokens || {}
+      );
+
+  const shadowMap =
+      flattenTokens(shadowTokens || {});
+
+  /*
+   * Deduplicate by canonical Dart name.
+   */
+  const componentMap =
+      new Map();
+
+  for (
+    const [tokenPath, token]
+    of Object.entries(rawMap)
+  ) {
+    const canonical =
+        canonicalTokenKey(
+          tokenPath
+        );
+
+    if (
+      componentMap.has(canonical)
+    ) {
+      /*
+       * Same logical token exported twice:
+       *
+       * buttoncomponent
+       * buttonComponent
+       *
+       * Keep the first canonical source.
+       */
+      continue;
+    }
+
+    componentMap.set(
+      canonical,
+      {
+        tokenPath,
+        token,
+      }
+    );
+  }
+
+  const body = [];
+
+  const imports =
+      new Set();
+
+  for (
+    const { tokenPath, token }
+    of componentMap.values()
+  ) {
+    const type =
+        getTokenType(token);
+
+    const rawValue =
+        getTokenValue(token);
+
+    const resolved =
+        resolveReference(
+          rawValue,
+          type,
+          {
+            alias: aliasMap,
+            global: globalMap,
+            spacing: spacingMap,
+            radius: radiusMap,
+            dimensions: dimensionMap,
+            typography: typographyMap,
+            shadow: shadowMap,
+          },
+          []
+        );
+
+    const expr =
+        generateValue(
+          type,
+          resolved,
+          tokenPath
+        );
+
+    if (expr.importPath) {
+      imports.add(
+        expr.importPath
+      );
+    }
+
+    body.push(
+      `  static const ${expr.type} ` +
+      `${toDartIdentifier(tokenPath)} ` +
+      `= ${expr.value};`,
+      ''
+    );
+  }
+
+  const lines = [
+    '// GENERATED FILE - DO NOT EDIT',
+    '',
+  ];
+
+  if (
+    body.some(line =>
+      line.includes('Color')
+    )
+  ) {
+    imports.add(
+      'dart:ui'
+    );
+  }
+
+  for (
+    const importPath
+    of [...imports].sort()
+  ) {
+    if (importPath === 'dart:ui') {
+      lines.push(
+        "import 'dart:ui';"
+      );
+    } else {
+      lines.push(
+        `import '${importPath}';`
+      );
+    }
+  }
+
+  if (imports.size > 0) {
+    lines.push('');
+  }
+
+  lines.push(
+    'class ComponentTokens {',
+    '  ComponentTokens._();',
+    '',
+    ...body,
+    '}',
+    ''
+  );
+
+  return lines.join('\n');
+}
+
+function resolveReference(
+  value,
+  type,
+  maps,
+  stack
+) {
+  if (!isReference(value)) {
+    return {
+      value,
+      sourceLayer: 'literal',
+      sourcePath: null,
+    };
+  }
+
+  const referencePath =
+      cleanReference(value);
+
+  if (
+    stack.includes(referencePath)
+  ) {
+    throw new Error(
+      `❌ Circular component reference: ` +
+      `${[
+        ...stack,
+        referencePath,
+      ].join(' -> ')}`
+    );
+  }
+
+  /*
+   * Determine category from reference path.
+   */
+  const first =
+      referencePath.split('.')[0];
+
+  const categoryAliases = {
+    spacing: 'spacing',
+    space: 'spacing',
+
+    radius: 'radius',
+    radii: 'radius',
+
+    dimension: 'dimensions',
+    dimensions: 'dimensions',
+    size: 'dimensions',
+    sizes: 'dimensions',
+
+    typography: 'typography',
+    type: 'typography',
+
+    shadow: 'shadow',
+    shadows: 'shadow',
+    elevation: 'shadow',
+  };
+
+  const explicitCategory =
+      categoryAliases[first];
+
+  if (
+    explicitCategory &&
+    maps[explicitCategory]?.[
+      referencePath.substring(
+        first.length + 1
+      )
+    ]
+  ) {
+    return {
+      value: referencePath.substring(
+        first.length + 1
+      ),
+      sourceLayer: explicitCategory,
+      sourcePath:
+          referencePath.substring(
+            first.length + 1
+          ),
+    };
+  }
+
+  /*
+   * Alias has priority over global.
+   */
+  if (maps.alias[referencePath]) {
+    return {
+      value: getTokenValue(
+        maps.alias[referencePath]
+      ),
+      sourceLayer: 'alias',
+      sourcePath: referencePath,
+    };
+  }
+
+  if (maps.global[referencePath]) {
+    return {
+      value: getTokenValue(
+        maps.global[referencePath]
+      ),
+      sourceLayer: 'global',
+      sourcePath: referencePath,
+    };
+  }
+
+  throw new Error(
+    `❌ Broken component reference: ` +
+    `"${value}"\n` +
+    `Token not found: ${referencePath}`
+  );
+}
+
+function generateValue(
+  type,
+  resolved,
+  tokenPath
+) {
+  if (
+    resolved.sourceLayer ===
+    'alias'
+  ) {
+    return {
+      type: dartType(type),
+      value:
+        `AliasTokens.${toDartIdentifier(
+          resolved.sourcePath
+        )}`,
+      importPath:
+        CATEGORY_CONFIG.alias.importPath,
+    };
+  }
+
+  if (
+    resolved.sourceLayer ===
+    'global'
+  ) {
+    return {
+      type: dartType(type),
+      value:
+        `GlobalTokens.${toDartIdentifier(
+          resolved.sourcePath
+        )}`,
+      importPath:
+        CATEGORY_CONFIG.global.importPath,
+    };
+  }
+
+  if (
+    CATEGORY_CONFIG[
+      resolved.sourceLayer
+    ]
+  ) {
+    const config =
+        CATEGORY_CONFIG[
+          resolved.sourceLayer
+        ];
+
+    return {
+      type: dartType(type),
+      value:
+        `${config.className}.` +
+        `${toDartIdentifier(
+          resolved.sourcePath
+        )}`,
+      importPath:
+        config.importPath,
+    };
+  }
+
+  if (type === 'color') {
+    const color =
+        colorValue(
+          resolved.value
+        );
+
+    if (!color) {
+      throw new Error(
+        `❌ Invalid component color: ` +
+        `${tokenPath}\n` +
+        `Value: ${resolved.value}`
+      );
+    }
+
+    return {
+      type: 'Color',
+      value: color,
+      importPath: 'dart:ui',
+    };
+  }
+
+  if (
+    type === 'dimension'
+  ) {
+    const dimension =
+        dimensionValue(
+          resolved.value
+        );
+
+    if (dimension === null) {
+      throw new Error(
+        `❌ Invalid component dimension: ` +
+        `${tokenPath}\n` +
+        `Value: ${resolved.value}`
+      );
+    }
+
+    return {
+      type: 'double',
+      value: dimension,
+    };
+  }
+
+  if (type === 'number') {
+    return {
+      type: 'double',
+      value: String(
+        resolved.value
+      ),
+    };
+  }
+
+  if (type === 'string') {
+    return {
+      type: 'String',
+      value: JSON.stringify(
+        String(
+          resolved.value
+        )
+      ),
+    };
+  }
+
+  if (type === 'boolean') {
+    return {
+      type: 'bool',
+      value:
+        resolved.value
+          ? 'true'
+          : 'false',
+    };
+  }
+
+  throw new Error(
+    `❌ Unsupported component token type: ${type}`
+  );
+}
+
+module.exports = {
+  renderComponentTokens: generateComponentTokens,
+};

package/generators/global-generator.js

@@ -0,0 +1,116 @@
+const {
+  flattenTokens,
+  getTokenValue,
+  getTokenType,
+  toDartIdentifier,
+  colorValue,
+  dimensionValue,
+} = require('./token-utils');
+
+function renderGlobalTokens({
+  tokens,
+}) {
+  const tokenMap = flattenTokens(tokens);
+
+  let output =
+    `// GENERATED FILE - DO NOT EDIT\n` +
+    `// ignore_for_file: constant_identifier_names\n\n` +
+    `import 'dart:ui';\n\n`;
+
+  output +=
+    `class GlobalTokens {\n` +
+    `  GlobalTokens._();\n\n`;
+
+  for (const [tokenPath, token] of Object.entries(tokenMap)) {
+    const tokenName = toDartIdentifier(tokenPath);
+
+    const value = getTokenValue(token);
+    const type = getTokenType(token);
+
+    let dartType;
+    let dartValue;
+
+    // -----------------------------
+    // COLOR
+    // -----------------------------
+
+    if (type === 'color') {
+      const color = colorValue(value);
+
+      if (!color) {
+        throw new Error(
+          `❌ Invalid global color:\n` +
+          `Token: ${tokenPath}\n` +
+          `Value: ${value}`
+        );
+      }
+
+      dartType = 'Color';
+      dartValue = color;
+    }
+
+    // -----------------------------
+    // DIMENSION
+    // -----------------------------
+
+    else if (type === 'dimension') {
+      const dimension = dimensionValue(value);
+
+      if (dimension === null) {
+        throw new Error(
+          `❌ Invalid global dimension:\n` +
+          `Token: ${tokenPath}\n` +
+          `Value: ${value}`
+        );
+      }
+
+      dartType = 'double';
+      dartValue = dimension;
+    }
+
+    // -----------------------------
+    // NUMBER
+    // -----------------------------
+
+    else if (type === 'number') {
+      dartType = 'double';
+      dartValue = String(value);
+    }
+
+    // -----------------------------
+    // STRING
+    // -----------------------------
+
+    else if (type === 'string') {
+      dartType = 'String';
+      dartValue = JSON.stringify(String(value));
+    }
+
+    // -----------------------------
+    // BOOLEAN
+    // -----------------------------
+
+    else if (type === 'boolean') {
+      dartType = 'bool';
+      dartValue = value ? 'true' : 'false';
+    }
+
+    else {
+      throw new Error(
+        `❌ Unsupported global token type:\n` +
+        `Token: ${tokenPath}\n` +
+        `Type: ${type}`
+      );
+    }
+
+    output +=
+      `  static const ${dartType} ` +
+      `${tokenName} = ${dartValue};\n\n`;
+  }
+
+  output += `}\n`;
+
+  return output;
+}
+
+module.exports = { renderGlobalTokens };