@elliemae/ds-comments 3.21.0-next.1 → 3.21.0-next.2
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.
- package/dist/cjs/DSCommentCard.js +1 -1
- package/dist/cjs/DSCommentCard.js.map +2 -2
- package/dist/cjs/styled.js +16 -16
- package/dist/cjs/styled.js.map +2 -2
- package/dist/esm/DSCommentCard.js +1 -1
- package/dist/esm/DSCommentCard.js.map +2 -2
- package/dist/esm/styled.js +16 -16
- package/dist/esm/styled.js.map +2 -2
- package/package.json +7 -7
|
@@ -68,7 +68,6 @@ const DSCommentCard = (props) => {
|
|
|
68
68
|
{
|
|
69
69
|
className: `em-ds-comments__comment-card-wrapper em-ds-comments__comment-card-wrapper--default${borderBottom ? "em-ds-comments__comment-card-wrapper--borderBottom" : ""}`,
|
|
70
70
|
borderBot: borderBottom,
|
|
71
|
-
tabIndex: 0,
|
|
72
71
|
role: "listitem",
|
|
73
72
|
...containerProps,
|
|
74
73
|
...xstyledProps,
|
|
@@ -87,6 +86,7 @@ const DSCommentCard = (props) => {
|
|
|
87
86
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
88
87
|
import_styled.CommentCardLeft,
|
|
89
88
|
{
|
|
89
|
+
tabIndex: 0,
|
|
90
90
|
className: "em-ds-comments__comment-card-left",
|
|
91
91
|
getOwnerProps,
|
|
92
92
|
getOwnerPropsArguments,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DSCommentCard.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable complexity */\nimport React from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { DSReadMore } from '@elliemae/ds-read-more';\nimport {\n CommentCardWrapper,\n CommentCardHeader,\n CommentCardContent,\n CommentCardName,\n CommentCardData,\n CommentCardMenu,\n CommentCardLeft,\n} from './styled.js';\nimport { DSCommentCardName } from './config/DSCommentCardDefinitions.js';\nimport { useCommentCard } from './config/useCommentCard.js';\nimport { DSCommentCardPropTypesSchema, type DSCommentCardT } from './react-desc-prop-types.js';\nimport { DeprecatedMenu } from './DeprecatedMenu.js';\n\nexport const DSCommentCard: React.ComponentType<DSCommentCardT.Props> = (props) => {\n const {\n propsWithDefault: {\n containerProps,\n name,\n type,\n content,\n style,\n borderBottom,\n maxLines,\n options,\n selection,\n customDropdownMenuProps,\n Menu,\n menuProps,\n },\n xstyledProps,\n getOwnerProps,\n getOwnerPropsArguments,\n displayDate,\n displayTime,\n } = useCommentCard(props);\n\n return (\n <CommentCardWrapper\n className={`em-ds-comments__comment-card-wrapper em-ds-comments__comment-card-wrapper--default${\n borderBottom ? 'em-ds-comments__comment-card-wrapper--borderBottom' : ''\n }`}\n borderBot={borderBottom}\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoEb;AAlEV,8BAAyB;AACzB,0BAA2B;AAC3B,oBAQO;AACP,sCAAkC;AAClC,4BAA+B;AAC/B,mCAAkE;AAClE,4BAA+B;AAExB,MAAM,gBAA2D,CAAC,UAAU;AACjF,QAAM;AAAA,IACJ,kBAAkB;AAAA,MAChB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,sCAAe,KAAK;AAExB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,qFACT,eAAe,uDAAuD;AAAA,MAExE,WAAW;AAAA,MACX,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable complexity */\nimport React from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { DSReadMore } from '@elliemae/ds-read-more';\nimport {\n CommentCardWrapper,\n CommentCardHeader,\n CommentCardContent,\n CommentCardName,\n CommentCardData,\n CommentCardMenu,\n CommentCardLeft,\n} from './styled.js';\nimport { DSCommentCardName } from './config/DSCommentCardDefinitions.js';\nimport { useCommentCard } from './config/useCommentCard.js';\nimport { DSCommentCardPropTypesSchema, type DSCommentCardT } from './react-desc-prop-types.js';\nimport { DeprecatedMenu } from './DeprecatedMenu.js';\n\nexport const DSCommentCard: React.ComponentType<DSCommentCardT.Props> = (props) => {\n const {\n propsWithDefault: {\n containerProps,\n name,\n type,\n content,\n style,\n borderBottom,\n maxLines,\n options,\n selection,\n customDropdownMenuProps,\n Menu,\n menuProps,\n },\n xstyledProps,\n getOwnerProps,\n getOwnerPropsArguments,\n displayDate,\n displayTime,\n } = useCommentCard(props);\n\n return (\n <CommentCardWrapper\n className={`em-ds-comments__comment-card-wrapper em-ds-comments__comment-card-wrapper--default${\n borderBottom ? 'em-ds-comments__comment-card-wrapper--borderBottom' : ''\n }`}\n borderBot={borderBottom}\n role=\"listitem\"\n {...containerProps}\n {...xstyledProps}\n style={{ ...style, ...(containerProps.style || {}) }}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <CommentCardHeader\n className={`em-ds-comments__comment-card-header em-ds-comments__comment-card-header--default${\n borderBottom ? 'em-ds-comments__comment-card-header--borderBottom' : ''\n }`}\n borderBottom={borderBottom}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <CommentCardLeft\n tabIndex={0}\n className=\"em-ds-comments__comment-card-left\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <CommentCardName\n className=\"em-ds-comments__comment-card-name\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {name}\n </CommentCardName>\n <CommentCardData\n className=\"em-ds-comments__comment-card-data\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {displayDate}\n {displayTime && (\n <>\n <span>\u2022</span>\n {displayTime}\n </>\n )}\n {type && (\n <>\n <span>\u2022</span>\n {type}\n </>\n )}\n </CommentCardData>\n </CommentCardLeft>\n {options && options.length > 0 && (\n <DeprecatedMenu\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n options={options}\n selection={selection}\n customDropdownMenuProps={customDropdownMenuProps}\n />\n )}\n {Menu && (\n <CommentCardMenu getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n <Menu {...menuProps} />\n </CommentCardMenu>\n )}\n </CommentCardHeader>\n <CommentCardContent\n className=\"em-ds-comments__comment-card-content\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <DSReadMore lines={maxLines} content={`${content} `} more=\"MORE\" less=\"LESS\" ellipsis=\"... \" />\n </CommentCardContent>\n </CommentCardWrapper>\n );\n};\n\nDSCommentCard.displayName = DSCommentCardName;\nexport const DSCommentCardWithSchema = describe(DSCommentCard);\nDSCommentCardWithSchema.propTypes = DSCommentCardPropTypesSchema;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoEb;AAlEV,8BAAyB;AACzB,0BAA2B;AAC3B,oBAQO;AACP,sCAAkC;AAClC,4BAA+B;AAC/B,mCAAkE;AAClE,4BAA+B;AAExB,MAAM,gBAA2D,CAAC,UAAU;AACjF,QAAM;AAAA,IACJ,kBAAkB;AAAA,MAChB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,sCAAe,KAAK;AAExB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,qFACT,eAAe,uDAAuD;AAAA,MAExE,WAAW;AAAA,MACX,MAAK;AAAA,MACJ,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,OAAO,EAAE,GAAG,OAAO,GAAI,eAAe,SAAS,CAAC,EAAG;AAAA,MACnD;AAAA,MACA;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,mFACT,eAAe,sDAAsD;AAAA,YAEvE;AAAA,YACA;AAAA,YACA;AAAA,YAEA;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,UAAU;AAAA,kBACV,WAAU;AAAA,kBACV;AAAA,kBACA;AAAA,kBAEA;AAAA;AAAA,sBAAC;AAAA;AAAA,wBACC,WAAU;AAAA,wBACV;AAAA,wBACA;AAAA,wBAEC;AAAA;AAAA,oBACH;AAAA,oBACA;AAAA,sBAAC;AAAA;AAAA,wBACC,WAAU;AAAA,wBACV;AAAA,wBACA;AAAA,wBAEC;AAAA;AAAA,0BACA,eACC,4EACE;AAAA,wEAAC,UAAK,oBAAC;AAAA,4BACN;AAAA,6BACH;AAAA,0BAED,QACC,4EACE;AAAA,wEAAC,UAAK,oBAAC;AAAA,4BACN;AAAA,6BACH;AAAA;AAAA;AAAA,oBAEJ;AAAA;AAAA;AAAA,cACF;AAAA,cACC,WAAW,QAAQ,SAAS,KAC3B;AAAA,gBAAC;AAAA;AAAA,kBACC;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA;AAAA,cACF;AAAA,cAED,QACC,4CAAC,iCAAgB,eAA8B,wBAC7C,sDAAC,QAAM,GAAG,WAAW,GACvB;AAAA;AAAA;AAAA,QAEJ;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV;AAAA,YACA;AAAA,YAEA,sDAAC,kCAAW,OAAO,UAAU,SAAS,GAAG,YAAY,MAAK,QAAO,MAAK,QAAO,UAAS,QAAO;AAAA;AAAA,QAC/F;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,cAAc,cAAc;AACrB,MAAM,8BAA0B,kCAAS,aAAa;AAC7D,wBAAwB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/styled.js
CHANGED
|
@@ -47,22 +47,7 @@ const CommentCardWrapper = (0, import_ds_system.styled)("div", { name: import_DS
|
|
|
47
47
|
margin-right: 1.84615rem;
|
|
48
48
|
width: auto;
|
|
49
49
|
border-radius: 2px;
|
|
50
|
-
|
|
51
|
-
outline: none;
|
|
52
|
-
position: relative;
|
|
53
|
-
|
|
54
|
-
&:after {
|
|
55
|
-
content: '';
|
|
56
|
-
position: absolute;
|
|
57
|
-
top: 0;
|
|
58
|
-
left: 0;
|
|
59
|
-
width: 100%;
|
|
60
|
-
height: 100%;
|
|
61
|
-
pointer-events: none;
|
|
62
|
-
border-radius: 2px;
|
|
63
|
-
border: 2px solid brand-700;
|
|
64
|
-
}
|
|
65
|
-
}
|
|
50
|
+
position: relative;
|
|
66
51
|
${({ borderBot, theme }) => {
|
|
67
52
|
if (borderBot) {
|
|
68
53
|
return `
|
|
@@ -103,6 +88,21 @@ const CommentCardContent = (0, import_ds_system.styled)("div", { name: import_DS
|
|
|
103
88
|
`;
|
|
104
89
|
const CommentCardLeft = (0, import_ds_system.styled)("div", { name: import_DSCommentCardDefinitions.DSCommentCardName, slot: import_DSCommentCardDefinitions.DSCommentCardSlots.LEFT })`
|
|
105
90
|
flex: 1;
|
|
91
|
+
&:focus {
|
|
92
|
+
outline: none;
|
|
93
|
+
|
|
94
|
+
&:after {
|
|
95
|
+
content: '';
|
|
96
|
+
position: absolute;
|
|
97
|
+
top: 0;
|
|
98
|
+
left: 0;
|
|
99
|
+
width: 100%;
|
|
100
|
+
height: 100%;
|
|
101
|
+
pointer-events: none;
|
|
102
|
+
border-radius: 2px;
|
|
103
|
+
border: 2px solid brand-700;
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
106
|
`;
|
|
107
107
|
const CommentCardName = (0, import_ds_system.styled)("div", { name: import_DSCommentCardDefinitions.DSCommentCardName, slot: import_DSCommentCardDefinitions.DSCommentCardSlots.NAME })`
|
|
108
108
|
font-size: 1.0769rem;
|
package/dist/cjs/styled.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styled.ts", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { styled, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSCommentCardName, DSCommentCardSlots } from './config/DSCommentCardDefinitions.js';\n\nexport const CommentCardWrapper = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.ROOT })<{\n borderBot: boolean;\n}>`\n min-height: 5.80923rem;\n min-width: 18.80615rem;\n margin-left: 1.84615rem;\n margin-right: 1.84615rem;\n width: auto;\n border-radius: 2px;\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAA2C;AAC3C,sCAAsD;AAE/C,MAAM,yBAAqB,yBAAO,OAAO,EAAE,MAAM,mDAAmB,MAAM,mDAAmB,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA
|
|
4
|
+
"sourcesContent": ["import { styled, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSCommentCardName, DSCommentCardSlots } from './config/DSCommentCardDefinitions.js';\n\nexport const CommentCardWrapper = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.ROOT })<{\n borderBot: boolean;\n}>`\n min-height: 5.80923rem;\n min-width: 18.80615rem;\n margin-left: 1.84615rem;\n margin-right: 1.84615rem;\n width: auto;\n border-radius: 2px;\n position: relative;\n ${({ borderBot, theme }) => {\n if (borderBot) {\n return `\n border-top: solid 0 ${theme.colors.neutral[100]};\n border-bottom: solid 1px ${theme.colors.neutral[100]};\n margin-bottom: 1.23077rem;\n `;\n }\n return ``;\n }}\n ${xStyledCommonProps}\n`;\n\nexport const CommentCardHeader = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.HEADER })<{\n borderBottom: boolean;\n}>`\n border-top: solid 1px neutral-100;\n display: flex;\n padding: 0.30769rem 0.30769rem 0.30769rem 0.61538rem;\n\n ${({ borderBottom, theme }) => {\n if (borderBottom) {\n return `\n border-top: solid 0 ${theme.colors.neutral[100]};\n `;\n }\n return ``;\n }}\n`;\n\nexport const CommentCardContent = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.CONTENT })`\n padding: 0 0.61538rem 0.61538rem 0.61538rem;\n font-size: 1rem;\n line-height: ${() => '1.3'};\n color: neutral-500;\n button {\n display: inline-block;\n height: auto;\n padding-left: 0.61538rem;\n padding-right: 0.61538rem;\n }\n`;\n\nexport const CommentCardLeft = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.LEFT })`\n flex: 1;\n &:focus {\n outline: none;\n\n &:after {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n border-radius: 2px;\n border: 2px solid brand-700;\n }\n }\n`;\n\nexport const CommentCardName = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.NAME })`\n font-size: 1.0769rem;\n font-weight: 600;\n color: neutral-700;\n padding-bottom: 0.15385rem;\n`;\n\nexport const CommentCardData = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.DATA })`\n font-size: 0.923rem;\n font-weight: 300;\n color: neutral-500;\n span {\n padding: 0 0.30769rem;\n }\n`;\n\nexport const CommentCardMenu = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.MENU })``;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAA2C;AAC3C,sCAAsD;AAE/C,MAAM,yBAAqB,yBAAO,OAAO,EAAE,MAAM,mDAAmB,MAAM,mDAAmB,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUtG,CAAC,EAAE,WAAW,MAAM,MAAM;AAC1B,MAAI,WAAW;AACb,WAAO;AAAA,8BACiB,MAAM,OAAO,QAAQ,GAAG;AAAA,mCACnB,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA,EAGvD;AACA,SAAO;AACT;AAAA,IACE;AAAA;AAGG,MAAM,wBAAoB,yBAAO,OAAO,EAAE,MAAM,mDAAmB,MAAM,mDAAmB,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,IAOvG,CAAC,EAAE,cAAc,MAAM,MAAM;AAC7B,MAAI,cAAc;AAChB,WAAO;AAAA,8BACiB,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA,EAElD;AACA,SAAO;AACT;AAAA;AAGK,MAAM,yBAAqB,yBAAO,OAAO,EAAE,MAAM,mDAAmB,MAAM,mDAAmB,QAAQ,CAAC;AAAA;AAAA;AAAA,iBAG5F,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUhB,MAAM,sBAAkB,yBAAO,OAAO,EAAE,MAAM,mDAAmB,MAAM,mDAAmB,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAmBhG,MAAM,sBAAkB,yBAAO,OAAO,EAAE,MAAM,mDAAmB,MAAM,mDAAmB,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOhG,MAAM,sBAAkB,yBAAO,OAAO,EAAE,MAAM,mDAAmB,MAAM,mDAAmB,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAShG,MAAM,sBAAkB,yBAAO,OAAO,EAAE,MAAM,mDAAmB,MAAM,mDAAmB,KAAK,CAAC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -42,7 +42,6 @@ const DSCommentCard = (props) => {
|
|
|
42
42
|
{
|
|
43
43
|
className: `em-ds-comments__comment-card-wrapper em-ds-comments__comment-card-wrapper--default${borderBottom ? "em-ds-comments__comment-card-wrapper--borderBottom" : ""}`,
|
|
44
44
|
borderBot: borderBottom,
|
|
45
|
-
tabIndex: 0,
|
|
46
45
|
role: "listitem",
|
|
47
46
|
...containerProps,
|
|
48
47
|
...xstyledProps,
|
|
@@ -61,6 +60,7 @@ const DSCommentCard = (props) => {
|
|
|
61
60
|
/* @__PURE__ */ jsxs(
|
|
62
61
|
CommentCardLeft,
|
|
63
62
|
{
|
|
63
|
+
tabIndex: 0,
|
|
64
64
|
className: "em-ds-comments__comment-card-left",
|
|
65
65
|
getOwnerProps,
|
|
66
66
|
getOwnerPropsArguments,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSCommentCard.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\nimport React from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { DSReadMore } from '@elliemae/ds-read-more';\nimport {\n CommentCardWrapper,\n CommentCardHeader,\n CommentCardContent,\n CommentCardName,\n CommentCardData,\n CommentCardMenu,\n CommentCardLeft,\n} from './styled.js';\nimport { DSCommentCardName } from './config/DSCommentCardDefinitions.js';\nimport { useCommentCard } from './config/useCommentCard.js';\nimport { DSCommentCardPropTypesSchema, type DSCommentCardT } from './react-desc-prop-types.js';\nimport { DeprecatedMenu } from './DeprecatedMenu.js';\n\nexport const DSCommentCard: React.ComponentType<DSCommentCardT.Props> = (props) => {\n const {\n propsWithDefault: {\n containerProps,\n name,\n type,\n content,\n style,\n borderBottom,\n maxLines,\n options,\n selection,\n customDropdownMenuProps,\n Menu,\n menuProps,\n },\n xstyledProps,\n getOwnerProps,\n getOwnerPropsArguments,\n displayDate,\n displayTime,\n } = useCommentCard(props);\n\n return (\n <CommentCardWrapper\n className={`em-ds-comments__comment-card-wrapper em-ds-comments__comment-card-wrapper--default${\n borderBottom ? 'em-ds-comments__comment-card-wrapper--borderBottom' : ''\n }`}\n borderBot={borderBottom}\n
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACoEb,SAcI,UAdJ,KAcI,YAdJ;AAlEV,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAC3B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,yBAAyB;AAClC,SAAS,sBAAsB;AAC/B,SAAS,oCAAyD;AAClE,SAAS,sBAAsB;AAExB,MAAM,gBAA2D,CAAC,UAAU;AACjF,QAAM;AAAA,IACJ,kBAAkB;AAAA,MAChB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,eAAe,KAAK;AAExB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,qFACT,eAAe,uDAAuD;AAAA,MAExE,WAAW;AAAA,MACX,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\nimport React from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { DSReadMore } from '@elliemae/ds-read-more';\nimport {\n CommentCardWrapper,\n CommentCardHeader,\n CommentCardContent,\n CommentCardName,\n CommentCardData,\n CommentCardMenu,\n CommentCardLeft,\n} from './styled.js';\nimport { DSCommentCardName } from './config/DSCommentCardDefinitions.js';\nimport { useCommentCard } from './config/useCommentCard.js';\nimport { DSCommentCardPropTypesSchema, type DSCommentCardT } from './react-desc-prop-types.js';\nimport { DeprecatedMenu } from './DeprecatedMenu.js';\n\nexport const DSCommentCard: React.ComponentType<DSCommentCardT.Props> = (props) => {\n const {\n propsWithDefault: {\n containerProps,\n name,\n type,\n content,\n style,\n borderBottom,\n maxLines,\n options,\n selection,\n customDropdownMenuProps,\n Menu,\n menuProps,\n },\n xstyledProps,\n getOwnerProps,\n getOwnerPropsArguments,\n displayDate,\n displayTime,\n } = useCommentCard(props);\n\n return (\n <CommentCardWrapper\n className={`em-ds-comments__comment-card-wrapper em-ds-comments__comment-card-wrapper--default${\n borderBottom ? 'em-ds-comments__comment-card-wrapper--borderBottom' : ''\n }`}\n borderBot={borderBottom}\n role=\"listitem\"\n {...containerProps}\n {...xstyledProps}\n style={{ ...style, ...(containerProps.style || {}) }}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <CommentCardHeader\n className={`em-ds-comments__comment-card-header em-ds-comments__comment-card-header--default${\n borderBottom ? 'em-ds-comments__comment-card-header--borderBottom' : ''\n }`}\n borderBottom={borderBottom}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <CommentCardLeft\n tabIndex={0}\n className=\"em-ds-comments__comment-card-left\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <CommentCardName\n className=\"em-ds-comments__comment-card-name\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {name}\n </CommentCardName>\n <CommentCardData\n className=\"em-ds-comments__comment-card-data\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {displayDate}\n {displayTime && (\n <>\n <span>\u2022</span>\n {displayTime}\n </>\n )}\n {type && (\n <>\n <span>\u2022</span>\n {type}\n </>\n )}\n </CommentCardData>\n </CommentCardLeft>\n {options && options.length > 0 && (\n <DeprecatedMenu\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n options={options}\n selection={selection}\n customDropdownMenuProps={customDropdownMenuProps}\n />\n )}\n {Menu && (\n <CommentCardMenu getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n <Menu {...menuProps} />\n </CommentCardMenu>\n )}\n </CommentCardHeader>\n <CommentCardContent\n className=\"em-ds-comments__comment-card-content\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <DSReadMore lines={maxLines} content={`${content} `} more=\"MORE\" less=\"LESS\" ellipsis=\"... \" />\n </CommentCardContent>\n </CommentCardWrapper>\n );\n};\n\nDSCommentCard.displayName = DSCommentCardName;\nexport const DSCommentCardWithSchema = describe(DSCommentCard);\nDSCommentCardWithSchema.propTypes = DSCommentCardPropTypesSchema;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACoEb,SAcI,UAdJ,KAcI,YAdJ;AAlEV,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAC3B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,yBAAyB;AAClC,SAAS,sBAAsB;AAC/B,SAAS,oCAAyD;AAClE,SAAS,sBAAsB;AAExB,MAAM,gBAA2D,CAAC,UAAU;AACjF,QAAM;AAAA,IACJ,kBAAkB;AAAA,MAChB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,eAAe,KAAK;AAExB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,qFACT,eAAe,uDAAuD;AAAA,MAExE,WAAW;AAAA,MACX,MAAK;AAAA,MACJ,GAAG;AAAA,MACH,GAAG;AAAA,MACJ,OAAO,EAAE,GAAG,OAAO,GAAI,eAAe,SAAS,CAAC,EAAG;AAAA,MACnD;AAAA,MACA;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,mFACT,eAAe,sDAAsD;AAAA,YAEvE;AAAA,YACA;AAAA,YACA;AAAA,YAEA;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,UAAU;AAAA,kBACV,WAAU;AAAA,kBACV;AAAA,kBACA;AAAA,kBAEA;AAAA;AAAA,sBAAC;AAAA;AAAA,wBACC,WAAU;AAAA,wBACV;AAAA,wBACA;AAAA,wBAEC;AAAA;AAAA,oBACH;AAAA,oBACA;AAAA,sBAAC;AAAA;AAAA,wBACC,WAAU;AAAA,wBACV;AAAA,wBACA;AAAA,wBAEC;AAAA;AAAA,0BACA,eACC,iCACE;AAAA,gDAAC,UAAK,oBAAC;AAAA,4BACN;AAAA,6BACH;AAAA,0BAED,QACC,iCACE;AAAA,gDAAC,UAAK,oBAAC;AAAA,4BACN;AAAA,6BACH;AAAA;AAAA;AAAA,oBAEJ;AAAA;AAAA;AAAA,cACF;AAAA,cACC,WAAW,QAAQ,SAAS,KAC3B;AAAA,gBAAC;AAAA;AAAA,kBACC;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA;AAAA;AAAA,cACF;AAAA,cAED,QACC,oBAAC,mBAAgB,eAA8B,wBAC7C,8BAAC,QAAM,GAAG,WAAW,GACvB;AAAA;AAAA;AAAA,QAEJ;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV;AAAA,YACA;AAAA,YAEA,8BAAC,cAAW,OAAO,UAAU,SAAS,GAAG,YAAY,MAAK,QAAO,MAAK,QAAO,UAAS,QAAO;AAAA;AAAA,QAC/F;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,cAAc,cAAc;AACrB,MAAM,0BAA0B,SAAS,aAAa;AAC7D,wBAAwB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/styled.js
CHANGED
|
@@ -8,22 +8,7 @@ const CommentCardWrapper = styled("div", { name: DSCommentCardName, slot: DSComm
|
|
|
8
8
|
margin-right: 1.84615rem;
|
|
9
9
|
width: auto;
|
|
10
10
|
border-radius: 2px;
|
|
11
|
-
|
|
12
|
-
outline: none;
|
|
13
|
-
position: relative;
|
|
14
|
-
|
|
15
|
-
&:after {
|
|
16
|
-
content: '';
|
|
17
|
-
position: absolute;
|
|
18
|
-
top: 0;
|
|
19
|
-
left: 0;
|
|
20
|
-
width: 100%;
|
|
21
|
-
height: 100%;
|
|
22
|
-
pointer-events: none;
|
|
23
|
-
border-radius: 2px;
|
|
24
|
-
border: 2px solid brand-700;
|
|
25
|
-
}
|
|
26
|
-
}
|
|
11
|
+
position: relative;
|
|
27
12
|
${({ borderBot, theme }) => {
|
|
28
13
|
if (borderBot) {
|
|
29
14
|
return `
|
|
@@ -64,6 +49,21 @@ const CommentCardContent = styled("div", { name: DSCommentCardName, slot: DSComm
|
|
|
64
49
|
`;
|
|
65
50
|
const CommentCardLeft = styled("div", { name: DSCommentCardName, slot: DSCommentCardSlots.LEFT })`
|
|
66
51
|
flex: 1;
|
|
52
|
+
&:focus {
|
|
53
|
+
outline: none;
|
|
54
|
+
|
|
55
|
+
&:after {
|
|
56
|
+
content: '';
|
|
57
|
+
position: absolute;
|
|
58
|
+
top: 0;
|
|
59
|
+
left: 0;
|
|
60
|
+
width: 100%;
|
|
61
|
+
height: 100%;
|
|
62
|
+
pointer-events: none;
|
|
63
|
+
border-radius: 2px;
|
|
64
|
+
border: 2px solid brand-700;
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
67
|
`;
|
|
68
68
|
const CommentCardName = styled("div", { name: DSCommentCardName, slot: DSCommentCardSlots.NAME })`
|
|
69
69
|
font-size: 1.0769rem;
|
package/dist/esm/styled.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/styled.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSCommentCardName, DSCommentCardSlots } from './config/DSCommentCardDefinitions.js';\n\nexport const CommentCardWrapper = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.ROOT })<{\n borderBot: boolean;\n}>`\n min-height: 5.80923rem;\n min-width: 18.80615rem;\n margin-left: 1.84615rem;\n margin-right: 1.84615rem;\n width: auto;\n border-radius: 2px;\n
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,QAAQ,0BAA0B;AAC3C,SAAS,mBAAmB,0BAA0B;AAE/C,MAAM,qBAAqB,OAAO,OAAO,EAAE,MAAM,mBAAmB,MAAM,mBAAmB,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSCommentCardName, DSCommentCardSlots } from './config/DSCommentCardDefinitions.js';\n\nexport const CommentCardWrapper = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.ROOT })<{\n borderBot: boolean;\n}>`\n min-height: 5.80923rem;\n min-width: 18.80615rem;\n margin-left: 1.84615rem;\n margin-right: 1.84615rem;\n width: auto;\n border-radius: 2px;\n position: relative;\n ${({ borderBot, theme }) => {\n if (borderBot) {\n return `\n border-top: solid 0 ${theme.colors.neutral[100]};\n border-bottom: solid 1px ${theme.colors.neutral[100]};\n margin-bottom: 1.23077rem;\n `;\n }\n return ``;\n }}\n ${xStyledCommonProps}\n`;\n\nexport const CommentCardHeader = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.HEADER })<{\n borderBottom: boolean;\n}>`\n border-top: solid 1px neutral-100;\n display: flex;\n padding: 0.30769rem 0.30769rem 0.30769rem 0.61538rem;\n\n ${({ borderBottom, theme }) => {\n if (borderBottom) {\n return `\n border-top: solid 0 ${theme.colors.neutral[100]};\n `;\n }\n return ``;\n }}\n`;\n\nexport const CommentCardContent = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.CONTENT })`\n padding: 0 0.61538rem 0.61538rem 0.61538rem;\n font-size: 1rem;\n line-height: ${() => '1.3'};\n color: neutral-500;\n button {\n display: inline-block;\n height: auto;\n padding-left: 0.61538rem;\n padding-right: 0.61538rem;\n }\n`;\n\nexport const CommentCardLeft = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.LEFT })`\n flex: 1;\n &:focus {\n outline: none;\n\n &:after {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n border-radius: 2px;\n border: 2px solid brand-700;\n }\n }\n`;\n\nexport const CommentCardName = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.NAME })`\n font-size: 1.0769rem;\n font-weight: 600;\n color: neutral-700;\n padding-bottom: 0.15385rem;\n`;\n\nexport const CommentCardData = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.DATA })`\n font-size: 0.923rem;\n font-weight: 300;\n color: neutral-500;\n span {\n padding: 0 0.30769rem;\n }\n`;\n\nexport const CommentCardMenu = styled('div', { name: DSCommentCardName, slot: DSCommentCardSlots.MENU })``;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,QAAQ,0BAA0B;AAC3C,SAAS,mBAAmB,0BAA0B;AAE/C,MAAM,qBAAqB,OAAO,OAAO,EAAE,MAAM,mBAAmB,MAAM,mBAAmB,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUtG,CAAC,EAAE,WAAW,MAAM,MAAM;AAC1B,MAAI,WAAW;AACb,WAAO;AAAA,8BACiB,MAAM,OAAO,QAAQ,GAAG;AAAA,mCACnB,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA,EAGvD;AACA,SAAO;AACT;AAAA,IACE;AAAA;AAGG,MAAM,oBAAoB,OAAO,OAAO,EAAE,MAAM,mBAAmB,MAAM,mBAAmB,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,IAOvG,CAAC,EAAE,cAAc,MAAM,MAAM;AAC7B,MAAI,cAAc;AAChB,WAAO;AAAA,8BACiB,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA,EAElD;AACA,SAAO;AACT;AAAA;AAGK,MAAM,qBAAqB,OAAO,OAAO,EAAE,MAAM,mBAAmB,MAAM,mBAAmB,QAAQ,CAAC;AAAA;AAAA;AAAA,iBAG5F,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUhB,MAAM,kBAAkB,OAAO,OAAO,EAAE,MAAM,mBAAmB,MAAM,mBAAmB,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAmBhG,MAAM,kBAAkB,OAAO,OAAO,EAAE,MAAM,mBAAmB,MAAM,mBAAmB,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOhG,MAAM,kBAAkB,OAAO,OAAO,EAAE,MAAM,mBAAmB,MAAM,mBAAmB,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAShG,MAAM,kBAAkB,OAAO,OAAO,EAAE,MAAM,mBAAmB,MAAM,mBAAmB,KAAK,CAAC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-comments",
|
|
3
|
-
"version": "3.21.0-next.
|
|
3
|
+
"version": "3.21.0-next.2",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Comments",
|
|
6
6
|
"files": [
|
|
@@ -52,12 +52,12 @@
|
|
|
52
52
|
},
|
|
53
53
|
"dependencies": {
|
|
54
54
|
"moment": "~2.29.4",
|
|
55
|
-
"@elliemae/ds-button-v2": "3.21.0-next.
|
|
56
|
-
"@elliemae/ds-dropdownmenu": "3.21.0-next.
|
|
57
|
-
"@elliemae/ds-icons": "3.21.0-next.
|
|
58
|
-
"@elliemae/ds-props-helpers": "3.21.0-next.
|
|
59
|
-
"@elliemae/ds-read-more": "3.21.0-next.
|
|
60
|
-
"@elliemae/ds-system": "3.21.0-next.
|
|
55
|
+
"@elliemae/ds-button-v2": "3.21.0-next.2",
|
|
56
|
+
"@elliemae/ds-dropdownmenu": "3.21.0-next.2",
|
|
57
|
+
"@elliemae/ds-icons": "3.21.0-next.2",
|
|
58
|
+
"@elliemae/ds-props-helpers": "3.21.0-next.2",
|
|
59
|
+
"@elliemae/ds-read-more": "3.21.0-next.2",
|
|
60
|
+
"@elliemae/ds-system": "3.21.0-next.2"
|
|
61
61
|
},
|
|
62
62
|
"devDependencies": {
|
|
63
63
|
"styled-components": "~5.3.9"
|