@gravity-ui/dynamic-forms 5.19.1 → 5.20.0

package/build/esm/lib/unstable/kit/controls/Switch/Switch.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { type SwitchProps as SwitchBaseProps } from '@gravity-ui/uikit';
+import { type SwitchProps as UIKitSwitchProps } from '@gravity-ui/uikit';
 import type { JsonSchemaBoolean } from '../../../core';
 import './Switch.css';
-export interface SwitchProps extends Omit<SwitchBaseProps, 'checked' | 'onFocus' | 'onBlur' | 'onChange' | 'onUpdate' | 'qa'> {
+export interface SwitchProps extends Omit<UIKitSwitchProps, 'checked' | 'onFocus' | 'onBlur' | 'onChange' | 'onUpdate' | 'qa'> {
 }
 export declare const Switch: React.NamedExoticComponent<import("../../../core").ControlProps<JsonSchemaBoolean<any>, SwitchProps, {}>>;

package/build/esm/lib/unstable/kit/controls/Switch/Switch.js

@@ -1,13 +1,17 @@
 import React from 'react';
-import { Switch as SwitchBase } from '@gravity-ui/uikit';
-import { ControlError } from '../../components';
-import { block, getValidationState } from '../../utils';
+import { Switch as UIKitSwitch } from '@gravity-ui/uikit';
+import { ControlContainer } from '../../components';
+import { block, getBooleanValidationState } from '../../utils';
 import './Switch.css';
 const b = block('switch');
 const Component = ({ controlProps, input, schema, meta, }) => {
-    var _a;
-    return (React.createElement(ControlError, { errorMessage: meta.error, validationState: getValidationState(meta) },
-        React.createElement("div", { className: b() },
-            React.createElement(SwitchBase, Object.assign({ disabled: schema.readOnly }, controlProps, { checked: (_a = input.value) !== null && _a !== void 0 ? _a : false, onFocus: input.onFocus, onBlur: input.onBlur, onUpdate: input.onChange, qa: input.name })))));
+    const { name, onBlur, onChange, onFocus, value } = input;
+    const onUpdate = React.useCallback((value) => {
+        onFocus();
+        onChange(value);
+        onBlur();
+    }, [onBlur, onChange, onFocus]);
+    return (React.createElement(ControlContainer, { stretch: "fit", className: b({ error: getBooleanValidationState(meta) }), justifyContent: "center" },
+        React.createElement(UIKitSwitch, Object.assign({ disabled: schema.readOnly }, controlProps, { checked: value !== null && value !== void 0 ? value : false, onFocus: onFocus, onBlur: onBlur, onUpdate: onUpdate, qa: name }))));
 };
 export const Switch = React.memo(Component);

package/build/esm/lib/unstable/kit/controls/TextArea/TextArea.css

@@ -0,0 +1,3 @@
+.sr-text-area_error .g-text-area__content {
+  outline: none;
+}

package/build/esm/lib/unstable/kit/controls/TextArea/TextArea.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
-import { type TextAreaProps as TextAreaBaseProps } from '@gravity-ui/uikit';
+import { type TextAreaProps as UIKitTextAreaProps } from '@gravity-ui/uikit';
 import type { JsonSchemaString } from '../../../core';
-export interface TextAreaProps extends Omit<TextAreaBaseProps, 'value' | 'onFocus' | 'onBlur' | 'onChange' | 'onUpdate' | 'errorMessage' | 'validationState' | 'placeholder' | 'qa'> {
+import './TextArea.css';
+export interface TextAreaProps extends Omit<UIKitTextAreaProps, 'value' | 'onFocus' | 'onBlur' | 'onChange' | 'onUpdate' | 'errorMessage' | 'validationState' | 'qa'> {
 }
 export declare const TextArea: React.NamedExoticComponent<import("../../../core").ControlProps<JsonSchemaString<any>, TextAreaProps, {}>>;

package/build/esm/lib/unstable/kit/controls/TextArea/TextArea.js

@@ -1,8 +1,12 @@
 import React from 'react';
-import { TextArea as TextAreaBase } from '@gravity-ui/uikit';
-import { getValidationState } from '../../utils';
+import { TextArea as UIKitTextArea, } from '@gravity-ui/uikit';
+import { ControlContainer } from '../../components';
+import { block, getBooleanValidationState, getValidationState } from '../../utils';
+import './TextArea.css';
+const b = block('text-area');
 const Component = ({ controlProps, input, meta, schema, }) => {
     var _a, _b;
-    return (React.createElement(TextAreaBase, Object.assign({ maxRows: 20, minRows: 0, hasClear: true, disabled: schema.readOnly }, controlProps, { value: (_a = input.value) !== null && _a !== void 0 ? _a : '', onFocus: input.onFocus, onBlur: input.onBlur, onUpdate: input.onChange, errorMessage: meta.error, validationState: getValidationState(meta), placeholder: (_b = schema.examples) === null || _b === void 0 ? void 0 : _b[0], qa: input.name })));
+    return (React.createElement(ControlContainer, { stretch: "max", className: b({ error: getBooleanValidationState(meta) }) },
+        React.createElement(UIKitTextArea, Object.assign({ maxRows: 20, minRows: 0, placeholder: (_a = schema.examples) === null || _a === void 0 ? void 0 : _a[0], disabled: schema.readOnly, hasClear: true }, controlProps, { value: (_b = input.value) !== null && _b !== void 0 ? _b : '', onFocus: input.onFocus, onBlur: input.onBlur, onUpdate: input.onChange, errorMessage: undefined, validationState: getValidationState(meta), qa: input.name }))));
 };
 export const TextArea = React.memo(Component);

package/build/esm/lib/unstable/kit/controls/TextContent/TextContent.css

@@ -0,0 +1,10 @@
+.sr-text-content {
+  border: none;
+  box-shadow: none;
+}
+.sr-text-content.g-label:not(:has(.g-label__addon_side_start)) .g-label__text {
+  margin-left: 0;
+}
+.sr-text-content.g-label .g-label__separator {
+  margin-left: 0;
+}

package/build/esm/lib/unstable/kit/controls/TextContent/TextContent.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import * as icons from '@gravity-ui/icons';
+import { type IconProps, type LabelProps as UIKitLabelProps } from '@gravity-ui/uikit';
+import type { JsonSchemaString } from '../../../core';
+import './TextContent.css';
+export interface TextContentProps extends Omit<UIKitLabelProps, 'theme'> {
+    iconName?: keyof typeof icons;
+    iconProps?: Partial<IconProps>;
+}
+export declare const TextContent: React.NamedExoticComponent<import("../../../core").ControlProps<JsonSchemaString<any>, TextContentProps, {}>>;

package/build/esm/lib/unstable/kit/controls/TextContent/TextContent.js

@@ -0,0 +1,27 @@
+import { __rest } from "tslib";
+import React from 'react';
+import * as icons from '@gravity-ui/icons';
+import { Icon, Label as UIKitLabel, } from '@gravity-ui/uikit';
+import { ControlContainer } from '../../components';
+import { block } from '../../utils';
+import './TextContent.css';
+const b = block('text-content');
+const Component = ({ controlProps, input, schema }) => {
+    const { iconName, iconProps, title: titleProp } = controlProps, controlRestProps = __rest(controlProps, ["iconName", "iconProps", "title"]);
+    const icon = React.useMemo(() => iconName && icons[iconName] ? (React.createElement(Icon, Object.assign({ data: icons[iconName] }, iconProps))) : undefined, [iconName, iconProps]);
+    const content = React.useMemo(() => {
+        if (titleProp) {
+            if (typeof titleProp === 'string') {
+                return React.createElement("span", { dangerouslySetInnerHTML: { __html: titleProp } });
+            }
+            return titleProp;
+        }
+        if (schema.description) {
+            return React.createElement("span", { dangerouslySetInnerHTML: { __html: schema.description } });
+        }
+        return undefined;
+    }, [titleProp, schema.description]);
+    return (React.createElement(ControlContainer, { stretch: "fit" },
+        React.createElement(UIKitLabel, Object.assign({ size: "m", value: input.value, icon: icon }, controlRestProps, { className: b(null, controlRestProps.className), theme: "clear" }), content)));
+};
+export const TextContent = React.memo(Component);

package/build/esm/lib/unstable/kit/controls/TextContent/index.d.ts

@@ -0,0 +1 @@
+export { TextContent, type TextContentProps } from './TextContent';

package/build/esm/lib/unstable/kit/controls/TextContent/index.js

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

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

@@ -1,16 +1,26 @@
+export { Alert, type AlertProps } from './Alert';
 export { ArrayBase, type ArrayBaseProps } from './ArrayBase';
+export { ArrayTable, type ArrayTableProps } from './ArrayTable';
 export { Checkbox, type CheckboxProps } from './Checkbox';
 export { CheckboxGroup, type CheckboxGroupProps } from './CheckboxGroup';
 export { ColorPicker, type ColorPickerProps } from './ColorPicker';
 export { DateInput, type DateInputProps } from './DateInput';
+export { FewOfNested, type FewOfNestedProps } from './FewOfNested';
+export { FileInput, type FileInputProps } from './FileInput';
+export { Label, type LabelProps } from './Label';
 export { MultiSelect, type MultiSelectProps } from './MultiSelect';
 export { NumberBase, type NumberBaseProps } from './NumberBase';
 export { ObjectBase, type ObjectBaseProps } from './ObjectBase';
+export { ObjectInline, type ObjectInlineProps } from './ObjectInline';
+export { OneOfNested, type OneOfNestedProps } from './OneOfNested';
+export { DotValue, type DotValueProps } from './DotValue';
 export { Password, type PasswordProps } from './Password';
 export { RadioGroup, type RadioGroupProps } from './RadioGroup';
 export { RangeSlider, type RangeSliderProps } from './RangeSlider';
 export { Select, type SelectProps } from './Select';
+export { SegmentedRadioGroup, type SegmentedRadioGroupProps } from './SegmentedRadioGroup';
 export { Slider, type SliderProps } from './Slider';
 export { StringBase, type StringBaseProps } from './StringBase';
 export { Switch, type SwitchProps } from './Switch';
 export { TextArea, type TextAreaProps } from './TextArea';
+export { TextContent, type TextContentProps } from './TextContent';

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

@@ -1,16 +1,26 @@
+export { Alert } from './Alert';
 export { ArrayBase } from './ArrayBase';
+export { ArrayTable } from './ArrayTable';
 export { Checkbox } from './Checkbox';
 export { CheckboxGroup } from './CheckboxGroup';
 export { ColorPicker } from './ColorPicker';
 export { DateInput } from './DateInput';
+export { FewOfNested } from './FewOfNested';
+export { FileInput } from './FileInput';
+export { Label } from './Label';
 export { MultiSelect } from './MultiSelect';
 export { NumberBase } from './NumberBase';
 export { ObjectBase } from './ObjectBase';
+export { ObjectInline } from './ObjectInline';
+export { OneOfNested } from './OneOfNested';
+export { DotValue } from './DotValue';
 export { Password } from './Password';
 export { RadioGroup } from './RadioGroup';
 export { RangeSlider } from './RangeSlider';
 export { Select } from './Select';
+export { SegmentedRadioGroup } from './SegmentedRadioGroup';
 export { Slider } from './Slider';
 export { StringBase } from './StringBase';
 export { Switch } from './Switch';
 export { TextArea } from './TextArea';
+export { TextContent } from './TextContent';

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

@@ -1,6 +1,7 @@
 import type { FormApi } from 'final-form';
 import type { FieldMetaState } from 'react-final-form';
 export declare const getValidationState: (meta: FieldMetaState<any>) => "invalid" | undefined;
+export declare const getBooleanValidationState: (meta: FieldMetaState<any>) => boolean;
 export declare const getArrayItemParentName: (name: string) => string;
 export declare const getArrayItemIndex: (name: string) => string;
 export declare const isArrayItem: (name: string) => boolean;

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

@@ -4,6 +4,9 @@ export const getValidationState = (meta) => {
     }
     return undefined;
 };
+export const getBooleanValidationState = (meta) => {
+    return getValidationState(meta) === 'invalid';
+};
 export const getArrayItemParentName = (name) => name.slice(0, name.lastIndexOf('['));
 export const getArrayItemIndex = (name) => name.slice(name.lastIndexOf('[') + 1, -1);
 export const isArrayItem = (name) => name.endsWith(']');

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

@@ -1,2 +1,2 @@
 export { block } from './cn';
-export { getArrayItemIndex, getArrayItemParentName, getValidationState, isArrayItem, isTupleItem, } from './common';
+export { getArrayItemIndex, getArrayItemParentName, getBooleanValidationState, getValidationState, isArrayItem, isTupleItem, } from './common';

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

@@ -1,2 +1,2 @@
 export { block } from './cn';
-export { getArrayItemIndex, getArrayItemParentName, getValidationState, isArrayItem, isTupleItem, } from './common';
+export { getArrayItemIndex, getArrayItemParentName, getBooleanValidationState, getValidationState, isArrayItem, isTupleItem, } from './common';

package/build/esm/lib/unstable/kit/wrappers/Accordeon/Accordeon.css

@@ -0,0 +1,35 @@
+.sr-accordeon {
+  margin-bottom: calc(var(--g-spacing-base) * 4);
+}
+.sr-accordeon:last-child {
+  margin-bottom: 0;
+}
+.sr-accordeon .g-disclosure__trigger {
+  padding-left: 6.5px;
+}
+.sr-accordeon_without-default-summary .g-disclosure__trigger {
+  padding-left: 0;
+}
+.sr-accordeon_without-default-summary .g-disclosure__trigger .g-arrow-toggle {
+  display: none;
+}
+.sr-accordeon__toggler {
+  padding-left: 6px;
+}
+.sr-accordeon__content {
+  margin-top: calc(var(--g-spacing-base) * 4);
+}
+.sr-accordeon__content_with-indent {
+  position: relative;
+  padding-left: calc(var(--g-spacing-base) * 7);
+}
+.sr-accordeon__content_with-indent:before {
+  content: "";
+  display: block;
+  width: 1px;
+  height: calc(100% + var(--g-spacing-base) * 2);
+  background-color: var(--g-color-line-generic);
+  position: absolute;
+  left: calc(var(--g-spacing-base) * 3 + 1.5px);
+  bottom: 0;
+}

package/build/esm/lib/unstable/kit/wrappers/Accordeon/Accordeon.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { type ButtonProps, type DisclosureProps, type TextProps } from '@gravity-ui/uikit';
+import type { JsonSchema } from '../../../core';
+import './Accordeon.css';
+export interface AccordeonProps extends DisclosureProps {
+    titleProps?: TextProps;
+    togglerProps?: ButtonProps;
+    withDefaultSummary?: boolean;
+    withIndent?: boolean;
+}
+export declare const Accordeon: React.NamedExoticComponent<import("../../../core").WrapperProps<JsonSchema, AccordeonProps>>;

package/build/esm/lib/unstable/kit/wrappers/Accordeon/Accordeon.js

@@ -0,0 +1,37 @@
+import { __rest } from "tslib";
+import React from 'react';
+import { ChevronDown, ChevronUp } from '@gravity-ui/icons';
+import { Button, Disclosure, Flex, HelpMark, Icon, Text, } from '@gravity-ui/uikit';
+import { ArrayRemoveButton, ControlError, HTMLContent, WrapperContainer } from '../../components';
+import { block, getValidationState } from '../../utils';
+import './Accordeon.css';
+const b = block('accordeon');
+const Component = ({ children, input, meta, schema, wrapperProps, }) => {
+    const { withIndent = false, withDefaultSummary = false, titleProps, togglerProps } = wrapperProps, restWrapperProps = __rest(wrapperProps, ["withIndent", "withDefaultSummary", "titleProps", "togglerProps"]);
+    const summary = React.useMemo(() => {
+        const stopPropagation = (event) => {
+            event.stopPropagation();
+        };
+        return (React.createElement(Flex, { alignItems: "center", gap: 2 },
+            withDefaultSummary ? (React.createElement(Text, Object.assign({}, titleProps), schema.title)) : (React.createElement(Disclosure.Summary, null, (props) => (React.createElement(Button, Object.assign({}, togglerProps, { className: b('toggler', togglerProps === null || togglerProps === void 0 ? void 0 : togglerProps.className) }),
+                React.createElement(Flex, { alignItems: "center", gap: 2, height: "100%" },
+                    React.createElement(Icon, { data: props.expanded ? ChevronUp : ChevronDown }),
+                    React.createElement(Text, Object.assign({}, titleProps), schema.title)))))),
+            schema.description ? (React.createElement(HelpMark, { onClick: stopPropagation },
+                React.createElement(HTMLContent, { html: schema.description }))) : null,
+            React.createElement(ArrayRemoveButton, { name: input.name, onClick: stopPropagation })));
+    }, [
+        input.name,
+        schema.title,
+        schema.description,
+        titleProps,
+        togglerProps,
+        withDefaultSummary,
+    ]);
+    return (React.createElement(WrapperContainer, { className: b({ 'without-default-summary': !withDefaultSummary }) },
+        React.createElement(Disclosure, Object.assign({ summary: summary, defaultExpanded: true }, restWrapperProps),
+            React.createElement(Flex, { direction: "column", gap: 0.5, grow: 1 },
+                React.createElement("div", { className: b('content', { 'with-indent': withIndent }) }, children),
+                React.createElement(ControlError, { errorMessage: meta.error, validationState: getValidationState(meta) })))));
+};
+export const Accordeon = React.memo(Component);

package/build/esm/lib/unstable/kit/wrappers/Accordeon/index.d.ts

@@ -0,0 +1 @@
+export { Accordeon, type AccordeonProps } from './Accordeon';

package/build/esm/lib/unstable/kit/wrappers/Accordeon/index.js

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

package/build/esm/lib/unstable/kit/wrappers/Row/Row.css

@@ -8,7 +8,7 @@
   display: inline;
   width: 180px;
   min-height: 28px;
-  padding-top: 5.5px;
+  padding-top: 4.5px;
 }
 .sr-row__title {
   min-height: 18px;
@@ -19,9 +19,6 @@
   margin-left: calc(var(--g-spacing-base) * 1);
   color: var(--g-color-text-danger);
 }
-.sr-row__right {
-  display: flex;
-  flex-direction: column;
-  flex-grow: 1;
-  gap: calc(var(--g-spacing-base) * 0.5);
+.sr-row__help-mark {
+  margin-top: 1.5px;
 }

package/build/esm/lib/unstable/kit/wrappers/Row/Row.js

@@ -1,15 +1,15 @@
 import React from 'react';
 import { Flex, HelpMark, Text } from '@gravity-ui/uikit';
-import { ArrayRemoveButton, HTMLContent } from '../../components';
-import { block } from '../../utils';
+import { ArrayRemoveButton, ControlError, HTMLContent, WrapperContainer } from '../../components';
+import { block, getValidationState } from '../../utils';
 import './Row.css';
 const b = block('row');
-const Component = ({ children, input, schema, wrapperProps }) => {
+const Component = ({ children, input, meta, schema, wrapperProps, }) => {
     const tooltip = React.useMemo(() => {
         if (!schema.description || wrapperProps.descriptionType === 'bottom') {
             return null;
         }
-        return (React.createElement(HelpMark, null,
+        return (React.createElement(HelpMark, { className: b('help-mark') },
             React.createElement(HTMLContent, { html: schema.description })));
     }, [schema.description, wrapperProps.descriptionType]);
     const bottomDescription = React.useMemo(() => {
@@ -18,14 +18,15 @@ const Component = ({ children, input, schema, wrapperProps }) => {
         }
         return React.createElement(HTMLContent, { html: schema.description, color: "secondary" });
     }, [schema.description, wrapperProps.descriptionType]);
-    return (React.createElement(Flex, { className: b(), alignItems: "flex-start", gap: 2 },
+    return (React.createElement(WrapperContainer, { className: b(), direction: "row", alignItems: "flex-start", gap: 2 },
         React.createElement("div", { className: b('left') },
             React.createElement(Text, { className: b('title', { required: wrapperProps.required }), wordBreak: "break-word" }, schema.title),
             tooltip),
-        React.createElement("div", { className: b('right') },
-            React.createElement(Flex, { gap: 2 },
+        React.createElement(Flex, { className: b('right'), direction: "column", gap: 0.5, grow: 1 },
+            React.createElement(Flex, { grow: 1, gap: 2 },
                 children,
                 React.createElement(ArrayRemoveButton, { name: input.name })),
-            bottomDescription)));
+            bottomDescription,
+            React.createElement(ControlError, { errorMessage: meta.error, validationState: getValidationState(meta) }))));
 };
 export const Row = React.memo(Component);

package/build/esm/lib/unstable/kit/wrappers/Section/Section.css

@@ -0,0 +1,23 @@
+.sr-section {
+  margin-bottom: calc(var(--g-spacing-base) * 4);
+}
+.sr-section:last-child {
+  margin-bottom: 0;
+}
+.sr-section__header {
+  min-height: 28px;
+}
+.sr-section__content_with-indent {
+  position: relative;
+  padding-left: calc(var(--g-spacing-base) * 7);
+}
+.sr-section__content_with-indent:before {
+  content: "";
+  display: block;
+  width: 1px;
+  height: calc(100% + var(--g-spacing-base) * 2);
+  background-color: var(--g-color-line-generic);
+  position: absolute;
+  left: calc(var(--g-spacing-base) * 3 + 1.5px);
+  bottom: 0;
+}

package/build/esm/lib/unstable/kit/wrappers/Section/Section.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { type TextProps } from '@gravity-ui/uikit';
+import type { JsonSchema } from '../../../core';
+import './Section.css';
+export interface SectionProps extends TextProps {
+    descriptionType?: 'tooltip' | 'bottom';
+    withIndent?: boolean;
+}
+export declare const Section: React.NamedExoticComponent<import("../../../core").WrapperProps<JsonSchema, SectionProps>>;

package/build/esm/lib/unstable/kit/wrappers/Section/Section.js

@@ -0,0 +1,34 @@
+import { __rest } from "tslib";
+import React from 'react';
+import { Flex, HelpMark, Text } from '@gravity-ui/uikit';
+import { ArrayRemoveButton, ControlError, HTMLContent, WrapperContainer } from '../../components';
+import { block, getValidationState } from '../../utils';
+import './Section.css';
+const b = block('section');
+const Component = ({ children, input, meta, schema, wrapperProps, }) => {
+    const { descriptionType = 'tooltip', withIndent = false } = wrapperProps, restWrapperProps = __rest(wrapperProps, ["descriptionType", "withIndent"]);
+    const tooltip = React.useMemo(() => {
+        if (!schema.description || descriptionType === 'bottom') {
+            return null;
+        }
+        return (React.createElement(HelpMark, null,
+            React.createElement(HTMLContent, { html: schema.description })));
+    }, [schema.description, descriptionType]);
+    const bottomDescription = React.useMemo(() => {
+        if (!schema.description || descriptionType !== 'bottom') {
+            return null;
+        }
+        return React.createElement(HTMLContent, { html: schema.description, color: "secondary" });
+    }, [schema.description, descriptionType]);
+    return (React.createElement(WrapperContainer, { className: b(), gap: 0.5 },
+        React.createElement(Flex, { direction: "column", gap: 4 },
+            React.createElement(Flex, { direction: "column", gap: 2 },
+                React.createElement(Flex, { className: b('header'), gap: 2, alignItems: "center" },
+                    React.createElement(Text, Object.assign({ variant: "subheader-1" }, restWrapperProps), schema.title),
+                    tooltip,
+                    React.createElement(ArrayRemoveButton, { name: input.name })),
+                bottomDescription),
+            React.createElement("div", { className: b('content', { 'with-indent': withIndent }) }, children)),
+        React.createElement(ControlError, { errorMessage: meta.error, validationState: getValidationState(meta) })));
+};
+export const Section = React.memo(Component);

package/build/esm/lib/unstable/kit/wrappers/Section/index.d.ts

@@ -0,0 +1 @@
+export { Section, type SectionProps } from './Section';

package/build/esm/lib/unstable/kit/wrappers/Section/index.js

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

package/build/esm/lib/unstable/kit/wrappers/Transparent/Transparent.js

@@ -1,12 +1,14 @@
 import React from 'react';
 import { Flex } from '@gravity-ui/uikit';
-import { ArrayRemoveButton } from '../../components';
-import { block } from '../../utils';
+import { ArrayRemoveButton, ControlError, WrapperContainer } from '../../components';
+import { block, getValidationState } from '../../utils';
 import './Transparent.css';
 const b = block('transparent');
-const Component = ({ children, input }) => {
-    return (React.createElement(Flex, { className: b(), gap: 2 },
-        children,
-        React.createElement(ArrayRemoveButton, { name: input.name })));
+const Component = ({ children, input, meta }) => {
+    return (React.createElement(WrapperContainer, { className: b(), gap: 0.5 },
+        React.createElement(Flex, { grow: 1, gap: 2 },
+            children,
+            React.createElement(ArrayRemoveButton, { name: input.name })),
+        React.createElement(ControlError, { errorMessage: meta.error, validationState: getValidationState(meta) })));
 };
 export const Transparent = React.memo(Component);

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

@@ -1,2 +1,4 @@
+export { Accordeon, type AccordeonProps } from './Accordeon';
 export { Row, type RowProps } from './Row';
+export { Section, type SectionProps } from './Section';
 export { Transparent } from './Transparent';

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

@@ -1,2 +1,4 @@
+export { Accordeon } from './Accordeon';
 export { Row } from './Row';
+export { Section } from './Section';
 export { Transparent } from './Transparent';

package/package.json

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

package/build/cjs/lib/unstable/kit/Accordeon.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-import type { JsonSchema, WrapperProps } from '../core/types';
-export declare const Accordeon: <Schema extends JsonSchema>({ schema, input, meta, children, wrapperProps, }: WrapperProps<Schema>) => React.ReactNode;

package/build/cjs/lib/unstable/kit/Accordeon.js

@@ -1,31 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Accordeon = void 0;
-const tslib_1 = require("tslib");
-// import {ArrayLayoutProps, ObjectLayoutProps, isArrayItem} from '../../../../core';
-const react_1 = tslib_1.__importDefault(require("react"));
-const components_1 = require("../../kit/components");
-// import {useErrorChecker} from '../../../hooks';
-// import {RemoveButton} from '../../kit/components/RemoveButton';
-const SimpleVerticalAccordeon_1 = require("../../kit/components/SimpleVerticalAccordeon");
-const Accordeon = ({ schema, input, meta, children, wrapperProps, }) => {
-    const [open, setOpen] = react_1.default.useState(Boolean(wrapperProps === null || wrapperProps === void 0 ? void 0 : wrapperProps.open));
-    // const onDrop = React.useCallback(() => {
-    //     setOpen(false);
-    //     input.onDrop();
-    // }, [input.onDrop, setOpen]);
-    // const removeButton = React.useMemo(() => {
-    //     if (!isArrayItem(name) && (spec.required || !input.value)) {
-    //         return null;
-    //     }
-    //     return <RemoveButton name={name} onDrop={onDrop} />;
-    // }, [spec.required, input.value, onDrop, name]);
-    // useErrorChecker({name, meta, open, setOpen});
-    return (react_1.default.createElement(SimpleVerticalAccordeon_1.SimpleVerticalAccordeon, { name: input.name, title: schema.title || '', note: schema.description || '', open: open, onOpenChange: setOpen, 
-        // headerActionsTemplate={removeButton}
-        hideInsteadOfDestroy: true, withBranchView: true },
-        react_1.default.createElement(components_1.ErrorWrapper, { name: input.name, meta: meta, 
-            // ff
-            withoutChildErrorStyles: true }, children)));
-};
-exports.Accordeon = Accordeon;

package/build/cjs/lib/unstable/kit/Any.d.ts

@@ -1,2 +0,0 @@
-import type { Control, JsonSchemaAny } from '../core/types';
-export declare const AnyInput: Control<JsonSchemaAny>;

package/build/cjs/lib/unstable/kit/Any.js

@@ -1,21 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AnyInput = void 0;
-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 AnyInput = ({ input, schema }) => {
-    var _a;
-    const [state, setState] = react_1.default.useState(true);
-    // React.useEffect(() => {
-    //     input.onChange(undefined);
-    // }, []);
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(core_1.Entity, { name: `${input.name}.bla`, schema: (_a = schema.oneOf) === null || _a === void 0 ? void 0 : _a[state ? 0 : 1] }),
-        react_1.default.createElement(uikit_1.Button, { onClick: () => {
-                input.onChange(undefined);
-                setState(!state);
-            } }, "Toggle")));
-};
-exports.AnyInput = AnyInput;

package/build/cjs/lib/unstable/kit/ArrayBase.css

@@ -1,23 +0,0 @@
-.array-base_add-button-right {
-  display: flex;
-  align-items: flex-end;
-}
-.array-base_add-button-right .transparent {
-  align-items: flex-end;
-}
-.array-base__items-wrapper_add-button-down {
-  margin-bottom: 15px;
-}
-.array-base__items-wrapper_items-primitive {
-  min-width: 100%;
-}
-.array-base__items-wrapper_items-primitive:empty {
-  min-width: unset;
-}
-.array-base__item-prefix {
-  margin-top: -7px;
-  margin-bottom: 8px;
-}
-.array-base__add-button_right {
-  margin-left: 4px;
-}

package/build/cjs/lib/unstable/kit/ArrayBase.d.ts

@@ -1,2 +0,0 @@
-import type { Control, JsonSchemaArray } from '../core/types';
-export declare const ArrayBase: Control<JsonSchemaArray>;