@20minutes/hela 2.18.8 → 2.18.10

package/dist/index.es.js

@@ -363,7 +363,7 @@ const Ae = ({
       )
     }
   )
-), De = ["column", "row", "column-reverse", "row-reverse"], Re = ["wrap", "wrap-reverse", "no-wrap"], Oe = ["start", "end", "center", "baseline", "stretch"], Ee = [
+), De = ["column", "row", "column-reverse", "row-reverse"], Oe = ["wrap", "wrap-reverse", "no-wrap"], Re = ["start", "end", "center", "baseline", "stretch"], Ee = [
   "start",
   "end",
   "center",
@@ -379,7 +379,7 @@ const Ae = ({
   "around",
   "evenly",
   "stretch"
-], qe = ["auto", "start", "end", "center", "stretch", "baseline"], Ke = ["auto", 0, 25, 33, 50, 75, 100], Ge = [0, 1], Ue = [0, 1], O = {
+], qe = ["auto", "start", "end", "center", "stretch", "baseline"], Ke = ["auto", 0, 25, 33, 50, 75, 100], Ge = [0, 1], Ue = [0, 1], R = {
   asset: {
     font: {
       "Obviously-Semibold": {
@@ -1518,14 +1518,14 @@ const Ae = ({
   "pre-line",
   "pre-wrap",
   "revert"
-], Qe = Object.keys(O["font-family"]).filter(
+], Qe = Object.keys(R["font-family"]).filter(
   (a) => !["base"].includes(a)
 ), e2 = Object.keys(
-  O["font-weight"]
+  R["font-weight"]
 ), a2 = Object.keys(
-  O.typography.heading
+  R.typography.heading
 ), s2 = Object.keys(
-  O.typography.text
+  R.typography.text
 );
 var f0 = /* @__PURE__ */ ((a) => (a.angry = "angry", a.heart = "heart", a.interesting = "interesting", a.laughing = "laughing", a.sad = "sad", a.shock = "shock", a.solidary = "solidary", a.down = "down", a.up = "up", a))(f0 || {});
 const K1 = {
@@ -1794,17 +1794,17 @@ const K1 = {
   textTransform: ["text-transform"],
   fontFamily: ["font-family"],
   whiteSpace: ["white-space"]
-}, l2 = Object.keys(O.color.theme), t2 = ["light", "dark"], n2 = Object.keys(O.spacing), r2 = [
-  ...Object.keys(O.color.primary),
-  ...Object.keys(O.color.secondary),
-  ...Object.keys(O.color.greyscale),
-  ...Object.keys(O.color.status),
-  ...Object.keys(O.color.theme)
-], i2 = Object.keys(O.asset.icon), o2 = Object.keys(
-  O.asset.icon["horoscope-sign"].chinese
+}, l2 = Object.keys(R.color.theme), t2 = ["light", "dark"], n2 = Object.keys(R.spacing), r2 = [
+  ...Object.keys(R.color.primary),
+  ...Object.keys(R.color.secondary),
+  ...Object.keys(R.color.greyscale),
+  ...Object.keys(R.color.status),
+  ...Object.keys(R.color.theme)
+], i2 = Object.keys(R.asset.icon), o2 = Object.keys(
+  R.asset.icon["horoscope-sign"].chinese
 ), d2 = Object.keys(
-  O.asset.icon["horoscope-sign"].zodiac
-), h2 = Object.keys(O.radius), m2 = [
+  R.asset.icon["horoscope-sign"].zodiac
+), h2 = Object.keys(R.radius), m2 = [
   "20-arena",
   "on-vous-en-dit-plus",
   "planete-c",
@@ -2404,12 +2404,12 @@ const K1 = {
       }
     )
   ] }),
-  /* @__PURE__ */ e("symbol", { viewBox: "0 0 28 28", id: "notification", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
+  /* @__PURE__ */ e("symbol", { viewBox: "0 0 22 25", id: "notification", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ e(
     "path",
     {
-      d: "M27.222 19.75v.5c0 1.25-.998 2.25-2.245 2.25H3.023c-1.247 0-2.245-1-2.245-2.25v-.5c0-1.8 1.297-3.3 2.994-3.65v-5.85C3.771 4.6 8.362 0 14 0s10.229 4.6 10.229 10.25v5.85c1.696.3 2.993 1.85 2.993 3.65zM23.48 18.5c.699 0 1.247.55 1.247 1.25V20H3.272v-.25c0-.7.549-1.25 1.247-1.25.948 0 1.746-.8 1.746-1.75v-6.5c0-4.3 3.443-7.75 7.734-7.75s7.734 3.45 7.734 7.75v6.5c.001.95.799 1.75 1.747 1.75zM9.26 23.25h2.495c0 1.25.998 2.25 2.245 2.25s2.245-1 2.245-2.25h2.495c0 2.6-2.145 4.75-4.74 4.75s-4.74-2.15-4.74-4.75z",
-      fillRule: "evenodd",
-      clipRule: "evenodd"
+      stroke: "currentColor",
+      strokeWidth: 0.722,
+      d: "M1.83 19.702c-.49-.029-1.408-.361-1.466-1.438-.029-.477.166-1.206 1.2-1.994l.064-.043.217-.152s1.293-.628 1.785-3.367c.072-.419.137-.917.21-1.473.382-3.064.96-7.652 4.702-8.93A2.116 2.116 0 0 1 10.645.36c1.105 0 2.016.86 2.102 1.944 3.736 1.264 4.314 5.866 4.704 8.93.072.556.13 1.054.21 1.473.368 2.06 1.184 2.92 1.574 3.223l.253.151c.065.037 1.539.94 1.474 2.182-.058 1.091-.976 1.416-1.452 1.438zm.362-2.991-.044.029c-.953.679-1.076 1.22-1.062 1.488.037.672.643.744.766.752h17.636c.101 0 .708-.08.744-.752.036-.628-.693-1.235-1.055-1.474l-.029-.014c-.065-.03-1.64-.744-2.21-3.901-.08-.427-.145-.94-.217-1.51-.369-2.948-.932-7.399-4.436-8.403l-.26-.072v-.376a1.388 1.388 0 0 0-2.775 0v.376l-.26.072c-3.51 1.019-4.067 5.462-4.443 8.41-.072.57-.137 1.083-.217 1.51-.513 2.86-1.856 3.713-2.153 3.872zm5.252 3.136h-.397v.65c.036 1.878 1.481 3.294 3.388 3.294 1.908 0 3.396-1.445 3.396-3.36v-.577H7.437zm2.999 3.214c-1.474 0-2.601-1.061-2.674-2.492h5.34c-.073 1.43-1.2 2.492-2.674 2.492z"
     }
   ) }),
   /* @__PURE__ */ t("symbol", { viewBox: "0 0 28 32", id: "notification-bell", xmlns: "http://www.w3.org/2000/svg", children: [
@@ -3787,7 +3787,7 @@ const d1 = I(
     ...d,
     children: c
   }
-), R0 = ({
+), O0 = ({
   name: a,
   children: s,
   className: c,
@@ -4096,7 +4096,7 @@ const d1 = I(
       __html: a
     }
   }
-), O0 = {
+), R0 = {
   defaultFormat: "1444x920",
   formats: ["1444x920", "722x460", "640x408", "320x204"],
   sizes: "(min-width: 722px) 722px, 100vw"
@@ -4118,7 +4118,7 @@ const d1 = I(
   ...m
 }) => {
   let v = E0;
-  return r === z.DESKTOP && (v = O0), /* @__PURE__ */ t(x, { ...m, as: "figure", className: "c-media", children: [
+  return r === z.DESKTOP && (v = R0), /* @__PURE__ */ t(x, { ...m, as: "figure", className: "c-media", children: [
     a === W.photo && /* @__PURE__ */ t("div", { className: "c-media__content", children: [
       /* @__PURE__ */ e(
         i1,
@@ -4456,7 +4456,7 @@ const d1 = I(
       );
     }) })
   ] });
-}, R = I(
+}, O = I(
   ({ as: a = "article", children: s, className: c, clickable: l = !1, ...n }, r) => /* @__PURE__ */ e(
     h,
     {
@@ -4720,7 +4720,7 @@ const d1 = I(
       ]
     }
   ) });
-}, R1 = (a) => {
+}, O1 = (a) => {
   switch (a) {
     case "alert":
       return { label: "alerte info", color: "red" };
@@ -4769,7 +4769,7 @@ const d1 = I(
           a && /* @__PURE__ */ e(
             A,
             {
-              bg: R1(a).color,
+              bg: O1(a).color,
               color: "white",
               hasDot: a === "live" || !1,
               mr: "xxs",
@@ -4777,7 +4777,7 @@ const d1 = I(
               className: p("c-card-title__cartridge-heading", {
                 "c-card-title__cartridge-heading--is-centered": s
               }),
-              children: R1(a).label
+              children: O1(a).label
             }
           ),
           o
@@ -4802,7 +4802,7 @@ const d1 = I(
 }) => {
   const { cardFooterProps: w, ..._ } = f, y = ["722x460", "640x408", "320x204"];
   return /* @__PURE__ */ e(
-    R,
+    O,
     {
       ..._,
       className: p("c-card-extra-large", _.className),
@@ -4940,7 +4940,7 @@ const d1 = I(
 }) => {
   const { summaryProps: m, signatureProps: v, ...f } = u;
   return /* @__PURE__ */ t(
-    R,
+    O,
     {
       ...f,
       p: u?.bg ? "s" : void 0,
@@ -5076,7 +5076,7 @@ const d1 = I(
   ...u
 }) => {
   const { cardFooterProps: m, signatureProps: v, ...f } = u;
-  return /* @__PURE__ */ e(R, { ...f, className: "c-card-large", direction: "column", children: c === z.DESKTOP ? /* @__PURE__ */ t("a", { href: a, children: [
+  return /* @__PURE__ */ e(O, { ...f, className: "c-card-large", direction: "column", children: c === z.DESKTOP ? /* @__PURE__ */ t("a", { href: a, children: [
     i && /* @__PURE__ */ e(
       T,
       {
@@ -5153,7 +5153,7 @@ const d1 = I(
 }) => {
   const { summaryProps: m, signatureProps: v, ...f } = u;
   return /* @__PURE__ */ t(
-    R,
+    O,
     {
       ...f,
       direction: "column",
@@ -5226,7 +5226,7 @@ const d1 = I(
 }) => {
   const { cardFooterProps: w, signatureProps: _, socialBarProps: y, ...M } = f;
   return /* @__PURE__ */ t(
-    R,
+    O,
     {
       ...M,
       clickable: !0,
@@ -5353,7 +5353,7 @@ const d1 = I(
       )
     ] })
   ] }) }) : null;
-  return /* @__PURE__ */ t(R, { ..._, className: "c-card-movie", direction: "column", children: [
+  return /* @__PURE__ */ t(O, { ..._, className: "c-card-movie", direction: "column", children: [
     /* @__PURE__ */ t(h, { direction: "row", gap: { xs: "m", md: "l" }, ...w, children: [
       /* @__PURE__ */ t("div", { className: "c-card-movie__side", children: [
         l && /* @__PURE__ */ e(T, { ...l, radius: "xs", alt: a }),
@@ -5425,7 +5425,7 @@ const d1 = I(
   onCheckedChange: o,
   ...d
 }) => /* @__PURE__ */ t(
-  R,
+  O,
   {
     alignItems: "start",
     justifyContent: "start",
@@ -5462,7 +5462,7 @@ const d1 = I(
   summaryProps: n,
   title: r,
   linkButton: i
-}) => /* @__PURE__ */ t(R, { direction: "column", justifyContent: "start", className: "c-card-notification", pb: "xs", children: [
+}) => /* @__PURE__ */ t(O, { direction: "column", justifyContent: "start", className: "c-card-notification", pb: "xs", children: [
   a && /* @__PURE__ */ e(g, { as: "time", color: "grey-400", size: "xxs", mb: "xxs-2", children: a }),
   /* @__PURE__ */ t(h, { justifyContent: "between", gap: "l", direction: "row", children: [
     /* @__PURE__ */ t(h, { justifyContent: "start", direction: "row", gap: "xs", children: [
@@ -5533,7 +5533,7 @@ const d1 = I(
       break;
   }
   return /* @__PURE__ */ t(
-    R,
+    O,
     {
       alignItems: r === "overviewBar" ? "center" : "start",
       justifyContent: "start",
@@ -5588,7 +5588,7 @@ const d1 = I(
   price: l,
   ...n
 }) => /* @__PURE__ */ t(
-  R,
+  O,
   {
     alignItems: "center",
     justifyContent: "start",
@@ -5630,7 +5630,7 @@ const d1 = I(
 }) => {
   const d = ["480x308", "346x222"];
   return /* @__PURE__ */ t(
-    R,
+    O,
     {
       ...o,
       direction: "row",
@@ -5679,13 +5679,13 @@ const d1 = I(
       ]
     }
   );
-}, e1 = ({ className: a, ...s }) => /* @__PURE__ */ e(x, { className: p("c-card-skeleton__block", a), bg: "grey-200", ...s }), J0 = (a) => /* @__PURE__ */ t(R, { ...a, direction: "column", gap: "xxs", children: [
+}, e1 = ({ className: a, ...s }) => /* @__PURE__ */ e(x, { className: p("c-card-skeleton__block", a), bg: "grey-200", ...s }), J0 = (a) => /* @__PURE__ */ t(O, { ...a, direction: "column", gap: "xxs", children: [
   /* @__PURE__ */ e(e1, { className: "c-card-skeleton__block--image" }),
   /* @__PURE__ */ e(e1, { className: "c-card-skeleton__block--meta" }),
   /* @__PURE__ */ e(e1, { className: "c-card-skeleton__block--title" }),
   /* @__PURE__ */ e(e1, { className: "c-card-skeleton__block--subtitle" })
 ] }), Q0 = (a) => /* @__PURE__ */ e(
-  R,
+  O,
   {
     ...a,
     direction: "column",
@@ -5699,7 +5699,7 @@ const d1 = I(
       /* @__PURE__ */ e(e1, { className: "c-card-skeleton__block--image" })
     ] })
   }
-), R2 = ({ variant: a, className: s, ...c }) => {
+), O2 = ({ variant: a, className: s, ...c }) => {
   const l = p(
     "c-card-skeleton",
     { [`c-card-skeleton--${a}`]: a },
@@ -5762,7 +5762,7 @@ const d1 = I(
       }
     )
   ] });
-  return /* @__PURE__ */ e(R, { ...f, direction: "column", clickable: !0, children: o === "title-on-image" ? /* @__PURE__ */ e("a", { href: a, children: w }) : w });
+  return /* @__PURE__ */ e(O, { ...f, direction: "column", clickable: !0, children: o === "title-on-image" ? /* @__PURE__ */ e("a", { href: a, children: w }) : w });
 }, ee = ({
   link: a,
   title: s,
@@ -5773,7 +5773,7 @@ const d1 = I(
 }) => {
   const { summaryProps: i, cardFooterProps: o, signatureProps: d, socialBarProps: u, ...m } = r;
   return /* @__PURE__ */ t(
-    R,
+    O,
     {
       ...m,
       justifyContent: "start",
@@ -5846,7 +5846,7 @@ const d1 = I(
       }
     )
   }
-), O2 = ({
+), R2 = ({
   link: a,
   title: s,
   signatureProps: c,
@@ -5932,7 +5932,7 @@ const d1 = I(
   location: r,
   ...i
 }) => /* @__PURE__ */ t(
-  R,
+  O,
   {
     ...i,
     direction: { xs: "column", md: "row" },
@@ -5962,7 +5962,7 @@ const d1 = I(
   ...d
 }) => {
   const { cardFooterProps: u, signatureProps: m, ...v } = d;
-  return /* @__PURE__ */ t(R, { ...v, direction: "column", className: "c-card-with-summary", clickable: !0, children: [
+  return /* @__PURE__ */ t(O, { ...v, direction: "column", className: "c-card-with-summary", clickable: !0, children: [
     /* @__PURE__ */ t(h, { mb: "xs", className: "c-card-with-summary__content", gap: "xs", children: [
       /* @__PURE__ */ t(F, { grow: 1, children: [
         l && /* @__PURE__ */ e(Q, { ...l, mb: "xxs-2" }),
@@ -6354,7 +6354,7 @@ const d1 = I(
     )
   ] }),
   c && /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(q1, { color: "grey-200" }) })
-] }), O1 = ({
+] }), R1 = ({
   layout: a,
   title: s,
   id: c,
@@ -6909,7 +6909,7 @@ const d1 = I(
     w,
     c,
     d && /* @__PURE__ */ e(
-      O1,
+      R1,
       {
         px: { xs: "m", md: "0" },
         py: "xs",
@@ -6948,7 +6948,7 @@ const d1 = I(
         }
       ) : w,
       d && /* @__PURE__ */ e(
-        O1,
+        R1,
         {
           mx: { xs: "m", md: "0" },
           px: "xs",
@@ -7209,10 +7209,11 @@ const d1 = I(
     h,
     {
       mt: { xs: "0", md: "m" },
-      ml: { xs: "m", md: "0" },
+      px: { xs: "m", md: "0" },
       mb: { xs: "xl", md: "0" },
       gap: { xs: "l", md: "xl" },
       alignItems: "center",
+      justifyContent: s === z.DESKTOP ? "start" : "center",
       children: [
         /* @__PURE__ */ e(V, { variant: "primary", ...r, children: /* @__PURE__ */ t(h, { alignItems: "center", children: [
           /* @__PURE__ */ e(N, { name: "video-outlined", size: 13, mr: "xxs" }),
@@ -7396,7 +7397,7 @@ const d1 = I(
   updatedAt: c,
   timeSlot: l,
   ...n
-}) => a === "elections" && s ? null : /* @__PURE__ */ t(h, { ...n, alignItems: "center", children: [
+}) => a === "elections" && s ? null : /* @__PURE__ */ t(h, { ...n, alignItems: "center", className: "c-live-indicator", children: [
   /* @__PURE__ */ e(
     A,
     {
@@ -7414,7 +7415,10 @@ const d1 = I(
       name: "clock",
       size: 15,
       color: a === "tv" && (l?.color || "grey-500") || a === "live" && s && "grey-300" || "red",
-      mr: "xxs"
+      mr: "xxs",
+      className: p("c-live-indicator__icon", {
+        "c-live-indicator__text--over": s
+      })
     }
   ),
   /* @__PURE__ */ e(
@@ -7422,6 +7426,9 @@ const d1 = I(
     {
       size: "xs",
       color: l && (l.color || "grey-500") || s && "grey-300" || "red",
+      className: p("c-live-indicator__text", {
+        "c-live-indicator__text--over": s
+      }),
       children: l?.children || s && "Terminé" || `Mis à jour ${c}`
     }
   )
@@ -9427,7 +9434,7 @@ const k3 = ({ networks: a = ["sharethis"], ...s }) => {
           }
         ),
         u.map((v) => /* @__PURE__ */ e(
-          R0,
+          O0,
           {
             className: p({ "c-tabs-fit-container__panel": c }),
             name: v.name,
@@ -10165,7 +10172,7 @@ const Se = {
                 {
                   href: s,
                   color: d(),
-                  className: "c-header__link c-header__link--theme-ultramarine",
+                  className: `c-header__link c-header__link--theme-${r || "ultramarine"}`,
                   size: "m",
                   pl: "m",
                   pr: "s",
@@ -10709,7 +10716,7 @@ const Se = {
       ]
     }
   );
-}, R3 = ({
+}, O3 = ({
   title: a,
   items: s,
   layout: c,
@@ -10734,7 +10741,7 @@ const Se = {
     },
     n.title.label
   ))
-] }) : null, O3 = ({ items: a, activeItem: s, isBlueMode: c = !1 }) => /* @__PURE__ */ e(
+] }) : null, R3 = ({ items: a, activeItem: s, isBlueMode: c = !1 }) => /* @__PURE__ */ e(
   h,
   {
     as: "nav",
@@ -10776,7 +10783,7 @@ export {
   L2 as BulletedList,
   j as Button,
   j2 as Calendar,
-  R as CardContainer,
+  O as CardContainer,
   $2 as CardExtraLarge,
   c0 as CardExtraSmall,
   s0 as CardFooter,
@@ -10792,12 +10799,12 @@ export {
   l0 as CardOverview,
   X0 as CardProduct,
   D2 as CardSideImage,
-  R2 as CardSkeleton,
+  O2 as CardSkeleton,
   t0 as CardSmall,
   ee as CardTiny,
   D as CardTitle,
   ae as CardVertical,
-  O2 as CardVideo,
+  R2 as CardVideo,
   se as CardVideoSmall,
   E2 as CardWithButton,
   P2 as CardWithSummary,
@@ -10808,7 +10815,7 @@ export {
   G2 as Comment,
   U2 as CommentButton,
   W2 as CommentCount,
-  O1 as Countdown,
+  R1 as Countdown,
   w1 as CountdownItem,
   Y2 as DarkModeSwitch,
   X2 as DiscoverList,
@@ -10907,7 +10914,7 @@ export {
   g2 as SvgSprite,
   e0 as Switch,
   D0 as Tab,
-  R0 as TabPanel,
+  O0 as TabPanel,
   S3 as Table,
   o0 as Tabs,
   X as Tag,
@@ -10915,14 +10922,14 @@ export {
   g as Text,
   V3 as TextTooltip,
   N2 as Textarea,
-  R3 as ThreeColumnsArticles,
+  O3 as ThreeColumnsArticles,
   y1 as Tiles,
   Z3 as Timeline,
-  O3 as Toolbar,
+  R3 as Toolbar,
   a0 as Typography,
   L3 as UserPanel,
   Ee as alignContentList,
-  Oe as alignItemsList,
+  Re as alignItemsList,
   qe as alignSelfList,
   _1 as applyFormatToNumbers,
   p2 as borderSizeList,
@@ -10939,7 +10946,7 @@ export {
   G1 as flexOrGridBoxSystemProps,
   _0 as flexOrGridItemSystemProps,
   Ge as flexShrinkList,
-  Re as flexWrapList,
+  Oe as flexWrapList,
   Qe as fontFamilyTokenNameList,
   e2 as fontWeightTokenNameList,
   I as forwardRef,
@@ -10949,7 +10956,7 @@ export {
   o2 as iconTokenNameHorscopeChineseList,
   d2 as iconTokenNameHorscopeZodiacList,
   i2 as iconTokenNameList,
-  O0 as imageConfigDesktop,
+  R0 as imageConfigDesktop,
   E0 as imageConfigMobile,
   Pe as justifyContentList,
   z0 as marginSystemProps,
@@ -10969,7 +10976,7 @@ export {
   Xe as textTransformList,
   l2 as themeColorAvailables,
   t2 as themeList,
-  O as tokenVariables,
+  R as tokenVariables,
   m2 as tvShowsColors,
   k0 as typographySystemProps,
   Je as whiteSpaceList