@evolve.ui/core-components 1.0.0

package/CheckCircle-BjBbSga6.cjs

@@ -0,0 +1,49 @@
+const require_rolldown_runtime = require("./rolldown-runtime-D6vf50IK.cjs");
+const require_Icons_IconBase = require("./Icons/IconBase.cjs");
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/Icons/generatedIcons/CheckCircle.tsx
+const weights = {
+	bold: react.createElement("svg", {
+		fill: "currentColor",
+		viewBox: "0 0 256 256",
+		xmlns: "http://www.w3.org/2000/svg"
+	}, react.createElement("path", { d: "M176.49,95.51a12,12,0,0,1,0,17l-56,56a12,12,0,0,1-17,0l-24-24a12,12,0,1,1,17-17L112,143l47.51-47.52A12,12,0,0,1,176.49,95.51ZM236,128A108,108,0,1,1,128,20,108.12,108.12,0,0,1,236,128Zm-24,0a84,84,0,1,0-84,84A84.09,84.09,0,0,0,212,128Z" })),
+	duotone: react.createElement("svg", {
+		fill: "currentColor",
+		viewBox: "0 0 256 256",
+		xmlns: "http://www.w3.org/2000/svg"
+	}, react.createElement("path", {
+		d: "M224,128a96,96,0,1,1-96-96A96,96,0,0,1,224,128Z",
+		opacity: "0.2"
+	}), react.createElement("path", { d: "M173.66,98.34a8,8,0,0,1,0,11.32l-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35A8,8,0,0,1,173.66,98.34ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z" })),
+	fill: react.createElement("svg", {
+		fill: "currentColor",
+		viewBox: "0 0 256 256",
+		xmlns: "http://www.w3.org/2000/svg"
+	}, react.createElement("path", { d: "M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm45.66,85.66-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35a8,8,0,0,1,11.32,11.32Z" })),
+	regular: react.createElement("svg", {
+		fill: "currentColor",
+		viewBox: "0 0 256 256",
+		xmlns: "http://www.w3.org/2000/svg"
+	}, react.createElement("path", { d: "M173.66,98.34a8,8,0,0,1,0,11.32l-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35A8,8,0,0,1,173.66,98.34ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z" }))
+};
+const CheckCircle = react.forwardRef((props, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Icons_IconBase.IconBase, {
+		displayName: "CheckCircle",
+		ref,
+		...props,
+		weights
+	});
+});
+CheckCircle.displayName = "CheckCircle";
+//#endregion
+Object.defineProperty(exports, "CheckCircle", {
+	enumerable: true,
+	get: function() {
+		return CheckCircle;
+	}
+});
+
+//# sourceMappingURL=CheckCircle-BjBbSga6.cjs.map

package/CheckCircle-BjBbSga6.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckCircle-BjBbSga6.cjs","names":["React","IconBase"],"sources":["../src/Icons/generatedIcons/CheckCircle.tsx"],"sourcesContent":["// Code generated by copy-phosphor-icons.ts. DO NOT EDIT.\nimport { IconBase, IconProps } from '../IconBase';\nimport * as React from 'react';\n\nconst weights = {\n    bold: React.createElement(\n        'svg',\n        { fill: 'currentColor', viewBox: '0 0 256 256', xmlns: 'http://www.w3.org/2000/svg' },\n        React.createElement('path', {\n            d: 'M176.49,95.51a12,12,0,0,1,0,17l-56,56a12,12,0,0,1-17,0l-24-24a12,12,0,1,1,17-17L112,143l47.51-47.52A12,12,0,0,1,176.49,95.51ZM236,128A108,108,0,1,1,128,20,108.12,108.12,0,0,1,236,128Zm-24,0a84,84,0,1,0-84,84A84.09,84.09,0,0,0,212,128Z',\n        })\n    ),\n    duotone: React.createElement(\n        'svg',\n        { fill: 'currentColor', viewBox: '0 0 256 256', xmlns: 'http://www.w3.org/2000/svg' },\n        React.createElement('path', { d: 'M224,128a96,96,0,1,1-96-96A96,96,0,0,1,224,128Z', opacity: '0.2' }),\n        React.createElement('path', {\n            d: 'M173.66,98.34a8,8,0,0,1,0,11.32l-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35A8,8,0,0,1,173.66,98.34ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z',\n        })\n    ),\n    fill: React.createElement(\n        'svg',\n        { fill: 'currentColor', viewBox: '0 0 256 256', xmlns: 'http://www.w3.org/2000/svg' },\n        React.createElement('path', {\n            d: 'M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm45.66,85.66-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35a8,8,0,0,1,11.32,11.32Z',\n        })\n    ),\n    regular: React.createElement(\n        'svg',\n        { fill: 'currentColor', viewBox: '0 0 256 256', xmlns: 'http://www.w3.org/2000/svg' },\n        React.createElement('path', {\n            d: 'M173.66,98.34a8,8,0,0,1,0,11.32l-56,56a8,8,0,0,1-11.32,0l-24-24a8,8,0,0,1,11.32-11.32L112,148.69l50.34-50.35A8,8,0,0,1,173.66,98.34ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z',\n        })\n    ),\n};\n\nexport const CheckCircle = React.forwardRef<SVGSVGElement, IconProps>((props, ref) => {\n    return (\n        <IconBase\n            displayName=\"CheckCircle\"\n            ref={ref}\n            {...props}\n            weights={weights}\n        />\n    );\n});\n\nCheckCircle.displayName = 'CheckCircle';\n"],"mappings":";;;;;;AAIA,MAAM,UAAU;CACZ,MAAMA,MAAM,cACR,OACA;EAAE,MAAM;EAAgB,SAAS;EAAe,OAAO;CAA6B,GACpFA,MAAM,cAAc,QAAQ,EACxB,GAAG,6OACP,CAAC,CACL;CACA,SAASA,MAAM,cACX,OACA;EAAE,MAAM;EAAgB,SAAS;EAAe,OAAO;CAA6B,GACpFA,MAAM,cAAc,QAAQ;EAAE,GAAG;EAAmD,SAAS;CAAM,CAAC,GACpGA,MAAM,cAAc,QAAQ,EACxB,GAAG,kPACP,CAAC,CACL;CACA,MAAMA,MAAM,cACR,OACA;EAAE,MAAM;EAAgB,SAAS;EAAe,OAAO;CAA6B,GACpFA,MAAM,cAAc,QAAQ,EACxB,GAAG,2KACP,CAAC,CACL;CACA,SAASA,MAAM,cACX,OACA;EAAE,MAAM;EAAgB,SAAS;EAAe,OAAO;CAA6B,GACpFA,MAAM,cAAc,QAAQ,EACxB,GAAG,kPACP,CAAC,CACL;AACJ;AAEA,MAAa,cAAcA,MAAM,YAAsC,OAAO,QAAQ;CAClF,OACI,iBAAA,GAAA,kBAAA,IAAA,CAACC,uBAAAA,UAAD;EACI,aAAY;EACP;EACL,GAAI;EACK;CACZ,CAAA;AAET,CAAC;AAED,YAAY,cAAc"}

package/Checkbox.cjs

@@ -0,0 +1,13 @@
+'use client';
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
+const require_ChoiceListItem = require("./ChoiceListItem-D_74Zcpd.cjs");
+exports.Checkbox = require_ChoiceListItem.Checkbox;
+exports.CheckboxGroup = require_ChoiceListItem.CheckboxGroup;
+exports.CheckboxOption = require_ChoiceListItem.CheckboxOption;
+exports.ChoiceListItemLabel = require_ChoiceListItem.ChoiceListItemLabel;
+exports.Radio = require_ChoiceListItem.Radio;
+exports.RadioGroup = require_ChoiceListItem.RadioGroup;
+exports.RadioOption = require_ChoiceListItem.RadioOption;

package/Checkbox.d.cts

@@ -0,0 +1,2 @@
+import { a as RadioGroup, c as GroupProps, i as Radio, n as CheckboxGroup, o as RadioOption, r as CheckboxOption, s as ChoiceListItemLabel, t as Checkbox } from "./index-BzN9RaXe.cjs";
+export { Checkbox, CheckboxGroup, CheckboxOption, ChoiceListItemLabel, type GroupProps, Radio, RadioGroup, RadioOption };

package/Checkbox.d.mts

@@ -0,0 +1,2 @@
+import { a as RadioGroup, c as GroupProps, i as Radio, n as CheckboxGroup, o as RadioOption, r as CheckboxOption, s as ChoiceListItemLabel, t as Checkbox } from "./index-Bu7c6X7O.mjs";
+export { Checkbox, CheckboxGroup, CheckboxOption, ChoiceListItemLabel, type GroupProps, Radio, RadioGroup, RadioOption };

package/Checkbox.mjs

@@ -0,0 +1,3 @@
+'use client';
+import { a as RadioGroup, i as Radio, n as CheckboxGroup, o as RadioOption, r as CheckboxOption, s as ChoiceListItemLabel, t as Checkbox } from "./ChoiceListItem-BqZ3bIj9.mjs";
+export { Checkbox, CheckboxGroup, CheckboxOption, ChoiceListItemLabel, Radio, RadioGroup, RadioOption };

package/Chip-UMJoX3ST.d.cts

@@ -0,0 +1,38 @@
+import { n as ChipProps } from "./chipTypes-Bi0ZROty.cjs";
+
+//#region src/Chips/Chip.d.ts
+/**
+ * Chip component that can be used for filters, suggestions, or input selections
+ * see Storybook for design-approved implementation examples
+ * @param children - Content to display inside the chip
+ * @param className - Additional CSS classes to apply
+ * @param disabled - Whether the chip is disabled
+ * @param filterCount - Number to display for filter count (only used with style="allFilters")
+ * @param onClick - Click handler for the chip
+ * @param onClose - Handler for when close button is clicked
+ * @param selected - Whether the chip is in selected state
+ * @param size - Size of the chip: "xs" | "md" (default: "md") - Note: x-small size is only used for input chips
+ * @param style - Visual style: "suggestion" | "input" | "singleFilter" | "allFilters" | "selectable" (default: "suggestion")
+ */
+declare const Chip: {
+  ({
+    "aria-haspopup": ariaHasPopup,
+    "aria-label": ariaLabel,
+    as: Component,
+    children,
+    className,
+    disabled,
+    filterCount,
+    onClick,
+    onClose,
+    selected,
+    size,
+    style,
+    value,
+    ...props
+  }: ChipProps): import("react/jsx-runtime").JSX.Element;
+  displayName: string;
+};
+//#endregion
+export { Chip as t };
+//# sourceMappingURL=Chip-UMJoX3ST.d.cts.map

package/Chip-UMJoX3ST.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip-UMJoX3ST.d.cts","names":[],"sources":["../src/Chips/Chip.tsx"],"mappings":";;;;;AAoBA;;;;;;;;;;;cAAa,IAAA;EAAA;IAAA;;;;;;;;;;;;;;KAeV,SAAA,+BAAS,GAAA,CAAA,OAAA"}

package/Chip-giQtR8GC.d.mts

@@ -0,0 +1,38 @@
+import { n as ChipProps } from "./chipTypes-Bi0ZROty.mjs";
+
+//#region src/Chips/Chip.d.ts
+/**
+ * Chip component that can be used for filters, suggestions, or input selections
+ * see Storybook for design-approved implementation examples
+ * @param children - Content to display inside the chip
+ * @param className - Additional CSS classes to apply
+ * @param disabled - Whether the chip is disabled
+ * @param filterCount - Number to display for filter count (only used with style="allFilters")
+ * @param onClick - Click handler for the chip
+ * @param onClose - Handler for when close button is clicked
+ * @param selected - Whether the chip is in selected state
+ * @param size - Size of the chip: "xs" | "md" (default: "md") - Note: x-small size is only used for input chips
+ * @param style - Visual style: "suggestion" | "input" | "singleFilter" | "allFilters" | "selectable" (default: "suggestion")
+ */
+declare const Chip: {
+  ({
+    "aria-haspopup": ariaHasPopup,
+    "aria-label": ariaLabel,
+    as: Component,
+    children,
+    className,
+    disabled,
+    filterCount,
+    onClick,
+    onClose,
+    selected,
+    size,
+    style,
+    value,
+    ...props
+  }: ChipProps): import("react/jsx-runtime").JSX.Element;
+  displayName: string;
+};
+//#endregion
+export { Chip as t };
+//# sourceMappingURL=Chip-giQtR8GC.d.mts.map

package/Chip-giQtR8GC.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip-giQtR8GC.d.mts","names":[],"sources":["../src/Chips/Chip.tsx"],"mappings":";;;;;AAoBA;;;;;;;;;;;cAAa,IAAA;EAAA;IAAA;;;;;;;;;;;;;;KAeV,SAAA,+BAAS,GAAA,CAAA,OAAA"}

package/ChipGroup-DIyCVKZm.d.cts

@@ -0,0 +1,24 @@
+import { t as ChipGroupProps } from "./chipTypes-Bi0ZROty.cjs";
+
+//#region src/Chips/ChipGroup.d.ts
+/**
+ * ChipGroup component that can be used for filters, suggestions, or input selections
+ * see Storybook for design-approved implementation examples
+ * @param children - Content to display inside the chip
+ * @param chipType - Type of the chip: "link" | "radio" | "checkbox"
+ * @param className - Additional CSS classes to apply
+ * @param data-testid - Test ID for the chip group
+ * @param name - Name for the chip group
+ * @param onChange - Change handler for the chip group
+ */
+declare const ChipGroup: ({
+  children,
+  chipType,
+  className,
+  "data-testid": testId,
+  name,
+  onChange: propOnChange
+}: ChipGroupProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { ChipGroup as t };
+//# sourceMappingURL=ChipGroup-DIyCVKZm.d.cts.map

package/ChipGroup-DIyCVKZm.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipGroup-DIyCVKZm.d.cts","names":[],"sources":["../src/Chips/ChipGroup.tsx"],"mappings":";;;;;AAiBA;;;;;;;;cAAa,SAAA;EAAa,QAAA;EAAA,QAAA;EAAA,SAAA;EAAA,eAAA,MAAA;EAAA,IAAA;EAAA,QAAA,EAAA;AAAA,GAOvB,cAAA,iCAAc,GAAA,CAAA,OAAA"}

package/ChipGroup-VGpv5cHt.d.mts

@@ -0,0 +1,24 @@
+import { t as ChipGroupProps } from "./chipTypes-Bi0ZROty.mjs";
+
+//#region src/Chips/ChipGroup.d.ts
+/**
+ * ChipGroup component that can be used for filters, suggestions, or input selections
+ * see Storybook for design-approved implementation examples
+ * @param children - Content to display inside the chip
+ * @param chipType - Type of the chip: "link" | "radio" | "checkbox"
+ * @param className - Additional CSS classes to apply
+ * @param data-testid - Test ID for the chip group
+ * @param name - Name for the chip group
+ * @param onChange - Change handler for the chip group
+ */
+declare const ChipGroup: ({
+  children,
+  chipType,
+  className,
+  "data-testid": testId,
+  name,
+  onChange: propOnChange
+}: ChipGroupProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { ChipGroup as t };
+//# sourceMappingURL=ChipGroup-VGpv5cHt.d.mts.map

package/ChipGroup-VGpv5cHt.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipGroup-VGpv5cHt.d.mts","names":[],"sources":["../src/Chips/ChipGroup.tsx"],"mappings":";;;;;AAiBA;;;;;;;;cAAa,SAAA;EAAa,QAAA;EAAA,QAAA;EAAA,SAAA;EAAA,eAAA,MAAA;EAAA,IAAA;EAAA,QAAA,EAAA;AAAA,GAOvB,cAAA,iCAAc,GAAA,CAAA,OAAA"}

package/ChoiceListItem-BqZ3bIj9.mjs

@@ -0,0 +1,168 @@
+import { BodyPrimary, BodySecondary } from "./Typography/Text.mjs";
+import { r as getMixinClasses } from "./mixins-CoXneD1m.mjs";
+import { cn } from "@evolve.ui/theme-system";
+import { forwardRef, useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/ChoiceListItem/common.tsx
+const ChoiceListItemIcon = forwardRef(({ className, ...rest }, ref) => /* @__PURE__ */ jsx("svg", {
+	className: cn("border border-current bg-background-primary text-icon-secondary", className),
+	ref,
+	...rest
+}));
+ChoiceListItemIcon.displayName = "ChoiceListItemIcon";
+const ChoiceListItemLabel = ({ as: _as, children, className }) => /* @__PURE__ */ jsx("label", {
+	className: cn("grid cursor-pointer grid-cols-[24px_10px_1fr]", "cursor-pointer", "[&>input:focus-visible~svg]:outline [&>input:focus-visible~svg]:outline-4 [&>input:focus-visible~svg]:outline-offset-1 [&>input:focus-visible~svg]:outline-focus-primary", "[&>input:checked~svg]:text-icon-secondary [&>input[type=\"checkbox\"]:indeterminate~svg]:text-icon-secondary", "[&>input:hover~svg]:bg-background-hover [&>input:hover~svg]:text-icon-hover", "[&>input:disabled~span]:text-text-disabled", "[&>input:disabled~svg]:cursor-not-allowed [&>input:disabled~svg]:bg-background-disabled [&>input:disabled~svg]:text-icon-disabled", className),
+	style: { gridTemplateAreas: "'input . label' '. . description'" },
+	children
+});
+const ChoiceListItemGroup = forwardRef(({ $gridLocation, $lineClamp, $margin, $marginBottom, $marginLeft, $marginRight, $marginTop, $padding, $paddingBottom, $paddingLeft, $paddingRight, $paddingTop, children, className, id, label, ...rest }, ref) => {
+	return /* @__PURE__ */ jsxs("fieldset", {
+		className: cn("m-0 flex flex-col gap-y-xs border-0 p-0 text-[inherit] xsMax:gap-y-sm", getMixinClasses({
+			$gridLocation,
+			$lineClamp,
+			$margin,
+			$marginBottom,
+			$marginLeft,
+			$marginRight,
+			$marginTop,
+			$padding,
+			$paddingBottom,
+			$paddingLeft,
+			$paddingRight,
+			$paddingTop
+		}), className),
+		id,
+		ref,
+		...rest,
+		children: [Boolean(label) && /* @__PURE__ */ jsx("legend", {
+			className: "hui-text-label-mini pb-xs",
+			children: label
+		}), children]
+	});
+});
+ChoiceListItemGroup.displayName = "ChoiceListItemGroup";
+//#endregion
+//#region src/ChoiceListItem/choiceListItem.tsx
+const ChoiceListItem = forwardRef(({ $gridLocation, $lineClamp, $margin, $marginBottom, $marginLeft, $marginRight, $marginTop, $padding, $paddingBottom, $paddingLeft, $paddingRight, $paddingTop, children, className, description: descriptionText, labelSize = "primary", type, visual, ...rest }, ref) => {
+	const mixinClasses = getMixinClasses({
+		$gridLocation,
+		$lineClamp,
+		$margin,
+		$marginBottom,
+		$marginLeft,
+		$marginRight,
+		$marginTop,
+		$padding,
+		$paddingBottom,
+		$paddingLeft,
+		$paddingRight,
+		$paddingTop
+	});
+	const description = useMemo(() => descriptionText ? /* @__PURE__ */ jsx(BodySecondary, {
+		className: "grid-area-[description]",
+		color: "secondary",
+		children: descriptionText
+	}) : null, [descriptionText]);
+	return /* @__PURE__ */ jsxs(ChoiceListItemLabel, {
+		as: "label",
+		className: cn(mixinClasses, className),
+		children: [
+			/* @__PURE__ */ jsx("input", {
+				className: "peer absolute h-0 w-0 opacity-0",
+				tabIndex: 0,
+				...rest,
+				ref,
+				type
+			}),
+			visual,
+			labelSize === "primary" ? /* @__PURE__ */ jsx(BodyPrimary, {
+				className: "grid-area-[label]",
+				children
+			}) : /* @__PURE__ */ jsx(BodySecondary, {
+				className: "grid-area-[label]",
+				children
+			}),
+			description
+		]
+	});
+});
+ChoiceListItem.displayName = "ChoiceListItem";
+//#endregion
+//#region src/ChoiceListItem/Radio.tsx
+const RadioVisual = ({ className }) => /* @__PURE__ */ jsx("svg", {
+	"aria-hidden": "true",
+	className: cn("rounded-full border border-border-primary bg-background-primary text-icon-default", "h-5 w-5", "transition-colors", "ml-3xs mt-3xs", "peer-checked:border-border-selected peer-checked:text-icon-secondary peer-hover:border-border-hover peer-checked:[&>circle]:opacity-100", "peer-disabled:cursor-not-allowed peer-disabled:border-border-disabled peer-disabled:bg-background-disabled peer-disabled:text-icon-disabled", className),
+	fill: "none",
+	height: "20",
+	viewBox: "2 2 20 20",
+	width: "20",
+	children: /* @__PURE__ */ jsx("circle", {
+		className: "opacity-0 transition-opacity",
+		cx: "12",
+		cy: "12",
+		fill: "currentColor",
+		r: "7"
+	})
+});
+/**
+* RadioOption component using Tailwind CSS.
+* @see CommonProps for prop details.
+*/
+const RadioOption = forwardRef((props, ref) => {
+	return /* @__PURE__ */ jsx(ChoiceListItem, {
+		...props,
+		ref,
+		type: "radio",
+		visual: /* @__PURE__ */ jsx(RadioVisual, {})
+	});
+});
+RadioOption.displayName = "RadioOption";
+const Radio = {
+	Group: ChoiceListItemGroup,
+	Option: RadioOption
+};
+const RadioGroup = ChoiceListItemGroup;
+//#endregion
+//#region src/ChoiceListItem/Checkbox.tsx
+const CheckboxVisual = ({ className }) => /* @__PURE__ */ jsxs("svg", {
+	"aria-hidden": "true",
+	className: cn("rounded-checkbox border border-border-primary bg-background-primary text-icon-primary", "h-5 w-5", "transition-colors", "ml-3xs mt-3xs", "peer-checked:border-border-selected peer-checked:text-icon-secondary peer-hover:border-border-hover peer-checked:[&>.checked]:opacity-100", "peer-[:indeterminate]:border-border-selected peer-[:indeterminate]:text-icon-secondary peer-[:indeterminate]:[&>.indeterminate]:opacity-100", "peer-disabled:cursor-not-allowed peer-disabled:border-border-disabled peer-disabled:bg-background-disabled peer-disabled:text-icon-disabled", className),
+	fill: "none",
+	height: "20",
+	viewBox: "2 2 20 20",
+	width: "20",
+	xmlns: "http://www.w3.org/2000/svg",
+	children: [/* @__PURE__ */ jsx("path", {
+		className: "checked opacity-0 transition-opacity",
+		clipRule: "evenodd",
+		d: "M9.75502 16.8036L5.20502 12.4453C4.93166 12.1835 4.93166 11.759 5.20502 11.4971L6.19494 10.5489C6.4683 10.287 6.91154 10.287 7.1849 10.5489L10.25 13.4848L16.8151 7.19638C17.0885 6.93454 17.5317 6.93454 17.8051 7.19638L18.795 8.14461C19.0683 8.40645 19.0683 8.83098 18.795 9.09285L10.745 16.8036C10.4716 17.0655 10.0284 17.0655 9.75502 16.8036Z",
+		fill: "currentColor",
+		fillRule: "evenodd"
+	}), /* @__PURE__ */ jsx("rect", {
+		className: "indeterminate opacity-0 transition-opacity",
+		fill: "currentColor",
+		height: "4",
+		rx: "1",
+		width: "12",
+		x: "6",
+		y: "10"
+	})]
+});
+const CheckboxOption = forwardRef((props, ref) => {
+	return /* @__PURE__ */ jsx(ChoiceListItem, {
+		...props,
+		ref,
+		type: "checkbox",
+		visual: /* @__PURE__ */ jsx(CheckboxVisual, {})
+	});
+});
+CheckboxOption.displayName = "CheckboxOption";
+const Checkbox = {
+	Group: ChoiceListItemGroup,
+	Option: CheckboxOption
+};
+const CheckboxGroup = ChoiceListItemGroup;
+//#endregion
+export { RadioGroup as a, Radio as i, CheckboxGroup as n, RadioOption as o, CheckboxOption as r, ChoiceListItemLabel as s, Checkbox as t };
+
+//# sourceMappingURL=ChoiceListItem-BqZ3bIj9.mjs.map

package/ChoiceListItem-BqZ3bIj9.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChoiceListItem-BqZ3bIj9.mjs","names":[],"sources":["../src/ChoiceListItem/common.tsx","../src/ChoiceListItem/choiceListItem.tsx","../src/ChoiceListItem/Radio.tsx","../src/ChoiceListItem/Checkbox.tsx"],"sourcesContent":["import { cn } from '@evolve.ui/theme-system';\nimport { forwardRef, HTMLProps, ReactElement, ReactNode, SVGProps } from 'react';\n\nimport { GenericCSSMixinProps, getMixinClasses } from '../mixins';\n\nexport const ChoiceListItemIcon = forwardRef<SVGSVGElement, SVGProps<SVGSVGElement>>(({ className, ...rest }, ref) => (\n    <svg\n        className={cn('border border-current bg-background-primary text-icon-secondary', className)}\n        ref={ref}\n        {...rest}\n    />\n));\n\nChoiceListItemIcon.displayName = 'ChoiceListItemIcon';\n\ntype ChoiceListItemLabelProps = {\n    /** Hammer passes `as=\"label\"`; ignored at runtime (label is always `<label>`). */\n    as?: 'label' | string;\n    children: ReactNode;\n    className?: string;\n};\n\nexport const ChoiceListItemLabel = ({ as: _as, children, className }: ChoiceListItemLabelProps) => (\n    <label\n        className={cn(\n            'grid cursor-pointer grid-cols-[24px_10px_1fr]',\n            'cursor-pointer',\n            '[&>input:focus-visible~svg]:outline [&>input:focus-visible~svg]:outline-4 [&>input:focus-visible~svg]:outline-offset-1 [&>input:focus-visible~svg]:outline-focus-primary',\n            '[&>input:checked~svg]:text-icon-secondary [&>input[type=\"checkbox\"]:indeterminate~svg]:text-icon-secondary',\n            '[&>input:hover~svg]:bg-background-hover [&>input:hover~svg]:text-icon-hover',\n            '[&>input:disabled~span]:text-text-disabled',\n            '[&>input:disabled~svg]:cursor-not-allowed [&>input:disabled~svg]:bg-background-disabled [&>input:disabled~svg]:text-icon-disabled',\n            className\n        )}\n        style={{ gridTemplateAreas: \"'input . label' '. . description'\" }}\n    >\n        {children}\n    </label>\n);\n\nexport const ChoiceListItemGroup = forwardRef<HTMLFieldSetElement, GroupProps>(\n    (\n        {\n            $gridLocation,\n            $lineClamp,\n            $margin,\n            $marginBottom,\n            $marginLeft,\n            $marginRight,\n            $marginTop,\n            $padding,\n            $paddingBottom,\n            $paddingLeft,\n            $paddingRight,\n            $paddingTop,\n            children,\n            className,\n            id,\n            label,\n            ...rest\n        },\n        ref\n    ) => {\n        const mixinClasses = getMixinClasses({\n            $gridLocation,\n            $lineClamp,\n            $margin,\n            $marginBottom,\n            $marginLeft,\n            $marginRight,\n            $marginTop,\n            $padding,\n            $paddingBottom,\n            $paddingLeft,\n            $paddingRight,\n            $paddingTop,\n        });\n\n        return (\n            <fieldset\n                className={cn(\n                    'm-0 flex flex-col gap-y-xs border-0 p-0 text-[inherit] xsMax:gap-y-sm',\n                    mixinClasses,\n                    className\n                )}\n                id={id}\n                ref={ref}\n                {...rest}\n            >\n                {Boolean(label) && <legend className=\"hui-text-label-mini pb-xs\">{label}</legend>}\n                {children}\n            </fieldset>\n        );\n    }\n);\n\nChoiceListItemGroup.displayName = 'ChoiceListItemGroup';\n\nexport type GroupProps = Omit<HTMLProps<HTMLFieldSetElement>, 'as' | 'ref' | 'id' | 'children'> & {\n    /** Checkboxes or Radios for this group. */\n    children: ReactElement<CommonProps> | ReactElement<CommonProps>[];\n    /** This will match children's name prop. */\n    id?: string;\n    /** Text for the group label */\n    label?: ReactNode;\n} & GenericCSSMixinProps;\n\nexport type CommonProps = {\n    /** Secondary text for the input. Usually doesn't directly describe it */\n    description?: ReactNode;\n    /**\n     * The size of the label.\n     *\n     * @default 'primary'\n     */\n    labelSize?: 'primary' | 'secondary';\n    /**\n     * Should match the id of the group that surrounds it.\n     *\n     * ```html\n     * <Component.Group id=\"someGroup\">\n     *     <Component.Option value=\"someValue\" name=\"someGroup\">\n     *         Label 1\n     *     </Component.Option>\n     *     <Component.Option value={231} name=\"someGroup\">\n     *         Label 2\n     *     </Component.Option>\n     * </Component.Group>\n     * ```\n     */\n    name?: string;\n    /**\n     * Represents the value that selecting this input provides.\n     *\n     * ```html\n     * <Component.Group id=\"someGroup\">\n     *     <Component.Option value=\"someValue\" name=\"someGroup\">\n     *         Label 1\n     *     </Component.Option>\n     *     <Component.Option value={231} name=\"someGroup\">\n     *         Label 2\n     *     </Component.Option>\n     * </Component.Group>\n     * ```\n     */\n    value?: string | number;\n} & Omit<HTMLProps<HTMLInputElement>, 'for' | 'ref' | 'type' | 'name' | 'value'> &\n    GenericCSSMixinProps;\n","import { cn } from '@evolve.ui/theme-system';\nimport { forwardRef, ReactNode, useMemo } from 'react';\n\nimport { getMixinClasses } from '../mixins';\nimport { BodyPrimary, BodySecondary } from '../Typography/Text/Text';\nimport { ChoiceListItemLabel, CommonProps } from './common';\n\ntype TypeOfChoice = {\n    type: 'checkbox' | 'radio';\n    visual: ReactNode;\n};\n\nexport const ChoiceListItem = forwardRef<HTMLInputElement | null, CommonProps & TypeOfChoice>(\n    (\n        {\n            $gridLocation,\n            $lineClamp,\n            $margin,\n            $marginBottom,\n            $marginLeft,\n            $marginRight,\n            $marginTop,\n            $padding,\n            $paddingBottom,\n            $paddingLeft,\n            $paddingRight,\n            $paddingTop,\n            children,\n            className,\n            description: descriptionText,\n            labelSize = 'primary',\n            type,\n            visual,\n            ...rest\n        },\n        ref\n    ) => {\n        const mixinClasses = getMixinClasses({\n            $gridLocation,\n            $lineClamp,\n            $margin,\n            $marginBottom,\n            $marginLeft,\n            $marginRight,\n            $marginTop,\n            $padding,\n            $paddingBottom,\n            $paddingLeft,\n            $paddingRight,\n            $paddingTop,\n        });\n\n        const description = useMemo(\n            () =>\n                descriptionText ? (\n                    <BodySecondary\n                        className=\"grid-area-[description]\"\n                        color=\"secondary\"\n                    >\n                        {descriptionText}\n                    </BodySecondary>\n                ) : null,\n            [descriptionText]\n        );\n\n        return (\n            <ChoiceListItemLabel\n                as=\"label\"\n                className={cn(mixinClasses, className)}\n            >\n                <input\n                    className=\"peer absolute h-0 w-0 opacity-0\"\n                    tabIndex={0}\n                    {...rest}\n                    ref={ref}\n                    type={type}\n                />\n                {visual}\n                {labelSize === 'primary' ? (\n                    <BodyPrimary className=\"grid-area-[label]\">{children}</BodyPrimary>\n                ) : (\n                    <BodySecondary className=\"grid-area-[label]\">{children}</BodySecondary>\n                )}\n\n                {description}\n            </ChoiceListItemLabel>\n        );\n    }\n);\n\nChoiceListItem.displayName = 'ChoiceListItem';\n\nexport const ChoiceListItemCustomLabelContainer = ({\n    children,\n    className,\n}: {\n    children: ReactNode;\n    className?: string;\n}) => <div className={cn('grid-area-[labelExtra]', className)}>{children}</div>;\n","import { cn } from '@evolve.ui/theme-system';\nimport { forwardRef } from 'react';\n\nimport { ChoiceListItem } from './choiceListItem';\nimport { ChoiceListItemGroup, CommonProps } from './common';\n\nconst RadioVisual = ({ className }: { className?: string }) => (\n    <svg\n        aria-hidden=\"true\"\n        className={cn(\n            // Base styles\n            'rounded-full border border-border-primary bg-background-primary text-icon-default',\n            'h-5 w-5', // 20px\n            'transition-colors',\n            // Placement\n            'ml-3xs mt-3xs',\n            // State styles\n            'peer-checked:border-border-selected peer-checked:text-icon-secondary peer-hover:border-border-hover peer-checked:[&>circle]:opacity-100',\n            'peer-disabled:cursor-not-allowed peer-disabled:border-border-disabled peer-disabled:bg-background-disabled peer-disabled:text-icon-disabled',\n            // Custom className\n            className\n        )}\n        fill=\"none\"\n        height=\"20\"\n        viewBox=\"2 2 20 20\"\n        width=\"20\"\n    >\n        <circle\n            className=\"opacity-0 transition-opacity\"\n            cx=\"12\"\n            cy=\"12\"\n            fill=\"currentColor\"\n            r=\"7\"\n        />\n    </svg>\n);\n\n/**\n * RadioOption component using Tailwind CSS.\n * @see CommonProps for prop details.\n */\nexport const RadioOption = forwardRef<HTMLInputElement, CommonProps>((props, ref) => {\n    return (\n        <ChoiceListItem\n            {...props}\n            ref={ref}\n            type=\"radio\"\n            visual={<RadioVisual />}\n        />\n    );\n});\n\nRadioOption.displayName = 'RadioOption';\n\nexport const Radio = {\n    Group: ChoiceListItemGroup,\n    Option: RadioOption,\n};\n\n// export { RadioOption };\nexport const RadioGroup = ChoiceListItemGroup;\n","import { cn } from '@evolve.ui/theme-system';\nimport { forwardRef } from 'react';\n\nimport { ChoiceListItem } from './choiceListItem';\nimport { ChoiceListItemGroup, CommonProps } from './common';\n\nconst CheckboxVisual = ({ className }: { className?: string }) => (\n    <svg\n        aria-hidden=\"true\"\n        className={cn(\n            // Base styles\n            'rounded-checkbox border border-border-primary bg-background-primary text-icon-primary',\n            'h-5 w-5', // 20px\n            'transition-colors',\n            // Placement\n            'ml-3xs mt-3xs',\n            // State styles\n            'peer-checked:border-border-selected peer-checked:text-icon-secondary peer-hover:border-border-hover peer-checked:[&>.checked]:opacity-100',\n            // Arbitrary `peer-[:indeterminate]` ensures JIT emits sibling rules (peer-indeterminate can be absent in some scans).\n            'peer-[:indeterminate]:border-border-selected peer-[:indeterminate]:text-icon-secondary peer-[:indeterminate]:[&>.indeterminate]:opacity-100',\n            'peer-disabled:cursor-not-allowed peer-disabled:border-border-disabled peer-disabled:bg-background-disabled peer-disabled:text-icon-disabled',\n            // Custom className\n            className\n        )}\n        fill=\"none\"\n        height=\"20\"\n        viewBox=\"2 2 20 20\"\n        width=\"20\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n    >\n        <path\n            className=\"checked opacity-0 transition-opacity\"\n            clipRule=\"evenodd\"\n            d=\"M9.75502 16.8036L5.20502 12.4453C4.93166 12.1835 4.93166 11.759 5.20502 11.4971L6.19494 10.5489C6.4683 10.287 6.91154 10.287 7.1849 10.5489L10.25 13.4848L16.8151 7.19638C17.0885 6.93454 17.5317 6.93454 17.8051 7.19638L18.795 8.14461C19.0683 8.40645 19.0683 8.83098 18.795 9.09285L10.745 16.8036C10.4716 17.0655 10.0284 17.0655 9.75502 16.8036Z\"\n            fill=\"currentColor\"\n            fillRule=\"evenodd\"\n        />\n        <rect\n            className=\"indeterminate opacity-0 transition-opacity\"\n            fill=\"currentColor\"\n            height=\"4\"\n            rx=\"1\"\n            width=\"12\"\n            x=\"6\"\n            y=\"10\"\n        />\n    </svg>\n);\n\nconst CheckboxOption = forwardRef<HTMLInputElement | null, CommonProps>((props, ref) => {\n    return (\n        <ChoiceListItem\n            {...props}\n            ref={ref}\n            type=\"checkbox\"\n            visual={<CheckboxVisual />}\n        />\n    );\n});\n\nCheckboxOption.displayName = 'CheckboxOption';\n\nexport const Checkbox = {\n    Group: ChoiceListItemGroup,\n    Option: CheckboxOption,\n};\n\nexport { CheckboxOption };\nexport const CheckboxGroup = ChoiceListItemGroup;\n"],"mappings":"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"}

package/ChoiceListItem-D_74Zcpd.cjs

@@ -0,0 +1,209 @@
+const require_Typography_Text = require("./Typography/Text.cjs");
+const require_mixins = require("./mixins-D56ptENc.cjs");
+let _evolve_ui_theme_system = require("@evolve.ui/theme-system");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/ChoiceListItem/common.tsx
+const ChoiceListItemIcon = (0, react.forwardRef)(({ className, ...rest }, ref) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+	className: (0, _evolve_ui_theme_system.cn)("border border-current bg-background-primary text-icon-secondary", className),
+	ref,
+	...rest
+}));
+ChoiceListItemIcon.displayName = "ChoiceListItemIcon";
+const ChoiceListItemLabel = ({ as: _as, children, className }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
+	className: (0, _evolve_ui_theme_system.cn)("grid cursor-pointer grid-cols-[24px_10px_1fr]", "cursor-pointer", "[&>input:focus-visible~svg]:outline [&>input:focus-visible~svg]:outline-4 [&>input:focus-visible~svg]:outline-offset-1 [&>input:focus-visible~svg]:outline-focus-primary", "[&>input:checked~svg]:text-icon-secondary [&>input[type=\"checkbox\"]:indeterminate~svg]:text-icon-secondary", "[&>input:hover~svg]:bg-background-hover [&>input:hover~svg]:text-icon-hover", "[&>input:disabled~span]:text-text-disabled", "[&>input:disabled~svg]:cursor-not-allowed [&>input:disabled~svg]:bg-background-disabled [&>input:disabled~svg]:text-icon-disabled", className),
+	style: { gridTemplateAreas: "'input . label' '. . description'" },
+	children
+});
+const ChoiceListItemGroup = (0, react.forwardRef)(({ $gridLocation, $lineClamp, $margin, $marginBottom, $marginLeft, $marginRight, $marginTop, $padding, $paddingBottom, $paddingLeft, $paddingRight, $paddingTop, children, className, id, label, ...rest }, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("fieldset", {
+		className: (0, _evolve_ui_theme_system.cn)("m-0 flex flex-col gap-y-xs border-0 p-0 text-[inherit] xsMax:gap-y-sm", require_mixins.getMixinClasses({
+			$gridLocation,
+			$lineClamp,
+			$margin,
+			$marginBottom,
+			$marginLeft,
+			$marginRight,
+			$marginTop,
+			$padding,
+			$paddingBottom,
+			$paddingLeft,
+			$paddingRight,
+			$paddingTop
+		}), className),
+		id,
+		ref,
+		...rest,
+		children: [Boolean(label) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("legend", {
+			className: "hui-text-label-mini pb-xs",
+			children: label
+		}), children]
+	});
+});
+ChoiceListItemGroup.displayName = "ChoiceListItemGroup";
+//#endregion
+//#region src/ChoiceListItem/choiceListItem.tsx
+const ChoiceListItem = (0, react.forwardRef)(({ $gridLocation, $lineClamp, $margin, $marginBottom, $marginLeft, $marginRight, $marginTop, $padding, $paddingBottom, $paddingLeft, $paddingRight, $paddingTop, children, className, description: descriptionText, labelSize = "primary", type, visual, ...rest }, ref) => {
+	const mixinClasses = require_mixins.getMixinClasses({
+		$gridLocation,
+		$lineClamp,
+		$margin,
+		$marginBottom,
+		$marginLeft,
+		$marginRight,
+		$marginTop,
+		$padding,
+		$paddingBottom,
+		$paddingLeft,
+		$paddingRight,
+		$paddingTop
+	});
+	const description = (0, react.useMemo)(() => descriptionText ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography_Text.BodySecondary, {
+		className: "grid-area-[description]",
+		color: "secondary",
+		children: descriptionText
+	}) : null, [descriptionText]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(ChoiceListItemLabel, {
+		as: "label",
+		className: (0, _evolve_ui_theme_system.cn)(mixinClasses, className),
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				className: "peer absolute h-0 w-0 opacity-0",
+				tabIndex: 0,
+				...rest,
+				ref,
+				type
+			}),
+			visual,
+			labelSize === "primary" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography_Text.BodyPrimary, {
+				className: "grid-area-[label]",
+				children
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography_Text.BodySecondary, {
+				className: "grid-area-[label]",
+				children
+			}),
+			description
+		]
+	});
+});
+ChoiceListItem.displayName = "ChoiceListItem";
+//#endregion
+//#region src/ChoiceListItem/Radio.tsx
+const RadioVisual = ({ className }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
+	"aria-hidden": "true",
+	className: (0, _evolve_ui_theme_system.cn)("rounded-full border border-border-primary bg-background-primary text-icon-default", "h-5 w-5", "transition-colors", "ml-3xs mt-3xs", "peer-checked:border-border-selected peer-checked:text-icon-secondary peer-hover:border-border-hover peer-checked:[&>circle]:opacity-100", "peer-disabled:cursor-not-allowed peer-disabled:border-border-disabled peer-disabled:bg-background-disabled peer-disabled:text-icon-disabled", className),
+	fill: "none",
+	height: "20",
+	viewBox: "2 2 20 20",
+	width: "20",
+	children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+		className: "opacity-0 transition-opacity",
+		cx: "12",
+		cy: "12",
+		fill: "currentColor",
+		r: "7"
+	})
+});
+/**
+* RadioOption component using Tailwind CSS.
+* @see CommonProps for prop details.
+*/
+const RadioOption = (0, react.forwardRef)((props, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChoiceListItem, {
+		...props,
+		ref,
+		type: "radio",
+		visual: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(RadioVisual, {})
+	});
+});
+RadioOption.displayName = "RadioOption";
+const Radio = {
+	Group: ChoiceListItemGroup,
+	Option: RadioOption
+};
+const RadioGroup = ChoiceListItemGroup;
+//#endregion
+//#region src/ChoiceListItem/Checkbox.tsx
+const CheckboxVisual = ({ className }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+	"aria-hidden": "true",
+	className: (0, _evolve_ui_theme_system.cn)("rounded-checkbox border border-border-primary bg-background-primary text-icon-primary", "h-5 w-5", "transition-colors", "ml-3xs mt-3xs", "peer-checked:border-border-selected peer-checked:text-icon-secondary peer-hover:border-border-hover peer-checked:[&>.checked]:opacity-100", "peer-[:indeterminate]:border-border-selected peer-[:indeterminate]:text-icon-secondary peer-[:indeterminate]:[&>.indeterminate]:opacity-100", "peer-disabled:cursor-not-allowed peer-disabled:border-border-disabled peer-disabled:bg-background-disabled peer-disabled:text-icon-disabled", className),
+	fill: "none",
+	height: "20",
+	viewBox: "2 2 20 20",
+	width: "20",
+	xmlns: "http://www.w3.org/2000/svg",
+	children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+		className: "checked opacity-0 transition-opacity",
+		clipRule: "evenodd",
+		d: "M9.75502 16.8036L5.20502 12.4453C4.93166 12.1835 4.93166 11.759 5.20502 11.4971L6.19494 10.5489C6.4683 10.287 6.91154 10.287 7.1849 10.5489L10.25 13.4848L16.8151 7.19638C17.0885 6.93454 17.5317 6.93454 17.8051 7.19638L18.795 8.14461C19.0683 8.40645 19.0683 8.83098 18.795 9.09285L10.745 16.8036C10.4716 17.0655 10.0284 17.0655 9.75502 16.8036Z",
+		fill: "currentColor",
+		fillRule: "evenodd"
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+		className: "indeterminate opacity-0 transition-opacity",
+		fill: "currentColor",
+		height: "4",
+		rx: "1",
+		width: "12",
+		x: "6",
+		y: "10"
+	})]
+});
+const CheckboxOption = (0, react.forwardRef)((props, ref) => {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChoiceListItem, {
+		...props,
+		ref,
+		type: "checkbox",
+		visual: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CheckboxVisual, {})
+	});
+});
+CheckboxOption.displayName = "CheckboxOption";
+const Checkbox = {
+	Group: ChoiceListItemGroup,
+	Option: CheckboxOption
+};
+const CheckboxGroup = ChoiceListItemGroup;
+//#endregion
+Object.defineProperty(exports, "Checkbox", {
+	enumerable: true,
+	get: function() {
+		return Checkbox;
+	}
+});
+Object.defineProperty(exports, "CheckboxGroup", {
+	enumerable: true,
+	get: function() {
+		return CheckboxGroup;
+	}
+});
+Object.defineProperty(exports, "CheckboxOption", {
+	enumerable: true,
+	get: function() {
+		return CheckboxOption;
+	}
+});
+Object.defineProperty(exports, "ChoiceListItemLabel", {
+	enumerable: true,
+	get: function() {
+		return ChoiceListItemLabel;
+	}
+});
+Object.defineProperty(exports, "Radio", {
+	enumerable: true,
+	get: function() {
+		return Radio;
+	}
+});
+Object.defineProperty(exports, "RadioGroup", {
+	enumerable: true,
+	get: function() {
+		return RadioGroup;
+	}
+});
+Object.defineProperty(exports, "RadioOption", {
+	enumerable: true,
+	get: function() {
+		return RadioOption;
+	}
+});
+
+//# sourceMappingURL=ChoiceListItem-D_74Zcpd.cjs.map