davedevx / antd-extended-select

Ability to add options with explanations to Ant Design's Select

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Antd Extended Select

This is an extension to Ant Design's Select.
You can add descriptions to each Option.

Install

git clone git@github.com:daveedx/antd-extended-select.git
cd antd-extended-select.git
yarn install
yarn start

Usage

const options = [
  {
    value: 'option1',
    title: 'Option 1',
    description: 'This is a description for Option 1',
    // here you can add any of the original props of Option:
    // https://ant.design/components/select/#Option-props
    label: 'Label for Option 1',
  },
  {
    value: 'option2',
    title: 'Option 2',
    description: 'This is a description for Option 2',
    // here you can add any of the original props of Option:
    // https://ant.design/components/select/#Option-props
    label: 'Label for Option 2',
  },
]

<AntdExtendedSelect
  options={options}
  // here you can add any of the original props of Select:
  // https://ant.design/components/select/#Select-props
  defaultValue="option2"
  style={{ width: 200 }}
/>

Footnote

This project was bootstrapped with Create React App, wired with React App Rewired and its LESS package.

More info about Create React App here.

What is React App Rewired in nutshell

Tweak the create-react-app webpack config(s) without using 'eject' and without creating a fork of the react-scripts.

All the benefits of create-react-app without the limitations of "no config". You can add plugins, loaders whatever you need.

More info

About

Ability to add options with explanations to Ant Design's Select


Languages

Language:JavaScript 87.7%Language:HTML 6.5%Language:CSS 5.8%