import React, { forwardRef } from "react";
import cx from "classnames";
import { base as viewCSS } from "./variations/_view/base";
import { base as sizeCSS } from "./variations/_size/base";
import { base as disabledCSS } from "./variations/_disabled/base";
import { base as readOnlyCSS } from "./variations/_read-only/base";
import { base as hintViewCSS } from "./variations/_hint-view/base";
import { base as hintSizeCSS } from "./variations/_hint-size/base";
import { base, ContentChildrenWrapper, ContentWrapper, Helpers, LabelWrapper, LeftHelper, RightHelper, TitleCaption } from "./InformationWrapper.styles";
import { LabelComponent } from "./ui";
import { classes } from "./InformationWrapper.tokens";
export const informationWrapperRoot = (Root)=>{
    return /*#__PURE__*/ forwardRef(({ size, view, children, label, labelHtmlFor, labelPlacement = 'top', hasRequiredIndicator, requiredIndicatorPlacement = 'right', optional, optionalText, hintText, hintTrigger = 'hover', hintView = 'default', hintSize = 'm', hintTargetIcon, hintPlacement = 'auto', hintHasArrow, hintOffset, hintWidth, hintContentLeft, titleCaption, leftHelper, rightHelper, readOnly, disabled, ...rest }, ref)=>{
        const hasHelpers = leftHelper || rightHelper;
        return /*#__PURE__*/ React.createElement(Root, {
            ref: ref,
            size: size,
            view: view,
            disabled: disabled,
            readOnly: readOnly,
            ...hintText && {
                hintView,
                hintSize
            },
            ...rest
        }, /*#__PURE__*/ React.createElement(LabelWrapper, {
            className: cx({
                [classes.withoutLabel]: !label
            }),
            hasLabel: Boolean(label),
            hasCaption: Boolean(titleCaption)
        }, (labelPlacement === 'top' || !label) && /*#__PURE__*/ React.createElement(LabelComponent, {
            size: size,
            hasRequiredIndicator: hasRequiredIndicator,
            requiredIndicatorPlacement: requiredIndicatorPlacement,
            optional: optional,
            optionalText: optionalText,
            label: label,
            labelHtmlFor: labelHtmlFor,
            titleCaption: titleCaption,
            hintText: hintText,
            hintTrigger: hintTrigger,
            hintTargetIcon: hintTargetIcon,
            hintPlacement: hintPlacement,
            hintHasArrow: hintHasArrow,
            hintOffset: hintOffset,
            hintWidth: hintWidth,
            hintContentLeft: hintContentLeft,
            disabled: disabled
        }), titleCaption && /*#__PURE__*/ React.createElement(TitleCaption, {
            hasLabel: Boolean(label)
        }, titleCaption)), /*#__PURE__*/ React.createElement(ContentWrapper, null, Boolean(label) && labelPlacement === 'left' && /*#__PURE__*/ React.createElement(LabelComponent, {
            hasRequiredIndicator: hasRequiredIndicator,
            requiredIndicatorPlacement: requiredIndicatorPlacement,
            optional: optional,
            optionalText: optionalText,
            label: label,
            labelHtmlFor: labelHtmlFor,
            titleCaption: titleCaption,
            hintText: hintText,
            hintTrigger: hintTrigger,
            hintTargetIcon: hintTargetIcon,
            hintPlacement: hintPlacement,
            hintHasArrow: hintHasArrow,
            hintOffset: hintOffset,
            hintWidth: hintWidth,
            hintContentLeft: hintContentLeft
        }), /*#__PURE__*/ React.createElement(ContentChildrenWrapper, null, children, hasHelpers && /*#__PURE__*/ React.createElement(Helpers, null, leftHelper && /*#__PURE__*/ React.createElement(LeftHelper, {
            className: classes.leftHelper
        }, leftHelper), rightHelper && /*#__PURE__*/ React.createElement(RightHelper, null, rightHelper)))));
    });
};
export const informationWrapperConfig = {
    name: 'InformationWrapper',
    tag: 'div',
    layout: informationWrapperRoot,
    base,
    variations: {
        size: {
            css: sizeCSS
        },
        view: {
            css: viewCSS
        },
        readOnly: {
            css: readOnlyCSS,
            attrs: true
        },
        disabled: {
            css: disabledCSS,
            attrs: true
        },
        hintView: {
            css: hintViewCSS
        },
        hintSize: {
            css: hintSizeCSS
        }
    },
    defaults: {
        size: 's',
        view: 'default'
    }
};
