DocSpace-buildtools/web/ASC.Web.Storybook/stories/tabs-container
2019-08-06 18:46:16 +03:00
..
index.stories.js Web: Components: Added property onSelect, renamed tabs to component tabs 2019-08-06 18:46:16 +03:00
README.md Web: Components: Added property onSelect, renamed tabs to component tabs 2019-08-06 18:46:16 +03:00

TabContainer

Description

Custom Tabs menu

Usage

import { TabContainer } from 'asc-web-components';

const array_items = [
    {
        id: "0",
        title: <label> Title1 </label>,
        content:
            <div >
                <div> <button>BUTTON</button> </div>
                <div> <button>BUTTON</button> </div>
                <div> <button>BUTTON</button> </div>
            </div>
    },
    {
        id: "1",
        title: <label> Title2 </label>,
        content:
            <div >
                <div> <label>LABEL</label> </div>
                <div> <label>LABEL</label> </div>
                <div> <label>LABEL</label> </div>
            </div>
    },
    {
        id: "2",
        title: <label> Title3 </label>,
        content:
            <div>
                <div> <input></input> </div>
                <div> <input></input> </div>
                <div> <input></input> </div>
            </div>
    }
];

<TabContainer>{array_items}</TabContainer>

TabContainer Properties

Props Type Required Values Default Description
isDisabled boolean - - - Disable the TabContainer
onSelect func - - - Triggered when a title is selected

Array Items Properties

Props Type Required Values Default Description
id string true - - Index of object array
title string true - - Tabs title
content object true - - Content in Tab