@burdenoff/microfe-vibecontrols 2026.624.3 → 2026.625.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/shared/Card.js +3 -3
- package/dist/components/shared/Card.js.map +1 -1
- package/dist/components/shared/StatCard.js +29 -22
- package/dist/components/shared/StatCard.js.map +1 -1
- package/dist/pages/ActionsPage.js +131 -134
- package/dist/pages/ActionsPage.js.map +1 -1
- package/dist/pages/AnalyticsPage.js +79 -77
- package/dist/pages/AnalyticsPage.js.map +1 -1
- package/dist/pages/CatalogPage.js +120 -122
- package/dist/pages/CatalogPage.js.map +1 -1
- package/dist/pages/ComponentsPage.js +67 -69
- package/dist/pages/ComponentsPage.js.map +1 -1
- package/dist/pages/GettingStartedPage.js +104 -99
- package/dist/pages/GettingStartedPage.js.map +1 -1
- package/dist/pages/HealthPage.js +91 -91
- package/dist/pages/HealthPage.js.map +1 -1
- package/dist/pages/OverviewPage.js +80 -79
- package/dist/pages/OverviewPage.js.map +1 -1
- package/dist/pages/SettingsPage.js +57 -58
- package/dist/pages/SettingsPage.js.map +1 -1
- package/dist/pages/VibesPage.js +180 -181
- package/dist/pages/VibesPage.js.map +1 -1
- package/dist/pages/WebhooksPage.js +329 -330
- package/dist/pages/WebhooksPage.js.map +1 -1
- package/package.json +2 -2
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { jsx as e } from "react/jsx-runtime";
|
|
2
2
|
//#region src/components/shared/Card.tsx
|
|
3
3
|
function t({ children: t, className: n = "", onClick: r, hoverable: i = !1, padding: a = "md" }) {
|
|
4
|
-
let o =
|
|
4
|
+
let o = {
|
|
5
5
|
none: "",
|
|
6
6
|
sm: "p-4",
|
|
7
7
|
md: "p-5",
|
|
8
8
|
lg: "p-6"
|
|
9
|
-
}[a]}`;
|
|
9
|
+
}, s = i || !!r, c = `bg-bg-surface border border-border-seam rounded-card ${s ? "shadow-[var(--shadow-pop)]" : "shadow-elevation-1"} ${o[a]}`;
|
|
10
10
|
return /* @__PURE__ */ e(r ? "button" : "div", {
|
|
11
|
-
className: `${
|
|
11
|
+
className: `${c} ${s ? " [@media(hover:none)]: hover:shadow-elevation-2 transition-[box-shadow,transform] duration-200 ease-[var(--motion-easing-out)] cursor-pointer" : ""} ${n}`,
|
|
12
12
|
onClick: r,
|
|
13
13
|
children: t
|
|
14
14
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Card.js","names":[],"sources":["../../../src/components/shared/Card.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\ninterface CardProps {\n children: ReactNode;\n className?: string;\n onClick?: () => void;\n hoverable?: boolean;\n padding?: 'none' | 'sm' | 'md' | 'lg';\n}\n\nexport function Card({\n children,\n className = '',\n onClick,\n hoverable = false,\n padding = 'md',\n}: CardProps) {\n const paddingStyles = {\n none: '',\n sm: 'p-4',\n md: 'p-5',\n lg: 'p-6',\n };\n\n const
|
|
1
|
+
{"version":3,"file":"Card.js","names":[],"sources":["../../../src/components/shared/Card.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\ninterface CardProps {\n children: ReactNode;\n className?: string;\n onClick?: () => void;\n hoverable?: boolean;\n padding?: 'none' | 'sm' | 'md' | 'lg';\n}\n\nexport function Card({\n children,\n className = '',\n onClick,\n hoverable = false,\n padding = 'md',\n}: CardProps) {\n const paddingStyles = {\n none: '',\n sm: 'p-4',\n md: 'p-5',\n lg: 'p-6',\n };\n\n const isInteractive = hoverable || !!onClick;\n\n // Boff UI 2.0 surface: seam border (visible-but-subtle, theme-aware) over the\n // surface token. Interactive cards get the soft \"pop\" shadow + the built-in\n // motion-safe pop-lift (no extra hover translate); reduced-motion + touch are\n // handled globally / by the underlying tokens so the lift is safe.\n const baseStyles = `bg-bg-surface border border-border-seam rounded-card ${\n isInteractive ? 'shadow-[var(--shadow-pop)]' : 'shadow-elevation-1'\n } ${paddingStyles[padding]}`;\n\n const interactiveStyles = isInteractive\n ? ' [@media(hover:none)]: hover:shadow-elevation-2 transition-[box-shadow,transform] duration-200 ease-[var(--motion-easing-out)] cursor-pointer'\n : '';\n\n const Component = onClick ? 'button' : 'div';\n\n return (\n <Component className={`${baseStyles} ${interactiveStyles} ${className}`} onClick={onClick}>\n {children}\n </Component>\n );\n}\n\ninterface CardHeaderProps {\n title: string;\n subtitle?: string;\n action?: ReactNode;\n icon?: ReactNode;\n}\n\nexport function CardHeader({ title, subtitle, action, icon }: CardHeaderProps) {\n return (\n <div className=\"flex items-start justify-between gap-3 mb-4\">\n <div className=\"flex items-start gap-3 min-w-0\">\n {icon && (\n <div className=\"flex-shrink-0 size-9 rounded-lg bg-[var(--color-accent-soft)] flex items-center justify-center\">\n {icon}\n </div>\n )}\n <div className=\"min-w-0\">\n <h3 className=\"font-semibold text-text-primary truncate tracking-tight\">{title}</h3>\n {subtitle && <p className=\"text-sm text-text-secondary truncate\">{subtitle}</p>}\n </div>\n </div>\n {action && <div className=\"flex-shrink-0\">{action}</div>}\n </div>\n );\n}\n\ninterface CardContentProps {\n children: ReactNode;\n className?: string;\n}\n\nexport function CardContent({ children, className = '' }: CardContentProps) {\n return <div className={className}>{children}</div>;\n}\n\ninterface CardFooterProps {\n children: ReactNode;\n className?: string;\n}\n\nexport function CardFooter({ children, className = '' }: CardFooterProps) {\n return <div className={`mt-5 pt-4 border-t border-border-seam ${className}`}>{children}</div>;\n}\n"],"mappings":";;AAUA,SAAgB,EAAK,EACnB,aACA,eAAY,IACZ,YACA,eAAY,IACZ,aAAU,QACE;CACZ,IAAM,IAAgB;EACpB,MAAM;EACN,IAAI;EACJ,IAAI;EACJ,IAAI;EACL,EAEK,IAAgB,KAAa,CAAC,CAAC,GAM/B,IAAa,wDACjB,IAAgB,+BAA+B,qBAChD,GAAG,EAAc;AAQlB,QACE,kBAHgB,IAAU,WAAW,OAGrC;EAAW,WAAW,GAAG,EAAW,GAPZ,IACtB,kJACA,GAKuD,GAAG;EAAsB;EAC/E;EACS,CAAA"}
|
|
@@ -1,16 +1,23 @@
|
|
|
1
1
|
import { Minus as e, TrendingDown as t, TrendingUp as n } from "lucide-react";
|
|
2
2
|
import { jsx as r, jsxs as i } from "react/jsx-runtime";
|
|
3
|
-
import {
|
|
3
|
+
import { GlassCard as a } from "@burdenoff/fe-libs/ui";
|
|
4
|
+
import { AnimatedCounter as o } from "@burdenoff/fe-libs/shared/motion";
|
|
4
5
|
//#region src/components/shared/StatCard.tsx
|
|
5
|
-
function
|
|
6
|
-
return /* @__PURE__ */ r(
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
6
|
+
function s({ title: s, value: c, subtitle: l, icon: u, trend: d, variant: f = "default", onClick: p }) {
|
|
7
|
+
return /* @__PURE__ */ r(a, {
|
|
8
|
+
treatment: "metric",
|
|
9
|
+
onClick: p,
|
|
10
|
+
role: p ? "button" : void 0,
|
|
11
|
+
tabIndex: p ? 0 : void 0,
|
|
12
|
+
onKeyDown: p ? (e) => {
|
|
13
|
+
(e.key === "Enter" || e.key === " ") && (e.preventDefault(), p());
|
|
14
|
+
} : void 0,
|
|
15
|
+
className: `p-5 ${{
|
|
16
|
+
default: "",
|
|
10
17
|
success: "bg-status-success-bg-subtle",
|
|
11
18
|
warning: "bg-status-warning-bg-subtle",
|
|
12
19
|
error: "bg-status-error-bg-subtle"
|
|
13
|
-
}[
|
|
20
|
+
}[f]} ${p ? "cursor-pointer text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2 focus-visible:ring-offset-bg-canvas" : ""}`,
|
|
14
21
|
children: /* @__PURE__ */ i("div", {
|
|
15
22
|
className: "flex flex-col gap-2.5",
|
|
16
23
|
children: [
|
|
@@ -18,40 +25,40 @@ function o({ title: o, value: s, subtitle: c, icon: l, trend: u, variant: d = "d
|
|
|
18
25
|
className: "flex items-center justify-between",
|
|
19
26
|
children: [/* @__PURE__ */ r("p", {
|
|
20
27
|
className: "text-sm font-medium text-text-secondary",
|
|
21
|
-
children:
|
|
22
|
-
}),
|
|
28
|
+
children: s
|
|
29
|
+
}), u && /* @__PURE__ */ r("div", {
|
|
23
30
|
className: `flex-shrink-0 size-9 rounded-lg flex items-center justify-center ${{
|
|
24
31
|
default: "bg-[var(--color-accent-soft)] text-text-primary",
|
|
25
32
|
success: "bg-status-success-bg-subtle text-status-success-text",
|
|
26
33
|
warning: "bg-status-warning-bg-subtle text-status-warning-text",
|
|
27
34
|
error: "bg-status-error-bg-subtle text-status-error-text"
|
|
28
|
-
}[
|
|
29
|
-
children:
|
|
35
|
+
}[f]} [&>svg]:w-4 [&>svg]:h-4`,
|
|
36
|
+
children: u
|
|
30
37
|
})]
|
|
31
38
|
}),
|
|
32
39
|
/* @__PURE__ */ r("div", {
|
|
33
40
|
className: "text-2xl font-semibold text-text-primary tabular-nums",
|
|
34
|
-
children: typeof
|
|
41
|
+
children: typeof c == "number" ? /* @__PURE__ */ r(o, { value: c }) : c
|
|
35
42
|
}),
|
|
36
|
-
|
|
43
|
+
l && /* @__PURE__ */ r("p", {
|
|
37
44
|
className: "text-xs text-text-secondary",
|
|
38
|
-
children:
|
|
45
|
+
children: l
|
|
39
46
|
}),
|
|
40
|
-
|
|
47
|
+
d && /* @__PURE__ */ i("div", {
|
|
41
48
|
className: "flex items-center gap-1",
|
|
42
49
|
children: [
|
|
43
|
-
|
|
50
|
+
d.value > 0 ? /* @__PURE__ */ r(n, { className: "size-4 text-status-success-text" }) : d.value < 0 ? /* @__PURE__ */ r(t, { className: "size-4 text-status-error-text" }) : /* @__PURE__ */ r(e, { className: "size-4 text-text-secondary" }),
|
|
44
51
|
/* @__PURE__ */ i("span", {
|
|
45
|
-
className: `text-xs font-medium tabular-nums ${
|
|
52
|
+
className: `text-xs font-medium tabular-nums ${d.value > 0 ? "text-status-success-text" : d.value < 0 ? "text-status-error-text" : "text-text-secondary"}`,
|
|
46
53
|
children: [
|
|
47
|
-
|
|
48
|
-
|
|
54
|
+
d.value > 0 ? "+" : "",
|
|
55
|
+
d.value,
|
|
49
56
|
"%"
|
|
50
57
|
]
|
|
51
58
|
}),
|
|
52
|
-
|
|
59
|
+
d.label && /* @__PURE__ */ r("span", {
|
|
53
60
|
className: "text-xs text-text-secondary",
|
|
54
|
-
children:
|
|
61
|
+
children: d.label
|
|
55
62
|
})
|
|
56
63
|
]
|
|
57
64
|
})
|
|
@@ -60,6 +67,6 @@ function o({ title: o, value: s, subtitle: c, icon: l, trend: u, variant: d = "d
|
|
|
60
67
|
});
|
|
61
68
|
}
|
|
62
69
|
//#endregion
|
|
63
|
-
export {
|
|
70
|
+
export { s as StatCard };
|
|
64
71
|
|
|
65
72
|
//# sourceMappingURL=StatCard.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StatCard.js","names":[],"sources":["../../../src/components/shared/StatCard.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { TrendingUp, TrendingDown, Minus } from 'lucide-react';\nimport { AnimatedCounter } from '@burdenoff/fe-libs/shared/motion';\n\ninterface StatCardProps {\n title: string;\n value: string | number;\n subtitle?: string;\n icon?: ReactNode;\n trend?: {\n value: number;\n label?: string;\n };\n variant?: 'default' | 'success' | 'warning' | 'error';\n onClick?: () => void;\n}\n\nexport function StatCard({\n title,\n value,\n subtitle,\n icon,\n trend,\n variant = 'default',\n onClick,\n}: StatCardProps) {\n const
|
|
1
|
+
{"version":3,"file":"StatCard.js","names":[],"sources":["../../../src/components/shared/StatCard.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { TrendingUp, TrendingDown, Minus } from 'lucide-react';\nimport { AnimatedCounter } from '@burdenoff/fe-libs/shared/motion';\nimport { GlassCard } from '@burdenoff/fe-libs/ui';\n\ninterface StatCardProps {\n title: string;\n value: string | number;\n subtitle?: string;\n icon?: ReactNode;\n trend?: {\n value: number;\n label?: string;\n };\n variant?: 'default' | 'success' | 'warning' | 'error';\n onClick?: () => void;\n}\n\nexport function StatCard({\n title,\n value,\n subtitle,\n icon,\n trend,\n variant = 'default',\n onClick,\n}: StatCardProps) {\n // Status tiles keep their semantic tint; the neutral/default tile leans on\n // the Boff UI 2.0 GlassCard \"metric\" treatment (accent wash + seam border +\n // soft pop-lift) so KPIs read as elevated-but-quiet glass surfaces.\n const variantWash = {\n default: '',\n success: 'bg-status-success-bg-subtle',\n warning: 'bg-status-warning-bg-subtle',\n error: 'bg-status-error-bg-subtle',\n };\n\n // Subtle tint + same-hue saturated text (passes AA in both themes); the old\n // solid `bg-status-X-bg` + `text-status-X-text` was same-hue low-contrast.\n // The neutral/default tile uses the brand accent wash so metric cards lead\n // with the theme accent rather than a flat grey.\n const iconVariantStyles = {\n default: 'bg-[var(--color-accent-soft)] text-text-primary',\n success: 'bg-status-success-bg-subtle text-status-success-text',\n warning: 'bg-status-warning-bg-subtle text-status-warning-text',\n error: 'bg-status-error-bg-subtle text-status-error-text',\n };\n\n return (\n <GlassCard\n treatment=\"metric\"\n onClick={onClick}\n role={onClick ? 'button' : undefined}\n tabIndex={onClick ? 0 : undefined}\n onKeyDown={\n onClick\n ? (e) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onClick();\n }\n }\n : undefined\n }\n className={`p-5 ${variantWash[variant]} ${\n onClick\n ? 'cursor-pointer text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus focus-visible:ring-offset-2 focus-visible:ring-offset-bg-canvas'\n : ''\n }`}\n >\n <div className=\"flex flex-col gap-2.5\">\n <div className=\"flex items-center justify-between\">\n <p className=\"text-sm font-medium text-text-secondary\">{title}</p>\n {icon && (\n <div\n className={`flex-shrink-0 size-9 rounded-lg flex items-center justify-center ${iconVariantStyles[variant]} [&>svg]:w-4 [&>svg]:h-4`}\n >\n {icon}\n </div>\n )}\n </div>\n <div className=\"text-2xl font-semibold text-text-primary tabular-nums\">\n {typeof value === 'number' ? <AnimatedCounter value={value} /> : value}\n </div>\n {subtitle && <p className=\"text-xs text-text-secondary\">{subtitle}</p>}\n {trend && (\n <div className=\"flex items-center gap-1\">\n {trend.value > 0 ? (\n <TrendingUp className=\"size-4 text-status-success-text\" />\n ) : trend.value < 0 ? (\n <TrendingDown className=\"size-4 text-status-error-text\" />\n ) : (\n <Minus className=\"size-4 text-text-secondary\" />\n )}\n <span\n className={`text-xs font-medium tabular-nums ${\n trend.value > 0\n ? 'text-status-success-text'\n : trend.value < 0\n ? 'text-status-error-text'\n : 'text-text-secondary'\n }`}\n >\n {trend.value > 0 ? '+' : ''}\n {trend.value}%\n </span>\n {trend.label && <span className=\"text-xs text-text-secondary\">{trend.label}</span>}\n </div>\n )}\n </div>\n </GlassCard>\n );\n}\n"],"mappings":";;;;;AAkBA,SAAgB,EAAS,EACvB,UACA,UACA,aACA,SACA,UACA,aAAU,WACV,cACgB;AAsBhB,QACE,kBAAC,GAAD;EACE,WAAU;EACD;EACT,MAAM,IAAU,WAAW,KAAA;EAC3B,UAAU,IAAU,IAAI,KAAA;EACxB,WACE,KACK,MAAM;AACL,IAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,SACjC,EAAE,gBAAgB,EAClB,GAAS;MAGb,KAAA;EAEN,WAAW,OAlCK;GAClB,SAAS;GACT,SAAS;GACT,SAAS;GACT,OAAO;GACR,CA6BiC,GAAS,GACrC,IACI,6KACA;YAGN,kBAAC,OAAD;GAAK,WAAU;aAAf;IACE,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,KAAD;MAAG,WAAU;gBAA2C;MAAU,CAAA,EACjE,KACC,kBAAC,OAAD;MACE,WAAW,oEAlCG;OACxB,SAAS;OACT,SAAS;OACT,SAAS;OACT,OAAO;OACR,CA6B4G,GAAS;gBAEzG;MACG,CAAA,CAEJ;;IACN,kBAAC,OAAD;KAAK,WAAU;eACZ,OAAO,KAAU,WAAW,kBAAC,GAAD,EAAwB,UAAS,CAAA,GAAG;KAC7D,CAAA;IACL,KAAY,kBAAC,KAAD;KAAG,WAAU;eAA+B;KAAa,CAAA;IACrE,KACC,kBAAC,OAAD;KAAK,WAAU;eAAf;MACG,EAAM,QAAQ,IACb,kBAAC,GAAD,EAAY,WAAU,mCAAoC,CAAA,GACxD,EAAM,QAAQ,IAChB,kBAAC,GAAD,EAAc,WAAU,iCAAkC,CAAA,GAE1D,kBAAC,GAAD,EAAO,WAAU,8BAA+B,CAAA;MAElD,kBAAC,QAAD;OACE,WAAW,oCACT,EAAM,QAAQ,IACV,6BACA,EAAM,QAAQ,IACZ,2BACA;iBANV;QASG,EAAM,QAAQ,IAAI,MAAM;QACxB,EAAM;QAAM;QACR;;MACN,EAAM,SAAS,kBAAC,QAAD;OAAM,WAAU;iBAA+B,EAAM;OAAa,CAAA;MAC9E;;IAEJ;;EACI,CAAA"}
|