@mond-design-system/react 6.2.2 → 6.3.0

package/dist/index.cjs

@@ -1933,7 +1933,7 @@ function Container(props) {
 }
 
 // mds-cssmod:/home/runner/work/mond-design-system/mond-design-system/packages/react/src/components/Card/Card.module.css?mds-scoped
-var Card_module_default = { "card": "mds-Card__card", "variant-raised": "mds-Card__variant-raised", "variant-sunken": "mds-Card__variant-sunken", "emphasis": "mds-Card__emphasis", "interactive": "mds-Card__interactive", "header": "mds-Card__header", "body": "mds-Card__body", "footer": "mds-Card__footer", "clipped": "mds-Card__clipped" };
+var Card_module_default = { "card": "mds-Card__card", "variant-raised": "mds-Card__variant-raised", "variant-sunken": "mds-Card__variant-sunken", "emphasis": "mds-Card__emphasis", "interactive": "mds-Card__interactive", "header": "mds-Card__header", "body": "mds-Card__body", "footer": "mds-Card__footer", "clipped": "mds-Card__clipped", "flowed": "mds-Card__flowed" };
 function Card({ children, variant = "card", emphasis = false, onClick, href, as, className, ref, ...rest }) {
   const cardClass = cx(Card_module_default.card, Card_module_default[`variant-${variant}`], emphasis && Card_module_default.emphasis, className);
   const own = react.useRef(null);
@@ -1973,12 +1973,13 @@ function Card({ children, variant = "card", emphasis = false, onClick, href, as,
 function CardHeader({ className, ...rest }) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx(Card_module_default.header, className), ...rest });
 }
-function CardBody({ lines, className, style, ...rest }) {
-  const vars = lines === void 0 ? void 0 : { "--card-lines": lines };
+function CardBody({ lines, clip = "ellipsis", className, style, ...rest }) {
+  const budgeted = lines !== void 0;
+  const vars = budgeted ? { "--card-lines": lines } : void 0;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      className: cx(Card_module_default.body, lines !== void 0 && Card_module_default.clipped, className),
+      className: cx(Card_module_default.body, budgeted && (clip === "flow" ? Card_module_default.flowed : Card_module_default.clipped), className),
       style: { ...vars, ...style },
       ...rest
     }
@@ -2538,7 +2539,7 @@ function SideNavItem({
 }
 
 // mds-cssmod:/home/runner/work/mond-design-system/mond-design-system/packages/react/src/components/MediaPlaceholder/MediaPlaceholder.module.css?mds-scoped
-var MediaPlaceholder_module_default = { "media": "mds-MediaPlaceholder__media", "fill": "mds-MediaPlaceholder__fill", "image": "mds-MediaPlaceholder__image", "caption": "mds-MediaPlaceholder__caption", "cover": "mds-MediaPlaceholder__cover", "blurred": "mds-MediaPlaceholder__blurred" };
+var MediaPlaceholder_module_default = { "media": "mds-MediaPlaceholder__media", "frame": "mds-MediaPlaceholder__frame", "fill": "mds-MediaPlaceholder__fill", "image": "mds-MediaPlaceholder__image", "caption": "mds-MediaPlaceholder__caption", "cover": "mds-MediaPlaceholder__cover", "blurred": "mds-MediaPlaceholder__blurred" };
 function MediaPlaceholder({
   aspect,
   src,
@@ -2554,13 +2555,13 @@ function MediaPlaceholder({
   const [failed, setFailed] = react.useState();
   const picture = src !== void 0 && failed !== src;
   const vars = aspect === void 0 ? {} : { "--media-aspect": aspect };
-  return /* @__PURE__ */ jsxRuntime.jsxs(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
       className: cx(MediaPlaceholder_module_default.media, blurred && MediaPlaceholder_module_default.blurred, className),
       style: { ...vars, ...style },
       ...rest,
-      children: [
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: MediaPlaceholder_module_default.frame, children: [
         picture ? /* @__PURE__ */ jsxRuntime.jsx(
           "img",
           {
@@ -2577,7 +2578,7 @@ function MediaPlaceholder({
         ] }),
         picture && caption !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(Text, { variant: "meta", tone: "on-media", className: MediaPlaceholder_module_default.caption, children: caption }),
         cover !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: MediaPlaceholder_module_default.cover, children: cover })
-      ]
+      ] })
     }
   );
 }