@skbkontur/react-ui-validations 1.16.2 → 2.0.0-beta.0

package/index.d.ts

@@ -53,7 +53,7 @@ declare module '@skbkontur/react-ui-validations/src/ValidationContainer' {
         submit(validationSettings?: ValidationSettings): Promise<void>;
         validate(withoutFocus?: boolean): Promise<boolean>;
         validate(validationSettings?: ValidationSettings): Promise<boolean>;
-        render(): JSX.Element;
+        render(): React.JSX.Element;
     }
     export {};
 }
@@ -71,7 +71,7 @@ declare module '@skbkontur/react-ui-validations/src/ValidationTooltip' {
     export class ValidationTooltip extends React.Component<ValidationTooltipProps> {
         static __KONTUR_REACT_UI__: string;
         static displayName: string;
-        render(): JSX.Element;
+        render(): React.JSX.Element;
     }
 }
 
@@ -111,7 +111,7 @@ declare module '@skbkontur/react-ui-validations/src/ValidationWrapperInternal' {
         componentWillUnmount(): void;
         componentDidUpdate(): void;
         focus(): Promise<void>;
-        render(): JSX.Element;
+        render(): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
         getRootNode: () => Nullable<Element>;
         getControlPosition(): Nullable<Point>;
         processBlur(): Promise<void>;
@@ -141,7 +141,7 @@ declare module '@skbkontur/react-ui-validations/src/ValidationWrapper' {
     export class ValidationWrapper extends React.Component<ValidationWrapperProps> {
         static __KONTUR_REACT_UI__: string;
         static displayName: string;
-        render(): JSX.Element;
+        render(): React.JSX.Element;
     }
 }
 
@@ -180,7 +180,7 @@ declare module '@skbkontur/react-ui-validations/src/ValidationContextWrapper' {
         onValidationRemoved(): void;
         getChildWrappersSortedByPosition(): ValidationWrapperInternal[];
         validate(withoutFocusOrValidationSettings: ValidateArgumentType): Promise<boolean>;
-        render(): JSX.Element;
+        render(): React.JSX.Element;
     }
 }
 
@@ -214,18 +214,16 @@ declare module '@skbkontur/react-ui-validations/typings/Types' {
 
 declare module '@skbkontur/react-ui-validations/src/utils/featureFlagsContext/ValidationsFeatureFlagsContext' {
     import React from 'react';
-    export type FeatureFlags = 'validationsRemoveExtraSpans' | 'fixedValidationTextColors' | 'darkTheme';
+    export type FeatureFlags = '';
     export type ValidationsFeatureFlags = Partial<Record<FeatureFlags, boolean>>;
     export const validationsFeatureFlagsDefault: ValidationsFeatureFlags;
-    export const ValidationsFeatureFlagsContext: React.Context<Partial<Record<FeatureFlags, boolean>>>;
+    export const ValidationsFeatureFlagsContext: React.Context<Partial<Record<"", boolean>>>;
 }
 
 declare module '@skbkontur/react-ui-validations/src/utils/featureFlagsContext/FeatureFlagsHelpers' {
     import { ValidationsFeatureFlags } from '@skbkontur/react-ui-validations/src/utils/featureFlagsContext/ValidationsFeatureFlagsContext';
     export const getFullValidationsFlagsContext: (flags: ValidationsFeatureFlags) => {
-        validationsRemoveExtraSpans?: boolean | undefined;
-        fixedValidationTextColors?: boolean | undefined;
-        darkTheme?: boolean | undefined;
+        ""?: boolean | undefined;
     };
 }
 

package/index.js

@@ -1,25 +1,84 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
 var React = require('react');
 var warning = require('warning');
 var reactDom = require('react-dom');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+var DEFAULT_TEXT_COLOR = '#d43517';
+function getValidationTextColor(theme, level) {
+    if (level === void 0) { level = 'error'; }
+    return ((level === 'warning' ? theme.validationsTextColorWarning : theme.validationsTextColorError) || DEFAULT_TEXT_COLOR);
+}
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var warning__default = /*#__PURE__*/_interopDefaultLegacy(warning);
+/**
+ * Проверяет, не является ли переданный аргумент null или undefined и исключает типы null и undefined из типа аргумента
+ *
+ * @param value Значение, которое нужно проверить и исключить из него типы
+ * @returns Возвращает true, если переданный аргумент не является null или undefined иначе false
+ */
+var isNonNullable = function (value) {
+    return value !== null && value !== undefined;
+};
 
-var validationsFeatureFlagsDefault = {
-    validationsRemoveExtraSpans: false,
-    fixedValidationTextColors: false,
+var defaultOrNamed = function (module, component) {
+    return module && module.__esModule && module.default ? module.default : module[component];
 };
-var ValidationsFeatureFlagsContext = React__default["default"].createContext(validationsFeatureFlagsDefault);
-ValidationsFeatureFlagsContext.displayName = 'ValidationsFeatureFlagsContext';
-ValidationsFeatureFlagsContext.__KONTUR_REACT_UI__ = 'ValidationsFeatureFlagsContext';
+var importContext = function (module, component) { return module[component] || React.createContext({}); };
+var Tooltip = defaultOrNamed(require('@skbkontur/react-ui/components/Tooltip'), 'Tooltip');
+var ThemeContext = importContext(require('@skbkontur/react-ui/lib/theming/ThemeContext'), 'ThemeContext');
+var ReactUiDetection = /** @class */ (function () {
+    function ReactUiDetection() {
+    }
+    ReactUiDetection.isDatePicker = function (childrenArray) {
+        var _a;
+        return isNonNullable(childrenArray) && ((_a = childrenArray.type) === null || _a === void 0 ? void 0 : _a.__KONTUR_REACT_UI__) === 'DatePicker';
+    };
+    ReactUiDetection.isRadioGroup = function (childrenArray) {
+        var _a;
+        return isNonNullable(childrenArray) && ((_a = childrenArray.type) === null || _a === void 0 ? void 0 : _a.__KONTUR_REACT_UI__) === 'RadioGroup';
+    };
+    ReactUiDetection.isTokenInput = function (childrenArray) {
+        var _a;
+        return isNonNullable(childrenArray) && ((_a = childrenArray.type) === null || _a === void 0 ? void 0 : _a.__KONTUR_REACT_UI__) === 'TokenInput';
+    };
+    ReactUiDetection.isSwitcher = function (childrenArray) {
+        var _a;
+        return isNonNullable(childrenArray) && ((_a = childrenArray.type) === null || _a === void 0 ? void 0 : _a.__KONTUR_REACT_UI__) === 'Switcher';
+    };
+    ReactUiDetection.isComboBox = function (childrenArray) {
+        var _a;
+        return isNonNullable(childrenArray) && ((_a = childrenArray.type) === null || _a === void 0 ? void 0 : _a.__KONTUR_REACT_UI__) === 'ComboBox';
+    };
+    return ReactUiDetection;
+}());
 
-/*! *****************************************************************************
+var ValidationText = function (_a) {
+    var pos = _a.pos, children = _a.children, validation = _a.validation, dataTid = _a["data-tid"];
+    var theme = React.useContext(ThemeContext);
+    var color = getValidationTextColor(theme, validation === null || validation === void 0 ? void 0 : validation.level);
+    if (pos === 'right') {
+        var childrenAndValidationText_1 = (React.createElement(React.Fragment, null,
+            children,
+            React.createElement("span", { "data-tid": dataTid, "data-validation-message": "text", style: { marginLeft: '10px', color: color } }, (validation && validation.message) || '')));
+        return React.createElement("div", { style: { display: 'inline-block' } }, childrenAndValidationText_1);
+    }
+    var validationText = (React.createElement("span", { "data-tid": dataTid, "data-validation-message": "text", style: {
+            color: color,
+            overflow: 'visible',
+            whiteSpace: 'nowrap',
+            position: 'absolute',
+            top: '2px',
+            left: 0,
+        } }, (validation && validation.message) || ''));
+    var childrenAndValidationText = (React.createElement(React.Fragment, null,
+        children,
+        React.createElement("span", { style: { position: 'absolute', bottom: 0, left: 0, height: 0 } }, validationText)));
+    return React.createElement("div", { style: { position: 'relative', display: 'inline-block' } }, childrenAndValidationText);
+};
+ValidationText.__KONTUR_REACT_UI__ = 'ValidationText';
+ValidationText.displayName = 'ValidationText';
+
+/******************************************************************************
 Copyright (c) Microsoft Corporation.
 
 Permission to use, copy, modify, and/or distribute this software for any
@@ -33,7 +92,7 @@ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
 OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
 PERFORMANCE OF THIS SOFTWARE.
 ***************************************************************************** */
-/* global Reflect, Promise */
+/* global Reflect, Promise, SuppressedError, Symbol */
 
 var extendStatics = function(d, b) {
     extendStatics = Object.setPrototypeOf ||
@@ -89,7 +148,7 @@ function __generator(thisArg, body) {
     function verb(n) { return function (v) { return step([n, v]); }; }
     function step(op) {
         if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
             if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
             if (y = 0, t) op = [op[0] & 2, t.value];
             switch (op[0]) {
@@ -119,126 +178,34 @@ function __spreadArray(to, from, pack) {
         }
     }
     return to.concat(ar || Array.prototype.slice.call(from));
-}
-
-var getFullValidationsFlagsContext = function (flags) {
-    return __assign(__assign({}, validationsFeatureFlagsDefault), flags);
-};
-
-var DEFAULT_TEXT_COLOR = '#d43517';
-function getValidationTextColor(flags, theme, level) {
-    if (level === void 0) { level = 'error'; }
-    if (flags.fixedValidationTextColors) {
-        if (!theme.validationsTextColorWarning && !theme.validationsTextColorError) {
-            switch (level) {
-                case 'warning':
-                    return flags.darkTheme ? '#fdd481' : '#ef8b17';
-                case 'error':
-                    return flags.darkTheme ? '#ff887b' : '#cb3d35';
-            }
-        }
-        return ((level === 'warning' ? theme.validationsTextColorWarning : theme.validationsTextColorError) || DEFAULT_TEXT_COLOR);
-    }
-    return DEFAULT_TEXT_COLOR;
-}
-
-/**
- * Проверяет, не является ли переданный аргумент null или undefined и исключает типы null и undefined из типа аргумента
- *
- * @param value Значение, которое нужно проверить и исключить из него типы
- * @returns Возвращает true, если переданный аргумент не является null или undefined иначе false
- */
-var isNonNullable = function (value) {
-    return value !== null && value !== undefined;
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-var defaultOrNamed = function (module, component) {
-    return module && module.__esModule && module.default ? module.default : module[component];
-};
-var importContext = function (module, component) { return module[component] || React__default["default"].createContext({}); };
-var Tooltip = defaultOrNamed(require('@skbkontur/react-ui/components/Tooltip'), 'Tooltip');
-var ThemeContext = importContext(require('@skbkontur/react-ui/lib/theming/ThemeContext'), 'ThemeContext');
-var ReactUiDetection = /** @class */ (function () {
-    function ReactUiDetection() {
-    }
-    ReactUiDetection.isDatePicker = function (childrenArray) {
-        var _a;
-        return isNonNullable(childrenArray) && ((_a = childrenArray.type) === null || _a === void 0 ? void 0 : _a.__KONTUR_REACT_UI__) === 'DatePicker';
-    };
-    ReactUiDetection.isRadioGroup = function (childrenArray) {
-        var _a;
-        return isNonNullable(childrenArray) && ((_a = childrenArray.type) === null || _a === void 0 ? void 0 : _a.__KONTUR_REACT_UI__) === 'RadioGroup';
-    };
-    ReactUiDetection.isTokenInput = function (childrenArray) {
-        var _a;
-        return isNonNullable(childrenArray) && ((_a = childrenArray.type) === null || _a === void 0 ? void 0 : _a.__KONTUR_REACT_UI__) === 'TokenInput';
-    };
-    ReactUiDetection.isSwitcher = function (childrenArray) {
-        var _a;
-        return isNonNullable(childrenArray) && ((_a = childrenArray.type) === null || _a === void 0 ? void 0 : _a.__KONTUR_REACT_UI__) === 'Switcher';
-    };
-    ReactUiDetection.isComboBox = function (childrenArray) {
-        var _a;
-        return isNonNullable(childrenArray) && ((_a = childrenArray.type) === null || _a === void 0 ? void 0 : _a.__KONTUR_REACT_UI__) === 'ComboBox';
-    };
-    return ReactUiDetection;
-}());
-
-var ValidationText = function (_a) {
-    var pos = _a.pos, children = _a.children, validation = _a.validation, dataTid = _a["data-tid"];
-    var theme = React.useContext(ThemeContext);
-    var featureFlags = getFullValidationsFlagsContext(React.useContext(ValidationsFeatureFlagsContext));
-    var color = getValidationTextColor(featureFlags, theme, validation === null || validation === void 0 ? void 0 : validation.level);
-    if (pos === 'right') {
-        var childrenAndValidationText = (React__default["default"].createElement(React__default["default"].Fragment, null,
-            children,
-            React__default["default"].createElement("span", { "data-tid": dataTid, "data-validation-message": "text", style: { marginLeft: '10px', color: color } }, (validation && validation.message) || '')));
-        return featureFlags.validationsRemoveExtraSpans ? (childrenAndValidationText) : (React__default["default"].createElement("span", { style: { display: 'inline-block' } }, childrenAndValidationText));
-    }
-    var validationText = (React__default["default"].createElement("span", { "data-tid": dataTid, "data-validation-message": "text", style: {
-            color: color,
-            overflow: 'visible',
-            whiteSpace: 'nowrap',
-            position: 'absolute',
-            top: '2px',
-            left: 0,
-        } }, (validation && validation.message) || ''));
-    return featureFlags.validationsRemoveExtraSpans ? (React__default["default"].createElement(React__default["default"].Fragment, null,
-        children,
-        React__default["default"].createElement("span", { style: { position: 'absolute', display: 'block' } }, validationText))) : (React__default["default"].createElement("span", { style: { position: 'relative', display: 'inline-block' } },
-        children,
-        React__default["default"].createElement("span", { style: { position: 'absolute', bottom: 0, left: 0, height: 0 } }, validationText)));
-};
-ValidationText.__KONTUR_REACT_UI__ = 'ValidationText';
-ValidationText.displayName = 'ValidationText';
-
 var ValidationTooltip = /** @class */ (function (_super) {
     __extends(ValidationTooltip, _super);
     function ValidationTooltip() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     ValidationTooltip.prototype.render = function () {
-        var _this = this;
         var _a = this.props, children = _a.children, pos = _a.pos, error = _a.error, render = _a.render, rest = __rest(_a, ["children", "pos", "error", "render"]);
-        var onlyChild = React__default["default"].Children.only(children);
+        var onlyChild = React.Children.only(children);
         var child = onlyChild && onlyChild.props ? onlyChild.props.children : null;
-        return (React__default["default"].createElement(ValidationsFeatureFlagsContext.Consumer, null, function (flags) {
-            _this.featureFlags = getFullValidationsFlagsContext(flags);
-            return !_this.featureFlags.validationsRemoveExtraSpans &&
-                (ReactUiDetection.isRadioGroup(child) ||
-                    ReactUiDetection.isTokenInput(child) ||
-                    ReactUiDetection.isSwitcher(child)) ? (React__default["default"].createElement(Tooltip, __assign({ useWrapper: false, pos: pos, render: error && render, trigger: 'hover&focus' }, rest), child)) : (React__default["default"].createElement(Tooltip, __assign({ pos: pos, render: error && render, trigger: 'hover&focus' }, rest), children));
-        }));
+        return ReactUiDetection.isRadioGroup(child) ||
+            ReactUiDetection.isTokenInput(child) ||
+            ReactUiDetection.isSwitcher(child) ? (React.createElement(Tooltip, __assign({ useWrapper: false, pos: pos, render: error && render, trigger: 'hover&focus' }, rest), child)) : (React.createElement(Tooltip, __assign({ pos: pos, render: error && render, trigger: 'hover&focus' }, rest), children));
     };
     ValidationTooltip.__KONTUR_REACT_UI__ = 'ValidationTooltip';
     ValidationTooltip.displayName = 'ValidationTooltip';
     return ValidationTooltip;
-}(React__default["default"].Component));
+}(React.Component));
 
-/* eslint-disable react/display-name */
 function tooltip(pos) {
     return function (control, hasError, validation) {
-        return (React__default["default"].createElement(ValidationTooltip, { pos: pos, error: hasError, render: function () {
+        return (React.createElement(ValidationTooltip, { pos: pos, error: hasError, render: function () {
                 if (!validation || !validation.message) {
                     return null;
                 }
@@ -249,11 +216,11 @@ function tooltip(pos) {
 function text(pos) {
     if (pos === void 0) { pos = 'right'; }
     return function (control, _hasError, validation) {
-        return (React__default["default"].createElement(ValidationText, { pos: pos, validation: validation }, control));
+        return (React.createElement(ValidationText, { pos: pos, validation: validation }, control));
     };
 }
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
+// eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-unnecessary-type-constraint
 function createPropsGetter(defaultProps) {
     return function () {
         return this.props;
@@ -300,7 +267,7 @@ exports.FocusMode = void 0;
     FocusMode[FocusMode["None"] = 2] = "None";
 })(exports.FocusMode || (exports.FocusMode = {}));
 
-var ValidationContext = React__default["default"].createContext({
+var ValidationContext = React.createContext({
     register: function () { return undefined; },
     unregister: function () { return undefined; },
     instanceProcessBlur: function () { return undefined; },
@@ -317,15 +284,9 @@ var ValidationContextWrapper = /** @class */ (function (_super) {
     function ValidationContextWrapper() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.childWrappers = [];
-        _this.children = function (flags) {
-            if (flags.validationsRemoveExtraSpans) {
-                return _this.props.children;
-            }
-            return React__default["default"].createElement("span", null, _this.props.children);
-        };
         _this.renderChildren = function (children) {
-            if (React__default["default"].isValidElement(children)) {
-                return React__default["default"].cloneElement(children, {
+            if (React.isValidElement(children)) {
+                return React.cloneElement(children, {
                     'data-tid': _this.props['data-tid'],
                 });
             }
@@ -446,20 +407,16 @@ var ValidationContextWrapper = /** @class */ (function (_super) {
         return exports.FocusMode.None;
     };
     ValidationContextWrapper.prototype.render = function () {
-        var _this = this;
-        return (React__default["default"].createElement(ValidationsFeatureFlagsContext.Consumer, null, function (flags) {
-            _this.featureFlags = getFullValidationsFlagsContext(flags);
-            return (React__default["default"].createElement(ValidationContext.Provider, { value: _this }, _this.renderChildren(_this.children(_this.featureFlags))));
-        }));
+        return (React.createElement(ValidationContext.Provider, { value: this }, this.renderChildren(React.createElement("div", { style: { display: 'inline' } }, this.props.children))));
     };
     return ValidationContextWrapper;
-}(React__default["default"].Component));
+}(React.Component));
 
 var ValidationContainer = /** @class */ (function (_super) {
     __extends(ValidationContainer, _super);
     function ValidationContainer() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.getProps = createPropsGetter();
+        _this.getProps = createPropsGetter(ValidationContainer.defaultProps);
         _this.childContext = null;
         _this.refChildContext = function (el) { return (_this.childContext = el); };
         return _this;
@@ -489,7 +446,7 @@ var ValidationContainer = /** @class */ (function (_super) {
         return this.childContext.validate(withoutFocusOrValidationSettings);
     };
     ValidationContainer.prototype.render = function () {
-        return (React__default["default"].createElement(ValidationContextWrapper, { "data-tid": this.props['data-tid'], ref: this.refChildContext, scrollOffset: this.props.scrollOffset, disableSmoothScroll: this.getProps().disableSmoothScroll, onValidationUpdated: this.props.onValidationUpdated }, this.props.children));
+        return (React.createElement(ValidationContextWrapper, { "data-tid": this.props['data-tid'], ref: this.refChildContext, scrollOffset: this.props.scrollOffset, disableSmoothScroll: this.getProps().disableSmoothScroll, onValidationUpdated: this.props.onValidationUpdated }, this.props.children));
     };
     ValidationContainer.__KONTUR_REACT_UI__ = 'ValidationContainer';
     ValidationContainer.displayName = 'ValidationContainer';
@@ -505,9 +462,8 @@ var ValidationContainer = /** @class */ (function (_super) {
         },
     };
     return ValidationContainer;
-}(React__default["default"].Component));
+}(React.Component));
 
-/* eslint-disable react/no-find-dom-node */
 var isInstanceWithRootNode = function (instance) {
     return Boolean(instance) && Object.prototype.hasOwnProperty.call(instance, 'getRootNode');
 };
@@ -558,7 +514,7 @@ var getRootNode = function (instance) {
         // but findDOMNode doesn`t accept everything that instance can be at this point,
         // so we have to handle exceptions
         // see https://github.com/facebook/react/blob/cae63505/packages/react-dom/src/__tests__/findDOMNode-test.js#L66-L86
-        warning__default["default"](false, '[getRootNode]: can`t fallback to findDOMNode.' +
+        warning(false, '[getRootNode]: can`t fallback to findDOMNode.' +
             '\n' +
             'See https://github.com/skbkontur/retail-ui/blob/master/packages/react-ui/README.md#strictmode' +
             '\n\n' +
@@ -782,7 +738,7 @@ var ValidationWrapperInternal = /** @class */ (function (_super) {
         return _this;
     }
     ValidationWrapperInternal.prototype.componentDidMount = function () {
-        warning__default["default"](this.context, 'ValidationWrapper should appears as child of ValidationContainer.\n' +
+        warning(this.context, 'ValidationWrapper should appears as child of ValidationContainer.\n' +
             'https://tech.skbkontur.ru/react-ui-validations/#/getting-started');
         if (this.context) {
             this.context.register(this);
@@ -825,7 +781,7 @@ var ValidationWrapperInternal = /** @class */ (function (_super) {
         var _this = this;
         var _a = this.props, children = _a.children, dataTid = _a["data-tid"];
         var validation = this.state.validation;
-        var clonedChild = children ? (React__default["default"].cloneElement(children, {
+        var clonedChild = children ? (React.cloneElement(children, {
             ref: this.customRef,
             error: !this.isChanging && getLevel(validation) === 'error',
             warning: !this.isChanging && getLevel(validation) === 'warning',
@@ -862,9 +818,9 @@ var ValidationWrapperInternal = /** @class */ (function (_super) {
                     (_a = children.props).onValueChange.apply(_a, args);
                 }
             },
-        })) : (React__default["default"].createElement("span", { ref: this.setRootNode }));
+        })) : (React.createElement("span", { ref: this.setRootNode }));
         if (ReactUiDetection.isComboBox(clonedChild)) {
-            clonedChild = React__default["default"].cloneElement(clonedChild, {
+            clonedChild = React.cloneElement(clonedChild, {
                 onInputValueChange: function () {
                     var _a;
                     var args = [];
@@ -879,12 +835,9 @@ var ValidationWrapperInternal = /** @class */ (function (_super) {
                 },
             });
         }
-        return (React__default["default"].createElement(ValidationsFeatureFlagsContext.Consumer, null, function (flags) {
-            _this.featureFlags = getFullValidationsFlagsContext(flags);
-            return React__default["default"].cloneElement(_this.props.errorMessage(_this.featureFlags.validationsRemoveExtraSpans ? clonedChild : React__default["default"].createElement("span", null, clonedChild), !!validation, validation), {
-                'data-tid': dataTid,
-            });
-        }));
+        return React.cloneElement(this.props.errorMessage(React.createElement("div", { style: { display: 'inline' } }, clonedChild), !!validation, validation), {
+            'data-tid': dataTid,
+        });
     };
     ValidationWrapperInternal.prototype.getControlPosition = function () {
         var htmlElement = this.getRootNode();
@@ -964,7 +917,7 @@ var ValidationWrapperInternal = /** @class */ (function (_super) {
     };
     ValidationWrapperInternal.contextType = ValidationContext;
     return ValidationWrapperInternal;
-}(React__default["default"].Component));
+}(React.Component));
 
 var ValidationWrapper = /** @class */ (function (_super) {
     __extends(ValidationWrapper, _super);
@@ -981,12 +934,21 @@ var ValidationWrapper = /** @class */ (function (_super) {
                 independent: validationInfo.independent || false,
             }
             : null;
-        return (React__default["default"].createElement(ValidationWrapperInternal, { "data-tid": datTid, errorMessage: renderMessage || tooltip('right top'), validation: validation }, children));
+        return (React.createElement(ValidationWrapperInternal, { "data-tid": datTid, errorMessage: renderMessage || tooltip('right top'), validation: validation }, children));
     };
     ValidationWrapper.__KONTUR_REACT_UI__ = 'ValidationWrapper';
     ValidationWrapper.displayName = 'ValidationWrapper';
     return ValidationWrapper;
-}(React__default["default"].Component));
+}(React.Component));
+
+var validationsFeatureFlagsDefault = {};
+var ValidationsFeatureFlagsContext = React.createContext(validationsFeatureFlagsDefault);
+ValidationsFeatureFlagsContext.displayName = 'ValidationsFeatureFlagsContext';
+ValidationsFeatureFlagsContext.__KONTUR_REACT_UI__ = 'ValidationsFeatureFlagsContext';
+
+var getFullValidationsFlagsContext = function (flags) {
+    return __assign(__assign({}, validationsFeatureFlagsDefault), flags);
+};
 
 var ValidationBuilder = /** @class */ (function () {
     // eslint-disable-next-line no-useless-constructor