diff options
author | Israel Lavi <israel.lavi@intl.att.com> | 2018-05-21 17:42:00 +0300 |
---|---|---|
committer | Israel Lavi <il0695@att.com> | 2018-05-21 17:52:01 +0300 |
commit | 1994c98063c27a41797dec01f2ca9fcbe33ceab0 (patch) | |
tree | f30beeaf15a8358f6da78fdd74bcbda74bd334f8 /stories/react/Tabs.stories.js | |
parent | 4749f4631426fcbe29ed98cef8f24cab18b501d0 (diff) |
init commit onap ui
Change-Id: I1dace78817dbba752c550c182dfea118b4a38646
Issue-ID: SDC-1350
Signed-off-by: Israel Lavi <il0695@att.com>
Diffstat (limited to 'stories/react/Tabs.stories.js')
-rw-r--r-- | stories/react/Tabs.stories.js | 48 |
1 files changed, 48 insertions, 0 deletions
diff --git a/stories/react/Tabs.stories.js b/stories/react/Tabs.stories.js new file mode 100644 index 0000000..74f163c --- /dev/null +++ b/stories/react/Tabs.stories.js @@ -0,0 +1,48 @@ +import React from 'react'; +import Examples from './utils/Examples.js'; +import {default as TabsComp} from '../../src/react/Tabs.js'; +import Tab from '../../src/react/Tab.js'; +import HTMLTabsHeader from '../../components/tabs/tabs-header.html'; +import HTMLTabsDisabled from '../../components/tabs/tabs-disabled.html'; +import HTMLTabsMenu from '../../components/tabs/tabs-menu.html'; + +let examples = { + 'Menu Tabs': { + jsx: <TabsComp type='menu' activeTab='1' onTabClick={(tabId) => {console.log(tabId);}}> + <Tab title='tab 1' tabId='1'> + <div>This is the active tab content</div> + </Tab> + <Tab title='tab 2' tabId='2' /> + <Tab title='tab 3' tabId='3' /> + </TabsComp>, + html: HTMLTabsMenu + }, + 'Header Tabs': { + jsx: <TabsComp type='header' activeTab='1' onTabClick={(tabId) => {console.log(tabId);}}> + <Tab title='tab 1' tabId='1'> + <div>This is the active tab content</div> + </Tab> + <Tab title='tab 2' tabId='2' /> + <Tab title='tab 3' tabId='3' /> + </TabsComp>, + html: HTMLTabsHeader + }, + 'Disabled Tabs': { + jsx: ( + <TabsComp type='header' activeTab='1' onTabClick={(tabId) => {console.log(tabId);}}> + <Tab title='tab 1' tabId='1'> + <div>This is the active tab content</div> + </Tab> + <Tab title='tab 2' tabId='2' disabled/> + <Tab title='tab 3' tabId='3' disabled/> + </TabsComp> + ), + html: HTMLTabsDisabled + } +}; + +const Tabs = () => ( + <Examples examples={examples} /> +); + +export default Tabs; |