Sha256: 2faeb663d7fb91254e0763d9c03f093cf919c4532598ee559cbe44c371c33516
Contents?: true
Size: 1.9 KB
Versions: 17
Compression:
Stored size: 1.9 KB
Contents
Rev.pullInto(this) 'Lipsum', 'StatelessTabs', 'Tabs', 'TabBlock', 'TabsAccordion'
Rev.registerExample 'Tabs & Such',
onTabChange: (e) ->
alert "Changing active tab to key `#{e.activeTab.key}`"
render: ->
<div>
<h3>{"<StatelessTabs>"}</h3>
<p>
StatelessTabs takes its marching orders about what content to show from props.
This particular instance will default to the second tab.
On tab click, it will show an alert but not switch content.
</p>
<StatelessTabs activeKey="two" onChange={(e) -> alert "I refuse to change!"}>
<TabBlock key="one" tab={<a href="#">One</a>}>
<Lipsum />
</TabBlock>
<TabBlock key="two" tab={<a href="#">Two</a>}>
<Lipsum p=2 />
</TabBlock>
</StatelessTabs>
<h3>{"<Tabs>"}</h3>
<Tabs onChange={@onTabChange}>
<TabBlock key="one" tab={<a href="#">One</a>}>
<Lipsum />
</TabBlock>
<TabBlock key="two" tab={<a href="#">Two</a>}>
<Lipsum p=2 />
</TabBlock>
<TabBlock key="three" tab={<a href="#">Three</a>}>
<Lipsum p=3 />
</TabBlock>
</Tabs>
<Tabs vertical activeKey="two">
<TabBlock key="one" tab={<a href="#">One</a>}>
<Lipsum />
</TabBlock>
<TabBlock key="two" tab={<a href="#">Two</a>}>
<Lipsum p=2 />
</TabBlock>
<TabBlock key="three" tab={<a href="#">Three</a>}>
<Lipsum p=3 />
</TabBlock>
</Tabs>
<h3>{"<TabsAccordion>"}</h3>
<TabsAccordion onChange={@onTabChange}>
<TabBlock key="one" tab={<a href="#">One</a>}>
<Lipsum />
</TabBlock>
<TabBlock key="two" tab={<a href="#">Two</a>}>
<Lipsum p=2 />
</TabBlock>
<TabBlock key="three" tab={<a href="#">Three</a>}>
<Lipsum p=3 />
</TabBlock>
</TabsAccordion>
</div>
Version data entries
17 entries across 17 versions & 1 rubygems