@cimpress/react-components
Version:
React components to support the MCP styleguide
55 lines • 2.09 kB
JavaScript
import React, { Component } from 'react';
import { TabCard, Button } from '@cimpress/react-components';
export default class TabCardDemo extends Component {
constructor() {
super(...arguments);
Object.defineProperty(this, "state", {
enumerable: true,
configurable: true,
writable: true,
value: { selectedIndex: 1 }
});
Object.defineProperty(this, "setLastTab", {
enumerable: true,
configurable: true,
writable: true,
value: () => this.setState({ selectedIndex: 2 })
});
Object.defineProperty(this, "updateSelectedTab", {
enumerable: true,
configurable: true,
writable: true,
value: (e, selectedKey) => this.setState({ selectedIndex: selectedKey })
});
}
render() {
const tabBody = React.createElement("div", null, "Lorem ipsum dolor sit amet");
const tabBody2 = React.createElement("div", null, "consectetur adipiscing elit");
const tabBody3 = React.createElement("div", null, "sed do eiusmod tempor");
const footer2 = React.createElement("div", null, " I am a footer ");
const footer3 = React.createElement("div", null, " I am a different footer ");
const tabs = [
{
name: 'Tab 1',
block: tabBody,
href: '#',
},
{
name: 'Default SelectedTab',
block: tabBody2,
footer: footer2,
href: '#',
},
{
name: 'Tab 3',
block: tabBody3,
footer: footer3,
href: '#',
},
];
return (React.createElement("div", null,
React.createElement(TabCard, { tabs: tabs, selectedIndex: this.state.selectedIndex, onSelect: this.updateSelectedTab }),
React.createElement(Button, { onClick: this.setLastTab }, "Select last tab")));
}
}
//# sourceMappingURL=tabcard.js.map