@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,116 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en" data-doc-url="https://concorde.supersoniks.org/core/components/ui/theme" data-doc-id="core/components/ui/theme/theme">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Theme — Concorde by Supersoniks</title>
7
- <meta name="description" content="sonic-theme is the root element of a Concorde UI: it holds the --sc-* design tokens, optionally applies a built-in palette, and is where popovers, modals and toasts are mounted. Import @supersoniks/co">
8
- <meta name="keywords" content="Concorde, supersoniks, core/components/ui/theme/theme, theme, Theme, UI component, sonic-theme, web component, --sc-*, @supersoniks/concorde/theme, theme=&quot;custom&quot;, light, dark, auto, prefers-color-scheme">
9
- <meta name="concorde-doc-id" content="core/components/ui/theme/theme">
10
- <link rel="canonical" href="https://concorde.supersoniks.org/core/components/ui/theme">
11
- <link rel="alternate" type="text/markdown" href="https://concorde.supersoniks.org/core/components/ui/theme.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/theme">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 — Theme</strong>. sonic-theme is the root element of a Concorde UI: it holds the --sc-* design tokens, optionally applies a built-in palette, and is where popovers, modals and toasts are mounted. Import @supersoniks/co <span>Doc ID: <code>core/components/ui/theme/theme</code>. Keywords: Concorde, supersoniks, core/components/ui/theme/theme, theme, Theme, UI component, sonic-theme, web component, --sc-*, @supersoniks/concorde/theme, theme=&quot;custom&quot;, light, dark, auto, prefers-color-scheme. URL: <a href="https://concorde.supersoniks.org/core/components/ui/theme">https://concorde.supersoniks.org/core/components/ui/theme</a>.</span></p>
20
- <h1 id="theme">Theme</h1>
21
- <p><strong><code>sonic-theme</code></strong> is the root element of a Concorde UI: it holds the <code>--sc-*</code> design tokens, optionally applies a built-in palette, and is where popovers, modals and toasts are mounted. Import <code>@supersoniks/concorde/theme</code> once at the app entry and wrap your app in it. Token names and brand overrides are covered in <a href="/docs/getting-started/theming">Theming</a>.</p>
22
- <h2 id="basic-example">Basic example</h2>
23
- <pre><code>&lt;sonic-theme color font class=&quot;block bg-base p-6 rounded-lg&quot;&gt;
24
- &lt;sonic-button type=&quot;primary&quot;&gt;Save changes&lt;/sonic-button&gt;
25
- &lt;/sonic-theme&gt;
26
- </code></pre>
27
- <h2 id="theme-mode">Theme mode</h2>
28
- <p>With no <code>theme</code> (or <code>theme=&quot;custom&quot;</code>), only the core tokens and your own <code>--sc-*</code> overrides apply. <code>light</code> and <code>dark</code> apply the built-in palettes; <code>auto</code> switches between them with <code>prefers-color-scheme</code>.</p>
29
- <pre><code>&lt;div class=&quot;grid gap-4 md:grid-cols-2&quot;&gt;
30
- &lt;sonic-theme theme=&quot;light&quot; color font class=&quot;block bg-base p-4 rounded-md border border-neutral-200&quot;&gt;
31
- &lt;p class=&quot;text-sm mb-3 opacity-80&quot;&gt;theme=&quot;light&quot;&lt;/p&gt;
32
- &lt;div class=&quot;flex flex-wrap gap-2&quot;&gt;
33
- &lt;sonic-badge type=&quot;primary&quot;&gt;Primary&lt;/sonic-badge&gt;
34
- &lt;sonic-badge type=&quot;success&quot;&gt;Success&lt;/sonic-badge&gt;
35
- &lt;sonic-badge type=&quot;danger&quot;&gt;Danger&lt;/sonic-badge&gt;
36
- &lt;/div&gt;
37
- &lt;/sonic-theme&gt;
38
- &lt;sonic-theme theme=&quot;dark&quot; color font class=&quot;block bg-base p-4 rounded-md&quot;&gt;
39
- &lt;p class=&quot;text-sm mb-3 opacity-80&quot;&gt;theme=&quot;dark&quot;&lt;/p&gt;
40
- &lt;div class=&quot;flex flex-wrap gap-2&quot;&gt;
41
- &lt;sonic-badge type=&quot;primary&quot;&gt;Primary&lt;/sonic-badge&gt;
42
- &lt;sonic-badge type=&quot;success&quot;&gt;Success&lt;/sonic-badge&gt;
43
- &lt;sonic-badge type=&quot;danger&quot;&gt;Danger&lt;/sonic-badge&gt;
44
- &lt;/div&gt;
45
- &lt;/sonic-theme&gt;
46
- &lt;/div&gt;
47
- </code></pre>
48
- <h2 id="text-color-and-font">Text color and font</h2>
49
- <p><code>color</code> sets the host text color to <code>--sc-base-content</code>. <code>font</code> applies the base font family, weight and style tokens. Both are off by default. To paint the background, add the Tailwind classes <code>block</code> and <code>bg-base</code> on the host.</p>
50
- <pre><code>&lt;sonic-theme theme=&quot;light&quot; color font class=&quot;block bg-base p-6 rounded-lg&quot;&gt;
51
- &lt;p&gt;Body copy inherits the base content color and font from the theme.&lt;/p&gt;
52
- &lt;/sonic-theme&gt;
53
- </code></pre>
54
- <h2 id="pop-container">Pop container</h2>
55
- <p>Overlays such as <code>sonic-modal</code> are appended to the last connected <code>sonic-theme</code>, or to <code>document.body</code> when there is none. <code>Theme.getPopContainer()</code> returns that element.</p>
56
- <pre><code>&lt;sonic-theme theme=&quot;light&quot; color font class=&quot;block bg-base p-4 rounded-lg&quot;&gt;
57
- &lt;sonic-button onclick=&quot;document.getElementById(&#39;themePopModal&#39;).show()&quot;&gt;
58
- Open modal
59
- &lt;/sonic-button&gt;
60
- &lt;sonic-modal id=&quot;themePopModal&quot;&gt;
61
- &lt;sonic-modal-title&gt;Mounted on theme&lt;/sonic-modal-title&gt;
62
- &lt;sonic-modal-content&gt;
63
- This dialog is appended under the nearest sonic-theme pop container.
64
- &lt;/sonic-modal-content&gt;
65
- &lt;sonic-modal-actions&gt;
66
- &lt;sonic-button hideModal&gt;Close&lt;/sonic-button&gt;
67
- &lt;/sonic-modal-actions&gt;
68
- &lt;/sonic-modal&gt;
69
- &lt;/sonic-theme&gt;
70
- </code></pre>
71
- <h2 id="embedded-iframes">Embedded iframes</h2>
72
- <p>On connect, the theme posts its resolved <code>--sc-*</code> values and linked Google Fonts / Adobe Fonts stylesheets to every iframe on the page (message type <code>SonicTheme</code>). An iframe can ask for them again:</p>
73
- <pre><code class="language-javascript">window.parent.postMessage({ type: &quot;GetSonicTheme&quot; }, &quot;*&quot;);
74
- </code></pre>
75
- <h2 id="api-reference">API reference</h2>
76
- <table>
77
- <thead>
78
- <tr>
79
- <th>Attribute</th>
80
- <th>Values</th>
81
- <th>Description</th>
82
- </tr>
83
- </thead>
84
- <tbody><tr>
85
- <td><code>theme</code></td>
86
- <td><code>custom</code> (default) · <code>light</code> · <code>dark</code> · <code>auto</code></td>
87
- <td>Built-in palette; <code>custom</code> applies core tokens and your overrides only</td>
88
- </tr>
89
- <tr>
90
- <td><code>color</code></td>
91
- <td>boolean</td>
92
- <td>Host text color uses <code>--sc-base-content</code></td>
93
- </tr>
94
- <tr>
95
- <td><code>font</code></td>
96
- <td>boolean</td>
97
- <td>Host uses the base font family, weight and style tokens</td>
98
- </tr>
99
- </tbody></table>
100
- <table>
101
- <thead>
102
- <tr>
103
- <th>Slot</th>
104
- <th>Description</th>
105
- </tr>
106
- </thead>
107
- <tbody><tr>
108
- <td><em>(default)</em></td>
109
- <td>Application content</td>
110
- </tr>
111
- </tbody></table>
112
-
113
- </article>
114
- </main>
115
- </body>
116
- </html>
@@ -1,97 +0,0 @@
1
- # Theme
2
-
3
- **`sonic-theme`** is the root element of a Concorde UI: it holds the `--sc-*` design tokens, optionally applies a built-in palette, and is where popovers, modals and toasts are mounted. Import `@supersoniks/concorde/theme` once at the app entry and wrap your app in it. Token names and brand overrides are covered in [Theming](/docs/getting-started/theming).
4
-
5
- ## Basic example
6
-
7
- <sonic-code>
8
- <template>
9
- <sonic-theme color font class="block bg-base p-6 rounded-lg">
10
- <sonic-button type="primary">Save changes</sonic-button>
11
- </sonic-theme>
12
- </template>
13
- </sonic-code>
14
-
15
- ## Theme mode
16
-
17
- With no `theme` (or `theme="custom"`), only the core tokens and your own `--sc-*` overrides apply. `light` and `dark` apply the built-in palettes; `auto` switches between them with `prefers-color-scheme`.
18
-
19
- <sonic-code>
20
- <template>
21
- <div class="grid gap-4 md:grid-cols-2">
22
- <sonic-theme theme="light" color font class="block bg-base p-4 rounded-md border border-neutral-200">
23
- <p class="text-sm mb-3 opacity-80">theme="light"</p>
24
- <div class="flex flex-wrap gap-2">
25
- <sonic-badge type="primary">Primary</sonic-badge>
26
- <sonic-badge type="success">Success</sonic-badge>
27
- <sonic-badge type="danger">Danger</sonic-badge>
28
- </div>
29
- </sonic-theme>
30
- <sonic-theme theme="dark" color font class="block bg-base p-4 rounded-md">
31
- <p class="text-sm mb-3 opacity-80">theme="dark"</p>
32
- <div class="flex flex-wrap gap-2">
33
- <sonic-badge type="primary">Primary</sonic-badge>
34
- <sonic-badge type="success">Success</sonic-badge>
35
- <sonic-badge type="danger">Danger</sonic-badge>
36
- </div>
37
- </sonic-theme>
38
- </div>
39
- </template>
40
- </sonic-code>
41
-
42
- ## Text color and font
43
-
44
- `color` sets the host text color to `--sc-base-content`. `font` applies the base font family, weight and style tokens. Both are off by default. To paint the background, add the Tailwind classes `block` and `bg-base` on the host.
45
-
46
- <sonic-code>
47
- <template>
48
- <sonic-theme theme="light" color font class="block bg-base p-6 rounded-lg">
49
- <p>Body copy inherits the base content color and font from the theme.</p>
50
- </sonic-theme>
51
- </template>
52
- </sonic-code>
53
-
54
- ## Pop container
55
-
56
- Overlays such as `sonic-modal` are appended to the last connected `sonic-theme`, or to `document.body` when there is none. `Theme.getPopContainer()` returns that element.
57
-
58
- <sonic-code>
59
- <template>
60
- <sonic-theme theme="light" color font class="block bg-base p-4 rounded-lg">
61
- <sonic-button onclick="document.getElementById('themePopModal').show()">
62
- Open modal
63
- </sonic-button>
64
- <sonic-modal id="themePopModal">
65
- <sonic-modal-title>Mounted on theme</sonic-modal-title>
66
- <sonic-modal-content>
67
- This dialog is appended under the nearest sonic-theme pop container.
68
- </sonic-modal-content>
69
- <sonic-modal-actions>
70
- <sonic-button hideModal>Close</sonic-button>
71
- </sonic-modal-actions>
72
- </sonic-modal>
73
- </sonic-theme>
74
- </template>
75
- </sonic-code>
76
-
77
- ## Embedded iframes
78
-
79
- On connect, the theme posts its resolved `--sc-*` values and linked Google Fonts / Adobe Fonts stylesheets to every iframe on the page (message type `SonicTheme`). An iframe can ask for them again:
80
-
81
- <sonic-code language="javascript">
82
- <template>
83
- window.parent.postMessage({ type: "GetSonicTheme" }, "*");
84
- </template>
85
- </sonic-code>
86
-
87
- ## API reference
88
-
89
- | Attribute | Values | Description |
90
- |----------|---------|-------------|
91
- | `theme` | `custom` (default) · `light` · `dark` · `auto` | Built-in palette; `custom` applies core tokens and your overrides only |
92
- | `color` | boolean | Host text color uses `--sc-base-content` |
93
- | `font` | boolean | Host uses the base font family, weight and style tokens |
94
-
95
- | Slot | Description |
96
- |------|-------------|
97
- | *(default)* | Application content |
@@ -1,185 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en" data-doc-url="https://concorde.supersoniks.org/core/components/ui/toast" data-doc-id="core/components/ui/toast/toast">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Toast — Concorde by Supersoniks</title>
7
- <meta name="description" content="Toasts show short-lived feedback in a fixed stack at the bottom right of the page. Call SonicToast.add() (also window.SonicToast); the sonic-toast host is created on first use. Use label for a heading">
8
- <meta name="keywords" content="Concorde, supersoniks, core/components/ui/toast/toast, toast, Toast, UI component, sonic-toast, web component, SonicToast.add(), window.SonicToast, label, preserve, status, text, title">
9
- <meta name="concorde-doc-id" content="core/components/ui/toast/toast">
10
- <link rel="canonical" href="https://concorde.supersoniks.org/core/components/ui/toast">
11
- <link rel="alternate" type="text/markdown" href="https://concorde.supersoniks.org/core/components/ui/toast.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/toast">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 — Toast</strong>. Toasts show short-lived feedback in a fixed stack at the bottom right of the page. Call SonicToast.add() (also window.SonicToast); the sonic-toast host is created on first use. Use label for a heading <span>Doc ID: <code>core/components/ui/toast/toast</code>. Keywords: Concorde, supersoniks, core/components/ui/toast/toast, toast, Toast, UI component, sonic-toast, web component, SonicToast.add(), window.SonicToast, label, preserve, status, text, title. URL: <a href="https://concorde.supersoniks.org/core/components/ui/toast">https://concorde.supersoniks.org/core/components/ui/toast</a>.</span></p>
20
- <h1 id="toast">Toast</h1>
21
- <p>Toasts show short-lived feedback in a fixed stack at the bottom right of the page. Call <strong><code>SonicToast.add()</code></strong> (also <code>window.SonicToast</code>); the <strong><code>sonic-toast</code></strong> host is created on first use. Use <strong><code>label</code></strong> for a heading and <strong><code>preserve</code></strong> when the user must read or act before the toast goes away.</p>
22
- <h2 id="basic-example">Basic example</h2>
23
- <pre><code>&lt;sonic-button onclick=&quot;SonicToast.add({ text: &#39;Flight CN 001 is now boarding&#39; })&quot;&gt;
24
- Show toast
25
- &lt;/sonic-button&gt;
26
- </code></pre>
27
- <h2 id="status">Status</h2>
28
- <p><strong><code>status</code></strong> sets the color, the icon and the live-region role. With no <code>status</code>, the toast is neutral.</p>
29
- <pre><code>&lt;div class=&quot;flex flex-wrap gap-2&quot;&gt;
30
- &lt;sonic-button onclick=&quot;SonicToast.add({ text: &#39;Default message&#39; })&quot;&gt;Default&lt;/sonic-button&gt;
31
- &lt;sonic-button onclick=&quot;SonicToast.add({ text: &#39;Operation succeeded&#39;, status: &#39;success&#39; })&quot;&gt;Success&lt;/sonic-button&gt;
32
- &lt;sonic-button onclick=&quot;SonicToast.add({ text: &#39;Something went wrong&#39;, status: &#39;error&#39; })&quot;&gt;Error&lt;/sonic-button&gt;
33
- &lt;sonic-button onclick=&quot;SonicToast.add({ text: &#39;Check this detail&#39;, status: &#39;warning&#39; })&quot;&gt;Warning&lt;/sonic-button&gt;
34
- &lt;sonic-button onclick=&quot;SonicToast.add({ text: &#39;Helpful context&#39;, status: &#39;info&#39; })&quot;&gt;Info&lt;/sonic-button&gt;
35
- &lt;/div&gt;
36
- </code></pre>
37
- <h2 id="label">Label</h2>
38
- <p><strong><code>label</code></strong> adds a bold heading above <strong><code>text</code></strong>. <code>title</code> is a deprecated alias.</p>
39
- <pre><code>&lt;sonic-button
40
- onclick=&quot;SonicToast.add({ label: &#39;Gate change&#39;, text: &#39;Flight CN 001 now departs from gate B12.&#39;, status: &#39;warning&#39; })&quot;
41
- &gt;
42
- Toast with label
43
- &lt;/sonic-button&gt;
44
- </code></pre>
45
- <h2 id="html-in-text">HTML in text</h2>
46
- <p><strong><code>text</code></strong> and <strong><code>label</code></strong> accept HTML strings. A link or form control in <strong><code>text</code></strong> turns on <strong><code>preserve</code></strong> automatically.</p>
47
- <pre><code>&lt;sonic-button
48
- onclick=&quot;SonicToast.add({ text: &#39;Message with &lt;strong&gt;HTML&lt;/strong&gt; and an &lt;a href=&amp;quot;#&amp;quot;&gt;action link&lt;/a&gt;&#39;, status: &#39;info&#39; })&quot;
49
- &gt;
50
- Toast with HTML
51
- &lt;/sonic-button&gt;
52
- </code></pre>
53
- <h2 id="preserve">Preserve</h2>
54
- <p>Toasts hide after 6 seconds; the timer pauses on hover and focus. <strong><code>preserve</code></strong> keeps the toast until the user closes it.</p>
55
- <pre><code>&lt;sonic-button
56
- onclick=&quot;SonicToast.add({ text: &#39;Turbulence ahead: please fasten your seat belt&#39;, status: &#39;info&#39;, preserve: true })&quot;
57
- &gt;
58
- Persistent toast
59
- &lt;/sonic-button&gt;
60
- </code></pre>
61
- <h2 id="dismiss-forever">Dismiss forever</h2>
62
- <p>With <strong><code>dismissForever</code></strong> and a stable <strong><code>id</code></strong>, closing the toast is stored in <code>localStorage</code> and later <code>add()</code> calls with that <code>id</code> are ignored. A toast identical to one already shown (ignoring <code>id</code>) is never added twice.</p>
63
- <pre><code>&lt;sonic-button
64
- onclick=&quot;SonicToast.add({ id: &#39;welcome-toast&#39;, label: &#39;Welcome&#39;, text: &#39;Close me and I will not come back after a reload.&#39;, status: &#39;info&#39;, dismissForever: true })&quot;
65
- &gt;
66
- Dismiss forever
67
- &lt;/sonic-button&gt;
68
- </code></pre>
69
- <h2 id="ghost">Ghost</h2>
70
- <p><strong><code>ghost</code></strong> renders a semi-transparent, non-interactive toast, for example for a background task.</p>
71
- <pre><code>&lt;sonic-button
72
- onclick=&quot;SonicToast.add({ text: &#39;Syncing in the background&#39;, status: &#39;info&#39;, ghost: true })&quot;
73
- &gt;
74
- Ghost toast
75
- &lt;/sonic-button&gt;
76
- </code></pre>
77
- <h2 id="removing-toasts">Removing toasts</h2>
78
- <p>Static helpers clear the stack from script, for example after navigation. <strong><code>removeAll()</code></strong> keeps ghost toasts; <strong><code>removeTemporaryItems()</code></strong> keeps preserved ones.</p>
79
- <pre><code>&lt;div class=&quot;flex flex-wrap gap-2&quot;&gt;
80
- &lt;sonic-button onclick=&quot;SonicToast.add({ text: &#39;Temporary success&#39;, status: &#39;success&#39; })&quot;&gt;Add success&lt;/sonic-button&gt;
81
- &lt;sonic-button onclick=&quot;SonicToast.add({ text: &#39;Temporary error&#39;, status: &#39;error&#39; })&quot;&gt;Add error&lt;/sonic-button&gt;
82
- &lt;sonic-button onclick=&quot;SonicToast.add({ text: &#39;Persistent info&#39;, status: &#39;info&#39;, preserve: true })&quot;&gt;Add persistent&lt;/sonic-button&gt;
83
- &lt;/div&gt;
84
- &lt;div class=&quot;flex flex-wrap gap-2 mt-3&quot;&gt;
85
- &lt;sonic-button variant=&quot;outline&quot; onclick=&quot;SonicToast.removeItemsByStatus(&#39;success&#39;)&quot;&gt;Remove success&lt;/sonic-button&gt;
86
- &lt;sonic-button variant=&quot;outline&quot; onclick=&quot;SonicToast.removeTemporaryItems()&quot;&gt;Remove temporary&lt;/sonic-button&gt;
87
- &lt;sonic-button variant=&quot;outline&quot; onclick=&quot;SonicToast.removeAll()&quot;&gt;Remove all&lt;/sonic-button&gt;
88
- &lt;/div&gt;
89
- </code></pre>
90
- <p>Inside an iframe, toasts are forwarded to the parent window&#39;s stack when the parent also loads Concorde.</p>
91
- <h2 id="api-reference">API reference</h2>
92
- <p>Options of <strong><code>SonicToast.add(options)</code></strong>:</p>
93
- <table>
94
- <thead>
95
- <tr>
96
- <th>Option</th>
97
- <th>Values</th>
98
- <th>Description</th>
99
- </tr>
100
- </thead>
101
- <tbody><tr>
102
- <td><code>text</code></td>
103
- <td>string · Lit template</td>
104
- <td>Body, required; HTML strings allowed</td>
105
- </tr>
106
- <tr>
107
- <td><code>label</code></td>
108
- <td>string · Lit template</td>
109
- <td>Heading above <code>text</code></td>
110
- </tr>
111
- <tr>
112
- <td><code>title</code></td>
113
- <td>string · Lit template</td>
114
- <td>Deprecated alias of <code>label</code></td>
115
- </tr>
116
- <tr>
117
- <td><code>status</code></td>
118
- <td><code>success</code> · <code>error</code> · <code>warning</code> · <code>info</code> (default neutral)</td>
119
- <td>Color and icon; <code>error</code> gets <code>role=&quot;alert&quot;</code>, others <code>role=&quot;status&quot;</code></td>
120
- </tr>
121
- <tr>
122
- <td><code>id</code></td>
123
- <td>string · number (default timestamp)</td>
124
- <td>Identifier for <code>removeItemById</code> and <code>dismissForever</code></td>
125
- </tr>
126
- <tr>
127
- <td><code>preserve</code></td>
128
- <td>boolean</td>
129
- <td>No auto-hide; forced when <code>text</code> contains a link or control</td>
130
- </tr>
131
- <tr>
132
- <td><code>ghost</code></td>
133
- <td>boolean</td>
134
- <td>Semi-transparent and non-interactive; kept by <code>removeAll</code></td>
135
- </tr>
136
- <tr>
137
- <td><code>dismissForever</code></td>
138
- <td>boolean</td>
139
- <td>Remember the dismissal in <code>localStorage</code>; needs a stable <code>id</code></td>
140
- </tr>
141
- <tr>
142
- <td><code>styleSheet</code></td>
143
- <td><code>CSSResult</code> · <code>CSSStyleSheet</code> · array</td>
144
- <td>Extra styles adopted by the toast</td>
145
- </tr>
146
- <tr>
147
- <td><code>useSlot</code></td>
148
- <td>boolean</td>
149
- <td>Legacy: render <code>text</code> in the light DOM</td>
150
- </tr>
151
- </tbody></table>
152
- <table>
153
- <thead>
154
- <tr>
155
- <th>Method</th>
156
- <th>Description</th>
157
- </tr>
158
- </thead>
159
- <tbody><tr>
160
- <td><code>SonicToast.add(options)</code></td>
161
- <td>Show a toast; returns the stored config, or <code>null</code> when skipped</td>
162
- </tr>
163
- <tr>
164
- <td><code>SonicToast.removeAll()</code></td>
165
- <td>Remove every toast except ghosts</td>
166
- </tr>
167
- <tr>
168
- <td><code>SonicToast.removeItemsByStatus(status)</code></td>
169
- <td>Remove toasts with this <code>status</code></td>
170
- </tr>
171
- <tr>
172
- <td><code>SonicToast.removeItemById(id)</code></td>
173
- <td>Remove one toast</td>
174
- </tr>
175
- <tr>
176
- <td><code>SonicToast.removeTemporaryItems()</code></td>
177
- <td>Remove toasts without <code>preserve</code></td>
178
- </tr>
179
- </tbody></table>
180
- <p><code>sonic-toast</code> and <code>sonic-toast-item</code> are created by <code>add()</code>; do not write them in markup. <code>sonic-toast-message-subscriber</code> shows a toast for each <code>{ type: &quot;public&quot;, content, status }</code> entry of its <code>messages</code> property.</p>
181
-
182
- </article>
183
- </main>
184
- </body>
185
- </html>
@@ -1,147 +0,0 @@
1
- # Toast
2
-
3
- Toasts show short-lived feedback in a fixed stack at the bottom right of the page. Call **`SonicToast.add()`** (also `window.SonicToast`); the **`sonic-toast`** host is created on first use. Use **`label`** for a heading and **`preserve`** when the user must read or act before the toast goes away.
4
-
5
- ## Basic example
6
-
7
- <sonic-code>
8
- <template>
9
- <sonic-button onclick="SonicToast.add({ text: 'Flight CN 001 is now boarding' })">
10
- Show toast
11
- </sonic-button>
12
- </template>
13
- </sonic-code>
14
-
15
- ## Status
16
-
17
- **`status`** sets the color, the icon and the live-region role. With no `status`, the toast is neutral.
18
-
19
- <sonic-code>
20
- <template>
21
- <div class="flex flex-wrap gap-2">
22
- <sonic-button onclick="SonicToast.add({ text: 'Default message' })">Default</sonic-button>
23
- <sonic-button onclick="SonicToast.add({ text: 'Operation succeeded', status: 'success' })">Success</sonic-button>
24
- <sonic-button onclick="SonicToast.add({ text: 'Something went wrong', status: 'error' })">Error</sonic-button>
25
- <sonic-button onclick="SonicToast.add({ text: 'Check this detail', status: 'warning' })">Warning</sonic-button>
26
- <sonic-button onclick="SonicToast.add({ text: 'Helpful context', status: 'info' })">Info</sonic-button>
27
- </div>
28
- </template>
29
- </sonic-code>
30
-
31
- ## Label
32
-
33
- **`label`** adds a bold heading above **`text`**. `title` is a deprecated alias.
34
-
35
- <sonic-code>
36
- <template>
37
- <sonic-button
38
- onclick="SonicToast.add({ label: 'Gate change', text: 'Flight CN 001 now departs from gate B12.', status: 'warning' })"
39
- >
40
- Toast with label
41
- </sonic-button>
42
- </template>
43
- </sonic-code>
44
-
45
- ## HTML in text
46
-
47
- **`text`** and **`label`** accept HTML strings. A link or form control in **`text`** turns on **`preserve`** automatically.
48
-
49
- <sonic-code>
50
- <template>
51
- <sonic-button
52
- onclick="SonicToast.add({ text: 'Message with <strong>HTML</strong> and an <a href=&quot;#&quot;>action link</a>', status: 'info' })"
53
- >
54
- Toast with HTML
55
- </sonic-button>
56
- </template>
57
- </sonic-code>
58
-
59
- ## Preserve
60
-
61
- Toasts hide after 6 seconds; the timer pauses on hover and focus. **`preserve`** keeps the toast until the user closes it.
62
-
63
- <sonic-code>
64
- <template>
65
- <sonic-button
66
- onclick="SonicToast.add({ text: 'Turbulence ahead: please fasten your seat belt', status: 'info', preserve: true })"
67
- >
68
- Persistent toast
69
- </sonic-button>
70
- </template>
71
- </sonic-code>
72
-
73
- ## Dismiss forever
74
-
75
- With **`dismissForever`** and a stable **`id`**, closing the toast is stored in `localStorage` and later `add()` calls with that `id` are ignored. A toast identical to one already shown (ignoring `id`) is never added twice.
76
-
77
- <sonic-code>
78
- <template>
79
- <sonic-button
80
- onclick="SonicToast.add({ id: 'welcome-toast', label: 'Welcome', text: 'Close me and I will not come back after a reload.', status: 'info', dismissForever: true })"
81
- >
82
- Dismiss forever
83
- </sonic-button>
84
- </template>
85
- </sonic-code>
86
-
87
- ## Ghost
88
-
89
- **`ghost`** renders a semi-transparent, non-interactive toast, for example for a background task.
90
-
91
- <sonic-code>
92
- <template>
93
- <sonic-button
94
- onclick="SonicToast.add({ text: 'Syncing in the background', status: 'info', ghost: true })"
95
- >
96
- Ghost toast
97
- </sonic-button>
98
- </template>
99
- </sonic-code>
100
-
101
- ## Removing toasts
102
-
103
- Static helpers clear the stack from script, for example after navigation. **`removeAll()`** keeps ghost toasts; **`removeTemporaryItems()`** keeps preserved ones.
104
-
105
- <sonic-code>
106
- <template>
107
- <div class="flex flex-wrap gap-2">
108
- <sonic-button onclick="SonicToast.add({ text: 'Temporary success', status: 'success' })">Add success</sonic-button>
109
- <sonic-button onclick="SonicToast.add({ text: 'Temporary error', status: 'error' })">Add error</sonic-button>
110
- <sonic-button onclick="SonicToast.add({ text: 'Persistent info', status: 'info', preserve: true })">Add persistent</sonic-button>
111
- </div>
112
- <div class="flex flex-wrap gap-2 mt-3">
113
- <sonic-button variant="outline" onclick="SonicToast.removeItemsByStatus('success')">Remove success</sonic-button>
114
- <sonic-button variant="outline" onclick="SonicToast.removeTemporaryItems()">Remove temporary</sonic-button>
115
- <sonic-button variant="outline" onclick="SonicToast.removeAll()">Remove all</sonic-button>
116
- </div>
117
- </template>
118
- </sonic-code>
119
-
120
- Inside an iframe, toasts are forwarded to the parent window's stack when the parent also loads Concorde.
121
-
122
- ## API reference
123
-
124
- Options of **`SonicToast.add(options)`**:
125
-
126
- | Option | Values | Description |
127
- |----------|---------|-------------|
128
- | `text` | string · Lit template | Body, required; HTML strings allowed |
129
- | `label` | string · Lit template | Heading above `text` |
130
- | `title` | string · Lit template | Deprecated alias of `label` |
131
- | `status` | `success` · `error` · `warning` · `info` (default neutral) | Color and icon; `error` gets `role="alert"`, others `role="status"` |
132
- | `id` | string · number (default timestamp) | Identifier for `removeItemById` and `dismissForever` |
133
- | `preserve` | boolean | No auto-hide; forced when `text` contains a link or control |
134
- | `ghost` | boolean | Semi-transparent and non-interactive; kept by `removeAll` |
135
- | `dismissForever` | boolean | Remember the dismissal in `localStorage`; needs a stable `id` |
136
- | `styleSheet` | `CSSResult` · `CSSStyleSheet` · array | Extra styles adopted by the toast |
137
- | `useSlot` | boolean | Legacy: render `text` in the light DOM |
138
-
139
- | Method | Description |
140
- |--------|-------------|
141
- | `SonicToast.add(options)` | Show a toast; returns the stored config, or `null` when skipped |
142
- | `SonicToast.removeAll()` | Remove every toast except ghosts |
143
- | `SonicToast.removeItemsByStatus(status)` | Remove toasts with this `status` |
144
- | `SonicToast.removeItemById(id)` | Remove one toast |
145
- | `SonicToast.removeTemporaryItems()` | Remove toasts without `preserve` |
146
-
147
- `sonic-toast` and `sonic-toast-item` are created by `add()`; do not write them in markup. `sonic-toast-message-subscriber` shows a toast for each `{ type: "public", content, status }` entry of its `messages` property.