@ozen-ui/kit
Version:
React component library
27 lines (26 loc) • 2.3 kB
JavaScript
import { __assign, __rest } from "tslib";
import React, { forwardRef } from 'react';
import { useThemeProps } from '../../hooks/useThemeProps';
import { cn } from '../../utils/classname';
import { FormControlCarcass } from '../FormControlCarcass';
import { TOGGLE_DEFAULT_MIRRORED, TOGGLE_DEFAULT_ALIGN, TOGGLE_DEFAULT_DISABLED, TOGGLE_DEFAULT_SIZE, TOGGLE_DEFAULT_VARIANT, } from './constants';
import './Toggle.css';
export var cnToggle = cn('ToggleNext');
export var Toggle = forwardRef(function (inProps, ref) {
var props = useThemeProps({
props: inProps,
name: 'ToggleNext',
});
var _a = props.align, align = _a === void 0 ? TOGGLE_DEFAULT_ALIGN : _a, _b = props.mirrored, mirrored = _b === void 0 ? TOGGLE_DEFAULT_MIRRORED : _b, _c = props.size, size = _c === void 0 ? TOGGLE_DEFAULT_SIZE : _c, _d = props.variant, variant = _d === void 0 ? TOGGLE_DEFAULT_VARIANT : _d, className = props.className, label = props.label, carcassProps = props.carcassProps, hintProps = props.hintProps, renderAfter = props.renderAfter, renderAfterProps = props.renderAfterProps, _e = props.disabled, disabled = _e === void 0 ? TOGGLE_DEFAULT_DISABLED : _e, hint = props.hint, checked = props.checked, inputRef = props.inputRef, dataTestid = props.dataTestid, other = __rest(props, ["align", "mirrored", "size", "variant", "className", "label", "carcassProps", "hintProps", "renderAfter", "renderAfterProps", "disabled", "hint", "checked", "inputRef", "dataTestid"]);
return (React.createElement(FormControlCarcass, __assign({}, carcassProps, { ref: ref, size: size, align: align, mirrored: !mirrored, hint: hint, label: label, hintProps: hintProps, disabled: disabled, className: cnToggle({
disabled: disabled,
mirrored: mirrored,
variant: variant,
size: size,
}, [className]), variant: variant, controlProps: {
className: cnToggle('Box'),
}, renderAfter: renderAfter, renderAfterProps: renderAfterProps, "data-testid": dataTestid }),
React.createElement("input", __assign({ type: "checkbox", className: cnToggle('Input'), disabled: disabled, checked: checked }, other, { ref: inputRef })),
React.createElement("span", { className: cnToggle('Switch') })));
});
Toggle.displayName = 'Toggle';