Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

🔹 Description

To follow

...

A toggle key is a key that is used to turn a function on or off, or to switch between two functions.

...

🔹System Dependencies

🔹 Installation

The package can be installed via npm:

Code Block
languagejs
npm install empower-inputs --save

🔹 Standard Toggle

...

Configuration

Code Block
languagejs
import { InputSelectionHandler} from 'empower-inputs';

let [formElement, setFormElement] = useState<IState['formElement']>useState({
sampleToggleButton: {
      id: 'sampleToggleButton',
      type: 'toggle-button',
      placeholder: 'Please select option',
      value: '',
      disabled: false,
      required: true,
      options: [
          {
            label: "Approve",
            value: "APPROVED",
          },
          {
            label: "Reject",
            value: "REJECTED",
          }
        ]
    }
    
});

..............

return (
    <>
      <h4>TOGGLE BUTTON</h4>
      <InputSelectionHandler
        config={formElement.sampleToggleButton}
        customClass="toggle-button-custom-class"
        onChanged={(e: any) => inputChangedHandler(e, 'sampleToggleButton')}
      />
    </>
  )

🔹  Properties

Parent Parameter

Sub Parameter

Data Type

Constraint

config

JSON Object

Required

id

String

Required

type

String

Required

label

String

Optional

value

Array Object

Required

placeholder

String

Optional

readOnly

Boolean

Optional

required

Boolean

Boolean

disabled

Boolean

Boolean

customClass

String

Optional

onChanged

Event Method

Required

🔹 References

Repository Link: https://gitlab.com/empowerteams/empower-inputs.git

...