@supersoniks/concorde 5.0.2 → 5.0.4

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 (266) hide show
  1. package/.github/workflows/ci.yml +21 -0
  2. package/.github-export-ignore +30 -0
  3. package/CONTRIBUTING.md +59 -0
  4. package/DEV.md +54 -0
  5. package/LICENSE +21 -0
  6. package/OPEN_SOURCE_CHECKPOINT.md +133 -0
  7. package/build-infos.json +1 -1
  8. package/concorde-core.bundle.js +66 -66
  9. package/concorde-core.es.js +1368 -1318
  10. package/dist/concorde-core.bundle.js +66 -66
  11. package/dist/concorde-core.es.js +1368 -1318
  12. package/docs/altcha-widget.js +2662 -0
  13. package/docs/assets/index-D8MVWqY6.js +12251 -0
  14. package/docs/assets/index-DiD0qYvE.css +1 -0
  15. package/docs/crawl/core/components/functional/date/date.html +190 -0
  16. package/docs/crawl/core/components/functional/fetch/fetch.html +109 -0
  17. package/docs/crawl/core/components/functional/if/if.html +27 -0
  18. package/docs/crawl/core/components/functional/jsonata/jsonata.html +79 -0
  19. package/docs/crawl/core/components/functional/list/list.html +70 -0
  20. package/docs/crawl/core/components/functional/mix/mix.html +45 -0
  21. package/docs/crawl/core/components/functional/queue/queue.html +96 -0
  22. package/docs/crawl/core/components/functional/router/router.html +106 -0
  23. package/docs/crawl/core/components/functional/sdui/sdui.html +269 -0
  24. package/docs/crawl/core/components/functional/states/states.html +66 -0
  25. package/docs/crawl/core/components/functional/submit/submit.html +160 -0
  26. package/docs/crawl/core/components/functional/subscriber/subscriber.html +67 -0
  27. package/docs/crawl/core/components/functional/value/value.html +51 -0
  28. package/docs/crawl/core/components/ui/alert/alert.html +110 -0
  29. package/docs/crawl/core/components/ui/alert-messages/alert-messages.html +23 -0
  30. package/docs/crawl/core/components/ui/badge/badge.html +119 -0
  31. package/docs/crawl/core/components/ui/button/button.html +149 -0
  32. package/docs/crawl/core/components/ui/captcha/captcha.html +30 -0
  33. package/docs/crawl/core/components/ui/card/card.html +99 -0
  34. package/docs/crawl/core/components/ui/divider/divider.html +58 -0
  35. package/docs/crawl/core/components/ui/form/checkbox/checkbox.html +73 -0
  36. package/docs/crawl/core/components/ui/form/fieldset/fieldset.html +135 -0
  37. package/docs/crawl/core/components/ui/form/form-actions/form-actions.html +79 -0
  38. package/docs/crawl/core/components/ui/form/form-layout/form-layout.html +62 -0
  39. package/docs/crawl/core/components/ui/form/input/input.html +109 -0
  40. package/docs/crawl/core/components/ui/form/input-autocomplete/input-autocomplete.html +38 -0
  41. package/docs/crawl/core/components/ui/form/radio/radio.html +56 -0
  42. package/docs/crawl/core/components/ui/form/select/select.html +73 -0
  43. package/docs/crawl/core/components/ui/form/switch/switch.html +56 -0
  44. package/docs/crawl/core/components/ui/form/textarea/textarea.html +59 -0
  45. package/docs/crawl/core/components/ui/group/group.html +82 -0
  46. package/docs/crawl/core/components/ui/icon/icon.html +133 -0
  47. package/docs/crawl/core/components/ui/image/image.html +110 -0
  48. package/docs/crawl/core/components/ui/link/link.html +42 -0
  49. package/docs/crawl/core/components/ui/loader/loader.html +50 -0
  50. package/docs/crawl/core/components/ui/menu/menu.html +322 -0
  51. package/docs/crawl/core/components/ui/modal/modal.html +117 -0
  52. package/docs/crawl/core/components/ui/pop/pop.html +102 -0
  53. package/docs/crawl/core/components/ui/progress/progress.html +58 -0
  54. package/docs/crawl/core/components/ui/table/table.html +413 -0
  55. package/docs/crawl/core/components/ui/toast/toast.html +122 -0
  56. package/docs/crawl/core/components/ui/tooltip/tooltip.html +79 -0
  57. package/docs/crawl/docs/_core-concept/dataFlow.html +177 -0
  58. package/docs/crawl/docs/_core-concept/overview.html +66 -0
  59. package/docs/crawl/docs/_core-concept/subscriber.html +75 -0
  60. package/docs/crawl/docs/_decorators/ancestor-attribute.html +116 -0
  61. package/docs/crawl/docs/_decorators/auto-subscribe.html +202 -0
  62. package/docs/crawl/docs/_decorators/bind.html +141 -0
  63. package/docs/crawl/docs/_decorators/get.html +149 -0
  64. package/docs/crawl/docs/_decorators/handle.html +165 -0
  65. package/docs/crawl/docs/_decorators/on-assign.html +355 -0
  66. package/docs/crawl/docs/_decorators/patch.html +78 -0
  67. package/docs/crawl/docs/_decorators/post.html +139 -0
  68. package/docs/crawl/docs/_decorators/publish.html +61 -0
  69. package/docs/crawl/docs/_decorators/put.html +78 -0
  70. package/docs/crawl/docs/_decorators/subscribe.html +109 -0
  71. package/docs/crawl/docs/_decorators/wait-for-ancestors.html +137 -0
  72. package/docs/crawl/docs/_directives/sub.html +93 -0
  73. package/docs/crawl/docs/_getting-started/ai-agents.html +173 -0
  74. package/docs/crawl/docs/_getting-started/concorde-manual-install.html +100 -0
  75. package/docs/crawl/docs/_getting-started/concorde-outside.html +58 -0
  76. package/docs/crawl/docs/_getting-started/create-a-component.html +111 -0
  77. package/docs/crawl/docs/_getting-started/my-first-component.html +189 -0
  78. package/docs/crawl/docs/_getting-started/my-first-subscriber.html +110 -0
  79. package/docs/crawl/docs/_getting-started/pubsub.html +62 -0
  80. package/docs/crawl/docs/_getting-started/start.html +76 -0
  81. package/docs/crawl/docs/_getting-started/theming.html +85 -0
  82. package/docs/crawl/docs/_misc/api-configuration.html +149 -0
  83. package/docs/crawl/docs/_misc/dataProviderKey.html +135 -0
  84. package/docs/crawl/docs/_misc/docs-mock-api.html +158 -0
  85. package/docs/crawl/docs/_misc/dynamic-path.html +180 -0
  86. package/docs/crawl/docs/_misc/endpoint.html +50 -0
  87. package/docs/crawl/docs/_misc/formelement-subscriber-removal.html +138 -0
  88. package/docs/crawl/docs/_misc/html-integration.html +48 -0
  89. package/docs/crawl/hubs/decorators.html +547 -0
  90. package/docs/crawl/hubs/form-components.html +359 -0
  91. package/docs/crawl/hubs/remote-data.html +452 -0
  92. package/docs/crawl/index.html +101 -0
  93. package/docs/css/docs.css +0 -0
  94. package/docs/docs-mock-api-sw.js +724 -0
  95. package/docs/docs-mock-api-sw.js.map +7 -0
  96. package/docs/fonts/ClashGrotesk-Bold.eot +0 -0
  97. package/docs/fonts/ClashGrotesk-Bold.ttf +0 -0
  98. package/docs/fonts/ClashGrotesk-Bold.woff +0 -0
  99. package/docs/fonts/ClashGrotesk-Bold.woff2 +0 -0
  100. package/docs/fonts/ClashGrotesk-Extralight.eot +0 -0
  101. package/docs/fonts/ClashGrotesk-Extralight.ttf +0 -0
  102. package/docs/fonts/ClashGrotesk-Extralight.woff +0 -0
  103. package/docs/fonts/ClashGrotesk-Extralight.woff2 +0 -0
  104. package/docs/fonts/ClashGrotesk-Light.eot +0 -0
  105. package/docs/fonts/ClashGrotesk-Light.ttf +0 -0
  106. package/docs/fonts/ClashGrotesk-Light.woff +0 -0
  107. package/docs/fonts/ClashGrotesk-Light.woff2 +0 -0
  108. package/docs/fonts/ClashGrotesk-Medium.eot +0 -0
  109. package/docs/fonts/ClashGrotesk-Medium.ttf +0 -0
  110. package/docs/fonts/ClashGrotesk-Medium.woff +0 -0
  111. package/docs/fonts/ClashGrotesk-Medium.woff2 +0 -0
  112. package/docs/fonts/ClashGrotesk-Regular.eot +0 -0
  113. package/docs/fonts/ClashGrotesk-Regular.ttf +0 -0
  114. package/docs/fonts/ClashGrotesk-Regular.woff +0 -0
  115. package/docs/fonts/ClashGrotesk-Regular.woff2 +0 -0
  116. package/docs/fonts/ClashGrotesk-Semibold.eot +0 -0
  117. package/docs/fonts/ClashGrotesk-Semibold.ttf +0 -0
  118. package/docs/fonts/ClashGrotesk-Semibold.woff +0 -0
  119. package/docs/fonts/ClashGrotesk-Semibold.woff2 +0 -0
  120. package/docs/fonts/ClashGrotesk-Variable.eot +0 -0
  121. package/docs/fonts/ClashGrotesk-Variable.ttf +0 -0
  122. package/docs/fonts/ClashGrotesk-Variable.woff +0 -0
  123. package/docs/fonts/ClashGrotesk-Variable.woff2 +0 -0
  124. package/docs/img/concorde-icon.svg +5 -0
  125. package/docs/img/concorde-logo.svg +1 -0
  126. package/docs/img/concorde.png +0 -0
  127. package/docs/img/concorde_def.png +0 -0
  128. package/docs/img/concorde_seuil.png.webp +0 -0
  129. package/docs/img/concorde_seuil_invert.png +0 -0
  130. package/docs/img/paul_metrand.jpg +0 -0
  131. package/docs/img/paul_metrand_xs.jpg +0 -0
  132. package/docs/index.html +93 -0
  133. package/docs/llms-full.txt +5761 -0
  134. package/docs/llms.txt +104 -0
  135. package/docs/robots.txt +16 -0
  136. package/docs/sitemap.xml +237 -0
  137. package/docs/src/core/components/functional/date/date.md +290 -0
  138. package/docs/src/core/components/functional/fetch/fetch.md +125 -0
  139. package/docs/src/core/components/functional/if/if.md +9 -0
  140. package/docs/src/core/components/functional/jsonata/jsonata.md +56 -0
  141. package/docs/src/core/components/functional/list/list.md +65 -0
  142. package/docs/src/core/components/functional/mix/mix.md +41 -0
  143. package/docs/src/core/components/functional/queue/queue.md +72 -0
  144. package/docs/src/core/components/functional/router/router.md +94 -0
  145. package/docs/src/core/components/functional/sdui/default-library.json +108 -0
  146. package/docs/src/core/components/functional/sdui/example.json +99 -0
  147. package/docs/src/core/components/functional/sdui/sdui.md +356 -0
  148. package/docs/src/core/components/functional/states/states.md +87 -0
  149. package/docs/src/core/components/functional/submit/submit.md +114 -0
  150. package/docs/src/core/components/functional/subscriber/subscriber.md +91 -0
  151. package/docs/src/core/components/functional/value/value.md +35 -0
  152. package/docs/src/core/components/ui/alert/alert.md +121 -0
  153. package/docs/src/core/components/ui/alert-messages/alert-messages.md +0 -0
  154. package/docs/src/core/components/ui/badge/badge.md +127 -0
  155. package/docs/src/core/components/ui/button/button.md +182 -0
  156. package/docs/src/core/components/ui/captcha/captcha.md +12 -0
  157. package/docs/src/core/components/ui/card/card.md +97 -0
  158. package/docs/src/core/components/ui/divider/divider.md +35 -0
  159. package/docs/src/core/components/ui/form/checkbox/checkbox.md +77 -0
  160. package/docs/src/core/components/ui/form/fieldset/fieldset.md +129 -0
  161. package/docs/src/core/components/ui/form/form-actions/form-actions.md +77 -0
  162. package/docs/src/core/components/ui/form/form-layout/form-layout.md +44 -0
  163. package/docs/src/core/components/ui/form/input/input.md +142 -0
  164. package/docs/src/core/components/ui/form/input-autocomplete/input-autocomplete.md +29 -0
  165. package/docs/src/core/components/ui/form/radio/radio.md +57 -0
  166. package/docs/src/core/components/ui/form/select/select.md +71 -0
  167. package/docs/src/core/components/ui/form/switch/switch.md +57 -0
  168. package/docs/src/core/components/ui/form/textarea/textarea.md +65 -0
  169. package/docs/src/core/components/ui/group/group.md +75 -0
  170. package/docs/src/core/components/ui/icon/icon.md +125 -0
  171. package/docs/src/core/components/ui/icon/icons.json +1 -0
  172. package/docs/src/core/components/ui/image/image.md +107 -0
  173. package/docs/src/core/components/ui/link/link.md +43 -0
  174. package/docs/src/core/components/ui/loader/loader.md +55 -0
  175. package/docs/src/core/components/ui/menu/menu.md +329 -0
  176. package/docs/src/core/components/ui/modal/modal.md +119 -0
  177. package/docs/src/core/components/ui/pop/pop.md +96 -0
  178. package/docs/src/core/components/ui/progress/progress.md +63 -0
  179. package/docs/src/core/components/ui/table/table.md +455 -0
  180. package/docs/src/core/components/ui/toast/toast.md +166 -0
  181. package/docs/src/core/components/ui/tooltip/tooltip.md +82 -0
  182. package/docs/src/docs/_core-concept/dataFlow.md +88 -0
  183. package/docs/src/docs/_core-concept/overview.md +57 -0
  184. package/docs/src/docs/_core-concept/subscriber.md +75 -0
  185. package/docs/src/docs/_decorators/ancestor-attribute.md +127 -0
  186. package/docs/src/docs/_decorators/auto-subscribe.md +202 -0
  187. package/docs/src/docs/_decorators/bind.md +167 -0
  188. package/docs/src/docs/_decorators/get.md +162 -0
  189. package/docs/src/docs/_decorators/handle.md +175 -0
  190. package/docs/src/docs/_decorators/on-assign.md +390 -0
  191. package/docs/src/docs/_decorators/patch.md +70 -0
  192. package/docs/src/docs/_decorators/post.md +146 -0
  193. package/docs/src/docs/_decorators/publish.md +55 -0
  194. package/docs/src/docs/_decorators/put.md +70 -0
  195. package/docs/src/docs/_decorators/subscribe.md +100 -0
  196. package/docs/src/docs/_decorators/wait-for-ancestors.md +163 -0
  197. package/docs/src/docs/_directives/sub.md +91 -0
  198. package/docs/src/docs/_getting-started/ai-agents.md +76 -0
  199. package/docs/src/docs/_getting-started/concorde-manual-install.md +133 -0
  200. package/docs/src/docs/_getting-started/concorde-outside.md +33 -0
  201. package/docs/src/docs/_getting-started/create-a-component.md +139 -0
  202. package/docs/src/docs/_getting-started/my-first-component.md +236 -0
  203. package/docs/src/docs/_getting-started/my-first-subscriber.md +120 -0
  204. package/docs/src/docs/_getting-started/pubsub.md +37 -0
  205. package/docs/src/docs/_getting-started/start.md +47 -0
  206. package/docs/src/docs/_getting-started/theming.md +91 -0
  207. package/docs/src/docs/_misc/api-configuration.md +81 -0
  208. package/docs/src/docs/_misc/dataProviderKey.md +168 -0
  209. package/docs/src/docs/_misc/docs-mock-api.md +63 -0
  210. package/docs/src/docs/_misc/dynamic-path.md +71 -0
  211. package/docs/src/docs/_misc/endpoint.md +45 -0
  212. package/docs/src/docs/_misc/formelement-subscriber-removal.md +115 -0
  213. package/docs/src/docs/_misc/html-integration.md +15 -0
  214. package/docs/src/docs/search/docs-search.json +9507 -0
  215. package/docs/src/tag-list.json +1 -0
  216. package/docs/src/tsconfig-model.json +23 -0
  217. package/docs/src/tsconfig.declarations.json +22 -0
  218. package/docs/src/tsconfig.emit.json +23 -0
  219. package/docs/src/tsconfig.json +1182 -0
  220. package/docs/svg/regular/plane.svg +1 -0
  221. package/docs/svg/solid/plane.svg +1 -0
  222. package/gitlab/job_github_mirror.sh +39 -0
  223. package/gitlab/job_tests.sh +0 -0
  224. package/package.json +1 -1
  225. package/scripts/github-export.mjs +150 -0
  226. package/scripts/post-build-docs.js +0 -0
  227. package/scripts/post-build.mjs +0 -0
  228. package/src/core/components/functional/fetch/fetch.md +0 -0
  229. package/src/core/components/functional/if/if.md +0 -0
  230. package/src/core/components/functional/list/list.demo.ts +0 -0
  231. package/src/core/components/functional/list/list.md +0 -0
  232. package/src/core/components/functional/router/router.md +0 -0
  233. package/src/core/components/functional/router/router.ts +0 -0
  234. package/src/core/components/functional/sdui/sdui.md +0 -0
  235. package/src/core/components/functional/states/states.md +0 -0
  236. package/src/core/components/functional/submit/submit.md +0 -0
  237. package/src/core/components/functional/subscriber/subscriber.ts +0 -0
  238. package/src/core/components/ui/_css/size.ts +0 -0
  239. package/src/core/components/ui/captcha/altchaStyles.ts +0 -0
  240. package/src/core/components/ui/captcha/captcha.md +0 -0
  241. package/src/core/components/ui/form/radio/radio.md +0 -0
  242. package/src/core/components/ui/form/select/select.md +0 -0
  243. package/src/core/components/ui/form/switch/switch.md +0 -0
  244. package/src/core/components/ui/loader/loader.md +0 -0
  245. package/src/core/components/ui/menu/menu.md +0 -0
  246. package/src/core/components/ui/modal/modal.md +0 -0
  247. package/src/core/components/ui/table/table-caption.ts +0 -0
  248. package/src/core/components/ui/table/table.md +0 -0
  249. package/src/core/decorators/subscriber/ancestorAttribute.spec.ts +26 -0
  250. package/src/core/decorators/subscriber/ancestorAttribute.ts +3 -4
  251. package/src/core/mixins/Subscriber.ts +0 -0
  252. package/src/core/utils/AncestorAttributeObserver.ts +183 -70
  253. package/src/core/utils/DataBindObserver.ts +0 -0
  254. package/src/core/utils/Objects.ts +0 -0
  255. package/src/core/utils/route.ts +0 -0
  256. package/src/css.d.ts +19 -0
  257. package/src/docs/_core-concept/subscriber.md +0 -0
  258. package/src/docs/_decorators/ancestor-attribute.md +3 -2
  259. package/src/docs/_getting-started/my-first-subscriber.md +0 -0
  260. package/src/docs/_getting-started/pubsub.md +0 -0
  261. package/src/docs/_getting-started/start.md +0 -0
  262. package/src/docs/example/users.ts +0 -0
  263. package/src/docs/search/page.ts +0 -0
  264. package/src/tsconfig.declarations.json +22 -0
  265. package/src/tsconfig.emit.json +23 -0
  266. package/src/tsconfig.tsbuildinfo +1 -1
package/docs/src/core/components/ui/pop/pop.md ADDED
@@ -0,0 +1,96 @@
1
+ # Pop
2
+
3
+ ## Placement
4
+ <sonic-code>
5
+ <template>
6
+ <sonic-pop class="inline-block" placement="left">
7
+ <sonic-button>Left</sonic-button>
8
+ <sonic-menu slot="content">
9
+ <sonic-menu-item><sonic-icon library="iconoir" name="bell-notification" slot="prefix"></sonic-icon>Notifications</sonic-menu-item>
10
+ </sonic-menu>
11
+ </sonic-pop>
12
+ <sonic-pop class="inline-block" placement="right">
13
+ <sonic-button>Right</sonic-button>
14
+ <sonic-menu slot="content">
15
+ <sonic-menu-item><sonic-icon library="iconoir" name="bell-notification" slot="prefix"></sonic-icon>Notifications</sonic-menu-item>
16
+ </sonic-menu>
17
+ </sonic-pop>
18
+ <sonic-pop class="inline-block" placement="top">
19
+ <sonic-button>Top</sonic-button>
20
+ <sonic-menu slot="content">
21
+ <sonic-menu-item><sonic-icon library="iconoir" name="bell-notification" slot="prefix"></sonic-icon>Notifications</sonic-menu-item>
22
+ </sonic-menu>
23
+ </sonic-pop>
24
+ <sonic-pop class="inline-block" placement="bottom">
25
+ <sonic-button>Bottom</sonic-button>
26
+ <sonic-menu slot="content">
27
+ <sonic-menu-item><sonic-icon library="iconoir" name="bell-notification" slot="prefix"></sonic-icon>Notifications</sonic-menu-item>
28
+ </sonic-menu>
29
+ </sonic-pop>
30
+ </template>
31
+ </sonic-code>
32
+
33
+ ## Shadow
34
+ <sonic-code>
35
+ <template>
36
+ <sonic-pop class="inline-block" shadow="none" placement='top' >
37
+ <sonic-button>None</sonic-button>
38
+ <sonic-menu slot="content">
39
+ <sonic-menu-item><sonic-icon library="iconoir" name="bell-notification" slot="prefix"></sonic-icon>Notifications</sonic-menu-item>
40
+ </sonic-menu>
41
+ </sonic-pop>
42
+ <sonic-pop class="inline-block" shadow="sm" placement='top'>
43
+ <sonic-button>Small</sonic-button>
44
+ <sonic-menu slot="content">
45
+ <sonic-menu-item><sonic-icon library="iconoir" name="bell-notification" slot="prefix"></sonic-icon>Notifications</sonic-menu-item>
46
+ </sonic-menu>
47
+ </sonic-pop>
48
+ <sonic-pop class="inline-block" shadow="md" placement='top'>
49
+ <sonic-button>Medium</sonic-button>
50
+ <sonic-menu slot="content">
51
+ <sonic-menu-item><sonic-icon library="iconoir" name="bell-notification" slot="prefix"></sonic-icon>Notifications</sonic-menu-item>
52
+ </sonic-menu>
53
+ </sonic-pop>
54
+ <sonic-pop class="inline-block" shadow="lg" placement='top'>
55
+ <sonic-button>Large</sonic-button>
56
+ <sonic-menu slot="content">
57
+ <sonic-menu-item><sonic-icon library="iconoir" name="bell-notification" slot="prefix"></sonic-icon>Notifications</sonic-menu-item>
58
+ </sonic-menu>
59
+ </sonic-pop>
60
+ </template>
61
+ </sonic-code>
62
+
63
+ ## noToggle
64
+ <sonic-code>
65
+ <template>
66
+ <sonic-pop class="inline-block" noToggle>
67
+ <sonic-button>No toggle on click</sonic-button>
68
+ <sonic-menu slot="content">
69
+ <sonic-menu-item><sonic-icon library="iconoir" name="bell-notification" slot="prefix"></sonic-icon>Notifications</sonic-menu-item>
70
+ </sonic-menu>
71
+ </sonic-pop>
72
+ <sonic-pop class="inline-block" >
73
+ <sonic-button>Default toggle on click</sonic-button>
74
+ <sonic-menu slot="content">
75
+ <sonic-menu-item><sonic-icon library="iconoir" name="bell-notification" slot="prefix"></sonic-icon>Notifications</sonic-menu-item>
76
+ </sonic-menu>
77
+ </sonic-pop>
78
+ </template>
79
+ </sonic-code>
80
+
81
+
82
+ ## manual
83
+ <sonic-code>
84
+ <template>
85
+ <sonic-pop class="inline-block" manual id="manualPop">
86
+ <sonic-button onclick="alert('customAction without opening Pop content')">Manual doesn't open on click</sonic-button>
87
+ <sonic-menu slot="content">
88
+ <sonic-menu-item>Hourra !</sonic-menu-item>
89
+ </sonic-menu>
90
+ </sonic-pop>
91
+ <sonic-button onclick="document.getElementById('manualPop').show()" class="ml-5" variant="outline">
92
+ <sonic-icon name="sparkles" library="custom"></sonic-icon>
93
+ Click to open pop
94
+ </sonic-button>
95
+ </template>
96
+ </sonic-code>
package/docs/src/core/components/ui/progress/progress.md ADDED
@@ -0,0 +1,63 @@
1
+ # Progress bar
2
+
3
+ Displays an indicator showing the completion progress of a task.
4
+
5
+ ## Indeterminate
6
+
7
+ <sonic-code>
8
+ <template>
9
+ <sonic-progress></sonic-progress>
10
+ </template>
11
+ </sonic-code>
12
+
13
+
14
+ ## Remaining
15
+
16
+ <sonic-code>
17
+ <template>
18
+ <sonic-progress type="danger" value="80">
19
+ 80% Used <span slot="remaining">20% left</span>
20
+ </sonic-progress>
21
+ </template>
22
+ </sonic-code>
23
+
24
+ ## Sizes
25
+
26
+ <sonic-code>
27
+ <template>
28
+ <div class="grid gap-3">
29
+ <sonic-progress size="2xs" value="25">25%</sonic-progress>
30
+ <sonic-progress size="xs" value="25">25%</sonic-progress>
31
+ <sonic-progress size="sm" value="25">25%</sonic-progress>
32
+ <sonic-progress size="md" value="25">25%</sonic-progress>
33
+ <sonic-progress size="lg" value="25">25%</sonic-progress>
34
+ <sonic-progress size="xl" value="25">25%</sonic-progress>
35
+ <sonic-progress size="2xl" value="25">25%</sonic-progress>
36
+ </div>
37
+ </template>
38
+ </sonic-code>
39
+
40
+ ## Type
41
+
42
+ <sonic-code>
43
+ <template>
44
+ <div class="grid gap-3">
45
+ <sonic-progress value="50">50%</sonic-progress>
46
+ <sonic-progress type="info" value="50">50%</sonic-progress>
47
+ <sonic-progress type="warning" value="50">50%</sonic-progress>
48
+ <sonic-progress type="success" value="50">50%</sonic-progress>
49
+ <sonic-progress type="danger" value="50">50%</sonic-progress>
50
+ </div>
51
+ </template>
52
+ </sonic-code>
53
+
54
+
55
+ ## Invert
56
+
57
+ <sonic-code>
58
+ <template>
59
+ <div class="bg-neutral-900 p-4 rounded-md">
60
+ <sonic-progress type="invert" value="50">50%</sonic-progress>
61
+ </div>
62
+ </template>
63
+ </sonic-code>
package/docs/src/core/components/ui/table/table.md ADDED
@@ -0,0 +1,455 @@
1
+ # Table
2
+
3
+ ## Basic usage
4
+
5
+ <sonic-code>
6
+ <template>
7
+ <sonic-table>
8
+ <sonic-tr>
9
+ <sonic-th>Id</sonic-th>
10
+ <sonic-th>Name</sonic-th>
11
+ <sonic-th>Email</sonic-th>
12
+ </sonic-tr>
13
+ <sonic-tr>
14
+ <sonic-td>1</sonic-td>
15
+ <sonic-td>George Bluth</sonic-td>
16
+ <sonic-td>george.bluth@reqres.in</sonic-td>
17
+ </sonic-tr>
18
+ <sonic-tr>
19
+ <sonic-td>2</sonic-td>
20
+ <sonic-td>Janet Weaver</sonic-td>
21
+ <sonic-td>janet.weaver@reqres.in</sonic-td>
22
+ </sonic-tr>
23
+ <sonic-tr>
24
+ <sonic-td>3</sonic-td>
25
+ <sonic-td>Emma Wong</sonic-td>
26
+ <sonic-td>emma.wong@reqres.in</sonic-td>
27
+ </sonic-tr>
28
+ </sonic-table>
29
+ </template>
30
+ </sonic-code>
31
+
32
+ ## List / fetch
33
+
34
+ <sonic-code>
35
+ <template>
36
+ <sonic-table>
37
+ <sonic-thead>
38
+ <sonic-tr>
39
+ <sonic-th>Id</sonic-th>
40
+ <sonic-th>Name</sonic-th>
41
+ <sonic-th>Email</sonic-th>
42
+ </sonic-tr>
43
+ </sonic-thead>
44
+ <sonic-tbody>
45
+ <sonic-list debug fetch serviceURL="/docs-mock-api" dataProvider="api/users" key="data" displayContents>
46
+ <template>
47
+ <sonic-tr>
48
+ <sonic-td data-bind ::inner-html="$id"></sonic-td>
49
+ <sonic-td data-bind ::inner-html="$first_name <b>$last_name</b>"></sonic-td>
50
+ <sonic-td data-bind ::inner-html="$email"></sonic-td>
51
+ </sonic-tr>
52
+ </template>
53
+ <sonic-list>
54
+ </sonic-tbody>
55
+ </sonic-table>
56
+ </template>
57
+ </sonic-code>
58
+
59
+ ## Size
60
+
61
+ <sonic-code>
62
+ <template>
63
+ <div class="grid grid-cols-4 gap-3">
64
+ <sonic-table size="2xs" bordered>
65
+ <sonic-tr><sonic-td class="w-[5rem]">2xs</sonic-td></sonic-tr>
66
+ </sonic-table>
67
+ <sonic-table size="xs" bordered>
68
+ <sonic-tr><sonic-td class="w-[5rem]">xs</sonic-td></sonic-tr>
69
+ </sonic-table>
70
+ <sonic-table size="sm" bordered>
71
+ <sonic-tr><sonic-td class="w-[5rem]">sm</sonic-td></sonic-tr>
72
+ </sonic-table>
73
+ <sonic-table size="md" bordered>
74
+ <sonic-tr><sonic-td class="w-[5rem]">md</sonic-td></sonic-tr>
75
+ </sonic-table>
76
+ <sonic-table bordered>
77
+ <sonic-tr><sonic-td class="w-[5rem]">default</sonic-td></sonic-tr>
78
+ </sonic-table>
79
+ <sonic-table size="lg" bordered>
80
+ <sonic-tr><sonic-td class="w-[5rem]">lg</sonic-td></sonic-tr>
81
+ </sonic-table>
82
+ <sonic-table size="xl" bordered>
83
+ <sonic-tr><sonic-td class="w-[5rem]">xl</sonic-td></sonic-tr>
84
+ </sonic-table>
85
+ <sonic-table size="2xl" bordered>
86
+ <sonic-tr><sonic-td class="w-[5rem]">2xl</sonic-td></sonic-tr>
87
+ </sonic-table>
88
+ </div>
89
+ </template>
90
+ </sonic-code>
91
+
92
+ ## Bordered
93
+
94
+ <sonic-code>
95
+ <template>
96
+ <sonic-table bordered>
97
+ <sonic-thead>
98
+ <sonic-tr>
99
+ <sonic-th>Id</sonic-th>
100
+ <sonic-th>Name</sonic-th>
101
+ <sonic-th>Email</sonic-th>
102
+ </sonic-tr>
103
+ </sonic-thead>
104
+ <sonic-tbody>
105
+ <sonic-tr>
106
+ <sonic-td>1</sonic-td>
107
+ <sonic-td>George Bluth</sonic-td>
108
+ <sonic-td>george.bluth@reqres.in</sonic-td>
109
+ </sonic-tr>
110
+ <sonic-tr>
111
+ <sonic-td>2</sonic-td>
112
+ <sonic-td>Janet Weaver</sonic-td>
113
+ <sonic-td>janet.weaver@reqres.in</sonic-td>
114
+ </sonic-tr>
115
+ <sonic-tr>
116
+ <sonic-td>3</sonic-td>
117
+ <sonic-td>Emma Wong</sonic-td>
118
+ <sonic-td>emma.wong@reqres.in</sonic-td>
119
+ </sonic-tr>
120
+ </sonic-tbody>
121
+ </sonic-table>
122
+ </template>
123
+ </sonic-code>
124
+
125
+ ## MaxHeight
126
+
127
+ <sonic-code>
128
+ <template>
129
+ <sonic-table maxHeight="8rem">
130
+ <sonic-thead>
131
+ <sonic-tr>
132
+ <sonic-th>Id</sonic-th>
133
+ <sonic-th>Name</sonic-th>
134
+ <sonic-th>Email</sonic-th>
135
+ </sonic-tr>
136
+ </sonic-thead>
137
+ <sonic-tbody>
138
+ <sonic-list fetch serviceURL="/docs-mock-api" dataProvider="api/users" key="data" displayContents>
139
+ <template>
140
+ <sonic-tr>
141
+ <sonic-td data-bind ::inner-html="$id"></sonic-td>
142
+ <sonic-td data-bind ::inner-html="$first_name <b>$last_name</b>"></sonic-td>
143
+ <sonic-td data-bind ::inner-html="$email"></sonic-td>
144
+ </sonic-tr>
145
+ </template>
146
+ <sonic-list>
147
+ </sonic-tbody>
148
+ </sonic-table>
149
+ </template>
150
+ </sonic-code>
151
+
152
+ ## Type
153
+
154
+ Values available : primary, info, success, warning, danger
155
+
156
+ <sonic-code>
157
+ <template>
158
+ <sonic-table bordered>
159
+ <sonic-tr>
160
+ <sonic-th type="info">Attribute type set on</sonic-th>
161
+ <sonic-th type="info">sonic-th</sonic-th>
162
+ </sonic-tr>
163
+ <sonic-tr>
164
+ <sonic-td type="danger">Attribute type set on</sonic-td>
165
+ <sonic-td type="danger">sonic-td</sonic-td>
166
+ </sonic-tr>
167
+ <sonic-tr type="success">
168
+ <sonic-td>Attribute type set on</sonic-td>
169
+ <sonic-td>sonic-tr</sonic-td>
170
+ </sonic-tr>
171
+ </sonic-tbody>
172
+ </sonic-table>
173
+ </template>
174
+ </sonic-code>
175
+
176
+ ## Colspan / rowspan
177
+
178
+ <sonic-code>
179
+ <template>
180
+ <sonic-table >
181
+ <sonic-tbody>
182
+ <sonic-tr>
183
+ <sonic-td colspan="2" class="bg-info text-neutral-0">colspan : 2</sonic-td>
184
+ <sonic-td>cell</sonic-td>
185
+ </sonic-tr>
186
+ <sonic-tr>
187
+ <sonic-td>cell</sonic-td>
188
+ <sonic-td>cell</sonic-td>
189
+ <sonic-td rowspan="2" class="bg-success text-neutral-0">rowspan : 2</sonic-td>
190
+ </sonic-tr>
191
+ <sonic-tr>
192
+ <sonic-td>cell</sonic-td>
193
+ <sonic-td>cell</sonic-td>
194
+ </sonic-tr>
195
+ </sonic-tbody>
196
+ </sonic-table>
197
+ </template>
198
+ </sonic-code>
199
+
200
+ ## Cell style attributes
201
+
202
+ The following attributes will be used to set the style of the component :
203
+ - align
204
+ - minWidth
205
+ - maxWidth
206
+ - width
207
+
208
+ <sonic-code>
209
+ <template>
210
+ <sonic-table bordered>
211
+ <sonic-thead>
212
+ <sonic-tr>
213
+ <sonic-th width="7rem">align</sonic-th>
214
+ <sonic-th minWidth="20rem">minWidth</sonic-th>
215
+ <sonic-th>maxWidth</sonic-th>
216
+ <sonic-th>width</sonic-th>
217
+ </sonic-tr>
218
+ </sonic-thead>
219
+ <sonic-tbody>
220
+ <sonic-tr>
221
+ <sonic-td align="left">Left</sonic-td>
222
+ <sonic-td>20rem</sonic-td>
223
+ <sonic-td>5rem</sonic-td>
224
+ <sonic-td>15rem</sonic-td>
225
+ </sonic-tr>
226
+ <sonic-tr>
227
+ <sonic-td align="center">center</sonic-td>
228
+ <sonic-td>20rem</sonic-td>
229
+ <sonic-td maxWidth="5rem">5rem</sonic-td>
230
+ <sonic-td>15rem</sonic-td>
231
+ </sonic-tr>
232
+ <sonic-tr>
233
+ <sonic-td align="right">right</sonic-td>
234
+ <sonic-td>20rem</sonic-td>
235
+ <sonic-td>5rem - Lorem ipsum dolor</sonic-td>
236
+ <sonic-td width="60rem">15rem - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam porta sollicitudin mollis. Curabitur sit amet nibh diam. Vivamus a pharetra mauris.</sonic-td>
237
+ </sonic-tr>
238
+ </sonic-table>
239
+ </template>
240
+ </sonic-code>
241
+
242
+
243
+ ## Responsive
244
+
245
+ Every table is responsive by default
246
+
247
+ <sonic-code>
248
+ <template>
249
+ <sonic-table bordered>
250
+ <sonic-thead>
251
+ <sonic-tr>
252
+ <sonic-th>Id</sonic-th>
253
+ <sonic-th>Name</sonic-th>
254
+ <sonic-th>Email</sonic-th>
255
+ <sonic-th>Comment</sonic-th>
256
+ </sonic-tr>
257
+ </sonic-thead>
258
+ <sonic-tbody>
259
+ <sonic-list fetch serviceURL="/docs-mock-api" dataProvider="api/users" key="data" displayContents>
260
+ <template>
261
+ <sonic-tr>
262
+ <sonic-td data-bind ::inner-html="$id"></sonic-td>
263
+ <sonic-td minWidth="10rem" data-bind ::inner-html="$first_name <b>$last_name</b>"></sonic-td>
264
+ <sonic-td data-bind ::inner-html="$email"></sonic-td>
265
+ <sonic-td minWidth="40rem">
266
+ 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.
267
+ </sonic-td>
268
+ </sonic-tr>
269
+ </template>
270
+ <sonic-list>
271
+ </sonic-tbody>
272
+ </sonic-table>
273
+ </template>
274
+ </sonic-code>
275
+
276
+
277
+ ## Sticky header
278
+
279
+ <sonic-code>
280
+ <template>
281
+ <sonic-table bordered noCustomScroll>
282
+ <sonic-thead class="sticky top-16">
283
+ <sonic-tr>
284
+ <sonic-th minWidth="max(20ch,12rem)">Company</sonic-th>
285
+ <sonic-th type="success">Contact</sonic-th>
286
+ <sonic-th>Country</sonic-th>
287
+ <sonic-th align="center">Quantity</sonic-th>
288
+ <sonic-th align="right">Price</sonic-th>
289
+ <sonic-th></sonic-th>
290
+ </sonic-tr>
291
+ </sonic-thead>
292
+ <sonic-tbody>
293
+ <sonic-tr>
294
+ <sonic-td>Alfreds Futterkiste</sonic-td>
295
+ <sonic-td>Maria Anders</sonic-td>
296
+ <sonic-td>Germany</sonic-td>
297
+ <sonic-td align="center">2</sonic-td>
298
+ <sonic-td align="right">40€</sonic-td>
299
+ <sonic-td td align="right"
300
+ ><sonic-button shape="circle" variant="outline" size="sm">
301
+ <sonic-icon library="iconoir" name="edit-pencil" size="lg"></sonic-icon
302
+ ></sonic-button>
303
+ </sonic-td>
304
+ </sonic-tr>
305
+ <sonic-tr>
306
+ <sonic-td>Centro comercial Moctezuma</sonic-td>
307
+ <sonic-td
308
+ colspan="2"
309
+ align="center"
310
+ class="
311
+ text-center
312
+ text-neutral-400
313
+ "
314
+ >no information yet</sonic-td
315
+ >
316
+ <sonic-td align="center">3</sonic-td>
317
+ <sonic-td align="right">40€</sonic-td>
318
+ <sonic-td td align="right"
319
+ ><sonic-button shape="circle" variant="outline" size="sm">
320
+ <sonic-icon library="iconoir" name="edit-pencil" size="lg"></sonic-icon
321
+ ></sonic-button>
322
+ </sonic-td>
323
+ </sonic-tr>
324
+ <sonic-tr>
325
+ <sonic-td>Ernst Handel</sonic-td>
326
+ <sonic-td>Roland Mendel</sonic-td>
327
+ <sonic-td>Austria</sonic-td>
328
+ <sonic-td align="center">4</sonic-td>
329
+ <sonic-td align="right">40€</sonic-td>
330
+ <sonic-td td align="right"
331
+ ><sonic-button shape="circle" variant="outline" size="sm">
332
+ <sonic-icon library="iconoir" name="edit-pencil" size="lg"></sonic-icon
333
+ ></sonic-button>
334
+ </sonic-td>
335
+ </sonic-tr>
336
+ <sonic-tr>
337
+ <sonic-td>Island Trading</sonic-td>
338
+ <sonic-td>Helen Bennett</sonic-td>
339
+ <sonic-td>UK</sonic-td>
340
+ <sonic-td align="center">1</sonic-td>
341
+ <sonic-td align="right">40€</sonic-td>
342
+ <sonic-td td align="right"
343
+ ><sonic-button shape="circle" variant="outline" size="sm">
344
+ <sonic-icon library="iconoir" name="edit-pencil" size="lg"></sonic-icon
345
+ ></sonic-button>
346
+ </sonic-td>
347
+ </sonic-tr>
348
+ <sonic-tr type="warning">
349
+ <sonic-td>Laughing Bacchus Winecellars</sonic-td>
350
+ <sonic-td>Yoshi Tannamuri</sonic-td>
351
+ <sonic-td>Canada</sonic-td>
352
+ <sonic-td align="center">0</sonic-td>
353
+ <sonic-td align="right">40€</sonic-td>
354
+ <sonic-td td align="right"
355
+ ><sonic-button shape="circle" variant="outline" size="sm">
356
+ <sonic-icon library="iconoir" name="edit-pencil" size="lg"></sonic-icon
357
+ ></sonic-button>
358
+ </sonic-td>
359
+ </sonic-tr>
360
+ <sonic-tr>
361
+ <sonic-td>Magazzini Alimentari Riuniti</sonic-td>
362
+ <sonic-td>Giovanni Rovelli</sonic-td>
363
+ <sonic-td type="danger">Italy</sonic-td>
364
+ <sonic-td align="center">20</sonic-td>
365
+ <sonic-td align="right">40€</sonic-td>
366
+ <sonic-td td align="right"
367
+ ><sonic-button shape="circle" variant="outline" size="sm">
368
+ <sonic-icon library="iconoir" name="edit-pencil" size="lg"></sonic-icon
369
+ ></sonic-button>
370
+ </sonic-td>
371
+ </sonic-tr>
372
+ <sonic-tr>
373
+ <sonic-td>Alfreds Futterkiste</sonic-td>
374
+ <sonic-td>Maria Anders</sonic-td>
375
+ <sonic-td>Germany</sonic-td>
376
+ <sonic-td align="center">2</sonic-td>
377
+ <sonic-td align="right">40€</sonic-td>
378
+ <sonic-td td align="right"
379
+ ><sonic-button shape="circle" variant="outline" size="sm">
380
+ <sonic-icon library="iconoir" name="edit-pencil" size="lg"></sonic-icon
381
+ ></sonic-button>
382
+ </sonic-td>
383
+ </sonic-tr>
384
+ <sonic-tr>
385
+ <sonic-td>Centro comercial Moctezuma</sonic-td>
386
+ <sonic-td
387
+ colspan="2"
388
+ align="center"
389
+ class="
390
+ text-center
391
+ text-neutral-400
392
+ "
393
+ >no information yet</sonic-td
394
+ >
395
+ <sonic-td align="center">3</sonic-td>
396
+ <sonic-td align="right">40€</sonic-td>
397
+ <sonic-td td align="right"
398
+ ><sonic-button shape="circle" variant="outline" size="sm">
399
+ <sonic-icon library="iconoir" name="edit-pencil" size="lg"></sonic-icon
400
+ ></sonic-button>
401
+ </sonic-td>
402
+ </sonic-tr>
403
+ <sonic-tr>
404
+ <sonic-td>Ernst Handel</sonic-td>
405
+ <sonic-td>Roland Mendel</sonic-td>
406
+ <sonic-td>Austria</sonic-td>
407
+ <sonic-td align="center">4</sonic-td>
408
+ <sonic-td align="right">40€</sonic-td>
409
+ <sonic-td td align="right"
410
+ ><sonic-button shape="circle" variant="outline" size="sm">
411
+ <sonic-icon library="iconoir" name="edit-pencil" size="lg"></sonic-icon
412
+ ></sonic-button>
413
+ </sonic-td>
414
+ </sonic-tr>
415
+ <sonic-tr>
416
+ <sonic-td>Island Trading</sonic-td>
417
+ <sonic-td>Helen Bennett</sonic-td>
418
+ <sonic-td>UK</sonic-td>
419
+ <sonic-td align="center">1</sonic-td>
420
+ <sonic-td align="right">40€</sonic-td>
421
+ <sonic-td td align="right"
422
+ ><sonic-button shape="circle" variant="outline" size="sm">
423
+ <sonic-icon library="iconoir" name="edit-pencil" size="lg"></sonic-icon
424
+ ></sonic-button>
425
+ </sonic-td>
426
+ </sonic-tr>
427
+ <sonic-tr type="warning">
428
+ <sonic-td>Laughing Bacchus Winecellars</sonic-td>
429
+ <sonic-td>Yoshi Tannamuri</sonic-td>
430
+ <sonic-td>Canada</sonic-td>
431
+ <sonic-td align="center">0</sonic-td>
432
+ <sonic-td align="right">40€</sonic-td>
433
+ <sonic-td td align="right"
434
+ ><sonic-button shape="circle" variant="outline" size="sm">
435
+ <sonic-icon library="iconoir" name="edit-pencil" size="lg"></sonic-icon
436
+ ></sonic-button>
437
+ </sonic-td>
438
+ </sonic-tr>
439
+ <sonic-tr>
440
+ <sonic-td>Magazzini Alimentari Riuniti</sonic-td>
441
+ <sonic-td>Giovanni Rovelli</sonic-td>
442
+ <sonic-td>Italy</sonic-td>
443
+ <sonic-td align="center">20</sonic-td>
444
+ <sonic-td align="right">40€</sonic-td>
445
+ <sonic-td td align="right"
446
+ ><sonic-button shape="circle" variant="outline" size="sm">
447
+ <sonic-icon library="iconoir" name="edit-pencil" size="lg"></sonic-icon
448
+ ></sonic-button>
449
+ </sonic-td>
450
+ </sonic-tr>
451
+ </sonic-tbody>
452
+ <sonic-caption>table caption</sonic-caption>
453
+ </sonic-table>
454
+ </template>
455
+ </sonic-code>