oneframe-react
Version:
Oneframe React ## Components, Hooks, Helper Functions & State Management
386 lines (385 loc) • 11 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importDefault(require("react"));
const core_1 = require("@material-ui/core");
const NumberInput_1 = __importDefault(require("./components/Inputs/Input/NumberInput"));
const MaskInput_1 = __importDefault(require("./components/Inputs/Input/MaskInput"));
const lodash_1 = require("lodash");
const fast_memoize_1 = __importDefault(require("fast-memoize"));
lodash_1.templateSettings.interpolate = /{{([\s\S]+?)}}/g;
/**
* Left Adornments
*
* @static
* @param {Function} leftAdornments
* @returns {*} Return the object props
*/
exports.getStartAdornments = (leftAdornments) => {
if (leftAdornments) {
return {
startAdornment: react_1.default.createElement(core_1.InputAdornment, { position: "start" }, leftAdornments()),
};
}
return {};
};
/**
* Right Adornments
*
* @static
* @param {Function} rightAdornments
* @returns {*} Returns the object props
*/
exports.getEndAdornments = (rightAdornments) => {
if (rightAdornments) {
return {
endAdornment: react_1.default.createElement(core_1.InputAdornment, { position: "end" }, rightAdornments()),
};
}
return {};
};
/**
* Underline status
*
* @static
* @param {string} variant
* @param {boolean} disabledUnderline
* @returns {*} Returns the object props
*/
exports.disabledunderline = (variant, disabledUnderline) => {
let disabledUnderlineContainer = {};
if (variant === 'filled') {
disabledUnderlineContainer = {
disableUnderline: disabledUnderline,
};
}
return disabledUnderlineContainer;
};
/**
* Input number format view
*
* @static
* @param {Object} numberFormat
* @returns {*} Returns the object props
*/
const getNumberFormat = (numberFormat) => {
let inputNumberFormats = {};
if (numberFormat) {
inputNumberFormats = {
inputComponent: NumberInput_1.default,
inputProps: Object.assign({}, numberFormat),
};
}
return inputNumberFormats;
};
/**
* Input mask format
*
* @static
* @since 0.1.0
* @category Lang
* @param {Object} maskFormat
* @returns {*} Returns the object props
*/
const getMaskFormat = (maskFormat) => {
let inputNumberFormats = {};
if (maskFormat) {
inputNumberFormats = {
inputComponent: MaskInput_1.default,
inputProps: {
mask: maskFormat.mask,
guide: maskFormat.guide,
showMask: maskFormat.showMask,
placeholderChar: maskFormat.placeholderChar,
keepCharPositions: maskFormat.keepCharPositions,
},
};
}
return inputNumberFormats;
};
/**
* All input adornments
*
* @static
* @param {Function} leftAdornments
* @param {Function} rightAdornments
* @param {string} variant
* @param {boolean} disabledUnderline
* @param {Object} numberFormat
* @param {Object} mask
* @returns {*} Returns the adorments node
*/
exports.getAdornments = (leftAdornments, rightAdornments, variant, disabledUnderline, numberFormat, mask) => {
return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, exports.getStartAdornments(leftAdornments)), exports.getEndAdornments(rightAdornments)), exports.disabledunderline(variant, disabledUnderline)), getNumberFormat(numberFormat)), getMaskFormat(mask));
};
/**
* Selectbox custom view value
*
* @static
* @param {*} selected
* @param {*} data
* @param {string} displayField
* @param {string} displayValue
* @param {boolean} viewChip
* @returns {*} Object
*/
exports.getMultipleCustomRender = (selected, data, displayValue, displayField, viewChip = false) => {
const showStr = [];
data &&
data.length &&
selected &&
selected.length &&
selected.forEach((a) => {
const x = data.filter((item) => item[displayValue] === a)[0];
showStr.push(x[displayField]);
});
if (viewChip) {
return showStr.length && showStr.map((value, i) => react_1.default.createElement(core_1.Chip, { key: i, label: value }));
}
return showStr.length ? showStr.join(', ') : selected;
};
/**
* Error status
*
* @static
* @param {*} messages
* @param {string} name
* @param {string} errorText
* @returns {boolean} Returns the `true` or `false`.
*/
exports.getErrorStatus = fast_memoize_1.default((messages, name, errorText) => {
if (messages && !lodash_1.isEmpty(messages) && messages[name] && messages[name].length) {
return true;
}
return !!errorText;
});
/**
* Error message
*
* @static
* @param {*} messages
* @param {string} name
* @param {string} errorText
* @param {string} helperText
* @returns {boolean} Returns the error text message.
*/
exports.getErrorMessage = fast_memoize_1.default((messages, name, errorText, helperText = '') => {
if (messages && !lodash_1.isEmpty(messages) && messages[name]) {
return messages[name][0];
}
return errorText || helperText;
});
/**
* Label text
*
* @static
* @param {string} multipleSelectCountText
* @param {*} multiValue
* @param {string} caption
* @returns {boolean} Returns the label text.
*/
exports.getMultiSelectLabel = fast_memoize_1.default((multipleSelectCountText = '', multiValue, caption = '') => {
if (multipleSelectCountText && multiValue.length) {
if (!lodash_1.includes(multipleSelectCountText, 'selectedCount')) {
console.warn('Type error. The multipleSelectCountText value must be "selectedCount".');
}
else {
const compiled = lodash_1.template(multipleSelectCountText);
return compiled({ selectedCount: multiValue.length });
}
}
return caption;
});
/**
* Input custom props
*
* @static
* @param {number} labelWidth
* @param {*} id
* @param {string} name
* @param {boolean} readOnly
* @param {*} leftAdornments
* @param {*} rightAdornments
* @param {boolean} captionActive
* @param {string} variant
* @param {boolean} disableUnderline
* @returns {Object} Returns the input props.
*/
exports.getInputProps = fast_memoize_1.default((labelWidth, id, name, readOnly = false, leftAdornments, rightAdornments, captionActive = false, variant, disableUnderline) => {
const inputProps = Object.assign(Object.assign(Object.assign(Object.assign({ labelWidth: Number(labelWidth), fullWidth: true, id,
name,
readOnly }, exports.getStartAdornments(leftAdornments)), exports.getEndAdornments(rightAdornments)), (captionActive ? { notched: true } : {})), exports.disabledunderline(variant, disableUnderline));
switch (variant) {
case 'outlined':
return {
input: react_1.default.createElement(core_1.OutlinedInput, Object.assign({}, inputProps)),
};
case 'filled':
return {
input: react_1.default.createElement(core_1.FilledInput, Object.assign({}, lodash_1.omit(inputProps, 'labelWidth'))),
};
case 'standard':
return {
input: react_1.default.createElement(core_1.Input, Object.assign({}, lodash_1.omit(inputProps, 'labelWidth'))),
};
default:
return {
inputProps: { name, id, readOnly },
};
}
});
/**
* Input return value
*
* @static
* @param {*} id
* @param {string} name
* @param {*} value
* @returns {*} Returns the input value
*/
exports.getTargetValue = fast_memoize_1.default((id, name, value) => {
return {
target: {
value: value,
id,
name,
},
};
});
/**
* Inputs-Multiselect return value
*
* @static
* @param {*} id
* @param {string} name
* @param {*} value
* @param {*} valueObject
* @returns {*} Returns the select input value
*/
exports.getTargetSelectValue = fast_memoize_1.default((id, name, value, valueObject) => {
return {
target: {
value: value,
valueObject: valueObject,
id,
name,
},
};
});
/**
* Checked return value
*
* @static
* @param {*} id
* @param {string} name
* @param {*} value
* @returns {*} Returns the checked input value
*/
exports.getTargetChecked = fast_memoize_1.default((id, name, value) => {
return {
target: {
checked: value,
id,
name,
},
};
});
/**
* State management initial error
*
* @static
* @returns {*} Returns initial error value
*/
exports.initialError = () => {
return null;
};
/**
* State management initial status code
*
* @static
* @returns {*} Returns initial status code value
*/
exports.initialStatusCode = () => {
return null;
};
/**
* State management loading
*
* @static
* @returns {*} Returns initial loading
*/
exports.initialLoading = () => {
return false;
};
/**
* State management initial data
*
* @static
* @param {*} val
* @returns {*} Returns the initial value for state management
*/
exports.initialData = (val) => {
let prevObj = {};
if (val) {
Object.keys(val).map((a) => {
prevObj = Object.assign(Object.assign({}, prevObj), { [a]: {
loading: exports.initialLoading(),
error: exports.initialError(),
payload: val[a],
statusCode: exports.initialStatusCode(),
} });
return prevObj;
});
}
return prevObj;
};
/**
* State management initial data
*
* @static
* @param {*} prevData
* @param {*} data
* @returns {*} Returns the initial value for state management initial state
*/
exports.firstTimeData = (prevData, data) => {
let newData = prevData;
if (!newData[data.name]) {
return Promise.reject(`Initial state missing type: "${data.name}"`);
}
const setParameters = {
loading: true,
error: exports.initialError(),
payload: data.hasOwnProperty('payload') ? newData[data.name].payload : null,
statusCode: exports.initialStatusCode(),
};
if (data && !lodash_1.isEmpty(data) && data.hasOwnProperty('name')) {
newData = lodash_1.set(newData, data.name, setParameters);
}
return newData;
};
/**
* State management default value
*
* @static
*/
exports.defaultSetParameters = {
loading: exports.initialLoading(),
error: exports.initialError(),
payload: null,
statusCode: exports.initialStatusCode(),
headers: null,
onSuccess: () => { },
onError: () => { },
};
exports.getTargetTimeValue = fast_memoize_1.default((id, name, value, valueObject) => {
return {
target: {
value: value,
dateValue: valueObject,
id,
name,
},
};
});