@commercetools/nimbus-mcp 3.5.0 → 3.6.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 (119) hide show
  1. package/data/docs/route-manifest.json +275 -9
  2. package/data/docs/routes/components-buttons-toggle-button-group.json +143 -18
  3. package/data/docs/routes/components-buttons-toggle-button.json +72 -15
  4. package/data/docs/routes/components-chat.json +36 -0
  5. package/data/docs/routes/components-content.json +36 -0
  6. package/data/docs/routes/components-data-display-data-table.json +1 -1
  7. package/data/docs/routes/components-feedback-popover.json +643 -0
  8. package/data/docs/routes/components-inputs-combo-box.json +33 -11
  9. package/data/docs/routes/components-inputs-search-input.json +29 -7
  10. package/data/docs/routes/components-inputs-select-input.json +23 -1
  11. package/data/docs/routes/components-layout-stack.json +1 -1
  12. package/data/docs/routes/components-navigation-toolbar.json +1 -1
  13. package/data/docs/routes/components-navigation-tree.json +2 -2
  14. package/data/docs/routes/home-contribute.json +29 -8
  15. package/data/docs/routes/home-getting-started-collaboration.json +657 -0
  16. package/data/docs/search-index.json +1 -1
  17. package/data/docs/types/AccordionContent.json +12 -12
  18. package/data/docs/types/AccordionHeader.json +46 -46
  19. package/data/docs/types/AccordionItem.json +20 -20
  20. package/data/docs/types/AccordionRoot.json +12 -12
  21. package/data/docs/types/ActivityIndicator.json +3 -2
  22. package/data/docs/types/AlertDismissButton.json +42 -42
  23. package/data/docs/types/Button.json +47 -46
  24. package/data/docs/types/Calendar.json +43 -42
  25. package/data/docs/types/Checkbox.json +30 -29
  26. package/data/docs/types/Code.json +2 -1
  27. package/data/docs/types/ComboBoxListBox.json +34 -34
  28. package/data/docs/types/ComboBoxOption.json +20 -20
  29. package/data/docs/types/ComboBoxPopover.json +67 -86
  30. package/data/docs/types/ComboBoxRoot.json +15 -0
  31. package/data/docs/types/ComboBoxSection.json +14 -14
  32. package/data/docs/types/DataTableBody.json +10 -10
  33. package/data/docs/types/DataTableCell.json +18 -18
  34. package/data/docs/types/DataTableColumn.json +28 -28
  35. package/data/docs/types/DataTableHeader.json +10 -10
  36. package/data/docs/types/DataTableManager.json +3 -5
  37. package/data/docs/types/DataTableRow.json +24 -24
  38. package/data/docs/types/DateInput.json +33 -32
  39. package/data/docs/types/DatePicker.json +32 -32
  40. package/data/docs/types/DateRangePicker.json +46 -46
  41. package/data/docs/types/DateRangePickerField.json +46 -46
  42. package/data/docs/types/DialogCloseTrigger.json +42 -42
  43. package/data/docs/types/DraggableListField.json +28 -28
  44. package/data/docs/types/DraggableListItem.json +18 -18
  45. package/data/docs/types/DraggableListRoot.json +30 -30
  46. package/data/docs/types/DrawerCloseTrigger.json +42 -42
  47. package/data/docs/types/DropZone.json +14 -14
  48. package/data/docs/types/FloatingActionButton.json +44 -44
  49. package/data/docs/types/Group.json +9 -7
  50. package/data/docs/types/Heading.json +3 -2
  51. package/data/docs/types/Icon.json +3 -2
  52. package/data/docs/types/IconButton.json +47 -46
  53. package/data/docs/types/IconToggleButton.json +71 -35
  54. package/data/docs/types/Link.json +3 -2
  55. package/data/docs/types/LoadingSpinner.json +3 -2
  56. package/data/docs/types/LocalizedField.json +3 -2
  57. package/data/docs/types/MakeElementFocusable.json +2 -2
  58. package/data/docs/types/MenuItem.json +22 -22
  59. package/data/docs/types/MenuRoot.json +31 -31
  60. package/data/docs/types/MenuSection.json +16 -16
  61. package/data/docs/types/MenuSubmenuTrigger.json +4 -4
  62. package/data/docs/types/MenuTrigger.json +46 -46
  63. package/data/docs/types/MoneyInput.json +4 -2
  64. package/data/docs/types/MultilineTextInput.json +27 -26
  65. package/data/docs/types/MultilineTextInputField.json +27 -26
  66. package/data/docs/types/NumberInput.json +14 -12
  67. package/data/docs/types/NumberInputField.json +10 -10
  68. package/data/docs/types/PasswordInput.json +24 -24
  69. package/data/docs/types/PasswordInputField.json +24 -24
  70. package/data/docs/types/Popover.json +13 -0
  71. package/data/docs/types/PopoverContent.json +42 -0
  72. package/data/docs/types/PopoverRoot.json +651 -0
  73. package/data/docs/types/PopoverTrigger.json +914 -0
  74. package/data/docs/types/ProgressBar.json +17 -15
  75. package/data/docs/types/RadioInputOption.json +17 -17
  76. package/data/docs/types/RadioInputRoot.json +10 -10
  77. package/data/docs/types/RangeCalendar.json +42 -42
  78. package/data/docs/types/RangeSlider.json +14 -14
  79. package/data/docs/types/Region.json +3 -2
  80. package/data/docs/types/RichTextInput.json +4 -2
  81. package/data/docs/types/SearchInput.json +60 -28
  82. package/data/docs/types/SearchInputField.json +60 -28
  83. package/data/docs/types/SelectOption.json +20 -20
  84. package/data/docs/types/SelectOptionGroup.json +14 -14
  85. package/data/docs/types/SelectOptions.json +34 -34
  86. package/data/docs/types/SelectRoot.json +67 -52
  87. package/data/docs/types/Separator.json +4 -2
  88. package/data/docs/types/Slider.json +18 -16
  89. package/data/docs/types/SplitButton.json +12 -10
  90. package/data/docs/types/Switch.json +11 -10
  91. package/data/docs/types/TagGroupRoot.json +12 -12
  92. package/data/docs/types/TagGroupTag.json +16 -16
  93. package/data/docs/types/TagGroupTagList.json +12 -12
  94. package/data/docs/types/TextInput.json +27 -26
  95. package/data/docs/types/TextInputField.json +27 -26
  96. package/data/docs/types/TimeInput.json +30 -28
  97. package/data/docs/types/ToastOutlet.json +4 -2
  98. package/data/docs/types/ToggleButton.json +74 -37
  99. package/data/docs/types/ToggleButtonGroup.json +4 -2
  100. package/data/docs/types/ToggleButtonGroupButton.json +547 -55
  101. package/data/docs/types/ToggleButtonGroupRoot.json +48 -16
  102. package/data/docs/types/Toolbar.json +11 -9
  103. package/data/docs/types/Tooltip.json +3 -2
  104. package/data/docs/types/TooltipContent.json +26 -26
  105. package/data/docs/types/TooltipRoot.json +16 -16
  106. package/data/docs/types/TreeIndicator.json +40 -40
  107. package/data/docs/types/TreeItem.json +20 -20
  108. package/data/docs/types/TreeRoot.json +26 -26
  109. package/data/docs/types/VisuallyHidden.json +4 -4
  110. package/data/docs/types/createItemsFromCsvDrop.json +2 -2
  111. package/data/docs/types/createItemsFromDirectoryDrop.json +2 -2
  112. package/data/docs/types/createItemsFromFileDrop.json +2 -2
  113. package/data/docs/types/createItemsFromImageDrop.json +2 -2
  114. package/data/docs/types/createItemsFromJsonDrop.json +2 -2
  115. package/data/docs/types/manifest.json +4 -0
  116. package/data/docs/types/useTree.json +8 -8
  117. package/data/style-props-summary.json +408 -0
  118. package/dist/index.js +156 -43
  119. package/package.json +8 -8
@@ -0,0 +1,657 @@
1
+ {
2
+ "meta": {
3
+ "id": "Home-Collaboration",
4
+ "title": "Collaboration",
5
+ "description": "How to collaborate with the nimbus team, understand governance processes, and work effectively with the design system.",
6
+ "order": 8,
7
+ "repoPath": "packages/nimbus/src/docs/home-collaboration.mdx",
8
+ "menu": [
9
+ "Home",
10
+ "Getting Started",
11
+ "Collaboration"
12
+ ],
13
+ "route": "home/getting-started/collaboration",
14
+ "tags": [
15
+ "guide",
16
+ "governance",
17
+ "collaboration"
18
+ ],
19
+ "toc": [
20
+ {
21
+ "value": "Why this document exists",
22
+ "href": "#why-this-document-exists",
23
+ "depth": 2,
24
+ "numbering": [
25
+ 1,
26
+ 1
27
+ ],
28
+ "parent": "root"
29
+ },
30
+ {
31
+ "value": "Foundational principles",
32
+ "href": "#foundational-principles",
33
+ "depth": 2,
34
+ "numbering": [
35
+ 1,
36
+ 2
37
+ ],
38
+ "parent": "root"
39
+ },
40
+ {
41
+ "value": "1. System first",
42
+ "href": "#1-system-first",
43
+ "depth": 3,
44
+ "numbering": [
45
+ 1,
46
+ 2,
47
+ 1
48
+ ],
49
+ "parent": "root"
50
+ },
51
+ {
52
+ "value": "2. Ask, don't assume",
53
+ "href": "#2-ask-dont-assume",
54
+ "depth": 3,
55
+ "numbering": [
56
+ 1,
57
+ 2,
58
+ 2
59
+ ],
60
+ "parent": "root"
61
+ },
62
+ {
63
+ "value": "3. Collaborate early",
64
+ "href": "#3-collaborate-early",
65
+ "depth": 3,
66
+ "numbering": [
67
+ 1,
68
+ 2,
69
+ 3
70
+ ],
71
+ "parent": "root"
72
+ },
73
+ {
74
+ "value": "4. Slow core, fast surface",
75
+ "href": "#4-slow-core-fast-surface",
76
+ "depth": 3,
77
+ "numbering": [
78
+ 1,
79
+ 2,
80
+ 4
81
+ ],
82
+ "parent": "root"
83
+ },
84
+ {
85
+ "value": "5. Own your recipes",
86
+ "href": "#5-own-your-recipes",
87
+ "depth": 3,
88
+ "numbering": [
89
+ 1,
90
+ 2,
91
+ 5
92
+ ],
93
+ "parent": "root"
94
+ },
95
+ {
96
+ "value": "Categorizing incoming work",
97
+ "href": "#categorizing-incoming-work",
98
+ "depth": 2,
99
+ "numbering": [
100
+ 1,
101
+ 3
102
+ ],
103
+ "parent": "root"
104
+ },
105
+ {
106
+ "value": "Bugs",
107
+ "href": "#bugs",
108
+ "depth": 3,
109
+ "numbering": [
110
+ 1,
111
+ 3,
112
+ 1
113
+ ],
114
+ "parent": "root"
115
+ },
116
+ {
117
+ "value": "Design discrepancies",
118
+ "href": "#design-discrepancies",
119
+ "depth": 3,
120
+ "numbering": [
121
+ 1,
122
+ 3,
123
+ 2
124
+ ],
125
+ "parent": "root"
126
+ },
127
+ {
128
+ "value": "Features",
129
+ "href": "#features",
130
+ "depth": 3,
131
+ "numbering": [
132
+ 1,
133
+ 3,
134
+ 3
135
+ ],
136
+ "parent": "root"
137
+ },
138
+ {
139
+ "value": "Recipes",
140
+ "href": "#recipes",
141
+ "depth": 3,
142
+ "numbering": [
143
+ 1,
144
+ 3,
145
+ 4
146
+ ],
147
+ "parent": "root"
148
+ },
149
+ {
150
+ "value": "Ownership boundaries",
151
+ "href": "#ownership-boundaries",
152
+ "depth": 2,
153
+ "numbering": [
154
+ 1,
155
+ 4
156
+ ],
157
+ "parent": "root"
158
+ },
159
+ {
160
+ "value": "Nimbus core",
161
+ "href": "#nimbus-core",
162
+ "depth": 3,
163
+ "numbering": [
164
+ 1,
165
+ 4,
166
+ 1
167
+ ],
168
+ "parent": "root"
169
+ },
170
+ {
171
+ "value": "Shared product libraries",
172
+ "href": "#shared-product-libraries",
173
+ "depth": 3,
174
+ "numbering": [
175
+ 1,
176
+ 4,
177
+ 2
178
+ ],
179
+ "parent": "root"
180
+ },
181
+ {
182
+ "value": "Application components",
183
+ "href": "#application-components",
184
+ "depth": 3,
185
+ "numbering": [
186
+ 1,
187
+ 4,
188
+ 3
189
+ ],
190
+ "parent": "root"
191
+ },
192
+ {
193
+ "value": "Governance workflow",
194
+ "href": "#governance-workflow",
195
+ "depth": 2,
196
+ "numbering": [
197
+ 1,
198
+ 5
199
+ ],
200
+ "parent": "root"
201
+ },
202
+ {
203
+ "value": "Does this belong in nimbus?",
204
+ "href": "#does-this-belong-in-nimbus",
205
+ "depth": 3,
206
+ "numbering": [
207
+ 1,
208
+ 5,
209
+ 1
210
+ ],
211
+ "parent": "root"
212
+ },
213
+ {
214
+ "value": "Step by step",
215
+ "href": "#step-by-step",
216
+ "depth": 3,
217
+ "numbering": [
218
+ 1,
219
+ 5,
220
+ 2
221
+ ],
222
+ "parent": "root"
223
+ },
224
+ {
225
+ "value": "Figma governance",
226
+ "href": "#figma-governance",
227
+ "depth": 2,
228
+ "numbering": [
229
+ 1,
230
+ 6
231
+ ],
232
+ "parent": "root"
233
+ },
234
+ {
235
+ "value": "Collaboration guidelines",
236
+ "href": "#collaboration-guidelines",
237
+ "depth": 2,
238
+ "numbering": [
239
+ 1,
240
+ 7
241
+ ],
242
+ "parent": "root"
243
+ },
244
+ {
245
+ "value": "What the nimbus team commits to",
246
+ "href": "#what-the-nimbus-team-commits-to",
247
+ "depth": 2,
248
+ "numbering": [
249
+ 1,
250
+ 8
251
+ ],
252
+ "parent": "root"
253
+ },
254
+ {
255
+ "value": "Real-world examples",
256
+ "href": "#real-world-examples",
257
+ "depth": 2,
258
+ "numbering": [
259
+ 1,
260
+ 9
261
+ ],
262
+ "parent": "root"
263
+ },
264
+ {
265
+ "value": "Recipe absorbed into the system",
266
+ "href": "#recipe-absorbed-into-the-system",
267
+ "depth": 3,
268
+ "numbering": [
269
+ 1,
270
+ 9,
271
+ 1
272
+ ],
273
+ "parent": "root"
274
+ },
275
+ {
276
+ "value": "Where a conversation would have helped",
277
+ "href": "#where-a-conversation-would-have-helped",
278
+ "depth": 3,
279
+ "numbering": [
280
+ 1,
281
+ 9,
282
+ 2
283
+ ],
284
+ "parent": "root"
285
+ },
286
+ {
287
+ "value": "Discoverability gap",
288
+ "href": "#discoverability-gap",
289
+ "depth": 3,
290
+ "numbering": [
291
+ 1,
292
+ 9,
293
+ 3
294
+ ],
295
+ "parent": "root"
296
+ },
297
+ {
298
+ "value": "Valid recipe",
299
+ "href": "#valid-recipe",
300
+ "depth": 3,
301
+ "numbering": [
302
+ 1,
303
+ 9,
304
+ 4
305
+ ],
306
+ "parent": "root"
307
+ },
308
+ {
309
+ "value": "The happy path",
310
+ "href": "#the-happy-path",
311
+ "depth": 3,
312
+ "numbering": [
313
+ 1,
314
+ 9,
315
+ 5
316
+ ],
317
+ "parent": "root"
318
+ },
319
+ {
320
+ "value": "What's next",
321
+ "href": "#whats-next",
322
+ "depth": 2,
323
+ "numbering": [
324
+ 1,
325
+ 10
326
+ ],
327
+ "parent": "root"
328
+ }
329
+ ],
330
+ "icon": "Group",
331
+ "layout": "app-frame",
332
+ "tabs": [
333
+ {
334
+ "key": "overview",
335
+ "title": "Overview",
336
+ "order": 0
337
+ }
338
+ ]
339
+ },
340
+ "mdx": "\n# Nimbus Governance, Collaboration, and Ownership\n\n## Why this document exists\n\nDesign systems that do not clearly define governance tend to fail in one of two\nways, either they calcify because teams cannot get what they need so they stop\ntrying, or they fragment when teams build around the system and consistency\nslowly erodes. How do we — engineers, designers, decision-makers — all work\nwith/in nimbus without falling into these foreseeable traps?\n\nThis document's answer is to establish a lightweight, shared understanding\nof how we work together on nimbus: How to surface needs, how to decide what\nbelongs in the system, who owns what, and how product-level work feeds back into\nthe shared library. The goal is to keep nimbus **coherent** while keeping product\nteams **unblocked**.\n\nThis is an invitation to collaborate, not a set of rules imposed from above.\nNimbus exists to serve the products built on it, and the governance process\nexists to make that relationship work well for everyone.\n\n## Foundational principles\n\nFive principles guide how we make decisions together.\n\n### 1. System first\n\nIf nimbus provides a component, token, or pattern that solves the problem,\n**use it**. The design system exists to provide tested, accessible, consistent\nsolutions. Building a custom alternative when a system solution already exists\ncreates fragmentation, increases maintenance burden, and undermines the\nconsistency that nimbus is here to provide.\n\nDivergence from the system is an exception that requires justification, not a\nstarting position.\n\n### 2. Ask, don't assume\n\nBefore building something custom, check what already exists. The\n[documentation site](https://nimbus-documentation.vercel.app/home),\n[Storybook](https://nimbus-storybook.vercel.app), the\n[Figma library](https://www.figma.com/design/AvtPX6g7OGGCRvNlatGOIY/NIMBUS-design-system),\nand the\n[MCP server](https://nimbus-documentation.vercel.app/home/getting-started/mcp-server-overview)\nare all searchable entry points. If you're still unsure after checking, ask in\nthe #ask-nimbus-anything\n[Slack channel](https://commercetools.slack.com/archives/C0ACFBKAHTM), or open a\n[GitHub discussion](https://github.com/commercetools/nimbus/discussions).\n**Don't assume the answer is \"no\" and build around the system**.\n\nMany perceived \"gaps\" turn out to be discoverability problems that a quick search\nor a single message would resolve. Public questions also help other teams who\nhave the same question, and they help the nimbus team understand where\ndocumentation or discoverability needs improvement.\n\n### 3. Collaborate early\n\nWhen your team's work touches shared UI patterns or surfaces a potential nimbus\ngap, loop in the nimbus team early. A five-minute conversation at the start of a\nfeature is worth more than a thirty-minute review at the end. **Early alignment\nprevents drift; late alignment creates rework**.\n\nThe same applies within product teams: designers and engineers should be in\nconversation from the start of any UI work, not just at handoff.\n\n### 4. Slow core, fast surface\n\n**Nimbus moves slower than products, and that's intentional**. Quality,\naccessibility, and cross-product consistency require deliberate engineering. The\nsystem is infrastructure: it prioritizes durability over speed.\n\nProduct teams are the fast layer. They innovate, experiment, and ship on their\nown timelines. They should never be blocked waiting for nimbus. When the system\ncan't deliver what a product team needs right now, the product team builds what\nit needs (see principle 5) and the system catches up when the pattern is proven.\n\nBoth speeds are correct. The tension between them is productive, not a problem to\nsolve.\n\n### 5. Own your recipes\n\nCompositions of nimbus components built for domain-specific use cases belong to\nthe product team that built them. These are \"recipes\": they use nimbus\ningredients (tokens, primitives, components) but serve a specific product\ncontext.\n\n**Recipes are not second-class**. They are the correct answer when domain\nrequirements diverge from what a general-purpose system should provide. Nimbus\nprovides ingredients; products assemble meals.\n\n## Categorizing incoming work\n\nNot every request is the same kind of work. Categorizing what's being asked for\nhelps route it to the right people and set the right expectations. These\ncategories apply equally to code components and Figma library assets.\n\n### Bugs\n\nA nimbus component (code or Figma) doesn't work as documented.\n\n**Owner:** Nimbus team\n**Priority:** Urgent\n**Examples:** An accordion fails to expand. A color contrast violation in a\nnimbus component. A Figma component is missing an interactive state that the code\ncomponent supports.\n\nTeams won't trust or use a system that's broken. Bug reports are always welcome\nand always prioritized.\n\n### Design discrepancies\n\nA gap between the Figma library and the coded component library.\n\n**Owner:** Nimbus team investigates\n**Priority:** High\n**Examples:** A designer uses a Button variant in a mockup that doesn't exist in\ncode. A coded component supports a prop that has no Figma equivalent. A\ndesigner's mockup uses a pattern that looks like a nimbus component but differs\nin subtle ways.\n\nWhen a discrepancy is found, the first question is whether the mismatch is a bug\n(one side is out of date) or a signal that the component needs to evolve. The\nnimbus team investigates and resolves.\n\n### Features\n\nA new component, variant, or capability that belongs in nimbus.\n\n**Owner:** Nimbus team, after evaluation\n**Priority:** Roadmap\n**Examples:** A request for a CopyableInput component. A new variant of an\nexisting component that would benefit multiple products.\n\nFeatures go through the governance workflow described below. Not every feature\nrequest becomes a nimbus component; some are better served as recipes.\n\n### Recipes\n\nA composition of nimbus components built for a specific product domain.\n\n**Owner:** Product team\n**Priority:** Product team's call\n**Examples:** A chat message renderer. A domain-specific form layout. A custom\nstepper for a multi-step wizard embedded in a chat interface.\n\nRecipes live in the product repo, are maintained by the product team, and don't\nrequire nimbus team involvement (though the nimbus team is available for\nguidance). If a recipe proves valuable across multiple products, it can be\nproposed for promotion into the system.\n\n## Ownership boundaries\n\nThree tiers of UI code, with clear ownership at each level.\n\n### Nimbus core\n\n**Owned by:** Nimbus team\n\nTokens, primitives, components in\n[`@commercetools/nimbus`](https://github.com/commercetools/nimbus/tree/main/packages/nimbus),\nicons in\n[`@commercetools/nimbus-icons`](https://github.com/commercetools/nimbus/tree/main/packages/nimbus-icons),\nthe\n[Figma component library](https://www.figma.com/design/AvtPX6g7OGGCRvNlatGOIY/NIMBUS-design-system),\nand the\n[documentation site](https://nimbus-documentation.vercel.app/).\n\nThe nimbus team is responsible for:\n\n- API design\n- Accessibility\n- Cross-browser support\n- Performance\n- Figma/code parity\n- Documentation\n- Release management\n\nChanges to nimbus core follow the nimbus team's development process.\n\n### Shared product libraries\n\n**Owned by:** Product teams, with nimbus consulted\n\nLibraries that compose nimbus components to serve a specific product family. For\nexample,\n[`@commercetools-internal/commerce-agents-ui-components`](https://github.com/commercetools/commerce-agents/blob/main/shared/ui/components/package.json)\nprovides shared chat infrastructure for the commerce-agents product family.\n[`@commercetools/merchant-center-shared-ui`](https://github.com/commercetools/merchant-center-frontend/blob/main/packages-shared/ui/package.json)\nprovides shared patterns for the Merchant Center.\n\n**These libraries are maintained by the product teams that built them**. The\nnimbus team is available for architecture guidance, especially around\naccessibility and token usage, but does not maintain these packages just because\nit maintains nimbus core.\n\n### Application components\n\n**Owned by:** Product teams\n\nDomain-specific UI built from nimbus primitives for a single application. No\nnimbus team involvement is needed unless promoting a component to a higher tier.\n\n## Governance workflow\n\n### Does this belong in nimbus?\n\nWhen evaluating whether a component should live in nimbus core or remain a\nrecipe, ask four questions:\n\n1. **Is it domain-agnostic?** No business logic, no product-specific data\n shapes, no assumptions about the consuming application's context.\n2. **Would two or more unrelated products benefit from it?** If only one product\n needs it, it's a recipe.\n3. **Does it extend a nimbus primitive in a way that's generally useful?** A\n specialized variant of an existing component that serves a broad need is a\n stronger candidate than a novel pattern.\n4. **Is the API surface stable enough to commit to?** Nimbus components carry a\n maintenance and compatibility commitment. If the design is still evolving, it\n may be too early.\n\nIf all four answers are yes, it's a feature candidate. Otherwise, it's a recipe,\n**and that's fine**.\n\n<img\n src=\"/images/getting-started/governance-workflow.png\"\n alt=\"Governance workflow: identify a need, check existing resources, ask in Slack or GitHub, categorize as bug/discrepancy/feature/recipe, then route to nimbus team (bugs, discrepancies, features) or product team (recipes) for resolution\"\n width=\"100%\"\n/>\n\n### Step by step\n\n1. **Start with nimbus.** Check the\n [documentation site](https://nimbus-documentation.vercel.app/home),\n [Storybook](https://nimbus-storybook.vercel.app), the\n [Figma library](https://www.figma.com/design/AvtPX6g7OGGCRvNlatGOIY/NIMBUS-design-system),\n and the\n [MCP server](https://nimbus-documentation.vercel.app/home/getting-started/mcp-server-overview)\n for existing solutions.\n2. **If you're unsure, ask publicly.** Post in the #ask-nimbus-anything\n [Slack channel](https://commercetools.slack.com/archives/C0ACFBKAHTM) or open\n a\n [GitHub discussion](https://github.com/commercetools/nimbus/discussions)\n before assuming a gap exists. Describe what you're trying to accomplish, not\n the solution you have in mind.\n3. **Categorize together.** The nimbus team and the requester agree on whether\n the gap is a bug, design discrepancy, feature, or recipe. This is a\n conversation, not a form.\n4. **For bugs and design discrepancies:** the nimbus team triages and fixes,\n tracked in Jira. No additional process needed from the requesting team beyond\n reporting.\n5. **For features:** evaluate against the four ownership criteria. Open a\n [GitHub Issue](https://github.com/commercetools/nimbus/issues) using the\n feature proposal template, or start with a Slack conversation and\n formalize later. If the scope warrants a more detailed RFC, the teams decide\n together whether one is needed and who writes it. If nimbus can deliver on the\n product team's timeline, the nimbus team builds it. If not, the product team\n builds a recipe now, and nimbus absorbs the pattern when it's proven.\n6. **For recipes:** the product team builds it using nimbus tokens and\n primitives. The nimbus team is available for architecture guidance (especially\n around accessibility and token usage). The recipe lives in the product repo.\n7. **Promotion path:** if a recipe proves valuable across multiple products, it\n can be proposed as a feature through the same workflow. The nimbus team\n refactors it to meet system standards: API consistency, accessibility,\n cross-browser support, Figma parity, and documentation.\n\n## Figma governance\n\nThe Figma library is part of nimbus, and the same governance workflow applies. A\nfew additional notes for designers:\n\n- **Reporting Figma/code mismatches:** File as a design discrepancy via GitHub\n Issue. Include which component, what differs, and a screenshot.\n- **Proposing new Figma components:** Same feature flow as code. The nimbus team\n maintains Figma/code parity: a component accepted for code will get a Figma\n counterpart, and vice versa.\n- **Using Figma components not yet in code:** Treat as a design discrepancy. The\n nimbus team will evaluate whether to add the code implementation or update the\n Figma library.\n- **Custom Figma compositions:** Designers can build product-specific\n compositions in their own Figma files using nimbus library components. These\n are the design equivalent of code recipes: owned by the product team, built\n from system ingredients.\n\n## Collaboration guidelines\n\nPractical guidance for working with nimbus.\n\n- **Check, then ask, then build.** Before building a custom component, search\n the [docs](https://nimbus-documentation.vercel.app/home),\n [Storybook](https://nimbus-storybook.vercel.app), the\n [Figma library](https://www.figma.com/design/AvtPX6g7OGGCRvNlatGOIY/NIMBUS-design-system),\n and the\n [MCP server](https://nimbus-documentation.vercel.app/home/getting-started/mcp-server-overview).\n If you don't find what you need, ask in the #ask-nimbus-anything\n [Slack channel](https://commercetools.slack.com/archives/C0ACFBKAHTM). Build\n custom only after confirming no system solution exists. This applies to both\n engineers and designers.\n- **Involve both UX and engineering from the start.** Don't design in isolation\n and hand off, and don't build in isolation and ask for review. Bring designers\n and engineers together early, especially when the work touches shared patterns\n or might surface a nimbus gap.\n- **Use nimbus tokens, not hardcoded values.** Even in recipes, use\n `system.token()` or semantic color values. Hardcoded colors and spacing values\n create maintenance debt and break when themes change.\n- **Use nimbus primitives as building blocks.** Build recipes from `Box`,\n `Stack`, `Flex`, `Text`, and other nimbus layout components rather than raw\n HTML elements. This ensures consistent spacing, responsive behavior, and theme\n support.\n- **Don't fork nimbus components.** If a nimbus component doesn't work for your\n use case, that's a conversation to have (bug or feature request), not a reason\n to rebuild from scratch. Forking creates drift that's expensive to reconcile\n later.\n- **Architecture reviews for complex recipes.** Before building a large custom\n component, discuss the approach with the nimbus team. This helps ensure future\n promotability, avoids accessibility pitfalls, and surfaces opportunities to use\n existing nimbus capabilities you might not know about.\n- **When you diverge, document why.** If you intentionally deviate from a nimbus\n pattern, leave a brief note explaining the rationale. This helps future\n maintainers (and the nimbus team) understand whether the divergence was a\n deliberate design decision or an oversight.\n\n## What the nimbus team commits to\n\nThis process is a partnership. Here's what the nimbus team is responsible for:\n\n- **Responsive communication.** Questions in the #ask-nimbus-anything\n [Slack channel](https://commercetools.slack.com/archives/C0ACFBKAHTM) get a\n timely response. If we don't have an immediate answer, we'll acknowledge the\n question and follow up.\n- **Triage and acknowledgment.** Bug reports and feature proposals filed as\n [GitHub Issues](https://github.com/commercetools/nimbus/issues) are triaged\n and acknowledged promptly. You'll know whether your report is being\n investigated, scheduled, or needs more information.\n- **Transparent roadmap.** Accepted features are tracked in Jira, and requesting\n teams have visibility into where their request stands.\n- **Proactive outreach.** When nimbus ships new components, variants, or patterns\n that affect product teams, we communicate the changes through release notes and\n the Slack channel. Teams shouldn't have to discover new capabilities by\n accident.\n- **Architecture support.** When product teams are building complex recipes,\n nimbus is available for guidance on accessibility, token usage, and API design.\n We want recipes to be good, whether or not they end up in the system.\n- **Figma/code parity.** The nimbus team maintains alignment between the Figma\n library and the coded component library. Discrepancies reported by product\n teams are treated as high-priority issues.\n\n## Real-world examples\n\nThese examples are drawn from actual patterns in commercetools codebases. They\nillustrate how the governance process applies to real decisions.\n\n### Recipe absorbed into the system\n\n**What happened:** The commerce-agents team needed to render LLM-generated\nmarkdown output in a nimbus-styled UI. They built `AssistantMessageMarkdown`, a\ncustom renderer using `react-markdown` that mapped each markdown element to\nindividual nimbus primitives (`Box`, `Text`, `Heading`, `Table`, etc.).\n\n**What the governance process would say:** This was the right call at the time.\nThe product team needed something now and built a recipe using nimbus ingredients.\nThe pattern proved broadly valuable, and nimbus later absorbed it into a\nfirst-class `Markdown` component in the core library.\n\n**What happens next:** The commerce-agents team migrates from their custom\nrenderer to the nimbus `Markdown` component. The recipe served its purpose and\ncan be retired.\n\n**Principle illustrated:** Slow core, fast surface. Own your recipes.\n\n### Where a conversation would have helped\n\n**What happened:** The commerce-agents intake team needed an alert component with\na left-border accent, inline action buttons, and dismissible status chips. The\nnimbus `Alert` component didn't support these patterns, so the team built a\ncustom `AlertBanner` from scratch using `Box`, `Flex`, `Stack`, `Text`, and\n`IconButton`.\n\n**What the governance process would say:** Before building from scratch, ask in\nthe nimbus Slack channel. The conversation might reveal that Alert can be\nextended to support these patterns (a feature request), or that the specific\nrequirements are domain-specific enough to justify a recipe. Either way, the\nnimbus team learns about the gap.\n\n**What the outcome could have been:** If the need is general enough, nimbus\nexpands the `Alert` API. If it's domain-specific, the recipe approach is\nconfirmed and the team builds it with confidence that they're not duplicating\nexisting functionality.\n\n**Principle illustrated:** Ask, don't assume. Collaborate early.\n\n### Discoverability gap\n\n**What happened:** The Merchant Center frontend team built `McpServerUrlInput`,\na read-only input with a copy-to-clipboard button, using raw clipboard API calls.\nNimbus already provides a `useCopyToClipboard` hook that handles clipboard\naccess, success/error states, and browser compatibility.\n\n**What the governance process would say:** A quick question in the nimbus Slack\nchannel (\"we need a copy-to-clipboard pattern, anything in nimbus for this?\")\nwould have surfaced the existing hook. The remaining question is whether a\ncomposed `CopyableInput` component is worth proposing as a feature\n(domain-agnostic, useful across products) or is better left as a recipe using the\nexisting hook.\n\n**Principle illustrated:** Ask, don't assume. System first.\n\n### Valid recipe\n\n**What happened:** The commerce-agents team built a shared `AgentChatPanel`\ncompound component for agent chat UIs. Later, the intake agent team found that\nthis shared panel didn't fit their interaction model (file uploads,\ndrag-and-drop, multi-screen editing, state machine orchestration). They built\ntheir own custom chat chrome.\n\n**What the governance process would say:** This is exactly right. The shared\n`AgentChatPanel` is itself a recipe within the commerce-agents product family.\nWhen a sibling team's requirements diverge enough that the recipe doesn't fit,\nbuilding a new recipe is the correct answer. Recipes aren't second-class; they're\nthe right tool when domain requirements diverge.\n\n**Principle illustrated:** Own your recipes.\n\n### The happy path\n\n**What happens:** Both the Merchant Center and commerce-agents teams use nimbus\n`DataTable`, `FormField`, `Dialog`, `Button`, and dozens of other components\nextensively and correctly. They import directly from `@commercetools/nimbus`, use\nsemantic tokens for styling, and compose compound components as designed.\n\n**What the governance process would say:** This is the default state the process\nexists to protect. The system provides what's needed, teams adopt it, and\neveryone moves forward. No governance overhead required.\n\n**Principle illustrated:** System first.\n\n## What's next\n\nThis document covers component and Figma governance. Token governance (proposing\nnew tokens, modifying existing ones) may be added as a follow-up once the core\nprocess is established.\n",
341
+ "views": {
342
+ "overview": {
343
+ "mdx": "\n# Nimbus Governance, Collaboration, and Ownership\n\n## Why this document exists\n\nDesign systems that do not clearly define governance tend to fail in one of two\nways, either they calcify because teams cannot get what they need so they stop\ntrying, or they fragment when teams build around the system and consistency\nslowly erodes. How do we — engineers, designers, decision-makers — all work\nwith/in nimbus without falling into these foreseeable traps?\n\nThis document's answer is to establish a lightweight, shared understanding\nof how we work together on nimbus: How to surface needs, how to decide what\nbelongs in the system, who owns what, and how product-level work feeds back into\nthe shared library. The goal is to keep nimbus **coherent** while keeping product\nteams **unblocked**.\n\nThis is an invitation to collaborate, not a set of rules imposed from above.\nNimbus exists to serve the products built on it, and the governance process\nexists to make that relationship work well for everyone.\n\n## Foundational principles\n\nFive principles guide how we make decisions together.\n\n### 1. System first\n\nIf nimbus provides a component, token, or pattern that solves the problem,\n**use it**. The design system exists to provide tested, accessible, consistent\nsolutions. Building a custom alternative when a system solution already exists\ncreates fragmentation, increases maintenance burden, and undermines the\nconsistency that nimbus is here to provide.\n\nDivergence from the system is an exception that requires justification, not a\nstarting position.\n\n### 2. Ask, don't assume\n\nBefore building something custom, check what already exists. The\n[documentation site](https://nimbus-documentation.vercel.app/home),\n[Storybook](https://nimbus-storybook.vercel.app), the\n[Figma library](https://www.figma.com/design/AvtPX6g7OGGCRvNlatGOIY/NIMBUS-design-system),\nand the\n[MCP server](https://nimbus-documentation.vercel.app/home/getting-started/mcp-server-overview)\nare all searchable entry points. If you're still unsure after checking, ask in\nthe #ask-nimbus-anything\n[Slack channel](https://commercetools.slack.com/archives/C0ACFBKAHTM), or open a\n[GitHub discussion](https://github.com/commercetools/nimbus/discussions).\n**Don't assume the answer is \"no\" and build around the system**.\n\nMany perceived \"gaps\" turn out to be discoverability problems that a quick search\nor a single message would resolve. Public questions also help other teams who\nhave the same question, and they help the nimbus team understand where\ndocumentation or discoverability needs improvement.\n\n### 3. Collaborate early\n\nWhen your team's work touches shared UI patterns or surfaces a potential nimbus\ngap, loop in the nimbus team early. A five-minute conversation at the start of a\nfeature is worth more than a thirty-minute review at the end. **Early alignment\nprevents drift; late alignment creates rework**.\n\nThe same applies within product teams: designers and engineers should be in\nconversation from the start of any UI work, not just at handoff.\n\n### 4. Slow core, fast surface\n\n**Nimbus moves slower than products, and that's intentional**. Quality,\naccessibility, and cross-product consistency require deliberate engineering. The\nsystem is infrastructure: it prioritizes durability over speed.\n\nProduct teams are the fast layer. They innovate, experiment, and ship on their\nown timelines. They should never be blocked waiting for nimbus. When the system\ncan't deliver what a product team needs right now, the product team builds what\nit needs (see principle 5) and the system catches up when the pattern is proven.\n\nBoth speeds are correct. The tension between them is productive, not a problem to\nsolve.\n\n### 5. Own your recipes\n\nCompositions of nimbus components built for domain-specific use cases belong to\nthe product team that built them. These are \"recipes\": they use nimbus\ningredients (tokens, primitives, components) but serve a specific product\ncontext.\n\n**Recipes are not second-class**. They are the correct answer when domain\nrequirements diverge from what a general-purpose system should provide. Nimbus\nprovides ingredients; products assemble meals.\n\n## Categorizing incoming work\n\nNot every request is the same kind of work. Categorizing what's being asked for\nhelps route it to the right people and set the right expectations. These\ncategories apply equally to code components and Figma library assets.\n\n### Bugs\n\nA nimbus component (code or Figma) doesn't work as documented.\n\n**Owner:** Nimbus team\n**Priority:** Urgent\n**Examples:** An accordion fails to expand. A color contrast violation in a\nnimbus component. A Figma component is missing an interactive state that the code\ncomponent supports.\n\nTeams won't trust or use a system that's broken. Bug reports are always welcome\nand always prioritized.\n\n### Design discrepancies\n\nA gap between the Figma library and the coded component library.\n\n**Owner:** Nimbus team investigates\n**Priority:** High\n**Examples:** A designer uses a Button variant in a mockup that doesn't exist in\ncode. A coded component supports a prop that has no Figma equivalent. A\ndesigner's mockup uses a pattern that looks like a nimbus component but differs\nin subtle ways.\n\nWhen a discrepancy is found, the first question is whether the mismatch is a bug\n(one side is out of date) or a signal that the component needs to evolve. The\nnimbus team investigates and resolves.\n\n### Features\n\nA new component, variant, or capability that belongs in nimbus.\n\n**Owner:** Nimbus team, after evaluation\n**Priority:** Roadmap\n**Examples:** A request for a CopyableInput component. A new variant of an\nexisting component that would benefit multiple products.\n\nFeatures go through the governance workflow described below. Not every feature\nrequest becomes a nimbus component; some are better served as recipes.\n\n### Recipes\n\nA composition of nimbus components built for a specific product domain.\n\n**Owner:** Product team\n**Priority:** Product team's call\n**Examples:** A chat message renderer. A domain-specific form layout. A custom\nstepper for a multi-step wizard embedded in a chat interface.\n\nRecipes live in the product repo, are maintained by the product team, and don't\nrequire nimbus team involvement (though the nimbus team is available for\nguidance). If a recipe proves valuable across multiple products, it can be\nproposed for promotion into the system.\n\n## Ownership boundaries\n\nThree tiers of UI code, with clear ownership at each level.\n\n### Nimbus core\n\n**Owned by:** Nimbus team\n\nTokens, primitives, components in\n[`@commercetools/nimbus`](https://github.com/commercetools/nimbus/tree/main/packages/nimbus),\nicons in\n[`@commercetools/nimbus-icons`](https://github.com/commercetools/nimbus/tree/main/packages/nimbus-icons),\nthe\n[Figma component library](https://www.figma.com/design/AvtPX6g7OGGCRvNlatGOIY/NIMBUS-design-system),\nand the\n[documentation site](https://nimbus-documentation.vercel.app/).\n\nThe nimbus team is responsible for:\n\n- API design\n- Accessibility\n- Cross-browser support\n- Performance\n- Figma/code parity\n- Documentation\n- Release management\n\nChanges to nimbus core follow the nimbus team's development process.\n\n### Shared product libraries\n\n**Owned by:** Product teams, with nimbus consulted\n\nLibraries that compose nimbus components to serve a specific product family. For\nexample,\n[`@commercetools-internal/commerce-agents-ui-components`](https://github.com/commercetools/commerce-agents/blob/main/shared/ui/components/package.json)\nprovides shared chat infrastructure for the commerce-agents product family.\n[`@commercetools/merchant-center-shared-ui`](https://github.com/commercetools/merchant-center-frontend/blob/main/packages-shared/ui/package.json)\nprovides shared patterns for the Merchant Center.\n\n**These libraries are maintained by the product teams that built them**. The\nnimbus team is available for architecture guidance, especially around\naccessibility and token usage, but does not maintain these packages just because\nit maintains nimbus core.\n\n### Application components\n\n**Owned by:** Product teams\n\nDomain-specific UI built from nimbus primitives for a single application. No\nnimbus team involvement is needed unless promoting a component to a higher tier.\n\n## Governance workflow\n\n### Does this belong in nimbus?\n\nWhen evaluating whether a component should live in nimbus core or remain a\nrecipe, ask four questions:\n\n1. **Is it domain-agnostic?** No business logic, no product-specific data\n shapes, no assumptions about the consuming application's context.\n2. **Would two or more unrelated products benefit from it?** If only one product\n needs it, it's a recipe.\n3. **Does it extend a nimbus primitive in a way that's generally useful?** A\n specialized variant of an existing component that serves a broad need is a\n stronger candidate than a novel pattern.\n4. **Is the API surface stable enough to commit to?** Nimbus components carry a\n maintenance and compatibility commitment. If the design is still evolving, it\n may be too early.\n\nIf all four answers are yes, it's a feature candidate. Otherwise, it's a recipe,\n**and that's fine**.\n\n<img\n src=\"/images/getting-started/governance-workflow.png\"\n alt=\"Governance workflow: identify a need, check existing resources, ask in Slack or GitHub, categorize as bug/discrepancy/feature/recipe, then route to nimbus team (bugs, discrepancies, features) or product team (recipes) for resolution\"\n width=\"100%\"\n/>\n\n### Step by step\n\n1. **Start with nimbus.** Check the\n [documentation site](https://nimbus-documentation.vercel.app/home),\n [Storybook](https://nimbus-storybook.vercel.app), the\n [Figma library](https://www.figma.com/design/AvtPX6g7OGGCRvNlatGOIY/NIMBUS-design-system),\n and the\n [MCP server](https://nimbus-documentation.vercel.app/home/getting-started/mcp-server-overview)\n for existing solutions.\n2. **If you're unsure, ask publicly.** Post in the #ask-nimbus-anything\n [Slack channel](https://commercetools.slack.com/archives/C0ACFBKAHTM) or open\n a\n [GitHub discussion](https://github.com/commercetools/nimbus/discussions)\n before assuming a gap exists. Describe what you're trying to accomplish, not\n the solution you have in mind.\n3. **Categorize together.** The nimbus team and the requester agree on whether\n the gap is a bug, design discrepancy, feature, or recipe. This is a\n conversation, not a form.\n4. **For bugs and design discrepancies:** the nimbus team triages and fixes,\n tracked in Jira. No additional process needed from the requesting team beyond\n reporting.\n5. **For features:** evaluate against the four ownership criteria. Open a\n [GitHub Issue](https://github.com/commercetools/nimbus/issues) using the\n feature proposal template, or start with a Slack conversation and\n formalize later. If the scope warrants a more detailed RFC, the teams decide\n together whether one is needed and who writes it. If nimbus can deliver on the\n product team's timeline, the nimbus team builds it. If not, the product team\n builds a recipe now, and nimbus absorbs the pattern when it's proven.\n6. **For recipes:** the product team builds it using nimbus tokens and\n primitives. The nimbus team is available for architecture guidance (especially\n around accessibility and token usage). The recipe lives in the product repo.\n7. **Promotion path:** if a recipe proves valuable across multiple products, it\n can be proposed as a feature through the same workflow. The nimbus team\n refactors it to meet system standards: API consistency, accessibility,\n cross-browser support, Figma parity, and documentation.\n\n## Figma governance\n\nThe Figma library is part of nimbus, and the same governance workflow applies. A\nfew additional notes for designers:\n\n- **Reporting Figma/code mismatches:** File as a design discrepancy via GitHub\n Issue. Include which component, what differs, and a screenshot.\n- **Proposing new Figma components:** Same feature flow as code. The nimbus team\n maintains Figma/code parity: a component accepted for code will get a Figma\n counterpart, and vice versa.\n- **Using Figma components not yet in code:** Treat as a design discrepancy. The\n nimbus team will evaluate whether to add the code implementation or update the\n Figma library.\n- **Custom Figma compositions:** Designers can build product-specific\n compositions in their own Figma files using nimbus library components. These\n are the design equivalent of code recipes: owned by the product team, built\n from system ingredients.\n\n## Collaboration guidelines\n\nPractical guidance for working with nimbus.\n\n- **Check, then ask, then build.** Before building a custom component, search\n the [docs](https://nimbus-documentation.vercel.app/home),\n [Storybook](https://nimbus-storybook.vercel.app), the\n [Figma library](https://www.figma.com/design/AvtPX6g7OGGCRvNlatGOIY/NIMBUS-design-system),\n and the\n [MCP server](https://nimbus-documentation.vercel.app/home/getting-started/mcp-server-overview).\n If you don't find what you need, ask in the #ask-nimbus-anything\n [Slack channel](https://commercetools.slack.com/archives/C0ACFBKAHTM). Build\n custom only after confirming no system solution exists. This applies to both\n engineers and designers.\n- **Involve both UX and engineering from the start.** Don't design in isolation\n and hand off, and don't build in isolation and ask for review. Bring designers\n and engineers together early, especially when the work touches shared patterns\n or might surface a nimbus gap.\n- **Use nimbus tokens, not hardcoded values.** Even in recipes, use\n `system.token()` or semantic color values. Hardcoded colors and spacing values\n create maintenance debt and break when themes change.\n- **Use nimbus primitives as building blocks.** Build recipes from `Box`,\n `Stack`, `Flex`, `Text`, and other nimbus layout components rather than raw\n HTML elements. This ensures consistent spacing, responsive behavior, and theme\n support.\n- **Don't fork nimbus components.** If a nimbus component doesn't work for your\n use case, that's a conversation to have (bug or feature request), not a reason\n to rebuild from scratch. Forking creates drift that's expensive to reconcile\n later.\n- **Architecture reviews for complex recipes.** Before building a large custom\n component, discuss the approach with the nimbus team. This helps ensure future\n promotability, avoids accessibility pitfalls, and surfaces opportunities to use\n existing nimbus capabilities you might not know about.\n- **When you diverge, document why.** If you intentionally deviate from a nimbus\n pattern, leave a brief note explaining the rationale. This helps future\n maintainers (and the nimbus team) understand whether the divergence was a\n deliberate design decision or an oversight.\n\n## What the nimbus team commits to\n\nThis process is a partnership. Here's what the nimbus team is responsible for:\n\n- **Responsive communication.** Questions in the #ask-nimbus-anything\n [Slack channel](https://commercetools.slack.com/archives/C0ACFBKAHTM) get a\n timely response. If we don't have an immediate answer, we'll acknowledge the\n question and follow up.\n- **Triage and acknowledgment.** Bug reports and feature proposals filed as\n [GitHub Issues](https://github.com/commercetools/nimbus/issues) are triaged\n and acknowledged promptly. You'll know whether your report is being\n investigated, scheduled, or needs more information.\n- **Transparent roadmap.** Accepted features are tracked in Jira, and requesting\n teams have visibility into where their request stands.\n- **Proactive outreach.** When nimbus ships new components, variants, or patterns\n that affect product teams, we communicate the changes through release notes and\n the Slack channel. Teams shouldn't have to discover new capabilities by\n accident.\n- **Architecture support.** When product teams are building complex recipes,\n nimbus is available for guidance on accessibility, token usage, and API design.\n We want recipes to be good, whether or not they end up in the system.\n- **Figma/code parity.** The nimbus team maintains alignment between the Figma\n library and the coded component library. Discrepancies reported by product\n teams are treated as high-priority issues.\n\n## Real-world examples\n\nThese examples are drawn from actual patterns in commercetools codebases. They\nillustrate how the governance process applies to real decisions.\n\n### Recipe absorbed into the system\n\n**What happened:** The commerce-agents team needed to render LLM-generated\nmarkdown output in a nimbus-styled UI. They built `AssistantMessageMarkdown`, a\ncustom renderer using `react-markdown` that mapped each markdown element to\nindividual nimbus primitives (`Box`, `Text`, `Heading`, `Table`, etc.).\n\n**What the governance process would say:** This was the right call at the time.\nThe product team needed something now and built a recipe using nimbus ingredients.\nThe pattern proved broadly valuable, and nimbus later absorbed it into a\nfirst-class `Markdown` component in the core library.\n\n**What happens next:** The commerce-agents team migrates from their custom\nrenderer to the nimbus `Markdown` component. The recipe served its purpose and\ncan be retired.\n\n**Principle illustrated:** Slow core, fast surface. Own your recipes.\n\n### Where a conversation would have helped\n\n**What happened:** The commerce-agents intake team needed an alert component with\na left-border accent, inline action buttons, and dismissible status chips. The\nnimbus `Alert` component didn't support these patterns, so the team built a\ncustom `AlertBanner` from scratch using `Box`, `Flex`, `Stack`, `Text`, and\n`IconButton`.\n\n**What the governance process would say:** Before building from scratch, ask in\nthe nimbus Slack channel. The conversation might reveal that Alert can be\nextended to support these patterns (a feature request), or that the specific\nrequirements are domain-specific enough to justify a recipe. Either way, the\nnimbus team learns about the gap.\n\n**What the outcome could have been:** If the need is general enough, nimbus\nexpands the `Alert` API. If it's domain-specific, the recipe approach is\nconfirmed and the team builds it with confidence that they're not duplicating\nexisting functionality.\n\n**Principle illustrated:** Ask, don't assume. Collaborate early.\n\n### Discoverability gap\n\n**What happened:** The Merchant Center frontend team built `McpServerUrlInput`,\na read-only input with a copy-to-clipboard button, using raw clipboard API calls.\nNimbus already provides a `useCopyToClipboard` hook that handles clipboard\naccess, success/error states, and browser compatibility.\n\n**What the governance process would say:** A quick question in the nimbus Slack\nchannel (\"we need a copy-to-clipboard pattern, anything in nimbus for this?\")\nwould have surfaced the existing hook. The remaining question is whether a\ncomposed `CopyableInput` component is worth proposing as a feature\n(domain-agnostic, useful across products) or is better left as a recipe using the\nexisting hook.\n\n**Principle illustrated:** Ask, don't assume. System first.\n\n### Valid recipe\n\n**What happened:** The commerce-agents team built a shared `AgentChatPanel`\ncompound component for agent chat UIs. Later, the intake agent team found that\nthis shared panel didn't fit their interaction model (file uploads,\ndrag-and-drop, multi-screen editing, state machine orchestration). They built\ntheir own custom chat chrome.\n\n**What the governance process would say:** This is exactly right. The shared\n`AgentChatPanel` is itself a recipe within the commerce-agents product family.\nWhen a sibling team's requirements diverge enough that the recipe doesn't fit,\nbuilding a new recipe is the correct answer. Recipes aren't second-class; they're\nthe right tool when domain requirements diverge.\n\n**Principle illustrated:** Own your recipes.\n\n### The happy path\n\n**What happens:** Both the Merchant Center and commerce-agents teams use nimbus\n`DataTable`, `FormField`, `Dialog`, `Button`, and dozens of other components\nextensively and correctly. They import directly from `@commercetools/nimbus`, use\nsemantic tokens for styling, and compose compound components as designed.\n\n**What the governance process would say:** This is the default state the process\nexists to protect. The system provides what's needed, teams adopt it, and\neveryone moves forward. No governance overhead required.\n\n**Principle illustrated:** System first.\n\n## What's next\n\nThis document covers component and Figma governance. Token governance (proposing\nnew tokens, modifying existing ones) may be added as a follow-up once the core\nprocess is established.\n",
344
+ "toc": [
345
+ {
346
+ "value": "Why this document exists",
347
+ "href": "#why-this-document-exists",
348
+ "depth": 2,
349
+ "numbering": [
350
+ 1,
351
+ 1
352
+ ],
353
+ "parent": "root"
354
+ },
355
+ {
356
+ "value": "Foundational principles",
357
+ "href": "#foundational-principles",
358
+ "depth": 2,
359
+ "numbering": [
360
+ 1,
361
+ 2
362
+ ],
363
+ "parent": "root"
364
+ },
365
+ {
366
+ "value": "1. System first",
367
+ "href": "#1-system-first",
368
+ "depth": 3,
369
+ "numbering": [
370
+ 1,
371
+ 2,
372
+ 1
373
+ ],
374
+ "parent": "root"
375
+ },
376
+ {
377
+ "value": "2. Ask, don't assume",
378
+ "href": "#2-ask-dont-assume",
379
+ "depth": 3,
380
+ "numbering": [
381
+ 1,
382
+ 2,
383
+ 2
384
+ ],
385
+ "parent": "root"
386
+ },
387
+ {
388
+ "value": "3. Collaborate early",
389
+ "href": "#3-collaborate-early",
390
+ "depth": 3,
391
+ "numbering": [
392
+ 1,
393
+ 2,
394
+ 3
395
+ ],
396
+ "parent": "root"
397
+ },
398
+ {
399
+ "value": "4. Slow core, fast surface",
400
+ "href": "#4-slow-core-fast-surface",
401
+ "depth": 3,
402
+ "numbering": [
403
+ 1,
404
+ 2,
405
+ 4
406
+ ],
407
+ "parent": "root"
408
+ },
409
+ {
410
+ "value": "5. Own your recipes",
411
+ "href": "#5-own-your-recipes",
412
+ "depth": 3,
413
+ "numbering": [
414
+ 1,
415
+ 2,
416
+ 5
417
+ ],
418
+ "parent": "root"
419
+ },
420
+ {
421
+ "value": "Categorizing incoming work",
422
+ "href": "#categorizing-incoming-work",
423
+ "depth": 2,
424
+ "numbering": [
425
+ 1,
426
+ 3
427
+ ],
428
+ "parent": "root"
429
+ },
430
+ {
431
+ "value": "Bugs",
432
+ "href": "#bugs",
433
+ "depth": 3,
434
+ "numbering": [
435
+ 1,
436
+ 3,
437
+ 1
438
+ ],
439
+ "parent": "root"
440
+ },
441
+ {
442
+ "value": "Design discrepancies",
443
+ "href": "#design-discrepancies",
444
+ "depth": 3,
445
+ "numbering": [
446
+ 1,
447
+ 3,
448
+ 2
449
+ ],
450
+ "parent": "root"
451
+ },
452
+ {
453
+ "value": "Features",
454
+ "href": "#features",
455
+ "depth": 3,
456
+ "numbering": [
457
+ 1,
458
+ 3,
459
+ 3
460
+ ],
461
+ "parent": "root"
462
+ },
463
+ {
464
+ "value": "Recipes",
465
+ "href": "#recipes",
466
+ "depth": 3,
467
+ "numbering": [
468
+ 1,
469
+ 3,
470
+ 4
471
+ ],
472
+ "parent": "root"
473
+ },
474
+ {
475
+ "value": "Ownership boundaries",
476
+ "href": "#ownership-boundaries",
477
+ "depth": 2,
478
+ "numbering": [
479
+ 1,
480
+ 4
481
+ ],
482
+ "parent": "root"
483
+ },
484
+ {
485
+ "value": "Nimbus core",
486
+ "href": "#nimbus-core",
487
+ "depth": 3,
488
+ "numbering": [
489
+ 1,
490
+ 4,
491
+ 1
492
+ ],
493
+ "parent": "root"
494
+ },
495
+ {
496
+ "value": "Shared product libraries",
497
+ "href": "#shared-product-libraries",
498
+ "depth": 3,
499
+ "numbering": [
500
+ 1,
501
+ 4,
502
+ 2
503
+ ],
504
+ "parent": "root"
505
+ },
506
+ {
507
+ "value": "Application components",
508
+ "href": "#application-components",
509
+ "depth": 3,
510
+ "numbering": [
511
+ 1,
512
+ 4,
513
+ 3
514
+ ],
515
+ "parent": "root"
516
+ },
517
+ {
518
+ "value": "Governance workflow",
519
+ "href": "#governance-workflow",
520
+ "depth": 2,
521
+ "numbering": [
522
+ 1,
523
+ 5
524
+ ],
525
+ "parent": "root"
526
+ },
527
+ {
528
+ "value": "Does this belong in nimbus?",
529
+ "href": "#does-this-belong-in-nimbus",
530
+ "depth": 3,
531
+ "numbering": [
532
+ 1,
533
+ 5,
534
+ 1
535
+ ],
536
+ "parent": "root"
537
+ },
538
+ {
539
+ "value": "Step by step",
540
+ "href": "#step-by-step",
541
+ "depth": 3,
542
+ "numbering": [
543
+ 1,
544
+ 5,
545
+ 2
546
+ ],
547
+ "parent": "root"
548
+ },
549
+ {
550
+ "value": "Figma governance",
551
+ "href": "#figma-governance",
552
+ "depth": 2,
553
+ "numbering": [
554
+ 1,
555
+ 6
556
+ ],
557
+ "parent": "root"
558
+ },
559
+ {
560
+ "value": "Collaboration guidelines",
561
+ "href": "#collaboration-guidelines",
562
+ "depth": 2,
563
+ "numbering": [
564
+ 1,
565
+ 7
566
+ ],
567
+ "parent": "root"
568
+ },
569
+ {
570
+ "value": "What the nimbus team commits to",
571
+ "href": "#what-the-nimbus-team-commits-to",
572
+ "depth": 2,
573
+ "numbering": [
574
+ 1,
575
+ 8
576
+ ],
577
+ "parent": "root"
578
+ },
579
+ {
580
+ "value": "Real-world examples",
581
+ "href": "#real-world-examples",
582
+ "depth": 2,
583
+ "numbering": [
584
+ 1,
585
+ 9
586
+ ],
587
+ "parent": "root"
588
+ },
589
+ {
590
+ "value": "Recipe absorbed into the system",
591
+ "href": "#recipe-absorbed-into-the-system",
592
+ "depth": 3,
593
+ "numbering": [
594
+ 1,
595
+ 9,
596
+ 1
597
+ ],
598
+ "parent": "root"
599
+ },
600
+ {
601
+ "value": "Where a conversation would have helped",
602
+ "href": "#where-a-conversation-would-have-helped",
603
+ "depth": 3,
604
+ "numbering": [
605
+ 1,
606
+ 9,
607
+ 2
608
+ ],
609
+ "parent": "root"
610
+ },
611
+ {
612
+ "value": "Discoverability gap",
613
+ "href": "#discoverability-gap",
614
+ "depth": 3,
615
+ "numbering": [
616
+ 1,
617
+ 9,
618
+ 3
619
+ ],
620
+ "parent": "root"
621
+ },
622
+ {
623
+ "value": "Valid recipe",
624
+ "href": "#valid-recipe",
625
+ "depth": 3,
626
+ "numbering": [
627
+ 1,
628
+ 9,
629
+ 4
630
+ ],
631
+ "parent": "root"
632
+ },
633
+ {
634
+ "value": "The happy path",
635
+ "href": "#the-happy-path",
636
+ "depth": 3,
637
+ "numbering": [
638
+ 1,
639
+ 9,
640
+ 5
641
+ ],
642
+ "parent": "root"
643
+ },
644
+ {
645
+ "value": "What's next",
646
+ "href": "#whats-next",
647
+ "depth": 2,
648
+ "numbering": [
649
+ 1,
650
+ 10
651
+ ],
652
+ "parent": "root"
653
+ }
654
+ ]
655
+ }
656
+ }
657
+ }