@intility/bifrost-react
Version:
React library for Intility's design system, Bifrost.
209 lines • 4.91 kB
JavaScript
import { c as _c } from "react-compiler-runtime";
import { forwardRef } from "react";
import classnames from "classnames";
import CheckboxIcon from "../common/CheckboxIcon.internal.js";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/**
* Checkbox, radio button, or a switch toggle
*
* @see https://bifrost.intility.com/react/checkbox
*
* @example
* <Checkbox label="Basic checkbox" />
*
* @example
* <Checkbox
* label="Controlled state"
* checked={selected}
* onChange={() => setSelected(!selected)}
* />
*/
const Checkbox = /*#__PURE__*/forwardRef((t0, ref) => {
const $ = _c(49);
let align;
let className;
let inputClassName;
let inputStyle;
let label;
let labelProps;
let props;
let style;
let t1;
let t2;
let t3;
let t4;
let t5;
let t6;
if ($[0] !== t0) {
({
label,
indeterminate: t1,
hideLabel: t2,
type: t3,
button: t4,
small: t5,
className,
align,
state: t6,
style,
inputClassName,
inputStyle,
labelProps,
...props
} = t0);
$[0] = t0;
$[1] = align;
$[2] = className;
$[3] = inputClassName;
$[4] = inputStyle;
$[5] = label;
$[6] = labelProps;
$[7] = props;
$[8] = style;
$[9] = t1;
$[10] = t2;
$[11] = t3;
$[12] = t4;
$[13] = t5;
$[14] = t6;
} else {
align = $[1];
className = $[2];
inputClassName = $[3];
inputStyle = $[4];
label = $[5];
labelProps = $[6];
props = $[7];
style = $[8];
t1 = $[9];
t2 = $[10];
t3 = $[11];
t4 = $[12];
t5 = $[13];
t6 = $[14];
}
const indeterminate = t1 === undefined ? false : t1;
const hideLabel = t2 === undefined ? false : t2;
const type = t3 === undefined ? "checkbox" : t3;
const button = t4 === undefined ? false : t4;
const small = t5 === undefined ? false : t5;
const state = t6 === undefined ? "default" : t6;
if (!align) {
align = type === "switch" ? "right" : "left";
}
const t7 = props.id;
const t8 = labelProps;
const t9 = labelProps?.className;
const t10 = type === "switch";
const t11 = align === "right";
const t12 = state === "alert";
const t13 = state === "inherit";
const t14 = state === "inactive";
let t15;
if ($[15] !== button || $[16] !== className || $[17] !== hideLabel || $[18] !== small || $[19] !== t10 || $[20] !== t11 || $[21] !== t12 || $[22] !== t13 || $[23] !== t14 || $[24] !== t9) {
t15 = classnames("bf-checkbox", "bf-open-sans", className, t9, {
"bf-switch-wrapper": t10,
"bf-checkbox-hidelabel": hideLabel,
"bf-checkbox-button": button,
"bf-checkbox-small": small,
"bf-checkbox-right": t11,
"bf-checkbox-alert": t12,
"bf-checkbox-inherit": t13,
"bf-checkbox-inactive": t14
});
$[15] = button;
$[16] = className;
$[17] = hideLabel;
$[18] = small;
$[19] = t10;
$[20] = t11;
$[21] = t12;
$[22] = t13;
$[23] = t14;
$[24] = t9;
$[25] = t15;
} else {
t15 = $[25];
}
const t16 = labelProps?.style;
let t17;
if ($[26] !== style || $[27] !== t16) {
t17 = {
...style,
...t16
};
$[26] = style;
$[27] = t16;
$[28] = t17;
} else {
t17 = $[28];
}
const t18 = type === "radio" ? "radio" : "checkbox";
const t19 = state === "inactive" || undefined;
let t20;
if ($[29] !== inputClassName || $[30] !== inputStyle || $[31] !== props || $[32] !== ref || $[33] !== t18 || $[34] !== t19) {
t20 = /*#__PURE__*/_jsx("input", {
type: t18,
"aria-disabled": t19,
...props,
ref: ref,
className: inputClassName,
style: inputStyle
});
$[29] = inputClassName;
$[30] = inputStyle;
$[31] = props;
$[32] = ref;
$[33] = t18;
$[34] = t19;
$[35] = t20;
} else {
t20 = $[35];
}
let t21;
if ($[36] !== indeterminate || $[37] !== type) {
t21 = /*#__PURE__*/_jsx(CheckboxIcon, {
type: type,
indeterminate: indeterminate
});
$[36] = indeterminate;
$[37] = type;
$[38] = t21;
} else {
t21 = $[38];
}
let t22;
if ($[39] !== label) {
t22 = /*#__PURE__*/_jsx("span", {
className: "bf-checkbox-text",
children: label
});
$[39] = label;
$[40] = t22;
} else {
t22 = $[40];
}
let t23;
if ($[41] !== labelProps || $[42] !== props.id || $[43] !== t15 || $[44] !== t17 || $[45] !== t20 || $[46] !== t21 || $[47] !== t22) {
t23 = /*#__PURE__*/_jsxs("label", {
htmlFor: t7,
...t8,
className: t15,
style: t17,
children: [t20, t21, t22]
});
$[41] = labelProps;
$[42] = props.id;
$[43] = t15;
$[44] = t17;
$[45] = t20;
$[46] = t21;
$[47] = t22;
$[48] = t23;
} else {
t23 = $[48];
}
return t23;
});
Checkbox.displayName = "Checkbox";
export default Checkbox;