devendra-skill-package 1.0.2

package/.github/skills/validation-engine-builder/scripts/generate-angular.js

@@ -0,0 +1,271 @@
+#!/usr/bin/env node
+'use strict';
+
+/**
+ * Angular has no react-hook-form/Yup equivalent to reuse — react-hook-form is
+ * a React library and cannot run in Angular at all. This generator targets
+ * Angular's own framework-native Reactive Forms (Validators + FormBuilder)
+ * instead of porting the Yup/react-hook-form pattern.
+ *
+ * Output (5 files, same count/role as the RN/React generators):
+ *   validation-messages.ts       — via shared/ts-messages-regex.js (identical shape)
+ *   validation-regex.ts          — via shared/ts-messages-regex.js (identical shape)
+ *   pattern-with-message.validator.ts — custom ValidatorFn carrying a message key
+ *   validators.ts                — per-schema Validators[] arrays, replaces schemas.ts
+ *   validation-error.component.ts — replaces ValidationError.tsx; also replaces the
+ *                                   RN/React "hook" role since Angular's own
+ *                                   FormBuilder already serves that purpose
+ */
+
+const fs   = require('fs');
+const path = require('path');
+
+const { readTemplate, ensureDir, relativeImportPath } = require('./shared/util.js');
+const { genMessages, genRegex }                        = require('./shared/ts-messages-regex.js');
+
+// ── pattern-with-message.validator.ts ───────────────────────────────────────────
+
+function genPatternValidator(outDir) {
+  const content = [
+    `// Auto-generated by validation-engine-builder skill. DO NOT EDIT MANUALLY.`,
+    ``,
+    `import type { AbstractControl, ValidatorFn } from '@angular/forms';`,
+    ``,
+    `/**`,
+    ` * Regex validator that reports a specific message key on failure (instead of`,
+    ` * Angular's built-in 'pattern' key), so ValidationErrorComponent can look up`,
+    ` * the exact VALIDATION_MESSAGES entry configured in schemas.json.`,
+    ` */`,
+    `export function patternWithMessage(regex: RegExp, messageKey: string): ValidatorFn {`,
+    `  return (control: AbstractControl) => {`,
+    `    if (control.value === null || control.value === undefined || control.value === '') return null;`,
+    `    return regex.test(control.value) ? null : { [messageKey]: true };`,
+    `  };`,
+    `}`,
+  ].join('\n');
+
+  fs.writeFileSync(path.join(outDir, 'pattern-with-message.validator.ts'), content);
+  console.log('  ✅ pattern-with-message.validator.ts');
+}
+
+// ── validators.ts (replaces schemas.ts — Angular Validators, not Yup) ───────────
+
+function buildFieldValidators(fieldName, rules) {
+  const parts = [];
+
+  if (rules.required) parts.push('Validators.required');
+
+  if (rules.min !== undefined) {
+    parts.push(rules.type === 'number' ? `Validators.min(${rules.min})` : `Validators.minLength(${rules.min})`);
+  }
+
+  if (rules.max !== undefined) {
+    parts.push(rules.type === 'number' ? `Validators.max(${rules.max})` : `Validators.maxLength(${rules.max})`);
+  }
+
+  if (rules.regex) {
+    const msgKey = rules.regexMessage || rules.regex;
+    parts.push(`patternWithMessage(VALIDATION_REGEX.${rules.regex}, '${msgKey}')`);
+  }
+
+  // `nullable` in schemas.json means "no required validator" — Angular has no
+  // separate nullability validator; the absence of Validators.required already
+  // permits an empty value, so nothing is emitted for this flag.
+
+  return `[${parts.join(', ')}]`;
+}
+
+function genValidators(schemasRaw, outDir) {
+  const schemaBlocks = Object.entries(schemasRaw).map(([schemaName, fields]) => {
+    const fieldLines = Object.entries(fields).map(([fieldName, rules]) =>
+      `    ${fieldName}: ${buildFieldValidators(fieldName, rules)},`
+    );
+    return [
+      `  ${schemaName}: {`,
+      ...fieldLines,
+      `  },`,
+    ].join('\n');
+  });
+
+  const content = [
+    `// Auto-generated by validation-engine-builder skill. DO NOT EDIT MANUALLY.`,
+    `// Edit templates/schemas.json and re-run apply-to-project.js`,
+    ``,
+    `import { Validators, type ValidatorFn } from '@angular/forms';`,
+    `import { VALIDATION_REGEX } from './validation-regex';`,
+    `import { patternWithMessage } from './pattern-with-message.validator';`,
+    ``,
+    `export const validators: Record<string, Record<string, ValidatorFn[]>> = {`,
+    ...schemaBlocks,
+    `};`,
+    ``,
+    `export type SchemaKey = keyof typeof validators;`,
+  ].join('\n');
+
+  fs.writeFileSync(path.join(outDir, 'validators.ts'), content);
+  console.log('  ✅ validators.ts');
+}
+
+// ── validation-error.component.ts ───────────────────────────────────────────────
+
+function genValidationErrorComponent(outDir) {
+  const content = [
+    `// Auto-generated by validation-engine-builder skill. DO NOT EDIT MANUALLY.`,
+    ``,
+    `import { Component, Input } from '@angular/core';`,
+    `import type { AbstractControl } from '@angular/forms';`,
+    `import { VALIDATION_MESSAGES, msg } from './validation-messages';`,
+    ``,
+    `/**`,
+    ` * Displays the first active validation error for a control, mapped to the`,
+    ` * centralized VALIDATION_MESSAGES. Covers Angular's built-in error keys`,
+    ` * (required, minlength, maxlength, min, max) plus any custom message-key`,
+    ` * error set by patternWithMessage().`,
+    ` *`,
+    ` * Usage (template):`,
+    ` *   <app-validation-error [control]="form.get('email')" label="Email" />`,
+    ` */`,
+    `@Component({`,
+    `  selector: 'app-validation-error',`,
+    `  standalone: true,`,
+    `  template: \`<span class="validation-error" *ngIf="message">{{ message }}</span>\`,`,
+    `})`,
+    `export class ValidationErrorComponent {`,
+    `  @Input() control: AbstractControl | null = null;`,
+    `  @Input() label = '';`,
+    ``,
+    `  get message(): string | null {`,
+    `    const control = this.control;`,
+    `    if (!control || !control.errors || !(control.dirty || control.touched)) return null;`,
+    `    const errors = control.errors;`,
+    ``,
+    `    if (errors['required']) return msg.required(this.label);`,
+    `    if (errors['minlength']) return msg.minLength(errors['minlength'].requiredLength);`,
+    `    if (errors['maxlength']) return msg.maxLength(errors['maxlength'].requiredLength);`,
+    `    if (errors['min']) return msg.minNumber(errors['min'].min);`,
+    `    if (errors['max']) return msg.maxNumber(errors['max'].max);`,
+    ``,
+    `    const customKey = Object.keys(errors).find((key) => key in VALIDATION_MESSAGES);`,
+    `    if (customKey) return (VALIDATION_MESSAGES as Record<string, string>)[customKey];`,
+    ``,
+    `    return VALIDATION_MESSAGES.invalidFormat;`,
+    `  }`,
+    `}`,
+  ].join('\n');
+
+  fs.writeFileSync(path.join(outDir, 'validation-error.component.ts'), content);
+  console.log('  ✅ validation-error.component.ts');
+}
+
+// ── Page scaffold ─────────────────────────────────────────────────────────────
+
+function toPascalCase(kebab) {
+  return kebab.split('-').filter(Boolean).map((s) => s.charAt(0).toUpperCase() + s.slice(1)).join('');
+}
+
+function generateScreen(projectRoot, pageName, schemaKey, pagePath, schemasRaw) {
+  const fields = schemasRaw[schemaKey];
+  if (!fields) {
+    console.log(`\n  ⚠️  Schema "${schemaKey}" not found in schemas.json.`);
+    console.log(`  Available schemas: ${Object.keys(schemasRaw).join(', ')}`);
+    return;
+  }
+
+  const className = `${toPascalCase(pageName)}Component`;
+  const pageDir = path.join(projectRoot, pagePath, pageName);
+  ensureDir(pageDir);
+
+  const validationOutDir = path.join(projectRoot, 'src', 'app', 'validation');
+  const validationImportPath = relativeImportPath(pageDir, validationOutDir);
+
+  const formGroupLines = Object.keys(fields).map(
+    (fieldName) => `      ${fieldName}: ['', validators.${schemaKey}.${fieldName}],`
+  );
+
+  const templateFields = Object.entries(fields).map(([fieldName, rules]) => {
+    const label = rules.label || fieldName.charAt(0).toUpperCase() + fieldName.slice(1);
+    const inputType = ['password', 'confirmPassword', 'newPassword', 'currentPassword'].includes(fieldName)
+      ? 'password'
+      : (rules.type === 'number' ? 'number' : 'text');
+    return [
+      `  <div class="field">`,
+      `    <label for="${fieldName}">${label}</label>`,
+      `    <input id="${fieldName}" type="${inputType}" formControlName="${fieldName}" />`,
+      `    <app-validation-error [control]="form.get('${fieldName}')" label="${label}"></app-validation-error>`,
+      `  </div>`,
+    ].join('\n');
+  }).join('\n');
+
+  const componentContent = [
+    `// Auto-generated scaffold — wire up submit logic before shipping.`,
+    ``,
+    `import { Component } from '@angular/core';`,
+    `import { FormBuilder, ReactiveFormsModule, type FormGroup } from '@angular/forms';`,
+    `import { validators } from '${validationImportPath}/validators';`,
+    `import { ValidationErrorComponent } from '${validationImportPath}/validation-error.component';`,
+    ``,
+    `@Component({`,
+    `  selector: 'app-${pageName}',`,
+    `  standalone: true,`,
+    `  imports: [ReactiveFormsModule, ValidationErrorComponent],`,
+    `  templateUrl: './${pageName}.component.html',`,
+    `  styleUrl: './${pageName}.component.scss',`,
+    `})`,
+    `export class ${className} {`,
+    `  // Built in the constructor body, not as a field initializer — a field`,
+    `  // initializer runs before constructor parameter properties are assigned,`,
+    `  // so 'this.fb' would still be undefined at that point.`,
+    `  readonly form: FormGroup;`,
+    ``,
+    `  constructor(private readonly fb: FormBuilder) {`,
+    `    this.form = this.fb.group({`,
+    ...formGroupLines.map((l) => `  ${l}`),
+    `    });`,
+    `  }`,
+    ``,
+    `  onSubmit(): void {`,
+    `    if (this.form.invalid) {`,
+    `      this.form.markAllAsTouched();`,
+    `      return;`,
+    `    }`,
+    `    console.log('${className} submit:', this.form.value);`,
+    `    // TODO: Add your submit logic here`,
+    `  }`,
+    `}`,
+  ].join('\n');
+
+  const templateContent = [
+    `<form [formGroup]="form" (ngSubmit)="onSubmit()">`,
+    templateFields,
+    `  <button type="submit">Submit</button>`,
+    `</form>`,
+  ].join('\n');
+
+  fs.writeFileSync(path.join(pageDir, `${pageName}.component.ts`), componentContent);
+  fs.writeFileSync(path.join(pageDir, `${pageName}.component.html`), templateContent);
+  fs.writeFileSync(path.join(pageDir, `${pageName}.component.scss`), `.field {\n  margin-bottom: 16px;\n}\n\n.validation-error {\n  color: #DC2626;\n  font-size: 12px;\n  display: block;\n  margin-top: 4px;\n}\n`);
+  console.log(`  ✅ ${pageName}.component.ts/.html/.scss → ${pagePath}/${pageName}/`);
+}
+
+// ── Main export ───────────────────────────────────────────────────────────────
+
+function generate(projectRoot) {
+  const outDir = path.join(projectRoot, 'src', 'app', 'validation');
+  ensureDir(outDir);
+
+  console.log('\n📁 Generating src/app/validation/ (Angular) ...');
+
+  const messages   = readTemplate('messages.json');
+  const regexMap   = readTemplate('regex.json');
+  const schemasRaw = readTemplate('schemas.json');
+
+  genMessages(messages, outDir, 'validation-messages.ts');
+  genRegex(regexMap, outDir, 'validation-regex.ts');
+  genPatternValidator(outDir);
+  genValidators(schemasRaw, outDir);
+  genValidationErrorComponent(outDir);
+
+  return schemasRaw;
+}
+
+module.exports = { generate, generateScreen };

package/.github/skills/validation-engine-builder/scripts/generate-flutter.js

@@ -0,0 +1,298 @@
+#!/usr/bin/env node
+'use strict';
+
+/**
+ * Flutter cannot run any JS library (no Yup, no react-hook-form) — this
+ * generator emits pure Dart. Flutter's own Form + TextFormField.validator
+ * mechanism already displays the returned string under the field, so unlike
+ * the other 3 platforms there is no separate "ValidationError" file to
+ * generate — see references/platform-flutter.md for why.
+ *
+ * Output (3 files — fewer than the other platforms because Flutter needs no
+ * separate hook file and no separate error-display file):
+ *   validation_messages.dart
+ *   validation_regex.dart
+ *   validators.dart   — one class per schema, static `String? Function(String?)` per field
+ */
+
+const fs   = require('fs');
+const path = require('path');
+
+const { readTemplate, ensureDir, relativeDartImportPath } = require('./shared/util.js');
+
+// ── Dart literal helpers ─────────────────────────────────────────────────────────
+
+function dartStringLiteral(str) {
+  const escaped = String(str).replace(/\\/g, '\\\\').replace(/'/g, "\\'").replace(/\$/g, '\\$');
+  return `'${escaped}'`;
+}
+
+function dartRawRegexLiteral(pattern) {
+  if (!pattern.includes("'")) return `r'${pattern}'`;
+  if (!pattern.includes('"')) return `r"${pattern}"`;
+  // Pattern contains both quote types — fall back to a non-raw, fully escaped string.
+  const escaped = pattern.replace(/\\/g, '\\\\').replace(/'/g, "\\'").replace(/\$/g, '\\$');
+  return `'${escaped}'`;
+}
+
+function toPascalCase(camelOrSnake) {
+  return camelOrSnake
+    .replace(/_([a-z])/g, (_, c) => c.toUpperCase())
+    .replace(/^[a-z]/, (c) => c.toUpperCase());
+}
+
+// ── validation_messages.dart ─────────────────────────────────────────────────────
+
+const INTERPOLATED_HELPERS = {
+  required:  { param: 'String field', argName: 'field', argType: 'String' },
+  minLength: { param: 'int min', argName: 'min', argType: 'int' },
+  maxLength: { param: 'int max', argName: 'max', argType: 'int' },
+  minNumber: { param: 'num min', argName: 'min', argType: 'num' },
+  maxNumber: { param: 'num max', argName: 'max', argType: 'num' },
+  minAge:    { param: 'int min', argName: 'min', argType: 'int' },
+  fileSize:  { param: 'num max', argName: 'max', argType: 'num' },
+};
+
+function genDartMessages(messages, outDir) {
+  const constLines = Object.entries(messages).map(
+    ([key, value]) => `  static const String ${key} = ${dartStringLiteral(value)};`
+  );
+
+  const placeholder = { required: '{{field}}', minLength: '{{min}}', maxLength: '{{max}}', minNumber: '{{min}}', maxNumber: '{{max}}', minAge: '{{min}}', fileSize: '{{max}}' };
+
+  const helperLines = Object.entries(INTERPOLATED_HELPERS)
+    .filter(([key]) => messages[key] !== undefined)
+    .map(([key, { param, argName, argType }]) => {
+      const interpolated = argType === 'String' ? argName : `${argName}.toString()`;
+      return `  static String ${key}Msg(${param}) => ${key}.replaceAll('${placeholder[key]}', ${interpolated});`;
+    });
+
+  const content = [
+    `// Auto-generated by validation-engine-builder skill. DO NOT EDIT MANUALLY.`,
+    `// Edit templates/messages.json and re-run apply-to-project.js`,
+    ``,
+    `class ValidationMessages {`,
+    ...constLines,
+    ``,
+    ...helperLines,
+    `}`,
+  ].join('\n');
+
+  fs.writeFileSync(path.join(outDir, 'validation_messages.dart'), content);
+  console.log('  ✅ validation_messages.dart');
+}
+
+// ── validation_regex.dart ────────────────────────────────────────────────────────
+
+function genDartRegex(regexMap, outDir) {
+  const entries = Object.entries(regexMap).map(
+    ([key, pattern]) => `  static final RegExp ${key} = RegExp(${dartRawRegexLiteral(pattern)});`
+  );
+
+  const content = [
+    `// Auto-generated by validation-engine-builder skill. DO NOT EDIT MANUALLY.`,
+    `// Edit templates/regex.json and re-run apply-to-project.js`,
+    ``,
+    `class ValidationRegex {`,
+    ...entries,
+    `}`,
+  ].join('\n');
+
+  fs.writeFileSync(path.join(outDir, 'validation_regex.dart'), content);
+  console.log('  ✅ validation_regex.dart');
+}
+
+// ── validators.dart ───────────────────────────────────────────────────────────────
+
+function buildFieldValidatorBody(fieldName, rules) {
+  const type = rules.type || 'string';
+  const label = rules.label || fieldName;
+  const lines = [];
+
+  if (rules.required) {
+    lines.push(`    if (value == null || value.isEmpty) return ValidationMessages.requiredMsg(${dartStringLiteral(label)});`);
+  }
+
+  const guardedLines = [];
+
+  if (rules.min !== undefined) {
+    if (type === 'number') {
+      guardedLines.push(`final parsed = num.tryParse(value);`);
+      guardedLines.push(`if (parsed == null || parsed < ${rules.min}) return ValidationMessages.minNumberMsg(${rules.min});`);
+    } else {
+      guardedLines.push(`if (value.length < ${rules.min}) return ValidationMessages.minLengthMsg(${rules.min});`);
+    }
+  }
+
+  if (rules.max !== undefined) {
+    if (type === 'number') {
+      guardedLines.push(`final parsedMax = num.tryParse(value);`);
+      guardedLines.push(`if (parsedMax == null || parsedMax > ${rules.max}) return ValidationMessages.maxNumberMsg(${rules.max});`);
+    } else {
+      guardedLines.push(`if (value.length > ${rules.max}) return ValidationMessages.maxLengthMsg(${rules.max});`);
+    }
+  }
+
+  if (rules.regex) {
+    const msgKey = rules.regexMessage || rules.regex;
+    guardedLines.push(`if (!ValidationRegex.${rules.regex}.hasMatch(value)) return ValidationMessages.${msgKey};`);
+  }
+
+  if (guardedLines.length > 0) {
+    if (rules.required) {
+      lines.push(...guardedLines.map((l) => `    ${l}`));
+    } else {
+      // Not required — only run min/max/regex checks when a value was actually entered.
+      lines.push(`    if (value != null && value.isNotEmpty) {`);
+      lines.push(...guardedLines.map((l) => `      ${l}`));
+      lines.push(`    }`);
+    }
+  }
+
+  lines.push(`    return null;`);
+  return lines.join('\n');
+}
+
+function genValidators(schemasRaw, outDir) {
+  const classBlocks = Object.entries(schemasRaw).map(([schemaName, fields]) => {
+    const className = `${toPascalCase(schemaName)}Validators`;
+    const methods = Object.entries(fields).map(([fieldName, rules]) => [
+      `  static String? ${fieldName}(String? value) {`,
+      buildFieldValidatorBody(fieldName, rules),
+      `  }`,
+    ].join('\n'));
+
+    return [
+      `class ${className} {`,
+      methods.join('\n\n'),
+      `}`,
+    ].join('\n');
+  });
+
+  const content = [
+    `// Auto-generated by validation-engine-builder skill. DO NOT EDIT MANUALLY.`,
+    `// Edit templates/schemas.json and re-run apply-to-project.js`,
+    ``,
+    `import 'validation_messages.dart';`,
+    `import 'validation_regex.dart';`,
+    ``,
+    classBlocks.join('\n\n'),
+  ].join('\n');
+
+  fs.writeFileSync(path.join(outDir, 'validators.dart'), content);
+  console.log('  ✅ validators.dart');
+}
+
+// ── Page scaffold ─────────────────────────────────────────────────────────────
+
+function generateScreen(projectRoot, pageName, schemaKey, pagePath, schemasRaw) {
+  const fields = schemasRaw[schemaKey];
+  if (!fields) {
+    console.log(`\n  ⚠️  Schema "${schemaKey}" not found in schemas.json.`);
+    console.log(`  Available schemas: ${Object.keys(schemasRaw).join(', ')}`);
+    return;
+  }
+
+  // No forced "Page" suffix here — pageName is expected to already follow the
+  // Flutter naming convention (e.g. "login_page"), matching how the other 3
+  // platform generators trust the caller's name as-is.
+  const className = toPascalCase(pageName);
+  const validatorsClassName = `${toPascalCase(schemaKey)}Validators`;
+  const pageDir = path.join(projectRoot, pagePath);
+  ensureDir(pageDir);
+
+  const validationOutDir = path.join(projectRoot, 'lib', 'core', 'validation');
+  const validatorsImportPath = relativeDartImportPath(pageDir, validationOutDir);
+
+  const fieldNames = Object.keys(fields);
+  const controllerLines = fieldNames.map((f) => `  final _${f}Controller = TextEditingController();`);
+  const disposeLines = fieldNames.map((f) => `    _${f}Controller.dispose();`);
+
+  const formFieldBlocks = fieldNames.map((fieldName) => {
+    const rules = fields[fieldName];
+    const label = rules.label || fieldName;
+    const isPassword = ['password', 'confirmPassword', 'newPassword', 'currentPassword'].includes(fieldName);
+    const keyboardType = rules.type === 'number' ? 'keyboardType: TextInputType.number,\n            ' : '';
+    return [
+      `          TextFormField(`,
+      `            controller: _${fieldName}Controller,`,
+      `            decoration: const InputDecoration(labelText: ${dartStringLiteral(label)}),`,
+      `            ${keyboardType}obscureText: ${isPassword},`,
+      `            validator: ${validatorsClassName}.${fieldName},`,
+      `          ),`,
+    ].join('\n');
+  }).join('\n');
+
+  const content = [
+    `// Auto-generated scaffold — wire up submit logic before shipping.`,
+    ``,
+    `import 'package:flutter/material.dart';`,
+    `import '${validatorsImportPath}/validators.dart';`,
+    ``,
+    `class ${className} extends StatefulWidget {`,
+    `  const ${className}({super.key});`,
+    ``,
+    `  @override`,
+    `  State<${className}> createState() => _${className}State();`,
+    `}`,
+    ``,
+    `class _${className}State extends State<${className}> {`,
+    `  final _formKey = GlobalKey<FormState>();`,
+    ...controllerLines,
+    ``,
+    `  @override`,
+    `  void dispose() {`,
+    ...disposeLines,
+    `    super.dispose();`,
+    `  }`,
+    ``,
+    `  void _submit() {`,
+    `    if (_formKey.currentState!.validate()) {`,
+    `      // TODO: Add your submit logic here`,
+    `    }`,
+    `  }`,
+    ``,
+    `  @override`,
+    `  Widget build(BuildContext context) {`,
+    `    return Scaffold(`,
+    `      body: Form(`,
+    `        key: _formKey,`,
+    `        child: ListView(`,
+    `          padding: const EdgeInsets.all(24),`,
+    `          children: [`,
+    formFieldBlocks,
+    `            const SizedBox(height: 16),`,
+    `            ElevatedButton(onPressed: _submit, child: const Text('Submit')),`,
+    `          ],`,
+    `        ),`,
+    `      ),`,
+    `    );`,
+    `  }`,
+    `}`,
+  ].join('\n');
+
+  const outFile = path.join(pageDir, `${pageName}.dart`);
+  fs.writeFileSync(outFile, content);
+  console.log(`  ✅ ${pageName}.dart → ${pagePath}/`);
+}
+
+// ── Main export ───────────────────────────────────────────────────────────────
+
+function generate(projectRoot) {
+  const outDir = path.join(projectRoot, 'lib', 'core', 'validation');
+  ensureDir(outDir);
+
+  console.log('\n📁 Generating lib/core/validation/ (Flutter) ...');
+
+  const messages   = readTemplate('messages.json');
+  const regexMap   = readTemplate('regex.json');
+  const schemasRaw = readTemplate('schemas.json');
+
+  genDartMessages(messages, outDir);
+  genDartRegex(regexMap, outDir);
+  genValidators(schemasRaw, outDir);
+
+  return schemasRaw;
+}
+
+module.exports = { generate, generateScreen };