@elliemae/ds-card 2.1.0-rc.7 → 2.2.0-alpha.2

package/cjs/index.js

@@ -1,29 +1,42 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var DSCard = require('./DSCard.js');
-var DSCardHeader = require('./DSCardHeader.js');
-var DSCardBody = require('./DSCardBody.js');
-var Card = require('./v2/Card.js');
-var Group = require('./v2/Group.js');
-var ActionAddon = require('./v2/ActionAddon.js');
-var DetailCard = require('./detail/DetailCard.js');
-
-
-
-exports.DSCard = DSCard.DSCard;
-exports.DSCardWithSchema = DSCard.DSCardWithSchema;
-exports["default"] = DSCard.DSCard;
-exports.DSCardHeader = DSCardHeader.DSCardHeader;
-exports.DSCardHeaderWithSchema = DSCardHeader.DSCardHeaderWithSchema;
-exports.DSCardBody = DSCardBody.DSCardBody;
-exports.DSCardBodyWithSchema = DSCardBody.DSCardBodyWithSchema;
-exports.CustomCard = Card.CustomCard;
-exports.DSCardCustomWithSchema = Card.DSCardCustomWithSchema;
-exports.CardGroup = Group.CardGroup;
-exports.DSCardGroupWithSchema = Group.DSCardGroupWithSchema;
-exports.ActionAddon = ActionAddon.ActionAddon;
-exports.DSCardActionAddonWithSchema = ActionAddon.DSCardActionAddonWithSchema;
-exports.DSCardDetailWithSchema = DetailCard.DSCardDetailWithSchema;
-exports.DetailCard = DetailCard.DetailCard;
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var src_exports = {};
+__export(src_exports, {
+  default: () => import_DSCard.default
+});
+var React = __toESM(require("react"));
+__reExport(src_exports, __toESM(require("./DSCard")));
+__reExport(src_exports, __toESM(require("./DSCardHeader")));
+__reExport(src_exports, __toESM(require("./DSCardBody")));
+__reExport(src_exports, __toESM(require("./v2/Card")));
+__reExport(src_exports, __toESM(require("./v2/Group")));
+__reExport(src_exports, __toESM(require("./v2/ActionAddon")));
+__reExport(src_exports, __toESM(require("./detail/DetailCard")));
+var import_DSCard = __toESM(require("./DSCard"));
+module.exports = __toCommonJS(src_exports);
+//# sourceMappingURL=index.js.map

package/cjs/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["export * from './DSCard';\nexport * from './DSCardHeader';\nexport * from './DSCardBody';\nexport * from './v2/Card';\nexport * from './v2/Group';\nexport * from './v2/ActionAddon';\nexport * from './detail/DetailCard';\n\nexport { default } from './DSCard';\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,wBAAc;AACd,wBAAc;AACd,wBAAc;AACd,wBAAc;AACd,wBAAc;AACd,wBAAc;AACd,wBAAc;AAEd,oBAAwB;",
+  "names": []
+}

package/cjs/v2/ActionAddon.js

@@ -1,58 +1,73 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _jsx = require('@babel/runtime/helpers/jsx');
-require('react');
-var reactDesc = require('react-desc');
-var styled = require('styled-components');
-var dsIcons = require('@elliemae/ds-icons');
-var DSButton = require('@elliemae/ds-button');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
-
-const Addon = /*#__PURE__*/styled__default["default"](DSButton__default["default"]).withConfig({
-  componentId: "sc-1pazs35-0"
-})(["background-color:transparent;padding-right:4px;height:100%;border:none;font-size:12px;font-weight:", ";color:", ";cursor:pointer;&:focus,&::after{background-color:transparent;box-shadow:none !important;border:none !important;}"], props => props.theme.fontWeights.semibold, props => props.theme.colors.brand['700']);
-
-const ActionAddon = _ref => {
-  let {
-    label,
-    onClick,
-    icon
-  } = _ref;
-  return /*#__PURE__*/_jsx__default["default"](Addon, {
-    onClick: onClick,
-    labelText: label,
-    icon: icon || /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallDown, {
-      color: ['brand-primary', 700]
-    })
-  });
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
 };
-
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var ActionAddon_exports = {};
+__export(ActionAddon_exports, {
+  ActionAddon: () => ActionAddon,
+  DSCardActionAddonWithSchema: () => DSCardActionAddonWithSchema,
+  default: () => ActionAddon_default
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_react_desc = __toESM(require("react-desc"));
+var import_styled_components = __toESM(require("styled-components"));
+var import_ds_icons = __toESM(require("@elliemae/ds-icons"));
+var import_ds_button = __toESM(require("@elliemae/ds-button"));
+const Addon = (0, import_styled_components.default)(import_ds_button.default)`
+  background-color: transparent;
+  padding-right: 4px;
+  height: 100%;
+  border: none;
+  font-size: 12px;
+  font-weight: ${(props) => props.theme.fontWeights.semibold};
+  color: ${(props) => props.theme.colors.brand["700"]};
+  cursor: pointer;
+  &:focus,
+  &::after {
+    background-color: transparent;
+    box-shadow: none !important; /* needed */
+    border: none !important; /* needed */
+  }
+`;
+const ActionAddon = ({ label, onClick, icon }) => /* @__PURE__ */ import_react.default.createElement(Addon, {
+  onClick,
+  labelText: label,
+  icon: icon || /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ChevronSmallDown, {
+    color: ["brand-primary", 700]
+  })
+});
 const actionProps = {
-  /**
-   * Addon label
-   */
-  label: reactDesc.PropTypes.string.description('Addon label'),
-
-  /**
-   * On click callback
-   */
-  onClick: reactDesc.PropTypes.func.description('On click callback'),
-
-  /**
-   * Icon to display after the label
-   */
-  icon: reactDesc.PropTypes.element.description('Icon to display after the label')
+  label: import_react_desc.PropTypes.string.description("Addon label"),
+  onClick: import_react_desc.PropTypes.func.description("On click callback"),
+  icon: import_react_desc.PropTypes.element.description("Icon to display after the label")
 };
-const DSCardActionAddonWithSchema = reactDesc.describe(ActionAddon);
+ActionAddon.propTypes = actionProps;
+const DSCardActionAddonWithSchema = (0, import_react_desc.describe)(ActionAddon);
 DSCardActionAddonWithSchema.propTypes = actionProps;
-
-exports.ActionAddon = ActionAddon;
-exports.DSCardActionAddonWithSchema = DSCardActionAddonWithSchema;
-exports["default"] = ActionAddon;
+var ActionAddon_default = ActionAddon;
+module.exports = __toCommonJS(ActionAddon_exports);
+//# sourceMappingURL=ActionAddon.js.map

package/cjs/v2/ActionAddon.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/v2/ActionAddon.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport styled from 'styled-components';\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;\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;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAoC;AACpC,+BAAmB;AACnB,sBAAiC;AACjC,uBAAmB;AAEnB,MAAM,QAAQ,sCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAMJ,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,WACrC,mDAAC,OAAD;AAAA,EAAO;AAAA,EAAkB,WAAW;AAAA,EAAO,MAAM,QAAQ,mDAAC,kCAAD;AAAA,IAAkB,OAAO,CAAC,iBAAiB;AAAA;AAAA;AAGtG,MAAM,cAAc;AAAA,EAIlB,OAAO,4BAAU,OAAO,YAAY;AAAA,EAIpC,SAAS,4BAAU,KAAK,YAAY;AAAA,EAIpC,MAAM,4BAAU,QAAQ,YAAY;AAAA;AAGtC,YAAY,YAAY;AACxB,MAAM,8BAA8B,gCAAS;AAC7C,4BAA4B,YAAY;AAGxC,IAAO,sBAAQ;",
+  "names": []
+}

package/cjs/v2/Card.js

@@ -1,88 +1,82 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _jsx = require('@babel/runtime/helpers/jsx');
-require('react');
-var reactDesc = require('react-desc');
-var dsHeader = require('@elliemae/ds-header');
-var DSTruncatedTooltipText = require('@elliemae/ds-truncated-tooltip-text');
-var components = require('./components.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
-var DSTruncatedTooltipText__default = /*#__PURE__*/_interopDefaultLegacy(DSTruncatedTooltipText);
-
-var _Separator;
-
-const getCol = rightAddon => {
-  if (!rightAddon) return [1];
-  return [1, 'auto'];
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
 };
-
-const CustomCard = _ref => {
-  let {
-    title,
-    description,
-    leftAddon,
-    rightAddon,
-    // array. max 2 elements
-    hasBorder = false
-  } = _ref;
-  return /*#__PURE__*/_jsx__default["default"](DSTruncatedTooltipText.TooltipTextProvider, {}, void 0, /*#__PURE__*/_jsx__default["default"](components.CardContainer, {
-    hasBorder: hasBorder,
-    cols: getCol(rightAddon),
-    "data-testid": "em-ds-card"
-  }, void 0, /*#__PURE__*/_jsx__default["default"](components.LeftSection, {}, void 0, leftAddon && /*#__PURE__*/_jsx__default["default"](components.LeftAddon, {}, void 0, leftAddon), /*#__PURE__*/_jsx__default["default"](components.MainSection, {
-    style: {
-      maxWidth: leftAddon ? 'calc(100% - 40px)' : '100%'
-    }
-  }, void 0, /*#__PURE__*/_jsx__default["default"](dsHeader.DSHeader, {
-    fontSize: "16px",
-    "data-testid": "em-ds-card-header",
-    fontWeight: "regular",
-    color: "neutral.800",
-    text: /*#__PURE__*/_jsx__default["default"](DSTruncatedTooltipText__default["default"], {
-      value: title
-    })
-  }), description && /*#__PURE__*/_jsx__default["default"](components.Description, {}, void 0, /*#__PURE__*/_jsx__default["default"](DSTruncatedTooltipText__default["default"], {
-    value: description
-  })))), rightAddon && /*#__PURE__*/_jsx__default["default"](components.RightAddonSection, {}, void 0, rightAddon[0] && /*#__PURE__*/_jsx__default["default"](components.RightAddon, {}, void 0, rightAddon[0]), rightAddon[1] && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [rightAddon.length > 1 && (_Separator || (_Separator = /*#__PURE__*/_jsx__default["default"](components.Separator, {}))), /*#__PURE__*/_jsx__default["default"](components.RightAddon, {}, void 0, rightAddon[1])]
-  }))));
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
 };
-
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var Card_exports = {};
+__export(Card_exports, {
+  CustomCard: () => CustomCard,
+  DSCardCustomWithSchema: () => DSCardCustomWithSchema,
+  default: () => Card_default
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_react_desc = __toESM(require("react-desc"));
+var import_ds_header = __toESM(require("@elliemae/ds-header"));
+var import_ds_truncated_tooltip_text = __toESM(require("@elliemae/ds-truncated-tooltip-text"));
+var import_components = __toESM(require("./components"));
+const getCol = (rightAddon) => {
+  if (!rightAddon)
+    return [1];
+  return [1, "auto"];
+};
+const CustomCard = ({
+  title,
+  description,
+  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
+  })
+}), 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 of the card. requiered
-   */
-  title: reactDesc.PropTypes.string.isRequired.description('Title of the card. requiered'),
-
-  /**
-   * Description of the card. not requiered
-   */
-  description: reactDesc.PropTypes.string.description('Description of the card. not requiered'),
-
-  /**
-   * Left Addon
-   */
-  leftAddon: reactDesc.PropTypes.element.description('Left Addon'),
-
-  /**
-   * Right addon array, max elements: 2
-   */
-  rightAddon: reactDesc.PropTypes.array.description('Right addon array, max elements: 2'),
-
-  /**
-   * Wheter if the card has border or not
-   */
-  hasBorder: reactDesc.PropTypes.bool.description('Wheter if the card has border or not')
+  title: import_react_desc.PropTypes.string.isRequired.description("Title of the card. requiered"),
+  description: import_react_desc.PropTypes.string.description("Description of the card. not requiered"),
+  leftAddon: import_react_desc.PropTypes.element.description("Left Addon"),
+  rightAddon: import_react_desc.PropTypes.array.description("Right addon array, max elements: 2"),
+  hasBorder: import_react_desc.PropTypes.bool.description("Wheter if the card has border or not")
 };
-const DSCardCustomWithSchema = reactDesc.describe(CustomCard);
+CustomCard.propTypes = cardProps;
+const DSCardCustomWithSchema = (0, import_react_desc.describe)(CustomCard);
 DSCardCustomWithSchema.propTypes = cardProps;
-
-exports.CustomCard = CustomCard;
-exports.DSCardCustomWithSchema = DSCardCustomWithSchema;
-exports["default"] = CustomCard;
+var Card_default = CustomCard;
+module.exports = __toCommonJS(Card_exports);
+//# sourceMappingURL=Card.js.map

package/cjs/v2/Card.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/v2/Card.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from 'react-desc';\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;\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;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAoC;AACpC,uBAAyB;AACzB,uCAEO;AACP,wBASO;AAEP,MAAM,SAAS,CAAC,eAAe;AAC7B,MAAI,CAAC;AAAY,WAAO,CAAC;AACzB,SAAO,CAAC,GAAG;AAAA;AAGb,MAAM,aAAa,CAAC;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,MAEZ,mDAAC,sDAAD,MACE,mDAAC,iCAAD;AAAA,EACE;AAAA,EACA,MAAM,OAAO;AAAA,EACb,eAAY;AAAA,GAEZ,mDAAC,+BAAD,MACG,aAAa,mDAAC,6BAAD,MAAY,YAC1B,mDAAC,+BAAD;AAAA,EACE,OAAO;AAAA,IACL,UAAU,YAAY,sBAAsB;AAAA;AAAA,GAG9C,mDAAC,2BAAD;AAAA,EACE,UAAS;AAAA,EACT,eAAY;AAAA,EACZ,YAAW;AAAA,EACX,OAAM;AAAA,EACN,MAAM,mDAAC,0CAAD;AAAA,IAAwB,OAAO;AAAA;AAAA,IAEtC,eACC,mDAAC,+BAAD,MACE,mDAAC,0CAAD;AAAA,EAAwB,OAAO;AAAA,OAKtC,cACC,mDAAC,qCAAD,MACG,WAAW,MAAM,mDAAC,8BAAD,MAAa,WAAW,KACzC,WAAW,MACV,wFACG,WAAW,SAAS,KAAK,mDAAC,6BAAD,OAC1B,mDAAC,8BAAD,MAAa,WAAW;AAStC,MAAM,YAAY;AAAA,EAIhB,OAAO,4BAAU,OAAO,WAAW,YACjC;AAAA,EAKF,aAAa,4BAAU,OAAO,YAC5B;AAAA,EAKF,WAAW,4BAAU,QAAQ,YAAY;AAAA,EAIzC,YAAY,4BAAU,MAAM,YAAY;AAAA,EAIxC,WAAW,4BAAU,KAAK,YAAY;AAAA;AAGxC,WAAW,YAAY;AACvB,MAAM,yBAAyB,gCAAS;AACxC,uBAAuB,YAAY;AAGnC,IAAO,eAAQ;",
+  "names": []
+}

package/cjs/v2/Group.js

@@ -1,68 +1,81 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _jsx = require('@babel/runtime/helpers/jsx');
-require('react');
-var reactDesc = require('react-desc');
-var styled = require('styled-components');
-var dsSystem = require('@elliemae/ds-system');
-var Card = require('./Card.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-const Group = /*#__PURE__*/styled__default["default"].div.withConfig({
-  componentId: "sc-1y2lfoo-0"
-})(["display:flex;flex-direction:column;width:100%;max-width:100%;", "{border-top:none;}", ""], Card.CustomCard, _ref => {
-  let {
-    theme,
-    withTopBorder
-  } = _ref;
-  return withTopBorder ? "border-top: ".concat(theme.colors.neutral['100']) : '';
-});
-const GroupTitle = /*#__PURE__*/styled__default["default"].span.withConfig({
-  componentId: "sc-1y2lfoo-1"
-})(["", ""], dsSystem.truncate());
-const TitleWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
-  componentId: "sc-1y2lfoo-2"
-})(["display:flex;justify-content:space-between;padding:0 ", ";font-size:12px;", ";font-weight:", ";background-color:", ";border-top:", ";line-height:24px;"], props => props.theme.space.xs, dsSystem.color('neutral', '700'), props => props.theme.fontWeights.semibold, props => props.theme.colors.neutral['080'], props => dsSystem.border(props.theme.colors.neutral['080']));
-const Items = /*#__PURE__*/styled__default["default"].div.withConfig({
-  componentId: "sc-1y2lfoo-3"
-})(["display:flex;flex-direction:column;"]);
-
-const CardGroup = _ref2 => {
-  let {
-    children,
-    title,
-    action
-  } = _ref2;
-  return /*#__PURE__*/_jsx__default["default"](Group, {
-    withTopBorder: !title
-  }, void 0, !!title && /*#__PURE__*/_jsx__default["default"](TitleWrapper, {}, void 0, /*#__PURE__*/_jsx__default["default"](GroupTitle, {}, void 0, title), action), /*#__PURE__*/_jsx__default["default"](Items, {}, void 0, children));
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
 };
-
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var Group_exports = {};
+__export(Group_exports, {
+  CardGroup: () => CardGroup,
+  DSCardGroupWithSchema: () => DSCardGroupWithSchema,
+  default: () => Group_default
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_react_desc = __toESM(require("react-desc"));
+var import_styled_components = __toESM(require("styled-components"));
+var import_ds_system = __toESM(require("@elliemae/ds-system"));
+var import_Card = __toESM(require("./Card"));
+const Group = import_styled_components.default.div`
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  max-width: 100%;
+  ${import_Card.default} {
+    border-top: none;
+  }
+  ${({ theme, withTopBorder }) => withTopBorder ? `border-top: ${theme.colors.neutral["100"]}` : ""}
+`;
+const GroupTitle = import_styled_components.default.span`
+  ${(0, import_ds_system.truncate)()}
+`;
+const TitleWrapper = import_styled_components.default.div`
+  display: flex;
+  justify-content: space-between;
+  padding: 0 ${(props) => props.theme.space.xs};
+  font-size: 12px;
+  ${(0, import_ds_system.color)("neutral", "700")};
+  font-weight: ${(props) => props.theme.fontWeights.semibold};
+  background-color: ${(props) => props.theme.colors.neutral["080"]};
+  border-top: ${(props) => (0, import_ds_system.border)(props.theme.colors.neutral["080"])};
+  line-height: 24px;
+`;
+const Items = import_styled_components.default.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 cardgroupProps = {
-  /**
-   * Card items
-   */
-  children: reactDesc.PropTypes.element.isRequired.description('Card items'),
-
-  /**
-   * Title of the group
-   */
-  title: reactDesc.PropTypes.string.isRequired.description('Title of the group'),
-
-  /**
-   * Right addon action
-   */
-  action: reactDesc.PropTypes.element.description('Right addon action')
+  children: import_react_desc.PropTypes.element.isRequired.description("Card items"),
+  title: import_react_desc.PropTypes.string.isRequired.description("Title of the group"),
+  action: import_react_desc.PropTypes.element.description("Right addon action")
 };
-const DSCardGroupWithSchema = reactDesc.describe(CardGroup);
+CardGroup.propTypes = cardgroupProps;
+const DSCardGroupWithSchema = (0, import_react_desc.describe)(CardGroup);
 DSCardGroupWithSchema.propTypes = cardgroupProps;
-
-exports.CardGroup = CardGroup;
-exports.DSCardGroupWithSchema = DSCardGroupWithSchema;
-exports["default"] = CardGroup;
+var Group_default = CardGroup;
+module.exports = __toCommonJS(Group_exports);
+//# sourceMappingURL=Group.js.map

package/cjs/v2/Group.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/v2/Group.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport styled from 'styled-components';\nimport { color, border, truncate } 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;\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;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAoC;AACpC,+BAAmB;AACnB,uBAAwC;AACxC,kBAAiB;AAEjB,MAAM,QAAQ,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKjB;AAAA;AAAA;AAAA,IAGA,CAAC,EAAE,OAAO,oBACV,gBAAgB,eAAe,MAAM,OAAO,QAAQ,WAAW;AAAA;AAGnE,MAAM,aAAa,iCAAO;AAAA,IACtB;AAAA;AAGJ,MAAM,eAAe,iCAAO;AAAA;AAAA;AAAA,eAGb,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAAA,IAExC,4BAAM,WAAW;AAAA,iBACJ,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,sBAC9B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA,gBAC5C,CAAC,UAAU,6BAAO,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAI7D,MAAM,QAAQ,iCAAO;AAAA;AAAA;AAAA;AAKrB,MAAM,YAAY,CAAC,EAAE,UAAU,OAAO,aACpC,mDAAC,OAAD;AAAA,EAAO,eAAe,CAAC;AAAA,GACpB,CAAC,CAAC,SACD,mDAAC,cAAD,MACE,mDAAC,YAAD,MAAa,QACZ,SAGL,mDAAC,OAAD,MAAQ;AAIZ,MAAM,iBAAiB;AAAA,EAIrB,UAAU,4BAAU,QAAQ,WAAW,YAAY;AAAA,EAInD,OAAO,4BAAU,OAAO,WAAW,YAAY;AAAA,EAI/C,QAAQ,4BAAU,QAAQ,YAAY;AAAA;AAGxC,UAAU,YAAY;AACtB,MAAM,wBAAwB,gCAAS;AACvC,sBAAsB,YAAY;AAGlC,IAAO,gBAAQ;",
+  "names": []
+}