npm

Bring the best of OSS JavaScript development to your projects with npm Orgs - private packages & team management tools.Learn more »

radon

1.3.1 • Public • Published

Radon Toolkit

A small, React UI primitive toolkit.

The Radon Family

Install

$ npm install --save radon # OR 
$ yarn add radon

Usage

UMD

We provide UMD bundles at:

  • ./dist/radon.js: Development build
  • ./dist/radon.min.js: Production build

Both require that you have external dependencies available on window/global of:

  • React
  • ReactDOM

Libraries

We provide ESM and CommonJS versions of the Radon Toolkit. Your bundling tool should pick up the appropriate one automagically from our entries for package.json:main (CommonJS) and package.json:module (ESM).

Select

import React from 'react';
import ReactDOM from 'react-dom';
import { Select } from 'radon';
 
class App extends React.Component {
  render() {
    return (
      <div>
        <h3>Basic</h3>
        <Select selectName="foo">
          <Select.Option value="who">Who</Select.Option>
          <Select.Option value="what">What</Select.Option>
        </Select>
      </div>
    );
  }
}
 
ReactDOM.render(<App />, document.getElementById('root'));

Typeahead

import React from 'react';
import ReactDOM from 'react-dom';
import { Typeahead } from 'radon';
 
const CAR_BRANDS = [
  'Alfa Romeo',
  'Audi',
  'Bmw',
  'Chevrolet',
  'Chrystler',
  'Dodge',
  'Ferrari',
  'Fiat',
  'Ford',
  'Honda',
  'Hyundai',
  'Jaguar',
  'Jeep',
  'Kia',
  'Mazda',
  'Mercedez-Benz',
  'Mitsubish',
  'Nissan',
  'Peugeot',
  'Porsche',
  'Subaru',
  'Suzuki',
  'Toyota',
  'Volkswagen'
];
 
class App extends React.Component {
  render() {
    return (
      <div>
        <h3>Car Brands</h3>
        <Typeahead list={CAR_BRANDS} inputComponent={<input />}/>
      </div>
    );
  }
}
 
ReactDOM.render(<App />, document.getElementById('root'));

Keywords

none

install

npm i radon

Downloadsweekly downloads

37

version

1.3.1

license

MIT

last publish

collaborators

  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
  • avatar
Report a vulnerability