@ksp-gonogo/ui-kit 0.1.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/LICENSE +596 -0
- package/dist/ActionButton.d.ts +18 -0
- package/dist/ActionButton.d.ts.map +1 -0
- package/dist/ActionButton.js +56 -0
- package/dist/ActionButton.js.map +1 -0
- package/dist/Badge.d.ts +15 -0
- package/dist/Badge.d.ts.map +1 -0
- package/dist/Badge.js +60 -0
- package/dist/Badge.js.map +1 -0
- package/dist/Box.d.ts +19 -0
- package/dist/Box.d.ts.map +1 -0
- package/dist/Box.js +27 -0
- package/dist/Box.js.map +1 -0
- package/dist/Card.d.ts +11 -0
- package/dist/Card.d.ts.map +1 -0
- package/dist/Card.js +13 -0
- package/dist/Card.js.map +1 -0
- package/dist/Cluster.d.ts +18 -0
- package/dist/Cluster.d.ts.map +1 -0
- package/dist/Cluster.js +24 -0
- package/dist/Cluster.js.map +1 -0
- package/dist/EmptyState.d.ts +16 -0
- package/dist/EmptyState.d.ts.map +1 -0
- package/dist/EmptyState.js +37 -0
- package/dist/EmptyState.js.map +1 -0
- package/dist/GonogoTokens.d.ts +16 -0
- package/dist/GonogoTokens.d.ts.map +1 -0
- package/dist/GonogoTokens.js +108 -0
- package/dist/GonogoTokens.js.map +1 -0
- package/dist/Grid.d.ts +25 -0
- package/dist/Grid.d.ts.map +1 -0
- package/dist/Grid.js +23 -0
- package/dist/Grid.js.map +1 -0
- package/dist/Inline.d.ts +20 -0
- package/dist/Inline.d.ts.map +1 -0
- package/dist/Inline.js +17 -0
- package/dist/Inline.js.map +1 -0
- package/dist/Panel.d.ts +14 -0
- package/dist/Panel.d.ts.map +1 -0
- package/dist/Panel.js +145 -0
- package/dist/Panel.js.map +1 -0
- package/dist/ProgressBar.d.ts +15 -0
- package/dist/ProgressBar.d.ts.map +1 -0
- package/dist/ProgressBar.js +31 -0
- package/dist/ProgressBar.js.map +1 -0
- package/dist/Readout.d.ts +35 -0
- package/dist/Readout.d.ts.map +1 -0
- package/dist/Readout.js +114 -0
- package/dist/Readout.js.map +1 -0
- package/dist/Row.d.ts +22 -0
- package/dist/Row.d.ts.map +1 -0
- package/dist/Row.js +32 -0
- package/dist/Row.js.map +1 -0
- package/dist/Section.d.ts +15 -0
- package/dist/Section.d.ts.map +1 -0
- package/dist/Section.js +21 -0
- package/dist/Section.js.map +1 -0
- package/dist/Spinner.d.ts +18 -0
- package/dist/Spinner.d.ts.map +1 -0
- package/dist/Spinner.js +22 -0
- package/dist/Spinner.js.map +1 -0
- package/dist/Stack.d.ts +15 -0
- package/dist/Stack.d.ts.map +1 -0
- package/dist/Stack.js +17 -0
- package/dist/Stack.js.map +1 -0
- package/dist/StatusIndicator.d.ts +27 -0
- package/dist/StatusIndicator.d.ts.map +1 -0
- package/dist/StatusIndicator.js +78 -0
- package/dist/StatusIndicator.js.map +1 -0
- package/dist/Truncate.d.ts +7 -0
- package/dist/Truncate.d.ts.map +1 -0
- package/dist/Truncate.js +14 -0
- package/dist/Truncate.js.map +1 -0
- package/dist/Value.d.ts +24 -0
- package/dist/Value.d.ts.map +1 -0
- package/dist/Value.js +42 -0
- package/dist/Value.js.map +1 -0
- package/dist/WidgetHeader.d.ts +16 -0
- package/dist/WidgetHeader.d.ts.map +1 -0
- package/dist/WidgetHeader.js +40 -0
- package/dist/WidgetHeader.js.map +1 -0
- package/dist/defaultDarkTheme.d.ts +16 -0
- package/dist/defaultDarkTheme.d.ts.map +1 -0
- package/dist/defaultDarkTheme.js +96 -0
- package/dist/defaultDarkTheme.js.map +1 -0
- package/dist/format.d.ts +11 -0
- package/dist/format.d.ts.map +1 -0
- package/dist/format.js +12 -0
- package/dist/format.js.map +1 -0
- package/dist/index.d.ts +25 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +29 -0
- package/dist/index.js.map +1 -0
- package/dist/science/ScienceExperimentRow.d.ts +43 -0
- package/dist/science/ScienceExperimentRow.d.ts.map +1 -0
- package/dist/science/ScienceExperimentRow.js +61 -0
- package/dist/science/ScienceExperimentRow.js.map +1 -0
- package/dist/test/axe.d.ts +3 -0
- package/dist/test/axe.d.ts.map +1 -0
- package/dist/test/axe.js +5 -0
- package/dist/test/axe.js.map +1 -0
- package/dist/test/setup.d.ts +2 -0
- package/dist/test/setup.d.ts.map +1 -0
- package/dist/test/setup.js +12 -0
- package/dist/test/setup.js.map +1 -0
- package/dist/theme.d.ts +116 -0
- package/dist/theme.d.ts.map +1 -0
- package/dist/theme.js +15 -0
- package/dist/theme.js.map +1 -0
- package/dist/tokens.css +133 -0
- package/package.json +57 -0
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import styled, { css } from "styled-components";
|
|
3
|
+
/**
|
|
4
|
+
* Coloured dot + one-line status text. Tone maps to the same palette
|
|
5
|
+
* as `Badge` but the layout is different: dot on the left, free-form
|
|
6
|
+
* label on the right, optional live-region semantics. Use for
|
|
7
|
+
* "connection status," "TURN reachability," "data source health"
|
|
8
|
+
* surfaces — anywhere a single sentence describes a state and a glance
|
|
9
|
+
* at the dot tells you whether to worry.
|
|
10
|
+
*
|
|
11
|
+
* Sister primitive: `Badge`. Use `Badge` for compact uppercase pills,
|
|
12
|
+
* `StatusIndicator` for sentence-length state with a leading dot.
|
|
13
|
+
*/
|
|
14
|
+
export function StatusIndicator({ tone, children, live = false, ...rest }) {
|
|
15
|
+
const liveAttrs = live
|
|
16
|
+
? { role: "status", "aria-live": "polite" }
|
|
17
|
+
: {};
|
|
18
|
+
return (_jsxs(StatusIndicator__Row, { "data-tone": tone, ...liveAttrs, ...rest, children: [_jsx(StatusIndicator__Dot, { "data-tone": tone, "aria-hidden": "true" }), _jsx(StatusIndicator__Text, { children: children })] }));
|
|
19
|
+
}
|
|
20
|
+
const TONE_BORDER = {
|
|
21
|
+
neutral: css `
|
|
22
|
+
border-color: var(--color-border-subtle);
|
|
23
|
+
`,
|
|
24
|
+
info: css `
|
|
25
|
+
border-color: var(--color-status-info-bg);
|
|
26
|
+
`,
|
|
27
|
+
go: css `
|
|
28
|
+
border-color: var(--color-status-go-bg);
|
|
29
|
+
`,
|
|
30
|
+
warn: css `
|
|
31
|
+
border-color: var(--color-status-warning-bg);
|
|
32
|
+
`,
|
|
33
|
+
nogo: css `
|
|
34
|
+
border-color: var(--color-status-nogo-bg);
|
|
35
|
+
`,
|
|
36
|
+
};
|
|
37
|
+
const StatusIndicator__Row = styled.div `
|
|
38
|
+
display: flex;
|
|
39
|
+
align-items: center;
|
|
40
|
+
gap: 8px;
|
|
41
|
+
font-size: 11px;
|
|
42
|
+
padding: 6px 8px;
|
|
43
|
+
background: var(--color-surface-raised);
|
|
44
|
+
border: 1px solid;
|
|
45
|
+
border-radius: 3px;
|
|
46
|
+
|
|
47
|
+
${({ "data-tone": tone }) => TONE_BORDER[tone]}
|
|
48
|
+
`;
|
|
49
|
+
const TONE_DOT = {
|
|
50
|
+
neutral: css `
|
|
51
|
+
background: var(--color-text-dim);
|
|
52
|
+
`,
|
|
53
|
+
info: css `
|
|
54
|
+
background: var(--color-status-info-bg);
|
|
55
|
+
`,
|
|
56
|
+
go: css `
|
|
57
|
+
background: var(--color-status-go-bg);
|
|
58
|
+
`,
|
|
59
|
+
warn: css `
|
|
60
|
+
background: var(--color-status-warning-bg);
|
|
61
|
+
`,
|
|
62
|
+
nogo: css `
|
|
63
|
+
background: var(--color-status-nogo-bg);
|
|
64
|
+
`,
|
|
65
|
+
};
|
|
66
|
+
const StatusIndicator__Dot = styled.span `
|
|
67
|
+
width: 8px;
|
|
68
|
+
height: 8px;
|
|
69
|
+
border-radius: 50%;
|
|
70
|
+
flex-shrink: 0;
|
|
71
|
+
|
|
72
|
+
${({ "data-tone": tone }) => TONE_DOT[tone]}
|
|
73
|
+
`;
|
|
74
|
+
const StatusIndicator__Text = styled.span `
|
|
75
|
+
color: var(--color-text-primary);
|
|
76
|
+
line-height: 1.4;
|
|
77
|
+
`;
|
|
78
|
+
//# sourceMappingURL=StatusIndicator.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StatusIndicator.js","sourceRoot":"","sources":["../src/StatusIndicator.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAkBhD;;;;;;;;;;GAUG;AACH,MAAM,UAAU,eAAe,CAAC,EAC9B,IAAI,EACJ,QAAQ,EACR,IAAI,GAAG,KAAK,EACZ,GAAG,IAAI,EACc;IACrB,MAAM,SAAS,GAAG,IAAI;QACpB,CAAC,CAAC,EAAE,IAAI,EAAE,QAAiB,EAAE,WAAW,EAAE,QAAiB,EAAE;QAC7D,CAAC,CAAC,EAAE,CAAC;IACP,OAAO,CACL,MAAC,oBAAoB,iBAAY,IAAI,KAAM,SAAS,KAAM,IAAI,aAC5D,KAAC,oBAAoB,iBAAY,IAAI,iBAAc,MAAM,GAAG,EAC5D,KAAC,qBAAqB,cAAE,QAAQ,GAAyB,IACpC,CACxB,CAAC;AACJ,CAAC;AAED,MAAM,WAAW,GAAG;IAClB,OAAO,EAAE,GAAG,CAAA;;GAEX;IACD,IAAI,EAAE,GAAG,CAAA;;GAER;IACD,EAAE,EAAE,GAAG,CAAA;;GAEN;IACD,IAAI,EAAE,GAAG,CAAA;;GAER;IACD,IAAI,EAAE,GAAG,CAAA;;GAER;CACO,CAAC;AAEX,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAA6B;;;;;;;;;;IAUhE,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC;CAC/C,CAAC;AAEF,MAAM,QAAQ,GAAG;IACf,OAAO,EAAE,GAAG,CAAA;;GAEX;IACD,IAAI,EAAE,GAAG,CAAA;;GAER;IACD,EAAE,EAAE,GAAG,CAAA;;GAEN;IACD,IAAI,EAAE,GAAG,CAAA;;GAER;IACD,IAAI,EAAE,GAAG,CAAA;;GAER;CACO,CAAC;AAEX,MAAM,oBAAoB,GAAG,MAAM,CAAC,IAAI,CAA6B;;;;;;IAMjE,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC;CAC5C,CAAC;AAEF,MAAM,qBAAqB,GAAG,MAAM,CAAC,IAAI,CAAA;;;CAGxC,CAAC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Single-line ellipsis truncation for a flex child. Standalone form of the
|
|
3
|
+
* truncating behaviour baked into `RowName` — use this wherever a label
|
|
4
|
+
* needs to truncate outside of a `Row` (grid cells, card titles).
|
|
5
|
+
*/
|
|
6
|
+
export declare const Truncate: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never> & Partial<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>>> & string;
|
|
7
|
+
//# sourceMappingURL=Truncate.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Truncate.d.ts","sourceRoot":"","sources":["../src/Truncate.tsx"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,eAAO,MAAM,QAAQ,2VAMpB,CAAC"}
|
package/dist/Truncate.js
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import styled from "styled-components";
|
|
2
|
+
/**
|
|
3
|
+
* Single-line ellipsis truncation for a flex child. Standalone form of the
|
|
4
|
+
* truncating behaviour baked into `RowName` — use this wherever a label
|
|
5
|
+
* needs to truncate outside of a `Row` (grid cells, card titles).
|
|
6
|
+
*/
|
|
7
|
+
export const Truncate = styled.span `
|
|
8
|
+
overflow: hidden;
|
|
9
|
+
text-overflow: ellipsis;
|
|
10
|
+
white-space: nowrap;
|
|
11
|
+
flex: 1;
|
|
12
|
+
min-width: 0;
|
|
13
|
+
`;
|
|
14
|
+
//# sourceMappingURL=Truncate.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Truncate.js","sourceRoot":"","sources":["../src/Truncate.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC;;;;GAIG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,CAAA;;;;;;CAMlC,CAAC"}
|
package/dist/Value.d.ts
ADDED
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import type { HTMLAttributes, ReactNode } from "react";
|
|
2
|
+
export type ValueTone = "accent" | "default" | "muted";
|
|
3
|
+
export type ValueSize = "xs" | "sm" | "base" | "lg";
|
|
4
|
+
export interface ValueProps extends HTMLAttributes<HTMLSpanElement> {
|
|
5
|
+
/** Foreground colour. Defaults to `accent`. */
|
|
6
|
+
tone?: ValueTone;
|
|
7
|
+
/** Adds `margin-left: 2px` so the value sits apart from a preceding label. */
|
|
8
|
+
spaced?: boolean;
|
|
9
|
+
/**
|
|
10
|
+
* Font size, snapped to the type scale. Omit to inherit the ambient
|
|
11
|
+
* font-size from wherever the value is mounted (the original behaviour) —
|
|
12
|
+
* set it explicitly for dense list/grid rows (coverage %, sensor state,
|
|
13
|
+
* vessel meta) that need to stay off the 14px body-text size.
|
|
14
|
+
*/
|
|
15
|
+
size?: ValueSize;
|
|
16
|
+
children?: ReactNode;
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* Inline numeric/data readout. `font-variant-numeric: tabular-nums` is baked
|
|
20
|
+
* in so widgets never forget it and digits don't jitter as they update.
|
|
21
|
+
* Extracted from ScienceOfficer's `DataReadout`.
|
|
22
|
+
*/
|
|
23
|
+
export declare function Value({ tone, spaced, size, children, ...rest }: ValueProps): import("react/jsx-runtime").JSX.Element;
|
|
24
|
+
//# sourceMappingURL=Value.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Value.d.ts","sourceRoot":"","sources":["../src/Value.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAC;AACvD,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAAC;AAEpD,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAC,eAAe,CAAC;IACjE,+CAA+C;IAC/C,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,8EAA8E;IAC9E,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AA6BD;;;;GAIG;AACH,wBAAgB,KAAK,CAAC,EACpB,IAAe,EACf,MAAc,EACd,IAAI,EACJ,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,UAAU,2CAMZ"}
|
package/dist/Value.js
ADDED
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import styled, { css } from "styled-components";
|
|
3
|
+
const TONE_STYLES = {
|
|
4
|
+
accent: css `
|
|
5
|
+
color: var(--color-accent-fg);
|
|
6
|
+
`,
|
|
7
|
+
default: css `
|
|
8
|
+
color: var(--color-text-primary);
|
|
9
|
+
`,
|
|
10
|
+
muted: css `
|
|
11
|
+
color: var(--color-text-muted);
|
|
12
|
+
`,
|
|
13
|
+
};
|
|
14
|
+
const SIZE_STYLES = {
|
|
15
|
+
xs: css `
|
|
16
|
+
font-size: var(--font-size-xs);
|
|
17
|
+
`,
|
|
18
|
+
sm: css `
|
|
19
|
+
font-size: var(--font-size-sm);
|
|
20
|
+
`,
|
|
21
|
+
base: css `
|
|
22
|
+
font-size: var(--font-size-base);
|
|
23
|
+
`,
|
|
24
|
+
lg: css `
|
|
25
|
+
font-size: var(--font-size-lg);
|
|
26
|
+
`,
|
|
27
|
+
};
|
|
28
|
+
/**
|
|
29
|
+
* Inline numeric/data readout. `font-variant-numeric: tabular-nums` is baked
|
|
30
|
+
* in so widgets never forget it and digits don't jitter as they update.
|
|
31
|
+
* Extracted from ScienceOfficer's `DataReadout`.
|
|
32
|
+
*/
|
|
33
|
+
export function Value({ tone = "accent", spaced = false, size, children, ...rest }) {
|
|
34
|
+
return (_jsx(Value__Root, { "$tone": tone, "$spaced": spaced, "$size": size, ...rest, children: children }));
|
|
35
|
+
}
|
|
36
|
+
const Value__Root = styled.span `
|
|
37
|
+
font-variant-numeric: tabular-nums;
|
|
38
|
+
${({ $tone }) => TONE_STYLES[$tone]}
|
|
39
|
+
${({ $size }) => $size && SIZE_STYLES[$size]}
|
|
40
|
+
${({ $spaced }) => $spaced && `margin-left: 2px;`}
|
|
41
|
+
`;
|
|
42
|
+
//# sourceMappingURL=Value.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Value.js","sourceRoot":"","sources":["../src/Value.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAoBhD,MAAM,WAAW,GAAG;IAClB,MAAM,EAAE,GAAG,CAAA;;GAEV;IACD,OAAO,EAAE,GAAG,CAAA;;GAEX;IACD,KAAK,EAAE,GAAG,CAAA;;GAET;CACO,CAAC;AAEX,MAAM,WAAW,GAAG;IAClB,EAAE,EAAE,GAAG,CAAA;;GAEN;IACD,EAAE,EAAE,GAAG,CAAA;;GAEN;IACD,IAAI,EAAE,GAAG,CAAA;;GAER;IACD,EAAE,EAAE,GAAG,CAAA;;GAEN;CACO,CAAC;AAEX;;;;GAIG;AACH,MAAM,UAAU,KAAK,CAAC,EACpB,IAAI,GAAG,QAAQ,EACf,MAAM,GAAG,KAAK,EACd,IAAI,EACJ,QAAQ,EACR,GAAG,IAAI,EACI;IACX,OAAO,CACL,KAAC,WAAW,aAAQ,IAAI,aAAW,MAAM,WAAS,IAAI,KAAM,IAAI,YAC7D,QAAQ,GACG,CACf,CAAC;AACJ,CAAC;AAED,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAI7B;;IAEE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC;IACjC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,IAAI,WAAW,CAAC,KAAK,CAAC;IAC1C,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,OAAO,IAAI,mBAAmB;CAClD,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type { HTMLAttributes, ReactNode } from "react";
|
|
2
|
+
export interface WidgetHeaderProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
|
|
3
|
+
title?: ReactNode;
|
|
4
|
+
actions?: ReactNode;
|
|
5
|
+
children?: ReactNode;
|
|
6
|
+
}
|
|
7
|
+
/**
|
|
8
|
+
* Standard widget header row: a title slot on the left and an actions slot on
|
|
9
|
+
* the right, separated by a subtle bottom border.
|
|
10
|
+
*
|
|
11
|
+
* Either pass `title` (string / node — typically a `<PanelTitle>`-shaped
|
|
12
|
+
* label) or pass arbitrary `children` for full control of the left side.
|
|
13
|
+
* `actions` is an optional right-aligned slot (toggles, icon buttons, etc.).
|
|
14
|
+
*/
|
|
15
|
+
export declare function WidgetHeader({ title, actions, children, ...rest }: WidgetHeaderProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
//# sourceMappingURL=WidgetHeader.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"WidgetHeader.d.ts","sourceRoot":"","sources":["../src/WidgetHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,MAAM,WAAW,iBACf,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IACrD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED;;;;;;;GAOG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,OAAO,EACP,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,iBAAiB,2CAUnB"}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import styled from "styled-components";
|
|
3
|
+
/**
|
|
4
|
+
* Standard widget header row: a title slot on the left and an actions slot on
|
|
5
|
+
* the right, separated by a subtle bottom border.
|
|
6
|
+
*
|
|
7
|
+
* Either pass `title` (string / node — typically a `<PanelTitle>`-shaped
|
|
8
|
+
* label) or pass arbitrary `children` for full control of the left side.
|
|
9
|
+
* `actions` is an optional right-aligned slot (toggles, icon buttons, etc.).
|
|
10
|
+
*/
|
|
11
|
+
export function WidgetHeader({ title, actions, children, ...rest }) {
|
|
12
|
+
const left = title ?? children;
|
|
13
|
+
return (_jsxs(WidgetHeader__Body, { ...rest, children: [_jsx(WidgetHeader__Title, { children: left }), actions ? (_jsx(WidgetHeader__Actions, { children: actions })) : null] }));
|
|
14
|
+
}
|
|
15
|
+
const WidgetHeader__Body = styled.div `
|
|
16
|
+
display: flex;
|
|
17
|
+
align-items: center;
|
|
18
|
+
justify-content: space-between;
|
|
19
|
+
gap: 8px;
|
|
20
|
+
padding: 6px 10px;
|
|
21
|
+
border-bottom: 1px solid var(--color-border-subtle);
|
|
22
|
+
/* Never let the header collapse: at very short widget heights the flex
|
|
23
|
+
column would otherwise shrink this row toward zero and the body content
|
|
24
|
+
(e.g. a chart's top axis label) would overprint the title. */
|
|
25
|
+
flex-shrink: 0;
|
|
26
|
+
`;
|
|
27
|
+
const WidgetHeader__Title = styled.div `
|
|
28
|
+
display: flex;
|
|
29
|
+
align-items: center;
|
|
30
|
+
gap: 6px;
|
|
31
|
+
min-width: 0;
|
|
32
|
+
flex: 1;
|
|
33
|
+
`;
|
|
34
|
+
const WidgetHeader__Actions = styled.div `
|
|
35
|
+
display: flex;
|
|
36
|
+
align-items: center;
|
|
37
|
+
gap: 4px;
|
|
38
|
+
flex-shrink: 0;
|
|
39
|
+
`;
|
|
40
|
+
//# sourceMappingURL=WidgetHeader.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"WidgetHeader.js","sourceRoot":"","sources":["../src/WidgetHeader.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AASvC;;;;;;;GAOG;AACH,MAAM,UAAU,YAAY,CAAC,EAC3B,KAAK,EACL,OAAO,EACP,QAAQ,EACR,GAAG,IAAI,EACW;IAClB,MAAM,IAAI,GAAG,KAAK,IAAI,QAAQ,CAAC;IAC/B,OAAO,CACL,MAAC,kBAAkB,OAAK,IAAI,aAC1B,KAAC,mBAAmB,cAAE,IAAI,GAAuB,EAChD,OAAO,CAAC,CAAC,CAAC,CACT,KAAC,qBAAqB,cAAE,OAAO,GAAyB,CACzD,CAAC,CAAC,CAAC,IAAI,IACW,CACtB,CAAC;AACJ,CAAC;AAED,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;CAWpC,CAAC;AAEF,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;CAMrC,CAAC;AAEF,MAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;CAKvC,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type { UiKitTheme } from "./theme";
|
|
2
|
+
/**
|
|
3
|
+
* `default-dark` — the built-in mission-control theme.
|
|
4
|
+
*
|
|
5
|
+
* Token values name what is *currently* in the codebase, so the migration
|
|
6
|
+
* from raw hex constants to `theme.*` tokens is mechanical. Palette
|
|
7
|
+
* rationalisation (consolidating near-duplicate greys, retiring unused
|
|
8
|
+
* shades) is deliberately deferred to a later commit so a structural sweep
|
|
9
|
+
* can be a pure refactor with no visual diff.
|
|
10
|
+
*
|
|
11
|
+
* Typography sizes are emitted as CSS-variable strings so the responsive
|
|
12
|
+
* overrides in `tokens.css` (coarse-pointer bumps etc.) keep working when
|
|
13
|
+
* consumers read from the theme instead of the raw variable.
|
|
14
|
+
*/
|
|
15
|
+
export declare const defaultDarkTheme: UiKitTheme;
|
|
16
|
+
//# sourceMappingURL=defaultDarkTheme.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"defaultDarkTheme.d.ts","sourceRoot":"","sources":["../src/defaultDarkTheme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,gBAAgB,EAAE,UAiF9B,CAAC"}
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* `default-dark` — the built-in mission-control theme.
|
|
3
|
+
*
|
|
4
|
+
* Token values name what is *currently* in the codebase, so the migration
|
|
5
|
+
* from raw hex constants to `theme.*` tokens is mechanical. Palette
|
|
6
|
+
* rationalisation (consolidating near-duplicate greys, retiring unused
|
|
7
|
+
* shades) is deliberately deferred to a later commit so a structural sweep
|
|
8
|
+
* can be a pure refactor with no visual diff.
|
|
9
|
+
*
|
|
10
|
+
* Typography sizes are emitted as CSS-variable strings so the responsive
|
|
11
|
+
* overrides in `tokens.css` (coarse-pointer bumps etc.) keep working when
|
|
12
|
+
* consumers read from the theme instead of the raw variable.
|
|
13
|
+
*/
|
|
14
|
+
export const defaultDarkTheme = {
|
|
15
|
+
colors: {
|
|
16
|
+
text: {
|
|
17
|
+
primary: "var(--color-text-primary)",
|
|
18
|
+
muted: "var(--color-text-muted)",
|
|
19
|
+
dim: "var(--color-text-dim)",
|
|
20
|
+
faint: "var(--color-text-faint)",
|
|
21
|
+
inverse: "var(--color-text-inverse)",
|
|
22
|
+
},
|
|
23
|
+
surface: {
|
|
24
|
+
app: "var(--color-surface-app)",
|
|
25
|
+
panel: "var(--color-surface-panel)",
|
|
26
|
+
raised: "var(--color-surface-raised)",
|
|
27
|
+
sunken: "var(--color-surface-sunken)",
|
|
28
|
+
},
|
|
29
|
+
border: {
|
|
30
|
+
subtle: "var(--color-border-subtle)",
|
|
31
|
+
strong: "var(--color-border-strong)",
|
|
32
|
+
},
|
|
33
|
+
accent: {
|
|
34
|
+
fg: "var(--color-accent-fg)",
|
|
35
|
+
bg: "var(--color-accent-bg)",
|
|
36
|
+
},
|
|
37
|
+
status: {
|
|
38
|
+
go: {
|
|
39
|
+
fg: "var(--color-status-go-fg)",
|
|
40
|
+
bg: "var(--color-status-go-bg)",
|
|
41
|
+
},
|
|
42
|
+
nogo: {
|
|
43
|
+
fg: "var(--color-status-nogo-fg)",
|
|
44
|
+
bg: "var(--color-status-nogo-bg)",
|
|
45
|
+
},
|
|
46
|
+
warning: {
|
|
47
|
+
fg: "var(--color-status-warning-fg)",
|
|
48
|
+
bg: "var(--color-status-warning-bg)",
|
|
49
|
+
},
|
|
50
|
+
info: {
|
|
51
|
+
fg: "var(--color-status-info-fg)",
|
|
52
|
+
bg: "var(--color-status-info-bg)",
|
|
53
|
+
},
|
|
54
|
+
},
|
|
55
|
+
focus: "var(--color-focus)",
|
|
56
|
+
},
|
|
57
|
+
typography: {
|
|
58
|
+
family: {
|
|
59
|
+
mono: 'ui-monospace, "JetBrains Mono", "IBM Plex Mono", Menlo, Consolas, monospace',
|
|
60
|
+
},
|
|
61
|
+
size: {
|
|
62
|
+
xs: "var(--font-size-xs)",
|
|
63
|
+
sm: "var(--font-size-sm)",
|
|
64
|
+
base: "var(--font-size-base)",
|
|
65
|
+
lg: "var(--font-size-lg)",
|
|
66
|
+
},
|
|
67
|
+
weight: {
|
|
68
|
+
regular: 400,
|
|
69
|
+
bold: 700,
|
|
70
|
+
},
|
|
71
|
+
letterSpacing: {
|
|
72
|
+
tight: "0.05em",
|
|
73
|
+
label: "0.1em",
|
|
74
|
+
wide: "0.15em",
|
|
75
|
+
body: "0",
|
|
76
|
+
},
|
|
77
|
+
},
|
|
78
|
+
space: {
|
|
79
|
+
xs: "2px",
|
|
80
|
+
sm: "4px",
|
|
81
|
+
md: "8px",
|
|
82
|
+
lg: "12px",
|
|
83
|
+
xl: "16px",
|
|
84
|
+
},
|
|
85
|
+
radii: {
|
|
86
|
+
xs: "2px",
|
|
87
|
+
sm: "3px",
|
|
88
|
+
md: "4px",
|
|
89
|
+
pill: "999px",
|
|
90
|
+
},
|
|
91
|
+
borders: {
|
|
92
|
+
subtle: "1px solid var(--color-border-subtle)",
|
|
93
|
+
strong: "1px solid var(--color-border-strong)",
|
|
94
|
+
},
|
|
95
|
+
};
|
|
96
|
+
//# sourceMappingURL=defaultDarkTheme.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"defaultDarkTheme.js","sourceRoot":"","sources":["../src/defaultDarkTheme.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAe;IAC1C,MAAM,EAAE;QACN,IAAI,EAAE;YACJ,OAAO,EAAE,2BAA2B;YACpC,KAAK,EAAE,yBAAyB;YAChC,GAAG,EAAE,uBAAuB;YAC5B,KAAK,EAAE,yBAAyB;YAChC,OAAO,EAAE,2BAA2B;SACrC;QACD,OAAO,EAAE;YACP,GAAG,EAAE,0BAA0B;YAC/B,KAAK,EAAE,4BAA4B;YACnC,MAAM,EAAE,6BAA6B;YACrC,MAAM,EAAE,6BAA6B;SACtC;QACD,MAAM,EAAE;YACN,MAAM,EAAE,4BAA4B;YACpC,MAAM,EAAE,4BAA4B;SACrC;QACD,MAAM,EAAE;YACN,EAAE,EAAE,wBAAwB;YAC5B,EAAE,EAAE,wBAAwB;SAC7B;QACD,MAAM,EAAE;YACN,EAAE,EAAE;gBACF,EAAE,EAAE,2BAA2B;gBAC/B,EAAE,EAAE,2BAA2B;aAChC;YACD,IAAI,EAAE;gBACJ,EAAE,EAAE,6BAA6B;gBACjC,EAAE,EAAE,6BAA6B;aAClC;YACD,OAAO,EAAE;gBACP,EAAE,EAAE,gCAAgC;gBACpC,EAAE,EAAE,gCAAgC;aACrC;YACD,IAAI,EAAE;gBACJ,EAAE,EAAE,6BAA6B;gBACjC,EAAE,EAAE,6BAA6B;aAClC;SACF;QACD,KAAK,EAAE,oBAAoB;KAC5B;IACD,UAAU,EAAE;QACV,MAAM,EAAE;YACN,IAAI,EAAE,6EAA6E;SACpF;QACD,IAAI,EAAE;YACJ,EAAE,EAAE,qBAAqB;YACzB,EAAE,EAAE,qBAAqB;YACzB,IAAI,EAAE,uBAAuB;YAC7B,EAAE,EAAE,qBAAqB;SAC1B;QACD,MAAM,EAAE;YACN,OAAO,EAAE,GAAG;YACZ,IAAI,EAAE,GAAG;SACV;QACD,aAAa,EAAE;YACb,KAAK,EAAE,QAAQ;YACf,KAAK,EAAE,OAAO;YACd,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,GAAG;SACV;KACF;IACD,KAAK,EAAE;QACL,EAAE,EAAE,KAAK;QACT,EAAE,EAAE,KAAK;QACT,EAAE,EAAE,KAAK;QACT,EAAE,EAAE,MAAM;QACV,EAAE,EAAE,MAAM;KACX;IACD,KAAK,EAAE;QACL,EAAE,EAAE,KAAK;QACT,EAAE,EAAE,KAAK;QACT,EAAE,EAAE,KAAK;QACT,IAAI,EAAE,OAAO;KACd;IACD,OAAO,EAAE;QACP,MAAM,EAAE,sCAAsC;QAC9C,MAAM,EAAE,sCAAsC;KAC/C;CACF,CAAC"}
|
package/dist/format.d.ts
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export interface FormatNumberOptions {
|
|
2
|
+
/** Fixed decimal places (`Number.toFixed`). Omit to stringify as-is. */
|
|
3
|
+
decimals?: number;
|
|
4
|
+
}
|
|
5
|
+
/**
|
|
6
|
+
* Formats a telemetry number for display. `undefined` and non-finite values
|
|
7
|
+
* (`NaN`, `Infinity`) — the two shapes a not-yet-arrived or sentinel reading
|
|
8
|
+
* takes — render as an em dash rather than `"undefined"`/`"NaN"`.
|
|
9
|
+
*/
|
|
10
|
+
export declare function formatNumber(value: number | undefined, opts?: FormatNumberOptions): string;
|
|
11
|
+
//# sourceMappingURL=format.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"format.d.ts","sourceRoot":"","sources":["../src/format.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,mBAAmB;IAClC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAC1B,KAAK,EAAE,MAAM,GAAG,SAAS,EACzB,IAAI,GAAE,mBAAwB,GAC7B,MAAM,CAIR"}
|
package/dist/format.js
ADDED
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Formats a telemetry number for display. `undefined` and non-finite values
|
|
3
|
+
* (`NaN`, `Infinity`) — the two shapes a not-yet-arrived or sentinel reading
|
|
4
|
+
* takes — render as an em dash rather than `"undefined"`/`"NaN"`.
|
|
5
|
+
*/
|
|
6
|
+
export function formatNumber(value, opts = {}) {
|
|
7
|
+
if (value === undefined || !Number.isFinite(value))
|
|
8
|
+
return "—";
|
|
9
|
+
const { decimals } = opts;
|
|
10
|
+
return decimals === undefined ? String(value) : value.toFixed(decimals);
|
|
11
|
+
}
|
|
12
|
+
//# sourceMappingURL=format.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"format.js","sourceRoot":"","sources":["../src/format.ts"],"names":[],"mappings":"AAKA;;;;GAIG;AACH,MAAM,UAAU,YAAY,CAC1B,KAAyB,EACzB,OAA4B,EAAE;IAE9B,IAAI,KAAK,KAAK,SAAS,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC;QAAE,OAAO,GAAG,CAAC;IAC/D,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;IAC1B,OAAO,QAAQ,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;AAC1E,CAAC"}
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
export { ActionButton, type ActionButtonProps, type ActionButtonTone, } from "./ActionButton";
|
|
2
|
+
export { Badge, type BadgeProps, type BadgeSize, type BadgeTone, } from "./Badge";
|
|
3
|
+
export { Box, type BoxPad, type BoxProps, type BoxRadius, type BoxSurface, } from "./Box";
|
|
4
|
+
export { Card, type CardProps } from "./Card";
|
|
5
|
+
export { Cluster, type ClusterJustify, type ClusterProps } from "./Cluster";
|
|
6
|
+
export { defaultDarkTheme } from "./defaultDarkTheme";
|
|
7
|
+
export { EmptyState, type EmptyStateLayout, type EmptyStateProps, } from "./EmptyState";
|
|
8
|
+
export { type FormatNumberOptions, formatNumber } from "./format";
|
|
9
|
+
export { GonogoTokens } from "./GonogoTokens";
|
|
10
|
+
export { Grid, type GridProps } from "./Grid";
|
|
11
|
+
export { Inline, type InlineProps } from "./Inline";
|
|
12
|
+
export { Panel, PanelSubtitle, PanelTitle, ScrollArea } from "./Panel";
|
|
13
|
+
export { ProgressBar, type ProgressBarProps } from "./ProgressBar";
|
|
14
|
+
export { BigReadout, Readout, ReadoutCaption, type ReadoutTone, StatusPill, } from "./Readout";
|
|
15
|
+
export { Row, RowName, type RowProps } from "./Row";
|
|
16
|
+
export { Section, type SectionProps, SectionTitle } from "./Section";
|
|
17
|
+
export { Spinner, type SpinnerProps } from "./Spinner";
|
|
18
|
+
export { type SpaceToken, Stack, type StackProps } from "./Stack";
|
|
19
|
+
export { StatusIndicator, type StatusIndicatorProps, type StatusTone, } from "./StatusIndicator";
|
|
20
|
+
export { ScienceExperimentRow, type ScienceExperimentRowProps, type ScienceInstrument, } from "./science/ScienceExperimentRow";
|
|
21
|
+
export { Truncate } from "./Truncate";
|
|
22
|
+
export * from "./theme";
|
|
23
|
+
export { Value, type ValueProps, type ValueSize, type ValueTone, } from "./Value";
|
|
24
|
+
export { WidgetHeader, type WidgetHeaderProps } from "./WidgetHeader";
|
|
25
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,GACtB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EACL,KAAK,EACL,KAAK,UAAU,EACf,KAAK,SAAS,EACd,KAAK,SAAS,GACf,MAAM,SAAS,CAAC;AACjB,OAAO,EACL,GAAG,EACH,KAAK,MAAM,EACX,KAAK,QAAQ,EACb,KAAK,SAAS,EACd,KAAK,UAAU,GAChB,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAC;AAC5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD,OAAO,EACL,UAAU,EACV,KAAK,gBAAgB,EACrB,KAAK,eAAe,GACrB,MAAM,cAAc,CAAC;AAEtB,OAAO,EAAE,KAAK,mBAAmB,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAC9C,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAEpD,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACvE,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EACL,UAAU,EACV,OAAO,EACP,cAAc,EACd,KAAK,WAAW,EAChB,UAAU,GACX,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACrE,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAC;AAEvD,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAClE,OAAO,EACL,eAAe,EACf,KAAK,oBAAoB,EACzB,KAAK,UAAU,GAChB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EACL,oBAAoB,EACpB,KAAK,yBAAyB,EAC9B,KAAK,iBAAiB,GACvB,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,cAAc,SAAS,CAAC;AACxB,OAAO,EACL,KAAK,EACL,KAAK,UAAU,EACf,KAAK,SAAS,EACd,KAAK,SAAS,GACf,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
export { ActionButton, } from "./ActionButton";
|
|
2
|
+
export { Badge, } from "./Badge";
|
|
3
|
+
export { Box, } from "./Box";
|
|
4
|
+
export { Card } from "./Card";
|
|
5
|
+
export { Cluster } from "./Cluster";
|
|
6
|
+
export { defaultDarkTheme } from "./defaultDarkTheme";
|
|
7
|
+
// ── Leaf components ──────────────────────────────────────────────────────────
|
|
8
|
+
export { EmptyState, } from "./EmptyState";
|
|
9
|
+
// ── Formatters ───────────────────────────────────────────────────────────────
|
|
10
|
+
export { formatNumber } from "./format";
|
|
11
|
+
export { GonogoTokens } from "./GonogoTokens";
|
|
12
|
+
export { Grid } from "./Grid";
|
|
13
|
+
export { Inline } from "./Inline";
|
|
14
|
+
// ── Panel family ─────────────────────────────────────────────────────────────
|
|
15
|
+
export { Panel, PanelSubtitle, PanelTitle, ScrollArea } from "./Panel";
|
|
16
|
+
export { ProgressBar } from "./ProgressBar";
|
|
17
|
+
export { BigReadout, Readout, ReadoutCaption, StatusPill, } from "./Readout";
|
|
18
|
+
export { Row, RowName } from "./Row";
|
|
19
|
+
export { Section, SectionTitle } from "./Section";
|
|
20
|
+
export { Spinner } from "./Spinner";
|
|
21
|
+
// ── Layout primitives ────────────────────────────────────────────────────────
|
|
22
|
+
export { Stack } from "./Stack";
|
|
23
|
+
export { StatusIndicator, } from "./StatusIndicator";
|
|
24
|
+
export { ScienceExperimentRow, } from "./science/ScienceExperimentRow";
|
|
25
|
+
export { Truncate } from "./Truncate";
|
|
26
|
+
export * from "./theme";
|
|
27
|
+
export { Value, } from "./Value";
|
|
28
|
+
export { WidgetHeader } from "./WidgetHeader";
|
|
29
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,YAAY,GAGb,MAAM,gBAAgB,CAAC;AACxB,OAAO,EACL,KAAK,GAIN,MAAM,SAAS,CAAC;AACjB,OAAO,EACL,GAAG,GAKJ,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,IAAI,EAAkB,MAAM,QAAQ,CAAC;AAC9C,OAAO,EAAE,OAAO,EAA0C,MAAM,WAAW,CAAC;AAC5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,gFAAgF;AAChF,OAAO,EACL,UAAU,GAGX,MAAM,cAAc,CAAC;AACtB,gFAAgF;AAChF,OAAO,EAA4B,YAAY,EAAE,MAAM,UAAU,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,IAAI,EAAkB,MAAM,QAAQ,CAAC;AAC9C,OAAO,EAAE,MAAM,EAAoB,MAAM,UAAU,CAAC;AACpD,gFAAgF;AAChF,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACvE,OAAO,EAAE,WAAW,EAAyB,MAAM,eAAe,CAAC;AACnE,OAAO,EACL,UAAU,EACV,OAAO,EACP,cAAc,EAEd,UAAU,GACX,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,GAAG,EAAE,OAAO,EAAiB,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,OAAO,EAAqB,YAAY,EAAE,MAAM,WAAW,CAAC;AACrE,OAAO,EAAE,OAAO,EAAqB,MAAM,WAAW,CAAC;AACvD,gFAAgF;AAChF,OAAO,EAAmB,KAAK,EAAmB,MAAM,SAAS,CAAC;AAClE,OAAO,EACL,eAAe,GAGhB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EACL,oBAAoB,GAGrB,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,cAAc,SAAS,CAAC;AACxB,OAAO,EACL,KAAK,GAIN,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,YAAY,EAA0B,MAAM,gBAAgB,CAAC"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import type { TopicPayload } from "@ksp-gonogo/sitrep-sdk";
|
|
2
|
+
/**
|
|
3
|
+
* The row's data contract. Presentational and already-normalised (plain
|
|
4
|
+
* booleans, not optionals) so a widget's own parsed-instrument shape maps in
|
|
5
|
+
* directly. This is the widget-facing projection of the SDK's
|
|
6
|
+
* `InstrumentEntry` (`science.instruments` topic), *not* `ExperimentEntry`
|
|
7
|
+
* (`science.experiments`) — the row needs `partId`/`hasData`/`rerunnable`,
|
|
8
|
+
* fields `ExperimentEntry` doesn't carry.
|
|
9
|
+
*/
|
|
10
|
+
export interface ScienceInstrument {
|
|
11
|
+
partId: string;
|
|
12
|
+
partTitle: string;
|
|
13
|
+
expId: string;
|
|
14
|
+
deployed: boolean;
|
|
15
|
+
hasData: boolean;
|
|
16
|
+
rerunnable: boolean;
|
|
17
|
+
inoperable: boolean;
|
|
18
|
+
}
|
|
19
|
+
export type WireInstrument = TopicPayload<"science.instruments">[number];
|
|
20
|
+
export interface ScienceExperimentRowProps {
|
|
21
|
+
/** The instrument this row renders. */
|
|
22
|
+
instrument: ScienceInstrument;
|
|
23
|
+
/** Called with `instrument.partId` when the operator confirms Deploy. */
|
|
24
|
+
onDeploy?: (partId: string) => void;
|
|
25
|
+
/**
|
|
26
|
+
* Called with `instrument.partId` after the arm→confirm handshake — never
|
|
27
|
+
* fired directly off a bare click.
|
|
28
|
+
*/
|
|
29
|
+
onTransmit?: (partId: string) => void;
|
|
30
|
+
}
|
|
31
|
+
/**
|
|
32
|
+
* A single science-instrument row: name, state badges, and the
|
|
33
|
+
* Deploy/Transmit action cluster. Extracted verbatim from ScienceOfficer's
|
|
34
|
+
* per-instrument `<Row>` + `InstrumentActions` — same arm→confirm→pending
|
|
35
|
+
* behaviour, same badge tones, now composed entirely from kit primitives.
|
|
36
|
+
*
|
|
37
|
+
* Data/framework-free by design (§1 export-safety boundary): this component
|
|
38
|
+
* never dispatches a command or reads telemetry itself. The arm/pending
|
|
39
|
+
* control state is presentational UI state and stays local; the actual
|
|
40
|
+
* command dispatch is the caller's job via `onDeploy`/`onTransmit`.
|
|
41
|
+
*/
|
|
42
|
+
export declare function ScienceExperimentRow({ instrument, onDeploy, onTransmit, }: Readonly<ScienceExperimentRowProps>): import("react/jsx-runtime").JSX.Element;
|
|
43
|
+
//# sourceMappingURL=ScienceExperimentRow.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ScienceExperimentRow.d.ts","sourceRoot":"","sources":["../../src/science/ScienceExperimentRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAQ3D;;;;;;;GAOG;AACH,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;CACrB;AAOD,MAAM,MAAM,cAAc,GAAG,YAAY,CAAC,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAC;AAEzE,MAAM,WAAW,yBAAyB;IACxC,uCAAuC;IACvC,UAAU,EAAE,iBAAiB,CAAC;IAC9B,yEAAyE;IACzE,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAID;;;;;;;;;;GAUG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,UAAU,EACV,QAAQ,EACR,UAAU,GACX,EAAE,QAAQ,CAAC,yBAAyB,CAAC,2CA6FrC"}
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useState } from "react";
|
|
3
|
+
import { ActionButton } from "../ActionButton";
|
|
4
|
+
import { Badge } from "../Badge";
|
|
5
|
+
import { Inline } from "../Inline";
|
|
6
|
+
import { Row, RowName } from "../Row";
|
|
7
|
+
import { Spinner } from "../Spinner";
|
|
8
|
+
const ARM_TIMEOUT_MS = 4000;
|
|
9
|
+
/**
|
|
10
|
+
* A single science-instrument row: name, state badges, and the
|
|
11
|
+
* Deploy/Transmit action cluster. Extracted verbatim from ScienceOfficer's
|
|
12
|
+
* per-instrument `<Row>` + `InstrumentActions` — same arm→confirm→pending
|
|
13
|
+
* behaviour, same badge tones, now composed entirely from kit primitives.
|
|
14
|
+
*
|
|
15
|
+
* Data/framework-free by design (§1 export-safety boundary): this component
|
|
16
|
+
* never dispatches a command or reads telemetry itself. The arm/pending
|
|
17
|
+
* control state is presentational UI state and stays local; the actual
|
|
18
|
+
* command dispatch is the caller's job via `onDeploy`/`onTransmit`.
|
|
19
|
+
*/
|
|
20
|
+
export function ScienceExperimentRow({ instrument, onDeploy, onTransmit, }) {
|
|
21
|
+
const [armed, setArmed] = useState(false);
|
|
22
|
+
const [pending, setPending] = useState(null);
|
|
23
|
+
useEffect(() => {
|
|
24
|
+
if (!armed)
|
|
25
|
+
return;
|
|
26
|
+
const id = setTimeout(() => setArmed(false), ARM_TIMEOUT_MS);
|
|
27
|
+
return () => clearTimeout(id);
|
|
28
|
+
}, [armed]);
|
|
29
|
+
// Clear the pending state once telemetry reports the new instrument state
|
|
30
|
+
// — `deployed`/`hasData` transitions are the success signal. Fall back to
|
|
31
|
+
// a 5s safety timeout so an action that never lands doesn't leave the
|
|
32
|
+
// button forever-busy.
|
|
33
|
+
useEffect(() => {
|
|
34
|
+
if (pending === null)
|
|
35
|
+
return;
|
|
36
|
+
if (pending === "deploy" && (instrument.deployed || instrument.hasData)) {
|
|
37
|
+
setPending(null);
|
|
38
|
+
return;
|
|
39
|
+
}
|
|
40
|
+
if (pending === "transmit" && !instrument.hasData) {
|
|
41
|
+
setPending(null);
|
|
42
|
+
return;
|
|
43
|
+
}
|
|
44
|
+
const id = setTimeout(() => setPending(null), 5_000);
|
|
45
|
+
return () => clearTimeout(id);
|
|
46
|
+
}, [pending, instrument.deployed, instrument.hasData]);
|
|
47
|
+
return (_jsxs(Row, { children: [_jsx(RowName, { children: instrument.partTitle }), _jsxs(Inline, { children: [instrument.hasData && _jsx(Badge, { tone: "go", children: "DATA" }), instrument.deployed && _jsx(Badge, { tone: "neutral", children: "DEPLOYED" }), !instrument.rerunnable && _jsx(Badge, { tone: "neutral", children: "ONE-SHOT" }), instrument.inoperable && _jsx(Badge, { tone: "nogo", children: "INOPERABLE" })] }), !instrument.inoperable && (_jsxs(Inline, { inset: true, children: [!instrument.deployed && !instrument.hasData && (_jsx(ActionButton, { type: "button", disabled: pending === "deploy", "aria-busy": pending === "deploy", onClick: () => {
|
|
48
|
+
if (pending !== null)
|
|
49
|
+
return;
|
|
50
|
+
setPending("deploy");
|
|
51
|
+
onDeploy?.(instrument.partId);
|
|
52
|
+
}, children: pending === "deploy" ? (_jsxs(_Fragment, { children: [_jsx(Spinner, { size: 10 }), " Deploying\u2026"] })) : ("Deploy") })), instrument.hasData &&
|
|
53
|
+
(armed ? (_jsx(ActionButton, { type: "button", tone: "go", disabled: pending === "transmit", "aria-busy": pending === "transmit", onClick: () => {
|
|
54
|
+
if (pending !== null)
|
|
55
|
+
return;
|
|
56
|
+
setArmed(false);
|
|
57
|
+
setPending("transmit");
|
|
58
|
+
onTransmit?.(instrument.partId);
|
|
59
|
+
}, children: pending === "transmit" ? (_jsxs(_Fragment, { children: [_jsx(Spinner, { size: 10 }), " Transmitting\u2026"] })) : ("Confirm transmit") })) : (_jsx(ActionButton, { type: "button", onClick: () => setArmed(true), children: "Transmit" })))] }))] }));
|
|
60
|
+
}
|
|
61
|
+
//# sourceMappingURL=ScienceExperimentRow.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ScienceExperimentRow.js","sourceRoot":"","sources":["../../src/science/ScienceExperimentRow.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"axe.d.ts","sourceRoot":"","sources":["../../src/test/axe.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAsB,MAAM,UAAU,CAAC;AAKnD,OAAO,EAAE,GAAG,EAAE,CAAC"}
|
package/dist/test/axe.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"axe.js","sourceRoot":"","sources":["../../src/test/axe.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAEhC,MAAM,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC;AAElC,OAAO,EAAE,GAAG,EAAE,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"setup.d.ts","sourceRoot":"","sources":["../../src/test/setup.ts"],"names":[],"mappings":"AAAA,OAAO,2BAA2B,CAAC"}
|