design-system-govbr-rnp
Version:
## Padrão Digital de Governo - React Biblioteca de componentes React que implementa o [Padrão Visual digital do governo](https://www.gov.br/ds/). O objetivo da biblioteca é facilitar a implementação e promover a padronização das interfaces de sistemas do
123 lines (122 loc) • 7.43 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.Irregular2 = exports.Irregular1 = exports.Default = void 0;
var _react = _interopRequireDefault(require("react"));
var _Table = _interopRequireDefault(require("./Table"));
var _Pagination = _interopRequireDefault(require("../Pagination/Pagination"));
var _TableRowContext = _interopRequireDefault(require("./TableRowContext"));
var _TableDefault = _interopRequireDefault(require("./TableDefault"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _default = {
title: "Components/Table",
component: _Table.default,
argTypes: {
type: {
table: {
disable: true
}
},
density: {
name: "Density",
type: {
name: "string",
required: true
},
description: "Densidade",
table: {
type: {
summary: "string"
},
defaultValue: {
summary: "small"
}
},
control: {
type: "select",
options: ["low", "medium", "high"]
}
},
border: {
name: "Border",
type: {
name: "boolean"
},
description: "Borda",
table: {
type: {
summary: "string"
},
defaultValue: {
summary: "small"
}
},
control: {
type: "select",
options: [true, false]
}
}
}
};
exports.default = _default;
var TemplateIrregular1 = function TemplateIrregular1(args) {
return /*#__PURE__*/_react.default.createElement(_Table.default, args, /*#__PURE__*/_react.default.createElement("thead", null, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("th", null, "Poster name"), /*#__PURE__*/_react.default.createElement("th", null, "Color"), /*#__PURE__*/_react.default.createElement("th", {
colspan: "3"
}, "Sizes available"))), /*#__PURE__*/_react.default.createElement("tbody", null, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("th", {
rowSpan: "3"
}, "Zodiac"), /*#__PURE__*/_react.default.createElement("td", null, "Full color"), /*#__PURE__*/_react.default.createElement("td", null, "A2"), /*#__PURE__*/_react.default.createElement("td", null, "A3"), /*#__PURE__*/_react.default.createElement("td", null, "A4")), /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", null, "Black and white"), /*#__PURE__*/_react.default.createElement("td", null, "A1"), /*#__PURE__*/_react.default.createElement("td", null, "A2"), /*#__PURE__*/_react.default.createElement("td", null, "A3")), /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", null, "Sepia"), /*#__PURE__*/_react.default.createElement("td", null, "A3"), /*#__PURE__*/_react.default.createElement("td", null, "A4"), /*#__PURE__*/_react.default.createElement("td", null, "A5"))), /*#__PURE__*/_react.default.createElement("tbody", null, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("th", {
rowSpan: "2"
}, "Angels"), /*#__PURE__*/_react.default.createElement("td", null, "Black and white"), /*#__PURE__*/_react.default.createElement("td", null, "A1"), /*#__PURE__*/_react.default.createElement("td", null, "A3"), /*#__PURE__*/_react.default.createElement("td", null, "A4")), /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", null, "Sepia"), /*#__PURE__*/_react.default.createElement("td", null, "A2"), /*#__PURE__*/_react.default.createElement("td", null, "A3"), /*#__PURE__*/_react.default.createElement("td", null, "A5"))));
};
var Irregular1 = TemplateIrregular1.bind({});
exports.Irregular1 = Irregular1;
Irregular1.storyName = "Tabela irregular 1";
Irregular1.args = {
border: true
};
Irregular1.parameters = {
controls: {
exclude: ["Density"]
}
};
var TemplateIrregular2 = function TemplateIrregular2(args) {
return /*#__PURE__*/_react.default.createElement(_Table.default, args, /*#__PURE__*/_react.default.createElement("thead", null, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("th", {
rowspan: "2"
}, "Name"), /*#__PURE__*/_react.default.createElement("th", {
colspan: "2"
}, "HR Information"), /*#__PURE__*/_react.default.createElement("th", {
colspan: "3"
}, "Contact")), /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("th", null, "Position"), /*#__PURE__*/_react.default.createElement("th", null, "Salary"), /*#__PURE__*/_react.default.createElement("th", null, "Office"), /*#__PURE__*/_react.default.createElement("th", null, "Extn."), /*#__PURE__*/_react.default.createElement("th", null, "E-mail"))), /*#__PURE__*/_react.default.createElement("tbody", null, /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", null, "Tiger Nixon"), /*#__PURE__*/_react.default.createElement("td", null, "System Architect"), /*#__PURE__*/_react.default.createElement("td", null, "$320,800"), /*#__PURE__*/_react.default.createElement("td", null, "Edinburgh"), /*#__PURE__*/_react.default.createElement("td", null, "5421"), /*#__PURE__*/_react.default.createElement("td", null, "t.nixon@datatables.net")), /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", null, "Garrett Winters"), /*#__PURE__*/_react.default.createElement("td", null, "Accountant"), /*#__PURE__*/_react.default.createElement("td", null, "$170,750"), /*#__PURE__*/_react.default.createElement("td", null, "Tokyo"), /*#__PURE__*/_react.default.createElement("td", null, "8422"), /*#__PURE__*/_react.default.createElement("td", null, "g.winters@datatables.net")), /*#__PURE__*/_react.default.createElement("tr", null, /*#__PURE__*/_react.default.createElement("td", null, "Ashton Cox"), /*#__PURE__*/_react.default.createElement("td", null, "Junior Technical Author"), /*#__PURE__*/_react.default.createElement("td", null, "$86,000"), /*#__PURE__*/_react.default.createElement("td", null, "San Francisco"), /*#__PURE__*/_react.default.createElement("td", null, "1562"), /*#__PURE__*/_react.default.createElement("td", null, "a.cox@datatables.net"))));
};
var Irregular2 = TemplateIrregular2.bind({});
exports.Irregular2 = Irregular2;
Irregular2.storyName = "Tabela irregular 2";
Irregular2.args = {
border: true
};
Irregular2.parameters = {
controls: {
exclude: ["Density"]
}
};
var TemplateDefault = function TemplateDefault(args) {
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_TableRowContext.default, {
defaultTab: []
}, /*#__PURE__*/_react.default.createElement(_Table.default, args, /*#__PURE__*/_react.default.createElement(_TableDefault.default, null))), /*#__PURE__*/_react.default.createElement(_Pagination.default, {
totalCount: 100,
currentPage: 1,
pageSize: 10,
dark: true,
type: "context",
optionsToSelect: [10, 20, 30],
onPageChange: function onPageChange() {}
}));
};
var Default = TemplateDefault.bind({});
exports.Default = Default;
Default.storyName = "Tabela padrão";
Default.args = {
border: false,
density: "medium"
};