@clubmed/trident-ui 2.0.0-beta.70 → 2.0.0-beta.74

package/chunks/CriteriaParticipants.js

@@ -12,8 +12,8 @@ import { Toggle as d } from "../ui/Toggle.js";
 import { NumberField as f } from "../ui/forms/NumberField.js";
 import { Switch as p } from "../ui/forms/Switch.js";
 import { useEffect as m, useRef as h, useState as g } from "react";
-import { Icon as _ } from "@clubmed/trident-icons";
-import { jsx as v, jsxs as y } from "react/jsx-runtime";
+import { jsx as _, jsxs as v } from "react/jsx-runtime";
+import { Icon as y } from "@clubmed/trident-icons";
 //#region ../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/compareAsc.js
 function b(e, t) {
 	let n = a(e) - +a(t);
@@ -65,7 +65,7 @@ function D(e, t) {
 function O(e, t, n) {
 	if (t != null) {
 		let e = t.unit === "year" ? n.ageYear ?? "years" : n.ageMonths ?? "months";
-		return /* @__PURE__ */ v("span", {
+		return /* @__PURE__ */ _("span", {
 			className: "text-b5 font-normal",
 			children: `${t.value} ${e}`
 		});
@@ -78,7 +78,7 @@ function O(e, t, n) {
 	}
 	return "";
 }
-var k = ({ label: e, description: t, addLabel: n, removeLabel: r, min: i, max: a, value: o, onChange: s }) => /* @__PURE__ */ v(f, {
+var k = ({ label: e, description: t, addLabel: n, removeLabel: r, min: i, max: a, value: o, onChange: s }) => /* @__PURE__ */ _(f, {
 	controlled: !0,
 	description: t ?? void 0,
 	label: e,
@@ -92,27 +92,27 @@ var k = ({ label: e, description: t, addLabel: n, removeLabel: r, min: i, max: a
 	onChange: (e, t) => s(t),
 	value: o,
 	className: "w-full justify-between"
-}), A = /* @__PURE__ */ v(_, {
+}), A = /* @__PURE__ */ _(y, {
 	"aria-hidden": !0,
 	name: "CrossOutlined",
 	width: "20px"
-}), j = ({ label: e, ariaLabel: t, onClick: n, type: r, ageLabel: i }) => /* @__PURE__ */ y("button", {
+}), j = ({ label: e, ariaLabel: t, onClick: n, type: r, ageLabel: i }) => /* @__PURE__ */ v("button", {
 	"aria-label": t,
 	className: "rounded-32 border-black flex items-center justify-between gap-4 border px-12 py-6 text-b4 font-semibold",
 	onClick: n,
 	type: "button",
-	children: [/* @__PURE__ */ y("span", {
+	children: [/* @__PURE__ */ v("span", {
 		className: "flex items-center",
 		children: [
-			r === "adult" ? /* @__PURE__ */ v(_, {
+			r === "adult" ? /* @__PURE__ */ _(y, {
 				name: "PeopleSingle",
 				width: "24px"
-			}) : /* @__PURE__ */ v(_, {
+			}) : /* @__PURE__ */ _(y, {
 				name: "PeopleKids",
 				width: "24px"
 			}),
 			e,
-			i && /* @__PURE__ */ y("span", {
+			i && /* @__PURE__ */ v("span", {
 				className: "ms-4 text-b5 font-normal",
 				children: [
 					"(",
@@ -122,52 +122,52 @@ var k = ({ label: e, description: t, addLabel: n, removeLabel: r, min: i, max: a
 			})
 		]
 	}), A]
-}), M = ({ onReset: e, onApply: t, resetLabel: r, applyLabel: i, withSpacer: a }) => !e && !t ? null : /* @__PURE__ */ y("div", {
+}), M = ({ onReset: e, onApply: t, resetLabel: r, applyLabel: i, withSpacer: a }) => !e && !t ? null : /* @__PURE__ */ v("div", {
 	className: "flex items-center justify-between",
-	children: [e && r ? /* @__PURE__ */ v("button", {
+	children: [e && r ? /* @__PURE__ */ _("button", {
 		className: "text-b3 cursor-pointer font-semibold underline",
 		onClick: e,
 		type: "button",
 		children: r
-	}) : a ? /* @__PURE__ */ v("span", {}) : null, t && i && /* @__PURE__ */ v(n, {
+	}) : a ? /* @__PURE__ */ _("span", {}) : null, t && i && /* @__PURE__ */ _(n, {
 		color: "saffron",
 		onClick: t,
 		children: i
 	})]
 }), N = ({ title: e, description: n, contacts: a, labels: o }) => {
 	let [s, c] = g(!1);
-	return /* @__PURE__ */ y("div", {
+	return /* @__PURE__ */ v("div", {
 		className: "rounded-16 border-lightGrey space-y-12 border bg-white p-12",
 		children: [
-			/* @__PURE__ */ y("p", {
+			/* @__PURE__ */ v("p", {
 				className: "text-b3 flex items-center gap-12 font-semibold",
-				children: [/* @__PURE__ */ v(i, {
+				children: [/* @__PURE__ */ _(i, {
 					color: "sienna",
 					icon: "Error",
 					size: "size-48",
 					theme: "solid"
 				}), e]
 			}),
-			/* @__PURE__ */ v(t, {
+			/* @__PURE__ */ _(t, {
 				isExpanded: s,
-				children: /* @__PURE__ */ y("div", {
+				children: /* @__PURE__ */ v("div", {
 					className: "space-y-20 pb-4",
-					children: [/* @__PURE__ */ v("p", { children: n }), a.length > 0 && /* @__PURE__ */ v("div", { children: a.map(({ description: e, href: t, icon: n, target: a, title: o }) => /* @__PURE__ */ y("a", {
+					children: [/* @__PURE__ */ _("p", { children: n }), a.length > 0 && /* @__PURE__ */ _("div", { children: a.map(({ description: e, href: t, icon: n, target: a, title: o }) => /* @__PURE__ */ v("a", {
 						className: "mb-20 flex gap-12",
 						href: t,
 						rel: "noreferrer",
 						target: a,
-						children: [/* @__PURE__ */ v(i, {
+						children: [/* @__PURE__ */ _(i, {
 							color: "black",
 							icon: n,
 							size: "size-48",
 							theme: "outline"
-						}), /* @__PURE__ */ y("div", {
+						}), /* @__PURE__ */ v("div", {
 							className: "space-y-8 font-sans",
-							children: [/* @__PURE__ */ v("p", {
+							children: [/* @__PURE__ */ _("p", {
 								className: "text-b3 font-semibold",
 								children: o
-							}), e && /* @__PURE__ */ v(r, {
+							}), e && /* @__PURE__ */ _(r, {
 								className: "text-b4",
 								text: e
 							})]
@@ -175,7 +175,7 @@ var k = ({ label: e, description: t, addLabel: n, removeLabel: r, min: i, max: a
 					}, o)) })]
 				})
 			}),
-			/* @__PURE__ */ v("button", {
+			/* @__PURE__ */ _("button", {
 				className: "text-b4 cursor-pointer underline",
 				onClick: () => c((e) => !e),
 				type: "button",
@@ -183,7 +183,7 @@ var k = ({ label: e, description: t, addLabel: n, removeLabel: r, min: i, max: a
 			})
 		]
 	});
-}, P = ({ adultsCount: r, maxAdults: i, minAdults: a, birthdates: o, childAges: s, childrenCount: c, className: f, labels: _, maxAuthorizedBirthdate: b, maxChildren: x, maxTotalParticipants: S = E, minAuthorizedBirthdate: C, minChildren: w, onChange: T, onLimitDisplay: A, onReset: P, onApply: F, title: I, variant: L = "card", withChildren: R = !0, childrenFlow: z = "age-or-birthdate-with-apply" }) => {
+}, P = ({ adultsCount: r, maxAdults: i, minAdults: a, birthdates: o, childAges: s, childrenCount: c, className: f, labels: y, maxAuthorizedBirthdate: b, maxChildren: x, maxTotalParticipants: S = E, minAuthorizedBirthdate: C, minChildren: w, onChange: T, onLimitDisplay: A, onReset: P, onApply: F, title: I, variant: L = "card", withChildren: R = !0, childrenFlow: z = "age-or-birthdate-with-apply" }) => {
 	let B = L === "card", V = r + c >= S, H = h(V);
 	m(() => {
 		V && !H.current && A?.(), H.current = V;
@@ -192,28 +192,28 @@ var k = ({ label: e, description: t, addLabel: n, removeLabel: r, min: i, max: a
 	m(() => {
 		J((e) => c > e.length ? [...e, ...Array(c - e.length).fill("")] : e.slice(0, c));
 	}, [c]);
-	let te = z !== "birthdate-only", ne = z === "age-or-birthdate-with-apply", X = z === "age-or-birthdate-with-apply", Z = R && te && !!_.enterDateOfBirth, re = R && ne && !!_.participantDetails && (r > 0 || c > 0), Q = /* @__PURE__ */ v(k, {
-		addLabel: _.addAdult,
-		description: _.adultsDescription,
-		label: _.adults,
+	let te = z !== "birthdate-only", ne = z === "age-or-birthdate-with-apply", X = z === "age-or-birthdate-with-apply", Z = R && te && !!y.enterDateOfBirth, re = R && ne && !!y.participantDetails && (r > 0 || c > 0), Q = /* @__PURE__ */ _(k, {
+		addLabel: y.addAdult,
+		description: y.adultsDescription,
+		label: y.adults,
 		max: i,
 		min: a,
 		onChange: (e) => T({
 			type: "adultsCount",
 			payload: e
 		}),
-		removeLabel: _.removeAdult,
+		removeLabel: y.removeAdult,
 		value: r
-	}), ie = o.length > 0 && /* @__PURE__ */ v("div", {
+	}), ie = o.length > 0 && /* @__PURE__ */ _("div", {
 		className: B ? "space-y-12" : "grid grid-cols-1 gap-20 md:grid-cols-2 md:gap-x-20",
-		children: o.map((e, t) => /* @__PURE__ */ v(u, {
-			label: _.childBirthdate.replace("{n}", String(t + 1)),
+		children: o.map((e, t) => /* @__PURE__ */ _(u, {
+			label: y.childBirthdate.replace("{n}", String(t + 1)),
 			value: e,
 			min: C ?? l(),
 			max: b,
-			invalidDateErrorMessage: _.childBirthdateInvalidDateError,
-			minDateErrorMessage: _.childBirthdateMinAgeError,
-			maxDateErrorMessage: _.childBirthdateMaxAgeError,
+			invalidDateErrorMessage: y.childBirthdateInvalidDateError,
+			minDateErrorMessage: y.childBirthdateMinAgeError,
+			maxDateErrorMessage: y.childBirthdateMaxAgeError,
 			onChange: (e, n) => T({
 				type: "birthdate",
 				payload: {
@@ -222,21 +222,21 @@ var k = ({ label: e, description: t, addLabel: n, removeLabel: r, min: i, max: a
 				}
 			})
 		}, t))
-	}), ae = !U && c > 0 && /* @__PURE__ */ y("div", {
+	}), ae = !U && c > 0 && /* @__PURE__ */ v("div", {
 		className: "space-y-12",
-		children: [_.ageQuestion && /* @__PURE__ */ v("p", {
+		children: [y.ageQuestion && /* @__PURE__ */ _("p", {
 			className: "text-b4",
-			children: _.ageQuestion
-		}), Array.from({ length: c }, (e, t) => /* @__PURE__ */ y("div", {
+			children: y.ageQuestion
+		}), Array.from({ length: c }, (e, t) => /* @__PURE__ */ v("div", {
 			className: "space-y-4",
-			children: [/* @__PURE__ */ v("p", {
+			children: [/* @__PURE__ */ _("p", {
 				className: "text-b3 font-semibold px-20",
-				children: _.childLabel ? D(_.childLabel, t + 1) : `Child ${t + 1}`
-			}), /* @__PURE__ */ y("div", {
+				children: y.childLabel ? D(y.childLabel, t + 1) : `Child ${t + 1}`
+			}), /* @__PURE__ */ v("div", {
 				className: "flex items-center gap-12",
 				children: [
-					/* @__PURE__ */ v("input", {
-						"aria-label": _.childLabel ? D(_.childLabel, t + 1) : `Child ${t + 1} age`,
+					/* @__PURE__ */ _("input", {
+						"aria-label": y.childLabel ? D(y.childLabel, t + 1) : `Child ${t + 1} age`,
 						className: "rounded-pill border-lightGrey h-48 w-80 border px-20 text-b3 font-semibold",
 						min: 0,
 						onChange: (e) => {
@@ -246,21 +246,21 @@ var k = ({ label: e, description: t, addLabel: n, removeLabel: r, min: i, max: a
 						type: "number",
 						value: q[t] ?? ""
 					}),
-					_.ageYear && _.ageMonths && /* @__PURE__ */ v(d, {
+					y.ageYear && y.ageMonths && /* @__PURE__ */ _(d, {
 						size: "small",
 						index: G === "year" ? 0 : 1,
 						items: [{
 							id: "year",
 							color: "saffron",
-							label: _.ageYear
+							label: y.ageYear
 						}, {
 							id: "month",
 							color: "saffron",
-							label: _.ageMonths
+							label: y.ageMonths
 						}],
 						onClick: (e) => K(e === 0 ? "year" : "month")
 					}),
-					_.ageApply && /* @__PURE__ */ v(n, {
+					y.ageApply && /* @__PURE__ */ _(n, {
 						color: "black",
 						size: "tertiary",
 						onClick: () => {
@@ -274,51 +274,51 @@ var k = ({ label: e, description: t, addLabel: n, removeLabel: r, min: i, max: a
 								}
 							});
 						},
-						children: _.ageApply
+						children: y.ageApply
 					})
 				]
 			})]
 		}, t))]
-	}), oe = re && /* @__PURE__ */ y("div", {
+	}), oe = re && /* @__PURE__ */ v("div", {
 		className: "space-y-8",
-		children: [/* @__PURE__ */ y("button", {
+		children: [/* @__PURE__ */ v("button", {
 			"aria-expanded": Y,
 			className: "flex w-full cursor-pointer items-center justify-between border-b border-lightGrey pb-4",
 			onClick: () => ee((e) => !e),
 			type: "button",
-			children: [/* @__PURE__ */ v("span", {
+			children: [/* @__PURE__ */ _("span", {
 				className: "text-b4",
-				children: _.participantDetails
-			}), /* @__PURE__ */ v("svg", {
+				children: y.participantDetails
+			}), /* @__PURE__ */ _("svg", {
 				"aria-hidden": !0,
 				className: e("size-20 transition-transform", { "rotate-180": Y }),
 				fill: "none",
 				stroke: "currentColor",
 				strokeWidth: 2,
 				viewBox: "0 0 24 24",
-				children: /* @__PURE__ */ v("path", {
+				children: /* @__PURE__ */ _("path", {
 					d: "M6 9l6 6 6-6",
 					strokeLinecap: "round",
 					strokeLinejoin: "round"
 				})
 			})]
-		}), /* @__PURE__ */ v(t, {
+		}), /* @__PURE__ */ _(t, {
 			isExpanded: Y,
-			children: /* @__PURE__ */ y("div", {
+			children: /* @__PURE__ */ v("div", {
 				className: "grid grid-cols-2 gap-8",
-				children: [Array.from({ length: r }, (e, t) => /* @__PURE__ */ v(j, {
-					ariaLabel: _.removeParticipant,
-					label: _.adultLabel ? D(_.adultLabel, t + 1) : `Adult ${t + 1}`,
+				children: [Array.from({ length: r }, (e, t) => /* @__PURE__ */ _(j, {
+					ariaLabel: y.removeParticipant,
+					label: y.adultLabel ? D(y.adultLabel, t + 1) : `Adult ${t + 1}`,
 					onClick: () => T({
 						type: "adultsCount",
 						payload: r - 1
 					}),
 					type: "adult"
 				}, `adult-${t}`)), Array.from({ length: c }, (e, t) => {
-					let n = O(o[t], s?.[t], _), r = _.childLabel ? D(_.childLabel, t + 1) : `Child ${t + 1}`;
-					return /* @__PURE__ */ v(j, {
+					let n = O(o[t], s?.[t], y), r = y.childLabel ? D(y.childLabel, t + 1) : `Child ${t + 1}`;
+					return /* @__PURE__ */ _(j, {
 						ageLabel: n || void 0,
-						ariaLabel: _.removeParticipant,
+						ariaLabel: y.removeParticipant,
 						label: r,
 						onClick: () => T({
 							type: "childrenCount",
@@ -329,32 +329,32 @@ var k = ({ label: e, description: t, addLabel: n, removeLabel: r, min: i, max: a
 				})]
 			})
 		})]
-	}), $ = R && /* @__PURE__ */ y("div", {
+	}), $ = R && /* @__PURE__ */ v("div", {
 		className: "space-y-8",
 		children: [
-			/* @__PURE__ */ v(k, {
-				addLabel: _.addChild,
-				description: _.childrenAgeLimit,
-				label: _.children,
+			/* @__PURE__ */ _(k, {
+				addLabel: y.addChild,
+				description: y.childrenAgeLimit,
+				label: y.children,
 				max: x,
 				min: w,
 				onChange: (e) => T({
 					type: "childrenCount",
 					payload: e
 				}),
-				removeLabel: _.removeChild,
+				removeLabel: y.removeChild,
 				value: c
 			}),
-			/* @__PURE__ */ v(t, {
+			/* @__PURE__ */ _(t, {
 				isExpanded: Z && c > 0 || !Z && o.length > 0,
-				children: /* @__PURE__ */ y("div", {
+				children: /* @__PURE__ */ v("div", {
 					className: "border-lightGrey space-y-12 border-t pt-12",
-					children: [Z && /* @__PURE__ */ y("div", {
+					children: [Z && /* @__PURE__ */ v("div", {
 						className: "flex items-center justify-between",
-						children: [/* @__PURE__ */ v("p", {
+						children: [/* @__PURE__ */ _("p", {
 							className: "text-b3 font-semibold",
-							children: _.enterDateOfBirth
-						}), /* @__PURE__ */ v(p, {
+							children: y.enterDateOfBirth
+						}), /* @__PURE__ */ _(p, {
 							checked: U,
 							onChange: (e, t) => W(t)
 						})]
@@ -364,47 +364,47 @@ var k = ({ label: e, description: t, addLabel: n, removeLabel: r, min: i, max: a
 			oe
 		]
 	});
-	return B ? /* @__PURE__ */ y("div", {
+	return B ? /* @__PURE__ */ v("div", {
 		className: e("rounded-16 border-lightGrey flex flex-col gap-20 border bg-white p-20", f),
-		children: [/* @__PURE__ */ y("div", {
+		children: [/* @__PURE__ */ v("div", {
 			className: "rounded-16 bg-lightSand space-y-8 p-20",
 			children: [
-				I && /* @__PURE__ */ v("p", {
+				I && /* @__PURE__ */ _("p", {
 					className: "text-b2 font-semibold",
 					children: I
 				}),
-				V && _.limit && /* @__PURE__ */ v(N, { ..._.limit }),
-				/* @__PURE__ */ v("div", {
+				V && y.limit && /* @__PURE__ */ _(N, { ...y.limit }),
+				/* @__PURE__ */ _("div", {
 					className: "rounded-16 bg-white p-12",
 					children: Q
 				}),
-				$ && /* @__PURE__ */ v("div", {
+				$ && /* @__PURE__ */ _("div", {
 					className: "rounded-16 bg-white p-12",
 					children: $
 				})
 			]
-		}), /* @__PURE__ */ v(M, {
-			applyLabel: _.apply,
+		}), /* @__PURE__ */ _(M, {
+			applyLabel: y.apply,
 			onApply: X ? F : void 0,
 			onReset: P,
-			resetLabel: _.reset,
+			resetLabel: y.reset,
 			withSpacer: !0
 		})]
-	}) : /* @__PURE__ */ y("div", {
+	}) : /* @__PURE__ */ v("div", {
 		className: e("space-y-20", f),
 		children: [
-			I && /* @__PURE__ */ v("p", {
+			I && /* @__PURE__ */ _("p", {
 				className: "text-b2 font-semibold",
 				children: I
 			}),
-			V && _.limit && /* @__PURE__ */ v(N, { ..._.limit }),
+			V && y.limit && /* @__PURE__ */ _(N, { ...y.limit }),
 			Q,
 			$,
-			/* @__PURE__ */ v(M, {
-				applyLabel: _.apply,
+			/* @__PURE__ */ _(M, {
+				applyLabel: y.apply,
 				onApply: X ? F : void 0,
 				onReset: P,
-				resetLabel: _.reset
+				resetLabel: y.reset
 			})
 		]
 	});

package/chunks/DateField.js

@@ -5,8 +5,8 @@ import { useValue as r } from "../ui/hooks/useValue.js";
 import { a as i, c as a, i as o, n as s, s as c } from "./addLeadingZeros.js";
 import { t as l } from "./formatISO.js";
 import { useCallback as u, useEffect as d, useId as f, useRef as p, useState as m } from "react";
-import { Icon as h } from "@clubmed/trident-icons";
-import { jsx as g, jsxs as _ } from "react/jsx-runtime";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { Icon as _ } from "@clubmed/trident-icons";
 //#region ../../node_modules/.pnpm/date-fns@4.1.0/node_modules/date-fns/differenceInMilliseconds.js
 function v(e, t) {
 	return o(e) - +o(t);
@@ -172,7 +172,7 @@ var z = (e) => e ? typeof e == "string" ? e : s(new Date(e)) ? l(new Date(e), {
 		A,
 		I,
 		H
-	]), /* @__PURE__ */ g(n, {
+	]), /* @__PURE__ */ h(n, {
 		id: o,
 		label: c,
 		description: l,
@@ -184,10 +184,10 @@ var z = (e) => e ? typeof e == "string" ? e : s(new Date(e)) ? l(new Date(e), {
 		validationStatus: x,
 		errorMessage: w,
 		className: N,
-		children: /* @__PURE__ */ _("div", {
+		children: /* @__PURE__ */ g("div", {
 			className: "relative",
 			role: "group",
-			children: [/* @__PURE__ */ g("input", {
+			children: [/* @__PURE__ */ h("input", {
 				...P,
 				type: "date",
 				className: e("text-b3 rounded-pill date-field min-h-[50px] w-full border px-20 py-12 ps-[52px] font-normal outline-none focus-visible:ring-4 focus-visible:ring-black focus-visible:ring-offset-2", {
@@ -209,29 +209,29 @@ var z = (e) => e ? typeof e == "string" ? e : s(new Date(e)) ? l(new Date(e), {
 				onChange: G,
 				onFocus: () => L(!0),
 				onBlur: () => L(!1)
-			}), /* @__PURE__ */ _("div", {
+			}), /* @__PURE__ */ g("div", {
 				className: e("pointer-events-none absolute inset-0 flex items-center justify-between px-20 py-12", {
 					"text-grey": T,
 					"text-red": !T && R === "error",
 					"text-green": !T && R === "success"
 				}),
-				children: [/* @__PURE__ */ _("button", {
+				children: [/* @__PURE__ */ g("button", {
 					className: "pointer-events-auto leading-none outline-none focus-visible:ring-4 focus-visible:ring-black focus-visible:ring-offset-2",
 					onClick: K,
-					children: [/* @__PURE__ */ g(h, {
+					children: [/* @__PURE__ */ h(_, {
 						name: S,
 						iconType: C,
 						width: "24px"
-					}), /* @__PURE__ */ g("span", {
+					}), /* @__PURE__ */ h("span", {
 						className: "sr-only",
 						children: b
 					})]
-				}), /* @__PURE__ */ _("span", {
+				}), /* @__PURE__ */ g("span", {
 					className: "ms-auto flex gap-x-8",
-					children: [R === "error" && /* @__PURE__ */ g(h, {
+					children: [R === "error" && /* @__PURE__ */ h(_, {
 						name: "CrossDefault",
 						width: "24px"
-					}), R === "success" && /* @__PURE__ */ g(h, {
+					}), R === "success" && /* @__PURE__ */ h(_, {
 						name: "CheckDefault",
 						width: "24px"
 					})]

package/examples/accordion-demo.d.ts

@@ -0,0 +1 @@
+export default function AccordionDemo(): import("react/jsx-runtime").JSX.Element;

package/examples/accordion-demo.js

@@ -0,0 +1,79 @@
+"use client";
+import { Accordion as e } from "../ui/Accordion.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region lib/examples/accordion-demo.tsx
+var r = [
+	{
+		id: "what-is-trident",
+		header: /* @__PURE__ */ n("span", {
+			className: "flex w-full items-center justify-between py-16 text-left font-semibold",
+			children: ["What is Trident UI?", /* @__PURE__ */ t("span", {
+				className: "ml-8 text-sm opacity-60 transition-transform in-[[aria-expanded='true']]:rotate-180",
+				children: "▾"
+			})]
+		}),
+		content: /* @__PURE__ */ t("p", {
+			className: "pb-16 text-sm text-black/70",
+			children: "Trident UI is ClubMed's open-source component library built on React and Tailwind CSS. It provides accessible, composable primitives for building consistent product interfaces."
+		})
+	},
+	{
+		id: "how-to-install",
+		header: /* @__PURE__ */ n("span", {
+			className: "flex w-full items-center justify-between py-16 text-left font-semibold",
+			children: ["How do I install it?", /* @__PURE__ */ t("span", {
+				className: "ml-8 text-sm opacity-60 transition-transform in-[[aria-expanded='true']]:rotate-180",
+				children: "▾"
+			})]
+		}),
+		content: /* @__PURE__ */ n("p", {
+			className: "pb-16 text-sm text-black/70",
+			children: [
+				"Run",
+				" ",
+				/* @__PURE__ */ t("code", {
+					className: "rounded bg-black/5 px-4 py-1 font-mono text-xs",
+					children: "npx shadcn@latest add https://develop.trident-ui.pro.clubmed/r/accordion.json"
+				}),
+				" ",
+				"to add the component to your project."
+			]
+		})
+	},
+	{
+		id: "allow-multiple",
+		header: /* @__PURE__ */ n("span", {
+			className: "flex w-full items-center justify-between py-16 text-left font-semibold",
+			children: ["Does it support multiple open panels?", /* @__PURE__ */ t("span", {
+				className: "ml-8 text-sm opacity-60 transition-transform in-[[aria-expanded='true']]:rotate-180",
+				children: "▾"
+			})]
+		}),
+		content: /* @__PURE__ */ n("p", {
+			className: "pb-16 text-sm text-black/70",
+			children: [
+				"Yes — pass",
+				" ",
+				/* @__PURE__ */ t("code", {
+					className: "rounded bg-black/5 px-4 py-1 font-mono text-xs",
+					children: "allowMultiple"
+				}),
+				" to let any number of panels be open at the same time. By default only one panel is open at once."
+			]
+		})
+	}
+];
+function i() {
+	return /* @__PURE__ */ t("div", {
+		className: "w-full max-w-lg space-y-12",
+		children: /* @__PURE__ */ t(e, {
+			items: r,
+			className: "divide-y divide-black/10 rounded-12 border border-black/10",
+			"aria-label": "FAQ"
+		})
+	});
+}
+//#endregion
+export { i as default };
+
+//# sourceMappingURL=accordion-demo.js.map

package/examples/accordion-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion-demo.js","names":[],"sources":["../../lib/examples/accordion-demo.tsx"],"sourcesContent":["'use client';\n\nimport { Accordion } from '@/ui/Accordion';\n\nconst items = [\n  {\n    id: 'what-is-trident',\n    header: (\n      <span className=\"flex w-full items-center justify-between py-16 text-left font-semibold\">\n        What is Trident UI?\n        <span className=\"ml-8 text-sm opacity-60 transition-transform in-[[aria-expanded='true']]:rotate-180\">\n          ▾\n        </span>\n      </span>\n    ),\n    content: (\n      <p className=\"pb-16 text-sm text-black/70\">\n        Trident UI is ClubMed&apos;s open-source component library built on React and Tailwind CSS.\n        It provides accessible, composable primitives for building consistent product interfaces.\n      </p>\n    ),\n  },\n  {\n    id: 'how-to-install',\n    header: (\n      <span className=\"flex w-full items-center justify-between py-16 text-left font-semibold\">\n        How do I install it?\n        <span className=\"ml-8 text-sm opacity-60 transition-transform in-[[aria-expanded='true']]:rotate-180\">\n          ▾\n        </span>\n      </span>\n    ),\n    content: (\n      <p className=\"pb-16 text-sm text-black/70\">\n        Run{' '}\n        <code className=\"rounded bg-black/5 px-4 py-1 font-mono text-xs\">\n          npx shadcn@latest add https://develop.trident-ui.pro.clubmed/r/accordion.json\n        </code>{' '}\n        to add the component to your project.\n      </p>\n    ),\n  },\n  {\n    id: 'allow-multiple',\n    header: (\n      <span className=\"flex w-full items-center justify-between py-16 text-left font-semibold\">\n        Does it support multiple open panels?\n        <span className=\"ml-8 text-sm opacity-60 transition-transform in-[[aria-expanded='true']]:rotate-180\">\n          ▾\n        </span>\n      </span>\n    ),\n    content: (\n      <p className=\"pb-16 text-sm text-black/70\">\n        Yes — pass{' '}\n        <code className=\"rounded bg-black/5 px-4 py-1 font-mono text-xs\">allowMultiple</code> to let\n        any number of panels be open at the same time. By default only one panel is open at once.\n      </p>\n    ),\n  },\n];\n\nexport default function AccordionDemo() {\n  return (\n    <div className=\"w-full max-w-lg space-y-12\">\n      <Accordion\n        items={items}\n        className=\"divide-y divide-black/10 rounded-12 border border-black/10\"\n        aria-label=\"FAQ\"\n      />\n    </div>\n  );\n}\n"],"mappings":";;;;AAIA,IAAM,IAAQ;CACZ;EACE,IAAI;EACJ,QACE,kBAAC,QAAD;GAAM,WAAU;aAAhB,CAAyF,uBAEvF,kBAAC,QAAD;IAAM,WAAU;cAAsF;IAE/F,CAAA,CAAA;;EAGX,SACE,kBAAC,KAAD;GAAG,WAAU;aAA8B;GAGvC,CAAA;EAEP;CACD;EACE,IAAI;EACJ,QACE,kBAAC,QAAD;GAAM,WAAU;aAAhB,CAAyF,wBAEvF,kBAAC,QAAD;IAAM,WAAU;cAAsF;IAE/F,CAAA,CAAA;;EAGX,SACE,kBAAC,KAAD;GAAG,WAAU;aAAb;IAA2C;IACrC;IACJ,kBAAC,QAAD;KAAM,WAAU;eAAiD;KAE1D,CAAA;IAAC;IAAI;;;EAIjB;CACD;EACE,IAAI;EACJ,QACE,kBAAC,QAAD;GAAM,WAAU;aAAhB,CAAyF,yCAEvF,kBAAC,QAAD;IAAM,WAAU;cAAsF;IAE/F,CAAA,CAAA;;EAGX,SACE,kBAAC,KAAD;GAAG,WAAU;aAAb;IAA2C;IAC9B;IACX,kBAAC,QAAD;KAAM,WAAU;eAAiD;KAAoB,CAAA;;;;;CAK5F;AAED,SAAwB,IAAgB;AACtC,QACE,kBAAC,OAAD;EAAK,WAAU;YACb,kBAAC,GAAD;GACS;GACP,WAAU;GACV,cAAW;GACX,CAAA;EACE,CAAA"}

package/examples/accordion-multiple-demo.d.ts

@@ -0,0 +1 @@
+export default function AccordionMultipleDemo(): import("react/jsx-runtime").JSX.Element;