Radon Toolkit
A small, React UI primitive toolkit.
The Radon Family
radon-select
: React select box replacement componentradon-typeahead
: React typeahead component
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'; Component { return <div> <h3>Basic</h3> <Select ="foo"> <Select.Option ="who">Who</Select.Option> <Select.Option ="what">What</Select.Option> </Select> </div> ; } ReactDOM;
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'; Component { return <div> <h3>Car Brands</h3> <Typeahead = =/> </div> ; } ReactDOM;