import React, { forwardRef } from "react";
import { base as sizeCSS } from "./_size/base";
import { base as toggleSizeCSS } from "./_toggleSize/base";
import { base as viewCSS } from "./_view/base";
import { base as focusedCSS } from "./_focused/base";
import { base as disabledCSS } from "./_disabled/base";
import { cx } from "../../utils";
import { StyledContent, StyledDescription, StyledInput, StyledLabel, StyledTrigger, base } from "./Switch.styles";
import { classes } from "./Switch.tokens";
export const switchRoot = (Root)=>/*#__PURE__*/ forwardRef((props, ref)=>{
        const { size, toggleSize, view, focused, outlined, disabled, labelPosition, label, description, singleLine = true, id, style, className, // singleLine,
        checked, pressed, defaultChecked, ...rest } = props;
        const exactChecked = Boolean((checked ?? pressed) !== undefined ? checked ?? pressed : defaultChecked);
        return /*#__PURE__*/ React.createElement(Root, {
            view: view,
            size: size,
            toggleSize: toggleSize,
            disabled: disabled,
            focused: focused ?? outlined,
            labelPosition: labelPosition,
            id: id,
            style: style,
            className: cx(className)
        }, /*#__PURE__*/ React.createElement(StyledContent, {
            className: cx(classes[`${labelPosition}SwitchLabelPosition`])
        }, /*#__PURE__*/ React.createElement(StyledInput, {
            ...rest,
            ref: ref,
            role: "switch",
            "aria-checked": exactChecked,
            type: "checkbox",
            checked: checked ?? pressed,
            defaultChecked: defaultChecked,
            disabled: disabled
        }), label && /*#__PURE__*/ React.createElement(StyledLabel, {
            tabIndex: -1,
            className: singleLine ? classes.singleLine : ''
        }, label), /*#__PURE__*/ React.createElement(StyledTrigger, {
            "aria-hidden": true
        })), description && /*#__PURE__*/ React.createElement(StyledDescription, null, description));
    });
export const switchConfig = {
    name: 'Switch',
    tag: 'label',
    base,
    layout: switchRoot,
    variations: {
        size: {
            css: sizeCSS
        },
        view: {
            css: viewCSS
        },
        toggleSize: {
            css: toggleSizeCSS
        },
        disabled: {
            css: disabledCSS,
            attrs: true
        },
        focused: {
            css: focusedCSS
        }
    },
    defaults: {
        size: 's',
        view: 'default'
    }
};
