@xeonr/platform-ui 0.3.20 → 0.4.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 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +16 -0
- package/dist/index.js.map +1 -1
- package/dist/kit/ApiKeyForm.d.ts +71 -0
- package/dist/kit/ApiKeyForm.d.ts.map +1 -0
- package/dist/kit/ApiKeyForm.js +105 -0
- package/dist/kit/ApiKeyForm.js.map +1 -0
- package/dist/kit/ApiKeys.d.ts +79 -0
- package/dist/kit/ApiKeys.d.ts.map +1 -0
- package/dist/kit/ApiKeys.js +198 -0
- package/dist/kit/ApiKeys.js.map +1 -0
- package/dist/kit/Button.d.ts +1 -1
- package/dist/kit/Button.d.ts.map +1 -1
- package/dist/kit/Button.js.map +1 -1
- package/dist/kit/Combobox.d.ts +17 -1
- package/dist/kit/Combobox.d.ts.map +1 -1
- package/dist/kit/Combobox.js +12 -3
- package/dist/kit/Combobox.js.map +1 -1
- package/dist/kit/MultiCombobox.d.ts +19 -1
- package/dist/kit/MultiCombobox.d.ts.map +1 -1
- package/dist/kit/MultiCombobox.js +32 -9
- package/dist/kit/MultiCombobox.js.map +1 -1
- package/dist/kit/Sparkline.d.ts +57 -0
- package/dist/kit/Sparkline.d.ts.map +1 -0
- package/dist/kit/Sparkline.js +109 -0
- package/dist/kit/Sparkline.js.map +1 -0
- package/dist/kit/Text.d.ts +5 -0
- package/dist/kit/Text.d.ts.map +1 -1
- package/dist/kit/Text.js +12 -2
- package/dist/kit/Text.js.map +1 -1
- package/dist/kit/Tooltip.d.ts +41 -0
- package/dist/kit/Tooltip.d.ts.map +1 -0
- package/dist/kit/Tooltip.js +129 -0
- package/dist/kit/Tooltip.js.map +1 -0
- package/dist/theme/paint.d.ts +43 -0
- package/dist/theme/paint.d.ts.map +1 -0
- package/dist/theme/paint.js +109 -0
- package/dist/theme/paint.js.map +1 -0
- package/dist/theme/tokens.d.ts +10 -0
- package/dist/theme/tokens.d.ts.map +1 -1
- package/dist/theme/tokens.js +43 -0
- package/dist/theme/tokens.js.map +1 -1
- package/package.json +1 -1
package/dist/kit/Text.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../src/kit/Text.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,CAAC,EAAE,MAAM,oBAAoB,CAAC;AAEvC,wEAAwE;AACxE,6EAA6E;AAC7E,oCAAoC;AAEpC,sDAAsD;AACtD,MAAM,CAAC,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,
|
|
1
|
+
{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../src/kit/Text.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { type CSSProperties, type ReactNode } from "react";
|
|
2
|
+
type Side = "top" | "bottom";
|
|
3
|
+
export interface TooltipProps {
|
|
4
|
+
/** what the tooltip says — a string, or nodes for a two-line explanation */
|
|
5
|
+
label: ReactNode;
|
|
6
|
+
/** the element it explains; it is wrapped in an inline-flex span */
|
|
7
|
+
children: ReactNode;
|
|
8
|
+
/** which side to prefer; it flips when there is no room (default "top") */
|
|
9
|
+
side?: Side | undefined;
|
|
10
|
+
/** horizontal alignment against the anchor (default "center") */
|
|
11
|
+
align?: "center" | "start" | "end" | undefined;
|
|
12
|
+
/** max width in px — widen it for a sentence (default 260) */
|
|
13
|
+
width?: number | undefined;
|
|
14
|
+
/** ms before it opens; 0 for immediate (default 180) */
|
|
15
|
+
delay?: number | undefined;
|
|
16
|
+
/** suppress it without unwrapping the child (a label that is sometimes absent) */
|
|
17
|
+
disabled?: boolean | undefined;
|
|
18
|
+
/**
|
|
19
|
+
* Applied to the anchor — the inline-flex span this wraps the child in.
|
|
20
|
+
*
|
|
21
|
+
* Needed because wrapping an element in a tooltip inserts a box between it
|
|
22
|
+
* and its parent: a flex child that was `flex: 1 1 auto` stops growing the
|
|
23
|
+
* moment it gains an anchor, and in a tight row it collapses onto its
|
|
24
|
+
* neighbour. Pass the sizing through (`style={{ flex: "1 1 auto", minWidth: 200 }}`)
|
|
25
|
+
* and the anchor takes the place the child used to have.
|
|
26
|
+
*/
|
|
27
|
+
style?: CSSProperties | undefined;
|
|
28
|
+
className?: string | undefined;
|
|
29
|
+
}
|
|
30
|
+
/**
|
|
31
|
+
* Tooltip: hover or focus the child, get `label` in a themed bubble.
|
|
32
|
+
*
|
|
33
|
+
* Keyboard and assistive tech are first-class — the bubble opens on focus as
|
|
34
|
+
* well as hover, and the anchor is wired to it with `aria-describedby`, so the
|
|
35
|
+
* explanation is announced rather than being a thing only a mouse can find.
|
|
36
|
+
* Escape dismisses it, because a bubble pinned by focus otherwise covers
|
|
37
|
+
* whatever is under it while you read the field it describes.
|
|
38
|
+
*/
|
|
39
|
+
export declare function Tooltip({ label, children, side, align, width, delay, disabled, style, className }: TooltipProps): import("react").JSX.Element;
|
|
40
|
+
export {};
|
|
41
|
+
//# sourceMappingURL=Tooltip.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../src/kit/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAyD,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAmDlH,KAAK,IAAI,GAAG,KAAK,GAAG,QAAQ,CAAC;AAoB7B,MAAM,WAAW,YAAY;IAC3B,4EAA4E;IAC5E,KAAK,EAAE,SAAS,CAAC;IACjB,oEAAoE;IACpE,QAAQ,EAAE,SAAS,CAAC;IACpB,2EAA2E;IAC3E,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,CAAC;IACxB,iEAAiE;IACjE,KAAK,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,GAAG,SAAS,CAAC;IAC/C,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,wDAAwD;IACxD,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,kFAAkF;IAClF,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B;;;;;;;;OAQG;IACH,KAAK,CAAC,EAAE,aAAa,GAAG,SAAS,CAAC;IAClC,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC;AAED;;;;;;;;GAQG;AACH,wBAAgB,OAAO,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAY,EAAE,KAAgB,EAAE,KAAK,EAAE,KAAW,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,YAAY,+BAkFxI"}
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useCallback, useId, useLayoutEffect, useRef, useState } from "react";
|
|
3
|
+
import { createPortal } from "react-dom";
|
|
4
|
+
import styled, { keyframes } from "styled-components";
|
|
5
|
+
import { v } from "../theme/tokens.js";
|
|
6
|
+
// Tooltip — the hover/focus explanation a dense ops screen cannot do without.
|
|
7
|
+
//
|
|
8
|
+
// The kit got this far on the native `title` attribute, which is right for a
|
|
9
|
+
// truncated value's full text and wrong for everything else: it cannot hold a
|
|
10
|
+
// sentence anyone will read, it is invisible to a keyboard, it never appears on
|
|
11
|
+
// a touch screen, and it is painted by the OS rather than by the design system.
|
|
12
|
+
// Screens that needed to explain a control — "root spans have no parent, one
|
|
13
|
+
// row per request", the filter syntax, why a threshold is approximate — were
|
|
14
|
+
// reaching for their own popup, which is the duplication this removes.
|
|
15
|
+
//
|
|
16
|
+
// What it is NOT: a popover with controls in it. Nothing inside a tooltip is
|
|
17
|
+
// clickable (it is `pointer-events: none` and it closes as the pointer leaves),
|
|
18
|
+
// because a thing you must hover a corridor to reach is a thing you cannot
|
|
19
|
+
// reach. Use `Popover` for a sheet with content, and `Menu` for actions.
|
|
20
|
+
const fadeIn = keyframes `from { opacity: 0; transform: translateY(2px); }`;
|
|
21
|
+
const Bubble = styled.div `
|
|
22
|
+
position: fixed;
|
|
23
|
+
z-index: ${v.zPop};
|
|
24
|
+
max-width: ${(p) => p.$wide ?? 260}px;
|
|
25
|
+
padding: 7px 9px;
|
|
26
|
+
border-radius: ${v.rCard};
|
|
27
|
+
background: ${v.surface2};
|
|
28
|
+
border: 1px solid ${v.line2};
|
|
29
|
+
box-shadow: ${v.elev};
|
|
30
|
+
color: ${v.text};
|
|
31
|
+
font-family: ${v.font};
|
|
32
|
+
font-size: 11.5px;
|
|
33
|
+
line-height: 1.5;
|
|
34
|
+
text-align: left;
|
|
35
|
+
pointer-events: none;
|
|
36
|
+
animation: ${fadeIn} 0.1s ease;
|
|
37
|
+
/* A tooltip explaining a mono value usually quotes it; let the quote wrap
|
|
38
|
+
rather than overflow the bubble. */
|
|
39
|
+
overflow-wrap: break-word;
|
|
40
|
+
code, .mono { font-family: ${v.mono}; font-size: 11px; }
|
|
41
|
+
`;
|
|
42
|
+
/** The hoverable span. `display: contents` would lose the hover target. */
|
|
43
|
+
const Anchor = styled.span `
|
|
44
|
+
display: inline-flex;
|
|
45
|
+
min-width: 0;
|
|
46
|
+
max-width: 100%;
|
|
47
|
+
`;
|
|
48
|
+
/** Where the bubble goes, given the anchor and the bubble's own measured box. */
|
|
49
|
+
function place(anchor, box, prefer, align) {
|
|
50
|
+
const gap = 6;
|
|
51
|
+
const above = anchor.top - box.height - gap;
|
|
52
|
+
const below = anchor.bottom + gap;
|
|
53
|
+
// Flip to whichever side has room; prefer the caller's choice when both do.
|
|
54
|
+
const fitsAbove = above >= 8;
|
|
55
|
+
const fitsBelow = below + box.height <= window.innerHeight - 8;
|
|
56
|
+
const top = prefer === "top" ? (fitsAbove || !fitsBelow ? above : below) : fitsBelow || !fitsAbove ? below : above;
|
|
57
|
+
const raw = align === "start" ? anchor.left
|
|
58
|
+
: align === "end" ? anchor.right - box.width
|
|
59
|
+
: anchor.left + anchor.width / 2 - box.width / 2;
|
|
60
|
+
const left = Math.max(8, Math.min(raw, window.innerWidth - box.width - 8));
|
|
61
|
+
return { top: Math.max(8, top), left };
|
|
62
|
+
}
|
|
63
|
+
/**
|
|
64
|
+
* Tooltip: hover or focus the child, get `label` in a themed bubble.
|
|
65
|
+
*
|
|
66
|
+
* Keyboard and assistive tech are first-class — the bubble opens on focus as
|
|
67
|
+
* well as hover, and the anchor is wired to it with `aria-describedby`, so the
|
|
68
|
+
* explanation is announced rather than being a thing only a mouse can find.
|
|
69
|
+
* Escape dismisses it, because a bubble pinned by focus otherwise covers
|
|
70
|
+
* whatever is under it while you read the field it describes.
|
|
71
|
+
*/
|
|
72
|
+
export function Tooltip({ label, children, side = "top", align = "center", width, delay = 180, disabled, style, className }) {
|
|
73
|
+
const id = useId();
|
|
74
|
+
const ref = useRef(null);
|
|
75
|
+
const bubble = useRef(null);
|
|
76
|
+
const timer = useRef(undefined);
|
|
77
|
+
const [anchor, setAnchor] = useState(null);
|
|
78
|
+
const [pos, setPos] = useState(null);
|
|
79
|
+
const close = useCallback(() => {
|
|
80
|
+
window.clearTimeout(timer.current);
|
|
81
|
+
setAnchor(null);
|
|
82
|
+
setPos(null);
|
|
83
|
+
}, []);
|
|
84
|
+
const open = useCallback(() => {
|
|
85
|
+
if (disabled)
|
|
86
|
+
return;
|
|
87
|
+
window.clearTimeout(timer.current);
|
|
88
|
+
const show = () => {
|
|
89
|
+
const rect = ref.current?.getBoundingClientRect();
|
|
90
|
+
if (rect)
|
|
91
|
+
setAnchor(rect);
|
|
92
|
+
};
|
|
93
|
+
if (delay > 0)
|
|
94
|
+
timer.current = window.setTimeout(show, delay);
|
|
95
|
+
else
|
|
96
|
+
show();
|
|
97
|
+
}, [delay, disabled]);
|
|
98
|
+
// Measured once it is in the tree, so a two-line bubble flips above a row at
|
|
99
|
+
// the bottom of the viewport instead of being clipped by it. Rendered at
|
|
100
|
+
// opacity 0 until placed — an unplaced bubble at 0,0 is a visible flicker in
|
|
101
|
+
// the corner of the screen.
|
|
102
|
+
useLayoutEffect(() => {
|
|
103
|
+
if (!anchor)
|
|
104
|
+
return;
|
|
105
|
+
const box = bubble.current?.getBoundingClientRect();
|
|
106
|
+
if (box)
|
|
107
|
+
setPos(place(anchor, box, side, align));
|
|
108
|
+
}, [anchor, side, align]);
|
|
109
|
+
useLayoutEffect(() => {
|
|
110
|
+
if (!anchor)
|
|
111
|
+
return;
|
|
112
|
+
const onKey = (e) => { if (e.key === "Escape")
|
|
113
|
+
close(); };
|
|
114
|
+
// Any scroll moves the anchor out from under the bubble; the cheapest
|
|
115
|
+
// correct answer is to dismiss rather than to track.
|
|
116
|
+
document.addEventListener("keydown", onKey);
|
|
117
|
+
window.addEventListener("scroll", close, true);
|
|
118
|
+
return () => {
|
|
119
|
+
document.removeEventListener("keydown", onKey);
|
|
120
|
+
window.removeEventListener("scroll", close, true);
|
|
121
|
+
};
|
|
122
|
+
}, [anchor, close]);
|
|
123
|
+
useLayoutEffect(() => () => window.clearTimeout(timer.current), []);
|
|
124
|
+
const shown = !disabled && anchor !== null;
|
|
125
|
+
return (_jsxs(_Fragment, { children: [_jsx(Anchor, { ref: ref, style: style, className: className, onMouseEnter: open, onMouseLeave: close, onFocus: open, onBlur: close, "aria-describedby": shown ? id : undefined, children: children }), shown && typeof document !== "undefined"
|
|
126
|
+
? createPortal(_jsx(Bubble, { ref: bubble, id: id, role: "tooltip", "$wide": width, style: pos ? { top: pos.top, left: pos.left } : { top: 0, left: 0, opacity: 0 }, children: label }), document.body)
|
|
127
|
+
: null] }));
|
|
128
|
+
}
|
|
129
|
+
//# sourceMappingURL=Tooltip.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../src/kit/Tooltip.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* The concrete value of one token right now, or `fallback` when it cannot be
|
|
3
|
+
* read (no DOM, or a name the sheet does not define).
|
|
4
|
+
*
|
|
5
|
+
* Prefer {@link useTokenColours} in a component — it re-resolves on a theme
|
|
6
|
+
* change, which this cannot do.
|
|
7
|
+
*/
|
|
8
|
+
export declare function tokenValue(token: string, fallback?: string): string;
|
|
9
|
+
/**
|
|
10
|
+
* Resolve a named set of tokens to concrete colours, re-resolving whenever the
|
|
11
|
+
* resolved theme or the product brand changes.
|
|
12
|
+
*
|
|
13
|
+
* ```ts
|
|
14
|
+
* const paint = useTokenColours({ axis: v.faint, grid: v.line, series: v.cat1 });
|
|
15
|
+
* ctx.strokeStyle = paint.axis; // "#8a8298" in dark, "#6b7080" in light
|
|
16
|
+
* ```
|
|
17
|
+
*
|
|
18
|
+
* The keys are the caller's own vocabulary, so a chart reads `paint.axis`
|
|
19
|
+
* rather than `paint["--x-faint"]`, and swapping which token an axis uses is a
|
|
20
|
+
* one-line change at the top of the component.
|
|
21
|
+
*
|
|
22
|
+
* Values are read from the document, so the first render already has them —
|
|
23
|
+
* a canvas painted in a layout effect gets the right colours on its first
|
|
24
|
+
* frame rather than a black one it repaints a tick later.
|
|
25
|
+
*/
|
|
26
|
+
export declare function useTokenColours<T extends Record<string, string>>(tokens: T): {
|
|
27
|
+
[K in keyof T]: string;
|
|
28
|
+
};
|
|
29
|
+
/**
|
|
30
|
+
* The categorical series tokens in order, as `var()` strings — the palette for
|
|
31
|
+
* a chart whose series are a vocabulary rather than a verdict. Use
|
|
32
|
+
* {@link seriesToken} rather than indexing this directly, so a consumer with
|
|
33
|
+
* more than ten series wraps instead of reading `undefined`.
|
|
34
|
+
*/
|
|
35
|
+
export declare const SERIES_TOKENS: readonly string[];
|
|
36
|
+
/** The nth series' token, wrapping past the tenth. */
|
|
37
|
+
export declare function seriesToken(i: number): string;
|
|
38
|
+
/**
|
|
39
|
+
* The whole categorical palette, resolved — for a chart that assigns colours
|
|
40
|
+
* by index in JS (`stroke: palette[i % palette.length]`).
|
|
41
|
+
*/
|
|
42
|
+
export declare function useSeriesColours(): string[];
|
|
43
|
+
//# sourceMappingURL=paint.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"paint.d.ts","sourceRoot":"","sources":["../../src/theme/paint.ts"],"names":[],"mappings":"AA+BA;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,SAAK,GAAG,MAAM,CAM/D;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,eAAe,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,MAAM;CAAE,CAwBvG;AAED;;;;;GAKG;AACH,eAAO,MAAM,aAAa,EAAE,SAAS,MAAM,EAE1C,CAAC;AAEF,sDAAsD;AACtD,wBAAgB,WAAW,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAG7C;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,IAAI,MAAM,EAAE,CAO3C"}
|
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
import { useLayoutEffect, useMemo, useState } from "react";
|
|
2
|
+
import { useThemeMaybe } from "./ThemeProvider.js";
|
|
3
|
+
import { v } from "./tokens.js";
|
|
4
|
+
// Token values as CONCRETE colours, for the surfaces that cannot use `var()`.
|
|
5
|
+
//
|
|
6
|
+
// Everything the kit draws is CSS, so `${v.faint}` — a `var(--x-faint)` string
|
|
7
|
+
// — is all a styled component ever needs. A `<canvas>` is the exception: uPlot,
|
|
8
|
+
// Chart.js, xterm and anything painting through a 2D context take real colour
|
|
9
|
+
// strings, and handing one `var(--x-faint)` paints nothing at all. The same is
|
|
10
|
+
// true of a charting library configured through JS rather than CSS, and of an
|
|
11
|
+
// SVG attribute written by a library rather than by us.
|
|
12
|
+
//
|
|
13
|
+
// Consoles have been solving that by hardcoding hexes next to their charts,
|
|
14
|
+
// which is how a console ends up with a chart that is unreadable in one of the
|
|
15
|
+
// two themes — the one the author did not have open. This resolves the tokens
|
|
16
|
+
// instead, and re-resolves them when the theme or the product brand changes,
|
|
17
|
+
// so a canvas is as theme-correct as a stylesheet.
|
|
18
|
+
const hasDOM = typeof window !== "undefined" && typeof document !== "undefined";
|
|
19
|
+
/** `var(--x-faint)` | `--x-faint` | `faint` → `--x-faint`. */
|
|
20
|
+
function customProperty(token) {
|
|
21
|
+
const t = token.trim();
|
|
22
|
+
const wrapped = /^var\(\s*(--[a-zA-Z0-9-]+)/.exec(t);
|
|
23
|
+
if (wrapped)
|
|
24
|
+
return wrapped[1];
|
|
25
|
+
if (t.startsWith("--"))
|
|
26
|
+
return t;
|
|
27
|
+
if (/^[a-zA-Z0-9-]+$/.test(t))
|
|
28
|
+
return `--x-${t}`;
|
|
29
|
+
return null;
|
|
30
|
+
}
|
|
31
|
+
/**
|
|
32
|
+
* The concrete value of one token right now, or `fallback` when it cannot be
|
|
33
|
+
* read (no DOM, or a name the sheet does not define).
|
|
34
|
+
*
|
|
35
|
+
* Prefer {@link useTokenColours} in a component — it re-resolves on a theme
|
|
36
|
+
* change, which this cannot do.
|
|
37
|
+
*/
|
|
38
|
+
export function tokenValue(token, fallback = "") {
|
|
39
|
+
if (!hasDOM)
|
|
40
|
+
return fallback;
|
|
41
|
+
const prop = customProperty(token);
|
|
42
|
+
if (!prop)
|
|
43
|
+
return token;
|
|
44
|
+
const value = getComputedStyle(document.documentElement).getPropertyValue(prop).trim();
|
|
45
|
+
return value || fallback;
|
|
46
|
+
}
|
|
47
|
+
/**
|
|
48
|
+
* Resolve a named set of tokens to concrete colours, re-resolving whenever the
|
|
49
|
+
* resolved theme or the product brand changes.
|
|
50
|
+
*
|
|
51
|
+
* ```ts
|
|
52
|
+
* const paint = useTokenColours({ axis: v.faint, grid: v.line, series: v.cat1 });
|
|
53
|
+
* ctx.strokeStyle = paint.axis; // "#8a8298" in dark, "#6b7080" in light
|
|
54
|
+
* ```
|
|
55
|
+
*
|
|
56
|
+
* The keys are the caller's own vocabulary, so a chart reads `paint.axis`
|
|
57
|
+
* rather than `paint["--x-faint"]`, and swapping which token an axis uses is a
|
|
58
|
+
* one-line change at the top of the component.
|
|
59
|
+
*
|
|
60
|
+
* Values are read from the document, so the first render already has them —
|
|
61
|
+
* a canvas painted in a layout effect gets the right colours on its first
|
|
62
|
+
* frame rather than a black one it repaints a tick later.
|
|
63
|
+
*/
|
|
64
|
+
export function useTokenColours(tokens) {
|
|
65
|
+
const theme = useThemeMaybe();
|
|
66
|
+
// The resolved scheme and the brand are the only two things that move the
|
|
67
|
+
// sheet under us. `pref` is deliberately not a dependency: "system" resolves
|
|
68
|
+
// through `resolved` already.
|
|
69
|
+
const key = `${theme?.resolved ?? ""}|${theme?.brand ?? ""}`;
|
|
70
|
+
// Identity of the token map matters, not its reference: a caller writing the
|
|
71
|
+
// object inline (the normal case) must not re-resolve on every render.
|
|
72
|
+
const spec = useMemo(() => tokens, [JSON.stringify(tokens)]); // eslint-disable-line react-hooks/exhaustive-deps
|
|
73
|
+
const resolve = () => {
|
|
74
|
+
const out = {};
|
|
75
|
+
for (const k of Object.keys(spec))
|
|
76
|
+
out[k] = tokenValue(spec[k]);
|
|
77
|
+
return out;
|
|
78
|
+
};
|
|
79
|
+
const [values, setValues] = useState(resolve);
|
|
80
|
+
useLayoutEffect(() => {
|
|
81
|
+
setValues(resolve());
|
|
82
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
83
|
+
}, [key, spec]);
|
|
84
|
+
return values;
|
|
85
|
+
}
|
|
86
|
+
/**
|
|
87
|
+
* The categorical series tokens in order, as `var()` strings — the palette for
|
|
88
|
+
* a chart whose series are a vocabulary rather than a verdict. Use
|
|
89
|
+
* {@link seriesToken} rather than indexing this directly, so a consumer with
|
|
90
|
+
* more than ten series wraps instead of reading `undefined`.
|
|
91
|
+
*/
|
|
92
|
+
export const SERIES_TOKENS = [
|
|
93
|
+
v.cat1, v.cat2, v.cat3, v.cat4, v.cat5, v.cat6, v.cat7, v.cat8, v.cat9, v.cat10,
|
|
94
|
+
];
|
|
95
|
+
/** The nth series' token, wrapping past the tenth. */
|
|
96
|
+
export function seriesToken(i) {
|
|
97
|
+
const n = SERIES_TOKENS.length;
|
|
98
|
+
return SERIES_TOKENS[((i % n) + n) % n];
|
|
99
|
+
}
|
|
100
|
+
/**
|
|
101
|
+
* The whole categorical palette, resolved — for a chart that assigns colours
|
|
102
|
+
* by index in JS (`stroke: palette[i % palette.length]`).
|
|
103
|
+
*/
|
|
104
|
+
export function useSeriesColours() {
|
|
105
|
+
const spec = useMemo(() => Object.fromEntries(SERIES_TOKENS.map((t, i) => [`c${i}`, t])), []);
|
|
106
|
+
const resolved = useTokenColours(spec);
|
|
107
|
+
return useMemo(() => SERIES_TOKENS.map((_, i) => resolved[`c${i}`] ?? ""), [resolved]);
|
|
108
|
+
}
|
|
109
|
+
//# sourceMappingURL=paint.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"paint.js","sourceRoot":"","sources":["../../src/theme/paint.ts"],"names":[],"mappings":"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"}
|
package/dist/theme/tokens.d.ts
CHANGED
|
@@ -52,6 +52,16 @@ export declare const v: {
|
|
|
52
52
|
runningBg: string;
|
|
53
53
|
data: string;
|
|
54
54
|
dataBg: string;
|
|
55
|
+
cat1: string;
|
|
56
|
+
cat2: string;
|
|
57
|
+
cat3: string;
|
|
58
|
+
cat4: string;
|
|
59
|
+
cat5: string;
|
|
60
|
+
cat6: string;
|
|
61
|
+
cat7: string;
|
|
62
|
+
cat8: string;
|
|
63
|
+
cat9: string;
|
|
64
|
+
cat10: string;
|
|
55
65
|
logBg: string;
|
|
56
66
|
logText: string;
|
|
57
67
|
logDim: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../src/theme/tokens.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,KAAK;;;;;;CAMjB,CAAC;AAEF,eAAO,MAAM,IAAI,QAAwF,CAAC;AAC1G,eAAO,MAAM,OAAO,QAAuF,CAAC;AAG5G,wBAAgB,YAAY,IAAI,MAAM,
|
|
1
|
+
{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../src/theme/tokens.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,KAAK;;;;;;CAMjB,CAAC;AAEF,eAAO,MAAM,IAAI,QAAwF,CAAC;AAC1G,eAAO,MAAM,OAAO,QAAuF,CAAC;AAG5G,wBAAgB,YAAY,IAAI,MAAM,CAiMrC;AA4BD,eAAO,MAAM,CAAC,EAAkB;IAC9B,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAC;IAC7D,OAAO,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAC;IACpF,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IACtG,MAAM,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAC;IAC/E,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IACxE,KAAK,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAC7E,MAAM,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAC;IACrE,OAAO,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IACjE,OAAO,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAC;IACnC,IAAI,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAC7B,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IACrE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IACtE,KAAK,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAC/D,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;CAC9F,CAAC;AAQF,wBAAgB,SAAS,IAAI,MAAM,CAwClC"}
|
package/dist/theme/tokens.js
CHANGED
|
@@ -84,6 +84,28 @@ export function cssVariables() {
|
|
|
84
84
|
brand violet nor a verdict. */
|
|
85
85
|
--x-data: #7cc2ff;
|
|
86
86
|
--x-data-bg: rgba(124, 194, 255, 0.14);
|
|
87
|
+
/* Categorical series palette: ten hues for charts whose series are a
|
|
88
|
+
*vocabulary* rather than a verdict — one line per service version, one
|
|
89
|
+
bar per severity band, one colour per span-emitting service. The status
|
|
90
|
+
tones cannot do this job (there are four of them and three mean
|
|
91
|
+
"something is wrong"), and the brand family cannot either, because every
|
|
92
|
+
series would then be the chrome's own colour. Beyond ten a legend stops
|
|
93
|
+
helping and the chart wants a group-by with smaller cardinality, so a
|
|
94
|
+
consumer wraps rather than extending this list.
|
|
95
|
+
|
|
96
|
+
Dark gets light, low-chroma hues; light gets dark, high-chroma ones. Both
|
|
97
|
+
sets are ordered so the first few stay distinguishable to the most common
|
|
98
|
+
forms of colour blindness (blue → pink → green → amber → violet). */
|
|
99
|
+
--x-cat-1: #7cc2ff;
|
|
100
|
+
--x-cat-2: #f59ec8;
|
|
101
|
+
--x-cat-3: #5fd69a;
|
|
102
|
+
--x-cat-4: #ffc46b;
|
|
103
|
+
--x-cat-5: #b89cff;
|
|
104
|
+
--x-cat-6: #ff9f6b;
|
|
105
|
+
--x-cat-7: #5fd2d6;
|
|
106
|
+
--x-cat-8: #e49bf0;
|
|
107
|
+
--x-cat-9: #b5dc6b;
|
|
108
|
+
--x-cat-10: #ff8f8f;
|
|
87
109
|
--x-log-bg: #100d17;
|
|
88
110
|
--x-log-text: #c6bad8;
|
|
89
111
|
--x-log-dim: #6f6585;
|
|
@@ -123,6 +145,16 @@ export function cssVariables() {
|
|
|
123
145
|
--x-running-bg: rgba(155, 62, 228, 0.10);
|
|
124
146
|
--x-data: #1d6bb8;
|
|
125
147
|
--x-data-bg: rgba(29, 107, 184, 0.10);
|
|
148
|
+
--x-cat-1: #1d6bb8;
|
|
149
|
+
--x-cat-2: #b5327c;
|
|
150
|
+
--x-cat-3: #1f8a5c;
|
|
151
|
+
--x-cat-4: #a6690a;
|
|
152
|
+
--x-cat-5: #6b3fd4;
|
|
153
|
+
--x-cat-6: #c25410;
|
|
154
|
+
--x-cat-7: #0f7f85;
|
|
155
|
+
--x-cat-8: #9b2fb0;
|
|
156
|
+
--x-cat-9: #5f7a16;
|
|
157
|
+
--x-cat-10: #c0362f;
|
|
126
158
|
--x-log-bg: #100d17;
|
|
127
159
|
--x-log-text: #c6bad8;
|
|
128
160
|
--x-log-dim: #6f6585;
|
|
@@ -162,6 +194,16 @@ export function cssVariables() {
|
|
|
162
194
|
--x-running-bg: rgba(155, 62, 228, 0.10);
|
|
163
195
|
--x-data: #1d6bb8;
|
|
164
196
|
--x-data-bg: rgba(29, 107, 184, 0.10);
|
|
197
|
+
--x-cat-1: #1d6bb8;
|
|
198
|
+
--x-cat-2: #b5327c;
|
|
199
|
+
--x-cat-3: #1f8a5c;
|
|
200
|
+
--x-cat-4: #a6690a;
|
|
201
|
+
--x-cat-5: #6b3fd4;
|
|
202
|
+
--x-cat-6: #c25410;
|
|
203
|
+
--x-cat-7: #0f7f85;
|
|
204
|
+
--x-cat-8: #9b2fb0;
|
|
205
|
+
--x-cat-9: #5f7a16;
|
|
206
|
+
--x-cat-10: #c0362f;
|
|
165
207
|
--x-log-bg: #100d17;
|
|
166
208
|
--x-log-text: #c6bad8;
|
|
167
209
|
--x-log-dim: #6f6585;
|
|
@@ -180,6 +222,7 @@ const names = [
|
|
|
180
222
|
"danger", "danger-bg", "success", "success-bg", "warning", "warning-bg", "info", "info-bg",
|
|
181
223
|
"running", "running-bg",
|
|
182
224
|
"data", "data-bg",
|
|
225
|
+
"cat-1", "cat-2", "cat-3", "cat-4", "cat-5", "cat-6", "cat-7", "cat-8", "cat-9", "cat-10",
|
|
183
226
|
"log-bg", "log-text", "log-dim", "term-bg",
|
|
184
227
|
"z-nav", "z-pop", "z-scrim", "z-modal", "z-palette", "z-toast",
|
|
185
228
|
];
|
package/dist/theme/tokens.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tokens.js","sourceRoot":"","sources":["../../src/theme/tokens.ts"],"names":[],"mappings":"AAAA,8EAA8E;AAC9E,gFAAgF;AAChF,+EAA+E;AAC/E,iCAAiC;AACjC,EAAE;AACF,kFAAkF;AAClF,kFAAkF;AAClF,gFAAgF;AAChF,yCAAyC;AAEzC,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,OAAO,EAAE,SAAS;IAClB,EAAE,EAAE,SAAS;IACb,EAAE,EAAE,SAAS;IACb,EAAE,EAAE,SAAS;IACb,EAAE,EAAE,SAAS;CACd,CAAC;AAEF,MAAM,CAAC,MAAM,IAAI,GAAG,2BAA2B,KAAK,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,SAAS,KAAK,CAAC,EAAE,SAAS,KAAK,CAAC,EAAE,GAAG,CAAC;AAC1G,MAAM,CAAC,MAAM,OAAO,GAAG,0BAA0B,KAAK,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,SAAS,KAAK,CAAC,EAAE,SAAS,KAAK,CAAC,EAAE,GAAG,CAAC;AAE5G,iEAAiE;AACjE,MAAM,UAAU,YAAY;IAC1B,OAAO;;eAEM,KAAK,CAAC,OAAO;YAChB,KAAK,CAAC,EAAE,aAAa,KAAK,CAAC,EAAE,aAAa,KAAK,CAAC,EAAE,aAAa,KAAK,CAAC,EAAE;cACrE,IAAI;iBACD,OAAO
|
|
1
|
+
{"version":3,"file":"tokens.js","sourceRoot":"","sources":["../../src/theme/tokens.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED