@ozen-ui/kit 0.70.0 → 0.71.0

package/__inner__/cjs/components/ListCardItem/__tests__/checkInteractiveElement.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.checkInteractiveElement = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var user_event_1 = tslib_1.__importDefault(require("@testing-library/user-event"));
+var vitest_1 = require("vitest");
+var test_utils_1 = require("../../../utils/test-utils");
+var ListCardItem_1 = require("../ListCardItem");
+var ListCardItemContext_1 = require("../ListCardItemContext");
+var checkInteractiveElement = function (_a) {
+    var component = _a.component, getComponent = _a.getComponent, _b = _a.isActive, isActive = _b === void 0 ? true : _b;
+    (0, vitest_1.it)('отключает обработку hover для root-компонента', function () { return tslib_1.__awaiter(void 0, void 0, void 0, function () {
+        var hoverControl, Component;
+        var _a, _b, _c;
+        return tslib_1.__generator(this, function (_d) {
+            switch (_d.label) {
+                case 0:
+                    hoverControl = {
+                        current: null,
+                    };
+                    Component = function () {
+                        var context = (0, ListCardItemContext_1.useListCardItemContext)();
+                        hoverControl.current = context.hoverControl;
+                        return null;
+                    };
+                    (0, test_utils_1.render)(react_1.default.createElement(ListCardItem_1.ListCardItem, null,
+                        react_1.default.createElement(Component, null),
+                        component));
+                    (0, vitest_1.expect)((_a = hoverControl.current) === null || _a === void 0 ? void 0 : _a.isHoverChildren).toBe(false);
+                    return [4 /*yield*/, user_event_1.default.hover(getComponent())];
+                case 1:
+                    _d.sent();
+                    (0, vitest_1.expect)((_b = hoverControl.current) === null || _b === void 0 ? void 0 : _b.isHoverChildren).toBe(isActive);
+                    return [4 /*yield*/, user_event_1.default.unhover(getComponent())];
+                case 2:
+                    _d.sent();
+                    (0, vitest_1.expect)((_c = hoverControl.current) === null || _c === void 0 ? void 0 : _c.isHoverChildren).toBe(false);
+                    return [2 /*return*/];
+            }
+        });
+    }); });
+};
+exports.checkInteractiveElement = checkInteractiveElement;

package/__inner__/cjs/components/ListCardItem/__tests__/checkItemColors.d.ts

@@ -0,0 +1,6 @@
+import type { ListCardItemColorScheme } from '../entities';
+export declare const checkItemColors: ({ element, type, colorScheme, }: {
+    element: HTMLElement;
+    type: "border" | "background";
+    colorScheme: ListCardItemColorScheme;
+}) => void;

package/__inner__/cjs/components/ListCardItem/__tests__/checkItemColors.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.checkItemColors = void 0;
+var vitest_1 = require("vitest");
+var css_1 = require("../../../utils/css");
+var OzenProvider_1 = require("../../OzenProvider");
+var checkItemColors = function (_a) {
+    var element = _a.element, type = _a.type, colorScheme = _a.colorScheme;
+    var colorToken = OzenProvider_1.themeColorTokenOzenDark;
+    var computedStyles = getComputedStyle(element);
+    (0, vitest_1.expect)(computedStyles.getPropertyValue((0, css_1.generateCSSVariableName)("list-card-item-".concat(type, "-color-base")))).toBe("var(".concat(colorToken.toCSSProperty(colorScheme.base), ")"));
+    (0, vitest_1.expect)(computedStyles.getPropertyValue((0, css_1.generateCSSVariableName)("list-card-item-".concat(type, "-color-hover")))).toBe("var(".concat(colorToken.toCSSProperty(colorScheme.hover), ")"));
+    (0, vitest_1.expect)(computedStyles.getPropertyValue((0, css_1.generateCSSVariableName)("list-card-item-".concat(type, "-color-pressed")))).toBe("var(".concat(colorToken.toCSSProperty(colorScheme.pressed), ")"));
+};
+exports.checkItemColors = checkItemColors;

package/__inner__/cjs/components/ListCardItem/__tests__/checkItemRatio.d.ts

@@ -0,0 +1,4 @@
+export declare const checkItemRatio: ({ element, ratio, }: {
+    element: HTMLElement;
+    ratio: number;
+}) => void;

package/__inner__/cjs/components/ListCardItem/__tests__/checkItemRatio.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.checkItemRatio = void 0;
+var vitest_1 = require("vitest");
+var css_1 = require("../../../utils/css");
+var classNames_1 = require("../classNames");
+var constants_1 = require("../constants");
+var checkItemRatio = function (_a) {
+    var element = _a.element, ratio = _a.ratio;
+    var center = element.querySelector(".".concat((0, classNames_1.cnListCardItem)('Center')));
+    var trailing = element.querySelector(".".concat((0, classNames_1.cnListCardItem)('Trailing')));
+    var centerStyles = getComputedStyle(center);
+    var trailingStyles = getComputedStyle(trailing);
+    var centerGrow = centerStyles.getPropertyValue((0, css_1.generateCSSVariableName)(constants_1.LIST_CARD_ITEM_CSS_VARIABLES.CENTER_GROW));
+    var trailingGrow = trailingStyles.getPropertyValue((0, css_1.generateCSSVariableName)(constants_1.LIST_CARD_ITEM_CSS_VARIABLES.TRAILING_GROW));
+    (0, vitest_1.expect)(Number(centerGrow)).toBe(ratio * 100);
+    (0, vitest_1.expect)(Number(trailingGrow)).toBe(100 - ratio * 100);
+};
+exports.checkItemRatio = checkItemRatio;

package/__inner__/cjs/components/ListCardItem/__tests__/index.d.ts

@@ -0,0 +1,3 @@
+export * from './checkInteractiveElement';
+export * from './checkItemColors';
+export * from './checkItemRatio';

package/__inner__/cjs/components/ListCardItem/__tests__/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./checkInteractiveElement"), exports);
+tslib_1.__exportStar(require("./checkItemColors"), exports);
+tslib_1.__exportStar(require("./checkItemRatio"), exports);

package/__inner__/cjs/components/ListCardItem/classNames.d.ts

@@ -0,0 +1 @@
+export declare const cnListCardItem: import("@bem-react/classname").ClassNameFormatter;

package/__inner__/cjs/components/ListCardItem/classNames.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.cnListCardItem = void 0;
+var classname_1 = require("../../utils/classname");
+exports.cnListCardItem = (0, classname_1.cn)('ListCardItem');

package/__inner__/cjs/components/ListCardItem/components/ListCardItemCaption/ListCardItemCaption.css

@@ -0,0 +1,13 @@
+/* stylelint-disable */
+.ListCardItemCaption {
+  font: var(--typography-text-xs-font);
+  letter-spacing: var(--typography-text-xs-letter_spacing, 0);
+  text-transform: var(--typography-text-xs-text_transform, none);
+  color: var(--color-content-tertiary);
+}
+.ListCardItemCaption_size_xs, .ListCardItemCaption_size_s {
+    padding-block: var(--spacing-4xs);
+  }
+.ListCardItemCaption_size_m, .ListCardItemCaption_size_l {
+    padding-block: var(--spacing-3xs);
+  }

package/__inner__/cjs/components/ListCardItem/components/ListCardItemCaption/ListCardItemCaption.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { ListCardItemCaptionProps } from './types';
+export declare const cnListCardItemCaption: import("@bem-react/classname").ClassNameFormatter;
+export declare const ListCardItemCaption: React.ForwardRefExoticComponent<Omit<ListCardItemCaptionProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/cjs/components/ListCardItem/components/ListCardItemCaption/ListCardItemCaption.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ListCardItemCaption = exports.cnListCardItemCaption = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var classname_1 = require("../../../../utils/classname");
+var ListCardItemContext_1 = require("../../ListCardItemContext");
+exports.cnListCardItemCaption = (0, classname_1.cn)('ListCardItemCaption');
+exports.ListCardItemCaption = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, className = _a.className, other = tslib_1.__rest(_a, ["children", "className"]);
+    var size = (0, ListCardItemContext_1.useListCardItemContext)().size;
+    return (react_1.default.createElement("div", tslib_1.__assign({}, other, { ref: ref, className: (0, exports.cnListCardItemCaption)({
+            size: size,
+        }, [className]) }), children));
+});
+exports.ListCardItemCaption.displayName = 'ListCardItemCaption';

package/__inner__/cjs/components/ListCardItem/components/ListCardItemCaption/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ListCardItemCaption';
+export * from './types';

package/__inner__/cjs/components/ListCardItem/components/ListCardItemCaption/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./ListCardItemCaption"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/ListCardItem/components/ListCardItemCaption/types.d.ts

@@ -0,0 +1,7 @@
+import type { ComponentRef } from 'react';
+import type { ExtendableComponentPropsWithRef } from '../../../../types/ExtendableComponentPropsWithRef';
+export type ListCardItemCaptionRef = ComponentRef<'div'>;
+export type ListCardItemCaptionProps = ExtendableComponentPropsWithRef<{
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
+}, 'div'>;

package/__inner__/cjs/components/ListCardItem/components/ListCardItemCaption/types.js

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

package/__inner__/cjs/components/ListCardItem/components/ListCardItemInfoCarcass/ListCardItemInfoCarcass.css

@@ -0,0 +1,106 @@
+/* stylelint-disable */
+.ListCardItemInfoCarcass {
+  display: flex;
+  overflow: hidden;
+}
+.ListCardItemInfoCarcass-Label {
+    color: var(--color-content-secondary);
+  }
+.ListCardItemInfoCarcass-Content {
+    color: var(--color-content-primary);
+  }
+.ListCardItemInfoCarcass-Hint {
+    color: var(--color-content-secondary);
+  }
+.ListCardItemInfoCarcass-Bottom {
+    margin-block-start: var(--spacing-2xs);
+  }
+.ListCardItemInfoCarcass-HintBefore {
+    block-size: 16px;
+    margin-inline-end: var(--spacing-3xs);
+  }
+.ListCardItemInfoCarcass_onlyOneElement {
+    padding-block: var(--list-card-item-info-carcass-one-item-padding);
+  }
+.ListCardItemInfoCarcass_textOverflow_ellipsis .ListCardItemInfoCarcass-Label,
+      .ListCardItemInfoCarcass_textOverflow_ellipsis .ListCardItemInfoCarcass-Content,
+      .ListCardItemInfoCarcass_textOverflow_ellipsis .ListCardItemInfoCarcass-Hint,
+      .ListCardItemInfoCarcass_textOverflow_ellipsis .ListCardItemInfoCarcass-Bottom,
+      .ListCardItemInfoCarcass_textOverflow_ellipsis .ListCardItemCaption,
+      .ListCardItemInfoCarcass_textOverflow_ellipsis .ListCardItemInfoCarcass-HintBefore {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+.ListCardItemInfoCarcass_size_xs {
+    --list-card-item-info-carcass-one-item-padding: 10px;
+  }
+.ListCardItemInfoCarcass_size_xs .ListCardItemInfoCarcass-Label,
+    .ListCardItemInfoCarcass_size_xs .ListCardItemInfoCarcass-Hint {
+      font: var(--typography-text-xs-font);
+      letter-spacing: var(--typography-text-xs-letter_spacing, 0);
+      text-transform: var(--typography-text-xs-text_transform, none);
+      margin-block: var(--spacing-4xs);
+    }
+.ListCardItemInfoCarcass_size_xs .ListCardItemInfoCarcass-Content {
+      font: var(--typography-text-xs_1-font);
+      letter-spacing: var(--typography-text-xs_1-letter_spacing, 0);
+      text-transform: var(--typography-text-xs_1-text_transform, none);
+      margin-block: var(--spacing-3xs);
+    }
+.ListCardItemInfoCarcass_size_s {
+    --list-card-item-info-carcass-one-item-padding: 10px;
+  }
+.ListCardItemInfoCarcass_size_s .ListCardItemInfoCarcass-Label,
+    .ListCardItemInfoCarcass_size_s .ListCardItemInfoCarcass-Hint {
+      font: var(--typography-text-xs-font);
+      letter-spacing: var(--typography-text-xs-letter_spacing, 0);
+      text-transform: var(--typography-text-xs-text_transform, none);
+      margin-block: var(--spacing-4xs);
+    }
+.ListCardItemInfoCarcass_size_s .ListCardItemInfoCarcass-Content {
+      font: var(--typography-text-s_1-font);
+      letter-spacing: var(--typography-text-s_1-letter_spacing, 0);
+      text-transform: var(--typography-text-s_1-text_transform, none);
+      margin-block: var(--spacing-4xs);
+    }
+.ListCardItemInfoCarcass_size_m {
+    --list-card-item-info-carcass-one-item-padding: var(--spacing-xs);
+  }
+.ListCardItemInfoCarcass_size_m .ListCardItemInfoCarcass-Label {
+      font: var(--typography-text-xs-font);
+      letter-spacing: var(--typography-text-xs-letter_spacing, 0);
+      text-transform: var(--typography-text-xs-text_transform, none);
+      margin-block: var(--spacing-3xs);
+    }
+.ListCardItemInfoCarcass_size_m .ListCardItemInfoCarcass-Hint {
+      font: var(--typography-text-s-font);
+      letter-spacing: var(--typography-text-s-letter_spacing, 0);
+      text-transform: var(--typography-text-s-text_transform, none);
+      margin-block: var(--spacing-4xs);
+    }
+.ListCardItemInfoCarcass_size_m .ListCardItemInfoCarcass-Content {
+      font: var(--typography-text-m_1-font);
+      letter-spacing: var(--typography-text-m_1-letter_spacing, 0);
+      text-transform: var(--typography-text-m_1-text_transform, none);
+    }
+.ListCardItemInfoCarcass_size_l {
+    --list-card-item-info-carcass-one-item-padding: var(--spacing-xs);
+  }
+.ListCardItemInfoCarcass_size_l .ListCardItemInfoCarcass-Label {
+      font: var(--typography-text-xs-font);
+      letter-spacing: var(--typography-text-xs-letter_spacing, 0);
+      text-transform: var(--typography-text-xs-text_transform, none);
+      margin-block: var(--spacing-3xs);
+    }
+.ListCardItemInfoCarcass_size_l .ListCardItemInfoCarcass-Hint {
+      font: var(--typography-text-s-font);
+      letter-spacing: var(--typography-text-s-letter_spacing, 0);
+      text-transform: var(--typography-text-s-text_transform, none);
+      margin-block: var(--spacing-4xs);
+    }
+.ListCardItemInfoCarcass_size_l .ListCardItemInfoCarcass-Content {
+      font: var(--typography-text-l_1-font);
+      letter-spacing: var(--typography-text-l_1-letter_spacing, 0);
+      text-transform: var(--typography-text-l_1-text_transform, none);
+    }

package/__inner__/cjs/components/ListCardItem/components/ListCardItemInfoCarcass/ListCardItemInfoCarcass.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export declare const cnListCardItemInfoCarcass: import("@bem-react/classname").ClassNameFormatter;
+export declare const ListCardItemInfoCarcass: React.ForwardRefExoticComponent<{
+    children: React.ReactNode;
+    label?: React.ReactNode;
+    hint?: React.ReactNode;
+    hintBefore?: React.ReactNode;
+    caption?: React.ReactNode;
+    bottom?: React.ReactNode;
+    textOverflow?: import("./entities").ListCardItemInfoCarcassTextOverflow;
+} & Omit<import("../../../Stack").StackProps, "children" | "ref" | "as"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/cjs/components/ListCardItem/components/ListCardItemInfoCarcass/ListCardItemInfoCarcass.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ListCardItemInfoCarcass = exports.cnListCardItemInfoCarcass = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var classname_1 = require("../../../../utils/classname");
+var Stack_1 = require("../../../Stack");
+var ListCardItemContext_1 = require("../../ListCardItemContext");
+var ListCardItemCaption_1 = require("../ListCardItemCaption");
+var constants_1 = require("./constants");
+exports.cnListCardItemInfoCarcass = (0, classname_1.cn)('ListCardItemInfoCarcass');
+exports.ListCardItemInfoCarcass = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, label = _a.label, caption = _a.caption, hint = _a.hint, bottom = _a.bottom, className = _a.className, _b = _a.direction, direction = _b === void 0 ? 'column' : _b, hintBefore = _a.hintBefore, _c = _a.textOverflow, textOverflow = _c === void 0 ? constants_1.LIST_CARD_ITEM_INFO_CARCASS_DEFAULT_TEXT_OVERFLOW : _c, other = tslib_1.__rest(_a, ["children", "label", "caption", "hint", "bottom", "className", "direction", "hintBefore", "textOverflow"]);
+    var size = (0, ListCardItemContext_1.useListCardItemContext)().size;
+    var existElements = [
+        !!children,
+        !!label,
+        !!hint,
+        !!hintBefore,
+        !!caption,
+        !!bottom,
+    ];
+    var isOnlyOneElement = existElements.filter(function (isExist) { return isExist; }).length <= 1;
+    return (react_1.default.createElement(Stack_1.Stack, tslib_1.__assign({}, other, { ref: ref, className: (0, exports.cnListCardItemInfoCarcass)({
+            size: size,
+            onlyOneElement: isOnlyOneElement,
+            textOverflow: textOverflow,
+        }, [className]), direction: direction }),
+        label && (react_1.default.createElement("div", { className: (0, exports.cnListCardItemInfoCarcass)('Label') }, label)),
+        children && (react_1.default.createElement("div", { className: (0, exports.cnListCardItemInfoCarcass)('Content') }, children)),
+        !!(hint || hintBefore) && (react_1.default.createElement(Stack_1.Stack, { className: (0, exports.cnListCardItemInfoCarcass)('HintBlock'), align: "center", gap: "xs" },
+            hintBefore && (react_1.default.createElement("div", { className: (0, exports.cnListCardItemInfoCarcass)('HintBefore') }, hintBefore)),
+            hint && (react_1.default.createElement("div", { className: (0, exports.cnListCardItemInfoCarcass)('Hint') }, hint)))),
+        caption && react_1.default.createElement(ListCardItemCaption_1.ListCardItemCaption, null, caption),
+        bottom && (react_1.default.createElement("div", { className: (0, exports.cnListCardItemInfoCarcass)('Bottom') }, bottom))));
+});
+exports.ListCardItemInfoCarcass.displayName = 'ListCardItemInfoCarcass';

package/__inner__/cjs/components/ListCardItem/components/ListCardItemInfoCarcass/constants.d.ts

@@ -0,0 +1 @@
+export declare const LIST_CARD_ITEM_INFO_CARCASS_DEFAULT_TEXT_OVERFLOW = "clip";

package/__inner__/cjs/components/ListCardItem/components/ListCardItemInfoCarcass/constants.js

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

package/__inner__/cjs/components/ListCardItem/components/ListCardItemInfoCarcass/entities/index.d.ts

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

package/__inner__/cjs/components/ListCardItem/components/ListCardItemInfoCarcass/entities/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./text-overflow"), exports);

package/__inner__/cjs/components/ListCardItem/components/ListCardItemInfoCarcass/entities/text-overflow.d.ts

@@ -0,0 +1,2 @@
+export declare const listCardItemInfoCarcassTextOverflow: readonly ["ellipsis", "clip"];
+export type ListCardItemInfoCarcassTextOverflow = (typeof listCardItemInfoCarcassTextOverflow)[number];

package/__inner__/cjs/components/ListCardItem/components/ListCardItemInfoCarcass/entities/text-overflow.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.listCardItemInfoCarcassTextOverflow = void 0;
+exports.listCardItemInfoCarcassTextOverflow = [
+    'ellipsis',
+    'clip',
+];

package/__inner__/cjs/components/ListCardItem/components/ListCardItemInfoCarcass/index.d.ts

@@ -0,0 +1,4 @@
+export * from './entities';
+export * from './constants';
+export * from './ListCardItemInfoCarcass';
+export * from './types';

package/__inner__/cjs/components/ListCardItem/components/ListCardItemInfoCarcass/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./entities"), exports);
+tslib_1.__exportStar(require("./constants"), exports);
+tslib_1.__exportStar(require("./ListCardItemInfoCarcass"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/ListCardItem/components/ListCardItemInfoCarcass/types.d.ts

@@ -0,0 +1,13 @@
+import type { ReactNode } from 'react';
+import type { StackProps, StackRef } from '../../../Stack';
+import type { ListCardItemInfoCarcassTextOverflow } from './entities';
+export type ListCardItemInfoCarcassRef = StackRef;
+export type ListCardItemInfoCarcassProps = {
+    children: ReactNode;
+    label?: ReactNode;
+    hint?: ReactNode;
+    hintBefore?: ReactNode;
+    caption?: ReactNode;
+    bottom?: ReactNode;
+    textOverflow?: ListCardItemInfoCarcassTextOverflow;
+} & Omit<StackProps, 'as' | 'ref' | 'children'>;

package/__inner__/cjs/components/ListCardItem/components/ListCardItemInfoCarcass/types.js

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

package/__inner__/cjs/components/ListCardItem/components/ListCardItemItemCarcass/ListCardItemItemCarcass.css

@@ -0,0 +1,28 @@
+.ListCardItemItemCarcass {
+  overflow: hidden;
+}
+
+  .ListCardItemItemCarcass_size_xs, .ListCardItemItemCarcass_size_s {
+    --list-card-item-item-carcass-block-size: 44px;
+  }
+
+  .ListCardItemItemCarcass_size_m {
+    --list-card-item-item-carcass-block-size: 48px;
+  }
+
+  .ListCardItemItemCarcass_size_l {
+    --list-card-item-item-carcass-block-size: 52px;
+  }
+
+  .ListCardItemItemCarcass-Content {
+    block-size: var(--list-card-item-item-carcass-block-size);
+    overflow: hidden;
+    padding-inline: 2px;
+  }
+
+  .ListCardItemItemCarcass-Caption {
+    text-align: end;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }

package/__inner__/cjs/components/ListCardItem/components/ListCardItemItemCarcass/ListCardItemItemCarcass.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { ListCardItemItemCarcassProps } from './types';
+export declare const cnListCardItemItemCarcass: import("@bem-react/classname").ClassNameFormatter;
+export declare const ListCardItemItemCarcass: React.ForwardRefExoticComponent<Omit<ListCardItemItemCarcassProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/cjs/components/ListCardItem/components/ListCardItemItemCarcass/ListCardItemItemCarcass.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ListCardItemItemCarcass = exports.cnListCardItemItemCarcass = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var classname_1 = require("../../../../utils/classname");
+var Stack_1 = require("../../../Stack");
+var ListCardItemContext_1 = require("../../ListCardItemContext");
+var ListCardItemCaption_1 = require("../ListCardItemCaption");
+exports.cnListCardItemItemCarcass = (0, classname_1.cn)('ListCardItemItemCarcass');
+exports.ListCardItemItemCarcass = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, className = _a.className, caption = _a.caption, contentProps = _a.contentProps, captionProps = _a.captionProps, other = tslib_1.__rest(_a, ["children", "className", "caption", "contentProps", "captionProps"]);
+    var size = (0, ListCardItemContext_1.useListCardItemContext)().size;
+    return (react_1.default.createElement(Stack_1.Stack, tslib_1.__assign({}, other, { ref: ref, className: (0, exports.cnListCardItemItemCarcass)({
+            size: size,
+        }, [className]), direction: "column" }),
+        react_1.default.createElement(Stack_1.Stack, tslib_1.__assign({ justify: "center", align: "center" }, contentProps, { className: (0, exports.cnListCardItemItemCarcass)('Content', [
+                contentProps === null || contentProps === void 0 ? void 0 : contentProps.className,
+            ]) }), children),
+        caption && (react_1.default.createElement(ListCardItemCaption_1.ListCardItemCaption, tslib_1.__assign({}, captionProps, { className: (0, exports.cnListCardItemItemCarcass)('Caption', [
+                captionProps === null || captionProps === void 0 ? void 0 : captionProps.className,
+            ]) }), caption))));
+});
+exports.ListCardItemItemCarcass.displayName = 'ListCardItemItemCarcass';

package/__inner__/cjs/components/ListCardItem/components/ListCardItemItemCarcass/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ListCardItemItemCarcass';
+export * from './types';

package/__inner__/cjs/components/ListCardItem/components/ListCardItemItemCarcass/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./ListCardItemItemCarcass"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/ListCardItem/components/ListCardItemItemCarcass/types.d.ts

@@ -0,0 +1,20 @@
+import type { ReactNode } from 'react';
+import type { ExtendableComponentPropsWithRef } from '../../../../types/ExtendableComponentPropsWithRef';
+import type { StackProps, StackRef } from '../../../Stack';
+import type { STACK_DEFAULT_TAG } from '../../../Stack/constants';
+import type { ListCardItemCaptionProps, ListCardItemCaptionRef } from '../ListCardItemCaption';
+export type ListCardItemItemCarcassContentProps = Omit<StackProps, 'children'>;
+export type ListCardItemItemCarcassContentRef = StackRef;
+export type ListCardItemItemCarcassCaptionProps = Omit<ListCardItemCaptionProps, 'children'>;
+export type ListCardItemItemCarcassCaptionRef = ListCardItemCaptionRef;
+export type ListCardItemItemCarcassRef = StackRef;
+export type ListCardItemItemCarcassProps = ExtendableComponentPropsWithRef<{
+    /** Caption */
+    caption?: ReactNode;
+    /** Props для контента */
+    contentProps?: ListCardItemItemCarcassContentProps;
+    /** Props для caption */
+    captionProps?: ListCardItemItemCarcassCaptionProps;
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
+}, typeof STACK_DEFAULT_TAG>;

package/__inner__/cjs/components/ListCardItem/components/ListCardItemItemCarcass/types.js

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

package/__inner__/cjs/components/ListCardItem/components/index.d.ts

@@ -0,0 +1,3 @@
+export * from './ListCardItemCaption';
+export * from './ListCardItemInfoCarcass';
+export * from './ListCardItemItemCarcass';

package/__inner__/cjs/components/ListCardItem/components/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./ListCardItemCaption"), exports);
+tslib_1.__exportStar(require("./ListCardItemInfoCarcass"), exports);
+tslib_1.__exportStar(require("./ListCardItemItemCarcass"), exports);

package/__inner__/cjs/components/ListCardItem/constants.d.ts

@@ -0,0 +1,17 @@
+import type { PaperRadiusVariant } from '../Paper';
+import type { ListCardItemSizeVariant } from './entities';
+export declare const LIST_CARD_ITEM_DEFAULT_TAG = "div";
+export declare const LIST_CARD_ITEM_DEFAULT_BACKGROUND_COLOR_SCHEME: {
+    base: "background-main";
+    hover: "background-main-hover";
+    pressed: "background-main-pressed";
+};
+export declare const LIST_CARD_ITEM_DEFAULT_SIZE = "m";
+export declare const LIST_CARD_ITEM_DEFAULT_VARIANT = "onPage";
+export declare const LIST_CARD_ITEM_DEFAULT_CONTENT_TRAILING_RATIO = 0.85;
+export declare const LIST_CARD_ITEM_DEFAULT_INTERACTIVE = true;
+export declare const LIST_CARD_ITEM_SIZE_TO_PAPER_RADIUS: Readonly<Record<ListCardItemSizeVariant, PaperRadiusVariant>>;
+export declare const LIST_CARD_ITEM_CSS_VARIABLES: {
+    readonly CENTER_GROW: "list-card-item-center-grow";
+    readonly TRAILING_GROW: "list-card-item-trailing-grow";
+};

package/__inner__/cjs/components/ListCardItem/constants.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LIST_CARD_ITEM_CSS_VARIABLES = exports.LIST_CARD_ITEM_SIZE_TO_PAPER_RADIUS = exports.LIST_CARD_ITEM_DEFAULT_INTERACTIVE = exports.LIST_CARD_ITEM_DEFAULT_CONTENT_TRAILING_RATIO = exports.LIST_CARD_ITEM_DEFAULT_VARIANT = exports.LIST_CARD_ITEM_DEFAULT_SIZE = exports.LIST_CARD_ITEM_DEFAULT_BACKGROUND_COLOR_SCHEME = exports.LIST_CARD_ITEM_DEFAULT_TAG = void 0;
+var presets_1 = require("./presets");
+exports.LIST_CARD_ITEM_DEFAULT_TAG = 'div';
+exports.LIST_CARD_ITEM_DEFAULT_BACKGROUND_COLOR_SCHEME = presets_1.LIST_CARD_ITEM_BACKGROUND_COLOR_SCHEME.MAIN;
+exports.LIST_CARD_ITEM_DEFAULT_SIZE = 'm';
+exports.LIST_CARD_ITEM_DEFAULT_VARIANT = 'onPage';
+exports.LIST_CARD_ITEM_DEFAULT_CONTENT_TRAILING_RATIO = 0.85;
+exports.LIST_CARD_ITEM_DEFAULT_INTERACTIVE = true;
+exports.LIST_CARD_ITEM_SIZE_TO_PAPER_RADIUS = {
+    xs: 'xs',
+    s: 'xs',
+    m: 's',
+    l: 's',
+};
+exports.LIST_CARD_ITEM_CSS_VARIABLES = {
+    CENTER_GROW: 'list-card-item-center-grow',
+    TRAILING_GROW: 'list-card-item-trailing-grow',
+};

package/__inner__/cjs/components/ListCardItem/entities/colorSchemes/background.d.ts

@@ -0,0 +1,2 @@
+import type { ListCardItemColorScheme } from './base';
+export type ListCardItemBackgroundColorScheme = ListCardItemColorScheme;

package/__inner__/cjs/components/ListCardItem/entities/colorSchemes/background.js

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

package/__inner__/cjs/components/ListCardItem/entities/colorSchemes/base.d.ts

@@ -0,0 +1,6 @@
+import type { ThemeColorTokenVariable } from '../../../OzenProvider';
+export type ListCardItemColorScheme = {
+    base: ThemeColorTokenVariable;
+    hover: ThemeColorTokenVariable;
+    pressed: ThemeColorTokenVariable;
+};

package/__inner__/cjs/components/ListCardItem/entities/colorSchemes/base.js

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

package/__inner__/cjs/components/ListCardItem/entities/colorSchemes/border.d.ts

@@ -0,0 +1,2 @@
+import type { ListCardItemColorScheme } from './base';
+export type ListCardItemBorderColorScheme = ListCardItemColorScheme;

package/__inner__/cjs/components/ListCardItem/entities/colorSchemes/border.js

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

package/__inner__/cjs/components/ListCardItem/entities/colorSchemes/index.d.ts

@@ -0,0 +1,3 @@
+export * from './background';
+export * from './base';
+export * from './border';

package/__inner__/cjs/components/ListCardItem/entities/colorSchemes/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./background"), exports);
+tslib_1.__exportStar(require("./base"), exports);
+tslib_1.__exportStar(require("./border"), exports);

package/__inner__/cjs/components/ListCardItem/entities/index.d.ts

@@ -0,0 +1,3 @@
+export * from './colorSchemes';
+export * from './size';
+export * from './variant';

package/__inner__/cjs/components/ListCardItem/entities/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./colorSchemes"), exports);
+tslib_1.__exportStar(require("./size"), exports);
+tslib_1.__exportStar(require("./variant"), exports);

package/__inner__/cjs/components/ListCardItem/entities/size.d.ts

@@ -0,0 +1,2 @@
+export declare const listCardItemSizeVariant: readonly ["xs", "s", "m", "l"];
+export type ListCardItemSizeVariant = (typeof listCardItemSizeVariant)[number];