@actioneer/ads 0.8.0 → 1.0.1
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/DESIGN.md +31 -31
- package/components/assistant-ui/attachment.js +1 -1
- package/components/assistant-ui/composer-harness.js +5 -4
- package/components/assistant-ui/directive-text.js +5 -5
- package/components/assistant-ui/markdown-text.js +7 -7
- package/components/assistant-ui/sources.js +1 -1
- package/components/avatar.d.ts +1 -1
- package/components/avatar.js +1 -1
- package/components/body-page-header.d.ts +1 -1
- package/components/body-page-header.js +1 -1
- package/components/chart.js +1 -1
- package/components/index.d.ts +1 -0
- package/components/index.js +466 -464
- package/components/infinite-canvas.js +1 -1
- package/components/modal.js +1 -1
- package/components/page-header.js +1 -1
- package/components/search-disclosure.d.ts +18 -0
- package/components/search-disclosure.js +106 -0
- package/components/sidebar.js +16 -9
- package/components/table.d.ts +1 -1
- package/components/table.js +278 -262
- package/components/tabs.js +69 -60
- package/components/typography.d.ts +1 -1
- package/components/typography.js +1 -1
- package/components/ui/button.d.ts +1 -1
- package/components/ui/dialog.js +1 -1
- package/components/viz-charts.js +36 -36
- package/demo/components/add-to-artifact.js +3 -2
- package/lib/cn.js +7 -7
- package/lib/icons.d.ts +4 -0
- package/lib/icons.js +108 -107
- package/llms.txt +3 -1
- package/manifest.json +57 -21
- package/package.json +1 -1
- package/styles.css +47 -34
- package/theme.css +45 -32
package/lib/icons.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx as h } from "react/jsx-runtime";
|
|
3
3
|
import * as C from "react";
|
|
4
|
-
import { Code as g, Check as p, Copy as u, FileText as $, X as d, UploadSimple as S, EyeSlash as k, Eye as f, Minus as w, Plus as T, CaretDown as
|
|
4
|
+
import { Code as g, Check as p, Copy as u, FileText as $, X as d, UploadSimple as S, EyeSlash as k, Eye as P, MagnifyingGlass as f, Minus as w, Plus as T, CaretDown as A, Info as L, WarningCircle as m, Warning as y, CheckCircle as B, CaretUp as U, ArrowsDownUp as x, ChatCircle as I, ArrowUpRight as M, Clock as D, Database as O, ArrowSquareOut as F, Table as b, CaretLeft as R, CaretRight as v, CornersOut as H, Magnet as G, Tray as W, ArrowLeft as E, DotsThree as z, User as V, XCircle as N, CircleDashed as Q, ArrowsClockwise as q, Paperclip as X, Quotes as j, At as J, Lightning as K, Sparkle as Y, File as Z, DownloadSimple as _, Image as n, BracketsCurly as ee, MusicNotes as oe, VideoCamera as te, ImageBroken as ne, Pulse as se, Archive as ae, ArrowDown as re, ArrowRight as ce, ArrowUp as le, Scroll as ie, Bell as he, Stack as Ce, BookOpen as ge, Brain as pe, CalendarBlank as ue, Phone as $e, ListChecks as de, Cube as Se, DotsNine as ke, FunnelSimple as Pe, Folder as fe, FolderOpen as we, Gauge as Te, GitBranch as Ae, Hash as Le, ClockCounterClockwise as me, House as ye, SquaresFour as Be, Leaf as Ue, Lightbulb as xe, Link as Ie, CircleNotch as Me, SignOut as De, Envelope as Oe, Microphone as Fe, MicrophoneSlash as be, DotsThreeVertical as Re, Palette as ve, SidebarSimple as He, Pause as Ge, PencilSimple as We, PhoneIncoming as Ee, PhoneSlash as ze, ChartPie as Ve, Play as Ne, Plug as Qe, Presentation as qe, Rocket as Xe, Gear as je, Shapes as Je, ShareNetwork as Ke, Star as Ye, Stop as Ze, ArrowsLeftRight as _e, Target as eo, Binoculars as oo, TextB as to, TextT as no, TextItalic as so, TextStrikethrough as ao, TextUnderline as ro, ToggleRight as co, Trash as lo, Users as io, Wrench as ho } from "@phosphor-icons/react";
|
|
5
5
|
function e(s, a) {
|
|
6
6
|
const o = C.forwardRef(function({ strokeWidth: t, weight: r, ...c }, l) {
|
|
7
7
|
const i = r ?? (t != null && t >= 2 ? "bold" : "regular");
|
|
@@ -9,114 +9,115 @@ function e(s, a) {
|
|
|
9
9
|
});
|
|
10
10
|
return o.displayName = a, o;
|
|
11
11
|
}
|
|
12
|
-
const
|
|
12
|
+
const uo = e(re, "ArrowDown"), $o = e(E, "ArrowLeft"), So = e(ce, "ArrowRight"), ko = e(le, "ArrowUp"), Po = e(M, "ArrowUpRight"), fo = e(A, "ChevronDown"), wo = e(R, "ChevronLeft"), To = e(v, "ChevronRight"), Ao = e(U, "ChevronUp"), Lo = e(x, "SortIcon"), mo = e(_e, "SwapHorizontal"), yo = e(F, "ExternalLink"), Bo = e(He, "PanelLeft"), Uo = e(J, "At"), xo = e($e, "Call"), Io = e(Ee, "PhoneIncoming"), Mo = e(d, "Close"), Do = e(N, "CloseCircle"), Oo = e(u, "Copy"), Fo = e(_, "Download"), bo = e(De, "LogOut"), Ro = e(Fe, "Mic"), vo = e(be, "MicOff"), Ho = e(ze, "PhoneOff"), Go = e(We, "Pencil"), Wo = e(j, "Quote"), Eo = e(P, "Eye"), zo = e(k, "EyeOff"), Vo = e(Le, "Hash"), No = e(n, "ImageUpload"), Qo = e(S, "Upload"), qo = e(no, "TextFont"), Xo = e(to, "TextBold"), jo = e(so, "TextItalicStyle"), Jo = e(ao, "TextStrike"), Ko = e(ro, "TextUnderlineStyle"), Yo = e(co, "ToggleOn"), Zo = e(ue, "Calendar"), _o = e(D, "Clock"), et = e(g, "Code"), ot = e(Ze, "Stop"), tt = e(G, "Magnet"), nt = e(H, "Maximize"), st = e(w, "Minus"), at = e(z, "MoreHorizontal"), rt = e(Re, "MoreVertical"), ct = e(ke, "DragHandle"), lt = e(Ie, "Link"), it = e(T, "Plus"), ht = e(q, "Refresh"), Ct = e(ie, "AuditTrail"), gt = e(f, "Search"), pt = e(Ke, "Share"), ut = e(lo, "Trash"), $t = e(p, "Check"), dt = e(Me, "Loader"), St = e(B, "CheckCircle"), kt = e(L, "Info"), Pt = e(y, "Warning"), ft = e(he, "Bell"), wt = e(m, "WarningCircle"), Tt = e(se, "Activity"), At = e(I, "AgentChat"), Lt = e(K, "Bolt"), mt = e(ge, "BookOpen"), yt = e(pe, "Brain"), Bt = e(de, "CheckList"), Ut = e(Se, "Component"), xt = e(O, "Database"), It = e(b, "Table"), Mt = e(Pe, "Filter"), Dt = e(ae, "Archive"), Ot = e(Z, "File"), Ft = e($, "FileText"), bt = e(fe, "Folder"), Rt = e(n, "Image"), vt = e(ne, "ImageOff"), Ht = e(oe, "Music"), Gt = e(te, "Video"), Wt = e(ee, "Braces"), Et = e(we, "FolderOpen"), zt = e(Te, "Gauge"), Vt = e(Ae, "GitBranch"), Nt = e(me, "HistoryClock"), Qt = e(ye, "Home"), qt = e(Ce, "Blocks"), Xt = e(W, "Inbox"), jt = e(xe, "Lightbulb"), Jt = e(Ue, "Leaf"), Kt = e(Be, "LayoutGrid"), Yt = e(Oe, "Mail"), Zt = e(ve, "Palette"), _t = e(Ve, "PieChart"), en = e(Qe, "Plug"), on = e(Xe, "Rocket"), tn = e(je, "Settings"), nn = e(Je, "Shapes"), sn = e(Y, "Sparkles"), an = e(Ye, "Star"), rn = e(oo, "Telescope"), cn = e(eo, "Target"), ln = e(V, "User"), hn = e(io, "Users"), Cn = e(Ne, "Play"), gn = e(qe, "Presentation"), pn = e(Ge, "Pause"), un = e(X, "Paperclip"), $n = e(Q, "CircleDashed"), dn = e(ho, "Wrench");
|
|
13
13
|
export {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
14
|
+
Tt as Activity,
|
|
15
|
+
At as AgentChat,
|
|
16
|
+
Dt as Archive,
|
|
17
|
+
uo as ArrowDown,
|
|
18
|
+
$o as ArrowLeft,
|
|
19
|
+
So as ArrowRight,
|
|
20
|
+
ko as ArrowUp,
|
|
21
|
+
Po as ArrowUpRight,
|
|
22
|
+
Uo as At,
|
|
23
|
+
Ct as AuditTrail,
|
|
24
|
+
ft as Bell,
|
|
25
|
+
qt as Blocks,
|
|
26
|
+
Lt as Bolt,
|
|
27
|
+
mt as BookOpen,
|
|
28
|
+
Wt as Braces,
|
|
29
|
+
yt as Brain,
|
|
30
|
+
Zo as Calendar,
|
|
31
|
+
xo as Call,
|
|
32
|
+
$t as Check,
|
|
33
|
+
St as CheckCircle,
|
|
34
|
+
Bt as CheckList,
|
|
35
35
|
fo as ChevronDown,
|
|
36
36
|
wo as ChevronLeft,
|
|
37
37
|
To as ChevronRight,
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
qo as
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
38
|
+
Ao as ChevronUp,
|
|
39
|
+
$n as CircleDashed,
|
|
40
|
+
_o as Clock,
|
|
41
|
+
Mo as Close,
|
|
42
|
+
Do as CloseCircle,
|
|
43
|
+
et as Code,
|
|
44
|
+
Ut as Component,
|
|
45
|
+
Oo as Copy,
|
|
46
|
+
xt as Database,
|
|
47
|
+
Fo as Download,
|
|
48
|
+
ct as DragHandle,
|
|
49
|
+
yo as ExternalLink,
|
|
50
|
+
Eo as Eye,
|
|
51
|
+
zo as EyeOff,
|
|
52
|
+
Ot as File,
|
|
53
|
+
Ft as FileText,
|
|
54
|
+
Mt as Filter,
|
|
55
|
+
bt as Folder,
|
|
56
|
+
Et as FolderOpen,
|
|
57
|
+
zt as Gauge,
|
|
58
|
+
Vt as GitBranch,
|
|
59
|
+
Vo as Hash,
|
|
60
|
+
Nt as HistoryClock,
|
|
61
|
+
Qt as Home,
|
|
62
|
+
Rt as Image,
|
|
63
|
+
vt as ImageOff,
|
|
64
|
+
No as ImageUpload,
|
|
65
|
+
Xt as Inbox,
|
|
66
|
+
kt as Info,
|
|
67
|
+
Kt as LayoutGrid,
|
|
68
|
+
Jt as Leaf,
|
|
69
|
+
jt as Lightbulb,
|
|
70
|
+
lt as Link,
|
|
71
|
+
dt as Loader,
|
|
72
|
+
bo as LogOut,
|
|
73
|
+
tt as Magnet,
|
|
74
|
+
Yt as Mail,
|
|
75
|
+
nt as Maximize,
|
|
76
|
+
Ro as Mic,
|
|
77
|
+
vo as MicOff,
|
|
78
|
+
st as Minus,
|
|
79
|
+
at as MoreHorizontal,
|
|
80
|
+
rt as MoreVertical,
|
|
81
|
+
Ht as Music,
|
|
82
|
+
Zt as Palette,
|
|
83
|
+
Bo as PanelLeft,
|
|
84
|
+
un as Paperclip,
|
|
85
|
+
pn as Pause,
|
|
86
|
+
Go as Pencil,
|
|
87
|
+
Io as PhoneIncoming,
|
|
88
|
+
Ho as PhoneOff,
|
|
89
|
+
_t as PieChart,
|
|
90
|
+
Cn as Play,
|
|
91
|
+
en as Plug,
|
|
92
|
+
it as Plus,
|
|
93
|
+
gn as Presentation,
|
|
94
|
+
Wo as Quote,
|
|
95
|
+
ht as Refresh,
|
|
96
|
+
on as Rocket,
|
|
97
|
+
gt as Search,
|
|
98
|
+
tn as Settings,
|
|
99
|
+
nn as Shapes,
|
|
100
|
+
pt as Share,
|
|
101
|
+
Lo as SortIcon,
|
|
102
|
+
sn as Sparkles,
|
|
103
|
+
an as Star,
|
|
104
|
+
ot as Stop,
|
|
105
|
+
mo as SwapHorizontal,
|
|
106
|
+
It as Table,
|
|
107
|
+
cn as Target,
|
|
108
|
+
rn as Telescope,
|
|
109
|
+
Xo as TextBold,
|
|
110
|
+
qo as TextFont,
|
|
111
|
+
jo as TextItalicStyle,
|
|
112
|
+
Jo as TextStrike,
|
|
113
|
+
Ko as TextUnderlineStyle,
|
|
114
|
+
Yo as ToggleOn,
|
|
115
|
+
ut as Trash,
|
|
116
|
+
Qo as Upload,
|
|
117
|
+
ln as User,
|
|
118
|
+
hn as Users,
|
|
119
|
+
Gt as Video,
|
|
120
|
+
Pt as Warning,
|
|
121
|
+
wt as WarningCircle,
|
|
122
|
+
dn as Wrench
|
|
122
123
|
};
|
package/llms.txt
CHANGED
|
@@ -311,6 +311,7 @@ Before using any component below, preserve its built-in motion and apply the mot
|
|
|
311
311
|
- [NumberField] — Use for a bounded numeric quantity (e.g. seats, width, count) that benefits from stepper buttons and min/max clamping, not free-form numeric text entry. [docs](https://ads.actioneer.dev/#/number-field)
|
|
312
312
|
- [Radio] — Use for choosing exactly one option from a small, fully visible set — wrap Radio options in a RadioGroup that owns the shared name and controlled value. [docs](https://ads.actioneer.dev/#/radio)
|
|
313
313
|
- [RadioGroup] — component [docs](https://ads.actioneer.dev/#/radio)
|
|
314
|
+
- [SearchDisclosure] — component [docs](https://ads.actioneer.dev/#/search-disclosure)
|
|
314
315
|
- [SegmentedControl] — Use for a small set (2-4) of mutually exclusive, always-visible options — like a range or view-mode switcher — not for navigation or long lists. Radius follows control size: 4px at sm and 6px at md/lg; tracks and options are never fully rounded. (variants: size: sm|md|lg; selected: true|false) [docs](https://ads.actioneer.dev/#/segmented)
|
|
315
316
|
- [Select] — Use for a single choice from a closed list of options in a form, especially when pairing with Field for a labeled control. (variants: size: sm|md|lg) [docs](https://ads.actioneer.dev/#/select)
|
|
316
317
|
- [Slider] — Use for a single controlled numeric value picked from a bounded range (volume, brightness, threshold) — pair with Field or Label/Text for an accessible, labeled control. [docs](https://ads.actioneer.dev/#/slider)
|
|
@@ -328,6 +329,7 @@ Before using any component below, preserve its built-in motion and apply the mot
|
|
|
328
329
|
- [NumberFieldProps] — TypeScript type
|
|
329
330
|
- [RadioGroupProps] — TypeScript type
|
|
330
331
|
- [RadioProps] — TypeScript type
|
|
332
|
+
- [SearchDisclosureProps] — TypeScript type
|
|
331
333
|
- [SegmentedControlProps] — TypeScript type
|
|
332
334
|
- [SegmentedOption] — TypeScript type
|
|
333
335
|
- [SelectItem] — TypeScript type
|
|
@@ -454,7 +456,7 @@ Before using any component below, preserve its built-in motion and apply the mot
|
|
|
454
456
|
- [SeriesChart] — component [docs](https://ads.actioneer.dev/#/viz-charts)
|
|
455
457
|
- [StatusAnswer] — component (variants: tone: default|primary|success|warning|danger|info) [docs](https://ads.actioneer.dev/#/ai/answer)
|
|
456
458
|
- [Tab] — component (variants: orientation: horizontal|vertical; selected: true|false) [docs](https://ads.actioneer.dev/#/tabs)
|
|
457
|
-
- [Table] — Use Table for structured tabular data that may need row selection, column sorting, sticky columns, or a paginated footer — not for simple key-value lists. Every primary body-cell value defaults to text-m (
|
|
459
|
+
- [Table] — Use Table for structured tabular data that may need row selection, column sorting, sticky columns, or a paginated footer — not for simple key-value lists. Every primary body-cell value defaults to text-m (14px / 20px); only clearly secondary metadata inside a cell may opt down to text-s. Give a whole-row action an onClick and aria-label: TableRow then adds hover/focus feedback, a pointer cursor, and Enter/Space activation. The consumer decides whether that action navigates or opens a panel; TableRow owns neither destination. Display-only rows stay static; selection rows toggle when clicked. Keep normal row geometry without a brand tint or hover-only corner rounding. Nested controls keep their own actions. Primary record links stay text-only in every state: never reveal an arrow, chevron, or other directional icon only on hover. Persistent row actions use a final sticky-right column plus elevatedActionColumn so one body-column shadow lifts the action surface instead of repeating on individual cells. The empty matching header cell remains transparent and non-sticky. [docs](https://ads.actioneer.dev/#/table)
|
|
458
460
|
- [TableAnswer] — component (variants: tone: default|primary|success|warning|danger|info) [docs](https://ads.actioneer.dev/#/ai/answer)
|
|
459
461
|
- [TableBody] — component [docs](https://ads.actioneer.dev/#/table)
|
|
460
462
|
- [TableCell] — component [docs](https://ads.actioneer.dev/#/table)
|
package/manifest.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@actioneer/ads",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "1.0.1",
|
|
4
4
|
"importPath": "@actioneer/ads",
|
|
5
5
|
"styleImport": "@import \"@actioneer/ads/styles.css\";",
|
|
6
6
|
"families": [
|
|
@@ -16,9 +16,9 @@
|
|
|
16
16
|
"Chat"
|
|
17
17
|
],
|
|
18
18
|
"counts": {
|
|
19
|
-
"total":
|
|
20
|
-
"component":
|
|
21
|
-
"type":
|
|
19
|
+
"total": 742,
|
|
20
|
+
"component": 323,
|
|
21
|
+
"type": 311,
|
|
22
22
|
"hook": 10,
|
|
23
23
|
"util": 98
|
|
24
24
|
},
|
|
@@ -1530,6 +1530,24 @@
|
|
|
1530
1530
|
"disabled"
|
|
1531
1531
|
]
|
|
1532
1532
|
},
|
|
1533
|
+
{
|
|
1534
|
+
"name": "SearchDisclosure",
|
|
1535
|
+
"family": "Form controls",
|
|
1536
|
+
"kind": "component",
|
|
1537
|
+
"importPath": "@actioneer/ads",
|
|
1538
|
+
"module": "search-disclosure",
|
|
1539
|
+
"showcaseUrl": "https://ads.actioneer.dev/#/search-disclosure",
|
|
1540
|
+
"props": [
|
|
1541
|
+
"value",
|
|
1542
|
+
"onValueChange",
|
|
1543
|
+
"open",
|
|
1544
|
+
"defaultOpen",
|
|
1545
|
+
"onOpenChange",
|
|
1546
|
+
"placeholder",
|
|
1547
|
+
"inputLabel",
|
|
1548
|
+
"triggerLabel"
|
|
1549
|
+
]
|
|
1550
|
+
},
|
|
1533
1551
|
{
|
|
1534
1552
|
"name": "SegmentedControl",
|
|
1535
1553
|
"family": "Form controls",
|
|
@@ -1728,6 +1746,13 @@
|
|
|
1728
1746
|
"importPath": "@actioneer/ads",
|
|
1729
1747
|
"module": "radio"
|
|
1730
1748
|
},
|
|
1749
|
+
{
|
|
1750
|
+
"name": "SearchDisclosureProps",
|
|
1751
|
+
"family": "Form controls",
|
|
1752
|
+
"kind": "type",
|
|
1753
|
+
"importPath": "@actioneer/ads",
|
|
1754
|
+
"module": "search-disclosure"
|
|
1755
|
+
},
|
|
1731
1756
|
{
|
|
1732
1757
|
"name": "SegmentedControlProps",
|
|
1733
1758
|
"family": "Form controls",
|
|
@@ -3588,7 +3613,7 @@
|
|
|
3588
3613
|
"kind": "component",
|
|
3589
3614
|
"importPath": "@actioneer/ads",
|
|
3590
3615
|
"module": "table",
|
|
3591
|
-
"description": "Use Table for structured tabular data that may need row selection, column sorting, sticky columns, or a paginated footer — not for simple key-value lists. Every primary body-cell value defaults to text-m (
|
|
3616
|
+
"description": "Use Table for structured tabular data that may need row selection, column sorting, sticky columns, or a paginated footer — not for simple key-value lists. Every primary body-cell value defaults to text-m (14px / 20px); only clearly secondary metadata inside a cell may opt down to text-s. Give a whole-row action an onClick and aria-label: TableRow then adds hover/focus feedback, a pointer cursor, and Enter/Space activation. The consumer decides whether that action navigates or opens a panel; TableRow owns neither destination. Display-only rows stay static; selection rows toggle when clicked. Keep normal row geometry without a brand tint or hover-only corner rounding. Nested controls keep their own actions. Primary record links stay text-only in every state: never reveal an arrow, chevron, or other directional icon only on hover. Persistent row actions use a final sticky-right column plus elevatedActionColumn so one body-column shadow lifts the action surface instead of repeating on individual cells. The empty matching header cell remains transparent and non-sticky.",
|
|
3592
3617
|
"showcaseUrl": "https://ads.actioneer.dev/#/table",
|
|
3593
3618
|
"props": [
|
|
3594
3619
|
"wrapperClassName",
|
|
@@ -8358,39 +8383,39 @@
|
|
|
8358
8383
|
"typography": {
|
|
8359
8384
|
"display": {
|
|
8360
8385
|
"fontFamily": "\"Aribau Grotesk\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif",
|
|
8361
|
-
"fontSize": "
|
|
8386
|
+
"fontSize": "24px",
|
|
8362
8387
|
"fontWeight": 500,
|
|
8363
|
-
"lineHeight": "
|
|
8388
|
+
"lineHeight": "32px"
|
|
8364
8389
|
},
|
|
8365
8390
|
"title": {
|
|
8366
8391
|
"fontFamily": "\"Aribau Grotesk\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif",
|
|
8367
|
-
"fontSize": "
|
|
8392
|
+
"fontSize": "18px",
|
|
8368
8393
|
"fontWeight": 500,
|
|
8369
|
-
"lineHeight": "
|
|
8394
|
+
"lineHeight": "24px"
|
|
8370
8395
|
},
|
|
8371
8396
|
"headline": {
|
|
8372
8397
|
"fontFamily": "\"Aribau Grotesk\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif",
|
|
8373
|
-
"fontSize": "
|
|
8398
|
+
"fontSize": "16px",
|
|
8374
8399
|
"fontWeight": 500,
|
|
8375
|
-
"lineHeight": "
|
|
8400
|
+
"lineHeight": "22px"
|
|
8376
8401
|
},
|
|
8377
8402
|
"body": {
|
|
8378
8403
|
"fontFamily": "\"Aribau Grotesk\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif",
|
|
8379
|
-
"fontSize": "
|
|
8404
|
+
"fontSize": "14px",
|
|
8380
8405
|
"fontWeight": 400,
|
|
8381
|
-
"lineHeight": "
|
|
8406
|
+
"lineHeight": "20px"
|
|
8382
8407
|
},
|
|
8383
8408
|
"label": {
|
|
8384
8409
|
"fontFamily": "\"Aribau Grotesk\", ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif",
|
|
8385
|
-
"fontSize": "
|
|
8410
|
+
"fontSize": "12px",
|
|
8386
8411
|
"fontWeight": 400,
|
|
8387
|
-
"lineHeight": "
|
|
8412
|
+
"lineHeight": "16px"
|
|
8388
8413
|
},
|
|
8389
8414
|
"mono": {
|
|
8390
8415
|
"fontFamily": "\"JetBrains Mono Variable\", ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", \"Courier New\", monospace",
|
|
8391
|
-
"fontSize": "
|
|
8416
|
+
"fontSize": "12px",
|
|
8392
8417
|
"fontWeight": 400,
|
|
8393
|
-
"lineHeight": "
|
|
8418
|
+
"lineHeight": "16px"
|
|
8394
8419
|
}
|
|
8395
8420
|
},
|
|
8396
8421
|
"radius": {
|
|
@@ -8398,7 +8423,7 @@
|
|
|
8398
8423
|
"sm": "4px",
|
|
8399
8424
|
"md": "6px",
|
|
8400
8425
|
"lg": "8px",
|
|
8401
|
-
"xl": "
|
|
8426
|
+
"xl": "8px",
|
|
8402
8427
|
"full": "9999px"
|
|
8403
8428
|
},
|
|
8404
8429
|
"shadow": [
|
|
@@ -8898,6 +8923,7 @@
|
|
|
8898
8923
|
"constraints": [
|
|
8899
8924
|
"TableHeader contains TableRow; never place TableColumn directly under TableHeader.",
|
|
8900
8925
|
"Keep header and body column counts aligned.",
|
|
8926
|
+
"Only give rows hover feedback when clicking the whole row selects it or opens a detail page or panel; actionable rows need an accessible destination label.",
|
|
8901
8927
|
"Use a sticky-right actions column plus elevatedActionColumn when every row has persistent actions."
|
|
8902
8928
|
],
|
|
8903
8929
|
"principles": [
|
|
@@ -9597,9 +9623,9 @@
|
|
|
9597
9623
|
]
|
|
9598
9624
|
},
|
|
9599
9625
|
"counts": {
|
|
9600
|
-
"nodes":
|
|
9626
|
+
"nodes": 803,
|
|
9601
9627
|
"edges": 545,
|
|
9602
|
-
"component":
|
|
9628
|
+
"component": 323,
|
|
9603
9629
|
"state": 458,
|
|
9604
9630
|
"principle": 11,
|
|
9605
9631
|
"production": 9,
|
|
@@ -10335,6 +10361,15 @@
|
|
|
10335
10361
|
"showcaseUrl": "https://ads.actioneer.dev/#/radio",
|
|
10336
10362
|
"description": ""
|
|
10337
10363
|
},
|
|
10364
|
+
{
|
|
10365
|
+
"id": "component:SearchDisclosure",
|
|
10366
|
+
"kind": "component",
|
|
10367
|
+
"label": "SearchDisclosure",
|
|
10368
|
+
"family": "Form controls",
|
|
10369
|
+
"module": "search-disclosure",
|
|
10370
|
+
"showcaseUrl": "https://ads.actioneer.dev/#/search-disclosure",
|
|
10371
|
+
"description": ""
|
|
10372
|
+
},
|
|
10338
10373
|
{
|
|
10339
10374
|
"id": "component:SegmentedControl",
|
|
10340
10375
|
"kind": "component",
|
|
@@ -14002,7 +14037,7 @@
|
|
|
14002
14037
|
"family": "Data display",
|
|
14003
14038
|
"module": "table",
|
|
14004
14039
|
"showcaseUrl": "https://ads.actioneer.dev/#/table",
|
|
14005
|
-
"description": "Use Table for structured tabular data that may need row selection, column sorting, sticky columns, or a paginated footer — not for simple key-value lists. Every primary body-cell value defaults to text-m (
|
|
14040
|
+
"description": "Use Table for structured tabular data that may need row selection, column sorting, sticky columns, or a paginated footer — not for simple key-value lists. Every primary body-cell value defaults to text-m (14px / 20px); only clearly secondary metadata inside a cell may opt down to text-s. Give a whole-row action an onClick and aria-label: TableRow then adds hover/focus feedback, a pointer cursor, and Enter/Space activation. The consumer decides whether that action navigates or opens a panel; TableRow owns neither destination. Display-only rows stay static; selection rows toggle when clicked. Keep normal row geometry without a brand tint or hover-only corner rounding. Nested controls keep their own actions. Primary record links stay text-only in every state: never reveal an arrow, chevron, or other directional icon only on hover. Persistent row actions use a final sticky-right column plus elevatedActionColumn so one body-column shadow lifts the action surface instead of repeating on individual cells. The empty matching header cell remains transparent and non-sticky."
|
|
14006
14041
|
},
|
|
14007
14042
|
{
|
|
14008
14043
|
"id": "component:TableAnswer",
|
|
@@ -18093,6 +18128,7 @@
|
|
|
18093
18128
|
"constraints": [
|
|
18094
18129
|
"TableHeader contains TableRow; never place TableColumn directly under TableHeader.",
|
|
18095
18130
|
"Keep header and body column counts aligned.",
|
|
18131
|
+
"Only give rows hover feedback when clicking the whole row selects it or opens a detail page or panel; actionable rows need an accessible destination label.",
|
|
18096
18132
|
"Use a sticky-right actions column plus elevatedActionColumn when every row has persistent actions."
|
|
18097
18133
|
]
|
|
18098
18134
|
},
|
package/package.json
CHANGED
package/styles.css
CHANGED
|
@@ -57,22 +57,33 @@
|
|
|
57
57
|
--font-mono: "JetBrains Mono Variable", ui-monospace, SFMono-Regular,
|
|
58
58
|
"SF Mono", Menlo, Consolas, "Liberation Mono", "Courier New", monospace;
|
|
59
59
|
|
|
60
|
-
/* ---- Type scale ----
|
|
61
|
-
Root stays 16px so spacing is unaffected. */
|
|
62
|
-
--text-
|
|
63
|
-
--text-
|
|
64
|
-
--text-
|
|
65
|
-
--text-
|
|
66
|
-
--text-
|
|
67
|
-
--text-
|
|
68
|
-
--text-
|
|
69
|
-
--text-
|
|
70
|
-
--text-
|
|
71
|
-
--text-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
--text-
|
|
75
|
-
--text-
|
|
60
|
+
/* ---- Type scale ---- seven canonical steps: XS · S · M · L · XL · 2XL · 3XL.
|
|
61
|
+
Roles follow the agent workflow. Root stays 16px so spacing is unaffected. */
|
|
62
|
+
--text-xs: 0.625rem; /* 10px · compact chips and micro metadata */
|
|
63
|
+
--text-xs--line-height: 0.875rem; /* 14px */
|
|
64
|
+
--text-s: 0.75rem; /* 12px · table headers and uppercase kickers */
|
|
65
|
+
--text-s--line-height: 1rem; /* 16px */
|
|
66
|
+
--text-m: 0.875rem; /* 14px · default body, table cells, record names */
|
|
67
|
+
--text-m--line-height: 1.25rem; /* 20px */
|
|
68
|
+
--text-l: 1rem; /* 16px · tabs, form labels, and section titles */
|
|
69
|
+
--text-l--line-height: 1.375rem; /* 22px */
|
|
70
|
+
--text-xl: 1.125rem; /* 18px · metric values and subtitles */
|
|
71
|
+
--text-xl--line-height: 1.5rem; /* 24px */
|
|
72
|
+
--text-2xl: 1.5rem; /* 24px · page titles */
|
|
73
|
+
--text-2xl--line-height: 2rem; /* 32px */
|
|
74
|
+
--text-3xl: 2rem; /* 32px · large data display */
|
|
75
|
+
--text-3xl--line-height: 2.5rem; /* 40px */
|
|
76
|
+
|
|
77
|
+
/* This is the complete ADS scale. Remove Tailwind's larger default steps so
|
|
78
|
+
Storybook and product code cannot silently introduce an eighth size. */
|
|
79
|
+
--text-4xl: initial;
|
|
80
|
+
--text-5xl: initial;
|
|
81
|
+
--text-6xl: initial;
|
|
82
|
+
--text-7xl: initial;
|
|
83
|
+
--text-8xl: initial;
|
|
84
|
+
--text-9xl: initial;
|
|
85
|
+
|
|
86
|
+
/* Compatibility aliases keep existing ADS consumers on the canonical scale. */
|
|
76
87
|
--text-sm: var(--text-s);
|
|
77
88
|
--text-sm--line-height: var(--text-s--line-height);
|
|
78
89
|
--text-base: var(--text-m);
|
|
@@ -218,21 +229,21 @@
|
|
|
218
229
|
/* Demo logo indigo — source for artifact canvas wash. */
|
|
219
230
|
--color-brand-mark: #2e1065;
|
|
220
231
|
|
|
221
|
-
/* ---- Radii ----
|
|
232
|
+
/* ---- Radii ---- four canonical steps: XS · S · M · L.
|
|
222
233
|
M (6px) is the default corner radius. */
|
|
223
234
|
--radius-xs: 0.125rem; /* 2px · micro details */
|
|
224
235
|
--radius-s: 0.25rem; /* 4px · compact controls */
|
|
225
236
|
--radius-m: 0.375rem; /* 6px · default controls and surfaces */
|
|
226
|
-
--radius-l: 0.5rem; /* 8px · menus and
|
|
227
|
-
--radius-xl: 0.75rem; /* 12px · large panels and feature surfaces */
|
|
237
|
+
--radius-l: 0.5rem; /* 8px · menus, cards, and large surfaces */
|
|
228
238
|
|
|
229
239
|
/* Compatibility aliases preserve existing ADS utilities. */
|
|
230
240
|
--radius-sm: var(--radius-s);
|
|
231
241
|
--radius-md: var(--radius-m);
|
|
232
242
|
--radius-lg: var(--radius-l);
|
|
233
|
-
--radius-
|
|
234
|
-
--radius-
|
|
235
|
-
--radius-
|
|
243
|
+
--radius-xl: var(--radius-l);
|
|
244
|
+
--radius-2xl: var(--radius-l);
|
|
245
|
+
--radius-3xl: var(--radius-l);
|
|
246
|
+
--radius-4xl: var(--radius-l);
|
|
236
247
|
/* Shape-only exception for avatars, icon buttons, progress tracks, chips,
|
|
237
248
|
and badges. It is not part of the corner-radius scale. */
|
|
238
249
|
--radius-full: 9999px;
|
|
@@ -284,8 +295,8 @@
|
|
|
284
295
|
--sidebar-item: 2rem; /* 32px — collapsed rail hit target (square) */
|
|
285
296
|
--sidebar-logo: 1.25rem; /* 20px — brand mark, centered in a --sidebar-item square */
|
|
286
297
|
--sidebar-text-indent: 2.375rem; /* px-3 + icon size-4 + gap-2.5 — history rows align to nav-item text */
|
|
287
|
-
--sidebar-navigation-text-size: var(--text-m); /*
|
|
288
|
-
--sidebar-section-label-size:
|
|
298
|
+
--sidebar-navigation-text-size: var(--text-m); /* 14px — sidebar actions, items, history, and account text */
|
|
299
|
+
--sidebar-section-label-size: var(--text-s); /* 12px — section and history labels */
|
|
289
300
|
--panel-header-height: 2.75rem; /* 44px — Panel / toolbar header */
|
|
290
301
|
--aside-width: 20rem; /* 320px — right-hand panel column */
|
|
291
302
|
|
|
@@ -298,7 +309,7 @@
|
|
|
298
309
|
--thread-max-width: 44rem; /* chat column cap — readable prose measure, all panes */
|
|
299
310
|
--thread-max-width-wide: 64rem; /* rich-content breakout cap (tables/charts/tool cards) on wide panes; prose keeps --thread-max-width */
|
|
300
311
|
--composer-bg: var(--elevated); /* pure white composer surface */
|
|
301
|
-
--composer-radius: var(--radius-
|
|
312
|
+
--composer-radius: var(--radius-l);
|
|
302
313
|
--composer-padding: 0.5rem;
|
|
303
314
|
--composer-placeholder-max-h: calc(var(--text-m--line-height) * 2); /* rotating placeholder clamp — two lines of the input's own rhythm, so it can never overlap the accessory row */
|
|
304
315
|
--chat-texture-opacity: 0.06; /* welcome-state halftone wash */
|
|
@@ -460,16 +471,18 @@
|
|
|
460
471
|
--foreground: var(--color-wg12); /* step 12 */
|
|
461
472
|
|
|
462
473
|
/* Both surface contexts point directly into the approved WG text steps.
|
|
463
|
-
|
|
474
|
+
WG9 is the tertiary/de-emphasis step for nonessential metadata. It clears
|
|
475
|
+
normal-text AA on White; use Secondary when normal text on WG2 must clear
|
|
476
|
+
AA. */
|
|
464
477
|
--text-on-white-primary: var(--color-wg12); /* 16.32:1 · AAA */
|
|
465
478
|
--text-on-white-secondary: var(--color-wg11); /* 8.76:1 · AAA */
|
|
466
|
-
--text-on-white-tertiary: var(--color-
|
|
479
|
+
--text-on-white-tertiary: var(--color-wg9); /* 4.50:1 · AA */
|
|
467
480
|
--text-on-warm-grey-primary: var(--color-wg12); /* 14.43:1 on WG2 · AAA */
|
|
468
481
|
--text-on-warm-grey-secondary: var(--color-wg11); /* 7.75:1 on WG2 · AAA */
|
|
469
|
-
--text-on-warm-grey-tertiary: var(--color-
|
|
482
|
+
--text-on-warm-grey-tertiary: var(--color-wg9); /* 3.98:1 on WG2 · large text AA */
|
|
470
483
|
|
|
471
|
-
/* Existing context-free utilities remain compatibility aliases
|
|
472
|
-
|
|
484
|
+
/* Existing context-free utilities remain conservative compatibility aliases
|
|
485
|
+
across WG2–WG4 and White until their call sites adopt a surface role. */
|
|
473
486
|
--text-primary: var(--color-wg12); /* 12.93:1 AAA (WG4 min surf) */
|
|
474
487
|
--text-secondary: var(--color-wg11); /* 6.94:1 AA (WG4 min surf) */
|
|
475
488
|
--text-tertiary: color-mix(in srgb, var(--color-wg10) 80%, var(--color-wg11)); /* 4.86:1 AA (WG4) */
|
|
@@ -500,7 +513,7 @@
|
|
|
500
513
|
--brand-hover: var(--color-wg11); /* lighter hover lift */
|
|
501
514
|
--brand-text: var(--color-wg12); /* action text / links */
|
|
502
515
|
|
|
503
|
-
/* Interactive row hover/focus uses the
|
|
516
|
+
/* Interactive row hover/focus uses the WG2 highlight wash. */
|
|
504
517
|
--table-row-hover: var(--color-wg2);
|
|
505
518
|
--table-row-selected: var(--color-wg1);
|
|
506
519
|
|
|
@@ -551,7 +564,7 @@
|
|
|
551
564
|
--texture-ink: var(--color-wg12); /* brand-texture / pixel-blast marks */
|
|
552
565
|
--table-shell: var(--color-white); /* simplified single-surface table */
|
|
553
566
|
--table-stroke: var(--color-wg3); /* table outline + row separators */
|
|
554
|
-
--table-header-foreground: var(--
|
|
567
|
+
--table-header-foreground: var(--text-tertiary); /* 12px tertiary table heading text */
|
|
555
568
|
--specimen-stroke: var(--color-wg3); /* showcase preview + variant-group frames */
|
|
556
569
|
--table-scroll-hint: color-mix(in srgb, var(--color-wg12) 4%, transparent); /* right-edge wash */
|
|
557
570
|
--surface-inverse: var(--color-wg12); /* dark hero / inverse surface base */
|
|
@@ -688,7 +701,7 @@
|
|
|
688
701
|
}
|
|
689
702
|
|
|
690
703
|
.ask-section-label {
|
|
691
|
-
font-size:
|
|
704
|
+
font-size: var(--text-s);
|
|
692
705
|
line-height: 1rem;
|
|
693
706
|
}
|
|
694
707
|
|
|
@@ -838,7 +851,7 @@
|
|
|
838
851
|
background-color: var(--background);
|
|
839
852
|
color: var(--foreground);
|
|
840
853
|
font-family: var(--font-sans);
|
|
841
|
-
font-size: var(--text-base); /*
|
|
854
|
+
font-size: var(--text-base); /* 14px base */
|
|
842
855
|
/* Stylistic sets ss01, ss02, ss03. Figures are tabular everywhere
|
|
843
856
|
(data-dense UI) via the real property, not a "tnum" feature tag. */
|
|
844
857
|
font-feature-settings: "ss01", "ss02", "ss03";
|