How to use @pluralsight/ps-design-system-switch - 5 common examples

To help you get started, we’ve selected a few @pluralsight/ps-design-system-switch examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github pluralsight / design-system / packages / site / pages / components / switch.js View on Github external
<code>
        import Switch from '@pluralsight/ps-design-system-switch'
      </code>

      false,
            'shows a toggled-on switch'
          ]),
          PropTypes.row([
            'color',
            PropTypes.union(Switch.colors),
            null,
            <code>orange</code>,
            <span>
              track color (from <code>Switch.colors</code>)
            </span>
          ]),
          PropTypes.row([
            'disabled',
            'boolean',
            null,
            <code>false</code>,
            'standard input disable flag'
          ]),
          PropTypes.row([
            'error',
            'boolean',
github pluralsight / design-system / packages / site / pages / components / switch.js View on Github external
/&gt;

      In-app Example
      <p>
        There is no internal state for the switch component. The containing app
        will take care of how it maintains and changes the state of the Switch
        with the <code>checked</code> and <code>onClick</code> props.
      </p>
      

      Size
      <p>Switches come in two sizes.</p>
       `
github pluralsight / design-system / packages / site / pages / components / switch.js View on Github external
null,
            <code>false</code>,
            'error state flag'
          ]),
          PropTypes.row([
            'labelAlign',
            PropTypes.union(Switch.labelAligns),
            null,
            <code>right</code>,
            <span>
              label position (from <code>Switch.labelAligns</code>)
            </span>
          ]),
          PropTypes.row([
            'size',
            PropTypes.union(Switch.sizes),
            null,
            <code>large</code>,
            <span>
              switch size (from <code>Switch.sizes</code>)
            </span>
          ])
        ]}
      /&gt;

      In-app Example
      <p>
        There is no internal state for the switch component. The containing app
        will take care of how it maintains and changes the state of the Switch
        with the <code>checked</code> and <code>onClick</code> props.
      </p>
github pluralsight / design-system / packages / site / pages / components / switch.js View on Github external
'disabled',
            'boolean',
            null,
            <code>false</code>,
            'standard input disable flag'
          ]),
          PropTypes.row([
            'error',
            'boolean',
            null,
            <code>false</code>,
            'error state flag'
          ]),
          PropTypes.row([
            'labelAlign',
            PropTypes.union(Switch.labelAligns),
            null,
            <code>right</code>,
            <span>
              label position (from <code>Switch.labelAligns</code>)
            </span>
          ]),
          PropTypes.row([
            'size',
            PropTypes.union(Switch.sizes),
            null,
            <code>large</code>,
            <span>
              switch size (from <code>Switch.sizes</code>)
            </span>
          ])
        ]}

@pluralsight/ps-design-system-switch

Design System component for switch ui

Apache-2.0
Latest version published 2 years ago

Package Health Score

48 / 100
Full package analysis

Similar packages