@elliemae/ds-mobile 2.2.0-alpha.4 → 3.0.0-next.2

package/cjs/MobileCard/ActionAddon.js

@@ -1,67 +1,35 @@
-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 });
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('react');
+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-afblfw-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 __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
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_prop_types = __toESM(require("prop-types"));
-var import_styled_components = __toESM(require("styled-components"));
-var import_ds_icons = 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]
-  })
-});
-ActionAddon.propTypes = {
-  label: import_prop_types.default.string,
-  onClick: import_prop_types.default.func,
-  icon: import_prop_types.default.element
-};
-module.exports = __toCommonJS(ActionAddon_exports);
-//# sourceMappingURL=ActionAddon.js.map
+
+exports.ActionAddon = ActionAddon;

package/cjs/MobileCard/Card.js

@@ -1,181 +1,142 @@
-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 Card_exports = {};
-__export(Card_exports, {
-  DSMobileCardWithSchema: () => DSMobileCardWithSchema,
-  default: () => Card_default
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_react_desc = require("react-desc");
-var import_styled_components = __toESM(require("styled-components"));
-var import_styled_components2 = require("@xstyled/styled-components");
-var import_ds_system = require("@elliemae/ds-system");
-var import_GroupItem = __toESM(require("@elliemae/ds-shared/GroupContext/GroupItem"));
-var import_ds_grid = require("@elliemae/ds-grid");
-var import_StyledCard = require("./StyledCard");
-var import_ExpandChevron = require("./ExpandChevron");
-var import_useHeight = require("./useHeight");
-var import_ExpandableRegion = require("./ExpandableRegion");
-var import_props = require("./props");
-const TitleEllipsis = import_styled_components.default.div`
-  ${(0, import_ds_system.truncate)()}
-`;
-const Title = import_styled_components.default.div`
-  ${import_styled_components2.space}
-  ${(0, import_ds_system.truncate)()}
-  font-weight: ${(props) => props.theme.fontWeights.semibold};
-  font-size: ${(props) => (0, import_ds_system.toMobile)(props.theme.fontSizes.title[600])};
-  width: 100%;
-  ${(0, import_ds_system.color)("neutral", 800)}
-`;
-const Detail = import_styled_components.default.span`
-  ${import_styled_components2.space}
-  ${(0, import_ds_system.truncate)()}
-  font-size: ${(props) => (0, import_ds_system.toMobile)(props.theme.fontSizes.title[500])};
-  font-weight: ${(props) => props.theme.fontWeights.regular};
-`;
-const SubText = import_styled_components.default.span`
-  margin-top: ${(props) => (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(props.theme.space.xs)};
-  ${(0, import_ds_system.truncate)()}
-  &:nth-child(2) {
-    padding-left: ${(props) => (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(props.theme.space.s)};
-  }
-`;
-const SubTextWrap = import_styled_components.default.div`
-  ${(0, import_ds_system.truncate)()}
-  border-top: ${(props) => (0, import_ds_system.border)(props.theme.colors.neutral["300"])};
-  margin-top: 6px;
-  margin-bottom: 2px;
-  padding-bottom: ${(props) => (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(props.theme.space.xxs)};
-  font-size: ${(props) => (0, import_ds_system.toMobile)(props.theme.fontSizes.subTitle[400])};
-  ${(0, import_ds_system.color)("neutral", 500)}
-  font-weight: ${(props) => props.theme.fontWeights.regular};
-  display: flex;
-  justify-content: space-between;
-`;
-const LeftIcon = (0, import_styled_components.default)(import_ds_grid.Grid)`
-  & > span {
-    height: ${(props) => props.halfM};
-    width: ${(props) => props.halfM};
-  }
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+var React = require('react');
+var reactDesc = require('react-desc');
+var styled = require('styled-components');
+var styledComponents = require('@xstyled/styled-components');
+var dsSystem = require('@elliemae/ds-system');
+var GroupItem = require('@elliemae/ds-shared/GroupContext/GroupItem');
+var dsGrid = require('@elliemae/ds-grid');
+var StyledCard = require('./StyledCard.js');
+var ExpandChevron = require('./ExpandChevron.js');
+var useHeight = require('./useHeight.js');
+var ExpandableRegion = require('./ExpandableRegion.js');
+var props = require('./props.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-  & > span > svg,
-  svg:not([fill]) {
-    height: ${(props) => props.halfM};
-    width: ${(props) => props.halfM};
-  }
-`;
-const CenterWrap = import_styled_components.default.div`
-  display: flex;
-  align-items: center;
-  ${(0, import_ds_system.truncate)()}
-`;
-const MobileCard = ({
-  children,
-  height = "m",
-  leftAddOn,
-  leftProp,
-  rightProp,
-  subText,
-  subIcons,
-  details,
-  theme,
-  expandable = false,
-  expandedContent,
-  value,
-  cardContent
-}) => {
-  const subTextRef = (0, import_react.useRef)(null);
-  const subTextHeight = (0, import_useHeight.useHeight)(subTextRef);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+var GroupItem__default = /*#__PURE__*/_interopDefaultLegacy(GroupItem);
+
+const TitleEllipsis = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-10tpzm8-0"
+})(["", ""], dsSystem.truncate());
+const Title = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-10tpzm8-1"
+})(["", " ", " font-weight:", ";font-size:", ";width:100%;", ""], styledComponents.space, dsSystem.truncate(), props => props.theme.fontWeights.semibold, props => dsSystem.toMobile(props.theme.fontSizes.title[600]), dsSystem.color('neutral', 800));
+const Detail = /*#__PURE__*/styled__default["default"].span.withConfig({
+  componentId: "sc-10tpzm8-2"
+})(["", " ", " font-size:", ";font-weight:", ";"], styledComponents.space, dsSystem.truncate(), props => dsSystem.toMobile(props.theme.fontSizes.title[500]), props => props.theme.fontWeights.regular);
+const SubText = /*#__PURE__*/styled__default["default"].span.withConfig({
+  componentId: "sc-10tpzm8-3"
+})(["margin-top:", ";", " &:nth-child(2){padding-left:", ";}"], props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs), dsSystem.truncate(), props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s));
+const SubTextWrap = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-10tpzm8-4"
+})(["", " border-top:", ";margin-top:6px;margin-bottom:2px;padding-bottom:", ";font-size:", ";", " font-weight:", ";display:flex;justify-content:space-between;"], dsSystem.truncate(), props => dsSystem.border(props.theme.colors.neutral['300']), props => dsSystem.__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs), props => dsSystem.toMobile(props.theme.fontSizes.subTitle[400]), dsSystem.color('neutral', 500), props => props.theme.fontWeights.regular);
+const LeftIcon = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
+  componentId: "sc-10tpzm8-5"
+})(["& > span{height:", ";width:", ";}& > span > svg,svg:not([fill]){height:", ";width:", ";}"], props => props.halfM, props => props.halfM, props => props.halfM, props => props.halfM);
+const CenterWrap = /*#__PURE__*/styled__default["default"].div.withConfig({
+  componentId: "sc-10tpzm8-6"
+})(["display:flex;align-items:center;", ""], dsSystem.truncate());
+
+const MobileCard = _ref => {
+  var _TitleEllipsis, _SubText, _Grid;
+
+  let {
+    children,
+    height = 'm',
+    leftAddOn,
+    leftProp,
+    rightProp,
+    subText,
+    subIcons,
+    details,
+    theme,
+    expandable = false,
+    expandedContent,
+    value,
+    cardContent
+  } = _ref;
+  const subTextRef = React.useRef(null);
+  const subTextHeight = useHeight.useHeight(subTextRef);
   const isJustChildren = !(subText || subIcons || details);
-  const halfM = (0, import_ds_system.op)("/", (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.m), 2);
-  return /* @__PURE__ */ import_react.default.createElement(import_GroupItem.default, {
-    render: (context = {}) => {
-      const { activeValue, onChange } = context;
-      const selected = activeValue !== void 0 && (activeValue === value || activeValue?.length && activeValue?.includes(value));
-      return /* @__PURE__ */ import_react.default.createElement(import_StyledCard.StyledCard, {
+  const halfM = dsSystem.op('/', dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.m), 2);
+  return /*#__PURE__*/_jsx__default["default"](GroupItem__default["default"], {
+    render: function () {
+      let context = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+      const {
+        activeValue,
+        onChange
+      } = context;
+      const selected = activeValue !== undefined && (activeValue === value || (activeValue === null || activeValue === void 0 ? void 0 : activeValue.length) && (activeValue === null || activeValue === void 0 ? void 0 : activeValue.includes(value)));
+      return /*#__PURE__*/_jsx__default["default"](StyledCard.StyledCard, {
         "data-testid": "card-wrapper",
-        minHeight: height === "m" ? (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.xxl) : (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.xl)
-      }, expandable && /* @__PURE__ */ import_react.default.createElement(import_ExpandChevron.ExpandChevron, {
+        minHeight: height === 'm' ? dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl) : dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.xl)
+      }, void 0, expandable && /*#__PURE__*/_jsx__default["default"](ExpandChevron.ExpandChevron, {
         isExpanded: selected,
-        onClick: (e) => {
+        onClick: e => {
           e.stopPropagation();
-          onChange({ target: { value } });
+          onChange({
+            target: {
+              value
+            }
+          });
         },
-        align: subText || subIcons ? "top" : "center"
-      }), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
+        align: subText || subIcons ? 'top' : 'center'
+      }), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
         pb: (subText || subIcons) && subTextHeight,
-        cols: ["auto", "auto"],
+        cols: ['auto', 'auto'],
         alignItems: "center"
-      }, leftProp && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-        ml: (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.s)
-      }, leftProp), leftAddOn && /* @__PURE__ */ import_react.default.createElement(LeftIcon, {
-        ml: (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.s),
-        halfM
-      }, leftAddOn)), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-        pl: !leftAddOn ? (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.s) : (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.xs),
-        pr: (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.s),
+      }, void 0, leftProp && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
+        ml: dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)
+      }, void 0, leftProp), leftAddOn && /*#__PURE__*/_jsx__default["default"](LeftIcon, {
+        ml: dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
+        halfM: halfM
+      }, void 0, leftAddOn)), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
+        pl: !leftAddOn ? dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.s) : dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.xs),
+        pr: dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
         width: "100%"
-      }, /* @__PURE__ */ import_react.default.createElement(CenterWrap, null, /* @__PURE__ */ import_react.default.createElement(Title, {
+      }, void 0, /*#__PURE__*/_jsx__default["default"](CenterWrap, {}, void 0, /*#__PURE__*/_jsx__default["default"](Title, {
         pt: !isJustChildren && halfM,
         "data-testid": "card-title"
-      }, /* @__PURE__ */ import_react.default.createElement(TitleEllipsis, null, children), details && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
+      }, void 0, _TitleEllipsis || (_TitleEllipsis = /*#__PURE__*/_jsx__default["default"](TitleEllipsis, {}, void 0, children)), details && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
         "data-testid": "card-details",
-        cols: details.map(() => "min-content"),
+        cols: details.map(() => 'min-content'),
         mb: !(subText || subIcons) && halfM || 0,
-        pt: (0, import_ds_system.op)("/", (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.xxs), 2)
-      }, details.map((d, i) => /* @__PURE__ */ import_react.default.createElement(Detail, {
-        key: i
-      }, d, i < details.length - 1 && /* @__PURE__ */ import_react.default.createElement(Detail, {
-        px: (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.xxs)
-      }, "\u2022"))))), rightProp && rightProp.map((prop, i) => /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-        ml: (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.s),
-        key: i
-      }, prop))), subIcons && /* @__PURE__ */ import_react.default.createElement(SubTextWrap, {
-        ref: subTextRef
-      }, /* @__PURE__ */ import_react.default.createElement(SubText, null, subIcons), subText && subText[1] && /* @__PURE__ */ import_react.default.createElement(SubText, {
-        "data-testid": "card-subText"
-      }, subText[1])), subText && !subIcons && /* @__PURE__ */ import_react.default.createElement(SubTextWrap, {
-        ref: subTextRef
-      }, subText.map((s, i) => /* @__PURE__ */ import_react.default.createElement(SubText, {
-        "data-testid": "card-subText",
-        key: i
-      }, s))), /* @__PURE__ */ import_react.default.createElement(import_ExpandableRegion.ExpandableRegion, {
+        pt: dsSystem.op('/', dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs), 2)
+      }, void 0, details.map((d, i) => /*#__PURE__*/_jsx__default["default"](Detail, {}, i, d, i < details.length - 1 && /*#__PURE__*/_jsx__default["default"](Detail, {
+        px: dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs)
+      }, void 0, "\u2022"))))), rightProp && rightProp.map((prop, i) => /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
+        ml: dsSystem.__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)
+      }, i, prop))), subIcons && /*#__PURE__*/jsxRuntime.jsxs(SubTextWrap, {
+        ref: subTextRef,
+        children: [_SubText || (_SubText = /*#__PURE__*/_jsx__default["default"](SubText, {}, void 0, subIcons)), subText && subText[1] && /*#__PURE__*/_jsx__default["default"](SubText, {
+          "data-testid": "card-subText"
+        }, void 0, subText[1])]
+      }), subText && !subIcons && /*#__PURE__*/jsxRuntime.jsx(SubTextWrap, {
+        ref: subTextRef,
+        children: subText.map((s, i) => /*#__PURE__*/_jsx__default["default"](SubText, {
+          "data-testid": "card-subText"
+        }, i, s))
+      }), /*#__PURE__*/_jsx__default["default"](ExpandableRegion.ExpandableRegion, {
         show: selected,
         content: expandedContent
-      }), cardContent && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, cardContent)));
+      }), cardContent && (_Grid || (_Grid = /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {}, void 0, cardContent)))));
     }
   });
 };
-MobileCard.propTypes = import_props.cardPropsTypes;
-const DSMobileCardWithSchema = (0, import_react_desc.describe)(MobileCard);
-DSMobileCardWithSchema.propTypes = import_props.cardPropsTypes;
-var Card_default = (0, import_ds_system.withTheme)(MobileCard);
-module.exports = __toCommonJS(Card_exports);
-//# sourceMappingURL=Card.js.map
+
+const DSMobileCardWithSchema = reactDesc.describe(MobileCard);
+DSMobileCardWithSchema.propTypes = props.cardPropsTypes;
+var MobileCard$1 = dsSystem.withTheme(MobileCard);
+
+exports.DSMobileCardWithSchema = DSMobileCardWithSchema;
+exports["default"] = MobileCard$1;

package/cjs/MobileCard/CardIcons.js

@@ -1,107 +1,38 @@
-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 CardIcons_exports = {};
-__export(CardIcons_exports, {
-  SubIcons: () => SubIcons
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_prop_types = __toESM(require("prop-types"));
-var import_styled_components = __toESM(require("styled-components"));
-var import_ds_grid = require("@elliemae/ds-grid");
-const CardIconsWrapper = (0, import_styled_components.default)(import_ds_grid.Grid)`
-  align-items: center;
-  span,
-  svg {
-    width: 12px !important;
-    height: 12px !important;
-  }
-  span.icon-color-muted svg,
-  svg:not([fill]) {
-    fill: ${(props) => props.theme.colors.neutral["600"]};
-    height: 12px !important;
-    width: 12px !important;
+'use strict';
 
-    & * {
-      fill: ${(props) => props.theme.colors.neutral["600"]};
-    }
-  }
-  span.icon-color-warn svg,
-  svg:not([fill]) {
-    fill: ${(props) => props.theme.colors.warning["600"]};
-    height: 12px !important;
-    width: 12px !important;
+Object.defineProperty(exports, '__esModule', { value: true });
 
-    & * {
-      fill: ${(props) => props.theme.colors.warning["600"]};
-    }
-  }
-  span.icon-color-error svg,
-  svg:not([fill]) {
-    fill: ${(props) => props.theme.colors.danger["900"]};
-    height: 12px !important;
-    width: 12px !important;
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+require('react');
+var styled = require('styled-components');
+var dsGrid = require('@elliemae/ds-grid');
 
-    & * {
-      fill: ${(props) => props.theme.colors.danger["900"]};
-    }
-  }
-  span.icon-color-success svg,
-  svg:not([fill]) {
-    fill: ${(props) => props.theme.colors.success["900"]};
-    height: 12px !important;
-    width: 12px !important;
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-    & * {
-      fill: ${(props) => props.theme.colors.success["900"]};
-    }
-  }
-  span.icon-color-primary svg,
-  svg:not([fill]) {
-    fill: ${(props) => props.theme.colors.brand[600]};
-  }
-  span.icon-color-primary svg,
-  svg:not([fill]) {
-    fill: ${(props) => props.theme.colors.brand[600]};
-  }
-`;
-const SubIcons = ({ icons = [], colors = [] }) => /* @__PURE__ */ import_react.default.createElement(CardIconsWrapper, {
-  cols: icons.map(() => "12px"),
-  gutter: "6px",
-  height: "14px",
-  "data-testid": "card-subIcons"
-}, icons.map((Icon, i) => /* @__PURE__ */ import_react.default.createElement(Icon, {
-  key: i,
-  className: `icon-color-${colors[i] || "muted"}`
-})));
-SubIcons.propTypes = {
-  icons: import_prop_types.default.arrayOf(import_prop_types.default.func),
-  colors: import_prop_types.default.arrayOf(import_prop_types.default.oneOf(["muted", "warn", "error", "success", "primary"]))
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+
+const CardIconsWrapper = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
+  componentId: "sc-1vqygz1-0"
+})(["align-items:center;span,svg{width:12px !important;height:12px !important;}span.icon-color-muted svg,svg:not([fill]){fill:", ";height:12px !important;width:12px !important;& *{fill:", ";}}span.icon-color-warn svg,svg:not([fill]){fill:", ";height:12px !important;width:12px !important;& *{fill:", ";}}span.icon-color-error svg,svg:not([fill]){fill:", ";height:12px !important;width:12px !important;& *{fill:", ";}}span.icon-color-success svg,svg:not([fill]){fill:", ";height:12px !important;width:12px !important;& *{fill:", ";}}span.icon-color-primary svg,svg:not([fill]){fill:", ";}span.icon-color-primary svg,svg:not([fill]){fill:", ";}"], props => props.theme.colors.neutral['600'], props => props.theme.colors.neutral['600'], props => props.theme.colors.warning['600'], props => props.theme.colors.warning['600'], props => props.theme.colors.danger['900'], props => props.theme.colors.danger['900'], props => props.theme.colors.success['900'], props => props.theme.colors.success['900'], props => props.theme.colors.brand[600], props => props.theme.colors.brand[600]);
+const SubIcons = _ref => {
+  let {
+    icons = [],
+    colors = []
+  } = _ref;
+  return /*#__PURE__*/_jsx__default["default"](CardIconsWrapper, {
+    cols: icons.map(() => '12px'),
+    gutter: "6px",
+    height: "14px",
+    "data-testid": "card-subIcons"
+  }, void 0, icons.map((Icon, i) =>
+  /*#__PURE__*/
+  // eslint-disable-next-line react/no-array-index-key
+  _jsx__default["default"](Icon, {
+    className: "icon-color-".concat(colors[i] || 'muted')
+  }, i)));
 };
-module.exports = __toCommonJS(CardIcons_exports);
-//# sourceMappingURL=CardIcons.js.map
+
+exports.SubIcons = SubIcons;