Merge branch 'worktree-agent-ac2cdea6121b46ea6'

tests/Feature/Components/IconTest.php

@@ -3,6 +3,17 @@
 use Illuminate\View\ViewException;
 use NoNameWeb\LivewireMaterial\Support\SvgFile;
 
+/**
+ * What a symbol file draws, from its first shape on: the part that tells one cut from
+ * another, since every file opens with the same `<svg>` and viewBox.
+ */
+function symbolGeometry(string $file): string
+{
+    $svg = trim((string) file_get_contents(__DIR__.'/../../../resources/svg/symbols/'.$file.'.svg'));
+
+    return substr($svg, (int) strpos($svg, '><') + 1);
+}
+
 it('draws a symbol inline, hidden from screen readers, 24px by default', function () {
     $this->blade('<x-icon name="calendar_month" />')
         ->assertSee('class="shrink-0 size-6"', false)
@@ -32,6 +43,34 @@ it('draws the filled symbol when asked', function () {
         ->and($filled)->toContain('<path d=');
 });
 
+it('draws the optical size 20 cut when the caller asks for it', function () {
+    $standard = (string) $this->blade('<x-icon name="home" class="size-5" />');
+    $dense = (string) $this->blade('<x-icon name="home" class="size-5" optical="20" />');
+
+    expect($dense)->not->toBe($standard)
+        ->and($dense)->toContain('class="shrink-0 size-5"')
+        ->and($dense)->toContain('fill="currentColor"')
+        ->and($dense)->toContain(symbolGeometry('outlined-20/home'));
+});
+
+it('combines the filled state with the 20 cut', function () {
+    $outlined = (string) $this->blade('<x-icon name="favorite" optical="20" />');
+    $filled = (string) $this->blade('<x-icon name="favorite" optical="20" filled />');
+
+    expect($filled)->not->toBe($outlined)
+        ->and($outlined)->toContain(symbolGeometry('outlined-20/favorite'))
+        ->and($filled)->toContain(symbolGeometry('filled-20/favorite'))
+        ->and($filled)->not->toContain(symbolGeometry('filled/favorite'));
+});
+
+it('falls back to the 24 cut for an optical size it does not ship', function () {
+    $standard = (string) $this->blade('<x-icon name="home" />');
+
+    expect((string) $this->blade('<x-icon name="home" optical="40" />'))->toBe($standard)
+        ->and((string) $this->blade('<x-icon name="home" optical="24" />'))->toBe($standard)
+        ->and((string) $this->blade('<x-icon name="home" optical="" />'))->toBe($standard);
+});
+
 it('refuses a name that is not a symbol', function () {
     expect(fn () => $this->blade('<x-icon name="not_a_symbol_at_all" />'))
         ->toThrow(ViewException::class, 'There is no Material Symbol named [not_a_symbol_at_all].');
@@ -42,16 +81,29 @@ it('points a Heroicon name at the symbol catalogue', function () {
         ->toThrow(ViewException::class, 'is not a Material Symbol name');
 });
 
-it('ships every symbol outlined and filled, painted in the text colour', function () {
+it('ships every symbol outlined and filled in both cuts, painted in the text colour', function () {
     $symbols = SvgFile::symbolNames();
-    $filled = array_map(fn (string $file): string => basename($file, '.svg'), glob(__DIR__.'/../../../resources/svg/symbols/filled/*.svg'));
 
-    expect(count($symbols))->toBeGreaterThan(4000)
-        ->and($filled)->toEqual($symbols);
+    expect(count($symbols))->toBeGreaterThan(4000);
 
+    foreach (['filled', 'outlined-20', 'filled-20'] as $folder) {
+        $names = array_map(fn (string $file): string => basename($file, '.svg'), glob(__DIR__."/../../../resources/svg/symbols/{$folder}/*.svg"));
+
+        expect($names)->toEqual($symbols, "{$folder} holds a different catalogue than outlined");
+    }
+
+    foreach (['outlined', 'filled', 'outlined-20', 'filled-20'] as $folder) {
+        foreach (['home', 'search', 'cloud_upload', 'content_copy', 'delete'] as $name) {
+            expect(file_get_contents(__DIR__."/../../../resources/svg/symbols/{$folder}/{$name}.svg"))
+                ->toStartWith('<svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960"><path')
+                ->not->toContain('width=');
+        }
+    }
+});
+
+it('draws the two cuts from different geometry, not the same file scaled', function () {
     foreach (['home', 'search', 'cloud_upload', 'content_copy', 'delete'] as $name) {
-        expect(file_get_contents(__DIR__."/../../../resources/svg/symbols/outlined/{$name}.svg"))
-            ->toStartWith('<svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960"><path')
-            ->not->toContain('width=');
+        expect(symbolGeometry("outlined-20/{$name}"))->not->toBe(symbolGeometry("outlined/{$name}"))
+            ->and(symbolGeometry("filled-20/{$name}"))->not->toBe(symbolGeometry("filled/{$name}"));
     }
 });

tests/Feature/ShowcaseTest.php

@@ -92,6 +92,22 @@ it('serves a symbol for the icon search', function () {
         ->assertSee('viewBox="0 -960 960 960"', false);
 });
 
+it('serves the 24 cut by default and the 20 cut on request', function () {
+    $geometry = function (string $folder): string {
+        $svg = trim((string) file_get_contents(__DIR__."/../../resources/svg/symbols/{$folder}/home.svg"));
+
+        return substr($svg, (int) strpos($svg, '<path'));
+    };
+
+    $standard = $this->get('/material/symbols/outlined/home.svg')->assertOk()->getContent();
+    $dense = $this->get('/material/symbols/outlined/home.svg?optical=20')->assertOk()->getContent();
+
+    expect($dense)->not->toBe($standard)
+        ->and($standard)->toContain($geometry('outlined'))
+        ->and($dense)->toContain($geometry('outlined-20'))
+        ->and($this->get('/material/symbols/outlined/home.svg?optical=40')->getContent())->toBe($standard);
+});
+
 it('answers 404 for a symbol or style that does not exist', function () {
     $this->get('/material/symbols/outlined/not_a_symbol_at_all.svg')->assertNotFound();
     $this->get('/material/symbols/sharp/favorite.svg')->assertNotFound();