area17 / blast

Storybook for Laravel Blade 🚀
https://dev.to/area17/getting-started-with-blast-storybook-for-laravel-blade-c5c
Apache License 2.0
268 stars 39 forks source link

How to display a component that uses the $errors variable in Story with explicit passing? #77

Open suginoki45 opened 1 year ago

suginoki45 commented 1 year ago

Hi! Please excuse my poor English. Thank you for the great library.

Let me ask a question as there does not seem to be the same issue in the past.

Environment

My environment is:

M1 Macbook Air macOS 12.2.1 Blast v1.8

Description

I have a component that changes its style when an error occurs, like this:

@props([
    'name' => '',
    'errors' => null,
])

<input {{ $attributes->class(['!border-rose-600' => $errors->has($name)])
    ->merge([
        'type' => 'text',
        'name' => $name,
        'class' => 'w-full !text-base py-3 px-5 border border-solid border-transparent focus:outline-none focus:border-primary-400 rounded-xl',
    ]) }} />

I want to display this component in Storybook, but since the $errors variable is undefined. I tried to override the has() method explicitly by using storybook or php directive, but you received an error message and could not achieve your goal.

@storybook([
    'args' => [
        'errors' => (object) [
            'has' => function () {
                return true;
            }
        ]
    ]
])

<x-input :errors="$errors" placeholder="Enter text here"></x-input>

// error message -> Call to a member function has() on array
@php
    $errors = (object) [
        'has' => function () {
            return true;
        },
    ];
@endphp

<x-input :errors="$errors" placeholder="Enter text here"></x-input>

// error message -> Call to undefined method stdClass::has()

Is there a way to display this component in Story?