@pega/cosmos-react-social 3.0.0-dev.14.0 → 3.0.0-dev.15.0
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/lib/components/Email/Email.d.ts.map +1 -1
- package/lib/components/Email/Email.js +32 -18
- package/lib/components/Email/Email.js.map +1 -1
- package/lib/components/Email/Email.styles.d.ts +12 -0
- package/lib/components/Email/Email.styles.d.ts.map +1 -1
- package/lib/components/Email/Email.styles.js +55 -0
- package/lib/components/Email/Email.styles.js.map +1 -1
- package/lib/components/Email/Email.types.d.ts +71 -28
- package/lib/components/Email/Email.types.d.ts.map +1 -1
- package/lib/components/Email/Email.types.js.map +1 -1
- package/lib/components/Email/EmailComposer.d.ts.map +1 -1
- package/lib/components/Email/EmailComposer.js +60 -103
- package/lib/components/Email/EmailComposer.js.map +1 -1
- package/lib/components/Email/EmailManager.d.ts +6 -0
- package/lib/components/Email/EmailManager.d.ts.map +1 -0
- package/lib/components/Email/EmailManager.js +36 -0
- package/lib/components/Email/EmailManager.js.map +1 -0
- package/lib/components/Email/EmailSelector.d.ts +3 -1
- package/lib/components/Email/EmailSelector.d.ts.map +1 -1
- package/lib/components/Email/EmailSelector.js +5 -10
- package/lib/components/Email/EmailSelector.js.map +1 -1
- package/lib/components/Email/EmailShell.d.ts.map +1 -1
- package/lib/components/Email/EmailShell.js +4 -1
- package/lib/components/Email/EmailShell.js.map +1 -1
- package/lib/components/Email/EmailSummaryList.d.ts.map +1 -1
- package/lib/components/Email/EmailSummaryList.js +8 -8
- package/lib/components/Email/EmailSummaryList.js.map +1 -1
- package/lib/components/Email/EntityList.d.ts.map +1 -1
- package/lib/components/Email/EntityList.js +44 -5
- package/lib/components/Email/EntityList.js.map +1 -1
- package/lib/components/Email/index.d.ts +2 -1
- package/lib/components/Email/index.d.ts.map +1 -1
- package/lib/components/Email/index.js +1 -0
- package/lib/components/Email/index.js.map +1 -1
- package/lib/components/Feed/Feed.context.d.ts +9 -1
- package/lib/components/Feed/Feed.context.d.ts.map +1 -1
- package/lib/components/Feed/Feed.context.js.map +1 -1
- package/lib/components/Feed/Feed.d.ts +3 -1
- package/lib/components/Feed/Feed.d.ts.map +1 -1
- package/lib/components/Feed/Feed.js +2 -1
- package/lib/components/Feed/Feed.js.map +1 -1
- package/lib/components/Feed/FeedRichText.d.ts.map +1 -1
- package/lib/components/Feed/FeedRichText.js +18 -10
- package/lib/components/Feed/FeedRichText.js.map +1 -1
- package/lib/components/MentionButton/MentionButton.d.ts +2 -0
- package/lib/components/MentionButton/MentionButton.d.ts.map +1 -1
- package/lib/components/MentionButton/MentionButton.js +21 -5
- package/lib/components/MentionButton/MentionButton.js.map +1 -1
- package/package.json +4 -4
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef, isValidElement, useContext, useRef, useState } from 'react';
|
|
3
3
|
import styled from 'styled-components';
|
|
4
|
-
import { Button, Popover, useConsolidatedRef, useOuterEvent } from '@pega/cosmos-react-core';
|
|
4
|
+
import { Button, Link, Popover, useConsolidatedRef, useOuterEvent } from '@pega/cosmos-react-core';
|
|
5
5
|
import { FeedContext } from '../Feed/Feed.context';
|
|
6
6
|
const StyledButton = styled(Button) `
|
|
7
7
|
&:enabled:focus,
|
|
@@ -10,8 +10,15 @@ const StyledButton = styled(Button) `
|
|
|
10
10
|
text-decoration: underline;
|
|
11
11
|
}
|
|
12
12
|
`;
|
|
13
|
-
const
|
|
14
|
-
|
|
13
|
+
const StyledLink = styled(Link) `
|
|
14
|
+
&:enabled:focus,
|
|
15
|
+
&:not([disabled]):focus {
|
|
16
|
+
box-shadow: none;
|
|
17
|
+
text-decoration: underline;
|
|
18
|
+
}
|
|
19
|
+
`;
|
|
20
|
+
const MentionButton = forwardRef(({ children, id: idProp = '', text: textProp = '', type: typeProp = '', component: componentProp = 'button', ...restProps }, ref) => {
|
|
21
|
+
const { onMentionClick, onMentionPreview } = useContext(FeedContext);
|
|
15
22
|
const [showPopover, setShowPopover] = useState(false);
|
|
16
23
|
const [mentionContent, setMentionContent] = useState();
|
|
17
24
|
const mentionRef = useConsolidatedRef(ref);
|
|
@@ -24,6 +31,7 @@ const MentionButton = forwardRef(({ children, id: idProp = '', text: textProp =
|
|
|
24
31
|
let id = '';
|
|
25
32
|
let text = '';
|
|
26
33
|
let type = '';
|
|
34
|
+
let component = '';
|
|
27
35
|
if (!isValidElement(children)) {
|
|
28
36
|
if (!children.groups)
|
|
29
37
|
return _jsx("span", { children: children[0] });
|
|
@@ -31,11 +39,13 @@ const MentionButton = forwardRef(({ children, id: idProp = '', text: textProp =
|
|
|
31
39
|
id = children.groups.id;
|
|
32
40
|
text = children.groups.text;
|
|
33
41
|
type = children.groups.type;
|
|
42
|
+
component = children.groups.component || 'button';
|
|
34
43
|
}
|
|
35
44
|
else {
|
|
36
45
|
id = idProp;
|
|
37
46
|
text = textProp;
|
|
38
47
|
type = typeProp;
|
|
48
|
+
component = componentProp;
|
|
39
49
|
}
|
|
40
50
|
const handleClick = () => {
|
|
41
51
|
const comp = onMentionClick?.({
|
|
@@ -47,11 +57,17 @@ const MentionButton = forwardRef(({ children, id: idProp = '', text: textProp =
|
|
|
47
57
|
setShowPopover(true);
|
|
48
58
|
setMentionContent(comp);
|
|
49
59
|
};
|
|
50
|
-
return (_jsxs(_Fragment, { children: [leadingChar && _jsx("span", { children: leadingChar }), _jsx(StyledButton, { ...restProps, ref: mentionRef, variant: 'link', onClick: handleClick, spellCheck: false, children: isValidElement(children) ? children : text }),
|
|
60
|
+
return (_jsxs(_Fragment, { children: [leadingChar && _jsx("span", { children: leadingChar }), component === 'button' && (_jsx(StyledButton, { ...restProps, ref: mentionRef, variant: 'link', onClick: handleClick, spellCheck: false, children: isValidElement(children) ? children : text })), component === 'link' && (_jsx(StyledLink, { ...restProps, ref: mentionRef, href: id, previewable: !!onMentionPreview, onPreview: onMentionPreview
|
|
61
|
+
? () => onMentionPreview({
|
|
62
|
+
id,
|
|
63
|
+
text,
|
|
64
|
+
type
|
|
65
|
+
})
|
|
66
|
+
: undefined, spellCheck: false, children: isValidElement(children) ? children : text })), trailingChar && _jsx("span", { children: trailingChar }), _jsx(Popover, { ref: popoverRef, show: showPopover, target: mentionRef.current, placement: 'bottom-start', arrow: true, children: mentionContent })] }));
|
|
51
67
|
});
|
|
52
68
|
export const MentionButtonConfig = {
|
|
53
69
|
type: 'mention',
|
|
54
|
-
regexPattern: /(?:^|)(?<match>@(?<id>[^ :]+\w):(?<text>[^:]+\w):(?<type>[^:]+\w):)/g,
|
|
70
|
+
regexPattern: /(?:^|)(?<match>@(?<id>[^ :]+\w):(?<text>[^:]+\w):(?<type>[^:]+\w):(?:(?<component>[^:]+\w):)?)/g,
|
|
55
71
|
component: MentionButton
|
|
56
72
|
};
|
|
57
73
|
export default MentionButton;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MentionButton.js","sourceRoot":"","sources":["../../../src/components/MentionButton/MentionButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EAEV,cAAc,EAId,UAAU,EACV,MAAM,EACN,QAAQ,EACT,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EACL,MAAM,EAEN,OAAO,EACP,kBAAkB,EAClB,aAAa,EACd,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"MentionButton.js","sourceRoot":"","sources":["../../../src/components/MentionButton/MentionButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n isValidElement,\n PropsWithoutRef,\n ReactElement,\n Ref,\n useContext,\n useRef,\n useState\n} from 'react';\nimport styled from 'styled-components';\n\nimport {\n Button,\n ForwardProps,\n Link,\n Popover,\n useConsolidatedRef,\n useOuterEvent\n} from '@pega/cosmos-react-core';\n\nimport { FeedContext } from '../Feed/Feed.context';\n\ninterface MentionButtonProps {\n /** Text for the button, or a regex match containing all necessary props. */\n children: RegExpExecArray | ReactElement;\n /** The id of the mention. */\n id?: string;\n /** The text of the mention button. */\n text?: string;\n /** Designates the type of the mention for proper handling on click. */\n type?: string;\n /** Designates the render component for the mention, either a button or link. */\n component?: 'button' | 'link';\n}\n\nconst StyledButton = styled(Button)`\n &:enabled:focus,\n &:not([disabled]):focus {\n box-shadow: none;\n text-decoration: underline;\n }\n`;\n\nconst StyledLink = styled(Link)`\n &:enabled:focus,\n &:not([disabled]):focus {\n box-shadow: none;\n text-decoration: underline;\n }\n`;\n\nconst MentionButton: FunctionComponent<MentionButtonProps & ForwardProps> = forwardRef(\n (\n {\n children,\n id: idProp = '',\n text: textProp = '',\n type: typeProp = '',\n component: componentProp = 'button',\n ...restProps\n }: PropsWithoutRef<MentionButtonProps>,\n ref: Ref<HTMLButtonElement>\n ) => {\n const { onMentionClick, onMentionPreview } = useContext(FeedContext);\n const [showPopover, setShowPopover] = useState(false);\n const [mentionContent, setMentionContent] = useState<JSX.Element | undefined>();\n const mentionRef = useConsolidatedRef(ref);\n const popoverRef = useRef(null);\n\n useOuterEvent(['click', 'focusin'], [mentionRef, popoverRef], () => {\n setShowPopover(false);\n });\n\n let leadingChar = '';\n let trailingChar = '';\n let id = '';\n let text = '';\n let type = '';\n let component = '';\n\n if (!isValidElement(children)) {\n if (!children.groups) return <span>{children[0]}</span>;\n\n [leadingChar, trailingChar] = children[0].split(children.groups.match);\n id = children.groups.id;\n text = children.groups.text;\n type = children.groups.type;\n component = children.groups.component || 'button';\n } else {\n id = idProp;\n text = textProp;\n type = typeProp;\n component = componentProp;\n }\n\n const handleClick = () => {\n const comp = onMentionClick?.({\n id,\n text,\n type\n });\n if (comp) setShowPopover(true);\n setMentionContent(comp);\n };\n\n return (\n <>\n {leadingChar && <span>{leadingChar}</span>}\n {component === 'button' && (\n <StyledButton\n {...restProps}\n ref={mentionRef}\n variant='link'\n onClick={handleClick}\n spellCheck={false}\n >\n {isValidElement(children) ? children : text}\n </StyledButton>\n )}\n {component === 'link' && (\n <StyledLink\n {...restProps}\n ref={mentionRef}\n href={id}\n previewable={!!onMentionPreview}\n onPreview={\n onMentionPreview\n ? () =>\n onMentionPreview({\n id,\n text,\n type\n })\n : undefined\n }\n spellCheck={false}\n >\n {isValidElement(children) ? children : text}\n </StyledLink>\n )}\n {trailingChar && <span>{trailingChar}</span>}\n <Popover\n ref={popoverRef}\n show={showPopover}\n target={mentionRef.current}\n placement='bottom-start'\n arrow\n >\n {mentionContent}\n </Popover>\n </>\n );\n }\n);\n\nexport const MentionButtonConfig = {\n type: 'mention',\n regexPattern:\n /(?:^|)(?<match>@(?<id>[^ :]+\\w):(?<text>[^:]+\\w):(?<type>[^:]+\\w):(?:(?<component>[^:]+\\w):)?)/g,\n component: MentionButton\n};\n\nexport default MentionButton;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-social",
|
|
3
|
-
"version": "3.0.0-dev.
|
|
3
|
+
"version": "3.0.0-dev.15.0",
|
|
4
4
|
"author": "Pegasystems",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"repository": {
|
|
@@ -20,9 +20,9 @@
|
|
|
20
20
|
"build": "tsc -b"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
|
-
"@pega/cosmos-react-core": "3.0.0-dev.
|
|
24
|
-
"@pega/cosmos-react-rte": "3.0.0-dev.
|
|
25
|
-
"@pega/cosmos-react-work": "3.0.0-dev.
|
|
23
|
+
"@pega/cosmos-react-core": "3.0.0-dev.15.0",
|
|
24
|
+
"@pega/cosmos-react-rte": "3.0.0-dev.15.0",
|
|
25
|
+
"@pega/cosmos-react-work": "3.0.0-dev.15.0",
|
|
26
26
|
"@types/react": "^16.14.24 || ^17.0.38",
|
|
27
27
|
"@types/react-dom": "^16.9.14 || ^17.0.11",
|
|
28
28
|
"@types/styled-components": "^5.1.7",
|