@cloud-ru/uikit-product-info-row 0.8.24 → 0.8.25

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 0.8.25 (2025-11-12)
+
+
+### Bug Fixes
+
+* **PD-3377:** contributors update to publish all packages ([719fd3e](https://gitverse.ru/cloud-ru-tech/uikit-product/commits/719fd3e1249e247443b125c47ea408d92c8395c3))
+
+
+
+
+
 ## 0.8.24 (2025-11-12)
 
 ### Only dependencies have been changed

package/dist/cjs/components/InfoGroup/InfoGroup.d.ts

@@ -0,0 +1,2 @@
+import { DataType, InfoGroupProps } from './types';
+export declare function InfoGroup<T extends DataType>({ data, items, className, loading }: InfoGroupProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/InfoGroup/InfoGroup.js

@@ -0,0 +1,26 @@
+"use strict";
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InfoGroup = InfoGroup;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const InfoRow_1 = require("../InfoRow");
+const utils_1 = require("./utils");
+function InfoGroup({ data, items, className, loading }) {
+    const getContent = (0, utils_1.useGetContent)();
+    return ((0, jsx_runtime_1.jsx)("div", { className: className, children: items.map((_a, index) => {
+            var _b;
+            var { label, accessorKey, render } = _a, rest = __rest(_a, ["label", "accessorKey", "render"]);
+            const content = getContent({ data, render, accessorKey });
+            return ((0, jsx_runtime_1.jsx)(InfoRow_1.InfoRow, Object.assign({ label: label, content: content, topDivider: index === 0, bottomDivider: true, loading: loading }, rest), (_b = accessorKey) !== null && _b !== void 0 ? _b : label));
+        }) }));
+}

package/dist/cjs/components/InfoGroup/constants.d.ts

@@ -0,0 +1 @@
+export declare const NO_DATA_PLACEHOLDER = "\u2014";

package/dist/cjs/components/InfoGroup/constants.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NO_DATA_PLACEHOLDER = void 0;
+exports.NO_DATA_PLACEHOLDER = '—';

package/dist/cjs/components/InfoGroup/index.d.ts

@@ -0,0 +1,2 @@
+export { InfoGroup } from './InfoGroup';
+export { type InfoGroupProps, type InfoGroupItem } from './types';

package/dist/cjs/components/InfoGroup/index.js

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

package/dist/cjs/components/InfoGroup/types.d.ts

@@ -0,0 +1,19 @@
+import { ReactNode } from 'react';
+import { InfoRowPropsBase } from '../InfoRow/InfoRow';
+export type DataType = Record<string, unknown>;
+type PropsWithAccessorKey<T extends DataType> = {
+    accessorKey: keyof T;
+    render?: never;
+} & Omit<InfoRowPropsBase, 'content'>;
+type PropsWithRender<T extends DataType> = {
+    render: (data: T, noDataPlaceholder: string) => ReactNode;
+    accessorKey?: never;
+} & Omit<InfoRowPropsBase, 'content'>;
+export type InfoGroupItem<T extends DataType> = PropsWithRender<T> | PropsWithAccessorKey<T>;
+export type InfoGroupProps<T extends DataType> = {
+    data: T | undefined;
+    items: InfoGroupItem<T>[];
+    className?: string;
+    loading?: boolean;
+};
+export {};

package/dist/cjs/components/InfoGroup/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/components/InfoGroup/utils/index.d.ts

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

package/dist/cjs/components/InfoGroup/utils/index.js

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

package/dist/cjs/components/InfoGroup/utils/typeGuards.d.ts

@@ -0,0 +1,5 @@
+export declare const isNil: (value: unknown) => value is undefined | null;
+export declare const isBoolean: (value: unknown) => value is boolean;
+export declare const isString: (value: unknown) => value is string;
+export declare const isArray: <T>(value: unknown) => value is Array<T>;
+export declare const isObject: (value: unknown) => value is object;

package/dist/cjs/components/InfoGroup/utils/typeGuards.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isObject = exports.isArray = exports.isString = exports.isBoolean = exports.isNil = void 0;
+const isNil = (value) => value === undefined || value === null;
+exports.isNil = isNil;
+const isBoolean = (value) => typeof value === 'boolean';
+exports.isBoolean = isBoolean;
+const isString = (value) => typeof value === 'string';
+exports.isString = isString;
+const isArray = (value) => Array.isArray(value);
+exports.isArray = isArray;
+const isObject = (value) => typeof value === 'object' && !(0, exports.isArray)(value);
+exports.isObject = isObject;

package/dist/cjs/components/InfoGroup/utils/useGetContent.d.ts

@@ -0,0 +1,4 @@
+import { DataType, InfoGroupItem, InfoGroupProps } from '../types';
+type Props<T extends DataType> = Pick<InfoGroupProps<T>, 'data'> & Pick<InfoGroupItem<T>, 'accessorKey' | 'render'>;
+export declare function useGetContent(): <T extends DataType>({ data, accessorKey, render }: Props<T>) => import("react").ReactNode;
+export {};

package/dist/cjs/components/InfoGroup/utils/useGetContent.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useGetContent = useGetContent;
+const uikit_product_locale_1 = require("@sbercloud/uikit-product-locale");
+const constants_1 = require("../constants");
+const typeGuards_1 = require("./typeGuards");
+function useGetContent() {
+    const { t } = (0, uikit_product_locale_1.useLocale)('InfoRow');
+    return function getContent({ data, accessorKey, render }) {
+        if (!data) {
+            return constants_1.NO_DATA_PLACEHOLDER;
+        }
+        const value = accessorKey ? data[accessorKey] : undefined;
+        if (!(0, typeGuards_1.isNil)(value)) {
+            if ((0, typeGuards_1.isBoolean)(value)) {
+                return value ? t('booleanValueTrue') : t('booleanValueFalse');
+            }
+            if ((0, typeGuards_1.isString)(value)) {
+                return value ? value : constants_1.NO_DATA_PLACEHOLDER;
+            }
+            if ((0, typeGuards_1.isArray)(value)) {
+                return value.length ? value.join(', ') : constants_1.NO_DATA_PLACEHOLDER;
+            }
+            if ((0, typeGuards_1.isObject)(value)) {
+                return Object.keys(value).length ? JSON.stringify(value) : constants_1.NO_DATA_PLACEHOLDER;
+            }
+            return String(value);
+        }
+        if (render) {
+            return render(data, constants_1.NO_DATA_PLACEHOLDER);
+        }
+        return constants_1.NO_DATA_PLACEHOLDER;
+    };
+}

package/dist/cjs/components/InfoRow/InfoRow.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+import { WithSupportProps } from '@sbercloud/uikit-product-utils';
+import { ButtonTonalProps } from '@snack-uikit/button';
+import { QuestionTooltipProps, TooltipProps } from '@snack-uikit/tooltip';
+type RowActionButton = {
+    tip?: Pick<TooltipProps, 'trigger' | 'tip' | 'placement' | 'disableMaxWidth' | 'open' | 'onOpenChange'> | string;
+} & Omit<ButtonTonalProps, 'size' | 'appearance' | 'label'>;
+export type InfoRowPropsBase = {
+    label: string;
+    labelTruncate?: number;
+    labelTooltip?: Pick<QuestionTooltipProps, 'trigger' | 'tip' | 'placement' | 'disableMaxWidth' | 'open' | 'onOpenChange'> | string;
+    topDivider?: boolean;
+    bottomDivider?: boolean;
+    className?: string;
+    content?: ReactNode;
+    rowActions?: {
+        first: RowActionButton;
+        second?: RowActionButton;
+    };
+    loading?: boolean;
+    width?: 'fixed' | 'full';
+};
+export type InfoRowProps = WithSupportProps<InfoRowPropsBase>;
+export declare function withTip(children: ReactNode, tip?: TooltipProps | string): string | number | boolean | Iterable<ReactNode> | import("react/jsx-runtime").JSX.Element | null | undefined;
+export declare function InfoRow({ label, topDivider, bottomDivider, className, labelTooltip, content, rowActions, labelTruncate, loading, width, ...rest }: InfoRowProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/components/InfoRow/InfoRow.js

@@ -0,0 +1,39 @@
+"use strict";
+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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withTip = withTip;
+exports.InfoRow = InfoRow;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const classnames_1 = __importDefault(require("classnames"));
+const uikit_product_utils_1 = require("@sbercloud/uikit-product-utils");
+const button_1 = require("@snack-uikit/button");
+const divider_1 = require("@snack-uikit/divider");
+const skeleton_1 = require("@snack-uikit/skeleton");
+const tooltip_1 = require("@snack-uikit/tooltip");
+const truncate_string_1 = require("@snack-uikit/truncate-string");
+const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
+function withTip(children, tip) {
+    if (!tip) {
+        return children;
+    }
+    return typeof tip === 'string' ? (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { tip: tip, children: children }) : (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, Object.assign({}, tip, { children: children }));
+}
+function InfoRow(_a) {
+    var { label, topDivider = true, bottomDivider = true, className, labelTooltip, content, rowActions, labelTruncate = 1, loading = false, width = 'fixed' } = _a, rest = __rest(_a, ["label", "topDivider", "bottomDivider", "className", "labelTooltip", "content", "rowActions", "labelTruncate", "loading", "width"]);
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({}, (0, uikit_product_utils_1.extractSupportProps)(rest), { className: (0, classnames_1.default)(styles_module_scss_1.default.wrapper, className), "data-width": width, children: [topDivider && (0, jsx_runtime_1.jsx)(divider_1.Divider, { weight: 'regular' }), (0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.infoRow, children: [(0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.labelLayout, children: [(0, jsx_runtime_1.jsx)(truncate_string_1.TruncateString, { text: label, maxLines: labelTruncate }), labelTooltip &&
+                                (typeof labelTooltip === 'string' ? ((0, jsx_runtime_1.jsx)(tooltip_1.QuestionTooltip, { tip: labelTooltip, size: 'xs', placement: 'top', trigger: 'hover', tabIndex: -1 })) : ((0, jsx_runtime_1.jsx)(tooltip_1.QuestionTooltip, Object.assign({}, labelTooltip, { size: 'xs' }))))] }), (0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.contentLayout, children: [(0, jsx_runtime_1.jsx)(skeleton_1.SkeletonContextProvider, { loading: loading, children: (0, jsx_runtime_1.jsx)(skeleton_1.WithSkeleton, { skeleton: (0, jsx_runtime_1.jsx)(skeleton_1.SkeletonText, { width: '100%', lines: 1 }), children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.content, children: content }) }) }), rowActions && ((0, jsx_runtime_1.jsxs)("div", { className: styles_module_scss_1.default.rowActions, children: [withTip((0, jsx_runtime_1.jsx)(button_1.ButtonTonal, Object.assign({}, rowActions.first, { disabled: loading || rowActions.first.disabled, appearance: 'neutral', size: 's' })), rowActions.first.tip), rowActions.second &&
+                                        withTip((0, jsx_runtime_1.jsx)(button_1.ButtonTonal, Object.assign({}, rowActions.second, { disabled: loading || rowActions.second.disabled, appearance: 'neutral', size: 's' })), rowActions.second.tip)] }))] })] }), bottomDivider && (0, jsx_runtime_1.jsx)(divider_1.Divider, { weight: 'regular' })] })));
+}

package/dist/cjs/components/InfoRow/index.d.ts

@@ -0,0 +1 @@
+export { InfoRow, type InfoRowProps, withTip } from './InfoRow';

package/dist/cjs/components/InfoRow/index.js

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

package/dist/cjs/components/InfoRow/styles.module.css

@@ -0,0 +1,72 @@
+.wrapper{
+  width:calc(200px + var(--dimension-3m, 24px) + 496px);
+}
+.wrapper[data-width=full]{
+  width:100%;
+}
+
+.infoRow{
+  padding:calc(var(--dimension-1m, 8px) + var(--dimension-050m, 4px)) 0;
+  display:flex;
+  -moz-column-gap:var(--dimension-3m, 24px);
+       column-gap:var(--dimension-3m, 24px);
+  width:100%;
+  align-items:center;
+}
+
+.labelLayout{
+  font-family:var(--light-label-l-font-family, SB Sans Interface);
+  font-weight:var(--light-label-l-font-weight, Regular);
+  line-height:var(--light-label-l-line-height, 20px);
+  font-size:var(--light-label-l-font-size, 14px);
+  letter-spacing:var(--light-label-l-letter-spacing, 0px);
+  paragraph-spacing:var(--light-label-l-paragraph-spacing, 7.7px);
+  position:relative;
+  width:200px;
+  color:var(--sys-neutral-text-main, #41424e);
+  display:flex;
+  -moz-column-gap:4px;
+       column-gap:4px;
+  align-items:center;
+  justify-content:flex-start;
+  height:100%;
+}
+
+.contentLayout{
+  position:relative;
+  display:flex;
+  align-items:center;
+  justify-content:space-between;
+  flex-grow:1;
+  flex-shrink:1;
+  flex-basis:0;
+  -moz-column-gap:12px;
+       column-gap:12px;
+}
+[data-width=fixed] .contentLayout{
+  width:496px;
+}
+
+.content{
+  font-family:var(--sans-body-m-font-family, SB Sans Interface);
+  font-weight:var(--sans-body-m-font-weight, Regular);
+  line-height:var(--sans-body-m-line-height, 20px);
+  font-size:var(--sans-body-m-font-size, 14px);
+  letter-spacing:var(--sans-body-m-letter-spacing, 0.1px);
+  paragraph-spacing:var(--sans-body-m-paragraph-spacing, 7.7px);
+  position:relative;
+  min-width:0;
+  color:var(--sys-neutral-text-main, #41424e);
+  display:flex;
+  height:100%;
+  flex:1;
+  justify-content:flex-start;
+  align-items:flex-start;
+  overflow-wrap:anywhere;
+}
+
+.rowActions{
+  display:flex;
+  align-items:center;
+  gap:8px;
+}

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

@@ -0,0 +1,2 @@
+export * from './InfoRow';
+export * from './InfoGroup';

package/dist/cjs/components/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./InfoRow"), exports);
+__exportStar(require("./InfoGroup"), exports);

package/dist/cjs/index.d.ts

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

package/dist/cjs/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./components"), exports);

package/dist/esm/components/InfoGroup/InfoGroup.d.ts

@@ -0,0 +1,2 @@
+import { DataType, InfoGroupProps } from './types';
+export declare function InfoGroup<T extends DataType>({ data, items, className, loading }: InfoGroupProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/InfoGroup/InfoGroup.js

@@ -0,0 +1,23 @@
+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 { InfoRow } from '../InfoRow';
+import { useGetContent } from './utils';
+export function InfoGroup({ data, items, className, loading }) {
+    const getContent = useGetContent();
+    return (_jsx("div", { className: className, children: items.map((_a, index) => {
+            var _b;
+            var { label, accessorKey, render } = _a, rest = __rest(_a, ["label", "accessorKey", "render"]);
+            const content = getContent({ data, render, accessorKey });
+            return (_jsx(InfoRow, Object.assign({ label: label, content: content, topDivider: index === 0, bottomDivider: true, loading: loading }, rest), (_b = accessorKey) !== null && _b !== void 0 ? _b : label));
+        }) }));
+}

package/dist/esm/components/InfoGroup/constants.d.ts

@@ -0,0 +1 @@
+export declare const NO_DATA_PLACEHOLDER = "\u2014";

package/dist/esm/components/InfoGroup/constants.js

@@ -0,0 +1 @@
+export const NO_DATA_PLACEHOLDER = '—';

package/dist/esm/components/InfoGroup/index.d.ts

@@ -0,0 +1,2 @@
+export { InfoGroup } from './InfoGroup';
+export { type InfoGroupProps, type InfoGroupItem } from './types';

package/dist/esm/components/InfoGroup/index.js

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

package/dist/esm/components/InfoGroup/types.d.ts

@@ -0,0 +1,19 @@
+import { ReactNode } from 'react';
+import { InfoRowPropsBase } from '../InfoRow/InfoRow';
+export type DataType = Record<string, unknown>;
+type PropsWithAccessorKey<T extends DataType> = {
+    accessorKey: keyof T;
+    render?: never;
+} & Omit<InfoRowPropsBase, 'content'>;
+type PropsWithRender<T extends DataType> = {
+    render: (data: T, noDataPlaceholder: string) => ReactNode;
+    accessorKey?: never;
+} & Omit<InfoRowPropsBase, 'content'>;
+export type InfoGroupItem<T extends DataType> = PropsWithRender<T> | PropsWithAccessorKey<T>;
+export type InfoGroupProps<T extends DataType> = {
+    data: T | undefined;
+    items: InfoGroupItem<T>[];
+    className?: string;
+    loading?: boolean;
+};
+export {};

package/dist/esm/components/InfoGroup/types.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/components/InfoGroup/utils/index.d.ts

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

package/dist/esm/components/InfoGroup/utils/index.js

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

package/dist/esm/components/InfoGroup/utils/typeGuards.d.ts

@@ -0,0 +1,5 @@
+export declare const isNil: (value: unknown) => value is undefined | null;
+export declare const isBoolean: (value: unknown) => value is boolean;
+export declare const isString: (value: unknown) => value is string;
+export declare const isArray: <T>(value: unknown) => value is Array<T>;
+export declare const isObject: (value: unknown) => value is object;

package/dist/esm/components/InfoGroup/utils/typeGuards.js

@@ -0,0 +1,5 @@
+export const isNil = (value) => value === undefined || value === null;
+export const isBoolean = (value) => typeof value === 'boolean';
+export const isString = (value) => typeof value === 'string';
+export const isArray = (value) => Array.isArray(value);
+export const isObject = (value) => typeof value === 'object' && !isArray(value);

package/dist/esm/components/InfoGroup/utils/useGetContent.d.ts

@@ -0,0 +1,4 @@
+import { DataType, InfoGroupItem, InfoGroupProps } from '../types';
+type Props<T extends DataType> = Pick<InfoGroupProps<T>, 'data'> & Pick<InfoGroupItem<T>, 'accessorKey' | 'render'>;
+export declare function useGetContent(): <T extends DataType>({ data, accessorKey, render }: Props<T>) => import("react").ReactNode;
+export {};

package/dist/esm/components/InfoGroup/utils/useGetContent.js

@@ -0,0 +1,31 @@
+import { useLocale } from '@sbercloud/uikit-product-locale';
+import { NO_DATA_PLACEHOLDER } from '../constants';
+import { isArray, isBoolean, isNil, isObject, isString } from './typeGuards';
+export function useGetContent() {
+    const { t } = useLocale('InfoRow');
+    return function getContent({ data, accessorKey, render }) {
+        if (!data) {
+            return NO_DATA_PLACEHOLDER;
+        }
+        const value = accessorKey ? data[accessorKey] : undefined;
+        if (!isNil(value)) {
+            if (isBoolean(value)) {
+                return value ? t('booleanValueTrue') : t('booleanValueFalse');
+            }
+            if (isString(value)) {
+                return value ? value : NO_DATA_PLACEHOLDER;
+            }
+            if (isArray(value)) {
+                return value.length ? value.join(', ') : NO_DATA_PLACEHOLDER;
+            }
+            if (isObject(value)) {
+                return Object.keys(value).length ? JSON.stringify(value) : NO_DATA_PLACEHOLDER;
+            }
+            return String(value);
+        }
+        if (render) {
+            return render(data, NO_DATA_PLACEHOLDER);
+        }
+        return NO_DATA_PLACEHOLDER;
+    };
+}

package/dist/esm/components/InfoRow/InfoRow.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+import { WithSupportProps } from '@sbercloud/uikit-product-utils';
+import { ButtonTonalProps } from '@snack-uikit/button';
+import { QuestionTooltipProps, TooltipProps } from '@snack-uikit/tooltip';
+type RowActionButton = {
+    tip?: Pick<TooltipProps, 'trigger' | 'tip' | 'placement' | 'disableMaxWidth' | 'open' | 'onOpenChange'> | string;
+} & Omit<ButtonTonalProps, 'size' | 'appearance' | 'label'>;
+export type InfoRowPropsBase = {
+    label: string;
+    labelTruncate?: number;
+    labelTooltip?: Pick<QuestionTooltipProps, 'trigger' | 'tip' | 'placement' | 'disableMaxWidth' | 'open' | 'onOpenChange'> | string;
+    topDivider?: boolean;
+    bottomDivider?: boolean;
+    className?: string;
+    content?: ReactNode;
+    rowActions?: {
+        first: RowActionButton;
+        second?: RowActionButton;
+    };
+    loading?: boolean;
+    width?: 'fixed' | 'full';
+};
+export type InfoRowProps = WithSupportProps<InfoRowPropsBase>;
+export declare function withTip(children: ReactNode, tip?: TooltipProps | string): string | number | boolean | Iterable<ReactNode> | import("react/jsx-runtime").JSX.Element | null | undefined;
+export declare function InfoRow({ label, topDivider, bottomDivider, className, labelTooltip, content, rowActions, labelTruncate, loading, width, ...rest }: InfoRowProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/components/InfoRow/InfoRow.js

@@ -0,0 +1,32 @@
+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, jsxs as _jsxs } from "react/jsx-runtime";
+import cn from 'classnames';
+import { extractSupportProps } from '@sbercloud/uikit-product-utils';
+import { ButtonTonal } from '@snack-uikit/button';
+import { Divider } from '@snack-uikit/divider';
+import { SkeletonContextProvider, SkeletonText, WithSkeleton } from '@snack-uikit/skeleton';
+import { QuestionTooltip, Tooltip } from '@snack-uikit/tooltip';
+import { TruncateString } from '@snack-uikit/truncate-string';
+import styles from './styles.module.css';
+export function withTip(children, tip) {
+    if (!tip) {
+        return children;
+    }
+    return typeof tip === 'string' ? _jsx(Tooltip, { tip: tip, children: children }) : _jsx(Tooltip, Object.assign({}, tip, { children: children }));
+}
+export function InfoRow(_a) {
+    var { label, topDivider = true, bottomDivider = true, className, labelTooltip, content, rowActions, labelTruncate = 1, loading = false, width = 'fixed' } = _a, rest = __rest(_a, ["label", "topDivider", "bottomDivider", "className", "labelTooltip", "content", "rowActions", "labelTruncate", "loading", "width"]);
+    return (_jsxs("div", Object.assign({}, extractSupportProps(rest), { className: cn(styles.wrapper, className), "data-width": width, children: [topDivider && _jsx(Divider, { weight: 'regular' }), _jsxs("div", { className: styles.infoRow, children: [_jsxs("div", { className: styles.labelLayout, children: [_jsx(TruncateString, { text: label, maxLines: labelTruncate }), labelTooltip &&
+                                (typeof labelTooltip === 'string' ? (_jsx(QuestionTooltip, { tip: labelTooltip, size: 'xs', placement: 'top', trigger: 'hover', tabIndex: -1 })) : (_jsx(QuestionTooltip, Object.assign({}, labelTooltip, { size: 'xs' }))))] }), _jsxs("div", { className: styles.contentLayout, children: [_jsx(SkeletonContextProvider, { loading: loading, children: _jsx(WithSkeleton, { skeleton: _jsx(SkeletonText, { width: '100%', lines: 1 }), children: _jsx("div", { className: styles.content, children: content }) }) }), rowActions && (_jsxs("div", { className: styles.rowActions, children: [withTip(_jsx(ButtonTonal, Object.assign({}, rowActions.first, { disabled: loading || rowActions.first.disabled, appearance: 'neutral', size: 's' })), rowActions.first.tip), rowActions.second &&
+                                        withTip(_jsx(ButtonTonal, Object.assign({}, rowActions.second, { disabled: loading || rowActions.second.disabled, appearance: 'neutral', size: 's' })), rowActions.second.tip)] }))] })] }), bottomDivider && _jsx(Divider, { weight: 'regular' })] })));
+}

package/dist/esm/components/InfoRow/index.d.ts

@@ -0,0 +1 @@
+export { InfoRow, type InfoRowProps, withTip } from './InfoRow';

package/dist/esm/components/InfoRow/index.js

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

package/dist/esm/components/InfoRow/styles.module.css

@@ -0,0 +1,72 @@
+.wrapper{
+  width:calc(200px + var(--dimension-3m, 24px) + 496px);
+}
+.wrapper[data-width=full]{
+  width:100%;
+}
+
+.infoRow{
+  padding:calc(var(--dimension-1m, 8px) + var(--dimension-050m, 4px)) 0;
+  display:flex;
+  -moz-column-gap:var(--dimension-3m, 24px);
+       column-gap:var(--dimension-3m, 24px);
+  width:100%;
+  align-items:center;
+}
+
+.labelLayout{
+  font-family:var(--light-label-l-font-family, SB Sans Interface);
+  font-weight:var(--light-label-l-font-weight, Regular);
+  line-height:var(--light-label-l-line-height, 20px);
+  font-size:var(--light-label-l-font-size, 14px);
+  letter-spacing:var(--light-label-l-letter-spacing, 0px);
+  paragraph-spacing:var(--light-label-l-paragraph-spacing, 7.7px);
+  position:relative;
+  width:200px;
+  color:var(--sys-neutral-text-main, #41424e);
+  display:flex;
+  -moz-column-gap:4px;
+       column-gap:4px;
+  align-items:center;
+  justify-content:flex-start;
+  height:100%;
+}
+
+.contentLayout{
+  position:relative;
+  display:flex;
+  align-items:center;
+  justify-content:space-between;
+  flex-grow:1;
+  flex-shrink:1;
+  flex-basis:0;
+  -moz-column-gap:12px;
+       column-gap:12px;
+}
+[data-width=fixed] .contentLayout{
+  width:496px;
+}
+
+.content{
+  font-family:var(--sans-body-m-font-family, SB Sans Interface);
+  font-weight:var(--sans-body-m-font-weight, Regular);
+  line-height:var(--sans-body-m-line-height, 20px);
+  font-size:var(--sans-body-m-font-size, 14px);
+  letter-spacing:var(--sans-body-m-letter-spacing, 0.1px);
+  paragraph-spacing:var(--sans-body-m-paragraph-spacing, 7.7px);
+  position:relative;
+  min-width:0;
+  color:var(--sys-neutral-text-main, #41424e);
+  display:flex;
+  height:100%;
+  flex:1;
+  justify-content:flex-start;
+  align-items:flex-start;
+  overflow-wrap:anywhere;
+}
+
+.rowActions{
+  display:flex;
+  align-items:center;
+  gap:8px;
+}

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

@@ -0,0 +1,2 @@
+export * from './InfoRow';
+export * from './InfoGroup';

package/dist/esm/components/index.js

@@ -0,0 +1,2 @@
+export * from './InfoRow';
+export * from './InfoGroup';

package/dist/esm/index.d.ts

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

package/dist/esm/index.js

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

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloud-ru/uikit-product-info-row",
   "title": "Info Row",
-  "version": "0.8.24",
+  "version": "0.8.25",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -30,13 +30,14 @@
     "name": "Akhremenko Grigorii",
     "url": "https://github.com/AGrigorii"
   },
+  "contributors": [],
   "license": "Apache-2.0",
   "publishConfig": {
     "access": "public"
   },
   "scripts": {},
   "dependencies": {
-    "@cloud-ru/uikit-product-utils": "7.0.0",
+    "@cloud-ru/uikit-product-utils": "7.0.1",
     "@snack-uikit/button": "0.19.7",
     "@snack-uikit/divider": "3.2.3",
     "@snack-uikit/skeleton": "0.6.2",
@@ -47,5 +48,5 @@
   "peerDependencies": {
     "@cloud-ru/uikit-product-locale": "*"
   },
-  "gitHead": "e8bd79bc92b26a8f52611972eec98a867536ccd3"
+  "gitHead": "9c11b1e33e716c874534a1c162266c8591f2ed03"
 }