@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/core/components/ui/table/table.html DELETED
@@ -1,413 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/ui/table/table.html" data-doc-id="core/components/ui/table/table">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Table — Concorde</title>
7
- <meta name="description" content="Values available : primary, info, success, warning, danger">
8
- <meta name="keywords" content="Concorde, supersoniks, core/components/ui/table/table, table, Table, UI component, sonic-table, web component">
9
- <meta name="concorde-doc-id" content="core/components/ui/table/table">
10
- <link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/table/table.html">
11
- </head>
12
- <body>
13
- <header>
14
- <p><a href="../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/ui/table/table.md/table" rel="nofollow">interactive version</a></p>
15
- </header>
16
- <main>
17
- <article>
18
- <p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Table</strong>. Values available : primary, info, success, warning, danger <span>Doc ID: <code>core/components/ui/table/table</code>. Keywords: Concorde, supersoniks, core/components/ui/table/table, table, Table, UI component, sonic-table, web component. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/ui/table/table.html">https://concorde.supersoniks.org/crawl/core/components/ui/table/table.html</a>.</span></p>
19
- <h1 id="table">Table</h1>
20
- <h2 id="basic-usage">Basic usage</h2>
21
- <pre><code>&lt;sonic-table&gt;
22
- &lt;sonic-tr&gt;
23
- &lt;sonic-th&gt;Id&lt;/sonic-th&gt;
24
- &lt;sonic-th&gt;Name&lt;/sonic-th&gt;
25
- &lt;sonic-th&gt;Email&lt;/sonic-th&gt;
26
- &lt;/sonic-tr&gt;
27
- &lt;sonic-tr&gt;
28
- &lt;sonic-td&gt;1&lt;/sonic-td&gt;
29
- &lt;sonic-td&gt;George Bluth&lt;/sonic-td&gt;
30
- &lt;sonic-td&gt;george.bluth@reqres.in&lt;/sonic-td&gt;
31
- &lt;/sonic-tr&gt;
32
- &lt;sonic-tr&gt;
33
- &lt;sonic-td&gt;2&lt;/sonic-td&gt;
34
- &lt;sonic-td&gt;Janet Weaver&lt;/sonic-td&gt;
35
- &lt;sonic-td&gt;janet.weaver@reqres.in&lt;/sonic-td&gt;
36
- &lt;/sonic-tr&gt;
37
- &lt;sonic-tr&gt;
38
- &lt;sonic-td&gt;3&lt;/sonic-td&gt;
39
- &lt;sonic-td&gt;Emma Wong&lt;/sonic-td&gt;
40
- &lt;sonic-td&gt;emma.wong@reqres.in&lt;/sonic-td&gt;
41
- &lt;/sonic-tr&gt;
42
- &lt;/sonic-table&gt;
43
- </code></pre>
44
- <h2 id="list--fetch">List / fetch</h2>
45
- <pre><code>&lt;sonic-table&gt;
46
- &lt;sonic-thead&gt;
47
- &lt;sonic-tr&gt;
48
- &lt;sonic-th&gt;Id&lt;/sonic-th&gt;
49
- &lt;sonic-th&gt;Name&lt;/sonic-th&gt;
50
- &lt;sonic-th&gt;Email&lt;/sonic-th&gt;
51
- &lt;/sonic-tr&gt;
52
- &lt;/sonic-thead&gt;
53
- &lt;sonic-tbody&gt;
54
- &lt;sonic-list debug fetch serviceURL=&quot;/docs-mock-api&quot; dataProvider=&quot;api/users&quot; key=&quot;data&quot; displayContents&gt;
55
- &lt;template&gt;
56
- &lt;sonic-tr&gt;
57
- &lt;sonic-td data-bind ::inner-html=&quot;$id&quot;&gt;&lt;/sonic-td&gt;
58
- &lt;sonic-td data-bind ::inner-html=&quot;$first_name &lt;b&gt;$last_name&lt;/b&gt;&quot;&gt;&lt;/sonic-td&gt;
59
- &lt;sonic-td data-bind ::inner-html=&quot;$email&quot;&gt;&lt;/sonic-td&gt;
60
- &lt;/sonic-tr&gt;
61
- </code></pre>
62
- <h2 id="size">Size</h2>
63
- <pre><code>&lt;div class=&quot;grid grid-cols-4 gap-3&quot;&gt;
64
- &lt;sonic-table size=&quot;2xs&quot; bordered&gt;
65
- &lt;sonic-tr&gt;&lt;sonic-td class=&quot;w-[5rem]&quot;&gt;2xs&lt;/sonic-td&gt;&lt;/sonic-tr&gt;
66
- &lt;/sonic-table&gt;
67
- &lt;sonic-table size=&quot;xs&quot; bordered&gt;
68
- &lt;sonic-tr&gt;&lt;sonic-td class=&quot;w-[5rem]&quot;&gt;xs&lt;/sonic-td&gt;&lt;/sonic-tr&gt;
69
- &lt;/sonic-table&gt;
70
- &lt;sonic-table size=&quot;sm&quot; bordered&gt;
71
- &lt;sonic-tr&gt;&lt;sonic-td class=&quot;w-[5rem]&quot;&gt;sm&lt;/sonic-td&gt;&lt;/sonic-tr&gt;
72
- &lt;/sonic-table&gt;
73
- &lt;sonic-table size=&quot;md&quot; bordered&gt;
74
- &lt;sonic-tr&gt;&lt;sonic-td class=&quot;w-[5rem]&quot;&gt;md&lt;/sonic-td&gt;&lt;/sonic-tr&gt;
75
- &lt;/sonic-table&gt;
76
- &lt;sonic-table bordered&gt;
77
- &lt;sonic-tr&gt;&lt;sonic-td class=&quot;w-[5rem]&quot;&gt;default&lt;/sonic-td&gt;&lt;/sonic-tr&gt;
78
- &lt;/sonic-table&gt;
79
- &lt;sonic-table size=&quot;lg&quot; bordered&gt;
80
- &lt;sonic-tr&gt;&lt;sonic-td class=&quot;w-[5rem]&quot;&gt;lg&lt;/sonic-td&gt;&lt;/sonic-tr&gt;
81
- &lt;/sonic-table&gt;
82
- &lt;sonic-table size=&quot;xl&quot; bordered&gt;
83
- &lt;sonic-tr&gt;&lt;sonic-td class=&quot;w-[5rem]&quot;&gt;xl&lt;/sonic-td&gt;&lt;/sonic-tr&gt;
84
- &lt;/sonic-table&gt;
85
- &lt;sonic-table size=&quot;2xl&quot; bordered&gt;
86
- &lt;sonic-tr&gt;&lt;sonic-td class=&quot;w-[5rem]&quot;&gt;2xl&lt;/sonic-td&gt;&lt;/sonic-tr&gt;
87
- &lt;/sonic-table&gt;
88
- &lt;/div&gt;
89
- </code></pre>
90
- <h2 id="bordered">Bordered</h2>
91
- <pre><code>&lt;sonic-table bordered&gt;
92
- &lt;sonic-thead&gt;
93
- &lt;sonic-tr&gt;
94
- &lt;sonic-th&gt;Id&lt;/sonic-th&gt;
95
- &lt;sonic-th&gt;Name&lt;/sonic-th&gt;
96
- &lt;sonic-th&gt;Email&lt;/sonic-th&gt;
97
- &lt;/sonic-tr&gt;
98
- &lt;/sonic-thead&gt;
99
- &lt;sonic-tbody&gt;
100
- &lt;sonic-tr&gt;
101
- &lt;sonic-td&gt;1&lt;/sonic-td&gt;
102
- &lt;sonic-td&gt;George Bluth&lt;/sonic-td&gt;
103
- &lt;sonic-td&gt;george.bluth@reqres.in&lt;/sonic-td&gt;
104
- &lt;/sonic-tr&gt;
105
- &lt;sonic-tr&gt;
106
- &lt;sonic-td&gt;2&lt;/sonic-td&gt;
107
- &lt;sonic-td&gt;Janet Weaver&lt;/sonic-td&gt;
108
- &lt;sonic-td&gt;janet.weaver@reqres.in&lt;/sonic-td&gt;
109
- &lt;/sonic-tr&gt;
110
- &lt;sonic-tr&gt;
111
- &lt;sonic-td&gt;3&lt;/sonic-td&gt;
112
- &lt;sonic-td&gt;Emma Wong&lt;/sonic-td&gt;
113
- &lt;sonic-td&gt;emma.wong@reqres.in&lt;/sonic-td&gt;
114
- &lt;/sonic-tr&gt;
115
- &lt;/sonic-tbody&gt;
116
- &lt;/sonic-table&gt;
117
- </code></pre>
118
- <h2 id="maxheight">MaxHeight</h2>
119
- <pre><code>&lt;sonic-table maxHeight=&quot;8rem&quot;&gt;
120
- &lt;sonic-thead&gt;
121
- &lt;sonic-tr&gt;
122
- &lt;sonic-th&gt;Id&lt;/sonic-th&gt;
123
- &lt;sonic-th&gt;Name&lt;/sonic-th&gt;
124
- &lt;sonic-th&gt;Email&lt;/sonic-th&gt;
125
- &lt;/sonic-tr&gt;
126
- &lt;/sonic-thead&gt;
127
- &lt;sonic-tbody&gt;
128
- &lt;sonic-list fetch serviceURL=&quot;/docs-mock-api&quot; dataProvider=&quot;api/users&quot; key=&quot;data&quot; displayContents&gt;
129
- &lt;template&gt;
130
- &lt;sonic-tr&gt;
131
- &lt;sonic-td data-bind ::inner-html=&quot;$id&quot;&gt;&lt;/sonic-td&gt;
132
- &lt;sonic-td data-bind ::inner-html=&quot;$first_name &lt;b&gt;$last_name&lt;/b&gt;&quot;&gt;&lt;/sonic-td&gt;
133
- &lt;sonic-td data-bind ::inner-html=&quot;$email&quot;&gt;&lt;/sonic-td&gt;
134
- &lt;/sonic-tr&gt;
135
- </code></pre>
136
- <h2 id="type">Type</h2>
137
- <p>Values available : primary, info, success, warning, danger</p>
138
- <pre><code>&lt;sonic-table bordered&gt;
139
- &lt;sonic-tr&gt;
140
- &lt;sonic-th type=&quot;info&quot;&gt;Attribute type set on&lt;/sonic-th&gt;
141
- &lt;sonic-th type=&quot;info&quot;&gt;sonic-th&lt;/sonic-th&gt;
142
- &lt;/sonic-tr&gt;
143
- &lt;sonic-tr&gt;
144
- &lt;sonic-td type=&quot;danger&quot;&gt;Attribute type set on&lt;/sonic-td&gt;
145
- &lt;sonic-td type=&quot;danger&quot;&gt;sonic-td&lt;/sonic-td&gt;
146
- &lt;/sonic-tr&gt;
147
- &lt;sonic-tr type=&quot;success&quot;&gt;
148
- &lt;sonic-td&gt;Attribute type set on&lt;/sonic-td&gt;
149
- &lt;sonic-td&gt;sonic-tr&lt;/sonic-td&gt;
150
- &lt;/sonic-tr&gt;
151
- &lt;/sonic-tbody&gt;
152
- &lt;/sonic-table&gt;
153
- </code></pre>
154
- <h2 id="colspan--rowspan">Colspan / rowspan</h2>
155
- <pre><code>&lt;sonic-table &gt;
156
- &lt;sonic-tbody&gt;
157
- &lt;sonic-tr&gt;
158
- &lt;sonic-td colspan=&quot;2&quot; class=&quot;bg-info text-neutral-0&quot;&gt;colspan : 2&lt;/sonic-td&gt;
159
- &lt;sonic-td&gt;cell&lt;/sonic-td&gt;
160
- &lt;/sonic-tr&gt;
161
- &lt;sonic-tr&gt;
162
- &lt;sonic-td&gt;cell&lt;/sonic-td&gt;
163
- &lt;sonic-td&gt;cell&lt;/sonic-td&gt;
164
- &lt;sonic-td rowspan=&quot;2&quot; class=&quot;bg-success text-neutral-0&quot;&gt;rowspan : 2&lt;/sonic-td&gt;
165
- &lt;/sonic-tr&gt;
166
- &lt;sonic-tr&gt;
167
- &lt;sonic-td&gt;cell&lt;/sonic-td&gt;
168
- &lt;sonic-td&gt;cell&lt;/sonic-td&gt;
169
- &lt;/sonic-tr&gt;
170
- &lt;/sonic-tbody&gt;
171
- &lt;/sonic-table&gt;
172
- </code></pre>
173
- <h2 id="cell-style-attributes">Cell style attributes</h2>
174
- <p>The following attributes will be used to set the style of the component : </p>
175
- <ul>
176
- <li>align</li>
177
- <li>minWidth</li>
178
- <li>maxWidth</li>
179
- <li>width</li>
180
- </ul>
181
- <pre><code>&lt;sonic-table bordered&gt;
182
- &lt;sonic-thead&gt;
183
- &lt;sonic-tr&gt;
184
- &lt;sonic-th width=&quot;7rem&quot;&gt;align&lt;/sonic-th&gt;
185
- &lt;sonic-th minWidth=&quot;20rem&quot;&gt;minWidth&lt;/sonic-th&gt;
186
- &lt;sonic-th&gt;maxWidth&lt;/sonic-th&gt;
187
- &lt;sonic-th&gt;width&lt;/sonic-th&gt;
188
- &lt;/sonic-tr&gt;
189
- &lt;/sonic-thead&gt;
190
- &lt;sonic-tbody&gt;
191
- &lt;sonic-tr&gt;
192
- &lt;sonic-td align=&quot;left&quot;&gt;Left&lt;/sonic-td&gt;
193
- &lt;sonic-td&gt;20rem&lt;/sonic-td&gt;
194
- &lt;sonic-td&gt;5rem&lt;/sonic-td&gt;
195
- &lt;sonic-td&gt;15rem&lt;/sonic-td&gt;
196
- &lt;/sonic-tr&gt;
197
- &lt;sonic-tr&gt;
198
- &lt;sonic-td align=&quot;center&quot;&gt;center&lt;/sonic-td&gt;
199
- &lt;sonic-td&gt;20rem&lt;/sonic-td&gt;
200
- &lt;sonic-td maxWidth=&quot;5rem&quot;&gt;5rem&lt;/sonic-td&gt;
201
- &lt;sonic-td&gt;15rem&lt;/sonic-td&gt;
202
- &lt;/sonic-tr&gt;
203
- &lt;sonic-tr&gt;
204
- &lt;sonic-td align=&quot;right&quot;&gt;right&lt;/sonic-td&gt;
205
- &lt;sonic-td&gt;20rem&lt;/sonic-td&gt;
206
- &lt;sonic-td&gt;5rem - Lorem ipsum dolor&lt;/sonic-td&gt;
207
- &lt;sonic-td width=&quot;60rem&quot;&gt;15rem - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam porta sollicitudin mollis. Curabitur sit amet nibh diam. Vivamus a pharetra mauris.&lt;/sonic-td&gt;
208
- &lt;/sonic-tr&gt;
209
- &lt;/sonic-table&gt;
210
- </code></pre>
211
- <h2 id="responsive">Responsive</h2>
212
- <p>Every table is responsive by default</p>
213
- <pre><code>&lt;sonic-table bordered&gt;
214
- &lt;sonic-thead&gt;
215
- &lt;sonic-tr&gt;
216
- &lt;sonic-th&gt;Id&lt;/sonic-th&gt;
217
- &lt;sonic-th&gt;Name&lt;/sonic-th&gt;
218
- &lt;sonic-th&gt;Email&lt;/sonic-th&gt;
219
- &lt;sonic-th&gt;Comment&lt;/sonic-th&gt;
220
- &lt;/sonic-tr&gt;
221
- &lt;/sonic-thead&gt;
222
- &lt;sonic-tbody&gt;
223
- &lt;sonic-list fetch serviceURL=&quot;/docs-mock-api&quot; dataProvider=&quot;api/users&quot; key=&quot;data&quot; displayContents&gt;
224
- &lt;template&gt;
225
- &lt;sonic-tr&gt;
226
- &lt;sonic-td data-bind ::inner-html=&quot;$id&quot;&gt;&lt;/sonic-td&gt;
227
- &lt;sonic-td minWidth=&quot;10rem&quot; data-bind ::inner-html=&quot;$first_name &lt;b&gt;$last_name&lt;/b&gt;&quot;&gt;&lt;/sonic-td&gt;
228
- &lt;sonic-td data-bind ::inner-html=&quot;$email&quot;&gt;&lt;/sonic-td&gt;
229
- &lt;sonic-td minWidth=&quot;40rem&quot;&gt;
230
- hasellus suscipit vulputate lacus, in tempor turpis aliquam vel. Nunc eleifend, velit id ultrices elementum, ipsum felis porttitor dui, id laoreet diam nulla sed urna.
231
- &lt;/sonic-td&gt;
232
- &lt;/sonic-tr&gt;
233
- </code></pre>
234
- <h2 id="sticky-header">Sticky header</h2>
235
- <pre><code>&lt;sonic-table bordered noCustomScroll&gt;
236
- &lt;sonic-thead class=&quot;sticky top-16&quot;&gt;
237
- &lt;sonic-tr&gt;
238
- &lt;sonic-th minWidth=&quot;max(20ch,12rem)&quot;&gt;Company&lt;/sonic-th&gt;
239
- &lt;sonic-th type=&quot;success&quot;&gt;Contact&lt;/sonic-th&gt;
240
- &lt;sonic-th&gt;Country&lt;/sonic-th&gt;
241
- &lt;sonic-th align=&quot;center&quot;&gt;Quantity&lt;/sonic-th&gt;
242
- &lt;sonic-th align=&quot;right&quot;&gt;Price&lt;/sonic-th&gt;
243
- &lt;sonic-th&gt;&lt;/sonic-th&gt;
244
- &lt;/sonic-tr&gt;
245
- &lt;/sonic-thead&gt;
246
- &lt;sonic-tbody&gt;
247
- &lt;sonic-tr&gt;
248
- &lt;sonic-td&gt;Alfreds Futterkiste&lt;/sonic-td&gt;
249
- &lt;sonic-td&gt;Maria Anders&lt;/sonic-td&gt;
250
- &lt;sonic-td&gt;Germany&lt;/sonic-td&gt;
251
- &lt;sonic-td align=&quot;center&quot;&gt;2&lt;/sonic-td&gt;
252
- &lt;sonic-td align=&quot;right&quot;&gt;40€&lt;/sonic-td&gt;
253
- &lt;sonic-td td align=&quot;right&quot;
254
- &gt;&lt;sonic-button shape=&quot;circle&quot; variant=&quot;outline&quot; size=&quot;sm&quot;&gt;
255
- &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;edit-pencil&quot; size=&quot;lg&quot;&gt;&lt;/sonic-icon
256
- &gt;&lt;/sonic-button&gt;
257
- &lt;/sonic-td&gt;
258
- &lt;/sonic-tr&gt;
259
- &lt;sonic-tr&gt;
260
- &lt;sonic-td&gt;Centro comercial Moctezuma&lt;/sonic-td&gt;
261
- &lt;sonic-td
262
- colspan=&quot;2&quot;
263
- align=&quot;center&quot;
264
- class=&quot;
265
- text-center
266
- text-neutral-400
267
- &quot;
268
- &gt;no information yet&lt;/sonic-td
269
- &gt;
270
- &lt;sonic-td align=&quot;center&quot;&gt;3&lt;/sonic-td&gt;
271
- &lt;sonic-td align=&quot;right&quot;&gt;40€&lt;/sonic-td&gt;
272
- &lt;sonic-td td align=&quot;right&quot;
273
- &gt;&lt;sonic-button shape=&quot;circle&quot; variant=&quot;outline&quot; size=&quot;sm&quot;&gt;
274
- &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;edit-pencil&quot; size=&quot;lg&quot;&gt;&lt;/sonic-icon
275
- &gt;&lt;/sonic-button&gt;
276
- &lt;/sonic-td&gt;
277
- &lt;/sonic-tr&gt;
278
- &lt;sonic-tr&gt;
279
- &lt;sonic-td&gt;Ernst Handel&lt;/sonic-td&gt;
280
- &lt;sonic-td&gt;Roland Mendel&lt;/sonic-td&gt;
281
- &lt;sonic-td&gt;Austria&lt;/sonic-td&gt;
282
- &lt;sonic-td align=&quot;center&quot;&gt;4&lt;/sonic-td&gt;
283
- &lt;sonic-td align=&quot;right&quot;&gt;40€&lt;/sonic-td&gt;
284
- &lt;sonic-td td align=&quot;right&quot;
285
- &gt;&lt;sonic-button shape=&quot;circle&quot; variant=&quot;outline&quot; size=&quot;sm&quot;&gt;
286
- &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;edit-pencil&quot; size=&quot;lg&quot;&gt;&lt;/sonic-icon
287
- &gt;&lt;/sonic-button&gt;
288
- &lt;/sonic-td&gt;
289
- &lt;/sonic-tr&gt;
290
- &lt;sonic-tr&gt;
291
- &lt;sonic-td&gt;Island Trading&lt;/sonic-td&gt;
292
- &lt;sonic-td&gt;Helen Bennett&lt;/sonic-td&gt;
293
- &lt;sonic-td&gt;UK&lt;/sonic-td&gt;
294
- &lt;sonic-td align=&quot;center&quot;&gt;1&lt;/sonic-td&gt;
295
- &lt;sonic-td align=&quot;right&quot;&gt;40€&lt;/sonic-td&gt;
296
- &lt;sonic-td td align=&quot;right&quot;
297
- &gt;&lt;sonic-button shape=&quot;circle&quot; variant=&quot;outline&quot; size=&quot;sm&quot;&gt;
298
- &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;edit-pencil&quot; size=&quot;lg&quot;&gt;&lt;/sonic-icon
299
- &gt;&lt;/sonic-button&gt;
300
- &lt;/sonic-td&gt;
301
- &lt;/sonic-tr&gt;
302
- &lt;sonic-tr type=&quot;warning&quot;&gt;
303
- &lt;sonic-td&gt;Laughing Bacchus Winecellars&lt;/sonic-td&gt;
304
- &lt;sonic-td&gt;Yoshi Tannamuri&lt;/sonic-td&gt;
305
- &lt;sonic-td&gt;Canada&lt;/sonic-td&gt;
306
- &lt;sonic-td align=&quot;center&quot;&gt;0&lt;/sonic-td&gt;
307
- &lt;sonic-td align=&quot;right&quot;&gt;40€&lt;/sonic-td&gt;
308
- &lt;sonic-td td align=&quot;right&quot;
309
- &gt;&lt;sonic-button shape=&quot;circle&quot; variant=&quot;outline&quot; size=&quot;sm&quot;&gt;
310
- &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;edit-pencil&quot; size=&quot;lg&quot;&gt;&lt;/sonic-icon
311
- &gt;&lt;/sonic-button&gt;
312
- &lt;/sonic-td&gt;
313
- &lt;/sonic-tr&gt;
314
- &lt;sonic-tr&gt;
315
- &lt;sonic-td&gt;Magazzini Alimentari Riuniti&lt;/sonic-td&gt;
316
- &lt;sonic-td&gt;Giovanni Rovelli&lt;/sonic-td&gt;
317
- &lt;sonic-td type=&quot;danger&quot;&gt;Italy&lt;/sonic-td&gt;
318
- &lt;sonic-td align=&quot;center&quot;&gt;20&lt;/sonic-td&gt;
319
- &lt;sonic-td align=&quot;right&quot;&gt;40€&lt;/sonic-td&gt;
320
- &lt;sonic-td td align=&quot;right&quot;
321
- &gt;&lt;sonic-button shape=&quot;circle&quot; variant=&quot;outline&quot; size=&quot;sm&quot;&gt;
322
- &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;edit-pencil&quot; size=&quot;lg&quot;&gt;&lt;/sonic-icon
323
- &gt;&lt;/sonic-button&gt;
324
- &lt;/sonic-td&gt;
325
- &lt;/sonic-tr&gt;
326
- &lt;sonic-tr&gt;
327
- &lt;sonic-td&gt;Alfreds Futterkiste&lt;/sonic-td&gt;
328
- &lt;sonic-td&gt;Maria Anders&lt;/sonic-td&gt;
329
- &lt;sonic-td&gt;Germany&lt;/sonic-td&gt;
330
- &lt;sonic-td align=&quot;center&quot;&gt;2&lt;/sonic-td&gt;
331
- &lt;sonic-td align=&quot;right&quot;&gt;40€&lt;/sonic-td&gt;
332
- &lt;sonic-td td align=&quot;right&quot;
333
- &gt;&lt;sonic-button shape=&quot;circle&quot; variant=&quot;outline&quot; size=&quot;sm&quot;&gt;
334
- &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;edit-pencil&quot; size=&quot;lg&quot;&gt;&lt;/sonic-icon
335
- &gt;&lt;/sonic-button&gt;
336
- &lt;/sonic-td&gt;
337
- &lt;/sonic-tr&gt;
338
- &lt;sonic-tr&gt;
339
- &lt;sonic-td&gt;Centro comercial Moctezuma&lt;/sonic-td&gt;
340
- &lt;sonic-td
341
- colspan=&quot;2&quot;
342
- align=&quot;center&quot;
343
- class=&quot;
344
- text-center
345
- text-neutral-400
346
- &quot;
347
- &gt;no information yet&lt;/sonic-td
348
- &gt;
349
- &lt;sonic-td align=&quot;center&quot;&gt;3&lt;/sonic-td&gt;
350
- &lt;sonic-td align=&quot;right&quot;&gt;40€&lt;/sonic-td&gt;
351
- &lt;sonic-td td align=&quot;right&quot;
352
- &gt;&lt;sonic-button shape=&quot;circle&quot; variant=&quot;outline&quot; size=&quot;sm&quot;&gt;
353
- &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;edit-pencil&quot; size=&quot;lg&quot;&gt;&lt;/sonic-icon
354
- &gt;&lt;/sonic-button&gt;
355
- &lt;/sonic-td&gt;
356
- &lt;/sonic-tr&gt;
357
- &lt;sonic-tr&gt;
358
- &lt;sonic-td&gt;Ernst Handel&lt;/sonic-td&gt;
359
- &lt;sonic-td&gt;Roland Mendel&lt;/sonic-td&gt;
360
- &lt;sonic-td&gt;Austria&lt;/sonic-td&gt;
361
- &lt;sonic-td align=&quot;center&quot;&gt;4&lt;/sonic-td&gt;
362
- &lt;sonic-td align=&quot;right&quot;&gt;40€&lt;/sonic-td&gt;
363
- &lt;sonic-td td align=&quot;right&quot;
364
- &gt;&lt;sonic-button shape=&quot;circle&quot; variant=&quot;outline&quot; size=&quot;sm&quot;&gt;
365
- &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;edit-pencil&quot; size=&quot;lg&quot;&gt;&lt;/sonic-icon
366
- &gt;&lt;/sonic-button&gt;
367
- &lt;/sonic-td&gt;
368
- &lt;/sonic-tr&gt;
369
- &lt;sonic-tr&gt;
370
- &lt;sonic-td&gt;Island Trading&lt;/sonic-td&gt;
371
- &lt;sonic-td&gt;Helen Bennett&lt;/sonic-td&gt;
372
- &lt;sonic-td&gt;UK&lt;/sonic-td&gt;
373
- &lt;sonic-td align=&quot;center&quot;&gt;1&lt;/sonic-td&gt;
374
- &lt;sonic-td align=&quot;right&quot;&gt;40€&lt;/sonic-td&gt;
375
- &lt;sonic-td td align=&quot;right&quot;
376
- &gt;&lt;sonic-button shape=&quot;circle&quot; variant=&quot;outline&quot; size=&quot;sm&quot;&gt;
377
- &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;edit-pencil&quot; size=&quot;lg&quot;&gt;&lt;/sonic-icon
378
- &gt;&lt;/sonic-button&gt;
379
- &lt;/sonic-td&gt;
380
- &lt;/sonic-tr&gt;
381
- &lt;sonic-tr type=&quot;warning&quot;&gt;
382
- &lt;sonic-td&gt;Laughing Bacchus Winecellars&lt;/sonic-td&gt;
383
- &lt;sonic-td&gt;Yoshi Tannamuri&lt;/sonic-td&gt;
384
- &lt;sonic-td&gt;Canada&lt;/sonic-td&gt;
385
- &lt;sonic-td align=&quot;center&quot;&gt;0&lt;/sonic-td&gt;
386
- &lt;sonic-td align=&quot;right&quot;&gt;40€&lt;/sonic-td&gt;
387
- &lt;sonic-td td align=&quot;right&quot;
388
- &gt;&lt;sonic-button shape=&quot;circle&quot; variant=&quot;outline&quot; size=&quot;sm&quot;&gt;
389
- &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;edit-pencil&quot; size=&quot;lg&quot;&gt;&lt;/sonic-icon
390
- &gt;&lt;/sonic-button&gt;
391
- &lt;/sonic-td&gt;
392
- &lt;/sonic-tr&gt;
393
- &lt;sonic-tr&gt;
394
- &lt;sonic-td&gt;Magazzini Alimentari Riuniti&lt;/sonic-td&gt;
395
- &lt;sonic-td&gt;Giovanni Rovelli&lt;/sonic-td&gt;
396
- &lt;sonic-td&gt;Italy&lt;/sonic-td&gt;
397
- &lt;sonic-td align=&quot;center&quot;&gt;20&lt;/sonic-td&gt;
398
- &lt;sonic-td align=&quot;right&quot;&gt;40€&lt;/sonic-td&gt;
399
- &lt;sonic-td td align=&quot;right&quot;
400
- &gt;&lt;sonic-button shape=&quot;circle&quot; variant=&quot;outline&quot; size=&quot;sm&quot;&gt;
401
- &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;edit-pencil&quot; size=&quot;lg&quot;&gt;&lt;/sonic-icon
402
- &gt;&lt;/sonic-button&gt;
403
- &lt;/sonic-td&gt;
404
- &lt;/sonic-tr&gt;
405
- &lt;/sonic-tbody&gt;
406
- &lt;sonic-caption&gt;table caption&lt;/sonic-caption&gt;
407
- &lt;/sonic-table&gt;
408
- </code></pre>
409
-
410
- </article>
411
- </main>
412
- </body>
413
- </html>
package/docs/crawl/core/components/ui/toast/toast.html DELETED
@@ -1,122 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/ui/toast/toast.html" 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</title>
7
- <meta name="description" content="Afficher un toast">
8
- <meta name="keywords" content="Concorde, supersoniks, core/components/ui/toast/toast, toast, Toast, UI component, sonic-toast, web component, success, error, warning, info, preserve: true, dismissForever: true, id, ghost: true">
9
- <meta name="concorde-doc-id" content="core/components/ui/toast/toast">
10
- <link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/toast/toast.html">
11
- </head>
12
- <body>
13
- <header>
14
- <p><a href="../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/ui/toast/toast.md/toast" rel="nofollow">interactive version</a></p>
15
- </header>
16
- <main>
17
- <article>
18
- <p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Toast</strong>. Afficher un toast <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, success, error, warning, info, preserve: true, dismissForever: true, id, ghost: true. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/ui/toast/toast.html">https://concorde.supersoniks.org/crawl/core/components/ui/toast/toast.html</a>.</span></p>
19
- <h1 id="toast">Toast</h1>
20
- <h2 id="utilisation-de-base">Utilisation de base</h2>
21
- <pre><code>&lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Message de notification simple&#39; })&quot;&gt;
22
- Afficher un toast
23
- &lt;/sonic-button&gt;
24
- </code></pre>
25
- <h2 id="statut">Statut</h2>
26
- <p>Les statuts disponibles sont : <code>success</code>, <code>error</code>, <code>warning</code>, <code>info</code> ou vide (par défaut).</p>
27
- <pre><code>&lt;div class=&quot;flex flex-wrap gap-2&quot;&gt;
28
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Message par défaut&#39;, status: &#39;&#39; })&quot;&gt;
29
- Default
30
- &lt;/sonic-button&gt;
31
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Opération réussie !&#39;, status: &#39;success&#39; })&quot;&gt;
32
- Success
33
- &lt;/sonic-button&gt;
34
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Une erreur est survenue&#39;, status: &#39;error&#39; })&quot;&gt;
35
- Error
36
- &lt;/sonic-button&gt;
37
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Attention à ce point&#39;, status: &#39;warning&#39; })&quot;&gt;
38
- Warning
39
- &lt;/sonic-button&gt;
40
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Information importante&#39;, status: &#39;info&#39; })&quot;&gt;
41
- Info
42
- &lt;/sonic-button&gt;
43
- &lt;/div&gt;
44
- </code></pre>
45
- <h2 id="avec-titre">Avec titre</h2>
46
- <pre><code>&lt;div class=&quot;flex flex-wrap gap-2&quot;&gt;
47
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ title: &#39;Succès&#39;, text: &#39;Votre demande a été traitée avec succès.&#39;, status: &#39;success&#39; })&quot;&gt;
48
- Toast avec titre
49
- &lt;/sonic-button&gt;
50
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ title: &#39;Test&#39;, text: &#39;Une erreur est survenue lors du traitement.&#39;, status: &#39;error&#39; })&quot;&gt;
51
- Toast d&#39;erreur avec titre
52
- &lt;/sonic-button&gt;
53
- &lt;/div&gt;
54
- </code></pre>
55
- <h2 id="avec-contenu-html">Avec contenu HTML</h2>
56
- <p>Le contenu du toast peut contenir du HTML.</p>
57
- <pre><code>&lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Message avec &lt;strong&gt;HTML&lt;/strong&gt; et un &lt;a href=&amp;quot;#&amp;quot;&gt;lien cliquable&lt;/a&gt;&#39;, status: &#39;info&#39; })&quot;&gt;
58
- Toast avec HTML
59
- &lt;/sonic-button&gt;
60
- </code></pre>
61
- <h2 id="persistance">Persistance</h2>
62
- <p>Par défaut, les toasts disparaissent automatiquement. Avec <code>preserve: true</code>, le toast reste affiché jusqu&#39;à ce qu&#39;il soit fermé manuellement.</p>
63
- <pre><code>&lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Ce toast ne disparaîtra pas automatiquement&#39;, status: &#39;info&#39;, preserve: true })&quot;&gt;
64
- Toast persistant
65
- &lt;/sonic-button&gt;
66
- </code></pre>
67
- <h2 id="masquer-définitivement">Masquer définitivement</h2>
68
- <p>Avec <code>dismissForever: true</code> et un <code>id</code>, le toast peut être masqué définitivement. Une fois fermé, il ne réapparaîtra plus même après rechargement de la page.</p>
69
- <pre><code>&lt;sonic-button onclick=&quot;window.SonicToast.add({ id: &#39;unique-toast-id&#39;, text: &#39;Ce toast peut être masqué définitivement&#39;, status: &#39;info&#39;, dismissForever: true })&quot;&gt;
70
- Toast avec dismiss forever
71
- &lt;/sonic-button&gt;
72
- </code></pre>
73
- <h2 id="fantôme">Fantôme</h2>
74
- <p>Avec <code>ghost: true</code>, le toast devient semi-transparent et non-interactif.</p>
75
- <pre><code>&lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Toast fantôme (semi-transparent)&#39;, status: &#39;info&#39;, ghost: true })&quot;&gt;
76
- Toast ghost
77
- &lt;/sonic-button&gt;
78
- </code></pre>
79
- <h2 id="méthodes-de-suppression">Méthodes de suppression</h2>
80
- <h3 id="tout-supprimer">Tout supprimer</h3>
81
- <p>Supprime tous les toasts sauf ceux marqués comme <code>ghost</code>.</p>
82
- <pre><code>&lt;div class=&quot;flex flex-wrap gap-2&quot;&gt;
83
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Toast 1&#39;, status: &#39;info&#39; })&quot;&gt;Ajouter toast 1&lt;/sonic-button&gt;
84
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Toast 2&#39;, status: &#39;success&#39; })&quot;&gt;Ajouter toast 2&lt;/sonic-button&gt;
85
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Toast 3&#39;, status: &#39;warning&#39; })&quot;&gt;Ajouter toast 3&lt;/sonic-button&gt;
86
- &lt;sonic-button onclick=&quot;window.SonicToast.removeAll()&quot;&gt;Supprimer tous&lt;/sonic-button&gt;
87
- &lt;/div&gt;
88
- </code></pre>
89
- <h3 id="supprimer-par-statut">Supprimer par statut</h3>
90
- <p>Supprime tous les toasts d&#39;un statut spécifique.</p>
91
- <pre><code>&lt;div class=&quot;flex flex-wrap gap-2&quot;&gt;
92
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Toast success&#39;, status: &#39;success&#39; })&quot;&gt;Success&lt;/sonic-button&gt;
93
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Toast error&#39;, status: &#39;error&#39; })&quot;&gt;Error&lt;/sonic-button&gt;
94
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Toast warning&#39;, status: &#39;warning&#39; })&quot;&gt;Warning&lt;/sonic-button&gt;
95
- &lt;sonic-button onclick=&quot;window.SonicToast.removeItemsByStatus(&#39;success&#39;)&quot;&gt;Supprimer success&lt;/sonic-button&gt;
96
- &lt;sonic-button onclick=&quot;window.SonicToast.removeItemsByStatus(&#39;error&#39;)&quot;&gt;Supprimer error&lt;/sonic-button&gt;
97
- &lt;/div&gt;
98
- </code></pre>
99
- <h3 id="supprimer-les-éléments-temporaires">Supprimer les éléments temporaires</h3>
100
- <p>Supprime tous les toasts qui ne sont pas marqués comme <code>preserve</code>.</p>
101
- <pre><code>&lt;div class=&quot;flex flex-wrap gap-2&quot;&gt;
102
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Toast temporaire&#39;, status: &#39;info&#39; })&quot;&gt;Temporaire&lt;/sonic-button&gt;
103
- &lt;sonic-button onclick=&quot;window.SonicToast.add({ text: &#39;Toast persistant&#39;, status: &#39;success&#39;, preserve: true })&quot;&gt;Persistant&lt;/sonic-button&gt;
104
- &lt;sonic-button onclick=&quot;window.SonicToast.removeTemporaryItems()&quot;&gt;Supprimer temporaires&lt;/sonic-button&gt;
105
- &lt;/div&gt;
106
- </code></pre>
107
- <h2 id="exemple-complet">Exemple complet</h2>
108
- <pre><code>&lt;sonic-button onclick=&quot;window.SonicToast.add({
109
- id: &#39;welcome-toast&#39;,
110
- title: &#39;Bienvenue&#39;,
111
- text: &#39;Bienvenue sur notre plateforme ! Vous pouvez commencer à explorer les fonctionnalités.&#39;,
112
- status: &#39;success&#39;,
113
- dismissForever: true
114
- })&quot;&gt;
115
- Toast complet
116
- &lt;/sonic-button&gt;
117
- </code></pre>
118
-
119
- </article>
120
- </main>
121
- </body>
122
- </html>
package/docs/crawl/core/components/ui/tooltip/tooltip.html DELETED
@@ -1,79 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="fr" data-crawl-url="https://concorde.supersoniks.org/crawl/core/components/ui/tooltip/tooltip.html" data-doc-id="core/components/ui/tooltip/tooltip">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Tooltip — Concorde</title>
7
- <meta name="description" content="By default, tooltip is centered next to its content">
8
- <meta name="keywords" content="Concorde, supersoniks, core/components/ui/tooltip/tooltip, tooltip, Tooltip, UI component, sonic-tooltip, web component">
9
- <meta name="concorde-doc-id" content="core/components/ui/tooltip/tooltip">
10
- <link rel="canonical" href="https://concorde.supersoniks.org/crawl/core/components/ui/tooltip/tooltip.html">
11
- </head>
12
- <body>
13
- <header>
14
- <p><a href="../../../../index.html">Concorde documentation (crawl)</a> · <a href="https://concorde.supersoniks.org/#core/components/ui/tooltip/tooltip.md/tooltip" rel="nofollow">interactive version</a></p>
15
- </header>
16
- <main>
17
- <article>
18
- <p class="doc-lead" id="doc-summary"><strong>Concorde UI component — Tooltip</strong>. By default, tooltip is centered next to its content <span>Doc ID: <code>core/components/ui/tooltip/tooltip</code>. Keywords: Concorde, supersoniks, core/components/ui/tooltip/tooltip, tooltip, Tooltip, UI component, sonic-tooltip, web component. URL: <a href="https://concorde.supersoniks.org/crawl/core/components/ui/tooltip/tooltip.html">https://concorde.supersoniks.org/crawl/core/components/ui/tooltip/tooltip.html</a>.</span></p>
19
- <h1 id="tooltip">Tooltip</h1>
20
- <pre><code>&lt;sonic-tooltip label=&quot;Tada : Text appears&quot;&gt;hover me&lt;/sonic-tooltip&gt;
21
- </code></pre>
22
- <h2 id="placement">Placement</h2>
23
- <p>By default, tooltip is centered next to its content</p>
24
- <pre><code>&lt;sonic-tooltip placement=&quot;top&quot; label=&quot;Top text&quot;&gt;
25
- &lt;sonic-button&gt;Top&lt;/sonic-button&gt;
26
- &lt;/sonic-tooltip&gt;
27
- &lt;sonic-tooltip placement=&quot;bottom&quot; label=&quot;Bottom text&quot;&gt;
28
- &lt;sonic-button&gt;Bottom&lt;/sonic-button&gt;
29
- &lt;/sonic-tooltip&gt;
30
- &lt;sonic-tooltip placement=&quot;right&quot; label=&quot;Right text&quot;&gt;
31
- &lt;sonic-button&gt;Right&lt;/sonic-button&gt;
32
- &lt;/sonic-tooltip&gt;
33
- &lt;sonic-tooltip placement=&quot;left&quot; label=&quot;Left text&quot;&gt;
34
- &lt;sonic-button&gt;Left&lt;/sonic-button&gt;
35
- &lt;/sonic-tooltip&gt;
36
- </code></pre>
37
- <h2 id="more-placement">More placement</h2>
38
- <pre><code>&lt;div class=&quot;flex gap-3 flex-wrap&quot;&gt;
39
- &lt;sonic-tooltip placement=&quot;top-start&quot; label=&quot;My tooltip&quot;&gt;
40
- &lt;sonic-button class=&quot;size-40 bg-neutral-200 rounded-lg&quot;&gt;Top start&lt;/sonic-button&gt;
41
- &lt;/sonic-tooltip&gt;
42
- &lt;sonic-tooltip placement=&quot;top-end&quot; label=&quot;My tooltip&quot;&gt;
43
- &lt;sonic-button class=&quot;size-40 bg-neutral-200 rounded-lg&quot;&gt;Top end&lt;/sonic-button&gt;
44
- &lt;/sonic-tooltip&gt;
45
- &lt;sonic-tooltip placement=&quot;bottom-start&quot; label=&quot;My tooltip&quot;&gt;
46
- &lt;sonic-button class=&quot;size-40 bg-neutral-200 rounded-lg&quot;&gt;Bottom start&lt;/sonic-button&gt;
47
- &lt;/sonic-tooltip&gt;
48
- &lt;sonic-tooltip placement=&quot;bottom-end&quot; label=&quot;My tooltip&quot;&gt;
49
- &lt;sonic-button class=&quot;size-40 bg-neutral-200 rounded-lg&quot;&gt;Bottom end&lt;/sonic-button&gt;
50
- &lt;/sonic-tooltip&gt;
51
- &lt;sonic-tooltip placement=&quot;right-start&quot; label=&quot;My tooltip&quot;&gt;
52
- &lt;sonic-button class=&quot;size-40 bg-neutral-200 rounded-lg&quot;&gt;Right start&lt;/sonic-button&gt;
53
- &lt;/sonic-tooltip&gt;
54
- &lt;sonic-tooltip placement=&quot;right-end&quot; label=&quot;My tooltip&quot;&gt;
55
- &lt;sonic-button class=&quot;size-40 bg-neutral-200 rounded-lg&quot;&gt;Right end&lt;/sonic-button&gt;
56
- &lt;/sonic-tooltip&gt;
57
- &lt;sonic-tooltip placement=&quot;left-start&quot; label=&quot;My tooltip&quot;&gt;
58
- &lt;sonic-button class=&quot;size-40 bg-neutral-200 rounded-lg&quot;&gt;Left start&lt;/sonic-button&gt;
59
- &lt;/sonic-tooltip&gt;
60
- &lt;sonic-tooltip placement=&quot;left-end&quot; label=&quot;My tooltip&quot;&gt;
61
- &lt;sonic-button class=&quot;size-40 bg-neutral-200 rounded-lg&quot;&gt;Left end&lt;/sonic-button&gt;
62
- &lt;/sonic-tooltip&gt;
63
- &lt;/div&gt;
64
- </code></pre>
65
- <h2 id="focusable">Focusable</h2>
66
- <pre><code>&lt;sonic-tooltip focusable label=&quot;The Concorde made its first transatlantic crossing on September 26, 1973&quot;&gt;
67
- &lt;sonic-icon library=&quot;iconoir&quot; name=&quot;chat-bubble-question&quot;&gt;&lt;/sonic-icon&gt; Focus or hover non interactive element
68
- &lt;/sonic-tooltip&gt;
69
- </code></pre>
70
- <h2 id="disabled">Disabled</h2>
71
- <pre><code>&lt;sonic-tooltip disabled label=&quot;Disabled text&quot;&gt;
72
- &lt;sonic-button&gt;Tooltip disabled&lt;/sonic-button&gt;
73
- &lt;/sonic-tooltip&gt;
74
- </code></pre>
75
-
76
- </article>
77
- </main>
78
- </body>
79
- </html>