themelia-ui 3.0.0 → 3.2.0

package/dist/{timeline-BdaGRyj-.js → timeline-BR_jNgvz.js}

@@ -1,9 +1,11 @@
-import { t as e } from "./cx--CBrhWH0.js";
-import { o as t } from "./typography-BkxEiwQ1.js";
-import { d as n } from "./display-B3Q17h5z.js";
-import { t as r } from "./strings-Co9_qArR.js";
+import "#core.css";
+import { s as e } from "./typography-DmeR05Er.js";
+import { t } from "./cx--CBrhWH0.js";
+import { t as n } from "./strings-Co9_qArR.js";
+import { d as r } from "./display-a7AoX_u7.js";
 import { CheckIcon as i } from "lucide-react";
 import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
+import "#css/timeline.css";
 var c = {
 	timeline: "timeline__timeline___SFe0h",
 	item: "timeline__item___bjlJT",
@@ -15,16 +17,22 @@ var c = {
 	head: "timeline__head___30Za0",
 	timestamp: "timeline__timestamp___Lu9LR",
 	body: "timeline__body___FBsGD"
+}, l = {
+	progress: "primary",
+	current: "primary",
+	completed: "success",
+	success: "success",
+	warning: "warning",
+	destructive: "destructive"
 };
-//#endregion
-//#region src/components/base/timeline/timeline.tsx
-function l({ items: n, className: r, ...i }) {
+function u({ items: n, className: r, ...i }) {
 	return /* @__PURE__ */ o("ol", {
-		className: e("timeline--component", c.timeline, r),
+		className: t("timeline--component", c.timeline, r),
 		...i,
 		children: n.map((r, i) => /* @__PURE__ */ s("li", {
 			"data-status": r.status ?? "neutral",
-			className: e("timeline--item", c.item),
+			"data-tone": l[r.status ?? "neutral"],
+			className: t("timeline--item", c.item),
 			children: [/* @__PURE__ */ s("div", {
 				className: c.rail,
 				"aria-hidden": "true",
@@ -33,26 +41,26 @@ function l({ items: n, className: r, ...i }) {
 					children: r.icon ? /* @__PURE__ */ o(r.icon, { className: c.icon }) : null
 				}), i < n.length - 1 ? /* @__PURE__ */ o("span", { className: c.line }) : null]
 			}), /* @__PURE__ */ s("div", {
-				className: e("timeline--content", c.content),
+				className: t("timeline--content", c.content),
 				children: [
 					/* @__PURE__ */ s("div", {
 						className: c.head,
-						children: [/* @__PURE__ */ o(t, {
+						children: [/* @__PURE__ */ o(e, {
 							weight: "medium",
 							className: "timeline--title",
 							children: r.title
-						}), r.trailing == null ? r.timestamp != null && /* @__PURE__ */ o(t, {
+						}), r.trailing == null ? r.timestamp != null && /* @__PURE__ */ o(e, {
 							size: "xs",
 							type: "secondary",
 							numeric: !0,
-							className: e("timeline--timestamp", c.timestamp),
+							className: t("timeline--timestamp", c.timestamp),
 							children: r.timestamp
 						}) : /* @__PURE__ */ o("span", {
-							className: e("timeline--trailing", c.timestamp),
+							className: t("timeline--trailing", c.timestamp),
 							children: r.trailing
 						})]
 					}),
-					r.description != null && /* @__PURE__ */ o(t, {
+					r.description != null && /* @__PURE__ */ o(e, {
 						size: "xs",
 						type: "secondary",
 						className: "timeline--description",
@@ -69,11 +77,11 @@ function l({ items: n, className: r, ...i }) {
 }
 //#endregion
 //#region src/components/base/timeline/stepper.strings.ts
-var u = {
+var d = {
 	position: (e, t) => `Step ${e} of ${t}`,
 	completed: "Completed",
 	current: "Current step"
-}, d = {
+}, f = {
 	stepper: "stepper__stepper___1w8il",
 	step: "stepper__step___5GnnM",
 	stepMarker: "stepper__stepMarker___Rkigo",
@@ -85,26 +93,26 @@ var u = {
 	stepCheck: "stepper__stepCheck___Q6aAk",
 	stepLabel: "stepper__stepLabel___V39va",
 	stepHint: "stepper__stepHint___bdybM"
-}, f = (e) => e === "complete" ? "completed" : e ?? "upcoming";
-function p({ steps: c, variant: l = "bar", onStepClick: p, strings: m, className: h, ...g }) {
-	let _ = r(u, m), v = c.map((e) => f(e.status)), y = l === "bar", b = p != null;
+}, p = (e) => e === "complete" ? "completed" : e ?? "upcoming";
+function m({ steps: c, variant: l = "bar", onStepClick: u, strings: m, className: h, ...g }) {
+	let _ = n(d, m), v = c.map((e) => p(e.status)), y = l === "bar", b = u != null;
 	return /* @__PURE__ */ o("ol", {
 		"data-variant": l,
-		className: e("stepper--component", d.stepper, h),
+		className: t("stepper--component", f.stepper, h),
 		...g,
-		children: c.map((r, l) => {
-			let u = v[l], f = u === "completed", m = u === "current", h = l === c.length - 1, g = r.accessibleName != null, x = f ? _.completed : m ? _.current : void 0, S = m ? "step" : void 0, C = /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ s("span", {
-				className: d.stepRail,
+		children: c.map((n, l) => {
+			let d = v[l], p = d === "completed", m = d === "current", h = l === c.length - 1, g = n.accessibleName != null, x = p ? _.completed : m ? _.current : void 0, S = m ? "step" : void 0, C = /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ s("span", {
+				className: f.stepRail,
 				"aria-hidden": "true",
 				children: [
 					y && /* @__PURE__ */ o("span", {
 						"data-filled": v[l - 1] === "completed" || void 0,
 						"data-hidden": l === 0 || void 0,
-						className: d.stepLine
+						className: f.stepLine
 					}),
 					/* @__PURE__ */ o("span", {
-						className: e("stepper--marker", d.stepMarker),
-						children: f ? /* @__PURE__ */ o(i, { className: d.stepCheck }) : /* @__PURE__ */ o(t, {
+						className: t("stepper--marker", f.stepMarker),
+						children: p ? /* @__PURE__ */ o(i, { className: f.stepCheck }) : /* @__PURE__ */ o(e, {
 							tag: "span",
 							size: "xs",
 							weight: y ? "bold" : "semibold",
@@ -114,61 +122,61 @@ function p({ steps: c, variant: l = "bar", onStepClick: p, strings: m, className
 						})
 					}),
 					y && /* @__PURE__ */ o("span", {
-						"data-filled": f || void 0,
+						"data-filled": p || void 0,
 						"data-hidden": h || void 0,
-						className: d.stepLine
+						className: f.stepLine
 					})
 				]
 			}), /* @__PURE__ */ s("span", {
-				className: d.stepText,
+				className: f.stepText,
 				children: [
-					/* @__PURE__ */ o(n, { children: g ? r.accessibleName : _.position(l + 1, c.length) }),
+					/* @__PURE__ */ o(r, { children: g ? n.accessibleName : _.position(l + 1, c.length) }),
 					" ",
-					/* @__PURE__ */ o(t, {
+					/* @__PURE__ */ o(e, {
 						tag: "span",
 						weight: "semibold",
 						lineHeight: y ? "snug" : void 0,
 						truncate: !y,
-						type: u === "upcoming" ? "secondary" : "main",
+						type: d === "upcoming" ? "secondary" : "main",
 						"aria-hidden": g || void 0,
-						className: e("stepper--label", d.stepLabel),
-						children: r.label
+						className: t("stepper--label", f.stepLabel),
+						children: n.label
 					}),
-					r.hint != null && /* @__PURE__ */ s(a, { children: [" ", /* @__PURE__ */ o(t, {
+					n.hint != null && /* @__PURE__ */ s(a, { children: [" ", /* @__PURE__ */ o(e, {
 						tag: "span",
 						size: "xs",
 						type: "secondary",
 						lineHeight: y ? "snug" : void 0,
 						truncate: !y,
 						"aria-hidden": g || void 0,
-						className: e("stepper--hint", d.stepHint),
-						children: r.hint
+						className: t("stepper--hint", f.stepHint),
+						children: n.hint
 					})] }),
-					!g && x != null && /* @__PURE__ */ s(a, { children: [" ", /* @__PURE__ */ o(n, { children: x })] })
+					!g && x != null && /* @__PURE__ */ s(a, { children: [" ", /* @__PURE__ */ o(r, { children: x })] })
 				]
-			})] }), w = b && (f || m);
+			})] }), w = b && (p || m);
 			return /* @__PURE__ */ s("li", {
-				"data-status": u,
+				"data-status": d,
 				"aria-current": b ? void 0 : S,
-				className: e("stepper--step", d.step),
+				className: t("stepper--step", f.step),
 				children: [b ? /* @__PURE__ */ o("button", {
 					type: "button",
 					"aria-current": S,
 					disabled: !w,
-					onClick: () => w && p?.(r.id, l),
-					className: e("stepper--target", d.stepTarget, d.stepButton),
+					onClick: () => w && u?.(n.id, l),
+					className: t("stepper--target", f.stepTarget, f.stepButton),
 					children: C
 				}) : /* @__PURE__ */ o("span", {
-					className: e("stepper--target", d.stepTarget),
+					className: t("stepper--target", f.stepTarget),
 					children: C
 				}), !y && !h && /* @__PURE__ */ o("span", {
 					"aria-hidden": "true",
-					"data-filled": f || void 0,
-					className: d.stepLine
+					"data-filled": p || void 0,
+					className: f.stepLine
 				})]
-			}, r.id);
+			}, n.id);
 		})
 	});
 }
 //#endregion
-export { u as n, l as r, p as t };
+export { d as n, u as r, m as t };

package/dist/{timelines-BB7550mz.js → timelines-DXG1BfIN.js}

@@ -1,13 +1,15 @@
-import { t as e } from "./cx--CBrhWH0.js";
-import { o as t } from "./typography-BkxEiwQ1.js";
-import { s as n } from "./feedback-DRerHGuV.js";
-import { B as r, T as i } from "./primitives-D0bdDozz.js";
-import { t as a } from "./badge-CxOuTfVr.js";
-import { t as o } from "./strings-Co9_qArR.js";
-import { r as s, t as c } from "./timeline-BdaGRyj-.js";
+import "#core.css";
+import { s as e } from "./typography-DmeR05Er.js";
+import { t } from "./cx--CBrhWH0.js";
+import { t as n } from "./strings-Co9_qArR.js";
+import { B as r, T as i } from "./primitives-BskKlf35.js";
+import { t as a } from "./badge-VlJVZjdm.js";
+import { s as o } from "./feedback-D4qVsKlD.js";
+import { r as s, t as c } from "./timeline-BR_jNgvz.js";
 import { CheckIcon as l, CircleIcon as u, ClockIcon as d, XIcon as f } from "lucide-react";
 import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
-//#region src/components/patterns/timelines/timelines.strings.ts
+import "#css/timelines.css";
+//#region src/components/blocks/timelines/timelines.strings.ts
 var g = {
 	added: "Added",
 	removed: "Removed",
@@ -26,10 +28,10 @@ var g = {
 	completed: "Completed",
 	current: "Current step"
 }, y = {
-	titleRow: "timelines__titleRow___4vbjX",
-	byline: "timelines__byline___Pzjxu",
-	progressGroup: "timelines__progressGroup___c3S6L",
-	stepsBar: "timelines__stepsBar___XHI8k"
+	titleRow: "timelines__titleRow___gq1pH",
+	byline: "timelines__byline___g0McZ",
+	progressGroup: "timelines__progressGroup____475P",
+	stepsBar: "timelines__stepsBar___R-RES"
 }, b = {
 	added: "success",
 	removed: "destructive",
@@ -50,46 +52,46 @@ function S({ entries: n, strings: i, className: o, ...c }) {
 		removed: l.removed,
 		modified: l.modified,
 		fixed: l.fixed
-	}, d = n.map((e) => ({
-		id: e.id,
-		status: b[e.kind],
-		timestamp: e.timestamp,
+	}, d = n.map((t) => ({
+		id: t.id,
+		status: b[t.kind],
+		timestamp: t.timestamp,
 		title: /* @__PURE__ */ h("span", {
 			className: y.titleRow,
 			children: [
 				/* @__PURE__ */ m(a, {
-					tone: x[e.kind],
-					children: u[e.kind]
+					tone: x[t.kind],
+					children: u[t.kind]
 				}),
-				/* @__PURE__ */ m(t, {
+				/* @__PURE__ */ m(e, {
 					tag: "span",
 					weight: "medium",
 					lineHeight: "tight",
-					children: e.title
+					children: t.title
 				}),
-				e.version != null && /* @__PURE__ */ m(r, {
+				t.version != null && /* @__PURE__ */ m(r, {
 					size: "xs",
 					type: "secondary",
-					children: e.version
+					children: t.version
 				})
 			]
 		}),
-		description: e.author == null ? e.description : /* @__PURE__ */ h(p, { children: [e.description, /* @__PURE__ */ m(t, {
+		description: t.author == null ? t.description : /* @__PURE__ */ h(p, { children: [t.description, /* @__PURE__ */ m(e, {
 			tag: "span",
 			size: "xs",
 			type: "secondary",
 			className: y.byline,
-			children: l.byline(e.author)
+			children: l.byline(t.author)
 		})] })
 	}));
 	return /* @__PURE__ */ m("div", {
-		className: e("changelog-timeline--component", o),
+		className: t("changelog-timeline--component", o),
 		...c,
 		children: /* @__PURE__ */ m(s, { items: d })
 	});
 }
 //#endregion
-//#region src/components/patterns/timelines/milestones-timeline.tsx
+//#region src/components/blocks/timelines/milestones-timeline.tsx
 var C = {
 	completed: "completed",
 	inProgress: "current",
@@ -106,42 +108,42 @@ var C = {
 	upcoming: u,
 	blocked: f
 };
-function E({ milestones: r, strings: o, className: c, ...l }) {
+function E({ milestones: n, strings: r, className: c, ...l }) {
 	let u = {
 		..._,
-		...o
+		...r
 	}, d = {
 		completed: u.completed,
 		inProgress: u.inProgress,
 		upcoming: u.upcoming,
 		blocked: u.blocked
-	}, f = r.map((e) => {
-		let r = e.status === "inProgress" && typeof e.progress == "number", o = r ? Math.min(Math.max(e.progress, 0), 100) : 0;
+	}, f = n.map((t) => {
+		let n = t.status === "inProgress" && typeof t.progress == "number", r = n ? Math.min(Math.max(t.progress, 0), 100) : 0;
 		return {
-			id: e.id,
-			status: C[e.status],
-			icon: T[e.status],
-			timestamp: e.dueDate == null ? void 0 : u.dueOn(e.dueDate),
+			id: t.id,
+			status: C[t.status],
+			icon: T[t.status],
+			timestamp: t.dueDate == null ? void 0 : u.dueOn(t.dueDate),
 			title: /* @__PURE__ */ h("span", {
 				className: y.titleRow,
-				children: [/* @__PURE__ */ m(t, {
+				children: [/* @__PURE__ */ m(e, {
 					tag: "span",
 					weight: "medium",
 					lineHeight: "tight",
-					children: e.title
+					children: t.title
 				}), /* @__PURE__ */ m(a, {
-					tone: w[e.status],
-					children: d[e.status]
+					tone: w[t.status],
+					children: d[t.status]
 				})]
 			}),
-			description: e.description,
-			children: r ? /* @__PURE__ */ h("div", {
+			description: t.description,
+			children: n ? /* @__PURE__ */ h("div", {
 				className: y.progressGroup,
-				children: [/* @__PURE__ */ m(n, {
-					value: o,
-					label: typeof e.title == "string" ? u.progressLabel(e.title) : u.progressLabel(d[e.status])
+				children: [/* @__PURE__ */ m(o, {
+					value: r,
+					label: typeof t.title == "string" ? u.progressLabel(t.title) : u.progressLabel(d[t.status])
 				}), /* @__PURE__ */ m(i, {
-					value: Math.round(o),
+					value: Math.round(r),
 					scaled: !0,
 					size: "xs",
 					type: "secondary"
@@ -150,58 +152,58 @@ function E({ milestones: r, strings: o, className: c, ...l }) {
 		};
 	});
 	return /* @__PURE__ */ m("div", {
-		className: e("milestones-timeline--component", c),
+		className: t("milestones-timeline--component", c),
 		...l,
 		children: /* @__PURE__ */ m(s, { items: f })
 	});
 }
 //#endregion
-//#region src/components/patterns/timelines/steps.tsx
+//#region src/components/blocks/timelines/steps.tsx
 function D({ steps: n, className: r, ...i }) {
-	let o = n.map((e) => ({
-		id: e.id,
-		status: e.status === "upcoming" ? "pending" : e.status === "completed" ? "progress" : e.status,
-		icon: e.status === "completed" ? l : void 0,
-		timestamp: e.timestamp,
+	let o = n.map((t) => ({
+		id: t.id,
+		status: t.status === "upcoming" ? "pending" : t.status === "completed" ? "progress" : t.status,
+		icon: t.status === "completed" ? l : void 0,
+		timestamp: t.timestamp,
 		title: /* @__PURE__ */ h("span", {
 			className: y.titleRow,
-			children: [/* @__PURE__ */ m(t, {
+			children: [/* @__PURE__ */ m(e, {
 				tag: "span",
 				weight: "semibold",
 				lineHeight: "tight",
-				children: e.title
-			}), e.badge != null && /* @__PURE__ */ m(a, {
-				tone: e.badgeTone ?? "secondary",
-				children: e.badge
+				children: t.title
+			}), t.badge != null && /* @__PURE__ */ m(a, {
+				tone: t.badgeTone ?? "secondary",
+				children: t.badge
 			})]
 		}),
-		description: e.description,
-		children: e.content
+		description: t.description,
+		children: t.content
 	}));
 	return /* @__PURE__ */ m("div", {
-		className: e("steps--component", r),
+		className: t("steps--component", r),
 		...i,
 		children: /* @__PURE__ */ m(s, { items: o })
 	});
 }
-function O({ steps: t, strings: n, className: r, ...i }) {
-	let a = o(v, n);
+function O({ steps: e, strings: r, className: i, ...a }) {
+	let o = n(v, r);
 	return /* @__PURE__ */ m("div", {
 		tabIndex: 0,
-		className: e("steps-bar--component", y.stepsBar, r),
-		...i,
+		className: t("steps-bar--component", y.stepsBar, i),
+		...a,
 		children: /* @__PURE__ */ m(c, {
 			variant: "bar",
-			steps: t.map((e) => ({
+			steps: e.map((e) => ({
 				id: e.id,
 				label: e.title,
 				hint: e.description,
 				status: e.status
 			})),
 			strings: {
-				position: a.stepLabel,
-				completed: a.completed,
-				current: a.current
+				position: o.stepLabel,
+				completed: o.completed,
+				current: o.current
 			}
 		})
 	});