themelia-react-ui 2.0.5 → 3.0.0

package/dist/use-controllable-state-BlP8SyBI.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-controllable-state-BlP8SyBI.js","names":["useControllableState","internal","setInternal","useState","defaultValue","controlled","value","set","useCallback","next","onChange"],"sources":["../src/lib/use-controllable-state.ts"],"sourcesContent":["import { useCallback, useState } from 'react';\n\nexport interface ControllableStateOptions<T> {\n\t/** The controlled value. `undefined` leaves the state with the component. */\n\tvalue: T | undefined;\n\t/** The initial value while the state is uncontrolled. */\n\tdefaultValue: T;\n\t/** Called with every requested value, whether or not the state is controlled. */\n\tonChange?: (next: T) => void;\n}\n\n/**\n * The controlled/uncontrolled pair behind a `value` / `defaultValue` /\n * `onValueChange` triplet. A defined `value` is authoritative and the setter\n * only reports the request; otherwise the component keeps the state itself.\n * Private to the library: it is the one implementation of this contract, not a\n * consumer hook.\n */\nexport function useControllableState<T>({ value, defaultValue, onChange }: ControllableStateOptions<T>): readonly [T, (next: T) => void] {\n\tconst [internal, setInternal] = useState(defaultValue);\n\tconst controlled = value !== undefined;\n\tconst set = useCallback((next: T) => {\n\t\tif (!controlled) setInternal(next);\n\t\tonChange?.(next);\n\t}, [controlled, onChange]);\n\treturn [controlled ? value : internal, set] as const;\n}\n"],"mappings":";;;AAkBA,SAAgBA,EAAwB,EAAE,UAAO,iBAAc,eAA0E;CACxI,IAAM,CAACC,GAAUC,KAAeC,EAASC,CAAY,GAC/CC,IAAaC,MAAU,KAAA,GACvBC,IAAMC,GAAa,MAAY;EAEpC,AADKH,KAAYH,EAAYO,CAAI,GACjCC,IAAWD,CAAI;CAChB,GAAG,CAACJ,GAAYK,CAAQ,CAAC;CACzB,OAAO,CAACL,IAAaC,IAAQL,GAAUM,CAAG;AAC3C"}

package/dist/use-copy-feedback-CzcaqlLf.js

@@ -0,0 +1,28 @@
+"use client";
+import { useEffect as e, useRef as t, useState as n } from "react";
+//#region src/lib/use-copy-feedback.ts
+var r = 1500;
+function i(i, a) {
+	let [o, s] = n(!1), [c, l] = n(!1), u = t(!1), d = t(0), f = t(void 0);
+	return e(() => (u.current = !0, s(!1), l(!1), () => {
+		u.current = !1, d.current += 1, clearTimeout(f.current);
+	}), [a]), {
+		copied: o,
+		failed: c,
+		copy: async (e) => {
+			let t = ++d.current;
+			clearTimeout(f.current), s(!1), l(!1);
+			try {
+				if (typeof navigator > "u" || !navigator.clipboard?.writeText) throw Error("Clipboard unavailable");
+				await navigator.clipboard.writeText(e);
+			} catch (e) {
+				return u.current && t === d.current && (l(!0), i?.(e)), !1;
+			}
+			return !u.current || t !== d.current ? !1 : (s(!0), f.current = setTimeout(() => s(!1), r), !0);
+		}
+	};
+}
+//#endregion
+export { i as t };
+
+//# sourceMappingURL=use-copy-feedback-CzcaqlLf.js.map

package/dist/use-copy-feedback-CzcaqlLf.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-copy-feedback-CzcaqlLf.js","names":["COPIED_FEEDBACK_MS","useCopyFeedback","copied","setCopied","useState","failed","setFailed","mounted","useRef","attempt","timer","useEffect","source","request","text","error","onCopyError"],"sources":["../src/lib/use-copy-feedback.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\n/** How long the copied state stays visible. */\nconst COPIED_FEEDBACK_MS = 1500;\n\nexport interface CopyFeedback {\n\t/** True for a short time after a successful copy. */\n\tcopied: boolean;\n\t/** True after a failed copy, until the next attempt or source change. */\n\tfailed: boolean;\n\t/** Writes text to the clipboard. Resolves `true` when this attempt is the one shown as copied. */\n\tcopy: (text: string) => Promise<boolean>;\n}\n\n/**\n * The clipboard lifecycle behind every copy action: one attempt at a time,\n * a short copied state, a failed state, and no state change after unmount.\n * `source` resets the feedback when the copied subject changes. The text and\n * the callback stay with the caller.\n */\nexport function useCopyFeedback(onCopyError?: (error: unknown) => void, source?: string): CopyFeedback {\n\tconst [copied, setCopied] = useState(false);\n\tconst [failed, setFailed] = useState(false);\n\tconst mounted = useRef(false);\n\tconst attempt = useRef(0);\n\tconst timer = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n\n\tuseEffect(() => {\n\t\tmounted.current = true;\n\t\tsetCopied(false);\n\t\tsetFailed(false);\n\t\treturn () => {\n\t\t\tmounted.current = false;\n\t\t\tattempt.current += 1;\n\t\t\tclearTimeout(timer.current);\n\t\t};\n\t}, [source]);\n\n\tconst copy = async (text: string) => {\n\t\tconst request = ++attempt.current;\n\t\tclearTimeout(timer.current);\n\t\tsetCopied(false);\n\t\tsetFailed(false);\n\t\ttry {\n\t\t\tif (typeof navigator === 'undefined' || !navigator.clipboard?.writeText) {\n\t\t\t\tthrow new Error('Clipboard unavailable');\n\t\t\t}\n\t\t\tawait navigator.clipboard.writeText(text);\n\t\t} catch (error) {\n\t\t\tif (mounted.current && request === attempt.current) {\n\t\t\t\tsetFailed(true);\n\t\t\t\tonCopyError?.(error);\n\t\t\t}\n\t\t\treturn false;\n\t\t}\n\t\tif (!mounted.current || request !== attempt.current) return false;\n\t\tsetCopied(true);\n\t\ttimer.current = setTimeout(() => setCopied(false), COPIED_FEEDBACK_MS);\n\t\treturn true;\n\t};\n\n\treturn { copied, failed, copy };\n}\n"],"mappings":";;;AAGA,IAAMA,IAAqB;AAiB3B,SAAgBC,EAAgB,GAAwC,GAA+B;CACtG,IAAM,CAACC,GAAQC,KAAaC,EAAS,EAAK,GACpC,CAACC,GAAQC,KAAaF,EAAS,EAAK,GACpCG,IAAUC,EAAO,EAAK,GACtBC,IAAUD,EAAO,CAAC,GAClBE,IAAQF,EAAkD,KAAA,CAAS;CAoCzE,OAlCAG,SACC,EAAQ,UAAU,IAClBR,EAAU,EAAK,GACfG,EAAU,EAAK,SACF;EAGZ,AAFA,EAAQ,UAAU,IAClB,EAAQ,WAAW,GACnB,aAAaI,EAAM,OAAO;CAC3B,IACE,CAACE,CAAM,CAAC,GAyBJ;EAAE;EAAQ;EAAQ,aAvBL,MAAiB;GACpC,IAAMC,IAAU,EAAEJ,EAAQ;GAG1B,AAFA,aAAaC,EAAM,OAAO,GAC1BP,EAAU,EAAK,GACfG,EAAU,EAAK;GACf,IAAI;IACH,IAAI,OAAO,YAAc,OAAe,CAAC,UAAU,WAAW,WAC7D,MAAU,MAAM,uBAAuB;IAExC,MAAM,UAAU,UAAU,UAAUQ,CAAI;GACzC,SAASC,GAAO;IAKf,OAJIR,EAAQ,WAAWM,MAAYJ,EAAQ,YAC1CH,EAAU,EAAI,GACdU,IAAcD,CAAK,IAEb;GACR;GAIA,OAHI,CAACR,EAAQ,WAAWM,MAAYJ,EAAQ,UAAgB,MAC5DN,EAAU,EAAI,GACd,EAAM,UAAU,iBAAiBA,EAAU,EAAK,GAAGH,CAAkB,GAC9D;EACR;CAE8B;AAC/B"}

package/dist/use-metric-format-options-Dk4rC1NO.js

@@ -0,0 +1,251 @@
+"use client";
+import { h as e, p as t } from "./ui-provider-Bu1S-o96.js";
+import { useStrings as n } from "./lib/strings.js";
+import { t as r } from "./utils-BVbAG2J6.js";
+import { c as i } from "./typography-C0dELqYV.js";
+import { t as a } from "./structure-DElaQwwN.js";
+import { i as o } from "./tone-recipes-BPsRAvhu.js";
+import { t as s } from "./smart-card-C59z6KFO.js";
+import { r as c } from "./skeleton-Cab_KgVo.js";
+import { a as l, i as u, s as d } from "./value-typography-D15uwfj-.js";
+import { _ as f } from "./primitives-BlC1lXBr.js";
+import { a as p } from "./number-NFWKIoiK.js";
+import { useMemo as m } from "react";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { ArrowDown as _, ArrowUp as v, Minus as y } from "lucide-react";
+//#region src/components/blocks/analytics/analytics.strings.ts
+var b = {
+	metricErrorLabel: "Unable to load metric",
+	comparisonTitle: "Comparison",
+	heatmapDayLabels: [
+		"Mon",
+		"",
+		"Wed",
+		"",
+		"Fri",
+		"",
+		""
+	],
+	heatmapMonthNames: [
+		"Jan",
+		"Feb",
+		"Mar",
+		"Apr",
+		"May",
+		"Jun",
+		"Jul",
+		"Aug",
+		"Sep",
+		"Oct",
+		"Nov",
+		"Dec"
+	],
+	heatmapLegendLess: "Less",
+	heatmapLegendMore: "More"
+};
+//#endregion
+//#region src/components/blocks/analytics/format-metric-value.ts
+function x(e, t = {}) {
+	if (e.value === null || e.value === void 0) return "—";
+	let n = e.value, r = typeof n == "number" ? n : null, { locale: i } = t;
+	switch (e.valueType) {
+		case "currency": return r === null ? String(n) : p({
+			amount: r,
+			currency: e.currency ?? t.defaultCurrency ?? "USD",
+			locale: i,
+			formatMode: t.moneyFormatMode ?? "with_code"
+		}) ?? "—";
+		case "percentage": return r === null ? String(n) : d(r, { locale: i });
+		case "duration": return r === null ? String(n) : u(r, { locale: i });
+		case "number": return r === null ? String(n) : l(r, { locale: i });
+		default: return String(n);
+	}
+}
+function S(e) {
+	return e.trend ? e.trend : e.change?.direction === "up" ? "positive" : e.change?.direction === "down" ? "negative" : "neutral";
+}
+//#endregion
+//#region src/components/blocks/analytics/atoms/metric-trend-chip.tsx
+var C = {
+	up: "Up",
+	down: "Down",
+	neutral: "No change"
+}, w = {
+	positive: {
+		text: "text-success",
+		badge: `${o.success.tint} ${o.success.ink}`,
+		arrow: "text-success"
+	},
+	negative: {
+		text: "text-destructive",
+		badge: `${o.destructive.tint} ${o.destructive.ink}`,
+		arrow: "text-destructive"
+	},
+	neutral: {
+		text: "text-muted-foreground",
+		badge: "bg-muted text-muted-foreground",
+		arrow: "text-muted-foreground"
+	}
+}, T = {
+	sm: "size-icon-sm",
+	md: "size-icon-md",
+	lg: "size-icon"
+}, E = {
+	sm: "xxs",
+	md: "xs",
+	lg: "sm"
+}, D = {
+	sm: "px-space-sm py-space-2xs",
+	md: "px-space-md py-space-2xs",
+	lg: "px-space-md py-space-xs"
+};
+function O(e, t) {
+	return e || (t === "up" ? "positive" : t === "down" ? "negative" : "neutral");
+}
+function k({ change: e, trend: a, size: o = "md", variant: s = "default", className: c, strings: u }) {
+	let d = n(C, u), { locale: p } = t(), m = /* @__PURE__ */ g("span", {
+		className: "sr-only",
+		children: [e.directionLabel ?? d[e.direction], " "]
+	}), b = O(a, e.direction), x = e.direction === "up" ? v : e.direction === "down" ? _ : y, S = w[b], k = typeof e.value == "number" ? l(e.value, { locale: p }) : e.value, A = e.direction === "up" ? "+" : (e.direction, "");
+	return s === "inline" ? /* @__PURE__ */ g(f, {
+		type: "inherit",
+		size: E[o],
+		weight: "medium",
+		className: r("metric-trend-chip--component", S.text, "tabular-nums", c),
+		children: [
+			m,
+			A,
+			k
+		]
+	}) : s === "compact" ? /* @__PURE__ */ g("span", {
+		className: r("inline-flex items-center gap-space-2xs", S.text, c),
+		children: [
+			/* @__PURE__ */ h(x, {
+				className: T[o],
+				strokeWidth: 2.5,
+				"aria-hidden": "true"
+			}),
+			m,
+			/* @__PURE__ */ h(f, {
+				type: "inherit",
+				size: E[o],
+				weight: "semibold",
+				className: "tabular-nums",
+				children: k
+			})
+		]
+	}) : s === "badge" ? /* @__PURE__ */ g("span", {
+		className: r("inline-flex items-center gap-space-xs rounded-radius", S.badge, D[o], c),
+		children: [
+			/* @__PURE__ */ h(x, {
+				className: T[o],
+				strokeWidth: 2.5,
+				"aria-hidden": "true"
+			}),
+			m,
+			/* @__PURE__ */ h(f, {
+				type: "inherit",
+				size: E[o],
+				weight: "semibold",
+				className: "tabular-nums",
+				children: k
+			}),
+			!!e.label && /* @__PURE__ */ h(i, {
+				type: "inherit",
+				tag: "span",
+				size: E[o],
+				children: e.label
+			})
+		]
+	}) : /* @__PURE__ */ g("span", {
+		className: r("inline-flex items-center gap-space-xs", S.text, c),
+		children: [
+			/* @__PURE__ */ h(x, {
+				className: T[o],
+				strokeWidth: 2.5,
+				"aria-hidden": "true"
+			}),
+			m,
+			/* @__PURE__ */ h(f, {
+				type: "inherit",
+				size: E[o],
+				weight: "semibold",
+				className: "tabular-nums",
+				children: k
+			}),
+			!!e.label && /* @__PURE__ */ h(i, {
+				tag: "span",
+				size: E[o],
+				type: "secondary",
+				children: e.label
+			})
+		]
+	});
+}
+k.displayName = "MetricTrendChip";
+//#endregion
+//#region src/components/blocks/analytics/atoms/metric-skeleton.tsx
+var A = ({ className: e }) => /* @__PURE__ */ h(c, { className: e });
+function j({ variant: e = "default", size: t = "md", className: n }) {
+	let i = /* @__PURE__ */ g(a, {
+		gap: "lg",
+		children: [
+			/* @__PURE__ */ h(A, { className: "h-3 w-24" }),
+			/* @__PURE__ */ g(a, {
+				gap: "md",
+				children: [/* @__PURE__ */ h(A, { className: t === "lg" ? "h-9 w-40" : "h-7 w-32" }), /* @__PURE__ */ h(A, { className: "h-3 w-20" })]
+			}),
+			/* @__PURE__ */ h(A, { className: "h-8 w-full" })
+		]
+	});
+	return e === "card" || e === "bordered" || e === "accent" || e === "colored" ? /* @__PURE__ */ h(s, {
+		surface: e === "card" ? void 0 : "card",
+		className: r("metric-skeleton--component", n),
+		"aria-busy": "true",
+		"aria-live": "polite",
+		children: i
+	}) : e === "compact" ? /* @__PURE__ */ g("div", {
+		className: r("flex items-center gap-space-lg", n),
+		"aria-busy": "true",
+		children: [
+			/* @__PURE__ */ h(A, { className: "size-avatar rounded-radius" }),
+			/* @__PURE__ */ g(a, {
+				gap: "sm",
+				className: "flex-1",
+				children: [/* @__PURE__ */ h(A, { className: "h-3 w-20" }), /* @__PURE__ */ h(A, { className: "h-4 w-28" })]
+			}),
+			/* @__PURE__ */ h(A, { className: "h-5 w-12 rounded-full" })
+		]
+	}) : e === "minimal" ? /* @__PURE__ */ g("div", {
+		className: r("inline-flex items-baseline gap-space-md", n),
+		"aria-busy": "true",
+		children: [/* @__PURE__ */ h(A, { className: "h-3 w-12" }), /* @__PURE__ */ h(A, { className: "h-3 w-16" })]
+	}) : /* @__PURE__ */ g("div", {
+		className: r("flex flex-col gap-space-sm", n),
+		"aria-busy": "true",
+		children: [
+			/* @__PURE__ */ h(A, { className: "h-3 w-20" }),
+			/* @__PURE__ */ h(A, { className: "h-5 w-28" }),
+			/* @__PURE__ */ h(A, { className: "mt-1 h-6 w-full" })
+		]
+	});
+}
+j.displayName = "MetricSkeleton";
+//#endregion
+//#region src/components/blocks/analytics/use-metric-format-options.ts
+function M() {
+	let { locale: n } = t(), { defaultCurrency: r, formatMode: i } = e();
+	return m(() => ({
+		locale: n,
+		defaultCurrency: r,
+		moneyFormatMode: i
+	}), [
+		n,
+		r,
+		i
+	]);
+}
+//#endregion
+export { x as a, C as i, j as n, S as o, k as r, b as s, M as t };
+
+//# sourceMappingURL=use-metric-format-options-Dk4rC1NO.js.map

package/dist/use-metric-format-options-Dk4rC1NO.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-metric-format-options-Dk4rC1NO.js","names":["useMoneyConfig","useFormattingConfig","cn","Text","Stack","toneRecipes","Card","Skeleton","formatNumber","formatDuration","formatPercentage","Value","formatMoneyAmount","defaultAnalyticsStrings","formatMetricValue","data","value","numeric","options","resolveTrend","defaultMetricTrendChipStrings","TONE_CLASSES","ICON_SIZE","TEXT_SIZE","BADGE_PADDING","resolveTone","trend","direction","MetricTrendChip","stringsProp","strings","useStrings","change","tone","Icon","ArrowUp","ArrowDown","Minus","palette","valueText","sign","variant","size","className","Bar","MetricSkeleton","cardBody","useMetricFormatOptions","useMemo","formatMode","locale","defaultCurrency"],"sources":["../src/components/blocks/analytics/analytics.strings.ts","../src/components/blocks/analytics/format-metric-value.ts","../src/components/blocks/analytics/atoms/metric-trend-chip.tsx","../src/components/blocks/analytics/atoms/metric-skeleton.tsx","../src/components/blocks/analytics/use-metric-format-options.ts"],"sourcesContent":["/**\n * Shared default strings for `blocks/analytics` components.\n *\n * Each component accepts a `strings` prop deep-merged over these defaults\n * so consumers override per-component without touching the rest. Day/month\n * labels live here too because they're localisable in the same way.\n */\nexport interface AnalyticsStrings {\n\t/** Fallback shown by `<Metric />` when `error` is true. */\n\tmetricErrorLabel: string;\n\t/** Default title for `<MetricComparison />` when no `title` prop is passed. */\n\tcomparisonTitle: string;\n\t/** Labels for the activity heatmap weekday rows (Mon–Sun, length 7). */\n\theatmapDayLabels: readonly [string, string, string, string, string, string, string];\n\t/** Short month names for the activity heatmap header (Jan–Dec, length 12). */\n\theatmapMonthNames: readonly [\n\t\tstring, string, string, string, string, string,\n\t\tstring, string, string, string, string, string,\n\t];\n\t/** Heatmap legend \"less\" label (left edge of intensity legend). */\n\theatmapLegendLess: string;\n\t/** Heatmap legend \"more\" label (right edge of intensity legend). */\n\theatmapLegendMore: string;\n\t/** Writes a heatmap day's tooltip from its date and level (0–4). Defaults to `\"<date>: Level <level>\"`. */\n\theatmapFormatCell?: (date: string, level: number) => string;\n}\n\nexport const defaultAnalyticsStrings: AnalyticsStrings = {\n\tmetricErrorLabel: 'Unable to load metric',\n\tcomparisonTitle: 'Comparison',\n\theatmapDayLabels: ['Mon', '', 'Wed', '', 'Fri', '', ''],\n\theatmapMonthNames: [\n\t\t'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',\n\t\t'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec',\n\t],\n\theatmapLegendLess: 'Less',\n\theatmapLegendMore: 'More',\n};\n","/**\n * formatMetricValue — single canonical formatter for every metric surface.\n *\n * Keeps formatting logic out of the layout components so the same dataset\n * renders identically regardless of which `Metric*` variant displays it.\n * Currency values use the same formatter as the Money primitive, so a KPI and\n * a table cell show one amount the same way.\n */\nimport {\n\tEMPTY,\n\tformatNumber,\n\tformatPercentage,\n} from '../../../lib/format';\nimport { formatMoneyAmount } from '../../../lib/money-format';\nimport type { MoneyFormatMode } from '../../../lib/ui-provider';\nimport { formatDuration } from '../../primitives';\nimport type { MetricData } from './types';\n\n/** Display policy that metric components resolve from UIProvider. */\nexport interface FormatMetricValueOptions {\n\t/** BCP-47 locale. Metric components pass `UIProvider.formatting.locale`. */\n\tlocale?: string;\n\t/** Currency used when the metric has none. Defaults to `USD`, like UIProvider. */\n\tdefaultCurrency?: string;\n\t/** Money format policy. Defaults to `with_code`, like UIProvider. */\n\tmoneyFormatMode?: MoneyFormatMode;\n}\n\nexport function formatMetricValue(data: MetricData, options: FormatMetricValueOptions = {}): string {\n\tif (data.value === null || data.value === undefined) return EMPTY;\n\n\tconst value = data.value;\n\tconst numeric = typeof value === 'number' ? value : null;\n\tconst { locale } = options;\n\n\tswitch (data.valueType) {\n\t\tcase 'currency':\n\t\t\treturn numeric !== null\n\t\t\t\t? (formatMoneyAmount({\n\t\t\t\t\tamount: numeric,\n\t\t\t\t\tcurrency: data.currency ?? options.defaultCurrency ?? 'USD',\n\t\t\t\t\tlocale,\n\t\t\t\t\tformatMode: options.moneyFormatMode ?? 'with_code',\n\t\t\t\t}) ?? EMPTY)\n\t\t\t\t: String(value);\n\t\tcase 'percentage':\n\t\t\treturn numeric !== null ? formatPercentage(numeric, { locale }) : String(value);\n\t\tcase 'duration':\n\t\t\treturn numeric !== null ? formatDuration(numeric, { locale }) : String(value);\n\t\tcase 'number':\n\t\t\treturn numeric !== null ? formatNumber(numeric, { locale }) : String(value);\n\t\tcase 'text':\n\t\tdefault:\n\t\t\treturn String(value);\n\t}\n}\n\n/**\n * Resolve the effective `MetricTrend` for a metric — explicit `trend` wins,\n * otherwise we infer from `change.direction` (`up` → positive, `down` →\n * negative, `neutral`/missing → neutral).\n */\nexport function resolveTrend(data: MetricData): 'positive' | 'negative' | 'neutral' {\n\tif (data.trend) return data.trend;\n\tif (data.change?.direction === 'up') return 'positive';\n\tif (data.change?.direction === 'down') return 'negative';\n\treturn 'neutral';\n}\n","/**\n * MetricTrendChip — compact ↑/↓/→ delta indicator.\n *\n * Decouples direction (up/down/neutral) from tone (positive/negative/neutral)\n * so consumers can flip the colour for inverted metrics like churn or refund\n * rate. Four variants:\n *   - `default`   — coloured icon + value, no chrome\n *   - `badge`     — pill with tinted bg + arrow icon\n *   - `compact`   — coloured arrow + value, no spacing\n *   - `inline`    — value only with sign prefix, no icon\n *\n * The arrow and the colour are decoration: every variant also states the\n * direction in words for assistive technology (`strings`, or per datum through\n * `change.directionLabel`).\n */\nimport { ArrowDown, ArrowUp, Minus } from 'lucide-react';\nimport { Value } from '../../../primitives';\nimport { Text } from '../../../typography';\nimport { formatNumber } from '../../../../lib/format';\nimport { useStrings, type StringsProp } from '../../../../lib/strings';\nimport { useFormattingConfig } from '../../../../lib/ui-provider';\nimport { cn } from '../../../../lib/utils';\n\nimport type { MetricChange, MetricSize, MetricTrend, MetricTrendVariant } from '../types';\nimport { toneRecipes } from '../../../../lib/tone-recipes';\n\nexport interface MetricTrendChipStrings {\n\t/** Direction in words, read out before the value. */\n\tup: string;\n\tdown: string;\n\tneutral: string;\n}\n\nexport const defaultMetricTrendChipStrings: MetricTrendChipStrings = {\n\tup: 'Up',\n\tdown: 'Down',\n\tneutral: 'No change',\n};\n\nexport interface MetricTrendChipProps {\n\tchange: MetricChange;\n\ttrend?: MetricTrend;\n\t/** Size preset. */\n\tsize?: MetricSize;\n\t/** Shell treatment. */\n\tvariant?: MetricTrendVariant;\n\t/** Merged onto the outermost node. */\n\tclassName?: string;\n\t/** Overrides the direction words. */\n\tstrings?: StringsProp<MetricTrendChipStrings>;\n}\n\nconst TONE_CLASSES: Record<MetricTrend, { text: string; badge: string; arrow: string }> = {\n\tpositive: { text: 'text-success', badge: `${toneRecipes.success.tint} ${toneRecipes.success.ink}`, arrow: 'text-success' },\n\tnegative: { text: 'text-destructive', badge: `${toneRecipes.destructive.tint} ${toneRecipes.destructive.ink}`, arrow: 'text-destructive' },\n\tneutral: { text: 'text-muted-foreground', badge: 'bg-muted text-muted-foreground', arrow: 'text-muted-foreground' },\n};\n\nconst ICON_SIZE: Record<MetricSize, string> = {\n\tsm: 'size-icon-sm',\n\tmd: 'size-icon-md',\n\tlg: 'size-icon',\n};\n\nconst TEXT_SIZE: Record<MetricSize, 'xxs' | 'xs' | 'sm'> = {\n\tsm: 'xxs',\n\tmd: 'xs',\n\tlg: 'sm',\n};\n\nconst BADGE_PADDING: Record<MetricSize, string> = {\n\tsm: 'px-space-sm py-space-2xs',\n\tmd: 'px-space-md py-space-2xs',\n\tlg: 'px-space-md py-space-xs',\n};\n\nfunction resolveTone(trend: MetricTrend | undefined, direction: MetricChange['direction']): MetricTrend {\n\tif (trend) return trend;\n\tif (direction === 'up') return 'positive';\n\tif (direction === 'down') return 'negative';\n\treturn 'neutral';\n}\n\nexport function MetricTrendChip({\n\tchange,\n\ttrend,\n\tsize = 'md',\n\tvariant = 'default',\n\tclassName,\n\tstrings: stringsProp,\n}: MetricTrendChipProps) {\n\tconst strings = useStrings(defaultMetricTrendChipStrings, stringsProp);\n\tconst { locale } = useFormattingConfig();\n\tconst direction = <span className=\"sr-only\">{change.directionLabel ?? strings[change.direction]} </span>;\n\tconst tone = resolveTone(trend, change.direction);\n\tconst Icon = change.direction === 'up' ? ArrowUp : change.direction === 'down' ? ArrowDown : Minus;\n\tconst palette = TONE_CLASSES[tone];\n\t// A number is formatted for the provider locale; a string is the app's own formatting.\n\tconst valueText = typeof change.value === 'number' ? formatNumber(change.value, { locale }) : change.value;\n\tconst sign = change.direction === 'up' ? '+' : change.direction === 'down' ? '' : '';\n\n\tif (variant === 'inline') {\n\t\treturn (\n\t\t\t<Value type=\"inherit\" size={TEXT_SIZE[size]} weight=\"medium\" className={cn('metric-trend-chip--component', palette.text, 'tabular-nums', className)}>\n\t\t\t\t{direction}{sign}{valueText}\n\t\t\t</Value>\n\t\t);\n\t}\n\n\tif (variant === 'compact') {\n\t\treturn (\n\t\t\t<span className={cn('inline-flex items-center gap-space-2xs', palette.text, className)}>\n\t\t\t\t<Icon className={ICON_SIZE[size]} strokeWidth={2.5} aria-hidden=\"true\" />\n\t\t\t\t{direction}\n\t\t\t\t<Value type=\"inherit\" size={TEXT_SIZE[size]} weight=\"semibold\" className=\"tabular-nums\">\n\t\t\t\t\t{valueText}\n\t\t\t\t</Value>\n\t\t\t</span>\n\t\t);\n\t}\n\n\tif (variant === 'badge') {\n\t\treturn (\n\t\t\t<span className={cn('inline-flex items-center gap-space-xs rounded-radius', palette.badge, BADGE_PADDING[size], className)}>\n\t\t\t\t<Icon className={ICON_SIZE[size]} strokeWidth={2.5} aria-hidden=\"true\" />\n\t\t\t\t{direction}\n\t\t\t\t<Value type=\"inherit\" size={TEXT_SIZE[size]} weight=\"semibold\" className=\"tabular-nums\">\n\t\t\t\t\t{valueText}\n\t\t\t\t</Value>\n\t\t\t\t{!!change.label && (\n\t\t\t\t\t<Text type=\"inherit\" tag=\"span\" size={TEXT_SIZE[size]}>{change.label}</Text>\n\t\t\t\t)}\n\t\t\t</span>\n\t\t);\n\t}\n\n\t// default\n\treturn (\n\t\t<span className={cn('inline-flex items-center gap-space-xs', palette.text, className)}>\n\t\t\t<Icon className={ICON_SIZE[size]} strokeWidth={2.5} aria-hidden=\"true\" />\n\t\t\t{direction}\n\t\t\t<Value type=\"inherit\" size={TEXT_SIZE[size]} weight=\"semibold\" className=\"tabular-nums\">\n\t\t\t\t{valueText}\n\t\t\t</Value>\n\t\t\t{!!change.label && (\n\t\t\t\t<Text tag=\"span\" size={TEXT_SIZE[size]} type=\"secondary\">{change.label}</Text>\n\t\t\t)}\n\t\t</span>\n\t);\n}\n\nMetricTrendChip.displayName = 'MetricTrendChip';\n","/**\n * MetricSkeleton — loading placeholder matching the height/spacing of every\n * `Metric` variant so the layout doesn't jump when data resolves.\n */\nimport { Card } from '../../../base/cards';\nimport { Skeleton } from '../../../base/skeleton';\nimport { Stack } from '../../../base/structure';\nimport { cn } from '../../../../lib/utils';\nimport type { MetricSize, MetricVariant } from '../types';\n\nexport interface MetricSkeletonProps {\n\t/** Shell treatment. */\n\tvariant?: MetricVariant;\n\t/** Size preset. */\n\tsize?: MetricSize;\n\t/** Merged onto the outermost node. */\n\tclassName?: string;\n}\n\nconst Bar = ({ className }: { className?: string }) => (\n\t<Skeleton className={className} />\n);\n\nexport function MetricSkeleton({\n\tvariant = 'default',\n\tsize = 'md',\n\tclassName,\n}: MetricSkeletonProps) {\n\t// Card-shaped variants share the loaded layout: label, value with its\n\t// supporting line, then the chart band.\n\tconst cardBody = (\n\t\t<Stack gap=\"lg\">\n\t\t\t<Bar className=\"h-3 w-24\" />\n\t\t\t<Stack gap=\"md\">\n\t\t\t\t<Bar className={size === 'lg' ? 'h-9 w-40' : 'h-7 w-32'} />\n\t\t\t\t<Bar className=\"h-3 w-20\" />\n\t\t\t</Stack>\n\t\t\t<Bar className=\"h-8 w-full\" />\n\t\t</Stack>\n\t);\n\n\tif (variant === 'card' || variant === 'bordered' || variant === 'accent' || variant === 'colored') {\n\t\t// The card variant inherits the provider surface like the loaded card;\n\t\t// the bordered, accent and colored variants draw the plain card surface.\n\t\treturn (\n\t\t\t<Card\n\t\t\t\tsurface={variant === 'card' ? undefined : 'card'}\n\t\t\t\tclassName={cn('metric-skeleton--component', className)}\n\t\t\t\taria-busy=\"true\"\n\t\t\t\taria-live=\"polite\"\n\t\t\t>\n\t\t\t\t{cardBody}\n\t\t\t</Card>\n\t\t);\n\t}\n\n\tif (variant === 'compact') {\n\t\treturn (\n\t\t\t<div className={cn('flex items-center gap-space-lg', className)} aria-busy=\"true\">\n\t\t\t\t<Bar className=\"size-avatar rounded-radius\" />\n\t\t\t\t<Stack gap=\"sm\" className=\"flex-1\">\n\t\t\t\t\t<Bar className=\"h-3 w-20\" />\n\t\t\t\t\t<Bar className=\"h-4 w-28\" />\n\t\t\t\t</Stack>\n\t\t\t\t<Bar className=\"h-5 w-12 rounded-full\" />\n\t\t\t</div>\n\t\t);\n\t}\n\n\tif (variant === 'minimal') {\n\t\treturn (\n\t\t\t<div className={cn('inline-flex items-baseline gap-space-md', className)} aria-busy=\"true\">\n\t\t\t\t<Bar className=\"h-3 w-12\" />\n\t\t\t\t<Bar className=\"h-3 w-16\" />\n\t\t\t</div>\n\t\t);\n\t}\n\n\t// default\n\treturn (\n\t\t// Frameless like the loaded default tile: the host owns the inset.\n\t\t<div className={cn('flex flex-col gap-space-sm', className)} aria-busy=\"true\">\n\t\t\t<Bar className=\"h-3 w-20\" />\n\t\t\t<Bar className=\"h-5 w-28\" />\n\t\t\t<Bar className=\"mt-1 h-6 w-full\" />\n\t\t</div>\n\t);\n}\n\nMetricSkeleton.displayName = 'MetricSkeleton';\n","import { useMemo } from 'react';\n\nimport { useFormattingConfig, useMoneyConfig } from '../../../lib/ui-provider';\n\nimport type { FormatMetricValueOptions } from './format-metric-value';\n\n/** Metric formatting policy from UIProvider: locale, default currency and money format. */\nexport function useMetricFormatOptions(): FormatMetricValueOptions {\n\tconst { locale } = useFormattingConfig();\n\tconst { defaultCurrency, formatMode } = useMoneyConfig();\n\treturn useMemo(\n\t\t() => ({ locale, defaultCurrency, moneyFormatMode: formatMode }),\n\t\t[locale, defaultCurrency, formatMode],\n\t);\n}\n"],"mappings":"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"}