@salesforce/design-system-react
Version:
Salesforce Lightning Design System for React
95 lines (94 loc) • 2.88 kB
JavaScript
import React from 'react';
import createReactClass from 'create-react-class';
import DataTable from "../../../../components/data-table"; // `~` is replaced with design-system-react at runtime
import DataTableColumn from "../../../../components/data-table/column";
import DataTableCell from "../../../../components/data-table/cell";
import IconSettings from "../../../../components/icon-settings";
var columns = [React.createElement(DataTableColumn, {
key: "opportunity",
label: "Opportunity Name",
property: "opportunityName",
width: "6em"
}), React.createElement(DataTableColumn, {
key: "account-name",
label: "Account Name",
property: "accountName",
width: "5em"
}), React.createElement(DataTableColumn, {
key: "close-date",
label: "Close Date",
property: "closeDate",
width: "5em"
}), React.createElement(DataTableColumn, {
key: "stage",
label: "Stage",
property: "stage",
width: "5em"
}), React.createElement(DataTableColumn, {
key: "confidence",
label: "Confidence",
property: "confidence",
width: "5em"
}), React.createElement(DataTableColumn, {
key: "amount",
label: "Amount",
property: "amount",
width: "5em"
}), React.createElement(DataTableColumn, {
key: "contact",
label: "Contact",
property: "contact",
width: "6em"
})];
var Example = createReactClass({
displayName: 'DataTableExample',
getInitialState: function getInitialState() {
return {
items: [{
id: '8IKZHZZV80',
opportunityName: 'Cloudhub',
accountName: 'Cloudhub',
closeDate: '4/14/2015',
stage: 'Prospecting',
confidence: '20%',
amount: '$25k',
contact: 'jrogers@cloudhub.com'
}, {
id: '5GJOOOPWU7',
opportunityName: 'Cloudhub + Anypoint Connectors',
accountName: 'Cloudhub',
closeDate: '4/14/2015',
stage: 'Prospecting',
confidence: '20%',
amount: '$25k',
contact: 'jrogers@cloudhub.com'
}, {
id: '8IKZHZZV81',
opportunityName: 'Cloudhub',
accountName: 'Cloudhub',
closeDate: '4/14/2015',
stage: 'Prospecting',
confidence: '20%',
amount: '$25k',
contact: 'jrogers@cloudhub.com'
}]
};
},
render: function render() {
return React.createElement(IconSettings, {
iconPath: "/assets/icons"
}, React.createElement("div", {
style: {
overflow: 'auto'
}
}, React.createElement("h3", {
className: "slds-text-heading--medium slds-m-vertical--medium"
}, "Basic Fixed Layout"), React.createElement(DataTable, {
items: this.state.items,
id: "DataTableExample-1-default",
fixedLayout: true
}, columns)));
}
});
export default Example; // export is replaced with `ReactDOM.render(<Example />, mountNode);` at runtime
//# sourceMappingURL=basic-fixed-layout.js.map