ydb-embedded-ui 4.33.0 → 5.1.0

package/dist/components/InfoViewer/formatters/cdcStream.d.ts

@@ -0,0 +1,5 @@
+import { TCdcStreamDescription } from '../../../types/api/schema';
+export declare const formatCdcStreamItem: <Key extends keyof TCdcStreamDescription>(label: Key, value: TCdcStreamDescription[Key]) => {
+    label: string;
+    value: import("react").ReactNode;
+};

package/dist/components/InfoViewer/formatters/cdcStream.js

@@ -0,0 +1,7 @@
+import { createInfoFormatter } from '../utils';
+export const formatCdcStreamItem = createInfoFormatter({
+    values: {
+        Mode: (value) => value === null || value === void 0 ? void 0 : value.substring('ECdcStreamMode'.length),
+        Format: (value) => value === null || value === void 0 ? void 0 : value.substring('ECdcStreamFormat'.length),
+    },
+});

package/dist/components/InfoViewer/formatters/common.d.ts

@@ -0,0 +1,5 @@
+import type { TDirEntry } from '../../../types/api/schema';
+export declare const formatCommonItem: <Key extends keyof TDirEntry>(label: Key, value: TDirEntry[Key]) => {
+    label: string;
+    value: import("react").ReactNode;
+};

package/dist/components/InfoViewer/formatters/common.js

@@ -0,0 +1,13 @@
+import { formatDateTime } from '../../../utils/dataFormatters/dataFormatters';
+import { createInfoFormatter } from '../utils';
+import i18n from '../i18n';
+export const formatCommonItem = createInfoFormatter({
+    values: {
+        PathType: (value) => value === null || value === void 0 ? void 0 : value.substring('EPathType'.length),
+        CreateStep: formatDateTime,
+    },
+    labels: {
+        PathType: i18n('common.type'),
+        CreateStep: i18n('common.created'),
+    },
+});

package/dist/components/InfoViewer/formatters/index.js

@@ -0,0 +1,5 @@
+export * from './common';
+export * from './schema';
+export * from './pqGroup';
+export * from './cdcStream';
+export * from './table';

package/dist/components/InfoViewer/formatters/pqGroup.d.ts

@@ -0,0 +1,13 @@
+import { TPersQueueGroupDescription, TPQPartitionConfig, TPQTabletConfig } from '../../../types/api/schema';
+export declare const formatPQGroupItem: <Key extends keyof TPersQueueGroupDescription>(label: Key, value: TPersQueueGroupDescription[Key]) => {
+    label: string;
+    value: import("react").ReactNode;
+};
+export declare const formatPQTabletConfig: <Key extends keyof TPQTabletConfig>(label: Key, value: TPQTabletConfig[Key]) => {
+    label: string;
+    value: import("react").ReactNode;
+};
+export declare const formatPQPartitionConfig: <Key extends keyof TPQPartitionConfig>(label: Key, value: TPQPartitionConfig[Key]) => {
+    label: string;
+    value: import("react").ReactNode;
+};

package/dist/components/InfoViewer/formatters/pqGroup.js

@@ -0,0 +1,40 @@
+import { EMeteringMode, } from '../../../types/api/schema';
+import { formatBps, formatBytes, formatNumber } from '../../../utils/dataFormatters/dataFormatters';
+import { HOUR_IN_SECONDS } from '../../../utils/constants';
+import { createInfoFormatter } from '../utils';
+const EMeteringModeToNames = {
+    [EMeteringMode.METERING_MODE_REQUEST_UNITS]: 'request-units',
+    [EMeteringMode.METERING_MODE_RESERVED_CAPACITY]: 'reserved-capacity',
+};
+export const formatPQGroupItem = createInfoFormatter({
+    values: {
+        Partitions: (value) => formatNumber((value === null || value === void 0 ? void 0 : value.length) || 0),
+        PQTabletConfig: (value) => {
+            const hours = Math.round((value.PartitionConfig.LifetimeSeconds / HOUR_IN_SECONDS) * 100) / 100;
+            return `${formatNumber(hours)} hours`;
+        },
+    },
+    labels: {
+        Partitions: 'Partitions count',
+        PQTabletConfig: 'Retention',
+    },
+});
+export const formatPQTabletConfig = createInfoFormatter({
+    values: {
+        Codecs: (value) => value && Object.values(value.Codecs || {}).join(', '),
+        MeteringMode: (value) => value && EMeteringModeToNames[value],
+    },
+    labels: {
+        MeteringMode: 'Metering mode',
+    },
+});
+export const formatPQPartitionConfig = createInfoFormatter({
+    values: {
+        StorageLimitBytes: formatBytes,
+        WriteSpeedInBytesPerSecond: formatBps,
+    },
+    labels: {
+        StorageLimitBytes: 'Retention storage',
+        WriteSpeedInBytesPerSecond: 'Partitions write speed',
+    },
+});

package/dist/components/InfoViewer/formatters/schema.d.ts

@@ -0,0 +1,5 @@
+import type { TIndexDescription } from '../../../types/api/schema';
+export declare const formatTableIndexItem: <Key extends keyof TIndexDescription>(label: Key, value: TIndexDescription[Key]) => {
+    label: string;
+    value: import("react").ReactNode;
+};

package/dist/components/InfoViewer/formatters/schema.js

@@ -0,0 +1,15 @@
+import { toFormattedSize } from '../../FormattedBytes/utils';
+import { createInfoFormatter } from '../utils';
+export const formatTableIndexItem = createInfoFormatter({
+    values: {
+        Type: (value) => value === null || value === void 0 ? void 0 : value.substring(10),
+        State: (value) => value === null || value === void 0 ? void 0 : value.substring(11),
+        KeyColumnNames: (value) => value === null || value === void 0 ? void 0 : value.join(', '),
+        DataColumnNames: (value) => value === null || value === void 0 ? void 0 : value.join(', '),
+        DataSize: toFormattedSize,
+    },
+    labels: {
+        KeyColumnNames: 'Columns',
+        DataColumnNames: 'Includes',
+    },
+});

package/dist/components/InfoViewer/formatters/table.d.ts

@@ -0,0 +1,18 @@
+import type { TFollowerGroup, TPartitionConfig, TTableStats } from '../../../types/api/schema';
+import type { TMetrics } from '../../../types/api/tenant';
+export declare const formatTabletMetricsItem: <Key extends keyof TMetrics>(label: Key, value: TMetrics[Key]) => {
+    label: string;
+    value: import("react").ReactNode;
+};
+export declare const formatFollowerGroupItem: <Key extends keyof TFollowerGroup>(label: Key, value: TFollowerGroup[Key]) => {
+    label: string;
+    value: import("react").ReactNode;
+};
+export declare const formatPartitionConfigItem: <Key extends keyof TPartitionConfig>(label: Key, value: TPartitionConfig[Key]) => {
+    label: string;
+    value: import("react").ReactNode;
+};
+export declare const formatTableStatsItem: <Key extends keyof TTableStats>(label: Key, value: TTableStats[Key]) => {
+    label: string;
+    value: import("react").ReactNode;
+};

package/dist/components/InfoViewer/formatters/table.js

@@ -0,0 +1,40 @@
+import { formatBps, formatCPU, formatDateTime, formatNumber, } from '../../../utils/dataFormatters/dataFormatters';
+import { toFormattedSize } from '../../FormattedBytes/utils';
+import { createInfoFormatter } from '../utils';
+export const formatTabletMetricsItem = createInfoFormatter({
+    values: {
+        CPU: formatCPU,
+        Memory: toFormattedSize,
+        Storage: toFormattedSize,
+        Network: formatBps,
+        ReadThroughput: formatBps,
+        WriteThroughput: formatBps,
+    },
+    defaultValueFormatter: formatNumber,
+});
+export const formatFollowerGroupItem = createInfoFormatter({
+    values: {
+        FollowerCount: formatNumber,
+    },
+    labels: {
+        // Make it shorter to fit label width
+        FollowerCountPerDataCenter: 'FollowerCountPerDC',
+    },
+    // Most of the FollowerGroup fields are arrays or boolean
+    defaultValueFormatter: (value) => value && String(value),
+});
+export const formatPartitionConfigItem = createInfoFormatter({
+    values: {
+        FollowerCount: formatNumber,
+        CrossDataCenterFollowerCount: formatNumber,
+    },
+});
+export const formatTableStatsItem = createInfoFormatter({
+    values: {
+        DataSize: toFormattedSize,
+        IndexSize: toFormattedSize,
+        LastAccessTime: formatDateTime,
+        LastUpdateTime: formatDateTime,
+    },
+    defaultValueFormatter: formatNumber,
+});

package/dist/components/InfoViewer/i18n/en.json

@@ -1,4 +1,4 @@
 {
-  "common.created": "Created",
-  "common.type": "Type"
+    "common.created": "Created",
+    "common.type": "Type"
 }

package/dist/components/InfoViewer/i18n/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (key: string, params?: import("@gravity-ui/i18n").Params | undefined) => string;
+export default _default;

package/dist/components/InfoViewer/i18n/index.js

@@ -0,0 +1,7 @@
+import { i18n, Lang } from '../../../utils/i18n';
+import en from './en.json';
+import ru from './ru.json';
+const COMPONENT = 'ydb-components-info-viewer';
+i18n.registerKeyset(Lang.En, COMPONENT, en);
+i18n.registerKeyset(Lang.Ru, COMPONENT, ru);
+export default i18n.keyset(COMPONENT);

package/dist/components/InfoViewer/i18n/ru.json

@@ -1,4 +1,4 @@
 {
-  "common.created": "Создано",
-  "common.type": "Тип"
+    "common.created": "Создано",
+    "common.type": "Тип"
 }

package/dist/components/InfoViewer/index.d.ts

@@ -0,0 +1,4 @@
+import InfoViewer from './InfoViewer';
+export { InfoViewer };
+export * from './utils';
+export type { InfoViewerItem } from './InfoViewer';

package/dist/components/InfoViewer/index.js

@@ -0,0 +1,3 @@
+import InfoViewer from './InfoViewer';
+export { InfoViewer };
+export * from './utils';

package/dist/components/InfoViewer/schemaInfo/TableIndexInfo.d.ts

@@ -0,0 +1,6 @@
+import type { TEvDescribeSchemeResult } from '../../../types/api/schema';
+interface TableIndexInfoProps {
+    data?: TEvDescribeSchemeResult;
+}
+export declare const TableIndexInfo: ({ data }: TableIndexInfoProps) => JSX.Element;
+export {};

package/dist/components/InfoViewer/schemaInfo/TableIndexInfo.js

@@ -0,0 +1,27 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { getEntityName } from '../../../containers/Tenant/utils';
+import { formatTableIndexItem } from '../formatters';
+import { InfoViewer } from '..';
+const DISPLAYED_FIELDS = new Set([
+    'Type',
+    'State',
+    'DataSize',
+    'KeyColumnNames',
+    'DataColumnNames',
+]);
+export const TableIndexInfo = ({ data }) => {
+    var _a;
+    const entityName = getEntityName(data === null || data === void 0 ? void 0 : data.PathDescription);
+    if (!data) {
+        return _jsxs("div", Object.assign({ className: "error" }, { children: ["No ", entityName, " data"] }));
+    }
+    const TableIndex = (_a = data.PathDescription) === null || _a === void 0 ? void 0 : _a.TableIndex;
+    const info = [];
+    let key;
+    for (key in TableIndex) {
+        if (DISPLAYED_FIELDS.has(key)) {
+            info.push(formatTableIndexItem(key, TableIndex === null || TableIndex === void 0 ? void 0 : TableIndex[key]));
+        }
+    }
+    return _jsx(InfoViewer, { title: entityName, info: info });
+};

package/dist/components/InfoViewer/schemaInfo/index.js

@@ -0,0 +1 @@
+export * from './TableIndexInfo';

package/dist/components/InfoViewer/schemaOverview/CDCStreamOverview.d.ts

@@ -0,0 +1,6 @@
+import type { TEvDescribeSchemeResult } from '../../../types/api/schema';
+interface CDCStreamOverviewProps {
+    data?: TEvDescribeSchemeResult;
+}
+export declare const CDCStreamOverview: ({ data }: CDCStreamOverviewProps) => JSX.Element;
+export {};

package/dist/components/InfoViewer/schemaOverview/CDCStreamOverview.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { InfoViewer } from '..';
+import { formatCdcStreamItem, formatCommonItem } from '../formatters';
+const DISPLAYED_FIELDS = new Set(['Mode', 'Format']);
+export const CDCStreamOverview = ({ data }) => {
+    var _a, _b, _c, _d, _e;
+    if (!data) {
+        return _jsx("div", Object.assign({ className: "error" }, { children: "No CDC Stream data" }));
+    }
+    const TableIndex = (_a = data.PathDescription) === null || _a === void 0 ? void 0 : _a.CdcStreamDescription;
+    const info = [];
+    info.push(formatCommonItem('PathType', (_c = (_b = data.PathDescription) === null || _b === void 0 ? void 0 : _b.Self) === null || _c === void 0 ? void 0 : _c.PathType));
+    info.push(formatCommonItem('CreateStep', (_e = (_d = data.PathDescription) === null || _d === void 0 ? void 0 : _d.Self) === null || _e === void 0 ? void 0 : _e.CreateStep));
+    let key;
+    for (key in TableIndex) {
+        if (DISPLAYED_FIELDS.has(key)) {
+            info.push(formatCdcStreamItem(key, TableIndex === null || TableIndex === void 0 ? void 0 : TableIndex[key]));
+        }
+    }
+    return _jsx(_Fragment, { children: info.length ? _jsx(InfoViewer, { info: info }) : _jsx(_Fragment, { children: "Empty" }) });
+};

package/dist/components/InfoViewer/schemaOverview/PersQueueGroupOverview.d.ts

@@ -0,0 +1,6 @@
+import type { TEvDescribeSchemeResult } from '../../../types/api/schema';
+interface PersQueueGroupOverviewProps {
+    data?: TEvDescribeSchemeResult;
+}
+export declare const PersQueueGroupOverview: ({ data }: PersQueueGroupOverviewProps) => JSX.Element;
+export {};

package/dist/components/InfoViewer/schemaOverview/PersQueueGroupOverview.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { formatCommonItem, formatPQGroupItem } from '../formatters';
+import { InfoViewer } from '..';
+export const PersQueueGroupOverview = ({ data }) => {
+    var _a, _b, _c, _d, _e;
+    if (!data) {
+        return _jsx("div", Object.assign({ className: "error" }, { children: "No PersQueueGroup data" }));
+    }
+    const pqGroup = (_a = data.PathDescription) === null || _a === void 0 ? void 0 : _a.PersQueueGroup;
+    const info = [];
+    info.push(formatCommonItem('PathType', (_c = (_b = data.PathDescription) === null || _b === void 0 ? void 0 : _b.Self) === null || _c === void 0 ? void 0 : _c.PathType));
+    info.push(formatCommonItem('CreateStep', (_e = (_d = data.PathDescription) === null || _d === void 0 ? void 0 : _d.Self) === null || _e === void 0 ? void 0 : _e.CreateStep));
+    info.push(formatPQGroupItem('Partitions', (pqGroup === null || pqGroup === void 0 ? void 0 : pqGroup.Partitions) || []));
+    info.push(formatPQGroupItem('PQTabletConfig', (pqGroup === null || pqGroup === void 0 ? void 0 : pqGroup.PQTabletConfig) || { PartitionConfig: { LifetimeSeconds: 0 } }));
+    return _jsx(_Fragment, { children: info.length ? _jsx(InfoViewer, { info: info }) : _jsx(_Fragment, { children: "Empty" }) });
+};

package/dist/components/InfoViewer/schemaOverview/index.js

@@ -0,0 +1,2 @@
+export * from './CDCStreamOverview';
+export * from './PersQueueGroupOverview';

package/dist/components/InfoViewer/utils.d.ts

@@ -0,0 +1,19 @@
+import type { ReactNode } from 'react';
+import { InfoViewerItem } from './InfoViewer';
+declare type LabelMap<T> = {
+    [label in keyof T]?: string;
+};
+declare type ValueFormatters<T> = {
+    [label in keyof T]?: (value: T[label]) => ReactNode;
+};
+interface CreateInfoFormatterOptions<Shape> {
+    values?: ValueFormatters<Shape>;
+    labels?: LabelMap<Shape>;
+    defaultValueFormatter?: (value: Shape[keyof Shape]) => ReactNode;
+}
+export declare function createInfoFormatter<Shape extends Record<string, any>>({ values: valueFormatters, labels: labelMap, defaultValueFormatter, }: CreateInfoFormatterOptions<Shape>): <Key extends keyof Shape>(label: Key, value: Shape[Key]) => {
+    label: keyof Shape | NonNullable<LabelMap<Shape>[keyof Shape]>;
+    value: ReactNode;
+};
+export declare const formatObject: <Shape extends Record<string, any>>(formatter: <Key extends keyof Shape>(value: Key, label: Shape[Key]) => InfoViewerItem, obj?: Partial<Shape> | undefined) => InfoViewerItem[];
+export {};

package/dist/components/InfoViewer/utils.js

@@ -0,0 +1,23 @@
+function formatLabel(label, map) {
+    var _a;
+    return (_a = map[label]) !== null && _a !== void 0 ? _a : label;
+}
+function formatValue(label, value, formatters, defaultFormatter) {
+    const formatter = formatters[label] || defaultFormatter;
+    const formattedValue = formatter ? formatter(value) : value;
+    return formattedValue;
+}
+export function createInfoFormatter({ values: valueFormatters, labels: labelMap, defaultValueFormatter, }) {
+    return (label, value) => ({
+        label: formatLabel(label, labelMap || {}),
+        value: formatValue(label, value, valueFormatters || {}, defaultValueFormatter),
+    });
+}
+export const formatObject = (formatter, obj) => {
+    if (!obj) {
+        return [];
+    }
+    return Object.entries(obj)
+        .map(([label, value]) => formatter(label, value))
+        .filter(({ value }) => Boolean(value));
+};

package/dist/components/InternalLink/InternalLink.d.ts

@@ -0,0 +1,6 @@
+import { LinkProps } from 'react-router-dom';
+interface InternalLinkProps extends Omit<LinkProps, 'to'> {
+    to?: LinkProps['to'];
+}
+export declare const InternalLink: ({ className, to, onClick, ...props }: InternalLinkProps) => JSX.Element;
+export {};

package/dist/components/InternalLink/InternalLink.js

@@ -0,0 +1,19 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Link } from 'react-router-dom';
+import cn from 'bem-cn-lite';
+const bLink = cn('yc-link');
+export const InternalLink = (_a) => {
+    var { className, to, onClick } = _a, props = __rest(_a, ["className", "to", "onClick"]);
+    return to ? (_jsx(Link, Object.assign({ to: to, onClick: onClick, className: bLink({ view: 'normal' }, className) }, props))) : (_jsx("span", Object.assign({ className: className, onClick: onClick }, { children: props.children })));
+};

package/dist/components/InternalLink/index.js

@@ -0,0 +1 @@
+export * from './InternalLink';

package/dist/components/LabelWithPopover/LabelWithPopover.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode } from 'react';
+interface LabelWithPopoverProps {
+    text: ReactNode;
+    popoverContent: ReactNode;
+    className?: string;
+    contentClassName?: string;
+}
+export declare const LabelWithPopover: ({ text, popoverContent, className, contentClassName, }: LabelWithPopoverProps) => JSX.Element;
+export {};

package/dist/components/LabelWithPopover/LabelWithPopover.js

@@ -0,0 +1,3 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { HelpPopover } from '@gravity-ui/components';
+export const LabelWithPopover = ({ text, popoverContent, className, contentClassName, }) => (_jsxs("div", Object.assign({ className: className }, { children: [text, '\u00a0', _jsx(HelpPopover, { content: popoverContent, contentClassName: contentClassName })] })));

package/dist/components/LabelWithPopover/index.js

@@ -0,0 +1 @@
+export * from './LabelWithPopover';

package/dist/components/LagImages/LagImages.d.ts

@@ -0,0 +1,2 @@
+export declare const WriteLagImage: () => JSX.Element;
+export declare const ReadLagImage: () => JSX.Element;

package/dist/components/LagImages/LagImages.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const STICK_START = 30;
+const STICK_SPACE = 70;
+const HEIGHT = 54;
+const WIDTH = 268;
+const READ_FILL = '#ADE8F5';
+const WRITE_FILL = '#f5be9d';
+const DashArc = ({ width, height, transform }) => (_jsx("path", { d: `M-${width / 2} 0 c0 -${height}, ${width} -${height}, ${width} 0`, fill: "none", strokeDasharray: "4,6", stroke: "#28f", strokeWidth: "1.6", transform: transform }));
+const ArrowLine = ({ width }) => (_jsx("path", { fill: "none", strokeWidth: "2", d: `M0 0 h${width} l-10 -5 m0 10 l10 -5` }));
+const WriteLag = () => (_jsxs("g", Object.assign({ fill: "var(--g-color-text-primary)", fontSize: "12" }, { children: [_jsx("g", Object.assign({ transform: `translate(0, ${HEIGHT / 2})`, stroke: WRITE_FILL }, { children: _jsx(ArrowLine, { width: STICK_SPACE * 2.9 }) })), _jsxs("g", Object.assign({ transform: `translate(${STICK_START}, 0)` }, { children: [_jsxs("g", Object.assign({ transform: `translate(${STICK_SPACE / 2}, ${HEIGHT / 2})` }, { children: [_jsx(DashArc, { width: STICK_SPACE, height: 15 }), _jsx("text", Object.assign({ x: "0", y: "-15", textAnchor: "middle" }, { children: _jsx("tspan", Object.assign({ x: "0", dy: "0" }, { children: "write lag" })) }))] })), _jsxs("g", Object.assign({ transform: `translate(${STICK_SPACE * 1.7}, ${HEIGHT / 2})` }, { children: [_jsx(DashArc, { width: STICK_SPACE * 1.4, height: 15 }), _jsx("text", Object.assign({ x: "0", y: "-15", textAnchor: "middle" }, { children: _jsx("tspan", Object.assign({ x: "0", dy: "0" }, { children: "write idle time" })) }))] }))] })), _jsxs("g", Object.assign({ transform: `translate(${STICK_START}, 0)` }, { children: [_jsxs("g", Object.assign({ transform: `translate(${0}, ${HEIGHT / 2})` }, { children: [_jsx("use", { y: "-10", xlinkHref: "#check", stroke: WRITE_FILL }), _jsx("text", Object.assign({ x: "0", y: "20", textAnchor: "middle" }, { children: _jsx("tspan", Object.assign({ x: "0", dy: "0" }, { children: "create time" })) }))] })), _jsxs("g", Object.assign({ transform: `translate(${STICK_SPACE}, ${HEIGHT / 2})` }, { children: [_jsx("use", { y: "-10", xlinkHref: "#check", stroke: WRITE_FILL }), _jsx("text", Object.assign({ x: "0", y: "20", textAnchor: "middle" }, { children: _jsx("tspan", Object.assign({ x: "0", dy: "0" }, { children: "write time" })) }))] })), _jsx("g", Object.assign({ transform: `translate(${2.4 * STICK_SPACE}, ${HEIGHT / 2})` }, { children: _jsx("text", Object.assign({ x: "0", y: "20", textAnchor: "middle" }, { children: _jsx("tspan", Object.assign({ x: "0", dy: "0" }, { children: "now" })) })) }))] }))] })));
+const ReadLag = () => (_jsxs("g", Object.assign({ fill: "var(--g-color-text-primary)", fontSize: "12" }, { children: [_jsx("g", Object.assign({ transform: `translate(0, ${HEIGHT / 2})`, stroke: READ_FILL }, { children: _jsx(ArrowLine, { width: WIDTH }) })), _jsxs("g", Object.assign({ transform: `translate(${STICK_START}, 0)` }, { children: [_jsxs("g", Object.assign({ transform: `translate(${STICK_SPACE * 1.5}, ${HEIGHT / 2})` }, { children: [_jsx(DashArc, { width: STICK_SPACE, height: 15 }), _jsx("text", Object.assign({ x: "0", y: "-15", textAnchor: "middle" }, { children: _jsx("tspan", Object.assign({ x: "0", dy: "0" }, { children: "read lag" })) }))] })), _jsxs("g", Object.assign({ transform: `translate(${STICK_SPACE / 2}, ${HEIGHT / 2})` }, { children: [_jsx(DashArc, { width: STICK_SPACE, height: 15 }), _jsx("text", Object.assign({ x: "0", y: "-15", textAnchor: "middle" }, { children: _jsx("tspan", Object.assign({ x: "0", dy: "0" }, { children: "write lag" })) }))] })), _jsxs("g", Object.assign({ transform: `translate(${STICK_SPACE * 2.6}, ${HEIGHT / 2})` }, { children: [_jsx(DashArc, { width: STICK_SPACE * 1.3, height: 15 }), _jsx("text", Object.assign({ x: "0", y: "-15", textAnchor: "middle" }, { children: _jsx("tspan", Object.assign({ x: "0", dy: "0" }, { children: "read idle time" })) }))] }))] })), _jsxs("g", Object.assign({ transform: `translate(${STICK_START}, ${HEIGHT / 2})` }, { children: [_jsxs("g", Object.assign({ transform: `translate(${0}, 0)` }, { children: [_jsx("use", { y: "-10", xlinkHref: "#check", stroke: READ_FILL }), _jsx("text", Object.assign({ x: "0", y: "20", textAnchor: "middle" }, { children: _jsx("tspan", Object.assign({ x: "0", dy: "0" }, { children: "create time" })) }))] })), _jsxs("g", Object.assign({ transform: `translate(${STICK_SPACE}, 0)` }, { children: [_jsx("use", { y: "-10", xlinkHref: "#check", stroke: READ_FILL }), _jsx("text", Object.assign({ x: "0", y: "20", textAnchor: "middle" }, { children: _jsx("tspan", Object.assign({ x: "0", dy: "0" }, { children: "write time" })) }))] })), _jsxs("g", Object.assign({ transform: `translate(${2 * STICK_SPACE}, 0)` }, { children: [_jsx("use", { x: "-2", y: "-10", xlinkHref: "#check", stroke: READ_FILL }), _jsx("text", Object.assign({ x: "0", y: "20", textAnchor: "middle" }, { children: _jsx("tspan", Object.assign({ x: "0", dy: "0" }, { children: "read time" })) }))] })), _jsx("g", Object.assign({ transform: `translate(${3.2 * STICK_SPACE}, 0)` }, { children: _jsx("text", Object.assign({ x: "0", y: "20", textAnchor: "middle" }, { children: _jsx("tspan", Object.assign({ x: "0", dy: "0" }, { children: "now" })) })) }))] }))] })));
+const DashPattern = ({ id, fill }) => (_jsx("pattern", Object.assign({ id: id, x: "0", y: "0", width: "8", height: "8", patternUnits: "userSpaceOnUse" }, { children: _jsx("path", { d: "M0 5L5 0H8L0 8V5M5 8L8 5V8Z", fill: fill }) })));
+export const WriteLagImage = () => (_jsxs("svg", Object.assign({ className: "paint", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", viewBox: `0 0 ${WIDTH} ${HEIGHT}`, width: WIDTH, height: HEIGHT }, { children: [_jsxs("defs", { children: [_jsx("g", Object.assign({ id: "check" }, { children: _jsx("path", { d: "M0 3 v14", strokeWidth: "2" }) })), _jsx(DashPattern, { id: "latest-read", fill: READ_FILL }), _jsx(DashPattern, { id: "latest-write", fill: WRITE_FILL })] }), _jsx(WriteLag, {})] })));
+export const ReadLagImage = () => (_jsxs("svg", Object.assign({ className: "paint", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", viewBox: `0 0 ${WIDTH} ${HEIGHT}`, width: WIDTH, height: HEIGHT }, { children: [_jsxs("defs", { children: [_jsx("g", Object.assign({ id: "check" }, { children: _jsx("path", { d: "M0 3 v14", strokeWidth: "2" }) })), _jsx(DashPattern, { id: "latest-read", fill: READ_FILL }), _jsx(DashPattern, { id: "latest-write", fill: WRITE_FILL })] }), _jsx(ReadLag, {})] })));

package/dist/components/LagImages/index.js

@@ -0,0 +1 @@
+export * from './LagImages';

package/dist/components/LagPopoverContent/LagPopoverContent.d.ts

@@ -0,0 +1,7 @@
+import './LagPopoverContent.scss';
+interface LagPopoverContentProps {
+    text: string;
+    type: 'read' | 'write';
+}
+export declare const LagPopoverContent: ({ text, type }: LagPopoverContentProps) => JSX.Element;
+export {};

package/dist/components/LagPopoverContent/LagPopoverContent.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import block from 'bem-cn-lite';
+import { ReadLagImage, WriteLagImage } from '../LagImages';
+import './LagPopoverContent.scss';
+const b = block('ydb-lag-popover-content');
+export const LagPopoverContent = ({ text, type }) => (_jsxs("div", Object.assign({ className: b({ type }) }, { children: [_jsx("div", Object.assign({ className: b('text') }, { children: text })), _jsx("div", { children: type === 'read' ? _jsx(ReadLagImage, {}) : _jsx(WriteLagImage, {}) })] })));

package/dist/components/LagPopoverContent/index.js

@@ -0,0 +1 @@
+export * from './LagPopoverContent';

package/dist/components/LinkToSchemaObject/LinkToSchemaObject.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { Location } from 'history';
+import { type LinkProps } from '@gravity-ui/uikit';
+interface LinkToSchemaObjectProps extends LinkProps {
+    path: string;
+    location: Location;
+}
+export declare function LinkToSchemaObject({ path, location, ...props }: LinkToSchemaObjectProps): JSX.Element;
+export {};

package/dist/components/LinkToSchemaObject/LinkToSchemaObject.js

@@ -0,0 +1,20 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Link } from '@gravity-ui/uikit';
+import { createExternalUILink, parseQuery } from '../../routes';
+export function LinkToSchemaObject(_a) {
+    var { path, location } = _a, props = __rest(_a, ["path", "location"]);
+    const queryParams = parseQuery(location);
+    const pathToSchemaObject = createExternalUILink(Object.assign(Object.assign({}, queryParams), { schema: path }));
+    return _jsx(Link, Object.assign({ view: "normal", href: pathToSchemaObject }, props));
+}

package/dist/components/Loader/Loader.d.ts

@@ -0,0 +1,8 @@
+import { LoaderSize } from '@gravity-ui/uikit';
+import './Loader.scss';
+interface LoaderProps {
+    size?: LoaderSize;
+    className?: string;
+}
+export declare const Loader: ({ size, className }: LoaderProps) => JSX.Element;
+export {};

package/dist/components/Loader/Loader.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import cn from 'bem-cn-lite';
+import { Loader as KitLoader } from '@gravity-ui/uikit';
+import './Loader.scss';
+const b = cn('ydb-loader');
+export const Loader = ({ size = 'm', className }) => {
+    return (_jsx("div", Object.assign({ className: b(null, className) }, { children: _jsx(KitLoader, { size: size }) })));
+};

package/dist/components/Loader/index.js

@@ -0,0 +1 @@
+export * from './Loader';

package/dist/components/MetricChart/MetricChart.d.ts

@@ -0,0 +1,21 @@
+import type { TimeFrame } from '../../utils/timeframes';
+import type { ChartOptions, MetricDescription, OnChartDataStatusChange } from './types';
+import './MetricChart.scss';
+interface DiagnosticsChartProps {
+    title?: string;
+    metrics: MetricDescription[];
+    timeFrame?: TimeFrame;
+    autorefresh?: boolean;
+    height?: number;
+    width?: number;
+    chartOptions?: ChartOptions;
+    onChartDataStatusChange?: OnChartDataStatusChange;
+    /**
+     * YAGR charts don't render correctly inside not visible elements\
+     * So if chart is used inside component with 'display:none', it will be empty, when visibility change\
+     * Pass isChartVisible prop to ensure proper chart render
+     */
+    isChartVisible?: boolean;
+}
+export declare const MetricChart: ({ title, metrics, timeFrame, autorefresh, width, height, chartOptions, onChartDataStatusChange, isChartVisible, }: DiagnosticsChartProps) => JSX.Element;
+export {};