JSPM

  • Created
  • Published
  • Downloads 3
  • Score
    100M100P100Q55209F
  • License MIT

Checkbox.

Package Exports

  • @real-system/checkbox
  • @real-system/checkbox/lib/index.js
  • @real-system/checkbox/lib/index.mjs

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@real-system/checkbox) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@real-system/checkbox

Checkbox.

npm version

Installation

# install peer dependencies

# npm
$ npm install react react-dom @real-system/a11y-library @real-system/state-library @real-system/styled-library @real-system/typography @real-system/utils-library @real-system/elements-primitive
# yarn
$ yarn add react react-dom @real-system/a11y-library @real-system/state-library @real-system/styled-library @real-system/typography @real-system/utils-library @real-system/elements-primitive

# install checkbox

# npm
$ npm install @real-system/checkbox
# yarn
$ yarn add @real-system/checkbox

Code Example

import { Checkbox, CheckboxGroup } from '@real-system/checkbox';

const MyCheckbox = (args) => (
  <Checkbox
    helpText="Determines if the user has permission to add, edit and delete other users"
    {...args}
  />
);

const MyCheckboxGroup = () => {
  return (
    <CheckboxGroup
      label="What engineering level is the new team member?"
      defaultValue={['associate']}
      helpText="Select at least 1 level for the new engineer"
      {...args}>
      <CheckboxGroup.Item value="architect">Architect</CheckboxGroup.Item>
      <CheckboxGroup.Item value="principle">Principle</CheckboxGroup.Item>
      <CheckboxGroup.Item value="staff">Staff</CheckboxGroup.Item>
      <CheckboxGroup.Item value="senior" disabled>
        Senior
      </CheckboxGroup.Item>
      <CheckboxGroup.Item value="mid" disabled>
        Mid
      </CheckboxGroup.Item>
      <CheckboxGroup.Item value="associate" disabled>
        Associate
      </CheckboxGroup.Item>
    </CheckboxGroup>
  );
};