@burdenoff/microfe-bigconsole 2026.805.2 → 2026.805.3

package/dist/bigconsole/components/widgets/metric-card/SparklineChart.js

@@ -1,7 +1,8 @@
 import { memo as e, useMemo as t } from "react";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { useI18n as n } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/bigconsole/components/widgets/metric-card/SparklineChart.tsx
-var i = {
+var a = {
 	primary: {
 		stroke: "stroke-action-primary-bg",
 		fill: "fill-action-primary-bg/20"
@@ -22,73 +23,73 @@ var i = {
 		stroke: "stroke-text-secondary",
 		fill: "fill-text-secondary/10"
 	}
-}, a = e(function({ data: e, width: a = 100, height: o = 32, color: s = "primary", showFill: c = !0, strokeWidth: l = 2 }) {
-	let u = t(() => {
+}, o = e(function({ data: e, width: o = 100, height: s = 32, color: c = "primary", showFill: l = !0, strokeWidth: u = 2 }) {
+	let { t: d } = n(), f = t(() => {
 		if (!e.length) return {
 			line: "",
 			area: ""
 		};
-		let t = e.map((e) => e.value), n = Math.min(...t), r = Math.max(...t) - n || 1, i = l, s = a - i * 2, c = o - i * 2, u = e.map((t, a) => ({
-			x: i + a / (e.length - 1) * s,
+		let t = e.map((e) => e.value), n = Math.min(...t), r = Math.max(...t) - n || 1, i = u, a = o - i * 2, c = s - i * 2, l = e.map((t, o) => ({
+			x: i + o / (e.length - 1) * a,
 			y: i + c - (t.value - n) / r * c
-		})), d = u.map((e, t) => `${t === 0 ? "M" : "L"} ${e.x} ${e.y}`).join(" ");
+		})), d = l.map((e, t) => `${t === 0 ? "M" : "L"} ${e.x} ${e.y}`).join(" ");
 		return {
 			line: d,
 			area: `
         ${d}
-        L ${u[u.length - 1].x} ${o - i}
-        L ${i} ${o - i}
+        L ${l[l.length - 1].x} ${s - i}
+        L ${i} ${s - i}
         Z
       `
 		};
 	}, [
 		e,
-		a,
 		o,
-		l
+		s,
+		u
 	]);
-	if (!e.length) return /* @__PURE__ */ n("div", {
+	if (!e.length) return /* @__PURE__ */ r("div", {
 		className: "flex items-center justify-center text-text-secondary",
 		style: {
-			width: a,
-			height: o
+			width: o,
+			height: s
 		},
-		children: /* @__PURE__ */ n("span", {
+		children: /* @__PURE__ */ r("span", {
 			className: "text-xs",
-			children: "No data"
+			children: d("bigconsole.widget.sparkline.noData", "No data")
 		})
 	});
-	let d = i[s];
-	return /* @__PURE__ */ r("svg", {
-		width: a,
-		height: o,
+	let p = a[c];
+	return /* @__PURE__ */ i("svg", {
+		width: o,
+		height: s,
 		className: "overflow-visible",
 		role: "img",
-		"aria-label": "Sparkline chart",
+		"aria-label": d("bigconsole.widget.sparkline.ariaLabel", "Sparkline chart"),
 		children: [
-			c && /* @__PURE__ */ n("path", {
-				d: u.area,
-				className: d.fill,
+			l && /* @__PURE__ */ r("path", {
+				d: f.area,
+				className: p.fill,
 				strokeWidth: 0
 			}),
-			/* @__PURE__ */ n("path", {
-				d: u.line,
-				className: d.stroke,
+			/* @__PURE__ */ r("path", {
+				d: f.line,
+				className: p.stroke,
 				fill: "none",
-				strokeWidth: l,
+				strokeWidth: u,
 				strokeLinecap: "round",
 				strokeLinejoin: "round"
 			}),
-			e.length > 0 && /* @__PURE__ */ n("circle", {
-				cx: a - l,
-				cy: l + (o - l * 2) - (e[e.length - 1].value - Math.min(...e.map((e) => e.value))) / (Math.max(...e.map((e) => e.value)) - Math.min(...e.map((e) => e.value)) || 1) * (o - l * 2),
-				r: l + 1,
-				className: `${d.stroke.replace("stroke-", "fill-")}`
+			e.length > 0 && /* @__PURE__ */ r("circle", {
+				cx: o - u,
+				cy: u + (s - u * 2) - (e[e.length - 1].value - Math.min(...e.map((e) => e.value))) / (Math.max(...e.map((e) => e.value)) - Math.min(...e.map((e) => e.value)) || 1) * (s - u * 2),
+				r: u + 1,
+				className: `${p.stroke.replace("stroke-", "fill-")}`
 			})
 		]
 	});
 });
 //#endregion
-export { a as default };
+export { o as default };
 
 //# sourceMappingURL=SparklineChart.js.map

package/dist/bigconsole/components/widgets/metric-card/SparklineChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"SparklineChart.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/metric-card/SparklineChart.tsx"],"sourcesContent":["/**\n * SparklineChart Component\n *\n * Mini trend chart for metric cards.\n */\n\nimport { type FC, memo, useMemo } from 'react';\n\nexport interface SparklineDataPoint {\n  value: number;\n  timestamp?: string;\n}\n\nexport interface SparklineChartProps {\n  /** Data points for the sparkline */\n  data: SparklineDataPoint[];\n  /** Width of the chart */\n  width?: number;\n  /** Height of the chart */\n  height?: number;\n  /** Line color (uses semantic token) */\n  color?: 'primary' | 'success' | 'error' | 'warning' | 'muted';\n  /** Whether to show the fill area */\n  showFill?: boolean;\n  /** Stroke width */\n  strokeWidth?: number;\n}\n\nconst COLOR_CLASSES = {\n  primary: {\n    stroke: 'stroke-action-primary-bg',\n    fill: 'fill-action-primary-bg/20',\n  },\n  success: {\n    stroke: 'stroke-status-success-bg',\n    fill: 'fill-status-success-bg/20',\n  },\n  error: {\n    stroke: 'stroke-status-error-bg',\n    fill: 'fill-status-error-bg/20',\n  },\n  warning: {\n    stroke: 'stroke-status-warning-bg',\n    fill: 'fill-status-warning-bg/20',\n  },\n  muted: {\n    stroke: 'stroke-text-secondary',\n    fill: 'fill-text-secondary/10',\n  },\n};\n\nexport const SparklineChart: FC<SparklineChartProps> = memo(function SparklineChart({\n  data,\n  width = 100,\n  height = 32,\n  color = 'primary',\n  showFill = true,\n  strokeWidth = 2,\n}) {\n  const pathData = useMemo(() => {\n    if (!data.length) return { line: '', area: '' };\n\n    const values = data.map((d) => d.value);\n    const min = Math.min(...values);\n    const max = Math.max(...values);\n    const range = max - min || 1;\n\n    const padding = strokeWidth;\n    const chartWidth = width - padding * 2;\n    const chartHeight = height - padding * 2;\n\n    const points = data.map((d, i) => {\n      const x = padding + (i / (data.length - 1)) * chartWidth;\n      const y = padding + chartHeight - ((d.value - min) / range) * chartHeight;\n      return { x, y };\n    });\n\n    // Create line path\n    const linePath = points.map((p, i) => `${i === 0 ? 'M' : 'L'} ${p.x} ${p.y}`).join(' ');\n\n    // Create area path (closed shape for fill)\n    const areaPath = `\n        ${linePath}\n        L ${points[points.length - 1].x} ${height - padding}\n        L ${padding} ${height - padding}\n        Z\n      `;\n\n    return { line: linePath, area: areaPath };\n  }, [data, width, height, strokeWidth]);\n\n  if (!data.length) {\n    return (\n      <div className=\"flex items-center justify-center text-text-secondary\" style={{ width, height }}>\n        <span className=\"text-xs\">No data</span>\n      </div>\n    );\n  }\n\n  const colors = COLOR_CLASSES[color];\n\n  return (\n    <svg width={width} height={height} className=\"overflow-visible\" role=\"img\" aria-label=\"Sparkline chart\">\n      {/* Gradient fill */}\n      {showFill && <path d={pathData.area} className={colors.fill} strokeWidth={0} />}\n\n      {/* Line */}\n      <path\n        d={pathData.line}\n        className={colors.stroke}\n        fill=\"none\"\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n\n      {/* End dot */}\n      {data.length > 0 && (\n        <circle\n          cx={width - strokeWidth}\n          cy={\n            strokeWidth +\n            (height - strokeWidth * 2) -\n            ((data[data.length - 1].value - Math.min(...data.map((d) => d.value))) /\n              (Math.max(...data.map((d) => d.value)) - Math.min(...data.map((d) => d.value)) || 1)) *\n              (height - strokeWidth * 2)\n          }\n          r={strokeWidth + 1}\n          className={`${colors.stroke.replace('stroke-', 'fill-')}`}\n        />\n      )}\n    </svg>\n  );\n});\n\nexport default SparklineChart;\n"],"mappings":";;;AA4BA,IAAM,IAAgB;CACpB,SAAS;EACP,QAAQ;EACR,MAAM;EACP;CACD,SAAS;EACP,QAAQ;EACR,MAAM;EACP;CACD,OAAO;EACL,QAAQ;EACR,MAAM;EACP;CACD,SAAS;EACP,QAAQ;EACR,MAAM;EACP;CACD,OAAO;EACL,QAAQ;EACR,MAAM;EACP;CACF,EAEY,IAA0C,EAAK,SAAwB,EAClF,SACA,WAAQ,KACR,YAAS,IACT,WAAQ,WACR,cAAW,IACX,iBAAc,KACb;CACD,IAAM,IAAW,QAAc;AAC7B,MAAI,CAAC,EAAK,OAAQ,QAAO;GAAE,MAAM;GAAI,MAAM;GAAI;EAE/C,IAAM,IAAS,EAAK,KAAK,MAAM,EAAE,MAAM,EACjC,IAAM,KAAK,IAAI,GAAG,EAAO,EAEzB,IADM,KAAK,IAAI,GAAG,EAAO,GACX,KAAO,GAErB,IAAU,GACV,IAAa,IAAQ,IAAU,GAC/B,IAAc,IAAS,IAAU,GAEjC,IAAS,EAAK,KAAK,GAAG,OAGnB;GAAE,GAFC,IAAW,KAAK,EAAK,SAAS,KAAM;GAElC,GADF,IAAU,KAAgB,EAAE,QAAQ,KAAO,IAAS;GAC/C,EACf,EAGI,IAAW,EAAO,KAAK,GAAG,MAAM,GAAG,MAAM,IAAI,MAAM,IAAI,GAAG,EAAE,EAAE,GAAG,EAAE,IAAI,CAAC,KAAK,IAAI;AAUvF,SAAO;GAAE,MAAM;GAAU,MAPR;UACX,EAAS;YACP,EAAO,EAAO,SAAS,GAAG,EAAE,GAAG,IAAS,EAAQ;YAChD,EAAQ,GAAG,IAAS,EAAQ;;;GAIK;IACxC;EAAC;EAAM;EAAO;EAAQ;EAAY,CAAC;AAEtC,KAAI,CAAC,EAAK,OACR,QACE,kBAAC,OAAD;EAAK,WAAU;EAAuD,OAAO;GAAE;GAAO;GAAQ;YAC5F,kBAAC,QAAD;GAAM,WAAU;aAAU;GAAc,CAAA;EACpC,CAAA;CAIV,IAAM,IAAS,EAAc;AAE7B,QACE,kBAAC,OAAD;EAAY;EAAe;EAAQ,WAAU;EAAmB,MAAK;EAAM,cAAW;YAAtF;GAEG,KAAY,kBAAC,QAAD;IAAM,GAAG,EAAS;IAAM,WAAW,EAAO;IAAM,aAAa;IAAK,CAAA;GAG/E,kBAAC,QAAD;IACE,GAAG,EAAS;IACZ,WAAW,EAAO;IAClB,MAAK;IACQ;IACb,eAAc;IACd,gBAAe;IACf,CAAA;GAGD,EAAK,SAAS,KACb,kBAAC,UAAD;IACE,IAAI,IAAQ;IACZ,IACE,KACC,IAAS,IAAc,MACtB,EAAK,EAAK,SAAS,GAAG,QAAQ,KAAK,IAAI,GAAG,EAAK,KAAK,MAAM,EAAE,MAAM,CAAC,KAClE,KAAK,IAAI,GAAG,EAAK,KAAK,MAAM,EAAE,MAAM,CAAC,GAAG,KAAK,IAAI,GAAG,EAAK,KAAK,MAAM,EAAE,MAAM,CAAC,IAAI,MACjF,IAAS,IAAc;IAE5B,GAAG,IAAc;IACjB,WAAW,GAAG,EAAO,OAAO,QAAQ,WAAW,QAAQ;IACvD,CAAA;GAEA;;EAER"}
+{"version":3,"file":"SparklineChart.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/metric-card/SparklineChart.tsx"],"sourcesContent":["/**\n * SparklineChart Component\n *\n * Mini trend chart for metric cards.\n */\n\nimport { type FC, memo, useMemo } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\n\nexport interface SparklineDataPoint {\n  value: number;\n  timestamp?: string;\n}\n\nexport interface SparklineChartProps {\n  /** Data points for the sparkline */\n  data: SparklineDataPoint[];\n  /** Width of the chart */\n  width?: number;\n  /** Height of the chart */\n  height?: number;\n  /** Line color (uses semantic token) */\n  color?: 'primary' | 'success' | 'error' | 'warning' | 'muted';\n  /** Whether to show the fill area */\n  showFill?: boolean;\n  /** Stroke width */\n  strokeWidth?: number;\n}\n\nconst COLOR_CLASSES = {\n  primary: {\n    stroke: 'stroke-action-primary-bg',\n    fill: 'fill-action-primary-bg/20',\n  },\n  success: {\n    stroke: 'stroke-status-success-bg',\n    fill: 'fill-status-success-bg/20',\n  },\n  error: {\n    stroke: 'stroke-status-error-bg',\n    fill: 'fill-status-error-bg/20',\n  },\n  warning: {\n    stroke: 'stroke-status-warning-bg',\n    fill: 'fill-status-warning-bg/20',\n  },\n  muted: {\n    stroke: 'stroke-text-secondary',\n    fill: 'fill-text-secondary/10',\n  },\n};\n\nexport const SparklineChart: FC<SparklineChartProps> = memo(function SparklineChart({\n  data,\n  width = 100,\n  height = 32,\n  color = 'primary',\n  showFill = true,\n  strokeWidth = 2,\n}) {\n  const { t } = useI18n();\n  const pathData = useMemo(() => {\n    if (!data.length) return { line: '', area: '' };\n\n    const values = data.map((d) => d.value);\n    const min = Math.min(...values);\n    const max = Math.max(...values);\n    const range = max - min || 1;\n\n    const padding = strokeWidth;\n    const chartWidth = width - padding * 2;\n    const chartHeight = height - padding * 2;\n\n    const points = data.map((d, i) => {\n      const x = padding + (i / (data.length - 1)) * chartWidth;\n      const y = padding + chartHeight - ((d.value - min) / range) * chartHeight;\n      return { x, y };\n    });\n\n    // Create line path\n    const linePath = points.map((p, i) => `${i === 0 ? 'M' : 'L'} ${p.x} ${p.y}`).join(' ');\n\n    // Create area path (closed shape for fill)\n    const areaPath = `\n        ${linePath}\n        L ${points[points.length - 1].x} ${height - padding}\n        L ${padding} ${height - padding}\n        Z\n      `;\n\n    return { line: linePath, area: areaPath };\n  }, [data, width, height, strokeWidth]);\n\n  if (!data.length) {\n    return (\n      <div className=\"flex items-center justify-center text-text-secondary\" style={{ width, height }}>\n        <span className=\"text-xs\">{t('bigconsole.widget.sparkline.noData', 'No data')}</span>\n      </div>\n    );\n  }\n\n  const colors = COLOR_CLASSES[color];\n\n  return (\n    <svg\n      width={width}\n      height={height}\n      className=\"overflow-visible\"\n      role=\"img\"\n      aria-label={t('bigconsole.widget.sparkline.ariaLabel', 'Sparkline chart')}\n    >\n      {/* Gradient fill */}\n      {showFill && <path d={pathData.area} className={colors.fill} strokeWidth={0} />}\n\n      {/* Line */}\n      <path\n        d={pathData.line}\n        className={colors.stroke}\n        fill=\"none\"\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n\n      {/* End dot */}\n      {data.length > 0 && (\n        <circle\n          cx={width - strokeWidth}\n          cy={\n            strokeWidth +\n            (height - strokeWidth * 2) -\n            ((data[data.length - 1].value - Math.min(...data.map((d) => d.value))) /\n              (Math.max(...data.map((d) => d.value)) - Math.min(...data.map((d) => d.value)) || 1)) *\n              (height - strokeWidth * 2)\n          }\n          r={strokeWidth + 1}\n          className={`${colors.stroke.replace('stroke-', 'fill-')}`}\n        />\n      )}\n    </svg>\n  );\n});\n\nexport default SparklineChart;\n"],"mappings":";;;;AA6BA,IAAM,IAAgB;CACpB,SAAS;EACP,QAAQ;EACR,MAAM;EACP;CACD,SAAS;EACP,QAAQ;EACR,MAAM;EACP;CACD,OAAO;EACL,QAAQ;EACR,MAAM;EACP;CACD,SAAS;EACP,QAAQ;EACR,MAAM;EACP;CACD,OAAO;EACL,QAAQ;EACR,MAAM;EACP;CACF,EAEY,IAA0C,EAAK,SAAwB,EAClF,SACA,WAAQ,KACR,YAAS,IACT,WAAQ,WACR,cAAW,IACX,iBAAc,KACb;CACD,IAAM,EAAE,SAAM,GAAS,EACjB,IAAW,QAAc;AAC7B,MAAI,CAAC,EAAK,OAAQ,QAAO;GAAE,MAAM;GAAI,MAAM;GAAI;EAE/C,IAAM,IAAS,EAAK,KAAK,MAAM,EAAE,MAAM,EACjC,IAAM,KAAK,IAAI,GAAG,EAAO,EAEzB,IADM,KAAK,IAAI,GAAG,EAAO,GACX,KAAO,GAErB,IAAU,GACV,IAAa,IAAQ,IAAU,GAC/B,IAAc,IAAS,IAAU,GAEjC,IAAS,EAAK,KAAK,GAAG,OAGnB;GAAE,GAFC,IAAW,KAAK,EAAK,SAAS,KAAM;GAElC,GADF,IAAU,KAAgB,EAAE,QAAQ,KAAO,IAAS;GAC/C,EACf,EAGI,IAAW,EAAO,KAAK,GAAG,MAAM,GAAG,MAAM,IAAI,MAAM,IAAI,GAAG,EAAE,EAAE,GAAG,EAAE,IAAI,CAAC,KAAK,IAAI;AAUvF,SAAO;GAAE,MAAM;GAAU,MAPR;UACX,EAAS;YACP,EAAO,EAAO,SAAS,GAAG,EAAE,GAAG,IAAS,EAAQ;YAChD,EAAQ,GAAG,IAAS,EAAQ;;;GAIK;IACxC;EAAC;EAAM;EAAO;EAAQ;EAAY,CAAC;AAEtC,KAAI,CAAC,EAAK,OACR,QACE,kBAAC,OAAD;EAAK,WAAU;EAAuD,OAAO;GAAE;GAAO;GAAQ;YAC5F,kBAAC,QAAD;GAAM,WAAU;aAAW,EAAE,sCAAsC,UAAU;GAAQ,CAAA;EACjF,CAAA;CAIV,IAAM,IAAS,EAAc;AAE7B,QACE,kBAAC,OAAD;EACS;EACC;EACR,WAAU;EACV,MAAK;EACL,cAAY,EAAE,yCAAyC,kBAAkB;YAL3E;GAQG,KAAY,kBAAC,QAAD;IAAM,GAAG,EAAS;IAAM,WAAW,EAAO;IAAM,aAAa;IAAK,CAAA;GAG/E,kBAAC,QAAD;IACE,GAAG,EAAS;IACZ,WAAW,EAAO;IAClB,MAAK;IACQ;IACb,eAAc;IACd,gBAAe;IACf,CAAA;GAGD,EAAK,SAAS,KACb,kBAAC,UAAD;IACE,IAAI,IAAQ;IACZ,IACE,KACC,IAAS,IAAc,MACtB,EAAK,EAAK,SAAS,GAAG,QAAQ,KAAK,IAAI,GAAG,EAAK,KAAK,MAAM,EAAE,MAAM,CAAC,KAClE,KAAK,IAAI,GAAG,EAAK,KAAK,MAAM,EAAE,MAAM,CAAC,GAAG,KAAK,IAAI,GAAG,EAAK,KAAK,MAAM,EAAE,MAAM,CAAC,IAAI,MACjF,IAAS,IAAc;IAE5B,GAAG,IAAc;IACjB,WAAW,GAAG,EAAO,OAAO,QAAQ,WAAW,QAAQ;IACvD,CAAA;GAEA;;EAER"}

package/dist/bigconsole/components/widgets/metric-card/TrendIndicator.js

@@ -1,47 +1,48 @@
 import { memo as e } from "react";
-import { jsx as t } from "react/jsx-runtime";
+import { useI18n as t } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { jsx as n } from "react/jsx-runtime";
 //#region src/bigconsole/components/widgets/metric-card/TrendIndicator.tsx
-var n = {
+var r = {
 	sm: "w-3 h-3",
 	md: "w-4 h-4",
 	lg: "w-5 h-5"
-}, r = e(function({ direction: e, size: r = "md", positiveIsGood: i = !0 }) {
-	let a = () => {
+}, i = e(function({ direction: e, size: i = "md", positiveIsGood: a = !0 }) {
+	let { t: o } = t(), s = () => {
 		if (e === "flat") return "text-text-secondary";
 		let t = e === "up";
-		return (i ? t : !t) ? "text-status-success-text" : "text-status-error-text";
-	}, o = n[r], s = a();
-	return e === "flat" ? /* @__PURE__ */ t("svg", {
-		className: `${o} ${s}`,
+		return (a ? t : !t) ? "text-status-success-text" : "text-status-error-text";
+	}, c = r[i], l = s();
+	return e === "flat" ? /* @__PURE__ */ n("svg", {
+		className: `${c} ${l}`,
 		fill: "none",
 		stroke: "currentColor",
 		viewBox: "0 0 24 24",
-		"aria-label": "No change",
-		children: /* @__PURE__ */ t("path", {
+		"aria-label": o("bigconsole.widget.trend.noChange", "No change"),
+		children: /* @__PURE__ */ n("path", {
 			strokeLinecap: "round",
 			strokeLinejoin: "round",
 			strokeWidth: 2,
 			d: "M5 12h14"
 		})
-	}) : e === "up" ? /* @__PURE__ */ t("svg", {
-		className: `${o} ${s}`,
+	}) : e === "up" ? /* @__PURE__ */ n("svg", {
+		className: `${c} ${l}`,
 		fill: "none",
 		stroke: "currentColor",
 		viewBox: "0 0 24 24",
-		"aria-label": "Trending up",
-		children: /* @__PURE__ */ t("path", {
+		"aria-label": o("bigconsole.widget.trend.up", "Trending up"),
+		children: /* @__PURE__ */ n("path", {
 			strokeLinecap: "round",
 			strokeLinejoin: "round",
 			strokeWidth: 2,
 			d: "M5 15l7-7 7 7"
 		})
-	}) : /* @__PURE__ */ t("svg", {
-		className: `${o} ${s}`,
+	}) : /* @__PURE__ */ n("svg", {
+		className: `${c} ${l}`,
 		fill: "none",
 		stroke: "currentColor",
 		viewBox: "0 0 24 24",
-		"aria-label": "Trending down",
-		children: /* @__PURE__ */ t("path", {
+		"aria-label": o("bigconsole.widget.trend.down", "Trending down"),
+		children: /* @__PURE__ */ n("path", {
 			strokeLinecap: "round",
 			strokeLinejoin: "round",
 			strokeWidth: 2,
@@ -50,6 +51,6 @@ var n = {
 	});
 });
 //#endregion
-export { r as default };
+export { i as default };
 
 //# sourceMappingURL=TrendIndicator.js.map

package/dist/bigconsole/components/widgets/metric-card/TrendIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"TrendIndicator.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/metric-card/TrendIndicator.tsx"],"sourcesContent":["/**\n * TrendIndicator Component\n *\n * Displays up/down/flat trend arrow with color coding.\n */\n\nimport { type FC, memo } from 'react';\n\nexport type TrendDirection = 'up' | 'down' | 'flat';\n\nexport interface TrendIndicatorProps {\n  /** Direction of the trend */\n  direction: TrendDirection;\n  /** Size variant */\n  size?: 'sm' | 'md' | 'lg';\n  /** Whether positive trend is good (default true for metrics like revenue) */\n  positiveIsGood?: boolean;\n}\n\nconst SIZE_CLASSES = {\n  sm: 'w-3 h-3',\n  md: 'w-4 h-4',\n  lg: 'w-5 h-5',\n};\n\nexport const TrendIndicator: FC<TrendIndicatorProps> = memo(function TrendIndicator({\n  direction,\n  size = 'md',\n  positiveIsGood = true,\n}) {\n  // Determine color based on direction and whether positive is good\n  const getColorClass = (): string => {\n    if (direction === 'flat') {\n      return 'text-text-secondary';\n    }\n\n    const isPositive = direction === 'up';\n    const isGood = positiveIsGood ? isPositive : !isPositive;\n\n    return isGood ? 'text-status-success-text' : 'text-status-error-text';\n  };\n\n  const sizeClass = SIZE_CLASSES[size];\n  const colorClass = getColorClass();\n\n  if (direction === 'flat') {\n    return (\n      <svg\n        className={`${sizeClass} ${colorClass}`}\n        fill=\"none\"\n        stroke=\"currentColor\"\n        viewBox=\"0 0 24 24\"\n        aria-label=\"No change\"\n      >\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M5 12h14\" />\n      </svg>\n    );\n  }\n\n  if (direction === 'up') {\n    return (\n      <svg\n        className={`${sizeClass} ${colorClass}`}\n        fill=\"none\"\n        stroke=\"currentColor\"\n        viewBox=\"0 0 24 24\"\n        aria-label=\"Trending up\"\n      >\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M5 15l7-7 7 7\" />\n      </svg>\n    );\n  }\n\n  return (\n    <svg\n      className={`${sizeClass} ${colorClass}`}\n      fill=\"none\"\n      stroke=\"currentColor\"\n      viewBox=\"0 0 24 24\"\n      aria-label=\"Trending down\"\n    >\n      <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M19 9l-7 7-7-7\" />\n    </svg>\n  );\n});\n\nexport default TrendIndicator;\n"],"mappings":";;;AAmBA,IAAM,IAAe;CACnB,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAEY,IAA0C,EAAK,SAAwB,EAClF,cACA,UAAO,MACP,oBAAiB,MAChB;CAED,IAAM,UAA8B;AAClC,MAAI,MAAc,OAChB,QAAO;EAGT,IAAM,IAAa,MAAc;AAGjC,UAFe,IAAiB,IAAa,CAAC,KAE9B,6BAA6B;IAGzC,IAAY,EAAa,IACzB,IAAa,GAAe;AA8BlC,QA5BI,MAAc,SAEd,kBAAC,OAAD;EACE,WAAW,GAAG,EAAU,GAAG;EAC3B,MAAK;EACL,QAAO;EACP,SAAQ;EACR,cAAW;YAEX,kBAAC,QAAD;GAAM,eAAc;GAAQ,gBAAe;GAAQ,aAAa;GAAG,GAAE;GAAa,CAAA;EAC9E,CAAA,GAIN,MAAc,OAEd,kBAAC,OAAD;EACE,WAAW,GAAG,EAAU,GAAG;EAC3B,MAAK;EACL,QAAO;EACP,SAAQ;EACR,cAAW;YAEX,kBAAC,QAAD;GAAM,eAAc;GAAQ,gBAAe;GAAQ,aAAa;GAAG,GAAE;GAAkB,CAAA;EACnF,CAAA,GAKR,kBAAC,OAAD;EACE,WAAW,GAAG,EAAU,GAAG;EAC3B,MAAK;EACL,QAAO;EACP,SAAQ;EACR,cAAW;YAEX,kBAAC,QAAD;GAAM,eAAc;GAAQ,gBAAe;GAAQ,aAAa;GAAG,GAAE;GAAmB,CAAA;EACpF,CAAA;EAER"}
+{"version":3,"file":"TrendIndicator.js","names":[],"sources":["../../../../../src/bigconsole/components/widgets/metric-card/TrendIndicator.tsx"],"sourcesContent":["/**\n * TrendIndicator Component\n *\n * Displays up/down/flat trend arrow with color coding.\n */\n\nimport { type FC, memo } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\n\nexport type TrendDirection = 'up' | 'down' | 'flat';\n\nexport interface TrendIndicatorProps {\n  /** Direction of the trend */\n  direction: TrendDirection;\n  /** Size variant */\n  size?: 'sm' | 'md' | 'lg';\n  /** Whether positive trend is good (default true for metrics like revenue) */\n  positiveIsGood?: boolean;\n}\n\nconst SIZE_CLASSES = {\n  sm: 'w-3 h-3',\n  md: 'w-4 h-4',\n  lg: 'w-5 h-5',\n};\n\nexport const TrendIndicator: FC<TrendIndicatorProps> = memo(function TrendIndicator({\n  direction,\n  size = 'md',\n  positiveIsGood = true,\n}) {\n  const { t } = useI18n();\n  // Determine color based on direction and whether positive is good\n  const getColorClass = (): string => {\n    if (direction === 'flat') {\n      return 'text-text-secondary';\n    }\n\n    const isPositive = direction === 'up';\n    const isGood = positiveIsGood ? isPositive : !isPositive;\n\n    return isGood ? 'text-status-success-text' : 'text-status-error-text';\n  };\n\n  const sizeClass = SIZE_CLASSES[size];\n  const colorClass = getColorClass();\n\n  if (direction === 'flat') {\n    return (\n      <svg\n        className={`${sizeClass} ${colorClass}`}\n        fill=\"none\"\n        stroke=\"currentColor\"\n        viewBox=\"0 0 24 24\"\n        aria-label={t('bigconsole.widget.trend.noChange', 'No change')}\n      >\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M5 12h14\" />\n      </svg>\n    );\n  }\n\n  if (direction === 'up') {\n    return (\n      <svg\n        className={`${sizeClass} ${colorClass}`}\n        fill=\"none\"\n        stroke=\"currentColor\"\n        viewBox=\"0 0 24 24\"\n        aria-label={t('bigconsole.widget.trend.up', 'Trending up')}\n      >\n        <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M5 15l7-7 7 7\" />\n      </svg>\n    );\n  }\n\n  return (\n    <svg\n      className={`${sizeClass} ${colorClass}`}\n      fill=\"none\"\n      stroke=\"currentColor\"\n      viewBox=\"0 0 24 24\"\n      aria-label={t('bigconsole.widget.trend.down', 'Trending down')}\n    >\n      <path strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth={2} d=\"M19 9l-7 7-7-7\" />\n    </svg>\n  );\n});\n\nexport default TrendIndicator;\n"],"mappings":";;;;AAoBA,IAAM,IAAe;CACnB,IAAI;CACJ,IAAI;CACJ,IAAI;CACL,EAEY,IAA0C,EAAK,SAAwB,EAClF,cACA,UAAO,MACP,oBAAiB,MAChB;CACD,IAAM,EAAE,SAAM,GAAS,EAEjB,UAA8B;AAClC,MAAI,MAAc,OAChB,QAAO;EAGT,IAAM,IAAa,MAAc;AAGjC,UAFe,IAAiB,IAAa,CAAC,KAE9B,6BAA6B;IAGzC,IAAY,EAAa,IACzB,IAAa,GAAe;AA8BlC,QA5BI,MAAc,SAEd,kBAAC,OAAD;EACE,WAAW,GAAG,EAAU,GAAG;EAC3B,MAAK;EACL,QAAO;EACP,SAAQ;EACR,cAAY,EAAE,oCAAoC,YAAY;YAE9D,kBAAC,QAAD;GAAM,eAAc;GAAQ,gBAAe;GAAQ,aAAa;GAAG,GAAE;GAAa,CAAA;EAC9E,CAAA,GAIN,MAAc,OAEd,kBAAC,OAAD;EACE,WAAW,GAAG,EAAU,GAAG;EAC3B,MAAK;EACL,QAAO;EACP,SAAQ;EACR,cAAY,EAAE,8BAA8B,cAAc;YAE1D,kBAAC,QAAD;GAAM,eAAc;GAAQ,gBAAe;GAAQ,aAAa;GAAG,GAAE;GAAkB,CAAA;EACnF,CAAA,GAKR,kBAAC,OAAD;EACE,WAAW,GAAG,EAAU,GAAG;EAC3B,MAAK;EACL,QAAO;EACP,SAAQ;EACR,cAAY,EAAE,gCAAgC,gBAAgB;YAE9D,kBAAC,QAAD;GAAM,eAAc;GAAQ,gBAAe;GAAQ,aAAa;GAAG,GAAE;GAAmB,CAAA;EACpF,CAAA;EAER"}