@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
1,167 lines (1,166 loc) • 67.9 kB
JavaScript
"use strict";
"use client";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.checkForError = checkForError;
exports.default = useFieldProps;
require("core-js/modules/es.string.replace.js");
require("core-js/modules/web.dom-collections.iterator.js");
var _react = _interopRequireWildcard(require("react"));
var _jsonPointer = _interopRequireDefault(require("../utils/json-pointer"));
var _utils = require("../utils");
var _DataContext = require("../DataContext");
var _Provider = require("../DataContext/Provider/Provider");
var _FieldProviderContext = _interopRequireDefault(require("../Field/Provider/FieldProviderContext"));
var _componentHelper = require("../../../shared/component-helper");
var _useId = _interopRequireDefault(require("../../../shared/helpers/useId"));
var _useUpdateEffect = _interopRequireDefault(require("../../../shared/helpers/useUpdateEffect"));
var _FieldBlockContext = _interopRequireDefault(require("../FieldBlock/FieldBlockContext"));
var _IterateItemContext = _interopRequireDefault(require("../Iterate/IterateItemContext"));
var _SectionContext = _interopRequireDefault(require("../Form/Section/SectionContext"));
var _FieldBoundaryContext = _interopRequireDefault(require("../DataContext/FieldBoundary/FieldBoundaryContext"));
var _VisibilityContext = _interopRequireDefault(require("../Form/Visibility/VisibilityContext"));
var _Context = _interopRequireDefault(require("../Wizard/Context"));
var _StepContext = _interopRequireDefault(require("../Wizard/Step/StepContext"));
var _SnapshotContext = _interopRequireDefault(require("../Form/Snapshot/SnapshotContext"));
var _useProcessManager = _interopRequireDefault(require("./useProcessManager"));
var _usePath = _interopRequireDefault(require("./usePath"));
var _useSharedState = require("../../../shared/helpers/useSharedState");
var _isAsync = require("../../../shared/helpers/isAsync");
var _useTranslation = _interopRequireDefault(require("./useTranslation"));
var _useExternalValue = _interopRequireDefault(require("./useExternalValue"));
var _useDataValue = _interopRequireDefault(require("./useDataValue"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
const useLayoutEffect = typeof window === 'undefined' ? _react.default.useEffect : _react.default.useLayoutEffect;
function useFieldProps(localProps) {
var _dataContext$props,
_localErrorRef$curren,
_this = this,
_dataContext$props3,
_props$path,
_props$autoComplete;
let {
executeOnChangeRegardlessOfError = false,
updateContextDataInSync = false,
omitMultiplePathWarning = false,
forceUpdateWhenContextDataIsSet = false
} = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
const {
extend
} = (0, _react.useContext)(_FieldProviderContext.default);
const props = extend(localProps);
const {
path: pathProp,
value: valueProp,
defaultValue,
itemPath,
emptyValue,
required: requiredProp,
disabled: disabledProp,
info: infoProp,
warning: warningProp,
error: initialErrorProp = 'initial',
errorMessages,
onFocus,
onBlur,
onChange,
onBlurValidator,
validator,
onChangeValidator = validator,
exportValidators,
schema,
validateInitially,
validateUnchanged,
continuousValidation,
validateContinuously = continuousValidation,
transformIn = external => external,
transformOut = internal => internal,
toInput = value => value,
fromInput = value => value,
toEvent = value => value,
transformValue = value => value,
provideAdditionalArgs = (value, additionalArgs) => additionalArgs,
fromExternal = value => value,
validateRequired = (value, _ref) => {
let {
emptyValue,
required,
error
} = _ref;
if (required && (value === emptyValue || typeof emptyValue === 'undefined' && value === '')) {
return error;
}
}
} = props;
const [salt, forceUpdate] = (0, _react.useReducer)(() => ({}), {});
const isInternalRerenderRef = (0, _react.useRef)(undefined);
(0, _react.useMemo)(() => {
isInternalRerenderRef.current = salt;
}, [salt]);
const {
startProcess
} = (0, _useProcessManager.default)();
const id = (0, _useId.default)(props.id);
const dataContext = (0, _react.useContext)(_DataContext.Context);
const fieldBlockContext = (0, _react.useContext)(_FieldBlockContext.default);
const iterateItemContext = (0, _react.useContext)(_IterateItemContext.default);
const sectionContext = (0, _react.useContext)(_SectionContext.default);
const fieldBoundaryContext = (0, _react.useContext)(_FieldBoundaryContext.default);
const wizardContext = (0, _react.useContext)(_Context.default);
const wizardStepContext = (0, _react.useContext)(_StepContext.default);
const {
setMountedField: setMountedFieldSnapshot
} = (0, _react.useContext)(_SnapshotContext.default) || {};
const {
isVisible,
keepInDOM
} = (0, _react.useContext)(_VisibilityContext.default) || {};
const handleFieldAsVisible = isVisible || keepInDOM;
const {
getValueByPath,
getSourceValue
} = (0, _useDataValue.default)();
const translation = (0, _useTranslation.default)();
const {
formatMessage
} = translation;
const translationRef = (0, _react.useRef)(translation);
translationRef.current = translation;
const transformers = (0, _react.useRef)({
transformIn,
transformOut,
provideAdditionalArgs,
toInput,
fromInput,
toEvent,
fromExternal,
transformValue,
validateRequired
});
const {
handlePathChangeUnvalidated: handlePathChangeUnvalidatedDataContext,
handlePathChange: handlePathChangeDataContext,
updateDataValue: updateDataValueDataContext,
validateData: validateDataDataContext,
setFieldState: setFieldStateDataContext,
setFieldError: setFieldErrorDataContext,
setFieldInternals: setFieldInternalsDataContext,
setFieldConnection: setFieldConnectionDataContext,
revealError: revealErrorDataContext,
setMountedFieldState: setMountedFieldStateDataContext,
setFieldEventListener,
errors: dataContextErrors,
showAllErrors,
contextErrorMessages,
fieldDisplayValueRef,
existingFieldsRef,
fieldInternalsRef
} = dataContext || {};
const onChangeContext = dataContext === null || dataContext === void 0 ? void 0 : (_dataContext$props = dataContext.props) === null || _dataContext$props === void 0 ? void 0 : _dataContext$props.onChange;
const disabled = disabledProp !== null && disabledProp !== void 0 ? disabledProp : props.readOnly;
const inFieldBlock = Boolean(fieldBlockContext && fieldBlockContext.disableStatusSummary !== true);
const {
setBlockRecord,
setFieldState: setFieldStateFieldBlock,
showFieldError: showFieldErrorFieldBlock,
mountedFieldsRef: mountedFieldsRefFieldBlock
} = inFieldBlock ? fieldBlockContext : {};
const {
activeIndex,
activeIndexRef,
prerenderFieldProps,
setFieldError: setFieldErrorWizard
} = wizardContext || {};
const {
index: wizardIndex
} = wizardStepContext || {};
const {
handleChange: handleChangeIterateContext,
index: iterateIndex,
arrayValue: iterateArrayValue,
nestedIteratePath
} = iterateItemContext || {};
const {
path: sectionPath,
errorPrioritization
} = sectionContext || {};
const {
setFieldError: setFieldErrorBoundary,
revealError: revealErrorBoundary,
showBoundaryErrors
} = fieldBoundaryContext || {};
const hasPath = Boolean(pathProp);
const hasItemPath = Boolean(itemPath);
const {
path,
identifier,
makeIteratePath,
joinPath,
cleanPath
} = (0, _usePath.default)({
id,
path: pathProp,
itemPath
});
const defaultValueRef = (0, _react.useRef)(defaultValue);
useLayoutEffect(() => {
defaultValueRef.current = defaultValue;
}, []);
const tmpValue = (0, _useExternalValue.default)({
path,
itemPath,
value: valueProp,
transformers,
emptyValue: defaultValue ? undefined : emptyValue
});
const externalValueDeps = tmpValue;
const externalValue = transformers.current.transformIn(tmpValue !== null && tmpValue !== void 0 ? tmpValue : defaultValueRef.current);
const valueRef = (0, _react.useRef)(externalValue);
const changedRef = (0, _react.useRef)();
const hasFocusRef = (0, _react.useRef)();
const revealErrorRef = (0, _react.useRef)(null);
const required = (0, _react.useMemo)(() => {
if (typeof requiredProp !== 'undefined') {
return requiredProp;
}
if (schema || dataContext !== null && dataContext !== void 0 && dataContext.schema) {
const paths = identifier.split('/');
if (paths.length > 0) {
const requiredInSchema = [schema === null || schema === void 0 ? void 0 : schema['required']];
if (paths.length > 1) {
const schema = dataContext.schema;
const pathWithoutLast = paths.slice(0, -1).join('/properties/');
const schemaPart = _jsonPointer.default.has(schema, pathWithoutLast) ? _jsonPointer.default.get(schema, pathWithoutLast) : schema;
const requiredSchemaList = schemaPart === null || schemaPart === void 0 ? void 0 : schemaPart['required'];
if (Array.isArray(requiredSchemaList)) {
const rootPath = pathWithoutLast.replace(/properties\//g, '');
const requiredList = requiredSchemaList.map(path => {
path = cleanPath('/' + path);
return sectionPath && path.startsWith(sectionPath) ? path : joinPath([sectionPath || rootPath, path]);
});
requiredInSchema.push(requiredList);
}
}
const collected = requiredInSchema.flatMap(value => value).filter(Boolean);
if (collected.filter(Boolean).some(path => {
path = cleanPath('/' + path);
return identifier === path || sectionPath === path;
})) {
return true;
}
}
}
}, [cleanPath, dataContext.schema, identifier, joinPath, requiredProp, schema, sectionPath]);
const getFieldByPath = (0, _react.useCallback)(path => {
var _fieldInternalsRef$cu;
return ((_fieldInternalsRef$cu = fieldInternalsRef.current) === null || _fieldInternalsRef$cu === void 0 ? void 0 : _fieldInternalsRef$cu[path]) || {
props: undefined,
id: undefined
};
}, [fieldInternalsRef]);
const errorMessageCacheRef = (0, _react.useRef)(new Map());
const ensureErrorMessageObject = (0, _react.useCallback)(error => {
let key = null;
let returnValue = error;
if (typeof error === 'string') {
key = error;
returnValue = new Error(error);
} else if (error && _react.default.isValidElement(error)) {
key = error.key || (0, _componentHelper.convertJsxToString)(error);
returnValue = new _utils.FormError('Error', {
formattedMessage: error
});
}
if (key) {
if (errorMessageCacheRef.current.has(key)) {
return errorMessageCacheRef.current.get(key);
} else {
errorMessageCacheRef.current.set(key, returnValue);
}
}
return returnValue;
}, []);
const messageCacheRef = (0, _react.useRef)({
isSet: false,
message: undefined
});
const executeMessage = (0, _react.useCallback)(message => {
if (typeof message === 'function') {
const ALWAYS = 4;
const INITIALLY = 8;
let currentMode = ALWAYS;
const msg = message(valueRef.current, {
conditionally: (callback, options) => {
currentMode &= ~ALWAYS;
if (options !== null && options !== void 0 && options.showInitially) {
currentMode |= INITIALLY;
}
return executeMessage(callback());
},
getValueByPath,
getFieldByPath
});
if (msg === undefined) {
messageCacheRef.current.message = undefined;
return null;
}
const isError = msg instanceof Error || msg instanceof _utils.FormError || Array.isArray(msg) && checkForError(msg);
if (!messageCacheRef.current.isSet && currentMode & INITIALLY || currentMode & ALWAYS || hasFocusRef.current === false || messageCacheRef.current.message) {
if (isInternalRerenderRef.current || currentMode & ALWAYS || !messageCacheRef.current.isSet && currentMode & INITIALLY) {
if (msg) {
messageCacheRef.current.isSet = true;
}
if (msg || !hasFocusRef.current || currentMode & ALWAYS) {
messageCacheRef.current.message = msg;
}
}
message = messageCacheRef.current.message;
if (isError && message) {
revealErrorRef.current = true;
}
if (!isError && !message) {
return null;
}
} else {
return undefined;
}
}
return ensureErrorMessageObject(message);
}, [getFieldByPath, getValueByPath, ensureErrorMessageObject]);
const errorProp = initialErrorProp === 'initial' ? undefined : initialErrorProp;
const error = executeMessage(errorProp);
const warning = executeMessage(warningProp);
const info = executeMessage(infoProp);
if (revealErrorRef.current === null) {
revealErrorRef.current = validateInitially !== null && validateInitially !== void 0 ? validateInitially : Boolean(errorProp);
}
const errorMethodRef = (0, _react.useRef)({});
const localErrorRef = (0, _react.useRef)();
const localErrorInitiatorRef = (0, _react.useRef)();
const contextErrorRef = (0, _react.useRef)();
const onChangeValidatorRef = (0, _react.useRef)(onChangeValidator);
(0, _useUpdateEffect.default)(() => {
onChangeValidatorRef.current = onChangeValidator;
}, [onChangeValidator]);
const onBlurValidatorRef = (0, _react.useRef)(onBlurValidator);
(0, _useUpdateEffect.default)(() => {
onBlurValidatorRef.current = onBlurValidator;
}, [onBlurValidator]);
const schemaValidatorRef = (0, _react.useRef)();
if (!schemaValidatorRef.current && schema) {
var _dataContext$ajvInsta;
schemaValidatorRef.current = (_dataContext$ajvInsta = dataContext.ajvInstance) === null || _dataContext$ajvInsta === void 0 ? void 0 : _dataContext$ajvInsta.compile(schema);
}
const asyncBehaviorIsEnabled = (0, _react.useMemo)(() => {
return (0, _isAsync.isAsync)(onChange) || (0, _isAsync.isAsync)(onChangeContext);
}, [onChangeContext, onChange]);
const validatedValueRef = (0, _react.useRef)();
const changeEventResultRef = (0, _react.useRef)(null);
const asyncProcessRef = (0, _react.useRef)(null);
const defineAsyncProcess = (0, _react.useCallback)(name => {
asyncProcessRef.current = name;
}, []);
const asyncBufferRef = (0, _react.useRef)({});
for (const key in asyncBufferRef.current) {
const {
resolve,
validateProcesses
} = asyncBufferRef.current[key] || {};
if ((validateProcesses === null || validateProcesses === void 0 ? void 0 : validateProcesses()) === false) {
delete asyncBufferRef.current[key];
if (typeof resolve === 'function') {
window.requestAnimationFrame(resolve);
}
}
}
const eventPool = (0, _react.useRef)({
onChangeValidator: null,
onBlurValidator: null,
onChangeContext: null,
onChangeLocal: null
});
const addToPool = (0, _react.useCallback)((name, fn, runAsync) => {
if (!eventPool.current[name]) {
eventPool.current[name] = {
fn,
runAsync
};
}
}, []);
const runPool = (0, _react.useCallback)(async function () {
let cb = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
for (const key in eventPool.current) {
if (!eventPool.current[key]) {
continue;
}
const {
fn,
runAsync
} = eventPool.current[key] || {};
if (fn) {
eventPool.current[key] = null;
if (runAsync) {
await fn();
} else {
fn();
}
}
}
cb === null || cb === void 0 ? void 0 : cb();
}, []);
const fieldStateRef = (0, _react.useRef)();
const setFieldState = (0, _react.useCallback)(state => {
fieldStateRef.current = state;
setFieldStateDataContext === null || setFieldStateDataContext === void 0 ? void 0 : setFieldStateDataContext(identifier, resolveValidatingState(state));
setFieldStateFieldBlock === null || setFieldStateFieldBlock === void 0 ? void 0 : setFieldStateFieldBlock(identifier, resolveValidatingState(state));
if (!validateInitially) {
forceUpdate();
}
}, [setFieldStateDataContext, identifier, setFieldStateFieldBlock, validateInitially]);
const setErrorState = (0, _react.useCallback)(hasError => {
setFieldErrorWizard === null || setFieldErrorWizard === void 0 ? void 0 : setFieldErrorWizard(wizardIndex, identifier, handleFieldAsVisible !== false ? hasError : undefined);
showFieldErrorFieldBlock === null || showFieldErrorFieldBlock === void 0 ? void 0 : showFieldErrorFieldBlock(identifier, hasError);
revealErrorBoundary === null || revealErrorBoundary === void 0 ? void 0 : revealErrorBoundary(identifier, hasError);
revealErrorDataContext === null || revealErrorDataContext === void 0 ? void 0 : revealErrorDataContext(identifier, hasError);
}, [identifier, handleFieldAsVisible, revealErrorBoundary, revealErrorDataContext, setFieldErrorWizard, showFieldErrorFieldBlock, wizardIndex]);
const revealError = (0, _react.useCallback)(() => {
if (validateInitially === false && revealErrorRef.current === false) {
revealErrorRef.current = undefined;
return;
}
const hasError = Boolean(localErrorRef.current);
revealErrorRef.current = hasError;
setErrorState(hasError);
}, [validateInitially, setErrorState]);
const hideError = (0, _react.useCallback)(() => {
if (revealErrorRef.current) {
revealErrorRef.current = undefined;
setErrorState(false);
}
}, [setErrorState]);
const errorMessagesCacheRef = (0, _react.useRef)({
errorMessages: null,
extendedErrorMessages: null
});
const combinedErrorMessages = (0, _react.useMemo)(() => {
const cache = errorMessagesCacheRef.current;
if (errorMessages && cache.extendedErrorMessages && Object.values(cache.errorMessages || {}).join('') === Object.values(errorMessages || {}).join('')) {
return cache.extendedErrorMessages;
}
const messages = _objectSpread(_objectSpread(_objectSpread({}, contextErrorMessages), contextErrorMessages === null || contextErrorMessages === void 0 ? void 0 : contextErrorMessages[identifier]), errorMessages);
const extendedErrorMessages = (0, _utils.extendErrorMessagesWithTranslationMessages)((0, _utils.overwriteErrorMessagesWithGivenAjvKeys)(messages), translationRef.current);
errorMessagesCacheRef.current = {
errorMessages,
extendedErrorMessages
};
return extendedErrorMessages;
}, [contextErrorMessages, errorMessages, identifier]);
const prepareError = (0, _react.useCallback)(error => {
const prepare = error => {
if (error instanceof _utils.FormError) {
let message = error.message;
const {
ajvKeyword
} = error;
if (typeof ajvKeyword === 'string') {
const ajvMessage = combinedErrorMessages === null || combinedErrorMessages === void 0 ? void 0 : combinedErrorMessages[ajvKeyword];
if (ajvMessage) {
message = ajvMessage;
}
}
const {
validationRule
} = error;
if (typeof validationRule === 'string') {
const ajvMessage = combinedErrorMessages === null || combinedErrorMessages === void 0 ? void 0 : combinedErrorMessages[validationRule];
if (ajvMessage) {
message = ajvMessage;
}
}
if (combinedErrorMessages !== null && combinedErrorMessages !== void 0 && combinedErrorMessages[message]) {
message = combinedErrorMessages === null || combinedErrorMessages === void 0 ? void 0 : combinedErrorMessages[message];
if (error.messageValues) {
message = Object.entries(error.messageValues || {}).reduce((msg, _ref2) => {
let [key, value] = _ref2;
return msg.replace(`{${key}}`, value);
}, message);
}
} else if (message.includes('.')) {
message = formatMessage(message, error.messageValues);
}
if (_react.default.isValidElement(message)) {
error.formattedMessage = message;
} else {
error.message = message;
}
}
return ensureErrorMessageObject(error);
};
if (Array.isArray(error)) {
return new _utils.FormError('Error', {
errors: error.map(prepare)
});
}
if (error instanceof _utils.FormError) {
if (Array.isArray(error.errors)) {
error.errors = error.errors.map(prepare);
return error;
}
return prepare(error);
}
return error;
}, [combinedErrorMessages, ensureErrorMessageObject, formatMessage]);
contextErrorRef.current = (0, _react.useMemo)(() => {
const dataContextError = dataContextErrors === null || dataContextErrors === void 0 ? void 0 : dataContextErrors[path];
if (!dataContextError) {
return undefined;
}
const error = prepareError(dataContextError);
if ((0, _utils.errorChanged)(error, contextErrorRef.current)) {
return error;
}
return contextErrorRef.current;
}, [dataContextErrors, path, prepareError]);
if (((_localErrorRef$curren = localErrorRef.current) === null || _localErrorRef$curren === void 0 ? void 0 : _localErrorRef$curren['ajvKeyword']) === 'type') {
revealErrorRef.current = true;
}
const getBufferedError = (0, _react.useCallback)(() => {
if (initialErrorProp !== 'initial' && typeof errorProp !== 'function') {
return prepareError(errorProp);
} else if (revealErrorRef.current) {
var _ref3, _prepareError;
return (_ref3 = (_prepareError = prepareError(error)) !== null && _prepareError !== void 0 ? _prepareError : localErrorRef.current) !== null && _ref3 !== void 0 ? _ref3 : contextErrorRef.current;
} else if (error === null) {
return null;
}
}, [error, errorProp, initialErrorProp, prepareError]);
const bufferedError = getBufferedError();
const errorIsVisible = Boolean(bufferedError) || inFieldBlock && fieldBlockContext.hasErrorProp;
const hasError = (0, _react.useCallback)(() => {
var _ref4;
return Boolean((_ref4 = error !== null && error !== void 0 ? error : localErrorRef.current) !== null && _ref4 !== void 0 ? _ref4 : contextErrorRef.current);
}, [error]);
const connectWithPathListenerRef = (0, _react.useRef)(() => {
runOnChangeValidator();
runOnBlurValidator();
});
const handleConnectWithPath = (0, _react.useCallback)(path => {
setFieldEventListener === null || setFieldEventListener === void 0 ? void 0 : setFieldEventListener(path, 'onPathChange', connectWithPathListenerRef.current);
return {
getValue: () => getValueByPath(path)
};
}, [getValueByPath, setFieldEventListener]);
const additionalArgsRef = (0, _react.useRef)({
validators: exportValidators,
props,
dataContext,
getValueByPath,
getSourceValue,
setFieldEventListener
});
additionalArgsRef.current.validators = exportValidators;
additionalArgsRef.current.props = props;
const additionalArgs = (0, _react.useMemo)(() => {
const args = _objectSpread(_objectSpread(_objectSpread({}, combinedErrorMessages), {}, {
errorMessages: combinedErrorMessages
}, additionalArgsRef.current), {}, {
connectWithPath: path => {
return handleConnectWithPath(path);
},
connectWithItemPath: itemPath => {
return handleConnectWithPath(makeIteratePath(itemPath));
}
});
return args;
}, [combinedErrorMessages, handleConnectWithPath, makeIteratePath]);
const callStackRef = (0, _react.useRef)([]);
const hasBeenCalledRef = (0, _react.useCallback)(validator => {
const result = callStackRef.current.includes(validator);
callStackRef.current.push(validator);
return result;
}, []);
const callValidatorFnAsync = (0, _react.useCallback)(async function (validator) {
let value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : valueRef.current;
if (typeof validator !== 'function') {
return;
}
const result = await validator(value, additionalArgs);
if (Array.isArray(result)) {
const errors = [];
for (const validatorOrError of result) {
if (validatorOrError instanceof Error) {
errors.push(validatorOrError);
} else if (!hasBeenCalledRef(validatorOrError)) {
const result = await callValidatorFnAsync(validatorOrError, value);
if (result instanceof Error) {
callStackRef.current = [];
return result;
}
}
}
if (errors.length > 0) {
return new _utils.FormError('Error', {
errors
});
}
callStackRef.current = [];
} else {
return ensureErrorMessageObject(result);
}
}, [additionalArgs, hasBeenCalledRef, ensureErrorMessageObject]);
const callValidatorFnSync = (0, _react.useCallback)(function (validator) {
let value = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : valueRef.current;
if (typeof validator !== 'function') {
return;
}
const result = validator(value, additionalArgs);
if (Array.isArray(result)) {
const hasAsyncValidator = result.some(validator => (0, _isAsync.isAsync)(validator));
if (hasAsyncValidator) {
return new Promise(resolve => {
callValidatorFnAsync(validator, value).then(result => {
resolve(result);
});
});
}
const errors = [];
for (const validatorOrError of result) {
if (validatorOrError instanceof Error) {
errors.push(validatorOrError);
} else if (!hasBeenCalledRef(validatorOrError)) {
const result = callValidatorFnSync(validatorOrError, value);
if (result instanceof Error) {
callStackRef.current = [];
return result;
}
}
}
if (errors.length > 0) {
return new _utils.FormError('Error', {
errors
});
}
callStackRef.current = [];
} else {
return ensureErrorMessageObject(result);
}
}, [additionalArgs, callValidatorFnAsync, hasBeenCalledRef, ensureErrorMessageObject]);
const stateId = (0, _useId.default)();
const persistErrorState = (0, _react.useCallback)(function (method, initiator) {
var _errorMethodRef$curre, _errorMethodRef$curre2;
let errorArg = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : undefined;
const error = prepareError(errorArg);
if (!(0, _utils.errorChanged)(error, localErrorRef.current)) {
return;
}
if (initiator !== 'dataContextError') {
localErrorInitiatorRef.current = initiator;
}
if (method === 'wipe') {
errorMethodRef.current = {};
} else {
errorMethodRef.current[method] = error;
}
if (!error && method === 'gracefully' && ((_errorMethodRef$curre = errorMethodRef.current) !== null && _errorMethodRef$curre !== void 0 && _errorMethodRef$curre.weak || (_errorMethodRef$curre2 = errorMethodRef.current) !== null && _errorMethodRef$curre2 !== void 0 && _errorMethodRef$curre2.gracefully)) {
return;
}
localErrorRef.current = error;
setFieldErrorDataContext === null || setFieldErrorDataContext === void 0 ? void 0 : setFieldErrorDataContext(identifier, error);
setFieldErrorBoundary === null || setFieldErrorBoundary === void 0 ? void 0 : setFieldErrorBoundary(identifier, error);
setBlockRecord === null || setBlockRecord === void 0 ? void 0 : setBlockRecord({
stateId,
identifier,
type: 'error',
content: error,
showInitially: Boolean(inFieldBlock && validateInitially)
});
setFieldStateDataContext === null || setFieldStateDataContext === void 0 ? void 0 : setFieldStateDataContext(identifier, error ? 'error' : undefined);
forceUpdate();
}, [identifier, inFieldBlock, prepareError, setBlockRecord, setFieldErrorBoundary, setFieldErrorDataContext, setFieldStateDataContext, stateId, validateInitially]);
const clearErrorState = (0, _react.useCallback)(() => {
var _schemaValidatorRef$c;
persistErrorState('wipe', undefined);
localErrorInitiatorRef.current = undefined;
if (Array.isArray((_schemaValidatorRef$c = schemaValidatorRef.current) === null || _schemaValidatorRef$c === void 0 ? void 0 : _schemaValidatorRef$c.errors)) {
schemaValidatorRef.current.errors = [];
}
}, [persistErrorState]);
const setChanged = (0, _react.useCallback)(state => {
changedRef.current = state;
}, []);
const validatorCacheRef = (0, _react.useRef)({
onChangeValidator: null,
onBlurValidator: null
});
const revealOnChangeValidatorResult = (0, _react.useCallback)(_ref5 => {
let {
result,
unchangedValue
} = _ref5;
const runAsync = (0, _isAsync.isAsync)(onChangeValidatorRef.current);
if (unchangedValue) {
persistErrorState(runAsync ? 'gracefully' : 'weak', 'onChangeValidator', result);
if (validateInitially && !changedRef.current || validateUnchanged || validateContinuously || runAsync) {
window.requestAnimationFrame(() => {
if (localErrorInitiatorRef.current === 'onChangeValidator') {
revealError();
forceUpdate();
}
});
}
}
if (runAsync) {
defineAsyncProcess(undefined);
if (unchangedValue) {
setFieldState(result instanceof Error ? 'error' : 'complete');
} else {
setFieldState('pending');
}
}
}, [validateContinuously, defineAsyncProcess, persistErrorState, revealError, setFieldState, validateInitially, validateUnchanged]);
const callOnChangeValidator = (0, _react.useCallback)(async () => {
if (typeof onChangeValidatorRef.current !== 'function') {
return {};
}
const tmpValue = valueRef.current;
let result = (0, _isAsync.isAsync)(onChangeValidatorRef.current) ? await callValidatorFnAsync(onChangeValidatorRef.current) : callValidatorFnSync(onChangeValidatorRef.current);
if (result instanceof Promise) {
result = await result;
}
const unchangedValue = tmpValue === valueRef.current;
return {
result,
unchangedValue
};
}, [callValidatorFnAsync, callValidatorFnSync]);
const startOnChangeValidatorValidation = (0, _react.useCallback)(async () => {
if (typeof onChangeValidatorRef.current !== 'function') {
return;
}
if ((0, _isAsync.isAsync)(onChangeValidatorRef.current)) {
defineAsyncProcess('onChangeValidator');
setFieldState('validating');
hideError();
}
const tmpValue = valueRef.current;
let result = (0, _isAsync.isAsync)(onChangeValidatorRef.current) ? await callValidatorFnAsync(onChangeValidatorRef.current) : callValidatorFnSync(onChangeValidatorRef.current);
if (result instanceof Promise) {
result = await result;
}
const unchangedValue = tmpValue === valueRef.current;
revealOnChangeValidatorResult({
result,
unchangedValue
});
return {
result
};
}, [callValidatorFnAsync, callValidatorFnSync, defineAsyncProcess, hideError, revealOnChangeValidatorResult, setFieldState]);
const runOnChangeValidator = (0, _react.useCallback)(async () => {
if (!onChangeValidatorRef.current) {
return;
}
const {
result,
unchangedValue
} = await callOnChangeValidator();
if (String(result) !== String(validatorCacheRef.current.onChangeValidator)) {
if (result) {
revealOnChangeValidatorResult({
result,
unchangedValue
});
} else {
hideError();
clearErrorState();
}
}
validatorCacheRef.current.onChangeValidator = result || null;
}, [callOnChangeValidator, clearErrorState, hideError, revealOnChangeValidatorResult]);
const callOnBlurValidator = (0, _react.useCallback)(async function () {
let {
overrideValue = null
} = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
if (typeof onBlurValidatorRef.current !== 'function') {
return {};
}
const value = transformers.current.toEvent(overrideValue !== null && overrideValue !== void 0 ? overrideValue : valueRef.current, 'onBlurValidator');
let result = (0, _isAsync.isAsync)(onBlurValidatorRef.current) ? await callValidatorFnAsync(onBlurValidatorRef.current, value) : callValidatorFnSync(onBlurValidatorRef.current, value);
if (result instanceof Promise) {
result = await result;
}
return {
result
};
}, [callValidatorFnAsync, callValidatorFnSync]);
const revealOnBlurValidatorResult = (0, _react.useCallback)(_ref6 => {
let {
result
} = _ref6;
persistErrorState('gracefully', 'onBlurValidator', result);
if ((0, _isAsync.isAsync)(onBlurValidatorRef.current)) {
defineAsyncProcess(undefined);
setFieldState(result instanceof Error ? 'error' : 'complete');
}
revealError();
}, [defineAsyncProcess, persistErrorState, revealError, setFieldState]);
const startOnBlurValidatorProcess = (0, _react.useCallback)(async function () {
let {
overrideValue = null
} = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
if (typeof onBlurValidatorRef.current !== 'function') {
return;
}
if ((localErrorInitiatorRef.current === 'required' || localErrorInitiatorRef.current === 'schema') && !asyncBehaviorIsEnabled && !(0, _isAsync.isAsync)(onChangeValidatorRef.current)) {
return;
}
if ((0, _isAsync.isAsync)(onBlurValidatorRef.current)) {
defineAsyncProcess('onBlurValidator');
setFieldState('validating');
}
const value = transformers.current.toEvent(overrideValue !== null && overrideValue !== void 0 ? overrideValue : valueRef.current, 'onBlurValidator');
let result = (0, _isAsync.isAsync)(onBlurValidatorRef.current) ? await callValidatorFnAsync(onBlurValidatorRef.current, value) : callValidatorFnSync(onBlurValidatorRef.current, value);
if (result instanceof Promise) {
result = await result;
}
revealOnBlurValidatorResult({
result
});
return {
result
};
}, [asyncBehaviorIsEnabled, callValidatorFnAsync, callValidatorFnSync, defineAsyncProcess, revealOnBlurValidatorResult, setFieldState]);
const runOnBlurValidator = (0, _react.useCallback)(async () => {
if (!onBlurValidatorRef.current) {
return;
}
const {
result
} = await callOnBlurValidator();
if (String(result) !== String(validatorCacheRef.current.onBlurValidator) && revealErrorRef.current) {
if (result) {
revealOnBlurValidatorResult({
result
});
} else {
hideError();
clearErrorState();
}
}
validatorCacheRef.current.onBlurValidator = result || null;
}, [callOnBlurValidator, clearErrorState, hideError, revealOnBlurValidatorResult]);
const prioritizeContextSchema = (0, _react.useMemo)(() => {
if (errorPrioritization) {
const schemaPath = identifier.split('/').join('/properties/');
const hasContextSchema = _jsonPointer.default.has((dataContext === null || dataContext === void 0 ? void 0 : dataContext.schema) || {}, schemaPath);
return hasContextSchema && (errorPrioritization === null || errorPrioritization === void 0 ? void 0 : errorPrioritization.indexOf('contextSchema')) === 0;
}
}, [dataContext === null || dataContext === void 0 ? void 0 : dataContext.schema, errorPrioritization, identifier]);
const validateValue = (0, _react.useCallback)(async () => {
const isProcessActive = startProcess();
if (disabled) {
if (isProcessActive()) {
clearErrorState();
}
hideError();
setFieldState(undefined);
return;
}
const value = valueRef.current;
changeEventResultRef.current = null;
validatedValueRef.current = null;
let initiator = null;
try {
const requiredError = transformers.current.validateRequired(value, {
emptyValue,
required,
isChanged: changedRef.current,
error: new _utils.FormError('Field.errorRequired')
});
if (requiredError instanceof Error) {
initiator = 'required';
throw requiredError;
}
if (error instanceof Error) {
initiator = 'errorProp';
throw error;
}
if (value !== undefined && !prioritizeContextSchema && typeof schemaValidatorRef.current === 'function') {
if (!schemaValidatorRef.current(value)) {
const error = (0, _utils.ajvErrorsToOneFormError)(schemaValidatorRef.current.errors, value);
initiator = 'schema';
throw error;
}
}
if (onChangeValidatorRef.current && (changedRef.current || validateInitially || validateUnchanged)) {
const {
result
} = await startOnChangeValidatorValidation();
if (result instanceof Error) {
initiator = 'onChangeValidator';
throw result;
}
}
if (onBlurValidatorRef.current && validateInitially && !changedRef.current) {
const {
result
} = await startOnBlurValidatorProcess();
if (result instanceof Error) {
initiator = 'onBlurValidator';
throw result;
}
}
if (isProcessActive()) {
clearErrorState();
}
validatedValueRef.current = value;
} catch (error) {
if (isProcessActive()) {
persistErrorState('weak', initiator, error);
}
}
}, [clearErrorState, disabled, emptyValue, error, hideError, persistErrorState, prioritizeContextSchema, required, setFieldState, startOnBlurValidatorProcess, startOnChangeValidatorValidation, startProcess, validateInitially, validateUnchanged]);
const removeError = (0, _react.useCallback)(() => {
setChanged(false);
hideError();
clearErrorState();
validateValue();
}, [clearErrorState, hideError, setChanged, validateValue]);
const handleError = (0, _react.useCallback)(() => {
if (validateContinuously || validateContinuously !== false && !hasFocusRef.current) {
revealError();
} else {
hideError();
}
}, [validateContinuously, hideError, revealError]);
const getEventArgs = (0, _react.useCallback)(_ref7 => {
let {
eventName,
additionalArgs,
overrideValue = undefined
} = _ref7;
const value = transformers.current.toEvent(overrideValue !== null && overrideValue !== void 0 ? overrideValue : valueRef.current, eventName);
const args = transformers.current.provideAdditionalArgs(value, additionalArgs);
const transformedValue = transformers.current.transformOut(value, args);
if (typeof args !== 'undefined') {
return [transformedValue, args];
}
return [transformedValue];
}, []);
const setHasFocus = (0, _react.useCallback)(async (hasFocus, overrideValue, localAdditionalArgs) => {
const args = getEventArgs({
eventName: hasFocus ? 'onFocus' : 'onBlur',
overrideValue,
additionalArgs: localAdditionalArgs ? _objectSpread(_objectSpread({}, additionalArgs), localAdditionalArgs) : additionalArgs
});
if (hasFocus) {
hasFocusRef.current = true;
onFocus === null || onFocus === void 0 ? void 0 : onFocus.apply(this, args);
setMountedFieldStateDataContext(identifier, {
isFocused: true
});
} else {
hasFocusRef.current = false;
onBlur === null || onBlur === void 0 ? void 0 : onBlur.apply(this, args);
setMountedFieldStateDataContext(identifier, {
isFocused: false
});
if (!changedRef.current && !validateUnchanged) {
return;
}
addToPool('onBlurValidator', async () => await startOnBlurValidatorProcess({
overrideValue
}), (0, _isAsync.isAsync)(onBlurValidatorRef.current));
await runPool(() => {
revealError();
forceUpdate();
});
}
}, [getEventArgs, additionalArgs, onFocus, setMountedFieldStateDataContext, identifier, onBlur, validateUnchanged, addToPool, runPool, startOnBlurValidatorProcess, revealError]);
const yieldAsyncProcess = (0, _react.useCallback)(async _ref8 => {
let {
name,
waitFor
} = _ref8;
return new Promise(resolve => {
const validateProcesses = () => {
const result = waitFor.some(_ref9 => {
let {
processName,
withStates,
hasValue
} = _ref9;
const hasMatchingValue = hasValue === validatedValueRef.current;
const result = (typeof hasValue === 'undefined' ? false : !hasMatchingValue) || (processName ? processName === asyncProcessRef.current : true) && (withStates === null || withStates === void 0 ? void 0 : withStates.some(state => {
return state === fieldStateRef.current;
}));
return result;
});
return result;
};
if (validateProcesses() === true) {
asyncBufferRef.current[name] = {
resolve,
validateProcesses
};
} else {
resolve();
setFieldState('pending');
}
});
}, [setFieldState]);
const handleChangeEventResult = (0, _react.useCallback)(async () => {
const result = changeEventResultRef.current || {};
if ('error' in result) {
if (!result.error) {
removeError();
} else {
persistErrorState('gracefully', 'onChangeValidator', result.error);
revealError();
}
}
if ('warning' in result) {
warningRef.current = result.warning;
}
if ('info' in result) {
infoRef.current = result.info;
}
if (asyncBehaviorIsEnabled) {
await yieldAsyncProcess({
name: 'onSubmitContext',
waitFor: [{
withStates: ['validating']
}]
});
}
defineAsyncProcess(undefined);
if ((result === null || result === void 0 ? void 0 : result.success) === 'saved') {
setFieldState('success');
} else if (result !== null && result !== void 0 && result.error) {
setFieldState('error');
} else if (asyncBehaviorIsEnabled) {
setFieldState('complete');
}
forceUpdate();
}, [asyncBehaviorIsEnabled, defineAsyncProcess, removeError, persistErrorState, revealError, yieldAsyncProcess, setFieldState]);
const setEventResult = (0, _react.useCallback)(async result => {
if (result instanceof Error) {
result = {
error: result
};
}
changeEventResultRef.current = _objectSpread(_objectSpread({}, changeEventResultRef.current), result);
await handleChangeEventResult();
}, [handleChangeEventResult]);
const callOnChangeContext = (0, _react.useCallback)(async () => {
if (asyncBehaviorIsEnabled && !executeOnChangeRegardlessOfError) {
await yieldAsyncProcess({
name: 'onChangeContext',
waitFor: [{
processName: 'onChangeValidator',
withStates: ['validating', 'error'],
hasValue: valueRef.current
}, {
processName: 'onBlurValidator',
withStates: ['validating', 'error'],
hasValue: valueRef.current
}]
});
}
if (hasPath) {
if ((0, _isAsync.isAsync)(onChangeContext)) {
defineAsyncProcess('onChangeContext');
if (!hasError() || executeOnChangeRegardlessOfError) {
await setEventResult(await (handlePathChangeDataContext === null || handlePathChangeDataContext === void 0 ? void 0 : handlePathChangeDataContext(identifier)));
} else {
await setEventResult(null);
}
} else if (onChangeContext || !asyncBehaviorIsEnabled) {
setEventResult(handlePathChangeDataContext === null || handlePathChangeDataContext === void 0 ? void 0 : handlePathChangeDataContext(identifier));
}
}
forceUpdate();
}, [asyncBehaviorIsEnabled, executeOnChangeRegardlessOfError, hasPath, yieldAsyncProcess, onChangeContext, defineAsyncProcess, hasError, setEventResult, handlePathChangeDataContext, identifier]);
const updateValue = (0, _react.useCallback)(async newValue => {
var _transformers$current;
const currentValue = valueRef.current;
if (newValue === currentValue) {
return;
}
const transformedValue = (_transformers$current = transformers.current.transformValue(newValue, currentValue)) !== null && _transformers$current !== void 0 ? _transformers$current : emptyValue;
const contextValue = transformers.current.transformOut(transformedValue, transformers.current.provideAdditionalArgs(transformedValue, additionalArgs));
valueRef.current = transformedValue;
if (hasPath || itemPath) {
handlePathChangeUnvalidatedDataContext(nestedIteratePath || identifier, contextValue);
}
if (itemPath) {
handleChangeIterateContext === null || handleChangeIterateContext === void 0 ? void 0 : handleChangeIterateContext(makeIteratePath(itemPath, ''), contextValue);
}
addToPool('onChangeValidator', validateValue, (0, _isAsync.isAsync)(onChangeValidatorRef.current));
addToPool('onChangeContext', callOnChangeContext, (0, _isAsync.isAsync)(onChangeContext));
await runPool(() => {
handleError();
});
}, [emptyValue, additionalArgs, hasPath, itemPath, addToPool, validateValue, callOnChangeContext, onChangeContext, runPool, handlePathChangeUnvalidatedDataContext, nestedIteratePath, identifier, handleChangeIterateContext, makeIteratePath, handleError]);
const setDisplayValue = (0, _react.useCallback)((value, options) => {
const {
path: fieldPath = itemPath ? identifier : path,
type = 'field'
} = options || {};
if (!fieldPath || !(fieldDisplayValueRef !== null && fieldDisplayValueRef !== void 0 && fieldDisplayValueRef.current)) {
return;
}
fieldDisplayValueRef.current[fieldPath] = valueRef.current === emptyValue ? {
type
} : {
value,
type
};
}, [identifier, emptyValue, fieldDisplayValueRef, itemPath, path]);
const handleChange = (0, _react.useCallback)(async function (argFromInput) {
let localAdditionalArgs = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
const currentValue = valueRef.current;
const fromInput = transformers.current.fromInput(argFromInput);
if (fromInput === currentValue) {
return;
}
setChanged(true);
if (asyncBehaviorIsEnabled) {
hideError();
await updateValue(fromInput);
} else {
updateValue(fromInput);
}
if ((0, _isAsync.isAsync)(onChange)) {
addToPool('onChangeLocal', async () => {
const args = getEventArgs({
eventName: 'onChange',
additionalArgs: localAdditionalArgs ? _objectSpread(_objectSpread({}, additionalArgs), localAdditionalArgs) : additionalArgs
});
await yieldAsyncProcess({
name: 'onChangeLocal',
waitFor: [{
processName: 'onChangeValidator',
withStates: ['validating', 'error'],
hasValue: args[0]
}, {
processName: 'onBlurValidator',
withStates: ['validating', 'error'],
hasValue: args[0]
}, {
processName: 'onChangeContext',
withStates: ['pending', 'error'],
hasValue: args[0]
}]
});
defineAsyncProcess('onChangeLocal');
if (!hasError()) {
await setEventResult(await (onChange ==