@elliemae/ds-card 3.12.0-next.0 → 3.12.0-next.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -35,12 +35,7 @@ var import_ds_utilities = require("@elliemae/ds-utilities");
35
35
  var import_ds_classnames = require("@elliemae/ds-classnames");
36
36
  var import_DSCardBody = __toESM(require("./DSCardBody"));
37
37
  var import_DSCardHeader = __toESM(require("./DSCardHeader"));
38
- const DSCard = ({
39
- innerRef = void 0,
40
- children = null,
41
- containerProps = {},
42
- ...otherProps
43
- }) => {
38
+ const DSCard = ({ innerRef = void 0, children = null, containerProps = {}, ...otherProps }) => {
44
39
  const { cssClassName } = (0, import_ds_classnames.convertPropToCssClassName)("card");
45
40
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
46
41
  "data-testid": "card",
@@ -52,9 +47,7 @@ const DSCard = ({
52
47
  });
53
48
  };
54
49
  const cardProps = {
55
- containerProps: import_ds_utilities.PropTypes.object.description(
56
- "inject props to component wrapper"
57
- ),
50
+ containerProps: import_ds_utilities.PropTypes.object.description("inject props to component wrapper"),
58
51
  innerRef: import_ds_utilities.PropTypes.string.description("Get reference for the button"),
59
52
  children: import_ds_utilities.PropTypes.arrayOf(
60
53
  import_ds_utilities.PropTypes.shape({
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/DSCard.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
- "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"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADenB;AAdJ,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;",
4
+ "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 = ({ innerRef = undefined, children = null, containerProps = {}, ...otherProps }) => {\n const { cssClassName } = convertPropToCssClassName('card');\n\n return (\n <div data-testid=\"card\" {...containerProps} ref={innerRef} className={cssClassName} {...otherProps}>\n {children}\n </div>\n );\n};\n\nconst cardProps = {\n /** inject props to component wrapper */\n containerProps: PropTypes.object.description('inject props to component wrapper'),\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"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADUnB;AATJ,0BAAoC;AACpC,2BAA0C;AAC1C,wBAAuB;AACvB,0BAAyB;AAEzB,MAAM,SAAS,CAAC,EAAE,WAAW,QAAW,WAAW,MAAM,iBAAiB,CAAC,MAAM,WAAW,MAAM;AAChG,QAAM,EAAE,aAAa,QAAI,gDAA0B,MAAM;AAEzD,SACE,4CAAC;AAAA,IAAI,eAAY;AAAA,IAAQ,GAAG;AAAA,IAAgB,KAAK;AAAA,IAAU,WAAW;AAAA,IAAe,GAAG;AAAA,IACrF;AAAA,GACH;AAEJ;AAEA,MAAM,YAAY;AAAA,EAEhB,gBAAgB,8BAAU,OAAO,YAAY,mCAAmC;AAAA,EAIhF,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;",
6
6
  "names": ["DSCardHeader", "DSCardBody"]
7
7
  }
@@ -34,9 +34,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
34
34
  var import_ds_utilities = require("@elliemae/ds-utilities");
35
35
  var import_ds_classnames = require("@elliemae/ds-classnames");
36
36
  const DSCardHeader = ({ title, action }) => {
37
- const { cssClassName, classNameElement } = (0, import_ds_classnames.convertPropToCssClassName)(
38
- "card-header"
39
- );
37
+ const { cssClassName, classNameElement } = (0, import_ds_classnames.convertPropToCssClassName)("card-header");
40
38
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
41
39
  className: cssClassName,
42
40
  "data-testid": "card-header",
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/DSCardHeader.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
- "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"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADSnB;AARJ,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;",
4
+ "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('card-header');\n return (\n <div className={cssClassName} data-testid=\"card-header\">\n <span className={classNameElement('heading')}>{title}</span>\n <div className={classNameElement('pull-right')} data-testid=\"ds-card_header-action\">\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"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADOnB;AANJ,0BAAoC;AACpC,2BAA0C;AAE1C,MAAM,eAAe,CAAC,EAAE,OAAO,OAAO,MAAM;AAC1C,QAAM,EAAE,cAAc,iBAAiB,QAAI,gDAA0B,aAAa;AAClF,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,QAAI,WAAW,iBAAiB,YAAY;AAAA,QAAG,eAAY;AAAA,QACzD;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;",
6
6
  "names": []
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/detail/styled.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nexport const Separator = styled.div`\n width: 100%;\n height: 24px;\n border-right: 1px solid ${(props) => props.theme.colors.neutral['300']};\n margin: 0 8px;\n`;\n\nexport const Title = styled.h3`\n margin: 0;\n font-size: 16px;\n min-height: 20px;\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n color: ${(props) => props.theme.colors.neutral['700']};\n`;\n\nexport const Description = styled.p`\n margin: 0;\n font-size: 12px;\n min-height: 18px;\n display: flex;\n align-items: center;\n color: ${(props) =>\n props.descriptionColor === 'neutral'\n ? props.theme.colors.neutral['600']\n : props.theme.colors.brand['600']};\n`;\n\nexport const RightAddon = styled(Grid)`\n margin: 0;\n white-space: nowrap;\n`;\n\nexport const RightDescription = styled(Grid)`\n margin: 0;\n white-space: nowrap;\n font-size: 12px;\n color: ${(props) => props.theme.colors.neutral['600']};\n`;\nexport const RightValue = styled(Grid)`\n margin: 0;\n white-space: nowrap;\n font-size: 14px;\n color: ${(props) => props.theme.colors.neutral['800']};\n`;\n\nexport const ExpandContent = styled.div`\n font-size: 12px;\n`;\n\nconst border = ({ active, theme }) =>\n active ? theme.colors.brand['600'] : theme.colors.neutral['200'];\nconst background = ({ active, theme }) =>\n active ? theme.colors.brand['100'] : theme.colors.neutral['000'];\n\nexport const Container = styled(Grid)`\n width: 100%;\n min-height: 52px;\n min-width: 244px;\n padding: 6px 8px 6px 12px;\n position: relative;\n border-top: 1px solid ${border};\n border-bottom: 1px solid ${border};\n background: ${background};\n ${(props) =>\n props.disabled\n ? `\n ${Title}, ${Description}, ${RightDescription}, ${RightValue} {\n color: ${props.theme.colors.neutral['500']};\n }\n `\n : ''}\n &:hover {\n box-shadow: 0 2px 4px 0 rgba(53, 60, 70, 0.5);\n z-index: 1;\n }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,qBAAqB;AAEd,MAAM,YAAY,wBAAO;AAAA;AAAA;AAAA,4BAGJ,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAI3D,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA;AAAA,iBAIX,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAG1C,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAMvB,CAAC,UACR,MAAM,qBAAqB,YACvB,MAAM,MAAM,OAAO,QAAQ,SAC3B,MAAM,MAAM,OAAO,MAAM;AAAA;AAG1B,MAAM,iBAAa,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAK9B,MAAM,uBAAmB,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA,WAIhC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAE1C,MAAM,iBAAa,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA,WAI1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAG1C,MAAM,gBAAgB,wBAAO;AAAA;AAAA;AAIpC,MAAM,SAAS,CAAC,EAAE,QAAQ,MAAM,MAC9B,SAAS,MAAM,OAAO,MAAM,SAAS,MAAM,OAAO,QAAQ;AAC5D,MAAM,aAAa,CAAC,EAAE,QAAQ,MAAM,MAClC,SAAS,MAAM,OAAO,MAAM,SAAS,MAAM,OAAO,QAAQ;AAErD,MAAM,gBAAY,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAMV;AAAA,6BACG;AAAA,gBACb;AAAA,IACZ,CAAC,UACD,MAAM,WACF;AAAA,MACF,UAAU,gBAAgB,qBAAqB;AAAA,eACtC,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,MAGlC;AAAA;AAAA;AAAA;AAAA;AAAA;",
4
+ "sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nexport const Separator = styled.div`\n width: 100%;\n height: 24px;\n border-right: 1px solid ${(props) => props.theme.colors.neutral['300']};\n margin: 0 8px;\n`;\n\nexport const Title = styled.h3`\n margin: 0;\n font-size: 16px;\n min-height: 20px;\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n color: ${(props) => props.theme.colors.neutral['700']};\n`;\n\nexport const Description = styled.p`\n margin: 0;\n font-size: 12px;\n min-height: 18px;\n display: flex;\n align-items: center;\n color: ${(props) =>\n props.descriptionColor === 'neutral' ? props.theme.colors.neutral['600'] : props.theme.colors.brand['600']};\n`;\n\nexport const RightAddon = styled(Grid)`\n margin: 0;\n white-space: nowrap;\n`;\n\nexport const RightDescription = styled(Grid)`\n margin: 0;\n white-space: nowrap;\n font-size: 12px;\n color: ${(props) => props.theme.colors.neutral['600']};\n`;\nexport const RightValue = styled(Grid)`\n margin: 0;\n white-space: nowrap;\n font-size: 14px;\n color: ${(props) => props.theme.colors.neutral['800']};\n`;\n\nexport const ExpandContent = styled.div`\n font-size: 12px;\n`;\n\nconst border = ({ active, theme }) => (active ? theme.colors.brand['600'] : theme.colors.neutral['200']);\nconst background = ({ active, theme }) => (active ? theme.colors.brand['100'] : theme.colors.neutral['000']);\n\nexport const Container = styled(Grid)`\n width: 100%;\n min-height: 52px;\n min-width: 244px;\n padding: 6px 8px 6px 12px;\n position: relative;\n border-top: 1px solid ${border};\n border-bottom: 1px solid ${border};\n background: ${background};\n ${(props) =>\n props.disabled\n ? `\n ${Title}, ${Description}, ${RightDescription}, ${RightValue} {\n color: ${props.theme.colors.neutral['500']};\n }\n `\n : ''}\n &:hover {\n box-shadow: 0 2px 4px 0 rgba(53, 60, 70, 0.5);\n z-index: 1;\n }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,qBAAqB;AAEd,MAAM,YAAY,wBAAO;AAAA;AAAA;AAAA,4BAGJ,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAI3D,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA;AAAA,iBAIX,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAG1C,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAMvB,CAAC,UACR,MAAM,qBAAqB,YAAY,MAAM,MAAM,OAAO,QAAQ,SAAS,MAAM,MAAM,OAAO,MAAM;AAAA;AAGjG,MAAM,iBAAa,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAK9B,MAAM,uBAAmB,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA,WAIhC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAE1C,MAAM,iBAAa,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA,WAI1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAG1C,MAAM,gBAAgB,wBAAO;AAAA;AAAA;AAIpC,MAAM,SAAS,CAAC,EAAE,QAAQ,MAAM,MAAO,SAAS,MAAM,OAAO,MAAM,SAAS,MAAM,OAAO,QAAQ;AACjG,MAAM,aAAa,CAAC,EAAE,QAAQ,MAAM,MAAO,SAAS,MAAM,OAAO,MAAM,SAAS,MAAM,OAAO,QAAQ;AAE9F,MAAM,gBAAY,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAMV;AAAA,6BACG;AAAA,gBACb;AAAA,IACZ,CAAC,UACD,MAAM,WACF;AAAA,MACF,UAAU,gBAAgB,qBAAqB;AAAA,eACtC,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,MAGlC;AAAA;AAAA;AAAA;AAAA;AAAA;",
6
6
  "names": []
7
7
  }
@@ -99,12 +99,8 @@ const CustomCard = ({
99
99
  })
100
100
  });
101
101
  const cardProps = {
102
- title: import_ds_utilities.PropTypes.string.isRequired.description(
103
- "Title of the card. requiered"
104
- ),
105
- description: import_ds_utilities.PropTypes.string.description(
106
- "Description of the card. not requiered"
107
- ),
102
+ title: import_ds_utilities.PropTypes.string.isRequired.description("Title of the card. requiered"),
103
+ description: import_ds_utilities.PropTypes.string.description("Description of the card. not requiered"),
108
104
  leftAddon: import_ds_utilities.PropTypes.element.description("Left Addon"),
109
105
  rightAddon: import_ds_utilities.PropTypes.array.description("Right addon array, max elements: 2"),
110
106
  hasBorder: import_ds_utilities.PropTypes.bool.description("Wheter if the card has border or not")
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/v2/Card.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "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"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoCD;AAnCtB,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;",
4
+ "sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { DSHeader } from '@elliemae/ds-header';\nimport DSTruncatedTooltipText, { TooltipTextProvider } 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 hasBorder={hasBorder} cols={getCol(rightAddon)} data-testid=\"em-ds-card\">\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('Title of the card. requiered'),\n /**\n * Description of the card. not requiered\n */\n description: PropTypes.string.description('Description of the card. not requiered'),\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"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8BD;AA7BtB,0BAAoC;AACpC,uBAAyB;AACzB,uCAA4D;AAC5D,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,IAAc;AAAA,IAAsB,MAAM,OAAO,UAAU;AAAA,IAAG,eAAY;AAAA,IACzE;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,YAAY,8BAA8B;AAAA,EAI7E,aAAa,8BAAU,OAAO,YAAY,wCAAwC;AAAA,EAIlF,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;",
6
6
  "names": ["DSTruncatedTooltipText"]
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/v2/Group.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "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"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADyCjB;AAxCN,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;",
4
+ "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 }) => (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"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADwCjB;AAvCN,0BAAoC;AACpC,uBAAgD;AAChD,kBAAiB;AAEjB,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKjB,YAAAA;AAAA;AAAA;AAAA,IAGA,CAAC,EAAE,OAAO,cAAc,MAAO,gBAAgB,eAAe,MAAM,OAAO,QAAQ,WAAW;AAAA;AAGlG,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;",
6
6
  "names": ["Card"]
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/v2/components.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst CardContainer = styled(Grid)`\n align-items: center;\n justify-content: space-between;\n width: 100%;\n height: 56px;\n padding: 8px 16px;\n position: relative;\n border: ${({ theme, hasBorder }) =>\n hasBorder ? `1px solid ${theme.colors.neutral['100']}` : ''};\n &:before {\n content: '';\n border-bottom: 1px solid ${(props) => props.theme.colors.neutral['100']};\n position: absolute;\n margin: 0 auto;\n width: 90%;\n bottom: 0;\n }\n &:last-child::before {\n content: none;\n }\n`;\n\nconst LeftSection = styled.div`\n display: flex;\n align-items: center;\n`;\n\nconst LeftAddon = styled.div`\n height: fit-content;\n width: fit-content;\n margin-right: 16px;\n cursor: pointer;\n`;\n\nconst RightAddonSection = styled.div`\n display: flex;\n align-items: center;\n width: fit-content;\n`;\n\nconst RightAddon = styled.div`\n height: fit-content;\n width: fit-content;\n cursor: pointer;\n`;\n\nconst Separator = styled.div`\n width: 0px;\n height: 24px;\n border-right: 1px solid ${(props) => props.theme.colors.neutral['300']};\n margin: 0 8px;\n`;\n\nconst MainSection = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nconst Title = styled.h3`\n margin: 0;\n font-size: 16px;\n font-weight: ${(props) => props.theme.fontWeights.regular};\n color: ${(props) => props.theme.colors.neutral['800']};\n`;\n\nconst Description = styled.p`\n margin: 0;\n color: ${(props) => props.theme.colors.neutral['600']};\n`;\n\nexport {\n CardContainer,\n LeftSection,\n LeftAddon,\n RightAddonSection,\n RightAddon,\n Separator,\n MainSection,\n Title,\n Description,\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,qBAAqB;AAErB,MAAM,oBAAgB,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAOrB,CAAC,EAAE,OAAO,UAAU,MAC5B,YAAY,aAAa,MAAM,OAAO,QAAQ,WAAW;AAAA;AAAA;AAAA,+BAG9B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWrE,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAK3B,MAAM,YAAY,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOzB,MAAM,oBAAoB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAMjC,MAAM,aAAa,wBAAO;AAAA;AAAA;AAAA;AAAA;AAM1B,MAAM,YAAY,wBAAO;AAAA;AAAA;AAAA,4BAGG,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAIlE,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAK3B,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA,iBAGJ,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGjD,MAAM,cAAc,wBAAO;AAAA;AAAA,WAEhB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;",
4
+ "sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst CardContainer = styled(Grid)`\n align-items: center;\n justify-content: space-between;\n width: 100%;\n height: 56px;\n padding: 8px 16px;\n position: relative;\n border: ${({ theme, hasBorder }) => (hasBorder ? `1px solid ${theme.colors.neutral['100']}` : '')};\n &:before {\n content: '';\n border-bottom: 1px solid ${(props) => props.theme.colors.neutral['100']};\n position: absolute;\n margin: 0 auto;\n width: 90%;\n bottom: 0;\n }\n &:last-child::before {\n content: none;\n }\n`;\n\nconst LeftSection = styled.div`\n display: flex;\n align-items: center;\n`;\n\nconst LeftAddon = styled.div`\n height: fit-content;\n width: fit-content;\n margin-right: 16px;\n cursor: pointer;\n`;\n\nconst RightAddonSection = styled.div`\n display: flex;\n align-items: center;\n width: fit-content;\n`;\n\nconst RightAddon = styled.div`\n height: fit-content;\n width: fit-content;\n cursor: pointer;\n`;\n\nconst Separator = styled.div`\n width: 0px;\n height: 24px;\n border-right: 1px solid ${(props) => props.theme.colors.neutral['300']};\n margin: 0 8px;\n`;\n\nconst MainSection = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nconst Title = styled.h3`\n margin: 0;\n font-size: 16px;\n font-weight: ${(props) => props.theme.fontWeights.regular};\n color: ${(props) => props.theme.colors.neutral['800']};\n`;\n\nconst Description = styled.p`\n margin: 0;\n color: ${(props) => props.theme.colors.neutral['600']};\n`;\n\nexport {\n CardContainer,\n LeftSection,\n LeftAddon,\n RightAddonSection,\n RightAddon,\n Separator,\n MainSection,\n Title,\n Description,\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,qBAAqB;AAErB,MAAM,oBAAgB,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAOrB,CAAC,EAAE,OAAO,UAAU,MAAO,YAAY,aAAa,MAAM,OAAO,QAAQ,WAAW;AAAA;AAAA;AAAA,+BAGjE,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWrE,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAK3B,MAAM,YAAY,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOzB,MAAM,oBAAoB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAMjC,MAAM,aAAa,wBAAO;AAAA;AAAA;AAAA;AAAA;AAM1B,MAAM,YAAY,wBAAO;AAAA;AAAA;AAAA,4BAGG,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAIlE,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAK3B,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA,iBAGJ,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGjD,MAAM,cAAc,wBAAO;AAAA;AAAA,WAEhB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;",
6
6
  "names": []
7
7
  }
@@ -4,12 +4,7 @@ import { PropTypes, describe } from "@elliemae/ds-utilities";
4
4
  import { convertPropToCssClassName } from "@elliemae/ds-classnames";
5
5
  import DSCardBody from "./DSCardBody";
6
6
  import DSCardHeader from "./DSCardHeader";
7
- const DSCard = ({
8
- innerRef = void 0,
9
- children = null,
10
- containerProps = {},
11
- ...otherProps
12
- }) => {
7
+ const DSCard = ({ innerRef = void 0, children = null, containerProps = {}, ...otherProps }) => {
13
8
  const { cssClassName } = convertPropToCssClassName("card");
14
9
  return /* @__PURE__ */ jsx("div", {
15
10
  "data-testid": "card",
@@ -21,9 +16,7 @@ const DSCard = ({
21
16
  });
22
17
  };
23
18
  const cardProps = {
24
- containerProps: PropTypes.object.description(
25
- "inject props to component wrapper"
26
- ),
19
+ containerProps: PropTypes.object.description("inject props to component wrapper"),
27
20
  innerRef: PropTypes.string.description("Get reference for the button"),
28
21
  children: PropTypes.arrayOf(
29
22
  PropTypes.shape({
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSCard.tsx"],
4
- "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"],
5
- "mappings": "AAAA,YAAY,WAAW;ACenB;AAdJ,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;",
4
+ "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 = ({ innerRef = undefined, children = null, containerProps = {}, ...otherProps }) => {\n const { cssClassName } = convertPropToCssClassName('card');\n\n return (\n <div data-testid=\"card\" {...containerProps} ref={innerRef} className={cssClassName} {...otherProps}>\n {children}\n </div>\n );\n};\n\nconst cardProps = {\n /** inject props to component wrapper */\n containerProps: PropTypes.object.description('inject props to component wrapper'),\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"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACUnB;AATJ,SAAS,WAAW,gBAAgB;AACpC,SAAS,iCAAiC;AAC1C,OAAO,gBAAgB;AACvB,OAAO,kBAAkB;AAEzB,MAAM,SAAS,CAAC,EAAE,WAAW,QAAW,WAAW,MAAM,iBAAiB,CAAC,MAAM,WAAW,MAAM;AAChG,QAAM,EAAE,aAAa,IAAI,0BAA0B,MAAM;AAEzD,SACE,oBAAC;AAAA,IAAI,eAAY;AAAA,IAAQ,GAAG;AAAA,IAAgB,KAAK;AAAA,IAAU,WAAW;AAAA,IAAe,GAAG;AAAA,IACrF;AAAA,GACH;AAEJ;AAEA,MAAM,YAAY;AAAA,EAEhB,gBAAgB,UAAU,OAAO,YAAY,mCAAmC;AAAA,EAIhF,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;",
6
6
  "names": []
7
7
  }
@@ -3,9 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
3
3
  import { PropTypes, describe } from "@elliemae/ds-utilities";
4
4
  import { convertPropToCssClassName } from "@elliemae/ds-classnames";
5
5
  const DSCardHeader = ({ title, action }) => {
6
- const { cssClassName, classNameElement } = convertPropToCssClassName(
7
- "card-header"
8
- );
6
+ const { cssClassName, classNameElement } = convertPropToCssClassName("card-header");
9
7
  return /* @__PURE__ */ jsxs("div", {
10
8
  className: cssClassName,
11
9
  "data-testid": "card-header",
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSCardHeader.tsx"],
4
- "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"],
5
- "mappings": "AAAA,YAAY,WAAW;ACSnB,SACE,KADF;AARJ,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;",
4
+ "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('card-header');\n return (\n <div className={cssClassName} data-testid=\"card-header\">\n <span className={classNameElement('heading')}>{title}</span>\n <div className={classNameElement('pull-right')} data-testid=\"ds-card_header-action\">\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"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACOnB,SACE,KADF;AANJ,SAAS,WAAW,gBAAgB;AACpC,SAAS,iCAAiC;AAE1C,MAAM,eAAe,CAAC,EAAE,OAAO,OAAO,MAAM;AAC1C,QAAM,EAAE,cAAc,iBAAiB,IAAI,0BAA0B,aAAa;AAClF,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,QAAI,WAAW,iBAAiB,YAAY;AAAA,QAAG,eAAY;AAAA,QACzD;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;",
6
6
  "names": []
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/detail/styled.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nexport const Separator = styled.div`\n width: 100%;\n height: 24px;\n border-right: 1px solid ${(props) => props.theme.colors.neutral['300']};\n margin: 0 8px;\n`;\n\nexport const Title = styled.h3`\n margin: 0;\n font-size: 16px;\n min-height: 20px;\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n color: ${(props) => props.theme.colors.neutral['700']};\n`;\n\nexport const Description = styled.p`\n margin: 0;\n font-size: 12px;\n min-height: 18px;\n display: flex;\n align-items: center;\n color: ${(props) =>\n props.descriptionColor === 'neutral'\n ? props.theme.colors.neutral['600']\n : props.theme.colors.brand['600']};\n`;\n\nexport const RightAddon = styled(Grid)`\n margin: 0;\n white-space: nowrap;\n`;\n\nexport const RightDescription = styled(Grid)`\n margin: 0;\n white-space: nowrap;\n font-size: 12px;\n color: ${(props) => props.theme.colors.neutral['600']};\n`;\nexport const RightValue = styled(Grid)`\n margin: 0;\n white-space: nowrap;\n font-size: 14px;\n color: ${(props) => props.theme.colors.neutral['800']};\n`;\n\nexport const ExpandContent = styled.div`\n font-size: 12px;\n`;\n\nconst border = ({ active, theme }) =>\n active ? theme.colors.brand['600'] : theme.colors.neutral['200'];\nconst background = ({ active, theme }) =>\n active ? theme.colors.brand['100'] : theme.colors.neutral['000'];\n\nexport const Container = styled(Grid)`\n width: 100%;\n min-height: 52px;\n min-width: 244px;\n padding: 6px 8px 6px 12px;\n position: relative;\n border-top: 1px solid ${border};\n border-bottom: 1px solid ${border};\n background: ${background};\n ${(props) =>\n props.disabled\n ? `\n ${Title}, ${Description}, ${RightDescription}, ${RightValue} {\n color: ${props.theme.colors.neutral['500']};\n }\n `\n : ''}\n &:hover {\n box-shadow: 0 2px 4px 0 rgba(53, 60, 70, 0.5);\n z-index: 1;\n }\n`;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AACvB,SAAS,YAAY;AAEd,MAAM,YAAY,OAAO;AAAA;AAAA;AAAA,4BAGJ,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAI3D,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA,iBAIX,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAG1C,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAMvB,CAAC,UACR,MAAM,qBAAqB,YACvB,MAAM,MAAM,OAAO,QAAQ,SAC3B,MAAM,MAAM,OAAO,MAAM;AAAA;AAG1B,MAAM,aAAa,OAAO,IAAI;AAAA;AAAA;AAAA;AAK9B,MAAM,mBAAmB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA,WAIhC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAE1C,MAAM,aAAa,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA,WAI1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAG1C,MAAM,gBAAgB,OAAO;AAAA;AAAA;AAIpC,MAAM,SAAS,CAAC,EAAE,QAAQ,MAAM,MAC9B,SAAS,MAAM,OAAO,MAAM,SAAS,MAAM,OAAO,QAAQ;AAC5D,MAAM,aAAa,CAAC,EAAE,QAAQ,MAAM,MAClC,SAAS,MAAM,OAAO,MAAM,SAAS,MAAM,OAAO,QAAQ;AAErD,MAAM,YAAY,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAMV;AAAA,6BACG;AAAA,gBACb;AAAA,IACZ,CAAC,UACD,MAAM,WACF;AAAA,MACF,UAAU,gBAAgB,qBAAqB;AAAA,eACtC,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,MAGlC;AAAA;AAAA;AAAA;AAAA;AAAA;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nexport const Separator = styled.div`\n width: 100%;\n height: 24px;\n border-right: 1px solid ${(props) => props.theme.colors.neutral['300']};\n margin: 0 8px;\n`;\n\nexport const Title = styled.h3`\n margin: 0;\n font-size: 16px;\n min-height: 20px;\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n color: ${(props) => props.theme.colors.neutral['700']};\n`;\n\nexport const Description = styled.p`\n margin: 0;\n font-size: 12px;\n min-height: 18px;\n display: flex;\n align-items: center;\n color: ${(props) =>\n props.descriptionColor === 'neutral' ? props.theme.colors.neutral['600'] : props.theme.colors.brand['600']};\n`;\n\nexport const RightAddon = styled(Grid)`\n margin: 0;\n white-space: nowrap;\n`;\n\nexport const RightDescription = styled(Grid)`\n margin: 0;\n white-space: nowrap;\n font-size: 12px;\n color: ${(props) => props.theme.colors.neutral['600']};\n`;\nexport const RightValue = styled(Grid)`\n margin: 0;\n white-space: nowrap;\n font-size: 14px;\n color: ${(props) => props.theme.colors.neutral['800']};\n`;\n\nexport const ExpandContent = styled.div`\n font-size: 12px;\n`;\n\nconst border = ({ active, theme }) => (active ? theme.colors.brand['600'] : theme.colors.neutral['200']);\nconst background = ({ active, theme }) => (active ? theme.colors.brand['100'] : theme.colors.neutral['000']);\n\nexport const Container = styled(Grid)`\n width: 100%;\n min-height: 52px;\n min-width: 244px;\n padding: 6px 8px 6px 12px;\n position: relative;\n border-top: 1px solid ${border};\n border-bottom: 1px solid ${border};\n background: ${background};\n ${(props) =>\n props.disabled\n ? `\n ${Title}, ${Description}, ${RightDescription}, ${RightValue} {\n color: ${props.theme.colors.neutral['500']};\n }\n `\n : ''}\n &:hover {\n box-shadow: 0 2px 4px 0 rgba(53, 60, 70, 0.5);\n z-index: 1;\n }\n`;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AACvB,SAAS,YAAY;AAEd,MAAM,YAAY,OAAO;AAAA;AAAA;AAAA,4BAGJ,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAI3D,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA,iBAIX,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAG1C,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAMvB,CAAC,UACR,MAAM,qBAAqB,YAAY,MAAM,MAAM,OAAO,QAAQ,SAAS,MAAM,MAAM,OAAO,MAAM;AAAA;AAGjG,MAAM,aAAa,OAAO,IAAI;AAAA;AAAA;AAAA;AAK9B,MAAM,mBAAmB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA,WAIhC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAE1C,MAAM,aAAa,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA,WAI1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAG1C,MAAM,gBAAgB,OAAO;AAAA;AAAA;AAIpC,MAAM,SAAS,CAAC,EAAE,QAAQ,MAAM,MAAO,SAAS,MAAM,OAAO,MAAM,SAAS,MAAM,OAAO,QAAQ;AACjG,MAAM,aAAa,CAAC,EAAE,QAAQ,MAAM,MAAO,SAAS,MAAM,OAAO,MAAM,SAAS,MAAM,OAAO,QAAQ;AAE9F,MAAM,YAAY,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAMV;AAAA,6BACG;AAAA,gBACb;AAAA,IACZ,CAAC,UACD,MAAM,WACF;AAAA,MACF,UAAU,gBAAgB,qBAAqB;AAAA,eACtC,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA,MAGlC;AAAA;AAAA;AAAA;AAAA;AAAA;",
6
6
  "names": []
7
7
  }
@@ -2,9 +2,7 @@ import * as React from "react";
2
2
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
3
3
  import { PropTypes, describe } from "@elliemae/ds-utilities";
4
4
  import { DSHeader } from "@elliemae/ds-header";
5
- import DSTruncatedTooltipText, {
6
- TooltipTextProvider
7
- } from "@elliemae/ds-truncated-tooltip-text";
5
+ import DSTruncatedTooltipText, { TooltipTextProvider } from "@elliemae/ds-truncated-tooltip-text";
8
6
  import {
9
7
  CardContainer,
10
8
  LeftSection,
@@ -79,12 +77,8 @@ const CustomCard = ({
79
77
  })
80
78
  });
81
79
  const cardProps = {
82
- title: PropTypes.string.isRequired.description(
83
- "Title of the card. requiered"
84
- ),
85
- description: PropTypes.string.description(
86
- "Description of the card. not requiered"
87
- ),
80
+ title: PropTypes.string.isRequired.description("Title of the card. requiered"),
81
+ description: PropTypes.string.description("Description of the card. not requiered"),
88
82
  leftAddon: PropTypes.element.description("Left Addon"),
89
83
  rightAddon: PropTypes.array.description("Right addon array, max elements: 2"),
90
84
  hasBorder: PropTypes.bool.description("Wheter if the card has border or not")
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/Card.tsx"],
4
- "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"],
5
- "mappings": "AAAA,YAAY,WAAW;ACoCD,SAwBV,UAxBU,KACd,YADc;AAnCtB,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;",
4
+ "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, { TooltipTextProvider } 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 hasBorder={hasBorder} cols={getCol(rightAddon)} data-testid=\"em-ds-card\">\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('Title of the card. requiered'),\n /**\n * Description of the card. not requiered\n */\n description: PropTypes.string.description('Description of the card. not requiered'),\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"],
5
+ "mappings": "AAAA,YAAY,WAAW;AC8BD,SAwBV,UAxBU,KACd,YADc;AA7BtB,SAAS,WAAW,gBAAgB;AACpC,SAAS,gBAAgB;AACzB,OAAO,0BAA0B,2BAA2B;AAC5D;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,IAAc;AAAA,IAAsB,MAAM,OAAO,UAAU;AAAA,IAAG,eAAY;AAAA,IACzE;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,YAAY,8BAA8B;AAAA,EAI7E,aAAa,UAAU,OAAO,YAAY,wCAAwC;AAAA,EAIlF,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;",
6
6
  "names": []
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/Group.tsx"],
4
- "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"],
5
- "mappings": "AAAA,YAAY,WAAW;ACyCjB,SACE,KADF;AAxCN,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;",
4
+ "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 }) => (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"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACwCjB,SACE,KADF;AAvCN,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,MAAO,gBAAgB,eAAe,MAAM,OAAO,QAAQ,WAAW;AAAA;AAGlG,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;",
6
6
  "names": []
7
7
  }
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/v2/components.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst CardContainer = styled(Grid)`\n align-items: center;\n justify-content: space-between;\n width: 100%;\n height: 56px;\n padding: 8px 16px;\n position: relative;\n border: ${({ theme, hasBorder }) =>\n hasBorder ? `1px solid ${theme.colors.neutral['100']}` : ''};\n &:before {\n content: '';\n border-bottom: 1px solid ${(props) => props.theme.colors.neutral['100']};\n position: absolute;\n margin: 0 auto;\n width: 90%;\n bottom: 0;\n }\n &:last-child::before {\n content: none;\n }\n`;\n\nconst LeftSection = styled.div`\n display: flex;\n align-items: center;\n`;\n\nconst LeftAddon = styled.div`\n height: fit-content;\n width: fit-content;\n margin-right: 16px;\n cursor: pointer;\n`;\n\nconst RightAddonSection = styled.div`\n display: flex;\n align-items: center;\n width: fit-content;\n`;\n\nconst RightAddon = styled.div`\n height: fit-content;\n width: fit-content;\n cursor: pointer;\n`;\n\nconst Separator = styled.div`\n width: 0px;\n height: 24px;\n border-right: 1px solid ${(props) => props.theme.colors.neutral['300']};\n margin: 0 8px;\n`;\n\nconst MainSection = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nconst Title = styled.h3`\n margin: 0;\n font-size: 16px;\n font-weight: ${(props) => props.theme.fontWeights.regular};\n color: ${(props) => props.theme.colors.neutral['800']};\n`;\n\nconst Description = styled.p`\n margin: 0;\n color: ${(props) => props.theme.colors.neutral['600']};\n`;\n\nexport {\n CardContainer,\n LeftSection,\n LeftAddon,\n RightAddonSection,\n RightAddon,\n Separator,\n MainSection,\n Title,\n Description,\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,MAAM,gBAAgB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAOrB,CAAC,EAAE,OAAO,UAAU,MAC5B,YAAY,aAAa,MAAM,OAAO,QAAQ,WAAW;AAAA;AAAA;AAAA,+BAG9B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWrE,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAK3B,MAAM,YAAY,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOzB,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAAA;AAAA;AAMjC,MAAM,aAAa,OAAO;AAAA;AAAA;AAAA;AAAA;AAM1B,MAAM,YAAY,OAAO;AAAA;AAAA;AAAA,4BAGG,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAIlE,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAK3B,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA,iBAGJ,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGjD,MAAM,cAAc,OAAO;AAAA;AAAA,WAEhB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst CardContainer = styled(Grid)`\n align-items: center;\n justify-content: space-between;\n width: 100%;\n height: 56px;\n padding: 8px 16px;\n position: relative;\n border: ${({ theme, hasBorder }) => (hasBorder ? `1px solid ${theme.colors.neutral['100']}` : '')};\n &:before {\n content: '';\n border-bottom: 1px solid ${(props) => props.theme.colors.neutral['100']};\n position: absolute;\n margin: 0 auto;\n width: 90%;\n bottom: 0;\n }\n &:last-child::before {\n content: none;\n }\n`;\n\nconst LeftSection = styled.div`\n display: flex;\n align-items: center;\n`;\n\nconst LeftAddon = styled.div`\n height: fit-content;\n width: fit-content;\n margin-right: 16px;\n cursor: pointer;\n`;\n\nconst RightAddonSection = styled.div`\n display: flex;\n align-items: center;\n width: fit-content;\n`;\n\nconst RightAddon = styled.div`\n height: fit-content;\n width: fit-content;\n cursor: pointer;\n`;\n\nconst Separator = styled.div`\n width: 0px;\n height: 24px;\n border-right: 1px solid ${(props) => props.theme.colors.neutral['300']};\n margin: 0 8px;\n`;\n\nconst MainSection = styled.div`\n display: flex;\n flex-direction: column;\n`;\n\nconst Title = styled.h3`\n margin: 0;\n font-size: 16px;\n font-weight: ${(props) => props.theme.fontWeights.regular};\n color: ${(props) => props.theme.colors.neutral['800']};\n`;\n\nconst Description = styled.p`\n margin: 0;\n color: ${(props) => props.theme.colors.neutral['600']};\n`;\n\nexport {\n CardContainer,\n LeftSection,\n LeftAddon,\n RightAddonSection,\n RightAddon,\n Separator,\n MainSection,\n Title,\n Description,\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,MAAM,gBAAgB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAOrB,CAAC,EAAE,OAAO,UAAU,MAAO,YAAY,aAAa,MAAM,OAAO,QAAQ,WAAW;AAAA;AAAA;AAAA,+BAGjE,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWrE,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAK3B,MAAM,YAAY,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOzB,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAAA;AAAA;AAMjC,MAAM,aAAa,OAAO;AAAA;AAAA;AAAA;AAAA;AAM1B,MAAM,YAAY,OAAO;AAAA;AAAA;AAAA,4BAGG,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAIlE,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAK3B,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA,iBAGJ,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGjD,MAAM,cAAc,OAAO;AAAA;AAAA,WAEhB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-card",
3
- "version": "3.12.0-next.0",
3
+ "version": "3.12.0-next.1",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Card",
6
6
  "files": [
@@ -71,16 +71,16 @@
71
71
  "indent": 4
72
72
  },
73
73
  "dependencies": {
74
- "@elliemae/ds-button": "3.12.0-next.0",
75
- "@elliemae/ds-classnames": "3.12.0-next.0",
76
- "@elliemae/ds-form": "3.12.0-next.0",
77
- "@elliemae/ds-grid": "3.12.0-next.0",
78
- "@elliemae/ds-header": "3.12.0-next.0",
79
- "@elliemae/ds-icons": "3.12.0-next.0",
80
- "@elliemae/ds-separator": "3.12.0-next.0",
81
- "@elliemae/ds-system": "3.12.0-next.0",
82
- "@elliemae/ds-truncated-tooltip-text": "3.12.0-next.0",
83
- "@elliemae/ds-utilities": "3.12.0-next.0"
74
+ "@elliemae/ds-button": "3.12.0-next.1",
75
+ "@elliemae/ds-classnames": "3.12.0-next.1",
76
+ "@elliemae/ds-form": "3.12.0-next.1",
77
+ "@elliemae/ds-grid": "3.12.0-next.1",
78
+ "@elliemae/ds-header": "3.12.0-next.1",
79
+ "@elliemae/ds-icons": "3.12.0-next.1",
80
+ "@elliemae/ds-separator": "3.12.0-next.1",
81
+ "@elliemae/ds-system": "3.12.0-next.1",
82
+ "@elliemae/ds-truncated-tooltip-text": "3.12.0-next.1",
83
+ "@elliemae/ds-utilities": "3.12.0-next.1"
84
84
  },
85
85
  "devDependencies": {
86
86
  "@testing-library/jest-dom": "~5.16.4",