@mtdt/observeops-ds-spec 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.
Files changed (79) hide show
  1. package/AGENTS.md +102 -0
  2. package/README.md +73 -0
  3. package/components/index.json +1270 -0
  4. package/components/recipes/README.md +41 -0
  5. package/components/recipes/recipes.json +922 -0
  6. package/components/registry/README.md +44 -0
  7. package/components/registry/_schema.json +47 -0
  8. package/components/registry/button.json +368 -0
  9. package/components/registry/checkbox.json +177 -0
  10. package/components/registry/data-viz-tooltips.json +409 -0
  11. package/components/registry/date-time-pickers.json +296 -0
  12. package/components/registry/drawer.json +222 -0
  13. package/components/registry/dropdown-picker.json +388 -0
  14. package/components/registry/filters.json +155 -0
  15. package/components/registry/form-item.json +281 -0
  16. package/components/registry/input.json +277 -0
  17. package/components/registry/link.json +186 -0
  18. package/components/registry/loose-tags.json +196 -0
  19. package/components/registry/menu.json +145 -0
  20. package/components/registry/modal.json +265 -0
  21. package/components/registry/navigation.json +425 -0
  22. package/components/registry/popover.json +216 -0
  23. package/components/registry/radio.json +238 -0
  24. package/components/registry/scheduler.json +188 -0
  25. package/components/registry/select.json +247 -0
  26. package/components/registry/severity.json +179 -0
  27. package/components/registry/switch.json +177 -0
  28. package/components/registry/table.json +275 -0
  29. package/components/registry/tabs.json +264 -0
  30. package/components/registry/tag.json +345 -0
  31. package/components/registry/tags-list.json +115 -0
  32. package/components/registry/toolbars.json +240 -0
  33. package/components/registry/tooltip.json +175 -0
  34. package/components/specs/README.md +72 -0
  35. package/components/specs/button.md +230 -0
  36. package/components/specs/checkbox.md +162 -0
  37. package/components/specs/data-viz-tooltips.md +93 -0
  38. package/components/specs/date-time-pickers.md +161 -0
  39. package/components/specs/drawer.md +162 -0
  40. package/components/specs/dropdown-picker.md +161 -0
  41. package/components/specs/filters.md +118 -0
  42. package/components/specs/form-item.md +130 -0
  43. package/components/specs/input.md +130 -0
  44. package/components/specs/link.md +131 -0
  45. package/components/specs/loose-tags.md +139 -0
  46. package/components/specs/menu.md +88 -0
  47. package/components/specs/modal.md +176 -0
  48. package/components/specs/navigation.md +181 -0
  49. package/components/specs/popover.md +118 -0
  50. package/components/specs/radio.md +144 -0
  51. package/components/specs/scheduler.md +133 -0
  52. package/components/specs/select.md +118 -0
  53. package/components/specs/switch.md +124 -0
  54. package/components/specs/table.md +115 -0
  55. package/components/specs/tabs.md +136 -0
  56. package/components/specs/tag.md +196 -0
  57. package/components/specs/tags-list.md +105 -0
  58. package/components/specs/toolbars.md +108 -0
  59. package/components/specs/tooltip.md +112 -0
  60. package/foundation/README.md +39 -0
  61. package/foundation/layout-shells.md +67 -0
  62. package/foundation/page-templates.md +69 -0
  63. package/foundation/panel-behaviours.md +61 -0
  64. package/foundation/screen-regions.md +62 -0
  65. package/index.js +75 -0
  66. package/layout/grid.json +34 -0
  67. package/layout/layouts.json +310 -0
  68. package/llms.txt +60 -0
  69. package/package.json +42 -0
  70. package/spec.manifest.json +407 -0
  71. package/tokens/README.md +125 -0
  72. package/tokens/component.json +34 -0
  73. package/tokens/kit-accents.json +14 -0
  74. package/tokens/primitive.json +130 -0
  75. package/tokens/purpose-map.json +67 -0
  76. package/tokens/semantic.dark.json +90 -0
  77. package/tokens/semantic.light.json +90 -0
  78. package/tokens/structural.json +35 -0
  79. package/tokens/variables.json +2018 -0
package/components/recipes/README.md ADDED
@@ -0,0 +1,41 @@
1
+ # Composition recipes
2
+
3
+ Page & flow blueprints — the layer **above** per-component docs. Where the registries say *which*
4
+ component to use, these say **how to assemble a whole product-faithful screen**. Machine source:
5
+ [`recipes.json`](./recipes.json).
6
+
7
+ ## Why
8
+
9
+ The AI-readiness assessment found an AI could pick the right components but had **no blueprint** to lay
10
+ out a faithful page. These recipes close that: each one is a real ObserveOps screen archetype with its
11
+ regions, the component `id` + `variant` for each region, the layout shell, the spacing/sizing tokens,
12
+ and the known traps.
13
+
14
+ ## How an AI uses it
15
+
16
+ 1. Match the user's screen to a recipe by `whenToUse` / `examples`.
17
+ 2. Build the `regions` outer-to-inner; each names component `id`s + `variant`s → open those in
18
+ `components/registry/` for props, resolve their `tokensUsed` via `tokens/variables.json`.
19
+ 3. Apply `layout.shell` + `layout.tokens` (+ the global `layout.appShell` / `layout.tokens` for the app
20
+ chrome) for spacing/sizing.
21
+ 4. Honour each recipe's `gotchas` and `a11y`.
22
+ 5. The **content** (which columns / fields / options) is domain data the DS doesn't own — fill it from
23
+ the user's spec.
24
+
25
+ ## The recipes
26
+
27
+ | Recipe | When |
28
+ | --- | --- |
29
+ | **list-view** | A paginated CRUD list with filter, row + bulk actions, create/edit drawer (Monitors, Alerts, Users). |
30
+ | **form-view** | A create/edit form for one record (Settings policy/profile forms, Add Monitor). |
31
+ | **detail-view** | One record's details across tabbed sections (monitor/alert/NCM detail). |
32
+ | **dashboard-view** | A widget grid with a dashboard picker + global time range. |
33
+ | **explorer-view** | A left panel (tree / facets / picker / saved-views) + results + time range (Log/Metric/APM/RUM/NCM). |
34
+ | **wizard-flow** | An ordered multi-step create/setup flow (report builder, product setup, 2FA). |
35
+ | **confirm-delete-flow** | A destructive-action confirmation from a row/detail/bulk bar. |
36
+
37
+ ## The app shell (every page)
38
+
39
+ The **Primary nav** (`navigation/primary-nav`) and **App header** (`toolbars/app-header`) come from the
40
+ layout, not the page — a recipe's regions render inside the main content area (`--common-main-bg`). See
41
+ `recipes.json` → `layout.appShell`.