@burdenoff/microfe-movethewheels 2026.703.3 → 2026.703.5

package/dist/MarketplacePage-B9RYOb1Y.js

@@ -0,0 +1,426 @@
+import { A as e, B as t, F as n, I as r, L as i, P as a, R as o, at as s, d as c, f as l, g as ee, h as u, i as te, l as d, st as ne, u as f, ut as p } from "./PageLayout-BniRJaQ6.js";
+import { t as re } from "./chevron-left-B1rZyWWb.js";
+import { t as m } from "./chevron-right-BIcwUJZq.js";
+import { t as h } from "./clock-dRGG4rkF.js";
+import { t as ie } from "./filter-BD483_8g.js";
+import { t as ae } from "./map-pin-CqN1bbT1.js";
+import { t as oe } from "./search-DNIG5Ck7.js";
+import { t as se } from "./star-CVZHFwDx.js";
+import { t as g } from "./store-bwnmCK9f.js";
+import { n as _ } from "./formatters-FWJDwTFv.js";
+import { useCallback as v, useEffect as ce, useMemo as y, useState as b } from "react";
+import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
+import { EmphasisPanel as le, IllustratedEmptyState as w, PagePurpose as ue } from "@burdenoff/fe-libs/ui";
+//#region node_modules/lucide-react/dist/esm/icons/chevron-down.js
+var de = p("ChevronDown", [["path", {
+	d: "m6 9 6 6 6-6",
+	key: "qrunsl"
+}]]), fe = p("ChevronUp", [["path", {
+	d: "m18 15-6-6-6 6",
+	key: "153udz"
+}]]), pe = "\n  query ListServiceProviders($filter: ServiceProviderFilterInput, $pagination: PaginationInput) {\n    serviceProviders(filter: $filter, pagination: $pagination) {\n      id\n      name\n      type\n      description\n      rating\n      isVerified\n      isActive\n      services\n      contactInfo\n    }\n  }\n", me = "\n  query ListServiceOfferings($filter: ServiceOfferingFilterInput, $pagination: PaginationInput) {\n    serviceOfferings(filter: $filter, pagination: $pagination) {\n      id\n      providerId\n      name\n      description\n      category\n      price\n      currency\n      availability\n      provider {\n        id\n        name\n        type\n        rating\n      }\n    }\n  }\n", T = 12, he = [
+	{
+		value: "0",
+		label: "Any rating"
+	},
+	{
+		value: "3",
+		label: "3.0+"
+	},
+	{
+		value: "4",
+		label: "4.0+"
+	},
+	{
+		value: "4.5",
+		label: "4.5+"
+	}
+];
+function E() {
+	let { apiGatewayUrl: p, authToken: E, workspaceToken: D, workspaceId: O, tenantId: k, currentUser: A } = ne(), [j, ge] = b([]), [M, _e] = b([]), [N, P] = b(""), [F, I] = b(!1), [L, R] = b(null), [z, B] = b(0), [ve, ye] = b(!1), [V, be] = b(!1), [H, U] = b("all"), [W, G] = b(!1), [K, q] = b("0"), [xe, J] = b(null), Y = y(() => ({
+		apiGatewayUrl: p,
+		authToken: E,
+		workspaceToken: D,
+		workspaceId: O,
+		tenantId: k,
+		actorId: A?.id
+	}), [
+		p,
+		E,
+		D,
+		O,
+		k,
+		A?.id
+	]), X = v(async () => {
+		I(!0), R(null);
+		try {
+			let [e, t] = await Promise.all([s(Y, pe, { pagination: {
+				limit: T,
+				offset: z * T
+			} }), s(Y, me, { pagination: {
+				limit: 200,
+				offset: 0
+			} })]);
+			ge(e.serviceProviders), ye(e.serviceProviders.length === T), _e(t.serviceOfferings);
+		} catch (e) {
+			R(e instanceof Error ? e : /* @__PURE__ */ Error("Failed to load marketplace"));
+		} finally {
+			I(!1);
+		}
+	}, [Y, z]);
+	ce(() => {
+		X();
+	}, [X]);
+	let Se = y(() => {
+		let e = /* @__PURE__ */ new Set();
+		return j.forEach((t) => e.add(t.type)), Array.from(e).sort();
+	}, [j]), Z = y(() => {
+		let e = N.trim().toLowerCase(), t = Number(K);
+		return j.filter((n) => !(e && !(n.name.toLowerCase().includes(e) || (n.description ?? "").toLowerCase().includes(e) || n.type.toLowerCase().includes(e)) || H !== "all" && n.type !== H || W && !n.isVerified || t > 0 && (n.rating ?? 0) < t));
+	}, [
+		j,
+		N,
+		H,
+		W,
+		K
+	]), Q = y(() => {
+		let e = N.trim().toLowerCase();
+		return e ? M.filter((t) => t.name.toLowerCase().includes(e) || (t.description ?? "").toLowerCase().includes(e) || (t.category ?? "").toLowerCase().includes(e)) : M;
+	}, [M, N]), Ce = v((e) => M.filter((t) => t.providerId === e), [M]), $ = H !== "all" || W || K !== "0";
+	return /* @__PURE__ */ C(te, {
+		title: "Marketplace",
+		subtitle: "Find logistics service providers",
+		icon: /* @__PURE__ */ S(g, { size: 24 }),
+		headerActions: /* @__PURE__ */ C(f, {
+			variant: V || $ ? "default" : "outline",
+			onClick: () => be((e) => !e),
+			children: [/* @__PURE__ */ S(ie, { size: 16 }), " Filters"]
+		}),
+		children: [
+			/* @__PURE__ */ S(ue, {
+				icon: /* @__PURE__ */ S(g, { size: 18 }),
+				children: "Don't own every leg of the journey? Find vetted third-party logistics providers and service offerings here — compare ratings, verification status and pricing, then engage a partner to cover routes, warehousing or specialised handling you can't do in-house."
+			}),
+			/* @__PURE__ */ S(c, { children: /* @__PURE__ */ C(l, {
+				className: "p-4 space-y-4",
+				children: [/* @__PURE__ */ C("div", {
+					className: "relative",
+					children: [/* @__PURE__ */ S(oe, {
+						className: "absolute left-3 top-1/2 -translate-y-1/2 text-text-secondary",
+						size: 20
+					}), /* @__PURE__ */ S(e, {
+						placeholder: "Search services, providers, locations...",
+						className: "pl-10",
+						value: N,
+						onChange: (e) => P(e.target.value)
+					})]
+				}), V && /* @__PURE__ */ C("div", {
+					className: "flex flex-wrap items-center gap-3 border-t border-border-seam pt-4",
+					children: [
+						/* @__PURE__ */ C("div", {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ S("span", {
+								className: "text-sm font-medium text-text-secondary",
+								children: "Type"
+							}), /* @__PURE__ */ C(a, {
+								value: H,
+								onValueChange: U,
+								children: [/* @__PURE__ */ S(i, {
+									className: "w-[160px]",
+									children: /* @__PURE__ */ S(o, { placeholder: "All types" })
+								}), /* @__PURE__ */ C(n, { children: [/* @__PURE__ */ S(r, {
+									value: "all",
+									children: "All types"
+								}), Se.map((e) => /* @__PURE__ */ S(r, {
+									value: e,
+									children: e
+								}, e))] })]
+							})]
+						}),
+						/* @__PURE__ */ C("div", {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ S("span", {
+								className: "text-sm font-medium text-text-secondary",
+								children: "Min rating"
+							}), /* @__PURE__ */ C(a, {
+								value: K,
+								onValueChange: q,
+								children: [/* @__PURE__ */ S(i, {
+									className: "w-[130px]",
+									children: /* @__PURE__ */ S(o, {})
+								}), /* @__PURE__ */ S(n, { children: he.map((e) => /* @__PURE__ */ S(r, {
+									value: e.value,
+									children: e.label
+								}, e.value)) })]
+							})]
+						}),
+						/* @__PURE__ */ S(f, {
+							variant: W ? "default" : "outline",
+							size: "sm",
+							onClick: () => G((e) => !e),
+							children: "Verified only"
+						}),
+						$ && /* @__PURE__ */ S(f, {
+							variant: "ghost",
+							size: "sm",
+							onClick: () => {
+								U("all"), G(!1), q("0");
+							},
+							children: "Clear filters"
+						})
+					]
+				})]
+			}) }),
+			/* @__PURE__ */ C("div", {
+				className: "grid grid-cols-1 lg:grid-cols-3 gap-6",
+				children: [/* @__PURE__ */ C("div", {
+					className: "lg:col-span-2 space-y-4",
+					children: [
+						/* @__PURE__ */ C("h3", {
+							className: "font-semibold",
+							children: [
+								"Service Providers (",
+								Z.length,
+								")"
+							]
+						}),
+						L && !F && /* @__PURE__ */ S(c, {
+							className: "border-status-error-border",
+							children: /* @__PURE__ */ C(l, {
+								className: "p-6 text-center space-y-3",
+								children: [
+									/* @__PURE__ */ S("p", {
+										className: "text-status-error-text font-medium",
+										children: "Couldn't load providers"
+									}),
+									/* @__PURE__ */ S("p", {
+										className: "text-sm text-text-secondary",
+										children: L.message
+									}),
+									/* @__PURE__ */ S(f, {
+										variant: "outline",
+										onClick: () => void X(),
+										children: "Retry"
+									})
+								]
+							})
+						}),
+						F && Array.from({ length: 3 }).map((e, n) => /* @__PURE__ */ S(t, { className: "h-32 w-full rounded-lg" }, n)),
+						!F && !L && Z.length === 0 && /* @__PURE__ */ S(c, { children: /* @__PURE__ */ S(l, {
+							className: "p-0",
+							children: /* @__PURE__ */ S(w, {
+								illustration: N.trim() || $ ? "empty-search" : "empty-people",
+								title: N.trim() || $ ? "No providers match your filters" : "No providers yet",
+								description: N.trim() || $ ? "Adjust your search or filters to find logistics partners." : "Verified logistics service providers will appear here as they join the marketplace."
+							})
+						}) }),
+						!F && !L && Z.map((e) => {
+							let t = xe === e.id, n = Ce(e.id);
+							return /* @__PURE__ */ C(c, { children: [/* @__PURE__ */ S("button", {
+								type: "button",
+								"aria-expanded": t,
+								className: "w-full text-left",
+								onClick: () => J(t ? null : e.id),
+								children: /* @__PURE__ */ S(l, {
+									className: "p-6",
+									children: /* @__PURE__ */ C("div", {
+										className: "flex items-start justify-between gap-3",
+										children: [/* @__PURE__ */ C("div", {
+											className: "min-w-0",
+											children: [
+												/* @__PURE__ */ C("div", {
+													className: "flex items-center gap-2 flex-wrap",
+													children: [
+														/* @__PURE__ */ S("h4", {
+															className: "font-semibold text-lg",
+															children: e.name
+														}),
+														e.isVerified && /* @__PURE__ */ S(d, {
+															variant: "default",
+															children: "Verified"
+														}),
+														/* @__PURE__ */ S(d, {
+															variant: e.isActive ? "default" : "secondary",
+															children: e.isActive ? "active" : "inactive"
+														})
+													]
+												}),
+												/* @__PURE__ */ S("p", {
+													className: "text-text-secondary mt-1",
+													children: e.description
+												}),
+												/* @__PURE__ */ C("div", {
+													className: "flex items-center gap-4 mt-3 text-sm text-text-secondary",
+													children: [
+														/* @__PURE__ */ C("span", {
+															className: "flex items-center gap-1",
+															children: [
+																/* @__PURE__ */ S(se, {
+																	size: 14,
+																	className: "text-status-warning-text fill-current"
+																}),
+																" ",
+																e.rating ?? 0
+															]
+														}),
+														/* @__PURE__ */ C("span", {
+															className: "flex items-center gap-1",
+															children: [
+																/* @__PURE__ */ S(ae, { size: 14 }),
+																" ",
+																e.type
+															]
+														}),
+														/* @__PURE__ */ C("span", {
+															className: "flex items-center gap-1",
+															children: [/* @__PURE__ */ S(h, { size: 14 }), " Listed"]
+														})
+													]
+												})
+											]
+										}), /* @__PURE__ */ C("div", {
+											className: "text-right shrink-0",
+											children: [
+												/* @__PURE__ */ S("p", {
+													className: "text-sm text-text-secondary",
+													children: "Services"
+												}),
+												/* @__PURE__ */ S("p", {
+													className: "text-lg font-bold",
+													children: n.length
+												}),
+												/* @__PURE__ */ S("span", {
+													className: "mt-1 inline-flex items-center gap-1 text-xs text-primary",
+													children: t ? /* @__PURE__ */ C(x, { children: ["Hide ", /* @__PURE__ */ S(fe, { size: 14 })] }) : /* @__PURE__ */ C(x, { children: ["View ", /* @__PURE__ */ S(de, { size: 14 })] })
+												})
+											]
+										})]
+									})
+								})
+							}), t && /* @__PURE__ */ C("div", {
+								className: "border-t border-border-seam px-6 py-4 space-y-3",
+								children: [/* @__PURE__ */ C("p", {
+									className: "text-sm font-medium text-text-secondary",
+									children: ["Offerings from ", e.name]
+								}), n.length === 0 ? /* @__PURE__ */ S("p", {
+									className: "text-sm text-text-secondary",
+									children: "This provider hasn't listed any offerings yet."
+								}) : n.map((e) => /* @__PURE__ */ C("div", {
+									className: "flex items-center justify-between gap-3 rounded-lg border border-border-seam p-3",
+									children: [/* @__PURE__ */ C("div", {
+										className: "min-w-0",
+										children: [/* @__PURE__ */ S("p", {
+											className: "font-medium truncate",
+											children: e.name
+										}), /* @__PURE__ */ S("p", {
+											className: "text-sm text-text-secondary truncate",
+											children: e.category ?? "general"
+										})]
+									}), /* @__PURE__ */ C("div", {
+										className: "text-right shrink-0",
+										children: [/* @__PURE__ */ S("p", {
+											className: "font-bold",
+											children: _(e.price)
+										}), /* @__PURE__ */ S("p", {
+											className: "text-xs text-text-secondary",
+											children: e.currency
+										})]
+									})]
+								}, e.id))]
+							})] }, e.id);
+						}),
+						!F && !L && (j.length > 0 || z > 0) && /* @__PURE__ */ C("div", {
+							className: "flex flex-wrap items-center justify-between gap-3 pt-1",
+							children: [/* @__PURE__ */ C("span", {
+								className: "text-sm text-text-secondary",
+								children: [
+									"Showing ",
+									j.length === 0 ? 0 : z * T + 1,
+									" to",
+									" ",
+									z * T + j.length
+								]
+							}), /* @__PURE__ */ C("div", {
+								className: "flex items-center gap-1",
+								children: [
+									/* @__PURE__ */ S(f, {
+										variant: "outline",
+										size: "icon",
+										className: "h-8 w-8",
+										"aria-label": "Previous page",
+										onClick: () => {
+											J(null), B((e) => Math.max(0, e - 1));
+										},
+										disabled: z === 0,
+										children: /* @__PURE__ */ S(re, { className: "h-4 w-4" })
+									}),
+									/* @__PURE__ */ C("span", {
+										className: "px-3 text-sm",
+										children: ["Page ", z + 1]
+									}),
+									/* @__PURE__ */ S(f, {
+										variant: "outline",
+										size: "icon",
+										className: "h-8 w-8",
+										"aria-label": "Next page",
+										onClick: () => {
+											J(null), B((e) => e + 1);
+										},
+										disabled: !ve,
+										children: /* @__PURE__ */ S(m, { className: "h-4 w-4" })
+									})
+								]
+							})]
+						})
+					]
+				}), /* @__PURE__ */ C(le, {
+					className: "space-y-4",
+					children: [
+						/* @__PURE__ */ S("h3", {
+							className: "text-base font-semibold text-text-primary",
+							children: "Popular Services"
+						}),
+						Q.length === 0 && /* @__PURE__ */ S(w, {
+							illustration: N.trim() ? "empty-search" : "empty-generic",
+							title: N.trim() ? "No matching services" : "No services listed yet",
+							description: N.trim() ? "Adjust your search to discover service offerings." : "Service offerings from providers will be listed here."
+						}),
+						Q.map((e) => /* @__PURE__ */ C(c, { children: [/* @__PURE__ */ S(u, { children: /* @__PURE__ */ S(ee, {
+							className: "text-base",
+							children: e.name
+						}) }), /* @__PURE__ */ C(l, { children: [
+							/* @__PURE__ */ S("p", {
+								className: "text-sm text-text-secondary mb-3",
+								children: e.description
+							}),
+							/* @__PURE__ */ C("div", {
+								className: "flex flex-wrap gap-1 mb-3",
+								children: [/* @__PURE__ */ S(d, {
+									variant: "outline",
+									className: "text-xs",
+									children: e.category ?? "general"
+								}), /* @__PURE__ */ S(d, {
+									variant: "outline",
+									className: "text-xs",
+									children: e.provider?.name ?? "provider"
+								})]
+							}),
+							/* @__PURE__ */ C("div", {
+								className: "flex items-center justify-between",
+								children: [/* @__PURE__ */ S("span", {
+									className: "font-bold",
+									children: _(e.price)
+								}), /* @__PURE__ */ S("span", {
+									className: "text-sm text-text-secondary",
+									children: e.currency
+								})]
+							})
+						] })] }, e.id))
+					]
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { E as default };

package/dist/MetricCard-y3bWHKUQ.js

@@ -0,0 +1,191 @@
+import { rt as e } from "./PageLayout-BniRJaQ6.js";
+import { t } from "./Sparkline-K2RMJ58u.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { GlassCard as i } from "@burdenoff/fe-libs/ui";
+//#region src/movethewheels/components/MetricCard.tsx
+var a = {
+	sm: {
+		card: "p-3",
+		value: "text-xl font-bold",
+		label: "text-xs",
+		icon: "h-8 w-8"
+	},
+	md: {
+		card: "p-4",
+		value: "text-2xl font-bold",
+		label: "text-sm",
+		icon: "h-10 w-10"
+	},
+	lg: {
+		card: "p-5",
+		value: "text-3xl font-bold",
+		label: "text-sm",
+		icon: "h-11 w-11"
+	}
+}, o = {
+	brand: "var(--color-brand-primary)",
+	blue: "var(--color-chart-1)",
+	success: "var(--color-status-success-text)",
+	warning: "var(--color-status-warning-text)",
+	error: "var(--color-status-error-text)",
+	neutral: "var(--color-text-secondary)"
+}, s = {
+	brand: "bg-brand-primary/10 text-brand-primary",
+	blue: "bg-chart-1/10 text-chart-1",
+	success: "bg-status-success-bg-subtle text-status-success-text",
+	warning: "bg-status-warning-bg-subtle text-status-warning-text",
+	error: "bg-status-error-bg-subtle text-status-error-text",
+	neutral: "bg-bg-sunken text-text-secondary"
+};
+function c({ direction: t }) {
+	return t === "flat" ? /* @__PURE__ */ n("svg", {
+		className: "h-3.5 w-3.5",
+		fill: "none",
+		viewBox: "0 0 24 24",
+		stroke: "currentColor",
+		"aria-hidden": !0,
+		children: /* @__PURE__ */ n("path", {
+			strokeLinecap: "round",
+			strokeLinejoin: "round",
+			strokeWidth: 2.5,
+			d: "M5 12h14"
+		})
+	}) : /* @__PURE__ */ n("svg", {
+		className: e("h-3.5 w-3.5", t === "down" && "rotate-180"),
+		fill: "none",
+		viewBox: "0 0 24 24",
+		stroke: "currentColor",
+		"aria-hidden": !0,
+		children: /* @__PURE__ */ n("path", {
+			strokeLinecap: "round",
+			strokeLinejoin: "round",
+			strokeWidth: 2.5,
+			d: "M12 19V5m0 0l-6 6m6-6l6 6"
+		})
+	});
+}
+function l({ delta: t }) {
+	let i = t.direction === "flat" ? null : t.invert ? t.direction === "down" : t.direction === "up";
+	return /* @__PURE__ */ r("span", {
+		className: e("inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-xs font-semibold tabular-nums", i == null ? "bg-bg-sunken text-text-secondary" : i ? "bg-status-success-bg-subtle text-status-success-text" : "bg-status-error-bg-subtle text-status-error-text"),
+		children: [/* @__PURE__ */ n(c, { direction: t.direction }), t.value]
+	});
+}
+var u = {
+	up: "M5 10l7-7m0 0l7 7m-7-7v18",
+	down: "M19 14l-7 7m0 0l-7-7m7 7V3",
+	flat: "M5 12h14"
+};
+function d({ value: c, label: d, icon: f, change: p, changeType: m = "neutral", subtitle: h, trend: g, size: _ = "md", onClick: v, className: y, treatment: b = "metric", glow: x = !1, sparklineData: S, delta: C, accent: w = "brand" }) {
+	let T = a[_], E = {
+		positive: "text-status-success-text",
+		negative: "text-status-error-text",
+		neutral: "text-text-secondary"
+	}, D = Array.isArray(S) && S.length >= 2;
+	return /* @__PURE__ */ r(i, {
+		treatment: b,
+		glow: x,
+		className: e("group relative overflow-hidden border-border-seam", v && "cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-action-primary-bg focus-visible:ring-offset-2 focus-visible:ring-offset-bg-base", y),
+		onClick: v,
+		...v ? {
+			role: "button",
+			tabIndex: 0,
+			onKeyDown: (e) => {
+				(e.key === "Enter" || e.key === " ") && (e.preventDefault(), v());
+			}
+		} : {},
+		children: [/* @__PURE__ */ n("span", {
+			"aria-hidden": !0,
+			className: "absolute inset-x-0 top-0 h-0.5 opacity-70",
+			style: { background: `linear-gradient(90deg, ${o[w]}, transparent 85%)` }
+		}), /* @__PURE__ */ r("div", {
+			className: T.card,
+			children: [/* @__PURE__ */ r("div", {
+				className: "flex items-start justify-between gap-3",
+				children: [/* @__PURE__ */ r("div", {
+					className: "min-w-0 space-y-1",
+					children: [
+						/* @__PURE__ */ n("p", {
+							className: e("text-text-secondary", T.label),
+							children: d
+						}),
+						/* @__PURE__ */ n("p", {
+							className: e("tracking-tight tabular-nums text-text-primary", T.value),
+							children: typeof c == "number" ? c.toLocaleString() : c
+						}),
+						h && /* @__PURE__ */ n("p", {
+							className: "text-xs text-text-secondary",
+							children: h
+						})
+					]
+				}), f && /* @__PURE__ */ n("div", {
+					className: e("flex shrink-0 items-center justify-center rounded-xl", s[w], T.icon),
+					children: f
+				})]
+			}), (C || D || p) && /* @__PURE__ */ r("div", {
+				className: "mt-3 flex items-end justify-between gap-3",
+				children: [/* @__PURE__ */ n("div", {
+					className: "flex items-center gap-2",
+					children: C ? /* @__PURE__ */ n(l, { delta: C }) : p && /* @__PURE__ */ r("span", {
+						className: e("flex items-center gap-1 text-sm tabular-nums", E[m]),
+						children: [g && /* @__PURE__ */ n("svg", {
+							className: "h-4 w-4",
+							fill: "none",
+							viewBox: "0 0 24 24",
+							stroke: "currentColor",
+							"aria-hidden": !0,
+							children: /* @__PURE__ */ n("path", {
+								strokeLinecap: "round",
+								strokeLinejoin: "round",
+								strokeWidth: 2,
+								d: u[g]
+							})
+						}), /* @__PURE__ */ n("span", { children: p })]
+					})
+				}), D && /* @__PURE__ */ n("div", {
+					className: "w-24 shrink-0 sm:w-28",
+					children: /* @__PURE__ */ n(t, {
+						data: S,
+						color: o[w],
+						height: 34
+					})
+				})]
+			})]
+		})]
+	});
+}
+function f({ size: t = "md" }) {
+	let o = a[t];
+	return /* @__PURE__ */ n(i, {
+		treatment: "metric",
+		className: "overflow-hidden border-border-seam",
+		children: /* @__PURE__ */ n("div", {
+			className: o.card,
+			children: /* @__PURE__ */ r("div", {
+				className: "flex items-start justify-between",
+				children: [/* @__PURE__ */ r("div", {
+					className: "flex-1 space-y-2",
+					children: [
+						/* @__PURE__ */ n("div", { className: "h-4 w-24 rounded bg-bg-sunken motion-safe:animate-vc-shimmer" }),
+						/* @__PURE__ */ n("div", { className: "h-8 w-32 rounded bg-bg-sunken motion-safe:animate-vc-shimmer" }),
+						/* @__PURE__ */ n("div", { className: "h-3 w-20 rounded bg-bg-sunken motion-safe:animate-vc-shimmer" })
+					]
+				}), /* @__PURE__ */ n("div", { className: e("rounded-xl bg-bg-sunken motion-safe:animate-vc-shimmer", o.icon) })]
+			})
+		})
+	});
+}
+function p({ children: t, columns: r = 4, className: i }) {
+	return /* @__PURE__ */ n("div", {
+		className: e("grid gap-4", {
+			2: "grid-cols-1 sm:grid-cols-2",
+			3: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3",
+			4: "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4",
+			5: "grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-5",
+			6: "grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-6"
+		}[r], i),
+		children: t
+	});
+}
+//#endregion
+export { f as n, p as r, d as t };

package/dist/Notice-DOO-tjpV.js

@@ -0,0 +1,46 @@
+import { ut as e } from "./PageLayout-BniRJaQ6.js";
+import { t } from "./circle-check-big-C-p4eNwn.js";
+import { useCallback as n, useRef as r, useState as i } from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region node_modules/lucide-react/dist/esm/icons/info.js
+var s = e("Info", [
+	["circle", {
+		cx: "12",
+		cy: "12",
+		r: "10",
+		key: "1mglay"
+	}],
+	["path", {
+		d: "M12 16v-4",
+		key: "1dtifu"
+	}],
+	["path", {
+		d: "M12 8h.01",
+		key: "e9boi3"
+	}]
+]);
+//#endregion
+//#region src/movethewheels/components/Notice.tsx
+function c({ message: e, variant: n = "success" }) {
+	if (!e) return null;
+	let r = n === "success";
+	return /* @__PURE__ */ o("div", {
+		role: "status",
+		className: `flex items-start gap-2 rounded-lg border px-4 py-3 text-sm ${r ? "border-status-success-border bg-status-success-bg-subtle text-status-success-text" : "border-status-info-border bg-status-info-bg-subtle text-status-info-text"}`,
+		children: [a(r ? t : s, {
+			size: 18,
+			className: "mt-0.5 shrink-0"
+		}), /* @__PURE__ */ a("span", { children: e })]
+	});
+}
+function l(e = 4e3) {
+	let [t, a] = i(null), o = r(null);
+	return {
+		message: t,
+		notify: n((t) => {
+			a(t), o.current && clearTimeout(o.current), o.current = setTimeout(() => a(null), e);
+		}, [e])
+	};
+}
+//#endregion
+export { l as n, c as t };