import React from 'react';
import { isElement } from '../../../lib/react-is.js';
import { useEmotion, useStyles } from '../../../lib/renderEnvironment/index.js';
import { isKonturIcon } from '../../../lib/utils.js';
import { ThemeContext } from '../../../lib/theming/ThemeContext.js';
import { InputLayoutContext } from './InputLayoutContext.js';
import { getStylesLayout } from './InputLayout.styles.js';
export var InputLayoutAsideIcon = function (_a) {
    var _b;
    var _c = _a.icon, icon = _c === void 0 ? null : _c, side = _a.side;
    var theme = React.useContext(ThemeContext);
    var cx = useEmotion().cx;
    var stylesLayout = useStyles(getStylesLayout);
    var _d = React.useContext(InputLayoutContext), focused = _d.focused, disabled = _d.disabled, size = _d.size;
    var sizes = {
        small: parseInt(theme.inputIconSizeSmall),
        medium: parseInt(theme.inputIconSizeMedium),
        large: parseInt(theme.inputIconSizeLarge),
    };
    var gaps = {
        small: parseInt(theme.inputIconGapSmall),
        medium: parseInt(theme.inputIconGapMedium),
        large: parseInt(theme.inputIconGapLarge),
    };
    var _icon = icon instanceof Function ? icon() : icon;
    if (isElement(icon) && isKonturIcon(icon)) {
        var iconProps = icon.props;
        _icon = React.cloneElement(icon, {
            size: (_b = iconProps.size) !== null && _b !== void 0 ? _b : sizes[size],
        });
    }
    var style = {};
    if (side) {
        if (side === 'right') {
            style.marginLeft = gaps[size];
        }
        else {
            style.marginRight = gaps[size];
        }
    }
    return _icon ? (React.createElement("span", { style: style, className: cx(stylesLayout.aside(), stylesLayout.icon(theme), focused && stylesLayout.iconFocus(theme), disabled && stylesLayout.iconDisabled(theme)) }, _icon)) : null;
};
//# sourceMappingURL=InputLayoutAsideIcon.js.map