@actioneer/ads 1.0.4 → 1.0.6

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.
Files changed (59) hide show
  1. package/DESIGN.md +75 -75
  2. package/README.md +205 -0
  3. package/components/ai-elements/agent-trace.js +14 -14
  4. package/components/ai-elements/chain-of-thought.js +3 -3
  5. package/components/ai-elements/chart.js +3 -3
  6. package/components/ai-elements/inline-citation.js +2 -2
  7. package/components/ai-elements/message.js +1 -1
  8. package/components/ai-elements/research-activity.js +4 -4
  9. package/components/answer-sources.js +3 -3
  10. package/components/answer.js +3 -3
  11. package/components/assistant-ui/action-bar.js +2 -2
  12. package/components/assistant-ui/attachment.js +5 -5
  13. package/components/assistant-ui/badge.js +1 -1
  14. package/components/assistant-ui/branch-picker.js +1 -1
  15. package/components/assistant-ui/composer-add-context.js +7 -7
  16. package/components/assistant-ui/composer-deep-research.js +3 -3
  17. package/components/assistant-ui/composer-harness.js +1 -1
  18. package/components/assistant-ui/composer-trigger-popover.js +8 -8
  19. package/components/assistant-ui/composer.js +45 -45
  20. package/components/assistant-ui/file.js +9 -9
  21. package/components/assistant-ui/image.js +1 -1
  22. package/components/assistant-ui/markdown-text.js +1 -1
  23. package/components/assistant-ui/message-timing.js +1 -1
  24. package/components/assistant-ui/reasoning.js +10 -10
  25. package/components/assistant-ui/thread.js +1 -1
  26. package/components/assistant-ui/tool-fallback.js +2 -2
  27. package/components/assistant-ui/tool-group.js +3 -3
  28. package/components/autocomplete.js +28 -27
  29. package/components/brand-loader.d.ts +1 -1
  30. package/components/brand-loader.js +9 -9
  31. package/components/chart.js +5 -5
  32. package/components/checkbox.js +16 -16
  33. package/components/chip.js +33 -33
  34. package/components/collapsible.js +14 -12
  35. package/components/command-palette.js +37 -37
  36. package/components/connector-card.js +1 -1
  37. package/components/date-range-picker.js +2 -2
  38. package/components/dropdown.js +1 -1
  39. package/components/field.js +1 -1
  40. package/components/file-dropzone.js +2 -2
  41. package/components/infinite-canvas.js +1 -1
  42. package/components/modal.js +6 -6
  43. package/components/pagination.js +23 -23
  44. package/components/radio.js +1 -1
  45. package/components/segmented.js +23 -23
  46. package/components/selection-action-bar.js +13 -13
  47. package/components/sidebar.js +5 -5
  48. package/components/stepper.d.ts +1 -1
  49. package/components/stepper.js +4 -4
  50. package/components/switch.js +7 -7
  51. package/components/tooltip.js +1 -1
  52. package/components/tree.js +20 -20
  53. package/components/ui/button.js +21 -21
  54. package/components/ui/tooltip.js +3 -3
  55. package/llms.txt +6 -6
  56. package/manifest.json +13 -13
  57. package/package.json +1 -1
  58. package/styles.css +49 -56
  59. package/theme.css +49 -56
package/theme.css CHANGED
@@ -28,13 +28,13 @@
28
28
 
29
29
  /* ---- Type scale ---- seven canonical steps: XS · S · M · L · XL · 2XL · 3XL.
30
30
  Roles follow the agent workflow. Root stays 16px so spacing is unaffected. */
31
- --text-xs: 0.625rem; /* 10px · compact chips and micro metadata */
31
+ --text-xs: 0.625rem; /* 10px · noninteractive micro metadata */
32
32
  --text-xs--line-height: 0.875rem; /* 14px */
33
- --text-s: 0.75rem; /* 12px · table headers and uppercase kickers */
33
+ --text-s: 0.75rem; /* 12px · compact controls, table headers and kickers */
34
34
  --text-s--line-height: 1rem; /* 16px */
35
- --text-m: 0.875rem; /* 14px · default body, table cells, record names */
35
+ --text-m: 0.875rem; /* 14px · body, table cells, form labels and controls */
36
36
  --text-m--line-height: 1.25rem; /* 20px */
37
- --text-l: 1rem; /* 16px · tabs, form labels, and section titles */
37
+ --text-l: 1rem; /* 16px · tabs and section titles */
38
38
  --text-l--line-height: 1.375rem; /* 22px */
39
39
  --text-xl: 1.125rem; /* 18px · metric values and subtitles */
40
40
  --text-xl--line-height: 1.5rem; /* 24px */
@@ -79,18 +79,18 @@
79
79
  --color-t11: #016159;
80
80
  --color-t12: #0f3c37;
81
81
 
82
- --color-wg1: #f5f5f3;
83
- --color-wg2: #f1f1ef;
84
- --color-wg3: #ececea;
85
- --color-wg4: #e5e5e2;
86
- --color-wg5: #dcdcd8;
87
- --color-wg6: #d1d1cc;
88
- --color-wg7: #c2c2bc;
89
- --color-wg8: #a6a69f;
90
- --color-wg9: #777771;
91
- --color-wg10: #686863;
92
- --color-wg11: #4b4b47;
93
- --color-wg12: #20201e;
82
+ --color-wg1: #f9f7f0;
83
+ --color-wg2: #f3f1e9;
84
+ --color-wg3: #efece3;
85
+ --color-wg4: #e8e5db;
86
+ --color-wg5: #dfdcd0;
87
+ --color-wg6: #d4d1c4;
88
+ --color-wg7: #c6c2b3;
89
+ --color-wg8: #aaa698;
90
+ --color-wg9: #79766a;
91
+ --color-wg10: #6b685e;
92
+ --color-wg11: #4d4b44;
93
+ --color-wg12: #21201d;
94
94
 
95
95
  /* Deprecated Neutral Grey names resolve to the canonical Warm Grey ramp.
96
96
  Keep these aliases so existing consumer utilities continue to render. */
@@ -165,16 +165,15 @@
165
165
  --color-ink-950: var(--color-wg12);
166
166
 
167
167
  /* ---- Semantic accent ramps ---- */
168
- /* Success uses the lichen lime family and stays status-only. The original
169
- soft/base/deep anchors map to 50/500/600; 100 and 400 bridge the soft fill
170
- and base, while 700 deepens the family enough for AA text on White. */
171
- --color-success-50: #e4efcf;
172
- --color-success-100: #d4e5b5;
173
- --color-success-300: #c4dc9b;
174
- --color-success-400: #b4d281;
175
- --color-success-500: #a3c765;
176
- --color-success-600: #6e8f30;
177
- --color-success-700: #516923;
168
+ /* Grass green keeps positive states distinct from primary-action teal.
169
+ Soft fills use 50/100; 700 carries accessible status text and solid fills. */
170
+ --color-success-50: #f2fbef;
171
+ --color-success-100: #e1f3d8;
172
+ --color-success-300: #b2dda0;
173
+ --color-success-400: #8acb70;
174
+ --color-success-500: #4d9f38;
175
+ --color-success-600: #3b852b;
176
+ --color-success-700: #2d6b22;
178
177
 
179
178
  --color-warning-50: #fffaeb;
180
179
  --color-warning-100: #fef0c7;
@@ -210,8 +209,8 @@
210
209
  --color-amber-base: #f3a72e;
211
210
  --color-amber-deep: #b57414;
212
211
 
213
- /* Demo logo indigo — source for artifact canvas wash. */
214
- --color-brand-mark: #2e1065;
212
+ /* Brand mark and artifact canvas wash share the product teal. */
213
+ --color-brand-mark: var(--brand);
215
214
 
216
215
  /* ---- Radii ---- four canonical steps: XS · S · M · L.
217
216
  M (6px) is the default corner radius. */
@@ -372,7 +371,7 @@
372
371
  --color-action-primary-soft: var(--action-primary-soft);
373
372
  --color-field-focus: var(--field-focus);
374
373
 
375
- /* Compatibility action role — neutral ink, never a colored primary hue. */
374
+ /* Shared brand roles for control states, primary accents, and marks. */
376
375
  --color-brand: var(--brand);
377
376
  --color-brand-foreground: var(--brand-foreground);
378
377
  --color-brand-hover: var(--brand-hover);
@@ -393,9 +392,7 @@
393
392
  --color-accent: var(--accent);
394
393
  --color-accent-foreground: var(--accent-foreground);
395
394
 
396
- /* Lichen success-700 clears AA on White and both success soft fills;
397
- success-600 is reserved for non-text marks because its 3.73:1 contrast
398
- on White does not clear body-text AA. */
395
+ /* Grass green 700 clears AA on White and both success soft fills. */
399
396
  --color-success: var(--color-success-700);
400
397
  --color-success-foreground: var(--color-white);
401
398
  /* Amber-500 fill kept (it IS the caution signal); dark ink foreground
@@ -449,8 +446,7 @@
449
446
 
450
447
  /* ---- Theme (light only) ---- */
451
448
  :root {
452
- /* Surfaces and achromatic text/actions point into WG; the primary CTA
453
- points into G. */
449
+ /* Surfaces and neutral text use WG; actions and controls share Teal. */
454
450
  --background: var(--color-wg2); /* step 2 · canvas */
455
451
  --foreground: var(--color-wg12); /* step 12 */
456
452
 
@@ -458,18 +454,18 @@
458
454
  WG9 is the tertiary/de-emphasis step for nonessential metadata. It clears
459
455
  normal-text AA on White; use Secondary when normal text on WG2 must clear
460
456
  AA. */
461
- --text-on-white-primary: var(--color-wg12); /* 16.32:1 · AAA */
462
- --text-on-white-secondary: var(--color-wg11); /* 8.76:1 · AAA */
463
- --text-on-white-tertiary: var(--color-wg9); /* 4.50:1 · AA */
464
- --text-on-warm-grey-primary: var(--color-wg12); /* 14.43:1 on WG2 · AAA */
465
- --text-on-warm-grey-secondary: var(--color-wg11); /* 7.75:1 on WG2 · AAA */
466
- --text-on-warm-grey-tertiary: var(--color-wg9); /* 3.98:1 on WG2 · large text AA */
457
+ --text-on-white-primary: var(--color-wg12); /* 16.29:1 · AAA */
458
+ --text-on-white-secondary: var(--color-wg11); /* 8.73:1 · AAA */
459
+ --text-on-white-tertiary: var(--color-wg9); /* 4.55:1 · AA */
460
+ --text-on-warm-grey-primary: var(--color-wg12); /* 14.41:1 on WG2 · AAA */
461
+ --text-on-warm-grey-secondary: var(--color-wg11); /* 7.72:1 on WG2 · AAA */
462
+ --text-on-warm-grey-tertiary: var(--color-wg9); /* 4.03:1 on WG2 · large text AA */
467
463
 
468
464
  /* Existing context-free utilities remain conservative compatibility aliases
469
465
  across WG2–WG4 and White until their call sites adopt a surface role. */
470
466
  --text-primary: var(--color-wg12); /* 12.93:1 AAA (WG4 min surf) */
471
- --text-secondary: var(--color-wg11); /* 6.94:1 AA (WG4 min surf) */
472
- --text-tertiary: color-mix(in srgb, var(--color-wg10) 80%, var(--color-wg11)); /* 4.86:1 AA (WG4) */
467
+ --text-secondary: var(--color-wg11); /* 6.93:1 AA (WG4 min surf) */
468
+ --text-tertiary: color-mix(in srgb, var(--color-wg10) 80%, var(--color-wg11)); /* 4.83:1 AA (WG4) */
473
469
 
474
470
  --surface: var(--color-wg3); /* step 3 · tinted canvas */
475
471
  --surface-foreground: var(--color-wg12);
@@ -481,25 +477,22 @@
481
477
  --card: var(--color-white); /* pure white base */
482
478
  --card-foreground: var(--color-wg12);
483
479
 
484
- /* Studio teal is deliberately isolated to the primary CTA role (roughly
485
- 5–10% of a screen). Selection controls keep using neutral `brand` below,
486
- so tabs, switches, radios, and progress never inherit CTA color. */
480
+ /* One teal action palette shared by CTAs and component interaction states. */
487
481
  --action-primary: var(--color-t9);
488
482
  --action-primary-foreground: var(--color-white);
489
483
  --action-primary-hover: var(--color-t10);
490
484
  --action-primary-text: var(--color-t11);
491
485
  --action-primary-soft: var(--color-t3);
492
486
 
493
- /* Neutral action role. The `brand` name remains as a compatibility API,
494
- and shared selection/control states intentionally remain achromatic. */
495
- --brand: var(--color-wg12); /* darkest neutral action */
496
- --brand-foreground: var(--color-white);
497
- --brand-hover: var(--color-wg11); /* lighter hover lift */
498
- --brand-text: var(--color-wg12); /* action text / links */
487
+ /* Brand aliases follow the action roles so every consumer stays in sync. */
488
+ --brand: var(--action-primary);
489
+ --brand-foreground: var(--action-primary-foreground);
490
+ --brand-hover: var(--action-primary-hover);
491
+ --brand-text: var(--action-primary-text);
499
492
 
500
493
  /* Interactive row hover/focus uses the WG2 highlight wash. */
501
494
  --table-row-hover: var(--color-wg2);
502
- --table-row-selected: var(--color-wg1);
495
+ --table-row-selected: var(--action-primary-soft);
503
496
 
504
497
  /* Quiet component fill. WG3 is the first interactive-background
505
498
  step, so this remains visible on both white cards and the step-2 canvas. */
@@ -532,7 +525,7 @@
532
525
 
533
526
  /* Stroke width — every standard UI border is exactly 1px. */
534
527
  --stroke-width: 1px;
535
- --ring: color-mix(in srgb, var(--color-wg12) 50%, transparent); /* WG12 @ 50% */
528
+ --ring: var(--brand); /* visible teal focus */
536
529
  --overlay: color-mix(in srgb, var(--color-wg12) 50%, transparent); /* WG12 @ 50% */
537
530
 
538
531
  /* Functional / domain tokens — named for their render role, pointing into
@@ -545,7 +538,7 @@
545
538
  --chart-context: var(--color-wg6); /* de-emphasised context series */
546
539
  --chart-active-bar-opacity: 0.68; /* hover lightens a bar while preserving its series hue */
547
540
  --canvas-edge: var(--border-secondary);/* infinite-canvas edges / connectors */
548
- --texture-ink: var(--color-wg12); /* brand-texture / pixel-blast marks */
541
+ --texture-ink: var(--brand); /* brand-texture / pixel-blast marks */
549
542
  --table-shell: var(--color-white); /* simplified single-surface table */
550
543
  --table-stroke: var(--color-wg3); /* table outline + row separators */
551
544
  --table-header-foreground: var(--text-tertiary); /* 12px tertiary table heading text */
@@ -564,8 +557,8 @@
564
557
  --sidebar-foreground: var(--foreground);
565
558
  --sidebar-primary: var(--brand);
566
559
  --sidebar-primary-foreground: var(--brand-foreground);
567
- --sidebar-accent: var(--muted);
568
- --sidebar-accent-foreground: var(--foreground);
560
+ --sidebar-accent: var(--action-primary-soft);
561
+ --sidebar-accent-foreground: var(--brand-text);
569
562
  --sidebar-border: var(--border);
570
563
  --sidebar-ring: var(--ring);
571
564
  --popover: var(--elevated);