Add colour profiles

An application lists named schemes in livewire-material.profiles, and material:scheme without a seed generates them all into one stylesheet: the default profile as the plain blocks, every profile under <html data-scheme>, with descendant selectors so a nested data-theme panel keeps the page's profile. The JSON keeps the 1.0 top level. Scheme::resolveProfileUsing() lets the application name the active profile; it is asked on every use and falls back to the default for an unknown name or a resolver that throws. The head script writes it before the first paint and keeps it through wire:navigate, and the mail theme and the error pages' fallback draw it. <x-scheme-picker> chooses one and previews it through $store.theme.previewScheme(); the showcase previews the Workbench's profiles. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V9NnLxnPp8vaaurb3Z1MFy
2026-09-13 14:35:49 +02:00
parent 7798352cfc
commit fb42f004b1
22 changed files with 2006 additions and 47 deletions
@@ -78,3 +78,68 @@ it('fails without writing anything when node cannot run', function () {

    expect(File::exists($this->stylesheet))->toBeFalse();
 });
+
+it('generates every configured profile into one stylesheet keyed by data-scheme', function () {
+    config([
+        'livewire-material.profiles' => [
+            'indigo' => ['label' => 'Indigo', 'seed' => '#4f46e5', 'variant' => 'vibrant'],
+            'teal' => ['label' => 'Teal', 'seed' => '#00897b', 'variant' => 'vibrant'],
+            'graphite' => ['seed' => '#5f6368', 'variant' => 'neutral'],
+        ],
+        'livewire-material.profile' => 'teal',
+    ]);
+
+    $this->artisan('material:scheme', ['--output' => $this->stylesheet])->assertSuccessful();
+
+    $scheme = json_decode(File::get($this->data), true);
+    $stylesheet = File::get($this->stylesheet);
+
+    expect($scheme['default'])->toBe('teal')
+        ->and(array_keys($scheme['profiles']))->toBe(['indigo', 'teal', 'graphite'])
+        ->and($scheme['profiles']['graphite'])->label->toBe('Graphite')->variant->toBe('neutral')
+        ->and($scheme['profiles']['indigo']['light']['primary'])->not->toBe($scheme['profiles']['teal']['light']['primary'])
+        // The top level is the default profile, as a 1.0 reader expects.
+        ->and($scheme['light'])->toBe($scheme['profiles']['teal']['light'])
+        ->and($scheme['dark'])->toBe($scheme['profiles']['teal']['dark'])
+        ->and($scheme['seed'])->toBe('#00897b')
+        ->and($stylesheet)->toContain('php artisan material:scheme'."\n");
+
+    // The default's plain blocks come first, so a profile's single-attribute selector follows :root.
+    expect(strpos($stylesheet, ":root,\n[data-theme='light'] {"))->toBeLessThan(strpos($stylesheet, "[data-scheme='indigo'],"));
+
+    foreach ($scheme['profiles'] as $name => $profile) {
+        foreach (['light' => "[data-scheme='{$name}'] [data-theme='light'] {", 'dark' => "[data-scheme='{$name}'] [data-theme='dark'] {"] as $theme => $selector) {
+            $block = Str::of($stylesheet)->after($selector)->before('}')->toString();
+
+            expect($block)->toContain("color-scheme: {$theme};")
+                ->toContain("--md-sys-color-primary: {$profile[$theme]['primary']};")
+                ->toContain("--md-sys-color-surface: {$profile[$theme]['surface']};");
+        }
+    }
+});
+
+it('names the profile a generator error belongs to', function () {
+    config(['livewire-material.profiles' => ['indigo' => ['seed' => '#4f46e5'], 'broken' => ['seed' => 'teal']]]);
+
+    $this->artisan('material:scheme', ['--output' => $this->stylesheet])
+        ->expectsOutputToContain('Profile "broken"')
+        ->assertFailed();
+
+    expect(File::exists($this->stylesheet))->toBeFalse();
+});
+
+it('asks for a seed or profiles when it has neither', function () {
+    config(['livewire-material.profiles' => []]);
+
+    $this->artisan('material:scheme', ['--output' => $this->stylesheet])
+        ->expectsOutputToContain('livewire-material.profiles')
+        ->assertFailed();
+});
+
+it('refuses a profile name that cannot be an attribute value', function () {
+    config(['livewire-material.profiles' => ['Ocean Blue' => ['seed' => '#0b57d0']]]);
+
+    $this->artisan('material:scheme', ['--output' => $this->stylesheet])
+        ->expectsOutputToContain('"Ocean Blue" is not')
+        ->assertFailed();
+});