@xeonr/platform-ui 0.1.0 → 0.2.0
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/index.d.ts +5 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +7 -0
- package/dist/index.js.map +1 -1
- package/dist/kit/Badge.d.ts +1 -0
- package/dist/kit/Badge.d.ts.map +1 -1
- package/dist/kit/Badge.js +1 -0
- package/dist/kit/Badge.js.map +1 -1
- package/dist/kit/Blocks.d.ts +78 -0
- package/dist/kit/Blocks.d.ts.map +1 -0
- package/dist/kit/Blocks.js +192 -0
- package/dist/kit/Blocks.js.map +1 -0
- package/dist/kit/Chip.d.ts +21 -0
- package/dist/kit/Chip.d.ts.map +1 -0
- package/dist/kit/Chip.js +53 -0
- package/dist/kit/Chip.js.map +1 -0
- package/dist/kit/DataTable.d.ts +3 -1
- package/dist/kit/DataTable.d.ts.map +1 -1
- package/dist/kit/DataTable.js +7 -2
- package/dist/kit/DataTable.js.map +1 -1
- package/dist/kit/List.d.ts +37 -0
- package/dist/kit/List.d.ts.map +1 -0
- package/dist/kit/List.js +80 -0
- package/dist/kit/List.js.map +1 -0
- package/dist/kit/LogView.d.ts +2 -0
- package/dist/kit/LogView.d.ts.map +1 -1
- package/dist/kit/LogView.js +7 -1
- package/dist/kit/LogView.js.map +1 -1
- package/dist/kit/Stat.d.ts +21 -0
- package/dist/kit/Stat.d.ts.map +1 -0
- package/dist/kit/Stat.js +49 -0
- package/dist/kit/Stat.js.map +1 -0
- package/dist/kit/Text.d.ts +39 -0
- package/dist/kit/Text.d.ts.map +1 -0
- package/dist/kit/Text.js +68 -0
- package/dist/kit/Text.js.map +1 -0
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -15,4 +15,9 @@ export { LogSurface, LogPanel, type LogLine } from "./kit/LogView.tsx";
|
|
|
15
15
|
export { KVGrid } from "./kit/KV.tsx";
|
|
16
16
|
export { SecretField, CopyIcon } from "./kit/Secret.tsx";
|
|
17
17
|
export { ToastProvider, useToast } from "./kit/Toast.tsx";
|
|
18
|
+
export { Mono, Num, Hint, Cell, InlineLink } from "./kit/Text.tsx";
|
|
19
|
+
export { RowList, ListRow, RowActions, SelectableList, Breadcrumbs } from "./kit/List.tsx";
|
|
20
|
+
export { FilterBar, Chip, EditableChip } from "./kit/Chip.tsx";
|
|
21
|
+
export { StatGrid, StatTile, Meter } from "./kit/Stat.tsx";
|
|
22
|
+
export { Tabs, Disclosure, Subpanel, SubpanelHead, AddPanel, Callout, RepeaterRows, CodeBlock, StepList, CopyField, PanelHeadMeta, LoadMoreFooter, DarkSurface, } from "./kit/Blocks.tsx";
|
|
18
23
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAE,KAAK,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAIvF,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,kBAAkB,CAAC;AACzF,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACtE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC9G,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EACL,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EACtE,WAAW,EAAE,WAAW,EAAE,WAAW,EACrC,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,MAAM,GACxC,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC3E,OAAO,EAAE,SAAS,EAAE,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AACpG,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,KAAK,OAAO,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAE,KAAK,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAIvF,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,kBAAkB,CAAC;AACzF,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACtE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC9G,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EACL,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EACtE,WAAW,EAAE,WAAW,EAAE,WAAW,EACrC,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,MAAM,GACxC,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC3E,OAAO,EAAE,SAAS,EAAE,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AACpG,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,KAAK,OAAO,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAI1D,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACnE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC3F,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAC3D,OAAO,EACL,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,EAAE,OAAO,EAAE,YAAY,EACzE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,EAAE,cAAc,EAAE,WAAW,GAC3E,MAAM,kBAAkB,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -21,4 +21,11 @@ export { LogSurface, LogPanel } from "./kit/LogView.js";
|
|
|
21
21
|
export { KVGrid } from "./kit/KV.js";
|
|
22
22
|
export { SecretField, CopyIcon } from "./kit/Secret.js";
|
|
23
23
|
export { ToastProvider, useToast } from "./kit/Toast.js";
|
|
24
|
+
// Added for the Container Platform adoption (2026-09-26): the widgets every
|
|
25
|
+
// list and detail screen grows locally, now shared.
|
|
26
|
+
export { Mono, Num, Hint, Cell, InlineLink } from "./kit/Text.js";
|
|
27
|
+
export { RowList, ListRow, RowActions, SelectableList, Breadcrumbs } from "./kit/List.js";
|
|
28
|
+
export { FilterBar, Chip, EditableChip } from "./kit/Chip.js";
|
|
29
|
+
export { StatGrid, StatTile, Meter } from "./kit/Stat.js";
|
|
30
|
+
export { Tabs, Disclosure, Subpanel, SubpanelHead, AddPanel, Callout, RepeaterRows, CodeBlock, StepList, CopyField, PanelHeadMeta, LoadMoreFooter, DarkSurface, } from "./kit/Blocks.js";
|
|
24
31
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,iEAAiE;AACjE,EAAE;AACF,2EAA2E;AAC3E,sEAAsE;AACtE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAkB,MAAM,0BAA2B,CAAC;AAEvF,4EAA4E;AAC5E,oDAAoD;AACpD,OAAO,EAAE,IAAI,EAAE,WAAW,EAAiB,MAAM,eAAgB,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAuB,MAAM,iBAAkB,CAAC;AACzF,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,OAAO,EAAa,MAAM,gBAAiB,CAAC;AACtE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,gBAAiB,CAAC;AAC9G,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,mBAAoB,CAAC;AAC3D,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAsB,CAAC;AAClD,OAAO,EACL,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EACtE,WAAW,EAAE,WAAW,EAAE,WAAW,EACrC,QAAQ,EAAE,OAAO,EAAE,OAAO,GAC3B,MAAM,eAAgB,CAAC;AACxB,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,gBAAiB,CAAC;AAC3E,OAAO,EAAE,SAAS,EAAe,MAAM,oBAAqB,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,qBAAsB,CAAC;AACpG,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,uBAAwB,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAgB,MAAM,kBAAmB,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,MAAM,aAAc,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,iBAAkB,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,gBAAiB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,iEAAiE;AACjE,EAAE;AACF,2EAA2E;AAC3E,sEAAsE;AACtE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAkB,MAAM,0BAA2B,CAAC;AAEvF,4EAA4E;AAC5E,oDAAoD;AACpD,OAAO,EAAE,IAAI,EAAE,WAAW,EAAiB,MAAM,eAAgB,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAuB,MAAM,iBAAkB,CAAC;AACzF,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,OAAO,EAAa,MAAM,gBAAiB,CAAC;AACtE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,gBAAiB,CAAC;AAC9G,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,mBAAoB,CAAC;AAC3D,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAsB,CAAC;AAClD,OAAO,EACL,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EACtE,WAAW,EAAE,WAAW,EAAE,WAAW,EACrC,QAAQ,EAAE,OAAO,EAAE,OAAO,GAC3B,MAAM,eAAgB,CAAC;AACxB,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,gBAAiB,CAAC;AAC3E,OAAO,EAAE,SAAS,EAAe,MAAM,oBAAqB,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,qBAAsB,CAAC;AACpG,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,uBAAwB,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAgB,MAAM,kBAAmB,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,MAAM,aAAc,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,iBAAkB,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,gBAAiB,CAAC;AAE1D,4EAA4E;AAC5E,oDAAoD;AACpD,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,eAAgB,CAAC;AACnE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,eAAgB,CAAC;AAC3F,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,eAAgB,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,eAAgB,CAAC;AAC3D,OAAO,EACL,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,EAAE,OAAO,EAAE,YAAY,EACzE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,aAAa,EAAE,cAAc,EAAE,WAAW,GAC3E,MAAM,iBAAkB,CAAC"}
|
package/dist/kit/Badge.d.ts
CHANGED
|
@@ -10,6 +10,7 @@ export declare const Tag: import("styled-components/dist/types").IStyledComponen
|
|
|
10
10
|
style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
|
|
11
11
|
}, {
|
|
12
12
|
$tone?: Tone | undefined;
|
|
13
|
+
$dashed?: boolean | undefined;
|
|
13
14
|
}>> & string;
|
|
14
15
|
export declare const LiveDot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Merged<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "style"> & {
|
|
15
16
|
style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
|
package/dist/kit/Badge.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/kit/Badge.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,CAAC;AAc7E,eAAO,MAAM,UAAU;;;WAAwB,IAAI;YAAU,OAAO,GAAG,SAAS;YAsB/E,CAAC;AAEF,0EAA0E;AAC1E,eAAO,MAAM,GAAG;;;YAAyB,IAAI,GAAG,SAAS;
|
|
1
|
+
{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/kit/Badge.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,CAAC;AAc7E,eAAO,MAAM,UAAU;;;WAAwB,IAAI;YAAU,OAAO,GAAG,SAAS;YAsB/E,CAAC;AAEF,0EAA0E;AAC1E,eAAO,MAAM,GAAG;;;YAAyB,IAAI,GAAG,SAAS;cAAY,OAAO,GAAG,SAAS;YAiBvF,CAAC;AAGF,eAAO,MAAM,OAAO;;;YAAsB,IAAI,GAAG,SAAS;YAMzD,CAAC"}
|
package/dist/kit/Badge.js
CHANGED
|
@@ -49,6 +49,7 @@ export const Tag = styled.span `
|
|
|
49
49
|
overflow: hidden;
|
|
50
50
|
text-overflow: ellipsis;
|
|
51
51
|
${(p) => (p.$tone ? css `border-color: transparent; ${tones[p.$tone]}` : "")}
|
|
52
|
+
${(p) => p.$dashed && css `background: transparent; border-style: dashed; border-color: currentColor; letter-spacing: 0.08em; text-transform: uppercase; font-size: 9px; font-weight: 600;`}
|
|
52
53
|
`;
|
|
53
54
|
const dotPulse = keyframes `50% { opacity: 0.4; }`;
|
|
54
55
|
export const LiveDot = styled.i `
|
package/dist/kit/Badge.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../src/kit/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,CAAC,EAAE,MAAM,oBAAoB,CAAC;AAIvC,MAAM,KAAK,GAAyC;IAClD,EAAE,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,SAAS,YAAY,CAAC,CAAC,OAAO,GAAG;IACzD,GAAG,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,MAAM,YAAY,CAAC,CAAC,IAAI,GAAG;IACpD,IAAI,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,SAAS,YAAY,CAAC,CAAC,OAAO,GAAG;IAC3D,IAAI,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,QAAQ,YAAY,CAAC,CAAC,MAAM,GAAG;IACzD,IAAI,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,MAAM,YAAY,CAAC,CAAC,IAAI,GAAG;IACrD,KAAK,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,OAAO,YAAY,CAAC,CAAC,KAAK,GAAG;IACxD,GAAG,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,KAAK,YAAY,CAAC,CAAC,KAAK,GAAG;CACrD,CAAC;AAEF,MAAM,OAAO,GAAG,SAAS,CAAA,wBAAwB,CAAC;AAElD,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAA8C;;;;;;;;;;;IAW/E,CAAC,CAAC,EAAE,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC;IACrB,CAAC,CAAC,EAAE,EAAE,CACN,CAAC,CAAC,KAAK;IACP,GAAG,CAAA;;;;;qBAKc,OAAO;;KAEvB;CACJ,CAAC;AAEF,0EAA0E;AAC1E,MAAM,CAAC,MAAM,GAAG,GAAG,MAAM,CAAC,IAAI,
|
|
1
|
+
{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../src/kit/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,CAAC,EAAE,MAAM,oBAAoB,CAAC;AAIvC,MAAM,KAAK,GAAyC;IAClD,EAAE,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,SAAS,YAAY,CAAC,CAAC,OAAO,GAAG;IACzD,GAAG,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,MAAM,YAAY,CAAC,CAAC,IAAI,GAAG;IACpD,IAAI,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,SAAS,YAAY,CAAC,CAAC,OAAO,GAAG;IAC3D,IAAI,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,QAAQ,YAAY,CAAC,CAAC,MAAM,GAAG;IACzD,IAAI,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,MAAM,YAAY,CAAC,CAAC,IAAI,GAAG;IACrD,KAAK,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,OAAO,YAAY,CAAC,CAAC,KAAK,GAAG;IACxD,GAAG,EAAE,GAAG,CAAA,eAAe,CAAC,CAAC,KAAK,YAAY,CAAC,CAAC,KAAK,GAAG;CACrD,CAAC;AAEF,MAAM,OAAO,GAAG,SAAS,CAAA,wBAAwB,CAAC;AAElD,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAA8C;;;;;;;;;;;IAW/E,CAAC,CAAC,EAAE,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC;IACrB,CAAC,CAAC,EAAE,EAAE,CACN,CAAC,CAAC,KAAK;IACP,GAAG,CAAA;;;;;qBAKc,OAAO;;KAEvB;CACJ,CAAC;AAEF,0EAA0E;AAC1E,MAAM,CAAC,MAAM,GAAG,GAAG,MAAM,CAAC,IAAI,CAA6D;;;;;;;iBAO1E,CAAC,CAAC,IAAI;;sBAED,CAAC,CAAC,KAAK;WAClB,CAAC,CAAC,KAAK;;;;;IAKd,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAA,8BAA8B,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;IACzE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,IAAI,GAAG,CAAA,iKAAiK;CAC3L,CAAC;AAEF,MAAM,QAAQ,GAAG,SAAS,CAAA,uBAAuB,CAAC;AAClD,MAAM,CAAC,MAAM,OAAO,GAAG,MAAM,CAAC,CAAC,CAA8B;;;gBAG7C,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;;eAEpF,QAAQ;CACtB,CAAC"}
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
import { type ReactNode } from "react";
|
|
2
|
+
export declare function Tabs<T extends string>({ tabs, value, onChange, mono, label }: {
|
|
3
|
+
tabs: {
|
|
4
|
+
id: T;
|
|
5
|
+
label: ReactNode;
|
|
6
|
+
meta?: ReactNode | undefined;
|
|
7
|
+
}[];
|
|
8
|
+
value: T;
|
|
9
|
+
onChange: (id: T) => void;
|
|
10
|
+
mono?: boolean | undefined;
|
|
11
|
+
label?: string | undefined;
|
|
12
|
+
}): import("react").JSX.Element;
|
|
13
|
+
export declare function Disclosure({ summary, defaultOpen, open, onToggle, children }: {
|
|
14
|
+
summary: ReactNode;
|
|
15
|
+
defaultOpen?: boolean | undefined;
|
|
16
|
+
open?: boolean | undefined;
|
|
17
|
+
onToggle?: ((open: boolean) => void) | undefined;
|
|
18
|
+
children: ReactNode;
|
|
19
|
+
}): import("react").JSX.Element;
|
|
20
|
+
/** Subpanel: a bordered sub-block inside a Panel or modal. */
|
|
21
|
+
export declare const Subpanel: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "style"> & {
|
|
22
|
+
style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
|
|
23
|
+
}> & string;
|
|
24
|
+
export declare const SubpanelHead: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "style"> & {
|
|
25
|
+
style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
|
|
26
|
+
}> & string;
|
|
27
|
+
export declare function AddPanel({ label, onClick, disabled }: {
|
|
28
|
+
label: ReactNode;
|
|
29
|
+
onClick: () => void;
|
|
30
|
+
disabled?: boolean | undefined;
|
|
31
|
+
}): import("react").JSX.Element;
|
|
32
|
+
export declare function Callout({ tone, title, actions, children }: {
|
|
33
|
+
tone?: "info" | "warn" | "crit" | "ok" | undefined;
|
|
34
|
+
title?: ReactNode | undefined;
|
|
35
|
+
actions?: ReactNode | undefined;
|
|
36
|
+
children: ReactNode;
|
|
37
|
+
}): import("react").JSX.Element;
|
|
38
|
+
export declare function RepeaterRows<T>({ rows, onChange, render, blank, addLabel, emptyLabel, columns, disabled, max }: {
|
|
39
|
+
rows: T[];
|
|
40
|
+
onChange: (rows: T[]) => void;
|
|
41
|
+
render: (row: T, patch: (next: T) => void, index: number) => ReactNode;
|
|
42
|
+
blank: () => T;
|
|
43
|
+
addLabel?: ReactNode | undefined;
|
|
44
|
+
emptyLabel?: ReactNode | undefined;
|
|
45
|
+
/** grid-template-columns for the fields of one row */
|
|
46
|
+
columns?: string | undefined;
|
|
47
|
+
disabled?: boolean | undefined;
|
|
48
|
+
max?: number | undefined;
|
|
49
|
+
}): import("react").JSX.Element;
|
|
50
|
+
export declare function CodeBlock({ code, wrap }: {
|
|
51
|
+
code: string;
|
|
52
|
+
wrap?: boolean | undefined;
|
|
53
|
+
}): import("react").JSX.Element;
|
|
54
|
+
export declare function StepList({ steps }: {
|
|
55
|
+
steps: string[];
|
|
56
|
+
}): import("react").JSX.Element;
|
|
57
|
+
export declare function CopyField({ value, meta, label }: {
|
|
58
|
+
value: string;
|
|
59
|
+
meta?: ReactNode | undefined;
|
|
60
|
+
label?: string | undefined;
|
|
61
|
+
}): import("react").JSX.Element;
|
|
62
|
+
export declare function PanelHeadMeta({ title, meta }: {
|
|
63
|
+
title: ReactNode;
|
|
64
|
+
meta?: ReactNode | undefined;
|
|
65
|
+
}): import("react").JSX.Element;
|
|
66
|
+
export declare function LoadMoreFooter({ shown, total, hasMore, loading, onMore, noun }: {
|
|
67
|
+
shown: number;
|
|
68
|
+
total?: number | undefined;
|
|
69
|
+
hasMore: boolean;
|
|
70
|
+
loading?: boolean | undefined;
|
|
71
|
+
onMore: () => void;
|
|
72
|
+
noun?: string | undefined;
|
|
73
|
+
}): import("react").JSX.Element;
|
|
74
|
+
/** DarkSurface: an always-dark frame for editors and terminals (like LogSurface). */
|
|
75
|
+
export declare const DarkSurface: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "style"> & {
|
|
76
|
+
style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
|
|
77
|
+
}> & string;
|
|
78
|
+
//# sourceMappingURL=Blocks.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Blocks.d.ts","sourceRoot":"","sources":["../../src/kit/Blocks.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,192 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import styled, { css } from "styled-components";
|
|
3
|
+
import { useState } from "react";
|
|
4
|
+
import { v } from "../theme/tokens.js";
|
|
5
|
+
import { Icon } from "./Icon.js";
|
|
6
|
+
import { AppButton } from "./Button.js";
|
|
7
|
+
// Structural blocks inside a panel or a modal: tabs held in local state, a
|
|
8
|
+
// disclosure, a bordered sub-block, the dashed "add one" affordance, callouts,
|
|
9
|
+
// repeating editable rows, code and step lists, copy-first fields, and a
|
|
10
|
+
// panel head with a meta line.
|
|
11
|
+
/** Tabs: a local-state tab strip (routes use SubNav). */
|
|
12
|
+
const TabStrip = styled.div `
|
|
13
|
+
display: flex;
|
|
14
|
+
gap: 2px;
|
|
15
|
+
border-bottom: 1px solid ${v.line};
|
|
16
|
+
margin-bottom: 12px;
|
|
17
|
+
overflow-x: auto;
|
|
18
|
+
`;
|
|
19
|
+
const TabBtn = styled.button `
|
|
20
|
+
padding: 8px 12px;
|
|
21
|
+
font-size: 12px;
|
|
22
|
+
font-weight: 600;
|
|
23
|
+
${(p) => p.$mono && css `font-family: ${v.mono}; font-weight: 500;`}
|
|
24
|
+
color: ${(p) => (p.$on ? v.text : v.muted)};
|
|
25
|
+
border-bottom: 2px solid ${(p) => (p.$on ? v.brand : "transparent")};
|
|
26
|
+
margin-bottom: -1px;
|
|
27
|
+
white-space: nowrap;
|
|
28
|
+
display: inline-flex; align-items: center; gap: 6px;
|
|
29
|
+
.meta { font-size: 10.5px; color: ${v.faint}; font-family: ${v.mono}; }
|
|
30
|
+
&:hover { color: ${v.text}; }
|
|
31
|
+
`;
|
|
32
|
+
export function Tabs({ tabs, value, onChange, mono, label = "Tabs" }) {
|
|
33
|
+
return (_jsx(TabStrip, { role: "tablist", "aria-label": label, children: tabs.map((t) => (_jsxs(TabBtn, { type: "button", role: "tab", "aria-selected": t.id === value, "$on": t.id === value, "$mono": mono, onClick: () => onChange(t.id), children: [t.label, t.meta ? _jsx("span", { className: "meta", children: t.meta }) : null] }, t.id))) }));
|
|
34
|
+
}
|
|
35
|
+
/** Disclosure: a themed <details>. */
|
|
36
|
+
const Details = styled.details `
|
|
37
|
+
border: 1px solid ${v.line};
|
|
38
|
+
border-radius: ${v.rCard};
|
|
39
|
+
background: ${v.surface2};
|
|
40
|
+
summary {
|
|
41
|
+
cursor: pointer;
|
|
42
|
+
list-style: none;
|
|
43
|
+
padding: 9px 12px;
|
|
44
|
+
font-size: 12px;
|
|
45
|
+
font-weight: 600;
|
|
46
|
+
color: ${v.muted};
|
|
47
|
+
display: flex; align-items: center; gap: 8px;
|
|
48
|
+
&::-webkit-details-marker { display: none; }
|
|
49
|
+
svg { font-size: 10px; transition: transform 0.12s ease; }
|
|
50
|
+
}
|
|
51
|
+
&[open] summary { color: ${v.text}; border-bottom: 1px solid ${v.line}; }
|
|
52
|
+
&[open] summary svg { transform: rotate(90deg); }
|
|
53
|
+
> div { padding: 12px; }
|
|
54
|
+
`;
|
|
55
|
+
export function Disclosure({ summary, defaultOpen, open, onToggle, children }) {
|
|
56
|
+
return (_jsxs(Details, { open: open ?? (defaultOpen ? true : undefined), onToggle: (e) => onToggle?.(e.currentTarget.open), children: [_jsxs("summary", { children: [_jsx(Icon, { name: "chevron-right" }), summary] }), _jsx("div", { children: children })] }));
|
|
57
|
+
}
|
|
58
|
+
/** Subpanel: a bordered sub-block inside a Panel or modal. */
|
|
59
|
+
export const Subpanel = styled.div `
|
|
60
|
+
border: 1px solid ${v.line};
|
|
61
|
+
border-radius: ${v.rCard};
|
|
62
|
+
background: ${v.surface2};
|
|
63
|
+
padding: 12px;
|
|
64
|
+
display: flex; flex-direction: column; gap: 8px;
|
|
65
|
+
`;
|
|
66
|
+
export const SubpanelHead = styled.div `
|
|
67
|
+
display: flex; align-items: center; gap: 8px;
|
|
68
|
+
font-size: 12px; font-weight: 600;
|
|
69
|
+
> .actions { margin-left: auto; display: flex; gap: 6px; }
|
|
70
|
+
`;
|
|
71
|
+
/** AddPanel: the dashed "add one" affordance at the end of a list or editor. */
|
|
72
|
+
const AddBtn = styled.button `
|
|
73
|
+
width: 100%;
|
|
74
|
+
padding: 10px 12px;
|
|
75
|
+
border: 1px dashed ${v.line2};
|
|
76
|
+
border-radius: ${v.rCard};
|
|
77
|
+
color: ${v.muted};
|
|
78
|
+
font-size: 12px; font-weight: 600;
|
|
79
|
+
display: flex; align-items: center; justify-content: center; gap: 8px;
|
|
80
|
+
cursor: pointer;
|
|
81
|
+
&:hover { border-color: ${v.brand55}; color: ${v.text}; background: ${v.hover}; }
|
|
82
|
+
&:disabled { opacity: 0.55; cursor: not-allowed; }
|
|
83
|
+
`;
|
|
84
|
+
export function AddPanel({ label, onClick, disabled }) {
|
|
85
|
+
return _jsxs(AddBtn, { type: "button", onClick: onClick, disabled: disabled, children: [_jsx(Icon, { name: "add" }), label] });
|
|
86
|
+
}
|
|
87
|
+
/** Callout: an inline notice with a tone, optional title and actions. */
|
|
88
|
+
const CalloutWrap = styled.section `
|
|
89
|
+
border-radius: ${v.rCard};
|
|
90
|
+
padding: 12px 14px;
|
|
91
|
+
display: flex; gap: 12px; align-items: flex-start;
|
|
92
|
+
border: 1px solid transparent;
|
|
93
|
+
${(p) => p.$tone === "warn" && css `background: ${v.warningBg}; color: ${v.warning}; border-color: ${v.warning};`}
|
|
94
|
+
${(p) => p.$tone === "crit" && css `background: ${v.dangerBg}; color: ${v.danger}; border-color: ${v.danger};`}
|
|
95
|
+
${(p) => p.$tone === "ok" && css `background: ${v.successBg}; color: ${v.success}; border-color: ${v.success};`}
|
|
96
|
+
${(p) => p.$tone === "info" && css `background: ${v.infoBg}; color: ${v.info}; border-color: ${v.brand55};`}
|
|
97
|
+
.ic { flex: none; margin-top: 1px; }
|
|
98
|
+
.body { flex: 1 1 auto; min-width: 0; color: ${v.text}; font-size: 12.5px; line-height: 1.5; }
|
|
99
|
+
.title { display: block; font-weight: 650; margin-bottom: 2px; color: inherit; }
|
|
100
|
+
.actions { display: flex; gap: 8px; margin-top: 8px; }
|
|
101
|
+
ul { margin: 6px 0 0; padding-left: 18px; }
|
|
102
|
+
`;
|
|
103
|
+
export function Callout({ tone = "info", title, actions, children }) {
|
|
104
|
+
const icon = tone === "crit" ? "error" : tone === "warn" ? "warn" : tone === "ok" ? "check" : "info";
|
|
105
|
+
return (_jsxs(CalloutWrap, { "$tone": tone, role: tone === "crit" || tone === "warn" ? "alert" : "note", children: [_jsx("span", { className: "ic", children: _jsx(Icon, { name: icon }) }), _jsxs("div", { className: "body", children: [title ? _jsx("span", { className: "title", children: title }) : null, children, actions ? _jsx("div", { className: "actions", children: actions }) : null] })] }));
|
|
106
|
+
}
|
|
107
|
+
/** RepeaterRows: a list of editable rows with add/remove — the generalised KVEditor. */
|
|
108
|
+
const RepWrap = styled.div `display: flex; flex-direction: column; gap: 8px;`;
|
|
109
|
+
const RepRow = styled.div `
|
|
110
|
+
display: flex; align-items: flex-start; gap: 8px;
|
|
111
|
+
> .fields { flex: 1 1 auto; min-width: 0; display: grid; gap: 8px; }
|
|
112
|
+
`;
|
|
113
|
+
const RepRemove = styled.button `
|
|
114
|
+
flex: none; width: 30px; height: 34px;
|
|
115
|
+
display: grid; place-items: center;
|
|
116
|
+
color: ${v.faint}; border-radius: ${v.rCtl};
|
|
117
|
+
&:hover { color: ${v.danger}; background: ${v.dangerBg}; }
|
|
118
|
+
`;
|
|
119
|
+
const RepEmpty = styled.div `font-size: 11.5px; color: ${v.faint}; padding: 4px 0;`;
|
|
120
|
+
export function RepeaterRows({ rows, onChange, render, blank, addLabel = "Add", emptyLabel, columns = "1fr", disabled, max }) {
|
|
121
|
+
return (_jsxs(RepWrap, { children: [rows.length === 0 && emptyLabel ? _jsx(RepEmpty, { children: emptyLabel }) : null, rows.map((r, i) => (_jsxs(RepRow, { children: [_jsx("div", { className: "fields", style: { gridTemplateColumns: columns }, children: render(r, (next) => onChange(rows.map((x, j) => (j === i ? next : x))), i) }), _jsx(RepRemove, { type: "button", "aria-label": "Remove row", disabled: disabled, onClick: () => onChange(rows.filter((_, j) => j !== i)), children: _jsx(Icon, { name: "delete" }) })] }, i))), _jsx(AddPanel, { label: addLabel, disabled: disabled || (max !== undefined && rows.length >= max), onClick: () => onChange([...rows, blank()]) })] }));
|
|
122
|
+
}
|
|
123
|
+
/** CodeBlock and StepList: dark code surfaces (always dark, like logs). */
|
|
124
|
+
const Code = styled.pre `
|
|
125
|
+
margin: 0;
|
|
126
|
+
background: ${v.logBg};
|
|
127
|
+
color: ${v.logText};
|
|
128
|
+
font-family: ${v.mono};
|
|
129
|
+
font-size: 11.5px;
|
|
130
|
+
line-height: 1.6;
|
|
131
|
+
padding: 10px 12px;
|
|
132
|
+
border-radius: ${v.rCard};
|
|
133
|
+
overflow: auto;
|
|
134
|
+
white-space: ${(p) => (p.$wrap ? "pre-wrap" : "pre")};
|
|
135
|
+
`;
|
|
136
|
+
export function CodeBlock({ code, wrap }) {
|
|
137
|
+
return _jsx(Code, { "$wrap": wrap, children: code });
|
|
138
|
+
}
|
|
139
|
+
const Steps = styled.ol `
|
|
140
|
+
margin: 0; padding: 0; list-style: none;
|
|
141
|
+
background: ${v.logBg};
|
|
142
|
+
border-radius: ${v.rCard};
|
|
143
|
+
font-family: ${v.mono}; font-size: 11.5px; line-height: 1.6;
|
|
144
|
+
overflow: auto;
|
|
145
|
+
li { display: flex; gap: 12px; padding: 4px 12px; color: ${v.logText}; }
|
|
146
|
+
li:first-child { padding-top: 10px; } li:last-child { padding-bottom: 10px; }
|
|
147
|
+
.n { flex: none; width: 2ch; text-align: right; color: ${v.logDim}; user-select: none; }
|
|
148
|
+
.cmd { white-space: pre-wrap; word-break: break-all; }
|
|
149
|
+
`;
|
|
150
|
+
export function StepList({ steps }) {
|
|
151
|
+
return (_jsx(Steps, { children: steps.map((s, i) => _jsxs("li", { children: [_jsx("span", { className: "n", children: i + 1 }), _jsx("span", { className: "cmd", children: s })] }, i)) }));
|
|
152
|
+
}
|
|
153
|
+
/** CopyField: a read-only value shown in full with a copy button. */
|
|
154
|
+
const CopyWrap = styled.div `
|
|
155
|
+
display: flex; align-items: center; gap: 8px;
|
|
156
|
+
padding: 7px 10px;
|
|
157
|
+
border: 1px solid ${v.fieldLine};
|
|
158
|
+
background: ${v.field};
|
|
159
|
+
border-radius: ${v.rCtl};
|
|
160
|
+
code { flex: 1 1 auto; min-width: 0; font-family: ${v.mono}; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
161
|
+
small { flex: none; font-size: 10.5px; color: ${v.faint}; }
|
|
162
|
+
`;
|
|
163
|
+
export function CopyField({ value, meta, label = "Copy" }) {
|
|
164
|
+
const [done, setDone] = useState(false);
|
|
165
|
+
return (_jsxs(CopyWrap, { children: [_jsx("code", { title: value, children: value }), meta ? _jsx("small", { children: meta }) : null, _jsx(AppButton, { size: "xs", variant: "quiet", icon: done ? "check" : "copy", onClick: () => { void navigator.clipboard.writeText(value); setDone(true); setTimeout(() => setDone(false), 1200); }, children: label })] }));
|
|
166
|
+
}
|
|
167
|
+
/** PanelHeadMeta: a panel head with a title line and a meta line under it. */
|
|
168
|
+
const HeadMeta = styled.div `
|
|
169
|
+
display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto;
|
|
170
|
+
.t { font-size: 12px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
171
|
+
.m { font-size: 10.5px; color: ${v.faint}; font-family: ${v.mono}; display: flex; gap: 10px; flex-wrap: wrap; }
|
|
172
|
+
`;
|
|
173
|
+
export function PanelHeadMeta({ title, meta }) {
|
|
174
|
+
return (_jsxs(HeadMeta, { children: [_jsx("span", { className: "t", children: title }), meta ? _jsx("span", { className: "m", children: meta }) : null] }));
|
|
175
|
+
}
|
|
176
|
+
/** LoadMoreFooter: the standard "N shown · load more" table footer. */
|
|
177
|
+
const Foot = styled.div `
|
|
178
|
+
display: flex; align-items: center; gap: 10px; width: 100%;
|
|
179
|
+
> span { color: ${v.faint}; }
|
|
180
|
+
> button { margin-left: auto; }
|
|
181
|
+
`;
|
|
182
|
+
export function LoadMoreFooter({ shown, total, hasMore, loading, onMore, noun = "rows" }) {
|
|
183
|
+
return (_jsxs(Foot, { children: [_jsxs("span", { children: [shown, " ", noun, total !== undefined ? ` of ${total}` : "", " loaded"] }), hasMore ? _jsx(AppButton, { size: "xs", variant: "quiet", loading: loading, onClick: onMore, children: "Load more" }) : null] }));
|
|
184
|
+
}
|
|
185
|
+
/** DarkSurface: an always-dark frame for editors and terminals (like LogSurface). */
|
|
186
|
+
export const DarkSurface = styled.div `
|
|
187
|
+
background: ${v.termBg};
|
|
188
|
+
border: 1px solid ${v.line};
|
|
189
|
+
border-radius: ${v.rCard};
|
|
190
|
+
overflow: hidden;
|
|
191
|
+
`;
|
|
192
|
+
//# sourceMappingURL=Blocks.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Blocks.js","sourceRoot":"","sources":["../../src/kit/Blocks.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
/** FilterBar: wraps chips (and a search field) above a list. */
|
|
3
|
+
export declare const FilterBar: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "style"> & {
|
|
4
|
+
style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
|
|
5
|
+
}> & string;
|
|
6
|
+
/** Chip: a toggle (filters, presets, multi-select). */
|
|
7
|
+
export declare function Chip({ on, onToggle, mono, count, disabled, children, ...rest }: {
|
|
8
|
+
on: boolean;
|
|
9
|
+
onToggle: () => void;
|
|
10
|
+
mono?: boolean | undefined;
|
|
11
|
+
count?: number | string | undefined;
|
|
12
|
+
disabled?: boolean | undefined;
|
|
13
|
+
children: ReactNode;
|
|
14
|
+
title?: string | undefined;
|
|
15
|
+
}): import("react").JSX.Element;
|
|
16
|
+
export declare function EditableChip({ value, empty, onClick }: {
|
|
17
|
+
value: string;
|
|
18
|
+
empty?: string | undefined;
|
|
19
|
+
onClick: () => void;
|
|
20
|
+
}): import("react").JSX.Element;
|
|
21
|
+
//# sourceMappingURL=Chip.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../src/kit/Chip.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOvC,gEAAgE;AAChE,eAAO,MAAM,SAAS;;WAOrB,CAAC;AA0BF,uDAAuD;AACvD,wBAAgB,IAAI,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE;IAC/E,EAAE,EAAE,OAAO,CAAC;IACZ,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACpC,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC5B,+BAOA;AAYD,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,KAAmB,EAAE,OAAO,EAAE,EAAE;IACpE,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,+BAOA"}
|
package/dist/kit/Chip.js
ADDED
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import styled, { css } from "styled-components";
|
|
3
|
+
import { v } from "../theme/tokens.js";
|
|
4
|
+
import { Icon } from "./Icon.js";
|
|
5
|
+
// Chips and the filter bar above lists: toggleable state filters, preset
|
|
6
|
+
// pickers, multi-select method chips, and an editable label chip.
|
|
7
|
+
/** FilterBar: wraps chips (and a search field) above a list. */
|
|
8
|
+
export const FilterBar = styled.div `
|
|
9
|
+
display: flex;
|
|
10
|
+
align-items: center;
|
|
11
|
+
flex-wrap: wrap;
|
|
12
|
+
gap: 6px;
|
|
13
|
+
margin-bottom: 12px;
|
|
14
|
+
> .spacer { flex: 1 1 auto; }
|
|
15
|
+
`;
|
|
16
|
+
const chipCss = css `
|
|
17
|
+
display: inline-flex;
|
|
18
|
+
align-items: center;
|
|
19
|
+
gap: 6px;
|
|
20
|
+
height: 26px;
|
|
21
|
+
padding: 0 10px;
|
|
22
|
+
border-radius: 999px;
|
|
23
|
+
font-size: 11.5px;
|
|
24
|
+
font-weight: 600;
|
|
25
|
+
${(p) => p.$mono && css `font-family: ${v.mono}; font-weight: 500;`}
|
|
26
|
+
border: 1px solid ${(p) => (p.$on ? v.brand55 : v.line2)};
|
|
27
|
+
background: ${(p) => (p.$on ? v.brand12 : "transparent")};
|
|
28
|
+
color: ${(p) => (p.$on ? v.text : v.muted)};
|
|
29
|
+
cursor: pointer;
|
|
30
|
+
white-space: nowrap;
|
|
31
|
+
transition: background 0.12s ease, border-color 0.12s ease;
|
|
32
|
+
&:hover { border-color: ${v.brand55}; color: ${v.text}; }
|
|
33
|
+
&:disabled { opacity: 0.55; cursor: not-allowed; }
|
|
34
|
+
.count { font-size: 10.5px; color: ${v.faint}; font-variant-numeric: tabular-nums; }
|
|
35
|
+
`;
|
|
36
|
+
const ChipBtn = styled.button `${chipCss}`;
|
|
37
|
+
/** Chip: a toggle (filters, presets, multi-select). */
|
|
38
|
+
export function Chip({ on, onToggle, mono, count, disabled, children, ...rest }) {
|
|
39
|
+
return (_jsxs(ChipBtn, { type: "button", role: "switch", "aria-checked": on, onClick: onToggle, "$on": on, "$mono": mono, disabled: disabled, ...rest, children: [children, count !== undefined ? _jsx("span", { className: "count", children: count }) : null] }));
|
|
40
|
+
}
|
|
41
|
+
/** EditableChip: a value shown as a chip that opens an editor on click; empty state reads as an affordance. */
|
|
42
|
+
const EditChip = styled.button `
|
|
43
|
+
${chipCss}
|
|
44
|
+
height: 24px;
|
|
45
|
+
font-weight: 500;
|
|
46
|
+
border-style: ${(p) => (p.$empty ? "dashed" : "solid")};
|
|
47
|
+
color: ${(p) => (p.$empty ? v.faint : v.text)};
|
|
48
|
+
svg { font-size: 10px; opacity: 0.7; }
|
|
49
|
+
`;
|
|
50
|
+
export function EditableChip({ value, empty = "Add label", onClick }) {
|
|
51
|
+
return (_jsxs(EditChip, { type: "button", onClick: onClick, "$empty": !value, "aria-label": value ? `Edit: ${value}` : empty, children: [value || empty, _jsx(Icon, { name: "edit" })] }));
|
|
52
|
+
}
|
|
53
|
+
//# sourceMappingURL=Chip.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Chip.js","sourceRoot":"","sources":["../../src/kit/Chip.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,CAAC,EAAE,MAAM,oBAAoB,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,WAAY,CAAC;AAElC,yEAAyE;AACzE,kEAAkE;AAElE,gEAAgE;AAChE,MAAM,CAAC,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;CAOlC,CAAC;AAEF,MAAM,OAAO,GAAG,GAAG,CAA4D;;;;;;;;;IAS3E,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,IAAI,GAAG,CAAA,gBAAgB,CAAC,CAAC,IAAI,qBAAqB;sBAC9C,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;gBAC1C,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC;WAC/C,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;;;;4BAIhB,CAAC,CAAC,OAAO,YAAY,CAAC,CAAC,IAAI;;uCAEhB,CAAC,CAAC,KAAK;CAC7C,CAAC;AAGF,MAAM,OAAO,GAAG,MAAM,CAAC,MAAM,CAAW,GAAG,OAAO,EAAE,CAAC;AAErD,uDAAuD;AACvD,MAAM,UAAU,IAAI,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,IAAI,EAQ5E;IACC,OAAO,CACL,MAAC,OAAO,IAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,kBAAe,EAAE,EAAE,OAAO,EAAE,QAAQ,SAAO,EAAE,WAAS,IAAI,EAAE,QAAQ,EAAE,QAAQ,KAAM,IAAI,aACzH,QAAQ,EACR,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,eAAM,SAAS,EAAC,OAAO,YAAE,KAAK,GAAQ,CAAC,CAAC,CAAC,IAAI,IAC5D,CACX,CAAC;AACJ,CAAC;AAED,+GAA+G;AAC/G,MAAM,QAAQ,GAAG,MAAM,CAAC,MAAM,CAA8C;IACxE,OAAO;;;kBAGO,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC;WAC7C,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;;CAE9C,CAAC;AAEF,MAAM,UAAU,YAAY,CAAC,EAAE,KAAK,EAAE,KAAK,GAAG,WAAW,EAAE,OAAO,EAIjE;IACC,OAAO,CACL,MAAC,QAAQ,IAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,OAAO,YAAU,CAAC,KAAK,gBAAc,KAAK,CAAC,CAAC,CAAC,SAAS,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,aACnG,KAAK,IAAI,KAAK,EACf,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,IACX,CACZ,CAAC;AACJ,CAAC"}
|
package/dist/kit/DataTable.d.ts
CHANGED
|
@@ -8,7 +8,7 @@ export interface Column<T> {
|
|
|
8
8
|
/** hide below this viewport width (px) */
|
|
9
9
|
hideBelow?: number | undefined;
|
|
10
10
|
}
|
|
11
|
-
export declare function DataTable<T>({ columns, rows, rowKey, loading, skeletonRows, empty, rowHref, onRowClick, severity, footer }: {
|
|
11
|
+
export declare function DataTable<T>({ columns, rows, rowKey, loading, skeletonRows, empty, rowHref, onRowClick, severity, footer, variant }: {
|
|
12
12
|
columns: Column<T>[];
|
|
13
13
|
rows: T[] | undefined;
|
|
14
14
|
rowKey: (row: T) => string;
|
|
@@ -19,5 +19,7 @@ export declare function DataTable<T>({ columns, rows, rowKey, loading, skeletonR
|
|
|
19
19
|
onRowClick?: ((row: T) => void) | undefined;
|
|
20
20
|
severity?: ((row: T) => "crit" | "warn" | null) | undefined;
|
|
21
21
|
footer?: ReactNode | undefined;
|
|
22
|
+
/** "bare": no panel chrome and compact padding — a table inside a panel or modal */
|
|
23
|
+
variant?: "panel" | "bare" | undefined;
|
|
22
24
|
}): import("react").JSX.Element;
|
|
23
25
|
//# sourceMappingURL=DataTable.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../src/kit/DataTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAOjD,MAAM,WAAW,MAAM,CAAC,CAAC;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,SAAS,CAAC;IAChB,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,SAAS,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;IACrC,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC;
|
|
1
|
+
{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../src/kit/DataTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAOjD,MAAM,WAAW,MAAM,CAAC,CAAC;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,SAAS,CAAC;IAChB,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,SAAS,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;IACrC,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC;AAsDD,wBAAgB,SAAS,CAAC,CAAC,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,YAAgB,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE;IACxI,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;IACrB,IAAI,EAAE,CAAC,EAAE,GAAG,SAAS,CAAC;IACtB,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,MAAM,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC9B,OAAO,CAAC,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,MAAM,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC;IAClD,UAAU,CAAC,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IAC5C,QAAQ,CAAC,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC;IAC5D,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC/B,oFAAoF;IACpF,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;CACxC,+BA8CA"}
|
package/dist/kit/DataTable.js
CHANGED
|
@@ -46,11 +46,16 @@ const FootRow = styled.div `
|
|
|
46
46
|
border-top: 1px solid ${v.line};
|
|
47
47
|
`;
|
|
48
48
|
const Scroll = styled.div `overflow-x: auto;`;
|
|
49
|
-
|
|
49
|
+
const Bare = styled.div `
|
|
50
|
+
table td { padding: 7px 12px; }
|
|
51
|
+
table th { padding: 7px 12px; background: transparent; }
|
|
52
|
+
`;
|
|
53
|
+
export function DataTable({ columns, rows, rowKey, loading, skeletonRows = 5, empty, rowHref, onRowClick, severity, footer, variant }) {
|
|
50
54
|
const navigate = useNavigate();
|
|
55
|
+
const Wrap = variant === "bare" ? Bare : Panel;
|
|
51
56
|
const showSkeleton = loading && (!rows || rows.length === 0);
|
|
52
57
|
const isEmpty = !loading && rows && rows.length === 0;
|
|
53
|
-
return (_jsxs(
|
|
58
|
+
return (_jsxs(Wrap, { children: [_jsx(Scroll, { children: _jsxs(Table, { children: [_jsx("thead", { children: _jsx("tr", { children: columns.map((c) => _jsx(Th, { "$align": c.align, "$hide": c.hideBelow, style: c.width ? { width: c.width } : undefined, children: c.head }, c.key)) }) }), !showSkeleton && !isEmpty ? (_jsx("tbody", { style: loading ? { opacity: 0.55 } : undefined, children: (rows ?? []).map((r) => {
|
|
54
59
|
const href = rowHref?.(r) ?? null;
|
|
55
60
|
const click = !!href || !!onRowClick;
|
|
56
61
|
return (_jsx(Tr, { "$click": click, "$mark": severity?.(r) ?? null, onClick: click ? () => (href ? navigate(href) : onRowClick?.(r)) : undefined, children: columns.map((c) => _jsx(Td, { "$align": c.align, "$hide": c.hideBelow, children: c.render(r) }, c.key)) }, rowKey(r)));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../src/kit/DataTable.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAkB,MAAM,OAAO,CAAC;AACjD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,CAAC,EAAE,MAAM,oBAAoB,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAa,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,eAAgB,CAAC;AAYvD,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAA;;;;CAIzB,CAAC;AAEF,MAAM,EAAE,GAAG,MAAM,CAAC,EAAE,CAAuE;gBAC3E,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,IAAI,MAAM;;;;;WAK9B,CAAC,CAAC,KAAK;gBACF,CAAC,CAAC,QAAQ;6BACG,CAAC,CAAC,IAAI;;;IAG/B,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,IAAI,GAAG,CAAA,sBAAsB,CAAC,CAAC,KAAK,wBAAwB;CAC7E,CAAC;AAEF,MAAM,EAAE,GAAG,MAAM,CAAC,EAAE,CAAuE;gBAC3E,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,IAAI,MAAM;;6BAEZ,CAAC,CAAC,IAAI;;IAE/B,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,IAAI,GAAG,CAAA,sBAAsB,CAAC,CAAC,KAAK,wBAAwB;CAC7E,CAAC;AAEF,iFAAiF;AACjF,MAAM,EAAE,GAAG,MAAM,CAAC,EAAE,CAA8E;IAC9F,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,IAAI,GAAG,CAAA,6CAA6C,CAAC,CAAC,KAAK,KAAK;;IAE/E,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,IAAI,GAAG,CAAA,gDAAgD,CAAC,CAAC,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,KAAK;CACtH,CAAC;AAEF,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;WAMf,CAAC,CAAC,KAAK;0BACQ,CAAC,CAAC,IAAI;CAC/B,CAAC;AAEF,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,CAAA,mBAAmB,CAAC;AAE7C,MAAM,UAAU,SAAS,CAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,YAAY,GAAG,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../src/kit/DataTable.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
export declare const RowList: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "style"> & {
|
|
3
|
+
style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
|
|
4
|
+
}> & string;
|
|
5
|
+
/** ListRow: one row of a RowList. `to` makes it a router link, `onClick` a button. */
|
|
6
|
+
export declare function ListRow({ to, onClick, selected, leading, trailing, actions, children }: {
|
|
7
|
+
to?: string | undefined;
|
|
8
|
+
onClick?: (() => void) | undefined;
|
|
9
|
+
selected?: boolean | undefined;
|
|
10
|
+
leading?: ReactNode | undefined;
|
|
11
|
+
trailing?: ReactNode | undefined;
|
|
12
|
+
actions?: ReactNode | undefined;
|
|
13
|
+
children: ReactNode;
|
|
14
|
+
}): import("react").JSX.Element;
|
|
15
|
+
/** RowActions: an action cluster revealed on row hover/focus (rows and table cells). */
|
|
16
|
+
export declare const RowActions: import("styled-components/dist/types").IStyledComponentBase<"web", Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "style"> & {
|
|
17
|
+
style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
|
|
18
|
+
}, "className"> & Partial<Pick<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "style"> & {
|
|
19
|
+
style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
|
|
20
|
+
}, "className">>> & string;
|
|
21
|
+
export declare function SelectableList<T>({ rows, value, onPick, rowKey, render, onDelete }: {
|
|
22
|
+
rows: T[];
|
|
23
|
+
value: string | null;
|
|
24
|
+
onPick: (key: string) => void;
|
|
25
|
+
rowKey: (row: T) => string;
|
|
26
|
+
render: (row: T) => ReactNode;
|
|
27
|
+
onDelete?: ((row: T) => void) | undefined;
|
|
28
|
+
}): import("react").JSX.Element;
|
|
29
|
+
export declare function Breadcrumbs({ segments, current, label }: {
|
|
30
|
+
segments: {
|
|
31
|
+
label: string;
|
|
32
|
+
onClick: () => void;
|
|
33
|
+
}[];
|
|
34
|
+
current: string;
|
|
35
|
+
label?: string | undefined;
|
|
36
|
+
}): import("react").JSX.Element;
|
|
37
|
+
//# sourceMappingURL=List.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../src/kit/List.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AASvC,eAAO,MAAM,OAAO;;WAGnB,CAAC;AA4BF,sFAAsF;AACtF,wBAAgB,OAAO,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE;IACvF,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,OAAO,CAAC,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAC;IACnC,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC,QAAQ,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IACjC,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC,QAAQ,EAAE,SAAS,CAAC;CACrB,+BAYA;AAED,wFAAwF;AACxF,eAAO,MAAM,UAAU;;;;0BAQtB,CAAC;AAUF,wBAAgB,cAAc,CAAC,CAAC,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE;IACnF,IAAI,EAAE,CAAC,EAAE,CAAC;IACV,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,MAAM,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,MAAM,CAAC;IAC3B,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,KAAK,SAAS,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;CAC3C,+BAoBA;AAYD,wBAAgB,WAAW,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAc,EAAE,EAAE;IACjE,QAAQ,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,IAAI,CAAA;KAAE,EAAE,CAAC;IACnD,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC5B,+BAYA"}
|
package/dist/kit/List.js
ADDED
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import styled, { css } from "styled-components";
|
|
3
|
+
import { Link } from "react-router-dom";
|
|
4
|
+
import { v } from "../theme/tokens.js";
|
|
5
|
+
import { Icon } from "./Icon.js";
|
|
6
|
+
// Row lists — the "recent jobs", "artifacts", "ports", "files" idiom: a
|
|
7
|
+
// bordered row with hover, an optional leading/trailing slot, and actions
|
|
8
|
+
// that reveal on hover. RowActions is also usable inside DataTable cells.
|
|
9
|
+
export const RowList = styled.div `
|
|
10
|
+
display: flex;
|
|
11
|
+
flex-direction: column;
|
|
12
|
+
`;
|
|
13
|
+
const rowCss = css `
|
|
14
|
+
display: flex;
|
|
15
|
+
align-items: center;
|
|
16
|
+
gap: 12px;
|
|
17
|
+
padding: 10px 16px;
|
|
18
|
+
border-bottom: 1px solid ${v.line};
|
|
19
|
+
color: ${v.text};
|
|
20
|
+
text-decoration: none;
|
|
21
|
+
font-size: 12.5px;
|
|
22
|
+
width: 100%;
|
|
23
|
+
text-align: left;
|
|
24
|
+
background: ${(p) => (p.$selected ? v.brand08 : "transparent")};
|
|
25
|
+
&:last-child { border-bottom: none; }
|
|
26
|
+
${(p) => p.$click && css `cursor: pointer; &:hover { background: ${v.hover}; }`}
|
|
27
|
+
&:hover .row-actions, &:focus-within .row-actions { opacity: 1; }
|
|
28
|
+
`;
|
|
29
|
+
const RowDiv = styled.div `${rowCss}`;
|
|
30
|
+
const RowLink = styled(Link) `${rowCss}`;
|
|
31
|
+
const RowBtn = styled.button `${rowCss}`;
|
|
32
|
+
const Main = styled.span `flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px;`;
|
|
33
|
+
const Lead = styled.span `flex: none; display: grid; place-items: center; color: ${v.muted};`;
|
|
34
|
+
const Trail = styled.span `flex: none; display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: ${v.faint};`;
|
|
35
|
+
/** ListRow: one row of a RowList. `to` makes it a router link, `onClick` a button. */
|
|
36
|
+
export function ListRow({ to, onClick, selected, leading, trailing, actions, children }) {
|
|
37
|
+
const inner = (_jsxs(_Fragment, { children: [leading ? _jsx(Lead, { children: leading }) : null, _jsx(Main, { children: children }), trailing ? _jsx(Trail, { children: trailing }) : null, actions ? _jsx(RowActions, { children: actions }) : null] }));
|
|
38
|
+
if (to)
|
|
39
|
+
return _jsx(RowLink, { to: to, "$click": true, "$selected": selected, children: inner });
|
|
40
|
+
if (onClick)
|
|
41
|
+
return _jsx(RowBtn, { type: "button", onClick: onClick, "$click": true, "$selected": selected, children: inner });
|
|
42
|
+
return _jsx(RowDiv, { "$selected": selected, children: inner });
|
|
43
|
+
}
|
|
44
|
+
/** RowActions: an action cluster revealed on row hover/focus (rows and table cells). */
|
|
45
|
+
export const RowActions = styled.span.attrs({ className: "row-actions" }) `
|
|
46
|
+
flex: none;
|
|
47
|
+
display: inline-flex;
|
|
48
|
+
align-items: center;
|
|
49
|
+
gap: 6px;
|
|
50
|
+
opacity: 0;
|
|
51
|
+
transition: opacity 0.12s ease;
|
|
52
|
+
tr:hover &, tr:focus-within & { opacity: 1; }
|
|
53
|
+
`;
|
|
54
|
+
/** SelectableList: rows with a radio affordance; one value picked. */
|
|
55
|
+
const Radio = styled.span `
|
|
56
|
+
width: 14px; height: 14px; border-radius: 50%; flex: none;
|
|
57
|
+
border: 1.5px solid ${(p) => (p.$on ? v.brand : v.line2)};
|
|
58
|
+
display: grid; place-items: center;
|
|
59
|
+
&::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: ${(p) => (p.$on ? v.brand : "transparent")}; }
|
|
60
|
+
`;
|
|
61
|
+
export function SelectableList({ rows, value, onPick, rowKey, render, onDelete }) {
|
|
62
|
+
return (_jsx(RowList, { role: "radiogroup", children: rows.map((r) => {
|
|
63
|
+
const k = rowKey(r);
|
|
64
|
+
const on = k === value;
|
|
65
|
+
return (_jsx(ListRow, { onClick: () => onPick(k), selected: on, leading: _jsx(Radio, { "$on": on, "aria-hidden": "true" }), actions: onDelete ? _jsx("button", { type: "button", "aria-label": "Remove", onClick: (e) => { e.stopPropagation(); onDelete(r); }, style: { color: v.faint }, children: _jsx(Icon, { name: "delete" }) }) : undefined, children: render(r) }, k));
|
|
66
|
+
}) }));
|
|
67
|
+
}
|
|
68
|
+
/** Breadcrumbs: a path with clickable ancestors and a current segment. */
|
|
69
|
+
const Crumbs = styled.nav `
|
|
70
|
+
display: flex; align-items: center; flex-wrap: wrap; gap: 4px;
|
|
71
|
+
font-family: ${v.mono}; font-size: 12px; color: ${v.muted};
|
|
72
|
+
button { font: inherit; color: ${v.muted}; background: none; border: none; padding: 2px 4px; border-radius: 4px; cursor: pointer; }
|
|
73
|
+
button:hover { color: ${v.text}; background: ${v.hover}; }
|
|
74
|
+
.sep { color: ${v.faint}; display: grid; svg { font-size: 10px; } }
|
|
75
|
+
.cur { color: ${v.text}; padding: 2px 4px; }
|
|
76
|
+
`;
|
|
77
|
+
export function Breadcrumbs({ segments, current, label = "Path" }) {
|
|
78
|
+
return (_jsxs(Crumbs, { "aria-label": label, children: [segments.map((s, i) => (_jsxs("span", { style: { display: "contents" }, children: [_jsx("button", { type: "button", onClick: s.onClick, children: s.label }), _jsx("span", { className: "sep", children: _jsx(Icon, { name: "chevron-right" }) })] }, `${s.label}-${i}`))), _jsx("span", { className: "cur", "aria-current": "location", children: current })] }));
|
|
79
|
+
}
|
|
80
|
+
//# sourceMappingURL=List.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"List.js","sourceRoot":"","sources":["../../src/kit/List.tsx"],"names":[],"mappings":"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"}
|
package/dist/kit/LogView.d.ts
CHANGED
|
@@ -2,6 +2,8 @@ export interface LogLine {
|
|
|
2
2
|
at?: string | undefined;
|
|
3
3
|
text: string;
|
|
4
4
|
stderr?: boolean | undefined;
|
|
5
|
+
/** render as a labelled rule instead of a line (attempt boundaries, restarts) */
|
|
6
|
+
divider?: boolean | undefined;
|
|
5
7
|
}
|
|
6
8
|
export declare function LogSurface({ lines, height, follow, placeholder }: {
|
|
7
9
|
lines: LogLine[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LogView.d.ts","sourceRoot":"","sources":["../../src/kit/LogView.tsx"],"names":[],"mappings":"AASA,MAAM,WAAW,OAAO;IACtB,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"LogView.d.ts","sourceRoot":"","sources":["../../src/kit/LogView.tsx"],"names":[],"mappings":"AASA,MAAM,WAAW,OAAO;IACtB,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC7B,iFAAiF;IACjF,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CAC/B;AAyBD,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,MAAa,EAAE,WAAmC,EAAE,EAAE;IAChG,KAAK,EAAE,OAAO,EAAE,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC5B,MAAM,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC7B,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAClC,+BAkBA;AAED,gFAAgF;AAChF,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,EAAE;IAC/E,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,OAAO,EAAE,CAAC;IACjB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IACrC,MAAM,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC5B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,SAAS,CAAC;IACtC,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAClC,+BAiBA"}
|
package/dist/kit/LogView.js
CHANGED
|
@@ -19,13 +19,19 @@ const Sur = styled.pre `
|
|
|
19
19
|
`;
|
|
20
20
|
const Ts = styled.span `color: ${v.logDim}; user-select: none;`;
|
|
21
21
|
const Err = styled.span `color: ${v.danger};`;
|
|
22
|
+
const Rule = styled.div `
|
|
23
|
+
display: flex; align-items: center; gap: 8px;
|
|
24
|
+
color: ${v.logDim};
|
|
25
|
+
margin: 4px 0;
|
|
26
|
+
&::before, &::after { content: ""; flex: 1 1 auto; border-top: 1px dashed ${v.logDim}; opacity: 0.6; }
|
|
27
|
+
`;
|
|
22
28
|
export function LogSurface({ lines, height, follow = true, placeholder = "waiting for output…" }) {
|
|
23
29
|
const ref = useRef(null);
|
|
24
30
|
useEffect(() => {
|
|
25
31
|
if (follow && ref.current)
|
|
26
32
|
ref.current.scrollTop = ref.current.scrollHeight;
|
|
27
33
|
}, [lines, follow]);
|
|
28
|
-
return (_jsxs(Sur, { ref: ref, "$h": height, children: [lines.length === 0 ? _jsx(Ts, { children: placeholder }) : null, lines.map((l, i) => (_jsxs("div", { children: [l.at ? _jsxs(Ts, { children: [l.at, " "] }) : null, l.stderr ? _jsx(Err, { children: l.text }) : l.text] }, i)))] }));
|
|
34
|
+
return (_jsxs(Sur, { ref: ref, "$h": height, children: [lines.length === 0 ? _jsx(Ts, { children: placeholder }) : null, lines.map((l, i) => (l.divider ? _jsx(Rule, { children: l.text }, i) : (_jsxs("div", { children: [l.at ? _jsxs(Ts, { children: [l.at, " "] }) : null, l.stderr ? _jsx(Err, { children: l.text }) : l.text] }, i))))] }));
|
|
29
35
|
}
|
|
30
36
|
/** LogPanel: LogSurface inside a Panel with a follow toggle and status slot. */
|
|
31
37
|
export function LogPanel({ title, lines, status, height, actions, placeholder }) {
|
package/dist/kit/LogView.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LogView.js","sourceRoot":"","sources":["../../src/kit/LogView.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,CAAC,EAAE,MAAM,oBAAoB,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,YAAa,CAAC;AACzE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"LogView.js","sourceRoot":"","sources":["../../src/kit/LogView.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
export declare const StatGrid: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Merged<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "style"> & {
|
|
3
|
+
style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
|
|
4
|
+
}, {
|
|
5
|
+
$min?: number | undefined;
|
|
6
|
+
}>> & string;
|
|
7
|
+
/** StatTile: label over a big number, with an optional subline. */
|
|
8
|
+
export declare function StatTile({ label, value, sub, tone }: {
|
|
9
|
+
label: ReactNode;
|
|
10
|
+
value: ReactNode;
|
|
11
|
+
sub?: ReactNode | undefined;
|
|
12
|
+
tone?: "ok" | "warn" | "crit" | "brand" | undefined;
|
|
13
|
+
}): import("react").JSX.Element;
|
|
14
|
+
/** Meter: value out of max as a bar; tone defaults from the ratio. */
|
|
15
|
+
export declare function Meter({ value, max, tone, label }: {
|
|
16
|
+
value: number;
|
|
17
|
+
max: number;
|
|
18
|
+
tone?: "ok" | "warn" | "crit" | "brand" | undefined;
|
|
19
|
+
label?: string | undefined;
|
|
20
|
+
}): import("react").JSX.Element;
|
|
21
|
+
//# sourceMappingURL=Stat.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Stat.d.ts","sourceRoot":"","sources":["../../src/kit/Stat.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOvC,eAAO,MAAM,QAAQ;;;WAAuB,MAAM,GAAG,SAAS;YAI7D,CAAC;AAmBF,mEAAmE;AACnE,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,EAAE;IACpD,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,SAAS,CAAC;IACjB,GAAG,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC5B,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;CACrD,+BAQA;AAgBD,sEAAsE;AACtE,wBAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE;IACjD,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;IACpD,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC5B,+BAQA"}
|
package/dist/kit/Stat.js
ADDED
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import styled from "styled-components";
|
|
3
|
+
import { v } from "../theme/tokens.js";
|
|
4
|
+
import { Panel } from "./Panel.js";
|
|
5
|
+
import { MicroLabel } from "./Panel.js";
|
|
6
|
+
// Stat tiles (overview numbers) and a utilisation meter.
|
|
7
|
+
export const StatGrid = styled.div `
|
|
8
|
+
display: grid;
|
|
9
|
+
grid-template-columns: repeat(auto-fit, minmax(${(p) => p.$min ?? 150}px, 1fr));
|
|
10
|
+
gap: 12px;
|
|
11
|
+
`;
|
|
12
|
+
const Tile = styled(Panel) `
|
|
13
|
+
padding: 12px 14px;
|
|
14
|
+
display: flex;
|
|
15
|
+
flex-direction: column;
|
|
16
|
+
gap: 6px;
|
|
17
|
+
`;
|
|
18
|
+
const Value = styled.span `
|
|
19
|
+
font-size: 22px;
|
|
20
|
+
font-weight: 650;
|
|
21
|
+
line-height: 1.1;
|
|
22
|
+
font-variant-numeric: tabular-nums;
|
|
23
|
+
color: ${(p) => (p.$tone === "ok" ? v.success : p.$tone === "warn" ? v.warning : p.$tone === "crit" ? v.danger : p.$tone === "brand" ? v.brand : v.text)};
|
|
24
|
+
`;
|
|
25
|
+
const Sub = styled.span `font-size: 11px; color: ${v.faint};`;
|
|
26
|
+
/** StatTile: label over a big number, with an optional subline. */
|
|
27
|
+
export function StatTile({ label, value, sub, tone }) {
|
|
28
|
+
return (_jsxs(Tile, { children: [_jsx(MicroLabel, { children: label }), _jsx(Value, { "$tone": tone, children: value }), sub ? _jsx(Sub, { children: sub }) : null] }));
|
|
29
|
+
}
|
|
30
|
+
const Bar = styled.div `
|
|
31
|
+
height: 6px;
|
|
32
|
+
border-radius: 999px;
|
|
33
|
+
background: ${v.field};
|
|
34
|
+
border: 1px solid ${v.fieldLine};
|
|
35
|
+
overflow: hidden;
|
|
36
|
+
`;
|
|
37
|
+
const Fill = styled.div `
|
|
38
|
+
height: 100%;
|
|
39
|
+
width: ${(p) => p.$pct}%;
|
|
40
|
+
background: ${(p) => (p.$tone === "ok" ? v.success : p.$tone === "warn" ? v.warning : p.$tone === "crit" ? v.danger : v.grad90)};
|
|
41
|
+
transition: width 0.3s ease;
|
|
42
|
+
`;
|
|
43
|
+
/** Meter: value out of max as a bar; tone defaults from the ratio. */
|
|
44
|
+
export function Meter({ value, max, tone, label }) {
|
|
45
|
+
const pct = max > 0 ? Math.max(0, Math.min(100, (value / max) * 100)) : 0;
|
|
46
|
+
const t = tone ?? (pct >= 90 ? "crit" : pct >= 70 ? "warn" : "brand");
|
|
47
|
+
return (_jsx(Bar, { role: "meter", "aria-valuenow": value, "aria-valuemin": 0, "aria-valuemax": max, "aria-label": label, children: _jsx(Fill, { "$pct": pct, "$tone": t }) }));
|
|
48
|
+
}
|
|
49
|
+
//# sourceMappingURL=Stat.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Stat.js","sourceRoot":"","sources":["../../src/kit/Stat.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
/** Mono: a technical string — id, ref, path, host. */
|
|
3
|
+
export declare const Mono: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Merged<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "style"> & {
|
|
4
|
+
style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
|
|
5
|
+
}, {
|
|
6
|
+
$dim?: boolean | undefined;
|
|
7
|
+
$size?: number | undefined;
|
|
8
|
+
$truncate?: boolean | undefined;
|
|
9
|
+
}>> & string;
|
|
10
|
+
/** Num: a tabular figure, right-aligned in tables. */
|
|
11
|
+
export declare const Num: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Merged<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "style"> & {
|
|
12
|
+
style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
|
|
13
|
+
}, {
|
|
14
|
+
$dim?: boolean | undefined;
|
|
15
|
+
}>> & string;
|
|
16
|
+
/** Hint: secondary explanatory text under a control or a block. */
|
|
17
|
+
export declare const Hint: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Merged<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "style"> & {
|
|
18
|
+
style?: import("react").CSSProperties | import("styled-components/dist/types").CSSPropertiesWithVars | undefined;
|
|
19
|
+
}, {
|
|
20
|
+
$tone?: "mut" | "warn" | "crit" | "info" | undefined;
|
|
21
|
+
}>> & string;
|
|
22
|
+
/** Cell: the two-line table cell — a title with a mono subline under it. */
|
|
23
|
+
export declare function Cell({ title, sub, mono }: {
|
|
24
|
+
title: ReactNode;
|
|
25
|
+
sub?: ReactNode | undefined;
|
|
26
|
+
mono?: boolean | undefined;
|
|
27
|
+
}): import("react").JSX.Element;
|
|
28
|
+
/** InlineLink: a link (router, external, or a button that reads as a link). */
|
|
29
|
+
export declare function InlineLink({ to, href, onClick, mono, tone, children, ...rest }: {
|
|
30
|
+
to?: string | undefined;
|
|
31
|
+
href?: string | undefined;
|
|
32
|
+
onClick?: (() => void) | undefined;
|
|
33
|
+
mono?: boolean | undefined;
|
|
34
|
+
tone?: "brand" | "mut" | undefined;
|
|
35
|
+
children: ReactNode;
|
|
36
|
+
title?: string | undefined;
|
|
37
|
+
"aria-label"?: string | undefined;
|
|
38
|
+
}): import("react").JSX.Element;
|
|
39
|
+
//# sourceMappingURL=Text.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../src/kit/Text.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQvC,sDAAsD;AACtD,eAAO,MAAM,IAAI;;;WAAwB,OAAO,GAAG,SAAS;YAAU,MAAM,GAAG,SAAS;gBAAc,OAAO,GAAG,SAAS;YAKxH,CAAC;AAEF,sDAAsD;AACtD,eAAO,MAAM,GAAG;;;WAAwB,OAAO,GAAG,SAAS;YAG1D,CAAC;AAEF,mEAAmE;AACnE,eAAO,MAAM,IAAI;;;YAAsB,KAAK,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS;YAKlF,CAAC;AAoBF,4EAA4E;AAC5E,wBAAgB,IAAI,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,EAAE;IAAE,KAAK,EAAE,SAAS,CAAC;IAAC,GAAG,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAAC,IAAI,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;CAAE,+BAOvH;AAiBD,+EAA+E;AAC/E,wBAAgB,UAAU,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE;IAC/E,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,OAAO,CAAC,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAC;IACnC,IAAI,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,SAAS,CAAC;IACnC,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CACnC,+BAIA"}
|
package/dist/kit/Text.js
ADDED
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import styled, { css } from "styled-components";
|
|
3
|
+
import { Link } from "react-router-dom";
|
|
4
|
+
import { v } from "../theme/tokens.js";
|
|
5
|
+
// Text primitives every list and detail screen needs. These replace the
|
|
6
|
+
// MonoId / NameTxt / SubEnv / MutedNote / Num styled spans that each product
|
|
7
|
+
// screen had grown its own copy of.
|
|
8
|
+
/** Mono: a technical string — id, ref, path, host. */
|
|
9
|
+
export const Mono = styled.span `
|
|
10
|
+
font-family: ${v.mono};
|
|
11
|
+
font-size: ${(p) => p.$size ?? 12}px;
|
|
12
|
+
color: ${(p) => (p.$dim ? v.muted : v.text)};
|
|
13
|
+
${(p) => p.$truncate && css `display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom;`}
|
|
14
|
+
`;
|
|
15
|
+
/** Num: a tabular figure, right-aligned in tables. */
|
|
16
|
+
export const Num = styled.span `
|
|
17
|
+
font-variant-numeric: tabular-nums;
|
|
18
|
+
color: ${(p) => (p.$dim ? v.muted : v.text)};
|
|
19
|
+
`;
|
|
20
|
+
/** Hint: secondary explanatory text under a control or a block. */
|
|
21
|
+
export const Hint = styled.p `
|
|
22
|
+
margin: 0;
|
|
23
|
+
font-size: 11.5px;
|
|
24
|
+
line-height: 1.5;
|
|
25
|
+
color: ${(p) => (p.$tone === "warn" ? v.warning : p.$tone === "crit" ? v.danger : p.$tone === "info" ? v.info : v.faint)};
|
|
26
|
+
`;
|
|
27
|
+
const CellWrap = styled.span `
|
|
28
|
+
display: flex;
|
|
29
|
+
flex-direction: column;
|
|
30
|
+
gap: 2px;
|
|
31
|
+
min-width: 0;
|
|
32
|
+
`;
|
|
33
|
+
const CellTitle = styled.span `
|
|
34
|
+
font-weight: 600;
|
|
35
|
+
${(p) => p.$mono && css `font-family: ${v.mono}; font-size: 12px; font-weight: 650;`}
|
|
36
|
+
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
|
|
37
|
+
`;
|
|
38
|
+
const CellSub = styled.span `
|
|
39
|
+
font-size: 11px;
|
|
40
|
+
color: ${v.faint};
|
|
41
|
+
font-family: ${v.mono};
|
|
42
|
+
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
|
|
43
|
+
`;
|
|
44
|
+
/** Cell: the two-line table cell — a title with a mono subline under it. */
|
|
45
|
+
export function Cell({ title, sub, mono }) {
|
|
46
|
+
return (_jsxs(CellWrap, { children: [_jsx(CellTitle, { "$mono": mono, children: title }), sub ? _jsx(CellSub, { children: sub }) : null] }));
|
|
47
|
+
}
|
|
48
|
+
const linkCss = css `
|
|
49
|
+
font: inherit;
|
|
50
|
+
${(p) => p.$mono && css `font-family: ${v.mono}; font-size: 12px;`}
|
|
51
|
+
color: ${(p) => (p.$tone === "mut" ? v.muted : v.info)};
|
|
52
|
+
text-decoration: none;
|
|
53
|
+
cursor: pointer;
|
|
54
|
+
background: none; border: none; padding: 0;
|
|
55
|
+
&:hover { text-decoration: underline; color: ${v.text}; }
|
|
56
|
+
`;
|
|
57
|
+
const A = styled.a `${linkCss}`;
|
|
58
|
+
const L = styled(Link) `${linkCss}`;
|
|
59
|
+
const B = styled.button `${linkCss}`;
|
|
60
|
+
/** InlineLink: a link (router, external, or a button that reads as a link). */
|
|
61
|
+
export function InlineLink({ to, href, onClick, mono, tone, children, ...rest }) {
|
|
62
|
+
if (to)
|
|
63
|
+
return _jsx(L, { to: to, "$mono": mono, "$tone": tone, ...rest, children: children });
|
|
64
|
+
if (href)
|
|
65
|
+
return _jsx(A, { href: href, "$mono": mono, "$tone": tone, ...rest, children: children });
|
|
66
|
+
return _jsx(B, { type: "button", onClick: onClick, "$mono": mono, "$tone": tone, ...rest, children: children });
|
|
67
|
+
}
|
|
68
|
+
//# sourceMappingURL=Text.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../src/kit/Text.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED