"use client";
import { CheckboxSelect as e } from "../ui/forms/CheckboxSelect.js";
import { useState as t } from "react";
import { jsx as n, jsxs as r } from "react/jsx-runtime";
//#region lib/examples/checkbox-select-demo.tsx
var i = [
	{
		value: "open",
		label: "Open"
	},
	{
		value: "fixed",
		label: "Fixed"
	},
	{
		value: "in-progress",
		label: "In Progress"
	},
	{
		value: "closed",
		label: "Closed"
	}
];
function a() {
	let [a, o] = t(["open"]), [s, c] = t([]);
	return /* @__PURE__ */ r("div", {
		className: "space-y-24",
		style: { minWidth: 300 },
		children: [
			/* @__PURE__ */ n(e, {
				label: "Status",
				placeholder: "Select statuses...",
				options: i,
				value: a,
				onChange: (e, t) => o(t)
			}),
			/* @__PURE__ */ n(e, {
				label: "Category",
				placeholder: "Select categories...",
				groups: [{
					label: "Travel",
					options: [{
						value: "flight",
						label: "Flight"
					}, {
						value: "hotel",
						label: "Hotel"
					}]
				}, {
					label: "Activities",
					options: [
						{
							value: "ski",
							label: "Ski"
						},
						{
							value: "golf",
							label: "Golf"
						},
						{
							value: "spa",
							label: "Spa"
						}
					]
				}],
				value: s,
				onChange: (e, t) => c(t),
				renderValue: (e) => `${e.length} selected`
			}),
			/* @__PURE__ */ n(e, {
				label: "Priority",
				options: [
					{
						value: "high",
						label: "High"
					},
					{
						value: "medium",
						label: "Medium"
					},
					{
						value: "low",
						label: "Low"
					}
				],
				validationStatus: "error",
				errorMessage: "Please select at least one priority"
			}),
			/* @__PURE__ */ n(e, {
				label: "Tags",
				options: i,
				value: ["open"],
				disabled: !0
			})
		]
	});
}
//#endregion
export { a as default };

//# sourceMappingURL=checkbox-select-demo.js.map