@gravity-ui/dynamic-forms 5.19.1 → 5.21.0

package/build/cjs/lib/unstable/kit/components/CopyButton/CopyButton.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CopyButton = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
+const isNumber_1 = tslib_1.__importDefault(require("lodash/isNumber"));
+const isString_1 = tslib_1.__importDefault(require("lodash/isString"));
+const utils_1 = require("../../utils");
+const b = (0, utils_1.block)('copy-button');
+const CopyButton = ({ className, copy, value }) => {
+    if (copy && ((0, isString_1.default)(value) || (0, isNumber_1.default)(value))) {
+        return (react_1.default.createElement("div", { className: b(null, className) },
+            react_1.default.createElement(uikit_1.ClipboardButton, { text: String(value), view: "flat", size: "s" })));
+    }
+    return null;
+};
+exports.CopyButton = CopyButton;

package/build/cjs/lib/unstable/kit/components/CopyButton/index.d.ts

@@ -0,0 +1 @@
+export { CopyButton, type CopyButtonProps } from './CopyButton';

package/build/cjs/lib/unstable/kit/components/CopyButton/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CopyButton = void 0;
+var CopyButton_1 = require("./CopyButton");
+Object.defineProperty(exports, "CopyButton", { enumerable: true, get: function () { return CopyButton_1.CopyButton; } });

package/build/cjs/lib/unstable/kit/components/EmptyEntityValue/EmptyEntityValue.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const EmptyEntityValue: React.FC;

package/build/cjs/lib/unstable/kit/components/EmptyEntityValue/EmptyEntityValue.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EmptyEntityValue = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const constants_1 = require("../../constants");
+const EntityContainer_1 = require("../EntityContainer");
+const EmptyEntityValue = () => {
+    return (react_1.default.createElement(EntityContainer_1.EntityContainer, { stretch: "fit", fill: "empty" }, constants_1.DASH));
+};
+exports.EmptyEntityValue = EmptyEntityValue;

package/build/cjs/lib/unstable/kit/components/EmptyEntityValue/index.d.ts

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

package/build/cjs/lib/unstable/kit/components/EmptyEntityValue/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EmptyEntityValue = void 0;
+var EmptyEntityValue_1 = require("./EmptyEntityValue");
+Object.defineProperty(exports, "EmptyEntityValue", { enumerable: true, get: function () { return EmptyEntityValue_1.EmptyEntityValue; } });

package/build/cjs/lib/unstable/kit/components/EntityContainer/EntityContainer.css

@@ -0,0 +1,22 @@
+.sr-entity-container {
+  display: flex;
+  flex-direction: column;
+}
+.sr-entity-container_stretch_max {
+  width: 100%;
+  flex: 1 0 0;
+}
+.sr-entity-container_stretch_fit {
+  width: fit-content;
+  max-width: 100%;
+  min-width: 0;
+  flex: 0 1 auto;
+}
+.sr-entity-container_stretch_by-child {
+  width: fit-content;
+  flex: 0 0 auto;
+}
+.sr-entity-container_stretch_by-child:has([data-stretch=max]) {
+  width: 100%;
+  flex: 1 0 0;
+}

package/build/cjs/lib/unstable/kit/components/EntityContainer/EntityContainer.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { type FlexProps } from '@gravity-ui/uikit';
+export interface EntityContainerProps extends FlexProps {
+    children: React.ReactNode;
+    fill?: 'populated' | 'empty' | 'by-child';
+    stretch: 'max' | 'fit' | 'by-child';
+}
+export declare const EntityContainer: React.FC<EntityContainerProps>;

package/build/cjs/lib/unstable/kit/components/EntityContainer/EntityContainer.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EntityContainer = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
+const utils_1 = require("../../utils");
+const b = (0, utils_1.block)('entity-container');
+const EntityContainer = (_a) => {
+    var { children, fill, stretch } = _a, restFlexProps = tslib_1.__rest(_a, ["children", "fill", "stretch"]);
+    return (react_1.default.createElement("div", { className: b({ stretch }), "data-stretch": stretch, "data-fill": fill },
+        react_1.default.createElement(uikit_1.Flex, Object.assign({ direction: "column", minWidth: 0 }, restFlexProps, { grow: 1 }), children)));
+};
+exports.EntityContainer = EntityContainer;

package/build/cjs/lib/unstable/kit/components/EntityContainer/index.d.ts

@@ -0,0 +1 @@
+export { EntityContainer, type EntityContainerProps } from './EntityContainer';

package/build/cjs/lib/unstable/kit/components/EntityContainer/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EntityContainer = void 0;
+var EntityContainer_1 = require("./EntityContainer");
+Object.defineProperty(exports, "EntityContainer", { enumerable: true, get: function () { return EntityContainer_1.EntityContainer; } });

package/build/cjs/lib/unstable/kit/components/EntityError/EntityError.css

@@ -0,0 +1,3 @@
+.sr-entity-error {
+  margin-top: 2px;
+}

package/build/cjs/lib/unstable/kit/components/EntityError/EntityError.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface EntityErrorProps {
+    errorMessage?: string;
+    validationState?: 'invalid';
+}
+export declare const EntityError: React.FC<EntityErrorProps>;

package/build/cjs/lib/unstable/kit/components/EntityError/EntityError.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EntityError = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
+const utils_1 = require("../../utils");
+const b = (0, utils_1.block)('entity-error');
+const EntityError = ({ errorMessage, validationState }) => {
+    if (validationState === 'invalid' && errorMessage) {
+        return (react_1.default.createElement(uikit_1.Text, { className: b(), color: "danger" }, errorMessage));
+    }
+    return null;
+};
+exports.EntityError = EntityError;

package/build/cjs/lib/unstable/kit/components/EntityError/index.d.ts

@@ -0,0 +1 @@
+export { EntityError, type EntityErrorProps } from './EntityError';

package/build/cjs/lib/unstable/kit/components/EntityError/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EntityError = void 0;
+var EntityError_1 = require("./EntityError");
+Object.defineProperty(exports, "EntityError", { enumerable: true, get: function () { return EntityError_1.EntityError; } });

package/build/cjs/lib/unstable/kit/components/LayoutContainer/LayoutContainer.css

@@ -0,0 +1,11 @@
+.sr-layout-container {
+  width: fit-content;
+  flex: 0 0 auto;
+}
+.sr-layout-container:has([data-stretch=max]) {
+  width: 100%;
+  flex: 1 0 0;
+}
+.sr-layout-container_hide-empty:not(:has([data-fill=populated])) {
+  display: none;
+}

package/build/cjs/lib/unstable/kit/components/LayoutContainer/LayoutContainer.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { type FlexProps } from '@gravity-ui/uikit';
+export interface LayoutContainerProps extends FlexProps {
+    children: React.ReactNode;
+    hideEmpty?: boolean;
+}
+export declare const LayoutContainer: React.FC<LayoutContainerProps>;

package/build/cjs/lib/unstable/kit/components/LayoutContainer/LayoutContainer.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LayoutContainer = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
+const utils_1 = require("../../utils");
+const b = (0, utils_1.block)('layout-container');
+const LayoutContainer = (_a) => {
+    var { className, children, hideEmpty = false } = _a, restProps = tslib_1.__rest(_a, ["className", "children", "hideEmpty"]);
+    return (react_1.default.createElement(uikit_1.Flex, Object.assign({ className: b({ 'hide-empty': hideEmpty }, className), direction: "column" }, restProps), children));
+};
+exports.LayoutContainer = LayoutContainer;

package/build/cjs/lib/unstable/kit/components/LayoutContainer/index.d.ts

@@ -0,0 +1 @@
+export { LayoutContainer, type LayoutContainerProps } from './LayoutContainer';

package/build/cjs/lib/unstable/kit/components/LayoutContainer/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LayoutContainer = void 0;
+var LayoutContainer_1 = require("./LayoutContainer");
+Object.defineProperty(exports, "LayoutContainer", { enumerable: true, get: function () { return LayoutContainer_1.LayoutContainer; } });

package/build/cjs/lib/unstable/kit/components/LongValue/LongValue.css

@@ -0,0 +1,19 @@
+.sr-long-value {
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.sr-long-value_open {
+  white-space: pre-wrap;
+  overflow-wrap: break-word;
+}
+.sr-long-value_long {
+  cursor: pointer;
+}
+.sr-long-value_long:hover {
+  color: var(--g-color-text-secondary);
+}
+.sr-long-value_long.sr-long-value_secondary:hover {
+  color: var(--g-color-text-primary);
+}

package/build/cjs/lib/unstable/kit/components/LongValue/LongValue.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { type TextProps } from '@gravity-ui/uikit';
+export interface LongValueProps extends Omit<TextProps, 'children'> {
+    onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
+    value?: string | number | boolean;
+}
+export declare const LongValue: React.FC<LongValueProps>;

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

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LongValue = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
+const utils_1 = require("../../utils");
+const b = (0, utils_1.block)('long-value');
+const LongValue = (_a) => {
+    var { className, color, onClick, value } = _a, restProps = tslib_1.__rest(_a, ["className", "color", "onClick", "value"]);
+    const ref = react_1.default.useRef(null);
+    const openRef = react_1.default.useRef(false);
+    const [open, setOpen] = react_1.default.useState(false);
+    const [long, setLong] = react_1.default.useState(false);
+    const handleClick = react_1.default.useCallback((event) => {
+        onClick === null || onClick === void 0 ? void 0 : onClick(event);
+        setOpen((current) => {
+            openRef.current = !current;
+            return !current;
+        });
+    }, [onClick]);
+    react_1.default.useLayoutEffect(() => {
+        const node = ref.current;
+        if (!node) {
+            return undefined;
+        }
+        openRef.current = false;
+        setOpen(false);
+        const measure = () => {
+            if (openRef.current || (node.offsetWidth === 0 && node.scrollWidth === 0)) {
+                return;
+            }
+            setLong(node.scrollWidth > node.offsetWidth);
+        };
+        measure();
+        const observer = new ResizeObserver(measure);
+        observer.observe(node);
+        return () => observer.disconnect();
+    }, [value]);
+    return (react_1.default.createElement(uikit_1.Text, Object.assign({ as: "div" }, restProps, { ref: ref, color: color, className: b({ open, long }, className), onClick: long ? handleClick : undefined }), value));
+};
+exports.LongValue = LongValue;

package/build/cjs/lib/unstable/kit/components/LongValue/index.d.ts

@@ -0,0 +1 @@
+export { LongValue, type LongValueProps } from './LongValue';

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

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LongValue = void 0;
+var LongValue_1 = require("./LongValue");
+Object.defineProperty(exports, "LongValue", { enumerable: true, get: function () { return LongValue_1.LongValue; } });

package/build/cjs/lib/unstable/kit/components/MonacoContainer/MonacoContainer.css

@@ -0,0 +1,21 @@
+.sr-monaco-container {
+  position: relative;
+  border: 1px solid var(--g-color-line-generic);
+  border-radius: 6px;
+  overflow: hidden;
+}
+.sr-monaco-container__header {
+  padding: calc(var(--g-spacing-base) * 1.5) calc(var(--g-spacing-base) * 4);
+  border-bottom: 1px solid var(--g-color-line-generic);
+  background-color: var(--g-color-base-float-hover);
+}
+.sr-monaco-container__control {
+  position: relative;
+}
+.sr-monaco-container__control-inner {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}

package/build/cjs/lib/unstable/kit/components/MonacoContainer/MonacoContainer.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export interface MonacoContainerProps {
+    children: React.ReactNode;
+    dialog?: boolean;
+    height: string | number;
+    language?: string;
+    toggleDialogVisibility?: () => void;
+    width: string | number;
+    withDialog?: boolean;
+    qa?: string;
+}
+export declare const MonacoContainer: React.FC<MonacoContainerProps>;

package/build/cjs/lib/unstable/kit/components/MonacoContainer/MonacoContainer.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MonacoContainer = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const icons_1 = require("@gravity-ui/icons");
+const uikit_1 = require("@gravity-ui/uikit");
+const utils_1 = require("../../utils");
+const b = (0, utils_1.block)('monaco-container');
+const MonacoContainer = ({ children, dialog, height, language, toggleDialogVisibility, width, withDialog, qa, }) => {
+    return (react_1.default.createElement("div", { className: b(), "data-qa": qa },
+        react_1.default.createElement(uikit_1.Flex, { alignItems: "center", justifyContent: "space-between", className: b('header') },
+            react_1.default.createElement(uikit_1.Flex, { alignItems: "center", gap: 1 },
+                react_1.default.createElement(uikit_1.Icon, { data: icons_1.Code, size: 16 }),
+                react_1.default.createElement(uikit_1.Text, { variant: "subheader-1" }, language)),
+            withDialog ? (react_1.default.createElement(uikit_1.Button, { onClick: toggleDialogVisibility, view: "flat-secondary", qa: `${qa}-dialog-toggler` },
+                react_1.default.createElement(uikit_1.Icon, { data: dialog ? icons_1.ChevronsCollapseUpRight : icons_1.ChevronsExpandUpRight, size: 16 }))) : null),
+        react_1.default.createElement("div", { className: b('control'), style: { width, height } },
+            react_1.default.createElement("div", { className: b('control-inner') }, children))));
+};
+exports.MonacoContainer = MonacoContainer;

package/build/cjs/lib/unstable/kit/components/MonacoContainer/index.d.ts

@@ -0,0 +1 @@
+export { MonacoContainer, type MonacoContainerProps } from './MonacoContainer';

package/build/cjs/lib/unstable/kit/components/MonacoContainer/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MonacoContainer = void 0;
+var MonacoContainer_1 = require("./MonacoContainer");
+Object.defineProperty(exports, "MonacoContainer", { enumerable: true, get: function () { return MonacoContainer_1.MonacoContainer; } });

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

@@ -1,3 +1,9 @@
 export { ArrayRemoveButton, type ArrayRemoveButtonProps } from './ArrayRemoveButton';
-export { ControlError, type ControlErrorProps } from './ControlError';
+export { CopyButton, type CopyButtonProps } from './CopyButton';
+export { EmptyEntityValue } from './EmptyEntityValue';
+export { EntityContainer, type EntityContainerProps } from './EntityContainer';
+export { EntityError, type EntityErrorProps } from './EntityError';
 export { HTMLContent, type HTMLContentProps } from './HTMLContent';
+export { LayoutContainer, type LayoutContainerProps } from './LayoutContainer';
+export { LongValue, type LongValueProps } from './LongValue';
+export { MonacoContainer, type MonacoContainerProps } from './MonacoContainer';

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

@@ -1,9 +1,21 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.HTMLContent = exports.ControlError = exports.ArrayRemoveButton = void 0;
+exports.MonacoContainer = exports.LongValue = exports.LayoutContainer = exports.HTMLContent = exports.EntityError = exports.EntityContainer = exports.EmptyEntityValue = exports.CopyButton = exports.ArrayRemoveButton = void 0;
 var ArrayRemoveButton_1 = require("./ArrayRemoveButton");
 Object.defineProperty(exports, "ArrayRemoveButton", { enumerable: true, get: function () { return ArrayRemoveButton_1.ArrayRemoveButton; } });
-var ControlError_1 = require("./ControlError");
-Object.defineProperty(exports, "ControlError", { enumerable: true, get: function () { return ControlError_1.ControlError; } });
+var CopyButton_1 = require("./CopyButton");
+Object.defineProperty(exports, "CopyButton", { enumerable: true, get: function () { return CopyButton_1.CopyButton; } });
+var EmptyEntityValue_1 = require("./EmptyEntityValue");
+Object.defineProperty(exports, "EmptyEntityValue", { enumerable: true, get: function () { return EmptyEntityValue_1.EmptyEntityValue; } });
+var EntityContainer_1 = require("./EntityContainer");
+Object.defineProperty(exports, "EntityContainer", { enumerable: true, get: function () { return EntityContainer_1.EntityContainer; } });
+var EntityError_1 = require("./EntityError");
+Object.defineProperty(exports, "EntityError", { enumerable: true, get: function () { return EntityError_1.EntityError; } });
 var HTMLContent_1 = require("./HTMLContent");
 Object.defineProperty(exports, "HTMLContent", { enumerable: true, get: function () { return HTMLContent_1.HTMLContent; } });
+var LayoutContainer_1 = require("./LayoutContainer");
+Object.defineProperty(exports, "LayoutContainer", { enumerable: true, get: function () { return LayoutContainer_1.LayoutContainer; } });
+var LongValue_1 = require("./LongValue");
+Object.defineProperty(exports, "LongValue", { enumerable: true, get: function () { return LongValue_1.LongValue; } });
+var MonacoContainer_1 = require("./MonacoContainer");
+Object.defineProperty(exports, "MonacoContainer", { enumerable: true, get: function () { return MonacoContainer_1.MonacoContainer; } });

package/build/cjs/lib/unstable/kit/constants/common.d.ts

@@ -0,0 +1,2 @@
+export declare const DASH = "\u2014";
+export declare const DEFAULT_DATE_FORMAT = "DD.MM.YYYY HH:mm";

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

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DEFAULT_DATE_FORMAT = exports.DASH = void 0;
+exports.DASH = '—';
+exports.DEFAULT_DATE_FORMAT = 'DD.MM.YYYY HH:mm';