@gravity-ui/dynamic-forms 4.13.0 → 4.14.1

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

@@ -11,14 +11,14 @@ 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, __mirror, }) => {
+const DynamicField = ({ name, spec, config, Monaco, generateRandomValue, search, withoutInsertFFDebounce, destroyOnUnregister = true, mutators: externalMutators, shared: externalShared, __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 { mutatorsStore, mutateDFState } = (0, hooks_1.useMutators)(externalMutators);
     const { store: searchStore, setField, removeField, isHiddenField } = (0, hooks_1.useSearchStore)();
-    const shared = (0, hooks_1.useFormSharedStore)();
+    const shared = (0, hooks_1.useFormSharedStore)(externalShared);
     const context = react_1.default.useMemo(() => ({
         config,
         Monaco: (0, react_is_1.isValidElementType)(Monaco) ? Monaco : undefined,

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

@@ -3,9 +3,18 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFormSharedStore = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const useFormSharedStore = () => {
-    const [store, setStore] = react_1.default.useState({});
+const useFormSharedStore = (shared) => {
+    const firstRender = react_1.default.useRef(true);
+    const [store, setStore] = react_1.default.useState(shared || {});
     const onChangeShared = react_1.default.useCallback((name, value) => setStore((s) => (Object.assign(Object.assign({}, s), { [name]: value }))), [setStore]);
+    react_1.default.useEffect(() => {
+        if (firstRender.current) {
+            firstRender.current = false;
+        }
+        else if (shared) {
+            setStore(Object.assign(Object.assign({}, store), shared));
+        }
+    }, [shared]);
     return { store, onChangeShared };
 };
 exports.useFormSharedStore = useFormSharedStore;

package/build/cjs/lib/core/components/View/DynamicView.js

@@ -8,9 +8,9 @@ const helpers_1 = require("../../helpers");
 const ViewController_1 = require("./ViewController");
 const helpers_2 = require("./helpers");
 const hooks_1 = require("./hooks");
-const DynamicView = ({ value, spec, config, Link, Monaco, showLayoutDescription, }) => {
+const DynamicView = ({ value, spec, config, Link, Monaco, showLayoutDescription, shared: externalShared, }) => {
     const DynamicFormsCtx = (0, hooks_1.useCreateContext)();
-    const shared = (0, hooks_1.useViewSharedStore)();
+    const shared = (0, hooks_1.useViewSharedStore)(externalShared);
     const context = react_1.default.useMemo(() => ({
         config,
         value,

package/build/cjs/lib/core/components/View/hooks/useViewSharedStore.js

@@ -3,9 +3,18 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useViewSharedStore = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
-const useViewSharedStore = () => {
-    const [store, setStore] = react_1.default.useState({});
+const useViewSharedStore = (shared) => {
+    const firstRender = react_1.default.useRef(true);
+    const [store, setStore] = react_1.default.useState(shared || {});
     const onChangeShared = react_1.default.useCallback((name, value) => setStore((s) => (Object.assign(Object.assign({}, s), { [name]: value }))), [setStore]);
+    react_1.default.useEffect(() => {
+        if (firstRender.current) {
+            firstRender.current = false;
+        }
+        else if (shared) {
+            setStore(Object.assign(Object.assign({}, store), shared));
+        }
+    }, [shared]);
     return { store, onChangeShared };
 };
 exports.useViewSharedStore = useViewSharedStore;

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

@@ -6,11 +6,12 @@ const react_1 = tslib_1.__importStar(require("react"));
 const date_components_1 = require("@gravity-ui/date-components");
 const date_utils_1 = require("@gravity-ui/date-utils");
 const utils_1 = require("../../../utils");
-exports.DEFAULT_DATE_FORMAT = 'DD-MM-YYYY';
+exports.DEFAULT_DATE_FORMAT = 'DD.MM.YYYY HH:mm';
 const b = (0, utils_1.block)('date-input');
 const DateInput = ({ name, input, spec, inputProps, }) => {
     const { value, onChange, onBlur, onFocus } = input;
     const dateInput = spec.viewSpec.dateInput;
+    const timeZone = (dateInput === null || dateInput === void 0 ? void 0 : dateInput.timeZone) && (0, date_utils_1.isValidTimeZone)(dateInput.timeZone) ? dateInput.timeZone : undefined;
     const outputFormat = dateInput === null || dateInput === void 0 ? void 0 : dateInput.outputFormat;
     const onUpdate = (0, react_1.useCallback)((date) => {
         if (!date) {
@@ -42,8 +43,11 @@ const DateInput = ({ name, input, spec, inputProps, }) => {
         }
     }, [outputFormat]);
     const props = Object.assign(Object.assign({ hasClear: true, format: (dateInput === null || dateInput === void 0 ? void 0 : dateInput.printFormat) || exports.DEFAULT_DATE_FORMAT }, inputProps), { onBlur: onBlur, onFocus: onFocus, value: value
-            ? (0, date_utils_1.dateTimeParse)(value.seconds ? value.seconds * 1000 : value) || null
-            : null, onUpdate, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder });
+            ? (0, date_utils_1.dateTimeParse)(value.seconds ? value.seconds * 1000 : value, {
+                format: dateInput === null || dateInput === void 0 ? void 0 : dateInput.outputFormat,
+                timeZone,
+            }) || null
+            : null, onUpdate, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, timeZone });
     return react_1.default.createElement(date_components_1.DatePicker, Object.assign({ className: b(), "data-qa": name }, props));
 };
 exports.DateInput = DateInput;

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

@@ -7,15 +7,17 @@ const components_1 = require("../../../components");
 const date_utils_1 = require("@gravity-ui/date-utils");
 const isObject_1 = tslib_1.__importDefault(require("lodash/isObject"));
 const DateView = (_a) => {
-    var _b, _c, _d;
     var { value, spec } = _a, restProps = tslib_1.__rest(_a, ["value", "spec"]);
-    let formatedValue = value && (0, isObject_1.default)(value) && value.seconds
-        ? (value === null || value === void 0 ? void 0 : value.seconds) * 1000
-        : value;
-    const localSpec = spec.viewSpec;
-    const format = ((_b = localSpec.inputProps) === null || _b === void 0 ? void 0 : _b.format) || ((_c = localSpec.dateInput) === null || _c === void 0 ? void 0 : _c.printFormat) || components_1.DEFAULT_DATE_FORMAT;
-    if (formatedValue && format) {
-        formatedValue = ((_d = (0, date_utils_1.dateTimeParse)(formatedValue)) === null || _d === void 0 ? void 0 : _d.format(format)) || formatedValue;
+    const { printFormat = components_1.DEFAULT_DATE_FORMAT, outputFormat, timeZone, } = spec.viewSpec.dateInput || {};
+    let formatedValue = value;
+    if ((0, isObject_1.default)(value) && value.seconds) {
+        formatedValue = Number(value.seconds) * 1000;
+    }
+    if (formatedValue) {
+        const date = (0, date_utils_1.dateTimeParse)(formatedValue, { format: outputFormat, timeZone });
+        if (date) {
+            formatedValue = date.format(printFormat);
+        }
     }
     return react_1.default.createElement(components_1.BaseView, Object.assign({ spec: spec, value: String(formatedValue) }, restProps));
 };

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

@@ -12,6 +12,7 @@ export interface DynamicFieldProps {
     withoutInsertFFDebounce?: boolean;
     destroyOnUnregister?: boolean;
     mutators?: DynamicFormMutators;
+    shared?: Record<string, any>;
     __mirror?: WonderMirror;
 }
 export declare const DynamicField: React.FC<DynamicFieldProps>;

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

@@ -7,14 +7,14 @@ 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, __mirror, }) => {
+export const DynamicField = ({ name, spec, config, Monaco, generateRandomValue, search, withoutInsertFFDebounce, destroyOnUnregister = true, mutators: externalMutators, shared: externalShared, __mirror, }) => {
     const DynamicFormsCtx = useCreateContext();
     const SearchContext = useCreateSearchContext();
     const { tools, store } = useStore(name);
     const watcher = useIntegrationFF(store, withoutInsertFFDebounce, destroyOnUnregister);
     const { mutatorsStore, mutateDFState } = useMutators(externalMutators);
     const { store: searchStore, setField, removeField, isHiddenField } = useSearchStore();
-    const shared = useFormSharedStore();
+    const shared = useFormSharedStore(externalShared);
     const context = React.useMemo(() => ({
         config,
         Monaco: isValidElementType(Monaco) ? Monaco : undefined,

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

@@ -1,4 +1,4 @@
-export declare const useFormSharedStore: () => {
-    store: {};
+export declare const useFormSharedStore: (shared?: Record<string, any>) => {
+    store: Record<string, any>;
     onChangeShared: (name: string, value: any) => void;
 };

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

@@ -1,6 +1,15 @@
 import React from 'react';
-export const useFormSharedStore = () => {
-    const [store, setStore] = React.useState({});
+export const useFormSharedStore = (shared) => {
+    const firstRender = React.useRef(true);
+    const [store, setStore] = React.useState(shared || {});
     const onChangeShared = React.useCallback((name, value) => setStore((s) => (Object.assign(Object.assign({}, s), { [name]: value }))), [setStore]);
+    React.useEffect(() => {
+        if (firstRender.current) {
+            firstRender.current = false;
+        }
+        else if (shared) {
+            setStore(Object.assign(Object.assign({}, store), shared));
+        }
+    }, [shared]);
     return { store, onChangeShared };
 };

package/build/esm/lib/core/components/View/DynamicView.d.ts

@@ -12,5 +12,6 @@ export interface DynamicViewProps {
     }>;
     Monaco?: React.ComponentType<MonacoEditorProps>;
     showLayoutDescription?: boolean;
+    shared?: Record<string, any>;
 }
-export declare const DynamicView: ({ value, spec, config, Link, Monaco, showLayoutDescription, }: DynamicViewProps) => JSX.Element | null;
+export declare const DynamicView: ({ value, spec, config, Link, Monaco, showLayoutDescription, shared: externalShared, }: DynamicViewProps) => JSX.Element | null;

package/build/esm/lib/core/components/View/DynamicView.js

@@ -4,9 +4,9 @@ import { isCorrectSpec } from '../../helpers';
 import { ViewController } from './ViewController';
 import { isCorrectViewConfig } from './helpers';
 import { useCreateContext, useViewSharedStore } from './hooks';
-export const DynamicView = ({ value, spec, config, Link, Monaco, showLayoutDescription, }) => {
+export const DynamicView = ({ value, spec, config, Link, Monaco, showLayoutDescription, shared: externalShared, }) => {
     const DynamicFormsCtx = useCreateContext();
-    const shared = useViewSharedStore();
+    const shared = useViewSharedStore(externalShared);
     const context = React.useMemo(() => ({
         config,
         value,

package/build/esm/lib/core/components/View/hooks/useViewSharedStore.d.ts

@@ -1,4 +1,4 @@
-export declare const useViewSharedStore: () => {
-    store: {};
+export declare const useViewSharedStore: (shared?: Record<string, any>) => {
+    store: Record<string, any>;
     onChangeShared: (name: string, value: any) => void;
 };

package/build/esm/lib/core/components/View/hooks/useViewSharedStore.js

@@ -1,6 +1,15 @@
 import React from 'react';
-export const useViewSharedStore = () => {
-    const [store, setStore] = React.useState({});
+export const useViewSharedStore = (shared) => {
+    const firstRender = React.useRef(true);
+    const [store, setStore] = React.useState(shared || {});
     const onChangeShared = React.useCallback((name, value) => setStore((s) => (Object.assign(Object.assign({}, s), { [name]: value }))), [setStore]);
+    React.useEffect(() => {
+        if (firstRender.current) {
+            firstRender.current = false;
+        }
+        else if (shared) {
+            setStore(Object.assign(Object.assign({}, store), shared));
+        }
+    }, [shared]);
     return { store, onChangeShared };
 };

package/build/esm/lib/core/types/specs.d.ts

@@ -158,6 +158,7 @@ export interface StringSpec<LinkType = any, InputComponentProps extends Record<s
         dateInput?: {
             outputFormat?: string;
             printFormat?: string;
+            timeZone?: string;
         };
         copy?: boolean;
         selectParams?: {

package/build/esm/lib/kit/components/Inputs/DateInput/DateInput.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { DatePickerProps } from '@gravity-ui/date-components';
 import { StringInputProps } from '../../../../core';
 import './DateInput.css';
-export declare const DEFAULT_DATE_FORMAT = "DD-MM-YYYY";
+export declare const DEFAULT_DATE_FORMAT = "DD.MM.YYYY HH:mm";
 export interface DateProps extends Omit<DatePickerProps, 'value' | 'disabled' | 'placeholder' | 'qa'> {
 }
 export declare const DateInput: React.FC<StringInputProps<DateProps>>;

package/build/esm/lib/kit/components/Inputs/DateInput/DateInput.js

@@ -1,13 +1,14 @@
 import React, { useCallback } from 'react';
 import { DatePicker } from '@gravity-ui/date-components';
-import { dateTimeParse } from '@gravity-ui/date-utils';
+import { dateTimeParse, isValidTimeZone } from '@gravity-ui/date-utils';
 import { block } from '../../../utils';
 import './DateInput.css';
-export const DEFAULT_DATE_FORMAT = 'DD-MM-YYYY';
+export const DEFAULT_DATE_FORMAT = 'DD.MM.YYYY HH:mm';
 const b = block('date-input');
 export const DateInput = ({ name, input, spec, inputProps, }) => {
     const { value, onChange, onBlur, onFocus } = input;
     const dateInput = spec.viewSpec.dateInput;
+    const timeZone = (dateInput === null || dateInput === void 0 ? void 0 : dateInput.timeZone) && isValidTimeZone(dateInput.timeZone) ? dateInput.timeZone : undefined;
     const outputFormat = dateInput === null || dateInput === void 0 ? void 0 : dateInput.outputFormat;
     const onUpdate = useCallback((date) => {
         if (!date) {
@@ -39,8 +40,11 @@ export const DateInput = ({ name, input, spec, inputProps, }) => {
         }
     }, [outputFormat]);
     const props = Object.assign(Object.assign({ hasClear: true, format: (dateInput === null || dateInput === void 0 ? void 0 : dateInput.printFormat) || DEFAULT_DATE_FORMAT }, inputProps), { onBlur: onBlur, onFocus: onFocus, value: value
-            ? dateTimeParse(value.seconds ? value.seconds * 1000 : value) || null
-            : null, onUpdate, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder });
+            ? dateTimeParse(value.seconds ? value.seconds * 1000 : value, {
+                format: dateInput === null || dateInput === void 0 ? void 0 : dateInput.outputFormat,
+                timeZone,
+            }) || null
+            : null, onUpdate, disabled: spec.viewSpec.disabled, placeholder: spec.viewSpec.placeholder, timeZone });
     return React.createElement(DatePicker, Object.assign({ className: b(), "data-qa": name }, props));
 };
 export default DateInput;

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

@@ -4,15 +4,17 @@ import { BaseView, DEFAULT_DATE_FORMAT } from '../../../components';
 import { dateTimeParse } from '@gravity-ui/date-utils';
 import isObject from 'lodash/isObject';
 export const DateView = (_a) => {
-    var _b, _c, _d;
     var { value, spec } = _a, restProps = __rest(_a, ["value", "spec"]);
-    let formatedValue = value && isObject(value) && value.seconds
-        ? (value === null || value === void 0 ? void 0 : value.seconds) * 1000
-        : value;
-    const localSpec = spec.viewSpec;
-    const format = ((_b = localSpec.inputProps) === null || _b === void 0 ? void 0 : _b.format) || ((_c = localSpec.dateInput) === null || _c === void 0 ? void 0 : _c.printFormat) || DEFAULT_DATE_FORMAT;
-    if (formatedValue && format) {
-        formatedValue = ((_d = dateTimeParse(formatedValue)) === null || _d === void 0 ? void 0 : _d.format(format)) || formatedValue;
+    const { printFormat = DEFAULT_DATE_FORMAT, outputFormat, timeZone, } = spec.viewSpec.dateInput || {};
+    let formatedValue = value;
+    if (isObject(value) && value.seconds) {
+        formatedValue = Number(value.seconds) * 1000;
+    }
+    if (formatedValue) {
+        const date = dateTimeParse(formatedValue, { format: outputFormat, timeZone });
+        if (date) {
+            formatedValue = date.format(printFormat);
+        }
     }
     return React.createElement(BaseView, Object.assign({ spec: spec, value: String(formatedValue) }, restProps));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/dynamic-forms",
-  "version": "4.13.0",
+  "version": "4.14.1",
   "description": "",
   "license": "MIT",
   "main": "build/cjs/index.js",
@@ -46,8 +46,8 @@
   "dependencies": {
     "@bem-react/classname": "^1.6.0",
     "@gravity-ui/components": "^3.0.0",
-    "@gravity-ui/date-components": "^2.4.0",
-    "@gravity-ui/date-utils": "^2.4.0",
+    "@gravity-ui/date-components": "^2.10.3",
+    "@gravity-ui/date-utils": "^2.5.5",
     "@gravity-ui/i18n": "^1.2.0",
     "@gravity-ui/icons": "^2.8.1",
     "lodash": "^4.17.20"