@sap-ux/ui-components
Version:
SAP UI Components Library
133 lines • 4.27 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.getMessageInfo = exports.MESSAGE_TYPES_CLASSNAME_MAP = exports.ErrorMessageType = void 0;
var ErrorMessageType;
(function (ErrorMessageType) {
ErrorMessageType["Error"] = "Error";
ErrorMessageType["Warning"] = "Warning";
ErrorMessageType["Info"] = "Info";
})(ErrorMessageType || (exports.ErrorMessageType = ErrorMessageType = {}));
/**
* Private method to get common styling for coloring by applying incoming colors.
*
* @param {string} bgColor Background color.
* @param {string} borderColor Border color.
* @returns {IRawStyle} Object with styles for message.
*/
const getMessageColorStylings = (bgColor, borderColor) => {
const border = `1px solid ${borderColor}`;
return {
backgroundColor: bgColor,
borderLeft: border,
borderRight: border,
borderBottom: border,
borderColor: borderColor
};
};
const messagesStyles = {
error: {
color: 'var(--vscode-input-foreground)',
...getMessageColorStylings('var(--vscode-inputValidation-errorBackground)', 'var(--vscode-inputValidation-errorBorder)'),
paddingTop: 4,
paddingBottom: 5,
paddingLeft: 8,
margin: 0
},
warning: {},
info: {}
};
messagesStyles.warning = {
...messagesStyles.error,
...getMessageColorStylings('var(--vscode-inputValidation-warningBackground)', 'var(--vscode-inputValidation-warningBorder)')
};
messagesStyles.info = {
...messagesStyles.error,
...getMessageColorStylings('var(--vscode-inputValidation-infoBackground)', 'var(--vscode-inputValidation-infoBorder)')
};
exports.MESSAGE_TYPES_CLASSNAME_MAP = new Map([
[undefined, 'error'],
["Error" /* ErrorMessageType.Error */, 'error'],
["Warning" /* ErrorMessageType.Warning */, 'warning'],
["Info" /* ErrorMessageType.Info */, 'info']
]);
/**
* Method returns input message styles for passed message type.
* Default style is for Error message.
*
* @param {ErrorMessageType} [type] Message type.
* @returns {IRawStyle} Object with styles for message.
*/
const getMessageStyle = (type) => {
let style;
switch (type) {
case "Warning" /* ErrorMessageType.Warning */: {
style = messagesStyles.warning;
break;
}
case "Info" /* ErrorMessageType.Info */: {
style = messagesStyles.info;
break;
}
default: {
style = messagesStyles.error;
break;
}
}
return style;
};
/**
* Method returns error message type depends on properties of UIComponentMessagesProps.
*
* @param {UIComponentMessagesProps} [props] Component props.
* @returns {ErrorMessageType} Message type.
*/
const getMessageType = (props) => {
if (props) {
if (props.errorMessage) {
return "Error" /* ErrorMessageType.Error */;
}
else if (props.warningMessage) {
return "Warning" /* ErrorMessageType.Warning */;
}
else if (props.infoMessage) {
return "Info" /* ErrorMessageType.Info */;
}
}
return "Error" /* ErrorMessageType.Error */;
};
/**
* Method returns error message string by handling property of all messages like Error Warning and Info.
*
* @param {UIComponentMessagesProps} [props] Component props.
* @returns {string | undefined} Message string.
*/
const getErrorMessage = (props) => {
// Find first message with priority - 1. error, 2. warning, 3. info.
const propertyNames = [
'errorMessage',
'warningMessage',
'infoMessage'
];
for (const name of propertyNames) {
if (props?.[name]) {
return props[name];
}
}
return undefined;
};
/**
* Method returns object containing data to display message for component.
*
* @param {UIMessagesExtendedProps} [props] Component props.
* @returns {InputValidationMessageInfo} Message info.
*/
const getMessageInfo = (props) => {
const errorType = getMessageType(props);
return {
type: errorType,
style: getMessageStyle(errorType),
message: getErrorMessage(props)
};
};
exports.getMessageInfo = getMessageInfo;
//# sourceMappingURL=utils.js.map