From 18762fa7d67a4022c37d563ef3ce80086723b9d3 Mon Sep 17 00:00:00 2001 From: Pedro Cabral Date: Tue, 21 Apr 2026 10:13:07 +0200 Subject: [PATCH 1/4] added storybook --- resources/views/storybook/index.blade.php | 80 +++++++++++++++++++++++ routes/web.php | 4 ++ 2 files changed, 84 insertions(+) create mode 100644 resources/views/storybook/index.blade.php diff --git a/resources/views/storybook/index.blade.php b/resources/views/storybook/index.blade.php new file mode 100644 index 0000000..59b0a40 --- /dev/null +++ b/resources/views/storybook/index.blade.php @@ -0,0 +1,80 @@ + + + + + Storybook + + @vite(['resources/css/app.css', 'resources/js/app.js']) + + + +

Storybook

+ + +
+

Colors

+ +
+
Primary
+
Secondary
+
Surface
+
+
+ + +
+

Buttons

+

Enabled

+ +
+ + + + + +
+ +

Disabled

+ +
+ + + + + +
+
+ + +
+

Cards

+ +
+

Card title

+

This is a simple card component.

+
+
+ + +
+

Typography

+ +

Default text

+

Muted text

+

Primary text

+
+ + + \ No newline at end of file diff --git a/routes/web.php b/routes/web.php index 86a06c5..16e9d0c 100644 --- a/routes/web.php +++ b/routes/web.php @@ -5,3 +5,7 @@ use Illuminate\Support\Facades\Route; Route::get('/', function () { return view('welcome'); }); + +Route::get('/storybook', function () { + return view('storybook.index'); +})->name('storybook'); From 2d3ef6978dbecd7f5e6ed215281eb741e0be3bea Mon Sep 17 00:00:00 2001 From: Pedro Cabral Date: Tue, 21 Apr 2026 14:33:46 +0200 Subject: [PATCH 2/4] added button component --- app/View/Components/Button.php | 62 +++++++++++++++++++ resources/views/components/button.blade.php | 8 +++ resources/views/storybook/index.blade.php | 32 +++++----- tests/Feature/Component/ButtonTest.php | 43 +++++++++++++ .../DataProvider/ButtonTestDataProvider.php | 28 +++++++++ 5 files changed, 155 insertions(+), 18 deletions(-) create mode 100644 app/View/Components/Button.php create mode 100644 resources/views/components/button.blade.php create mode 100644 tests/Feature/Component/ButtonTest.php create mode 100644 tests/Feature/Component/DataProvider/ButtonTestDataProvider.php diff --git a/app/View/Components/Button.php b/app/View/Components/Button.php new file mode 100644 index 0000000..0d8cfae --- /dev/null +++ b/app/View/Components/Button.php @@ -0,0 +1,62 @@ +variant) { + self::VARIANT_SECONDARY => [ + 'base' => 'bg-secondary text-text', + 'hover' => 'hover:bg-secondary-dark', + 'disabled' => 'disabled:bg-secondary', + ], + self::VARIANT_OUTLINE => [ + 'base' => 'bg-surface border border-primary text-primary', + 'hover' => 'hover:bg-primary hover:text-text-inverted', + 'disabled' => 'disabled:bg-surface disabled:text-primary', + ], + default => [ + 'base' => 'bg-primary text-text-inverted', + 'hover' => 'hover:bg-primary-dark', + 'disabled' => 'disabled:bg-primary' + ] + }; + + $baseDisabled = 'disabled:cursor-not-allowed disabled:opacity-60'; + + return trim( + $base . ' ' . + $classes['base'] . ' ' . + $classes['hover'] . ' ' . + $baseDisabled . ' ' . + $classes['disabled'] + ); + } + + /** + * Get the view / contents that represent the component. + */ + public function render(): View + { + return view('components.button'); + } +} diff --git a/resources/views/components/button.blade.php b/resources/views/components/button.blade.php new file mode 100644 index 0000000..4e20927 --- /dev/null +++ b/resources/views/components/button.blade.php @@ -0,0 +1,8 @@ + diff --git a/resources/views/storybook/index.blade.php b/resources/views/storybook/index.blade.php index 59b0a40..f1fdef6 100644 --- a/resources/views/storybook/index.blade.php +++ b/resources/views/storybook/index.blade.php @@ -27,33 +27,29 @@

Enabled

- + Default - + Primary - + + Secondary + + + Outline

Disabled

- + Default - + Primary - + + Secondary + + + Outline
diff --git a/tests/Feature/Component/ButtonTest.php b/tests/Feature/Component/ButtonTest.php new file mode 100644 index 0000000..1366139 --- /dev/null +++ b/tests/Feature/Component/ButtonTest.php @@ -0,0 +1,43 @@ +blade('Click!'); + + $view->assertSeeHtml('