Merge branch 'main' of github.com:vardumper/extended-htmldocument

Author: iroybotlinio

README.md

@@ -27,11 +27,16 @@ echo (string) Anchor::create($dom)
 // output is:
 // <a class="secondary" href="https://google.com" rel="nofollow" title="Google it"></a>
 ```
-## Twig Templates
-There's now a Twig Template for every HTML element included. These allow for better consistency in your design system(s), support all possible HTML attributes and have basic validations for enum attributes. They are compatible with different ways of using Twig (`include`, `embed` and `use`).
+## Generated Templates
+Templates are generated from the HTML5 schema for every HTML element. These allow for better consistency in your design system(s), support all possible HTML attributes and have basic validations for enum attributes.
+Files are grouped into inline, block and void elements. For elements with a specific content model, a composed template is generated as well. (eg `<table><tr><td>Cell</td><tr></table>`)
+
+### Twig
+They are compatible with different ways of using Twig (`include`, `embed` and `use`).
 ```php
 $twig->path('vendor/vardumper/extended-htmldocument/templates', 'html'); /** register template path with or without namespace */
 ```
+Example 
 ```twig
 {% include '@html/inline/a.twig' with {
   href: 'https://example.com',
@@ -42,6 +47,29 @@ $twig->path('vendor/vardumper/extended-htmldocument/templates', 'html'); /** reg
 } %}
 ```
 
+### React & NextJS
+Type-safe, auto-generated React components for all HTML5 elements with full ARIA support. Work in both Next.js (Server Components, Client Components) and regular React applications (CRA, Vite, etc.). They use pure functional React patterns without hooks or browser-specific APIs.
+Example:
+```tsx
+import { Button, Div, H1 } from './index';
+
+export default function Page() {
+  return (
+    <Div className="container">
+      <H1>Welcome</H1>
+      <A
+        href="/contact"
+      >
+        Contact us
+      </A>
+    </Div>
+  );
+}
+```
+
+### Storybook
+
+
 ## Documentation
 See the [Documentation](https://vardumper.github.io/extended-htmldocument/) for more.
 

bin/ext-html

@@ -39,8 +39,8 @@ $app->command('generate:all [generator] [dest] [--overwrite-existing=] [--specif
     (new BatchGeneratorCommand())($generator, $dest, $input, $output, (bool) $overwriteExisting, $specification);
 })->descriptions('Generates templates. Uses a given generator. Requires a Generator Name (eg. html, twig) and a destination path for the generated templates. You can also provide a list of generators separated by comma.', ['generator' => 'name of the generator(s)', 'dest' => 'destination path']);
 
-$app->command('generate:composed [generator] [dest] [--overwrite-existing=]', function ($generator, $dest, InputInterface $input, OutputInterface $output, $overwriteExisting = false) {
-    return (new GenerateComposedCommand())($generator, $dest, $input, $output, (bool) $overwriteExisting);
+$app->command('generate:composed [generator] [dest] [--overwrite-existing=] [--specification=]', function ($generator, $dest, InputInterface $input, OutputInterface $output, $overwriteExisting = false, $specification = null) {
+    return (new GenerateComposedCommand())($generator, $dest, $input, $output, (bool) $overwriteExisting, $specification);
 })->descriptions('Generates composed component templates showing valid parent-child relationships based on content model metadata', ['generator' => 'name of the generator (nextjs, storybook, twig)', 'dest' => 'destination path']);
 
 $app->command('merge:specs [import] [dest]', function ($import, $dest, InputInterface $input, OutputInterface $output) {

clover.xml

@@ -25,6 +25,7 @@ php vendor/bin/ext-html make:classes a # only generates the Html\Element\Anchor
 php vendor/bin/ext-html make:classes # generates all classes, no enums
 php vendor/bin/ext-html make:all # generates both enums and classes
 php vendor/bin/ext-html generate:all twig,storybook templates # generates all twig templates and storybook stories, and saved them into templates folder
+php vendor/bin/ext-html generate:composed twig,storybook templates # generates composed templates based on content model (eg <table> with <tr>, <td>, etc), and saves them into templates folder
 php vendor/bin/ext-html merge:specs custom/schema.yaml destination/path.yaml # merges a custom regex or element-based specification into the html5.yaml file
 php vendor/bin/ext-html watch source/path dest/path # component builder. watches for component yaml changes, and generates templates on the fly
 ```

coverage.svg

@@ -27,7 +27,7 @@ class BatchGeneratorCommand extends Command
     use ClassResolverTrait;
     use GeneratorResolverTrait;
 
-    private const HTML_DEFINITION_PATH = __DIR__ . '/../Resources/specifications/html5.yaml';
+    private const HTML_DEFINITION_PATH = __DIR__ . '/../Resources/specifications/html5-with-aria.yaml';
 
     private ?array $data = null;
     private SymfonyStyle $io;

docs/code-generation.md

@@ -12,13 +12,15 @@
 use Html\TemplateGenerator\StorybookJSGenerator;
 use Html\TemplateGenerator\TwigGenerator;
 use Html\Trait\ClassResolverTrait;
+use Html\Trait\GeneratorResolverTrait;
 use ReflectionClass;
 use Symfony\Component\Console\Command\Command;
 use Symfony\Component\Console\Input\InputArgument;
 use Symfony\Component\Console\Input\InputInterface;
 use Symfony\Component\Console\Input\InputOption;
 use Symfony\Component\Console\Output\OutputInterface;
 use Symfony\Component\Console\Style\SymfonyStyle;
+use Symfony\Component\Yaml\Yaml;
 
 /**
  * Generate composed component templates showing valid parent-child relationships
@@ -30,13 +32,19 @@
 class GenerateComposedCommand extends Command
 {
     use ClassResolverTrait;
+    use GeneratorResolverTrait;
+
+    private const HTML_DEFINITION_PATH = __DIR__ . '/../Resources/specifications/html5-with-aria.yaml';
+
+    private ?array $data = null;
 
     public function __invoke(
         string $generator,
         string $dest,
         InputInterface $input,
         OutputInterface $output,
-        bool $overwriteExisting = false
+        bool $overwriteExisting = false,
+        ?string $specification = null
     ): int {
         $io = new SymfonyStyle($input, $output);
 
@@ -45,74 +53,88 @@ public function __invoke(
             return Command::FAILURE;
         }
 
-        // Instantiate the appropriate generator
-        $generatorInstance = match ($generator) {
-            'nextjs' => new NextJSGenerator(),
-            'storybook' => new StorybookJSGenerator(),
-            'twig' => new TwigGenerator(),
-            default => null,
-        };
-
-        if ($generatorInstance === null) {
-            $io->error("Unsupported generator '{$generator}'. Supported generators: nextjs, storybook, twig");
-            return Command::FAILURE;
+        if (! \str_contains($generator, ',')) {
+            $generators = [$generator];
+        } else {
+            $generators = \explode(',', $generator);
         }
 
-        // Check if generator supports composed element rendering
-        if (!method_exists($generatorInstance, 'renderComposedElement')) {
-            $io->error("Generator '{$generator}' does not support composed element rendering.");
+        $specificationPath = $input->getOption('specification');
+        if (! $this->loadHtmlDefinitions($specificationPath)) {
             return Command::FAILURE;
         }
-
-        $baseClasses = [InlineElement::class, BlockElement::class, VoidElement::class];
-        $elements = [];
-        foreach ($baseClasses as $baseClass) {
-            $elements = array_merge($elements, $this->getClassesExtendingClass($baseClass));
-        }
-
-        $dom = HTMLDocumentDelegator::createEmpty();
-        $generatedCount = 0;
-        $skippedCount = 0;
-
-        // Create content directory
-        $contentDir = rtrim($dest, \DIRECTORY_SEPARATOR) . \DIRECTORY_SEPARATOR . $generator . \DIRECTORY_SEPARATOR . 'composed';
-        if (! is_dir($contentDir)) {
-            mkdir($contentDir, 0755, true);
-        }
-
-        foreach ($elements as $className) {
-            /** @var class-string<\Html\Interface\HTMLElementInterface> $className */
-            $elementInstance = $className::create($dom);
-
-            // Check if element has SPECIFIC child requirements (not empty $parentOf)
-            // Skip elements that can contain any content
-            $ref = new ReflectionClass($className);
-            $parentOf = $ref->getStaticPropertyValue('parentOf', []);
-
-            if (empty($parentOf)) {
-                $skippedCount++;
-                continue;
+        // // Instantiate the appropriate generator
+        // $generatorInstance = match ($generator) {
+        //     'nextjs' => new NextJSGenerator(),
+        //     'storybook' => new StorybookJSGenerator(),
+        //     'twig' => new TwigGenerator(),
+        //     default => null,
+        // };
+
+        // if ($generatorInstance === null) {
+        //     $io->error("Unsupported generator '{$generator}'. Supported generators: nextjs, storybook, twig");
+        //     return Command::FAILURE;
+        // }
+
+        $templateGenerators = $this->getGenerators($generators);
+        foreach ($templateGenerators as $generator => $generatorInstance) {
+
+            // Check if generator supports composed element rendering
+            if (!method_exists($generatorInstance, 'renderComposedElement')) {
+                $io->error("Generator '{$generator}' does not support composed element rendering.");
+                return Command::FAILURE;
             }
 
-            $output = $generatorInstance->renderComposedElement($elementInstance);
-            if ($output === null) {
-                $skippedCount++;
-                continue;
+            $baseClasses = [InlineElement::class, BlockElement::class, VoidElement::class];
+            $elements = [];
+            foreach ($baseClasses as $baseClass) {
+                $elements = array_merge($elements, $this->getClassesExtendingClass($baseClass));
             }
 
-            $elementShortName = $ref->getShortName();
-            $fileName = $elementInstance::QUALIFIED_NAME . '.composed.' . $generatorInstance->getExtension();
-            $outFile = $contentDir . \DIRECTORY_SEPARATOR . $fileName;
+            $dom = HTMLDocumentDelegator::createEmpty();
+            $generatedCount = 0;
+            $skippedCount = 0;
 
-            if (file_exists($outFile) && ! $overwriteExisting) {
-                $io->warning("File '{$outFile}' already exists. Skipping.");
-                $skippedCount++;
-                continue;
+            // Create content directory
+            $contentDir = rtrim($dest, \DIRECTORY_SEPARATOR) . \DIRECTORY_SEPARATOR . $generator . \DIRECTORY_SEPARATOR . 'composed';
+            if (! is_dir($contentDir)) {
+                mkdir($contentDir, 0755, true);
             }
 
-            file_put_contents($outFile, $output);
-            $io->success("Generated: {$outFile}");
-            $generatedCount++;
+            foreach ($elements as $className) {
+                /** @var class-string<\Html\Interface\HTMLElementInterface> $className */
+                $elementInstance = $className::create($dom);
+
+                // Check if element has SPECIFIC child requirements (not empty $parentOf)
+                // Skip elements that can contain any content
+                $ref = new ReflectionClass($className);
+                $parentOf = $ref->getStaticPropertyValue('parentOf', []);
+
+                if (empty($parentOf)) {
+                    $skippedCount++;
+                    continue;
+                }
+
+                $output = $generatorInstance->renderComposedElement($elementInstance);
+                if ($output === null) {
+                    $skippedCount++;
+                    continue;
+                }
+
+                $elementShortName = $ref->getShortName();
+                $fileName = $elementInstance::QUALIFIED_NAME . '.composed.' . $generatorInstance->getExtension();
+                $outFile = $contentDir . \DIRECTORY_SEPARATOR . $fileName;
+
+                if (file_exists($outFile) && ! $overwriteExisting) {
+                    $io->warning("File '{$outFile}' already exists. Skipping.");
+                    $skippedCount++;
+                    continue;
+                }
+
+                file_put_contents($outFile, $output);
+                $io->success("Generated: {$outFile}");
+                $generatedCount++;
+            }
         }
 
         $io->success("Generated {$generatedCount} composed templates (specific composition patterns only). Skipped {$skippedCount} elements.");
@@ -142,4 +164,24 @@ public function configure(): void
                 false
             );
     }
+
+    private function loadHtmlDefinitions(?string $specificationPath): bool
+    {
+        if ($specificationPath !== null) {
+            if (! is_file($specificationPath)) {
+                $this->io->error('Specification file not found at ' . $specificationPath);
+                return false;
+            }
+            $this->data = Yaml::parseFile($specificationPath);
+            return true;
+        }
+
+        if (! is_file(self::HTML_DEFINITION_PATH)) {
+            $this->io->error('HTML definition file not found.');
+            return false;
+        }
+
+        $this->data = Yaml::parseFile(self::HTML_DEFINITION_PATH);
+        return true;
+    }
 }

src/Command/BatchGeneratorCommand.php

@@ -106,6 +106,11 @@ public function createElement(string $qualifiedName, ?string $nodeValue = null):
         return new HTMLElementDelegator($htmlElement);
     }
 
+    public function appendChild($child): void
+    {
+        $this->delegated->documentElement->appendChild($child->delegated);
+    }
+
     public function createTextNode(string $nodeValue): TextDelegator
     {
         $textNode = $this->delegated->createTextNode($nodeValue);