UNPKG

@etsoo/materialui

Version:

TypeScript Material-UI Implementation

154 lines (153 loc) 6.19 kB
"use strict"; var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; Object.defineProperty(exports, "__esModule", { value: true }); exports.CustomFieldUtils = void 0; const jsx_runtime_1 = require("react/jsx-runtime"); const react_1 = __importDefault(require("react")); const FieldCheckbox_1 = require("./FieldCheckbox"); const FieldAmountLabel_1 = require("./FieldAmountLabel"); const FieldDateInput_1 = require("./FieldDateInput"); const FieldDivider_1 = require("./FieldDivider"); const FieldCombobox_1 = require("./FieldCombobox"); const FieldInput_1 = require("./FieldInput"); const FieldLabel_1 = require("./FieldLabel"); const FieldNumberInput_1 = require("./FieldNumberInput"); const FieldTexarea_1 = require("./FieldTexarea"); const FieldJson_1 = require("./FieldJson"); const FieldRadio_1 = require("./FieldRadio"); const FieldSelect_1 = require("./FieldSelect"); const FieldSwitch_1 = require("./FieldSwitch"); const Grid_1 = __importDefault(require("@mui/material/Grid")); const Typography_1 = __importDefault(require("@mui/material/Typography")); /** * Custom field utilities */ var CustomFieldUtils; (function (CustomFieldUtils) { /** * Custom field creators */ CustomFieldUtils.customFieldCreators = { amountlabel: FieldAmountLabel_1.FieldAmountLabel, checkbox: FieldCheckbox_1.FieldCheckbox, combobox: FieldCombobox_1.FieldCombobox, date: FieldDateInput_1.FieldDateInput, divider: FieldDivider_1.FieldDivider, input: FieldInput_1.FieldInput, json: FieldJson_1.FieldJson, label: FieldLabel_1.FieldLabel, number: FieldNumberInput_1.FieldNumberInput, radio: FieldRadio_1.FieldRadio, select: FieldSelect_1.FieldSelect, switch: FieldSwitch_1.FieldSwitch, textarea: FieldTexarea_1.FieldTexarea }; /** * Create layout * @param fields Fields * @param collections Ref collections * @param getValue Get default value callback * @param onChange Callback for value change * @param globalCallback Global label callback, can be repeated * @param fieldCalback Field callback * @returns */ function create(fields, collections, getValue, onChange, globalCallback, fieldCalback) { return fields.map((field, index) => { // Global callback for labels if (globalCallback) { if (field.label) field.label = globalCallback(field.label); if (field.helperText) field.helperText = globalCallback(field.helperText); if (field.mainSlotProps) updateProperties(field.mainSlotProps, globalCallback); } // Field callback for each field if (fieldCalback) fieldCalback(field); const creator = CustomFieldUtils.customFieldCreators[field.type]; if (creator == null) { return ((0, jsx_runtime_1.jsx)(Grid_1.default, { size: transformSpace(field.space), ...field.gridItemProps, children: `Type ${field.type} is not supported currently` }, index)); } const Creator = creator; const mref = react_1.default.createRef(); let ui = ((0, jsx_runtime_1.jsx)(Creator, { field: field, mref: mref, onChange: onChange, defaultValue: getValue(field) })); const name = field.name; if (name) { if (collections[name] == null) { collections[name] = [mref, field]; } else { ui = `Duplicate custom field ${name}`; } } return ((0, jsx_runtime_1.jsx)(Grid_1.default, { size: transformSpace(field.space), ...field.gridItemProps, children: ui }, name ?? index)); }); } CustomFieldUtils.create = create; /** * Create multiline label * @param label Original label * @param props Properties * @returns Result */ function createMultilineLabel(label, props) { return label?.split("\n").map((line, index) => ((0, jsx_runtime_1.jsx)(Typography_1.default, { component: "div", ...props, children: line }, index))); } CustomFieldUtils.createMultilineLabel = createMultilineLabel; /** * Transform custom field space * @param space Space * @returns Result */ function transformSpace(space) { const size = space === "full" ? { xs: 12 } : space === "quater" ? { sm: 12, md: 6, lg: 3 } : space === "five" ? { sm: 12, md: 5 } : space === "seven" ? { sm: 12, md: 7 } : space === "half1" ? { xs: 12, sm: 6 } : { sm: 12, md: 6 }; return size; } CustomFieldUtils.transformSpace = transformSpace; /** * Update ref options * @param fields Fields * @param callback Callback */ function updateOptions(fields, callback) { fields.forEach((field) => { if (field.refs == null || field.refs.length < 2) return; const key = field.refs[0]; const ids = field.refs.slice(1); field.options = callback(key, ids); }); } CustomFieldUtils.updateOptions = updateOptions; /** * Update properties * @param input Input object * @param globalCallback Global callback */ function updateProperties(input, globalCallback) { for (const key in input) { const value = Reflect.get(input, key); if (typeof value === "string") { Reflect.set(input, key, globalCallback(value)); } else if (typeof value === "object" && value != null) { updateProperties(value, globalCallback); } } } CustomFieldUtils.updateProperties = updateProperties; })(CustomFieldUtils || (exports.CustomFieldUtils = CustomFieldUtils = {}));