@gravity-ui/dynamic-forms 5.1.0 → 5.3.0

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

@@ -11,11 +11,16 @@ const helpers_1 = require("../../helpers");
 const Controller_1 = require("./Controller");
 const hooks_1 = require("./hooks");
 const utils_1 = require("./utils");
-const DynamicField = ({ name, spec, config, Monaco, generateRandomValue, search, withoutInsertFFDebounce, destroyOnUnregister = true, mutators: externalMutators, shared: externalShared, __mirror, }) => {
+const DynamicField = ({ name, spec, config, Monaco, generateRandomValue, search, withoutInsertFFDebounce, destroyOnUnregister = true, mutators: externalMutators, shared: externalShared, storeSubscriber, __mirror, }) => {
     const DynamicFormsCtx = (0, hooks_1.useCreateContext)();
     const SearchContext = (0, hooks_1.useCreateSearchContext)();
     const { tools, store } = (0, hooks_1.useStore)(name);
-    const watcher = (0, hooks_1.useIntegrationFF)(store, withoutInsertFFDebounce, destroyOnUnregister);
+    const watcher = (0, hooks_1.useIntegrationFF)({
+        store,
+        withoutDebounce: withoutInsertFFDebounce,
+        destroyOnUnregister,
+        storeSubscriber,
+    });
     const { mutatorsStore, mutateDFState } = (0, hooks_1.useMutators)(externalMutators);
     const { store: searchStore, setField, removeField, isHiddenField } = (0, hooks_1.useSearchStore)();
     const shared = (0, hooks_1.useFormSharedStore)(externalShared);

package/build/cjs/lib/core/components/Form/hooks/useIntegrationFF.js

@@ -10,7 +10,7 @@ const isFunction_1 = tslib_1.__importDefault(require("lodash/isFunction"));
 const values_1 = tslib_1.__importDefault(require("lodash/values"));
 const react_final_form_1 = require("react-final-form");
 const utils_1 = require("../utils");
-const useIntegrationFF = (store, withoutDebounce, destroyOnUnregister) => {
+const useIntegrationFF = ({ store, withoutDebounce, destroyOnUnregister, storeSubscriber, }) => {
     const form = (0, react_final_form_1.useForm)();
     const watcher = react_1.default.useMemo(() => {
         const props = {
@@ -43,13 +43,14 @@ const useIntegrationFF = (store, withoutDebounce, destroyOnUnregister) => {
         const cb = (value) => {
             if (store.name) {
                 form.change(store.name, (0, get_1.default)((0, utils_1.transformArrOut)(value), store.name));
+                storeSubscriber === null || storeSubscriber === void 0 ? void 0 : storeSubscriber((0, get_1.default)(value, store.name));
             }
         };
         if (withoutDebounce) {
             return cb;
         }
         return (0, debounce_1.default)(cb, 100);
-    }, [form.change, store.name, withoutDebounce]);
+    }, [form.change, store.name, withoutDebounce, storeSubscriber]);
     react_1.default.useEffect(() => {
         change(store.values);
     }, [store.values]);

package/build/cjs/lib/core/components/Form/types/value.js

@@ -1,3 +1,2 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const constants_1 = require("../constants");

package/build/cjs/lib/kit/components/Card/Card.js

@@ -8,6 +8,7 @@ const uikit_1 = require("@gravity-ui/uikit");
 const isString_1 = tslib_1.__importDefault(require("lodash/isString"));
 const common_1 = require("../../constants/common");
 const utils_1 = require("../../utils");
+const HTMLContent_1 = require("../HTMLContent");
 const b = (0, utils_1.block)('card');
 const Card = ({ name, title: propsTitle, description, actions, open: propsOpen, onToggle, alwaysOpen, disableHeaderToggle, checkEmptyBody, children, }) => {
     var _a;
@@ -41,7 +42,8 @@ const Card = ({ name, title: propsTitle, description, actions, open: propsOpen,
                 description ? (react_1.default.createElement("div", { className: b('note') },
                     react_1.default.createElement(uikit_1.HelpMark, { popoverProps: {
                             placement: common_1.COMMON_POPOVER_PLACEMENT,
-                        } }, description))) : null));
+                        } },
+                        react_1.default.createElement(HTMLContent_1.HTMLContent, { html: description })))) : null));
         }
         return propsTitle;
     }, [propsTitle, titlePopoverDisabled, description]);

package/build/cjs/lib/kit/components/ErrorWrapper/ErrorWrapper.css

@@ -39,7 +39,7 @@
 .df-error-wrapper_error .g-text-input_view_normal:not(.df-error-wrapper-ignore) .g-text-input__content,
 .df-error-wrapper_error .yc-checkbox__indicator:not(.df-error-wrapper-ignore)::before,
 .df-error-wrapper_error .g-checkbox__indicator:not(.df-error-wrapper-ignore)::before {
-  border-color: var(--g-color-text-danger);
+  border-color: var(--g-color-line-danger);
 }
 .df-error-wrapper__error-text {
   color: var(--g-color-text-danger);

package/build/cjs/lib/kit/components/HTMLContent/HTMLContent.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HTMLContent = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const HTMLContent = ({ html }) => {
+    return react_1.default.createElement("div", { dangerouslySetInnerHTML: { __html: html } });
+};
+exports.HTMLContent = HTMLContent;

package/build/cjs/lib/kit/components/HTMLContent/index.js

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

package/build/cjs/lib/kit/components/Inputs/CheckboxGroup/CheckboxGroup.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.CheckboxGroup = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const core_1 = require("../../../../core");
 const uikit_1 = require("@gravity-ui/uikit");
+const core_1 = require("../../../../core");
 const utils_1 = require("../../../utils");
 const b = (0, utils_1.block)('checkbox-group');
 const CheckboxGroup = ({ name, input, spec, inputProps }) => {

package/build/cjs/lib/kit/components/Inputs/TableArrayInput/TableArrayInput.js

@@ -9,8 +9,9 @@ const noop_1 = tslib_1.__importDefault(require("lodash/noop"));
 const set_1 = tslib_1.__importDefault(require("lodash/set"));
 const core_1 = require("../../../../core");
 const hooks_1 = require("../../../../core/components/Form/hooks");
-const utils_1 = require("../../../utils");
 const common_1 = require("../../../constants/common");
+const utils_1 = require("../../../utils");
+const HTMLContent_1 = require("../../HTMLContent");
 const b = (0, utils_1.block)('table-array');
 const TableArrayInput = ({ spec, name, arrayInput, input }) => {
     const { isHiddenField } = (0, hooks_1.useSearchContext)();
@@ -54,7 +55,8 @@ const TableArrayInput = ({ spec, name, arrayInput, input }) => {
                     label,
                     react_1.default.createElement(uikit_1.HelpMark, { popoverProps: {
                             placement: common_1.COMMON_POPOVER_PLACEMENT,
-                        } }, description))),
+                        } },
+                        react_1.default.createElement(HTMLContent_1.HTMLContent, { html: description })))),
             template: ({ key, }, idx) => {
                 var _a, _b, _c;
                 const entitySpec = (_a = items === null || items === void 0 ? void 0 : items.properties) === null || _a === void 0 ? void 0 : _a[property];

package/build/cjs/lib/kit/components/Inputs/TextContent/TextContent.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TextContent = exports.TextContentComponent = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const lodash_1 = require("lodash");
 const uikit_1 = require("@gravity-ui/uikit");
+const lodash_1 = require("lodash");
 const cloneDeep_1 = tslib_1.__importDefault(require("lodash/cloneDeep"));
 const utils_1 = require("../../../utils");
 const LazyLoader_1 = require("../../LazyLoader");

package/build/cjs/lib/kit/components/Inputs/TimeRangeSelector/components/TimeRangeSelect/TimeRangeSelect.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TimeRangeSelect = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const isString_1 = tslib_1.__importDefault(require("lodash/isString"));
 const uikit_1 = require("@gravity-ui/uikit");
+const isString_1 = tslib_1.__importDefault(require("lodash/isString"));
 const utils_1 = require("../../../../../utils");
 const Row_1 = require("../../../../Layouts/Row");
 const b = (0, utils_1.block)('time-range-select');

package/build/cjs/lib/kit/components/Layouts/Column/Column.js

@@ -7,8 +7,9 @@ const icons_1 = require("@gravity-ui/icons");
 const uikit_1 = require("@gravity-ui/uikit");
 const core_1 = require("../../../../core");
 const components_1 = require("../../../components");
-const utils_1 = require("../../../utils");
 const common_1 = require("../../../constants/common");
+const utils_1 = require("../../../utils");
+const HTMLContent_1 = require("../../HTMLContent");
 const b = (0, utils_1.block)('column');
 const ColumnBase = ({ name, spec, input, meta, children, }) => {
     const arrayItem = react_1.default.useMemo(() => (0, core_1.isArrayItem)(name), [name]);
@@ -21,7 +22,8 @@ const ColumnBase = ({ name, spec, input, meta, children, }) => {
                     react_1.default.createElement(uikit_1.Text, { className: b('note-inner') },
                         react_1.default.createElement(uikit_1.HelpMark, { popoverProps: {
                                 placement: common_1.COMMON_POPOVER_PLACEMENT,
-                            } }, spec.viewSpec.layoutDescription)))) : null)),
+                            } },
+                            react_1.default.createElement(HTMLContent_1.HTMLContent, { html: spec.viewSpec.layoutDescription }))))) : null)),
         react_1.default.createElement("div", { className: b('second-row') },
             react_1.default.createElement("div", { className: b('second-row-inner') },
                 react_1.default.createElement(components_1.ErrorWrapper, { name: name, meta: meta, withoutChildErrorStyles: 

package/build/cjs/lib/kit/components/Layouts/Row/Row.js

@@ -7,8 +7,9 @@ const icons_1 = require("@gravity-ui/icons");
 const uikit_1 = require("@gravity-ui/uikit");
 const core_1 = require("../../../../core");
 const components_1 = require("../../../components");
-const utils_1 = require("../../../utils");
 const common_1 = require("../../../constants/common");
+const utils_1 = require("../../../utils");
+const HTMLContent_1 = require("../../HTMLContent");
 const b = (0, utils_1.block)('row');
 const RowBase = ({ name, spec, input, meta, verboseDescription, children, }) => {
     const arrayItem = react_1.default.useMemo(() => (0, core_1.isArrayItem)(name), [name]);
@@ -21,7 +22,8 @@ const RowBase = ({ name, spec, input, meta, verboseDescription, children, }) =>
                     react_1.default.createElement(uikit_1.Text, { className: b('note-inner') },
                         react_1.default.createElement(uikit_1.HelpMark, { popoverProps: {
                                 placement: common_1.COMMON_POPOVER_PLACEMENT,
-                            } }, spec.viewSpec.layoutDescription)))) : null)),
+                            } },
+                            react_1.default.createElement(HTMLContent_1.HTMLContent, { html: spec.viewSpec.layoutDescription }))))) : null)),
         react_1.default.createElement("div", { className: b('right') },
             react_1.default.createElement("div", { className: b('right-inner') },
                 react_1.default.createElement(components_1.ErrorWrapper, { name: name, meta: meta, withoutChildErrorStyles: 

package/build/cjs/lib/kit/components/Layouts/Section/Section.js

@@ -5,10 +5,11 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const __1 = require("../../");
-const RemoveButton_1 = require("../../RemoveButton");
 const __2 = require("../../../");
 const core_1 = require("../../../../core");
 const utils_1 = require("../../../utils");
+const HTMLContent_1 = require("../../HTMLContent");
+const RemoveButton_1 = require("../../RemoveButton");
 const b = (0, utils_1.block)('section');
 const SectionBase = (_a) => {
     var _b;
@@ -60,7 +61,8 @@ const SectionBase = (_a) => {
             description = (react_1.default.createElement(uikit_1.Text, { className: b('note') },
                 react_1.default.createElement(uikit_1.HelpMark, { popoverProps: {
                         placement: __2.COMMON_POPOVER_PLACEMENT,
-                    } }, spec.viewSpec.layoutDescription)));
+                    } },
+                    react_1.default.createElement(HTMLContent_1.HTMLContent, { html: spec.viewSpec.layoutDescription }))));
         }
     }
     const layoutTitle = spec.viewSpec.layoutTitle;

package/build/cjs/lib/kit/components/LongValue/LongValue.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.LongValue = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const once_1 = tslib_1.__importDefault(require("lodash/once"));
 const uikit_1 = require("@gravity-ui/uikit");
+const once_1 = tslib_1.__importDefault(require("lodash/once"));
 const utils_1 = require("../../utils");
 const b = (0, utils_1.block)('long-value');
 const LongValue = (_a) => {
@@ -56,8 +56,6 @@ const LongValue = (_a) => {
         }
         return;
     }, [value]);
-    return (react_1.default.createElement(uikit_1.Text, Object.assign({ as: "div" }, restProps, { ref: ref, className: b({ open, long }, className), 
-        // @ts-ignore
-        onClick: long ? handleClick : undefined }), value));
+    return (react_1.default.createElement(uikit_1.Text, Object.assign({ as: "div" }, restProps, { ref: ref, className: b({ open, long }, className), onClick: long ? handleClick : undefined }), value));
 };
 exports.LongValue = LongValue;

package/build/cjs/lib/kit/components/SimpleVerticalAccordeon/SimpleVerticalAccordeon.js

@@ -7,6 +7,7 @@ const icons_1 = require("@gravity-ui/icons");
 const uikit_1 = require("@gravity-ui/uikit");
 const common_1 = require("../../constants/common");
 const utils_1 = require("../../utils");
+const HTMLContent_1 = require("../HTMLContent");
 const b = (0, utils_1.block)('simple-vertical-accordeon');
 const TITLE_TEXT_MAX_WIDTH = 485; /** 533px (COMMON_TITLE_MAX_WIDTH) - 48px of padding */
 class SimpleVerticalAccordeon extends react_1.default.Component {
@@ -92,7 +93,8 @@ class SimpleVerticalAccordeon extends react_1.default.Component {
         return note ? (react_1.default.createElement(uikit_1.Text, { className: b('tooltip') },
             react_1.default.createElement(uikit_1.HelpMark, { popoverProps: {
                     placement: common_1.COMMON_POPOVER_PLACEMENT,
-                } }, note))) : null;
+                } },
+                react_1.default.createElement(HTMLContent_1.HTMLContent, { html: note })))) : null;
     }
 }
 exports.SimpleVerticalAccordeon = SimpleVerticalAccordeon;

package/build/cjs/lib/kit/components/TogglerCard/TogglerCard.js

@@ -4,8 +4,9 @@ exports.TogglerCard = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
-const utils_1 = require("../../utils");
 const common_1 = require("../../constants/common");
+const utils_1 = require("../../utils");
+const HTMLContent_1 = require("../HTMLContent");
 const b = (0, utils_1.block)('toggler-card');
 const TogglerCard = ({ description, title, text, onClick, disabled, selected, }) => {
     return (react_1.default.createElement(uikit_1.Card, { onClick: onClick, type: "selection", disabled: disabled ? !selected : disabled, selected: selected, size: "m", className: b() },
@@ -13,7 +14,8 @@ const TogglerCard = ({ description, title, text, onClick, disabled, selected, })
             react_1.default.createElement(uikit_1.Text, { variant: "subheader-2", ellipsis: true }, title),
             description ? (react_1.default.createElement(uikit_1.HelpMark, { popoverProps: {
                     placement: common_1.COMMON_POPOVER_PLACEMENT,
-                } }, description)) : null),
+                } },
+                react_1.default.createElement(HTMLContent_1.HTMLContent, { html: description }))) : null),
         react_1.default.createElement(uikit_1.Text, { variant: "body-1", color: "secondary", className: b('text') }, text)));
 };
 exports.TogglerCard = TogglerCard;

package/build/cjs/lib/kit/components/ViewLayouts/ViewColumn/ViewColumn.js

@@ -6,8 +6,9 @@ const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const core_1 = require("../../../../core");
 const kit_1 = require("../../../../kit");
-const utils_1 = require("../../../utils");
 const common_1 = require("../../../constants/common");
+const utils_1 = require("../../../utils");
+const HTMLContent_1 = require("../../HTMLContent");
 const b = (0, utils_1.block)('view-column');
 const ViewColumn = ({ value, spec, children, }) => {
     const { showLayoutDescription } = (0, core_1.useDynamicFormsCtx)();
@@ -19,7 +20,8 @@ const ViewColumn = ({ value, spec, children, }) => {
             react_1.default.createElement(uikit_1.Text, { color: "secondary", ellipsis: true }, spec.viewSpec.layoutTitle),
             showLayoutDescription && spec.viewSpec.layoutDescription ? (react_1.default.createElement(uikit_1.HelpMark, { className: b('note'), popoverProps: {
                     placement: common_1.COMMON_POPOVER_PLACEMENT,
-                } }, spec.viewSpec.layoutDescription)) : null),
+                } },
+                react_1.default.createElement(HTMLContent_1.HTMLContent, { html: spec.viewSpec.layoutDescription }))) : null),
         react_1.default.createElement("div", { className: b('second-row') }, children),
         react_1.default.createElement(kit_1.CopyButton, { spec: spec, value: value })));
 };

package/build/cjs/lib/kit/components/ViewLayouts/ViewRow/ViewRow.js

@@ -6,8 +6,9 @@ const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const core_1 = require("../../../../core");
 const kit_1 = require("../../../../kit");
-const utils_1 = require("../../../utils");
 const common_1 = require("../../../constants/common");
+const utils_1 = require("../../../utils");
+const HTMLContent_1 = require("../../HTMLContent");
 const b = (0, utils_1.block)('view-row');
 const ViewRow = ({ value, spec, children, }) => {
     const { showLayoutDescription } = (0, core_1.useDynamicFormsCtx)();
@@ -19,7 +20,8 @@ const ViewRow = ({ value, spec, children, }) => {
             react_1.default.createElement(uikit_1.Text, { whiteSpace: "nowrap", color: "secondary", ellipsis: true }, spec.viewSpec.layoutTitle),
             showLayoutDescription && spec.viewSpec.layoutDescription ? (react_1.default.createElement(uikit_1.HelpMark, { className: b('note'), popoverProps: {
                     placement: common_1.COMMON_POPOVER_PLACEMENT,
-                } }, spec.viewSpec.layoutDescription)) : null,
+                } },
+                react_1.default.createElement(HTMLContent_1.HTMLContent, { html: spec.viewSpec.layoutDescription }))) : null,
             react_1.default.createElement("div", { className: b('dots') })),
         react_1.default.createElement("div", { className: b('right') }, children),
         react_1.default.createElement(kit_1.CopyButton, { spec: spec, value: value })));

package/build/cjs/lib/kit/components/Views/DateView/DateView.js

@@ -3,9 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.DateView = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const components_1 = require("../../../components");
 const date_utils_1 = require("@gravity-ui/date-utils");
 const isObject_1 = tslib_1.__importDefault(require("lodash/isObject"));
+const components_1 = require("../../../components");
 const DateView = (_a) => {
     var { value, spec } = _a, restProps = tslib_1.__rest(_a, ["value", "spec"]);
     const { printFormat = components_1.DEFAULT_DATE_FORMAT, outputFormat, timeZone, } = spec.viewSpec.dateInput || {};

package/build/cjs/lib/kit/components/Views/MultiOneOfView/MultiOneOfView.js

@@ -6,9 +6,9 @@ const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const isObjectLike_1 = tslib_1.__importDefault(require("lodash/isObjectLike"));
 const core_1 = require("../../../../core");
+const common_1 = require("../../../constants/common");
 const utils_1 = require("../../../utils");
 const GroupIndent_1 = require("../../GroupIndent");
-const common_1 = require("../../../constants/common");
 const b = (0, utils_1.block)('multi-oneof-view');
 const MultiOneOfView = (props) => {
     const { name, value, Layout, spec, withoutIndent } = props;

package/build/cjs/lib/kit/components/Views/MultiSelectView/MultiSelectView.js

@@ -4,8 +4,8 @@ exports.MultiSelectView = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
-const utils_1 = require("../../../utils");
 const common_1 = require("../../../constants/common");
+const utils_1 = require("../../../utils");
 const b = (0, utils_1.block)('multiselect-view');
 const MultiSelectView = ({ spec, value = [] }) => {
     const _value = value;

package/build/cjs/lib/kit/components/Views/ObjectBaseView/ObjectBaseView.js

@@ -3,8 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ObjectInlineView = exports.ObjectBaseView = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const isObjectLike_1 = tslib_1.__importDefault(require("lodash/isObjectLike"));
 const uikit_1 = require("@gravity-ui/uikit");
+const isObjectLike_1 = tslib_1.__importDefault(require("lodash/isObjectLike"));
 const core_1 = require("../../../../core");
 const utils_1 = require("../../../utils");
 const b = (0, utils_1.block)('object-base-view');

package/build/cjs/lib/kit/components/Views/TableArrayView/TableArrayView.js

@@ -5,8 +5,9 @@ const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const core_1 = require("../../../../core");
-const utils_1 = require("../../../utils");
 const common_1 = require("../../../constants/common");
+const utils_1 = require("../../../utils");
+const HTMLContent_1 = require("../../HTMLContent");
 const b = (0, utils_1.block)('table-array-view');
 const TableArrayView = ({ value = [], spec, name }) => {
     const { showLayoutDescription } = (0, core_1.useDynamicFormsCtx)();
@@ -28,7 +29,8 @@ const TableArrayView = ({ value = [], spec, name }) => {
                     label,
                     react_1.default.createElement(uikit_1.HelpMark, { popoverProps: {
                             placement: common_1.COMMON_POPOVER_PLACEMENT,
-                        } }, description)))
+                        } },
+                        react_1.default.createElement(HTMLContent_1.HTMLContent, { html: description }))))
                 : label,
             template: (_, idx) => {
                 var _a;

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

@@ -4,11 +4,11 @@ exports.isCorrectSizeParams = exports.prepareSpec = exports.isNotEmptyValue = vo
 const tslib_1 = require("tslib");
 const cloneDeep_1 = tslib_1.__importDefault(require("lodash/cloneDeep"));
 const isArray_1 = tslib_1.__importDefault(require("lodash/isArray"));
+const isEmpty_1 = tslib_1.__importDefault(require("lodash/isEmpty"));
 const isNil_1 = tslib_1.__importDefault(require("lodash/isNil"));
 const isObject_1 = tslib_1.__importDefault(require("lodash/isObject"));
 const isObjectLike_1 = tslib_1.__importDefault(require("lodash/isObjectLike"));
 const isString_1 = tslib_1.__importDefault(require("lodash/isString"));
-const isEmpty_1 = tslib_1.__importDefault(require("lodash/isEmpty"));
 const core_1 = require("../../core");
 const helpers_1 = require("../validators/helpers");
 const bigIntMath_1 = require("./bigIntMath");

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

@@ -1,5 +1,5 @@
-import { FormValue, Spec } from '../../../types';
-import { FieldValue, ValidateError } from '../types';
+import type { FormValue, Spec } from '../../../types';
+import type { FieldValue, ValidateError } from '../types';
 export interface ControllerProps<DirtyValue extends FieldValue, SpecType extends Spec> {
     spec: SpecType;
     name: string;

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { FormValue, Spec } from '../../../types';
-import { DynamicFormConfig, DynamicFormMutatorsStore, DynamicFormsContext, FieldRenderProps, FieldValue, IndependentInputEntity, InputEntity, LayoutType, ValidateError } from '../types';
+import type { FormValue, Spec } from '../../../types';
+import type { DynamicFormConfig, DynamicFormMutatorsStore, DynamicFormsContext, FieldRenderProps, FieldValue, IndependentInputEntity, InputEntity, LayoutType, ValidateError } from '../types';
 export interface GetSpecParams<SpecType extends Spec> {
     name: string;
     spec: SpecType;

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

@@ -1,6 +1,6 @@
-import { FormValue, Spec } from '../../../types';
-import { BaseValidateError, FieldRenderProps, FieldValue, ValidateError } from '../types';
-import { ControllerStore, GetComponentsParams, GetComponentsReturn, GetFieldInitialsParams, GetFieldMethodsReturn, GetRenderParams, GetSpecParams, GetValidateParams, InitializeStoreParams, UpdateStoreParams } from './types';
+import type { FormValue, Spec } from '../../../types';
+import type { BaseValidateError, FieldRenderProps, FieldValue, ValidateError } from '../types';
+import type { ControllerStore, GetComponentsParams, GetComponentsReturn, GetFieldInitialsParams, GetFieldMethodsReturn, GetRenderParams, GetSpecParams, GetValidateParams, InitializeStoreParams, UpdateStoreParams } from './types';
 export declare const updateParentStore: <DirtyValue extends FieldValue, Value extends FormValue, SpecType extends Spec<any, undefined, undefined>>(store: ControllerStore<DirtyValue, Value, SpecType>) => void;
 export declare const callUnmout: <DirtyValue extends FieldValue, Value extends FormValue, SpecType extends Spec<any, undefined, undefined>>(store: ControllerStore<DirtyValue, Value, SpecType>) => void;
 export declare const getSpec: <SpecType extends Spec<any, undefined, undefined>>({ name, spec, mutatorsStore, }: GetSpecParams<SpecType>) => SpecType;

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { MonacoEditorProps } from 'react-monaco-editor/lib/types';
-import { Spec, StringSpec } from '../../types';
-import { DynamicFormConfig, DynamicFormMutators, FieldValue, WonderMirror } from './types';
+import type { Spec, StringSpec } from '../../types';
+import type { DynamicFormConfig, DynamicFormMutators, FieldValue, WonderMirror } from './types';
 export interface DynamicFieldProps {
     name: string;
     spec: Spec;
@@ -13,6 +13,7 @@ export interface DynamicFieldProps {
     destroyOnUnregister?: boolean;
     mutators?: DynamicFormMutators;
     shared?: Record<string, any>;
+    storeSubscriber?: (store: FieldValue) => void;
     __mirror?: WonderMirror;
 }
 export declare const DynamicField: React.FC<DynamicFieldProps>;

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

@@ -7,11 +7,16 @@ import { isCorrectSpec } from '../../helpers';
 import { Controller } from './Controller';
 import { useCreateContext, useCreateSearchContext, useDynamicFieldMirror, useFormSharedStore, useIntegrationFF, useMutators, useSearchStore, useStore, } from './hooks';
 import { getDefaultSearchFunction, isCorrectConfig } from './utils';
-export const DynamicField = ({ name, spec, config, Monaco, generateRandomValue, search, withoutInsertFFDebounce, destroyOnUnregister = true, mutators: externalMutators, shared: externalShared, __mirror, }) => {
+export const DynamicField = ({ name, spec, config, Monaco, generateRandomValue, search, withoutInsertFFDebounce, destroyOnUnregister = true, mutators: externalMutators, shared: externalShared, storeSubscriber, __mirror, }) => {
     const DynamicFormsCtx = useCreateContext();
     const SearchContext = useCreateSearchContext();
     const { tools, store } = useStore(name);
-    const watcher = useIntegrationFF(store, withoutInsertFFDebounce, destroyOnUnregister);
+    const watcher = useIntegrationFF({
+        store,
+        withoutDebounce: withoutInsertFFDebounce,
+        destroyOnUnregister,
+        storeSubscriber,
+    });
     const { mutatorsStore, mutateDFState } = useMutators(externalMutators);
     const { store: searchStore, setField, removeField, isHiddenField } = useSearchStore();
     const shared = useFormSharedStore(externalShared);

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

@@ -1,2 +1,2 @@
-import { ControllerMirror, WonderMirror } from '../types';
+import type { ControllerMirror, WonderMirror } from '../types';
 export declare const useControllerMirror: (name: string, params: ControllerMirror, __mirror?: WonderMirror) => void;

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

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

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

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

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

@@ -1,2 +1,2 @@
-import { DynamicFieldMirror, WonderMirror } from '../types';
+import type { DynamicFieldMirror, WonderMirror } from '../types';
 export declare const useDynamicFieldMirror: (params: DynamicFieldMirror, __mirror?: WonderMirror) => void;

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

@@ -1,2 +1,9 @@
-import { DynamicFieldStore } from '../types';
-export declare const useIntegrationFF: (store: DynamicFieldStore, withoutDebounce?: boolean, destroyOnUnregister?: boolean) => JSX.Element;
+import type { DynamicFieldStore, FieldValue } from '../types';
+interface UseIntegrationFFParams {
+    store: DynamicFieldStore;
+    withoutDebounce?: boolean;
+    destroyOnUnregister?: boolean;
+    storeSubscriber?: (store: FieldValue) => void;
+}
+export declare const useIntegrationFF: ({ store, withoutDebounce, destroyOnUnregister, storeSubscriber, }: UseIntegrationFFParams) => JSX.Element;
+export {};

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

@@ -6,7 +6,7 @@ import isFunction from 'lodash/isFunction';
 import values from 'lodash/values';
 import { Field as FinalFormField, useForm } from 'react-final-form';
 import { transformArrOut } from '../utils';
-export const useIntegrationFF = (store, withoutDebounce, destroyOnUnregister) => {
+export const useIntegrationFF = ({ store, withoutDebounce, destroyOnUnregister, storeSubscriber, }) => {
     const form = useForm();
     const watcher = React.useMemo(() => {
         const props = {
@@ -39,13 +39,14 @@ export const useIntegrationFF = (store, withoutDebounce, destroyOnUnregister) =>
         const cb = (value) => {
             if (store.name) {
                 form.change(store.name, get(transformArrOut(value), store.name));
+                storeSubscriber === null || storeSubscriber === void 0 ? void 0 : storeSubscriber(get(value, store.name));
             }
         };
         if (withoutDebounce) {
             return cb;
         }
         return debounce(cb, 100);
-    }, [form.change, store.name, withoutDebounce]);
+    }, [form.change, store.name, withoutDebounce, storeSubscriber]);
     React.useEffect(() => {
         change(store.values);
     }, [store.values]);

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

@@ -1,4 +1,4 @@
-import { DynamicFormMutators, DynamicFormMutatorsStore } from '../types';
+import type { DynamicFormMutators, DynamicFormMutatorsStore } from '../types';
 export declare const useMutators: (externalMutators?: DynamicFormMutators) => {
     mutatorsStore: DynamicFormMutatorsStore;
     mutateDFState: (mutators: DynamicFormMutators) => void;

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

@@ -1,4 +1,4 @@
-import { Spec } from '../../../../types';
-import { FieldValue } from '../../types';
+import type { Spec } from '../../../../types';
+import type { FieldValue } from '../../types';
 import './useSearch.css';
 export declare const useSearch: (spec: Spec, value: FieldValue, name: string) => (children: JSX.Element | null) => JSX.Element | null;

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

@@ -1,4 +1,4 @@
-import { DynamicFieldStore, FieldObjectValue, FieldValue, ValidateError } from '../types';
+import type { DynamicFieldStore, FieldObjectValue, FieldValue, ValidateError } from '../types';
 export declare const useStore: (name: string) => {
     tools: {
         initialValue: FieldObjectValue;

package/build/esm/lib/core/components/Form/types/array.d.ts

@@ -1,5 +1,5 @@
-import { ArraySpec, ArrayValue } from '../../../types';
-import { FieldArrayValue, IndependentInputEntity, IndependentInputProps, IndependentInputType, InputEntity, InputProps, InputType, InputsMap, LayoutProps, LayoutType, LayoutsMap, TypeConfig, ValidatorsMap } from './';
+import type { ArraySpec, ArrayValue } from '../../../types';
+import type { FieldArrayValue, IndependentInputEntity, IndependentInputProps, IndependentInputType, InputEntity, InputProps, InputType, InputsMap, LayoutProps, LayoutType, LayoutsMap, TypeConfig, ValidatorsMap } from './';
 export type ArrayInputProps<InputComponentProps extends Record<string, any> | undefined = undefined> = InputProps<FieldArrayValue, InputComponentProps, undefined, ArraySpec<undefined, InputComponentProps, undefined>>;
 export type ArrayIndependentInputProps<InputComponentProps extends Record<string, any> | undefined = undefined, LayoutComponentProps extends Record<string, any> | undefined = undefined> = IndependentInputProps<FieldArrayValue, InputComponentProps, LayoutComponentProps, ArraySpec<undefined, InputComponentProps, LayoutComponentProps>>;
 export type ArrayLayoutProps<InputComponentProps extends Record<string, any> | undefined = undefined, LayoutComponentProps extends Record<string, any> | undefined = undefined> = LayoutProps<FieldArrayValue, InputComponentProps, LayoutComponentProps, ArraySpec<undefined, InputComponentProps, LayoutComponentProps>>;

package/build/esm/lib/core/components/Form/types/boolean.d.ts

@@ -1,5 +1,5 @@
-import { BooleanSpec } from '../../../types';
-import { IndependentInputEntity, IndependentInputProps, IndependentInputType, InputEntity, InputProps, InputType, InputsMap, LayoutProps, LayoutType, LayoutsMap, TypeConfig, ValidatorsMap } from './';
+import type { BooleanSpec } from '../../../types';
+import type { IndependentInputEntity, IndependentInputProps, IndependentInputType, InputEntity, InputProps, InputType, InputsMap, LayoutProps, LayoutType, LayoutsMap, TypeConfig, ValidatorsMap } from './';
 export type BooleanInputProps<InputComponentProps extends Record<string, any> | undefined = undefined> = InputProps<boolean, InputComponentProps, undefined, BooleanSpec<undefined, InputComponentProps, undefined>>;
 export type BooleanIndependentInputProps<InputComponentProps extends Record<string, any> | undefined = undefined, LayoutComponentProps extends Record<string, any> | undefined = undefined> = IndependentInputProps<boolean, InputComponentProps, LayoutComponentProps, BooleanSpec<undefined, InputComponentProps, LayoutComponentProps>>;
 export type BooleanLayoutProps<InputComponentProps extends Record<string, any> | undefined = undefined, LayoutComponentProps extends Record<string, any> | undefined = undefined> = LayoutProps<boolean, InputComponentProps, LayoutComponentProps, BooleanSpec<undefined, InputComponentProps, LayoutComponentProps>>;

package/build/esm/lib/core/components/Form/types/config.d.ts

@@ -1,5 +1,5 @@
-import { FormValue, Spec } from '../../../types';
-import { ArrayConfig, BooleanConfig, FieldValue, InputsMap, LayoutsMap, NumberConfig, ObjectConfig, StringConfig, ValidatorsMap } from './';
+import type { FormValue, Spec } from '../../../types';
+import type { ArrayConfig, BooleanConfig, FieldValue, InputsMap, LayoutsMap, NumberConfig, ObjectConfig, StringConfig, ValidatorsMap } from './';
 export interface TypeConfig<DirtyValue extends FieldValue, Value extends FormValue, SpecType extends Spec<undefined, any, any>> {
     inputs: InputsMap<DirtyValue, SpecType>;
     layouts: LayoutsMap<DirtyValue, SpecType>;

package/build/esm/lib/core/components/Form/types/context.d.ts

@@ -1,7 +1,7 @@
-import React from 'react';
+import type React from 'react';
 import type { MonacoEditorProps } from 'react-monaco-editor/lib/types';
-import { StringSpec } from '../../../types';
-import { DynamicFieldStore, DynamicFormConfig, DynamicFormMutators, DynamicFormMutatorsStore, FieldValue, ValidateError, WonderMirror } from './';
+import type { StringSpec } from '../../../types';
+import type { DynamicFieldStore, DynamicFormConfig, DynamicFormMutators, DynamicFormMutatorsStore, FieldValue, ValidateError, WonderMirror } from './';
 export interface DynamicFormsContext {
     config: DynamicFormConfig;
     Monaco?: React.ComponentType<MonacoEditorProps>;