0.0.1 • Published 11 months ago

@congritta-ui/tabs v0.0.1

Weekly downloads
-
License
-
Repository
github
Last release
11 months ago

@congritta-ui/tabs

This is tabs React component and part of Congritta UI

How to install

  1. Install @congritta-ui/base if you didn't it yet. (More info at: http://ui.congritta.com/docs/base);
  2. Install @congritta-ui/tabs;

Add

import DatePicker from '@congritta-ui/tabs';

into your code

How to use

Example:

export default MyComponentWidthTabs() {
  const [value, setValue] = useState('apples')

  return (
    <Tabs activeTab={value} onChange={setValue} tabs={[
      {value: 'apples', element: 'Apples'},
      {value: 'pears', element: 'Pears'},
      {value: 'oranges', element: 'Oranges'},
      {value: 'pineapples', element: 'Pineapples'},
      {value: 'cherries', element: 'Cherries'},
      {value: 'melons', element: 'Melons'},
    ]} />
  )
}

Props

Prop nameDescriptionIs RequiredDefault value
tabsArray of objects. value propetry is unique value key (like value in regular HTML), element property is a string or JSX component that is visible in tabs listtrue
activeTabActive tab valuetrue
onChangeFunction that executes when user clicks on inactive tabtrue
tabsWrapperClassNameClass name for tabs wrapper for adding additional stylesfalse
tabClassNameClass name for a tab for adding additional stylesfalse