@povio/ui 2.3.0-rc.9 → 2.3.1

package/dist/components/buttons/SplitButton/SplitButton.js

@@ -2,122 +2,37 @@ import { ChevronDownIcon } from "../../../assets/icons/ChevronDown.js";
 import { Button } from "../Button/Button.js";
 import { IconButton } from "../IconButton/IconButton.js";
 import { Menu } from "../../Menu/Menu.js";
-import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 //#region src/components/buttons/SplitButton/SplitButton.tsx
-var SplitButton = (t0) => {
-	const $ = c(36);
-	let className;
-	let color;
-	let isLoading;
-	let items;
-	let label;
-	let labelRight;
-	let link;
-	let props;
-	let size;
-	let variant;
-	let width;
-	if ($[0] !== t0) {
-		({variant, color, width, size, label, labelRight, link, items, className, isLoading, ...props} = t0);
-		$[0] = t0;
-		$[1] = className;
-		$[2] = color;
-		$[3] = isLoading;
-		$[4] = items;
-		$[5] = label;
-		$[6] = labelRight;
-		$[7] = link;
-		$[8] = props;
-		$[9] = size;
-		$[10] = variant;
-		$[11] = width;
-	} else {
-		className = $[1];
-		color = $[2];
-		isLoading = $[3];
-		items = $[4];
-		label = $[5];
-		labelRight = $[6];
-		link = $[7];
-		props = $[8];
-		size = $[9];
-		variant = $[10];
-		width = $[11];
-	}
-	let t1;
-	if ($[12] !== className) {
-		t1 = clsx("rounded-r-none! border-r border-solid", className);
-		$[12] = className;
-		$[13] = t1;
-	} else t1 = $[13];
-	let t2;
-	if ($[14] !== color || $[15] !== isLoading || $[16] !== label || $[17] !== link || $[18] !== props || $[19] !== size || $[20] !== t1 || $[21] !== variant || $[22] !== width) {
-		t2 = /* @__PURE__ */ jsx(Button, {
+var SplitButton = ({ variant, color, width, size, label, labelRight, link, items, className, isLoading, ...props }) => {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "group/split flex items-center",
+		"data-split": "",
+		children: [/* @__PURE__ */ jsx(Button, {
 			...props,
 			width,
 			size,
 			variant,
 			color,
 			link,
-			className: t1,
+			className: clsx("rounded-r-none! border-r border-solid", className),
 			"data-separator": "",
 			isLoading,
 			children: label
-		});
-		$[14] = color;
-		$[15] = isLoading;
-		$[16] = label;
-		$[17] = link;
-		$[18] = props;
-		$[19] = size;
-		$[20] = t1;
-		$[21] = variant;
-		$[22] = width;
-		$[23] = t2;
-	} else t2 = $[23];
-	const t3 = props.isDisabled || isLoading;
-	let t4;
-	if ($[24] !== color || $[25] !== labelRight || $[26] !== size || $[27] !== t3 || $[28] !== variant) {
-		t4 = /* @__PURE__ */ jsx(IconButton, {
-			size,
-			variant,
-			color,
-			label: labelRight,
-			icon: ChevronDownIcon,
-			className: "rounded-l-none! border-l-0!",
-			isDisabled: t3
-		});
-		$[24] = color;
-		$[25] = labelRight;
-		$[26] = size;
-		$[27] = t3;
-		$[28] = variant;
-		$[29] = t4;
-	} else t4 = $[29];
-	let t5;
-	if ($[30] !== items || $[31] !== t4) {
-		t5 = /* @__PURE__ */ jsx(Menu, {
-			trigger: t4,
+		}), /* @__PURE__ */ jsx(Menu, {
+			trigger: /* @__PURE__ */ jsx(IconButton, {
+				size,
+				variant,
+				color,
+				label: labelRight,
+				icon: ChevronDownIcon,
+				className: "rounded-l-none! border-l-0!",
+				isDisabled: props.isDisabled || isLoading
+			}),
 			items
-		});
-		$[30] = items;
-		$[31] = t4;
-		$[32] = t5;
-	} else t5 = $[32];
-	let t6;
-	if ($[33] !== t2 || $[34] !== t5) {
-		t6 = /* @__PURE__ */ jsxs("div", {
-			className: "group/split flex items-center",
-			"data-split": "",
-			children: [t2, t5]
-		});
-		$[33] = t2;
-		$[34] = t5;
-		$[35] = t6;
-	} else t6 = $[35];
-	return t6;
+		})]
+	});
 };
 //#endregion
 export { SplitButton };

package/dist/components/buttons/TextButton/TextButton.js

@@ -1,36 +1,14 @@
 import { Button } from "../Button/Button.js";
-import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/buttons/TextButton/TextButton.tsx
-var TextButton = (t0) => {
-	const $ = c(7);
-	let children;
-	let props;
-	if ($[0] !== t0) {
-		({children, ...props} = t0);
-		$[0] = t0;
-		$[1] = children;
-		$[2] = props;
-	} else {
-		children = $[1];
-		props = $[2];
-	}
-	const t1 = props.width ?? "hug";
-	let t2;
-	if ($[3] !== children || $[4] !== props || $[5] !== t1) {
-		t2 = /* @__PURE__ */ jsx(Button, {
-			...props,
-			variant: "text",
-			size: "none",
-			width: t1,
-			children
-		});
-		$[3] = children;
-		$[4] = props;
-		$[5] = t1;
-		$[6] = t2;
-	} else t2 = $[6];
-	return t2;
+var TextButton = ({ children, ...props }) => {
+	return /* @__PURE__ */ jsx(Button, {
+		...props,
+		variant: "text",
+		size: "none",
+		width: props.width ?? "hug",
+		children
+	});
 };
 //#endregion
 export { TextButton };

package/dist/components/buttons/ToggleButton/ToggleButton.js

@@ -1,34 +1,14 @@
 import { Button } from "../Button/Button.js";
-import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/buttons/ToggleButton/ToggleButton.tsx
-var ToggleButton = (t0) => {
-	const $ = c(6);
-	let children;
-	let props;
-	if ($[0] !== t0) {
-		({children, ...props} = t0);
-		$[0] = t0;
-		$[1] = children;
-		$[2] = props;
-	} else {
-		children = $[1];
-		props = $[2];
-	}
-	let t1;
-	if ($[3] !== children || $[4] !== props) {
-		t1 = /* @__PURE__ */ jsx(Button, {
-			...props,
-			toggle: true,
-			variant: "outlined",
-			color: "primary",
-			children
-		});
-		$[3] = children;
-		$[4] = props;
-		$[5] = t1;
-	} else t1 = $[5];
-	return t1;
+var ToggleButton = ({ children, ...props }) => {
+	return /* @__PURE__ */ jsx(Button, {
+		...props,
+		toggle: true,
+		variant: "outlined",
+		color: "primary",
+		children
+	});
 };
 //#endregion
 export { ToggleButton };

package/dist/components/buttons/shared/ButtonContent.js

@@ -2,94 +2,36 @@ import { UIStyle } from "../../../config/uiStyle.context.js";
 import { typography } from "../../text/Typography/typography.cva.js";
 import { buttonContentLabel } from "./buttonContent.cva.js";
 import { Loader } from "../../status/Loader/Loader.js";
-import { c } from "react/compiler-runtime";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { isValidElement } from "react";
 //#region src/components/buttons/shared/ButtonContent.tsx
-var ButtonContent = (t0) => {
-	const $ = c(21);
-	const { ref, content, isLoading, icon: Icon, iconClassName, hideText, iconPosition: t1, typography: typographyOverrides } = t0;
-	const iconPosition = t1 === void 0 ? "left" : t1;
+var ButtonContent = ({ ref, content, isLoading, icon: Icon, iconClassName, hideText, iconPosition = "left", typography: typographyOverrides }) => {
 	const typographyCva = UIStyle.useCva("typography.cva", typography);
 	let iconOrLoader = null;
-	if (isLoading) {
-		let t2;
-		if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-			t2 = /* @__PURE__ */ jsx(Loader, { className: "shrink-0" });
-			$[0] = t2;
-		} else t2 = $[0];
-		iconOrLoader = t2;
-	} else if (Icon) if (isValidElement(Icon)) iconOrLoader = Icon;
-	else {
-		let t2;
-		if ($[1] !== iconClassName) {
-			t2 = clsx("shrink-0", iconClassName);
-			$[1] = iconClassName;
-			$[2] = t2;
-		} else t2 = $[2];
-		let t3;
-		if ($[3] !== Icon || $[4] !== t2) {
-			t3 = /* @__PURE__ */ jsx(Icon, { className: t2 });
-			$[3] = Icon;
-			$[4] = t2;
-			$[5] = t3;
-		} else t3 = $[5];
-		iconOrLoader = t3;
-	}
-	let t2;
-	let t3;
-	if ($[6] !== hideText || $[7] !== iconOrLoader || $[8] !== iconPosition || $[9] !== typographyCva || $[10] !== typographyOverrides) {
-		const resolvedTypography = {
-			size: "label-2",
-			variant: "prominent-1",
-			...typographyOverrides
-		};
-		t3 = iconOrLoader && iconPosition === "left" && iconOrLoader;
-		t2 = clsx(typographyCva({
-			...resolvedTypography,
-			sizeMobile: resolvedTypography.sizeMobile ?? resolvedTypography.size
-		}), buttonContentLabel({
-			iconPosition: iconOrLoader ? iconPosition : "none",
-			hideText: !!hideText
-		}));
-		$[6] = hideText;
-		$[7] = iconOrLoader;
-		$[8] = iconPosition;
-		$[9] = typographyCva;
-		$[10] = typographyOverrides;
-		$[11] = t2;
-		$[12] = t3;
-	} else {
-		t2 = $[11];
-		t3 = $[12];
-	}
-	let t4;
-	if ($[13] !== content || $[14] !== ref || $[15] !== t2) {
-		t4 = /* @__PURE__ */ jsx("span", {
-			className: t2,
+	if (isLoading) iconOrLoader = /* @__PURE__ */ jsx(Loader, { className: "shrink-0" });
+	else if (Icon) if (isValidElement(Icon)) iconOrLoader = Icon;
+	else iconOrLoader = /* @__PURE__ */ jsx(Icon, { className: clsx("shrink-0", iconClassName) });
+	const resolvedTypography = {
+		size: "label-2",
+		variant: "prominent-1",
+		...typographyOverrides
+	};
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		iconOrLoader && iconPosition === "left" && iconOrLoader,
+		/* @__PURE__ */ jsx("span", {
+			className: clsx(typographyCva({
+				...resolvedTypography,
+				sizeMobile: resolvedTypography.sizeMobile ?? resolvedTypography.size
+			}), buttonContentLabel({
+				iconPosition: iconOrLoader ? iconPosition : "none",
+				hideText: !!hideText
+			})),
 			ref,
 			children: content
-		});
-		$[13] = content;
-		$[14] = ref;
-		$[15] = t2;
-		$[16] = t4;
-	} else t4 = $[16];
-	const t5 = iconOrLoader && iconPosition === "right" && iconOrLoader;
-	let t6;
-	if ($[17] !== t3 || $[18] !== t4 || $[19] !== t5) {
-		t6 = /* @__PURE__ */ jsxs(Fragment, { children: [
-			t3,
-			t4,
-			t5
-		] });
-		$[17] = t3;
-		$[18] = t4;
-		$[19] = t5;
-		$[20] = t6;
-	} else t6 = $[20];
-	return t6;
+		}),
+		iconOrLoader && iconPosition === "right" && iconOrLoader
+	] });
 };
 //#endregion
 export { ButtonContent };

package/dist/components/inputs/Checkbox/Checkbox.js

@@ -1,10 +1,9 @@
 import { UIStyle } from "../../../config/uiStyle.context.js";
 import { UIConfig } from "../../../config/uiConfig.context.js";
-import { checkboxContentClassName, checkboxIndicatorClass, checkboxTypography } from "./checkbox.cva.js";
+import { checkboxIndicatorClass, checkboxTypography } from "./checkbox.cva.js";
 import { FormFieldError } from "../FormField/FormFieldError.js";
 import { CheckContent } from "../shared/CheckContent.js";
 import { CheckboxCheckmark } from "./CheckboxCheckmark.js";
-import { c } from "react/compiler-runtime";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { Checkbox } from "react-aria-components";
@@ -12,189 +11,53 @@ import { mergeRefs } from "@react-aria/utils";
 import { Controller } from "react-hook-form";
 //#region src/components/inputs/Checkbox/Checkbox.tsx
 var CheckboxBase = (props) => {
-	const $ = c(38);
 	const ui = UIConfig.useConfig();
 	const checkboxTypographyMap = UIStyle.useMapper("checkbox.typography", checkboxTypography);
-	const checkboxContentClassNameMap = UIStyle.useMapper("checkbox.contentClassName", checkboxContentClassName);
-	let children;
-	let className;
-	let error;
-	let hideLabelProp;
-	let isDisabled;
-	let rest;
-	let variantProp;
-	if ($[0] !== props) {
-		({className, children, isDisabled, error, variant: variantProp, hideLabel: hideLabelProp, ...rest} = props);
-		$[0] = props;
-		$[1] = children;
-		$[2] = className;
-		$[3] = error;
-		$[4] = hideLabelProp;
-		$[5] = isDisabled;
-		$[6] = rest;
-		$[7] = variantProp;
-	} else {
-		children = $[1];
-		className = $[2];
-		error = $[3];
-		hideLabelProp = $[4];
-		isDisabled = $[5];
-		rest = $[6];
-		variantProp = $[7];
-	}
-	const variant = variantProp ?? ui.checkbox.variant;
-	const hideLabel = hideLabelProp ?? ui.input.hideLabel;
-	let t0;
-	if ($[8] !== error || $[9] !== isDisabled) {
-		t0 = {
-			error,
-			isDisabled
-		};
-		$[8] = error;
-		$[9] = isDisabled;
-		$[10] = t0;
-	} else t0 = $[10];
-	const formFieldErrorProps = t0;
-	const t1 = !!error;
-	const t2 = error || void 0;
-	const t3 = props.isDirty || void 0;
-	const t4 = props.isRequired || void 0;
-	let t5;
-	if ($[11] !== className) {
-		t5 = clsx("relative", checkboxIndicatorClass, className);
-		$[11] = className;
-		$[12] = t5;
-	} else t5 = $[12];
-	let t6;
-	if ($[13] !== rest || $[14] !== variant) {
-		t6 = /* @__PURE__ */ jsx(CheckboxCheckmark, {
+	const { className, children, isDisabled, error, variant = ui.checkbox.variant, hideLabel = ui.input.hideLabel, ...rest } = props;
+	const formFieldErrorProps = {
+		error,
+		isDisabled
+	};
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs(Checkbox, {
+		...rest,
+		isDisabled,
+		isInvalid: !!error,
+		"aria-errormessage": error || void 0,
+		"data-is-dirty": props.isDirty || void 0,
+		"data-is-required": props.isRequired || void 0,
+		className: clsx("relative", checkboxIndicatorClass, className),
+		children: [/* @__PURE__ */ jsx(CheckboxCheckmark, {
 			variant,
 			...rest
-		});
-		$[13] = rest;
-		$[14] = variant;
-		$[15] = t6;
-	} else t6 = $[15];
-	let t7;
-	if ($[16] !== checkboxContentClassNameMap || $[17] !== checkboxTypographyMap || $[18] !== children || $[19] !== hideLabel || $[20] !== rest || $[21] !== variant) {
-		t7 = !hideLabel && /* @__PURE__ */ jsx(CheckContent, {
+		}), !hideLabel && /* @__PURE__ */ jsx(CheckContent, {
 			typography: checkboxTypographyMap({
 				variant,
 				...rest
 			}),
-			contentClassName: checkboxContentClassNameMap({
-				variant,
-				...rest
-			}),
 			children
-		});
-		$[16] = checkboxContentClassNameMap;
-		$[17] = checkboxTypographyMap;
-		$[18] = children;
-		$[19] = hideLabel;
-		$[20] = rest;
-		$[21] = variant;
-		$[22] = t7;
-	} else t7 = $[22];
-	let t8;
-	if ($[23] !== isDisabled || $[24] !== rest || $[25] !== t1 || $[26] !== t2 || $[27] !== t3 || $[28] !== t4 || $[29] !== t5 || $[30] !== t6 || $[31] !== t7) {
-		t8 = /* @__PURE__ */ jsxs(Checkbox, {
-			...rest,
-			isDisabled,
-			isInvalid: t1,
-			"aria-errormessage": t2,
-			"data-is-dirty": t3,
-			"data-is-required": t4,
-			className: t5,
-			children: [t6, t7]
-		});
-		$[23] = isDisabled;
-		$[24] = rest;
-		$[25] = t1;
-		$[26] = t2;
-		$[27] = t3;
-		$[28] = t4;
-		$[29] = t5;
-		$[30] = t6;
-		$[31] = t7;
-		$[32] = t8;
-	} else t8 = $[32];
-	let t9;
-	if ($[33] !== formFieldErrorProps) {
-		t9 = /* @__PURE__ */ jsx(FormFieldError, { ...formFieldErrorProps });
-		$[33] = formFieldErrorProps;
-		$[34] = t9;
-	} else t9 = $[34];
-	let t10;
-	if ($[35] !== t8 || $[36] !== t9) {
-		t10 = /* @__PURE__ */ jsxs(Fragment, { children: [t8, t9] });
-		$[35] = t8;
-		$[36] = t9;
-		$[37] = t10;
-	} else t10 = $[37];
-	return t10;
+		})]
+	}), /* @__PURE__ */ jsx(FormFieldError, { ...formFieldErrorProps })] });
 };
 var Checkbox$1 = (props) => {
-	const $ = c(15);
 	if ("formControl" in props && props.formControl) {
-		let formControl;
-		let innerProps;
-		let ref;
-		if ($[0] !== props) {
-			({formControl, ref, ...innerProps} = props);
-			$[0] = props;
-			$[1] = formControl;
-			$[2] = innerProps;
-			$[3] = ref;
-		} else {
-			formControl = $[1];
-			innerProps = $[2];
-			ref = $[3];
-		}
-		let t0;
-		if ($[4] !== innerProps || $[5] !== props.error || $[6] !== props.isDisabled || $[7] !== ref) {
-			t0 = (t1) => {
-				const { field, fieldState: t2 } = t1;
-				const { error, isDirty } = t2;
-				return /* @__PURE__ */ jsx(CheckboxBase, {
-					...innerProps,
-					ref: mergeRefs(ref, field.ref),
-					isSelected: field.value,
-					onChange: field.onChange,
-					onBlur: field.onBlur,
-					name: field.name,
-					isDirty,
-					isDisabled: field.disabled || props.isDisabled,
-					error: props.error ?? error?.message
-				});
-			};
-			$[4] = innerProps;
-			$[5] = props.error;
-			$[6] = props.isDisabled;
-			$[7] = ref;
-			$[8] = t0;
-		} else t0 = $[8];
-		let t1;
-		if ($[9] !== formControl.control || $[10] !== formControl.name || $[11] !== t0) {
-			t1 = /* @__PURE__ */ jsx(Controller, {
-				control: formControl.control,
-				name: formControl.name,
-				render: t0
-			});
-			$[9] = formControl.control;
-			$[10] = formControl.name;
-			$[11] = t0;
-			$[12] = t1;
-		} else t1 = $[12];
-		return t1;
+		const { formControl, ref, ...innerProps } = props;
+		return /* @__PURE__ */ jsx(Controller, {
+			control: formControl.control,
+			name: formControl.name,
+			render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(CheckboxBase, {
+				...innerProps,
+				ref: mergeRefs(ref, field.ref),
+				isSelected: field.value,
+				onChange: field.onChange,
+				onBlur: field.onBlur,
+				name: field.name,
+				isDirty,
+				isDisabled: field.disabled || props.isDisabled,
+				error: props.error ?? error?.message
+			})
+		});
 	}
-	let t0;
-	if ($[13] !== props) {
-		t0 = /* @__PURE__ */ jsx(CheckboxBase, { ...props });
-		$[13] = props;
-		$[14] = t0;
-	} else t0 = $[14];
-	return t0;
+	return /* @__PURE__ */ jsx(CheckboxBase, { ...props });
 };
 //#endregion
 export { Checkbox$1 as Checkbox };

package/dist/components/inputs/Checkbox/CheckboxCheckmark.js

@@ -2,38 +2,24 @@ import { CheckboxCheckmarkIcon } from "../../../assets/icons/CheckboxCheckmark.j
 import { CheckboxIndeterminateIcon } from "../../../assets/icons/CheckboxIndeterminate.js";
 import { UIStyle } from "../../../config/uiStyle.context.js";
 import { checkbox, checkboxIcon } from "./checkbox.cva.js";
-import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/inputs/Checkbox/CheckboxCheckmark.tsx
-var CheckboxCheckmark = (t0) => {
-	const $ = c(3);
-	const { variant, className, selectedIcon: t1, indeterminateIcon: t2, ...props } = t0;
-	const SelectedIcon = t1 === void 0 ? CheckboxCheckmarkIcon : t1;
-	const IndeterminateIcon = t2 === void 0 ? CheckboxIndeterminateIcon : t2;
+var CheckboxCheckmark = ({ variant, className, selectedIcon: SelectedIcon = CheckboxCheckmarkIcon, indeterminateIcon: IndeterminateIcon = CheckboxIndeterminateIcon, ...props }) => {
 	const checkboxCva = UIStyle.useCva("checkbox.cva", checkbox);
 	const checkboxIconCva = UIStyle.useCva("checkbox.iconCva", checkboxIcon);
-	const t3 = checkboxCva({
-		variant,
-		...props,
-		className
-	});
-	const t4 = checkboxIconCva({
-		...props,
-		iconVariant: "indeterminate"
-	});
-	let t5;
-	if ($[0] !== IndeterminateIcon || $[1] !== t4) {
-		t5 = /* @__PURE__ */ jsx(IndeterminateIcon, { className: t4 });
-		$[0] = IndeterminateIcon;
-		$[1] = t4;
-		$[2] = t5;
-	} else t5 = $[2];
 	return /* @__PURE__ */ jsxs("div", {
-		className: t3,
+		className: checkboxCva({
+			variant,
+			...props,
+			className
+		}),
 		children: [/* @__PURE__ */ jsx(SelectedIcon, { className: checkboxIconCva({
 			...props,
 			iconVariant: "selected"
-		}) }), t5]
+		}) }), /* @__PURE__ */ jsx(IndeterminateIcon, { className: checkboxIconCva({
+			...props,
+			iconVariant: "indeterminate"
+		}) })]
 	});
 };
 //#endregion

package/dist/components/inputs/Checkbox/checkbox.cva.d.ts

@@ -9,9 +9,6 @@ export declare const checkboxIndicatorClass = "group flex items-center gap-2";
 export declare const checkboxTypography: (props: {
     variant?: "default" | null | undefined;
 }) => TypographyVariantProps | undefined;
-export declare const checkboxContentClassName: (props: {
-    variant?: "default" | null | undefined;
-}) => string | undefined;
 export declare const checkboxIcon: (props?: ({
     iconVariant?: "selected" | "indeterminate" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/components/inputs/Checkbox/checkbox.cva.js

@@ -39,7 +39,6 @@ var checkboxTypography = compoundMapper({ default: {
 	sizeMobile: "label-1",
 	variant: "default"
 } });
-var checkboxContentClassName = compoundMapper({ default: "text-text-default-2" });
 var checkboxIcon = cva(["absolute hidden size-3"], {
 	variants: { iconVariant: {
 		selected: ["group-selected:block"],
@@ -48,4 +47,4 @@ var checkboxIcon = cva(["absolute hidden size-3"], {
 	defaultVariants: { iconVariant: "selected" }
 });
 //#endregion
-export { checkbox, checkboxContentClassName, checkboxIcon, checkboxIndicatorClass, checkboxTypography };
+export { checkbox, checkboxIcon, checkboxIndicatorClass, checkboxTypography };