@supersoniks/concorde 5.1.1 → 5.1.3-immutable.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.
Files changed (459) hide show
  1. package/.agents/skills/concorde-docs/SKILL.md +153 -0
  2. package/.agents/skills/{concorde-component-docs/template.md → concorde-docs/templates/component.md} +6 -2
  3. package/.agents/skills/concorde-docs/templates/decorator.md +43 -0
  4. package/.agents/skills/concorde-docs/templates/guide.md +25 -0
  5. package/.claude/skills +1 -0
  6. package/.github/workflows/ci.yml +21 -0
  7. package/.github-export-ignore +30 -0
  8. package/CONTRIBUTING.md +59 -0
  9. package/DEV.md +54 -0
  10. package/LICENSE +21 -0
  11. package/OPEN_SOURCE_CHECKPOINT.md +133 -0
  12. package/README.md +4 -4
  13. package/ai/README.md +29 -41
  14. package/ai/skills/concorde/SKILL.md +54 -324
  15. package/ai/skills/concorde/rules/composition.md +32 -0
  16. package/ai/skills/concorde/rules/data.md +47 -0
  17. package/ai/skills/concorde/rules/http.md +25 -0
  18. package/ai/skills/concorde/rules/lists-forms.md +35 -0
  19. package/ai/skills/concorde/rules/styling.md +46 -0
  20. package/ai/skills/concorde/rules/troubleshooting.md +45 -0
  21. package/build-infos.json +1 -1
  22. package/concorde-core.bundle.js +177 -177
  23. package/concorde-core.es.js +4993 -4833
  24. package/custom-elements-manifest.public.config.mjs +8 -0
  25. package/{.tmp-cem/custom-elements.json → custom-elements.json} +11758 -8904
  26. package/dist/concorde-core.bundle.js +177 -177
  27. package/dist/concorde-core.es.js +4993 -4833
  28. package/dist/docs-mock-api-sw.js +58 -223
  29. package/dist/docs-mock-api-sw.js.map +4 -4
  30. package/dist/img/concorde/plane_01.jpg +0 -0
  31. package/dist/img/concorde/plane_02.jpg +0 -0
  32. package/dist/img/concorde/plane_03.jpg +0 -0
  33. package/dist/img/concorde/plane_04.jpg +0 -0
  34. package/dist/img/concorde/plane_05.jpg +0 -0
  35. package/dist/img/concorde/plane_06.jpg +0 -0
  36. package/dist/img/concorde/plane_07.jpg +0 -0
  37. package/dist/img/concorde/plane_08.jpg +0 -0
  38. package/dist/img/concorde/plane_09.jpg +0 -0
  39. package/dist/img/concorde/plane_10.jpg +0 -0
  40. package/dist/img/concorde/plane_11.jpg +0 -0
  41. package/dist/img/concorde/plane_12.jpg +0 -0
  42. package/dist/img/concorde/plane_13.jpg +0 -0
  43. package/dist/img/og-concorde.jpg +0 -0
  44. package/dist/robots.txt +11 -10
  45. package/docs/assets/index-D_alEsng.js +12122 -0
  46. package/docs/crawl/core/components/functional/date/date.html +190 -0
  47. package/docs/crawl/core/components/functional/fetch/fetch.html +109 -0
  48. package/docs/crawl/core/components/functional/if/if.html +27 -0
  49. package/docs/crawl/core/components/functional/jsonata/jsonata.html +79 -0
  50. package/docs/crawl/core/components/functional/list/list.html +70 -0
  51. package/docs/crawl/core/components/functional/mix/mix.html +45 -0
  52. package/docs/crawl/core/components/functional/queue/queue.html +96 -0
  53. package/docs/crawl/core/components/functional/router/router.html +106 -0
  54. package/docs/crawl/core/components/functional/sdui/sdui-extension-points.html +126 -0
  55. package/docs/crawl/core/components/functional/sdui/sdui.html +368 -0
  56. package/docs/crawl/core/components/functional/states/states.html +66 -0
  57. package/docs/crawl/core/components/functional/submit/submit.html +160 -0
  58. package/docs/crawl/core/components/functional/subscriber/subscriber.html +67 -0
  59. package/docs/crawl/core/components/functional/value/value.html +51 -0
  60. package/docs/crawl/core/components/ui/alert/alert.html +211 -0
  61. package/docs/crawl/core/components/ui/alert-messages/alert-messages.html +131 -0
  62. package/docs/crawl/core/components/ui/badge/badge.html +197 -0
  63. package/docs/crawl/core/components/ui/button/button.html +150 -0
  64. package/docs/crawl/core/components/ui/captcha/captcha.html +112 -0
  65. package/docs/crawl/core/components/ui/card/card.html +253 -0
  66. package/docs/crawl/core/components/ui/divider/divider.html +144 -0
  67. package/docs/crawl/core/components/ui/form/checkbox/checkbox.html +73 -0
  68. package/docs/crawl/core/components/ui/form/fieldset/fieldset.html +266 -0
  69. package/docs/crawl/core/components/ui/form/form-actions/form-actions.html +122 -0
  70. package/docs/crawl/core/components/ui/form/form-layout/form-layout.html +121 -0
  71. package/docs/crawl/core/components/ui/form/input/input.html +109 -0
  72. package/docs/crawl/core/components/ui/form/input-autocomplete/input-autocomplete.html +38 -0
  73. package/docs/crawl/core/components/ui/form/radio/radio.html +56 -0
  74. package/docs/crawl/core/components/ui/form/select/select.html +73 -0
  75. package/docs/crawl/core/components/ui/form/switch/switch.html +56 -0
  76. package/docs/crawl/core/components/ui/form/textarea/textarea.html +59 -0
  77. package/docs/crawl/core/components/ui/group/group.html +104 -0
  78. package/docs/crawl/core/components/ui/icon/icon.html +222 -0
  79. package/docs/crawl/core/components/ui/image/image.html +298 -0
  80. package/docs/crawl/core/components/ui/link/link.html +100 -0
  81. package/docs/crawl/core/components/ui/loader/loader.html +124 -0
  82. package/docs/crawl/core/components/ui/menu/menu.html +394 -0
  83. package/docs/crawl/core/components/ui/modal/modal.html +342 -0
  84. package/docs/crawl/core/components/ui/pop/pop.html +296 -0
  85. package/docs/crawl/core/components/ui/progress/progress.html +131 -0
  86. package/docs/crawl/core/components/ui/table/table.html +545 -0
  87. package/docs/crawl/core/components/ui/theme/theme.html +131 -0
  88. package/docs/crawl/core/components/ui/toast/toast.html +233 -0
  89. package/docs/crawl/core/components/ui/tooltip/tooltip.html +140 -0
  90. package/docs/crawl/docs/_core-concept/dataFlow.html +177 -0
  91. package/docs/crawl/docs/_core-concept/overview.html +66 -0
  92. package/docs/crawl/docs/_core-concept/subscriber.html +75 -0
  93. package/docs/crawl/docs/_decorators/ancestor-attribute.html +117 -0
  94. package/docs/crawl/docs/_decorators/auto-subscribe.html +202 -0
  95. package/docs/crawl/docs/_decorators/bind.html +141 -0
  96. package/docs/crawl/docs/_decorators/get.html +149 -0
  97. package/docs/crawl/docs/_decorators/handle.html +165 -0
  98. package/docs/crawl/docs/_decorators/on-assign.html +355 -0
  99. package/docs/crawl/docs/_decorators/patch.html +78 -0
  100. package/docs/crawl/docs/_decorators/post.html +139 -0
  101. package/docs/crawl/docs/_decorators/publish.html +61 -0
  102. package/docs/crawl/docs/_decorators/put.html +78 -0
  103. package/docs/crawl/docs/_decorators/subscribe.html +109 -0
  104. package/docs/crawl/docs/_decorators/wait-for-ancestors.html +137 -0
  105. package/docs/crawl/docs/_directives/sub.html +93 -0
  106. package/docs/crawl/docs/_getting-started/ai-agents.html +173 -0
  107. package/docs/crawl/docs/_getting-started/concorde-manual-install.html +100 -0
  108. package/docs/crawl/docs/_getting-started/concorde-outside.html +58 -0
  109. package/docs/crawl/docs/_getting-started/create-a-component.html +111 -0
  110. package/docs/crawl/docs/_getting-started/my-first-component.html +189 -0
  111. package/docs/crawl/docs/_getting-started/my-first-subscriber.html +110 -0
  112. package/docs/crawl/docs/_getting-started/pubsub.html +62 -0
  113. package/docs/crawl/docs/_getting-started/start.html +76 -0
  114. package/docs/crawl/docs/_getting-started/theming.html +333 -0
  115. package/docs/crawl/docs/_misc/api-configuration.html +149 -0
  116. package/docs/crawl/docs/_misc/dataProviderKey.html +135 -0
  117. package/docs/crawl/docs/_misc/docs-mock-api.html +158 -0
  118. package/docs/crawl/docs/_misc/dynamic-path.html +180 -0
  119. package/docs/crawl/docs/_misc/endpoint.html +50 -0
  120. package/docs/crawl/docs/_misc/formelement-subscriber-removal.html +138 -0
  121. package/docs/crawl/docs/_misc/html-integration.html +48 -0
  122. package/docs/crawl/hubs/decorators.html +547 -0
  123. package/docs/crawl/hubs/form-components.html +381 -0
  124. package/docs/crawl/hubs/remote-data.html +452 -0
  125. package/docs/crawl/index.html +103 -0
  126. package/docs/index.html +1 -1
  127. package/docs/llms-full.txt +7174 -0
  128. package/docs/llms.txt +98 -0
  129. package/docs/sitemap.xml +243 -0
  130. package/docs/src/core/components/functional/date/date.md +290 -0
  131. package/docs/src/core/components/functional/fetch/fetch.md +125 -0
  132. package/docs/src/core/components/functional/if/if.md +9 -0
  133. package/docs/src/core/components/functional/jsonata/jsonata.md +56 -0
  134. package/docs/src/core/components/functional/list/list.md +65 -0
  135. package/docs/src/core/components/functional/mix/mix.md +41 -0
  136. package/docs/src/core/components/functional/queue/queue.md +72 -0
  137. package/docs/src/core/components/functional/router/router.md +94 -0
  138. package/docs/src/core/components/functional/sdui/component-catalog.gaps.json +511 -0
  139. package/docs/src/core/components/functional/sdui/component-catalog.json +3103 -0
  140. package/docs/src/core/components/functional/sdui/default-library.json +108 -0
  141. package/docs/src/core/components/functional/sdui/example.json +99 -0
  142. package/docs/src/core/components/functional/sdui/sdui-extension-points.md +94 -0
  143. package/docs/src/core/components/functional/sdui/sdui.md +478 -0
  144. package/docs/src/core/components/functional/states/states.md +87 -0
  145. package/docs/src/core/components/functional/submit/submit.md +114 -0
  146. package/docs/src/core/components/functional/subscriber/subscriber.md +91 -0
  147. package/docs/src/core/components/functional/value/value.md +35 -0
  148. package/docs/src/core/components/ui/alert/alert.md +196 -0
  149. package/docs/src/core/components/ui/alert-messages/alert-messages.md +85 -0
  150. package/docs/src/core/components/ui/badge/badge.md +188 -0
  151. package/docs/src/core/components/ui/button/button.md +183 -0
  152. package/docs/src/core/components/ui/captcha/captcha.md +71 -0
  153. package/docs/src/core/components/ui/card/card.md +215 -0
  154. package/docs/src/core/components/ui/divider/divider.md +129 -0
  155. package/docs/src/core/components/ui/form/checkbox/checkbox.md +77 -0
  156. package/docs/src/core/components/ui/form/fieldset/fieldset.md +205 -0
  157. package/docs/src/core/components/ui/form/form-actions/form-actions.md +100 -0
  158. package/docs/src/core/components/ui/form/form-layout/form-layout.md +119 -0
  159. package/docs/src/core/components/ui/form/input/input.md +142 -0
  160. package/docs/src/core/components/ui/form/radio/radio.md +57 -0
  161. package/docs/src/core/components/ui/form/select/select.md +71 -0
  162. package/docs/src/core/components/ui/form/switch/switch.md +57 -0
  163. package/docs/src/core/components/ui/form/textarea/textarea.md +65 -0
  164. package/docs/src/core/components/ui/group/group.md +75 -0
  165. package/docs/src/core/components/ui/icon/icon.md +214 -0
  166. package/docs/src/core/components/ui/icon/icons.json +1 -0
  167. package/docs/src/core/components/ui/image/image.md +233 -0
  168. package/docs/src/core/components/ui/link/link.md +81 -0
  169. package/docs/src/core/components/ui/loader/loader.md +112 -0
  170. package/docs/src/core/components/ui/menu/menu.md +370 -0
  171. package/docs/src/core/components/ui/modal/modal.md +235 -0
  172. package/docs/src/core/components/ui/pop/pop.md +294 -0
  173. package/docs/src/core/components/ui/progress/progress.md +109 -0
  174. package/docs/src/core/components/ui/table/table.md +431 -0
  175. package/docs/src/core/components/ui/theme/theme.md +122 -0
  176. package/docs/src/core/components/ui/toast/toast.md +216 -0
  177. package/docs/src/core/components/ui/tooltip/tooltip.md +124 -0
  178. package/{src → docs/src}/docs/_core-concept/subscriber.md +0 -0
  179. package/{src → docs/src}/docs/_getting-started/my-first-subscriber.md +0 -0
  180. package/{src → docs/src}/docs/_getting-started/pubsub.md +0 -0
  181. package/docs/src/docs/_getting-started/theming.md +253 -0
  182. package/docs/src/docs/search/docs-search.json +12242 -0
  183. package/docs/src/tag-list.json +1 -0
  184. package/docs/src/tsconfig-model.json +23 -0
  185. package/docs/src/tsconfig.declarations.json +22 -0
  186. package/docs/src/tsconfig.emit.json +23 -0
  187. package/docs/src/tsconfig.json +1332 -0
  188. package/gitlab/job_github_mirror.sh +39 -0
  189. package/index.html +157 -5
  190. package/package.json +22 -4
  191. package/public/docs-mock-api-sw.js +58 -223
  192. package/public/docs-mock-api-sw.js.map +4 -4
  193. package/public/img/concorde/plane_01.jpg +0 -0
  194. package/public/img/concorde/plane_02.jpg +0 -0
  195. package/public/img/concorde/plane_03.jpg +0 -0
  196. package/public/img/concorde/plane_04.jpg +0 -0
  197. package/public/img/concorde/plane_05.jpg +0 -0
  198. package/public/img/concorde/plane_06.jpg +0 -0
  199. package/public/img/concorde/plane_07.jpg +0 -0
  200. package/public/img/concorde/plane_08.jpg +0 -0
  201. package/public/img/concorde/plane_09.jpg +0 -0
  202. package/public/img/concorde/plane_10.jpg +0 -0
  203. package/public/img/concorde/plane_11.jpg +0 -0
  204. package/public/img/concorde/plane_12.jpg +0 -0
  205. package/public/img/concorde/plane_13.jpg +0 -0
  206. package/public/img/og-concorde.jpg +0 -0
  207. package/public/robots.txt +11 -10
  208. package/scripts/ai-init.mjs +104 -379
  209. package/scripts/ai-init.test.mjs +81 -239
  210. package/scripts/docs-markdown-vite-plugin.ts +43 -0
  211. package/scripts/docs-public-url.mjs +56 -0
  212. package/scripts/docs.htaccess +82 -0
  213. package/scripts/generate-cem.mjs +244 -0
  214. package/scripts/generate-cem.test.mjs +122 -0
  215. package/scripts/generate-crawl-docs.mjs +233 -118
  216. package/scripts/generate-crawl-docs.test.mjs +124 -0
  217. package/scripts/generate-sdui-catalog.mjs +11 -10
  218. package/scripts/github-export.mjs +150 -0
  219. package/scripts/post-build-docs.js +37 -50
  220. package/scripts/post-build.mjs +0 -0
  221. package/scripts/pre-publish.mjs +2 -1
  222. package/scripts/site-pages.mjs +212 -0
  223. package/scripts/site-pages.test.mjs +116 -0
  224. package/site-pages/about.md +22 -0
  225. package/site-pages/privacy.md +32 -0
  226. package/src/core/components/functional/date/date.md +91 -231
  227. package/src/core/components/functional/example/example.ts +3 -1
  228. package/src/core/components/functional/fetch/fetch.md +66 -83
  229. package/src/core/components/functional/if/if.md +28 -3
  230. package/src/core/components/functional/if/if.ts +0 -0
  231. package/src/core/components/functional/jsonata/jsonata.md +42 -37
  232. package/src/core/components/functional/list/list.demo.ts +0 -0
  233. package/src/core/components/functional/list/list.md +103 -43
  234. package/src/core/components/functional/list/list.ts +17 -4
  235. package/src/core/components/functional/mix/mix.md +31 -26
  236. package/src/core/components/functional/queue/queue.demo.ts +10 -7
  237. package/src/core/components/functional/queue/queue.md +40 -61
  238. package/src/core/components/functional/router/router.demo.ts +16 -16
  239. package/src/core/components/functional/router/router.md +64 -65
  240. package/src/core/components/functional/router/router.ts +0 -0
  241. package/src/core/components/functional/sdui/SDUIDescriptorTransformer.ts +0 -0
  242. package/src/core/components/functional/sdui/component-catalog.gaps.json +1 -1
  243. package/src/core/components/functional/sdui/component-catalog.json +2 -2
  244. package/src/core/components/functional/sdui/example.json +19 -86
  245. package/src/core/components/functional/sdui/sdui-extension-points.md +1 -1
  246. package/src/core/components/functional/sdui/sdui-immutable.spec.ts +74 -0
  247. package/src/core/components/functional/sdui/sdui.md +187 -358
  248. package/src/core/components/functional/sdui/sdui.ts +33 -8
  249. package/src/core/components/functional/sdui/types.ts +0 -0
  250. package/src/core/components/functional/states/states.demo.ts +21 -22
  251. package/src/core/components/functional/states/states.md +86 -61
  252. package/src/core/components/functional/states/states.ts +1 -1
  253. package/src/core/components/functional/submit/submit.md +64 -72
  254. package/src/core/components/functional/submit/submit.spec.ts +60 -0
  255. package/src/core/components/functional/submit/submit.ts +6 -3
  256. package/src/core/components/functional/subscriber/subscriber.ts +0 -0
  257. package/src/core/components/functional/translation/translation.md +38 -0
  258. package/src/core/components/functional/value/value.md +34 -22
  259. package/src/core/components/functional/value/value.ts +0 -0
  260. package/src/core/components/ui/_css/size.ts +0 -0
  261. package/src/core/components/ui/alert/alert.md +48 -58
  262. package/src/core/components/ui/badge/badge.md +27 -34
  263. package/src/core/components/ui/button/button.md +139 -106
  264. package/src/core/components/ui/captcha/altchaStyles.ts +0 -0
  265. package/src/core/components/ui/captcha/captcha.md +17 -32
  266. package/src/core/components/ui/card/card.md +6 -6
  267. package/src/core/components/ui/divider/divider.md +8 -11
  268. package/src/core/components/ui/form/checkbox/checkbox.md +90 -42
  269. package/src/core/components/ui/form/fieldset/fieldset.md +31 -75
  270. package/src/core/components/ui/form/form-actions/form-actions.md +14 -16
  271. package/src/core/components/ui/form/form-layout/form-layout.md +19 -29
  272. package/src/core/components/ui/form/input/input.md +108 -90
  273. package/src/core/components/ui/form/input/input.ts +8 -2
  274. package/src/core/components/ui/form/radio/radio.md +65 -30
  275. package/src/core/components/ui/form/select/select.md +60 -45
  276. package/src/core/components/ui/form/switch/switch.md +57 -34
  277. package/src/core/components/ui/form/textarea/textarea.md +55 -38
  278. package/src/core/components/ui/group/group.md +35 -33
  279. package/src/core/components/ui/icon/icon.md +4 -4
  280. package/src/core/components/ui/image/image.md +41 -107
  281. package/src/core/components/ui/link/link.md +6 -6
  282. package/src/core/components/ui/loader/loader.md +30 -55
  283. package/src/core/components/ui/menu/menu.md +27 -27
  284. package/src/core/components/ui/modal/modal.md +72 -96
  285. package/src/core/components/ui/pop/pop.md +80 -158
  286. package/src/core/components/ui/progress/progress.md +2 -2
  287. package/src/core/components/ui/table/table.md +91 -255
  288. package/src/core/components/ui/theme/theme.md +11 -36
  289. package/src/core/components/ui/toast/toast.md +48 -117
  290. package/src/core/components/ui/tooltip/tooltip.md +27 -62
  291. package/src/core/decorators/subscriber/bind.ts +9 -14
  292. package/src/core/decorators/subscriber/subscribe.ts +15 -9
  293. package/src/core/decorators/subscriber/subscribe.type-test.ts +14 -5
  294. package/src/core/mixins/Subscriber.ts +0 -0
  295. package/src/core/utils/DataBindObserver.ts +0 -0
  296. package/src/core/utils/LocationHandler.spec.ts +80 -0
  297. package/src/core/utils/LocationHandler.ts +5 -9
  298. package/src/core/utils/Objects.ts +0 -0
  299. package/src/core/utils/PublisherProxy.ts +166 -125
  300. package/src/core/utils/deepReadonly.spec.ts +66 -0
  301. package/src/core/utils/deepReadonly.ts +71 -0
  302. package/src/core/utils/immutableValue.spec.ts +54 -0
  303. package/src/core/utils/immutableValue.ts +102 -0
  304. package/src/core/utils/nestedDotForm.spec.ts +88 -0
  305. package/src/core/utils/publisherImmutable.spec.ts +76 -0
  306. package/src/core/utils/route.ts +0 -0
  307. package/src/core/utils/strictGet.spec.ts +61 -0
  308. package/src/core/utils/strictGet.ts +102 -0
  309. package/src/css.d.ts +19 -0
  310. package/src/docs/components/docs-demo-sources.ts +55 -140
  311. package/src/docs/components/docs-lit-demo.ts +1 -3
  312. package/src/docs/components/docs-source-link.ts +0 -82
  313. package/src/docs/decorators/ancestor-attribute.md +59 -0
  314. package/src/docs/decorators/auto-subscribe.md +40 -0
  315. package/src/docs/decorators/bind.md +76 -0
  316. package/src/docs/decorators/get.md +160 -0
  317. package/src/docs/decorators/handle.md +119 -0
  318. package/src/docs/decorators/on-assign.md +63 -0
  319. package/src/docs/decorators/patch.md +44 -0
  320. package/src/docs/decorators/post.md +134 -0
  321. package/src/docs/decorators/publish.md +56 -0
  322. package/src/docs/decorators/put.md +51 -0
  323. package/src/docs/decorators/subscribe.md +87 -0
  324. package/src/docs/decorators/wait-for-ancestors.md +76 -0
  325. package/src/docs/directives/sub.md +75 -0
  326. package/src/docs/directives/t.md +73 -0
  327. package/src/docs/docs-location.spec.ts +56 -0
  328. package/src/docs/docs-location.ts +133 -32
  329. package/src/docs/docs.ts +1 -2
  330. package/src/docs/example/decorators-demo-bind-demos.ts +83 -135
  331. package/src/docs/example/decorators-demo-geo.ts +30 -19
  332. package/src/docs/example/decorators-demo-post.ts +88 -186
  333. package/src/docs/example/decorators-demo-subscribe-publish-get-demos.ts +165 -268
  334. package/src/docs/example/decorators-demo.ts +85 -98
  335. package/src/docs/example/docs-api-config-demos.ts +19 -20
  336. package/src/docs/example/docs-flight-demos.ts +147 -0
  337. package/src/docs/example/docs-jsonata-demos.ts +52 -52
  338. package/src/docs/example/docs-list-demos.ts +43 -123
  339. package/src/docs/example/docs-provider-keys.ts +21 -28
  340. package/src/docs/example/docs-queue-demos.ts +37 -77
  341. package/src/docs/example/docs-router-demos.ts +20 -25
  342. package/src/docs/example/docs-submit-demos.ts +48 -48
  343. package/src/docs/example/docs-toggle-demos.ts +4 -3
  344. package/src/docs/example/users.ts +0 -0
  345. package/src/docs/getting-started/ai-agents.md +50 -0
  346. package/src/docs/getting-started/create-a-component.md +136 -0
  347. package/src/docs/getting-started/dataFlow.md +87 -0
  348. package/src/docs/getting-started/installation.md +36 -0
  349. package/src/docs/getting-started/my-first-component.md +227 -0
  350. package/src/docs/getting-started/start.md +35 -0
  351. package/src/docs/header/header.ts +11 -6
  352. package/src/docs/home/catalog.ts +1 -1
  353. package/src/docs/home/home.ts +20 -11
  354. package/src/docs/layout.ts +12 -13
  355. package/src/docs/misc/api-configuration.md +79 -0
  356. package/src/docs/misc/dataProviderKey.md +168 -0
  357. package/src/docs/misc/docs-mock-api.md +62 -0
  358. package/src/docs/misc/dynamic-path.md +71 -0
  359. package/src/docs/misc/endpoint.md +45 -0
  360. package/src/docs/misc/html-integration.md +14 -0
  361. package/src/docs/misc/publisher-get-immutability-docs-crawl.json +902 -0
  362. package/src/docs/misc/publisher-get-immutability-docs-recheck.json +13 -0
  363. package/src/docs/misc/publisher-get-immutability-study.md +229 -0
  364. package/src/docs/mock-api/api-config-mock.ts +5 -0
  365. package/src/docs/mock-api/fixtures.ts +0 -278
  366. package/src/docs/mock-api/flights.ts +89 -0
  367. package/src/docs/mock-api/router.ts +3 -4
  368. package/src/docs/mock-api/urls.ts +1 -2
  369. package/src/docs/navigation/navigation.ts +84 -101
  370. package/src/docs/navigation/toc.ts +7 -4
  371. package/src/docs/search/docs-search.json +3188 -5153
  372. package/src/docs/search/markdown-renderer.ts +31 -8
  373. package/src/docs/search/page.ts +9 -6
  374. package/src/docs/search/search.ts +154 -122
  375. package/src/docs/tailwind/css/docs/content.css +4 -5
  376. package/src/tsconfig.declarations.json +22 -0
  377. package/src/tsconfig.emit.json +23 -0
  378. package/src/tsconfig.json +53 -5
  379. package/src/tsconfig.tsbuildinfo +1 -1
  380. package/vite.config.mts +11 -2
  381. package/.agents/skills/concorde-component-docs/SKILL.md +0 -194
  382. package/.taste-skill/after/desktop-fold.jpg +0 -0
  383. package/.taste-skill/after/desktop-page-01.jpg +0 -0
  384. package/.taste-skill/after/desktop-page-02.jpg +0 -0
  385. package/.taste-skill/after/desktop-page-03.jpg +0 -0
  386. package/.taste-skill/after/mobile-fold.jpg +0 -0
  387. package/.taste-skill/after/mobile-page-01.jpg +0 -0
  388. package/.taste-skill/after/report.json +0 -4103
  389. package/.taste-skill/after/tablet-fold.jpg +0 -0
  390. package/.taste-skill/after/tablet-page-01.jpg +0 -0
  391. package/.taste-skill/after/tablet-page-02.jpg +0 -0
  392. package/.taste-skill/before/desktop-fold.jpg +0 -0
  393. package/.taste-skill/before/desktop-page-01.jpg +0 -0
  394. package/.taste-skill/before/desktop-page-02.jpg +0 -0
  395. package/.taste-skill/before/mobile-fold.jpg +0 -0
  396. package/.taste-skill/before/mobile-page-01.jpg +0 -0
  397. package/.taste-skill/before/report.json +0 -2556
  398. package/.taste-skill/before/tablet-fold.jpg +0 -0
  399. package/.taste-skill/before/tablet-page-01.jpg +0 -0
  400. package/.taste-skill/direction.json +0 -510
  401. package/.taste-skill/notes.md +0 -84
  402. package/.taste-skill/prod/desktop-fold.jpg +0 -0
  403. package/.taste-skill/prod/desktop-page-01.jpg +0 -0
  404. package/.taste-skill/prod/desktop-page-02.jpg +0 -0
  405. package/.taste-skill/prod/desktop-page-03.jpg +0 -0
  406. package/.taste-skill/prod/mobile-fold.jpg +0 -0
  407. package/.taste-skill/prod/mobile-page-01.jpg +0 -0
  408. package/.taste-skill/prod/mobile-page-02.jpg +0 -0
  409. package/.taste-skill/prod/report.json +0 -1973
  410. package/.taste-skill/prod/tablet-fold.jpg +0 -0
  411. package/.taste-skill/prod/tablet-page-01.jpg +0 -0
  412. package/.taste-skill/prod/tablet-page-02.jpg +0 -0
  413. package/AUDIT.md +0 -228
  414. package/PLAN-AMELIORATION.md +0 -220
  415. package/ai/AGENTS.md +0 -56
  416. package/ai/cursor/rules/concorde-menu.mdc +0 -15
  417. package/ai/cursor/rules/concorde-scope.mdc +0 -14
  418. package/ai/cursor/rules/concorde-theme.mdc +0 -13
  419. package/ai/cursor/rules/concorde.mdc +0 -66
  420. package/ai/jetbrains/rules/concorde.md +0 -53
  421. package/ai/skills/concorde-get-set-dp/SKILL.md +0 -194
  422. package/ai/skills/concorde-imports/SKILL.md +0 -78
  423. package/ai/skills/concorde-menu/SKILL.md +0 -74
  424. package/ai/skills/concorde-scope/SKILL.md +0 -70
  425. package/ai/skills/concorde-theme/SKILL.md +0 -57
  426. package/docs/assets/index-Bb-_LRyY.js +0 -12280
  427. package/src/docs/example/docs-input-autocomplete-demos.ts +0 -110
  428. package/src/docs/example/docs-joke-demos.ts +0 -297
  429. /package/{src → docs/src}/core/components/ui/form/input-autocomplete/input-autocomplete.md +0 -0
  430. /package/{src → docs/src}/docs/_core-concept/dataFlow.md +0 -0
  431. /package/{src → docs/src}/docs/_core-concept/overview.md +0 -0
  432. /package/{src → docs/src}/docs/_decorators/ancestor-attribute.md +0 -0
  433. /package/{src → docs/src}/docs/_decorators/auto-subscribe.md +0 -0
  434. /package/{src → docs/src}/docs/_decorators/bind.md +0 -0
  435. /package/{src → docs/src}/docs/_decorators/get.md +0 -0
  436. /package/{src → docs/src}/docs/_decorators/handle.md +0 -0
  437. /package/{src → docs/src}/docs/_decorators/on-assign.md +0 -0
  438. /package/{src → docs/src}/docs/_decorators/patch.md +0 -0
  439. /package/{src → docs/src}/docs/_decorators/post.md +0 -0
  440. /package/{src → docs/src}/docs/_decorators/publish.md +0 -0
  441. /package/{src → docs/src}/docs/_decorators/put.md +0 -0
  442. /package/{src → docs/src}/docs/_decorators/subscribe.md +0 -0
  443. /package/{src → docs/src}/docs/_decorators/wait-for-ancestors.md +0 -0
  444. /package/{src → docs/src}/docs/_directives/sub.md +0 -0
  445. /package/{src → docs/src}/docs/_getting-started/ai-agents.md +0 -0
  446. /package/{src → docs/src}/docs/_getting-started/concorde-manual-install.md +0 -0
  447. /package/{src → docs/src}/docs/_getting-started/concorde-outside.md +0 -0
  448. /package/{src → docs/src}/docs/_getting-started/create-a-component.md +0 -0
  449. /package/{src → docs/src}/docs/_getting-started/my-first-component.md +0 -0
  450. /package/{src → docs/src}/docs/_getting-started/start.md +0 -0
  451. /package/{src → docs/src}/docs/_misc/api-configuration.md +0 -0
  452. /package/{src → docs/src}/docs/_misc/dataProviderKey.md +0 -0
  453. /package/{src → docs/src}/docs/_misc/docs-mock-api.md +0 -0
  454. /package/{src → docs/src}/docs/_misc/dynamic-path.md +0 -0
  455. /package/{src → docs/src}/docs/_misc/endpoint.md +0 -0
  456. /package/{src → docs/src}/docs/_misc/formelement-subscriber-removal.md +0 -0
  457. /package/{src → docs/src}/docs/_misc/html-integration.md +0 -0
  458. /package/src/docs/{_getting-started → getting-started}/components.md +0 -0
  459. /package/src/docs/{_getting-started → getting-started}/theming.md +0 -0
@@ -0,0 +1,38 @@
1
+ # Translation
2
+
3
+ **`sonic-t`** renders a translated label in plain HTML. It is the markup counterpart of the [t()](/docs/directives/t) directive and shares its endpoint, batching and cache.
4
+
5
+ ## Basic example
6
+
7
+ Set `serviceURL` and `wordingProvider` on an ancestor, then give each `sonic-t` a `key`. Labels requested together are fetched in one call.
8
+
9
+ <sonic-code>
10
+ <template>
11
+ <div serviceURL="/docs-mock-api" wordingProvider="wording/labels?lang=fr">
12
+ <p><sonic-t key="flight.boarding"></sonic-t></p>
13
+ </div>
14
+ </template>
15
+ </sonic-code>
16
+
17
+ ## HTML labels
18
+
19
+ The label is escaped by default. Add `unsafeHTML` for labels that contain trusted markup.
20
+
21
+ <sonic-code>
22
+ <template>
23
+ <div serviceURL="/docs-mock-api" wordingProvider="wording/labels?lang=fr">
24
+ <p><sonic-t key="flight.gate" unsafeHTML></sonic-t></p>
25
+ </div>
26
+ </template>
27
+ </sonic-code>
28
+
29
+ Endpoint format, reloading on `<html lang>` change and `wordingVersionProvider` are described on the [t()](/docs/directives/t) page.
30
+
31
+ ## API reference
32
+
33
+ | Attribute | Values | Description |
34
+ |-----------|--------|-------------|
35
+ | `key` | string | Label key. Renders nothing while empty |
36
+ | `unsafeHTML` | boolean | Renders the label as HTML instead of text |
37
+
38
+ No slots.
@@ -1,35 +1,47 @@
1
1
  # Value
2
2
 
3
- Simply shows a value from a data provider.
4
- You can target sub data value using dot syntax.
5
- The value reacts to changes.
3
+ **`sonic-value`** prints one value from a data provider and updates when it changes. Set `dataProvider` (or inherit it from an ancestor) and point `key` at the field to show.
4
+
5
+ ## Basic example
6
+
7
+ The form below writes `cabin` into the `value-checkin` provider; `sonic-value` reads it back.
6
8
 
7
- * Below is a form that helps you to set a value for the field "preference" in the data target with id "value-example"
8
9
  <sonic-code>
9
10
  <template>
10
- <div formDataProvider="value-example">
11
- which one do you prefer ?
12
- <sonic-radio name="preference" checked value="dogs"> Dogs</sonic-radio>
13
- <sonic-radio name="preference" value="cats"> Cats</sonic-radio>
11
+ <div formDataProvider="value-checkin" class="flex flex-wrap gap-4 mb-3">
12
+ <sonic-radio name="cabin" value="Economy" checked>Economy</sonic-radio>
13
+ <sonic-radio name="cabin" value="Business">Business</sonic-radio>
14
+ <sonic-radio name="cabin" value="First">First</sonic-radio>
14
15
  </div>
16
+ <p>Cabin: <sonic-value dataProvider="value-checkin" key="cabin"></sonic-value></p>
15
17
  </template>
16
18
  </sonic-code>
17
- * Then you can see live value of the preference using this code :
18
- <sonic-code>
19
- <template>
20
- I prefer <sonic-value dataProvider="value-example" key="preference"></sonic-value>
21
- </template>
22
- </sonic-code>
23
- * If you have more complex data like this
24
- <sonic-code>
25
- <template>
26
- <sonic-subscriber dataProvider="value-example-2" props='{"my":{"complex":[{"data":"👋 Hi There"}]}}'></sonic-subscriber>
27
- </template>
28
- </sonic-code>
29
- * You can target it with the dot syntax
19
+
20
+ The value is rendered as HTML, not escaped: only display trusted data. When the value is an object or is missing, nothing is printed.
21
+
22
+ ## Nested key
23
+
24
+ `key` accepts a dot path, array indexes included.
25
+
30
26
  <sonic-code>
31
27
  <template>
32
- <sonic-value dataProvider="value-example-2" key="my.complex.0.data"></sonic-value>
28
+ <sonic-subscriber dataProvider="value-passenger" props='{"passenger":{"name":"Ada Lindqvist","seats":[{"number":"2A"}]}}'></sonic-subscriber>
29
+ <p>
30
+ <sonic-value dataProvider="value-passenger" key="passenger.name"></sonic-value>
31
+ is seated in
32
+ <sonic-value dataProvider="value-passenger" key="passenger.seats.0.number"></sonic-value>
33
+ </p>
33
34
  </template>
34
35
  </sonic-code>
35
36
 
37
+ ## API reference
38
+
39
+ | Attribute | Values | Description |
40
+ |-----------|--------|-------------|
41
+ | `dataProvider` | string | Provider to read. Inherited from the closest ancestor when omitted |
42
+ | `key` | string (required) | Dot path of the value in the provider |
43
+
44
+ | Slot | Description |
45
+ |------|-------------|
46
+ | *(default)* | Content rendered after the value |
47
+ | `prefix` · `suffix` | Rendered around the default slot, after the value |
File without changes
File without changes
@@ -6,7 +6,7 @@ Alerts **surface important feedback** inline—errors, confirmations, or context
6
6
 
7
7
  <sonic-code>
8
8
  <template>
9
- <sonic-alert status="error" label="Email error" text="This address is already in use" background></sonic-alert>
9
+ <sonic-alert status="error" label="Gate change" text="CN 001 now departs from gate B12" background></sonic-alert>
10
10
  </template>
11
11
  </sonic-code>
12
12
 
@@ -17,11 +17,11 @@ Color and icon follow `status`. With no `status`, behavior is `default`.
17
17
  <sonic-code>
18
18
  <template>
19
19
  <div class="grid gap-4">
20
- <sonic-alert label="Default">This address is already in use.</sonic-alert>
21
- <sonic-alert status="success" label="Success">This address is already in use.</sonic-alert>
22
- <sonic-alert status="error" label="Error">This address is already in use.</sonic-alert>
23
- <sonic-alert status="warning" label="Warning">This address is already in use.</sonic-alert>
24
- <sonic-alert status="info" label="Info">This address is already in use.</sonic-alert>
20
+ <sonic-alert label="Default">CN 001 · CDG → JFK.</sonic-alert>
21
+ <sonic-alert status="success" label="Success">CN 001 has landed at JFK.</sonic-alert>
22
+ <sonic-alert status="error" label="Error">CN 001 is cancelled.</sonic-alert>
23
+ <sonic-alert status="warning" label="Warning">Turbulence expected over the Atlantic.</sonic-alert>
24
+ <sonic-alert status="info" label="Info">Boarding starts in 20 minutes.</sonic-alert>
25
25
  </div>
26
26
  </template>
27
27
  </sonic-code>
@@ -34,7 +34,7 @@ By default, an alert already in the DOM is **not** announced (no `role` / `aria-
34
34
 
35
35
  <sonic-code>
36
36
  <template>
37
- <sonic-alert announce status="success" label="Saved" text="Your changes were saved."></sonic-alert>
37
+ <sonic-alert announce status="success" label="Checked in" text="Your boarding pass is ready."></sonic-alert>
38
38
  </template>
39
39
  </sonic-code>
40
40
 
@@ -44,48 +44,50 @@ By default, an alert already in the DOM is **not** announced (no `role` / `aria-
44
44
 
45
45
  <sonic-code>
46
46
  <template>
47
- <sonic-alert status="info" noIcon label="No icon" text="Informational message."></sonic-alert>
47
+ <sonic-alert status="info" noIcon label="No icon" text="Cruising altitude reached."></sonic-alert>
48
48
  </template>
49
49
  </sonic-code>
50
50
 
51
51
  ## Custom icon slot
52
52
 
53
- Project any markup into **`slot="icon"`** (emoji, image, custom component). Keep it decorative with `aria-hidden="true"` when the message text already conveys meaning.
53
+ Project any markup into **`slot="icon"`** (icon, image, custom component). Keep it decorative with `aria-hidden="true"` when the message text already conveys meaning.
54
54
 
55
55
  <sonic-code>
56
56
  <template>
57
- <sonic-alert status="success" label="Achievement unlocked" background>
58
- <span slot="icon" aria-hidden="true" class="text-lg leading-none">🎉</span>
59
- You unlocked a new badge.
57
+ <sonic-alert status="success" label="Upgrade confirmed" background>
58
+ <sonic-icon slot="icon" library="iconoir" name="trophy" aria-hidden="true"></sonic-icon>
59
+ You are now seated in first class.
60
60
  </sonic-alert>
61
61
  </template>
62
62
  </sonic-code>
63
63
 
64
- ## Sizes
64
+ ## Size
65
+
66
+ Default size is `md` (omit the `size` attribute). `inherit` follows the parent font size.
65
67
 
66
68
  <sonic-code>
67
69
  <template>
68
70
  <div class="grid gap-4">
69
- <sonic-alert status="error" label="Email error" size="2xs">
70
- This address is already in use. Lorem ipsum dolor sit amet.
71
+ <sonic-alert status="error" label="Delayed" size="2xs">
72
+ CN 001 departure moved to 18:40.
71
73
  </sonic-alert>
72
- <sonic-alert status="error" label="Email error" size="xs">
73
- This address is already in use. Lorem ipsum dolor sit amet.
74
+ <sonic-alert status="error" label="Delayed" size="xs">
75
+ CN 001 departure moved to 18:40.
74
76
  </sonic-alert>
75
- <sonic-alert status="error" label="Email error" size="sm">
76
- This address is already in use. Lorem ipsum dolor sit amet.
77
+ <sonic-alert status="error" label="Delayed" size="sm">
78
+ CN 001 departure moved to 18:40.
77
79
  </sonic-alert>
78
- <sonic-alert status="error" label="Email error">
79
- This address is already in use. Lorem ipsum dolor sit amet.
80
+ <sonic-alert status="error" label="Delayed">
81
+ CN 001 departure moved to 18:40.
80
82
  </sonic-alert>
81
- <sonic-alert status="error" label="Email error" size="lg">
82
- This address is already in use. Lorem ipsum dolor sit amet.
83
+ <sonic-alert status="error" label="Delayed" size="lg">
84
+ CN 001 departure moved to 18:40.
83
85
  </sonic-alert>
84
- <sonic-alert status="error" label="Email error" size="xl">
85
- This address is already in use. Lorem ipsum dolor sit amet.
86
+ <sonic-alert status="error" label="Delayed" size="xl">
87
+ CN 001 departure moved to 18:40.
86
88
  </sonic-alert>
87
- <sonic-alert status="error" label="Email error" size="2xl">
88
- This address is already in use. Lorem ipsum dolor sit amet.
89
+ <sonic-alert status="error" label="Delayed" size="2xl">
90
+ CN 001 departure moved to 18:40.
89
91
  </sonic-alert>
90
92
  </div>
91
93
  </template>
@@ -97,10 +99,10 @@ Rich content in the slot (buttons, links).
97
99
 
98
100
  <sonic-code>
99
101
  <template>
100
- <sonic-alert status="info" label="New messages !">
101
- You have 2 unread messages<br />
102
+ <sonic-alert status="info" label="Gate change">
103
+ CN 001 now departs from gate B12<br />
102
104
  <div class="flex gap-2 mt-1">
103
- <sonic-button variant="outline" type="info" size="xs">See messages</sonic-button>
105
+ <sonic-button variant="outline" type="info" size="xs">View flight</sonic-button>
104
106
  <sonic-button variant="ghost" type="info" size="xs">Dismiss</sonic-button>
105
107
  </div>
106
108
  </sonic-alert>
@@ -114,18 +116,18 @@ Tinted background from the `status` color (`color-mix` on `currentColor`).
114
116
  <sonic-code>
115
117
  <template>
116
118
  <div class="grid gap-4">
117
- <sonic-alert background label="Lorem ipsum dolor">This address is already in use.</sonic-alert>
118
- <sonic-alert status="success" background label="Lorem ipsum dolor">
119
- This address is already in use.
119
+ <sonic-alert background label="Flight update">Boarding is now open at gate B12.</sonic-alert>
120
+ <sonic-alert status="success" background label="Flight update">
121
+ Boarding is now open at gate B12.
120
122
  </sonic-alert>
121
- <sonic-alert status="error" background label="Lorem ipsum dolor">
122
- This address is already in use.
123
+ <sonic-alert status="error" background label="Flight update">
124
+ Boarding is now open at gate B12.
123
125
  </sonic-alert>
124
- <sonic-alert status="warning" background label="Lorem ipsum dolor">
125
- This address is already in use.
126
+ <sonic-alert status="warning" background label="Flight update">
127
+ Boarding is now open at gate B12.
126
128
  </sonic-alert>
127
- <sonic-alert status="info" background label="Lorem ipsum dolor">
128
- This address is already in use.
129
+ <sonic-alert status="info" background label="Flight update">
130
+ Boarding is now open at gate B12.
129
131
  </sonic-alert>
130
132
  </div>
131
133
  </template>
@@ -137,22 +139,10 @@ Tinted background from the `status` color (`color-mix` on `currentColor`).
137
139
 
138
140
  <sonic-code>
139
141
  <template>
140
- <sonic-alert status="info" class="mb-3" dismissible label="This address is already in use.">
141
- </sonic-alert>
142
- <sonic-alert class="mb-3" dismissible background label="Lorem ipsum dolor">
143
- This address is already in use.
144
- </sonic-alert>
145
- <sonic-alert status="success" class="mb-3" dismissible background label="Lorem ipsum dolor">
146
- This address is already in use.
147
- </sonic-alert>
148
- <sonic-alert status="error" class="mb-3" dismissible background label="Lorem ipsum dolor">
149
- This address is already in use.
150
- </sonic-alert>
151
- <sonic-alert status="warning" class="mb-3" dismissible background label="Lorem ipsum dolor">
152
- This address is already in use.
142
+ <sonic-alert status="info" class="mb-3" dismissible label="Baggage claim moved to belt 4.">
153
143
  </sonic-alert>
154
- <sonic-alert status="info" class="mb-3" dismissible background label="Lorem ipsum dolor">
155
- This address is already in use.
144
+ <sonic-alert class="mb-3" dismissible background label="Flight update">
145
+ Boarding is now open at gate B12.
156
146
  </sonic-alert>
157
147
  </template>
158
148
  </sonic-code>
@@ -168,10 +158,10 @@ With **`dismissForever`**, dismissal is stored in `localStorage` (key `sonic-ale
168
158
  dismissible
169
159
  background
170
160
  dismissForever
171
- label="Lorem ipsum dolor"
161
+ label="Flight update"
172
162
  id="addressUniqueId"
173
163
  >
174
- This address is already in use.
164
+ Boarding is now open at gate B12.
175
165
  </sonic-alert>
176
166
  </template>
177
167
  </sonic-code>
@@ -180,10 +170,10 @@ With **`dismissForever`**, dismissal is stored in `localStorage` (key `sonic-ale
180
170
 
181
171
  | Attribute | Values | Description |
182
172
  |----------|---------|-------------|
183
- | `status` | `default` · `info` · `success` · `warning` · `error` | Color and default icon |
173
+ | `status` | `default` (default) · `info` · `success` · `warning` · `error` | Color and default icon |
184
174
  | `label` | string | Title (plain text) |
185
175
  | `text` | string | Short body (plain text), rendered before the slot |
186
- | `size` | `2xs` … `2xl` | Corner radius and typography |
176
+ | `size` | `2xs` … `2xl` (default `md`) · `inherit` | Corner radius and typography |
187
177
  | `background` | boolean | Tinted background (`color-mix` on status color) |
188
178
  | `dismissible` | boolean | Close control; removes the element from the DOM |
189
179
  | `dismissForever` | boolean | Persists dismissal in `localStorage`; requires **`id`** |
@@ -24,34 +24,27 @@ Badges are **compact, non-interactive** labels for status, counts, or categories
24
24
 
25
25
  Default **`variant`** is filled. **`outline`** — border and text in the `type` color. **`ghost`** — text only, no padding (except in forced-colors mode).
26
26
 
27
- ### Outline
28
-
29
- <sonic-code>
30
- <template>
31
- <div class="flex items-center flex-wrap gap-3">
32
- <sonic-badge variant="outline">Default</sonic-badge>
33
- <sonic-badge variant="outline" type="primary">Primary</sonic-badge>
34
- <sonic-badge variant="outline" type="neutral">Neutral</sonic-badge>
35
- <sonic-badge variant="outline" type="warning">Warning</sonic-badge>
36
- <sonic-badge variant="outline" type="info">Info</sonic-badge>
37
- <sonic-badge variant="outline" type="success">Success</sonic-badge>
38
- <sonic-badge variant="outline" type="danger">Danger</sonic-badge>
39
- </div>
40
- </template>
41
- </sonic-code>
42
-
43
- ### Ghost
44
-
45
27
  <sonic-code>
46
28
  <template>
47
- <div class="flex items-center flex-wrap gap-3">
48
- <sonic-badge variant="ghost">Default</sonic-badge>
49
- <sonic-badge variant="ghost" type="primary">Primary</sonic-badge>
50
- <sonic-badge variant="ghost" type="neutral">Neutral</sonic-badge>
51
- <sonic-badge variant="ghost" type="warning">Warning</sonic-badge>
52
- <sonic-badge variant="ghost" type="info">Info</sonic-badge>
53
- <sonic-badge variant="ghost" type="success">Success</sonic-badge>
54
- <sonic-badge variant="ghost" type="danger">Danger</sonic-badge>
29
+ <div class="grid gap-3">
30
+ <div class="flex items-center flex-wrap gap-3">
31
+ <sonic-badge variant="outline">Default</sonic-badge>
32
+ <sonic-badge variant="outline" type="primary">Primary</sonic-badge>
33
+ <sonic-badge variant="outline" type="neutral">Neutral</sonic-badge>
34
+ <sonic-badge variant="outline" type="warning">Warning</sonic-badge>
35
+ <sonic-badge variant="outline" type="info">Info</sonic-badge>
36
+ <sonic-badge variant="outline" type="success">Success</sonic-badge>
37
+ <sonic-badge variant="outline" type="danger">Danger</sonic-badge>
38
+ </div>
39
+ <div class="flex items-center flex-wrap gap-3">
40
+ <sonic-badge variant="ghost">Default</sonic-badge>
41
+ <sonic-badge variant="ghost" type="primary">Primary</sonic-badge>
42
+ <sonic-badge variant="ghost" type="neutral">Neutral</sonic-badge>
43
+ <sonic-badge variant="ghost" type="warning">Warning</sonic-badge>
44
+ <sonic-badge variant="ghost" type="info">Info</sonic-badge>
45
+ <sonic-badge variant="ghost" type="success">Success</sonic-badge>
46
+ <sonic-badge variant="ghost" type="danger">Danger</sonic-badge>
47
+ </div>
55
48
  </div>
56
49
  </template>
57
50
  </sonic-code>
@@ -81,11 +74,11 @@ Icons or short text before / after the main label.
81
74
  <sonic-code>
82
75
  <template>
83
76
  <sonic-badge type="info" size="sm">
84
- <sonic-icon slot="prefix" name="info-empty" library="iconoir"></sonic-icon>
85
- Info
77
+ <sonic-icon slot="prefix" name="airplane" library="iconoir"></sonic-icon>
78
+ Boarding
86
79
  </sonic-badge>
87
80
  <sonic-badge type="success">
88
- Verified
81
+ Landed
89
82
  <sonic-icon slot="suffix" name="check" library="iconoir"></sonic-icon>
90
83
  </sonic-badge>
91
84
  </template>
@@ -118,11 +111,11 @@ With `ellipsis`, long labels truncate. The parent must constrain width (`max-wid
118
111
  <div class="grid grid-cols-2 gap-4 max-w-xl">
119
112
  <sonic-badge ellipsis size="sm" variant="outline">
120
113
  <sonic-icon slot="prefix" name="info-empty" library="iconoir"></sonic-icon>
121
- Lorem ipsum dolor sit amet consectetur adipiscing elit sed do eiusmod.
114
+ CN 001 · CDG → JFK · Gate change: now boarding at gate B12, terminal 2E
122
115
  </sonic-badge>
123
116
  <sonic-badge ellipsis size="sm">
124
117
  <sonic-icon slot="prefix" name="info-empty" library="iconoir"></sonic-icon>
125
- Lorem ipsum dolor sit amet consectetur adipiscing elit sed do eiusmod.
118
+ CN 001 · CDG → JFK · Gate change: now boarding at gate B12, terminal 2E
126
119
  </sonic-badge>
127
120
  </div>
128
121
  </template>
@@ -136,10 +129,10 @@ Count inside a button (`slot="suffix"`) or a badge absolutely positioned on a bu
136
129
  <template>
137
130
  <div class="flex flex-wrap gap-4 items-center">
138
131
  <sonic-button type="default">
139
- Messages <sonic-badge slot="suffix" type="danger" size="xs">5</sonic-badge>
132
+ Departures <sonic-badge slot="suffix" type="danger" size="xs">5</sonic-badge>
140
133
  </sonic-button>
141
134
  <div class="relative inline-block">
142
- <sonic-button type="success" class="relative">My account</sonic-button>
135
+ <sonic-button type="success" class="relative">Crew</sonic-button>
143
136
  <sonic-badge
144
137
  type="danger"
145
138
  size="xs"
@@ -178,7 +171,7 @@ Count inside a button (`slot="suffix"`) or a badge absolutely positioned on a bu
178
171
  |----------|---------|-------------|
179
172
  | `type` | `default` (default) · `primary` · `neutral` · `warning` · `info` · `success` · `danger` | Semantic color (`--sc-*` tokens) |
180
173
  | `variant` | `default` (default) · `outline` · `ghost` | Filled, bordered, or text-only |
181
- | `size` | `2xs` … `2xl` (default `md`) | Typography and padding (aligned with **`sonic-button`**) |
174
+ | `size` | `2xs` … `2xl` (default `md`) · `inherit` | Typography and padding (aligned with **`sonic-button`**) |
182
175
  | `ellipsis` | boolean | Single-line truncation; parent must constrain width |
183
176
 
184
177
  | Slot | Description |