@supersoniks/concorde 3.0.11 → 3.1.0

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 (88) hide show
  1. package/build-infos.json +1 -1
  2. package/concorde-core.bundle.js +129 -124
  3. package/concorde-core.es.js +1117 -1101
  4. package/dist/concorde-core.bundle.js +129 -124
  5. package/dist/concorde-core.es.js +1117 -1101
  6. package/dist/fonts/ClashGrotesk-Bold.eot +0 -0
  7. package/dist/fonts/ClashGrotesk-Bold.ttf +0 -0
  8. package/dist/fonts/ClashGrotesk-Bold.woff +0 -0
  9. package/dist/fonts/ClashGrotesk-Bold.woff2 +0 -0
  10. package/dist/fonts/ClashGrotesk-Extralight.eot +0 -0
  11. package/dist/fonts/ClashGrotesk-Extralight.ttf +0 -0
  12. package/dist/fonts/ClashGrotesk-Extralight.woff +0 -0
  13. package/dist/fonts/ClashGrotesk-Extralight.woff2 +0 -0
  14. package/dist/fonts/ClashGrotesk-Light.eot +0 -0
  15. package/dist/fonts/ClashGrotesk-Light.ttf +0 -0
  16. package/dist/fonts/ClashGrotesk-Light.woff +0 -0
  17. package/dist/fonts/ClashGrotesk-Light.woff2 +0 -0
  18. package/dist/fonts/ClashGrotesk-Medium.eot +0 -0
  19. package/dist/fonts/ClashGrotesk-Medium.ttf +0 -0
  20. package/dist/fonts/ClashGrotesk-Medium.woff +0 -0
  21. package/dist/fonts/ClashGrotesk-Medium.woff2 +0 -0
  22. package/dist/fonts/ClashGrotesk-Regular.eot +0 -0
  23. package/dist/fonts/ClashGrotesk-Regular.ttf +0 -0
  24. package/dist/fonts/ClashGrotesk-Regular.woff +0 -0
  25. package/dist/fonts/ClashGrotesk-Regular.woff2 +0 -0
  26. package/dist/fonts/ClashGrotesk-Semibold.eot +0 -0
  27. package/dist/fonts/ClashGrotesk-Semibold.ttf +0 -0
  28. package/dist/fonts/ClashGrotesk-Semibold.woff +0 -0
  29. package/dist/fonts/ClashGrotesk-Semibold.woff2 +0 -0
  30. package/dist/fonts/ClashGrotesk-Variable.eot +0 -0
  31. package/dist/fonts/ClashGrotesk-Variable.ttf +0 -0
  32. package/dist/fonts/ClashGrotesk-Variable.woff +0 -0
  33. package/dist/fonts/ClashGrotesk-Variable.woff2 +0 -0
  34. package/dist/img/concorde-icon.svg +5 -0
  35. package/dist/img/concorde_seuil.png.webp +0 -0
  36. package/dist/img/concorde_seuil_invert.png +0 -0
  37. package/index.html +67 -108
  38. package/package.json +2 -2
  39. package/public/fonts/ClashGrotesk-Bold.eot +0 -0
  40. package/public/fonts/ClashGrotesk-Bold.ttf +0 -0
  41. package/public/fonts/ClashGrotesk-Bold.woff +0 -0
  42. package/public/fonts/ClashGrotesk-Bold.woff2 +0 -0
  43. package/public/fonts/ClashGrotesk-Extralight.eot +0 -0
  44. package/public/fonts/ClashGrotesk-Extralight.ttf +0 -0
  45. package/public/fonts/ClashGrotesk-Extralight.woff +0 -0
  46. package/public/fonts/ClashGrotesk-Extralight.woff2 +0 -0
  47. package/public/fonts/ClashGrotesk-Light.eot +0 -0
  48. package/public/fonts/ClashGrotesk-Light.ttf +0 -0
  49. package/public/fonts/ClashGrotesk-Light.woff +0 -0
  50. package/public/fonts/ClashGrotesk-Light.woff2 +0 -0
  51. package/public/fonts/ClashGrotesk-Medium.eot +0 -0
  52. package/public/fonts/ClashGrotesk-Medium.ttf +0 -0
  53. package/public/fonts/ClashGrotesk-Medium.woff +0 -0
  54. package/public/fonts/ClashGrotesk-Medium.woff2 +0 -0
  55. package/public/fonts/ClashGrotesk-Regular.eot +0 -0
  56. package/public/fonts/ClashGrotesk-Regular.ttf +0 -0
  57. package/public/fonts/ClashGrotesk-Regular.woff +0 -0
  58. package/public/fonts/ClashGrotesk-Regular.woff2 +0 -0
  59. package/public/fonts/ClashGrotesk-Semibold.eot +0 -0
  60. package/public/fonts/ClashGrotesk-Semibold.ttf +0 -0
  61. package/public/fonts/ClashGrotesk-Semibold.woff +0 -0
  62. package/public/fonts/ClashGrotesk-Semibold.woff2 +0 -0
  63. package/public/fonts/ClashGrotesk-Variable.eot +0 -0
  64. package/public/fonts/ClashGrotesk-Variable.ttf +0 -0
  65. package/public/fonts/ClashGrotesk-Variable.woff +0 -0
  66. package/public/fonts/ClashGrotesk-Variable.woff2 +0 -0
  67. package/public/img/concorde-icon.svg +5 -0
  68. package/public/img/concorde_seuil.png.webp +0 -0
  69. package/public/img/concorde_seuil_invert.png +0 -0
  70. package/src/core/components/ui/menu/menu-item.ts +3 -3
  71. package/src/core/components/ui/pop/pop.ts +54 -19
  72. package/src/core/components/ui/theme/theme.ts +28 -22
  73. package/src/core/components/ui/toast/toast.ts +1 -3
  74. package/src/core/utils/PublisherProxy.ts +15 -11
  75. package/src/docs/_core-concept/subscriber.md +1 -1
  76. package/src/docs/_getting-started/concorde-outside.md +12 -10
  77. package/src/docs/_getting-started/create-a-component.md +1 -1
  78. package/src/docs/_getting-started/pubsub.md +1 -1
  79. package/src/docs/_getting-started/start.md +19 -17
  80. package/src/docs/docs.ts +1 -0
  81. package/src/docs/header/header.ts +217 -0
  82. package/src/docs/navigation/navigation.ts +123 -51
  83. package/src/docs/search/docs-search.json +85 -100
  84. package/src/docs/search/page.ts +4 -5
  85. package/src/docs/search/search.ts +18 -3
  86. package/src/docs/tailwind/css/tailwind.css +146 -0
  87. package/tailwind.config.js +19 -24
  88. package/vite/config.js +20 -2
package/dist/fonts/ClashGrotesk-Bold.eot ADDED
Binary file
package/dist/fonts/ClashGrotesk-Bold.ttf ADDED
Binary file
package/dist/img/concorde-icon.svg ADDED
@@ -0,0 +1,5 @@
1
+ <svg width="66" height="66" viewBox="0 0 66 66" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M33 62C49.0163 62 62 49.0163 62 33C62 16.9837 49.0163 4 33 4C16.9837 4 4 16.9837 4 33C4 49.0163 16.9837 62 33 62Z" fill="black"/>
3
+ <path d="M33 0C14.77 0 0 14.77 0 33C0 51.23 14.77 66 33 66C51.22 65.98 65.98 51.22 66 33.01C66 14.78 51.23 0.01 33 0ZM33 64.5C15.6 64.5 1.5 50.4 1.5 33C1.5 15.6 15.6 1.5 33 1.5C50.39 1.52 64.49 15.61 64.5 33.01C64.5 50.4 50.4 64.5 33 64.5Z" fill="black"/>
4
+ <path d="M33.2499 62.03C33.8799 59.24 34.26 56.17 34.39 53.08C34.57 52.78 34.9099 52.6 35.2599 52.64H35.39C35.48 52.64 35.5799 52.64 35.6899 52.64H35.7599C35.7599 52.64 35.7999 52.64 35.8299 52.64C36.2499 52.62 36.6799 52.58 36.9099 52.56C36.9399 52.56 36.9599 52.56 36.9799 52.56C37.0099 52.56 37.0299 52.56 37.0499 52.56H37.0899L37.2099 51.93H37.4799L37.5799 52.4L37.6899 52.49H39.2699L39.39 52.38L39.5099 51.93H39.7899L39.8399 52.21L39.9999 52.29L45.2099 51.86L46.2799 51.29C46.2799 51.29 46.2799 50.85 46.2399 50.25V50.18C46.2399 50.18 46.2399 50.13 46.2399 50.11C46.2099 49.62 46.1399 49.13 46.0399 48.65C45.7899 47.45 45.29 46 42.2 41.58C39.11 37.16 38.04 35.52 35.89 27.63C35.85 27.48 35.8199 27.35 35.7899 27.2C35.1399 24.53 34.6899 22.95 34.5199 22.38V10.89C34.4999 9.60996 34.3999 8.33996 34.2099 7.07996C34.0499 5.97996 33.6099 4.89996 33.3499 3.95996H32.6299C32.3599 4.89996 31.9299 5.97996 31.7699 7.06996C31.5799 8.33996 31.4799 9.60996 31.4599 10.89V22.38C31.2899 22.95 30.8299 24.52 30.1899 27.2C30.1599 27.35 30.1199 27.49 30.0899 27.63C27.9499 35.52 26.8699 37.16 23.7799 41.58C20.6899 46 20.1899 47.45 19.9399 48.65C19.8399 49.13 19.7799 49.62 19.7399 50.11C19.7399 50.13 19.7399 50.16 19.7399 50.18V50.25C19.6999 50.85 19.7 51.29 19.7 51.29L20.7699 51.86L25.9799 52.29L26.14 52.21L26.1899 51.93H26.4799L26.5999 52.38L26.7299 52.49H28.2999L28.4099 52.4L28.5099 51.93H28.7699L28.89 52.56H28.9399C28.9399 52.56 28.9799 52.56 29.0099 52.56C29.0299 52.56 29.0499 52.56 29.0799 52.56C29.3099 52.58 29.7499 52.63 30.1599 52.64C30.1799 52.64 30.2099 52.64 30.2299 52.64H30.2999C30.4099 52.64 30.5099 52.64 30.5999 52.64H30.7299C31.0799 52.6 31.4299 52.77 31.6099 53.08C31.7299 56.17 32.1099 59.24 32.7399 62.03H33.2499Z" fill="#FF0A0A"/>
5
+ </svg>
package/dist/img/concorde_seuil.png.webp ADDED
Binary file
package/index.html CHANGED
@@ -1,5 +1,5 @@
1
1
  <!DOCTYPE html>
2
- <html lang="fr">
2
+ <html lang="en">
3
3
  <head>
4
4
  <meta charset="UTF-8" />
5
5
  <link rel="icon" type="image/svg+xml" href="./svg/favicon.svg" />
@@ -8,125 +8,84 @@
8
8
  <link rel="stylesheet" href="https://use.typekit.net/eda3clw.css" />
9
9
  <script src="https://cdn.jsdelivr.net/npm/fuzzysort@2.0.1/fuzzysort.min.js"></script>
10
10
  <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
11
- <link href="https://fonts.cdnfonts.com/css/inter" rel="stylesheet" />
12
11
  <script type="module" src="./src/docs.ts"></script>
13
-
14
12
  <link href="./src/docs/tailwind/css/tailwind.css" rel="stylesheet" />
15
13
  </head>
16
14
  <body class="px-6 lg:px-20">
17
- <sonic-theme font background color>
18
- <sonic-scope markdownsURL="src">
19
- <div
20
- class="flex items-center gap-4 border-b-[.3rem] border-current py-3 sticky top-0 z-40 text-neutral-900 bg-neutral-0"
21
- >
22
- <div class="font-bold text-4xl">
23
- <sonic-link href="#">
24
- <svg
25
- xmlns="http://www.w3.org/2000/svg"
26
- width="222.442"
27
- height="47.558"
28
- viewBox="0 0 222.442 47.558"
29
- >
30
- <g transform="translate(-51.885 -25)">
31
- <path
32
- d="M11.045.384A9.984,9.984,0,0,1,5.862-.9,8.546,8.546,0,0,1,2.538-4.474,11.519,11.519,0,0,1,1.381-9.741a11.462,11.462,0,0,1,1.17-5.3,8.651,8.651,0,0,1,3.33-3.567,9.872,9.872,0,0,1,5.139-1.285,10.228,10.228,0,0,1,4.5.933,7.522,7.522,0,0,1,3.055,2.621,7.7,7.7,0,0,1,1.24,3.963H14.676a4.017,4.017,0,0,0-1.144-2.371,3.328,3.328,0,0,0-2.423-.9,3.647,3.647,0,0,0-2.205.684A4.416,4.416,0,0,0,7.44-12.976a8.472,8.472,0,0,0-.524,3.158,8.75,8.75,0,0,0,.518,3.2A4.393,4.393,0,0,0,8.9-4.615a3.651,3.651,0,0,0,2.212.69,3.63,3.63,0,0,0,1.681-.384,3.279,3.279,0,0,0,1.24-1.119A4.261,4.261,0,0,0,14.676-7.2h5.139a8.049,8.049,0,0,1-1.221,3.957A7.443,7.443,0,0,1,15.584-.575,10.038,10.038,0,0,1,11.045.384Zm19.7,0A9.985,9.985,0,0,1,25.6-.888a8.6,8.6,0,0,1-3.343-3.554,11.411,11.411,0,0,1-1.176-5.3,11.469,11.469,0,0,1,1.176-5.325A8.6,8.6,0,0,1,25.6-18.62a9.985,9.985,0,0,1,5.146-1.272A9.985,9.985,0,0,1,35.9-18.62a8.6,8.6,0,0,1,3.343,3.554,11.469,11.469,0,0,1,1.176,5.325,11.411,11.411,0,0,1-1.176,5.3A8.6,8.6,0,0,1,35.9-.888,9.985,9.985,0,0,1,30.75.384Zm.026-4.219a3.367,3.367,0,0,0,2.263-.773,4.757,4.757,0,0,0,1.374-2.116A9.279,9.279,0,0,0,34.88-9.78a9.279,9.279,0,0,0-.467-3.055,4.8,4.8,0,0,0-1.374-2.122,3.35,3.35,0,0,0-2.263-.78,3.443,3.443,0,0,0-2.295.78,4.726,4.726,0,0,0-1.393,2.122,9.279,9.279,0,0,0-.467,3.055,9.279,9.279,0,0,0,.467,3.055,4.681,4.681,0,0,0,1.393,2.116A3.461,3.461,0,0,0,30.776-3.835Zm17.2-7.517V0H42.529V-19.636h5.19v3.464h.23a5.512,5.512,0,0,1,2.186-2.717,6.647,6.647,0,0,1,3.72-1A6.906,6.906,0,0,1,57.423-19a6.091,6.091,0,0,1,2.365,2.55,8.589,8.589,0,0,1,.844,3.944V0H55.185V-11.531a3.968,3.968,0,0,0-.92-2.819,3.315,3.315,0,0,0-2.57-1.016,3.87,3.87,0,0,0-1.937.473,3.253,3.253,0,0,0-1.3,1.374A4.769,4.769,0,0,0,47.975-11.352ZM72.346.384A9.985,9.985,0,0,1,67.162-.9a8.546,8.546,0,0,1-3.324-3.573,11.519,11.519,0,0,1-1.157-5.267,11.462,11.462,0,0,1,1.17-5.3,8.651,8.651,0,0,1,3.33-3.567,9.872,9.872,0,0,1,5.139-1.285,10.228,10.228,0,0,1,4.5.933,7.522,7.522,0,0,1,3.055,2.621,7.7,7.7,0,0,1,1.24,3.963H75.977a4.017,4.017,0,0,0-1.144-2.371,3.328,3.328,0,0,0-2.423-.9,3.647,3.647,0,0,0-2.205.684,4.416,4.416,0,0,0-1.464,1.988,8.472,8.472,0,0,0-.524,3.158,8.75,8.75,0,0,0,.518,3.2A4.393,4.393,0,0,0,70.2-4.615a3.651,3.651,0,0,0,2.212.69,3.63,3.63,0,0,0,1.681-.384,3.279,3.279,0,0,0,1.24-1.119A4.261,4.261,0,0,0,75.977-7.2h5.139A8.049,8.049,0,0,1,79.9-3.241,7.443,7.443,0,0,1,76.885-.575,10.038,10.038,0,0,1,72.346.384Zm19.7,0A9.985,9.985,0,0,1,86.905-.888a8.6,8.6,0,0,1-3.343-3.554,11.411,11.411,0,0,1-1.176-5.3,11.469,11.469,0,0,1,1.176-5.325,8.6,8.6,0,0,1,3.343-3.554,9.985,9.985,0,0,1,5.146-1.272A9.985,9.985,0,0,1,97.2-18.62a8.6,8.6,0,0,1,3.343,3.554,11.469,11.469,0,0,1,1.176,5.325,11.411,11.411,0,0,1-1.176,5.3A8.6,8.6,0,0,1,97.2-.888,9.985,9.985,0,0,1,92.051.384Zm.026-4.219a3.367,3.367,0,0,0,2.263-.773,4.757,4.757,0,0,0,1.374-2.116A9.279,9.279,0,0,0,96.18-9.78a9.279,9.279,0,0,0-.467-3.055,4.8,4.8,0,0,0-1.374-2.122,3.35,3.35,0,0,0-2.263-.78,3.443,3.443,0,0,0-2.295.78,4.726,4.726,0,0,0-1.393,2.122,9.278,9.278,0,0,0-.467,3.055,9.278,9.278,0,0,0,.467,3.055,4.681,4.681,0,0,0,1.393,2.116A3.461,3.461,0,0,0,92.077-3.835ZM103.83,0V-19.636h5.28v3.426h.2a5.1,5.1,0,0,1,1.8-2.768,4.76,4.76,0,0,1,2.915-.94,8.238,8.238,0,0,1,.882.051,6.212,6.212,0,0,1,.831.141v4.832a7.115,7.115,0,0,0-1.061-.2,9.532,9.532,0,0,0-1.24-.089,4.363,4.363,0,0,0-2.141.518,3.847,3.847,0,0,0-1.483,1.438,4.1,4.1,0,0,0-.543,2.122V0Zm19.59.32a7.351,7.351,0,0,1-4.046-1.157,7.876,7.876,0,0,1-2.864-3.413,13.041,13.041,0,0,1-1.055-5.542,12.858,12.858,0,0,1,1.087-5.619,7.829,7.829,0,0,1,2.9-3.362,7.4,7.4,0,0,1,3.969-1.119,6.1,6.1,0,0,1,2.755.556,5.484,5.484,0,0,1,1.79,1.381,7.22,7.22,0,0,1,1.042,1.617h.166v-9.844h5.433V0h-5.369V-3.145h-.23a7,7,0,0,1-1.08,1.617,5.443,5.443,0,0,1-1.8,1.323A6.249,6.249,0,0,1,123.42.32Zm1.726-4.334a3.487,3.487,0,0,0,2.231-.722,4.56,4.56,0,0,0,1.406-2.026,8.637,8.637,0,0,0,.492-3.055,8.632,8.632,0,0,0-.486-3.043,4.367,4.367,0,0,0-1.406-1.994,3.577,3.577,0,0,0-2.237-.7,3.532,3.532,0,0,0-2.263.729,4.456,4.456,0,0,0-1.393,2.02,8.677,8.677,0,0,0-.473,2.991,8.776,8.776,0,0,0,.479,3.023,4.56,4.56,0,0,0,1.393,2.045A3.485,3.485,0,0,0,125.146-4.014Zm21.418,4.4a10.412,10.412,0,0,1-5.21-1.234A8.345,8.345,0,0,1,138-4.353a11.538,11.538,0,0,1-1.176-5.376A11.479,11.479,0,0,1,138-15.047a8.681,8.681,0,0,1,3.317-3.567,9.628,9.628,0,0,1,5.031-1.278,10.393,10.393,0,0,1,3.624.62,8.169,8.169,0,0,1,2.94,1.86,8.473,8.473,0,0,1,1.962,3.113,12.434,12.434,0,0,1,.7,4.379v1.5H139V-11.8H150.45a4.172,4.172,0,0,0-.511-2.084,3.721,3.721,0,0,0-1.413-1.425,4.122,4.122,0,0,0-2.09-.518,4.193,4.193,0,0,0-2.192.569,4.08,4.08,0,0,0-1.489,1.521,4.333,4.333,0,0,0-.55,2.116v3.209a5.462,5.462,0,0,0,.543,2.518,3.889,3.889,0,0,0,1.54,1.636,4.653,4.653,0,0,0,2.365.575,5.15,5.15,0,0,0,1.662-.256,3.449,3.449,0,0,0,1.291-.767,3.335,3.335,0,0,0,.818-1.253l5.037.332A6.866,6.866,0,0,1,153.9-2.461a7.868,7.868,0,0,1-3.043,2.1A11.435,11.435,0,0,1,146.563.384Zm14.31-.051a2.954,2.954,0,0,1-2.167-.9,2.954,2.954,0,0,1-.9-2.167,2.919,2.919,0,0,1,.9-2.148,2.965,2.965,0,0,1,2.167-.895,2.985,2.985,0,0,1,2.148.895,2.889,2.889,0,0,1,.92,2.148,2.884,2.884,0,0,1-.428,1.54,3.286,3.286,0,0,1-1.119,1.112A2.9,2.9,0,0,1,160.873.332Z"
33
- transform="translate(110.385 62)"
34
- fill="#2a282d"
35
- />
36
- <g transform="translate(51.885 25)">
37
- <g transform="translate(2.6 2.209)">
38
- <path
39
- d="M52.661,65.423h-1.4l-.091-.468h-.208l-.078.351-.078.065H49.646l-.065-.169-.091-.338h-.221v.208l-.118.065-3.859-.326L44.5,64.4v-.871a7.436,7.436,0,0,1,.156-1.079c.182-.883.546-1.962,2.833-5.224s3.08-4.481,4.665-10.3l.078-.324c.468-1.975.806-3.132.936-3.547V34.524a25.625,25.625,0,0,1,.312-2.82h0c.143-.923.312-1.754.468-2.4a21.623,21.623,0,0,0,.195,43.218,41.171,41.171,0,0,1-.845-6.8.668.668,0,0,0-.637-.3Z"
40
- transform="translate(-33.181 -29.3)"
41
- fill="#2a282d"
42
- />
43
- <path
44
- d="M34.658,65.423h1.4l.091-.468h.209l.078.351.078.065h1.157l.065-.169.091-.338h.221v.208l.118.065,3.857-.326.793-.416v-.871a7.436,7.436,0,0,0-.156-1.079c-.182-.883-.546-1.962-2.833-5.224s-3.08-4.481-4.665-10.3l-.078-.324c-.468-1.975-.806-3.132-.936-3.547V34.524a25.63,25.63,0,0,0-.312-2.82h0c-.143-.923-.312-1.754-.468-2.4a21.623,21.623,0,0,1-.195,43.218,41.171,41.171,0,0,0,.845-6.8.668.668,0,0,1,.637-.3Z"
45
- transform="translate(-11.738 -29.3)"
46
- fill="#2a282d"
47
- />
48
- </g>
49
- <path
50
- d="M23.779,1.169a22.61,22.61,0,1,0,22.61,22.61,22.61,22.61,0,0,0-22.61-22.61m0-1.169A23.779,23.779,0,1,1,0,23.779,23.779,23.779,0,0,1,23.779,0Z"
51
- transform="translate(0 0)"
52
- fill="#2a282d"
53
- />
54
- </g>
55
- </g>
56
- </svg>
57
- </sonic-link>
58
- </div>
59
- <docs-search class="mx-auto flex-grow block max-w-[32rem] w-full">
60
- </docs-search>
61
-
62
- <div>
63
- <!-- <sonic-button shape="circle" icon variant="ghost">
64
- <sonic-icon library="iconoir" name="github"></sonic-icon>
65
- </sonic-button> -->
66
- </div>
67
- </div>
68
-
69
- <sonic-router>
70
- <template data-route=".md">
15
+ <sonic-theme
16
+ customIconLibraryPath="https://cdn.supersoniks.com/concorde/icons/fontawesome/v6/$prefix/$name.svg"
17
+ customIconDefaultPrefix="regular"
18
+ markdownsURL="src"
19
+ >
20
+ <sonic-docs-header></sonic-docs-header>
21
+ <sonic-router>
22
+ <template data-route="^((?!.md).)*$">
23
+ <div class="col-span-full">
71
24
  <div
72
- class="grid grid-cols-[minmax(10rem,15rem)_minmax(0,1fr)] gap-8"
25
+ class="font-headings text-4xl leading-none md:text-5xl lg:text-7xl xl:text-8xl max-w-[29ch] lg:max-w-[19ch] mt-9 mb-10 text-neutral-900"
73
26
  >
74
- <div>
75
- <docs-navigation
76
- class="sticky top-[4.2rem] max-h-[calc(100vh_-_4.2rem)] block overflow-auto py-4 custom-scroll"
77
- ></docs-navigation>
78
- </div>
79
- <div class="min-h-[100vh] pt-3">
80
- <div class="max-w-[80ch] mx-auto block py-8">
81
- <docs-page noShadowDom class="prose"></docs-page>
82
- </div>
27
+ webcomponents for
28
+ <div class="animated-text font-medium">
29
+ &nbsp;
30
+ <span> scoped </span>
31
+ <span> consistent </span>
32
+ <span> shareable </span>
83
33
  </div>
34
+ user interfaces
84
35
  </div>
85
- </template>
86
-
87
- <template data-route="^((?!#).)*$">
88
- <div
89
- class="text-4xl leading-none md:text-5xl lg:text-7xl xl:text-8xl max-w-[29ch] lg:max-w-[19ch] mt-9 mb-10 text-neutral-900"
90
- >
91
- <!-- webcomponents built with lit to implement
92
- <span class="font-bold">anywhere, fast, safe and consistent user interfaces. </span> -->
93
- webcomponents for
94
- <span class="font-bold"
95
- >scoped and consistent user interfaces.
96
- </span>
97
- <div class="text-base mt-6 -mb-12 relative z-2">
98
- <div
99
- class="inline-flex items-center gap-3 text-lg leading-none"
36
+ <div class="text-base mt-6 relative z-2 mb-40">
37
+ <div class="inline-flex items-center gap-3 text-lg leading-none">
38
+ <sonic-button
39
+ size="2xl"
40
+ variant="outline"
41
+ type="primary"
42
+ href="#docs/_getting-started/start.md/start"
43
+ >
44
+ <sonic-icon
45
+ name="airplane"
46
+ library="iconoir"
47
+ class="rotate-90 inline-block mr-1"
48
+ ></sonic-icon
49
+ ><span class="font-bold">Get Started</span>
50
+ </sonic-button>
51
+ <sonic-code language="bash" inline noEdit>
52
+ <template>
53
+ npx @supersoniks/create-concorde-ts-starter "MyProject"
54
+ </template></sonic-code
100
55
  >
101
- <sonic-button
102
- size="2xl"
103
- variant="outline"
104
- type="primary"
105
- href="#docs/_getting-started/start.md/start"
106
- >
107
- <sonic-icon
108
- name="airplane"
109
- library="iconoir"
110
- class="rotate-90 inline-block mr-1"
111
- ></sonic-icon
112
- ><span class="font-bold">Get Started</span>
113
- </sonic-button>
114
- <sonic-code language="bash" inline noEdit>
115
- <template>
116
- npx @supersoniks/create-concorde-ts-starter "MyProject"
117
- </template></sonic-code
118
- >
119
- </div>
120
56
  </div>
121
57
  </div>
122
- <sonic-image
123
- src="./img/concorde.png"
58
+ <img
59
+ src="./img/concorde_seuil.png.webp"
124
60
  alt=""
125
- class="w-full block mix-blend-multiply"
126
- ></sonic-image>
127
- </template>
128
- </sonic-router>
129
- </sonic-scope>
61
+ loading="lazy"
62
+ class="w-full block dark:hidden"
63
+ />
64
+ <img
65
+ src="./img/concorde_seuil_invert.png"
66
+ alt=""
67
+ loading="lazy"
68
+ class="w-full hidden dark:block dark:opacity-60"
69
+ />
70
+ </div>
71
+ </template>
72
+
73
+ <template data-route=".md">
74
+ <div class="grid grid-cols-[minmax(10rem,15rem)_minmax(0,1fr)] gap-8">
75
+ <div>
76
+ <docs-navigation
77
+ class="sticky top-[4.2rem] max-h-[calc(100vh_-_4.2rem)] block overflow-auto py-4 custom-scroll"
78
+ ></docs-navigation>
79
+ </div>
80
+ <div class="min-h-[100vh] pt-3">
81
+ <docs-page
82
+ noShadowDom
83
+ class="prose lg:prose-lg max-w-prose block py-8 prose-li:my-[.2em] leading-[1.5] lg:leading-[1.5] prose-h1:font-normal prose-h1:text-[4.2em]"
84
+ ></docs-page>
85
+ </div>
86
+ </div>
87
+ </template>
88
+ </sonic-router>
130
89
  </sonic-theme>
131
90
  </body>
132
91
  </html>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@supersoniks/concorde",
3
- "version": "3.0.11",
3
+ "version": "3.1.0",
4
4
  "license": "MIT",
5
5
  "type": "module",
6
6
  "main": "",
@@ -27,7 +27,7 @@
27
27
  "@types/node": "^20.12.4",
28
28
  "autoprefixer": "^10.4.19",
29
29
  "intl": "^1.2.5",
30
- "lit": "^3.0.0",
30
+ "lit": "^3.1.3",
31
31
  "marked": "^12.0.1",
32
32
  "marked-gfm-heading-id": "^3.1.3",
33
33
  "postcss": "^8.4.38",
package/public/img/concorde-icon.svg ADDED
@@ -0,0 +1,5 @@
1
+ <svg width="66" height="66" viewBox="0 0 66 66" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M33 62C49.0163 62 62 49.0163 62 33C62 16.9837 49.0163 4 33 4C16.9837 4 4 16.9837 4 33C4 49.0163 16.9837 62 33 62Z" fill="black"/>
3
+ <path d="M33 0C14.77 0 0 14.77 0 33C0 51.23 14.77 66 33 66C51.22 65.98 65.98 51.22 66 33.01C66 14.78 51.23 0.01 33 0ZM33 64.5C15.6 64.5 1.5 50.4 1.5 33C1.5 15.6 15.6 1.5 33 1.5C50.39 1.52 64.49 15.61 64.5 33.01C64.5 50.4 50.4 64.5 33 64.5Z" fill="black"/>
4
+ <path d="M33.2499 62.03C33.8799 59.24 34.26 56.17 34.39 53.08C34.57 52.78 34.9099 52.6 35.2599 52.64H35.39C35.48 52.64 35.5799 52.64 35.6899 52.64H35.7599C35.7599 52.64 35.7999 52.64 35.8299 52.64C36.2499 52.62 36.6799 52.58 36.9099 52.56C36.9399 52.56 36.9599 52.56 36.9799 52.56C37.0099 52.56 37.0299 52.56 37.0499 52.56H37.0899L37.2099 51.93H37.4799L37.5799 52.4L37.6899 52.49H39.2699L39.39 52.38L39.5099 51.93H39.7899L39.8399 52.21L39.9999 52.29L45.2099 51.86L46.2799 51.29C46.2799 51.29 46.2799 50.85 46.2399 50.25V50.18C46.2399 50.18 46.2399 50.13 46.2399 50.11C46.2099 49.62 46.1399 49.13 46.0399 48.65C45.7899 47.45 45.29 46 42.2 41.58C39.11 37.16 38.04 35.52 35.89 27.63C35.85 27.48 35.8199 27.35 35.7899 27.2C35.1399 24.53 34.6899 22.95 34.5199 22.38V10.89C34.4999 9.60996 34.3999 8.33996 34.2099 7.07996C34.0499 5.97996 33.6099 4.89996 33.3499 3.95996H32.6299C32.3599 4.89996 31.9299 5.97996 31.7699 7.06996C31.5799 8.33996 31.4799 9.60996 31.4599 10.89V22.38C31.2899 22.95 30.8299 24.52 30.1899 27.2C30.1599 27.35 30.1199 27.49 30.0899 27.63C27.9499 35.52 26.8699 37.16 23.7799 41.58C20.6899 46 20.1899 47.45 19.9399 48.65C19.8399 49.13 19.7799 49.62 19.7399 50.11C19.7399 50.13 19.7399 50.16 19.7399 50.18V50.25C19.6999 50.85 19.7 51.29 19.7 51.29L20.7699 51.86L25.9799 52.29L26.14 52.21L26.1899 51.93H26.4799L26.5999 52.38L26.7299 52.49H28.2999L28.4099 52.4L28.5099 51.93H28.7699L28.89 52.56H28.9399C28.9399 52.56 28.9799 52.56 29.0099 52.56C29.0299 52.56 29.0499 52.56 29.0799 52.56C29.3099 52.58 29.7499 52.63 30.1599 52.64C30.1799 52.64 30.2099 52.64 30.2299 52.64H30.2999C30.4099 52.64 30.5099 52.64 30.5999 52.64H30.7299C31.0799 52.6 31.4299 52.77 31.6099 53.08C31.7299 56.17 32.1099 59.24 32.7399 62.03H33.2499Z" fill="#FF0A0A"/>
5
+ </svg>
package/src/core/components/ui/menu/menu-item.ts CHANGED
@@ -1,5 +1,5 @@
1
- import {customElement} from "lit/decorators.js";
2
- import {Button} from "@supersoniks/concorde/core/components/ui/button/button";
1
+ import { customElement } from "lit/decorators.js";
2
+ import { Button } from "@supersoniks/concorde/core/components/ui/button/button";
3
3
  const tagName = "sonic-menu-item";
4
4
 
5
5
  @customElement(tagName)
@@ -14,7 +14,7 @@ export class MenuItem extends Button {
14
14
  }
15
15
 
16
16
  if (!this.hasAttribute("type")) {
17
- this.type = "primary";
17
+ this.type = "default";
18
18
  }
19
19
 
20
20
  if (!this.hasAttribute("shape")) {
package/src/core/components/ui/pop/pop.ts CHANGED
@@ -1,7 +1,9 @@
1
- import {html, LitElement, css, PropertyValues} from "lit";
2
- import {customElement, query, state, property} from "lit/decorators.js";
1
+ import { html, LitElement, css, PropertyValues } from "lit";
2
+ import { customElement, query, state, property } from "lit/decorators.js";
3
3
 
4
- import HTML, {SearchableDomElement} from "@supersoniks/concorde/core/utils/HTML";
4
+ import HTML, {
5
+ SearchableDomElement,
6
+ } from "@supersoniks/concorde/core/utils/HTML";
5
7
  // Toast
6
8
  type PopPlacement = "bottom" | "top" | "right" | "left";
7
9
  const tagName = "sonic-pop";
@@ -15,6 +17,7 @@ export class Pop extends LitElement {
15
17
  display: inline-block;
16
18
  vertical-align: middle;
17
19
  }
20
+
18
21
  slot[name="content"] {
19
22
  max-width: 80vw;
20
23
  background-color: var(--sc-base);
@@ -66,19 +69,26 @@ export class Pop extends LitElement {
66
69
  @state() open = false;
67
70
  @query("slot:not([name=content])") popBtn!: HTMLElement;
68
71
  @query("slot[name=content]") popContent!: HTMLElement;
69
- @property({type: Boolean}) noToggle = false;
70
- @property({type: Boolean, reflect: true}) inline = false;
72
+ @property({ type: Boolean }) noToggle = false;
73
+ @property({ type: Boolean, reflect: true }) inline = false;
71
74
 
72
75
  /**
73
76
  * Ombre
74
77
  */
75
- @property({type: String, reflect: true}) shadow: "" | "none" | "sm" | "md" | "lg" = "lg";
76
-
77
- @property({type: String}) placement: PopPlacement = "bottom";
78
+ @property({ type: String, reflect: true }) shadow:
79
+ | ""
80
+ | "none"
81
+ | "sm"
82
+ | "md"
83
+ | "lg" = "lg";
84
+
85
+ @property({ type: String }) placement: PopPlacement = "bottom";
78
86
  positioningRuns = false;
79
87
  lastContentX = 0;
80
88
  lastContentY = 0;
81
- resizeObserver: ResizeObserver = new ResizeObserver(() => this.computePosition(this.placement));
89
+ resizeObserver: ResizeObserver = new ResizeObserver(() =>
90
+ this.computePosition(this.placement)
91
+ );
82
92
 
83
93
  runPositioningLoop() {
84
94
  if (!this.positioningRuns) return;
@@ -90,7 +100,8 @@ export class Pop extends LitElement {
90
100
  toggle(e: Event) {
91
101
  if (this.open && this.noToggle) return;
92
102
  const keyboardEvent = e as KeyboardEvent;
93
- if (e.type == "keydown" && (keyboardEvent.key != "ArrowDown" || this.open)) return;
103
+ if (e.type == "keydown" && (keyboardEvent.key != "ArrowDown" || this.open))
104
+ return;
94
105
  this.open = !this.open;
95
106
  this.open ? this.show() : this.hide();
96
107
  }
@@ -131,7 +142,10 @@ export class Pop extends LitElement {
131
142
  //n'appliquer l'ajout du style "position:relative" que si il n'est pas déjà présent dans le style calculé
132
143
  const computedStyle = getComputedStyle(htmlElement);
133
144
 
134
- if (computedStyle.position !== "relative" && computedStyle.position !== "absolute") {
145
+ if (
146
+ computedStyle.position !== "relative" &&
147
+ computedStyle.position !== "absolute"
148
+ ) {
135
149
  style.position = "relative";
136
150
  }
137
151
 
@@ -156,10 +170,17 @@ export class Pop extends LitElement {
156
170
 
157
171
  Pop.pops.forEach((pop: Pop) => {
158
172
  const popContainsTarget = path.includes(pop);
159
- const popContentContainsTarget = path.includes(pop.querySelector('[slot="content"]') as EventTarget);
160
- const isCloseManual = HTML.getAncestorAttributeValue(target, "data-on-select") === "keep";
173
+ const popContentContainsTarget = path.includes(
174
+ pop.querySelector('[slot="content"]') as EventTarget
175
+ );
176
+ const isCloseManual =
177
+ HTML.getAncestorAttributeValue(target, "data-on-select") === "keep";
161
178
  if (e.type == "pointerdown" && popContainsTarget) return;
162
- if (e.type == "click" && ((popContainsTarget && isCloseManual) || !popContentContainsTarget)) return;
179
+ if (
180
+ e.type == "click" &&
181
+ ((popContainsTarget && isCloseManual) || !popContentContainsTarget)
182
+ )
183
+ return;
163
184
  pop.hide();
164
185
  });
165
186
  }
@@ -244,8 +265,16 @@ export class Pop extends LitElement {
244
265
  contentRect = this.popContent?.getBoundingClientRect();
245
266
  if (contentRect.x < shiftPadding && placement == "left") x = xRight;
246
267
  if (contentRect.y < shiftPadding && placement == "top") y = yBottom;
247
- if (contentRect.x + contentRect.width > window.innerWidth - shiftPadding && placement == "right") x = xLeft;
248
- if (contentRect.y + contentRect.height > window.innerHeight - shiftPadding && placement == "bottom") y = yTop;
268
+ if (
269
+ contentRect.x + contentRect.width > window.innerWidth - shiftPadding &&
270
+ placement == "right"
271
+ )
272
+ x = xLeft;
273
+ if (
274
+ contentRect.y + contentRect.height > window.innerHeight - shiftPadding &&
275
+ placement == "bottom"
276
+ )
277
+ y = yTop;
249
278
 
250
279
  this.lastContentX += x - contentRect.x;
251
280
  this.lastContentY += y - contentRect.y;
@@ -263,10 +292,12 @@ export class Pop extends LitElement {
263
292
  this.lastContentY += -contentRect.y;
264
293
  }
265
294
  if (contentRect.x + contentRect.width > window.innerWidth) {
266
- this.lastContentX += window.innerWidth - (contentRect.x + contentRect.width);
295
+ this.lastContentX +=
296
+ window.innerWidth - (contentRect.x + contentRect.width);
267
297
  }
268
298
  if (contentRect.y + contentRect.height > window.innerHeight) {
269
- this.lastContentY += window.innerHeight - (contentRect.y + contentRect.height);
299
+ this.lastContentY +=
300
+ window.innerHeight - (contentRect.y + contentRect.height);
270
301
  }
271
302
 
272
303
  Object.assign(this.popContent.style, {
@@ -277,7 +308,11 @@ export class Pop extends LitElement {
277
308
 
278
309
  render() {
279
310
  return html`
280
- <slot @click=${this.toggle} @keydown=${this.toggle} class="contents"></slot>
311
+ <slot
312
+ @click=${this.toggle}
313
+ @keydown=${this.toggle}
314
+ class="contents"
315
+ ></slot>
281
316
  <slot
282
317
  name="content"
283
318
  tabindex="-1"