@mond-design-system/react 4.10.2 → 4.12.0

package/dist/index.cjs

@@ -1788,13 +1788,14 @@ function ToastProvider({
 var Stack_module_default = { "stack": "mds-Stack__stack", "gap-hairline": "mds-Stack__gap-hairline", "gap-tight": "mds-Stack__gap-tight", "gap-base": "mds-Stack__gap-base", "gap-loose": "mds-Stack__gap-loose", "gap-group": "mds-Stack__gap-group", "gap-section": "mds-Stack__gap-section", "align-start": "mds-Stack__align-start", "align-center": "mds-Stack__align-center", "align-end": "mds-Stack__align-end", "align-stretch": "mds-Stack__align-stretch" };
 
 // src/components/Stack/Stack.tsx
-function Stack({
-  gap = "base",
-  align = "stretch",
-  as = "div",
-  className,
-  ...rest
-}) {
+function Stack(props) {
+  const {
+    gap = "base",
+    align = "stretch",
+    as = "div",
+    className,
+    ...rest
+  } = props;
   return react.createElement(as, {
     className: cx(Stack_module_default.stack, Stack_module_default[`gap-${gap}`], Stack_module_default[`align-${align}`], className),
     ...rest
@@ -1805,15 +1806,16 @@ function Stack({
 var Inline_module_default = { "inline": "mds-Inline__inline", "gap-hairline": "mds-Inline__gap-hairline", "gap-tight": "mds-Inline__gap-tight", "gap-base": "mds-Inline__gap-base", "gap-loose": "mds-Inline__gap-loose", "align-start": "mds-Inline__align-start", "align-center": "mds-Inline__align-center", "align-end": "mds-Inline__align-end", "align-baseline": "mds-Inline__align-baseline", "justify-start": "mds-Inline__justify-start", "justify-center": "mds-Inline__justify-center", "justify-end": "mds-Inline__justify-end", "justify-between": "mds-Inline__justify-between", "wrap": "mds-Inline__wrap" };
 
 // src/components/Inline/Inline.tsx
-function Inline({
-  gap = "base",
-  align = "center",
-  justify = "start",
-  wrap = false,
-  as = "div",
-  className,
-  ...rest
-}) {
+function Inline(props) {
+  const {
+    gap = "base",
+    align = "center",
+    justify = "start",
+    wrap = false,
+    as = "div",
+    className,
+    ...rest
+  } = props;
   return react.createElement(as, {
     className: cx(
       Inline_module_default.inline,
@@ -1831,12 +1833,8 @@ function Inline({
 var Container_module_default = { "container": "mds-Container__container", "width-content": "mds-Container__width-content", "width-wide": "mds-Container__width-wide" };
 
 // src/components/Container/Container.tsx
-function Container({
-  width = "content",
-  as = "div",
-  className,
-  ...rest
-}) {
+function Container(props) {
+  const { width = "content", as = "div", className, ...rest } = props;
   return react.createElement(as, {
     className: cx(Container_module_default.container, Container_module_default[`width-${width}`], className),
     ...rest
@@ -1844,7 +1842,7 @@ function Container({
 }
 
 // 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" };
+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" };
 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);
   if (href !== void 0) {
@@ -1870,8 +1868,16 @@ 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({ className, ...rest }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx(Card_module_default.body, className), ...rest });
+function CardBody({ lines, className, style, ...rest }) {
+  const vars = lines === void 0 ? void 0 : { "--card-lines": lines };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: cx(Card_module_default.body, lines !== void 0 && Card_module_default.clipped, className),
+      style: { ...vars, ...style },
+      ...rest
+    }
+  );
 }
 function CardFooter({ className, ...rest }) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx(Card_module_default.footer, className), ...rest });