@supersoniks/concorde 5.0.0 → 5.0.2

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 (314) hide show
  1. package/.gitlab-ci.yml +0 -13
  2. package/build-infos.json +1 -1
  3. package/concorde-core.bundle.js +606 -689
  4. package/concorde-core.es.js +4511 -4329
  5. package/dist/concorde-core.bundle.js +606 -689
  6. package/dist/concorde-core.es.js +4511 -4329
  7. package/gitlab/job_tests.sh +25 -12
  8. package/index.html +3 -3
  9. package/package.json +16 -1
  10. package/scripts/post-build-docs.js +0 -0
  11. package/scripts/post-build.mjs +0 -0
  12. package/src/core/components/functional/fetch/fetch.md +0 -0
  13. package/src/core/components/functional/if/if.md +0 -0
  14. package/src/core/components/functional/list/list.demo.ts +0 -0
  15. package/src/core/components/functional/list/list.md +0 -0
  16. package/src/core/components/functional/list/list.ts +0 -0
  17. package/src/core/components/functional/router/router.md +0 -0
  18. package/src/core/components/functional/router/router.ts +0 -0
  19. package/src/core/components/functional/sdui/sdui.md +0 -0
  20. package/src/core/components/functional/states/states.md +0 -0
  21. package/src/core/components/functional/submit/submit.md +0 -0
  22. package/src/core/components/ui/_css/rounded.ts +36 -0
  23. package/src/core/components/ui/_css/size.ts +0 -0
  24. package/src/core/components/ui/_css/type.ts +49 -0
  25. package/src/core/components/ui/_i18n/ui-aria-labels.ts +104 -0
  26. package/src/core/components/ui/alert/alert.md +128 -72
  27. package/src/core/components/ui/alert/alert.spec.ts +145 -0
  28. package/src/core/components/ui/alert/alert.ts +86 -91
  29. package/src/core/components/ui/alert-messages/alert-messages.ts +1 -1
  30. package/src/core/components/ui/badge/badge.md +126 -78
  31. package/src/core/components/ui/badge/badge.ts +29 -81
  32. package/src/core/components/ui/button/button.md +1 -0
  33. package/src/core/components/ui/button/button.ts +11 -8
  34. package/src/core/components/ui/captcha/altchaStyles.ts +0 -0
  35. package/src/core/components/ui/captcha/captcha.md +0 -0
  36. package/src/core/components/ui/card/card-header.ts +7 -2
  37. package/src/core/components/ui/card/card.md +120 -65
  38. package/src/core/components/ui/divider/divider.ts +4 -9
  39. package/src/core/components/ui/form/fieldset/legend-description.ts +1 -1
  40. package/src/core/components/ui/form/fieldset/legend.ts +1 -1
  41. package/src/core/components/ui/form/input/input.md +1 -1
  42. package/src/core/components/ui/form/input/input.ts +19 -15
  43. package/src/core/components/ui/form/radio/radio.md +0 -0
  44. package/src/core/components/ui/form/select/select.md +0 -0
  45. package/src/core/components/ui/form/switch/switch.md +0 -0
  46. package/src/core/components/ui/form/textarea/textarea.md +1 -1
  47. package/src/core/components/ui/image/image.md +147 -53
  48. package/src/core/components/ui/image/image.ts +10 -44
  49. package/src/core/components/ui/link/link.md +2 -2
  50. package/src/core/components/ui/link/link.ts +42 -37
  51. package/src/core/components/ui/loader/loader.md +0 -0
  52. package/src/core/components/ui/menu/menu.md +0 -0
  53. package/src/core/components/ui/modal/modal-close.ts +8 -12
  54. package/src/core/components/ui/modal/modal.md +0 -0
  55. package/src/core/components/ui/modal/modal.ts +18 -18
  56. package/src/core/components/ui/pop/pop.md +105 -1
  57. package/src/core/components/ui/pop/pop.ts +143 -148
  58. package/src/core/components/ui/table/table-caption.ts +0 -0
  59. package/src/core/components/ui/table/table.md +0 -0
  60. package/src/core/components/ui/table/table.ts +2 -8
  61. package/src/core/components/ui/theme/theme.ts +1 -1
  62. package/src/core/components/ui/toast/dismissed.ts +14 -0
  63. package/src/core/components/ui/toast/toast-item.ts +139 -91
  64. package/src/core/components/ui/toast/toast.ts +4 -7
  65. package/src/core/components/ui/tooltip/tooltip.ts +176 -154
  66. package/src/core/utils/LocationHandler.ts +12 -5
  67. package/src/core/utils/dismissed.ts +22 -0
  68. package/src/core/utils/positioning.spec.ts +208 -0
  69. package/src/core/utils/positioning.ts +183 -0
  70. package/src/core/utils/route.ts +0 -0
  71. package/src/directives.ts +2 -3
  72. package/src/docs/_core-concept/subscriber.md +0 -0
  73. package/src/docs/_getting-started/concorde-outside.md +3 -3
  74. package/src/docs/_getting-started/my-first-subscriber.md +0 -0
  75. package/src/docs/_getting-started/pubsub.md +0 -0
  76. package/src/docs/_getting-started/start.md +0 -0
  77. package/src/docs/code.ts +3 -1
  78. package/src/docs/example/users.ts +0 -0
  79. package/src/docs/search/docs-search.json +651 -21
  80. package/src/docs/search/page.ts +0 -0
  81. package/src/docs/tailwind/css/tailwind.css +13 -6
  82. package/src/tsconfig.json +45 -0
  83. package/src/tsconfig.tsbuildinfo +1 -1
  84. package/tailwind.config.js +50 -3
  85. package/vitest.setup.ts +49 -13
  86. package/.github/workflows/ci.yml +0 -21
  87. package/.github-export-ignore +0 -30
  88. package/CONTRIBUTING.md +0 -59
  89. package/DEV.md +0 -54
  90. package/LICENSE +0 -21
  91. package/OPEN_SOURCE_CHECKPOINT.md +0 -133
  92. package/concorde-3d.bundle.js +0 -3960
  93. package/concorde-3d.es.js +0 -33433
  94. package/concorde-hugging-face-infer.bundle.js +0 -32
  95. package/concorde-hugging-face-infer.es.js +0 -2952
  96. package/concorde-shader.bundle.js +0 -116
  97. package/concorde-shader.es.js +0 -8353
  98. package/concorde-webgpu.bundle.js +0 -307
  99. package/concorde-webgpu.es.js +0 -8627
  100. package/docs/altcha-widget.js +0 -2662
  101. package/docs/assets/index-BZiZXMU-.css +0 -1
  102. package/docs/assets/index-FmK4JaIM.js +0 -11992
  103. package/docs/crawl/core/components/functional/date/date.html +0 -190
  104. package/docs/crawl/core/components/functional/fetch/fetch.html +0 -109
  105. package/docs/crawl/core/components/functional/if/if.html +0 -27
  106. package/docs/crawl/core/components/functional/jsonata/jsonata.html +0 -79
  107. package/docs/crawl/core/components/functional/list/list.html +0 -70
  108. package/docs/crawl/core/components/functional/mix/mix.html +0 -45
  109. package/docs/crawl/core/components/functional/queue/queue.html +0 -96
  110. package/docs/crawl/core/components/functional/router/router.html +0 -106
  111. package/docs/crawl/core/components/functional/sdui/sdui.html +0 -269
  112. package/docs/crawl/core/components/functional/states/states.html +0 -66
  113. package/docs/crawl/core/components/functional/submit/submit.html +0 -160
  114. package/docs/crawl/core/components/functional/subscriber/subscriber.html +0 -67
  115. package/docs/crawl/core/components/functional/value/value.html +0 -51
  116. package/docs/crawl/core/components/ui/alert/alert.html +0 -110
  117. package/docs/crawl/core/components/ui/alert-messages/alert-messages.html +0 -23
  118. package/docs/crawl/core/components/ui/badge/badge.html +0 -119
  119. package/docs/crawl/core/components/ui/button/button.html +0 -149
  120. package/docs/crawl/core/components/ui/captcha/captcha.html +0 -30
  121. package/docs/crawl/core/components/ui/card/card.html +0 -99
  122. package/docs/crawl/core/components/ui/divider/divider.html +0 -58
  123. package/docs/crawl/core/components/ui/form/checkbox/checkbox.html +0 -73
  124. package/docs/crawl/core/components/ui/form/fieldset/fieldset.html +0 -135
  125. package/docs/crawl/core/components/ui/form/form-actions/form-actions.html +0 -79
  126. package/docs/crawl/core/components/ui/form/form-layout/form-layout.html +0 -62
  127. package/docs/crawl/core/components/ui/form/input/input.html +0 -109
  128. package/docs/crawl/core/components/ui/form/input-autocomplete/input-autocomplete.html +0 -106
  129. package/docs/crawl/core/components/ui/form/radio/radio.html +0 -56
  130. package/docs/crawl/core/components/ui/form/select/select.html +0 -73
  131. package/docs/crawl/core/components/ui/form/switch/switch.html +0 -56
  132. package/docs/crawl/core/components/ui/form/textarea/textarea.html +0 -59
  133. package/docs/crawl/core/components/ui/group/group.html +0 -82
  134. package/docs/crawl/core/components/ui/icon/icon.html +0 -133
  135. package/docs/crawl/core/components/ui/image/image.html +0 -110
  136. package/docs/crawl/core/components/ui/link/link.html +0 -42
  137. package/docs/crawl/core/components/ui/loader/loader.html +0 -50
  138. package/docs/crawl/core/components/ui/menu/menu.html +0 -322
  139. package/docs/crawl/core/components/ui/modal/modal.html +0 -117
  140. package/docs/crawl/core/components/ui/pop/pop.html +0 -102
  141. package/docs/crawl/core/components/ui/progress/progress.html +0 -58
  142. package/docs/crawl/core/components/ui/table/table.html +0 -413
  143. package/docs/crawl/core/components/ui/toast/toast.html +0 -122
  144. package/docs/crawl/core/components/ui/tooltip/tooltip.html +0 -79
  145. package/docs/crawl/docs/_core-concept/dataFlow.html +0 -177
  146. package/docs/crawl/docs/_core-concept/overview.html +0 -66
  147. package/docs/crawl/docs/_core-concept/subscriber.html +0 -75
  148. package/docs/crawl/docs/_decorators/ancestor-attribute.html +0 -116
  149. package/docs/crawl/docs/_decorators/auto-subscribe.html +0 -202
  150. package/docs/crawl/docs/_decorators/bind.html +0 -141
  151. package/docs/crawl/docs/_decorators/get.html +0 -149
  152. package/docs/crawl/docs/_decorators/handle.html +0 -165
  153. package/docs/crawl/docs/_decorators/on-assign.html +0 -355
  154. package/docs/crawl/docs/_decorators/patch.html +0 -78
  155. package/docs/crawl/docs/_decorators/post.html +0 -139
  156. package/docs/crawl/docs/_decorators/publish.html +0 -61
  157. package/docs/crawl/docs/_decorators/put.html +0 -78
  158. package/docs/crawl/docs/_decorators/subscribe.html +0 -109
  159. package/docs/crawl/docs/_decorators/wait-for-ancestors.html +0 -137
  160. package/docs/crawl/docs/_directives/sub.html +0 -93
  161. package/docs/crawl/docs/_getting-started/ai-agents.html +0 -173
  162. package/docs/crawl/docs/_getting-started/concorde-manual-install.html +0 -100
  163. package/docs/crawl/docs/_getting-started/concorde-outside.html +0 -58
  164. package/docs/crawl/docs/_getting-started/create-a-component.html +0 -111
  165. package/docs/crawl/docs/_getting-started/my-first-component.html +0 -189
  166. package/docs/crawl/docs/_getting-started/my-first-subscriber.html +0 -110
  167. package/docs/crawl/docs/_getting-started/pubsub.html +0 -62
  168. package/docs/crawl/docs/_getting-started/start.html +0 -76
  169. package/docs/crawl/docs/_getting-started/theming.html +0 -85
  170. package/docs/crawl/docs/_misc/api-configuration.html +0 -149
  171. package/docs/crawl/docs/_misc/dataProviderKey.html +0 -135
  172. package/docs/crawl/docs/_misc/docs-mock-api.html +0 -158
  173. package/docs/crawl/docs/_misc/dynamic-path.html +0 -180
  174. package/docs/crawl/docs/_misc/endpoint.html +0 -50
  175. package/docs/crawl/docs/_misc/formelement-subscriber-removal.html +0 -138
  176. package/docs/crawl/docs/_misc/html-integration.html +0 -48
  177. package/docs/crawl/hubs/decorators.html +0 -547
  178. package/docs/crawl/hubs/form-components.html +0 -357
  179. package/docs/crawl/hubs/remote-data.html +0 -452
  180. package/docs/crawl/index.html +0 -101
  181. package/docs/css/docs.css +0 -0
  182. package/docs/docs-mock-api-sw.js +0 -720
  183. package/docs/docs-mock-api-sw.js.map +0 -7
  184. package/docs/fonts/ClashGrotesk-Bold.eot +0 -0
  185. package/docs/fonts/ClashGrotesk-Bold.ttf +0 -0
  186. package/docs/fonts/ClashGrotesk-Bold.woff +0 -0
  187. package/docs/fonts/ClashGrotesk-Bold.woff2 +0 -0
  188. package/docs/fonts/ClashGrotesk-Extralight.eot +0 -0
  189. package/docs/fonts/ClashGrotesk-Extralight.ttf +0 -0
  190. package/docs/fonts/ClashGrotesk-Extralight.woff +0 -0
  191. package/docs/fonts/ClashGrotesk-Extralight.woff2 +0 -0
  192. package/docs/fonts/ClashGrotesk-Light.eot +0 -0
  193. package/docs/fonts/ClashGrotesk-Light.ttf +0 -0
  194. package/docs/fonts/ClashGrotesk-Light.woff +0 -0
  195. package/docs/fonts/ClashGrotesk-Light.woff2 +0 -0
  196. package/docs/fonts/ClashGrotesk-Medium.eot +0 -0
  197. package/docs/fonts/ClashGrotesk-Medium.ttf +0 -0
  198. package/docs/fonts/ClashGrotesk-Medium.woff +0 -0
  199. package/docs/fonts/ClashGrotesk-Medium.woff2 +0 -0
  200. package/docs/fonts/ClashGrotesk-Regular.eot +0 -0
  201. package/docs/fonts/ClashGrotesk-Regular.ttf +0 -0
  202. package/docs/fonts/ClashGrotesk-Regular.woff +0 -0
  203. package/docs/fonts/ClashGrotesk-Regular.woff2 +0 -0
  204. package/docs/fonts/ClashGrotesk-Semibold.eot +0 -0
  205. package/docs/fonts/ClashGrotesk-Semibold.ttf +0 -0
  206. package/docs/fonts/ClashGrotesk-Semibold.woff +0 -0
  207. package/docs/fonts/ClashGrotesk-Semibold.woff2 +0 -0
  208. package/docs/fonts/ClashGrotesk-Variable.eot +0 -0
  209. package/docs/fonts/ClashGrotesk-Variable.ttf +0 -0
  210. package/docs/fonts/ClashGrotesk-Variable.woff +0 -0
  211. package/docs/fonts/ClashGrotesk-Variable.woff2 +0 -0
  212. package/docs/img/concorde-icon.svg +0 -5
  213. package/docs/img/concorde-logo.svg +0 -1
  214. package/docs/img/concorde.png +0 -0
  215. package/docs/img/concorde_def.png +0 -0
  216. package/docs/img/concorde_seuil.png.webp +0 -0
  217. package/docs/img/concorde_seuil_invert.png +0 -0
  218. package/docs/img/paul_metrand.jpg +0 -0
  219. package/docs/img/paul_metrand_xs.jpg +0 -0
  220. package/docs/index.html +0 -93
  221. package/docs/llms-full.txt +0 -5787
  222. package/docs/llms.txt +0 -104
  223. package/docs/robots.txt +0 -16
  224. package/docs/sitemap.xml +0 -237
  225. package/docs/src/core/components/functional/date/date.md +0 -290
  226. package/docs/src/core/components/functional/fetch/fetch.md +0 -125
  227. package/docs/src/core/components/functional/if/if.md +0 -9
  228. package/docs/src/core/components/functional/jsonata/jsonata.md +0 -56
  229. package/docs/src/core/components/functional/list/list.md +0 -65
  230. package/docs/src/core/components/functional/mix/mix.md +0 -41
  231. package/docs/src/core/components/functional/queue/queue.md +0 -72
  232. package/docs/src/core/components/functional/router/router.md +0 -94
  233. package/docs/src/core/components/functional/sdui/default-library.json +0 -108
  234. package/docs/src/core/components/functional/sdui/example.json +0 -99
  235. package/docs/src/core/components/functional/sdui/sdui.md +0 -356
  236. package/docs/src/core/components/functional/states/states.md +0 -87
  237. package/docs/src/core/components/functional/submit/submit.md +0 -114
  238. package/docs/src/core/components/functional/subscriber/subscriber.md +0 -91
  239. package/docs/src/core/components/functional/value/value.md +0 -35
  240. package/docs/src/core/components/ui/alert/alert.md +0 -121
  241. package/docs/src/core/components/ui/alert-messages/alert-messages.md +0 -0
  242. package/docs/src/core/components/ui/badge/badge.md +0 -127
  243. package/docs/src/core/components/ui/button/button.md +0 -182
  244. package/docs/src/core/components/ui/captcha/captcha.md +0 -12
  245. package/docs/src/core/components/ui/card/card.md +0 -97
  246. package/docs/src/core/components/ui/divider/divider.md +0 -35
  247. package/docs/src/core/components/ui/form/checkbox/checkbox.md +0 -77
  248. package/docs/src/core/components/ui/form/fieldset/fieldset.md +0 -129
  249. package/docs/src/core/components/ui/form/form-actions/form-actions.md +0 -77
  250. package/docs/src/core/components/ui/form/form-layout/form-layout.md +0 -44
  251. package/docs/src/core/components/ui/form/input/input.md +0 -142
  252. package/docs/src/core/components/ui/form/input-autocomplete/input-autocomplete.md +0 -133
  253. package/docs/src/core/components/ui/form/radio/radio.md +0 -57
  254. package/docs/src/core/components/ui/form/select/select.md +0 -71
  255. package/docs/src/core/components/ui/form/switch/switch.md +0 -57
  256. package/docs/src/core/components/ui/form/textarea/textarea.md +0 -65
  257. package/docs/src/core/components/ui/group/group.md +0 -75
  258. package/docs/src/core/components/ui/icon/icon.md +0 -125
  259. package/docs/src/core/components/ui/icon/icons.json +0 -1
  260. package/docs/src/core/components/ui/image/image.md +0 -107
  261. package/docs/src/core/components/ui/link/link.md +0 -43
  262. package/docs/src/core/components/ui/loader/loader.md +0 -55
  263. package/docs/src/core/components/ui/menu/menu.md +0 -329
  264. package/docs/src/core/components/ui/modal/modal.md +0 -119
  265. package/docs/src/core/components/ui/pop/pop.md +0 -96
  266. package/docs/src/core/components/ui/progress/progress.md +0 -63
  267. package/docs/src/core/components/ui/table/table.md +0 -455
  268. package/docs/src/core/components/ui/toast/toast.md +0 -166
  269. package/docs/src/core/components/ui/tooltip/tooltip.md +0 -82
  270. package/docs/src/docs/_core-concept/dataFlow.md +0 -88
  271. package/docs/src/docs/_core-concept/overview.md +0 -57
  272. package/docs/src/docs/_core-concept/subscriber.md +0 -75
  273. package/docs/src/docs/_decorators/ancestor-attribute.md +0 -127
  274. package/docs/src/docs/_decorators/auto-subscribe.md +0 -202
  275. package/docs/src/docs/_decorators/bind.md +0 -167
  276. package/docs/src/docs/_decorators/get.md +0 -162
  277. package/docs/src/docs/_decorators/handle.md +0 -175
  278. package/docs/src/docs/_decorators/on-assign.md +0 -390
  279. package/docs/src/docs/_decorators/patch.md +0 -70
  280. package/docs/src/docs/_decorators/post.md +0 -146
  281. package/docs/src/docs/_decorators/publish.md +0 -55
  282. package/docs/src/docs/_decorators/put.md +0 -70
  283. package/docs/src/docs/_decorators/subscribe.md +0 -100
  284. package/docs/src/docs/_decorators/wait-for-ancestors.md +0 -163
  285. package/docs/src/docs/_directives/sub.md +0 -91
  286. package/docs/src/docs/_getting-started/ai-agents.md +0 -76
  287. package/docs/src/docs/_getting-started/concorde-manual-install.md +0 -133
  288. package/docs/src/docs/_getting-started/concorde-outside.md +0 -33
  289. package/docs/src/docs/_getting-started/create-a-component.md +0 -139
  290. package/docs/src/docs/_getting-started/my-first-component.md +0 -236
  291. package/docs/src/docs/_getting-started/my-first-subscriber.md +0 -120
  292. package/docs/src/docs/_getting-started/pubsub.md +0 -37
  293. package/docs/src/docs/_getting-started/start.md +0 -47
  294. package/docs/src/docs/_getting-started/theming.md +0 -91
  295. package/docs/src/docs/_misc/api-configuration.md +0 -81
  296. package/docs/src/docs/_misc/dataProviderKey.md +0 -168
  297. package/docs/src/docs/_misc/docs-mock-api.md +0 -63
  298. package/docs/src/docs/_misc/dynamic-path.md +0 -71
  299. package/docs/src/docs/_misc/endpoint.md +0 -45
  300. package/docs/src/docs/_misc/formelement-subscriber-removal.md +0 -115
  301. package/docs/src/docs/_misc/html-integration.md +0 -15
  302. package/docs/src/docs/search/docs-search.json +0 -9512
  303. package/docs/src/tag-list.json +0 -1
  304. package/docs/src/tsconfig-model.json +0 -23
  305. package/docs/src/tsconfig.declarations.json +0 -22
  306. package/docs/src/tsconfig.emit.json +0 -23
  307. package/docs/src/tsconfig.json +0 -858
  308. package/docs/svg/regular/plane.svg +0 -1
  309. package/docs/svg/solid/plane.svg +0 -1
  310. package/gitlab/job_github_mirror.sh +0 -39
  311. package/scripts/github-export.mjs +0 -150
  312. package/src/css.d.ts +0 -19
  313. package/src/tsconfig.declarations.json +0 -22
  314. package/src/tsconfig.emit.json +0 -23
package/docs/crawl/docs/_decorators/post.html DELETED
@@ -1,139 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/docs/_decorators/post.html" data-doc-id="docs/_decorators/post">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>@post — Concorde</title>
7
- <meta name="description" content="@post sends the contents of a publisher and stores the response in an">
8
- <meta name="keywords" content="Concorde, supersoniks, docs/_decorators/post, post, @post, decorator, ApiResult, undefined, Endpoint, DataProviderKey,
9
-
10
- The current body is read from , send(component),
11
-
12
- , returns a ,
13
-
14
- Use ">
15
- <meta name="concorde-doc-id" content="docs/_decorators/post">
16
- <link rel="canonical" href="https://concorde.supersoniks.org/crawl/docs/_decorators/post.html">
17
- </head>
18
- <body>
19
- <header>
20
- <p><a href="../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#docs/_decorators/post.md/post" rel="nofollow">interactive version</a></p>
21
- </header>
22
- <main>
23
- <article>
24
- <p class="doc-lead" id="doc-summary"><strong>Concorde decorator — @post</strong>. @post sends the contents of a publisher and stores the response in an <span>Doc ID: <code>docs/_decorators/post</code>. Keywords: Concorde, supersoniks, docs/_decorators/post, post, @post, decorator, ApiResult, undefined, Endpoint, DataProviderKey,
25
-
26
- The current body is read from , send(component),
27
-
28
- , returns a ,
29
-
30
- Use . URL: <a href="https://concorde.supersoniks.org/crawl/docs/_decorators/post.html">https://concorde.supersoniks.org/crawl/docs/_decorators/post.html</a>.</span></p>
31
- <h1 id="post">@post</h1>
32
- <p><code>@post</code> sends the contents of a publisher and stores the response in an
33
- optional <code>ApiResult&lt;T&gt;</code> property. The property is <code>undefined</code> until a result
34
- is available.</p>
35
- <h2 id="minimal-usage">Minimal usage</h2>
36
- <p>Pass an <code>Endpoint&lt;T&gt;</code> and a <code>DataProviderKey&lt;B&gt;</code> for the request body.</p>
37
- <pre><code class="language-typescript">const userBodyKey = new DataProviderKey&lt;CreateUser&gt;(&quot;users.form&quot;);
38
- const createUser = post(new Endpoint&lt;User&gt;(&quot;users&quot;), userBodyKey);
39
-
40
- @createUser
41
- @state()
42
- payload?: ApiResult&lt;User&gt;;
43
- </code></pre>
44
- <p>The same decorator adapts to a method and receives the complete payload:</p>
45
- <pre><code class="language-typescript">@post(new Endpoint&lt;User&gt;(&quot;users&quot;), userBodyKey)
46
- handleCreate(payload?: ApiResult&lt;User&gt;) {
47
- if (payload?.response?.ok) console.log(payload.result);
48
- }
49
- </code></pre>
50
- <p>The current body is read from <code>userBodyKey</code>. By default, the POST is sent when
51
- the component connects and after each body mutation. Mutations in the same
52
- frame are coalesced into one request.</p>
53
- <p>API configuration is read from the HTML scope, as with
54
- <a href="./get.html#get">@get</a>.</p>
55
- <h2 id="sending-the-post-again">Sending the POST again</h2>
56
- <h3 id="from-the-component">From the component</h3>
57
- <p>Keep the decorator to access <code>send(component)</code>. The body is read again when the
58
- operation runs.</p>
59
- <pre><code class="language-typescript">async saveAgain() {
60
- const payload = await createUser.send(this);
61
- console.log(payload?.result);
62
- }
63
- </code></pre>
64
- <p><code>send()</code> returns a <code>Promise&lt;ApiResult&lt;T&gt; | undefined&gt;</code> that resolves after the
65
- operation completes. It is useful for “Save” or “Retry” buttons and can repeat
66
- an operation with side effects.</p>
67
- <h3 id="from-a-method-decorator">From a method decorator</h3>
68
- <p>The send action can decorate a local method. It runs after the method by
69
- default, waits for an eventual Promise to resolve, and the decorated method
70
- call waits for the send to complete:</p>
71
- <pre><code class="language-typescript">import { send } from &quot;@supersoniks/concorde/decorators&quot;;
72
-
73
- @send(createUser)
74
- async save() {
75
- // Prepare local state or validate the form.
76
- }
77
- </code></pre>
78
- <p>Use <code>{ when: &quot;before&quot; }</code> when the send must complete before the method runs:</p>
79
- <pre><code class="language-typescript">@send(createUser, { when: &quot;before&quot; })
80
- saveBefore() {
81
- // The POST has completed before this method runs.
82
- }
83
- </code></pre>
84
- <p>The method decorator adds an explicit send. If the method also mutates the body
85
- publisher, set <code>autoPostOnBodyMutation: false</code> when the decorated method must
86
- be the only trigger.</p>
87
- <h2 id="options-postoptions">Options (<code>PostOptions</code>)</h2>
88
- <p>Options are the third argument, or the fourth argument when a configuration key
89
- is provided.</p>
90
- <ul>
91
- <li><code>autoPostOnBodyMutation</code>: send after a body mutation (default: <code>true</code>). Set
92
- it to <code>false</code> to use <code>send()</code>.</li>
93
- <li><code>skipIfBodyMissing</code>: skip when the body is <code>null</code> or <code>undefined</code> (default:
94
- <code>true</code>).</li>
95
- <li><code>refetchEveryMs</code>: repeat the POST at this interval. Use it only when
96
- repeating the operation is intended.</li>
97
- <li><code>skipEmptyPlaceholder</code>: block the request when a <code>${...}</code> placeholder is
98
- <code>&quot;&quot;</code>.</li>
99
- <li><code>triggerKey</code>: a publisher whose <code>invalidate()</code> sends the POST again.</li>
100
- </ul>
101
- <p>With a configuration key:</p>
102
- <pre><code class="language-typescript">@post(endpoint, userBodyKey, apiConfigurationKey)
103
- </code></pre>
104
- <p>See <a href="../_misc/dynamic-path.html#dynamic-path">Dynamic path placeholders</a> for
105
- dynamic path details.</p>
106
- <h2 id="when-the-post-is-sent">When the POST is sent</h2>
107
- <ul>
108
- <li>when the component connects and the body and configuration are available;</li>
109
- <li>after a body mutation, unless <code>autoPostOnBodyMutation: false</code>;</li>
110
- <li>when a property used in <code>${...}</code> changes;</li>
111
- <li>when a configuration publisher changes;</li>
112
- <li>when the <code>triggerKey</code> publisher is invalidated;</li>
113
- <li>when <code>send()</code> is called;</li>
114
- <li>after each response when <code>refetchEveryMs</code> is set.</li>
115
- </ul>
116
- <h2 id="import">Import</h2>
117
- <pre><code class="language-typescript">import { post, type ApiResult } from &quot;@supersoniks/concorde/decorators&quot;;
118
- import { DataProviderKey } from &quot;@supersoniks/concorde/dataProviderKey&quot;;
119
- import { Endpoint } from &quot;@supersoniks/concorde/utils/endpoint&quot;;
120
- </code></pre>
121
- <h2 id="demos">Demos</h2>
122
- <pre><code>&lt;docs-demo-sources for=&quot;demo-api-post&quot;&gt;&lt;/docs-demo-sources&gt;
123
- &lt;demo-api-post&gt;&lt;/demo-api-post&gt;
124
- &lt;docs-demo-sources for=&quot;demo-api-post-method&quot;&gt;&lt;/docs-demo-sources&gt;
125
- &lt;demo-api-post-method&gt;&lt;/demo-api-post-method&gt;
126
- &lt;docs-demo-sources for=&quot;demo-api-post-dynamic&quot;&gt;&lt;/docs-demo-sources&gt;
127
- &lt;demo-api-post-dynamic&gt;&lt;/demo-api-post-dynamic&gt;
128
- </code></pre>
129
- <p>See <a href="./put.html#put">@put</a> and
130
- <a href="./patch.html#patch">@patch</a>: they use the same model with a
131
- different HTTP method.</p>
132
- <h2 id="advanced">Advanced</h2>
133
- <p>External invalidation is currently available through <code>triggerKey</code>; it is kept
134
- out of the main usage examples.</p>
135
-
136
- </article>
137
- </main>
138
- </body>
139
- </html>
package/docs/crawl/docs/_decorators/publish.html DELETED
@@ -1,61 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/docs/_decorators/publish.html" data-doc-id="docs/_decorators/publish">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>@publish — Concorde</title>
7
- <meta name="description" content="Write-only binding: assigning to the property publishes to the DataProviderKey path. No read subscription (inverse of @subscribe).">
8
- <meta name="keywords" content="Concorde, supersoniks, docs/_decorators/publish, publish, @publish, decorator, DataProviderKey, @bind, @subscribe, skipEmptyPlaceholder">
9
- <meta name="concorde-doc-id" content="docs/_decorators/publish">
10
- <link rel="canonical" href="https://concorde.supersoniks.org/crawl/docs/_decorators/publish.html">
11
- </head>
12
- <body>
13
- <header>
14
- <p><a href="../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#docs/_decorators/publish.md/publish" rel="nofollow">interactive version</a></p>
15
- </header>
16
- <main>
17
- <article>
18
- <p class="doc-lead" id="doc-summary"><strong>Concorde decorator — @publish</strong>. Write-only binding: assigning to the property publishes to the DataProviderKey path. No read subscription (inverse of @subscribe). <span>Doc ID: <code>docs/_decorators/publish</code>. Keywords: Concorde, supersoniks, docs/_decorators/publish, publish, @publish, decorator, DataProviderKey, @bind, @subscribe, skipEmptyPlaceholder. URL: <a href="https://concorde.supersoniks.org/crawl/docs/_decorators/publish.html">https://concorde.supersoniks.org/crawl/docs/_decorators/publish.html</a>.</span></p>
19
- <h1 id="publish">@publish</h1>
20
- <p>Write-only binding: assigning to the property publishes to the <code>DataProviderKey</code> path. No read subscription (inverse of <a href="./subscribe.html#subscribe">@subscribe</a>).</p>
21
- <p>Similar to the “reflect” half of <a href="./bind.html#bind">@bind</a> without listening to the publisher.</p>
22
- <h2 id="import">Import</h2>
23
- <pre><code class="language-typescript">import { publish } from &quot;@supersoniks/concorde/decorators&quot;;
24
- import { sub } from &quot;@supersoniks/concorde/directives&quot;;
25
- import { DataProviderKey } from &quot;@supersoniks/concorde/dataProviderKey&quot;;
26
- </code></pre>
27
- <h2 id="example">Example</h2>
28
- <pre><code class="language-typescript">type PublishDemoData = { email: string; message: string };
29
- const publishDemoKey = new DataProviderKey&lt;PublishDemoData&gt;(&quot;publishDemo&quot;);
30
- //
31
- @customElement(&quot;demo-publish&quot;)
32
- export class DemoPublish extends LitElement {
33
- @publish(publishDemoKey.email)
34
- @state()
35
- email = &quot;&quot;;
36
- //
37
- @publish(publishDemoKey.message)
38
- @state()
39
- message = &quot;&quot;;
40
- //
41
- render() {
42
- return html`
43
- &lt;sonic-input
44
- .value=${this.email}
45
- @input=${(e) =&gt; (this.email = (e.target as HTMLInputElement).value)}
46
- label=&quot;Email&quot;
47
- &gt;&lt;/sonic-input&gt;
48
- &lt;p&gt;${sub(publishDemoKey.email)}&lt;/p&gt;
49
- `;
50
- }
51
- }
52
- </code></pre>
53
- <pre><code>&lt;docs-demo-sources for=&quot;demo-publish&quot;&gt;&lt;/docs-demo-sources&gt;
54
- &lt;demo-publish&gt;&lt;/demo-publish&gt;
55
- </code></pre>
56
- <p>Dynamic paths use the same placeholder rules as <code>@bind</code> / <code>@subscribe</code>. Resolution and <code>skipEmptyPlaceholder</code>: <a href="../_misc/dynamic-path.html#dynamic-path">Dynamic path placeholders</a>.</p>
57
-
58
- </article>
59
- </main>
60
- </body>
61
- </html>
package/docs/crawl/docs/_decorators/put.html DELETED
@@ -1,78 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/docs/_decorators/put.html" data-doc-id="docs/_decorators/put">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>@put — Concorde</title>
7
- <meta name="description" content="@put replaces a resource with the body from a publisher. It uses exactly the">
8
- <meta name="keywords" content="Concorde, supersoniks, docs/_decorators/put, put, @put, decorator, Endpoint, DataProviderKey, ApiResult, send(component),
9
-
10
- , when: &quot;before&quot;, autoPostOnBodyMutation: false, autoPostOnBodyMutation, skipIfBodyMissing">
11
- <meta name="concorde-doc-id" content="docs/_decorators/put">
12
- <link rel="canonical" href="https://concorde.supersoniks.org/crawl/docs/_decorators/put.html">
13
- </head>
14
- <body>
15
- <header>
16
- <p><a href="../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#docs/_decorators/put.md/put" rel="nofollow">interactive version</a></p>
17
- </header>
18
- <main>
19
- <article>
20
- <p class="doc-lead" id="doc-summary"><strong>Concorde decorator — @put</strong>. @put replaces a resource with the body from a publisher. It uses exactly the <span>Doc ID: <code>docs/_decorators/put</code>. Keywords: Concorde, supersoniks, docs/_decorators/put, put, @put, decorator, Endpoint, DataProviderKey, ApiResult, send(component),
21
-
22
- , when: &quot;before&quot;, autoPostOnBodyMutation: false, autoPostOnBodyMutation, skipIfBodyMissing. URL: <a href="https://concorde.supersoniks.org/crawl/docs/_decorators/put.html">https://concorde.supersoniks.org/crawl/docs/_decorators/put.html</a>.</span></p>
23
- <h1 id="put">@put</h1>
24
- <p><code>@put</code> replaces a resource with the body from a publisher. It uses exactly the
25
- same model as <a href="./post.html#post">@post</a>:
26
- <code>Endpoint&lt;T&gt;</code>, <code>DataProviderKey&lt;B&gt;</code>, <code>ApiResult&lt;T&gt;</code>, options, and the
27
- <code>send(component)</code> handle.</p>
28
- <h2 id="minimal-usage">Minimal usage</h2>
29
- <pre><code class="language-typescript">const bodyKey = new DataProviderKey&lt;UpdateUser&gt;(&quot;users.form&quot;);
30
- const updateUser = put(new Endpoint&lt;User&gt;(&quot;users/42&quot;), bodyKey);
31
-
32
- @updateUser
33
- @state()
34
- payload?: ApiResult&lt;User&gt;;
35
- </code></pre>
36
- <p>The same decorator adapts to a method:</p>
37
- <pre><code class="language-typescript">@put(new Endpoint&lt;User&gt;(&quot;users/42&quot;), bodyKey)
38
- handleUpdate(payload?: ApiResult&lt;User&gt;) {
39
- if (payload?.response?.ok) console.log(payload.result);
40
- }
41
- </code></pre>
42
- <p>To run the operation again from the component:</p>
43
- <pre><code class="language-typescript">async update() {
44
- await updateUser.send(this);
45
- }
46
- </code></pre>
47
- <p><code>send(component)</code> returns a Promise resolved after the PUT completes. See
48
- <a href="./post.html#post">@post</a> for the method-decorator form and the
49
- <code>when: &quot;before&quot;</code> option.</p>
50
- <p>The PUT is also sent automatically when the body mutates, unless
51
- <code>autoPostOnBodyMutation: false</code> is set. See
52
- <a href="./post.html#post">@post</a> for the option details:</p>
53
- <ul>
54
- <li><code>autoPostOnBodyMutation</code></li>
55
- <li><code>skipIfBodyMissing</code></li>
56
- <li><code>refetchEveryMs</code></li>
57
- <li><code>skipEmptyPlaceholder</code></li>
58
- <li><code>triggerKey</code></li>
59
- </ul>
60
- <p>Pass explicit API configuration as the third argument:</p>
61
- <pre><code class="language-typescript">@put(endpoint, bodyKey, apiConfigurationKey)
62
- </code></pre>
63
- <h2 id="import">Import</h2>
64
- <pre><code class="language-typescript">import { put, type ApiResult } from &quot;@supersoniks/concorde/decorators&quot;;
65
- import { DataProviderKey } from &quot;@supersoniks/concorde/dataProviderKey&quot;;
66
- import { Endpoint } from &quot;@supersoniks/concorde/utils/endpoint&quot;;
67
- </code></pre>
68
- <h2 id="see-also">See also</h2>
69
- <ul>
70
- <li><a href="./post.html#post">@post</a> — options and triggers</li>
71
- <li><a href="./patch.html#patch">@patch</a> — partial update</li>
72
- <li><a href="../_misc/dynamic-path.html#dynamic-path">Dynamic path placeholders</a></li>
73
- </ul>
74
-
75
- </article>
76
- </main>
77
- </body>
78
- </html>
package/docs/crawl/docs/_decorators/subscribe.html DELETED
@@ -1,109 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/docs/_decorators/subscribe.html" data-doc-id="docs/_decorators/subscribe">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>@subscribe — Concorde</title>
7
- <meta name="description" content="Keeps a Lit property in sync with a read-only slice of the DataProvider store. You pass a DataProviderKey; when that path changes, the property updates and the component re-renders.">
8
- <meta name="keywords" content="Concorde, supersoniks, docs/_decorators/subscribe, subscribe, @subscribe, decorator, DataProviderKey, | Shape of the object at that path (, , , , …) |
9
- | **Key** | , — static path (, ) or dynamic (, (e.g. , ) — often filled via [">
10
- <meta name="concorde-doc-id" content="docs/_decorators/subscribe">
11
- <link rel="canonical" href="https://concorde.supersoniks.org/crawl/docs/_decorators/subscribe.html">
12
- </head>
13
- <body>
14
- <header>
15
- <p><a href="../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#docs/_decorators/subscribe.md/subscribe" rel="nofollow">interactive version</a></p>
16
- </header>
17
- <main>
18
- <article>
19
- <p class="doc-lead" id="doc-summary"><strong>Concorde decorator — @subscribe</strong>. Keeps a Lit property in sync with a read-only slice of the DataProvider store. You pass a DataProviderKey; when that path changes, the property updates and the component re-renders. <span>Doc ID: <code>docs/_decorators/subscribe</code>. Keywords: Concorde, supersoniks, docs/_decorators/subscribe, subscribe, @subscribe, decorator, DataProviderKey, | Shape of the object at that path (, , , , …) |
20
- | **Key** | , — static path (, ) or dynamic (, (e.g. , ) — often filled via [. URL: <a href="https://concorde.supersoniks.org/crawl/docs/_decorators/subscribe.html">https://concorde.supersoniks.org/crawl/docs/_decorators/subscribe.html</a>.</span></p>
21
- <h1 id="subscribe">@subscribe</h1>
22
- <p>Keeps a <strong>Lit property</strong> in sync with a <strong>read-only</strong> slice of the DataProvider store. You pass a <a href="../_misc/dataProviderKey.html#dataProviderKey"><code>DataProviderKey</code></a>; when that path changes, the property updates and the component re-renders.</p>
23
- <p>Typical setup (same idea as <a href="../_getting-started/my-first-component.html#my-first-component">My first component</a>):</p>
24
- <table>
25
- <thead>
26
- <tr>
27
- <th>Piece</th>
28
- <th>Role</th>
29
- </tr>
30
- </thead>
31
- <tbody><tr>
32
- <td><strong>Type</strong> <code>T</code></td>
33
- <td>Shape of the object at that path (<code>DocsUserData</code>, <code>{ count: number }</code>, …)</td>
34
- </tr>
35
- <tr>
36
- <td><strong>Key</strong></td>
37
- <td><code>DataProviderKey&lt;T, U&gt;</code> — static path (<code>&quot;cart&quot;</code>) or dynamic (<code>&quot;users.${userIndex}&quot;</code>, <code>&quot;${dataProvider}&quot;</code>)</td>
38
- </tr>
39
- <tr>
40
- <td><strong>Scope on the host</strong></td>
41
- <td>Properties listed in <code>U</code> (e.g. <code>dataProvider</code>, <code>userIndex</code>) — often filled via <a href="./ancestor-attribute.html#ancestor-attribute"><code>@ancestorAttribute</code></a></td>
42
- </tr>
43
- <tr>
44
- <td><strong><code>@subscribe(key)</code></strong></td>
45
- <td>Mirrors the store into <code>@state()</code> (or another property); read-only from the component side</td>
46
- </tr>
47
- </tbody></table>
48
- <p>For <strong>writing</strong> back to the store from component state, use <a href="./publish.html#publish">@publish</a>. In templates, the same paths work with <a href="../_directives/sub.html#sub">sub()</a>.</p>
49
- <h2 id="import">Import</h2>
50
- <pre><code class="language-typescript">import { subscribe } from &quot;@supersoniks/concorde/decorators&quot;;
51
- import { DataProviderKey } from &quot;@supersoniks/concorde/dataProviderKey&quot;;
52
-
53
- type Data = { count: number };
54
- const dataKey = new DataProviderKey&amp;lt;Data&amp;gt;(&quot;data&quot;);
55
-
56
- @subscribe(dataKey.count)
57
- @state()
58
- count = 0;
59
- </code></pre>
60
- <h2 id="static-path">Static path</h2>
61
- <p>The key path is fixed. The property type must match <code>T</code> at that segment.</p>
62
- <pre><code class="language-typescript">const cartKey = new DataProviderKey&amp;lt;{ items: string[] }&amp;gt;(&quot;cart&quot;);
63
-
64
- @subscribe(cartKey)
65
- @state()
66
- cart: { items: string[] } | null = null;
67
- </code></pre>
68
- <h2 id="dynamic-path-and-scope">Dynamic path and scope</h2>
69
- <p>Placeholders <code>${prop}</code> in the key string are resolved from <strong>properties on the same component</strong>. While a value is <code>null</code>/<code>undefined</code>, the subscription is inactive; optional <code>{ skipEmptyPlaceholder: true }</code> also waits on <code>&quot;&quot;</code>. Full rules: <a href="../_misc/dynamic-path.html#dynamic-path">Dynamic path placeholders</a>.</p>
70
- <p>Declare dynamic props in the key’s second generic so TypeScript expects them on the host:</p>
71
- <pre><code class="language-typescript">type User = { firstName: string; lastName: string; email: string };
72
-
73
- @subscribe(new DataProviderKey&amp;lt;User, { userIndex: number }&amp;gt;(&quot;demoUsers.${userIndex}&quot;))
74
- @state()
75
- user: User | null = null;
76
-
77
- @property({ type: Number }) userIndex = 0;
78
- </code></pre>
79
- <p>When <code>userIndex</code> changes, <code>@subscribe</code> re-resolves the path and refreshes <code>user</code>.</p>
80
- <h2 id="row--ancestor-scope">Row / ancestor scope</h2>
81
- <p>List items (and wrappers like <code>&lt;div dataProvider=&quot;…&quot;&gt;</code>) set which branch the child reads. Pattern from the tutorial:</p>
82
- <pre><code class="language-typescript">export const rowKey = new DataProviderKey&amp;lt;
83
- User,
84
- { dataProvider: string | null }
85
- &amp;gt;(&quot;${dataProvider}&quot;);
86
-
87
- @ancestorAttribute(&quot;dataProvider&quot;)
88
- dataProvider: string | null = null;
89
-
90
- @subscribe(rowKey)
91
- @state()
92
- user: User | null = null;
93
- </code></pre>
94
- <h2 id="demo">Demo</h2>
95
- <pre><code>&lt;docs-demo-sources for=&quot;demo-subscribe-dynamic&quot;&gt;&lt;/docs-demo-sources&gt;
96
- &lt;demo-subscribe-dynamic&gt;&lt;/demo-subscribe-dynamic&gt;
97
- </code></pre>
98
- <h2 id="see-also">See also</h2>
99
- <ul>
100
- <li><a href="../_core-concept/dataFlow.html#dataFlow">Data flow</a> — overview</li>
101
- <li><a href="../_misc/dataProviderKey.html#dataProviderKey">DataProviderKey</a> — paths and host generics</li>
102
- <li><a href="../_misc/dynamic-path.html#dynamic-path">Dynamic path placeholders</a> — <code>${prop}</code> resolution and <code>skipEmptyPlaceholder</code></li>
103
- <li><a href="../_directives/sub.html#sub">sub()</a> — same paths inside <code>html</code> templates</li>
104
- </ul>
105
-
106
- </article>
107
- </main>
108
- </body>
109
- </html>
package/docs/crawl/docs/_decorators/wait-for-ancestors.html DELETED
@@ -1,137 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/docs/_decorators/wait-for-ancestors.html" data-doc-id="docs/_decorators/wait-for-ancestors">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>@awaitConnectedAncestors and @dispatchConnectedEvent — Concorde</title>
7
- <meta name="description" content="The @awaitConnectedAncestors and @dispatchConnectedEvent decorators delay a web component's initialization until its matching ancestors have executed their connectedCallback. This is when contextual e">
8
- <meta name="keywords" content="Concorde, supersoniks, docs/_decorators/wait-for-ancestors, wait-for-ancestors, @awaitConnectedAncestors and @dispatchConnectedEvent, decorator, awaitConnectedAncestors and @dispatchConnectedEvent, @awaitConnectedAncestors, @dispatchConnectedEvent, connectedCallback, sonic-connected, @dispatchConnectedEvent()">
9
- <meta name="concorde-doc-id" content="docs/_decorators/wait-for-ancestors">
10
- <link rel="canonical" href="https://concorde.supersoniks.org/crawl/docs/_decorators/wait-for-ancestors.html">
11
- </head>
12
- <body>
13
- <header>
14
- <p><a href="../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#docs/_decorators/wait-for-ancestors.md/wait-for-ancestors" rel="nofollow">interactive version</a></p>
15
- </header>
16
- <main>
17
- <article>
18
- <p class="doc-lead" id="doc-summary"><strong>Concorde decorator — @awaitConnectedAncestors and @dispatchConnectedEvent</strong>. The @awaitConnectedAncestors and @dispatchConnectedEvent decorators delay a web component's initialization until its matching ancestors have executed their connectedCallback. This is when contextual e <span>Doc ID: <code>docs/_decorators/wait-for-ancestors</code>. Keywords: Concorde, supersoniks, docs/_decorators/wait-for-ancestors, wait-for-ancestors, @awaitConnectedAncestors and @dispatchConnectedEvent, decorator, awaitConnectedAncestors and @dispatchConnectedEvent, @awaitConnectedAncestors, @dispatchConnectedEvent, connectedCallback, sonic-connected, @dispatchConnectedEvent(). URL: <a href="https://concorde.supersoniks.org/crawl/docs/_decorators/wait-for-ancestors.html">https://concorde.supersoniks.org/crawl/docs/_decorators/wait-for-ancestors.html</a>.</span></p>
19
- <h1 id="awaitconnectedancestors-and-dispatchconnectedevent">@awaitConnectedAncestors and @dispatchConnectedEvent</h1>
20
- <p>The <code>@awaitConnectedAncestors</code> and <code>@dispatchConnectedEvent</code> decorators delay a web component&#39;s initialization until its matching ancestors have executed their <code>connectedCallback</code>. This is when contextual elements (publisher, dataProvider, etc.) are configured.</p>
21
- <h2 id="principle">Principle</h2>
22
- <p>When a child component attaches to the DOM, its ancestors may not yet be initialized (especially if custom element definitions are loaded asynchronously). The <code>@awaitConnectedAncestors</code> decorator delays the component&#39;s <code>connectedCallback</code> until all ancestors matching the provided CSS selectors have executed their <code>connectedCallback</code>.</p>
23
- <p>The <code>@dispatchConnectedEvent</code> decorator allows ancestors to signal they are ready by dispatching the <code>sonic-connected</code> event at the end of their <code>connectedCallback</code>. The event bubbles, so it can be listened to from anywhere (e.g. <code>document.addEventListener(CONNECTED, handler)</code>).</p>
24
- <p>Ancestors that are not web components (no hyphen in tag name) are considered connected by default and do not need to emit the event.</p>
25
- <h2 id="usage">Usage</h2>
26
- <h3 id="import">Import</h3>
27
- <pre><code class="language-typescript">import { awaitConnectedAncestors, dispatchConnectedEvent, ancestorAttribute } from &quot;@supersoniks/concorde/decorators&quot;;
28
- </code></pre>
29
- <h3 id="basic-example">Basic example</h3>
30
- <p>An ancestor container decorated with <code>@dispatchConnectedEvent()</code> signals when it is ready. A child component decorated with <code>@awaitConnectedAncestors(&quot;demo-wait-ancestor-container[dataProvider]&quot;)</code> waits for this container to be initialized before initializing itself. Parameters are CSS selectors (<code>element.matches()</code>).</p>
31
- <p>The parent is registered via <code>customElements.define()</code> (vanilla JS) rather than <code>@customElement</code>, so it can be defined later—e.g. when the user clicks a button. This demonstrates the child waiting until the parent exists.</p>
32
- <pre><code class="language-typescript">import { html, LitElement } from &quot;lit&quot;;
33
- import { customElement, state } from &quot;lit/decorators.js&quot;;
34
-
35
- // Parent: registered later via customElements.define(), not @customElement
36
- @dispatchConnectedEvent()
37
- export class DemoWaitAncestorContainer extends LitElement {
38
- render() {
39
- return html`&lt;slot&gt;&lt;/slot&gt;`;
40
- }
41
- }
42
-
43
- // Child: waits for parent before initializing
44
- @customElement(&quot;demo-wait-ancestor-value&quot;)
45
- @awaitConnectedAncestors(&quot;demo-wait-ancestor-container[dataProvider]&quot;)
46
- export class DemoWaitAncestorValue extends LitElement {
47
- @ancestorAttribute(&quot;dataProvider&quot;)
48
- dataProvider: string | null = null;
49
-
50
- @state() initializedAt: string = &quot;&quot;;
51
-
52
- connectedCallback() {
53
- super.connectedCallback();
54
- this.initializedAt = new Date().toISOString();
55
- }
56
-
57
- render() {
58
- return html`
59
- &lt;p&gt;DataProvider from ancestor: &lt;strong&gt;${this.dataProvider || &quot;—&quot;}&lt;/strong&gt;&lt;/p&gt;
60
- &lt;p&gt;Initialized at: ${this.initializedAt || &quot;(waiting for parent…)&quot;}&lt;/p&gt;
61
- `;
62
- }
63
- }
64
-
65
- // Demo section: register parent via customElements.define() when user clicks
66
- @customElement(&quot;demo-wait-ancestors-section&quot;)
67
- export class DemoWaitAncestorsSection extends LitElement {
68
- registerParent() {
69
- if (!customElements.get(&quot;demo-wait-ancestor-container&quot;)) {
70
- customElements.define(&quot;demo-wait-ancestor-container&quot;, DemoWaitAncestorContainer);
71
- }
72
- }
73
- render() {
74
- return html`
75
- &lt;sonic-button @click=${this.registerParent}&gt;Register parent component&lt;/sonic-button&gt;
76
- &lt;demo-wait-ancestor-container dataProvider=&quot;waitAncestorDemo&quot;&gt;
77
- &lt;demo-wait-ancestor-value&gt;&lt;/demo-wait-ancestor-value&gt;
78
- &lt;/demo-wait-ancestor-container&gt;
79
- `;
80
- }
81
- }
82
- </code></pre>
83
- <pre><code>&lt;docs-demo-sources for=&quot;demo-wait-ancestors-section&quot;&gt;&lt;/docs-demo-sources&gt;
84
- &lt;demo-wait-ancestors-section&gt;&lt;/demo-wait-ancestors-section&gt;
85
- </code></pre>
86
- <h3 id="multiple-ancestors">Multiple ancestors</h3>
87
- <p>The child waits for all specified ancestors. Register outer first, then inner — the child initializes only when both are ready.</p>
88
- <pre><code>&lt;demo-wait-ancestors-multi-section&gt;&lt;/demo-wait-ancestors-multi-section&gt;
89
- </code></pre>
90
- <h3 id="ancestors-already-connected">Ancestors already connected</h3>
91
- <p>When the parent is defined at load and already in the DOM, the child initializes immediately (no delay).</p>
92
- <p><strong>Static (both in DOM from start):</strong></p>
93
- <pre><code>&lt;docs-demo-sources for=&quot;demo-wait-ancestors-static-section&quot;&gt;&lt;/docs-demo-sources&gt;
94
- &lt;demo-wait-ancestors-static-section&gt;&lt;/demo-wait-ancestors-static-section&gt;
95
- </code></pre>
96
- <p><strong>Dynamic (child added on button click):</strong></p>
97
- <pre><code>&lt;docs-demo-sources for=&quot;demo-wait-ancestors-ready-section&quot;&gt;&lt;/docs-demo-sources&gt;
98
- &lt;demo-wait-ancestors-ready-section&gt;&lt;/demo-wait-ancestors-ready-section&gt;
99
- </code></pre>
100
- <h2 id="css-selector-support">CSS selector support</h2>
101
- <p>Parameters are CSS selectors matched via <code>element.matches()</code> — e.g. <code>&quot;sonic-subscriber&quot;</code>, <code>&quot;sonic-subscriber[dataProvider]&quot;</code>, <code>&quot;.my-container&quot;</code>, or multiple: <code>&quot;sonic-subscriber&quot;, &quot;sonic-sdui&quot;</code>.</p>
102
- <h2 id="behavior">Behavior</h2>
103
- <ul>
104
- <li>Ancestor search uses CSS selectors (<code>element.matches(selector)</code>) — supports tag names, classes, attributes, combinators, etc.</li>
105
- <li>Traversal includes shadow roots (parentNode / host)</li>
106
- <li>Non-web components (no hyphen in tag name) are considered connected by default</li>
107
- <li>For web component ancestors, it waits for <code>customElements.whenDefined(tagName)</code> and the <code>sonic-connected</code> event (or a timeout as fallback)</li>
108
- <li>If no matching ancestor is found, the original <code>connectedCallback</code> is called immediately</li>
109
- <li>Ancestors that do not emit <code>sonic-connected</code> trigger the fallback after the timeout (compatibility with existing components)</li>
110
- </ul>
111
- <h2 id="use-cases">Use cases</h2>
112
- <p>These decorators are particularly useful for:</p>
113
- <ul>
114
- <li><strong>sonic-value</strong> inside a <strong>sonic-subscriber</strong>: the value waits for the subscriber to configure its publisher</li>
115
- <li><strong>Components inside sonic-sdui</strong>: wait for the SDUI to load and configure its context</li>
116
- <li><strong>Any component</strong> depending on context provided by an ancestor custom element</li>
117
- </ul>
118
- <h2 id="listening-to-the-connected-event">Listening to the connected event</h2>
119
- <p>The <code>sonic-connected</code> event bubbles, so you can listen to it from anywhere:</p>
120
- <pre><code class="language-typescript">import { CONNECTED } from &quot;@supersoniks/concorde/decorators&quot;;
121
-
122
- someConnectable.addEventListener(CONNECTED, (e) =&gt; {
123
- console.log(&quot;Component connected:&quot;, e.target);
124
- });
125
- </code></pre>
126
- <h2 id="notes">Notes</h2>
127
- <ul>
128
- <li>These decorators apply only to web components (classes extending <code>HTMLElement</code>)</li>
129
- <li>The fallback timeout ensures compatibility with components that do not yet use <code>@dispatchConnectedEvent</code></li>
130
- <li>Traversal includes shadow roots</li>
131
- <li>For a guarantee without relying on the timeout, decorate ancestors (Subscriber, Fetcher, etc.) with <code>@dispatchConnectedEvent</code></li>
132
- </ul>
133
-
134
- </article>
135
- </main>
136
- </body>
137
- </html>
package/docs/crawl/docs/_directives/sub.html DELETED
@@ -1,93 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/docs/_directives/sub.html" data-doc-id="docs/_directives/sub">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>sub() — Concorde</title>
7
- <meta name="description" content="Read-only Lit directive: displays the current DataProvider value and updates whenever it is assigned.">
8
- <meta name="keywords" content="Concorde, supersoniks, docs/_directives/sub, sub, sub(), directive, ${prop}, @subscribe, null, &quot;&quot;, skipEmptyPlaceholder, ${…}, get, set">
9
- <meta name="concorde-doc-id" content="docs/_directives/sub">
10
- <link rel="canonical" href="https://concorde.supersoniks.org/crawl/docs/_directives/sub.html">
11
- </head>
12
- <body>
13
- <header>
14
- <p><a href="../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#docs/_directives/sub.md/sub" rel="nofollow">interactive version</a></p>
15
- </header>
16
- <main>
17
- <article>
18
- <p class="doc-lead" id="doc-summary"><strong>Concorde directive — sub()</strong>. Read-only Lit directive: displays the current DataProvider value and updates whenever it is assigned. <span>Doc ID: <code>docs/_directives/sub</code>. Keywords: Concorde, supersoniks, docs/_directives/sub, sub, sub(), directive, ${prop}, @subscribe, null, &quot;&quot;, skipEmptyPlaceholder, ${…}, get, set. URL: <a href="https://concorde.supersoniks.org/crawl/docs/_directives/sub.html">https://concorde.supersoniks.org/crawl/docs/_directives/sub.html</a>.</span></p>
19
- <h1 id="sub">sub()</h1>
20
- <p>Read-only Lit directive: displays the current <strong>DataProvider</strong> value and updates whenever it is assigned.</p>
21
- <h2 id="import">Import</h2>
22
- <pre><code class="language-typescript">import { sub } from &quot;@supersoniks/concorde/directives&quot;;
23
- </code></pre>
24
- <h2 id="string-path">String path</h2>
25
- <pre><code class="language-typescript">render() {
26
- return html`&amp;lt;p&amp;gt;Count: ${sub(&quot;myCounter.count&quot;)}&amp;lt;/p&amp;gt;`;
27
- }
28
- </code></pre>
29
- <h2 id="dataproviderkey-static">DataProviderKey (static)</h2>
30
- <pre><code class="language-typescript">import { DataProviderKey } from &quot;@supersoniks/concorde/dataProviderKey&quot;;
31
- import { sub } from &quot;@supersoniks/concorde/directives&quot;;
32
-
33
- const counterKey = new DataProviderKey&amp;lt;{ count: number }&amp;gt;(&quot;myCounter&quot;);
34
-
35
- render() {
36
- return html`&amp;lt;p&amp;gt;${sub(counterKey.count)}&amp;lt;/p&amp;gt;`;
37
- }
38
- </code></pre>
39
- <h2 id="dynamic-dataproviderkey-prop">Dynamic DataProviderKey (<code>${prop}</code>)</h2>
40
- <p>Like <code>@subscribe</code>: the path is resolved on the template <strong>host component</strong>; the directive re-subscribes when observed props change. Placeholder values (<code>null</code>, <code>&quot;&quot;</code>, <code>0</code>, …): <a href="../_misc/dynamic-path.html#dynamic-path">Dynamic path placeholders</a> (<code>skipEmptyPlaceholder</code> not available on <code>sub()</code> yet).</p>
41
- <pre><code class="language-typescript">import { DataProviderKey } from &quot;@supersoniks/concorde/dataProviderKey&quot;;
42
- import { sub } from &quot;@supersoniks/concorde/directives&quot;;
43
-
44
- type User = { firstName: string; lastName: string; email: string };
45
- const userKey = new DataProviderKey&amp;lt;User, { userIndex: number }&amp;gt;(
46
- &quot;demoUsers.${userIndex}&quot;,
47
- );
48
-
49
- @customElement(&quot;demo-sub-dynamic&quot;)
50
- export class DemoSubDynamic extends LitElement {
51
- @property({ type: Number }) userIndex = 0;
52
-
53
- render() {
54
- return html`
55
- &amp;lt;p&amp;gt;${sub(userKey.email)}&amp;lt;/p&amp;gt;
56
- `;
57
- }
58
- }
59
- </code></pre>
60
- <h2 id="demo">Demo</h2>
61
- <pre><code>&lt;docs-demo-sources for=&quot;demo-sub-template&quot;&gt;&lt;/docs-demo-sources&gt;
62
- &lt;demo-sub-template&gt;&lt;/demo-sub-template&gt;
63
- </code></pre>
64
- <h2 id="concatenation-forms">Concatenation (forms)</h2>
65
- <pre><code class="language-typescript">html`&amp;lt;span&amp;gt;${sub(this.formDataProvider + &quot;.email&quot;)}&amp;lt;/span&amp;gt;`
66
- </code></pre>
67
- <h2 id="sub-vs-get--set--dp">sub() vs get() / set() / dp()</h2>
68
- <table>
69
- <thead>
70
- <tr>
71
- <th>API</th>
72
- <th>Context</th>
73
- <th>Dynamic <code>${…}</code></th>
74
- </tr>
75
- </thead>
76
- <tbody><tr>
77
- <td><code>sub()</code></td>
78
- <td>Lit template, reactive</td>
79
- <td>Yes</td>
80
- </tr>
81
- <tr>
82
- <td><code>get</code> / <code>set</code> / <code>dp</code></td>
83
- <td>Imperative code</td>
84
- <td>No</td>
85
- </tr>
86
- </tbody></table>
87
- <p>Do not replace <code>sub(path)</code> with <code>get(path)</code> in a template: <code>get</code> returns a one-time snapshot.</p>
88
- <p>See <a href="../_misc/dataProviderKey.html#dataProviderKey">DataProviderKey</a>, <a href="../_decorators/subscribe.html#subscribe">@subscribe</a>, and the <code>concorde-get-set-dp</code> migration skill.</p>
89
-
90
- </article>
91
- </main>
92
- </body>
93
- </html>