@supersoniks/concorde 5.1.2 → 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 (497) hide show
  1. package/.agents/skills/concorde-docs/SKILL.md +1 -1
  2. package/.claude/skills +1 -0
  3. package/.github/workflows/ci.yml +21 -0
  4. package/.github-export-ignore +30 -0
  5. package/CONTRIBUTING.md +59 -0
  6. package/DEV.md +54 -0
  7. package/LICENSE +21 -0
  8. package/OPEN_SOURCE_CHECKPOINT.md +133 -0
  9. package/README.md +1 -1
  10. package/ai/README.md +29 -41
  11. package/ai/skills/concorde/SKILL.md +54 -324
  12. package/ai/skills/concorde/rules/composition.md +32 -0
  13. package/ai/skills/concorde/rules/data.md +47 -0
  14. package/ai/skills/concorde/rules/http.md +25 -0
  15. package/ai/skills/concorde/rules/lists-forms.md +35 -0
  16. package/ai/skills/concorde/rules/styling.md +46 -0
  17. package/ai/skills/concorde/rules/troubleshooting.md +45 -0
  18. package/build-infos.json +1 -1
  19. package/concorde-core.bundle.js +177 -177
  20. package/concorde-core.es.js +4993 -4833
  21. package/custom-elements-manifest.public.config.mjs +8 -0
  22. package/{.tmp-cem/custom-elements.json → custom-elements.json} +11722 -8868
  23. package/dist/concorde-core.bundle.js +177 -177
  24. package/dist/concorde-core.es.js +4993 -4833
  25. package/dist/docs-mock-api-sw.js +58 -223
  26. package/dist/docs-mock-api-sw.js.map +4 -4
  27. package/dist/img/og-concorde.jpg +0 -0
  28. package/dist/robots.txt +11 -10
  29. package/docs/assets/index-CD4WyL6o.css +1 -0
  30. package/docs/assets/index-D_alEsng.js +12122 -0
  31. package/docs/crawl/core/components/functional/date/date.html +190 -0
  32. package/docs/crawl/core/components/functional/fetch/fetch.html +109 -0
  33. package/docs/crawl/core/components/functional/if/if.html +27 -0
  34. package/docs/crawl/core/components/functional/jsonata/jsonata.html +79 -0
  35. package/docs/crawl/core/components/functional/list/list.html +70 -0
  36. package/docs/crawl/core/components/functional/mix/mix.html +45 -0
  37. package/docs/crawl/core/components/functional/queue/queue.html +96 -0
  38. package/docs/crawl/core/components/functional/router/router.html +106 -0
  39. package/docs/{core → crawl/core}/components/functional/sdui/sdui-extension-points.html +8 -9
  40. package/docs/crawl/core/components/functional/sdui/sdui.html +368 -0
  41. package/docs/crawl/core/components/functional/states/states.html +66 -0
  42. package/docs/crawl/core/components/functional/submit/submit.html +160 -0
  43. package/docs/{core → crawl/core}/components/functional/subscriber/subscriber.html +5 -6
  44. package/docs/crawl/core/components/functional/value/value.html +51 -0
  45. package/docs/{core → crawl/core}/components/ui/alert/alert.html +63 -53
  46. package/docs/{core → crawl/core}/components/ui/alert-messages/alert-messages.html +5 -6
  47. package/docs/{core → crawl/core}/components/ui/badge/badge.html +33 -33
  48. package/docs/crawl/core/components/ui/button/button.html +150 -0
  49. package/docs/crawl/core/components/ui/captcha/captcha.html +112 -0
  50. package/docs/{core → crawl/core}/components/ui/card/card.html +11 -12
  51. package/docs/{core → crawl/core}/components/ui/divider/divider.html +14 -14
  52. package/docs/crawl/core/components/ui/form/checkbox/checkbox.html +73 -0
  53. package/docs/crawl/core/components/ui/form/fieldset/fieldset.html +266 -0
  54. package/docs/{core → crawl/core}/components/ui/form/form-actions/form-actions.html +23 -23
  55. package/docs/crawl/core/components/ui/form/form-layout/form-layout.html +121 -0
  56. package/docs/crawl/core/components/ui/form/input/input.html +109 -0
  57. package/docs/crawl/core/components/ui/form/input-autocomplete/input-autocomplete.html +38 -0
  58. package/docs/crawl/core/components/ui/form/radio/radio.html +56 -0
  59. package/docs/crawl/core/components/ui/form/select/select.html +73 -0
  60. package/docs/crawl/core/components/ui/form/switch/switch.html +56 -0
  61. package/docs/crawl/core/components/ui/form/textarea/textarea.html +59 -0
  62. package/docs/crawl/core/components/ui/group/group.html +104 -0
  63. package/docs/{core → crawl/core}/components/ui/icon/icon.html +9 -10
  64. package/docs/crawl/core/components/ui/image/image.html +298 -0
  65. package/docs/{core → crawl/core}/components/ui/link/link.html +11 -12
  66. package/docs/crawl/core/components/ui/loader/loader.html +124 -0
  67. package/docs/{core → crawl/core}/components/ui/menu/menu.html +33 -34
  68. package/docs/crawl/core/components/ui/modal/modal.html +342 -0
  69. package/docs/crawl/core/components/ui/pop/pop.html +296 -0
  70. package/docs/{core → crawl/core}/components/ui/progress/progress.html +7 -8
  71. package/docs/crawl/core/components/ui/table/table.html +545 -0
  72. package/docs/crawl/core/components/ui/theme/theme.html +131 -0
  73. package/docs/crawl/core/components/ui/toast/toast.html +233 -0
  74. package/docs/crawl/core/components/ui/tooltip/tooltip.html +140 -0
  75. package/docs/{docs/getting-started → crawl/docs/_core-concept}/dataFlow.html +29 -26
  76. package/docs/crawl/docs/_core-concept/overview.html +66 -0
  77. package/docs/crawl/docs/_core-concept/subscriber.html +75 -0
  78. package/docs/crawl/docs/_decorators/ancestor-attribute.html +117 -0
  79. package/docs/crawl/docs/_decorators/auto-subscribe.html +202 -0
  80. package/docs/crawl/docs/_decorators/bind.html +141 -0
  81. package/docs/crawl/docs/_decorators/get.html +149 -0
  82. package/docs/crawl/docs/_decorators/handle.html +165 -0
  83. package/docs/crawl/docs/_decorators/on-assign.html +355 -0
  84. package/docs/crawl/docs/_decorators/patch.html +78 -0
  85. package/docs/crawl/docs/_decorators/post.html +139 -0
  86. package/docs/crawl/docs/_decorators/publish.html +61 -0
  87. package/docs/crawl/docs/_decorators/put.html +78 -0
  88. package/docs/crawl/docs/_decorators/subscribe.html +109 -0
  89. package/docs/crawl/docs/_decorators/wait-for-ancestors.html +137 -0
  90. package/docs/crawl/docs/_directives/sub.html +93 -0
  91. package/docs/{docs/getting-started → crawl/docs/_getting-started}/ai-agents.html +11 -12
  92. package/docs/crawl/docs/_getting-started/concorde-manual-install.html +100 -0
  93. package/docs/crawl/docs/_getting-started/concorde-outside.html +58 -0
  94. package/docs/{docs/getting-started → crawl/docs/_getting-started}/create-a-component.html +14 -11
  95. package/docs/{docs/getting-started → crawl/docs/_getting-started}/my-first-component.html +22 -13
  96. package/docs/crawl/docs/_getting-started/my-first-subscriber.html +110 -0
  97. package/docs/crawl/docs/_getting-started/pubsub.html +62 -0
  98. package/docs/crawl/docs/_getting-started/start.html +76 -0
  99. package/docs/{docs/getting-started → crawl/docs/_getting-started}/theming.html +9 -10
  100. package/docs/{docs/misc → crawl/docs/_misc}/api-configuration.html +18 -18
  101. package/docs/{docs/misc → crawl/docs/_misc}/dataProviderKey.html +11 -12
  102. package/docs/{docs/misc → crawl/docs/_misc}/docs-mock-api.html +28 -25
  103. package/docs/{docs/misc → crawl/docs/_misc}/dynamic-path.html +15 -16
  104. package/docs/{docs/misc → crawl/docs/_misc}/endpoint.html +15 -16
  105. package/docs/crawl/docs/_misc/formelement-subscriber-removal.html +138 -0
  106. package/docs/{docs/misc → crawl/docs/_misc}/html-integration.html +15 -12
  107. package/docs/crawl/hubs/decorators.html +547 -0
  108. package/docs/crawl/hubs/form-components.html +381 -0
  109. package/docs/crawl/hubs/remote-data.html +452 -0
  110. package/docs/crawl/index.html +103 -0
  111. package/docs/docs-mock-api-sw.js +223 -58
  112. package/docs/docs-mock-api-sw.js.map +4 -4
  113. package/docs/index.html +68 -95
  114. package/docs/llms-full.txt +3610 -2231
  115. package/docs/llms.txt +86 -94
  116. package/docs/robots.txt +10 -11
  117. package/docs/sitemap.xml +84 -78
  118. package/docs/src/core/components/functional/date/date.md +231 -91
  119. package/docs/src/core/components/functional/fetch/fetch.md +83 -66
  120. package/docs/src/core/components/functional/if/if.md +3 -28
  121. package/docs/src/core/components/functional/jsonata/jsonata.md +37 -42
  122. package/docs/src/core/components/functional/list/list.md +43 -99
  123. package/docs/src/core/components/functional/mix/mix.md +26 -31
  124. package/docs/src/core/components/functional/queue/queue.md +61 -40
  125. package/docs/src/core/components/functional/router/router.md +65 -64
  126. package/docs/src/core/components/functional/sdui/component-catalog.gaps.json +1 -1
  127. package/docs/src/core/components/functional/sdui/component-catalog.json +1 -1
  128. package/docs/src/core/components/functional/sdui/example.json +86 -19
  129. package/docs/src/core/components/functional/sdui/sdui-extension-points.md +1 -1
  130. package/docs/src/core/components/functional/sdui/sdui.md +358 -187
  131. package/docs/src/core/components/functional/states/states.md +61 -86
  132. package/docs/src/core/components/functional/submit/submit.md +72 -64
  133. package/docs/src/core/components/functional/value/value.md +22 -34
  134. package/docs/src/core/components/ui/alert/alert.md +58 -48
  135. package/docs/src/core/components/ui/badge/badge.md +34 -27
  136. package/docs/src/core/components/ui/button/button.md +106 -139
  137. package/docs/src/core/components/ui/captcha/captcha.md +32 -17
  138. package/docs/src/core/components/ui/card/card.md +6 -6
  139. package/docs/src/core/components/ui/divider/divider.md +11 -8
  140. package/docs/src/core/components/ui/form/checkbox/checkbox.md +42 -90
  141. package/docs/src/core/components/ui/form/fieldset/fieldset.md +75 -31
  142. package/docs/src/core/components/ui/form/form-actions/form-actions.md +16 -14
  143. package/docs/src/core/components/ui/form/form-layout/form-layout.md +29 -19
  144. package/docs/src/core/components/ui/form/input/input.md +95 -95
  145. package/docs/src/core/components/ui/form/input-autocomplete/input-autocomplete.md +29 -0
  146. package/docs/src/core/components/ui/form/radio/radio.md +34 -55
  147. package/docs/src/core/components/ui/form/select/select.md +45 -60
  148. package/docs/src/core/components/ui/form/switch/switch.md +34 -57
  149. package/docs/src/core/components/ui/form/textarea/textarea.md +38 -55
  150. package/docs/src/core/components/ui/group/group.md +33 -35
  151. package/docs/src/core/components/ui/icon/icon.md +4 -4
  152. package/docs/src/core/components/ui/image/image.md +107 -41
  153. package/docs/src/core/components/ui/link/link.md +6 -6
  154. package/docs/src/core/components/ui/loader/loader.md +55 -30
  155. package/docs/src/core/components/ui/menu/menu.md +27 -27
  156. package/docs/src/core/components/ui/modal/modal.md +96 -72
  157. package/docs/src/core/components/ui/pop/pop.md +158 -80
  158. package/docs/src/core/components/ui/progress/progress.md +2 -2
  159. package/docs/src/core/components/ui/table/table.md +255 -91
  160. package/docs/src/core/components/ui/theme/theme.md +36 -11
  161. package/docs/src/core/components/ui/toast/toast.md +117 -48
  162. package/docs/src/core/components/ui/tooltip/tooltip.md +62 -27
  163. package/docs/{docs/getting-started → src/docs/_core-concept}/dataFlow.md +18 -17
  164. package/docs/src/docs/_core-concept/overview.md +57 -0
  165. package/docs/src/docs/_core-concept/subscriber.md +75 -0
  166. package/docs/src/docs/_decorators/ancestor-attribute.md +128 -0
  167. package/docs/src/docs/_decorators/auto-subscribe.md +202 -0
  168. package/docs/src/docs/_decorators/bind.md +167 -0
  169. package/docs/src/docs/_decorators/get.md +162 -0
  170. package/docs/src/docs/_decorators/handle.md +175 -0
  171. package/docs/src/docs/_decorators/on-assign.md +390 -0
  172. package/docs/src/docs/_decorators/patch.md +70 -0
  173. package/docs/src/docs/_decorators/post.md +146 -0
  174. package/docs/src/docs/_decorators/publish.md +55 -0
  175. package/docs/src/docs/_decorators/put.md +70 -0
  176. package/docs/src/docs/_decorators/subscribe.md +100 -0
  177. package/docs/src/docs/_decorators/wait-for-ancestors.md +163 -0
  178. package/docs/src/docs/_directives/sub.md +91 -0
  179. package/docs/src/docs/{getting-started → _getting-started}/ai-agents.md +3 -3
  180. package/docs/src/docs/_getting-started/concorde-manual-install.md +133 -0
  181. package/docs/src/docs/_getting-started/concorde-outside.md +33 -0
  182. package/docs/{docs/getting-started → src/docs/_getting-started}/create-a-component.md +6 -3
  183. package/docs/src/docs/{getting-started → _getting-started}/my-first-component.md +14 -5
  184. package/docs/src/docs/_getting-started/my-first-subscriber.md +120 -0
  185. package/docs/src/docs/_getting-started/pubsub.md +37 -0
  186. package/docs/src/docs/{getting-started → _getting-started}/start.md +13 -1
  187. package/docs/src/docs/{getting-started → _getting-started}/theming.md +2 -2
  188. package/docs/src/docs/{misc → _misc}/api-configuration.md +12 -10
  189. package/docs/src/docs/{misc → _misc}/dataProviderKey.md +4 -4
  190. package/docs/{docs/misc → src/docs/_misc}/docs-mock-api.md +13 -12
  191. package/docs/{docs/misc → src/docs/_misc}/dynamic-path.md +8 -8
  192. package/docs/{docs/misc → src/docs/_misc}/endpoint.md +8 -8
  193. package/docs/src/docs/_misc/formelement-subscriber-removal.md +115 -0
  194. package/docs/{docs/misc → src/docs/_misc}/html-integration.md +5 -4
  195. package/docs/src/docs/search/docs-search.json +4375 -2420
  196. package/docs/src/tsconfig.declarations.json +22 -0
  197. package/docs/src/tsconfig.emit.json +23 -0
  198. package/docs/src/tsconfig.json +2 -23
  199. package/gitlab/job_github_mirror.sh +39 -0
  200. package/index.html +89 -0
  201. package/package.json +22 -4
  202. package/public/img/og-concorde.jpg +0 -0
  203. package/scripts/ai-init.mjs +104 -379
  204. package/scripts/ai-init.test.mjs +81 -239
  205. package/scripts/docs-markdown-vite-plugin.ts +11 -5
  206. package/scripts/docs-public-url.mjs +6 -0
  207. package/scripts/docs.htaccess +7 -0
  208. package/scripts/generate-cem.mjs +244 -0
  209. package/scripts/generate-cem.test.mjs +122 -0
  210. package/scripts/generate-crawl-docs.mjs +29 -5
  211. package/scripts/generate-sdui-catalog.mjs +11 -10
  212. package/scripts/github-export.mjs +150 -0
  213. package/scripts/post-build-docs.js +3 -0
  214. package/scripts/post-build.mjs +0 -0
  215. package/scripts/pre-publish.mjs +2 -1
  216. package/scripts/site-pages.mjs +212 -0
  217. package/scripts/site-pages.test.mjs +116 -0
  218. package/site-pages/about.md +22 -0
  219. package/site-pages/privacy.md +32 -0
  220. package/src/core/components/functional/date/date.md +1 -1
  221. package/src/core/components/functional/example/example.ts +3 -1
  222. package/src/core/components/functional/if/if.ts +0 -0
  223. package/src/core/components/functional/list/list.demo.ts +0 -0
  224. package/src/core/components/functional/list/list.md +6 -2
  225. package/src/core/components/functional/list/list.ts +17 -4
  226. package/src/core/components/functional/mix/mix.md +0 -0
  227. package/src/core/components/functional/router/router.demo.ts +0 -0
  228. package/src/core/components/functional/router/router.ts +0 -0
  229. package/src/core/components/functional/sdui/SDUIDescriptorTransformer.ts +0 -0
  230. package/src/core/components/functional/sdui/component-catalog.gaps.json +1 -1
  231. package/src/core/components/functional/sdui/component-catalog.json +2 -2
  232. package/src/core/components/functional/sdui/example.json +0 -0
  233. package/src/core/components/functional/sdui/sdui-immutable.spec.ts +74 -0
  234. package/src/core/components/functional/sdui/sdui.ts +33 -8
  235. package/src/core/components/functional/sdui/types.ts +0 -0
  236. package/src/core/components/functional/states/states.ts +0 -0
  237. package/src/core/components/functional/submit/submit.spec.ts +60 -0
  238. package/src/core/components/functional/submit/submit.ts +6 -3
  239. package/src/core/components/functional/subscriber/subscriber.ts +0 -0
  240. package/src/core/components/functional/value/value.md +0 -0
  241. package/src/core/components/functional/value/value.ts +0 -0
  242. package/src/core/components/ui/_css/size.ts +0 -0
  243. package/src/core/components/ui/captcha/altchaStyles.ts +0 -0
  244. package/src/core/components/ui/card/card.md +1 -1
  245. package/src/core/components/ui/form/input/input.md +19 -1
  246. package/src/core/components/ui/form/input/input.ts +8 -2
  247. package/src/core/components/ui/form/radio/radio.md +14 -0
  248. package/src/core/components/ui/image/image.md +17 -17
  249. package/src/core/components/ui/modal/modal.md +2 -2
  250. package/src/core/decorators/subscriber/bind.ts +9 -14
  251. package/src/core/decorators/subscriber/subscribe.ts +15 -9
  252. package/src/core/decorators/subscriber/subscribe.type-test.ts +14 -5
  253. package/src/core/mixins/Subscriber.ts +0 -0
  254. package/src/core/utils/DataBindObserver.ts +0 -0
  255. package/src/core/utils/Objects.ts +0 -0
  256. package/src/core/utils/PublisherProxy.ts +166 -125
  257. package/src/core/utils/deepReadonly.spec.ts +66 -0
  258. package/src/core/utils/deepReadonly.ts +71 -0
  259. package/src/core/utils/immutableValue.spec.ts +54 -0
  260. package/src/core/utils/immutableValue.ts +102 -0
  261. package/src/core/utils/nestedDotForm.spec.ts +88 -0
  262. package/src/core/utils/publisherImmutable.spec.ts +76 -0
  263. package/src/core/utils/route.ts +0 -0
  264. package/src/core/utils/strictGet.spec.ts +61 -0
  265. package/src/core/utils/strictGet.ts +102 -0
  266. package/src/css.d.ts +19 -0
  267. package/src/docs/components/docs-demo-sources.ts +3 -3
  268. package/src/docs/decorators/bind.md +23 -24
  269. package/src/docs/docs-location.spec.ts +10 -0
  270. package/src/docs/docs-location.ts +10 -0
  271. package/src/docs/example/decorators-demo-bind-demos.ts +11 -28
  272. package/src/docs/example/docs-toggle-demos.ts +1 -1
  273. package/src/docs/example/users.ts +0 -0
  274. package/src/docs/getting-started/ai-agents.md +29 -55
  275. package/src/docs/getting-started/dataFlow.md +2 -2
  276. package/src/docs/home/home.ts +3 -1
  277. package/src/docs/misc/publisher-get-immutability-docs-crawl.json +902 -0
  278. package/src/docs/misc/publisher-get-immutability-docs-recheck.json +13 -0
  279. package/src/docs/misc/publisher-get-immutability-study.md +229 -0
  280. package/src/docs/navigation/navigation.ts +5 -1
  281. package/src/docs/search/docs-search.json +358 -58
  282. package/src/docs/search/markdown-renderer.ts +6 -1
  283. package/src/docs/tailwind/css/docs/content.css +4 -5
  284. package/src/tsconfig.declarations.json +22 -0
  285. package/src/tsconfig.emit.json +23 -0
  286. package/src/tsconfig.json +53 -5
  287. package/src/tsconfig.tsbuildinfo +1 -1
  288. package/.taste-skill/after/desktop-fold.jpg +0 -0
  289. package/.taste-skill/after/desktop-page-01.jpg +0 -0
  290. package/.taste-skill/after/desktop-page-02.jpg +0 -0
  291. package/.taste-skill/after/desktop-page-03.jpg +0 -0
  292. package/.taste-skill/after/mobile-fold.jpg +0 -0
  293. package/.taste-skill/after/mobile-page-01.jpg +0 -0
  294. package/.taste-skill/after/report.json +0 -4103
  295. package/.taste-skill/after/tablet-fold.jpg +0 -0
  296. package/.taste-skill/after/tablet-page-01.jpg +0 -0
  297. package/.taste-skill/after/tablet-page-02.jpg +0 -0
  298. package/.taste-skill/before/desktop-fold.jpg +0 -0
  299. package/.taste-skill/before/desktop-page-01.jpg +0 -0
  300. package/.taste-skill/before/desktop-page-02.jpg +0 -0
  301. package/.taste-skill/before/mobile-fold.jpg +0 -0
  302. package/.taste-skill/before/mobile-page-01.jpg +0 -0
  303. package/.taste-skill/before/report.json +0 -2556
  304. package/.taste-skill/before/tablet-fold.jpg +0 -0
  305. package/.taste-skill/before/tablet-page-01.jpg +0 -0
  306. package/.taste-skill/direction.json +0 -510
  307. package/.taste-skill/notes.md +0 -84
  308. package/.taste-skill/prod/desktop-fold.jpg +0 -0
  309. package/.taste-skill/prod/desktop-page-01.jpg +0 -0
  310. package/.taste-skill/prod/desktop-page-02.jpg +0 -0
  311. package/.taste-skill/prod/desktop-page-03.jpg +0 -0
  312. package/.taste-skill/prod/mobile-fold.jpg +0 -0
  313. package/.taste-skill/prod/mobile-page-01.jpg +0 -0
  314. package/.taste-skill/prod/mobile-page-02.jpg +0 -0
  315. package/.taste-skill/prod/report.json +0 -1973
  316. package/.taste-skill/prod/tablet-fold.jpg +0 -0
  317. package/.taste-skill/prod/tablet-page-01.jpg +0 -0
  318. package/.taste-skill/prod/tablet-page-02.jpg +0 -0
  319. package/AUDIT.md +0 -228
  320. package/PLAN-AMELIORATION.md +0 -220
  321. package/PLAN-DOCS-AGENTS.md +0 -80
  322. package/ai/AGENTS.md +0 -56
  323. package/ai/cursor/rules/concorde-menu.mdc +0 -15
  324. package/ai/cursor/rules/concorde-scope.mdc +0 -14
  325. package/ai/cursor/rules/concorde-theme.mdc +0 -13
  326. package/ai/cursor/rules/concorde.mdc +0 -66
  327. package/ai/jetbrains/rules/concorde.md +0 -53
  328. package/ai/skills/concorde-get-set-dp/SKILL.md +0 -194
  329. package/ai/skills/concorde-imports/SKILL.md +0 -78
  330. package/ai/skills/concorde-menu/SKILL.md +0 -74
  331. package/ai/skills/concorde-scope/SKILL.md +0 -70
  332. package/ai/skills/concorde-theme/SKILL.md +0 -57
  333. package/docs/.htaccess +0 -75
  334. package/docs/404.html +0 -15
  335. package/docs/404.md +0 -5
  336. package/docs/assets/index-BgG6FFPt.js +0 -11765
  337. package/docs/assets/index-x89XINSG.css +0 -1
  338. package/docs/core/components/functional/date/date.html +0 -211
  339. package/docs/core/components/functional/date/date.md +0 -150
  340. package/docs/core/components/functional/fetch/fetch.html +0 -180
  341. package/docs/core/components/functional/fetch/fetch.md +0 -108
  342. package/docs/core/components/functional/if/if.html +0 -65
  343. package/docs/core/components/functional/if/if.md +0 -34
  344. package/docs/core/components/functional/jsonata/jsonata.html +0 -110
  345. package/docs/core/components/functional/jsonata/jsonata.md +0 -61
  346. package/docs/core/components/functional/list/list.html +0 -198
  347. package/docs/core/components/functional/list/list.md +0 -121
  348. package/docs/core/components/functional/mix/mix.html +0 -78
  349. package/docs/core/components/functional/mix/mix.md +0 -46
  350. package/docs/core/components/functional/queue/queue.html +0 -155
  351. package/docs/core/components/functional/queue/queue.md +0 -51
  352. package/docs/core/components/functional/router/router.html +0 -154
  353. package/docs/core/components/functional/router/router.md +0 -93
  354. package/docs/core/components/functional/sdui/sdui-extension-points.md +0 -94
  355. package/docs/core/components/functional/sdui/sdui.html +0 -397
  356. package/docs/core/components/functional/sdui/sdui.md +0 -307
  357. package/docs/core/components/functional/states/states.html +0 -141
  358. package/docs/core/components/functional/states/states.md +0 -112
  359. package/docs/core/components/functional/submit/submit.html +0 -178
  360. package/docs/core/components/functional/submit/submit.md +0 -106
  361. package/docs/core/components/functional/subscriber/subscriber.md +0 -91
  362. package/docs/core/components/functional/translation/translation.html +0 -60
  363. package/docs/core/components/functional/translation/translation.md +0 -38
  364. package/docs/core/components/functional/value/value.html +0 -81
  365. package/docs/core/components/functional/value/value.md +0 -47
  366. package/docs/core/components/ui/alert/alert.md +0 -186
  367. package/docs/core/components/ui/alert-messages/alert-messages.md +0 -85
  368. package/docs/core/components/ui/badge/badge.md +0 -181
  369. package/docs/core/components/ui/button/button.html +0 -309
  370. package/docs/core/components/ui/button/button.md +0 -216
  371. package/docs/core/components/ui/captcha/captcha.html +0 -80
  372. package/docs/core/components/ui/captcha/captcha.md +0 -56
  373. package/docs/core/components/ui/card/card.md +0 -215
  374. package/docs/core/components/ui/divider/divider.md +0 -126
  375. package/docs/core/components/ui/form/checkbox/checkbox.html +0 -200
  376. package/docs/core/components/ui/form/checkbox/checkbox.md +0 -125
  377. package/docs/core/components/ui/form/fieldset/fieldset.html +0 -238
  378. package/docs/core/components/ui/form/fieldset/fieldset.md +0 -161
  379. package/docs/core/components/ui/form/form-actions/form-actions.md +0 -98
  380. package/docs/core/components/ui/form/form-layout/form-layout.html +0 -115
  381. package/docs/core/components/ui/form/form-layout/form-layout.md +0 -109
  382. package/docs/core/components/ui/form/input/input.html +0 -235
  383. package/docs/core/components/ui/form/input/input.md +0 -142
  384. package/docs/core/components/ui/form/radio/radio.html +0 -144
  385. package/docs/core/components/ui/form/radio/radio.md +0 -78
  386. package/docs/core/components/ui/form/select/select.html +0 -178
  387. package/docs/core/components/ui/form/select/select.md +0 -86
  388. package/docs/core/components/ui/form/switch/switch.html +0 -146
  389. package/docs/core/components/ui/form/switch/switch.md +0 -80
  390. package/docs/core/components/ui/form/textarea/textarea.html +0 -162
  391. package/docs/core/components/ui/form/textarea/textarea.md +0 -82
  392. package/docs/core/components/ui/group/group.html +0 -113
  393. package/docs/core/components/ui/group/group.md +0 -77
  394. package/docs/core/components/ui/icon/icon.md +0 -214
  395. package/docs/core/components/ui/image/image.html +0 -194
  396. package/docs/core/components/ui/image/image.md +0 -167
  397. package/docs/core/components/ui/link/link.md +0 -81
  398. package/docs/core/components/ui/loader/loader.html +0 -114
  399. package/docs/core/components/ui/loader/loader.md +0 -87
  400. package/docs/core/components/ui/menu/menu.md +0 -370
  401. package/docs/core/components/ui/modal/modal.html +0 -324
  402. package/docs/core/components/ui/modal/modal.md +0 -211
  403. package/docs/core/components/ui/pop/pop.html +0 -250
  404. package/docs/core/components/ui/pop/pop.md +0 -216
  405. package/docs/core/components/ui/progress/progress.md +0 -109
  406. package/docs/core/components/ui/table/table.html +0 -333
  407. package/docs/core/components/ui/table/table.md +0 -267
  408. package/docs/core/components/ui/theme/theme.html +0 -116
  409. package/docs/core/components/ui/theme/theme.md +0 -97
  410. package/docs/core/components/ui/toast/toast.html +0 -185
  411. package/docs/core/components/ui/toast/toast.md +0 -147
  412. package/docs/core/components/ui/tooltip/tooltip.html +0 -112
  413. package/docs/core/components/ui/tooltip/tooltip.md +0 -89
  414. package/docs/docs/decorators/ancestor-attribute.html +0 -71
  415. package/docs/docs/decorators/ancestor-attribute.md +0 -59
  416. package/docs/docs/decorators/auto-subscribe.html +0 -61
  417. package/docs/docs/decorators/auto-subscribe.md +0 -40
  418. package/docs/docs/decorators/bind.html +0 -86
  419. package/docs/docs/decorators/bind.md +0 -77
  420. package/docs/docs/decorators/get.html +0 -166
  421. package/docs/docs/decorators/get.md +0 -160
  422. package/docs/docs/decorators/handle.html +0 -139
  423. package/docs/docs/decorators/handle.md +0 -119
  424. package/docs/docs/decorators/on-assign.html +0 -72
  425. package/docs/docs/decorators/on-assign.md +0 -63
  426. package/docs/docs/decorators/patch.html +0 -76
  427. package/docs/docs/decorators/patch.md +0 -44
  428. package/docs/docs/decorators/post.html +0 -150
  429. package/docs/docs/decorators/post.md +0 -134
  430. package/docs/docs/decorators/publish.html +0 -74
  431. package/docs/docs/decorators/publish.md +0 -56
  432. package/docs/docs/decorators/put.html +0 -83
  433. package/docs/docs/decorators/put.md +0 -51
  434. package/docs/docs/decorators/subscribe.html +0 -91
  435. package/docs/docs/decorators/subscribe.md +0 -87
  436. package/docs/docs/decorators/wait-for-ancestors.html +0 -82
  437. package/docs/docs/decorators/wait-for-ancestors.md +0 -76
  438. package/docs/docs/directives/sub.html +0 -79
  439. package/docs/docs/directives/sub.md +0 -75
  440. package/docs/docs/directives/t.html +0 -91
  441. package/docs/docs/directives/t.md +0 -73
  442. package/docs/docs/getting-started/ai-agents.md +0 -76
  443. package/docs/docs/getting-started/components.html +0 -27
  444. package/docs/docs/getting-started/components.md +0 -5
  445. package/docs/docs/getting-started/installation.html +0 -69
  446. package/docs/docs/getting-started/installation.md +0 -36
  447. package/docs/docs/getting-started/my-first-component.md +0 -227
  448. package/docs/docs/getting-started/start.html +0 -47
  449. package/docs/docs/getting-started/start.md +0 -35
  450. package/docs/docs/getting-started/theming.md +0 -253
  451. package/docs/docs/index.html +0 -99
  452. package/docs/docs/misc/api-configuration.md +0 -79
  453. package/docs/docs/misc/dataProviderKey.md +0 -168
  454. package/docs/hubs/decorators.html +0 -443
  455. package/docs/hubs/form-components.html +0 -404
  456. package/docs/hubs/remote-data.html +0 -371
  457. package/docs/img/archive/concorde-001-2cv.webp +0 -0
  458. package/docs/img/archive/concorde-red-arrows-2002-poster.jpg +0 -0
  459. package/docs/img/archive/concorde-red-arrows-2002.webm +0 -0
  460. package/docs/img/archive/credits.json +0 -28
  461. package/docs/index.md +0 -22
  462. package/docs/src/core/components/functional/translation/translation.md +0 -38
  463. package/docs/src/docs/decorators/ancestor-attribute.md +0 -59
  464. package/docs/src/docs/decorators/auto-subscribe.md +0 -40
  465. package/docs/src/docs/decorators/bind.md +0 -77
  466. package/docs/src/docs/decorators/get.md +0 -160
  467. package/docs/src/docs/decorators/handle.md +0 -119
  468. package/docs/src/docs/decorators/on-assign.md +0 -63
  469. package/docs/src/docs/decorators/patch.md +0 -44
  470. package/docs/src/docs/decorators/post.md +0 -134
  471. package/docs/src/docs/decorators/publish.md +0 -56
  472. package/docs/src/docs/decorators/put.md +0 -51
  473. package/docs/src/docs/decorators/subscribe.md +0 -87
  474. package/docs/src/docs/decorators/wait-for-ancestors.md +0 -76
  475. package/docs/src/docs/directives/sub.md +0 -75
  476. package/docs/src/docs/directives/t.md +0 -73
  477. package/docs/src/docs/getting-started/components.md +0 -5
  478. package/docs/src/docs/getting-started/create-a-component.md +0 -136
  479. package/docs/src/docs/getting-started/dataFlow.md +0 -87
  480. package/docs/src/docs/getting-started/installation.md +0 -36
  481. package/docs/src/docs/misc/docs-mock-api.md +0 -62
  482. package/docs/src/docs/misc/dynamic-path.md +0 -71
  483. package/docs/src/docs/misc/endpoint.md +0 -45
  484. package/docs/src/docs/misc/html-integration.md +0 -14
  485. /package/{docs → dist}/img/concorde/plane_01.jpg +0 -0
  486. /package/{docs → dist}/img/concorde/plane_02.jpg +0 -0
  487. /package/{docs → dist}/img/concorde/plane_03.jpg +0 -0
  488. /package/{docs → dist}/img/concorde/plane_04.jpg +0 -0
  489. /package/{docs → dist}/img/concorde/plane_05.jpg +0 -0
  490. /package/{docs → dist}/img/concorde/plane_06.jpg +0 -0
  491. /package/{docs → dist}/img/concorde/plane_07.jpg +0 -0
  492. /package/{docs → dist}/img/concorde/plane_08.jpg +0 -0
  493. /package/{docs → dist}/img/concorde/plane_09.jpg +0 -0
  494. /package/{docs → dist}/img/concorde/plane_10.jpg +0 -0
  495. /package/{docs → dist}/img/concorde/plane_11.jpg +0 -0
  496. /package/{docs → dist}/img/concorde/plane_12.jpg +0 -0
  497. /package/{docs → dist}/img/concorde/plane_13.jpg +0 -0
@@ -1,114 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en" data-doc-url="https://concorde.supersoniks.org/core/components/ui/loader" data-doc-id="core/components/ui/loader/loader">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Loader — Concorde by Supersoniks</title>
7
- <meta name="description" content="sonic-loader shows a loading animation, either in the content flow or as a viewport overlay. With no mode, it is fixed (centered overlay); use mode=&quot;inline&quot; inside content areas. For Fetch and List, s">
8
- <meta name="keywords" content="Concorde, supersoniks, core/components/ui/loader/loader, loader, Loader, UI component, sonic-loader, web component, mode, fixed, mode=&quot;inline&quot;, inline, align, left">
9
- <meta name="concorde-doc-id" content="core/components/ui/loader/loader">
10
- <link rel="canonical" href="https://concorde.supersoniks.org/core/components/ui/loader">
11
- <link rel="alternate" type="text/markdown" href="https://concorde.supersoniks.org/core/components/ui/loader.md">
12
- </head>
13
- <body>
14
- <header>
15
- <p><a href="/docs/index.html">Concorde documentation</a> · <a href="https://concorde.supersoniks.org/core/components/ui/loader">same URL (interactive)</a> · <a href="/llms.txt">llms.txt</a></p>
16
- </header>
17
- <main>
18
- <article>
19
- <p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Loader</strong>. sonic-loader shows a loading animation, either in the content flow or as a viewport overlay. With no mode, it is fixed (centered overlay); use mode=&quot;inline&quot; inside content areas. For Fetch and List, s <span>Doc ID: <code>core/components/ui/loader/loader</code>. Keywords: Concorde, supersoniks, core/components/ui/loader/loader, loader, Loader, UI component, sonic-loader, web component, mode, fixed, mode=&quot;inline&quot;, inline, align, left. URL: <a href="https://concorde.supersoniks.org/core/components/ui/loader">https://concorde.supersoniks.org/core/components/ui/loader</a>.</span></p>
20
- <h1 id="loader">Loader</h1>
21
- <p><strong><code>sonic-loader</code></strong> shows a loading animation, either in the content flow or as a viewport overlay. With no <code>mode</code>, it is <code>fixed</code> (centered overlay); use <code>mode=&quot;inline&quot;</code> inside content areas. For <a href="/core/components/functional/fetch">Fetch</a> and <a href="/core/components/functional/list">List</a>, set their <code>loader</code> attribute instead of adding the tag yourself.</p>
22
- <h2 id="mode">Mode</h2>
23
- <p><code>inline</code> renders an ellipsis animation in the document flow. <code>fixed</code> (default) covers the viewport with a centered animation; toggle it with the checkbox below.</p>
24
- <pre><code>&lt;sonic-loader mode=&quot;inline&quot;&gt;&lt;/sonic-loader&gt;
25
- </code></pre>
26
- <p><docs-lit-demo for="docs-toggle-loader-demo"></docs-lit-demo></p>
27
- <h2 id="alignment-and-color">Alignment and color</h2>
28
- <p><code>align</code> only affects <code>mode=&quot;inline&quot;</code>: <code>left</code> · <code>center</code> (default) · <code>right</code>. Dots use <code>--sc-primary</code>; set <code>currentColor</code> to follow the host <code>color</code>.</p>
29
- <pre><code>&lt;div class=&quot;grid gap-4&quot;&gt;
30
- &lt;sonic-loader mode=&quot;inline&quot; currentColor style=&quot;color: purple;&quot;&gt;&lt;/sonic-loader&gt;
31
- &lt;sonic-loader mode=&quot;inline&quot; align=&quot;left&quot;&gt;&lt;/sonic-loader&gt;
32
- &lt;sonic-loader mode=&quot;inline&quot; align=&quot;center&quot;&gt;&lt;/sonic-loader&gt;
33
- &lt;sonic-loader mode=&quot;inline&quot; align=&quot;right&quot;&gt;&lt;/sonic-loader&gt;
34
- &lt;/div&gt;
35
- </code></pre>
36
- <h2 id="delay">Delay</h2>
37
- <p>A <code>fixed</code> loader waits 0.5 s before fading in, so short requests show nothing. <code>inline</code> loaders appear at once. Set <code>noDelay</code> (or pass <code>noDelay: true</code> to <code>Loader.show()</code>) to show a <code>fixed</code> loader immediately.</p>
38
- <pre><code>&lt;sonic-loader mode=&quot;inline&quot; noDelay&gt;&lt;/sonic-loader&gt;
39
- </code></pre>
40
- <h2 id="accessibility">Accessibility</h2>
41
- <p>The animation is <code>aria-hidden</code> by default so screen readers are not flooded on every request. Set <code>announce</code> when the loader appears after a user action: the host gets <code>role=&quot;status&quot;</code>, <code>aria-live=&quot;polite&quot;</code> and a localized &quot;Loading&quot; label. For a busy button, use the <code>loading</code> attribute of <code>sonic-button</code> instead.</p>
42
- <pre><code>&lt;div class=&quot;flex flex-wrap items-center gap-4&quot;&gt;
43
- &lt;sonic-loader mode=&quot;inline&quot; announce&gt;&lt;/sonic-loader&gt;
44
- &lt;sonic-button loading&gt;Confirm check-in&lt;/sonic-button&gt;
45
- &lt;/div&gt;
46
- </code></pre>
47
- <h2 id="show-and-hide-programmatically">Show and hide programmatically</h2>
48
- <p><code>Loader.show()</code> mounts one shared instance; <code>Loader.hide()</code> is reference-counted, so call it once per <code>show()</code>. <strong>Without <code>container</code>, the loader goes to the theme pop container and <code>mode</code> is forced to <code>fixed</code>.</strong></p>
49
- <pre><code class="language-javascript">import { Loader } from &quot;@supersoniks/concorde/ui/loader&quot;;
50
-
51
- Loader.show({ announce: true });
52
- // …
53
- Loader.hide();
54
-
55
- // Inline loader inside a given element
56
- Loader.show({ mode: &quot;inline&quot;, container: document.querySelector(&quot;#results&quot;) });
57
- </code></pre>
58
- <h2 id="api-reference">API reference</h2>
59
- <table>
60
- <thead>
61
- <tr>
62
- <th>Attribute</th>
63
- <th>Values</th>
64
- <th>Description</th>
65
- </tr>
66
- </thead>
67
- <tbody><tr>
68
- <td><code>mode</code></td>
69
- <td><code>inline</code> · <code>fixed</code> (default <code>fixed</code>)</td>
70
- <td>In-flow ellipsis or viewport-centered overlay</td>
71
- </tr>
72
- <tr>
73
- <td><code>noDelay</code></td>
74
- <td>boolean</td>
75
- <td>Skips the 0.5 s fade-in delay of <code>fixed</code></td>
76
- </tr>
77
- <tr>
78
- <td><code>announce</code></td>
79
- <td>boolean</td>
80
- <td>Adds <code>role=&quot;status&quot;</code>, <code>aria-live=&quot;polite&quot;</code> and a localized label</td>
81
- </tr>
82
- <tr>
83
- <td><code>align</code></td>
84
- <td><code>left</code> · <code>center</code> · <code>right</code> (default <code>center</code>)</td>
85
- <td>Horizontal alignment, <code>mode=&quot;inline&quot;</code> only</td>
86
- </tr>
87
- <tr>
88
- <td><code>currentColor</code></td>
89
- <td>boolean</td>
90
- <td>Dots use <code>currentColor</code> instead of <code>--sc-primary</code></td>
91
- </tr>
92
- </tbody></table>
93
- <p>No slots.</p>
94
- <table>
95
- <thead>
96
- <tr>
97
- <th>Static method</th>
98
- <th>Description</th>
99
- </tr>
100
- </thead>
101
- <tbody><tr>
102
- <td><code>Loader.show(conf?)</code></td>
103
- <td>Mounts the shared instance. <code>conf</code>: <code>mode</code> · <code>noDelay</code> · <code>announce</code> · <code>container</code></td>
104
- </tr>
105
- <tr>
106
- <td><code>Loader.hide()</code></td>
107
- <td>Decrements the show counter; removes the instance when it reaches zero</td>
108
- </tr>
109
- </tbody></table>
110
-
111
- </article>
112
- </main>
113
- </body>
114
- </html>
@@ -1,87 +0,0 @@
1
- # Loader
2
-
3
- **`sonic-loader`** shows a loading animation, either in the content flow or as a viewport overlay. With no `mode`, it is `fixed` (centered overlay); use `mode="inline"` inside content areas. For [Fetch](/core/components/functional/fetch) and [List](/core/components/functional/list), set their `loader` attribute instead of adding the tag yourself.
4
-
5
- ## Mode
6
-
7
- `inline` renders an ellipsis animation in the document flow. `fixed` (default) covers the viewport with a centered animation; toggle it with the checkbox below.
8
-
9
- <sonic-code>
10
- <template>
11
- <sonic-loader mode="inline"></sonic-loader>
12
- </template>
13
- </sonic-code>
14
-
15
- <docs-lit-demo for="docs-toggle-loader-demo"></docs-lit-demo>
16
-
17
- ## Alignment and color
18
-
19
- `align` only affects `mode="inline"`: `left` · `center` (default) · `right`. Dots use `--sc-primary`; set `currentColor` to follow the host `color`.
20
-
21
- <sonic-code>
22
- <template>
23
- <div class="grid gap-4">
24
- <sonic-loader mode="inline" currentColor style="color: purple;"></sonic-loader>
25
- <sonic-loader mode="inline" align="left"></sonic-loader>
26
- <sonic-loader mode="inline" align="center"></sonic-loader>
27
- <sonic-loader mode="inline" align="right"></sonic-loader>
28
- </div>
29
- </template>
30
- </sonic-code>
31
-
32
- ## Delay
33
-
34
- A `fixed` loader waits 0.5 s before fading in, so short requests show nothing. `inline` loaders appear at once. Set `noDelay` (or pass `noDelay: true` to `Loader.show()`) to show a `fixed` loader immediately.
35
-
36
- <sonic-code>
37
- <template>
38
- <sonic-loader mode="inline" noDelay></sonic-loader>
39
- </template>
40
- </sonic-code>
41
-
42
- ## Accessibility
43
-
44
- The animation is `aria-hidden` by default so screen readers are not flooded on every request. Set `announce` when the loader appears after a user action: the host gets `role="status"`, `aria-live="polite"` and a localized "Loading" label. For a busy button, use the `loading` attribute of `sonic-button` instead.
45
-
46
- <sonic-code>
47
- <template>
48
- <div class="flex flex-wrap items-center gap-4">
49
- <sonic-loader mode="inline" announce></sonic-loader>
50
- <sonic-button loading>Confirm check-in</sonic-button>
51
- </div>
52
- </template>
53
- </sonic-code>
54
-
55
- ## Show and hide programmatically
56
-
57
- `Loader.show()` mounts one shared instance; `Loader.hide()` is reference-counted, so call it once per `show()`. **Without `container`, the loader goes to the theme pop container and `mode` is forced to `fixed`.**
58
-
59
- <sonic-code language="javascript">
60
- <template>
61
- import { Loader } from "@supersoniks/concorde/ui/loader";
62
-
63
- Loader.show({ announce: true });
64
- // …
65
- Loader.hide();
66
-
67
- // Inline loader inside a given element
68
- Loader.show({ mode: "inline", container: document.querySelector("#results") });
69
- </template>
70
- </sonic-code>
71
-
72
- ## API reference
73
-
74
- | Attribute | Values | Description |
75
- |----------|---------|-------------|
76
- | `mode` | `inline` · `fixed` (default `fixed`) | In-flow ellipsis or viewport-centered overlay |
77
- | `noDelay` | boolean | Skips the 0.5 s fade-in delay of `fixed` |
78
- | `announce` | boolean | Adds `role="status"`, `aria-live="polite"` and a localized label |
79
- | `align` | `left` · `center` · `right` (default `center`) | Horizontal alignment, `mode="inline"` only |
80
- | `currentColor` | boolean | Dots use `currentColor` instead of `--sc-primary` |
81
-
82
- No slots.
83
-
84
- | Static method | Description |
85
- |--------|-------------|
86
- | `Loader.show(conf?)` | Mounts the shared instance. `conf`: `mode` · `noDelay` · `announce` · `container` |
87
- | `Loader.hide()` | Decrements the show counter; removes the instance when it reaches zero |
@@ -1,370 +0,0 @@
1
- # Menu
2
-
3
- **`sonic-menu`** lays out navigation or actions as a **`direction`** row or column of **`sonic-menu-item`** entries (ghost **`variant`** and block **`shape`** by default), optional **`sonic-divider`** separators, and overflow content in the **`more`** slot (popover “…” trigger). Set `href` / `pushstate` / `autoActive` on each `sonic-menu-item` (same API as `sonic-button`), not on the menu host.
4
-
5
- ## Basic example
6
-
7
- <sonic-code>
8
- <template>
9
- <sonic-menu direction="row">
10
- <sonic-menu-item variant="ghost">
11
- <sonic-icon library="iconoir" name="home" slot="prefix"></sonic-icon>
12
- Home
13
- </sonic-menu-item>
14
- <sonic-menu-item>
15
- <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
16
- Profile
17
- </sonic-menu-item>
18
- <sonic-menu-item type="danger">
19
- <sonic-icon library="iconoir" name="log-out" slot="prefix"></sonic-icon>
20
- Log out
21
- </sonic-menu-item>
22
- </sonic-menu>
23
- </template>
24
- </sonic-code>
25
-
26
- ## Direction
27
-
28
- Default **`direction`** is **`column`**. Use **`row`** for horizontal toolbars or tabs.
29
-
30
- <sonic-code>
31
- <template>
32
- <sonic-menu direction="row">
33
- <sonic-menu-item variant="ghost">
34
- <sonic-icon library="iconoir" name="arrow-right" slot="prefix"></sonic-icon>
35
- Row
36
- </sonic-menu-item>
37
- <sonic-menu-item>
38
- <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
39
- Profile
40
- </sonic-menu-item>
41
- <sonic-menu-item>
42
- <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
43
- Flights
44
- </sonic-menu-item>
45
- <sonic-menu-item>
46
- <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
47
- Baggage
48
- </sonic-menu-item>
49
- <sonic-menu-item type="danger">
50
- <sonic-icon library="iconoir" name="log-out" slot="prefix"></sonic-icon>
51
- Log out
52
- </sonic-menu-item>
53
- </sonic-menu>
54
- <sonic-menu direction="column">
55
- <sonic-menu-item variant="ghost">
56
- <sonic-icon library="iconoir" name="arrow-down" slot="prefix"></sonic-icon>
57
- Column
58
- </sonic-menu-item>
59
- <sonic-menu-item>
60
- <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
61
- Profile
62
- </sonic-menu-item>
63
- <sonic-menu-item>
64
- <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
65
- Flights
66
- </sonic-menu-item>
67
- <sonic-menu-item>
68
- <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
69
- Baggage
70
- </sonic-menu-item>
71
- <sonic-menu-item type="danger">
72
- <sonic-icon library="iconoir" name="log-out" slot="prefix"></sonic-icon>
73
- Log out
74
- </sonic-menu-item>
75
- </sonic-menu>
76
- </template>
77
- </sonic-code>
78
-
79
- ## Size
80
-
81
- **`size`** on the menu propagates to items and the **`more`** trigger when they omit their own **`size`**.
82
-
83
- <sonic-code>
84
- <template>
85
- <div class="grid gap-3">
86
- <sonic-menu size="xs" direction="row">
87
- <sonic-menu-item>XS</sonic-menu-item>
88
- <sonic-menu-item>
89
- <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
90
- Profile
91
- </sonic-menu-item>
92
- <sonic-menu-item>
93
- <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
94
- Flights
95
- </sonic-menu-item>
96
- <sonic-menu-item>
97
- <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
98
- Baggage
99
- </sonic-menu-item>
100
- </sonic-menu>
101
- <sonic-menu size="sm" direction="row">
102
- <sonic-menu-item>Small</sonic-menu-item>
103
- <sonic-menu-item>
104
- <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
105
- Profile
106
- </sonic-menu-item>
107
- <sonic-menu-item>
108
- <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
109
- Flights
110
- </sonic-menu-item>
111
- <sonic-menu-item>
112
- <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
113
- Baggage
114
- </sonic-menu-item>
115
- </sonic-menu>
116
- <sonic-menu direction="row">
117
- <sonic-menu-item>Medium</sonic-menu-item>
118
- <sonic-menu-item>
119
- <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
120
- Profile
121
- </sonic-menu-item>
122
- <sonic-menu-item>
123
- <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
124
- Flights
125
- </sonic-menu-item>
126
- <sonic-menu-item>
127
- <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
128
- Baggage
129
- </sonic-menu-item>
130
- </sonic-menu>
131
- <sonic-menu size="lg" direction="row">
132
- <sonic-menu-item>Large</sonic-menu-item>
133
- <sonic-menu-item>
134
- <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
135
- Profile
136
- </sonic-menu-item>
137
- <sonic-menu-item>
138
- <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
139
- Flights
140
- </sonic-menu-item>
141
- <sonic-menu-item>
142
- <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
143
- Baggage
144
- </sonic-menu-item>
145
- </sonic-menu>
146
- <sonic-menu size="xl" direction="row">
147
- <sonic-menu-item>XL</sonic-menu-item>
148
- <sonic-menu-item>
149
- <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
150
- Profile
151
- </sonic-menu-item>
152
- <sonic-menu-item>
153
- <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
154
- Flights
155
- </sonic-menu-item>
156
- <sonic-menu-item>
157
- <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
158
- Baggage
159
- </sonic-menu-item>
160
- </sonic-menu>
161
- </div>
162
- </template>
163
- </sonic-code>
164
-
165
- ## Shadow
166
-
167
- Optional **`shadow`** wraps the menu surface (no shadow when omitted).
168
-
169
- <sonic-code>
170
- <template>
171
- <div class="grid gap-3">
172
- <sonic-menu direction="row">
173
- <sonic-menu-item>None</sonic-menu-item>
174
- </sonic-menu>
175
- <sonic-menu shadow="sm" direction="row">
176
- <sonic-menu-item>Small</sonic-menu-item>
177
- </sonic-menu>
178
- <sonic-menu shadow="md" direction="row">
179
- <sonic-menu-item>Medium</sonic-menu-item>
180
- </sonic-menu>
181
- <sonic-menu shadow="lg" direction="row">
182
- <sonic-menu-item>Large</sonic-menu-item>
183
- </sonic-menu>
184
- </div>
185
- </template>
186
- </sonic-code>
187
-
188
- ## Align
189
-
190
- **`align`** propagates to items except square / circle **`shape`**.
191
-
192
- <sonic-code>
193
- <template>
194
- <div class="grid gap-3">
195
- <sonic-menu align="center">
196
- <sonic-menu-item variant="ghost">
197
- <sonic-icon library="iconoir" name="home"></sonic-icon>
198
- Home
199
- </sonic-menu-item>
200
- <sonic-menu-item>
201
- <sonic-icon library="iconoir" name="user"></sonic-icon>
202
- Profile
203
- </sonic-menu-item>
204
- </sonic-menu>
205
- <sonic-menu align="left">
206
- <sonic-menu-item variant="ghost">
207
- <sonic-icon library="iconoir" name="home"></sonic-icon>
208
- Home
209
- </sonic-menu-item>
210
- <sonic-menu-item>
211
- <sonic-icon library="iconoir" name="user"></sonic-icon>
212
- Profile
213
- </sonic-menu-item>
214
- </sonic-menu>
215
- <sonic-menu align="right">
216
- <sonic-menu-item variant="ghost">
217
- <sonic-icon library="iconoir" name="home"></sonic-icon>
218
- Home
219
- </sonic-menu-item>
220
- <sonic-menu-item>
221
- <sonic-icon library="iconoir" name="user"></sonic-icon>
222
- Profile
223
- </sonic-menu-item>
224
- </sonic-menu>
225
- </div>
226
- </template>
227
- </sonic-code>
228
-
229
- ## More
230
-
231
- Assign nodes to **`slot="more"`** to show the overflow popover. The trigger appears only when the slot has content. Icon orientation follows **`direction`** (vertical ellipsis in a row menu).
232
-
233
- <sonic-code>
234
- <template>
235
- <sonic-menu direction="row">
236
- <sonic-menu-item variant="ghost">
237
- <sonic-icon library="iconoir" name="home"></sonic-icon>
238
- Home
239
- </sonic-menu-item>
240
- <sonic-menu-item>
241
- <sonic-icon library="iconoir" name="user"></sonic-icon>
242
- Profile
243
- </sonic-menu-item>
244
- <sonic-menu-item>
245
- <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
246
- Flights
247
- </sonic-menu-item>
248
- <sonic-menu-item>
249
- <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
250
- Baggage
251
- </sonic-menu-item>
252
- <sonic-menu slot="more">
253
- <sonic-menu-item>
254
- <sonic-icon library="iconoir" name="settings" slot="prefix"></sonic-icon>
255
- Settings
256
- </sonic-menu-item>
257
- <sonic-menu-item>
258
- <sonic-icon library="iconoir" name="chat-bubble" slot="prefix"></sonic-icon>
259
- Messages
260
- </sonic-menu-item>
261
- <sonic-divider></sonic-divider>
262
- <sonic-menu-item type="danger">
263
- <sonic-icon library="iconoir" name="log-out" slot="prefix"></sonic-icon>
264
- Log out
265
- </sonic-menu-item>
266
- </sonic-menu>
267
- </sonic-menu>
268
- </template>
269
- </sonic-code>
270
-
271
- ## Scrollable
272
-
273
- With **`scrollable`**, the main slot scrolls with edge fade masks; drag-to-scroll works on pointer devices. When exactly one item is **`active`**, the menu scrolls it into view.
274
-
275
- <sonic-code>
276
- <template>
277
- <sonic-menu direction="row" scrollable>
278
- <sonic-menu-item variant="ghost">
279
- <sonic-icon library="iconoir" name="home" slot="prefix"></sonic-icon>
280
- Home
281
- </sonic-menu-item>
282
- <sonic-menu-item>
283
- <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
284
- Profile
285
- </sonic-menu-item>
286
- <sonic-menu-item>
287
- <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
288
- Flights
289
- </sonic-menu-item>
290
- <sonic-menu-item>
291
- <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
292
- Baggage
293
- </sonic-menu-item>
294
- <sonic-menu-item variant="ghost">
295
- <sonic-icon library="iconoir" name="home" slot="prefix"></sonic-icon>
296
- Home
297
- </sonic-menu-item>
298
- <sonic-menu-item>
299
- <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
300
- Profile
301
- </sonic-menu-item>
302
- <sonic-menu-item>
303
- <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
304
- Flights
305
- </sonic-menu-item>
306
- <sonic-menu-item>
307
- <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
308
- Baggage
309
- </sonic-menu-item>
310
- <sonic-menu-item variant="ghost">
311
- <sonic-icon library="iconoir" name="home" slot="prefix"></sonic-icon>
312
- Home
313
- </sonic-menu-item>
314
- <sonic-menu-item>
315
- <sonic-icon library="iconoir" name="user" slot="prefix"></sonic-icon>
316
- Profile
317
- </sonic-menu-item>
318
- <sonic-menu-item>
319
- <sonic-icon library="iconoir" name="clock-outline" slot="prefix"></sonic-icon>
320
- Flights
321
- </sonic-menu-item>
322
- <sonic-menu-item>
323
- <sonic-icon library="iconoir" name="bag" slot="prefix"></sonic-icon>
324
- Baggage
325
- </sonic-menu-item>
326
- <sonic-menu-item>
327
- <sonic-icon library="iconoir" name="settings" slot="prefix"></sonic-icon>
328
- Settings
329
- </sonic-menu-item>
330
- <sonic-menu-item>
331
- <sonic-icon library="iconoir" name="chat-bubble" slot="prefix"></sonic-icon>
332
- Messages
333
- </sonic-menu-item>
334
- <sonic-menu slot="more">
335
- <sonic-menu-item>
336
- <sonic-icon library="iconoir" name="settings" slot="prefix"></sonic-icon>
337
- Settings
338
- </sonic-menu-item>
339
- <sonic-menu-item>
340
- <sonic-icon library="iconoir" name="chat-bubble" slot="prefix"></sonic-icon>
341
- Messages
342
- </sonic-menu-item>
343
- <sonic-divider></sonic-divider>
344
- <sonic-menu-item type="danger">
345
- <sonic-icon library="iconoir" name="log-out" slot="prefix"></sonic-icon>
346
- Log out
347
- </sonic-menu-item>
348
- </sonic-menu>
349
- </sonic-menu>
350
- </template>
351
- </sonic-code>
352
-
353
- ## API reference
354
-
355
- | Attribute | Values | Description |
356
- |----------|---------|-------------|
357
- | `direction` | `column` (default) · `row` | Vertical list or horizontal bar |
358
- | `align` | `left` (default) · `center` · `right` | Alignment propagated to items (except square / circle **`shape`**) |
359
- | `size` | `2xs` … `2xl` (default: items keep their own size) | Propagated to items and the **`more`** trigger when unset on the item |
360
- | `shadow` | `none` · `sm` · `md` · `lg` | Shadow around the menu; none when omitted |
361
- | `minWidth` | CSS length | Minimum width of the container (default `0`) |
362
- | `scrollable` | boolean | Scroll with edge fade; auto-scroll when a single item is **`active`** |
363
- | `moreShape` | `circle` (default) · `square` | Shape of the **`more`** slot trigger button |
364
-
365
- | Slot | Description |
366
- |------|-------------|
367
- | *(default)* | Visible items: `sonic-menu-item` · `sonic-divider` · nested `sonic-menu` |
368
- | `more` | Popover content for the “…” control; shown only when the slot has assigned nodes |
369
-
370
- **`sonic-menu-item`** extends **`sonic-button`** (defaults `variant="ghost"` and `shape="block"`). See [Button](/core/components/ui/button) for `type` · `variant` · `href` · `pushstate` · `autoActive` and the item slots.