@newskit-render/shared-components 4.30.1 → 4.30.2-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/dist/cjs/FormComponent/FormComponent.js +15 -5
  2. package/dist/cjs/FormComponent/FormComponent.js.map +1 -1
  3. package/dist/cjs/FormComponent/FormFieldError.d.ts +11 -0
  4. package/dist/cjs/FormComponent/FormFieldError.js +53 -0
  5. package/dist/cjs/FormComponent/FormFieldError.js.map +1 -0
  6. package/dist/cjs/FormComponent/types.d.ts +3 -0
  7. package/dist/esm/FormComponent/FormComponent.js +15 -5
  8. package/dist/esm/FormComponent/FormComponent.js.map +1 -1
  9. package/dist/esm/FormComponent/FormFieldError.d.ts +11 -0
  10. package/dist/esm/FormComponent/FormFieldError.js +45 -0
  11. package/dist/esm/FormComponent/FormFieldError.js.map +1 -0
  12. package/dist/esm/FormComponent/types.d.ts +3 -0
  13. package/package.json +1 -1
package/dist/cjs/FormComponent/FormComponent.js CHANGED
@@ -51,13 +51,15 @@ var yup_1 = require("@hookform/resolvers/yup");
51
51
  var utils_1 = require("../utils");
52
52
  var lodash_unescape_1 = __importDefault(require("lodash.unescape"));
53
53
  var Form_1 = require("./Form");
54
+ var FormFieldError_1 = require("./FormFieldError");
54
55
  var FormComponent = function (_a) {
55
56
  var _b, _c;
56
- var infoPanel = _a.infoPanel, _d = _a.validationSchemaKey, validationSchemaKey = _d === void 0 ? '' : _d, fields = _a.fields, buttonGroupProps = _a.buttonGroupProps, _e = _a.disable, disable = _e === void 0 ? false : _e, inputText = _a.inputText, labelObject = _a.labelObject, text = _a.text, textOverriders = _a.textOverriders, _f = _a.validation, validation = _f === void 0 ? {} : _f, handleError = _a.handleError, handleLoading = _a.handleLoading, handleSuccess = _a.handleSuccess, baseUrl = _a.baseUrl, errorMessages = _a.errorMessages, genericErrorMessage = _a.genericErrorMessage, onSubmit = _a.onSubmit, isFooterVisible = _a.isFooterVisible, onValidationChange = _a.onValidationChange;
57
+ var infoPanel = _a.infoPanel, _d = _a.validationSchemaKey, validationSchemaKey = _d === void 0 ? '' : _d, fields = _a.fields, buttonGroupProps = _a.buttonGroupProps, _e = _a.disable, disable = _e === void 0 ? false : _e, inputText = _a.inputText, labelObject = _a.labelObject, text = _a.text, textOverriders = _a.textOverriders, _f = _a.validation, validation = _f === void 0 ? {} : _f, handleError = _a.handleError, handleLoading = _a.handleLoading, handleSuccess = _a.handleSuccess, baseUrl = _a.baseUrl, errorMessages = _a.errorMessages, genericErrorMessage = _a.genericErrorMessage, onSubmit = _a.onSubmit, isFooterVisible = _a.isFooterVisible, onValidationChange = _a.onValidationChange, fieldError = _a.fieldError, setFieldError = _a.setFieldError;
57
58
  var useInlineMessageComponent = (_b = infoPanel === null || infoPanel === void 0 ? void 0 : infoPanel.useInlineMessageComponent) !== null && _b !== void 0 ? _b : true;
58
59
  var fieldSchema = validation[validationSchemaKey];
59
60
  var resolver = (0, yup_1.yupResolver)(fieldSchema);
60
61
  var _g = (0, react_1.useState)(false), loading = _g[0], setLoading = _g[1];
62
+ var _h = (0, react_1.useState)(''), errorEmail = _h[0], setErrorEmail = _h[1];
61
63
  var router = (0, router_1.useRouter)();
62
64
  var fireEvent = (0, newskit_1.useInstrumentation)().fireEvent;
63
65
  var handleFormError = function (overrideMessage) {
@@ -65,18 +67,25 @@ var FormComponent = function (_a) {
65
67
  if (handleError)
66
68
  handleError(validationSchemaKey, errorMessages, genericErrorMessage, overrideMessage);
67
69
  };
70
+ var handleFieldChange = function (_a) {
71
+ var target = _a.target;
72
+ if ((target === null || target === void 0 ? void 0 : target.name) === 'email' && fieldError && errorEmail !== target.value) {
73
+ setFieldError && setFieldError('');
74
+ setErrorEmail(target.value);
75
+ }
76
+ };
68
77
  var getTextInputs = function (fields) {
69
78
  return (fields &&
70
79
  fields.map(function (_a) {
71
80
  var value = _a.value, field = _a.field;
72
81
  return (react_1.default.createElement(react_1.default.Fragment, { key: "".concat(field).concat(value) },
73
- react_1.default.createElement(newskit_1.FormInput, { name: field },
82
+ react_1.default.createElement(newskit_1.FormInput, { name: field, state: field === 'email' && fieldError ? 'invalid' : undefined },
74
83
  react_1.default.createElement(newskit_1.FormInputLabel, __assign({}, inputText === null || inputText === void 0 ? void 0 : inputText.labelProps), labelObject && labelObject[field] && labelObject[field]),
75
84
  react_1.default.createElement(newskit_1.FormInputTextField, __assign({ "aria-label": labelObject && labelObject[field] && labelObject[field], defaultValue: (0, lodash_unescape_1.default)(value) }, inputText === null || inputText === void 0 ? void 0 : inputText.formInputTextFieldProps, { onClick: function () {
76
85
  return fireEvent((0, utils_1.createClickEvent)('text-input', "personal details update:".concat(labelObject && labelObject[field] && labelObject[field])));
77
- } })),
78
- react_1.default.createElement(newskit_1.FormInputAssistiveText, { overrides: { marginBlockEnd: 'space050' } })),
79
- react_1.default.createElement(newskit_1.Block, { marginBlockEnd: "space050" })));
86
+ }, onChange: handleFieldChange })),
87
+ react_1.default.createElement(newskit_1.FormInputAssistiveText, { overrides: { marginBlockEnd: fieldError ? '0' : 'space050' } })),
88
+ react_1.default.createElement(newskit_1.Block, { marginBlockEnd: fieldError ? '0' : 'space050' })));
80
89
  }));
81
90
  };
82
91
  return (react_1.default.createElement(react_1.default.Fragment, null,
@@ -95,6 +104,7 @@ var FormComponent = function (_a) {
95
104
  }
96
105
  }, reValidationMode: "onBlur", validationMode: "onBlur" },
97
106
  react_1.default.createElement(newskit_1.Cell, __assign({}, inputText === null || inputText === void 0 ? void 0 : inputText.cells), getTextInputs(fields)),
107
+ fieldError && react_1.default.createElement(FormFieldError_1.FormFieldError, { message: fieldError }),
98
108
  react_1.default.createElement(react_1.default.Fragment, null, (infoPanel === null || infoPanel === void 0 ? void 0 : infoPanel.children) && (react_1.default.createElement(newskit_1.Cell, __assign({}, infoPanel.infoPanelCells),
99
109
  useInlineMessageComponent && (react_1.default.createElement(newskit_1.InlineMessage, { icon: infoPanel.icon, title: infoPanel.title, children: infoPanel.children, overrides: infoPanel.overrides || {} })),
100
110
  !useInlineMessageComponent && (react_1.default.createElement(newskit_1.Block, { "data-testid": "info-panel-block-wrapper", marginBlockEnd: (_c = infoPanel.overrides) === null || _c === void 0 ? void 0 : _c.marginBlockEnd }, infoPanel.children))))),
package/dist/cjs/FormComponent/FormComponent.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"FormComponent.js","sourceRoot":"","sources":["../../../src/FormComponent/FormComponent.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"FormComponent.js","sourceRoot":"","sources":["../../../src/FormComponent/FormComponent.tsx"],"names":[],"mappings":"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"}
package/dist/cjs/FormComponent/FormFieldError.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ interface Props {
3
+ message: string | any;
4
+ }
5
+ export declare const getErrorAndSuggestion: (message: string) => {
6
+ errMessage: string;
7
+ mail: RegExpMatchArray | null;
8
+ correctionMessage: string;
9
+ };
10
+ export declare const FormFieldError: React.FC<Props>;
11
+ export {};
package/dist/cjs/FormComponent/FormFieldError.js ADDED
@@ -0,0 +1,53 @@
1
+ "use strict";
2
+ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
3
+ if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
4
+ return cooked;
5
+ };
6
+ var __importDefault = (this && this.__importDefault) || function (mod) {
7
+ return (mod && mod.__esModule) ? mod : { "default": mod };
8
+ };
9
+ Object.defineProperty(exports, "__esModule", { value: true });
10
+ exports.FormFieldError = exports.getErrorAndSuggestion = void 0;
11
+ var react_1 = __importDefault(require("react"));
12
+ var Error_1 = require("@emotion-icons/material/Error");
13
+ var newskit_1 = require("newskit");
14
+ var StyledGridLayout = (0, newskit_1.styled)(newskit_1.GridLayout)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-left: 2px solid;\n ", "\n"], ["\n border-left: 2px solid;\n ", "\n"])), (0, newskit_1.getColorCssFromTheme)('border-color', 'red060'));
15
+ var StyledTextBlock = (0, newskit_1.styled)(newskit_1.TextBlock)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n grid-column: 2;\n ", "\n"], ["\n grid-column: 2;\n ", "\n"])), (0, newskit_1.getColorCssFromTheme)('color', 'red060'));
16
+ var StyledEmailText = (0, newskit_1.styled)(newskit_1.TextBlock)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n color: #005c8a;\n text-decoration: underline;\n"], ["\n color: #005c8a;\n text-decoration: underline;\n"])));
17
+ var StyledBlock = (0, newskit_1.styled)(newskit_1.Block)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n grid-column: 1 / span 2;\n"], ["\n display: flex;\n grid-column: 1 / span 2;\n"])));
18
+ var ErrorIcon = (0, newskit_1.toNewsKitIcon)(Error_1.Error);
19
+ var getErrorAndSuggestion = function (message) {
20
+ var _a;
21
+ var errMessage = (message === null || message === void 0 ? void 0 : message.split('Did you mean')[0]) || '';
22
+ var suggestion = ((_a = message === null || message === void 0 ? void 0 : message.split('address.')[1]) === null || _a === void 0 ? void 0 : _a.replace('?', '')) || '';
23
+ var mailRegex = /\b[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Z|a-z]{2,}\b/g;
24
+ var mail = suggestion.match(mailRegex);
25
+ var correctionMessage = suggestion.replace(mailRegex, '');
26
+ return { errMessage: errMessage, mail: mail, correctionMessage: correctionMessage };
27
+ };
28
+ exports.getErrorAndSuggestion = getErrorAndSuggestion;
29
+ var FormFieldError = function (_a) {
30
+ var message = _a.message;
31
+ if (!message)
32
+ return null;
33
+ var _b = (0, exports.getErrorAndSuggestion)(message), errMessage = _b.errMessage, mail = _b.mail, correctionMessage = _b.correctionMessage;
34
+ return (react_1.default.createElement(StyledGridLayout, { columns: 'auto 1fr', rowGap: 'space010', alignItems: 'center', overrides: {
35
+ marginBlockEnd: 'space050',
36
+ paddingBlock: '0',
37
+ paddingInline: 'space020',
38
+ } },
39
+ react_1.default.createElement(ErrorIcon, { overrides: {
40
+ stylePreset: 'inkNegative',
41
+ size: 'sizing050',
42
+ marginInlineEnd: 'space010',
43
+ } }),
44
+ react_1.default.createElement(StyledTextBlock, null, errMessage),
45
+ correctionMessage && (react_1.default.createElement(StyledBlock, null,
46
+ react_1.default.createElement(newskit_1.TextBlock, null,
47
+ correctionMessage,
48
+ react_1.default.createElement(StyledEmailText, { as: "span" }, " ".concat(mail)),
49
+ "?")))));
50
+ };
51
+ exports.FormFieldError = FormFieldError;
52
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
53
+ //# sourceMappingURL=FormFieldError.js.map
package/dist/cjs/FormComponent/FormFieldError.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FormFieldError.js","sourceRoot":"","sources":["../../../src/FormComponent/FormFieldError.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,gDAAyB;AACzB,uDAAqD;AACrD,mCAOgB;AAMhB,IAAM,gBAAgB,GAAG,IAAA,gBAAM,EAAC,oBAAU,CAAC,0GAAA,iCAEvC,EAA8C,IACjD,KADG,IAAA,8BAAoB,EAAC,cAAc,EAAE,QAAQ,CAAC,CACjD,CAAA;AAED,IAAM,eAAe,GAAG,IAAA,gBAAM,EAAC,mBAAS,CAAC,kGAAA,yBAErC,EAAuC,IAC1C,KADG,IAAA,8BAAoB,EAAC,OAAO,EAAE,QAAQ,CAAC,CAC1C,CAAA;AAED,IAAM,eAAe,GAAG,IAAA,gBAAM,EAAC,mBAAS,CAAC,yHAAA,sDAGxC,IAAA,CAAA;AAED,IAAM,WAAW,GAAG,IAAA,gBAAM,EAAC,eAAK,CAAC,qHAAA,kDAGhC,IAAA,CAAA;AAED,IAAM,SAAS,GAAG,IAAA,uBAAa,EAAC,aAAK,CAAC,CAAA;AAE/B,IAAM,qBAAqB,GAAG,UAAC,OAAe;;IACnD,IAAM,UAAU,GAAG,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK,CAAC,cAAc,EAAE,CAAC,CAAC,KAAI,EAAE,CAAA;IAC1D,IAAM,UAAU,GAAG,CAAA,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK,CAAC,UAAU,EAAE,CAAC,CAAC,0CAAE,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,KAAI,EAAE,CAAA;IACxE,IAAM,SAAS,GAAG,sDAAsD,CAAA;IACxE,IAAM,IAAI,GAAG,UAAU,CAAC,KAAK,CAAC,SAAS,CAAC,CAAA;IACxC,IAAM,iBAAiB,GAAG,UAAU,CAAC,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAA;IAE3D,OAAO,EAAE,UAAU,YAAA,EAAE,IAAI,MAAA,EAAE,iBAAiB,mBAAA,EAAE,CAAA;AAChD,CAAC,CAAA;AARY,QAAA,qBAAqB,yBAQjC;AAEM,IAAM,cAAc,GAAoB,UAAC,EAAW;QAAT,OAAO,aAAA;IACvD,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAA;IAEnB,IAAA,KAA0C,IAAA,6BAAqB,EAAC,OAAO,CAAC,EAAtE,UAAU,gBAAA,EAAE,IAAI,UAAA,EAAE,iBAAiB,uBAAmC,CAAA;IAE9E,OAAO,CACL,8BAAC,gBAAgB,IACf,OAAO,EAAE,UAAU,EACnB,MAAM,EAAE,UAAU,EAClB,UAAU,EAAE,QAAQ,EACpB,SAAS,EAAE;YACT,cAAc,EAAE,UAAU;YAC1B,YAAY,EAAE,GAAG;YACjB,aAAa,EAAE,UAAU;SAC1B;QAED,8BAAC,SAAS,IACR,SAAS,EAAE;gBACT,WAAW,EAAE,aAAa;gBAC1B,IAAI,EAAE,WAAW;gBACjB,eAAe,EAAE,UAAU;aAC5B,GACD;QACF,8BAAC,eAAe,QAAE,UAAU,CAAmB;QAE9C,iBAAiB,IAAI,CACpB,8BAAC,WAAW;YACV,8BAAC,mBAAS;gBACP,iBAAiB;gBAClB,8BAAC,eAAe,IAAC,EAAE,EAAC,MAAM,IAAE,WAAI,IAAI,CAAE,CAAmB;oBAC/C,CACA,CACf,CACgB,CACpB,CAAA;AACH,CAAC,CAAA;AAnCY,QAAA,cAAc,kBAmC1B"}
package/dist/cjs/FormComponent/types.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import { ButtonGroupProps } from '../ButtonGroup';
2
2
  import { MQ, InlineMessageProps, LabelProps, FormInputTextFieldProps, AssistiveTextProps } from 'newskit';
3
+ import { Dispatch, SetStateAction } from 'react';
3
4
  export interface EditFieldType {
4
5
  value: string | boolean;
5
6
  field: string;
@@ -43,6 +44,8 @@ export interface FormWrapperProps {
43
44
  };
44
45
  data?: Data;
45
46
  infoPanel?: InfoPanel;
47
+ fieldError?: string;
48
+ setFieldError?: Dispatch<SetStateAction<string>>;
46
49
  }
47
50
  export type ToastType = 'success' | 'error' | 'pending';
48
51
  export type ErrorMessage = {
package/dist/esm/FormComponent/FormComponent.js CHANGED
@@ -22,13 +22,15 @@ import { yupResolver } from '@hookform/resolvers/yup';
22
22
  import { createClickEvent } from '../utils';
23
23
  import unescape from 'lodash.unescape';
24
24
  import { Form } from './Form';
25
+ import { FormFieldError } from './FormFieldError';
25
26
  export var FormComponent = function (_a) {
26
27
  var _b, _c;
27
- var infoPanel = _a.infoPanel, _d = _a.validationSchemaKey, validationSchemaKey = _d === void 0 ? '' : _d, fields = _a.fields, buttonGroupProps = _a.buttonGroupProps, _e = _a.disable, disable = _e === void 0 ? false : _e, inputText = _a.inputText, labelObject = _a.labelObject, text = _a.text, textOverriders = _a.textOverriders, _f = _a.validation, validation = _f === void 0 ? {} : _f, handleError = _a.handleError, handleLoading = _a.handleLoading, handleSuccess = _a.handleSuccess, baseUrl = _a.baseUrl, errorMessages = _a.errorMessages, genericErrorMessage = _a.genericErrorMessage, onSubmit = _a.onSubmit, isFooterVisible = _a.isFooterVisible, onValidationChange = _a.onValidationChange;
28
+ var infoPanel = _a.infoPanel, _d = _a.validationSchemaKey, validationSchemaKey = _d === void 0 ? '' : _d, fields = _a.fields, buttonGroupProps = _a.buttonGroupProps, _e = _a.disable, disable = _e === void 0 ? false : _e, inputText = _a.inputText, labelObject = _a.labelObject, text = _a.text, textOverriders = _a.textOverriders, _f = _a.validation, validation = _f === void 0 ? {} : _f, handleError = _a.handleError, handleLoading = _a.handleLoading, handleSuccess = _a.handleSuccess, baseUrl = _a.baseUrl, errorMessages = _a.errorMessages, genericErrorMessage = _a.genericErrorMessage, onSubmit = _a.onSubmit, isFooterVisible = _a.isFooterVisible, onValidationChange = _a.onValidationChange, fieldError = _a.fieldError, setFieldError = _a.setFieldError;
28
29
  var useInlineMessageComponent = (_b = infoPanel === null || infoPanel === void 0 ? void 0 : infoPanel.useInlineMessageComponent) !== null && _b !== void 0 ? _b : true;
29
30
  var fieldSchema = validation[validationSchemaKey];
30
31
  var resolver = yupResolver(fieldSchema);
31
32
  var _g = useState(false), loading = _g[0], setLoading = _g[1];
33
+ var _h = useState(''), errorEmail = _h[0], setErrorEmail = _h[1];
32
34
  var router = useRouter();
33
35
  var fireEvent = useInstrumentation().fireEvent;
34
36
  var handleFormError = function (overrideMessage) {
@@ -36,18 +38,25 @@ export var FormComponent = function (_a) {
36
38
  if (handleError)
37
39
  handleError(validationSchemaKey, errorMessages, genericErrorMessage, overrideMessage);
38
40
  };
41
+ var handleFieldChange = function (_a) {
42
+ var target = _a.target;
43
+ if ((target === null || target === void 0 ? void 0 : target.name) === 'email' && fieldError && errorEmail !== target.value) {
44
+ setFieldError && setFieldError('');
45
+ setErrorEmail(target.value);
46
+ }
47
+ };
39
48
  var getTextInputs = function (fields) {
40
49
  return (fields &&
41
50
  fields.map(function (_a) {
42
51
  var value = _a.value, field = _a.field;
43
52
  return (React.createElement(React.Fragment, { key: "".concat(field).concat(value) },
44
- React.createElement(FormInput, { name: field },
53
+ React.createElement(FormInput, { name: field, state: field === 'email' && fieldError ? 'invalid' : undefined },
45
54
  React.createElement(FormInputLabel, __assign({}, inputText === null || inputText === void 0 ? void 0 : inputText.labelProps), labelObject && labelObject[field] && labelObject[field]),
46
55
  React.createElement(FormInputTextField, __assign({ "aria-label": labelObject && labelObject[field] && labelObject[field], defaultValue: unescape(value) }, inputText === null || inputText === void 0 ? void 0 : inputText.formInputTextFieldProps, { onClick: function () {
47
56
  return fireEvent(createClickEvent('text-input', "personal details update:".concat(labelObject && labelObject[field] && labelObject[field])));
48
- } })),
49
- React.createElement(FormInputAssistiveText, { overrides: { marginBlockEnd: 'space050' } })),
50
- React.createElement(Block, { marginBlockEnd: "space050" })));
57
+ }, onChange: handleFieldChange })),
58
+ React.createElement(FormInputAssistiveText, { overrides: { marginBlockEnd: fieldError ? '0' : 'space050' } })),
59
+ React.createElement(Block, { marginBlockEnd: fieldError ? '0' : 'space050' })));
51
60
  }));
52
61
  };
53
62
  return (React.createElement(React.Fragment, null,
@@ -66,6 +75,7 @@ export var FormComponent = function (_a) {
66
75
  }
67
76
  }, reValidationMode: "onBlur", validationMode: "onBlur" },
68
77
  React.createElement(Cell, __assign({}, inputText === null || inputText === void 0 ? void 0 : inputText.cells), getTextInputs(fields)),
78
+ fieldError && React.createElement(FormFieldError, { message: fieldError }),
69
79
  React.createElement(React.Fragment, null, (infoPanel === null || infoPanel === void 0 ? void 0 : infoPanel.children) && (React.createElement(Cell, __assign({}, infoPanel.infoPanelCells),
70
80
  useInlineMessageComponent && (React.createElement(InlineMessage, { icon: infoPanel.icon, title: infoPanel.title, children: infoPanel.children, overrides: infoPanel.overrides || {} })),
71
81
  !useInlineMessageComponent && (React.createElement(Block, { "data-testid": "info-panel-block-wrapper", marginBlockEnd: (_c = infoPanel.overrides) === null || _c === void 0 ? void 0 : _c.marginBlockEnd }, infoPanel.children))))),
package/dist/esm/FormComponent/FormComponent.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"FormComponent.js","sourceRoot":"","sources":["../../../src/FormComponent/FormComponent.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"FormComponent.js","sourceRoot":"","sources":["../../../src/FormComponent/FormComponent.tsx"],"names":[],"mappings":"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"}
package/dist/esm/FormComponent/FormFieldError.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ interface Props {
3
+ message: string | any;
4
+ }
5
+ export declare const getErrorAndSuggestion: (message: string) => {
6
+ errMessage: string;
7
+ mail: RegExpMatchArray | null;
8
+ correctionMessage: string;
9
+ };
10
+ export declare const FormFieldError: React.FC<Props>;
11
+ export {};
package/dist/esm/FormComponent/FormFieldError.js ADDED
@@ -0,0 +1,45 @@
1
+ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
2
+ if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
3
+ return cooked;
4
+ };
5
+ import React from 'react';
6
+ import { Error } from '@emotion-icons/material/Error';
7
+ import { Block, GridLayout, styled, TextBlock, toNewsKitIcon, getColorCssFromTheme, } from 'newskit';
8
+ var StyledGridLayout = styled(GridLayout)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border-left: 2px solid;\n ", "\n"], ["\n border-left: 2px solid;\n ", "\n"])), getColorCssFromTheme('border-color', 'red060'));
9
+ var StyledTextBlock = styled(TextBlock)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n grid-column: 2;\n ", "\n"], ["\n grid-column: 2;\n ", "\n"])), getColorCssFromTheme('color', 'red060'));
10
+ var StyledEmailText = styled(TextBlock)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n color: #005c8a;\n text-decoration: underline;\n"], ["\n color: #005c8a;\n text-decoration: underline;\n"])));
11
+ var StyledBlock = styled(Block)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n display: flex;\n grid-column: 1 / span 2;\n"], ["\n display: flex;\n grid-column: 1 / span 2;\n"])));
12
+ var ErrorIcon = toNewsKitIcon(Error);
13
+ export var getErrorAndSuggestion = function (message) {
14
+ var _a;
15
+ var errMessage = (message === null || message === void 0 ? void 0 : message.split('Did you mean')[0]) || '';
16
+ var suggestion = ((_a = message === null || message === void 0 ? void 0 : message.split('address.')[1]) === null || _a === void 0 ? void 0 : _a.replace('?', '')) || '';
17
+ var mailRegex = /\b[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Z|a-z]{2,}\b/g;
18
+ var mail = suggestion.match(mailRegex);
19
+ var correctionMessage = suggestion.replace(mailRegex, '');
20
+ return { errMessage: errMessage, mail: mail, correctionMessage: correctionMessage };
21
+ };
22
+ export var FormFieldError = function (_a) {
23
+ var message = _a.message;
24
+ if (!message)
25
+ return null;
26
+ var _b = getErrorAndSuggestion(message), errMessage = _b.errMessage, mail = _b.mail, correctionMessage = _b.correctionMessage;
27
+ return (React.createElement(StyledGridLayout, { columns: 'auto 1fr', rowGap: 'space010', alignItems: 'center', overrides: {
28
+ marginBlockEnd: 'space050',
29
+ paddingBlock: '0',
30
+ paddingInline: 'space020',
31
+ } },
32
+ React.createElement(ErrorIcon, { overrides: {
33
+ stylePreset: 'inkNegative',
34
+ size: 'sizing050',
35
+ marginInlineEnd: 'space010',
36
+ } }),
37
+ React.createElement(StyledTextBlock, null, errMessage),
38
+ correctionMessage && (React.createElement(StyledBlock, null,
39
+ React.createElement(TextBlock, null,
40
+ correctionMessage,
41
+ React.createElement(StyledEmailText, { as: "span" }, " ".concat(mail)),
42
+ "?")))));
43
+ };
44
+ var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
45
+ //# sourceMappingURL=FormFieldError.js.map
package/dist/esm/FormComponent/FormFieldError.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FormFieldError.js","sourceRoot":"","sources":["../../../src/FormComponent/FormFieldError.tsx"],"names":[],"mappings":";;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,KAAK,EAAE,MAAM,+BAA+B,CAAA;AACrD,OAAO,EACL,KAAK,EACL,UAAU,EACV,MAAM,EACN,SAAS,EACT,aAAa,EACb,oBAAoB,GACrB,MAAM,SAAS,CAAA;AAMhB,IAAM,gBAAgB,GAAG,MAAM,CAAC,UAAU,CAAC,0GAAA,iCAEvC,EAA8C,IACjD,KADG,oBAAoB,CAAC,cAAc,EAAE,QAAQ,CAAC,CACjD,CAAA;AAED,IAAM,eAAe,GAAG,MAAM,CAAC,SAAS,CAAC,kGAAA,yBAErC,EAAuC,IAC1C,KADG,oBAAoB,CAAC,OAAO,EAAE,QAAQ,CAAC,CAC1C,CAAA;AAED,IAAM,eAAe,GAAG,MAAM,CAAC,SAAS,CAAC,yHAAA,sDAGxC,IAAA,CAAA;AAED,IAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAC,qHAAA,kDAGhC,IAAA,CAAA;AAED,IAAM,SAAS,GAAG,aAAa,CAAC,KAAK,CAAC,CAAA;AAEtC,MAAM,CAAC,IAAM,qBAAqB,GAAG,UAAC,OAAe;;IACnD,IAAM,UAAU,GAAG,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK,CAAC,cAAc,EAAE,CAAC,CAAC,KAAI,EAAE,CAAA;IAC1D,IAAM,UAAU,GAAG,CAAA,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK,CAAC,UAAU,EAAE,CAAC,CAAC,0CAAE,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,KAAI,EAAE,CAAA;IACxE,IAAM,SAAS,GAAG,sDAAsD,CAAA;IACxE,IAAM,IAAI,GAAG,UAAU,CAAC,KAAK,CAAC,SAAS,CAAC,CAAA;IACxC,IAAM,iBAAiB,GAAG,UAAU,CAAC,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAA;IAE3D,OAAO,EAAE,UAAU,YAAA,EAAE,IAAI,MAAA,EAAE,iBAAiB,mBAAA,EAAE,CAAA;AAChD,CAAC,CAAA;AAED,MAAM,CAAC,IAAM,cAAc,GAAoB,UAAC,EAAW;QAAT,OAAO,aAAA;IACvD,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAA;IAEnB,IAAA,KAA0C,qBAAqB,CAAC,OAAO,CAAC,EAAtE,UAAU,gBAAA,EAAE,IAAI,UAAA,EAAE,iBAAiB,uBAAmC,CAAA;IAE9E,OAAO,CACL,oBAAC,gBAAgB,IACf,OAAO,EAAE,UAAU,EACnB,MAAM,EAAE,UAAU,EAClB,UAAU,EAAE,QAAQ,EACpB,SAAS,EAAE;YACT,cAAc,EAAE,UAAU;YAC1B,YAAY,EAAE,GAAG;YACjB,aAAa,EAAE,UAAU;SAC1B;QAED,oBAAC,SAAS,IACR,SAAS,EAAE;gBACT,WAAW,EAAE,aAAa;gBAC1B,IAAI,EAAE,WAAW;gBACjB,eAAe,EAAE,UAAU;aAC5B,GACD;QACF,oBAAC,eAAe,QAAE,UAAU,CAAmB;QAE9C,iBAAiB,IAAI,CACpB,oBAAC,WAAW;YACV,oBAAC,SAAS;gBACP,iBAAiB;gBAClB,oBAAC,eAAe,IAAC,EAAE,EAAC,MAAM,IAAE,WAAI,IAAI,CAAE,CAAmB;oBAC/C,CACA,CACf,CACgB,CACpB,CAAA;AACH,CAAC,CAAA"}
package/dist/esm/FormComponent/types.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import { ButtonGroupProps } from '../ButtonGroup';
2
2
  import { MQ, InlineMessageProps, LabelProps, FormInputTextFieldProps, AssistiveTextProps } from 'newskit';
3
+ import { Dispatch, SetStateAction } from 'react';
3
4
  export interface EditFieldType {
4
5
  value: string | boolean;
5
6
  field: string;
@@ -43,6 +44,8 @@ export interface FormWrapperProps {
43
44
  };
44
45
  data?: Data;
45
46
  infoPanel?: InfoPanel;
47
+ fieldError?: string;
48
+ setFieldError?: Dispatch<SetStateAction<string>>;
46
49
  }
47
50
  export type ToastType = 'success' | 'error' | 'pending';
48
51
  export type ErrorMessage = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@newskit-render/shared-components",
3
- "version": "4.30.1",
3
+ "version": "4.30.2-alpha.0",
4
4
  "description": "Newskit Render Shared Components",
5
5
  "author": "",
6
6
  "license": "UNLICENSED",