davidpiesse/nova-toggle

A Boolean Toggle Switch Field

Installs: 115 348

Dependents: 2

Suggesters: 0

Security: 0

Stars: 43

Watchers: 1

Forks: 9

Open Issues: 14

Language:Vue


README

A drop in replacement for the default Boolean field

Toggle In Action

Installation

Same as most other Nova Packages

composer require davidpiesse/nova-toggle

Usage

The Toggle has all the same options as the Boolean field so you can set the values to be stored in the Model.

use Davidpiesse\NovaToggle\Toggle;
Toggle::make('Active')
    ->trueValue('On')
    ->falseValue('Off')

In addition you can set visual parameters

Labels

You can show both, or each state label

Toggle::make('Active')
    ->showLabels() //Both labels
    ->showOnlyTrueLabel() //True label only
    ->showOnlyFalseLabel() //False label only

To set the text you can use either or both of the following. You must also set the visibility of the labels as described above.

Toggle::make('Active')
    ->showLabels()
    ->trueLabel('Tru Dat')
    ->falseLabel('Nah Dawg')

The defaults are 'True' and 'False'

Size

You can set the width and height. Setting the width will auto scale the height, but you can override this with ->height(). Defaults are 60 (px) and 26 (px)

Toggle::make('Active')
    ->width(80)
    ->height(45) //To override scaling

Colors

You can set wither or both of the background colours for the Toggle. By default True is the Nova 'Success Green' [ var(--success) ] and false is a Grey 60 [ var(--60) ]

Toggle::make('Active')
    ->trueColor('pink')
    ->falseColor('#fcfcfc')

Speed

You can set the animation speed in ms with

Toggle::make('Active')
    ->speed(500)

The default is 300ms