JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 1
  • Score
    100M100P100Q86930F
  • License MIT

Customizable accessible radio button elements in a circular layout suitable for pie chart visualization in React.

Package Exports

  • react-radio-pie
  • react-radio-pie/src/ReactRadioPie/index.tsx

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 (react-radio-pie) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

React Radio Pie (react-radio-pie)

npm version

Customizable accessible radio button elements in a circular layout suitable for pie chart visualization in React.

Installation

yarn

yarn add react-radio-pie

npm

npm install react-radio-pie

pnpm

pnpm install react-radio-pie

Basic example

import ReactRadioPie, {
    ReactRadioPieProvider,
    ReactRadioPieCSS,
} from 'react-radio-pie';

// load css file
ReactRadioPieCSS();

const choices = [
    {
        id: 'f21a4d9c',
        content: 'Never',
    },
    {
        id: '37e1dfe9',
        content: 'Rarely (once a month or less)',
    },
    {
        id: '9dcbf383',
        content: 'Occasionally (a few times a month)',
    },
    {
        id: 'a550db7f',
        content: 'Sometimes (once a week or so)',
    },
    {
        id: '3d6bba3a',
        content: 'Often (a few times a week)',
    },
    {
        id: '2b2d3b03',
        content: 'Very often (almost every day)',
    },
];

export default function App() {
    return (
        <ReactRadioPieProvider>
            <ReactRadioPie id='exampleRadioPie' choices={choices} />
        </ReactRadioPieProvider>
    );
}

More examples

Storybook

License

MIT