@cyrilld/zestds 0.1.0 → 1.0.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.
- package/README.md +1156 -48
- package/dist/cursors.cjs +2 -1
- package/dist/cursors.cjs.map +1 -1
- package/dist/cursors.d.cts +0 -1
- package/dist/cursors.d.ts +0 -1
- package/dist/cursors.js +2 -1
- package/dist/cursors.js.map +1 -1
- package/dist/flags.cjs +2 -1
- package/dist/flags.cjs.map +1 -1
- package/dist/flags.d.cts +1 -2
- package/dist/flags.d.ts +1 -2
- package/dist/flags.js +2 -1
- package/dist/flags.js.map +1 -1
- package/dist/index.cjs +704 -7
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +1498 -5
- package/dist/index.css.map +1 -1
- package/dist/index.d.cts +665 -6
- package/dist/index.d.ts +665 -6
- package/dist/index.js +684 -7
- package/dist/index.js.map +1 -1
- package/package.json +12 -4
package/dist/index.js
CHANGED
|
@@ -24,7 +24,7 @@ var ZEST_ICONS = [
|
|
|
24
24
|
{ name: "trash-01", category: "G\xE9n\xE9ral", mode: "remplissage", style: "trait", paths: [{ d: "M19.6871 7L18.8681 20.11C18.8024 21.1702 17.8161 22 16.6215 22H7.3785C6.18393 22 5.19758 21.1702 5.13187 20.11L4.31288 7H4.125C3.50368 7 3 6.55228 3 6V3C3 2.44772 3.50368 2 4.125 2H19.875C20.4963 2 21 2.44772 21 3V6C21 6.55228 20.4963 7 19.875 7H19.6871ZM17.8583 7H6.67114L7.50728 20H17.0221L17.8583 7V7ZM5.31617 4.00002V5.00001H19.2132V4.00002H5.31617ZM9.94852 9C10.5881 9 11.1066 9.44771 11.1066 10V17C11.1066 17.5523 10.5881 18 9.94852 18C9.30893 18 8.79044 17.5523 8.79044 17V10C8.79044 9.44771 9.30893 9 9.94852 9ZM14.5809 9C15.2205 9 15.739 9.44771 15.739 10V17C15.739 17.5523 15.2205 18 14.5809 18C13.9413 18 13.4228 17.5523 13.4228 17V10C13.4228 9.44771 13.9413 9 14.5809 9Z", rule: "evenodd" }] },
|
|
25
25
|
{ name: "trash-02", category: "G\xE9n\xE9ral", mode: "remplissage", style: "trait", paths: [{ d: "M19.6253 7.99999L18.8681 20.11C18.8024 21.1702 17.8161 22 16.6215 22H7.37851C6.18393 22 5.19758 21.1702 5.13188 20.11L4.37476 7.99999H19.6253ZM4.125 2H19.875C20.4963 2 21 2.44772 21 3V5C21 5.55229 20.4963 6 19.875 6H4.125C3.50368 6 3 5.55229 3 5V3C3 2.44772 3.50368 2 4.125 2ZM9.75 10C9.12868 10 8.625 10.4477 8.625 11V18C8.625 18.5523 9.12868 19 9.75 19C10.3713 19 10.875 18.5523 10.875 18V11C10.875 10.4477 10.3713 10 9.75 10ZM14.25 10C13.6287 10 13.125 10.4477 13.125 11V18C13.125 18.5523 13.6287 19 14.25 19C14.8713 19 15.375 18.5523 15.375 18V11C15.375 10.4477 14.8713 10 14.25 10Z", rule: "evenodd" }] },
|
|
26
26
|
{ name: "check-circle-01", category: "G\xE9n\xE9ral", mode: "remplissage", style: "trait", paths: [{ d: "M12 22C6.477 22 2 17.523 2 12C2 6.477 6.477 2 12 2C17.523 2 22 6.477 22 12C22 17.523 17.523 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM10.0108 15.7425C10.1761 15.9078 10.4005 16.0005 10.6343 16C10.8681 16.0005 11.0925 15.9078 11.2578 15.7425L17.4947 9.50561C17.839 9.16101 17.8388 8.6025 17.4942 8.25814C17.1496 7.91379 16.5911 7.91398 16.2468 8.25858L10.6334 13.8702L7.51584 10.7526C7.29425 10.5235 6.96629 10.4318 6.65801 10.5128C6.34973 10.5937 6.1091 10.8346 6.02861 11.143C5.94812 11.4514 6.04029 11.7793 6.2697 12.0005L10.0108 15.7425Z", rule: "evenodd" }] },
|
|
27
|
-
// check-circle-02 : aplat et forme blanche réunis en un tracé evenodd, pour que l
|
|
27
|
+
// check-circle-02 : aplat et forme blanche réunis en un tracé evenodd, pour que l'icône suive la couleur du texte
|
|
28
28
|
{ name: "check-circle-02", category: "G\xE9n\xE9ral", mode: "remplissage", style: "plein", paths: [{ d: "M12 22C6.477 22 2 17.523 2 12C2 6.477 6.477 2 12 2C17.523 2 22 6.477 22 12C22 17.523 17.523 22 12 22Z M10.4489 16.08C10.2245 16.0805 10.0091 15.9915 9.85034 15.8328L6.25891 12.2405C6.03868 12.0281 5.95019 11.7134 6.02746 11.4173C6.10473 11.1213 6.33574 10.8899 6.63169 10.8122C6.92764 10.7345 7.24248 10.8226 7.45521 11.0425L10.4481 14.0354L15.8369 8.64824C16.1675 8.31742 16.7036 8.31723 17.0345 8.64781C17.3653 8.97839 17.3655 9.51456 17.0349 9.84538L11.0475 15.8328C10.8888 15.9915 10.6734 16.0805 10.4489 16.08Z", rule: "evenodd" }] },
|
|
29
29
|
{ name: "x-circle", category: "G\xE9n\xE9ral", mode: "contour", style: "trait", paths: [{ d: "M15 9L9 15M9 9L15 15M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" }], keywords: ["x", "close", "exit", "remove", "cross", "delete", "circle"] },
|
|
30
30
|
{ name: "smart-org", category: "G\xE9n\xE9ral", mode: "remplissage", style: "trait", paths: [{ d: "M4 16V20H8V16H4ZM16 13H8C7.44772 13 7 13.4477 7 14H8C9.10457 14 10 14.8954 10 16V20C10 21.1046 9.10457 22 8 22H4C2.89543 22 2 21.1046 2 20V16C2 14.8954 2.89543 14 4 14H5C5 12.3431 6.34315 11 8 11H11V10H10C8.89543 10 8 9.10457 8 8V4C8 2.89543 8.89543 2 10 2H14C15.1046 2 16 2.89543 16 4V8C16 9.10457 15.1046 10 14 10H13V11H16C17.6569 11 19 12.3431 19 14H20C21.1046 14 22 14.8954 22 16V20C22 21.1046 21.1046 22 20 22H16C14.8954 22 14 21.1046 14 20V16C14 14.8954 14.8954 14 16 14H17C17 13.4477 16.5523 13 16 13ZM10 4V8H14V4H10ZM16 16V20H20V16H16Z", rule: "evenodd" }] },
|
|
@@ -103,6 +103,8 @@ var ZEST_ICONS = [
|
|
|
103
103
|
{ name: "message-chat-square", category: "Communication", mode: "contour", style: "trait", paths: [{ d: "M10 15L6.92474 18.1137C6.49579 18.548 6.28131 18.7652 6.09695 18.7805C5.93701 18.7938 5.78042 18.7295 5.67596 18.6076C5.55556 18.4672 5.55556 18.162 5.55556 17.5515V15.9916C5.55556 15.444 5.10707 15.0477 4.5652 14.9683C3.25374 14.7762 2.22378 13.7463 2.03168 12.4348C2 12.2186 2 11.9605 2 11.4444V6.8C2 5.11984 2 4.27976 2.32698 3.63803C2.6146 3.07354 3.07354 2.6146 3.63803 2.32698C4.27976 2 5.11984 2 6.8 2H14.2C15.8802 2 16.7202 2 17.362 2.32698C17.9265 2.6146 18.3854 3.07354 18.673 3.63803C19 4.27976 19 5.11984 19 6.8V11M19 22L16.8236 20.4869C16.5177 20.2742 16.3647 20.1678 16.1982 20.0924C16.0504 20.0255 15.8951 19.9768 15.7356 19.9474C15.5558 19.9143 15.3695 19.9143 14.9969 19.9143H13.2C12.0799 19.9143 11.5198 19.9143 11.092 19.6963C10.7157 19.5046 10.4097 19.1986 10.218 18.8223C10 18.3944 10 17.8344 10 16.7143V14.2C10 13.0799 10 12.5198 10.218 12.092C10.4097 11.7157 10.7157 11.4097 11.092 11.218C11.5198 11 12.0799 11 13.2 11H18.8C19.9201 11 20.4802 11 20.908 11.218C21.2843 11.4097 21.5903 11.7157 21.782 12.092C22 12.5198 22 13.0799 22 14.2V16.9143C22 17.8462 22 18.3121 21.8478 18.6797C21.6448 19.1697 21.2554 19.5591 20.7654 19.762C20.3978 19.9143 19.9319 19.9143 19 19.9143V22Z" }], keywords: ["message", "chat", "live chat"] },
|
|
104
104
|
{ name: "send-01", category: "Communication", mode: "contour", style: "trait", paths: [{ d: "M10.4995 13.5001L20.9995 3.00005M10.6271 13.8281L13.2552 20.5861C13.4867 21.1815 13.6025 21.4791 13.7693 21.566C13.9139 21.6414 14.0862 21.6415 14.2308 21.5663C14.3977 21.4796 14.5139 21.1821 14.7461 20.587L21.3364 3.69925C21.5461 3.16207 21.6509 2.89348 21.5935 2.72185C21.5437 2.5728 21.4268 2.45583 21.2777 2.40604C21.1061 2.34871 20.8375 2.45352 20.3003 2.66315L3.41258 9.25349C2.8175 9.48572 2.51997 9.60183 2.43326 9.76873C2.35809 9.91342 2.35819 10.0857 2.43353 10.2303C2.52043 10.3971 2.81811 10.5128 3.41345 10.7444L10.1715 13.3725C10.2923 13.4195 10.3527 13.443 10.4036 13.4793C10.4487 13.5114 10.4881 13.5509 10.5203 13.596C10.5566 13.6468 10.5801 13.7073 10.6271 13.8281Z" }], keywords: ["send", "mail", "message", "chat"] },
|
|
105
105
|
{ name: "inbox-01", category: "Communication", mode: "contour", style: "trait", paths: [{ d: "M2.5 12H5.88197C6.56717 12 7.19357 12.3871 7.5 13C7.80643 13.6129 8.43283 14 9.11803 14H14.882C15.5672 14 16.1936 13.6129 16.5 13C16.8064 12.3871 17.4328 12 18.118 12H21.5M8.96656 4H15.0334C16.1103 4 16.6487 4 17.1241 4.16396C17.5445 4.30896 17.9274 4.5456 18.2451 4.85675C18.6043 5.2086 18.8451 5.6902 19.3267 6.65337L21.4932 10.9865C21.6822 11.3645 21.7767 11.5535 21.8434 11.7515C21.9026 11.9275 21.9453 12.1085 21.971 12.2923C22 12.4992 22 12.7105 22 13.1331V15.2C22 16.8802 22 17.7202 21.673 18.362C21.3854 18.9265 20.9265 19.3854 20.362 19.673C19.7202 20 18.8802 20 17.2 20H6.8C5.11984 20 4.27976 20 3.63803 19.673C3.07354 19.3854 2.6146 18.9265 2.32698 18.362C2 17.7202 2 16.8802 2 15.2V13.1331C2 12.7105 2 12.4992 2.02897 12.2923C2.05471 12.1085 2.09744 11.9275 2.15662 11.7515C2.22326 11.5535 2.31776 11.3645 2.50675 10.9865L4.67331 6.65337C5.1549 5.69019 5.3957 5.2086 5.75495 4.85675C6.07263 4.5456 6.45551 4.30896 6.87589 4.16396C7.35125 4 7.88969 4 8.96656 4Z" }], keywords: ["inbox", "tray", "mailbox", "mail"] },
|
|
106
|
+
{ name: "message-alert-square-01", category: "Communication", mode: "contour", style: "trait", paths: [{ d: "M12 10.5V7M12 14H12.01M7 18V20.3355C7 20.8684 7 21.1348 7.10923 21.2716C7.20422 21.3906 7.34827 21.4599 7.50054 21.4597C7.67563 21.4595 7.88367 21.2931 8.29976 20.9602L10.6852 19.0518C11.1725 18.662 11.4162 18.4671 11.6875 18.3285C11.9282 18.2055 12.1844 18.1156 12.4492 18.0613C12.7477 18 13.0597 18 13.6837 18H16.2C17.8802 18 18.7202 18 19.362 17.673C19.9265 17.3854 20.3854 16.9265 20.673 16.362C21 15.7202 21 14.8802 21 13.2V7.8C21 6.11984 21 5.27976 20.673 4.63803C20.3854 4.07354 19.9265 3.6146 19.362 3.32698C18.7202 3 17.8802 3 16.2 3H7.8C6.11984 3 5.27976 3 4.63803 3.32698C4.07354 3.6146 3.6146 4.07354 3.32698 4.63803C3 5.27976 3 6.11984 3 7.8V14C3 14.93 3 15.395 3.10222 15.7765C3.37962 16.8117 4.18827 17.6204 5.22354 17.8978C5.60504 18 6.07003 18 7 18Z" }], keywords: ["message", "alert", "chat", "notification"] },
|
|
107
|
+
{ name: "message-alert-square-02", category: "Communication", mode: "remplissage", style: "plein", paths: [{ d: "M16.2414 2H7.7588C6.95383 1.99999 6.28946 1.99998 5.74827 2.04419C5.18617 2.09012 4.66947 2.18868 4.18413 2.43597C3.43149 2.81947 2.81956 3.43139 2.43607 4.18404C2.18878 4.66937 2.09022 5.18608 2.04429 5.74818C2.00007 6.28937 2.00008 6.95373 2.0001 7.7587L2.00005 14.1376C1.99962 14.933 1.9993 15.5236 2.13639 16.0353C2.50626 17.4156 3.58445 18.4938 4.96482 18.8637C5.27229 18.9461 5.60829 18.9789 6.0001 18.9918L6.00009 20.371C6.00005 20.6062 6 20.846 6.01785 21.0425C6.03492 21.2305 6.08012 21.5852 6.32778 21.8955C6.61276 22.2525 7.0449 22.4602 7.50172 22.4597C7.8987 22.4593 8.20394 22.273 8.36137 22.1689C8.52597 22.06 8.7132 21.9102 8.89688 21.7632L11.31 19.8327C11.8286 19.4178 11.9826 19.3007 12.1425 19.219C12.303 19.137 12.4738 19.0771 12.6504 19.0408C12.8263 19.0047 13.0197 19 13.6838 19H16.2414C17.0464 19 17.7107 19 18.2519 18.9558C18.814 18.9099 19.3307 18.8113 19.8161 18.564C20.5687 18.1805 21.1806 17.5686 21.5641 16.816C21.8114 16.3306 21.91 15.8139 21.9559 15.2518C22.0001 14.7106 22.0001 14.0463 22.0001 13.2413V7.75868C22.0001 6.95372 22.0001 6.28936 21.9559 5.74818C21.91 5.18608 21.8114 4.66937 21.5641 4.18404C21.1806 3.43139 20.5687 2.81947 19.8161 2.43597C19.3307 2.18868 18.814 2.09012 18.2519 2.04419C17.7107 1.99998 17.0464 1.99999 16.2414 2ZM13 7C13 6.44772 12.5523 6 12 6C11.4477 6 11 6.44772 11 7V10.5C11 11.0523 11.4477 11.5 12 11.5C12.5523 11.5 13 11.0523 13 10.5V7ZM12 13C11.4477 13 11 13.4477 11 14C11 14.5523 11.4477 15 12 15H12.01C12.5623 15 13.01 14.5523 13.01 14C13.01 13.4477 12.5623 13 12.01 13H12Z", rule: "evenodd" }], keywords: ["message", "alert", "chat", "notification"] },
|
|
106
108
|
{ name: "circle", category: "Forme", mode: "contour", style: "trait", paths: [{ d: "M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z" }], keywords: ["circle", "shape"] },
|
|
107
109
|
{ name: "bar-chart-square-02", category: "Charts", mode: "contour", style: "trait", paths: [{ d: "M8 15V17M12 11V17M16 7V17M7.8 21H16.2C17.8802 21 18.7202 21 19.362 20.673C19.9265 20.3854 20.3854 19.9265 20.673 19.362C21 18.7202 21 17.8802 21 16.2V7.8C21 6.11984 21 5.27976 20.673 4.63803C20.3854 4.07354 19.9265 3.6146 19.362 3.32698C18.7202 3 17.8802 3 16.2 3H7.8C6.11984 3 5.27976 3 4.63803 3.32698C4.07354 3.6146 3.6146 4.07354 3.32698 4.63803C3 5.27976 3 6.11984 3 7.8V16.2C3 17.8802 3 18.7202 3.32698 19.362C3.6146 19.9265 4.07354 20.3854 4.63803 20.673C5.27976 21 6.11984 21 7.8 21Z" }], keywords: ["bar", "chart", "square", "barchart", "graph", "data"] },
|
|
108
110
|
{ name: "arrow-down", category: "Fl\xE8ches", mode: "contour", style: "trait", paths: [{ d: "M12 5V19M5 12L12 19L19 12" }], keywords: ["arrow", "down"] },
|
|
@@ -139,7 +141,8 @@ var STYLES_A_REVOIR = [
|
|
|
139
141
|
{ name: "plus", pourquoi: "une croix n'a ni creux ni plein" },
|
|
140
142
|
{ name: "tick", pourquoi: "une coche n'a ni creux ni plein" }
|
|
141
143
|
];
|
|
142
|
-
var
|
|
144
|
+
var ZEST_ICON_BY_NAME = new Map(ZEST_ICONS.map((icon) => [icon.name, icon]));
|
|
145
|
+
var findIcon = (name) => ZEST_ICON_BY_NAME.get(name);
|
|
143
146
|
|
|
144
147
|
// src/components/foundations/icons/index.tsx
|
|
145
148
|
import { jsx } from "react/jsx-runtime";
|
|
@@ -266,6 +269,8 @@ var LockUnlocked01 = icone("lock-unlocked-01");
|
|
|
266
269
|
var MessageChatSquare = icone("message-chat-square");
|
|
267
270
|
var Send01 = icone("send-01");
|
|
268
271
|
var Inbox01 = icone("inbox-01");
|
|
272
|
+
var MessageAlertSquare01 = icone("message-alert-square-01");
|
|
273
|
+
var MessageAlertSquare02 = icone("message-alert-square-02");
|
|
269
274
|
var Circle = icone("circle");
|
|
270
275
|
var BarChartSquare02 = icone("bar-chart-square-02");
|
|
271
276
|
var ArrowDown = icone("arrow-down");
|
|
@@ -286,6 +291,657 @@ var ChevronLeft = icone("chevron-left");
|
|
|
286
291
|
var ChevronRight = icone("chevron-right");
|
|
287
292
|
var ChevronUp = icone("chevron-up");
|
|
288
293
|
|
|
294
|
+
// src/components/base/Button/Button.tsx
|
|
295
|
+
import { forwardRef as forwardRef2 } from "react";
|
|
296
|
+
|
|
297
|
+
// src/components/base/Spinner/Spinner.tsx
|
|
298
|
+
import { forwardRef } from "react";
|
|
299
|
+
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
300
|
+
var Spinner = forwardRef(
|
|
301
|
+
({ size = "sm", label, className, ...rest }, ref) => {
|
|
302
|
+
const classes = ["zds-spinner", `zds-spinner--${size}`, className].filter(Boolean).join(" ");
|
|
303
|
+
return /* @__PURE__ */ jsxs(
|
|
304
|
+
"span",
|
|
305
|
+
{
|
|
306
|
+
ref,
|
|
307
|
+
className: classes,
|
|
308
|
+
role: label ? "status" : void 0,
|
|
309
|
+
"aria-hidden": label ? void 0 : true,
|
|
310
|
+
...rest,
|
|
311
|
+
children: [
|
|
312
|
+
/* @__PURE__ */ jsxs("svg", { className: "zds-spinner__svg", viewBox: "0 0 24 24", fill: "none", children: [
|
|
313
|
+
/* @__PURE__ */ jsx2(
|
|
314
|
+
"circle",
|
|
315
|
+
{
|
|
316
|
+
className: "zds-spinner__track",
|
|
317
|
+
cx: "12",
|
|
318
|
+
cy: "12",
|
|
319
|
+
r: "9",
|
|
320
|
+
stroke: "currentColor",
|
|
321
|
+
strokeWidth: "2.5"
|
|
322
|
+
}
|
|
323
|
+
),
|
|
324
|
+
/* @__PURE__ */ jsx2(
|
|
325
|
+
"path",
|
|
326
|
+
{
|
|
327
|
+
d: "M12 3a9 9 0 0 1 9 9",
|
|
328
|
+
stroke: "currentColor",
|
|
329
|
+
strokeWidth: "2.5",
|
|
330
|
+
strokeLinecap: "round"
|
|
331
|
+
}
|
|
332
|
+
)
|
|
333
|
+
] }),
|
|
334
|
+
label ? /* @__PURE__ */ jsx2("span", { className: "zds-spinner__label", children: label }) : null
|
|
335
|
+
]
|
|
336
|
+
}
|
|
337
|
+
);
|
|
338
|
+
}
|
|
339
|
+
);
|
|
340
|
+
Spinner.displayName = "Spinner";
|
|
341
|
+
|
|
342
|
+
// src/components/base/Button/Button.tsx
|
|
343
|
+
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
344
|
+
var dejaAverti = false;
|
|
345
|
+
var avertirUneFois = () => {
|
|
346
|
+
if (dejaAverti) return;
|
|
347
|
+
dejaAverti = true;
|
|
348
|
+
console.warn(
|
|
349
|
+
"[zestds] <Button> \xE0 ic\xF4ne seule sans nom accessible : ajouter `aria-label`. Un lecteur d'\xE9cran n'annoncera que \xAB bouton \xBB."
|
|
350
|
+
);
|
|
351
|
+
};
|
|
352
|
+
var Button = forwardRef2(
|
|
353
|
+
({
|
|
354
|
+
size = "md",
|
|
355
|
+
hierarchy = "primary",
|
|
356
|
+
iconLeading,
|
|
357
|
+
iconTrailing,
|
|
358
|
+
loading = false,
|
|
359
|
+
disabled = false,
|
|
360
|
+
className,
|
|
361
|
+
children,
|
|
362
|
+
onClick,
|
|
363
|
+
type = "button",
|
|
364
|
+
...rest
|
|
365
|
+
}, ref) => {
|
|
366
|
+
const iconOnly = children === void 0 || children === null || children === false || children === "";
|
|
367
|
+
if (iconOnly) {
|
|
368
|
+
const nomme = Boolean(rest["aria-label"]) || Boolean(rest["aria-labelledby"]) || Boolean(rest.title);
|
|
369
|
+
if (!nomme) avertirUneFois();
|
|
370
|
+
}
|
|
371
|
+
const classes = [
|
|
372
|
+
"zds-button",
|
|
373
|
+
`zds-button--${size}`,
|
|
374
|
+
`zds-button--${hierarchy}`,
|
|
375
|
+
iconOnly ? "zds-button--icon-only" : null,
|
|
376
|
+
loading ? "zds-button--loading" : null,
|
|
377
|
+
className
|
|
378
|
+
].filter(Boolean).join(" ");
|
|
379
|
+
const gererClic = (evenement) => {
|
|
380
|
+
if (loading) {
|
|
381
|
+
evenement.preventDefault();
|
|
382
|
+
evenement.stopPropagation();
|
|
383
|
+
return;
|
|
384
|
+
}
|
|
385
|
+
onClick?.(evenement);
|
|
386
|
+
};
|
|
387
|
+
const avant = loading ? /* @__PURE__ */ jsx3(Spinner, { size: "sm" }) : iconLeading;
|
|
388
|
+
return (
|
|
389
|
+
/* `{...rest}` passe AVANT les attributs que le composant possede.
|
|
390
|
+
Dans l autre ordre, un `aria-disabled={false}` recu de l appelant
|
|
391
|
+
ecrasait celui que `loading` vient de poser : le bouton se
|
|
392
|
+
declarait disponible pendant son envoi, et rien ne le signalait. */
|
|
393
|
+
/* @__PURE__ */ jsxs2(
|
|
394
|
+
"button",
|
|
395
|
+
{
|
|
396
|
+
ref,
|
|
397
|
+
...rest,
|
|
398
|
+
type,
|
|
399
|
+
className: classes,
|
|
400
|
+
disabled,
|
|
401
|
+
"aria-busy": loading || void 0,
|
|
402
|
+
"aria-disabled": loading || void 0,
|
|
403
|
+
onClick: gererClic,
|
|
404
|
+
children: [
|
|
405
|
+
avant ? /* @__PURE__ */ jsx3("span", { className: "zds-button__icon", children: avant }) : null,
|
|
406
|
+
iconOnly ? null : /* @__PURE__ */ jsx3("span", { className: "zds-button__label", children }),
|
|
407
|
+
iconTrailing && !loading ? /* @__PURE__ */ jsx3("span", { className: "zds-button__icon", children: iconTrailing }) : null
|
|
408
|
+
]
|
|
409
|
+
}
|
|
410
|
+
)
|
|
411
|
+
);
|
|
412
|
+
}
|
|
413
|
+
);
|
|
414
|
+
Button.displayName = "Button";
|
|
415
|
+
|
|
416
|
+
// src/components/base/CloseButton/CloseButton.tsx
|
|
417
|
+
import { forwardRef as forwardRef3 } from "react";
|
|
418
|
+
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
419
|
+
var CloseButton = forwardRef3(
|
|
420
|
+
({ size = "md", onDark = false, label = "Fermer", className, type = "button", ...rest }, ref) => {
|
|
421
|
+
const classes = [
|
|
422
|
+
"zds-close-button",
|
|
423
|
+
`zds-close-button--${size}`,
|
|
424
|
+
onDark ? "zds-close-button--on-dark" : null,
|
|
425
|
+
className
|
|
426
|
+
].filter(Boolean).join(" ");
|
|
427
|
+
return /* @__PURE__ */ jsx4("button", { ref, type, className: classes, "aria-label": label, ...rest, children: /* @__PURE__ */ jsx4("span", { className: "zds-close-button__icon", children: /* @__PURE__ */ jsx4(XClose, {}) }) });
|
|
428
|
+
}
|
|
429
|
+
);
|
|
430
|
+
CloseButton.displayName = "CloseButton";
|
|
431
|
+
|
|
432
|
+
// src/components/base/UtilityButton/UtilityButton.tsx
|
|
433
|
+
import { forwardRef as forwardRef4 } from "react";
|
|
434
|
+
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
435
|
+
var UtilityButton = forwardRef4(
|
|
436
|
+
({ size = "sm", hierarchy = "secondary", icon, label, className, type = "button", ...rest }, ref) => {
|
|
437
|
+
const classes = [
|
|
438
|
+
"zds-utility-button",
|
|
439
|
+
`zds-utility-button--${size}`,
|
|
440
|
+
`zds-utility-button--${hierarchy}`,
|
|
441
|
+
className
|
|
442
|
+
].filter(Boolean).join(" ");
|
|
443
|
+
return /* @__PURE__ */ jsx5("button", { ref, type, className: classes, "aria-label": label, ...rest, children: /* @__PURE__ */ jsx5("span", { className: "zds-utility-button__icon", children: icon }) });
|
|
444
|
+
}
|
|
445
|
+
);
|
|
446
|
+
UtilityButton.displayName = "UtilityButton";
|
|
447
|
+
|
|
448
|
+
// src/components/base/Badge/Badge.tsx
|
|
449
|
+
import { forwardRef as forwardRef5 } from "react";
|
|
450
|
+
import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
451
|
+
var dejaAverti2 = false;
|
|
452
|
+
var avertirUneFois2 = () => {
|
|
453
|
+
if (dejaAverti2) return;
|
|
454
|
+
dejaAverti2 = true;
|
|
455
|
+
console.warn(
|
|
456
|
+
"[zestds] <Badge onClose> sans nom accessible : passer `closeLabel`, ou un libell\xE9 textuel. Un lecteur d'\xE9cran n'annoncera que \xAB bouton \xBB."
|
|
457
|
+
);
|
|
458
|
+
};
|
|
459
|
+
var Badge = forwardRef5(
|
|
460
|
+
({
|
|
461
|
+
size = "md",
|
|
462
|
+
type = "badge",
|
|
463
|
+
color = "gray",
|
|
464
|
+
dot = false,
|
|
465
|
+
iconLeading,
|
|
466
|
+
iconTrailing,
|
|
467
|
+
onClose,
|
|
468
|
+
closeLabel,
|
|
469
|
+
className,
|
|
470
|
+
children,
|
|
471
|
+
...rest
|
|
472
|
+
}, ref) => {
|
|
473
|
+
const teteEstPoint = dot;
|
|
474
|
+
const teteEstIcone = !dot && Boolean(iconLeading);
|
|
475
|
+
const finEstCroix = Boolean(onClose);
|
|
476
|
+
const finEstIcone = !finEstCroix && Boolean(iconTrailing);
|
|
477
|
+
const classes = [
|
|
478
|
+
"zds-badge",
|
|
479
|
+
`zds-badge--${size}`,
|
|
480
|
+
`zds-badge--${type}`,
|
|
481
|
+
`zds-badge--${color}`,
|
|
482
|
+
teteEstPoint ? "zds-badge--lead-dot" : null,
|
|
483
|
+
teteEstIcone ? "zds-badge--lead-icon" : null,
|
|
484
|
+
finEstIcone ? "zds-badge--trail-icon" : null,
|
|
485
|
+
finEstCroix ? "zds-badge--trail-close" : null,
|
|
486
|
+
className
|
|
487
|
+
].filter(Boolean).join(" ");
|
|
488
|
+
const libelleTexte = typeof children === "string" ? children : null;
|
|
489
|
+
const nomCroix = closeLabel ?? (libelleTexte ? `Retirer ${libelleTexte}` : null);
|
|
490
|
+
if (onClose && !nomCroix) avertirUneFois2();
|
|
491
|
+
return /* @__PURE__ */ jsxs3("span", { ref, className: classes, ...rest, children: [
|
|
492
|
+
dot ? /* @__PURE__ */ jsx6("span", { className: "zds-badge__dot", "aria-hidden": "true" }) : null,
|
|
493
|
+
iconLeading ? /* @__PURE__ */ jsx6("span", { className: "zds-badge__icon zds-badge__icon--leading", "aria-hidden": "true", children: iconLeading }) : null,
|
|
494
|
+
children,
|
|
495
|
+
iconTrailing ? /* @__PURE__ */ jsx6("span", { className: "zds-badge__icon zds-badge__icon--trailing", "aria-hidden": "true", children: iconTrailing }) : null,
|
|
496
|
+
onClose ? /* @__PURE__ */ jsx6(
|
|
497
|
+
"button",
|
|
498
|
+
{
|
|
499
|
+
type: "button",
|
|
500
|
+
className: "zds-badge__close",
|
|
501
|
+
"aria-label": nomCroix ?? "Retirer",
|
|
502
|
+
onClick: onClose,
|
|
503
|
+
children: /* @__PURE__ */ jsx6(XClose, {})
|
|
504
|
+
}
|
|
505
|
+
) : null
|
|
506
|
+
] });
|
|
507
|
+
}
|
|
508
|
+
);
|
|
509
|
+
Badge.displayName = "Badge";
|
|
510
|
+
|
|
511
|
+
// src/components/base/Avatar/Avatar.tsx
|
|
512
|
+
import { Children, Fragment, cloneElement as cloneElement2, forwardRef as forwardRef7, isValidElement as isValidElement2, useEffect as useEffect2, useState as useState2 } from "react";
|
|
513
|
+
|
|
514
|
+
// src/components/base/Tooltip/Tooltip.tsx
|
|
515
|
+
import { cloneElement, forwardRef as forwardRef6, isValidElement, useEffect, useId, useRef, useState } from "react";
|
|
516
|
+
|
|
517
|
+
// src/components/base/Tooltip/TooltipArrow.tsx
|
|
518
|
+
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
519
|
+
var HAUTEUR_FLECHE = 8.51471;
|
|
520
|
+
var DEBORD_FLECHE = 6;
|
|
521
|
+
var LARGEUR_FLECHE = 16;
|
|
522
|
+
var TooltipArrow = (props) => /* @__PURE__ */ jsx7(
|
|
523
|
+
"svg",
|
|
524
|
+
{
|
|
525
|
+
viewBox: `0 0 ${LARGEUR_FLECHE} ${HAUTEUR_FLECHE}`,
|
|
526
|
+
width: LARGEUR_FLECHE,
|
|
527
|
+
height: HAUTEUR_FLECHE,
|
|
528
|
+
fill: "currentColor",
|
|
529
|
+
"aria-hidden": "true",
|
|
530
|
+
...props,
|
|
531
|
+
children: /* @__PURE__ */ jsx7("path", { d: "M14.0711 0C14.962 0 15.4081 1.07714 14.7782 1.70711L8.70711 7.77818C8.31658 8.16871 7.68342 8.16871 7.29289 7.77818L1.22183 1.70711C0.591867 1.07714 1.03803 0 1.92894 0H14.0711Z" })
|
|
532
|
+
}
|
|
533
|
+
);
|
|
534
|
+
|
|
535
|
+
// src/components/base/Tooltip/Tooltip.tsx
|
|
536
|
+
import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
537
|
+
var DEJA_FOCUSABLE = /* @__PURE__ */ new Set(["a", "button", "input", "select", "textarea", "summary"]);
|
|
538
|
+
var composer = (sien, notre) => (e) => {
|
|
539
|
+
sien?.(e);
|
|
540
|
+
notre(e);
|
|
541
|
+
};
|
|
542
|
+
var Tooltip = ({
|
|
543
|
+
title,
|
|
544
|
+
supportingText,
|
|
545
|
+
arrow = false,
|
|
546
|
+
placement = "top",
|
|
547
|
+
delay = 300,
|
|
548
|
+
closeDelay = 0,
|
|
549
|
+
isDisabled = false,
|
|
550
|
+
isOpen,
|
|
551
|
+
defaultOpen = false,
|
|
552
|
+
onOpenChange,
|
|
553
|
+
children
|
|
554
|
+
}) => {
|
|
555
|
+
const id = useId();
|
|
556
|
+
const [ouverteInterne, setOuverteInterne] = useState(defaultOpen);
|
|
557
|
+
const minuteur = useRef(null);
|
|
558
|
+
const pilote = isOpen !== void 0;
|
|
559
|
+
const ouverte = !isDisabled && (pilote ? isOpen : ouverteInterne);
|
|
560
|
+
const annuler = () => {
|
|
561
|
+
if (minuteur.current) clearTimeout(minuteur.current);
|
|
562
|
+
minuteur.current = null;
|
|
563
|
+
};
|
|
564
|
+
const basculer = (versOuverte, apres) => {
|
|
565
|
+
if (isDisabled || pilote) return;
|
|
566
|
+
annuler();
|
|
567
|
+
const agir = () => {
|
|
568
|
+
minuteur.current = null;
|
|
569
|
+
setOuverteInterne(versOuverte);
|
|
570
|
+
onOpenChange?.(versOuverte);
|
|
571
|
+
};
|
|
572
|
+
if (apres <= 0) agir();
|
|
573
|
+
else minuteur.current = setTimeout(agir, apres);
|
|
574
|
+
};
|
|
575
|
+
useEffect(() => annuler, []);
|
|
576
|
+
useEffect(() => {
|
|
577
|
+
if (!ouverte) return;
|
|
578
|
+
const surTouche = (e) => {
|
|
579
|
+
if (e.key === "Escape") {
|
|
580
|
+
annuler();
|
|
581
|
+
if (!pilote) setOuverteInterne(false);
|
|
582
|
+
onOpenChange?.(false);
|
|
583
|
+
}
|
|
584
|
+
};
|
|
585
|
+
document.addEventListener("keydown", surTouche);
|
|
586
|
+
return () => document.removeEventListener("keydown", surTouche);
|
|
587
|
+
}, [ouverte, pilote, onOpenChange]);
|
|
588
|
+
if (!isValidElement(children)) {
|
|
589
|
+
throw new Error("`Tooltip` attend UN \xE9l\xE9ment comme d\xE9clencheur, pas du texte ni plusieurs enfants.");
|
|
590
|
+
}
|
|
591
|
+
const propsEnfant = children.props;
|
|
592
|
+
const balise = typeof children.type === "string" ? children.type : null;
|
|
593
|
+
const doitRecevoirTabIndex = propsEnfant.tabIndex === void 0 && balise !== null && !DEJA_FOCUSABLE.has(balise);
|
|
594
|
+
const declencheur = cloneElement(children, {
|
|
595
|
+
/* Le survol attend le délai ; le focus clavier n'attend pas. Quelqu'un
|
|
596
|
+
qui tabule a DEMANDÉ l'élément, il ne le traverse pas. */
|
|
597
|
+
onMouseEnter: composer(propsEnfant.onMouseEnter, () => basculer(true, delay)),
|
|
598
|
+
onMouseLeave: composer(propsEnfant.onMouseLeave, () => basculer(false, closeDelay)),
|
|
599
|
+
onFocus: composer(propsEnfant.onFocus, () => basculer(true, 0)),
|
|
600
|
+
onBlur: composer(propsEnfant.onBlur, () => basculer(false, 0)),
|
|
601
|
+
...doitRecevoirTabIndex ? { tabIndex: 0 } : null,
|
|
602
|
+
/* ⚠️ `aria-describedby` NE DÉSIGNE LA BULLE QUE QUAND ELLE EXISTE. La
|
|
603
|
+
bulle n'est pas rendue au repos ; un `aria-describedby` qui pointerait
|
|
604
|
+
vers un identifiant absent est une référence morte, et les lecteurs
|
|
605
|
+
d'écran ne s'y comportent pas tous pareil. */
|
|
606
|
+
"aria-describedby": ouverte ? [propsEnfant["aria-describedby"], id].filter(Boolean).join(" ") : propsEnfant["aria-describedby"]
|
|
607
|
+
});
|
|
608
|
+
return /* @__PURE__ */ jsxs4("span", { className: "zds-tooltip-ancre", children: [
|
|
609
|
+
declencheur,
|
|
610
|
+
ouverte ? /* @__PURE__ */ jsxs4(
|
|
611
|
+
"span",
|
|
612
|
+
{
|
|
613
|
+
id,
|
|
614
|
+
role: "tooltip",
|
|
615
|
+
className: `zds-tooltip zds-tooltip--${placement}`,
|
|
616
|
+
"data-zds-placement": placement,
|
|
617
|
+
"data-zds-avec-soutien": supportingText ? "" : void 0,
|
|
618
|
+
children: [
|
|
619
|
+
/* @__PURE__ */ jsxs4("span", { className: "zds-tooltip__contenu", children: [
|
|
620
|
+
/* @__PURE__ */ jsx8("span", { className: "zds-tooltip__titre", children: title }),
|
|
621
|
+
supportingText ? /* @__PURE__ */ jsx8("span", { className: "zds-tooltip__soutien", children: supportingText }) : null
|
|
622
|
+
] }),
|
|
623
|
+
arrow ? /* @__PURE__ */ jsx8("span", { className: "zds-tooltip__fleche", children: /* @__PURE__ */ jsx8(TooltipArrow, {}) }) : null
|
|
624
|
+
]
|
|
625
|
+
}
|
|
626
|
+
) : null
|
|
627
|
+
] });
|
|
628
|
+
};
|
|
629
|
+
var NOEUD_ICONE_AIDE = "3167:12028";
|
|
630
|
+
var iconeAide = () => {
|
|
631
|
+
const ecartee = ZEST_ICONS_EN_CONFLIT.find((i) => i.node === NOEUD_ICONE_AIDE);
|
|
632
|
+
if (ecartee) return ecartee;
|
|
633
|
+
const publiee = findIcon("help-circle-01");
|
|
634
|
+
if (!publiee) throw new Error("`help-circle-01` est introuvable dans le catalogue : r\xE9g\xE9n\xE9rer depuis le Figma.");
|
|
635
|
+
return publiee;
|
|
636
|
+
};
|
|
637
|
+
var HelpTooltip = forwardRef6(({ label = "Aide", ...tooltip }, ref) => {
|
|
638
|
+
const entree = iconeAide();
|
|
639
|
+
const auContour = entree.mode === "contour";
|
|
640
|
+
return /* @__PURE__ */ jsx8(Tooltip, { ...tooltip, children: /* @__PURE__ */ jsx8("button", { ref, type: "button", className: "zds-tooltip-aide", "aria-label": label, children: /* @__PURE__ */ jsx8(
|
|
641
|
+
"svg",
|
|
642
|
+
{
|
|
643
|
+
viewBox: "0 0 24 24",
|
|
644
|
+
fill: auContour ? "none" : "currentColor",
|
|
645
|
+
stroke: auContour ? "currentColor" : void 0,
|
|
646
|
+
strokeWidth: auContour ? 2 : void 0,
|
|
647
|
+
strokeLinecap: auContour ? "round" : void 0,
|
|
648
|
+
strokeLinejoin: auContour ? "round" : void 0,
|
|
649
|
+
"aria-hidden": "true",
|
|
650
|
+
children: entree.paths.map((p) => /* @__PURE__ */ jsx8("path", { d: p.d, fillRule: p.rule, clipRule: p.rule }, p.d))
|
|
651
|
+
}
|
|
652
|
+
) }) });
|
|
653
|
+
});
|
|
654
|
+
HelpTooltip.displayName = "HelpTooltip";
|
|
655
|
+
|
|
656
|
+
// src/components/base/Avatar/AvatarMask.tsx
|
|
657
|
+
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
658
|
+
var AvatarMask = (props) => /* @__PURE__ */ jsx9("svg", { viewBox: "0 0 40 19", fill: "currentColor", "aria-hidden": "true", focusable: "false", ...props, children: /* @__PURE__ */ jsx9(
|
|
659
|
+
"path",
|
|
660
|
+
{
|
|
661
|
+
fillRule: "evenodd",
|
|
662
|
+
clipRule: "evenodd",
|
|
663
|
+
d: "M39.16 1.4484C39.1431 1.23426 39.0815 1.02581 38.9789 0.835984C38.8763 0.646155 38.735 0.479003 38.5637 0.344908C38.3924 0.210813 38.1948 0.112637 37.9832 0.0564726C37.7715 0.000308574 37.5503 -0.0126441 37.3333 0.0184199C33.8467 0.560378 25.68 3.72071 20 3.72071C14.32 3.72071 6.16 0.560378 2.66667 0.0184199C2.44868 -0.0146067 2.22608 -0.00313176 2.01285 0.0521236C1.79961 0.107379 1.60034 0.20522 1.42755 0.339505C1.25476 0.47379 1.11219 0.641618 1.00878 0.832447C0.905377 1.02328 0.843374 1.23298 0.826667 1.4484C0.553333 4.4455 0 12.4377 0 13.6457C0 15.2716 6.94667 19 12 19C16.9067 19 17.9 13.6457 20 13.6457C22.1 13.6457 23.0933 19 28 19C33.0533 19 40 15.2716 40 13.6457C40 12.4377 39.4467 4.4455 39.16 1.4484ZM15.3333 11.0078C14.6267 11.6607 12.6667 13.1038 10.2733 12.6467C7.88 12.1896 6.43333 10.0348 5.94 9.20558C5.8732 9.10431 5.84524 8.98311 5.86111 8.86354C5.87698 8.74398 5.93565 8.6338 6.02667 8.55262C6.73333 7.89966 8.69333 6.45662 11.0933 6.91369C13.4933 7.37076 14.9333 9.52553 15.4267 10.3548C15.4927 10.4568 15.5195 10.5785 15.5024 10.6981C15.4853 10.8177 15.4254 10.9274 15.3333 11.0078ZM34.0867 9.19905C33.5933 10.0544 32.1467 12.1831 29.7533 12.6402C27.36 13.0972 25.3867 11.6281 24.6667 11.0078C24.5746 10.9274 24.5147 10.8177 24.4976 10.6981C24.4805 10.5785 24.5073 10.4568 24.5733 10.3548C25.0667 9.49942 26.5133 7.37076 28.9067 6.91369C31.3 6.45662 33.2667 7.92578 33.9667 8.55262C34.0603 8.63013 34.1226 8.73792 34.1422 8.8565C34.1617 8.97507 34.1373 9.09659 34.0733 9.19905H34.0867Z"
|
|
664
|
+
}
|
|
665
|
+
) });
|
|
666
|
+
|
|
667
|
+
// src/components/base/Avatar/Avatar.tsx
|
|
668
|
+
import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
669
|
+
var NOM_DU_STATUT = {
|
|
670
|
+
online: "En ligne",
|
|
671
|
+
offline: "Hors ligne",
|
|
672
|
+
"sensitive-comment": "Commentaire sensible d\xE9tect\xE9"
|
|
673
|
+
};
|
|
674
|
+
var dejaAverti3 = false;
|
|
675
|
+
var avertirUneFois3 = () => {
|
|
676
|
+
if (dejaAverti3) return;
|
|
677
|
+
dejaAverti3 = true;
|
|
678
|
+
console.warn(
|
|
679
|
+
"[zestds] <Avatar anonymous status=\u2026> : le statut n'est pas rendu sur un avatar anonyme. Un point de pr\xE9sence sur une r\xE9ponse anonymis\xE9e en dirait trop."
|
|
680
|
+
);
|
|
681
|
+
};
|
|
682
|
+
var normaliserEnfantsDuGroupe = (children) => Children.toArray(children).flatMap(
|
|
683
|
+
(enfant) => isValidElement2(enfant) && enfant.type === Fragment ? normaliserEnfantsDuGroupe(enfant.props.children) : [enfant]
|
|
684
|
+
);
|
|
685
|
+
var Avatar = forwardRef7(
|
|
686
|
+
({
|
|
687
|
+
size = "md",
|
|
688
|
+
src,
|
|
689
|
+
alt = "",
|
|
690
|
+
initials,
|
|
691
|
+
anonymous = false,
|
|
692
|
+
border = false,
|
|
693
|
+
status,
|
|
694
|
+
statusLabel,
|
|
695
|
+
className,
|
|
696
|
+
...rest
|
|
697
|
+
}, ref) => {
|
|
698
|
+
const [photoEnEchec, setPhotoEnEchec] = useState2(false);
|
|
699
|
+
useEffect2(() => {
|
|
700
|
+
setPhotoEnEchec(false);
|
|
701
|
+
}, [src]);
|
|
702
|
+
const photo = !anonymous && Boolean(src) && !photoEnEchec;
|
|
703
|
+
const lettres = !anonymous && !photo && Boolean(initials);
|
|
704
|
+
const picto = !anonymous && !photo && !lettres;
|
|
705
|
+
const statutRendu = anonymous ? void 0 : status;
|
|
706
|
+
if (anonymous && status) avertirUneFois3();
|
|
707
|
+
const classes = [
|
|
708
|
+
"zds-avatar",
|
|
709
|
+
`zds-avatar--${size}`,
|
|
710
|
+
photo ? "zds-avatar--photo" : "zds-avatar--placeholder",
|
|
711
|
+
border ? "zds-avatar--border" : null,
|
|
712
|
+
className
|
|
713
|
+
].filter(Boolean).join(" ");
|
|
714
|
+
return /* @__PURE__ */ jsxs5("span", { ref, className: classes, ...rest, children: [
|
|
715
|
+
/* @__PURE__ */ jsxs5("span", { className: "zds-avatar__media", children: [
|
|
716
|
+
photo ? /* @__PURE__ */ jsx10(
|
|
717
|
+
"img",
|
|
718
|
+
{
|
|
719
|
+
className: "zds-avatar__image",
|
|
720
|
+
src,
|
|
721
|
+
alt,
|
|
722
|
+
onError: () => setPhotoEnEchec(true)
|
|
723
|
+
}
|
|
724
|
+
) : null,
|
|
725
|
+
lettres ? /* @__PURE__ */ jsx10("span", { className: "zds-avatar__initials", children: initials }) : null,
|
|
726
|
+
picto ? /* @__PURE__ */ jsx10("span", { className: "zds-avatar__icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx10(User01, {}) }) : null,
|
|
727
|
+
anonymous ? /* @__PURE__ */ jsx10("span", { className: "zds-avatar__mask", children: /* @__PURE__ */ jsx10(AvatarMask, {}) }) : null
|
|
728
|
+
] }),
|
|
729
|
+
statutRendu ? /* @__PURE__ */ jsx10(
|
|
730
|
+
"span",
|
|
731
|
+
{
|
|
732
|
+
className: `zds-avatar__status zds-avatar__status--${statutRendu}`,
|
|
733
|
+
role: "img",
|
|
734
|
+
"aria-label": statusLabel ?? NOM_DU_STATUT[statutRendu],
|
|
735
|
+
children: statutRendu === "sensitive-comment" ? /* @__PURE__ */ jsx10(MessageAlertSquare02, {}) : null
|
|
736
|
+
}
|
|
737
|
+
) : null
|
|
738
|
+
] });
|
|
739
|
+
}
|
|
740
|
+
);
|
|
741
|
+
Avatar.displayName = "Avatar";
|
|
742
|
+
var AvatarGroup = forwardRef7(
|
|
743
|
+
({ size = "md", max, onAdd, addLabel = "Ajouter une personne", className, children, ...rest }, ref) => {
|
|
744
|
+
const tous = normaliserEnfantsDuGroupe(children);
|
|
745
|
+
const visibles = typeof max === "number" ? tous.slice(0, max) : tous;
|
|
746
|
+
const restants = tous.length - visibles.length;
|
|
747
|
+
const classes = ["zds-avatar-group", `zds-avatar-group--${size}`, className].filter(Boolean).join(" ");
|
|
748
|
+
return /* @__PURE__ */ jsxs5("div", { ref, className: classes, ...rest, children: [
|
|
749
|
+
/* @__PURE__ */ jsxs5("div", { className: "zds-avatar-group__avatars", children: [
|
|
750
|
+
visibles.map((enfant, i) => (
|
|
751
|
+
/* ⚠️ LA TAILLE EST IMPOSÉE PAR `cloneElement`, ET UNE
|
|
752
|
+
PREMIÈRE VERSION CROYAIT LA POSER EN CSS. Elle mettait
|
|
753
|
+
la classe de taille du groupe sur une enveloppe, en
|
|
754
|
+
pariant que l'avatar en hériterait — sauf que l'avatar
|
|
755
|
+
déclare les mêmes propriétés sur LUI-MÊME, donc sa
|
|
756
|
+
propre classe gagnait et un `lg` glissé dans un groupe
|
|
757
|
+
`xs` restait un `lg`. La promesse était fausse et rien
|
|
758
|
+
ne le disait.
|
|
759
|
+
|
|
760
|
+
Les fragments sont d'abord ouverts récursivement, pour
|
|
761
|
+
que leurs avatars reçoivent bien la taille imposée. */
|
|
762
|
+
/* @__PURE__ */ jsx10("span", { className: "zds-avatar-group__slot", children: isValidElement2(enfant) ? cloneElement2(enfant, { size }) : enfant }, i)
|
|
763
|
+
)),
|
|
764
|
+
restants > 0 ? /* @__PURE__ */ jsx10("span", { className: "zds-avatar-group__slot", children: /* @__PURE__ */ jsx10(
|
|
765
|
+
Avatar,
|
|
766
|
+
{
|
|
767
|
+
size,
|
|
768
|
+
initials: `+${restants}`,
|
|
769
|
+
"aria-label": `${restants} de plus`,
|
|
770
|
+
role: "img"
|
|
771
|
+
}
|
|
772
|
+
) }) : null
|
|
773
|
+
] }),
|
|
774
|
+
onAdd ? (
|
|
775
|
+
/* ⚠️ LA BULLE NATIVE A ÉTÉ RETIRÉE LE 2026-09-10, remplacée
|
|
776
|
+
par le vrai composant. Ce bouton portait un `title`, la
|
|
777
|
+
bulle du NAVIGATEUR : lente à apparaître, non stylée, et
|
|
778
|
+
jamais annoncée au clavier. C'était un provisoire assumé,
|
|
779
|
+
inscrit comme tel dans le tableau du CLAUDE.md, et c'est
|
|
780
|
+
la seconde moitié du travail que ce tableau promet — le
|
|
781
|
+
jour où le composant existe, la doc ET le code livré
|
|
782
|
+
basculent dessus.
|
|
783
|
+
|
|
784
|
+
⚠️ L'`aria-label` RESTE, ET CE N'EST PAS UN DOUBLON. Une
|
|
785
|
+
info-bulle n'existe qu'au survol : un lecteur d'écran qui
|
|
786
|
+
parcourt la page hors survol ne la rencontre jamais. Un
|
|
787
|
+
bouton à icône seule a donc besoin des deux — le nom pour
|
|
788
|
+
être annoncé, la bulle pour être lu. */
|
|
789
|
+
/* @__PURE__ */ jsx10(Tooltip, { title: addLabel, children: /* @__PURE__ */ jsx10(
|
|
790
|
+
"button",
|
|
791
|
+
{
|
|
792
|
+
type: "button",
|
|
793
|
+
className: `zds-avatar-add zds-avatar-add--${size}`,
|
|
794
|
+
"aria-label": addLabel,
|
|
795
|
+
onClick: onAdd,
|
|
796
|
+
children: /* @__PURE__ */ jsx10(Plus, {})
|
|
797
|
+
}
|
|
798
|
+
) })
|
|
799
|
+
) : null
|
|
800
|
+
] });
|
|
801
|
+
}
|
|
802
|
+
);
|
|
803
|
+
AvatarGroup.displayName = "AvatarGroup";
|
|
804
|
+
var AvatarLabelGroup = forwardRef7(
|
|
805
|
+
({ size = "md", name, supportingText, src, initials, anonymous, status, statusLabel, className, ...rest }, ref) => {
|
|
806
|
+
const classes = ["zds-avatar-label-group", `zds-avatar-label-group--${size}`, className].filter(Boolean).join(" ");
|
|
807
|
+
return /* @__PURE__ */ jsxs5("div", { ref, className: classes, ...rest, children: [
|
|
808
|
+
/* @__PURE__ */ jsx10(
|
|
809
|
+
Avatar,
|
|
810
|
+
{
|
|
811
|
+
size,
|
|
812
|
+
border: true,
|
|
813
|
+
src,
|
|
814
|
+
initials,
|
|
815
|
+
anonymous,
|
|
816
|
+
status,
|
|
817
|
+
statusLabel,
|
|
818
|
+
alt: ""
|
|
819
|
+
}
|
|
820
|
+
),
|
|
821
|
+
/* @__PURE__ */ jsxs5("span", { className: "zds-avatar-label-group__text", children: [
|
|
822
|
+
/* @__PURE__ */ jsx10("span", { className: "zds-avatar-label-group__name", children: name }),
|
|
823
|
+
supportingText ? /* @__PURE__ */ jsx10("span", { className: "zds-avatar-label-group__support", children: supportingText }) : null
|
|
824
|
+
] })
|
|
825
|
+
] });
|
|
826
|
+
}
|
|
827
|
+
);
|
|
828
|
+
AvatarLabelGroup.displayName = "AvatarLabelGroup";
|
|
829
|
+
|
|
830
|
+
// src/components/base/Checkbox/Checkbox.tsx
|
|
831
|
+
import { forwardRef as forwardRef8, useEffect as useEffect3, useId as useId2, useRef as useRef2 } from "react";
|
|
832
|
+
import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
833
|
+
var Controle = ({
|
|
834
|
+
type,
|
|
835
|
+
size,
|
|
836
|
+
label,
|
|
837
|
+
hint,
|
|
838
|
+
className,
|
|
839
|
+
marque,
|
|
840
|
+
reference,
|
|
841
|
+
id: idFourni,
|
|
842
|
+
"aria-describedby": decritParFourni,
|
|
843
|
+
...rest
|
|
844
|
+
}) => {
|
|
845
|
+
const auto = useId2();
|
|
846
|
+
const id = idFourni ?? `zds-${type}-${auto}`;
|
|
847
|
+
const idAide = `${id}-aide`;
|
|
848
|
+
const classes = [
|
|
849
|
+
"zds-checkbox",
|
|
850
|
+
`zds-checkbox--${size ?? "sm"}`,
|
|
851
|
+
`zds-checkbox--${type}`,
|
|
852
|
+
className
|
|
853
|
+
].filter(Boolean).join(" ");
|
|
854
|
+
const decritPar = [decritParFourni, hint ? idAide : null].filter(Boolean).join(" ") || void 0;
|
|
855
|
+
return /* @__PURE__ */ jsxs6("div", { className: classes, children: [
|
|
856
|
+
/* @__PURE__ */ jsxs6("span", { className: "zds-checkbox__controle", children: [
|
|
857
|
+
/* @__PURE__ */ jsx11(
|
|
858
|
+
"input",
|
|
859
|
+
{
|
|
860
|
+
ref: reference,
|
|
861
|
+
id,
|
|
862
|
+
type,
|
|
863
|
+
className: "zds-checkbox__entree",
|
|
864
|
+
"aria-describedby": decritPar,
|
|
865
|
+
...rest
|
|
866
|
+
}
|
|
867
|
+
),
|
|
868
|
+
/* @__PURE__ */ jsx11("span", { className: "zds-checkbox__marque", "aria-hidden": "true", children: marque })
|
|
869
|
+
] }),
|
|
870
|
+
label || hint ? /* @__PURE__ */ jsxs6("span", { className: "zds-checkbox__textes", children: [
|
|
871
|
+
label ? /* @__PURE__ */ jsx11("label", { className: "zds-checkbox__libelle", htmlFor: id, children: label }) : null,
|
|
872
|
+
hint ? /* @__PURE__ */ jsx11("span", { className: "zds-checkbox__aide", id: idAide, children: hint }) : null
|
|
873
|
+
] }) : null
|
|
874
|
+
] });
|
|
875
|
+
};
|
|
876
|
+
var Checkbox = forwardRef8(
|
|
877
|
+
({ indeterminate = false, ...rest }, ref) => {
|
|
878
|
+
const interne = useRef2(null);
|
|
879
|
+
useEffect3(() => {
|
|
880
|
+
if (interne.current) interne.current.indeterminate = indeterminate;
|
|
881
|
+
});
|
|
882
|
+
return /* @__PURE__ */ jsx11(
|
|
883
|
+
Controle,
|
|
884
|
+
{
|
|
885
|
+
...rest,
|
|
886
|
+
type: "checkbox",
|
|
887
|
+
marque: indeterminate ? /* @__PURE__ */ jsx11(Minus, {}) : /* @__PURE__ */ jsx11(Check, {}),
|
|
888
|
+
reference: (noeud) => {
|
|
889
|
+
interne.current = noeud;
|
|
890
|
+
if (typeof ref === "function") ref(noeud);
|
|
891
|
+
else if (ref) ref.current = noeud;
|
|
892
|
+
}
|
|
893
|
+
}
|
|
894
|
+
);
|
|
895
|
+
}
|
|
896
|
+
);
|
|
897
|
+
Checkbox.displayName = "Checkbox";
|
|
898
|
+
var Radio = forwardRef8((props, ref) => /* @__PURE__ */ jsx11(Controle, { ...props, type: "radio", marque: null, reference: ref }));
|
|
899
|
+
Radio.displayName = "Radio";
|
|
900
|
+
|
|
901
|
+
// src/components/base/Toggle/Toggle.tsx
|
|
902
|
+
import { forwardRef as forwardRef9, useId as useId3 } from "react";
|
|
903
|
+
import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
904
|
+
var Toggle = forwardRef9(
|
|
905
|
+
({
|
|
906
|
+
size = "sm",
|
|
907
|
+
type = "default",
|
|
908
|
+
label,
|
|
909
|
+
hint,
|
|
910
|
+
className,
|
|
911
|
+
id: idFourni,
|
|
912
|
+
"aria-describedby": decritParFourni,
|
|
913
|
+
...rest
|
|
914
|
+
}, ref) => {
|
|
915
|
+
const auto = useId3();
|
|
916
|
+
const id = idFourni ?? `zds-toggle-${auto}`;
|
|
917
|
+
const idAide = `${id}-aide`;
|
|
918
|
+
const classes = ["zds-toggle", `zds-toggle--${size}`, `zds-toggle--${type}`, className].filter(Boolean).join(" ");
|
|
919
|
+
const decritPar = [decritParFourni, hint ? idAide : null].filter(Boolean).join(" ") || void 0;
|
|
920
|
+
return /* @__PURE__ */ jsxs7("div", { className: classes, children: [
|
|
921
|
+
/* @__PURE__ */ jsxs7("span", { className: "zds-toggle__controle", children: [
|
|
922
|
+
/* @__PURE__ */ jsx12(
|
|
923
|
+
"input",
|
|
924
|
+
{
|
|
925
|
+
ref,
|
|
926
|
+
id,
|
|
927
|
+
type: "checkbox",
|
|
928
|
+
role: "switch",
|
|
929
|
+
className: "zds-toggle__piste",
|
|
930
|
+
"aria-describedby": decritPar,
|
|
931
|
+
...rest
|
|
932
|
+
}
|
|
933
|
+
),
|
|
934
|
+
/* @__PURE__ */ jsx12("span", { className: "zds-toggle__bouton", "aria-hidden": "true" })
|
|
935
|
+
] }),
|
|
936
|
+
label || hint ? /* @__PURE__ */ jsxs7("span", { className: "zds-toggle__textes", children: [
|
|
937
|
+
label ? /* @__PURE__ */ jsx12("label", { className: "zds-toggle__libelle", htmlFor: id, children: label }) : null,
|
|
938
|
+
hint ? /* @__PURE__ */ jsx12("span", { className: "zds-toggle__aide", id: idAide, children: hint }) : null
|
|
939
|
+
] }) : null
|
|
940
|
+
] });
|
|
941
|
+
}
|
|
942
|
+
);
|
|
943
|
+
Toggle.displayName = "Toggle";
|
|
944
|
+
|
|
289
945
|
// src/components/foundations/file-icons/catalogue.ts
|
|
290
946
|
var ZEST_FILE_ICONS = [
|
|
291
947
|
{
|
|
@@ -559,14 +1215,15 @@ var ZEST_FILE_ICONS = [
|
|
|
559
1215
|
}
|
|
560
1216
|
}
|
|
561
1217
|
];
|
|
562
|
-
var
|
|
1218
|
+
var ZEST_FILE_ICON_BY_NAME = new Map(ZEST_FILE_ICONS.map((icon) => [icon.name, icon]));
|
|
1219
|
+
var findFileIcon = (name) => ZEST_FILE_ICON_BY_NAME.get(name);
|
|
563
1220
|
|
|
564
1221
|
// src/components/foundations/file-icons/index.tsx
|
|
565
|
-
import { jsx as
|
|
1222
|
+
import { jsx as jsx13 } from "react/jsx-runtime";
|
|
566
1223
|
var FileIcon = ({ name, variant = "default", size = 40, ...props }) => {
|
|
567
1224
|
const entree = findFileIcon(name);
|
|
568
1225
|
if (!entree) return null;
|
|
569
|
-
return /* @__PURE__ */
|
|
1226
|
+
return /* @__PURE__ */ jsx13(
|
|
570
1227
|
"svg",
|
|
571
1228
|
{
|
|
572
1229
|
width: size,
|
|
@@ -638,8 +1295,8 @@ var ZEST_LOGO = {
|
|
|
638
1295
|
};
|
|
639
1296
|
|
|
640
1297
|
// src/components/foundations/logo/index.tsx
|
|
641
|
-
import { jsx as
|
|
642
|
-
var rendre = (contenu, boite, { height, titre, style, ...props }, debord = false) => /* @__PURE__ */
|
|
1298
|
+
import { jsx as jsx14 } from "react/jsx-runtime";
|
|
1299
|
+
var rendre = (contenu, boite, { height, titre, style, ...props }, debord = false) => /* @__PURE__ */ jsx14(
|
|
643
1300
|
"svg",
|
|
644
1301
|
{
|
|
645
1302
|
height,
|
|
@@ -678,17 +1335,24 @@ export {
|
|
|
678
1335
|
ArrowNarrowUpLeft,
|
|
679
1336
|
ArrowNarrowUpRight,
|
|
680
1337
|
ArrowRight,
|
|
1338
|
+
Avatar,
|
|
1339
|
+
AvatarGroup,
|
|
1340
|
+
AvatarLabelGroup,
|
|
1341
|
+
AvatarMask,
|
|
1342
|
+
Badge,
|
|
681
1343
|
BarChartSquare02,
|
|
682
1344
|
Bell01,
|
|
683
1345
|
BellOff01,
|
|
684
1346
|
Bookmark01,
|
|
685
1347
|
Building07,
|
|
1348
|
+
Button,
|
|
686
1349
|
Calendar,
|
|
687
1350
|
CalendarPlus01,
|
|
688
1351
|
Check,
|
|
689
1352
|
CheckCircle01,
|
|
690
1353
|
CheckCircle02,
|
|
691
1354
|
CheckDone01,
|
|
1355
|
+
Checkbox,
|
|
692
1356
|
ChevronDown,
|
|
693
1357
|
ChevronDownDouble,
|
|
694
1358
|
ChevronLeft,
|
|
@@ -699,6 +1363,8 @@ export {
|
|
|
699
1363
|
ChevronUpDouble,
|
|
700
1364
|
Circle,
|
|
701
1365
|
Clock,
|
|
1366
|
+
CloseButton,
|
|
1367
|
+
DEBORD_FLECHE,
|
|
702
1368
|
DotsVertical,
|
|
703
1369
|
Download01,
|
|
704
1370
|
Edit01,
|
|
@@ -755,15 +1421,18 @@ export {
|
|
|
755
1421
|
FilterFunnel01,
|
|
756
1422
|
FilterFunnel02,
|
|
757
1423
|
Flag01,
|
|
1424
|
+
HAUTEUR_FLECHE,
|
|
758
1425
|
Heart01,
|
|
759
1426
|
Heart02,
|
|
760
1427
|
HelpCircle01,
|
|
761
1428
|
HelpCircle02,
|
|
1429
|
+
HelpTooltip,
|
|
762
1430
|
Home01,
|
|
763
1431
|
Home02,
|
|
764
1432
|
Inbox01,
|
|
765
1433
|
InfoCircle01,
|
|
766
1434
|
InfoCircle02,
|
|
1435
|
+
LARGEUR_FLECHE,
|
|
767
1436
|
LOGO_BOITES,
|
|
768
1437
|
LOGO_ECART,
|
|
769
1438
|
Link01,
|
|
@@ -776,6 +1445,8 @@ export {
|
|
|
776
1445
|
Mail01,
|
|
777
1446
|
Mail02,
|
|
778
1447
|
Menu01,
|
|
1448
|
+
MessageAlertSquare01,
|
|
1449
|
+
MessageAlertSquare02,
|
|
779
1450
|
MessageBubble01,
|
|
780
1451
|
MessageBubble02,
|
|
781
1452
|
MessageChatSquare,
|
|
@@ -788,6 +1459,7 @@ export {
|
|
|
788
1459
|
Plus,
|
|
789
1460
|
PlusCircle01,
|
|
790
1461
|
PlusCircle02,
|
|
1462
|
+
Radio,
|
|
791
1463
|
RefreshCw01,
|
|
792
1464
|
STYLES_A_REVOIR,
|
|
793
1465
|
Search01,
|
|
@@ -800,17 +1472,22 @@ export {
|
|
|
800
1472
|
SlashCircle01,
|
|
801
1473
|
SlashDivider,
|
|
802
1474
|
SmartOrg,
|
|
1475
|
+
Spinner,
|
|
803
1476
|
Star01,
|
|
804
1477
|
Target05,
|
|
805
1478
|
ThumbsDown,
|
|
806
1479
|
ThumbsUp,
|
|
807
1480
|
Tick,
|
|
1481
|
+
Toggle,
|
|
808
1482
|
Tool01,
|
|
1483
|
+
Tooltip,
|
|
1484
|
+
TooltipArrow,
|
|
809
1485
|
Trash01,
|
|
810
1486
|
Trash02,
|
|
811
1487
|
Upload01,
|
|
812
1488
|
User01,
|
|
813
1489
|
Users01,
|
|
1490
|
+
UtilityButton,
|
|
814
1491
|
XCircle,
|
|
815
1492
|
XClose,
|
|
816
1493
|
ZEST_FILE_ICONS,
|