@syncular/ui 0.0.5-44 → 0.0.6-101
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/console/api-keys-table.d.ts.map +1 -1
- package/dist/console/api-keys-table.js +7 -8
- package/dist/console/api-keys-table.js.map +1 -1
- package/dist/console/danger-action-card.d.ts.map +1 -1
- package/dist/console/danger-action-card.js +1 -1
- package/dist/console/danger-action-card.js.map +1 -1
- package/dist/console/fleet-table.d.ts.map +1 -1
- package/dist/console/fleet-table.js +9 -5
- package/dist/console/fleet-table.js.map +1 -1
- package/dist/navigation/index.d.ts +1 -0
- package/dist/navigation/index.d.ts.map +1 -1
- package/dist/navigation/index.js +1 -0
- package/dist/navigation/index.js.map +1 -1
- package/dist/navigation/nav-action-link.d.ts +2 -0
- package/dist/navigation/nav-action-link.d.ts.map +1 -0
- package/dist/navigation/nav-action-link.js +5 -0
- package/dist/navigation/nav-action-link.js.map +1 -0
- package/dist/navigation/top-navigation.d.ts.map +1 -1
- package/dist/navigation/top-navigation.js +5 -3
- package/dist/navigation/top-navigation.js.map +1 -1
- package/dist/primitives/badge.d.ts.map +1 -1
- package/dist/primitives/badge.js +2 -2
- package/dist/primitives/badge.js.map +1 -1
- package/dist/primitives/table.d.ts +6 -6
- package/dist/primitives/table.d.ts.map +1 -1
- package/dist/primitives/table.js +6 -6
- package/dist/primitives/table.js.map +1 -1
- package/dist/styles.css +43 -20
- package/package.json +12 -4
- package/src/console/api-keys-table.tsx +64 -71
- package/src/console/danger-action-card.tsx +5 -1
- package/src/console/fleet-table.tsx +25 -25
- package/src/navigation/index.ts +1 -0
- package/src/navigation/nav-action-link.tsx +9 -0
- package/src/navigation/top-navigation.tsx +13 -10
- package/src/primitives/badge.tsx +3 -2
- package/src/primitives/table.tsx +64 -50
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"api-keys-table.d.ts","sourceRoot":"","sources":["../../src/console/api-keys-table.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,wBAAwB,EAAc,MAAM,OAAO,CAAC;AAElE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"api-keys-table.d.ts","sourceRoot":"","sources":["../../src/console/api-keys-table.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,wBAAwB,EAAc,MAAM,OAAO,CAAC;AAElE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAWhD,MAAM,MAAM,iBAAiB,GAAG,wBAAwB,CAAC,KAAK,CAAC,GAAG;IAChE,IAAI,EAAE,WAAW,EAAE,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC,CAAC;AAQF,QAAA,MAAM,YAAY;;;;;kDA+DjB,CAAC;AAGF,OAAO,EAAE,YAAY,EAAE,CAAC"}
|
|
@@ -3,19 +3,18 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { forwardRef } from 'react';
|
|
4
4
|
import { cn } from '../lib/cn.js';
|
|
5
5
|
import { Badge } from '../primitives/badge.js';
|
|
6
|
-
import {
|
|
6
|
+
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from '../primitives/table.js';
|
|
7
7
|
const typeBadgeMap = {
|
|
8
8
|
relay: 'relay',
|
|
9
9
|
admin: 'flow',
|
|
10
10
|
proxy: 'ghost',
|
|
11
11
|
};
|
|
12
|
-
const ApiKeysTable = forwardRef(({ className, keys, onCreateKey, onRotateKey, onRevokeKey, ...props }, ref) => (
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
] }, `${k.name}:${k.prefix}:${i}`)))] })));
|
|
12
|
+
const ApiKeysTable = forwardRef(({ className, keys, onCreateKey, onRotateKey, onRevokeKey, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('w-full', className), ...props, children: _jsxs(Table, { children: [
|
|
13
|
+
_jsx(TableHeader, { children: _jsxs(TableRow, { children: [
|
|
14
|
+
_jsx(TableHead, { children: "Name" }), _jsx(TableHead, { children: "Type" }), _jsx(TableHead, { children: "Prefix" }), _jsx(TableHead, { children: "Created" })
|
|
15
|
+
] }) }), _jsx(TableBody, { children: keys.map((k, i) => (_jsxs(TableRow, { className: "group relative", children: [
|
|
16
|
+
_jsx(TableCell, { children: _jsx("span", { className: "text-white truncate", children: k.name }) }), _jsx(TableCell, { children: _jsx(Badge, { variant: typeBadgeMap[k.type] ?? 'ghost', children: k.type }) }), _jsx(TableCell, { children: _jsx("span", { className: "text-neutral-500 truncate", children: k.prefix }) }), _jsx(TableCell, { children: _jsx("span", { className: "text-neutral-600 truncate", children: k.created }) }), (onRotateKey || onRevokeKey) && (_jsxs("div", { className: "absolute right-2 top-1/2 -translate-y-1/2 flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity", children: [onRotateKey && (_jsx("button", { type: "button", onClick: () => onRotateKey(k.name), className: "flex items-center gap-1 px-1.5 py-0.5 rounded text-[9px] text-neutral-600 hover:text-white hover:bg-white/[0.05] cursor-pointer transition-colors", children: "rotate" })), onRevokeKey && (_jsx("button", { type: "button", onClick: () => onRevokeKey(k.name), className: "flex items-center gap-1 px-1.5 py-0.5 rounded text-[9px] text-neutral-600 hover:text-offline hover:bg-offline/10 cursor-pointer transition-colors", children: "revoke" }))] }))] }, `${k.name}:${k.prefix}:${i}`))) })
|
|
17
|
+
] }) })));
|
|
19
18
|
ApiKeysTable.displayName = 'ApiKeysTable';
|
|
20
19
|
export { ApiKeysTable };
|
|
21
20
|
//# sourceMappingURL=api-keys-table.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"api-keys-table.js","sourceRoot":"","sources":["../../src/console/api-keys-table.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAiC,UAAU,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAmB,MAAM,qBAAqB,CAAC;AAC7D,OAAO,
|
|
1
|
+
{"version":3,"file":"api-keys-table.js","sourceRoot":"","sources":["../../src/console/api-keys-table.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAiC,UAAU,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAmB,MAAM,qBAAqB,CAAC;AAC7D,OAAO,EACL,KAAK,EACL,SAAS,EACT,SAAS,EACT,SAAS,EACT,WAAW,EACX,QAAQ,GACT,MAAM,qBAAqB,CAAC;AAS7B,MAAM,YAAY,GAA0C;IAC1D,KAAK,EAAE,OAAO;IACd,KAAK,EAAE,MAAM;IACb,KAAK,EAAE,OAAO;CACf,CAAC;AAEF,MAAM,YAAY,GAAG,UAAU,CAC7B,CACE,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,EACpE,GAAG,EACH,EAAE,CAAC,CACH,cAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,QAAQ,EAAE,SAAS,CAAC,KAAM,KAAK,YAC1D,MAAC,KAAK;YACJ,KAAC,WAAW,cACV,MAAC,QAAQ;wBACP,KAAC,SAAS,uBAAiB,EAC3B,KAAC,SAAS,uBAAiB,EAC3B,KAAC,SAAS,yBAAmB,EAC7B,KAAC,SAAS,0BAAoB;wBACrB,GACC,EACd,KAAC,SAAS,cACP,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAClB,MAAC,QAAQ,IAEP,SAAS,EAAC,gBAAgB;wBAE1B,KAAC,SAAS,cACR,eAAM,SAAS,EAAC,qBAAqB,YAAE,CAAC,CAAC,IAAI,GAAQ,GAC3C,EACZ,KAAC,SAAS,cACR,KAAC,KAAK,IAAC,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,OAAO,YAC5C,CAAC,CAAC,IAAI,GACD,GACE,EACZ,KAAC,SAAS,cACR,eAAM,SAAS,EAAC,2BAA2B,YAAE,CAAC,CAAC,MAAM,GAAQ,GACnD,EACZ,KAAC,SAAS,cACR,eAAM,SAAS,EAAC,2BAA2B,YAAE,CAAC,CAAC,OAAO,GAAQ,GACpD,EACX,CAAC,WAAW,IAAI,WAAW,CAAC,IAAI,CAC/B,eAAK,SAAS,EAAC,wHAAwH,aACpI,WAAW,IAAI,CACd,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,EAClC,SAAS,EAAC,mJAAmJ,uBAGtJ,CACV,EACA,WAAW,IAAI,CACd,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,EAClC,SAAS,EAAC,mJAAmJ,uBAGtJ,CACV,IACG,CACP,KAtCI,GAAG,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,MAAM,IAAI,CAAC,EAAE,CAuCxB,CACZ,CAAC,GACQ;YACN,GACJ,CACP,CACF,CAAC;AACF,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;AAE1C,OAAO,EAAE,YAAY,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"danger-action-card.d.ts","sourceRoot":"","sources":["../../src/console/danger-action-card.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,qBAAqB;IACpC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,WAAuB,EACvB,SAAS,EACT,WAAW,EACX,QAAQ,EACR,KAAK,EACL,KAAK,EACN,EAAE,qBAAqB,
|
|
1
|
+
{"version":3,"file":"danger-action-card.d.ts","sourceRoot":"","sources":["../../src/console/danger-action-card.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,qBAAqB;IACpC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,WAAuB,EACvB,SAAS,EACT,WAAW,EACX,QAAQ,EACR,KAAK,EACL,KAAK,EACN,EAAE,qBAAqB,2CAyBvB"}
|
|
@@ -5,6 +5,6 @@ import { Button } from '../primitives/button.js';
|
|
|
5
5
|
import { Card, CardContent } from '../primitives/card.js';
|
|
6
6
|
export function DangerActionCard({ actionLabel = 'Confirm', className, description, onAction, stats, title, }) {
|
|
7
7
|
return (_jsx(Card, { className: cn('border-offline/20', className), children: _jsxs(CardContent, { className: "flex flex-col gap-3", children: [
|
|
8
|
-
_jsx("h3", { className: "font-mono text-[10px] text-offline uppercase tracking-widest", children: title }), description ? (_jsx("p", { className: "font-mono text-[10px] text-neutral-500", children: description })) : null, stats ? _jsx("div", { children: stats }) : null, onAction ? (_jsx(Button, { variant: "destructive", onClick: onAction, children: actionLabel })) : null] }) }));
|
|
8
|
+
_jsx("h3", { className: "font-mono text-[10px] text-offline uppercase tracking-widest", children: title }), description ? (_jsx("p", { className: "font-mono text-[10px] text-neutral-500", children: description })) : null, stats ? _jsx("div", { children: stats }) : null, onAction ? (_jsx(Button, { variant: "destructive", className: "self-start", onClick: onAction, children: actionLabel })) : null] }) }));
|
|
9
9
|
}
|
|
10
10
|
//# sourceMappingURL=danger-action-card.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"danger-action-card.js","sourceRoot":"","sources":["../../src/console/danger-action-card.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAWvD,MAAM,UAAU,gBAAgB,CAAC,EAC/B,WAAW,GAAG,SAAS,EACvB,SAAS,EACT,WAAW,EACX,QAAQ,EACR,KAAK,EACL,KAAK,GACiB,EAAE;IACxB,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,CAAC,mBAAmB,EAAE,SAAS,CAAC,YACjD,MAAC,WAAW,IAAC,SAAS,EAAC,qBAAqB;gBAC1C,aAAI,SAAS,EAAC,8DAA8D,YACzE,KAAK,GACH,EACJ,WAAW,CAAC,CAAC,CAAC,CACb,YAAG,SAAS,EAAC,wCAAwC,YAClD,WAAW,GACV,CACL,CAAC,CAAC,CAAC,IAAI,EACP,KAAK,CAAC,CAAC,CAAC,wBAAM,KAAK,GAAO,CAAC,CAAC,CAAC,IAAI,EACjC,QAAQ,CAAC,CAAC,CAAC,CACV,KAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"danger-action-card.js","sourceRoot":"","sources":["../../src/console/danger-action-card.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAWvD,MAAM,UAAU,gBAAgB,CAAC,EAC/B,WAAW,GAAG,SAAS,EACvB,SAAS,EACT,WAAW,EACX,QAAQ,EACR,KAAK,EACL,KAAK,GACiB,EAAE;IACxB,OAAO,CACL,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,CAAC,mBAAmB,EAAE,SAAS,CAAC,YACjD,MAAC,WAAW,IAAC,SAAS,EAAC,qBAAqB;gBAC1C,aAAI,SAAS,EAAC,8DAA8D,YACzE,KAAK,GACH,EACJ,WAAW,CAAC,CAAC,CAAC,CACb,YAAG,SAAS,EAAC,wCAAwC,YAClD,WAAW,GACV,CACL,CAAC,CAAC,CAAC,IAAI,EACP,KAAK,CAAC,CAAC,CAAC,wBAAM,KAAK,GAAO,CAAC,CAAC,CAAC,IAAI,EACjC,QAAQ,CAAC,CAAC,CAAC,CACV,KAAC,MAAM,IACL,OAAO,EAAC,aAAa,EACrB,SAAS,EAAC,YAAY,EACtB,OAAO,EAAE,QAAQ,YAEhB,WAAW,GACL,CACV,CAAC,CAAC,CAAC,IAAI,IACI,GACT,CACR,CAAC;AAAA,CACH"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fleet-table.d.ts","sourceRoot":"","sources":["../../src/console/fleet-table.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"fleet-table.d.ts","sourceRoot":"","sources":["../../src/console/fleet-table.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,wBAAwB,EAAc,MAAM,OAAO,CAAC;AAElE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAWnD,MAAM,MAAM,eAAe,GAAG,wBAAwB,CAAC,KAAK,CAAC,GAAG;IAC9D,OAAO,EAAE,cAAc,EAAE,CAAC;IAC1B,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC,CAAC;AAeF,QAAA,MAAM,UAAU;;;;kDA4Gf,CAAC;AAGF,OAAO,EAAE,UAAU,EAAE,CAAC"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { UserX } from 'lucide-react';
|
|
3
4
|
import { forwardRef } from 'react';
|
|
4
5
|
import { cn } from '../lib/cn.js';
|
|
5
6
|
import { Badge } from '../primitives/badge.js';
|
|
@@ -21,23 +22,26 @@ const statusBadgeVariant = {
|
|
|
21
22
|
const FleetTable = forwardRef(({ className, clients, headSeq, onEvict, ...props }, ref) => {
|
|
22
23
|
return (_jsx("div", { ref: ref, className: cn('w-full', className), ...props, children: _jsxs(Table, { children: [
|
|
23
24
|
_jsx(TableHeader, { children: _jsxs(TableRow, { children: [
|
|
24
|
-
_jsx(TableHead, { children: "Client" }), _jsx(TableHead, { children: "Status" }), _jsx(TableHead, { children: "Type" }), _jsx(TableHead, { children: "Cursor" }), _jsx(TableHead, { children: "Lag" }), _jsx(TableHead, {
|
|
25
|
+
_jsx(TableHead, { className: "w-[160px]", children: "Client" }), _jsx(TableHead, { className: "w-[70px]", children: "Status" }), _jsx(TableHead, { className: "w-[60px]", children: "Type" }), _jsx(TableHead, { className: "w-[80px]", children: "Cursor" }), _jsx(TableHead, { className: "w-[110px]", children: "Lag" }), _jsx(TableHead, { className: "w-[60px]", children: "Dialect" }), _jsx(TableHead, { className: "flex-1", children: "Mode" })
|
|
26
|
+
] }) }), _jsx(TableBody, { children: clients.map((client) => {
|
|
25
27
|
const lag = Math.max(0, headSeq - client.cursor);
|
|
26
28
|
const pct = headSeq > 0
|
|
27
29
|
? Math.min(100, (client.cursor / headSeq) * 100)
|
|
28
30
|
: 100;
|
|
29
31
|
const lagColor = getLagColor(lag);
|
|
30
|
-
return (_jsxs(TableRow, { children: [
|
|
31
|
-
_jsx(TableCell, { children: _jsxs("div", { className: "flex items-center gap-2", children: [
|
|
32
|
+
return (_jsxs(TableRow, { className: "group relative", children: [
|
|
33
|
+
_jsx(TableCell, { className: "w-[160px]", children: _jsxs("div", { className: "flex items-center gap-2", children: [
|
|
32
34
|
_jsx("span", { className: "w-1.5 h-1.5 rounded-full flex-shrink-0", style: {
|
|
33
35
|
background: lagColor,
|
|
34
36
|
boxShadow: `0 0 4px ${lagColor}`,
|
|
35
37
|
} }), _jsx("span", { className: "font-mono text-[11px] text-white truncate", title: client.id, children: client.id.length > 18
|
|
36
38
|
? `${client.id.substring(0, 18)}\u2026`
|
|
37
39
|
: client.id })
|
|
38
|
-
] }) }), _jsx(TableCell, { children: _jsx(Badge, { variant: statusBadgeVariant[client.status], children: client.status }) }), _jsx(TableCell, { children: _jsx("span", { className: "font-mono text-[10px] text-neutral-400", children: client.type }) }), _jsx(TableCell, { children: _jsxs("span", { className: "font-mono text-[11px] text-white font-medium", children: ["#", client.cursor.toLocaleString()] }) }), _jsx(TableCell, { children: _jsxs("div", { className: "flex items-center gap-2", children: [
|
|
40
|
+
] }) }), _jsx(TableCell, { className: "w-[70px]", children: _jsx(Badge, { variant: statusBadgeVariant[client.status], children: client.status }) }), _jsx(TableCell, { className: "w-[60px]", children: _jsx("span", { className: "font-mono text-[10px] text-neutral-400", children: client.type }) }), _jsx(TableCell, { className: "w-[80px]", children: _jsxs("span", { className: "font-mono text-[11px] text-white font-medium", children: ["#", client.cursor.toLocaleString()] }) }), _jsx(TableCell, { className: "w-[110px]", children: _jsxs("div", { className: "flex items-center gap-2", children: [
|
|
39
41
|
_jsx("div", { className: "w-[60px] h-[3px] rounded-full bg-surface overflow-hidden", children: _jsx("div", { className: "h-full rounded-full transition-all", style: { width: `${pct}%`, background: lagColor } }) }), _jsx("span", { className: "font-mono text-[10px] font-medium", style: { color: lagColor }, children: lag === 0 ? '0' : `${lag}` })
|
|
40
|
-
] }) }), _jsx(TableCell, { children: _jsx("span", { className: "font-mono text-[10px] text-neutral-400", children: client.dialect }) }), _jsx(TableCell, { children: _jsx(Badge, { variant: client.mode === 'realtime' ? 'flow' : 'ghost', children: client.mode }) }), onEvict && (
|
|
42
|
+
] }) }), _jsx(TableCell, { className: "w-[60px]", children: _jsx("span", { className: "font-mono text-[10px] text-neutral-400", children: client.dialect }) }), _jsx(TableCell, { className: "flex-1", children: _jsx(Badge, { variant: client.mode === 'realtime' ? 'flow' : 'ghost', children: client.mode }) }), onEvict && (_jsxs("button", { type: "button", title: "Evict client", onClick: () => onEvict(client.id), className: "absolute right-2 top-1/2 -translate-y-1/2 flex items-center gap-1 px-1.5 py-0.5 rounded text-[9px] text-neutral-600 hover:text-offline hover:bg-offline/10 cursor-pointer transition-colors opacity-0 group-hover:opacity-100", children: [
|
|
43
|
+
_jsx(UserX, { size: 10 }),
|
|
44
|
+
"evict"] }))] }, client.id));
|
|
41
45
|
}) })
|
|
42
46
|
] }) }));
|
|
43
47
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fleet-table.js","sourceRoot":"","sources":["../../src/console/fleet-table.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAiC,UAAU,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAC5C,OAAO,EACL,KAAK,EACL,SAAS,EACT,SAAS,EACT,SAAS,EACT,WAAW,EACX,QAAQ,GACT,MAAM,qBAAqB,CAAC;AAQ7B,SAAS,WAAW,CAAC,GAAW,EAAE;IAChC,IAAI,GAAG,KAAK,CAAC;QAAE,OAAO,SAAS,CAAC;IAChC,IAAI,GAAG,GAAG,EAAE;QAAE,OAAO,SAAS,CAAC;IAC/B,IAAI,GAAG,GAAG,EAAE;QAAE,OAAO,SAAS,CAAC;IAC/B,OAAO,SAAS,CAAC;AAAA,CAClB;AAED,MAAM,kBAAkB,GAAG;IACzB,MAAM,EAAE,SAAS;IACjB,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,SAAS;CACV,CAAC;AAEX,MAAM,UAAU,GAAG,UAAU,CAC3B,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC;IAC3D,OAAO,CACL,cAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,QAAQ,EAAE,SAAS,CAAC,KAAM,KAAK,YAC1D,MAAC,KAAK;gBACJ,KAAC,WAAW,cACV,MAAC,QAAQ;4BACP,KAAC,SAAS,
|
|
1
|
+
{"version":3,"file":"fleet-table.js","sourceRoot":"","sources":["../../src/console/fleet-table.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/navigation/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/navigation/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC;AAClC,cAAc,YAAY,CAAC;AAC3B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC"}
|
package/dist/navigation/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/navigation/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/navigation/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC;AAClC,cAAc,YAAY,CAAC;AAC3B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"nav-action-link.d.ts","sourceRoot":"","sources":["../../src/navigation/nav-action-link.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,sBAAsB,QAGlC,CAAC"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { cn } from '../lib/cn.js';
|
|
3
|
+
import { buttonVariants } from '../primitives/button.js';
|
|
4
|
+
export const navActionLinkClassName = cn(buttonVariants({ variant: 'secondary', size: 'sm' }), 'h-7 whitespace-nowrap uppercase tracking-[0.08em] leading-none no-underline');
|
|
5
|
+
//# sourceMappingURL=nav-action-link.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"nav-action-link.js","sourceRoot":"","sources":["../../src/navigation/nav-action-link.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD,MAAM,CAAC,MAAM,sBAAsB,GAAG,EAAE,CACtC,cAAc,CAAC,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EACpD,6EAA6E,CAC9E,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"top-navigation.d.ts","sourceRoot":"","sources":["../../src/navigation/top-navigation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,MAAM,EACN,KAAK,EACL,SAAS,EACV,EAAE,kBAAkB,
|
|
1
|
+
{"version":3,"file":"top-navigation.d.ts","sourceRoot":"","sources":["../../src/navigation/top-navigation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,MAAM,EACN,KAAK,EACL,SAAS,EACV,EAAE,kBAAkB,2CAgBpB"}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { cn } from '../lib/cn.js';
|
|
4
4
|
export function TopNavigation({ brand, center, right, className, }) {
|
|
5
|
-
return (_jsxs(
|
|
6
|
-
_jsx("div", { className: "
|
|
5
|
+
return (_jsxs(_Fragment, { children: [
|
|
6
|
+
_jsx("div", { "aria-hidden": "true", className: "h-[42px] shrink-0" }), _jsxs("nav", { className: cn('fixed top-0 left-0 right-0 z-100 h-[42px] border-b border-border bg-surface/88 backdrop-blur-lg flex items-center justify-between px-5', className), children: [
|
|
7
|
+
_jsx("div", { className: "flex items-center gap-3", children: brand }), _jsx("div", { className: "flex items-center gap-0.5", children: center }), _jsx("div", { className: "flex items-center gap-2", children: right })
|
|
8
|
+
] })
|
|
7
9
|
] }));
|
|
8
10
|
}
|
|
9
11
|
//# sourceMappingURL=top-navigation.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"top-navigation.js","sourceRoot":"","sources":["../../src/navigation/top-navigation.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAS/B,MAAM,UAAU,aAAa,CAAC,EAC5B,KAAK,EACL,MAAM,EACN,KAAK,EACL,SAAS,GACU,EAAE;IACrB,OAAO,CACL,eACE,SAAS,EAAE,EAAE,CACX,wIAAwI,EACxI,SAAS,CACV;
|
|
1
|
+
{"version":3,"file":"top-navigation.js","sourceRoot":"","sources":["../../src/navigation/top-navigation.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAS/B,MAAM,UAAU,aAAa,CAAC,EAC5B,KAAK,EACL,MAAM,EACN,KAAK,EACL,SAAS,GACU,EAAE;IACrB,OAAO,CACL;YACE,6BAAiB,MAAM,EAAC,SAAS,EAAC,mBAAmB,GAAG,EACxD,eACE,SAAS,EAAE,EAAE,CACX,wIAAwI,EACxI,SAAS,CACV;oBAED,cAAK,SAAS,EAAC,yBAAyB,YAAE,KAAK,GAAO,EACtD,cAAK,SAAS,EAAC,2BAA2B,YAAE,MAAM,GAAO,EACzD,cAAK,SAAS,EAAC,yBAAyB,YAAE,KAAK,GAAO;oBAClD;YACL,CACJ,CAAC;AAAA,CACH"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../src/primitives/badge.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,KAAK,wBAAwB,EAAc,MAAM,OAAO,CAAC;AAGlE,QAAA,MAAM,aAAa;;8EAqBlB,CAAC;AAEF,KAAK,UAAU,GAAG,wBAAwB,CAAC,MAAM,CAAC,GAChD,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC;AAErC,QAAA,MAAM,KAAK;;
|
|
1
|
+
{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../src/primitives/badge.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,KAAK,wBAAwB,EAAc,MAAM,OAAO,CAAC;AAGlE,QAAA,MAAM,aAAa;;8EAqBlB,CAAC;AAEF,KAAK,UAAU,GAAG,wBAAwB,CAAC,MAAM,CAAC,GAChD,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC;AAErC,QAAA,MAAM,KAAK;;iIASV,CAAC;AAGF,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC;AAChC,YAAY,EAAE,UAAU,EAAE,CAAC"}
|
package/dist/primitives/badge.js
CHANGED
|
@@ -3,7 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
3
3
|
import { cva } from 'class-variance-authority';
|
|
4
4
|
import { forwardRef } from 'react';
|
|
5
5
|
import { cn } from '../lib/cn.js';
|
|
6
|
-
const badgeVariants = cva('inline-flex items-center gap-1 px-2 py-0.5 rounded-sm font-mono text-[9px] uppercase tracking-wider', {
|
|
6
|
+
const badgeVariants = cva('inline-flex items-center gap-1 px-2 py-0.5 rounded-sm font-mono text-[9px] leading-normal uppercase tracking-wider', {
|
|
7
7
|
variants: {
|
|
8
8
|
variant: {
|
|
9
9
|
default: 'bg-white/[0.05] text-neutral-300 border border-border-bright',
|
|
@@ -22,7 +22,7 @@ const badgeVariants = cva('inline-flex items-center gap-1 px-2 py-0.5 rounded-sm
|
|
|
22
22
|
variant: 'default',
|
|
23
23
|
},
|
|
24
24
|
});
|
|
25
|
-
const Badge = forwardRef(({ className, variant, ...props }, ref) => (_jsx("span", { ref: ref, className: cn(badgeVariants({ variant, className })), ...props })));
|
|
25
|
+
const Badge = forwardRef(({ className, variant, style, ...props }, ref) => (_jsx("span", { ref: ref, className: cn(badgeVariants({ variant, className })), style: { lineHeight: 1, ...style }, ...props })));
|
|
26
26
|
Badge.displayName = 'Badge';
|
|
27
27
|
export { Badge, badgeVariants };
|
|
28
28
|
//# sourceMappingURL=badge.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"badge.js","sourceRoot":"","sources":["../../src/primitives/badge.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAiC,UAAU,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAE/B,MAAM,aAAa,GAAG,GAAG,CACvB,
|
|
1
|
+
{"version":3,"file":"badge.js","sourceRoot":"","sources":["../../src/primitives/badge.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAiC,UAAU,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAE/B,MAAM,aAAa,GAAG,GAAG,CACvB,oHAAoH,EACpH;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,8DAA8D;YACvE,WAAW,EAAE,qDAAqD;YAClE,KAAK,EAAE,6DAA6D;YACpE,OAAO,EAAE,6DAA6D;YACtE,SAAS,EAAE,gDAAgD;YAC3D,OAAO,EAAE,qDAAqD;YAC9D,OAAO,EAAE,qDAAqD;YAC9D,OAAO,EAAE,qDAAqD;YAC9D,IAAI,EAAE,4CAA4C;YAClD,KAAK,EAAE,+CAA+C;SACvD;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;KACnB;CACF,CACF,CAAC;AAKF,MAAM,KAAK,GAAG,UAAU,CACtB,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAChD,eACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,CAAC,EACpD,KAAK,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,GAAG,KAAK,EAAE,KAC9B,KAAK,GACT,CACH,CACF,CAAC;AACF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC;AAE5B,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
declare const Table: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").
|
|
2
|
-
declare const TableHeader: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<
|
|
3
|
-
declare const TableBody: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<
|
|
4
|
-
declare const TableRow: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<
|
|
5
|
-
declare const TableHead: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").
|
|
6
|
-
declare const TableCell: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").
|
|
1
|
+
declare const Table: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
2
|
+
declare const TableHeader: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
3
|
+
declare const TableBody: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
4
|
+
declare const TableRow: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
5
|
+
declare const TableHead: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
6
|
+
declare const TableCell: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
7
7
|
export { Table, TableHeader, TableBody, TableRow, TableHead, TableCell };
|
|
8
8
|
//# sourceMappingURL=table.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../src/primitives/table.tsx"],"names":[],"mappings":"AAKA,QAAA,MAAM,KAAK,
|
|
1
|
+
{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../src/primitives/table.tsx"],"names":[],"mappings":"AAKA,QAAA,MAAM,KAAK,2MAUV,CAAC;AAGF,QAAA,MAAM,WAAW,2MAKhB,CAAC;AAGF,QAAA,MAAM,SAAS,2MAKd,CAAC;AAGF,QAAA,MAAM,QAAQ,2MAcb,CAAC;AAGF,QAAA,MAAM,SAAS,2MAcd,CAAC;AAGF,QAAA,MAAM,SAAS,2MAad,CAAC;AAGF,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC"}
|
package/dist/primitives/table.js
CHANGED
|
@@ -2,17 +2,17 @@
|
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import { forwardRef } from 'react';
|
|
4
4
|
import { cn } from '../lib/cn.js';
|
|
5
|
-
const Table = forwardRef(({ className, ...props }, ref) => (_jsx("
|
|
5
|
+
const Table = forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, role: "table", className: cn('w-full', className), ...props })));
|
|
6
6
|
Table.displayName = 'Table';
|
|
7
|
-
const TableHeader = forwardRef(({ className, ...props }, ref) => (_jsx("
|
|
7
|
+
const TableHeader = forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, role: "rowgroup", className: cn(className), ...props })));
|
|
8
8
|
TableHeader.displayName = 'TableHeader';
|
|
9
|
-
const TableBody = forwardRef(({ className, ...props }, ref) => (_jsx("
|
|
9
|
+
const TableBody = forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, role: "rowgroup", className: cn(className), ...props })));
|
|
10
10
|
TableBody.displayName = 'TableBody';
|
|
11
|
-
const TableRow = forwardRef(({ className, ...props }, ref) => (_jsx("
|
|
11
|
+
const TableRow = forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, role: "row", className: cn('font-mono text-[11px] leading-6 px-4 flex items-center gap-4 border-b border-[#141414] hover:bg-white/[0.015] transition-colors cursor-default', className), ...props })));
|
|
12
12
|
TableRow.displayName = 'TableRow';
|
|
13
|
-
const TableHead = forwardRef(({ className, ...props }, ref) => (_jsx("
|
|
13
|
+
const TableHead = forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, role: "columnheader", className: cn('min-w-0 font-mono text-[9px] text-neutral-600 uppercase tracking-wider leading-6 bg-white/[0.01] text-left truncate', className), ...props })));
|
|
14
14
|
TableHead.displayName = 'TableHead';
|
|
15
|
-
const TableCell = forwardRef(({ className, ...props }, ref) => (_jsx("
|
|
15
|
+
const TableCell = forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, role: "cell", className: cn('min-w-0 whitespace-nowrap overflow-hidden text-ellipsis', className), ...props })));
|
|
16
16
|
TableCell.displayName = 'TableCell';
|
|
17
17
|
export { Table, TableHeader, TableBody, TableRow, TableHead, TableCell };
|
|
18
18
|
//# sourceMappingURL=table.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table.js","sourceRoot":"","sources":["../../src/primitives/table.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAiC,UAAU,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAE/B,MAAM,KAAK,GAAG,UAAU,CACtB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,
|
|
1
|
+
{"version":3,"file":"table.js","sourceRoot":"","sources":["../../src/primitives/table.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAiC,UAAU,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,EAAE,EAAE,MAAM,WAAW,CAAC;AAE/B,MAAM,KAAK,GAAG,UAAU,CACtB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAEhC,cACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,OAAO,EACZ,SAAS,EAAE,EAAE,CAAC,QAAQ,EAAE,SAAS,CAAC,KAC9B,KAAK,GACT,CACH,CACF,CAAC;AACF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC;AAE5B,MAAM,WAAW,GAAG,UAAU,CAC5B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAEhC,cAAK,GAAG,EAAE,GAAG,EAAE,IAAI,EAAC,UAAU,EAAC,SAAS,EAAE,EAAE,CAAC,SAAS,CAAC,KAAM,KAAK,GAAI,CACvE,CACF,CAAC;AACF,WAAW,CAAC,WAAW,GAAG,aAAa,CAAC;AAExC,MAAM,SAAS,GAAG,UAAU,CAC1B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAEhC,cAAK,GAAG,EAAE,GAAG,EAAE,IAAI,EAAC,UAAU,EAAC,SAAS,EAAE,EAAE,CAAC,SAAS,CAAC,KAAM,KAAK,GAAI,CACvE,CACF,CAAC;AACF,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC;AAEpC,MAAM,QAAQ,GAAG,UAAU,CACzB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAGhC,cACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,KAAK,EACV,SAAS,EAAE,EAAE,CACX,gJAAgJ,EAChJ,SAAS,CACV,KACG,KAAK,GACT,CACH,CACF,CAAC;AACF,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAC;AAElC,MAAM,SAAS,GAAG,UAAU,CAC1B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAGhC,cACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,cAAc,EACnB,SAAS,EAAE,EAAE,CACX,qHAAqH,EACrH,SAAS,CACV,KACG,KAAK,GACT,CACH,CACF,CAAC;AACF,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC;AAEpC,MAAM,SAAS,GAAG,UAAU,CAC1B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAEhC,cACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,EAAE,CACX,yDAAyD,EACzD,SAAS,CACV,KACG,KAAK,GACT,CACH,CACF,CAAC;AACF,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC;AAEpC,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC"}
|
package/dist/styles.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/*! tailwindcss v4.2.
|
|
1
|
+
/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
|
|
2
2
|
@layer properties;
|
|
3
3
|
@layer theme, base, components, utilities;
|
|
4
4
|
@layer theme {
|
|
@@ -52,6 +52,7 @@
|
|
|
52
52
|
--tracking-wider: 0.05em;
|
|
53
53
|
--tracking-widest: 0.1em;
|
|
54
54
|
--leading-tight: 1.25;
|
|
55
|
+
--leading-normal: 1.5;
|
|
55
56
|
--leading-relaxed: 1.625;
|
|
56
57
|
--ease-out: cubic-bezier(0, 0, 0.2, 1);
|
|
57
58
|
--animate-spin: spin 1s linear infinite;
|
|
@@ -270,6 +271,9 @@
|
|
|
270
271
|
.right-0 {
|
|
271
272
|
right: calc(var(--spacing) * 0);
|
|
272
273
|
}
|
|
274
|
+
.right-2 {
|
|
275
|
+
right: calc(var(--spacing) * 2);
|
|
276
|
+
}
|
|
273
277
|
.right-5 {
|
|
274
278
|
right: calc(var(--spacing) * 5);
|
|
275
279
|
}
|
|
@@ -572,17 +576,17 @@
|
|
|
572
576
|
.w-\[80px\] {
|
|
573
577
|
width: 80px;
|
|
574
578
|
}
|
|
575
|
-
.w-\[90px\] {
|
|
576
|
-
width: 90px;
|
|
577
|
-
}
|
|
578
579
|
.w-\[100px\] {
|
|
579
580
|
width: 100px;
|
|
580
581
|
}
|
|
582
|
+
.w-\[110px\] {
|
|
583
|
+
width: 110px;
|
|
584
|
+
}
|
|
581
585
|
.w-\[120px\] {
|
|
582
586
|
width: 120px;
|
|
583
587
|
}
|
|
584
|
-
.w-\[
|
|
585
|
-
width:
|
|
588
|
+
.w-\[160px\] {
|
|
589
|
+
width: 160px;
|
|
586
590
|
}
|
|
587
591
|
.w-\[400px\] {
|
|
588
592
|
width: 400px;
|
|
@@ -795,6 +799,9 @@
|
|
|
795
799
|
margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
|
|
796
800
|
}
|
|
797
801
|
}
|
|
802
|
+
.self-start {
|
|
803
|
+
align-self: flex-start;
|
|
804
|
+
}
|
|
798
805
|
.truncate {
|
|
799
806
|
overflow: hidden;
|
|
800
807
|
text-overflow: ellipsis;
|
|
@@ -1504,6 +1511,10 @@
|
|
|
1504
1511
|
--tw-leading: 1;
|
|
1505
1512
|
line-height: 1;
|
|
1506
1513
|
}
|
|
1514
|
+
.leading-normal {
|
|
1515
|
+
--tw-leading: var(--leading-normal);
|
|
1516
|
+
line-height: var(--leading-normal);
|
|
1517
|
+
}
|
|
1507
1518
|
.leading-relaxed {
|
|
1508
1519
|
--tw-leading: var(--leading-relaxed);
|
|
1509
1520
|
line-height: var(--leading-relaxed);
|
|
@@ -1528,6 +1539,10 @@
|
|
|
1528
1539
|
--tw-tracking: 0.5px;
|
|
1529
1540
|
letter-spacing: 0.5px;
|
|
1530
1541
|
}
|
|
1542
|
+
.tracking-\[0\.08em\] {
|
|
1543
|
+
--tw-tracking: 0.08em;
|
|
1544
|
+
letter-spacing: 0.08em;
|
|
1545
|
+
}
|
|
1531
1546
|
.tracking-\[1\.5px\] {
|
|
1532
1547
|
--tw-tracking: 1.5px;
|
|
1533
1548
|
letter-spacing: 1.5px;
|
|
@@ -1647,6 +1662,9 @@
|
|
|
1647
1662
|
.line-through {
|
|
1648
1663
|
text-decoration-line: line-through;
|
|
1649
1664
|
}
|
|
1665
|
+
.no-underline {
|
|
1666
|
+
text-decoration-line: none;
|
|
1667
|
+
}
|
|
1650
1668
|
.underline {
|
|
1651
1669
|
text-decoration-line: underline;
|
|
1652
1670
|
}
|
|
@@ -1739,6 +1757,11 @@
|
|
|
1739
1757
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
1740
1758
|
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
1741
1759
|
}
|
|
1760
|
+
.transition-opacity {
|
|
1761
|
+
transition-property: opacity;
|
|
1762
|
+
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
1763
|
+
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
1764
|
+
}
|
|
1742
1765
|
.transition-transform {
|
|
1743
1766
|
transition-property: transform, translate, scale, rotate;
|
|
1744
1767
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
@@ -1873,16 +1896,6 @@
|
|
|
1873
1896
|
}
|
|
1874
1897
|
}
|
|
1875
1898
|
}
|
|
1876
|
-
.hover\:border-offline\/50 {
|
|
1877
|
-
&:hover {
|
|
1878
|
-
@media (hover: hover) {
|
|
1879
|
-
border-color: var(--syncular-color-offline);
|
|
1880
|
-
@supports (color: color-mix(in lab, red, red)) {
|
|
1881
|
-
border-color: color-mix(in oklab, var(--syncular-color-offline) 50%, transparent);
|
|
1882
|
-
}
|
|
1883
|
-
}
|
|
1884
|
-
}
|
|
1885
|
-
}
|
|
1886
1899
|
.hover\:bg-blue-600 {
|
|
1887
1900
|
&:hover {
|
|
1888
1901
|
@media (hover: hover) {
|
|
@@ -1940,22 +1953,22 @@
|
|
|
1940
1953
|
}
|
|
1941
1954
|
}
|
|
1942
1955
|
}
|
|
1943
|
-
.hover\:bg-offline\/
|
|
1956
|
+
.hover\:bg-offline\/10 {
|
|
1944
1957
|
&:hover {
|
|
1945
1958
|
@media (hover: hover) {
|
|
1946
1959
|
background-color: var(--syncular-color-offline);
|
|
1947
1960
|
@supports (color: color-mix(in lab, red, red)) {
|
|
1948
|
-
background-color: color-mix(in oklab, var(--syncular-color-offline)
|
|
1961
|
+
background-color: color-mix(in oklab, var(--syncular-color-offline) 10%, transparent);
|
|
1949
1962
|
}
|
|
1950
1963
|
}
|
|
1951
1964
|
}
|
|
1952
1965
|
}
|
|
1953
|
-
.hover\:bg-offline
|
|
1966
|
+
.hover\:bg-offline\/20 {
|
|
1954
1967
|
&:hover {
|
|
1955
1968
|
@media (hover: hover) {
|
|
1956
1969
|
background-color: var(--syncular-color-offline);
|
|
1957
1970
|
@supports (color: color-mix(in lab, red, red)) {
|
|
1958
|
-
background-color: color-mix(in oklab, var(--syncular-color-offline)
|
|
1971
|
+
background-color: color-mix(in oklab, var(--syncular-color-offline) 20%, transparent);
|
|
1959
1972
|
}
|
|
1960
1973
|
}
|
|
1961
1974
|
}
|
|
@@ -1997,6 +2010,16 @@
|
|
|
1997
2010
|
}
|
|
1998
2011
|
}
|
|
1999
2012
|
}
|
|
2013
|
+
.hover\:bg-white\/\[0\.05\] {
|
|
2014
|
+
&:hover {
|
|
2015
|
+
@media (hover: hover) {
|
|
2016
|
+
background-color: color-mix(in srgb, #fff 5%, transparent);
|
|
2017
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
2018
|
+
background-color: color-mix(in oklab, var(--color-white) 5%, transparent);
|
|
2019
|
+
}
|
|
2020
|
+
}
|
|
2021
|
+
}
|
|
2022
|
+
}
|
|
2000
2023
|
.hover\:bg-white\/\[0\.015\] {
|
|
2001
2024
|
&:hover {
|
|
2002
2025
|
@media (hover: hover) {
|
package/package.json
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@syncular/ui",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.6-101",
|
|
4
4
|
"description": "Reusable Syncular UI components and styles",
|
|
5
|
-
"license": "
|
|
5
|
+
"license": "Apache-2.0",
|
|
6
6
|
"author": "Benjamin Kniffler",
|
|
7
7
|
"homepage": "https://syncular.dev",
|
|
8
8
|
"repository": {
|
|
@@ -27,6 +27,7 @@
|
|
|
27
27
|
"exports": {
|
|
28
28
|
".": {
|
|
29
29
|
"bun": "./src/index.ts",
|
|
30
|
+
"browser": "./src/index.ts",
|
|
30
31
|
"import": {
|
|
31
32
|
"types": "./dist/index.d.ts",
|
|
32
33
|
"default": "./dist/index.js"
|
|
@@ -34,6 +35,7 @@
|
|
|
34
35
|
},
|
|
35
36
|
"./charts": {
|
|
36
37
|
"bun": "./src/charts/index.ts",
|
|
38
|
+
"browser": "./src/charts/index.ts",
|
|
37
39
|
"import": {
|
|
38
40
|
"types": "./dist/charts/index.d.ts",
|
|
39
41
|
"default": "./dist/charts/index.js"
|
|
@@ -41,6 +43,7 @@
|
|
|
41
43
|
},
|
|
42
44
|
"./console": {
|
|
43
45
|
"bun": "./src/console/index.ts",
|
|
46
|
+
"browser": "./src/console/index.ts",
|
|
44
47
|
"import": {
|
|
45
48
|
"types": "./dist/console/index.d.ts",
|
|
46
49
|
"default": "./dist/console/index.js"
|
|
@@ -48,6 +51,7 @@
|
|
|
48
51
|
},
|
|
49
52
|
"./forms": {
|
|
50
53
|
"bun": "./src/forms/index.ts",
|
|
54
|
+
"browser": "./src/forms/index.ts",
|
|
51
55
|
"import": {
|
|
52
56
|
"types": "./dist/forms/index.d.ts",
|
|
53
57
|
"default": "./dist/forms/index.js"
|
|
@@ -55,6 +59,7 @@
|
|
|
55
59
|
},
|
|
56
60
|
"./primitives": {
|
|
57
61
|
"bun": "./src/primitives/index.ts",
|
|
62
|
+
"browser": "./src/primitives/index.ts",
|
|
58
63
|
"import": {
|
|
59
64
|
"types": "./dist/primitives/index.d.ts",
|
|
60
65
|
"default": "./dist/primitives/index.js"
|
|
@@ -62,6 +67,7 @@
|
|
|
62
67
|
},
|
|
63
68
|
"./observable-universe": {
|
|
64
69
|
"bun": "./src/observable-universe/index.ts",
|
|
70
|
+
"browser": "./src/observable-universe/index.ts",
|
|
65
71
|
"import": {
|
|
66
72
|
"types": "./dist/observable-universe/index.d.ts",
|
|
67
73
|
"default": "./dist/observable-universe/index.js"
|
|
@@ -69,6 +75,7 @@
|
|
|
69
75
|
},
|
|
70
76
|
"./demo": {
|
|
71
77
|
"bun": "./src/demo/index.ts",
|
|
78
|
+
"browser": "./src/demo/index.ts",
|
|
72
79
|
"import": {
|
|
73
80
|
"types": "./dist/demo/index.d.ts",
|
|
74
81
|
"default": "./dist/demo/index.js"
|
|
@@ -76,6 +83,7 @@
|
|
|
76
83
|
},
|
|
77
84
|
"./navigation": {
|
|
78
85
|
"bun": "./src/navigation/index.ts",
|
|
86
|
+
"browser": "./src/navigation/index.ts",
|
|
79
87
|
"import": {
|
|
80
88
|
"types": "./dist/navigation/index.d.ts",
|
|
81
89
|
"default": "./dist/navigation/index.js"
|
|
@@ -107,11 +115,11 @@
|
|
|
107
115
|
"lucide-react": "^0.575.0",
|
|
108
116
|
"recharts": "^3.7.0",
|
|
109
117
|
"tailwind-merge": "^3.5.0",
|
|
110
|
-
"tailwindcss": "^4.2.
|
|
118
|
+
"tailwindcss": "^4.2.1"
|
|
111
119
|
},
|
|
112
120
|
"devDependencies": {
|
|
113
121
|
"@syncular/config": "0.0.0",
|
|
114
|
-
"@tailwindcss/cli": "^4.2.
|
|
122
|
+
"@tailwindcss/cli": "^4.2.1",
|
|
115
123
|
"@types/react": "^19.2.14"
|
|
116
124
|
}
|
|
117
125
|
}
|
|
@@ -4,7 +4,14 @@ import { type ComponentPropsWithoutRef, forwardRef } from 'react';
|
|
|
4
4
|
import { cn } from '../lib/cn';
|
|
5
5
|
import type { ApiKeyEntry } from '../lib/types';
|
|
6
6
|
import { Badge, type BadgeProps } from '../primitives/badge';
|
|
7
|
-
import {
|
|
7
|
+
import {
|
|
8
|
+
Table,
|
|
9
|
+
TableBody,
|
|
10
|
+
TableCell,
|
|
11
|
+
TableHead,
|
|
12
|
+
TableHeader,
|
|
13
|
+
TableRow,
|
|
14
|
+
} from '../primitives/table';
|
|
8
15
|
|
|
9
16
|
export type ApiKeysTableProps = ComponentPropsWithoutRef<'div'> & {
|
|
10
17
|
keys: ApiKeyEntry[];
|
|
@@ -24,76 +31,62 @@ const ApiKeysTable = forwardRef<HTMLDivElement, ApiKeysTableProps>(
|
|
|
24
31
|
{ className, keys, onCreateKey, onRotateKey, onRevokeKey, ...props },
|
|
25
32
|
ref
|
|
26
33
|
) => (
|
|
27
|
-
<div
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
<
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
)}
|
|
84
|
-
{onRevokeKey && (
|
|
85
|
-
<Button
|
|
86
|
-
variant="destructive"
|
|
87
|
-
size="sm"
|
|
88
|
-
className="text-[9px] px-1.5 py-0.5"
|
|
89
|
-
onClick={() => onRevokeKey(k.name)}
|
|
90
|
-
>
|
|
91
|
-
Revoke
|
|
92
|
-
</Button>
|
|
93
|
-
)}
|
|
94
|
-
</span>
|
|
95
|
-
</div>
|
|
96
|
-
))}
|
|
34
|
+
<div ref={ref} className={cn('w-full', className)} {...props}>
|
|
35
|
+
<Table>
|
|
36
|
+
<TableHeader>
|
|
37
|
+
<TableRow>
|
|
38
|
+
<TableHead>Name</TableHead>
|
|
39
|
+
<TableHead>Type</TableHead>
|
|
40
|
+
<TableHead>Prefix</TableHead>
|
|
41
|
+
<TableHead>Created</TableHead>
|
|
42
|
+
</TableRow>
|
|
43
|
+
</TableHeader>
|
|
44
|
+
<TableBody>
|
|
45
|
+
{keys.map((k, i) => (
|
|
46
|
+
<TableRow
|
|
47
|
+
key={`${k.name}:${k.prefix}:${i}`}
|
|
48
|
+
className="group relative"
|
|
49
|
+
>
|
|
50
|
+
<TableCell>
|
|
51
|
+
<span className="text-white truncate">{k.name}</span>
|
|
52
|
+
</TableCell>
|
|
53
|
+
<TableCell>
|
|
54
|
+
<Badge variant={typeBadgeMap[k.type] ?? 'ghost'}>
|
|
55
|
+
{k.type}
|
|
56
|
+
</Badge>
|
|
57
|
+
</TableCell>
|
|
58
|
+
<TableCell>
|
|
59
|
+
<span className="text-neutral-500 truncate">{k.prefix}</span>
|
|
60
|
+
</TableCell>
|
|
61
|
+
<TableCell>
|
|
62
|
+
<span className="text-neutral-600 truncate">{k.created}</span>
|
|
63
|
+
</TableCell>
|
|
64
|
+
{(onRotateKey || onRevokeKey) && (
|
|
65
|
+
<div className="absolute right-2 top-1/2 -translate-y-1/2 flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity">
|
|
66
|
+
{onRotateKey && (
|
|
67
|
+
<button
|
|
68
|
+
type="button"
|
|
69
|
+
onClick={() => onRotateKey(k.name)}
|
|
70
|
+
className="flex items-center gap-1 px-1.5 py-0.5 rounded text-[9px] text-neutral-600 hover:text-white hover:bg-white/[0.05] cursor-pointer transition-colors"
|
|
71
|
+
>
|
|
72
|
+
rotate
|
|
73
|
+
</button>
|
|
74
|
+
)}
|
|
75
|
+
{onRevokeKey && (
|
|
76
|
+
<button
|
|
77
|
+
type="button"
|
|
78
|
+
onClick={() => onRevokeKey(k.name)}
|
|
79
|
+
className="flex items-center gap-1 px-1.5 py-0.5 rounded text-[9px] text-neutral-600 hover:text-offline hover:bg-offline/10 cursor-pointer transition-colors"
|
|
80
|
+
>
|
|
81
|
+
revoke
|
|
82
|
+
</button>
|
|
83
|
+
)}
|
|
84
|
+
</div>
|
|
85
|
+
)}
|
|
86
|
+
</TableRow>
|
|
87
|
+
))}
|
|
88
|
+
</TableBody>
|
|
89
|
+
</Table>
|
|
97
90
|
</div>
|
|
98
91
|
)
|
|
99
92
|
);
|
|
@@ -34,7 +34,11 @@ export function DangerActionCard({
|
|
|
34
34
|
) : null}
|
|
35
35
|
{stats ? <div>{stats}</div> : null}
|
|
36
36
|
{onAction ? (
|
|
37
|
-
<Button
|
|
37
|
+
<Button
|
|
38
|
+
variant="destructive"
|
|
39
|
+
className="self-start"
|
|
40
|
+
onClick={onAction}
|
|
41
|
+
>
|
|
38
42
|
{actionLabel}
|
|
39
43
|
</Button>
|
|
40
44
|
) : null}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
|
|
3
|
+
import { UserX } from 'lucide-react';
|
|
3
4
|
import { type ComponentPropsWithoutRef, forwardRef } from 'react';
|
|
4
5
|
import { cn } from '../lib/cn';
|
|
5
6
|
import type { SyncClientNode } from '../lib/types';
|
|
@@ -39,14 +40,13 @@ const FleetTable = forwardRef<HTMLDivElement, FleetTableProps>(
|
|
|
39
40
|
<Table>
|
|
40
41
|
<TableHeader>
|
|
41
42
|
<TableRow>
|
|
42
|
-
<TableHead>Client</TableHead>
|
|
43
|
-
<TableHead>Status</TableHead>
|
|
44
|
-
<TableHead>Type</TableHead>
|
|
45
|
-
<TableHead>Cursor</TableHead>
|
|
46
|
-
<TableHead>Lag</TableHead>
|
|
47
|
-
<TableHead>Dialect</TableHead>
|
|
48
|
-
<TableHead>Mode</TableHead>
|
|
49
|
-
{onEvict && <TableHead>Actions</TableHead>}
|
|
43
|
+
<TableHead className="w-[160px]">Client</TableHead>
|
|
44
|
+
<TableHead className="w-[70px]">Status</TableHead>
|
|
45
|
+
<TableHead className="w-[60px]">Type</TableHead>
|
|
46
|
+
<TableHead className="w-[80px]">Cursor</TableHead>
|
|
47
|
+
<TableHead className="w-[110px]">Lag</TableHead>
|
|
48
|
+
<TableHead className="w-[60px]">Dialect</TableHead>
|
|
49
|
+
<TableHead className="flex-1">Mode</TableHead>
|
|
50
50
|
</TableRow>
|
|
51
51
|
</TableHeader>
|
|
52
52
|
<TableBody>
|
|
@@ -59,8 +59,8 @@ const FleetTable = forwardRef<HTMLDivElement, FleetTableProps>(
|
|
|
59
59
|
const lagColor = getLagColor(lag);
|
|
60
60
|
|
|
61
61
|
return (
|
|
62
|
-
<TableRow key={client.id}>
|
|
63
|
-
<TableCell>
|
|
62
|
+
<TableRow key={client.id} className="group relative">
|
|
63
|
+
<TableCell className="w-[160px]">
|
|
64
64
|
<div className="flex items-center gap-2">
|
|
65
65
|
<span
|
|
66
66
|
className="w-1.5 h-1.5 rounded-full flex-shrink-0"
|
|
@@ -79,22 +79,22 @@ const FleetTable = forwardRef<HTMLDivElement, FleetTableProps>(
|
|
|
79
79
|
</span>
|
|
80
80
|
</div>
|
|
81
81
|
</TableCell>
|
|
82
|
-
<TableCell>
|
|
82
|
+
<TableCell className="w-[70px]">
|
|
83
83
|
<Badge variant={statusBadgeVariant[client.status]}>
|
|
84
84
|
{client.status}
|
|
85
85
|
</Badge>
|
|
86
86
|
</TableCell>
|
|
87
|
-
<TableCell>
|
|
87
|
+
<TableCell className="w-[60px]">
|
|
88
88
|
<span className="font-mono text-[10px] text-neutral-400">
|
|
89
89
|
{client.type}
|
|
90
90
|
</span>
|
|
91
91
|
</TableCell>
|
|
92
|
-
<TableCell>
|
|
92
|
+
<TableCell className="w-[80px]">
|
|
93
93
|
<span className="font-mono text-[11px] text-white font-medium">
|
|
94
94
|
#{client.cursor.toLocaleString()}
|
|
95
95
|
</span>
|
|
96
96
|
</TableCell>
|
|
97
|
-
<TableCell>
|
|
97
|
+
<TableCell className="w-[110px]">
|
|
98
98
|
<div className="flex items-center gap-2">
|
|
99
99
|
<div className="w-[60px] h-[3px] rounded-full bg-surface overflow-hidden">
|
|
100
100
|
<div
|
|
@@ -110,12 +110,12 @@ const FleetTable = forwardRef<HTMLDivElement, FleetTableProps>(
|
|
|
110
110
|
</span>
|
|
111
111
|
</div>
|
|
112
112
|
</TableCell>
|
|
113
|
-
<TableCell>
|
|
113
|
+
<TableCell className="w-[60px]">
|
|
114
114
|
<span className="font-mono text-[10px] text-neutral-400">
|
|
115
115
|
{client.dialect}
|
|
116
116
|
</span>
|
|
117
117
|
</TableCell>
|
|
118
|
-
<TableCell>
|
|
118
|
+
<TableCell className="flex-1">
|
|
119
119
|
<Badge
|
|
120
120
|
variant={client.mode === 'realtime' ? 'flow' : 'ghost'}
|
|
121
121
|
>
|
|
@@ -123,15 +123,15 @@ const FleetTable = forwardRef<HTMLDivElement, FleetTableProps>(
|
|
|
123
123
|
</Badge>
|
|
124
124
|
</TableCell>
|
|
125
125
|
{onEvict && (
|
|
126
|
-
<
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
</
|
|
126
|
+
<button
|
|
127
|
+
type="button"
|
|
128
|
+
title="Evict client"
|
|
129
|
+
onClick={() => onEvict(client.id)}
|
|
130
|
+
className="absolute right-2 top-1/2 -translate-y-1/2 flex items-center gap-1 px-1.5 py-0.5 rounded text-[9px] text-neutral-600 hover:text-offline hover:bg-offline/10 cursor-pointer transition-colors opacity-0 group-hover:opacity-100"
|
|
131
|
+
>
|
|
132
|
+
<UserX size={10} />
|
|
133
|
+
evict
|
|
134
|
+
</button>
|
|
135
135
|
)}
|
|
136
136
|
</TableRow>
|
|
137
137
|
);
|
package/src/navigation/index.ts
CHANGED
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import { cn } from '../lib/cn';
|
|
4
|
+
import { buttonVariants } from '../primitives/button';
|
|
5
|
+
|
|
6
|
+
export const navActionLinkClassName = cn(
|
|
7
|
+
buttonVariants({ variant: 'secondary', size: 'sm' }),
|
|
8
|
+
'h-7 whitespace-nowrap uppercase tracking-[0.08em] leading-none no-underline'
|
|
9
|
+
);
|
|
@@ -17,15 +17,18 @@ export function TopNavigation({
|
|
|
17
17
|
className,
|
|
18
18
|
}: TopNavigationProps) {
|
|
19
19
|
return (
|
|
20
|
-
|
|
21
|
-
className=
|
|
22
|
-
|
|
23
|
-
className
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
20
|
+
<>
|
|
21
|
+
<div aria-hidden="true" className="h-[42px] shrink-0" />
|
|
22
|
+
<nav
|
|
23
|
+
className={cn(
|
|
24
|
+
'fixed top-0 left-0 right-0 z-100 h-[42px] border-b border-border bg-surface/88 backdrop-blur-lg flex items-center justify-between px-5',
|
|
25
|
+
className
|
|
26
|
+
)}
|
|
27
|
+
>
|
|
28
|
+
<div className="flex items-center gap-3">{brand}</div>
|
|
29
|
+
<div className="flex items-center gap-0.5">{center}</div>
|
|
30
|
+
<div className="flex items-center gap-2">{right}</div>
|
|
31
|
+
</nav>
|
|
32
|
+
</>
|
|
30
33
|
);
|
|
31
34
|
}
|
package/src/primitives/badge.tsx
CHANGED
|
@@ -5,7 +5,7 @@ import { type ComponentPropsWithoutRef, forwardRef } from 'react';
|
|
|
5
5
|
import { cn } from '../lib/cn';
|
|
6
6
|
|
|
7
7
|
const badgeVariants = cva(
|
|
8
|
-
'inline-flex items-center gap-1 px-2 py-0.5 rounded-sm font-mono text-[9px] uppercase tracking-wider',
|
|
8
|
+
'inline-flex items-center gap-1 px-2 py-0.5 rounded-sm font-mono text-[9px] leading-normal uppercase tracking-wider',
|
|
9
9
|
{
|
|
10
10
|
variants: {
|
|
11
11
|
variant: {
|
|
@@ -31,10 +31,11 @@ type BadgeProps = ComponentPropsWithoutRef<'span'> &
|
|
|
31
31
|
VariantProps<typeof badgeVariants>;
|
|
32
32
|
|
|
33
33
|
const Badge = forwardRef<HTMLSpanElement, BadgeProps>(
|
|
34
|
-
({ className, variant, ...props }, ref) => (
|
|
34
|
+
({ className, variant, style, ...props }, ref) => (
|
|
35
35
|
<span
|
|
36
36
|
ref={ref}
|
|
37
37
|
className={cn(badgeVariants({ variant, className }))}
|
|
38
|
+
style={{ lineHeight: 1, ...style }}
|
|
38
39
|
{...props}
|
|
39
40
|
/>
|
|
40
41
|
)
|
package/src/primitives/table.tsx
CHANGED
|
@@ -3,69 +3,83 @@
|
|
|
3
3
|
import { type ComponentPropsWithoutRef, forwardRef } from 'react';
|
|
4
4
|
import { cn } from '../lib/cn';
|
|
5
5
|
|
|
6
|
-
const Table = forwardRef<
|
|
6
|
+
const Table = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(
|
|
7
7
|
({ className, ...props }, ref) => (
|
|
8
|
-
|
|
8
|
+
// biome-ignore lint/a11y/useSemanticElements: using div for flex layout compatibility
|
|
9
|
+
<div
|
|
10
|
+
ref={ref}
|
|
11
|
+
role="table"
|
|
12
|
+
className={cn('w-full', className)}
|
|
13
|
+
{...props}
|
|
14
|
+
/>
|
|
9
15
|
)
|
|
10
16
|
);
|
|
11
17
|
Table.displayName = 'Table';
|
|
12
18
|
|
|
13
|
-
const TableHeader = forwardRef<
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
)
|
|
19
|
+
const TableHeader = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(
|
|
20
|
+
({ className, ...props }, ref) => (
|
|
21
|
+
// biome-ignore lint/a11y/useSemanticElements: using div for flex layout compatibility
|
|
22
|
+
<div ref={ref} role="rowgroup" className={cn(className)} {...props} />
|
|
23
|
+
)
|
|
24
|
+
);
|
|
19
25
|
TableHeader.displayName = 'TableHeader';
|
|
20
26
|
|
|
21
|
-
const TableBody = forwardRef<
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
)
|
|
27
|
+
const TableBody = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(
|
|
28
|
+
({ className, ...props }, ref) => (
|
|
29
|
+
// biome-ignore lint/a11y/useSemanticElements: using div for flex layout compatibility
|
|
30
|
+
<div ref={ref} role="rowgroup" className={cn(className)} {...props} />
|
|
31
|
+
)
|
|
32
|
+
);
|
|
27
33
|
TableBody.displayName = 'TableBody';
|
|
28
34
|
|
|
29
|
-
const TableRow = forwardRef<
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
35
|
+
const TableRow = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(
|
|
36
|
+
({ className, ...props }, ref) => (
|
|
37
|
+
// biome-ignore lint/a11y/useSemanticElements: using div for flex layout compatibility
|
|
38
|
+
// biome-ignore lint/a11y/useFocusableInteractive: presentational table row, not interactive
|
|
39
|
+
<div
|
|
40
|
+
ref={ref}
|
|
41
|
+
role="row"
|
|
42
|
+
className={cn(
|
|
43
|
+
'font-mono text-[11px] leading-6 px-4 flex items-center gap-4 border-b border-[#141414] hover:bg-white/[0.015] transition-colors cursor-default',
|
|
44
|
+
className
|
|
45
|
+
)}
|
|
46
|
+
{...props}
|
|
47
|
+
/>
|
|
48
|
+
)
|
|
49
|
+
);
|
|
42
50
|
TableRow.displayName = 'TableRow';
|
|
43
51
|
|
|
44
|
-
const TableHead = forwardRef<
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
52
|
+
const TableHead = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(
|
|
53
|
+
({ className, ...props }, ref) => (
|
|
54
|
+
// biome-ignore lint/a11y/useSemanticElements: using div for flex layout compatibility
|
|
55
|
+
// biome-ignore lint/a11y/useFocusableInteractive: presentational column header, not interactive
|
|
56
|
+
<div
|
|
57
|
+
ref={ref}
|
|
58
|
+
role="columnheader"
|
|
59
|
+
className={cn(
|
|
60
|
+
'min-w-0 font-mono text-[9px] text-neutral-600 uppercase tracking-wider leading-6 bg-white/[0.01] text-left truncate',
|
|
61
|
+
className
|
|
62
|
+
)}
|
|
63
|
+
{...props}
|
|
64
|
+
/>
|
|
65
|
+
)
|
|
66
|
+
);
|
|
57
67
|
TableHead.displayName = 'TableHead';
|
|
58
68
|
|
|
59
|
-
const TableCell = forwardRef<
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
)
|
|
69
|
+
const TableCell = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(
|
|
70
|
+
({ className, ...props }, ref) => (
|
|
71
|
+
// biome-ignore lint/a11y/useSemanticElements: using div for flex layout compatibility
|
|
72
|
+
<div
|
|
73
|
+
ref={ref}
|
|
74
|
+
role="cell"
|
|
75
|
+
className={cn(
|
|
76
|
+
'min-w-0 whitespace-nowrap overflow-hidden text-ellipsis',
|
|
77
|
+
className
|
|
78
|
+
)}
|
|
79
|
+
{...props}
|
|
80
|
+
/>
|
|
81
|
+
)
|
|
82
|
+
);
|
|
69
83
|
TableCell.displayName = 'TableCell';
|
|
70
84
|
|
|
71
85
|
export { Table, TableHeader, TableBody, TableRow, TableHead, TableCell };
|