@ledgerhq/lumen-ui-react 0.1.16 → 0.1.18

package/dist/lib/Components/ListItem/ListItem.js

@@ -1,150 +1,148 @@
-import { jsx as n } from "react/jsx-runtime";
-import { useDisabledContext as o, DisabledProvider as c, cn as r, createSafeContext as u } from "../../../libs/utils-shared/dist/index.js";
-const [b, m] = u("ListItemTrailing", {
+import { jsx as r } from "react/jsx-runtime";
+import { useDisabledContext as l, DisabledProvider as m, cn as a, createSafeContext as u } from "../../../libs/utils-shared/dist/index.js";
+const [b, d] = u("ListItemTrailing", {
   isInTrailing: !1
-}), x = ({ ref: e, ...t }) => {
-  const { children: s, className: i, disabled: a, ...l } = t, d = o({
+}), I = ({ ref: e, ...t }) => {
+  const { children: s, className: i, disabled: n, ...o } = t, c = l({
     consumerName: "ListItem",
-    mergeWith: { disabled: a }
+    mergeWith: { disabled: n }
   });
-  return /* @__PURE__ */ n(c, { value: { disabled: d }, children: /* @__PURE__ */ n(
+  return /* @__PURE__ */ r(m, { value: { disabled: c }, children: /* @__PURE__ */ r(
     "button",
     {
       ref: e,
       type: "button",
-      disabled: d,
-      className: r(
+      disabled: c,
+      className: a(
         "flex h-64 w-full cursor-pointer items-center gap-16 rounded-md bg-base-transparent px-8 py-12 text-base transition-colors",
         "hover:bg-base-transparent-hover focus-visible:outline-2 focus-visible:outline-focus active:bg-base-transparent-pressed",
         "disabled:cursor-default disabled:bg-base-transparent disabled:text-disabled",
         i
       ),
-      ...l,
+      ...o,
       children: s
     }
   ) });
-};
-x.displayName = "ListItem";
-const p = ({
+}, p = ({
   ref: e,
   children: t,
   className: s,
   ...i
-}) => /* @__PURE__ */ n(
+}) => /* @__PURE__ */ r(
   "div",
   {
     ref: e,
-    className: r("flex min-w-0 flex-1 items-center gap-12", s),
+    className: a("flex min-w-0 flex-1 items-center gap-12", s),
     ...i,
     children: t
   }
-);
-p.displayName = "ListItemLeading";
-const I = ({
+), g = ({
   ref: e,
   children: t,
   className: s,
   ...i
-}) => /* @__PURE__ */ n(
+}) => /* @__PURE__ */ r(
   "div",
   {
     ref: e,
-    className: r("flex min-w-0 flex-1 flex-col gap-4", s),
+    className: a("flex min-w-0 flex-1 flex-col gap-4", s),
     ...i,
     children: t
   }
-);
-I.displayName = "ListItemContent";
-const f = ({
+), L = ({
   ref: e,
   children: t,
   className: s,
   ...i
-}) => /* @__PURE__ */ n(
-  "div",
-  {
-    ref: e,
-    className: r("flex min-w-0 items-center gap-8", s),
-    ...i,
-    children: t
-  }
-);
-f.displayName = "ListItemContentRow";
-const L = ({
+}) => {
+  const { isInTrailing: n } = d({
+    consumerName: "ListItemContentRow",
+    contextRequired: !1
+  });
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      ref: e,
+      className: a(
+        "flex min-w-0 items-center gap-8",
+        n && "justify-end",
+        s
+      ),
+      ...i,
+      children: t
+    }
+  );
+}, v = ({
   ref: e,
   children: t,
   className: s,
   ...i
 }) => {
-  const a = o({
+  const n = l({
     consumerName: "ListItemTitle",
     contextRequired: !0
-  }), { isInTrailing: l } = m({
+  }), { isInTrailing: o } = d({
     consumerName: "ListItemTitle",
     contextRequired: !1
   });
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ r(
     "div",
     {
       ref: e,
-      className: r(
+      className: a(
         "min-w-0 flex-1 truncate body-2-semi-bold",
-        l ? "justify-end text-end" : "justify-start text-start",
-        a && "text-disabled",
+        o ? "justify-end text-end" : "justify-start text-start",
+        n && "text-disabled",
         s
       ),
       ...i,
       children: t
     }
   );
-};
-L.displayName = "ListItemTitle";
-const g = ({
+}, N = ({
   ref: e,
   children: t,
   className: s,
   ...i
 }) => {
-  const a = o({
+  const n = l({
     consumerName: "ListItemDescription",
     contextRequired: !0
-  }), { isInTrailing: l } = m({
+  }), { isInTrailing: o } = d({
     consumerName: "ListItemDescription",
     contextRequired: !1
   });
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ r(
     "div",
     {
       ref: e,
-      className: r(
+      className: a(
         "min-w-0 flex-1 items-center truncate body-3 text-muted",
-        l ? "justify-end text-end" : "justify-start text-start",
-        a && "text-disabled",
+        o ? "justify-end text-end" : "justify-start text-start",
+        n && "text-disabled",
         s
       ),
       ...i,
       children: t
     }
   );
-};
-g.displayName = "ListItemDescription";
-const N = ({
+}, T = ({
   ref: e,
   children: t,
   className: s,
   ...i
 }) => {
-  const a = o({
+  const n = l({
     consumerName: "ListItemTrailing",
     contextRequired: !0
   });
-  return /* @__PURE__ */ n(b, { value: { isInTrailing: !0 }, children: /* @__PURE__ */ n(
+  return /* @__PURE__ */ r(b, { value: { isInTrailing: !0 }, children: /* @__PURE__ */ r(
     "div",
     {
       ref: e,
-      className: r(
+      className: a(
         "flex shrink-0 items-center",
-        a && "text-disabled",
+        n && "text-disabled",
         s
       ),
       ...i,
@@ -152,13 +150,12 @@ const N = ({
     }
   ) });
 };
-N.displayName = "ListItemTrailing";
 export {
-  x as ListItem,
-  I as ListItemContent,
-  f as ListItemContentRow,
-  g as ListItemDescription,
+  I as ListItem,
+  g as ListItemContent,
+  L as ListItemContentRow,
+  N as ListItemDescription,
   p as ListItemLeading,
-  L as ListItemTitle,
-  N as ListItemTrailing
+  v as ListItemTitle,
+  T as ListItemTrailing
 };

package/dist/lib/Components/MediaBanner/MediaBanner.d.ts

@@ -4,22 +4,13 @@ import { MediaBannerDescriptionProps, MediaBannerProps, MediaBannerTitleProps }
  *
  * @see {@link https://ldls.vercel.app/?path=/docs/communication-mediabanner--docs Storybook}
  */
-export declare const MediaBanner: {
-    ({ ref, imageUrl, onClose, closeAriaLabel, children, className, ...props }: MediaBannerProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const MediaBanner: ({ ref, imageUrl, onClose, closeAriaLabel, children, className, ...props }: MediaBannerProps) => import("react/jsx-runtime").JSX.Element;
 /**
  * The title of the MediaBanner. Clamps at 1 line.
  */
-export declare const MediaBannerTitle: {
-    ({ ref, children, className, ...props }: MediaBannerTitleProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const MediaBannerTitle: ({ ref, children, className, ...props }: MediaBannerTitleProps) => import("react/jsx-runtime").JSX.Element;
 /**
  * The description of the MediaBanner. Clamps at 2 lines.
  */
-export declare const MediaBannerDescription: {
-    ({ ref, children, className, ...props }: MediaBannerDescriptionProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const MediaBannerDescription: ({ ref, children, className, ...props }: MediaBannerDescriptionProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=MediaBanner.d.ts.map

package/dist/lib/Components/MediaBanner/MediaBanner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MediaBanner.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/MediaBanner/MediaBanner.tsx"],"names":[],"mappings":"AAKA,OAAO,EACL,2BAA2B,EAC3B,gBAAgB,EAChB,qBAAqB,EACtB,MAAM,SAAS,CAAC;AAEjB;;;;GAIG;AACH,eAAO,MAAM,WAAW;gFAQrB,gBAAgB;;CAmDlB,CAAC;AAIF;;GAEG;AACH,eAAO,MAAM,gBAAgB;6CAK1B,qBAAqB;;CAUvB,CAAC;AAIF;;GAEG;AACH,eAAO,MAAM,sBAAsB;6CAKhC,2BAA2B;;CAU7B,CAAC"}
+{"version":3,"file":"MediaBanner.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/MediaBanner/MediaBanner.tsx"],"names":[],"mappings":"AAKA,OAAO,EACL,2BAA2B,EAC3B,gBAAgB,EAChB,qBAAqB,EACtB,MAAM,SAAS,CAAC;AAEjB;;;;GAIG;AACH,eAAO,MAAM,WAAW,GAAI,2EAQzB,gBAAgB,4CAmDlB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,gBAAgB,GAAI,wCAK9B,qBAAqB,4CAUvB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,sBAAsB,GAAI,wCAKpC,2BAA2B,4CAU7B,CAAC"}

package/dist/lib/Components/MediaBanner/MediaBanner.js

@@ -1,13 +1,13 @@
-import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { jsxs as n, jsx as a } from "react/jsx-runtime";
 import { cn as s } from "../../../libs/utils-shared/dist/index.js";
 import { useState as u, useEffect as v } from "react";
 import { useCommonTranslation as x } from "../../../i18n/useCommonTranslation.js";
-import { Close as N } from "../../Symbols/Icons/Close.js";
-import { InteractiveIcon as h } from "../InteractiveIcon/InteractiveIcon.js";
-const y = ({
-  ref: o,
-  imageUrl: a,
-  onClose: r,
+import { Close as h } from "../../Symbols/Icons/Close.js";
+import { InteractiveIcon as N } from "../InteractiveIcon/InteractiveIcon.js";
+const j = ({
+  ref: r,
+  imageUrl: e,
+  onClose: o,
   closeAriaLabel: t,
   children: l,
   className: c,
@@ -16,83 +16,79 @@ const y = ({
   const { t: d } = x(), [p, i] = u(!1);
   v(() => {
     i(!1);
-  }, [a]);
-  const f = a && !p;
+  }, [e]);
+  const f = e && !p;
   return /* @__PURE__ */ n(
     "div",
     {
-      ref: o,
+      ref: r,
       className: s(
         "relative flex h-72 flex-row overflow-hidden rounded-md bg-surface",
         c
       ),
       ...m,
       children: [
-        /* @__PURE__ */ e("div", { className: "flex flex-1 items-center px-12 py-2", children: /* @__PURE__ */ e("div", { className: "flex flex-col gap-4 py-12", children: l }) }),
+        /* @__PURE__ */ a("div", { className: "flex flex-1 items-center px-12 py-2", children: /* @__PURE__ */ a("div", { className: "flex flex-col gap-4 py-12", children: l }) }),
         /* @__PURE__ */ n("div", { className: "relative w-128", children: [
-          f && /* @__PURE__ */ e(
+          f && /* @__PURE__ */ a(
             "img",
             {
-              src: a,
+              src: e,
               alt: "",
               "aria-hidden": !0,
               className: "absolute inset-0 size-full object-cover",
               onError: () => i(!0)
             }
           ),
-          /* @__PURE__ */ e("div", { className: "absolute inset-0 bg-linear-[45deg] from-black/0 from-67% to-black/80" })
+          /* @__PURE__ */ a("div", { className: "absolute inset-0 bg-linear-[45deg] from-black/0 from-67% to-black/80" })
         ] }),
-        r && /* @__PURE__ */ e(
-          h,
+        o && /* @__PURE__ */ a(
+          N,
           {
             type: "button",
             iconType: "stroked",
             appearance: "white",
+            icon: h,
+            size: 16,
             className: "absolute top-8 right-8",
             onClick: (b) => {
-              b.stopPropagation(), r();
+              b.stopPropagation(), o();
             },
-            "aria-label": t || d("components.banner.closeAriaLabel"),
-            children: /* @__PURE__ */ e(N, { size: 16 })
+            "aria-label": t || d("components.banner.closeAriaLabel")
           }
         )
       ]
     }
   );
-};
-y.displayName = "MediaBanner";
-const g = ({
-  ref: o,
-  children: a,
-  className: r,
+}, B = ({
+  ref: r,
+  children: e,
+  className: o,
   ...t
-}) => /* @__PURE__ */ e(
+}) => /* @__PURE__ */ a(
   "div",
   {
-    ref: o,
-    className: s("line-clamp-1 body-2-semi-bold text-base", r),
+    ref: r,
+    className: s("line-clamp-1 body-2-semi-bold text-base", o),
     ...t,
-    children: a
+    children: e
   }
-);
-g.displayName = "MediaBannerTitle";
-const B = ({
-  ref: o,
-  children: a,
-  className: r,
+), L = ({
+  ref: r,
+  children: e,
+  className: o,
   ...t
-}) => /* @__PURE__ */ e(
+}) => /* @__PURE__ */ a(
   "div",
   {
-    ref: o,
-    className: s("line-clamp-2 body-3 text-muted", r),
+    ref: r,
+    className: s("line-clamp-2 body-3 text-muted", o),
     ...t,
-    children: a
+    children: e
   }
 );
-B.displayName = "MediaBannerDescription";
 export {
-  y as MediaBanner,
-  B as MediaBannerDescription,
-  g as MediaBannerTitle
+  j as MediaBanner,
+  L as MediaBannerDescription,
+  B as MediaBannerTitle
 };

package/dist/lib/Components/MediaCard/MediaCard.d.ts

@@ -1,8 +1,5 @@
 import { MediaCardProps, MediaCardTitleProps } from './types';
-export declare const MediaCardTitle: {
-    ({ ref, className, children, ...props }: MediaCardTitleProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const MediaCardTitle: ({ ref, className, children, ...props }: MediaCardTitleProps) => import("react/jsx-runtime").JSX.Element;
 /**
  * A media card component for displaying a full-bleed background image with
  * composable content and a close button, using gradient overlays to ensure
@@ -26,8 +23,5 @@ export declare const MediaCardTitle: {
  *   <MediaCardTitle>Card text</MediaCardTitle>
  * </MediaCard>
  */
-export declare const MediaCard: {
-    ({ ref, imageUrl, children, onClick, onClose, closeAriaLabel, className, ...props }: MediaCardProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare const MediaCard: ({ ref, imageUrl, children, onClick, onClose, closeAriaLabel, className, ...props }: MediaCardProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=MediaCard.d.ts.map

package/dist/lib/Components/MediaCard/MediaCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MediaCard.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/MediaCard/MediaCard.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AA+C9D,eAAO,MAAM,cAAc;6CAKxB,mBAAmB;;CAUrB,CAAC;AAIF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,SAAS;yFASnB,cAAc;;CAwDhB,CAAC"}
+{"version":3,"file":"MediaCard.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/MediaCard/MediaCard.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AA+C9D,eAAO,MAAM,cAAc,GAAI,wCAK5B,mBAAmB,4CAUrB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,SAAS,GAAI,oFASvB,cAAc,4CAwDhB,CAAC"}

package/dist/lib/Components/MediaCard/MediaCard.js

@@ -1,12 +1,12 @@
-import { jsxs as m, jsx as e, Fragment as h } from "react/jsx-runtime";
-import { cn as c, getButtonA11yProps as y } from "../../../libs/utils-shared/dist/index.js";
-import { cva as a } from "class-variance-authority";
+import { jsxs as d, jsx as e, Fragment as h } from "react/jsx-runtime";
+import { cn as m, getButtonA11yProps as y } from "../../../libs/utils-shared/dist/index.js";
+import { cva as o } from "class-variance-authority";
 import { useState as x, useEffect as N } from "react";
 import { Close as w } from "../../Symbols/Icons/Close.js";
 import { useCommonTranslation as z } from "../../../i18n/useCommonTranslation.js";
-import { InteractiveIcon as C } from "../InteractiveIcon/InteractiveIcon.js";
-const o = {
-  root: a(
+import { InteractiveIcon as j } from "../InteractiveIcon/InteractiveIcon.js";
+const r = {
+  root: o(
     [
       "group relative overflow-hidden rounded-md",
       "flex h-[164px] w-full flex-col items-start justify-end p-12",
@@ -23,16 +23,16 @@ const o = {
       }
     }
   ),
-  image: a(["absolute inset-0", "size-full object-cover"]),
-  overlay: a([
+  image: o(["absolute inset-0", "size-full object-cover"]),
+  overlay: o([
     "absolute inset-0 size-full",
     "transition-colors",
     "group-hover:bg-muted-transparent-hover",
     "group-[:active:not(:has(button:active))]:bg-muted-transparent-pressed"
   ]),
-  content: a("isolate flex flex-col items-start gap-8"),
-  title: a("line-clamp-3 heading-3-semi-bold text-white")
-}, j = () => /* @__PURE__ */ m(h, { children: [
+  content: o("isolate flex flex-col items-start gap-8"),
+  title: o("line-clamp-3 heading-3-semi-bold text-white")
+}, C = () => /* @__PURE__ */ d(h, { children: [
   /* @__PURE__ */ e(
     "div",
     {
@@ -47,65 +47,65 @@ const o = {
       className: "pointer-events-none absolute inset-y-0 right-0 size-full bg-linear-[45deg] from-gradient-overlay-0 from-70% to-gradient-overlay-80"
     }
   )
-] }), E = ({
+] }), k = ({
   ref: i,
   className: t,
   children: s,
-  ...r
+  ...a
 }) => /* @__PURE__ */ e(
   "div",
   {
     ref: i,
-    className: c(o.title(), t),
-    ...r,
+    className: m(r.title(), t),
+    ...a,
     children: s
   }
-);
-E.displayName = "MediaCardTitle";
-const I = ({
+), B = ({
   ref: i,
   imageUrl: t,
   children: s,
-  onClick: r,
+  onClick: a,
   onClose: l,
   closeAriaLabel: u,
-  className: p,
-  ...f
+  className: f,
+  ...p
 }) => {
-  const { t: v } = z(), [g, d] = x(!1), b = t && !g;
+  const { t: v } = z(), [g, c] = x(!1), b = t && !g;
   return N(() => {
-    d(!1);
-  }, [t]), /* @__PURE__ */ m(
+    c(!1);
+  }, [t]), /* @__PURE__ */ d(
     "div",
     {
-      ...y({ onClick: r }),
-      className: c(
-        o.root({ interactive: !!r }),
-        p
+      ...y({ onClick: a }),
+      className: m(
+        r.root({ interactive: !!a }),
+        f
       ),
       ref: i,
-      ...f,
+      ...p,
       children: [
         b && /* @__PURE__ */ e(
           "img",
           {
             src: t,
             alt: "",
-            className: o.image(),
+            className: r.image(),
             "aria-hidden": "true",
             loading: "lazy",
-            onError: () => d(!0)
+            onError: () => c(!0)
           }
         ),
-        /* @__PURE__ */ e(j, {}),
-        /* @__PURE__ */ e("div", { "aria-hidden": "true", className: o.overlay() }),
-        /* @__PURE__ */ e("div", { className: o.content(), children: s }),
+        /* @__PURE__ */ e(C, {}),
+        /* @__PURE__ */ e("div", { "aria-hidden": "true", className: r.overlay() }),
+        /* @__PURE__ */ e("div", { className: r.content(), children: s }),
         l && /* @__PURE__ */ e(
-          C,
+          j,
           {
             type: "button",
             iconType: "stroked",
             appearance: "white",
+            icon: w,
+            size: 20,
             "aria-label": u || v("common.closeAriaLabel"),
             className: "absolute top-12 right-12 z-10",
             onClick: (n) => {
@@ -113,16 +113,14 @@ const I = ({
             },
             onKeyDown: (n) => {
               n.stopPropagation();
-            },
-            children: /* @__PURE__ */ e(w, { size: 20 })
+            }
           }
         )
       ]
     }
   );
 };
-I.displayName = "MediaCard";
 export {
-  I as MediaCard,
-  E as MediaCardTitle
+  B as MediaCard,
+  k as MediaCardTitle
 };

package/dist/lib/Components/MediaImage/MediaImage.d.ts

@@ -0,0 +1,16 @@
+import { MediaImageProps, MediaImageSize } from './types';
+export declare const mediaImageDotSizeMap: Record<MediaImageSize, number>;
+/**
+ * A generic media image component that displays an image with optional shape variants.
+ * Supports square and circular appearances with consistent sizing.
+ *
+ * When the image fails to load or no src is provided, displays a background placeholder
+ * or an optional text fallback.
+ *
+ * @example
+ * import { MediaImage } from '@ledgerhq/lumen-ui-react';
+ *
+ * <MediaImage src="https://example.com/icon.png" alt="Bitcoin" size={32} />
+ */
+export declare const MediaImage: ({ ref, className, src, alt, size, shape, imgLoading, ...props }: MediaImageProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=MediaImage.d.ts.map

package/dist/lib/Components/MediaImage/MediaImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MediaImage.d.ts","sourceRoot":"","sources":["../../../../src/lib/Components/MediaImage/MediaImage.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AA0B1D,eAAO,MAAM,oBAAoB,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAStD,CAAC;AAEX;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,UAAU,GAAI,iEASxB,eAAe,4CA8BjB,CAAC"}

package/dist/lib/Components/MediaImage/MediaImage.js

@@ -0,0 +1,74 @@
+import { jsx as r } from "react/jsx-runtime";
+import { cn as c } from "../../../libs/utils-shared/dist/index.js";
+import { cva as f } from "class-variance-authority";
+import { useState as z, useEffect as g } from "react";
+const p = {
+  root: f(
+    "relative inline-flex shrink-0 items-center justify-center overflow-hidden bg-muted-transparent",
+    {
+      variants: {
+        size: {
+          12: "size-12 rounded-xs",
+          16: "size-16 rounded-xs",
+          20: "size-20 rounded-xs",
+          24: "size-24 rounded-sm",
+          32: "size-32 rounded-sm",
+          40: "size-40 rounded-md",
+          48: "size-48 rounded-md",
+          56: "size-56 rounded-lg"
+        },
+        shape: {
+          square: "",
+          circle: "rounded-full"
+        }
+      }
+    }
+  )
+}, j = {
+  12: 8,
+  16: 8,
+  20: 8,
+  24: 10,
+  32: 12,
+  40: 16,
+  48: 20,
+  56: 24
+}, E = ({
+  ref: a,
+  className: o,
+  src: e,
+  alt: i,
+  size: t = 48,
+  shape: d = "square",
+  imgLoading: n = "eager",
+  ...l
+}) => {
+  const [m, s] = z(!1), u = !e || m;
+  return g(() => {
+    s(!1);
+  }, [e]), /* @__PURE__ */ r(
+    "div",
+    {
+      ref: a,
+      className: c(p.root({ size: t, shape: d }), o),
+      role: "img",
+      "aria-label": i,
+      ...l,
+      children: u ? /* @__PURE__ */ r("span", { className: "text-muted select-none", "aria-hidden": "true" }) : /* @__PURE__ */ r(
+        "img",
+        {
+          src: e,
+          alt: "",
+          loading: n,
+          onError: () => s(!0),
+          className: "size-full object-cover",
+          "aria-hidden": "true"
+        }
+      )
+    }
+  );
+};
+export {
+  E as MediaImage,
+  j as mediaImageDotSizeMap
+};

package/dist/lib/Components/MediaImage/index.d.ts

@@ -0,0 +1,3 @@
+export { MediaImage, mediaImageDotSizeMap } from './MediaImage';
+export * from './types';
+//# sourceMappingURL=index.d.ts.map