import React, { forwardRef } from "react";
import { cx } from "../../utils";
import { base, CellLeft, CellRight, CellContentWrapper, CellContent } from "./Cell.styles";
import { classes } from "./Cell.tokens";
import { base as viewCSS } from "./variations/_view/base";
import { base as sizeCSS } from "./variations/_size/base";
import { CellTextbox } from "./ui/CellTextbox/CellTextbox";
export const cellRoot = (Root)=>/*#__PURE__*/ forwardRef(({ size, view, contentLeft, contentRight, alignContentLeft = 'center', alignContentRight = 'center', children, title, subtitle, label, description, content, stretching = 'filled', className, ...rest }, outerRootRef)=>{
        const stretchingClass = classes[`${stretching}Stretching`];
        // Импорт  старых свойств
        const titleText = title || description;
        const contentLeftDeprecated = contentLeft || content;
        return /*#__PURE__*/ React.createElement(Root, {
            ref: outerRootRef,
            size: size,
            view: view,
            className: cx(stretchingClass, classes.cellRoot, className),
            ...rest
        }, contentLeftDeprecated && /*#__PURE__*/ React.createElement(CellLeft, {
            align: alignContentLeft
        }, contentLeftDeprecated), /*#__PURE__*/ React.createElement(CellContentWrapper, null, /*#__PURE__*/ React.createElement(CellContent, {
            className: "cell-content"
        }, titleText || subtitle || label ? /*#__PURE__*/ React.createElement(CellTextbox, {
            label: label,
            title: titleText,
            subtitle: subtitle
        }) : children), contentRight && /*#__PURE__*/ React.createElement(CellRight, {
            align: alignContentRight
        }, contentRight)));
    });
export const cellConfig = {
    name: 'Cell',
    tag: 'div',
    layout: cellRoot,
    base,
    variations: {
        view: {
            css: viewCSS
        },
        size: {
            css: sizeCSS
        }
    },
    defaults: {
        view: 'default',
        size: 'm'
    }
};
