@ilo-org/react 0.26.0 → 0.27.0

package/lib/esm/_store/CardGroup-chunk-BtxfvFrZ.js

@@ -0,0 +1,825 @@
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { forwardRef as y, isValidElement as R, createElement as H, Fragment as z } from "react";
+import { c as v } from "./index-chunk-CY3PQDr4.js";
+import { u as C } from "./useGlobalSettings-chunk-BhfWlTcd.js";
+import { B as S } from "./Button-chunk-8dLLhQX7.js";
+import { L as V } from "./Link-chunk-DgmjE6xb.js";
+import { D as g } from "./DynamicHeading-chunk-CO_vg_Lp.js";
+import { L } from "./LinkList-chunk-ClC0P1yc.js";
+import { P as A } from "./Profile-chunk-S7Qd4zNr.js";
+import { I as D } from "./Icon-chunk-vcBEV-Wk.js";
+import { List as b } from "./List-entry-BX9gaFfD.js";
+import { P as J } from "./Picture-chunk-DsW0ODDG.js";
+import { S as K } from "./Status-chunk-CjagfPq5.js";
+const Q = y(
+  ({
+    className: o,
+    title: s,
+    theme: c = "light",
+    size: i = "standard",
+    color: a,
+    intro: l,
+    source: n,
+    titleLevel: $ = "p"
+  }, _) => {
+    const { prefix: N } = C(), r = `${N}--card`, p = v(`${r}--wrapper`, o), m = v(r, `${r}__type__stat`, {
+      [`${r}__size__${String(i)}`]: i,
+      [`${r}__theme__${c}`]: c,
+      [`${r}__color__${a}`]: a
+    });
+    return /* @__PURE__ */ e("div", { className: p, ref: _, children: /* @__PURE__ */ e("div", { className: m, children: /* @__PURE__ */ e("div", { className: `${r}--wrap`, children: /* @__PURE__ */ t("div", { className: `${r}--content`, children: [
+      /* @__PURE__ */ e(
+        g,
+        {
+          level: $,
+          className: `${r}--title`,
+          children: s
+        }
+      ),
+      l && /* @__PURE__ */ e("p", { className: `${r}--intro`, children: l }),
+      n && /* @__PURE__ */ e(
+        V,
+        {
+          className: `${r}--source`,
+          url: n.url,
+          label: n.label
+        }
+      )
+    ] }) }) }) });
+  }
+), U = ({
+  className: o,
+  theme: s = "light",
+  size: c = "standard"
+}) => {
+  const { prefix: i } = C(), a = `${i}--card`, l = v(`${a}--wrapper`, o), n = v(a, `${a}__type__stat`, {
+    [`${a}__size__${String(c)}`]: c,
+    [`${a}__theme__${s}`]: s,
+    [`${a}__loading`]: !0
+  });
+  return /* @__PURE__ */ e("div", { className: l, children: /* @__PURE__ */ e("div", { className: n, children: /* @__PURE__ */ e("div", { className: `${a}--wrap`, children: /* @__PURE__ */ t("div", { className: `${a}--content`, children: [
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--title` }),
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--intro-1` }),
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--intro-2` }),
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--source` })
+  ] }) }) }) });
+}, T = Object.assign(Q, {
+  Skeleton: U
+});
+T.displayName = "StatCard";
+T.Skeleton.displayName = "StatCard.Skeleton";
+const W = y(
+  ({
+    className: o,
+    title: s,
+    size: c = "standard",
+    alignment: i,
+    intro: a,
+    link: l,
+    linklist: n,
+    image: $,
+    titleLevel: _ = "p",
+    eyebrow: N,
+    isVideo: r,
+    theme: p = "light"
+  }, m) => {
+    const { prefix: h } = C(), d = `${h}--card`, k = v(
+      d,
+      o,
+      `${d}__type__multilink`,
+      {
+        [`${d}__align__${i}`]: i,
+        [`${d}__size__${c}`]: c,
+        [`${d}__isvideo`]: r,
+        [`${d}--no-image`]: !$,
+        [`${d}__theme__${p}`]: p
+      }
+    );
+    return /* @__PURE__ */ t("div", { className: k, ref: m, children: [
+      l && /* @__PURE__ */ e("a", { className: `${d}--link`, href: l, title: s, children: /* @__PURE__ */ e("span", { className: `${d}--link--text`, children: s }) }),
+      /* @__PURE__ */ t("div", { className: `${d}--wrap`, children: [
+        $ && /* @__PURE__ */ e("div", { className: `${d}--image--wrapper`, children: /* @__PURE__ */ e("picture", { children: /* @__PURE__ */ e(
+          "img",
+          {
+            src: $,
+            alt: s,
+            className: `${d}--picture`
+          }
+        ) }) }),
+        /* @__PURE__ */ t("div", { className: `${d}--content`, children: [
+          N && /* @__PURE__ */ e("p", { className: `${d}--eyebrow`, children: N }),
+          /* @__PURE__ */ e(
+            g,
+            {
+              level: _,
+              className: `${d}--title`,
+              children: s
+            }
+          ),
+          $ && /* @__PURE__ */ e("div", { className: `${d}--image--wrapper`, children: /* @__PURE__ */ e("picture", { children: /* @__PURE__ */ e(
+            "img",
+            {
+              src: $,
+              alt: s,
+              className: `${d}--picture`
+            }
+          ) }) }),
+          a && (R(a) ? /* @__PURE__ */ e("div", { className: `${d}--intro`, children: a }) : /* @__PURE__ */ e("p", { className: `${d}--intro`, children: a })),
+          n && /* @__PURE__ */ e(L, { ...n })
+        ] })
+      ] })
+    ] });
+  }
+), X = ({
+  className: o,
+  size: s = "standard",
+  alignment: c,
+  theme: i = "light"
+}) => {
+  const { prefix: a } = C(), l = `${a}--card`, n = v(
+    l,
+    o,
+    `${l}__type__multilink`,
+    {
+      [`${l}__align__${c}`]: c,
+      [`${l}__size__${s}`]: s,
+      [`${l}__theme__${i}`]: i
+    }
+  );
+  return /* @__PURE__ */ e("div", { className: n, children: /* @__PURE__ */ t("div", { className: `${l}--wrap`, children: [
+    /* @__PURE__ */ e("div", { className: `${l}--skeleton--column-image` }),
+    /* @__PURE__ */ t("div", { className: `${l}--content`, children: [
+      /* @__PURE__ */ e("div", { className: `${l}--skeleton--eyebrow` }),
+      /* @__PURE__ */ e("div", { className: `${l}--skeleton--title-1` }),
+      /* @__PURE__ */ e("div", { className: `${l}--skeleton--title-2` }),
+      /* @__PURE__ */ e("div", { className: `${l}--skeleton--row-image` }),
+      /* @__PURE__ */ e("div", { className: `${l}--skeleton--intro-1` }),
+      /* @__PURE__ */ e("div", { className: `${l}--skeleton--intro-2` }),
+      /* @__PURE__ */ e("div", { className: `${l}--skeleton--intro-3` }),
+      /* @__PURE__ */ e("div", { className: `${l}--skeleton--intro-4` })
+    ] })
+  ] }) });
+}, F = Object.assign(W, {
+  Skeleton: X
+});
+F.displayName = "MultiLinkCard";
+F.Skeleton.displayName = "MultiLinkCard.Skeleton";
+const Y = y(
+  ({
+    className: o,
+    title: s,
+    theme: c = "light",
+    size: i = "narrow",
+    date: a,
+    profile: l,
+    link: n,
+    titleLevel: $ = "p",
+    eyebrow: _
+  }, N) => {
+    const { prefix: r } = C(), p = `${r}--card`, m = v(`${p}--wrapper`, o), h = v(p, `${p}__type__text`, {
+      [`${p}__size__${String(i)}`]: i,
+      [`${p}__theme__${c}`]: c
+    });
+    return /* @__PURE__ */ e("div", { className: m, ref: N, children: /* @__PURE__ */ t("div", { className: h, children: [
+      /* @__PURE__ */ e("a", { className: `${p}--link`, href: n, title: s, children: /* @__PURE__ */ e("span", { className: `${p}--link--text`, children: s }) }),
+      /* @__PURE__ */ e("div", { className: `${p}--wrap`, children: /* @__PURE__ */ t("div", { className: `${p}--content`, children: [
+        _ && /* @__PURE__ */ e("p", { className: `${p}--eyebrow`, children: _ }),
+        /* @__PURE__ */ e(
+          g,
+          {
+            level: $,
+            className: `${p}--title`,
+            children: s
+          }
+        ),
+        a && /* @__PURE__ */ e("time", { className: `${p}--date`, dateTime: a.unix, children: a.human }),
+        l && /* @__PURE__ */ e(
+          A,
+          {
+            avatar: l.avatar,
+            description: l.description,
+            link: l.link,
+            name: l.name,
+            role: l.role,
+            theme: c
+          }
+        )
+      ] }) })
+    ] }) });
+  }
+), Z = ({
+  className: o,
+  size: s,
+  theme: c
+}) => {
+  const { prefix: i } = C(), a = `${i}--card`, l = v(`${a}--wrapper`, o), n = v(a, `${a}__type__text`, {
+    [`${a}__size__${String(s)}`]: s,
+    [`${a}__theme__${c}`]: c
+  });
+  return /* @__PURE__ */ e("div", { className: l, children: /* @__PURE__ */ e("div", { className: n, children: /* @__PURE__ */ e("div", { className: `${a}--wrap`, children: /* @__PURE__ */ t("div", { className: `${a}--content`, children: [
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--eyebrow` }),
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--title` }),
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--date` }),
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--profile` })
+  ] }) }) }) });
+}, j = Object.assign(Y, {
+  Skeleton: Z
+});
+j.displayName = "TextCard";
+j.Skeleton.displayName = "TextCard.Skeleton";
+const ee = y(
+  ({
+    className: o,
+    title: s,
+    theme: c = "light",
+    size: i = "narrow",
+    cornercut: a,
+    intro: l,
+    link: n,
+    cta: $,
+    titleLevel: _ = "p",
+    eyebrow: N
+  }, r) => {
+    const { prefix: p } = C(), m = `${p}--card`, h = v(
+      `${m}--wrapper`,
+      o,
+      `${m}--wrapper__type__promo`,
+      `${m}--wrapper__type__promo__size__${i}`
+    ), d = v(m, `${m}__type__promo`, {
+      [`${m}__size__${String(i)}`]: i,
+      [`${m}__theme__${c}`]: c,
+      [`${m}__cornercut`]: a
+    });
+    return /* @__PURE__ */ e("div", { className: h, ref: r, children: /* @__PURE__ */ t("div", { className: d, children: [
+      /* @__PURE__ */ e("a", { className: `${m}--link`, href: n, title: s, children: /* @__PURE__ */ e("span", { className: `${m}--link--text`, children: s }) }),
+      /* @__PURE__ */ e("div", { className: `${m}--wrap`, children: /* @__PURE__ */ t("div", { className: `${m}--content`, children: [
+        N && /* @__PURE__ */ e("p", { className: `${m}--eyebrow`, children: N }),
+        /* @__PURE__ */ e(
+          g,
+          {
+            level: _,
+            className: `${m}--title`,
+            children: s
+          }
+        ),
+        l && /* @__PURE__ */ e("p", { className: `${m}--intro`, children: l }),
+        ($ == null ? void 0 : $.label) && /* @__PURE__ */ e("div", { className: `${m}--cta`, children: /* @__PURE__ */ e(
+          S,
+          {
+            link: { url: $.url, label: $.label },
+            size: "medium",
+            type: "primary"
+          }
+        ) })
+      ] }) })
+    ] }) });
+  }
+), ae = ({
+  className: o,
+  theme: s = "light",
+  size: c = "narrow"
+}) => {
+  const { prefix: i } = C(), a = `${i}--card`, l = v(
+    `${a}--wrapper`,
+    o,
+    `${a}--wrapper__type__promo`,
+    `${a}--wrapper__type__promo__size__${c}`
+  ), n = v(a, `${a}__type__promo`, {
+    [`${a}__size__${String(c)}`]: c,
+    [`${a}__theme__${s}`]: s
+  });
+  return /* @__PURE__ */ e("div", { className: l, children: /* @__PURE__ */ e("div", { className: n, children: /* @__PURE__ */ t("div", { className: `${a}--wrap`, children: [
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--eyebrow` }),
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--title-1` }),
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--title-2` }),
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--intro-1` }),
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--intro-2` }),
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--intro-3` })
+  ] }) }) });
+}, P = Object.assign(ee, {
+  Skeleton: ae
+});
+P.displayName = "PromoCard";
+P.Skeleton.displayName = "PromoCard.Skeleton";
+const se = y(
+  ({
+    className: o,
+    title: s,
+    theme: c = "light",
+    size: i = "narrow",
+    date: a,
+    link: l,
+    linklist: n,
+    image: $,
+    titleLevel: _ = "p",
+    eyebrow: N,
+    isVideo: r
+  }, p) => {
+    const { prefix: m } = C(), h = `${m}--card`, d = v(
+      h,
+      o,
+      `${h}__type__feature`,
+      {
+        [`${h}__size__${String(i)}`]: i,
+        [`${h}__theme__${c}`]: c,
+        [`${h}__isvideo`]: r,
+        [`${h}__linklist`]: n
+      }
+    );
+    return /* @__PURE__ */ t("div", { className: d, ref: p, children: [
+      l && /* @__PURE__ */ e("a", { className: `${h}--link`, href: l, title: s, children: /* @__PURE__ */ e("span", { className: `${h}--link--text`, children: s }) }),
+      /* @__PURE__ */ t("div", { className: `${h}--wrap`, children: [
+        $ && /* @__PURE__ */ e("div", { className: `${h}--image--wrapper`, children: /* @__PURE__ */ e("picture", { children: /* @__PURE__ */ e(
+          "img",
+          {
+            src: $,
+            alt: s,
+            className: `${h}--picture`
+          }
+        ) }) }),
+        /* @__PURE__ */ t("div", { className: `${h}--content`, children: [
+          N && /* @__PURE__ */ e("p", { className: `${h}--eyebrow`, children: N }),
+          /* @__PURE__ */ e(
+            g,
+            {
+              level: _,
+              className: `${h}--title`,
+              children: s
+            }
+          ),
+          a && /* @__PURE__ */ e("time", { className: `${h}--date`, dateTime: a.unix, children: a.human }),
+          n && i === "narrow" && /* @__PURE__ */ e(
+            L,
+            {
+              headline: n.headline,
+              linkgroup: n.linkgroup,
+              theme: c
+            }
+          )
+        ] })
+      ] }),
+      n && (i === "wide" || i === "fluid") && /* @__PURE__ */ e(
+        L,
+        {
+          headline: n.headline,
+          linkgroup: n.linkgroup,
+          theme: c
+        }
+      )
+    ] });
+  }
+), le = ({
+  className: o,
+  size: s,
+  theme: c
+}) => {
+  const { prefix: i } = C(), a = `${i}--card`, l = v(
+    a,
+    o,
+    `${a}__type__feature`,
+    {
+      [`${a}__size__${String(s)}`]: s,
+      [`${a}__theme__${c}`]: c
+    }
+  );
+  return /* @__PURE__ */ e("div", { className: l, children: /* @__PURE__ */ t("div", { className: `${a}--wrap`, children: [
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--image` }),
+    /* @__PURE__ */ t("div", { className: `${a}--content`, children: [
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--eyebrow` }),
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--title` }),
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--date` })
+    ] })
+  ] }) });
+}, O = Object.assign(se, {
+  Skeleton: le
+});
+O.displayName = "FeatureCard";
+O.Skeleton.displayName = "FeatureCard.Skeleton";
+const ne = y(
+  ({
+    className: o,
+    title: s,
+    theme: c = "light",
+    size: i = "narrow",
+    date: a,
+    details: l,
+    link: n,
+    titleLevel: $ = "p",
+    eyebrow: _,
+    intro: N,
+    image: r,
+    isVideo: p = !1,
+    linkComponent: m
+  }, h) => {
+    const { prefix: d } = C(), k = `${d}--card`, u = v(
+      k,
+      `${k}__type__detail`,
+      o,
+      {
+        [`${k}__size__${String(i)}`]: i,
+        [`${k}__theme__${c}`]: c,
+        [`${k}__isvideo`]: p
+      }
+    ), f = H(
+      m || "a",
+      {
+        className: `${k}--link`,
+        href: n,
+        title: s
+      },
+      /* @__PURE__ */ e("span", { className: `${k}--link--text`, children: s })
+    );
+    return /* @__PURE__ */ t("div", { className: u, ref: h, children: [
+      n && f,
+      /* @__PURE__ */ t("div", { className: `${k}--wrap`, children: [
+        r && /* @__PURE__ */ e("div", { className: `${k}--image--wrapper`, children: /* @__PURE__ */ e("picture", { children: /* @__PURE__ */ e(
+          "img",
+          {
+            className: `${k}--picture`,
+            src: r,
+            alt: s
+          }
+        ) }) }),
+        /* @__PURE__ */ t("div", { className: `${k}--content`, children: [
+          _ && /* @__PURE__ */ e("p", { className: `${k}--eyebrow`, children: _ }),
+          s && /* @__PURE__ */ e(
+            g,
+            {
+              level: $,
+              className: `${k}--title`,
+              children: s
+            }
+          ),
+          N && (R(N) ? /* @__PURE__ */ e("div", { className: `${k}--intro`, children: N }) : /* @__PURE__ */ e("p", { className: `${k}--intro`, children: N })),
+          a && !l && /* @__PURE__ */ e("time", { className: `${k}--date`, dateTime: a.unix, children: a.human }),
+          l && /* @__PURE__ */ t("p", { className: `${k}--date-extra`, children: [
+            /* @__PURE__ */ e(
+              D,
+              {
+                name: "TriangleRight",
+                size: 20,
+                className: `${k}--icon-right`
+              }
+            ),
+            /* @__PURE__ */ e(
+              D,
+              {
+                name: "TriangleLeft",
+                size: 20,
+                className: `${k}--icon-left`
+              }
+            ),
+            l
+          ] })
+        ] })
+      ] })
+    ] });
+  }
+), ce = ({
+  className: o,
+  theme: s = "light",
+  size: c = "narrow"
+}) => {
+  const { prefix: i } = C(), a = `${i}--card`, l = v(
+    a,
+    `${a}__type__detail`,
+    o,
+    {
+      [`${a}__size__${String(c)}`]: c,
+      [`${a}__theme__${s}`]: s
+    }
+  );
+  return /* @__PURE__ */ e("div", { className: l, children: /* @__PURE__ */ t("div", { className: `${a}--wrap`, children: [
+    /* @__PURE__ */ e("div", { className: `${a}--image--wrapper`, children: /* @__PURE__ */ e("div", { className: `${a}--skeleton--image` }) }),
+    /* @__PURE__ */ t("div", { className: `${a}--content`, children: [
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--eyebrow` }),
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--title-1` }),
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--title-2` }),
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--intro-1` }),
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--intro-2` }),
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--intro-3` }),
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--intro-4` }),
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--intro-5` })
+    ] })
+  ] }) });
+}, I = Object.assign(ne, {
+  Skeleton: ce
+});
+I.displayName = "DetailCard";
+I.Skeleton.displayName = "DetailCard.Skeleton";
+const re = y(
+  ({
+    title: o,
+    theme: s = "light",
+    size: c = "narrow",
+    list: i,
+    titleLevel: a = "p",
+    className: l
+  }, n) => {
+    const { prefix: $ } = C(), _ = `${$}--card`, N = v(
+      _,
+      `${_}__type__factlist`,
+      l,
+      {
+        [`${_}__size__${c}`]: c,
+        [`${_}__theme__${s}`]: s
+      }
+    );
+    return /* @__PURE__ */ e("div", { className: N, ref: n, children: /* @__PURE__ */ e("div", { className: `${_}--wrap`, children: /* @__PURE__ */ t("div", { className: `${_}--content`, children: [
+      o && /* @__PURE__ */ e(
+        g,
+        {
+          level: a,
+          className: `${$}--card--title`,
+          children: o
+        }
+      ),
+      /* @__PURE__ */ e(b, { alignment: "default", ordered: "unordered", theme: s, children: i.map((r) => /* @__PURE__ */ e(b.Item, { children: /* @__PURE__ */ e("p", { children: r }) }, r)) })
+    ] }) }) });
+  }
+), ie = ({
+  className: o,
+  theme: s = "light",
+  size: c = "narrow"
+}) => {
+  const { prefix: i } = C(), a = `${i}--card`, l = v(
+    a,
+    `${a}__type__factlist`,
+    o,
+    {
+      [`${a}__size__${c}`]: c,
+      [`${a}__theme__${s}`]: s
+    }
+  );
+  return /* @__PURE__ */ e("div", { className: l, children: /* @__PURE__ */ e("div", { className: `${a}--wrap`, children: /* @__PURE__ */ t("div", { className: `${a}--content`, children: [
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--title` }),
+    /* @__PURE__ */ t(b, { alignment: "default", ordered: "unordered", theme: s, children: [
+      /* @__PURE__ */ e(b.Item, { children: /* @__PURE__ */ e("div", { className: `${a}--skeleton--list-item` }) }),
+      /* @__PURE__ */ e(b.Item, { children: /* @__PURE__ */ e("div", { className: `${a}--skeleton--list-item` }) }),
+      /* @__PURE__ */ e(b.Item, { children: /* @__PURE__ */ e("div", { className: `${a}--skeleton--list-item` }) }),
+      /* @__PURE__ */ e(b.Item, { children: /* @__PURE__ */ e("div", { className: `${a}--skeleton--list-item` }) }),
+      /* @__PURE__ */ e(b.Item, { children: /* @__PURE__ */ e("div", { className: `${a}--skeleton--list-item` }) })
+    ] })
+  ] }) }) });
+}, M = Object.assign(re, {
+  Skeleton: ie
+});
+M.displayName = "FactListCard";
+M.Skeleton.displayName = "FactListCard.Skeleton";
+const te = y(
+  ({
+    theme: o = "light",
+    eyebrow: s,
+    size: c = "narrow",
+    image: i,
+    dataset: a,
+    columns: l = "one",
+    className: n
+  }, $) => {
+    var h;
+    const { prefix: _ } = C(), N = c === "narrow" ? "one" : l, r = `${_}--card`, p = v(
+      r,
+      `${r}__type__data`,
+      n,
+      {
+        [`${r}__size__${String(c)}`]: c,
+        [`${r}__type__data__columns__${N}`]: N,
+        [`${r}__theme__${o}`]: o
+      }
+    ), m = v(`${r}--content`, {
+      [`${r}--content__with-image`]: i,
+      [`${r}--content__no-image-with-links`]: !i && (a == null ? void 0 : a.links),
+      [`${r}--content__default`]: !i && !(a != null && a.links)
+    });
+    return /* @__PURE__ */ e("div", { className: p, ref: $, children: /* @__PURE__ */ t("div", { className: `${r}--wrap`, children: [
+      !i && s && /* @__PURE__ */ e("div", { className: `${r}--eyebrow`, children: s }),
+      /* @__PURE__ */ t("div", { className: m, children: [
+        i && /* @__PURE__ */ t("div", { className: `${r}--area--image`, children: [
+          s && /* @__PURE__ */ e("div", { className: `${r}--eyebrow`, children: s }),
+          /* @__PURE__ */ e("div", { className: `${r}--image`, children: /* @__PURE__ */ e("picture", { children: /* @__PURE__ */ e(
+            "img",
+            {
+              className: `${r}--picture`,
+              src: i,
+              alt: s
+            }
+          ) }) })
+        ] }),
+        (h = a == null ? void 0 : a.content) == null ? void 0 : h.items.map((d, k) => /* @__PURE__ */ t("div", { className: `${r}--area--content`, children: [
+          /* @__PURE__ */ e("p", { className: `${r}__type__data--content-label`, children: d.label }),
+          /* @__PURE__ */ e("p", { className: `${r}__type__data--content-copy`, children: d.copy })
+        ] }, k)),
+        (a == null ? void 0 : a.files) && /* @__PURE__ */ e("div", { className: `${r}--area--files`, children: /* @__PURE__ */ t("div", { className: `${r}__type__data--content-files`, children: [
+          /* @__PURE__ */ e("p", { className: `${r}__type__data--content-label`, children: a.files.headline }),
+          a.files.items.map((d, k) => /* @__PURE__ */ e(
+            S,
+            {
+              link: {
+                url: d.url,
+                label: d.label,
+                target: d.target || "_self"
+              },
+              size: "small"
+            },
+            k
+          ))
+        ] }) }),
+        (a == null ? void 0 : a.cta) && /* @__PURE__ */ e("div", { className: `${r}--area--cta`, children: /* @__PURE__ */ t("div", { className: `${r}__type__data--content-cta`, children: [
+          /* @__PURE__ */ e("p", { className: `${r}__type__data--content-label`, children: a.cta.headline }),
+          a.cta.items.map((d) => /* @__PURE__ */ e(
+            S,
+            {
+              type: "secondary",
+              size: "small",
+              link: {
+                url: d.url,
+                label: d.label,
+                target: d.target
+              }
+            },
+            d.label
+          ))
+        ] }) }),
+        (a == null ? void 0 : a.links) && /* @__PURE__ */ e("div", { className: `${r}--area--links`, children: /* @__PURE__ */ t("div", { className: `${r}__type__data--content-links`, children: [
+          /* @__PURE__ */ e("p", { className: `${r}__type__data--content-label`, children: a.links.headline }),
+          /* @__PURE__ */ e(
+            "div",
+            {
+              className: `${r}__type__data--content-links-list`,
+              children: a.links.items.map((d) => /* @__PURE__ */ e(z, { children: /* @__PURE__ */ e(
+                V,
+                {
+                  url: d.url,
+                  label: d.label,
+                  className: `${r}__type__data--content-link`
+                }
+              ) }, d.label + d.url))
+            }
+          )
+        ] }) })
+      ] })
+    ] }) });
+  }
+), de = ({
+  className: o,
+  theme: s = "light",
+  size: c = "narrow",
+  columns: i = "one"
+}) => {
+  const { prefix: a } = C(), l = c === "narrow" ? "one" : i, n = `${a}--card`, $ = v(
+    n,
+    `${n}__type__data`,
+    o,
+    {
+      [`${n}__size__${String(c)}`]: c,
+      [`${n}__type__data__columns__${l}`]: l,
+      [`${n}__theme__${s}`]: s,
+      [`${n}__loading`]: !0
+    }
+  ), _ = `${n}--content`;
+  return /* @__PURE__ */ e("div", { className: $, children: /* @__PURE__ */ e("div", { className: `${n}--wrap`, children: /* @__PURE__ */ t("div", { className: _, children: [
+    /* @__PURE__ */ t("div", { className: `${n}--area--image`, children: [
+      /* @__PURE__ */ e("div", { className: `${n}--skeleton--eyebrow` }),
+      /* @__PURE__ */ e("div", { className: `${n}--skeleton--image` })
+    ] }),
+    /* @__PURE__ */ t("div", { className: `${n}--area--content`, children: [
+      /* @__PURE__ */ e("div", { className: `${n}--skeleton--label` }),
+      /* @__PURE__ */ e("div", { className: `${n}--skeleton--copy` })
+    ] }),
+    /* @__PURE__ */ t("div", { className: `${n}--area--content`, children: [
+      /* @__PURE__ */ e("div", { className: `${n}--skeleton--label` }),
+      /* @__PURE__ */ e("div", { className: `${n}--skeleton--copy` })
+    ] }),
+    /* @__PURE__ */ t("div", { className: `${n}--area--content`, children: [
+      /* @__PURE__ */ e("div", { className: `${n}--skeleton--label` }),
+      /* @__PURE__ */ e("div", { className: `${n}--skeleton--copy` })
+    ] })
+  ] }) }) });
+}, G = Object.assign(te, {
+  Skeleton: de
+});
+G.displayName = "DataCard";
+G.Skeleton.displayName = "DataCard.Skeleton";
+const oe = y(
+  ({
+    className: o,
+    theme: s = "light",
+    titleLevel: c = "p",
+    size: i = "narrow",
+    link: a,
+    linkComponent: l,
+    title: n,
+    isVideo: $ = !1,
+    image: _,
+    status: N,
+    eyebrow: r,
+    content: p,
+    cta: m
+  }, h) => {
+    var E;
+    const { prefix: d } = C(), k = s === "dark" ? "var(--ilo-color-white)" : "var(--ilo-color-gray-accessible)", u = `${d}--card`, f = v(u, `${u}__type__score`, {
+      [`${u}__theme__${s}`]: s,
+      [`${u}__size__${i}`]: i,
+      [`${u}__isvideo`]: $
+    }), q = H(
+      l || "a",
+      {
+        href: a,
+        title: n,
+        className: `${u}--link`
+      },
+      /* @__PURE__ */ e("span", { className: `${u}--link--text`, children: n })
+    );
+    return /* @__PURE__ */ t("div", { className: v(f, o), ref: h, children: [
+      q,
+      /* @__PURE__ */ t("div", { className: `${u}--wrap`, children: [
+        _ && i !== "simple" && /* @__PURE__ */ e("div", { className: `${u}--image--wrapper`, children: /* @__PURE__ */ e(J, { ..._ }) }),
+        /* @__PURE__ */ t("div", { className: `${u}--content`, children: [
+          N && /* @__PURE__ */ e(K, { content: N.content, statusType: N.statusType }),
+          r && i !== "simple" && /* @__PURE__ */ e("p", { className: `${u}--eyebrow`, children: r }),
+          n && /* @__PURE__ */ e(
+            g,
+            {
+              level: c,
+              className: `${u}--title`,
+              children: n
+            }
+          ),
+          p && /* @__PURE__ */ e("div", { className: `${u}--area--content`, children: (E = p.items) == null ? void 0 : E.map((w, x) => /* @__PURE__ */ t("div", { className: `${u}--content--item`, children: [
+            /* @__PURE__ */ e(D, { name: w.icon, size: 20, color: k }),
+            /* @__PURE__ */ e("span", { children: w.label })
+          ] }, x)) }),
+          m && /* @__PURE__ */ e("div", { className: `${u}--area--cta`, children: m.items.map((w, x) => /* @__PURE__ */ e("div", { className: `${u}--cta`, children: w }, x)) })
+        ] })
+      ] })
+    ] });
+  }
+), _e = ({
+  className: o,
+  theme: s = "light",
+  size: c = "narrow"
+}) => {
+  const { prefix: i } = C(), a = `${i}--card`, l = v(a, `${a}__type__score`, {
+    [`${a}__theme__${s}`]: s,
+    [`${a}__size__${c}`]: c
+  });
+  return /* @__PURE__ */ e("div", { className: v(l, o), children: /* @__PURE__ */ t("div", { className: `${a}--wrap`, children: [
+    /* @__PURE__ */ e("div", { className: `${a}--skeleton--image` }),
+    /* @__PURE__ */ t("div", { className: `${a}--content`, children: [
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--eyebrow` }),
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--title` }),
+      /* @__PURE__ */ e("div", { className: `${a}--skeleton--date` })
+    ] })
+  ] }) });
+}, B = Object.assign(oe, {
+  Skeleton: _e
+});
+B.displayName = "ScoreCard";
+B.Skeleton.displayName = "ScoreCard.Skeleton";
+const $e = {
+  stat: T,
+  multilink: F,
+  text: j,
+  promo: P,
+  feature: O,
+  detail: I,
+  factlist: M,
+  data: G,
+  score: B
+}, fe = y(
+  ({ type: o, group: s, cardCount: c = "one", cta: i, collapsed: a = !1 }, l) => {
+    const n = $e[o], { prefix: $ } = C(), _ = `${$}--cardgroup`, N = v(
+      _,
+      `${_}__count__${c}`,
+      {
+        [`${_}__collapsed`]: a
+      }
+    );
+    return /* @__PURE__ */ t("div", { className: N, ref: l, children: [
+      /* @__PURE__ */ e("div", { className: `${_}--inner`, children: s.map((r, p) => /* @__PURE__ */ e(n, { ...r }, p)) }),
+      i && /* @__PURE__ */ e("div", { className: `${_}--button-wrap`, children: /* @__PURE__ */ e(
+        S,
+        {
+          link: {
+            url: i.url,
+            label: i.label
+          },
+          type: "secondary",
+          size: "medium"
+        }
+      ) })
+    ] });
+  }
+);
+export {
+  fe as C,
+  I as D,
+  O as F,
+  F as M,
+  P,
+  T as S,
+  j as T,
+  M as a,
+  G as b,
+  B as c
+};