@react-page-plugins/slate-table
Version:
react-page plugin for slate table
26 lines • 2.87 kB
JavaScript
"use strict";
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
return cooked;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.EditableReadOnly = exports.EditableEdit = void 0;
var styled_components_1 = __importDefault(require("styled-components"));
var slate_react_1 = require("slate-react");
var controlStyle = function (_a) {
var _b = _a.headerColor, headerColor = _b === void 0 ? '#fff' : _b, _c = _a.evenColor, evenColor = _c === void 0 ? '#fff' : _c, _d = _a.oddColor, oddColor = _d === void 0 ? '#fff' : _d, _e = _a.columnWidth, columnWidth = _e === void 0 ? [] : _e;
return "\n & .table {\n & .table-row:nth-of-type(even) {\n background-color: " + evenColor + ";\n }\n & .table-row:nth-of-type(odd) {\n background-color: " + oddColor + ";\n }\n & .table-row:first-child {\n background-color: " + headerColor + ";\n }\n & .table-row {\n width: 100% !important;\n " + columnWidth.map(function (w, n) {
return w
? "\n & .table-cell:nth-child(" + (n + 1) + ") { width:" + (n === 0 ? w : w - columnWidth[n - 1]) + "%; }\n "
: '';
}) + "\n }\n }\n";
};
var commonStyle = "\n & .table {\n width: 100%;\n background: #fff;\n margin: 1em 0em;\n border: 1px solid rgba(34, 36, 38, 0.15);\n -webkit-box-shadow: none;\n box-shadow: none;\n border-radius: 0.28571429rem;\n text-align: left;\n color: rgba(0, 0, 0, 0.87);\n font-size: 0.9em;\n flex-wrap: wrap;\n\n & .table-row {\n display: flex;\n\n & > .table-cell {\n padding: 0.78571429em 0.78571429em;\n border-top: 1px solid rgba(34, 36, 38, 0.1);\n border-left: 1px solid rgba(34, 36, 38, 0.1);\n border-right: 1px solid rgba(34, 36, 38, 0.1);\n box-sizing: border-box;\n // flex-grow: 1;\n // width: 10px;\n overflow: hidden;\n }\n }\n }\n";
exports.EditableEdit = styled_components_1.default(slate_react_1.Editable)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), commonStyle, controlStyle);
exports.EditableReadOnly = styled_components_1.default(slate_react_1.Editable)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), commonStyle, controlStyle);
exports.default = { EditableEdit: exports.EditableEdit, EditableReadOnly: exports.EditableReadOnly };
var templateObject_1, templateObject_2;
//# sourceMappingURL=StyledEditable.js.map