Checkbox

A checkbox input for boolean selection.

Examples

Basic Checkbox

blade

<x-plume::form 
    formData="{ 'remember_me': false }">
    <x-plume::form.checkbox name="remember_me" model="remember_me">
        Remember Me
    </x-plume::form.checkbox>
</x-plume::form>

Checkbox Group

Group multiple checkboxes together with a shared name and model.

blade

<x-plume::form 
    formData="{ 'notifications': [] }">
    <x-plume::form.group label="Notifications" name="notifications" model="notifications">
        <x-plume::form.checkbox value="email">Email</x-plume::form.checkbox>
        <x-plume::form.checkbox value="sms">SMS</x-plume::form.checkbox>
        <x-plume::form.checkbox value="push">Push</x-plume::form.checkbox>
    </x-plume::form.group>
</x-plume::form>

Prop	Type	Default	Description
label	string	null	The label text for the checkbox.
name	string	null	HTML name attribute.
id	string	null	HTML id attribute. Auto-generated if not provided.
model	string	null	AlpineJS model name for two-way binding.
value	string	''	The value submitted when the checkbox is checked.
checked	bool	false	Whether the checkbox is initially checked.

Usage

blade

<x-plume::form >
    <!-- Single -->
    <x-plume::form.checkbox model="accept">I accept</x-plume::form.checkbox>

    <!-- Group -->
    <x-plume::form.group label="Interests" model="interests">
        <x-plume::form.checkbox value="code">Coding</x-plume::form.checkbox>
        <x-plume::form.checkbox value="design">Design</x-plume::form.checkbox>
    </x-plume::form.group>
</x-plume::form>