Package Exports

mui-segmented-control

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

Readme

Material UI - Segmented Control

A MUI component made with hooks compatible with MUI >= 4.0.0

Demo

Install

npm install mui-segmented-control

Usage

import React, { useState } from 'react';
import SegmentedControl from 'mui-segmented-control';

function App() {
  const [value, setValue] = useState();

  return (
    <div>
      <SegmentedControl
        color="primary"
        options={[
          {
            label: 'First',
            value: 1
          },
          {
            label: 'Second',
            value: 2
          },
          {
            label: 'Third',
            value: 3
          },
          {
            label: 'Fourth',
            value: 4
          }
        ]}
        value={value}
        onChange={setValue}
      />
    </div>
  );
}

Props

Prop	Description	Default value
buttonProps	props injected to the button component	{}
classes	classes object for custom styling	{}
color	Selector color ['primary', 'secondary']	'primary'
onChange	callback to handle option click	() => null
options	options array of objects in the form: {label, value}	[]
value	selected value that will be shown in the component	null