bakerkretzmar / nova-settings-tool

Laravel Nova tool to view and edit application settings.
MIT License
167 stars 32 forks source link

Passing css classes through to components #60

Open tnorthcutt opened 1 week ago

tnorthcutt commented 1 week ago

It seems like it would be really handy to be able to pass CSS classes through to components. E.g. in nova-settings-tool.php being able to do this:

[
    'key' => 'setting_1',
    'label' => 'Custom delay setting',
    'type' => 'select',
    'options' => [
        '0' => 'No Delay',
        '7' => '1 Week',
        '14' => '2 Weeks',
        '21' => '3 Weeks',
        '28' => '4 Weeks',
    ],
    'classes' => ['form-input', 'whatever-other-classes'],
    'panel' => 'Customers',
];

And then in SelectSetting.vue (for this example) having (note the :class line added):

<select
    :id="setting.key"
    :value="setting.value"
    @change="
        $emit('update', {
            key: setting.key,
            value: $event.target.value,
        })
    "
    class="w-full block form-control form-select form-select-bordered"
    :class="setting.classes"
>
    <option value="" selected>{{ setting.placeholder || __('Choose an option') }}</option>
    <option v-for="(label, option) in setting.options" :key="option" :value="option">
        {{ __(label) }}
    </option>
</select>

But, maybe there's a reason for not doing this that I haven't thought of. Is this something you'd be open to adding support for?

tnorthcutt commented 1 week ago

FWIW, in the meantime I forked this for our internal use, made the change, and it works great. Happy to PR the change if you'd like.