@focuson/form_components
Version:
Components that can be used by @focuson/forms
23 lines (22 loc) • 2.01 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.TableWithCheckboxInput = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const utils_1 = require("@focuson/utils");
const state_1 = require("@focuson/state");
function TableWithCheckboxInput({ id, order, state, copySelectedIndexTo, copySelectedItemTo }) {
const orderJsx = order.map(o => (0, jsx_runtime_1.jsx)("th", Object.assign({ id: `header-${0})}` }, { children: (0, utils_1.decamelize)(o.toString(), ' ') }), o.toString()));
const json = (0, utils_1.safeArray)(state.optJson());
const onClick = (row) => (e) => {
const indexTx = copySelectedIndexTo ? [[copySelectedIndexTo.optional, () => row]] : [];
const itemTx = copySelectedItemTo ? [[copySelectedItemTo.optional, () => json[row]]] : [];
state.massTransform((0, state_1.reasonFor)('Table', 'onClick', id, `selected row ${row}`))(...[...indexTx, ...itemTx]);
};
return (0, jsx_runtime_1.jsxs)("table", Object.assign({ id: id, className: "grid" }, { children: [(0, jsx_runtime_1.jsx)("thead", { children: (0, jsx_runtime_1.jsx)("tr", { children: orderJsx }) }), (0, jsx_runtime_1.jsx)("tbody", Object.assign({ className: "grid-sub" }, { children: json.map((row, i) => (0, jsx_runtime_1.jsx)("tr", Object.assign({ onClick: onClick(i) }, { children: order.map((o, colIndex) => {
const item = row[o];
return colIndex % 2 == 0
? (0, jsx_runtime_1.jsx)("td", { children: item }, o.toString())
: (0, jsx_runtime_1.jsx)("td", { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "checkbox-container" }, { children: [(0, jsx_runtime_1.jsx)("input", { type: "checkbox", value: item + "", checked: !!item === true }), (0, jsx_runtime_1.jsx)("span", { className: "checkmark" })] })) }, o.toString());
}) }), i)) }))] }));
}
exports.TableWithCheckboxInput = TableWithCheckboxInput;