@gravity-ui/dynamic-forms 1.0.0 → 1.0.1

package/build/cjs/lib/kit/utils/common.js

@@ -0,0 +1,151 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isCorrectSizeParams = exports.prepareSpec = exports.isNotEmptyValue = exports.getChildError = void 0;
+const tslib_1 = require("tslib");
+const final_form_1 = require("final-form");
+const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const core_1 = require("../../core");
+const helpers_1 = require("../validators/helpers");
+const bigIntMath_1 = require("./bigIntMath");
+const getChildError = (name, errors, head) => {
+    const error = lodash_1.default.get(errors, name);
+    if (!head && (error === null || error === void 0 ? void 0 : error[final_form_1.ARRAY_ERROR])) {
+        return true;
+    }
+    else if (lodash_1.default.isArray(error)) {
+        return error.some((itemError, idx) => {
+            if (lodash_1.default.isArray(itemError) || lodash_1.default.isObjectLike(itemError)) {
+                return (0, exports.getChildError)(`${name}[${idx}]`, errors);
+            }
+            return Boolean(itemError);
+        });
+    }
+    else if (lodash_1.default.isObjectLike(error)) {
+        return Object.keys(error).some((key) => {
+            if (lodash_1.default.isArray(error[key]) || lodash_1.default.isObjectLike(error[key])) {
+                return (0, exports.getChildError)(`${name}.${key}`, errors);
+            }
+            return Boolean(error[key]);
+        });
+    }
+    return false;
+};
+exports.getChildError = getChildError;
+const isNotEmptyValue = (value, spec) => {
+    var _a;
+    if (lodash_1.default.isNil(value)) {
+        return false;
+    }
+    if (lodash_1.default.isString(value)) {
+        if (!value) {
+            return false;
+        }
+        if ((0, core_1.isStringSpec)(spec) && ((_a = spec.viewSpec.hideValues) === null || _a === void 0 ? void 0 : _a.includes(value))) {
+            return false;
+        }
+    }
+    if (lodash_1.default.isObject(value) && (0, core_1.isObjectSpec)(spec)) {
+        const keys = Object.keys(value);
+        // the only case when an empty object is considered a non-empty value is when it is a stub for oneof
+        if (!keys.filter((key) => { var _a; return (0, exports.isNotEmptyValue)(value[key], (_a = spec.properties) === null || _a === void 0 ? void 0 : _a[key]); }).length &&
+            spec.viewSpec.type !== 'oneof') {
+            return false;
+        }
+    }
+    if (lodash_1.default.isArray(value) &&
+        (0, core_1.isArraySpec)(spec) &&
+        !value.filter((item) => (0, exports.isNotEmptyValue)(item, spec.items)).length) {
+        return false;
+    }
+    return true;
+};
+exports.isNotEmptyValue = isNotEmptyValue;
+const prepareSpec = (spec, parseJsonDefaultValue) => {
+    var _a, _b, _c;
+    if (lodash_1.default.isObjectLike(spec)) {
+        const result = lodash_1.default.cloneDeep(spec);
+        if (lodash_1.default.isString(result.type)) {
+            result.type = result.type.toLowerCase();
+        }
+        if (!lodash_1.default.isNil(result.defaultValue)) {
+            let _defaultValue = result.defaultValue;
+            if (parseJsonDefaultValue) {
+                try {
+                    _defaultValue = JSON.parse(result.defaultValue);
+                }
+                catch (_d) {
+                    _defaultValue = undefined;
+                }
+            }
+            if (typeof _defaultValue === result.type) {
+                result.defaultValue = _defaultValue;
+            }
+            else {
+                result.defaultValue = undefined;
+            }
+        }
+        if (lodash_1.default.isString((_a = result.viewSpec) === null || _a === void 0 ? void 0 : _a.type)) {
+            result.viewSpec.type = result.viewSpec.type.toLowerCase();
+        }
+        if (lodash_1.default.isString((_b = result.viewSpec) === null || _b === void 0 ? void 0 : _b.layout)) {
+            result.viewSpec.layout = result.viewSpec.layout.toLowerCase();
+        }
+        if (lodash_1.default.isString((_c = result.viewSpec) === null || _c === void 0 ? void 0 : _c.themeLabel)) {
+            result.viewSpec.themeLabel = result.viewSpec.themeLabel.toLowerCase();
+        }
+        if (lodash_1.default.isString(result.validator)) {
+            result.validator = result.validator.toLowerCase();
+        }
+        if (result.maxLength === '0' &&
+            result.minLength === '0') {
+            result.maxLength = undefined;
+            result.minLength = undefined;
+        }
+        else {
+            if (!lodash_1.default.isNil(result.maxLength) && (0, helpers_1.isFloat)(`${result.maxLength}`)) {
+                result.maxLength = BigInt(result.maxLength);
+            }
+            if (!lodash_1.default.isNil(result.minLength) && (0, helpers_1.isFloat)(`${result.minLength}`)) {
+                result.minLength = BigInt(result.minLength);
+            }
+        }
+        if (result.items) {
+            result.items = (0, exports.prepareSpec)(result.items, parseJsonDefaultValue);
+        }
+        if (result.maximum === 0 && result.minimum === 0) {
+            result.maximum = undefined;
+            result.minimum = undefined;
+        }
+        else {
+            if (!lodash_1.default.isNil(result.maximum) && (0, helpers_1.isFloat)(`${result.maximum}`)) {
+                result.maximum = Number(result.maximum);
+            }
+            if (!lodash_1.default.isNil(result.minimum) && (0, helpers_1.isFloat)(`${result.minimum}`)) {
+                result.minimum = Number(result.minimum);
+            }
+        }
+        if (lodash_1.default.isString(result.format)) {
+            result.format = result.format.toLowerCase();
+        }
+        if (lodash_1.default.isObjectLike(result.properties)) {
+            Object.keys(result.properties).forEach((key) => {
+                result.properties[key] = (0, exports.prepareSpec)(result.properties[key], parseJsonDefaultValue);
+            });
+        }
+        return result;
+    }
+    return spec;
+};
+exports.prepareSpec = prepareSpec;
+const isCorrectSizeParams = (spec) => {
+    const { sizeParams } = spec.viewSpec;
+    if (!sizeParams ||
+        !lodash_1.default.isString(sizeParams.defaultType) ||
+        !lodash_1.default.isObject(sizeParams.scale) ||
+        !sizeParams.scale[sizeParams.defaultType] ||
+        Object.values(sizeParams.scale).some(({ factor }) => !(0, bigIntMath_1.divide)(factor, factor))) {
+        return false;
+    }
+    return true;
+};
+exports.isCorrectSizeParams = isCorrectSizeParams;

package/build/cjs/lib/kit/utils/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./cn"), exports);
+tslib_1.__exportStar(require("./common"), exports);
+tslib_1.__exportStar(require("./bigIntMath"), exports);

package/build/cjs/lib/kit/validators/helpers.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isFloat = exports.isInt = void 0;
+const isInt = (value) => {
+    const regex = /^(?:[-+]?(?:0|[1-9]\d*))$/;
+    return regex.test(value);
+};
+exports.isInt = isInt;
+const isFloat = (value) => {
+    const regex = /^(?:[-+]?(?:\d+))?(?:\.\d*)?(?:[eE][+-]?(?:\d+))?$/;
+    return regex.test(value);
+};
+exports.isFloat = isFloat;

package/build/cjs/lib/kit/validators/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./messages"), exports);
+tslib_1.__exportStar(require("./validators"), exports);

package/build/cjs/lib/kit/validators/messages.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ErrorMessages = void 0;
+const tslib_1 = require("tslib");
+const i18n_1 = tslib_1.__importDefault(require("../i18n"));
+const configure_1 = require("../i18n/configure");
+const getErrorMessages = () => ({
+    REQUIRED: (0, i18n_1.default)('label_error-required'),
+    INVALID: (0, i18n_1.default)('label_error-invalid'),
+    INT: (0, i18n_1.default)('label_error-int'),
+    NUMBER: (0, i18n_1.default)('label_error-number'),
+    minLength(count) {
+        return (0, i18n_1.default)('label_error-min-length', { count });
+    },
+    minLengthArr(count) {
+        return (0, i18n_1.default)('label_error-min-length-array', { count });
+    },
+    maxLength(count) {
+        return (0, i18n_1.default)('label_error-max-length', { count });
+    },
+    maxLengthArr(count) {
+        return (0, i18n_1.default)('label_error-max-length-array', { count });
+    },
+    minNumber(count) {
+        return (0, i18n_1.default)('label_error-min-number', { count });
+    },
+    maxNumber(count) {
+        return (0, i18n_1.default)('label_error-max-number', { count });
+    },
+    SPACE_START: (0, i18n_1.default)('label_error-space-start'),
+    SPACE_END: (0, i18n_1.default)('label_error-space-end'),
+    DOT_END: (0, i18n_1.default)('label_error-dot-end'),
+    ZERO_START: (0, i18n_1.default)('label_error-zero-start'),
+});
+exports.ErrorMessages = getErrorMessages();
+(0, configure_1.subscribeConfigure)(() => {
+    exports.ErrorMessages = getErrorMessages();
+});

package/build/cjs/lib/kit/validators/validators.js

@@ -0,0 +1,133 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getStringValidator = exports.getObjectValidator = exports.getNumberValidator = exports.getBooleanValidator = exports.getArrayValidator = void 0;
+const tslib_1 = require("tslib");
+const lodash_1 = tslib_1.__importDefault(require("lodash"));
+const validators_1 = require("../validators");
+const helpers_1 = require("./helpers");
+const getArrayValidator = (params = {}) => {
+    const { ignoreRequiredCheck, ignoreMaxLengthCheck, ignoreMinLengthCheck } = params;
+    return (spec, value) => {
+        const valueLength = (value === null || value === void 0 ? void 0 : value.length) || 0;
+        if (!ignoreRequiredCheck && spec.required && !lodash_1.default.isArray(value)) {
+            return validators_1.ErrorMessages.REQUIRED;
+        }
+        if (!ignoreMaxLengthCheck &&
+            typeof spec.maxLength === 'bigint' &&
+            valueLength > spec.maxLength) {
+            return validators_1.ErrorMessages.maxLengthArr(spec.maxLength);
+        }
+        if (!ignoreMinLengthCheck &&
+            typeof spec.minLength === 'bigint' &&
+            valueLength < spec.minLength) {
+            return validators_1.ErrorMessages.minLengthArr(spec.minLength);
+        }
+        return false;
+    };
+};
+exports.getArrayValidator = getArrayValidator;
+const getBooleanValidator = (params = {}) => {
+    const { ignoreRequiredCheck } = params;
+    return (spec, value) => {
+        if (!ignoreRequiredCheck && spec.required && !value) {
+            return validators_1.ErrorMessages.REQUIRED;
+        }
+        return false;
+    };
+};
+exports.getBooleanValidator = getBooleanValidator;
+const getNumberValidator = (params = {}) => {
+    const { ignoreRequiredCheck, ignoreSpaceStartCheck, ignoreSpaceEndCheck, ignoreNumberCheck, ignoreMaximumCheck, ignoreMinimumCheck, ignoreIntCheck, } = params;
+    return (spec, value = '') => {
+        const stringValue = String(value);
+        if (!ignoreRequiredCheck && spec.required && !stringValue.length) {
+            return validators_1.ErrorMessages.REQUIRED;
+        }
+        if (stringValue.length) {
+            if (!ignoreSpaceStartCheck && !stringValue[0].trim()) {
+                return validators_1.ErrorMessages.SPACE_START;
+            }
+            if (!ignoreSpaceEndCheck && !stringValue[stringValue.length - 1].trim()) {
+                return validators_1.ErrorMessages.SPACE_END;
+            }
+            if (stringValue[stringValue.length - 1] === '.') {
+                return validators_1.ErrorMessages.DOT_END;
+            }
+            if (!ignoreNumberCheck && !(0, helpers_1.isFloat)(stringValue)) {
+                return validators_1.ErrorMessages.NUMBER;
+            }
+            if ((stringValue.length > 1 && stringValue[0] === '0' && stringValue[1] !== '.') ||
+                (stringValue.length > 2 &&
+                    stringValue.substring(0, 2) === '-0' &&
+                    stringValue[2] !== '.')) {
+                return validators_1.ErrorMessages.ZERO_START;
+            }
+        }
+        if (!ignoreMaximumCheck &&
+            lodash_1.default.isNumber(spec.maximum) &&
+            stringValue.length &&
+            Number(stringValue) > spec.maximum) {
+            return validators_1.ErrorMessages.maxNumber(spec.maximum);
+        }
+        if (!ignoreMinimumCheck &&
+            lodash_1.default.isNumber(spec.minimum) &&
+            stringValue.length &&
+            spec.minimum > Number(stringValue)) {
+            return validators_1.ErrorMessages.minNumber(spec.minimum);
+        }
+        if (lodash_1.default.isString(spec.format) && stringValue.length) {
+            if (!ignoreIntCheck && spec.format === 'int64' && !(0, helpers_1.isInt)(stringValue)) {
+                return validators_1.ErrorMessages.INT;
+            }
+        }
+        return false;
+    };
+};
+exports.getNumberValidator = getNumberValidator;
+const getObjectValidator = (params = {}) => {
+    const { ignoreRequiredCheck } = params;
+    return (spec, value) => {
+        if (!ignoreRequiredCheck && spec.required && !value) {
+            return validators_1.ErrorMessages.REQUIRED;
+        }
+        return false;
+    };
+};
+exports.getObjectValidator = getObjectValidator;
+const getStringValidator = (params = {}) => {
+    const { ignoreRequiredCheck, ignoreSpaceStartCheck, ignoreSpaceEndCheck, ignoreMaxLengthCheck, ignoreMinLengthCheck, ignoreRegExpCheck, } = params;
+    return (spec, value = '') => {
+        const valueLength = value === null || value === void 0 ? void 0 : value.length;
+        if (!ignoreRequiredCheck && spec.required && !valueLength) {
+            return validators_1.ErrorMessages.REQUIRED;
+        }
+        if (valueLength) {
+            if (!ignoreSpaceStartCheck && !value[0].trim()) {
+                return validators_1.ErrorMessages.SPACE_START;
+            }
+            if (!ignoreSpaceEndCheck && !value[value.length - 1].trim()) {
+                return validators_1.ErrorMessages.SPACE_END;
+            }
+        }
+        if (!ignoreMaxLengthCheck &&
+            typeof spec.maxLength === 'bigint' &&
+            valueLength > spec.maxLength) {
+            return validators_1.ErrorMessages.maxLength(spec.maxLength);
+        }
+        if (!ignoreMinLengthCheck &&
+            typeof spec.minLength === 'bigint' &&
+            valueLength < spec.minLength) {
+            return validators_1.ErrorMessages.minLength(spec.minLength);
+        }
+        if (lodash_1.default.isString(spec.pattern) && spec.pattern.length) {
+            const regex = new RegExp(spec.pattern);
+            if (!ignoreRegExpCheck && !regex.test(value)) {
+                return lodash_1.default.isString(spec.patternError) && spec.patternError.length
+                    ? spec.patternError
+                    : validators_1.ErrorMessages.INVALID;
+            }
+        }
+        return false;
+    };
+};
+exports.getStringValidator = getStringValidator;

package/build/esm/index.d.ts

@@ -0,0 +1 @@
+export * from './lib';

package/build/esm/index.js

@@ -0,0 +1 @@
+export * from './lib';

package/build/esm/lib/core/components/Form/Controller.d.ts

@@ -0,0 +1,9 @@
+import { Spec } from '../../types';
+import { FieldValue, ValidateError } from './types';
+export interface ControllerProps<Value extends FieldValue, SpecType extends Spec> {
+    spec: SpecType;
+    name: string;
+    initialValue: Value;
+    parentOnChange: ((childName: string, childValue: FieldValue, childErrors: Record<string, ValidateError>) => void) | null;
+}
+export declare const Controller: <Value extends FieldValue, SpecType extends Spec>({ spec, name, initialValue, parentOnChange, }: ControllerProps<Value, SpecType>) => JSX.Element | null;

package/build/esm/lib/core/components/Form/Controller.js

@@ -0,0 +1,14 @@
+import _ from 'lodash';
+import { isCorrectSpec } from '../../helpers';
+import { useComponents, useDynamicFormsCtx, useField, useRender, useValidate } from './hooks';
+export const Controller = ({ spec, name, initialValue, parentOnChange, }) => {
+    const { tools } = useDynamicFormsCtx();
+    const { inputEntity, Layout } = useComponents(spec);
+    const render = useRender({ name, spec, inputEntity, Layout });
+    const validate = useValidate(spec);
+    const renderProps = useField({ name, initialValue, spec, validate, tools, parentOnChange });
+    if (_.isString(name) && isCorrectSpec(spec)) {
+        return render(renderProps);
+    }
+    return null;
+};

package/build/esm/lib/core/components/Form/DynamicField.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { MonacoEditorProps } from 'react-monaco-editor/lib/types';
+import { Spec } from '../../types';
+import { DynamicFormConfig } from './types';
+export interface DynamicFieldProps {
+    name: string;
+    spec: Spec;
+    config: DynamicFormConfig;
+    Monaco?: React.ComponentType<MonacoEditorProps>;
+}
+export declare const DynamicField: React.FC<DynamicFieldProps>;

package/build/esm/lib/core/components/Form/DynamicField.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import _ from 'lodash';
+import { isValidElementType } from 'react-is';
+import { isCorrectSpec } from '../../helpers';
+import { Controller } from './Controller';
+import { isCorrectConfig } from './helpers';
+import { useCreateContext, useStore } from './hooks';
+export const DynamicField = ({ name, spec, config, Monaco }) => {
+    const DynamicFormsCtx = useCreateContext();
+    const { tools, watcher } = useStore(name);
+    const context = React.useMemo(() => ({
+        config,
+        Monaco: isValidElementType(Monaco) ? Monaco : undefined,
+        tools,
+    }), [tools, config, Monaco]);
+    const correctParams = React.useMemo(() => _.isString(name) && isCorrectSpec(spec) && isCorrectConfig(config), [name, spec, config]);
+    if (correctParams) {
+        return (React.createElement(DynamicFormsCtx.Provider, { value: context },
+            React.createElement(Controller, { spec: spec, name: name, parentOnChange: null, initialValue: _.get(tools.initialValue, name) }),
+            watcher));
+    }
+    return null;
+};

package/build/esm/lib/core/components/Form/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const REMOVED_ITEM = "____removed-item";
+export declare const OBJECT_ARRAY_FLAG = "____arr-obj";
+export declare const OBJECT_ARRAY_CNT = "____arr-obj-cnt";

package/build/esm/lib/core/components/Form/constants.js

@@ -0,0 +1,3 @@
+export const REMOVED_ITEM = '____removed-item';
+export const OBJECT_ARRAY_FLAG = '____arr-obj';
+export const OBJECT_ARRAY_CNT = '____arr-obj-cnt';

package/build/esm/lib/core/components/Form/helpers.d.ts

@@ -0,0 +1,5 @@
+import { FormValue } from '../../types';
+export declare const isCorrectConfig: (candidate: any) => boolean;
+export declare const transformArrIn: <Type extends FormValue, ReturnType_1 extends FormValue = Type>(value: Type) => ReturnType_1;
+export declare const transformArrOut: <Type extends FormValue, ReturnType_1 extends FormValue = Type>(value: Type) => ReturnType_1;
+export declare const isArrayItem: (name: string) => boolean;

package/build/esm/lib/core/components/Form/helpers.js

@@ -0,0 +1,45 @@
+import _ from 'lodash';
+import { SpecTypes } from '../../constants';
+import { OBJECT_ARRAY_CNT, OBJECT_ARRAY_FLAG, REMOVED_ITEM } from './constants';
+export const isCorrectConfig = (candidate) => Object.values(SpecTypes).every((type) => _.isObjectLike(candidate) &&
+    _.isObjectLike(candidate[type]) &&
+    _.isObjectLike(candidate[type].inputs) &&
+    _.isObjectLike(candidate[type].layouts) &&
+    _.isObjectLike(candidate[type].validators));
+export const transformArrIn = (value) => {
+    if (_.isArray(value)) {
+        return value.reduce((arrObj, item, idx) => {
+            arrObj[`<${idx}>`] = transformArrIn(item);
+            return arrObj;
+        }, { [OBJECT_ARRAY_FLAG]: true, [OBJECT_ARRAY_CNT]: value.length });
+    }
+    if (_.isObject(value)) {
+        const _value = Object.assign({}, value);
+        _.forEach(_value, (item, key) => {
+            _value[key] = transformArrIn(item);
+        });
+        return _value;
+    }
+    return value;
+};
+export const transformArrOut = (value) => {
+    if (_.isObject(value) && !_.isArray(value)) {
+        if (value[OBJECT_ARRAY_FLAG]) {
+            const _value = Object.keys(value)
+                .filter((key) => key !== OBJECT_ARRAY_FLAG &&
+                key !== OBJECT_ARRAY_CNT &&
+                value[key] !== REMOVED_ITEM)
+                .map((key) => key.split('<').join('').split('>').join(''))
+                .sort((a, b) => Number(a) - Number(b))
+                .map((key) => transformArrOut(value[`<${key}>`]));
+            return _value;
+        }
+        const _value = Object.assign({}, value);
+        _.forEach(_value, (item, key) => {
+            _value[key] = transformArrOut(item);
+        });
+        return _value;
+    }
+    return value;
+};
+export const isArrayItem = (name) => name[name.length - 1] === '>';

package/build/esm/lib/core/components/Form/hooks/index.d.ts

@@ -0,0 +1,8 @@
+export * from './useComponents';
+export * from './useCreateContext';
+export * from './useDynamicFormsCtx';
+export * from './useField';
+export * from './useRender';
+export * from './useStore';
+export * from './useValidate';
+export * from './useMonaco';

package/build/esm/lib/core/components/Form/hooks/index.js

@@ -0,0 +1,8 @@
+export * from './useComponents';
+export * from './useCreateContext';
+export * from './useDynamicFormsCtx';
+export * from './useField';
+export * from './useRender';
+export * from './useStore';
+export * from './useValidate';
+export * from './useMonaco';

package/build/esm/lib/core/components/Form/hooks/useComponents.d.ts

@@ -0,0 +1,6 @@
+import { FormValue, Spec } from '../../../types';
+import { FieldValue, IndependentInputEntity, InputEntity, LayoutType } from '../types';
+export declare const useComponents: <DirtyValue extends FieldValue, Value extends FormValue, SpecType extends Spec>(spec: SpecType) => {
+    inputEntity: InputEntity<DirtyValue, SpecType> | IndependentInputEntity<DirtyValue, SpecType> | undefined;
+    Layout: LayoutType<DirtyValue, SpecType> | undefined;
+};

package/build/esm/lib/core/components/Form/hooks/useComponents.js

@@ -0,0 +1,35 @@
+import React from 'react';
+import _ from 'lodash';
+import { isValidElementType } from 'react-is';
+import { isCorrectSpec } from '../../../helpers';
+import { isCorrectConfig } from '../helpers';
+import { useDynamicFormsCtx } from './';
+export const useComponents = (spec) => {
+    var _a, _b;
+    const { config } = useDynamicFormsCtx();
+    const { inputs, layouts } = React.useMemo(() => {
+        if (isCorrectConfig(config) && isCorrectSpec(spec)) {
+            return config[spec.type];
+        }
+        return {};
+    }, [config, spec]);
+    const inputEntity = React.useMemo(() => {
+        if (inputs) {
+            const entity = inputs[spec.viewSpec.type];
+            if (isValidElementType(entity === null || entity === void 0 ? void 0 : entity.Component)) {
+                return entity;
+            }
+        }
+        return;
+    }, [inputs, (_a = spec === null || spec === void 0 ? void 0 : spec.viewSpec) === null || _a === void 0 ? void 0 : _a.type]);
+    const Layout = React.useMemo(() => {
+        if (layouts && _.isString(spec.viewSpec.layout)) {
+            const Component = layouts[spec.viewSpec.layout];
+            if (isValidElementType(Component)) {
+                return Component;
+            }
+        }
+        return;
+    }, [layouts, (_b = spec === null || spec === void 0 ? void 0 : spec.viewSpec) === null || _b === void 0 ? void 0 : _b.layout]);
+    return { inputEntity, Layout };
+};

package/build/esm/lib/core/components/Form/hooks/useCreateContext.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { DynamicFormsContext } from '../types';
+export declare const useCreateContext: () => React.Context<DynamicFormsContext>;

package/build/esm/lib/core/components/Form/hooks/useCreateContext.js

@@ -0,0 +1,4 @@
+import React from 'react';
+import _ from 'lodash';
+const createContext = _.once(() => React.createContext({}));
+export const useCreateContext = () => createContext();

package/build/esm/lib/core/components/Form/hooks/useDynamicFormsCtx.d.ts

@@ -0,0 +1 @@
+export declare const useDynamicFormsCtx: () => import("..").DynamicFormsContext;

package/build/esm/lib/core/components/Form/hooks/useDynamicFormsCtx.js

@@ -0,0 +1,7 @@
+import React from 'react';
+import { useCreateContext } from './';
+export const useDynamicFormsCtx = () => {
+    const DynamicFormsCtx = useCreateContext();
+    const context = React.useContext(DynamicFormsCtx);
+    return context;
+};

package/build/esm/lib/core/components/Form/hooks/useField.d.ts

@@ -0,0 +1,11 @@
+import { Spec } from '../../../types';
+import { DynamicFormsContext, FieldRenderProps, FieldValue, ValidateError } from '../types';
+export interface FieldProps<Value extends FieldValue, SpecType extends Spec> {
+    name: string;
+    spec: SpecType;
+    initialValue: Value;
+    validate?: (value?: Value) => ValidateError;
+    tools: DynamicFormsContext['tools'];
+    parentOnChange: ((childName: string, childValue: FieldValue, childErrors: Record<string, ValidateError>) => void) | null;
+}
+export declare const useField: <Value extends FieldValue, SpecType extends Spec>({ name, spec, initialValue, validate: propsValidate, tools, parentOnChange, }: FieldProps<Value, SpecType>) => FieldRenderProps<Value>;