Sha256: bd567c981d93b32b0a26d8b0e96c5f0bc07193bf33a7f77ab55509350e7ce223

Contents?: true

Size: 580 Bytes

Versions: 669

Compression:

Stored size: 580 Bytes

Contents

import React, { useState } from 'react'
import { Toggle } from 'playbook-ui'

const ToggleCustom = () => {
  const [choice, setChoice] = useState(false)

  const handleOnChange = ({ target }) => {
    setChoice(target.value = !choice)
  }

  return (
    <>
      <Toggle
          checked={choice}
          size="sm"
      >
        <input
            className="my custom checkbox"
            name="custom checkbox"
            onChange={handleOnChange}
            type="checkbox"
            value="ABC"
        />
      </Toggle>
    </>
  )
}

export default ToggleCustom

Version data entries

669 entries across 669 versions & 2 rubygems

Version Path
playbook_ui_docs-14.9.0.pre.rc.2 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui-14.9.0.pre.rc.2 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui_docs-14.8.0.pre.alpha.revert3916revert3893PBNTR667railstypeaheadformintegration4567 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui-14.8.0.pre.alpha.revert3916revert3893PBNTR667railstypeaheadformintegration4567 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui_docs-14.8.0.pre.alpha.revert3916revert3893PBNTR667railstypeaheadformintegration4565 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui-14.8.0.pre.alpha.revert3916revert3893PBNTR667railstypeaheadformintegration4565 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui_docs-14.8.0.pre.alpha.PLAY1598floatinguiupgrade4563 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui-14.8.0.pre.alpha.PLAY1598floatinguiupgrade4563 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui_docs-14.8.0.pre.alpha.play1648heightglobalprops4559 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui-14.8.0.pre.alpha.play1648heightglobalprops4559 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui_docs-14.9.0.pre.rc.1 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui-14.9.0.pre.rc.1 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui_docs-14.8.0.pre.alpha.PLAY16254545 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui-14.8.0.pre.alpha.PLAY16254545 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui_docs-14.8.0.pre.alpha.PLAY1615movenegativetoleftofcurrencysign4543 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui-14.8.0.pre.alpha.PLAY1615movenegativetoleftofcurrencysign4543 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui_docs-14.8.0.pre.alpha.PLAY1615movenegativetoleftofcurrencysign4539 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui-14.8.0.pre.alpha.PLAY1615movenegativetoleftofcurrencysign4539 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui_docs-14.9.0.pre.rc.0 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx
playbook_ui-14.9.0.pre.rc.0 app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.jsx