@gravity-ui/dynamic-forms 4.7.3 → 4.9.0

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

@@ -48,8 +48,11 @@
   margin-left: 10px;
 }
 .df-card__title {
-  display: flex;
   max-width: 533px;
+  height: 20px;
+}
+.df-card__title-popover {
+  height: 20px;
 }
 .df-card__note {
   margin-left: 5px;

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

@@ -37,7 +37,7 @@ const Card = ({ name, title: propsTitle, description, actions, open: propsOpen,
     const title = react_1.default.useMemo(() => {
         if ((0, isString_1.default)(propsTitle)) {
             return (react_1.default.createElement(react_1.default.Fragment, null,
-                react_1.default.createElement(uikit_1.Popover, { content: propsTitle, disabled: titlePopoverDisabled, placement: common_1.COMMON_POPOVER_PLACEMENT },
+                react_1.default.createElement(uikit_1.Popover, { content: propsTitle, disabled: titlePopoverDisabled, placement: common_1.COMMON_POPOVER_PLACEMENT, className: b('title-popover') },
                     react_1.default.createElement(uikit_1.Text, { className: b('title'), ellipsis: true, ref: titleRef, variant: "subheader-2" }, propsTitle)),
                 description ? (react_1.default.createElement("div", { className: b('note') },
                     react_1.default.createElement(components_1.HelpPopover, { htmlContent: description, placement: common_1.COMMON_POPOVER_PLACEMENT }))) : null));

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

@@ -9,7 +9,6 @@
 }
 .df-section__header_with-popover {
   display: flex;
-  align-items: center;
 }
 .df-section__title {
   max-width: 533px;

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

@@ -8,11 +8,14 @@ const uikit_1 = require("@gravity-ui/uikit");
 const utils_1 = require("../../utils");
 const b = (0, utils_1.block)('long-value');
 const LongValue = (_a) => {
-    var { value, className } = _a, restProps = tslib_1.__rest(_a, ["value", "className"]);
+    var { value, onClick, className } = _a, restProps = tslib_1.__rest(_a, ["value", "onClick", "className"]);
     const ref = react_1.default.useRef(null);
     const [open, setOpen] = react_1.default.useState(false);
     const [long, setLong] = react_1.default.useState(false);
-    const handleClick = react_1.default.useCallback(() => setOpen((f) => !f), [setOpen]);
+    const handleClick = react_1.default.useCallback((e) => {
+        onClick === null || onClick === void 0 ? void 0 : onClick(e);
+        setOpen((f) => !f);
+    }, [setOpen, onClick]);
     react_1.default.useEffect(() => {
         if (ref.current) {
             const { offsetWidth, scrollWidth } = ref.current;

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

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.END_TIME = exports.START_TIME = exports.OBJECT_VALUE_PROPERTY_NAME = exports.COMMON_TITLE_MAX_WIDTH = exports.COMMON_POPOVER_PLACEMENT = void 0;
 exports.COMMON_POPOVER_PLACEMENT = ['bottom', 'top'];
-exports.COMMON_TITLE_MAX_WIDTH = 533;
+exports.COMMON_TITLE_MAX_WIDTH = 523;
 exports.OBJECT_VALUE_PROPERTY_NAME = 'value';
 exports.START_TIME = 'start';
 exports.END_TIME = 'end';

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

@@ -8,6 +8,7 @@ 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");
@@ -40,7 +41,7 @@ const isNotEmptyValue = (value, spec) => {
     return true;
 };
 exports.isNotEmptyValue = isNotEmptyValue;
-const prepareSpec = (spec, parseJsonDefaultValue) => {
+const prepareSpec = (spec, parseJsonDefaultValue, overridePatternError) => {
     var _a, _b, _c, _d, _e, _f, _g, _h;
     if ((0, isObjectLike_1.default)(spec)) {
         const result = (0, cloneDeep_1.default)(spec);
@@ -100,8 +101,11 @@ const prepareSpec = (spec, parseJsonDefaultValue) => {
                 result.minLength = BigInt(result.minLength);
             }
         }
+        if (!(0, isEmpty_1.default)(result.pattern) && (0, isEmpty_1.default)(result.patternError) && overridePatternError) {
+            result.patternError = overridePatternError(result.pattern);
+        }
         if (result.items) {
-            result.items = (0, exports.prepareSpec)(result.items, parseJsonDefaultValue);
+            result.items = (0, exports.prepareSpec)(result.items, parseJsonDefaultValue, overridePatternError);
         }
         if (result.maximum === 0 && result.minimum === 0) {
             result.maximum = undefined;
@@ -120,7 +124,7 @@ const prepareSpec = (spec, parseJsonDefaultValue) => {
         }
         if ((0, isObjectLike_1.default)(result.properties)) {
             Object.keys(result.properties).forEach((key) => {
-                result.properties[key] = (0, exports.prepareSpec)(result.properties[key], parseJsonDefaultValue);
+                result.properties[key] = (0, exports.prepareSpec)(result.properties[key], parseJsonDefaultValue, overridePatternError);
             });
         }
         return result;

package/build/esm/lib/kit/components/Card/Card.css

@@ -48,8 +48,11 @@
   margin-left: 10px;
 }
 .df-card__title {
-  display: flex;
   max-width: 533px;
+  height: 20px;
+}
+.df-card__title-popover {
+  height: 20px;
 }
 .df-card__note {
   margin-left: 5px;

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

@@ -34,7 +34,7 @@ export const Card = ({ name, title: propsTitle, description, actions, open: prop
     const title = React.useMemo(() => {
         if (isString(propsTitle)) {
             return (React.createElement(React.Fragment, null,
-                React.createElement(Popover, { content: propsTitle, disabled: titlePopoverDisabled, placement: COMMON_POPOVER_PLACEMENT },
+                React.createElement(Popover, { content: propsTitle, disabled: titlePopoverDisabled, placement: COMMON_POPOVER_PLACEMENT, className: b('title-popover') },
                     React.createElement(Text, { className: b('title'), ellipsis: true, ref: titleRef, variant: "subheader-2" }, propsTitle)),
                 description ? (React.createElement("div", { className: b('note') },
                     React.createElement(HelpPopover, { htmlContent: description, placement: COMMON_POPOVER_PLACEMENT }))) : null));

package/build/esm/lib/kit/components/Layouts/Section/Section.css

@@ -9,7 +9,6 @@
 }
 .df-section__header_with-popover {
   display: flex;
-  align-items: center;
 }
 .df-section__title {
   max-width: 533px;

package/build/esm/lib/kit/components/LongValue/LongValue.d.ts

@@ -3,5 +3,6 @@ import { type TextProps } from '@gravity-ui/uikit';
 import './LongValue.css';
 export interface LongValueProps extends TextProps {
     value?: string | number | boolean;
+    onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
 }
 export declare const LongValue: React.FC<LongValueProps>;

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

@@ -6,11 +6,14 @@ import { block } from '../../utils';
 import './LongValue.css';
 const b = block('long-value');
 export const LongValue = (_a) => {
-    var { value, className } = _a, restProps = __rest(_a, ["value", "className"]);
+    var { value, onClick, className } = _a, restProps = __rest(_a, ["value", "onClick", "className"]);
     const ref = React.useRef(null);
     const [open, setOpen] = React.useState(false);
     const [long, setLong] = React.useState(false);
-    const handleClick = React.useCallback(() => setOpen((f) => !f), [setOpen]);
+    const handleClick = React.useCallback((e) => {
+        onClick === null || onClick === void 0 ? void 0 : onClick(e);
+        setOpen((f) => !f);
+    }, [setOpen, onClick]);
     React.useEffect(() => {
         if (ref.current) {
             const { offsetWidth, scrollWidth } = ref.current;

package/build/esm/lib/kit/constants/common.d.ts

@@ -1,6 +1,6 @@
 import type { PopoverProps } from '@gravity-ui/uikit';
 export declare const COMMON_POPOVER_PLACEMENT: PopoverProps['placement'];
-export declare const COMMON_TITLE_MAX_WIDTH = 533;
+export declare const COMMON_TITLE_MAX_WIDTH = 523;
 export declare const OBJECT_VALUE_PROPERTY_NAME = "value";
 export declare const START_TIME = "start";
 export declare const END_TIME = "end";

package/build/esm/lib/kit/constants/common.js

@@ -1,5 +1,5 @@
 export const COMMON_POPOVER_PLACEMENT = ['bottom', 'top'];
-export const COMMON_TITLE_MAX_WIDTH = 533;
+export const COMMON_TITLE_MAX_WIDTH = 523;
 export const OBJECT_VALUE_PROPERTY_NAME = 'value';
 export const START_TIME = 'start';
 export const END_TIME = 'end';

package/build/esm/lib/kit/utils/common.d.ts

@@ -1,4 +1,4 @@
 import { FormValue, Spec, StringSpec } from '../../core';
 export declare const isNotEmptyValue: (value: FormValue | undefined, spec: Spec | undefined) => boolean;
-export declare const prepareSpec: <Type extends Spec<any, undefined, undefined>>(spec: Type, parseJsonDefaultValue?: boolean) => Type;
+export declare const prepareSpec: <Type extends Spec<any, undefined, undefined>>(spec: Type, parseJsonDefaultValue?: boolean, overridePatternError?: ((pattern?: string) => string) | undefined) => Type;
 export declare const isCorrectSizeParams: (spec: StringSpec) => boolean;

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

@@ -4,6 +4,7 @@ import isNil from 'lodash/isNil';
 import isObject from 'lodash/isObject';
 import isObjectLike from 'lodash/isObjectLike';
 import isString from 'lodash/isString';
+import isEmpty from 'lodash/isEmpty';
 import { SpecTypes, isArraySpec, isObjectSpec, isStringSpec, } from '../../core';
 import { isFloat } from '../validators/helpers';
 import { divide } from './bigIntMath';
@@ -35,7 +36,7 @@ export const isNotEmptyValue = (value, spec) => {
     }
     return true;
 };
-export const prepareSpec = (spec, parseJsonDefaultValue) => {
+export const prepareSpec = (spec, parseJsonDefaultValue, overridePatternError) => {
     var _a, _b, _c, _d, _e, _f, _g, _h;
     if (isObjectLike(spec)) {
         const result = cloneDeep(spec);
@@ -95,8 +96,11 @@ export const prepareSpec = (spec, parseJsonDefaultValue) => {
                 result.minLength = BigInt(result.minLength);
             }
         }
+        if (!isEmpty(result.pattern) && isEmpty(result.patternError) && overridePatternError) {
+            result.patternError = overridePatternError(result.pattern);
+        }
         if (result.items) {
-            result.items = prepareSpec(result.items, parseJsonDefaultValue);
+            result.items = prepareSpec(result.items, parseJsonDefaultValue, overridePatternError);
         }
         if (result.maximum === 0 && result.minimum === 0) {
             result.maximum = undefined;
@@ -115,7 +119,7 @@ export const prepareSpec = (spec, parseJsonDefaultValue) => {
         }
         if (isObjectLike(result.properties)) {
             Object.keys(result.properties).forEach((key) => {
-                result.properties[key] = prepareSpec(result.properties[key], parseJsonDefaultValue);
+                result.properties[key] = prepareSpec(result.properties[key], parseJsonDefaultValue, overridePatternError);
             });
         }
         return result;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/dynamic-forms",
-  "version": "4.7.3",
+  "version": "4.9.0",
   "description": "",
   "license": "MIT",
   "main": "build/cjs/index.js",