@elliemae/ds-card 3.5.0-rc.7 → 3.5.1-next.0

package/dist/cjs/DSCard.js

@@ -30,7 +30,7 @@ __export(DSCard_exports, {
 });
 module.exports = __toCommonJS(DSCard_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_ds_classnames = require("@elliemae/ds-classnames");
 var import_DSCardBody = __toESM(require("./DSCardBody"));
@@ -42,13 +42,14 @@ const DSCard = ({
   ...otherProps
 }) => {
   const { cssClassName } = (0, import_ds_classnames.convertPropToCssClassName)("card");
-  return /* @__PURE__ */ import_react.default.createElement("div", {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
     "data-testid": "card",
     ...containerProps,
     ref: innerRef,
     className: cssClassName,
-    ...otherProps
-  }, children);
+    ...otherProps,
+    children
+  });
 };
 const cardProps = {
   containerProps: import_ds_utilities.PropTypes.object.description(

package/dist/cjs/DSCard.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/DSCard.tsx", "../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport DSCardBody from './DSCardBody';\nimport DSCardHeader from './DSCardHeader';\n\nconst DSCard = ({\n  innerRef = undefined,\n  children = null,\n  containerProps = {},\n  ...otherProps\n}) => {\n  const { cssClassName } = convertPropToCssClassName('card');\n\n  return (\n    <div\n      data-testid=\"card\"\n      {...containerProps}\n      ref={innerRef}\n      className={cssClassName}\n      {...otherProps}\n    >\n      {children}\n    </div>\n  );\n};\n\nconst cardProps = {\n  /** inject props to component wrapper */\n  containerProps: PropTypes.object.description(\n    'inject props to component wrapper',\n  ),\n  /**\n   * Get reference for the button\n   */\n  innerRef: PropTypes.string.description('Get reference for the button'),\n  /**\n   * DSCardBody and DSCardHeader\n   */\n  children: PropTypes.arrayOf(\n    PropTypes.shape({\n      type: PropTypes.oneOf([DSCardHeader, DSCardBody]),\n    }),\n  ).description('DSCardBody and DSCardHeader'),\n};\n\nDSCard.propTypes = cardProps;\nDSCard.displayName = 'DSCard';\nconst DSCardWithSchema = describe(DSCard);\nDSCardWithSchema.propTypes = cardProps;\n\nexport { DSCard, DSCardWithSchema };\nexport default DSCard;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAoC;AACpC,2BAA0C;AAC1C,wBAAuB;AACvB,0BAAyB;AAEzB,MAAM,SAAS,CAAC;AAAA,EACd,WAAW;AAAA,EACX,WAAW;AAAA,EACX,iBAAiB,CAAC;AAAA,KACf;AACL,MAAM;AACJ,QAAM,EAAE,aAAa,QAAI,gDAA0B,MAAM;AAEzD,SACE,6BAAAA,QAAA,cAAC;AAAA,IACC,eAAY;AAAA,IACX,GAAG;AAAA,IACJ,KAAK;AAAA,IACL,WAAW;AAAA,IACV,GAAG;AAAA,KAEH,QACH;AAEJ;AAEA,MAAM,YAAY;AAAA,EAEhB,gBAAgB,8BAAU,OAAO;AAAA,IAC/B;AAAA,EACF;AAAA,EAIA,UAAU,8BAAU,OAAO,YAAY,8BAA8B;AAAA,EAIrE,UAAU,8BAAU;AAAA,IAClB,8BAAU,MAAM;AAAA,MACd,MAAM,8BAAU,MAAM,CAAC,oBAAAC,SAAc,kBAAAC,OAAU,CAAC;AAAA,IAClD,CAAC;AAAA,EACH,EAAE,YAAY,6BAA6B;AAC7C;AAEA,OAAO,YAAY;AACnB,OAAO,cAAc;AACrB,MAAM,uBAAmB,8BAAS,MAAM;AACxC,iBAAiB,YAAY;AAG7B,IAAO,iBAAQ;",
-  "names": ["React", "DSCardHeader", "DSCardBody"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,0BAAoC;AACpC,2BAA0C;AAC1C,wBAAuB;AACvB,0BAAyB;AAEzB,MAAM,SAAS,CAAC;AAAA,EACd,WAAW;AAAA,EACX,WAAW;AAAA,EACX,iBAAiB,CAAC;AAAA,KACf;AACL,MAAM;AACJ,QAAM,EAAE,aAAa,QAAI,gDAA0B,MAAM;AAEzD,SACE,4CAAC;AAAA,IACC,eAAY;AAAA,IACX,GAAG;AAAA,IACJ,KAAK;AAAA,IACL,WAAW;AAAA,IACV,GAAG;AAAA,IAEH;AAAA,GACH;AAEJ;AAEA,MAAM,YAAY;AAAA,EAEhB,gBAAgB,8BAAU,OAAO;AAAA,IAC/B;AAAA,EACF;AAAA,EAIA,UAAU,8BAAU,OAAO,YAAY,8BAA8B;AAAA,EAIrE,UAAU,8BAAU;AAAA,IAClB,8BAAU,MAAM;AAAA,MACd,MAAM,8BAAU,MAAM,CAAC,oBAAAA,SAAc,kBAAAC,OAAU,CAAC;AAAA,IAClD,CAAC;AAAA,EACH,EAAE,YAAY,6BAA6B;AAC7C;AAEA,OAAO,YAAY;AACnB,OAAO,cAAc;AACrB,MAAM,uBAAmB,8BAAS,MAAM;AACxC,iBAAiB,YAAY;AAG7B,IAAO,iBAAQ;",
+  "names": ["DSCardHeader", "DSCardBody"]
 }

package/dist/cjs/DSCardBody.js

@@ -30,12 +30,13 @@ __export(DSCardBody_exports, {
 });
 module.exports = __toCommonJS(DSCardBody_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_utilities = require("@elliemae/ds-utilities");
-const DSCardBody = ({ children }) => /* @__PURE__ */ import_react.default.createElement("div", {
+const DSCardBody = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
   className: "em-ds-card-body",
-  "data-testid": "card-body"
-}, children);
+  "data-testid": "card-body",
+  children
+});
 const bodyProps = {
   children: import_ds_utilities.PropTypes.element.description("children")
 };

package/dist/cjs/DSCardBody.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/DSCardBody.tsx", "../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\n\nconst DSCardBody = ({ children }) => (\n  <div className=\"em-ds-card-body\" data-testid=\"card-body\">\n    {children}\n  </div>\n);\n\nconst bodyProps = {\n  /** children */\n  children: PropTypes.element.description('children'),\n};\n\nDSCardBody.propTypes = bodyProps;\nDSCardBody.displayName = 'DSCardBody';\nconst DSCardBodyWithSchema = describe(DSCardBody);\nDSCardBodyWithSchema.propTypes = bodyProps;\n\nexport { DSCardBody, DSCardBodyWithSchema };\nexport default DSCardBody;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAoC;AAEpC,MAAM,aAAa,CAAC,EAAE,SAAS,MAC7B,6BAAAA,QAAA,cAAC;AAAA,EAAI,WAAU;AAAA,EAAkB,eAAY;AAAA,GAC1C,QACH;AAGF,MAAM,YAAY;AAAA,EAEhB,UAAU,8BAAU,QAAQ,YAAY,UAAU;AACpD;AAEA,WAAW,YAAY;AACvB,WAAW,cAAc;AACzB,MAAM,2BAAuB,8BAAS,UAAU;AAChD,qBAAqB,YAAY;AAGjC,IAAO,qBAAQ;",
-  "names": ["React"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,0BAAoC;AAEpC,MAAM,aAAa,CAAC,EAAE,SAAS,MAC7B,4CAAC;AAAA,EAAI,WAAU;AAAA,EAAkB,eAAY;AAAA,EAC1C;AAAA,CACH;AAGF,MAAM,YAAY;AAAA,EAEhB,UAAU,8BAAU,QAAQ,YAAY,UAAU;AACpD;AAEA,WAAW,YAAY;AACvB,WAAW,cAAc;AACzB,MAAM,2BAAuB,8BAAS,UAAU;AAChD,qBAAqB,YAAY;AAGjC,IAAO,qBAAQ;",
+  "names": []
 }

package/dist/cjs/DSCardHeader.js

@@ -30,22 +30,28 @@ __export(DSCardHeader_exports, {
 });
 module.exports = __toCommonJS(DSCardHeader_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_ds_classnames = require("@elliemae/ds-classnames");
 const DSCardHeader = ({ title, action }) => {
   const { cssClassName, classNameElement } = (0, import_ds_classnames.convertPropToCssClassName)(
     "card-header"
   );
-  return /* @__PURE__ */ import_react.default.createElement("div", {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
     className: cssClassName,
-    "data-testid": "card-header"
-  }, /* @__PURE__ */ import_react.default.createElement("span", {
-    className: classNameElement("heading")
-  }, title), /* @__PURE__ */ import_react.default.createElement("div", {
-    className: classNameElement("pull-right"),
-    "data-testid": "ds-card_header-action"
-  }, action));
+    "data-testid": "card-header",
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+        className: classNameElement("heading"),
+        children: title
+      }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+        className: classNameElement("pull-right"),
+        "data-testid": "ds-card_header-action",
+        children: action
+      })
+    ]
+  });
 };
 const cardHeader = {
   title: import_ds_utilities.PropTypes.string.description("card header title"),

package/dist/cjs/DSCardHeader.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/DSCardHeader.tsx", "../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\n\nconst DSCardHeader = ({ title, action }) => {\n  const { cssClassName, classNameElement } = convertPropToCssClassName(\n    'card-header',\n  );\n  return (\n    <div className={cssClassName} data-testid=\"card-header\">\n      <span className={classNameElement('heading')}>{title}</span>\n      <div\n        className={classNameElement('pull-right')}\n        data-testid=\"ds-card_header-action\"\n      >\n        {action}\n      </div>\n    </div>\n  );\n};\n\nconst cardHeader = {\n  /** card header title */\n  title: PropTypes.string.description('card header title'),\n  /** action */\n  action: PropTypes.node.description('action'),\n};\n\nDSCardHeader.propTypes = cardHeader;\nDSCardHeader.displayName = 'DSCardHeader';\nconst DSCardHeaderWithSchema = describe(DSCardHeader);\nDSCardHeaderWithSchema.propTypes = cardHeader;\n\nexport { DSCardHeader, DSCardHeaderWithSchema };\nexport default DSCardHeader;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAoC;AACpC,2BAA0C;AAE1C,MAAM,eAAe,CAAC,EAAE,OAAO,OAAO,MAAM;AAC1C,QAAM,EAAE,cAAc,iBAAiB,QAAI;AAAA,IACzC;AAAA,EACF;AACA,SACE,6BAAAA,QAAA,cAAC;AAAA,IAAI,WAAW;AAAA,IAAc,eAAY;AAAA,KACxC,6BAAAA,QAAA,cAAC;AAAA,IAAK,WAAW,iBAAiB,SAAS;AAAA,KAAI,KAAM,GACrD,6BAAAA,QAAA,cAAC;AAAA,IACC,WAAW,iBAAiB,YAAY;AAAA,IACxC,eAAY;AAAA,KAEX,MACH,CACF;AAEJ;AAEA,MAAM,aAAa;AAAA,EAEjB,OAAO,8BAAU,OAAO,YAAY,mBAAmB;AAAA,EAEvD,QAAQ,8BAAU,KAAK,YAAY,QAAQ;AAC7C;AAEA,aAAa,YAAY;AACzB,aAAa,cAAc;AAC3B,MAAM,6BAAyB,8BAAS,YAAY;AACpD,uBAAuB,YAAY;AAGnC,IAAO,uBAAQ;",
-  "names": ["React"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,0BAAoC;AACpC,2BAA0C;AAE1C,MAAM,eAAe,CAAC,EAAE,OAAO,OAAO,MAAM;AAC1C,QAAM,EAAE,cAAc,iBAAiB,QAAI;AAAA,IACzC;AAAA,EACF;AACA,SACE,6CAAC;AAAA,IAAI,WAAW;AAAA,IAAc,eAAY;AAAA,IACxC;AAAA,kDAAC;AAAA,QAAK,WAAW,iBAAiB,SAAS;AAAA,QAAI;AAAA,OAAM;AAAA,MACrD,4CAAC;AAAA,QACC,WAAW,iBAAiB,YAAY;AAAA,QACxC,eAAY;AAAA,QAEX;AAAA,OACH;AAAA;AAAA,GACF;AAEJ;AAEA,MAAM,aAAa;AAAA,EAEjB,OAAO,8BAAU,OAAO,YAAY,mBAAmB;AAAA,EAEvD,QAAQ,8BAAU,KAAK,YAAY,QAAQ;AAC7C;AAEA,aAAa,YAAY;AACzB,aAAa,cAAc;AAC3B,MAAM,6BAAyB,8BAAS,YAAY;AACpD,uBAAuB,YAAY;AAGnC,IAAO,uBAAQ;",
+  "names": []
 }

package/dist/cjs/detail/DetailCard.js

@@ -30,7 +30,7 @@ __export(DetailCard_exports, {
 });
 module.exports = __toCommonJS(DetailCard_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_lodash = require("lodash");
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_ds_icons = require("@elliemae/ds-icons");
@@ -67,67 +67,105 @@ const DetailCard = ({
     topWrapperCols.unshift("20px");
   if (selectable)
     topWrapperCols.unshift(theme.space.s);
-  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_styled.Container, {
-    disabled: disabled || readOnly,
-    active: selectable && isSelected,
-    "data-testid": "card-detail-container"
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    cols: topWrapperCols,
-    alignItems: !description ? "center" : void 0
-  }, selectable && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    pt: description && "9px"
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_form.DSCheckbox, {
-    checked: isSelected,
-    onChange: onSelect,
-    readOnly,
-    disabled,
-    "data-testid": "card-checkbox"
-  })), expandable && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    height: "16px",
-    pt: description && "xxs",
-    mt: !description && "-5px"
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_button.default, {
-    size: "s",
-    buttonType: "text",
-    containerProps: {
-      "data-testid": "expand-button"
-    },
-    onClick: onExpand,
-    icon: isExpanded ? /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ArrowheadDown, {
-      color: ["neutral", "500"],
-      size: "s"
-    }) : /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ArrowheadRight, {
-      color: ["neutral", "500"],
-      size: "s"
-    }),
-    disabled
-  })), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    pr: "24px"
-  }, /* @__PURE__ */ import_react.default.createElement(import_styled.Title, null, title), description && /* @__PURE__ */ import_react.default.createElement(import_styled.Description, {
-    descriptionColor
-  }, description)), hasRightPosition && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    cols: (0, import_lodash.compact)([hasRightPosition && "auto", rightAddon && "auto"])
-  }, hasRightLegend && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    pr: "24px",
-    rows: ["auto", "auto", 1]
-  }, /* @__PURE__ */ import_react.default.createElement(import_styled.RightDescription, {
-    justifyContent: "flex-end"
-  }, rightDescription), /* @__PURE__ */ import_react.default.createElement(import_styled.RightValue, {
-    justifyContent: "flex-end"
-  }, rightValue), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null)), rightAddon && /* @__PURE__ */ import_react.default.createElement(import_styled.RightAddon, {
-    cols: ["auto", "auto"],
-    gutter: "2px"
-  }, rightAddon))), expandContent && isExpanded && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    ml: selectable && "s",
-    mr: rightAddon && "xs"
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_separator.default, {
-    dashed: true,
-    position: "initial",
-    margin: "none"
-  }), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    pt: "xxs",
-    "data-testid": "detail-card-expanded-content"
-  }, expandContent))));
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+    children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styled.Container, {
+      disabled: disabled || readOnly,
+      active: selectable && isSelected,
+      "data-testid": "card-detail-container",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, {
+          cols: topWrapperCols,
+          alignItems: !description ? "center" : void 0,
+          children: [
+            selectable && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, {
+              pt: description && "9px",
+              children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_form.DSCheckbox, {
+                checked: isSelected,
+                onChange: onSelect,
+                readOnly,
+                disabled,
+                "data-testid": "card-checkbox"
+              })
+            }),
+            expandable && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, {
+              height: "16px",
+              pt: description && "xxs",
+              mt: !description && "-5px",
+              children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_button.default, {
+                size: "s",
+                buttonType: "text",
+                containerProps: {
+                  "data-testid": "expand-button"
+                },
+                onClick: onExpand,
+                icon: isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ArrowheadDown, {
+                  color: ["neutral", "500"],
+                  size: "s"
+                }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ArrowheadRight, {
+                  color: ["neutral", "500"],
+                  size: "s"
+                }),
+                disabled
+              })
+            }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, {
+              pr: "24px",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.Title, {
+                  children: title
+                }),
+                description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.Description, {
+                  descriptionColor,
+                  children: description
+                })
+              ]
+            }),
+            hasRightPosition && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, {
+              cols: (0, import_lodash.compact)([hasRightPosition && "auto", rightAddon && "auto"]),
+              children: [
+                hasRightLegend && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, {
+                  pr: "24px",
+                  rows: ["auto", "auto", 1],
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.RightDescription, {
+                      justifyContent: "flex-end",
+                      children: rightDescription
+                    }),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.RightValue, {
+                      justifyContent: "flex-end",
+                      children: rightValue
+                    }),
+                    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, {})
+                  ]
+                }),
+                rightAddon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.RightAddon, {
+                  cols: ["auto", "auto"],
+                  gutter: "2px",
+                  children: rightAddon
+                })
+              ]
+            })
+          ]
+        }),
+        expandContent && isExpanded && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, {
+          ml: selectable && "s",
+          mr: rightAddon && "xs",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_separator.default, {
+              dashed: true,
+              position: "initial",
+              margin: "none"
+            }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, {
+              pt: "xxs",
+              "data-testid": "detail-card-expanded-content",
+              children: expandContent
+            })
+          ]
+        })
+      ]
+    })
+  });
 };
 const detailProps = {
   title: import_ds_utilities.PropTypes.string.isRequired.description("Title of the card."),

package/dist/cjs/detail/DetailCard.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/detail/DetailCard.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable jsx-a11y/click-events-have-key-events */\n/* eslint-disable complexity */\nimport React from 'react';\nimport { compact, noop } from 'lodash';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { ArrowheadDown, ArrowheadRight } from '@elliemae/ds-icons';\nimport { useTheme } from '@elliemae/ds-system';\nimport DSButton from '@elliemae/ds-button';\nimport DSSeparator from '@elliemae/ds-separator';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSCheckbox } from '@elliemae/ds-form';\nimport { Container, Title, Description, RightAddon, RightDescription, RightValue } from './styled';\n\nconst DetailCard = ({\n  title,\n  description,\n  descriptionColor = 'neutral',\n  rightValue,\n  rightDescription,\n  rightAddon,\n  // select props\n  selectable = false,\n  isSelected = false,\n  onSelect = noop,\n  // expand props\n  expandable = false,\n  isExpanded = false,\n  onExpand = noop,\n  expandContent,\n  // state props\n  readOnly = false,\n  disabled = false,\n}) => {\n  const theme = useTheme();\n  const hasRightLegend = rightValue && rightDescription;\n  const hasRightPosition = hasRightLegend || rightAddon;\n  const topWrapperCols = ['1fr'];\n  if (hasRightPosition) topWrapperCols.push('auto');\n  if (expandable) topWrapperCols.unshift('20px');\n  if (selectable) topWrapperCols.unshift(theme.space.s);\n  return (\n    <>\n      <Container disabled={disabled || readOnly} active={selectable && isSelected} data-testid=\"card-detail-container\">\n        <Grid cols={topWrapperCols} alignItems={!description ? 'center' : undefined}>\n          {selectable && (\n            <Grid pt={description && '9px'}>\n              <DSCheckbox\n                checked={isSelected}\n                onChange={onSelect}\n                readOnly={readOnly}\n                disabled={disabled}\n                data-testid=\"card-checkbox\"\n              />\n            </Grid>\n          )}\n          {expandable && (\n            <Grid height=\"16px\" pt={description && 'xxs'} mt={!description && '-5px'}>\n              <DSButton\n                size=\"s\"\n                buttonType=\"text\"\n                containerProps={{\n                  'data-testid': 'expand-button',\n                }}\n                onClick={onExpand}\n                icon={\n                  isExpanded ? (\n                    <ArrowheadDown color={['neutral', '500']} size=\"s\" />\n                  ) : (\n                    <ArrowheadRight color={['neutral', '500']} size=\"s\" />\n                  )\n                }\n                disabled={disabled}\n              />\n            </Grid>\n          )}\n          <Grid pr=\"24px\">\n            <Title>{title}</Title>\n            {description && <Description descriptionColor={descriptionColor}>{description}</Description>}\n          </Grid>\n          {hasRightPosition && (\n            <Grid cols={compact([hasRightPosition && 'auto', rightAddon && 'auto'])}>\n              {hasRightLegend && (\n                <Grid pr=\"24px\" rows={['auto', 'auto', 1]}>\n                  <RightDescription justifyContent=\"flex-end\">{rightDescription}</RightDescription>\n                  <RightValue justifyContent=\"flex-end\">{rightValue}</RightValue>\n                  <Grid />\n                </Grid>\n              )}\n              {rightAddon && (\n                <RightAddon cols={['auto', 'auto']} gutter=\"2px\">\n                  {rightAddon}\n                </RightAddon>\n              )}\n            </Grid>\n          )}\n        </Grid>\n        {expandContent && isExpanded && (\n          <Grid ml={selectable && 's'} mr={rightAddon && 'xs'}>\n            <DSSeparator dashed position=\"initial\" margin=\"none\" />\n            <Grid pt=\"xxs\" data-testid=\"detail-card-expanded-content\">\n              {expandContent}\n            </Grid>\n          </Grid>\n        )}\n      </Container>\n    </>\n  );\n};\n\nconst detailProps = {\n  /**\n   * Title of the card.\n   */\n  title: PropTypes.string.isRequired.description('Title of the card.'),\n  /**\n   * Description of the card.\n   */\n  description: PropTypes.string.description('Description of the card.'),\n  /**\n   * Description color.\n   */\n  descriptionColor: PropTypes.oneOf(['primary', 'neutral']).description('Description color.'),\n  /**\n   * Right value (should be used with `rightDescription`)\n   */\n  rightValue: PropTypes.string.description('Right value (should be used with `rightDescription`)'),\n  /**\n   * Right description (should be used with `rightValue`)\n   */\n  rightDescription: PropTypes.string.description('Right description (should be used with `rightValue`)'),\n  /**\n   * Right addon array, max elements: 2\n   */\n  rightAddon: PropTypes.element.description('Right addon array, max elements: 2'),\n  /**\n   * Whether if the card is selectable or not\n   */\n  selectable: PropTypes.bool.description('Whether if the card is selectable or not'),\n  /**\n   * Whether if the card is selected or not\n   */\n  isSelected: PropTypes.bool.description('Whether if the card is selected or not'),\n  /**\n   * Callback on selection\n   */\n  onSelect: PropTypes.func.description('Callback on selection'),\n  /**\n   * Whether if the card is expandable or not\n   */\n  expandable: PropTypes.bool.description('Whether if the card is expandable or not'),\n  /**\n   * Whether if the card is expanded or not\n   */\n  isExpanded: PropTypes.bool.description('Whether if the card is expanded or not'),\n  /**\n   * Callback on expand\n   */\n  onExpand: PropTypes.func.description('Callback on expand'),\n  /**\n   * Content\n   */\n  expandContent: PropTypes.element.description('Content'),\n  /**\n   * Read only\n   */\n  readOnly: PropTypes.bool.description('Read only'),\n  /**\n   * Disabled\n   */\n  disabled: PropTypes.bool.description('Disabled'),\n};\n\nDetailCard.propTypes = detailProps;\nDetailCard.displayName = 'DetailCard';\nconst DSCardDetailWithSchema = describe(DetailCard);\nDSCardDetailWithSchema.propTypes = detailProps;\n\nexport { DetailCard, DSCardDetailWithSchema };\nexport default DetailCard;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
-  "names": ["React", "DSButton", "DSSeparator"]
+  "mappings": "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",
+  "names": ["DSButton", "DSSeparator"]
 }

package/dist/cjs/v2/ActionAddon.js

@@ -30,7 +30,7 @@ __export(ActionAddon_exports, {
 });
 module.exports = __toCommonJS(ActionAddon_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_ds_system = require("@elliemae/ds-system");
 var import_ds_icons = require("@elliemae/ds-icons");
@@ -51,10 +51,10 @@ const Addon = (0, import_ds_system.styled)(import_ds_button.default)`
     border: none !important; /* needed */
   }
 `;
-const ActionAddon = ({ label, onClick, icon }) => /* @__PURE__ */ import_react.default.createElement(Addon, {
+const ActionAddon = ({ label, onClick, icon }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Addon, {
   onClick,
   labelText: label,
-  icon: icon || /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ChevronSmallDown, {
+  icon: icon || /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ChevronSmallDown, {
     color: ["brand-primary", 700]
   })
 });

package/dist/cjs/v2/ActionAddon.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/v2/ActionAddon.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { styled } from '@elliemae/ds-system';\nimport { ChevronSmallDown } from '@elliemae/ds-icons';\nimport Button from '@elliemae/ds-button';\n\nconst Addon = styled(Button)`\n  background-color: transparent;\n  padding-right: 4px;\n  height: 100%;\n  border: none;\n  font-size: 12px;\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  color: ${(props) => props.theme.colors.brand['700']};\n  cursor: pointer;\n  &:focus,\n  &::after {\n    background-color: transparent;\n    box-shadow: none !important; /* needed */\n    border: none !important; /* needed */\n  }\n`;\n\nconst ActionAddon = ({ label, onClick, icon }) => (\n  <Addon onClick={onClick} labelText={label} icon={icon || <ChevronSmallDown color={['brand-primary', 700]} />} />\n);\n\nconst actionProps = {\n  /**\n   * Addon label\n   */\n  label: PropTypes.string.description('Addon label'),\n  /**\n   * On click callback\n   */\n  onClick: PropTypes.func.description('On click callback'),\n  /**\n   * Icon to display after the label\n   */\n  icon: PropTypes.element.description('Icon to display after the label'),\n};\n\nActionAddon.propTypes = actionProps;\nActionAddon.displayName = 'ActionAddon';\nconst DSCardActionAddonWithSchema = describe(ActionAddon);\nDSCardActionAddonWithSchema.propTypes = actionProps;\n\nexport { ActionAddon, DSCardActionAddonWithSchema };\nexport default ActionAddon;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAoC;AACpC,uBAAuB;AACvB,sBAAiC;AACjC,uBAAmB;AAEnB,MAAM,YAAQ,yBAAO,iBAAAA,OAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAMV,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAU/C,MAAM,cAAc,CAAC,EAAE,OAAO,SAAS,KAAK,MAC1C,6BAAAC,QAAA,cAAC;AAAA,EAAM;AAAA,EAAkB,WAAW;AAAA,EAAO,MAAM,QAAQ,6BAAAA,QAAA,cAAC;AAAA,IAAiB,OAAO,CAAC,iBAAiB,GAAG;AAAA,GAAG;AAAA,CAAI;AAGhH,MAAM,cAAc;AAAA,EAIlB,OAAO,8BAAU,OAAO,YAAY,aAAa;AAAA,EAIjD,SAAS,8BAAU,KAAK,YAAY,mBAAmB;AAAA,EAIvD,MAAM,8BAAU,QAAQ,YAAY,iCAAiC;AACvE;AAEA,YAAY,YAAY;AACxB,YAAY,cAAc;AAC1B,MAAM,kCAA8B,8BAAS,WAAW;AACxD,4BAA4B,YAAY;AAGxC,IAAO,sBAAQ;",
-  "names": ["Button", "React"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,0BAAoC;AACpC,uBAAuB;AACvB,sBAAiC;AACjC,uBAAmB;AAEnB,MAAM,YAAQ,yBAAO,iBAAAA,OAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAMV,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAU/C,MAAM,cAAc,CAAC,EAAE,OAAO,SAAS,KAAK,MAC1C,4CAAC;AAAA,EAAM;AAAA,EAAkB,WAAW;AAAA,EAAO,MAAM,QAAQ,4CAAC;AAAA,IAAiB,OAAO,CAAC,iBAAiB,GAAG;AAAA,GAAG;AAAA,CAAI;AAGhH,MAAM,cAAc;AAAA,EAIlB,OAAO,8BAAU,OAAO,YAAY,aAAa;AAAA,EAIjD,SAAS,8BAAU,KAAK,YAAY,mBAAmB;AAAA,EAIvD,MAAM,8BAAU,QAAQ,YAAY,iCAAiC;AACvE;AAEA,YAAY,YAAY;AACxB,YAAY,cAAc;AAC1B,MAAM,kCAA8B,8BAAS,WAAW;AACxD,4BAA4B,YAAY;AAGxC,IAAO,sBAAQ;",
+  "names": ["Button"]
 }

package/dist/cjs/v2/Card.js

@@ -30,7 +30,7 @@ __export(Card_exports, {
 });
 module.exports = __toCommonJS(Card_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_ds_header = require("@elliemae/ds-header");
 var import_ds_truncated_tooltip_text = __toESM(require("@elliemae/ds-truncated-tooltip-text"));
@@ -46,25 +46,58 @@ const CustomCard = ({
   leftAddon,
   rightAddon,
   hasBorder = false
-}) => /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.TooltipTextProvider, null, /* @__PURE__ */ import_react.default.createElement(import_components.CardContainer, {
-  hasBorder,
-  cols: getCol(rightAddon),
-  "data-testid": "em-ds-card"
-}, /* @__PURE__ */ import_react.default.createElement(import_components.LeftSection, null, leftAddon && /* @__PURE__ */ import_react.default.createElement(import_components.LeftAddon, null, leftAddon), /* @__PURE__ */ import_react.default.createElement(import_components.MainSection, {
-  style: {
-    maxWidth: leftAddon ? "calc(100% - 40px)" : "100%"
-  }
-}, /* @__PURE__ */ import_react.default.createElement(import_ds_header.DSHeader, {
-  fontSize: "16px",
-  "data-testid": "em-ds-card-header",
-  fontWeight: "regular",
-  color: "neutral.800",
-  text: /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.default, {
-    value: title
+}) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.TooltipTextProvider, {
+  children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.CardContainer, {
+    hasBorder,
+    cols: getCol(rightAddon),
+    "data-testid": "em-ds-card",
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.LeftSection, {
+        children: [
+          leftAddon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.LeftAddon, {
+            children: leftAddon
+          }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.MainSection, {
+            style: {
+              maxWidth: leftAddon ? "calc(100% - 40px)" : "100%"
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_header.DSHeader, {
+                fontSize: "16px",
+                "data-testid": "em-ds-card-header",
+                fontWeight: "regular",
+                color: "neutral.800",
+                text: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.default, {
+                  value: title
+                })
+              }),
+              description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Description, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.default, {
+                  value: description
+                })
+              })
+            ]
+          })
+        ]
+      }),
+      rightAddon && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_components.RightAddonSection, {
+        children: [
+          rightAddon[0] && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.RightAddon, {
+            children: rightAddon[0]
+          }),
+          rightAddon[1] && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+            children: [
+              rightAddon.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Separator, {}),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.RightAddon, {
+                children: rightAddon[1]
+              })
+            ]
+          })
+        ]
+      })
+    ]
   })
-}), description && /* @__PURE__ */ import_react.default.createElement(import_components.Description, null, /* @__PURE__ */ import_react.default.createElement(import_ds_truncated_tooltip_text.default, {
-  value: description
-})))), rightAddon && /* @__PURE__ */ import_react.default.createElement(import_components.RightAddonSection, null, rightAddon[0] && /* @__PURE__ */ import_react.default.createElement(import_components.RightAddon, null, rightAddon[0]), rightAddon[1] && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, rightAddon.length > 1 && /* @__PURE__ */ import_react.default.createElement(import_components.Separator, null), /* @__PURE__ */ import_react.default.createElement(import_components.RightAddon, null, rightAddon[1])))));
+});
 const cardProps = {
   title: import_ds_utilities.PropTypes.string.isRequired.description(
     "Title of the card. requiered"

package/dist/cjs/v2/Card.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/v2/Card.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { DSHeader } from '@elliemae/ds-header';\nimport DSTruncatedTooltipText, {\n  TooltipTextProvider,\n} from '@elliemae/ds-truncated-tooltip-text';\nimport {\n  CardContainer,\n  LeftSection,\n  LeftAddon,\n  RightAddonSection,\n  RightAddon,\n  Separator,\n  MainSection,\n  Description,\n} from './components';\n\nconst getCol = (rightAddon) => {\n  if (!rightAddon) return [1];\n  return [1, 'auto'];\n};\n\nconst CustomCard = ({\n  title,\n  description,\n  leftAddon,\n  rightAddon, // array. max 2 elements\n  hasBorder = false,\n}) => (\n  <TooltipTextProvider>\n    <CardContainer\n      hasBorder={hasBorder}\n      cols={getCol(rightAddon)}\n      data-testid=\"em-ds-card\"\n    >\n      <LeftSection>\n        {leftAddon && <LeftAddon>{leftAddon}</LeftAddon>}\n        <MainSection\n          style={{\n            maxWidth: leftAddon ? 'calc(100% - 40px)' : '100%',\n          }}\n        >\n          <DSHeader\n            fontSize=\"16px\"\n            data-testid=\"em-ds-card-header\"\n            fontWeight=\"regular\"\n            color=\"neutral.800\"\n            text={<DSTruncatedTooltipText value={title} />}\n          />\n          {description && (\n            <Description>\n              <DSTruncatedTooltipText value={description} />\n            </Description>\n          )}\n        </MainSection>\n      </LeftSection>\n      {rightAddon && (\n        <RightAddonSection>\n          {rightAddon[0] && <RightAddon>{rightAddon[0]}</RightAddon>}\n          {rightAddon[1] && (\n            <>\n              {rightAddon.length > 1 && <Separator />}\n              <RightAddon>{rightAddon[1]}</RightAddon>\n            </>\n          )}\n        </RightAddonSection>\n      )}\n    </CardContainer>\n  </TooltipTextProvider>\n);\n\nconst cardProps = {\n  /**\n   * Title of the card. requiered\n   */\n  title: PropTypes.string.isRequired.description(\n    'Title of the card. requiered',\n  ),\n  /**\n   * Description of the card. not requiered\n   */\n  description: PropTypes.string.description(\n    'Description of the card. not requiered',\n  ),\n  /**\n   * Left Addon\n   */\n  leftAddon: PropTypes.element.description('Left Addon'),\n  /**\n   * Right addon array, max elements: 2\n   */\n  rightAddon: PropTypes.array.description('Right addon array, max elements: 2'),\n  /**\n   * Wheter if the card has border or not\n   */\n  hasBorder: PropTypes.bool.description('Wheter if the card has border or not'),\n};\n\nCustomCard.propTypes = cardProps;\nCustomCard.displayName = 'CustomCard';\nconst DSCardCustomWithSchema = describe(CustomCard);\nDSCardCustomWithSchema.propTypes = cardProps;\n\nexport { CustomCard, DSCardCustomWithSchema };\nexport default CustomCard;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAoC;AACpC,uBAAyB;AACzB,uCAEO;AACP,wBASO;AAEP,MAAM,SAAS,CAAC,eAAe;AAC7B,MAAI,CAAC;AAAY,WAAO,CAAC,CAAC;AAC1B,SAAO,CAAC,GAAG,MAAM;AACnB;AAEA,MAAM,aAAa,CAAC;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AACd,MACE,6BAAAA,QAAA,cAAC,4DACC,6BAAAA,QAAA,cAAC;AAAA,EACC;AAAA,EACA,MAAM,OAAO,UAAU;AAAA,EACvB,eAAY;AAAA,GAEZ,6BAAAA,QAAA,cAAC,qCACE,aAAa,6BAAAA,QAAA,cAAC,mCAAW,SAAU,GACpC,6BAAAA,QAAA,cAAC;AAAA,EACC,OAAO;AAAA,IACL,UAAU,YAAY,sBAAsB;AAAA,EAC9C;AAAA,GAEA,6BAAAA,QAAA,cAAC;AAAA,EACC,UAAS;AAAA,EACT,eAAY;AAAA,EACZ,YAAW;AAAA,EACX,OAAM;AAAA,EACN,MAAM,6BAAAA,QAAA,cAAC,iCAAAC,SAAA;AAAA,IAAuB,OAAO;AAAA,GAAO;AAAA,CAC9C,GACC,eACC,6BAAAD,QAAA,cAAC,qCACC,6BAAAA,QAAA,cAAC,iCAAAC,SAAA;AAAA,EAAuB,OAAO;AAAA,CAAa,CAC9C,CAEJ,CACF,GACC,cACC,6BAAAD,QAAA,cAAC,2CACE,WAAW,MAAM,6BAAAA,QAAA,cAAC,oCAAY,WAAW,EAAG,GAC5C,WAAW,MACV,6BAAAA,QAAA,2BAAAA,QAAA,gBACG,WAAW,SAAS,KAAK,6BAAAA,QAAA,cAAC,iCAAU,GACrC,6BAAAA,QAAA,cAAC,oCAAY,WAAW,EAAG,CAC7B,CAEJ,CAEJ,CACF;AAGF,MAAM,YAAY;AAAA,EAIhB,OAAO,8BAAU,OAAO,WAAW;AAAA,IACjC;AAAA,EACF;AAAA,EAIA,aAAa,8BAAU,OAAO;AAAA,IAC5B;AAAA,EACF;AAAA,EAIA,WAAW,8BAAU,QAAQ,YAAY,YAAY;AAAA,EAIrD,YAAY,8BAAU,MAAM,YAAY,oCAAoC;AAAA,EAI5E,WAAW,8BAAU,KAAK,YAAY,sCAAsC;AAC9E;AAEA,WAAW,YAAY;AACvB,WAAW,cAAc;AACzB,MAAM,6BAAyB,8BAAS,UAAU;AAClD,uBAAuB,YAAY;AAGnC,IAAO,eAAQ;",
-  "names": ["React", "DSTruncatedTooltipText"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,0BAAoC;AACpC,uBAAyB;AACzB,uCAEO;AACP,wBASO;AAEP,MAAM,SAAS,CAAC,eAAe;AAC7B,MAAI,CAAC;AAAY,WAAO,CAAC,CAAC;AAC1B,SAAO,CAAC,GAAG,MAAM;AACnB;AAEA,MAAM,aAAa,CAAC;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AACd,MACE,4CAAC;AAAA,EACC,uDAAC;AAAA,IACC;AAAA,IACA,MAAM,OAAO,UAAU;AAAA,IACvB,eAAY;AAAA,IAEZ;AAAA,mDAAC;AAAA,QACE;AAAA,uBAAa,4CAAC;AAAA,YAAW;AAAA,WAAU;AAAA,UACpC,6CAAC;AAAA,YACC,OAAO;AAAA,cACL,UAAU,YAAY,sBAAsB;AAAA,YAC9C;AAAA,YAEA;AAAA,0DAAC;AAAA,gBACC,UAAS;AAAA,gBACT,eAAY;AAAA,gBACZ,YAAW;AAAA,gBACX,OAAM;AAAA,gBACN,MAAM,4CAAC,iCAAAA,SAAA;AAAA,kBAAuB,OAAO;AAAA,iBAAO;AAAA,eAC9C;AAAA,cACC,eACC,4CAAC;AAAA,gBACC,sDAAC,iCAAAA,SAAA;AAAA,kBAAuB,OAAO;AAAA,iBAAa;AAAA,eAC9C;AAAA;AAAA,WAEJ;AAAA;AAAA,OACF;AAAA,MACC,cACC,6CAAC;AAAA,QACE;AAAA,qBAAW,MAAM,4CAAC;AAAA,YAAY,qBAAW;AAAA,WAAG;AAAA,UAC5C,WAAW,MACV;AAAA,YACG;AAAA,yBAAW,SAAS,KAAK,4CAAC,+BAAU;AAAA,cACrC,4CAAC;AAAA,gBAAY,qBAAW;AAAA,eAAG;AAAA;AAAA,WAC7B;AAAA;AAAA,OAEJ;AAAA;AAAA,GAEJ;AAAA,CACF;AAGF,MAAM,YAAY;AAAA,EAIhB,OAAO,8BAAU,OAAO,WAAW;AAAA,IACjC;AAAA,EACF;AAAA,EAIA,aAAa,8BAAU,OAAO;AAAA,IAC5B;AAAA,EACF;AAAA,EAIA,WAAW,8BAAU,QAAQ,YAAY,YAAY;AAAA,EAIrD,YAAY,8BAAU,MAAM,YAAY,oCAAoC;AAAA,EAI5E,WAAW,8BAAU,KAAK,YAAY,sCAAsC;AAC9E;AAEA,WAAW,YAAY;AACvB,WAAW,cAAc;AACzB,MAAM,6BAAyB,8BAAS,UAAU;AAClD,uBAAuB,YAAY;AAGnC,IAAO,eAAQ;",
+  "names": ["DSTruncatedTooltipText"]
 }

package/dist/cjs/v2/Group.js

@@ -30,7 +30,7 @@ __export(Group_exports, {
 });
 module.exports = __toCommonJS(Group_exports);
 var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_utilities = require("@elliemae/ds-utilities");
 var import_ds_system = require("@elliemae/ds-system");
 var import_Card = __toESM(require("./Card"));
@@ -62,9 +62,22 @@ const Items = import_ds_system.styled.div`
   display: flex;
   flex-direction: column;
 `;
-const CardGroup = ({ children, title, action }) => /* @__PURE__ */ import_react.default.createElement(Group, {
-  withTopBorder: !title
-}, !!title && /* @__PURE__ */ import_react.default.createElement(TitleWrapper, null, /* @__PURE__ */ import_react.default.createElement(GroupTitle, null, title), action), /* @__PURE__ */ import_react.default.createElement(Items, null, children));
+const CardGroup = ({ children, title, action }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Group, {
+  withTopBorder: !title,
+  children: [
+    !!title && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(TitleWrapper, {
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GroupTitle, {
+          children: title
+        }),
+        action
+      ]
+    }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Items, {
+      children
+    })
+  ]
+});
 const cardgroupProps = {
   children: import_ds_utilities.PropTypes.element.isRequired.description("Card items"),
   title: import_ds_utilities.PropTypes.string.isRequired.description("Title of the group"),

package/dist/cjs/v2/Group.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/v2/Group.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { color, border, truncate, styled } from '@elliemae/ds-system';\nimport Card from './Card';\n\nconst Group = styled.div`\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  max-width: 100%;\n  ${Card} {\n    border-top: none;\n  }\n  ${({ theme, withTopBorder }) =>\n    withTopBorder ? `border-top: ${theme.colors.neutral['100']}` : ''}\n`;\n\nconst GroupTitle = styled.span`\n  ${truncate()}\n`;\n\nconst TitleWrapper = styled.div`\n  display: flex;\n  justify-content: space-between;\n  padding: 0 ${(props) => props.theme.space.xs};\n  font-size: 12px;\n  ${color('neutral', '700')};\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  background-color: ${(props) => props.theme.colors.neutral['080']};\n  border-top: ${(props) => border(props.theme.colors.neutral['080'])};\n  line-height: 24px;\n`;\n\nconst Items = styled.div`\n  display: flex;\n  flex-direction: column;\n`;\n\nconst CardGroup = ({ children, title, action }) => (\n  <Group withTopBorder={!title}>\n    {!!title && (\n      <TitleWrapper>\n        <GroupTitle>{title}</GroupTitle>\n        {action}\n      </TitleWrapper>\n    )}\n    <Items>{children}</Items>\n  </Group>\n);\n\nconst cardgroupProps = {\n  /**\n   * Card items\n   */\n  children: PropTypes.element.isRequired.description('Card items'),\n  /**\n   * Title of the group\n   */\n  title: PropTypes.string.isRequired.description('Title of the group'),\n  /**\n   * Right addon action\n   */\n  action: PropTypes.element.description('Right addon action'),\n};\n\nCardGroup.propTypes = cardgroupProps;\nCardGroup.displayName = 'CardGroup';\nconst DSCardGroupWithSchema = describe(CardGroup);\nDSCardGroupWithSchema.propTypes = cardgroupProps;\n\nexport { CardGroup, DSCardGroupWithSchema };\nexport default CardGroup;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAoC;AACpC,uBAAgD;AAChD,kBAAiB;AAEjB,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKjB,YAAAA;AAAA;AAAA;AAAA,IAGA,CAAC,EAAE,OAAO,cAAc,MACxB,gBAAgB,eAAe,MAAM,OAAO,QAAQ,WAAW;AAAA;AAGnE,MAAM,aAAa,wBAAO;AAAA,QACtB,2BAAS;AAAA;AAGb,MAAM,eAAe,wBAAO;AAAA;AAAA;AAAA,eAGb,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA,QAExC,wBAAM,WAAW,KAAK;AAAA,iBACT,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,sBAC9B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA,gBAC5C,CAAC,cAAU,yBAAO,MAAM,MAAM,OAAO,QAAQ,MAAM;AAAA;AAAA;AAInE,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA;AAKrB,MAAM,YAAY,CAAC,EAAE,UAAU,OAAO,OAAO,MAC3C,6BAAAC,QAAA,cAAC;AAAA,EAAM,eAAe,CAAC;AAAA,GACpB,CAAC,CAAC,SACD,6BAAAA,QAAA,cAAC,oBACC,6BAAAA,QAAA,cAAC,kBAAY,KAAM,GAClB,MACH,GAEF,6BAAAA,QAAA,cAAC,aAAO,QAAS,CACnB;AAGF,MAAM,iBAAiB;AAAA,EAIrB,UAAU,8BAAU,QAAQ,WAAW,YAAY,YAAY;AAAA,EAI/D,OAAO,8BAAU,OAAO,WAAW,YAAY,oBAAoB;AAAA,EAInE,QAAQ,8BAAU,QAAQ,YAAY,oBAAoB;AAC5D;AAEA,UAAU,YAAY;AACtB,UAAU,cAAc;AACxB,MAAM,4BAAwB,8BAAS,SAAS;AAChD,sBAAsB,YAAY;AAGlC,IAAO,gBAAQ;",
-  "names": ["Card", "React"]
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,0BAAoC;AACpC,uBAAgD;AAChD,kBAAiB;AAEjB,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKjB,YAAAA;AAAA;AAAA;AAAA,IAGA,CAAC,EAAE,OAAO,cAAc,MACxB,gBAAgB,eAAe,MAAM,OAAO,QAAQ,WAAW;AAAA;AAGnE,MAAM,aAAa,wBAAO;AAAA,QACtB,2BAAS;AAAA;AAGb,MAAM,eAAe,wBAAO;AAAA;AAAA;AAAA,eAGb,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA,QAExC,wBAAM,WAAW,KAAK;AAAA,iBACT,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,sBAC9B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA,gBAC5C,CAAC,cAAU,yBAAO,MAAM,MAAM,OAAO,QAAQ,MAAM;AAAA;AAAA;AAInE,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA;AAKrB,MAAM,YAAY,CAAC,EAAE,UAAU,OAAO,OAAO,MAC3C,6CAAC;AAAA,EAAM,eAAe,CAAC;AAAA,EACpB;AAAA,KAAC,CAAC,SACD,6CAAC;AAAA,MACC;AAAA,oDAAC;AAAA,UAAY;AAAA,SAAM;AAAA,QAClB;AAAA;AAAA,KACH;AAAA,IAEF,4CAAC;AAAA,MAAO;AAAA,KAAS;AAAA;AAAA,CACnB;AAGF,MAAM,iBAAiB;AAAA,EAIrB,UAAU,8BAAU,QAAQ,WAAW,YAAY,YAAY;AAAA,EAI/D,OAAO,8BAAU,OAAO,WAAW,YAAY,oBAAoB;AAAA,EAInE,QAAQ,8BAAU,QAAQ,YAAY,oBAAoB;AAC5D;AAEA,UAAU,YAAY;AACtB,UAAU,cAAc;AACxB,MAAM,4BAAwB,8BAAS,SAAS;AAChD,sBAAsB,YAAY;AAGlC,IAAO,gBAAQ;",
+  "names": ["Card"]
 }

package/dist/esm/DSCard.js

@@ -1,5 +1,5 @@
 import * as React from "react";
-import React2 from "react";
+import { jsx } from "react/jsx-runtime";
 import { PropTypes, describe } from "@elliemae/ds-utilities";
 import { convertPropToCssClassName } from "@elliemae/ds-classnames";
 import DSCardBody from "./DSCardBody";
@@ -11,13 +11,14 @@ const DSCard = ({
   ...otherProps
 }) => {
   const { cssClassName } = convertPropToCssClassName("card");
-  return /* @__PURE__ */ React2.createElement("div", {
+  return /* @__PURE__ */ jsx("div", {
     "data-testid": "card",
     ...containerProps,
     ref: innerRef,
     className: cssClassName,
-    ...otherProps
-  }, children);
+    ...otherProps,
+    children
+  });
 };
 const cardProps = {
   containerProps: PropTypes.object.description(

package/dist/esm/DSCard.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSCard.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport DSCardBody from './DSCardBody';\nimport DSCardHeader from './DSCardHeader';\n\nconst DSCard = ({\n  innerRef = undefined,\n  children = null,\n  containerProps = {},\n  ...otherProps\n}) => {\n  const { cssClassName } = convertPropToCssClassName('card');\n\n  return (\n    <div\n      data-testid=\"card\"\n      {...containerProps}\n      ref={innerRef}\n      className={cssClassName}\n      {...otherProps}\n    >\n      {children}\n    </div>\n  );\n};\n\nconst cardProps = {\n  /** inject props to component wrapper */\n  containerProps: PropTypes.object.description(\n    'inject props to component wrapper',\n  ),\n  /**\n   * Get reference for the button\n   */\n  innerRef: PropTypes.string.description('Get reference for the button'),\n  /**\n   * DSCardBody and DSCardHeader\n   */\n  children: PropTypes.arrayOf(\n    PropTypes.shape({\n      type: PropTypes.oneOf([DSCardHeader, DSCardBody]),\n    }),\n  ).description('DSCardBody and DSCardHeader'),\n};\n\nDSCard.propTypes = cardProps;\nDSCard.displayName = 'DSCard';\nconst DSCardWithSchema = describe(DSCard);\nDSCardWithSchema.propTypes = cardProps;\n\nexport { DSCard, DSCardWithSchema };\nexport default DSCard;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,WAAW,gBAAgB;AACpC,SAAS,iCAAiC;AAC1C,OAAO,gBAAgB;AACvB,OAAO,kBAAkB;AAEzB,MAAM,SAAS,CAAC;AAAA,EACd,WAAW;AAAA,EACX,WAAW;AAAA,EACX,iBAAiB,CAAC;AAAA,KACf;AACL,MAAM;AACJ,QAAM,EAAE,aAAa,IAAI,0BAA0B,MAAM;AAEzD,SACE,gBAAAA,OAAA,cAAC;AAAA,IACC,eAAY;AAAA,IACX,GAAG;AAAA,IACJ,KAAK;AAAA,IACL,WAAW;AAAA,IACV,GAAG;AAAA,KAEH,QACH;AAEJ;AAEA,MAAM,YAAY;AAAA,EAEhB,gBAAgB,UAAU,OAAO;AAAA,IAC/B;AAAA,EACF;AAAA,EAIA,UAAU,UAAU,OAAO,YAAY,8BAA8B;AAAA,EAIrE,UAAU,UAAU;AAAA,IAClB,UAAU,MAAM;AAAA,MACd,MAAM,UAAU,MAAM,CAAC,cAAc,UAAU,CAAC;AAAA,IAClD,CAAC;AAAA,EACH,EAAE,YAAY,6BAA6B;AAC7C;AAEA,OAAO,YAAY;AACnB,OAAO,cAAc;AACrB,MAAM,mBAAmB,SAAS,MAAM;AACxC,iBAAiB,YAAY;AAG7B,IAAO,iBAAQ;",
-  "names": ["React"]
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,WAAW,gBAAgB;AACpC,SAAS,iCAAiC;AAC1C,OAAO,gBAAgB;AACvB,OAAO,kBAAkB;AAEzB,MAAM,SAAS,CAAC;AAAA,EACd,WAAW;AAAA,EACX,WAAW;AAAA,EACX,iBAAiB,CAAC;AAAA,KACf;AACL,MAAM;AACJ,QAAM,EAAE,aAAa,IAAI,0BAA0B,MAAM;AAEzD,SACE,oBAAC;AAAA,IACC,eAAY;AAAA,IACX,GAAG;AAAA,IACJ,KAAK;AAAA,IACL,WAAW;AAAA,IACV,GAAG;AAAA,IAEH;AAAA,GACH;AAEJ;AAEA,MAAM,YAAY;AAAA,EAEhB,gBAAgB,UAAU,OAAO;AAAA,IAC/B;AAAA,EACF;AAAA,EAIA,UAAU,UAAU,OAAO,YAAY,8BAA8B;AAAA,EAIrE,UAAU,UAAU;AAAA,IAClB,UAAU,MAAM;AAAA,MACd,MAAM,UAAU,MAAM,CAAC,cAAc,UAAU,CAAC;AAAA,IAClD,CAAC;AAAA,EACH,EAAE,YAAY,6BAA6B;AAC7C;AAEA,OAAO,YAAY;AACnB,OAAO,cAAc;AACrB,MAAM,mBAAmB,SAAS,MAAM;AACxC,iBAAiB,YAAY;AAG7B,IAAO,iBAAQ;",
+  "names": []
 }

package/dist/esm/DSCardBody.js

@@ -1,10 +1,11 @@
 import * as React from "react";
-import React2 from "react";
+import { jsx } from "react/jsx-runtime";
 import { PropTypes, describe } from "@elliemae/ds-utilities";
-const DSCardBody = ({ children }) => /* @__PURE__ */ React2.createElement("div", {
+const DSCardBody = ({ children }) => /* @__PURE__ */ jsx("div", {
   className: "em-ds-card-body",
-  "data-testid": "card-body"
-}, children);
+  "data-testid": "card-body",
+  children
+});
 const bodyProps = {
   children: PropTypes.element.description("children")
 };

package/dist/esm/DSCardBody.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSCardBody.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\n\nconst DSCardBody = ({ children }) => (\n  <div className=\"em-ds-card-body\" data-testid=\"card-body\">\n    {children}\n  </div>\n);\n\nconst bodyProps = {\n  /** children */\n  children: PropTypes.element.description('children'),\n};\n\nDSCardBody.propTypes = bodyProps;\nDSCardBody.displayName = 'DSCardBody';\nconst DSCardBodyWithSchema = describe(DSCardBody);\nDSCardBodyWithSchema.propTypes = bodyProps;\n\nexport { DSCardBody, DSCardBodyWithSchema };\nexport default DSCardBody;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,WAAW,gBAAgB;AAEpC,MAAM,aAAa,CAAC,EAAE,SAAS,MAC7B,gBAAAA,OAAA,cAAC;AAAA,EAAI,WAAU;AAAA,EAAkB,eAAY;AAAA,GAC1C,QACH;AAGF,MAAM,YAAY;AAAA,EAEhB,UAAU,UAAU,QAAQ,YAAY,UAAU;AACpD;AAEA,WAAW,YAAY;AACvB,WAAW,cAAc;AACzB,MAAM,uBAAuB,SAAS,UAAU;AAChD,qBAAqB,YAAY;AAGjC,IAAO,qBAAQ;",
-  "names": ["React"]
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,WAAW,gBAAgB;AAEpC,MAAM,aAAa,CAAC,EAAE,SAAS,MAC7B,oBAAC;AAAA,EAAI,WAAU;AAAA,EAAkB,eAAY;AAAA,EAC1C;AAAA,CACH;AAGF,MAAM,YAAY;AAAA,EAEhB,UAAU,UAAU,QAAQ,YAAY,UAAU;AACpD;AAEA,WAAW,YAAY;AACvB,WAAW,cAAc;AACzB,MAAM,uBAAuB,SAAS,UAAU;AAChD,qBAAqB,YAAY;AAGjC,IAAO,qBAAQ;",
+  "names": []
 }

package/dist/esm/DSCardHeader.js

@@ -1,20 +1,26 @@
 import * as React from "react";
-import React2 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { PropTypes, describe } from "@elliemae/ds-utilities";
 import { convertPropToCssClassName } from "@elliemae/ds-classnames";
 const DSCardHeader = ({ title, action }) => {
   const { cssClassName, classNameElement } = convertPropToCssClassName(
     "card-header"
   );
-  return /* @__PURE__ */ React2.createElement("div", {
+  return /* @__PURE__ */ jsxs("div", {
     className: cssClassName,
-    "data-testid": "card-header"
-  }, /* @__PURE__ */ React2.createElement("span", {
-    className: classNameElement("heading")
-  }, title), /* @__PURE__ */ React2.createElement("div", {
-    className: classNameElement("pull-right"),
-    "data-testid": "ds-card_header-action"
-  }, action));
+    "data-testid": "card-header",
+    children: [
+      /* @__PURE__ */ jsx("span", {
+        className: classNameElement("heading"),
+        children: title
+      }),
+      /* @__PURE__ */ jsx("div", {
+        className: classNameElement("pull-right"),
+        "data-testid": "ds-card_header-action",
+        children: action
+      })
+    ]
+  });
 };
 const cardHeader = {
   title: PropTypes.string.description("card header title"),

package/dist/esm/DSCardHeader.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSCardHeader.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\n\nconst DSCardHeader = ({ title, action }) => {\n  const { cssClassName, classNameElement } = convertPropToCssClassName(\n    'card-header',\n  );\n  return (\n    <div className={cssClassName} data-testid=\"card-header\">\n      <span className={classNameElement('heading')}>{title}</span>\n      <div\n        className={classNameElement('pull-right')}\n        data-testid=\"ds-card_header-action\"\n      >\n        {action}\n      </div>\n    </div>\n  );\n};\n\nconst cardHeader = {\n  /** card header title */\n  title: PropTypes.string.description('card header title'),\n  /** action */\n  action: PropTypes.node.description('action'),\n};\n\nDSCardHeader.propTypes = cardHeader;\nDSCardHeader.displayName = 'DSCardHeader';\nconst DSCardHeaderWithSchema = describe(DSCardHeader);\nDSCardHeaderWithSchema.propTypes = cardHeader;\n\nexport { DSCardHeader, DSCardHeaderWithSchema };\nexport default DSCardHeader;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,WAAW,gBAAgB;AACpC,SAAS,iCAAiC;AAE1C,MAAM,eAAe,CAAC,EAAE,OAAO,OAAO,MAAM;AAC1C,QAAM,EAAE,cAAc,iBAAiB,IAAI;AAAA,IACzC;AAAA,EACF;AACA,SACE,gBAAAA,OAAA,cAAC;AAAA,IAAI,WAAW;AAAA,IAAc,eAAY;AAAA,KACxC,gBAAAA,OAAA,cAAC;AAAA,IAAK,WAAW,iBAAiB,SAAS;AAAA,KAAI,KAAM,GACrD,gBAAAA,OAAA,cAAC;AAAA,IACC,WAAW,iBAAiB,YAAY;AAAA,IACxC,eAAY;AAAA,KAEX,MACH,CACF;AAEJ;AAEA,MAAM,aAAa;AAAA,EAEjB,OAAO,UAAU,OAAO,YAAY,mBAAmB;AAAA,EAEvD,QAAQ,UAAU,KAAK,YAAY,QAAQ;AAC7C;AAEA,aAAa,YAAY;AACzB,aAAa,cAAc;AAC3B,MAAM,yBAAyB,SAAS,YAAY;AACpD,uBAAuB,YAAY;AAGnC,IAAO,uBAAQ;",
-  "names": ["React"]
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,WAAW,gBAAgB;AACpC,SAAS,iCAAiC;AAE1C,MAAM,eAAe,CAAC,EAAE,OAAO,OAAO,MAAM;AAC1C,QAAM,EAAE,cAAc,iBAAiB,IAAI;AAAA,IACzC;AAAA,EACF;AACA,SACE,qBAAC;AAAA,IAAI,WAAW;AAAA,IAAc,eAAY;AAAA,IACxC;AAAA,0BAAC;AAAA,QAAK,WAAW,iBAAiB,SAAS;AAAA,QAAI;AAAA,OAAM;AAAA,MACrD,oBAAC;AAAA,QACC,WAAW,iBAAiB,YAAY;AAAA,QACxC,eAAY;AAAA,QAEX;AAAA,OACH;AAAA;AAAA,GACF;AAEJ;AAEA,MAAM,aAAa;AAAA,EAEjB,OAAO,UAAU,OAAO,YAAY,mBAAmB;AAAA,EAEvD,QAAQ,UAAU,KAAK,YAAY,QAAQ;AAC7C;AAEA,aAAa,YAAY;AACzB,aAAa,cAAc;AAC3B,MAAM,yBAAyB,SAAS,YAAY;AACpD,uBAAuB,YAAY;AAGnC,IAAO,uBAAQ;",
+  "names": []
 }

package/dist/esm/detail/DetailCard.js

@@ -1,5 +1,5 @@
 import * as React from "react";
-import React2 from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { compact, noop } from "lodash";
 import { PropTypes, describe } from "@elliemae/ds-utilities";
 import { ArrowheadDown, ArrowheadRight } from "@elliemae/ds-icons";
@@ -36,67 +36,105 @@ const DetailCard = ({
     topWrapperCols.unshift("20px");
   if (selectable)
     topWrapperCols.unshift(theme.space.s);
-  return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(Container, {
-    disabled: disabled || readOnly,
-    active: selectable && isSelected,
-    "data-testid": "card-detail-container"
-  }, /* @__PURE__ */ React2.createElement(Grid, {
-    cols: topWrapperCols,
-    alignItems: !description ? "center" : void 0
-  }, selectable && /* @__PURE__ */ React2.createElement(Grid, {
-    pt: description && "9px"
-  }, /* @__PURE__ */ React2.createElement(DSCheckbox, {
-    checked: isSelected,
-    onChange: onSelect,
-    readOnly,
-    disabled,
-    "data-testid": "card-checkbox"
-  })), expandable && /* @__PURE__ */ React2.createElement(Grid, {
-    height: "16px",
-    pt: description && "xxs",
-    mt: !description && "-5px"
-  }, /* @__PURE__ */ React2.createElement(DSButton, {
-    size: "s",
-    buttonType: "text",
-    containerProps: {
-      "data-testid": "expand-button"
-    },
-    onClick: onExpand,
-    icon: isExpanded ? /* @__PURE__ */ React2.createElement(ArrowheadDown, {
-      color: ["neutral", "500"],
-      size: "s"
-    }) : /* @__PURE__ */ React2.createElement(ArrowheadRight, {
-      color: ["neutral", "500"],
-      size: "s"
-    }),
-    disabled
-  })), /* @__PURE__ */ React2.createElement(Grid, {
-    pr: "24px"
-  }, /* @__PURE__ */ React2.createElement(Title, null, title), description && /* @__PURE__ */ React2.createElement(Description, {
-    descriptionColor
-  }, description)), hasRightPosition && /* @__PURE__ */ React2.createElement(Grid, {
-    cols: compact([hasRightPosition && "auto", rightAddon && "auto"])
-  }, hasRightLegend && /* @__PURE__ */ React2.createElement(Grid, {
-    pr: "24px",
-    rows: ["auto", "auto", 1]
-  }, /* @__PURE__ */ React2.createElement(RightDescription, {
-    justifyContent: "flex-end"
-  }, rightDescription), /* @__PURE__ */ React2.createElement(RightValue, {
-    justifyContent: "flex-end"
-  }, rightValue), /* @__PURE__ */ React2.createElement(Grid, null)), rightAddon && /* @__PURE__ */ React2.createElement(RightAddon, {
-    cols: ["auto", "auto"],
-    gutter: "2px"
-  }, rightAddon))), expandContent && isExpanded && /* @__PURE__ */ React2.createElement(Grid, {
-    ml: selectable && "s",
-    mr: rightAddon && "xs"
-  }, /* @__PURE__ */ React2.createElement(DSSeparator, {
-    dashed: true,
-    position: "initial",
-    margin: "none"
-  }), /* @__PURE__ */ React2.createElement(Grid, {
-    pt: "xxs",
-    "data-testid": "detail-card-expanded-content"
-  }, expandContent))));
+  return /* @__PURE__ */ jsx(Fragment, {
+    children: /* @__PURE__ */ jsxs(Container, {
+      disabled: disabled || readOnly,
+      active: selectable && isSelected,
+      "data-testid": "card-detail-container",
+      children: [
+        /* @__PURE__ */ jsxs(Grid, {
+          cols: topWrapperCols,
+          alignItems: !description ? "center" : void 0,
+          children: [
+            selectable && /* @__PURE__ */ jsx(Grid, {
+              pt: description && "9px",
+              children: /* @__PURE__ */ jsx(DSCheckbox, {
+                checked: isSelected,
+                onChange: onSelect,
+                readOnly,
+                disabled,
+                "data-testid": "card-checkbox"
+              })
+            }),
+            expandable && /* @__PURE__ */ jsx(Grid, {
+              height: "16px",
+              pt: description && "xxs",
+              mt: !description && "-5px",
+              children: /* @__PURE__ */ jsx(DSButton, {
+                size: "s",
+                buttonType: "text",
+                containerProps: {
+                  "data-testid": "expand-button"
+                },
+                onClick: onExpand,
+                icon: isExpanded ? /* @__PURE__ */ jsx(ArrowheadDown, {
+                  color: ["neutral", "500"],
+                  size: "s"
+                }) : /* @__PURE__ */ jsx(ArrowheadRight, {
+                  color: ["neutral", "500"],
+                  size: "s"
+                }),
+                disabled
+              })
+            }),
+            /* @__PURE__ */ jsxs(Grid, {
+              pr: "24px",
+              children: [
+                /* @__PURE__ */ jsx(Title, {
+                  children: title
+                }),
+                description && /* @__PURE__ */ jsx(Description, {
+                  descriptionColor,
+                  children: description
+                })
+              ]
+            }),
+            hasRightPosition && /* @__PURE__ */ jsxs(Grid, {
+              cols: compact([hasRightPosition && "auto", rightAddon && "auto"]),
+              children: [
+                hasRightLegend && /* @__PURE__ */ jsxs(Grid, {
+                  pr: "24px",
+                  rows: ["auto", "auto", 1],
+                  children: [
+                    /* @__PURE__ */ jsx(RightDescription, {
+                      justifyContent: "flex-end",
+                      children: rightDescription
+                    }),
+                    /* @__PURE__ */ jsx(RightValue, {
+                      justifyContent: "flex-end",
+                      children: rightValue
+                    }),
+                    /* @__PURE__ */ jsx(Grid, {})
+                  ]
+                }),
+                rightAddon && /* @__PURE__ */ jsx(RightAddon, {
+                  cols: ["auto", "auto"],
+                  gutter: "2px",
+                  children: rightAddon
+                })
+              ]
+            })
+          ]
+        }),
+        expandContent && isExpanded && /* @__PURE__ */ jsxs(Grid, {
+          ml: selectable && "s",
+          mr: rightAddon && "xs",
+          children: [
+            /* @__PURE__ */ jsx(DSSeparator, {
+              dashed: true,
+              position: "initial",
+              margin: "none"
+            }),
+            /* @__PURE__ */ jsx(Grid, {
+              pt: "xxs",
+              "data-testid": "detail-card-expanded-content",
+              children: expandContent
+            })
+          ]
+        })
+      ]
+    })
+  });
 };
 const detailProps = {
   title: PropTypes.string.isRequired.description("Title of the card."),

package/dist/esm/detail/DetailCard.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/detail/DetailCard.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable jsx-a11y/click-events-have-key-events */\n/* eslint-disable complexity */\nimport React from 'react';\nimport { compact, noop } from 'lodash';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { ArrowheadDown, ArrowheadRight } from '@elliemae/ds-icons';\nimport { useTheme } from '@elliemae/ds-system';\nimport DSButton from '@elliemae/ds-button';\nimport DSSeparator from '@elliemae/ds-separator';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSCheckbox } from '@elliemae/ds-form';\nimport { Container, Title, Description, RightAddon, RightDescription, RightValue } from './styled';\n\nconst DetailCard = ({\n  title,\n  description,\n  descriptionColor = 'neutral',\n  rightValue,\n  rightDescription,\n  rightAddon,\n  // select props\n  selectable = false,\n  isSelected = false,\n  onSelect = noop,\n  // expand props\n  expandable = false,\n  isExpanded = false,\n  onExpand = noop,\n  expandContent,\n  // state props\n  readOnly = false,\n  disabled = false,\n}) => {\n  const theme = useTheme();\n  const hasRightLegend = rightValue && rightDescription;\n  const hasRightPosition = hasRightLegend || rightAddon;\n  const topWrapperCols = ['1fr'];\n  if (hasRightPosition) topWrapperCols.push('auto');\n  if (expandable) topWrapperCols.unshift('20px');\n  if (selectable) topWrapperCols.unshift(theme.space.s);\n  return (\n    <>\n      <Container disabled={disabled || readOnly} active={selectable && isSelected} data-testid=\"card-detail-container\">\n        <Grid cols={topWrapperCols} alignItems={!description ? 'center' : undefined}>\n          {selectable && (\n            <Grid pt={description && '9px'}>\n              <DSCheckbox\n                checked={isSelected}\n                onChange={onSelect}\n                readOnly={readOnly}\n                disabled={disabled}\n                data-testid=\"card-checkbox\"\n              />\n            </Grid>\n          )}\n          {expandable && (\n            <Grid height=\"16px\" pt={description && 'xxs'} mt={!description && '-5px'}>\n              <DSButton\n                size=\"s\"\n                buttonType=\"text\"\n                containerProps={{\n                  'data-testid': 'expand-button',\n                }}\n                onClick={onExpand}\n                icon={\n                  isExpanded ? (\n                    <ArrowheadDown color={['neutral', '500']} size=\"s\" />\n                  ) : (\n                    <ArrowheadRight color={['neutral', '500']} size=\"s\" />\n                  )\n                }\n                disabled={disabled}\n              />\n            </Grid>\n          )}\n          <Grid pr=\"24px\">\n            <Title>{title}</Title>\n            {description && <Description descriptionColor={descriptionColor}>{description}</Description>}\n          </Grid>\n          {hasRightPosition && (\n            <Grid cols={compact([hasRightPosition && 'auto', rightAddon && 'auto'])}>\n              {hasRightLegend && (\n                <Grid pr=\"24px\" rows={['auto', 'auto', 1]}>\n                  <RightDescription justifyContent=\"flex-end\">{rightDescription}</RightDescription>\n                  <RightValue justifyContent=\"flex-end\">{rightValue}</RightValue>\n                  <Grid />\n                </Grid>\n              )}\n              {rightAddon && (\n                <RightAddon cols={['auto', 'auto']} gutter=\"2px\">\n                  {rightAddon}\n                </RightAddon>\n              )}\n            </Grid>\n          )}\n        </Grid>\n        {expandContent && isExpanded && (\n          <Grid ml={selectable && 's'} mr={rightAddon && 'xs'}>\n            <DSSeparator dashed position=\"initial\" margin=\"none\" />\n            <Grid pt=\"xxs\" data-testid=\"detail-card-expanded-content\">\n              {expandContent}\n            </Grid>\n          </Grid>\n        )}\n      </Container>\n    </>\n  );\n};\n\nconst detailProps = {\n  /**\n   * Title of the card.\n   */\n  title: PropTypes.string.isRequired.description('Title of the card.'),\n  /**\n   * Description of the card.\n   */\n  description: PropTypes.string.description('Description of the card.'),\n  /**\n   * Description color.\n   */\n  descriptionColor: PropTypes.oneOf(['primary', 'neutral']).description('Description color.'),\n  /**\n   * Right value (should be used with `rightDescription`)\n   */\n  rightValue: PropTypes.string.description('Right value (should be used with `rightDescription`)'),\n  /**\n   * Right description (should be used with `rightValue`)\n   */\n  rightDescription: PropTypes.string.description('Right description (should be used with `rightValue`)'),\n  /**\n   * Right addon array, max elements: 2\n   */\n  rightAddon: PropTypes.element.description('Right addon array, max elements: 2'),\n  /**\n   * Whether if the card is selectable or not\n   */\n  selectable: PropTypes.bool.description('Whether if the card is selectable or not'),\n  /**\n   * Whether if the card is selected or not\n   */\n  isSelected: PropTypes.bool.description('Whether if the card is selected or not'),\n  /**\n   * Callback on selection\n   */\n  onSelect: PropTypes.func.description('Callback on selection'),\n  /**\n   * Whether if the card is expandable or not\n   */\n  expandable: PropTypes.bool.description('Whether if the card is expandable or not'),\n  /**\n   * Whether if the card is expanded or not\n   */\n  isExpanded: PropTypes.bool.description('Whether if the card is expanded or not'),\n  /**\n   * Callback on expand\n   */\n  onExpand: PropTypes.func.description('Callback on expand'),\n  /**\n   * Content\n   */\n  expandContent: PropTypes.element.description('Content'),\n  /**\n   * Read only\n   */\n  readOnly: PropTypes.bool.description('Read only'),\n  /**\n   * Disabled\n   */\n  disabled: PropTypes.bool.description('Disabled'),\n};\n\nDetailCard.propTypes = detailProps;\nDetailCard.displayName = 'DetailCard';\nconst DSCardDetailWithSchema = describe(DetailCard);\nDSCardDetailWithSchema.propTypes = detailProps;\n\nexport { DetailCard, DSCardDetailWithSchema };\nexport default DetailCard;\n"],
-  "mappings": "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",
-  "names": ["React"]
+  "mappings": "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",
+  "names": []
 }

package/dist/esm/v2/ActionAddon.js

@@ -1,5 +1,5 @@
 import * as React from "react";
-import React2 from "react";
+import { jsx } from "react/jsx-runtime";
 import { PropTypes, describe } from "@elliemae/ds-utilities";
 import { styled } from "@elliemae/ds-system";
 import { ChevronSmallDown } from "@elliemae/ds-icons";
@@ -20,10 +20,10 @@ const Addon = styled(Button)`
     border: none !important; /* needed */
   }
 `;
-const ActionAddon = ({ label, onClick, icon }) => /* @__PURE__ */ React2.createElement(Addon, {
+const ActionAddon = ({ label, onClick, icon }) => /* @__PURE__ */ jsx(Addon, {
   onClick,
   labelText: label,
-  icon: icon || /* @__PURE__ */ React2.createElement(ChevronSmallDown, {
+  icon: icon || /* @__PURE__ */ jsx(ChevronSmallDown, {
     color: ["brand-primary", 700]
   })
 });

package/dist/esm/v2/ActionAddon.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/ActionAddon.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { styled } from '@elliemae/ds-system';\nimport { ChevronSmallDown } from '@elliemae/ds-icons';\nimport Button from '@elliemae/ds-button';\n\nconst Addon = styled(Button)`\n  background-color: transparent;\n  padding-right: 4px;\n  height: 100%;\n  border: none;\n  font-size: 12px;\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  color: ${(props) => props.theme.colors.brand['700']};\n  cursor: pointer;\n  &:focus,\n  &::after {\n    background-color: transparent;\n    box-shadow: none !important; /* needed */\n    border: none !important; /* needed */\n  }\n`;\n\nconst ActionAddon = ({ label, onClick, icon }) => (\n  <Addon onClick={onClick} labelText={label} icon={icon || <ChevronSmallDown color={['brand-primary', 700]} />} />\n);\n\nconst actionProps = {\n  /**\n   * Addon label\n   */\n  label: PropTypes.string.description('Addon label'),\n  /**\n   * On click callback\n   */\n  onClick: PropTypes.func.description('On click callback'),\n  /**\n   * Icon to display after the label\n   */\n  icon: PropTypes.element.description('Icon to display after the label'),\n};\n\nActionAddon.propTypes = actionProps;\nActionAddon.displayName = 'ActionAddon';\nconst DSCardActionAddonWithSchema = describe(ActionAddon);\nDSCardActionAddonWithSchema.propTypes = actionProps;\n\nexport { ActionAddon, DSCardActionAddonWithSchema };\nexport default ActionAddon;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,WAAW,gBAAgB;AACpC,SAAS,cAAc;AACvB,SAAS,wBAAwB;AACjC,OAAO,YAAY;AAEnB,MAAM,QAAQ,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAMV,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAU/C,MAAM,cAAc,CAAC,EAAE,OAAO,SAAS,KAAK,MAC1C,gBAAAA,OAAA,cAAC;AAAA,EAAM;AAAA,EAAkB,WAAW;AAAA,EAAO,MAAM,QAAQ,gBAAAA,OAAA,cAAC;AAAA,IAAiB,OAAO,CAAC,iBAAiB,GAAG;AAAA,GAAG;AAAA,CAAI;AAGhH,MAAM,cAAc;AAAA,EAIlB,OAAO,UAAU,OAAO,YAAY,aAAa;AAAA,EAIjD,SAAS,UAAU,KAAK,YAAY,mBAAmB;AAAA,EAIvD,MAAM,UAAU,QAAQ,YAAY,iCAAiC;AACvE;AAEA,YAAY,YAAY;AACxB,YAAY,cAAc;AAC1B,MAAM,8BAA8B,SAAS,WAAW;AACxD,4BAA4B,YAAY;AAGxC,IAAO,sBAAQ;",
-  "names": ["React"]
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,WAAW,gBAAgB;AACpC,SAAS,cAAc;AACvB,SAAS,wBAAwB;AACjC,OAAO,YAAY;AAEnB,MAAM,QAAQ,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAMV,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAU/C,MAAM,cAAc,CAAC,EAAE,OAAO,SAAS,KAAK,MAC1C,oBAAC;AAAA,EAAM;AAAA,EAAkB,WAAW;AAAA,EAAO,MAAM,QAAQ,oBAAC;AAAA,IAAiB,OAAO,CAAC,iBAAiB,GAAG;AAAA,GAAG;AAAA,CAAI;AAGhH,MAAM,cAAc;AAAA,EAIlB,OAAO,UAAU,OAAO,YAAY,aAAa;AAAA,EAIjD,SAAS,UAAU,KAAK,YAAY,mBAAmB;AAAA,EAIvD,MAAM,UAAU,QAAQ,YAAY,iCAAiC;AACvE;AAEA,YAAY,YAAY;AACxB,YAAY,cAAc;AAC1B,MAAM,8BAA8B,SAAS,WAAW;AACxD,4BAA4B,YAAY;AAGxC,IAAO,sBAAQ;",
+  "names": []
 }

package/dist/esm/v2/Card.js

@@ -1,5 +1,5 @@
 import * as React from "react";
-import React2 from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { PropTypes, describe } from "@elliemae/ds-utilities";
 import { DSHeader } from "@elliemae/ds-header";
 import DSTruncatedTooltipText, {
@@ -26,25 +26,58 @@ const CustomCard = ({
   leftAddon,
   rightAddon,
   hasBorder = false
-}) => /* @__PURE__ */ React2.createElement(TooltipTextProvider, null, /* @__PURE__ */ React2.createElement(CardContainer, {
-  hasBorder,
-  cols: getCol(rightAddon),
-  "data-testid": "em-ds-card"
-}, /* @__PURE__ */ React2.createElement(LeftSection, null, leftAddon && /* @__PURE__ */ React2.createElement(LeftAddon, null, leftAddon), /* @__PURE__ */ React2.createElement(MainSection, {
-  style: {
-    maxWidth: leftAddon ? "calc(100% - 40px)" : "100%"
-  }
-}, /* @__PURE__ */ React2.createElement(DSHeader, {
-  fontSize: "16px",
-  "data-testid": "em-ds-card-header",
-  fontWeight: "regular",
-  color: "neutral.800",
-  text: /* @__PURE__ */ React2.createElement(DSTruncatedTooltipText, {
-    value: title
+}) => /* @__PURE__ */ jsx(TooltipTextProvider, {
+  children: /* @__PURE__ */ jsxs(CardContainer, {
+    hasBorder,
+    cols: getCol(rightAddon),
+    "data-testid": "em-ds-card",
+    children: [
+      /* @__PURE__ */ jsxs(LeftSection, {
+        children: [
+          leftAddon && /* @__PURE__ */ jsx(LeftAddon, {
+            children: leftAddon
+          }),
+          /* @__PURE__ */ jsxs(MainSection, {
+            style: {
+              maxWidth: leftAddon ? "calc(100% - 40px)" : "100%"
+            },
+            children: [
+              /* @__PURE__ */ jsx(DSHeader, {
+                fontSize: "16px",
+                "data-testid": "em-ds-card-header",
+                fontWeight: "regular",
+                color: "neutral.800",
+                text: /* @__PURE__ */ jsx(DSTruncatedTooltipText, {
+                  value: title
+                })
+              }),
+              description && /* @__PURE__ */ jsx(Description, {
+                children: /* @__PURE__ */ jsx(DSTruncatedTooltipText, {
+                  value: description
+                })
+              })
+            ]
+          })
+        ]
+      }),
+      rightAddon && /* @__PURE__ */ jsxs(RightAddonSection, {
+        children: [
+          rightAddon[0] && /* @__PURE__ */ jsx(RightAddon, {
+            children: rightAddon[0]
+          }),
+          rightAddon[1] && /* @__PURE__ */ jsxs(Fragment, {
+            children: [
+              rightAddon.length > 1 && /* @__PURE__ */ jsx(Separator, {}),
+              /* @__PURE__ */ jsx(RightAddon, {
+                children: rightAddon[1]
+              })
+            ]
+          })
+        ]
+      })
+    ]
   })
-}), description && /* @__PURE__ */ React2.createElement(Description, null, /* @__PURE__ */ React2.createElement(DSTruncatedTooltipText, {
-  value: description
-})))), rightAddon && /* @__PURE__ */ React2.createElement(RightAddonSection, null, rightAddon[0] && /* @__PURE__ */ React2.createElement(RightAddon, null, rightAddon[0]), rightAddon[1] && /* @__PURE__ */ React2.createElement(React2.Fragment, null, rightAddon.length > 1 && /* @__PURE__ */ React2.createElement(Separator, null), /* @__PURE__ */ React2.createElement(RightAddon, null, rightAddon[1])))));
+});
 const cardProps = {
   title: PropTypes.string.isRequired.description(
     "Title of the card. requiered"

package/dist/esm/v2/Card.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/Card.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { DSHeader } from '@elliemae/ds-header';\nimport DSTruncatedTooltipText, {\n  TooltipTextProvider,\n} from '@elliemae/ds-truncated-tooltip-text';\nimport {\n  CardContainer,\n  LeftSection,\n  LeftAddon,\n  RightAddonSection,\n  RightAddon,\n  Separator,\n  MainSection,\n  Description,\n} from './components';\n\nconst getCol = (rightAddon) => {\n  if (!rightAddon) return [1];\n  return [1, 'auto'];\n};\n\nconst CustomCard = ({\n  title,\n  description,\n  leftAddon,\n  rightAddon, // array. max 2 elements\n  hasBorder = false,\n}) => (\n  <TooltipTextProvider>\n    <CardContainer\n      hasBorder={hasBorder}\n      cols={getCol(rightAddon)}\n      data-testid=\"em-ds-card\"\n    >\n      <LeftSection>\n        {leftAddon && <LeftAddon>{leftAddon}</LeftAddon>}\n        <MainSection\n          style={{\n            maxWidth: leftAddon ? 'calc(100% - 40px)' : '100%',\n          }}\n        >\n          <DSHeader\n            fontSize=\"16px\"\n            data-testid=\"em-ds-card-header\"\n            fontWeight=\"regular\"\n            color=\"neutral.800\"\n            text={<DSTruncatedTooltipText value={title} />}\n          />\n          {description && (\n            <Description>\n              <DSTruncatedTooltipText value={description} />\n            </Description>\n          )}\n        </MainSection>\n      </LeftSection>\n      {rightAddon && (\n        <RightAddonSection>\n          {rightAddon[0] && <RightAddon>{rightAddon[0]}</RightAddon>}\n          {rightAddon[1] && (\n            <>\n              {rightAddon.length > 1 && <Separator />}\n              <RightAddon>{rightAddon[1]}</RightAddon>\n            </>\n          )}\n        </RightAddonSection>\n      )}\n    </CardContainer>\n  </TooltipTextProvider>\n);\n\nconst cardProps = {\n  /**\n   * Title of the card. requiered\n   */\n  title: PropTypes.string.isRequired.description(\n    'Title of the card. requiered',\n  ),\n  /**\n   * Description of the card. not requiered\n   */\n  description: PropTypes.string.description(\n    'Description of the card. not requiered',\n  ),\n  /**\n   * Left Addon\n   */\n  leftAddon: PropTypes.element.description('Left Addon'),\n  /**\n   * Right addon array, max elements: 2\n   */\n  rightAddon: PropTypes.array.description('Right addon array, max elements: 2'),\n  /**\n   * Wheter if the card has border or not\n   */\n  hasBorder: PropTypes.bool.description('Wheter if the card has border or not'),\n};\n\nCustomCard.propTypes = cardProps;\nCustomCard.displayName = 'CustomCard';\nconst DSCardCustomWithSchema = describe(CustomCard);\nDSCardCustomWithSchema.propTypes = cardProps;\n\nexport { CustomCard, DSCardCustomWithSchema };\nexport default CustomCard;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,WAAW,gBAAgB;AACpC,SAAS,gBAAgB;AACzB,OAAO;AAAA,EACL;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,MAAM,SAAS,CAAC,eAAe;AAC7B,MAAI,CAAC;AAAY,WAAO,CAAC,CAAC;AAC1B,SAAO,CAAC,GAAG,MAAM;AACnB;AAEA,MAAM,aAAa,CAAC;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AACd,MACE,gBAAAA,OAAA,cAAC,2BACC,gBAAAA,OAAA,cAAC;AAAA,EACC;AAAA,EACA,MAAM,OAAO,UAAU;AAAA,EACvB,eAAY;AAAA,GAEZ,gBAAAA,OAAA,cAAC,mBACE,aAAa,gBAAAA,OAAA,cAAC,iBAAW,SAAU,GACpC,gBAAAA,OAAA,cAAC;AAAA,EACC,OAAO;AAAA,IACL,UAAU,YAAY,sBAAsB;AAAA,EAC9C;AAAA,GAEA,gBAAAA,OAAA,cAAC;AAAA,EACC,UAAS;AAAA,EACT,eAAY;AAAA,EACZ,YAAW;AAAA,EACX,OAAM;AAAA,EACN,MAAM,gBAAAA,OAAA,cAAC;AAAA,IAAuB,OAAO;AAAA,GAAO;AAAA,CAC9C,GACC,eACC,gBAAAA,OAAA,cAAC,mBACC,gBAAAA,OAAA,cAAC;AAAA,EAAuB,OAAO;AAAA,CAAa,CAC9C,CAEJ,CACF,GACC,cACC,gBAAAA,OAAA,cAAC,yBACE,WAAW,MAAM,gBAAAA,OAAA,cAAC,kBAAY,WAAW,EAAG,GAC5C,WAAW,MACV,gBAAAA,OAAA,cAAAA,OAAA,gBACG,WAAW,SAAS,KAAK,gBAAAA,OAAA,cAAC,eAAU,GACrC,gBAAAA,OAAA,cAAC,kBAAY,WAAW,EAAG,CAC7B,CAEJ,CAEJ,CACF;AAGF,MAAM,YAAY;AAAA,EAIhB,OAAO,UAAU,OAAO,WAAW;AAAA,IACjC;AAAA,EACF;AAAA,EAIA,aAAa,UAAU,OAAO;AAAA,IAC5B;AAAA,EACF;AAAA,EAIA,WAAW,UAAU,QAAQ,YAAY,YAAY;AAAA,EAIrD,YAAY,UAAU,MAAM,YAAY,oCAAoC;AAAA,EAI5E,WAAW,UAAU,KAAK,YAAY,sCAAsC;AAC9E;AAEA,WAAW,YAAY;AACvB,WAAW,cAAc;AACzB,MAAM,yBAAyB,SAAS,UAAU;AAClD,uBAAuB,YAAY;AAGnC,IAAO,eAAQ;",
-  "names": ["React"]
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,WAAW,gBAAgB;AACpC,SAAS,gBAAgB;AACzB,OAAO;AAAA,EACL;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,MAAM,SAAS,CAAC,eAAe;AAC7B,MAAI,CAAC;AAAY,WAAO,CAAC,CAAC;AAC1B,SAAO,CAAC,GAAG,MAAM;AACnB;AAEA,MAAM,aAAa,CAAC;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AACd,MACE,oBAAC;AAAA,EACC,+BAAC;AAAA,IACC;AAAA,IACA,MAAM,OAAO,UAAU;AAAA,IACvB,eAAY;AAAA,IAEZ;AAAA,2BAAC;AAAA,QACE;AAAA,uBAAa,oBAAC;AAAA,YAAW;AAAA,WAAU;AAAA,UACpC,qBAAC;AAAA,YACC,OAAO;AAAA,cACL,UAAU,YAAY,sBAAsB;AAAA,YAC9C;AAAA,YAEA;AAAA,kCAAC;AAAA,gBACC,UAAS;AAAA,gBACT,eAAY;AAAA,gBACZ,YAAW;AAAA,gBACX,OAAM;AAAA,gBACN,MAAM,oBAAC;AAAA,kBAAuB,OAAO;AAAA,iBAAO;AAAA,eAC9C;AAAA,cACC,eACC,oBAAC;AAAA,gBACC,8BAAC;AAAA,kBAAuB,OAAO;AAAA,iBAAa;AAAA,eAC9C;AAAA;AAAA,WAEJ;AAAA;AAAA,OACF;AAAA,MACC,cACC,qBAAC;AAAA,QACE;AAAA,qBAAW,MAAM,oBAAC;AAAA,YAAY,qBAAW;AAAA,WAAG;AAAA,UAC5C,WAAW,MACV;AAAA,YACG;AAAA,yBAAW,SAAS,KAAK,oBAAC,aAAU;AAAA,cACrC,oBAAC;AAAA,gBAAY,qBAAW;AAAA,eAAG;AAAA;AAAA,WAC7B;AAAA;AAAA,OAEJ;AAAA;AAAA,GAEJ;AAAA,CACF;AAGF,MAAM,YAAY;AAAA,EAIhB,OAAO,UAAU,OAAO,WAAW;AAAA,IACjC;AAAA,EACF;AAAA,EAIA,aAAa,UAAU,OAAO;AAAA,IAC5B;AAAA,EACF;AAAA,EAIA,WAAW,UAAU,QAAQ,YAAY,YAAY;AAAA,EAIrD,YAAY,UAAU,MAAM,YAAY,oCAAoC;AAAA,EAI5E,WAAW,UAAU,KAAK,YAAY,sCAAsC;AAC9E;AAEA,WAAW,YAAY;AACvB,WAAW,cAAc;AACzB,MAAM,yBAAyB,SAAS,UAAU;AAClD,uBAAuB,YAAY;AAGnC,IAAO,eAAQ;",
+  "names": []
 }

package/dist/esm/v2/Group.js

@@ -1,5 +1,5 @@
 import * as React from "react";
-import React2 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { PropTypes, describe } from "@elliemae/ds-utilities";
 import { color, border, truncate, styled } from "@elliemae/ds-system";
 import Card from "./Card";
@@ -31,9 +31,22 @@ const Items = styled.div`
   display: flex;
   flex-direction: column;
 `;
-const CardGroup = ({ children, title, action }) => /* @__PURE__ */ React2.createElement(Group, {
-  withTopBorder: !title
-}, !!title && /* @__PURE__ */ React2.createElement(TitleWrapper, null, /* @__PURE__ */ React2.createElement(GroupTitle, null, title), action), /* @__PURE__ */ React2.createElement(Items, null, children));
+const CardGroup = ({ children, title, action }) => /* @__PURE__ */ jsxs(Group, {
+  withTopBorder: !title,
+  children: [
+    !!title && /* @__PURE__ */ jsxs(TitleWrapper, {
+      children: [
+        /* @__PURE__ */ jsx(GroupTitle, {
+          children: title
+        }),
+        action
+      ]
+    }),
+    /* @__PURE__ */ jsx(Items, {
+      children
+    })
+  ]
+});
 const cardgroupProps = {
   children: PropTypes.element.isRequired.description("Card items"),
   title: PropTypes.string.isRequired.description("Title of the group"),

package/dist/esm/v2/Group.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/Group.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { color, border, truncate, styled } from '@elliemae/ds-system';\nimport Card from './Card';\n\nconst Group = styled.div`\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  max-width: 100%;\n  ${Card} {\n    border-top: none;\n  }\n  ${({ theme, withTopBorder }) =>\n    withTopBorder ? `border-top: ${theme.colors.neutral['100']}` : ''}\n`;\n\nconst GroupTitle = styled.span`\n  ${truncate()}\n`;\n\nconst TitleWrapper = styled.div`\n  display: flex;\n  justify-content: space-between;\n  padding: 0 ${(props) => props.theme.space.xs};\n  font-size: 12px;\n  ${color('neutral', '700')};\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  background-color: ${(props) => props.theme.colors.neutral['080']};\n  border-top: ${(props) => border(props.theme.colors.neutral['080'])};\n  line-height: 24px;\n`;\n\nconst Items = styled.div`\n  display: flex;\n  flex-direction: column;\n`;\n\nconst CardGroup = ({ children, title, action }) => (\n  <Group withTopBorder={!title}>\n    {!!title && (\n      <TitleWrapper>\n        <GroupTitle>{title}</GroupTitle>\n        {action}\n      </TitleWrapper>\n    )}\n    <Items>{children}</Items>\n  </Group>\n);\n\nconst cardgroupProps = {\n  /**\n   * Card items\n   */\n  children: PropTypes.element.isRequired.description('Card items'),\n  /**\n   * Title of the group\n   */\n  title: PropTypes.string.isRequired.description('Title of the group'),\n  /**\n   * Right addon action\n   */\n  action: PropTypes.element.description('Right addon action'),\n};\n\nCardGroup.propTypes = cardgroupProps;\nCardGroup.displayName = 'CardGroup';\nconst DSCardGroupWithSchema = describe(CardGroup);\nDSCardGroupWithSchema.propTypes = cardgroupProps;\n\nexport { CardGroup, DSCardGroupWithSchema };\nexport default CardGroup;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,WAAW,gBAAgB;AACpC,SAAS,OAAO,QAAQ,UAAU,cAAc;AAChD,OAAO,UAAU;AAEjB,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKjB;AAAA;AAAA;AAAA,IAGA,CAAC,EAAE,OAAO,cAAc,MACxB,gBAAgB,eAAe,MAAM,OAAO,QAAQ,WAAW;AAAA;AAGnE,MAAM,aAAa,OAAO;AAAA,IACtB,SAAS;AAAA;AAGb,MAAM,eAAe,OAAO;AAAA;AAAA;AAAA,eAGb,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA,IAExC,MAAM,WAAW,KAAK;AAAA,iBACT,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,sBAC9B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA,gBAC5C,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ,MAAM;AAAA;AAAA;AAInE,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA;AAKrB,MAAM,YAAY,CAAC,EAAE,UAAU,OAAO,OAAO,MAC3C,gBAAAA,OAAA,cAAC;AAAA,EAAM,eAAe,CAAC;AAAA,GACpB,CAAC,CAAC,SACD,gBAAAA,OAAA,cAAC,oBACC,gBAAAA,OAAA,cAAC,kBAAY,KAAM,GAClB,MACH,GAEF,gBAAAA,OAAA,cAAC,aAAO,QAAS,CACnB;AAGF,MAAM,iBAAiB;AAAA,EAIrB,UAAU,UAAU,QAAQ,WAAW,YAAY,YAAY;AAAA,EAI/D,OAAO,UAAU,OAAO,WAAW,YAAY,oBAAoB;AAAA,EAInE,QAAQ,UAAU,QAAQ,YAAY,oBAAoB;AAC5D;AAEA,UAAU,YAAY;AACtB,UAAU,cAAc;AACxB,MAAM,wBAAwB,SAAS,SAAS;AAChD,sBAAsB,YAAY;AAGlC,IAAO,gBAAQ;",
-  "names": ["React"]
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,WAAW,gBAAgB;AACpC,SAAS,OAAO,QAAQ,UAAU,cAAc;AAChD,OAAO,UAAU;AAEjB,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKjB;AAAA;AAAA;AAAA,IAGA,CAAC,EAAE,OAAO,cAAc,MACxB,gBAAgB,eAAe,MAAM,OAAO,QAAQ,WAAW;AAAA;AAGnE,MAAM,aAAa,OAAO;AAAA,IACtB,SAAS;AAAA;AAGb,MAAM,eAAe,OAAO;AAAA;AAAA;AAAA,eAGb,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA,IAExC,MAAM,WAAW,KAAK;AAAA,iBACT,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,sBAC9B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA,gBAC5C,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ,MAAM;AAAA;AAAA;AAInE,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA;AAKrB,MAAM,YAAY,CAAC,EAAE,UAAU,OAAO,OAAO,MAC3C,qBAAC;AAAA,EAAM,eAAe,CAAC;AAAA,EACpB;AAAA,KAAC,CAAC,SACD,qBAAC;AAAA,MACC;AAAA,4BAAC;AAAA,UAAY;AAAA,SAAM;AAAA,QAClB;AAAA;AAAA,KACH;AAAA,IAEF,oBAAC;AAAA,MAAO;AAAA,KAAS;AAAA;AAAA,CACnB;AAGF,MAAM,iBAAiB;AAAA,EAIrB,UAAU,UAAU,QAAQ,WAAW,YAAY,YAAY;AAAA,EAI/D,OAAO,UAAU,OAAO,WAAW,YAAY,oBAAoB;AAAA,EAInE,QAAQ,UAAU,QAAQ,YAAY,oBAAoB;AAC5D;AAEA,UAAU,YAAY;AACtB,UAAU,cAAc;AACxB,MAAM,wBAAwB,SAAS,SAAS;AAChD,sBAAsB,YAAY;AAGlC,IAAO,gBAAQ;",
+  "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-card",
-  "version": "3.5.0-rc.7",
+  "version": "3.5.1-next.0",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Card",
   "files": [
@@ -71,16 +71,16 @@
     "indent": 4
   },
   "dependencies": {
-    "@elliemae/ds-button": "3.5.0-rc.7",
-    "@elliemae/ds-classnames": "3.5.0-rc.7",
-    "@elliemae/ds-form": "3.5.0-rc.7",
-    "@elliemae/ds-grid": "3.5.0-rc.7",
-    "@elliemae/ds-header": "3.5.0-rc.7",
-    "@elliemae/ds-icons": "3.5.0-rc.7",
-    "@elliemae/ds-separator": "3.5.0-rc.7",
-    "@elliemae/ds-system": "3.5.0-rc.7",
-    "@elliemae/ds-truncated-tooltip-text": "3.5.0-rc.7",
-    "@elliemae/ds-utilities": "3.5.0-rc.7"
+    "@elliemae/ds-button": "3.5.1-next.0",
+    "@elliemae/ds-classnames": "3.5.1-next.0",
+    "@elliemae/ds-form": "3.5.1-next.0",
+    "@elliemae/ds-grid": "3.5.1-next.0",
+    "@elliemae/ds-header": "3.5.1-next.0",
+    "@elliemae/ds-icons": "3.5.1-next.0",
+    "@elliemae/ds-separator": "3.5.1-next.0",
+    "@elliemae/ds-system": "3.5.1-next.0",
+    "@elliemae/ds-truncated-tooltip-text": "3.5.1-next.0",
+    "@elliemae/ds-utilities": "3.5.1-next.0"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "~5.16.4",