@gravity-ui/dynamic-forms 5.17.1 → 5.19.0

package/build/esm/lib/unstable/kit/Text.js

@@ -0,0 +1,255 @@
+import React from 'react';
+import { PasswordInput, TextInput, } from '@gravity-ui/uikit';
+import isNil from 'lodash/isNil';
+import { useSchemaRendererMutators } from '../core';
+const Component = ({ input, meta, schema, }) => {
+    var _a, _b;
+    // const {setErrors, removeErrors} = useSetErrors();
+    const { setSchemaMutators, removeSchemaMutators } = useSchemaRendererMutators(); // setExternalErrors
+    const props = {
+        hasClear: true,
+        // ...inputProps,
+        value: isNil(input.value) ? '' : `${input.value}`,
+        onBlur: input.onBlur,
+        onFocus: input.onFocus,
+        onUpdate: input.onChange,
+        // disabled: spec.viewSpec.disabled,
+        disabled: schema.readOnly,
+        // placeholder: spec.viewSpec.placeholder,
+        placeholder: `${(_a = schema.examples) === null || _a === void 0 ? void 0 : _a[0]}`,
+        qa: input.name,
+        error: meta.error,
+        // errorMessage: meta.error,
+    };
+    React.useEffect(() => {
+        if (input.name === 'qwe.test.jajaja.stringMaxLength' ||
+            input.name === 'qwe.test.bocembocembocem.stringMaxLength') {
+            // if (input.value === '1') {
+            //     setExternalErrors?.({
+            //         headName: 'qwe.test.jajaja',
+            //         priorityErrors: {
+            //             [input.name]: 'bbbbbbbbbbb priority',
+            //             'qwe.test.jajaja': {
+            //                 numberMaximum: 'bbbbbbbbbbb priority',
+            //                 objectPropertyNames: {
+            //                     stringEnum: 'bbbbbbbbbbb priority',
+            //                 },
+            //             },
+            //             'qwe.test.jajaja.objectPropertyNames': 'bbbbbbbbbbb priority',
+            //         },
+            //     });
+            //     setSchemaMutators?.({
+            //         headName: 'qwe.test.jajaja',
+            //         // mutators: {
+            //         //     [input.name]: {
+            //         //         title: 'Aaaaaaaa',
+            //         //     },
+            //         //     'qwe.test.jajaja.stringPattern': {
+            //         //         title: 'OOOOOOO',
+            //         //     },
+            //         //     'qwe.test.jajaja.numberMinimum': {
+            //         //         minimum: 0,
+            //         //     },
+            //         // },
+            //         mutators: [
+            //             {
+            //                 name: input.name,
+            //                 schema: {
+            //                     title: 'QWEQWEQWEQWE',
+            //                 },
+            //             },
+            //             {
+            //                 name: 'qwe.test.jajaja.stringPattern',
+            //                 schema: {
+            //                     title: 'QWEQWEQWEQWE',
+            //                 },
+            //             },
+            //             {
+            //                 name: 'qwe.test.jajaja.numberMaximum',
+            //                 schema: {
+            //                     maximum: 10,
+            //                 },
+            //             },
+            //         ],
+            //     });
+            // } else if (input.value === '2') {
+            //     setExternalErrors?.({
+            //         headName: 'qwe.test.jajaja',
+            //         priorityErrors: {
+            //             [input.name]: 'priorityError',
+            //             'qwe.test.jajaja': {
+            //                 numberMaximum: 'priorityError',
+            //                 objectPropertyNames: {
+            //                     stringEnum: 'priorityError',
+            //                 },
+            //             },
+            //             'qwe.test.jajaja.objectPropertyNames': 'priorityError',
+            //         },
+            //     });
+            //     setSchemaMutators?.({
+            //         headName: 'qwe.test.jajaja',
+            //         // mutators: {
+            //         //     [input.name]: {
+            //         //         title: 'Aaaaaaaa',
+            //         //     },
+            //         //     'qwe.test.jajaja.stringPattern': {
+            //         //         title: 'OOOOOOO',
+            //         //     },
+            //         //     'qwe.test.jajaja.numberMinimum': {
+            //         //         minimum: 0,
+            //         //     },
+            //         // },
+            //         mutators: [
+            //             {
+            //                 name: input.name,
+            //                 schema: {
+            //                     title: 'Aaaaaaaa',
+            //                 },
+            //             },
+            //             {
+            //                 name: 'qwe.test.jajaja.stringPattern',
+            //                 schema: {
+            //                     title: 'OOOOOOO',
+            //                 },
+            //             },
+            //             {
+            //                 name: 'qwe.test.jajaja.numberMinimum',
+            //                 schema: {
+            //                     minimum: 0,
+            //                 },
+            //             },
+            //         ],
+            //     });
+            // } else if (input.value === '3') {
+            //     setExternalErrors?.({
+            //         headName: 'qwe.test.jajaja',
+            //         priorityErrors: {
+            //             [input.name]: 'EXTERNAL_ERROR',
+            //         },
+            //     });
+            //     removeSchemaMutators?.({
+            //         headName: 'qwe.test.jajaja',
+            //         // mutatorsToRemove: {
+            //         //     'qwe.test.jajaja.numberMinimum': {
+            //         //         minimum: 0,
+            //         //     },
+            //         //     'qwe.test.jajaja.stringPattern': true,
+            //         // },
+            //         mutatorsToRemove: [
+            //             {
+            //                 name: input.name,
+            //                 schema: true,
+            //             },
+            //             {
+            //                 name: 'qwe.test.jajaja.numberMinimum',
+            //                 schema: {
+            //                     minimum: 0,
+            //                 },
+            //             },
+            //             {
+            //                 name: 'qwe.test.jajaja.stringPattern',
+            //                 schema: {
+            //                     title: 'OOOOOOO',
+            //                 },
+            //             },
+            //         ],
+            //     });
+            //     // removeExternalErrors?.({
+            //     //     headName: 'qwe.test.jajaja',
+            //     //     removeFunctionOrNames: [input.name],
+            //     // });
+            //     // removeExternalErrors?.({
+            //     //     headName: 'qwe.test.jajaja',
+            //     //     removeFunctionOrNames: (params) => ({
+            //     //         ...params,
+            //     //         priorityErrors: omit(params.priorityErrors, input.name),
+            //     //     }),
+            //     // });
+            // }
+            if (input.value === '1') {
+                removeSchemaMutators === null || removeSchemaMutators === void 0 ? void 0 : removeSchemaMutators({
+                    mutatorsToRemove: [
+                        {
+                            name: 'qwe.test.jajaja.stringPattern',
+                            schema: true,
+                        },
+                        {
+                            name: 'qwe.test.jajaja',
+                            schema: {
+                                definitions: {
+                                    jajaja: {
+                                        title: `jajaja`,
+                                    },
+                                },
+                            },
+                        },
+                    ],
+                });
+            }
+            else {
+                setSchemaMutators === null || setSchemaMutators === void 0 ? void 0 : setSchemaMutators({
+                    // mutators: {
+                    //     [input.name]: {
+                    //         title: 'Aaaaaaaa',
+                    //     },
+                    //     'qwe.test.jajaja.stringPattern': {
+                    //         title: 'OOOOOOO',
+                    //     },
+                    //     'qwe.test.jajaja.numberMinimum': {
+                    //         minimum: 0,
+                    //     },
+                    // },
+                    mutators: [
+                        {
+                            name: input.name,
+                            schema: {
+                                title: `${input.value}`,
+                                maxLength: `${input.value}`.length - 1,
+                                entityParameters: {
+                                    validatorType: '',
+                                    errorMessages: {
+                                        maxLength: `${input.value}`.length - 1 + ' maxLength',
+                                    },
+                                },
+                            },
+                        },
+                        {
+                            name: 'qwe.test.jajaja.stringPattern',
+                            schema: {
+                                title: `${input.value}`,
+                                entityParameters: {
+                                    validatorType: '',
+                                    errorMessages: {
+                                        pattern: `${input.value}`.length - 1 + ' pattern',
+                                    },
+                                },
+                            },
+                        },
+                        {
+                            name: 'qwe.test.jajaja',
+                            schema: {
+                                definitions: {
+                                    jajaja: {
+                                        title: `${input.value}`,
+                                    },
+                                },
+                            },
+                        },
+                    ],
+                });
+            }
+            // setExternalErrors?.({
+            //     headName: 'qwe.test.jajaja',
+            //     priorityErrors: {
+            //         'qwe.test.jajaja.stringEnum': `${input.value}`,
+            //     },
+            // });
+        }
+    }, [input.value]);
+    // if (spec.viewSpec.type === 'password') {
+    if (((_b = schema.entityParameters) === null || _b === void 0 ? void 0 : _b.viewType) === 'password') {
+        return React.createElement(PasswordInput, Object.assign({}, props, { autoComplete: "new-password" }));
+    }
+    return React.createElement(TextInput, Object.assign({}, props, { type: "text" }));
+};
+export const Text = React.memo(Component);

package/build/esm/lib/unstable/kit/components/ArrayRemoveButton/ArrayRemoveButton.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export interface ArrayRemoveButtonProps {
+    name: string;
+}
+export declare const ArrayRemoveButton: React.FC<ArrayRemoveButtonProps>;

package/build/esm/lib/unstable/kit/components/ArrayRemoveButton/ArrayRemoveButton.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import { TrashBin } from '@gravity-ui/icons';
+import { Button, Icon } from '@gravity-ui/uikit';
+import { useForm } from 'react-final-form';
+import { getArrayItemIndex, getArrayItemParentName, isArrayItem, isTupleItem } from '../../utils';
+export const ArrayRemoveButton = ({ name }) => {
+    const form = useForm();
+    const arrayItem = isArrayItem(name);
+    const tupleItem = isTupleItem(name, form);
+    const removeItem = React.useCallback(() => {
+        var _a;
+        const parentName = getArrayItemParentName(name);
+        const parentValue = (_a = form.getFieldState(parentName)) === null || _a === void 0 ? void 0 : _a.value;
+        const index = Number(getArrayItemIndex(name));
+        if (Array.isArray(parentValue)) {
+            form.change(parentName, parentValue.filter((_, i) => i !== index));
+        }
+    }, [form, name]);
+    if (arrayItem && !tupleItem) {
+        return (React.createElement(Button, { view: "flat-secondary", onClick: removeItem, qa: `${name}-remove-item` },
+            React.createElement(Icon, { data: TrashBin, size: 16 })));
+    }
+    return null;
+};

package/build/esm/lib/unstable/kit/components/ArrayRemoveButton/index.d.ts

@@ -0,0 +1 @@
+export { ArrayRemoveButton, type ArrayRemoveButtonProps } from './ArrayRemoveButton';

package/build/esm/lib/unstable/kit/components/ArrayRemoveButton/index.js

@@ -0,0 +1 @@
+export { ArrayRemoveButton } from './ArrayRemoveButton';

package/build/esm/lib/unstable/kit/components/ControlError/ControlError.css

@@ -0,0 +1,33 @@
+.sr-control-error__children {
+  width: 100%;
+}
+.sr-control-error__children_errors .g-control-label:not(.g-control-label_disabled) .g-checkbox__indicator:hover::before {
+  border: 1px solid var(--g-color-text-danger);
+}
+.sr-control-error__children_errors .g-control-label:not(.g-control-label_disabled) .g-checkbox__indicator::before {
+  border: 1px solid var(--g-color-text-danger);
+}
+.sr-control-error__children_errors .g-text-input:not(.g-text-input_disabled) .g-text-input__content {
+  border-color: var(--g-color-text-danger);
+}
+.sr-control-error__children_errors .g-text-input:not(.g-text-input_disabled) .g-text-input__content:hover {
+  border-color: var(--g-color-text-danger);
+}
+.sr-control-error__children_errors .g-text-area__content {
+  border-color: var(--g-color-text-danger);
+}
+.sr-control-error__children_errors .g-text-area__content:hover {
+  border-color: var(--g-color-text-danger);
+}
+.sr-control-error__children_errors .g-select-control:not(.g-select-control_disabled) .g-select-control__button:hover::before {
+  border: 1px solid var(--g-color-text-danger) !important;
+}
+.sr-control-error__children_errors .g-select-control:not(.g-select-control_disabled) .g-select-control__button::before {
+  border: 1px solid var(--g-color-text-danger) !important;
+}
+.sr-control-error__children_errors .g-segmented-radio-group:not([aria-disabled=true]) .g-segmented-radio-group__option_checked:hover::after {
+  border: 1px solid var(--g-color-text-danger);
+}
+.sr-control-error__children_errors .g-segmented-radio-group:not([aria-disabled=true]) .g-segmented-radio-group__option_checked::after {
+  border: 1px solid var(--g-color-text-danger);
+}

package/build/esm/lib/unstable/kit/components/ControlError/ControlError.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import './ControlError.css';
+export interface ControlErrorProps {
+    className?: string;
+    errorMessage?: string;
+    validationState?: 'invalid';
+    children: React.ReactNode;
+}
+export declare const ControlError: React.FC<ControlErrorProps>;

package/build/esm/lib/unstable/kit/components/ControlError/ControlError.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { Flex, Text } from '@gravity-ui/uikit';
+import { block } from '../../utils';
+import './ControlError.css';
+const b = block('control-error');
+export const ControlError = ({ className, errorMessage, validationState, children, }) => {
+    const error = validationState === 'invalid' && errorMessage ? (React.createElement(Text, { color: "danger" }, errorMessage)) : null;
+    return (React.createElement(Flex, { className: b(null, className), width: "100%", direction: "column", alignItems: "flex-start" },
+        React.createElement("div", { className: b('children', { errors: Boolean(error) }) }, children),
+        error));
+};

package/build/esm/lib/unstable/kit/components/ControlError/index.d.ts

@@ -0,0 +1 @@
+export { ControlError, type ControlErrorProps } from './ControlError';

package/build/esm/lib/unstable/kit/components/ControlError/index.js

@@ -0,0 +1 @@
+export { ControlError } from './ControlError';

package/build/esm/lib/unstable/kit/components/HTMLContent/HTMLContent.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { type TextProps } from '@gravity-ui/uikit';
+export interface HTMLContentProps extends TextProps {
+    html: string;
+}
+export declare const HTMLContent: React.FC<HTMLContentProps>;

package/build/esm/lib/unstable/kit/components/HTMLContent/HTMLContent.js

@@ -0,0 +1,7 @@
+import { __rest } from "tslib";
+import React from 'react';
+import { Text } from '@gravity-ui/uikit';
+export const HTMLContent = (_a) => {
+    var { html } = _a, restProps = __rest(_a, ["html"]);
+    return React.createElement(Text, Object.assign({}, restProps, { dangerouslySetInnerHTML: { __html: html } }));
+};

package/build/esm/lib/unstable/kit/components/HTMLContent/index.d.ts

@@ -0,0 +1 @@
+export { HTMLContent, type HTMLContentProps } from './HTMLContent';

package/build/esm/lib/unstable/kit/components/HTMLContent/index.js

@@ -0,0 +1 @@
+export { HTMLContent } from './HTMLContent';

package/build/esm/lib/unstable/kit/components/index.d.ts

@@ -0,0 +1,3 @@
+export { ArrayRemoveButton, type ArrayRemoveButtonProps } from './ArrayRemoveButton';
+export { ControlError, type ControlErrorProps } from './ControlError';
+export { HTMLContent, type HTMLContentProps } from './HTMLContent';

package/build/esm/lib/unstable/kit/components/index.js

@@ -0,0 +1,3 @@
+export { ArrayRemoveButton } from './ArrayRemoveButton';
+export { ControlError } from './ControlError';
+export { HTMLContent } from './HTMLContent';

package/build/esm/lib/unstable/kit/config.d.ts

@@ -0,0 +1,95 @@
+import type { AsyncValidator, SchemaRendererConfig, SyncValidator } from '../core/types';
+import type { JsonSchemaArray, JsonSchemaBoolean, JsonSchemaNumber, JsonSchemaObject, JsonSchemaString } from '../core/types/schema';
+export declare const untypedConfig: {
+    readonly any: {
+        readonly controls: {
+            readonly baseAny: {
+                readonly Component: import("../core/types").Control<import("../core/types").JsonSchemaAny<any>>;
+            };
+        };
+        readonly views: {};
+        readonly wrappers: {};
+        readonly validators: {};
+    };
+    readonly array: {
+        readonly controls: {
+            readonly selectArray: {
+                readonly Component: import("../core/types").Control<JsonSchemaArray<any>>;
+            };
+            readonly baseArray: {
+                readonly Component: import("../core/types").Control<JsonSchemaArray<any>>;
+            };
+        };
+        readonly views: {};
+        readonly wrappers: {
+            readonly accordeonArray: <Schema extends import("../core/types").JsonSchema>({ schema, input, meta, children, wrapperProps, }: import("../core/types").WrapperProps<Schema>) => React.ReactNode;
+            readonly rowArray: import("react").MemoExoticComponent<(<Schema extends import("../core/types").JsonSchema>(props: import("../core/types").WrapperProps<Schema, {
+                qtest: boolean;
+                qwa?: string;
+            }>) => import("react").JSX.Element)>;
+        };
+        readonly validators: {
+            readonly baseArray: SyncValidator<JsonSchemaArray>;
+        };
+    };
+    readonly boolean: {
+        readonly controls: {};
+        readonly views: {};
+        readonly wrappers: {};
+        readonly validators: {
+            readonly baseBoolean: SyncValidator<JsonSchemaBoolean>;
+        };
+    };
+    readonly number: {
+        readonly controls: {
+            readonly baseNumber: {
+                readonly Component: import("react").MemoExoticComponent<(<T extends import("../core/types").ControlProps<JsonSchemaNumber, import("./Text").TextProps> | import("../core/types").ControlProps<JsonSchemaString, import("./Text").TextProps>>({ input, meta, schema, }: T) => import("react").JSX.Element)>;
+            };
+        };
+        readonly views: {};
+        readonly wrappers: {
+            readonly rowNumber: import("react").MemoExoticComponent<(<Schema extends import("../core/types").JsonSchema>(props: import("../core/types").WrapperProps<Schema, {
+                qtest: boolean;
+                qwa?: string;
+            }>) => import("react").JSX.Element)>;
+        };
+        readonly validators: {
+            readonly baseNumber: () => boolean;
+            readonly asyncNumber: AsyncValidator<JsonSchemaNumber>;
+        };
+    };
+    readonly object: {
+        readonly controls: {
+            readonly baseObject: {
+                readonly Component: import("react").FC<import("./ObjectBase").ObjectBaseProps>;
+                readonly independent: true;
+            };
+        };
+        readonly views: {};
+        readonly wrappers: {
+            readonly accordeonObject: <Schema extends import("../core/types").JsonSchema>({ schema, input, meta, children, wrapperProps, }: import("../core/types").WrapperProps<Schema>) => React.ReactNode;
+        };
+        readonly validators: {
+            readonly baseObject: SyncValidator<JsonSchemaObject>;
+        };
+    };
+    readonly string: {
+        readonly controls: {
+            readonly baseString: {
+                readonly Component: import("react").MemoExoticComponent<(<T extends import("../core/types").ControlProps<JsonSchemaNumber, import("./Text").TextProps> | import("../core/types").ControlProps<JsonSchemaString, import("./Text").TextProps>>({ input, meta, schema, }: T) => import("react").JSX.Element)>;
+            };
+        };
+        readonly views: {};
+        readonly wrappers: {
+            readonly rowString: import("react").MemoExoticComponent<(<Schema extends import("../core/types").JsonSchema>(props: import("../core/types").WrapperProps<Schema, {
+                qtest: boolean;
+                qwa?: string;
+            }>) => import("react").JSX.Element)>;
+        };
+        readonly validators: {
+            readonly baseString: SyncValidator<JsonSchemaString>;
+            readonly cccString: SyncValidator<JsonSchemaString>;
+        };
+    };
+};
+export declare const config: SchemaRendererConfig;

package/build/esm/lib/unstable/kit/config.js

@@ -0,0 +1,65 @@
+import { EntityType } from '../core/constants';
+import { Accordeon } from './Accordeon';
+import { AnyInput } from './Any';
+import { ArrayBase } from './ArrayBase';
+import { MultiSelect } from './MultiSelect';
+import { ObjectBase } from './ObjectBase';
+import { Row } from './Row';
+import { Text } from './Text';
+export const untypedConfig = {
+    [EntityType.Any]: {
+        controls: {
+            baseAny: { Component: AnyInput },
+        },
+        views: {},
+        wrappers: {},
+        validators: {},
+    },
+    [EntityType.Array]: {
+        controls: { selectArray: { Component: MultiSelect }, baseArray: { Component: ArrayBase } },
+        views: {},
+        wrappers: { accordeonArray: Accordeon, rowArray: Row },
+        validators: { baseArray: (() => false) },
+    },
+    [EntityType.Boolean]: {
+        controls: {},
+        views: {},
+        wrappers: {},
+        validators: { baseBoolean: (() => false) },
+    },
+    [EntityType.Number]: {
+        controls: { baseNumber: { Component: Text } },
+        views: {},
+        wrappers: { rowNumber: Row },
+        validators: {
+            baseNumber: () => false,
+            asyncNumber: (() => new Promise((resolve) => {
+                setTimeout(() => {
+                    resolve('bocembocembocem');
+                }, 2000);
+            })),
+        },
+    },
+    [EntityType.Object]: {
+        controls: { baseObject: { Component: ObjectBase, independent: true } },
+        views: {},
+        wrappers: { accordeonObject: Accordeon },
+        validators: { baseObject: (() => false) },
+    },
+    [EntityType.String]: {
+        controls: { baseString: { Component: Text } },
+        views: {},
+        wrappers: { rowString: Row },
+        validators: {
+            baseString: (() => 'jajaja'),
+            // async: (() =>
+            //     new Promise((resolve) => {
+            //         setTimeout(() => {
+            //             resolve('bocembocembocem');
+            //         }, 2000);
+            //     })) as AsyncValidator<JsonSchemaString>,
+            cccString: (() => 'ccc'),
+        },
+    },
+};
+export const config = untypedConfig;