@pega/cosmos-react-build 3.0.0-dev.7.0 → 3.0.0-dev.9.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.
- package/lib/components/AppHeader/AppHeader.styles.d.ts.map +1 -1
- package/lib/components/AppHeader/AppHeader.styles.js +2 -1
- package/lib/components/AppHeader/AppHeader.styles.js.map +1 -1
- package/lib/components/DynamicContentEditor/DynamicContentEditor.d.ts.map +1 -1
- package/lib/components/DynamicContentEditor/DynamicContentEditor.js +25 -11
- package/lib/components/DynamicContentEditor/DynamicContentEditor.js.map +1 -1
- package/lib/components/DynamicContentEditor/PegaCustomElement.d.ts +307 -3
- package/lib/components/DynamicContentEditor/PegaCustomElement.d.ts.map +1 -1
- package/lib/components/DynamicContentEditor/PegaCustomElement.js +21 -21
- package/lib/components/DynamicContentEditor/PegaCustomElement.js.map +1 -1
- package/lib/components/FlowModeller/DeletePopover.d.ts +2 -9
- package/lib/components/FlowModeller/DeletePopover.d.ts.map +1 -1
- package/lib/components/FlowModeller/DeletePopover.js +1 -1
- package/lib/components/FlowModeller/DeletePopover.js.map +1 -1
- package/lib/components/FlowModeller/FlowModeller.d.ts +4 -2
- package/lib/components/FlowModeller/FlowModeller.d.ts.map +1 -1
- package/lib/components/FlowModeller/FlowModeller.js +4 -3
- package/lib/components/FlowModeller/FlowModeller.js.map +1 -1
- package/lib/components/FlowModeller/Utils/deleteNodeUtils.d.ts +9 -1
- package/lib/components/FlowModeller/Utils/deleteNodeUtils.d.ts.map +1 -1
- package/lib/components/FlowModeller/Utils/deleteNodeUtils.js.map +1 -1
- package/lib/components/FlowModeller/helper.d.ts +4 -8
- package/lib/components/FlowModeller/helper.d.ts.map +1 -1
- package/lib/components/FlowModeller/helper.js +62 -53
- package/lib/components/FlowModeller/helper.js.map +1 -1
- package/lib/components/FlowModeller/index.d.ts +2 -2
- package/lib/components/FlowModeller/index.d.ts.map +1 -1
- package/lib/components/FlowModeller/index.js.map +1 -1
- package/lib/components/LifeCycle/Category.d.ts.map +1 -1
- package/lib/components/LifeCycle/Category.js +6 -6
- package/lib/components/LifeCycle/Category.js.map +1 -1
- package/lib/components/ObjectPreview/ObjectPreview.d.ts.map +1 -1
- package/lib/components/ObjectPreview/ObjectPreview.js +6 -1
- package/lib/components/ObjectPreview/ObjectPreview.js.map +1 -1
- package/lib/components/ObjectSelect/ObjectPicker.d.ts +2 -1
- package/lib/components/ObjectSelect/ObjectPicker.d.ts.map +1 -1
- package/lib/components/ObjectSelect/ObjectPicker.js +3 -2
- package/lib/components/ObjectSelect/ObjectPicker.js.map +1 -1
- package/lib/components/ObjectSelect/ObjectSelect.d.ts +3 -0
- package/lib/components/ObjectSelect/ObjectSelect.d.ts.map +1 -1
- package/lib/components/ObjectSelect/ObjectSelect.js +12 -7
- package/lib/components/ObjectSelect/ObjectSelect.js.map +1 -1
- package/lib/components/ObjectSelect/ObjectSummary.d.ts.map +1 -1
- package/lib/components/ObjectSelect/ObjectSummary.js +6 -27
- package/lib/components/ObjectSelect/ObjectSummary.js.map +1 -1
- package/lib/components/PageTemplates/PageTemplates.d.ts.map +1 -1
- package/lib/components/PageTemplates/PageTemplates.js +2 -2
- package/lib/components/PageTemplates/PageTemplates.js.map +1 -1
- package/package.json +9 -5
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppHeader.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppHeader/AppHeader.styles.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,MAAM,EAAoB,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAI7F,eAAO,MAAM,eAAe,
|
|
1
|
+
{"version":3,"file":"AppHeader.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppHeader/AppHeader.styles.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,MAAM,EAAoB,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAI7F,eAAO,MAAM,eAAe,4GAS1B,CAAC;AAIH,eAAO,MAAM,WAAW,EAAE,OAAO,IAU/B,CAAC;AAIH,eAAO,MAAM,oBAAoB,EAAE,OAAO,IAKxC,CAAC;AAIH,eAAO,MAAM,iBAAiB,0QAM5B,CAAC;AAIH,eAAO,MAAM,UAAU,EAAE,OAAO,IAqB9B,CAAC;AAIH,eAAO,MAAM,oBAAoB,EAAE,OAAO,IAmBzC,CAAC;AAIF,eAAO,MAAM,qBAAqB,EAAE,OAAO,IAYzC,CAAC;AAIH,eAAO,MAAM,mBAAmB,EAAE,OAAO,MAExC,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,OAAO,MAQnC,CAAC"}
|
|
@@ -7,8 +7,9 @@ export const StyledAppHeader = styled.header(({ theme }) => {
|
|
|
7
7
|
height: 3rem;
|
|
8
8
|
padding: 0 calc(2 * ${theme.base.spacing});
|
|
9
9
|
border-bottom: 0.0625rem solid ${theme.base.colors.gray.light};
|
|
10
|
-
box-shadow: ${theme.base.shadow.low};
|
|
11
10
|
background-color: ${theme.base.palette['primary-background']};
|
|
11
|
+
position: relative;
|
|
12
|
+
z-index: calc(${theme.base['z-index'].drawer + 1});
|
|
12
13
|
`;
|
|
13
14
|
});
|
|
14
15
|
StyledAppHeader.defaultProps = defaultThemeProp;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppHeader.styles.js","sourceRoot":"","sources":["../../../src/components/AppHeader/AppHeader.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,MAAM,EAAE,gBAAgB,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAC7F,OAAO,UAAU,MAAM,0DAA0D,CAAC;AAClF,OAAO,EAAE,yBAAyB,EAAE,MAAM,iEAAiE,CAAC;AAE5G,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACzD,OAAO,GAAG,CAAA;;0BAEc,KAAK,CAAC,IAAI,CAAC,OAAO;qCACP,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK;
|
|
1
|
+
{"version":3,"file":"AppHeader.styles.js","sourceRoot":"","sources":["../../../src/components/AppHeader/AppHeader.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { Avatar, defaultThemeProp, Flex, Text, Tabs, Button } from '@pega/cosmos-react-core';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport { StyledAppHeaderSearchForm } from '@pega/cosmos-react-core/lib/components/AppShell/AppShell.styles';\n\nexport const StyledAppHeader = styled.header(({ theme }) => {\n return css`\n height: 3rem;\n padding: 0 calc(2 * ${theme.base.spacing});\n border-bottom: 0.0625rem solid ${theme.base.colors.gray.light};\n background-color: ${theme.base.palette['primary-background']};\n position: relative;\n z-index: calc(${theme.base['z-index'].drawer + 1});\n `;\n});\n\nStyledAppHeader.defaultProps = defaultThemeProp;\n\nexport const StyledTitle: typeof Text = styled(Text)(({ theme }) => {\n return css`\n max-width: 25ch;\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n color: ${theme.base.palette['foreground-color']};\n font-weight: ${theme.base['font-weight'].bold};\n margin-inline-start: calc(0.75 * ${theme.base.spacing});\n `;\n});\n\nStyledTitle.defaultProps = defaultThemeProp;\n\nexport const StyledBrandContainer: typeof Flex = styled(Flex)(({ theme }) => {\n return css`\n padding-block: ${theme.base.spacing};\n text-decoration: none;\n `;\n});\n\nStyledBrandContainer.defaultProps = defaultThemeProp;\n\nexport const StyledBrandButton = styled(BareButton)(({ theme }) => {\n return css`\n &:not([disabled]):focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n `;\n});\n\nStyledBrandButton.defaultProps = defaultThemeProp;\n\nexport const StyledTabs: typeof Tabs = styled(Tabs)(({ theme }) => {\n return css`\n margin-inline-start: calc(2 * ${theme.base.spacing});\n margin-inline-end: calc(2 * ${theme.base.spacing});\n border: none;\n min-height: 3rem;\n button {\n height: auto;\n span:first-of-type {\n text-transform: none;\n }\n }\n button[aria-selected='false'] > span {\n font-weight: ${theme.base['font-weight']['semi-bold']};\n }\n button:hover,\n button:focus,\n button:active {\n box-shadow: none;\n }\n `;\n});\n\nStyledTabs.defaultProps = defaultThemeProp;\n\nexport const StyledUtilsContainer: typeof Flex = styled(Flex)<{ isMediumOrAbove: boolean }>(\n ({ theme, isMediumOrAbove }) => {\n return css`\n margin-inline-start: auto;\n padding-block: ${theme.base.spacing};\n width: auto;\n min-width: ${isMediumOrAbove ? '32%' : 'auto'};\n & > div,\n & > span {\n margin-inline-start: ${theme.base.spacing};\n }\n & > div:last-child {\n margin-inline-end: 0;\n }\n ${StyledAppHeaderSearchForm} {\n margin-inline-end: ${theme.base.spacing};\n }\n `;\n }\n);\n\nStyledUtilsContainer.defaultProps = defaultThemeProp;\n\nexport const StyledBranchContainer: typeof Flex = styled(Flex)(({ theme }) => {\n return css`\n span {\n white-space: nowrap;\n max-width: 25ch;\n overflow: hidden;\n text-overflow: ellipsis;\n font-weight: ${theme.base['font-weight']['semi-bold']};\n margin-inline-start: calc(0.5 * ${theme.base.spacing});\n margin-inline-end: calc(0.75 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledBranchContainer.defaultProps = defaultThemeProp;\n\nexport const StyledPreviewButton: typeof Button = styled(Button)`\n flex-shrink: 0;\n`;\n\nexport const StyledAppAvatar: typeof Avatar = styled(Avatar)(({ theme }) => {\n return css`\n width: 1.5rem;\n height: 1.5rem;\n && {\n margin-inline-start: calc(2 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledAppAvatar.defaultProps = defaultThemeProp;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DynamicContentEditor.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicContentEditor/DynamicContentEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAMlB,MAAM,OAAO,CAAC;AAKf,OAAO,EAGL,YAAY,EAYb,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAE,yBAAyB,EAAY,MAAM,8BAA8B,CAAC;AAOnF,eAAO,MAAM,mBAAmB;;SAE/B,CAAC;AAIF,QAAA,MAAM,oBAAoB,EAAE,iBAAiB,CAAC,yBAAyB,GAAG,YAAY,
|
|
1
|
+
{"version":3,"file":"DynamicContentEditor.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicContentEditor/DynamicContentEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAMlB,MAAM,OAAO,CAAC;AAKf,OAAO,EAGL,YAAY,EAYb,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAE,yBAAyB,EAAY,MAAM,8BAA8B,CAAC;AAOnF,eAAO,MAAM,mBAAmB;;SAE/B,CAAC;AAIF,QAAA,MAAM,oBAAoB,EAAE,iBAAiB,CAAC,yBAAyB,GAAG,YAAY,CA4SnF,CAAC;AAEJ,eAAe,oBAAoB,CAAC"}
|
|
@@ -4,7 +4,7 @@ import styled from 'styled-components';
|
|
|
4
4
|
import { Editor } from '@pega/cosmos-react-rte';
|
|
5
5
|
import { Button, defaultThemeProp, Menu, Modal, ModalManagerContext, Popover, StyledPopover, useConsolidatedRef, useI18n } from '@pega/cosmos-react-core';
|
|
6
6
|
import { getKeyCommand } from '@pega/cosmos-react-rte/lib/components/RichTextEditor/Toolbar/utils';
|
|
7
|
-
import
|
|
7
|
+
import { pegaReferenceElementStyle, createPegaReferenceElement } from './PegaCustomElement';
|
|
8
8
|
const StyledDynamicContentEditor = styled.div ``;
|
|
9
9
|
export const StyledSearchPopover = styled(StyledPopover) `
|
|
10
10
|
min-width: 20rem;
|
|
@@ -71,13 +71,13 @@ const DynamicContentEditor = forwardRef(({ form: { dynamicContentPicker, onSubmi
|
|
|
71
71
|
return;
|
|
72
72
|
const splitSearch = stringToSearch.split(' ');
|
|
73
73
|
const fieldString = splitSearch[splitSearch.length - 1];
|
|
74
|
-
const range =
|
|
74
|
+
const range = editor.getDoc().createRange();
|
|
75
75
|
const startPos = stringToSearch.lastIndexOf(fieldString);
|
|
76
76
|
const endPos = startPos + fieldString.length;
|
|
77
77
|
range.setStart(selectedRange.commonAncestorContainer, startPos);
|
|
78
78
|
range.setEnd(selectedRange.commonAncestorContainer, endPos);
|
|
79
|
-
|
|
80
|
-
|
|
79
|
+
editor.getDoc().getSelection()?.removeAllRanges();
|
|
80
|
+
editor.getDoc().getSelection()?.addRange(range);
|
|
81
81
|
const selectedFieldId = fieldItems.find(item => item.id === fieldId)?.id;
|
|
82
82
|
if (selectedFieldId) {
|
|
83
83
|
editor.selection.setContent(`<pega-reference contenteditable="false" data-rule-type="field" data-rule-id=${selectedFieldId}>${selectedFieldId}</pega-reference>`);
|
|
@@ -112,7 +112,7 @@ const DynamicContentEditor = forwardRef(({ form: { dynamicContentPicker, onSubmi
|
|
|
112
112
|
setCurrentElementContent(fieldValue);
|
|
113
113
|
};
|
|
114
114
|
const handleElementClick = ({ target }) => {
|
|
115
|
-
if (editor && target
|
|
115
|
+
if (editor && target && target.tagName === 'PEGA-REFERENCE') {
|
|
116
116
|
updateBookmarkAndCurrentElement(editor.selection);
|
|
117
117
|
}
|
|
118
118
|
hidePopover();
|
|
@@ -131,19 +131,32 @@ const DynamicContentEditor = forwardRef(({ form: { dynamicContentPicker, onSubmi
|
|
|
131
131
|
return targetEl.tagName === 'PEGA-REFERENCE';
|
|
132
132
|
};
|
|
133
133
|
const fieldSelectionPopover = (_jsx(Popover, { show: showFieldsPopover, strategy: 'fixed', ref: fieldPopoverRef, target: {
|
|
134
|
-
getBoundingClientRect
|
|
134
|
+
getBoundingClientRect() {
|
|
135
135
|
return currentCursorPosition;
|
|
136
136
|
}
|
|
137
|
-
},
|
|
137
|
+
}, modifiers: [
|
|
138
|
+
{
|
|
139
|
+
name: 'offset',
|
|
140
|
+
options: {
|
|
141
|
+
offset: () => {
|
|
142
|
+
const iframe = editorRef.current?.element?.querySelector('iframe');
|
|
143
|
+
const iframeRect = iframe?.getBoundingClientRect();
|
|
144
|
+
const x = iframeRect?.x ?? 0;
|
|
145
|
+
const y = iframeRect?.y ?? 0;
|
|
146
|
+
return [x, y];
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
], placement: 'bottom-start', children: fieldItems && (_jsx(Menu, { ...fieldMenu, as: StyledSearchPopover, focusControlEl: editor?.getBody() || undefined, mode: 'action', onItemClick: findAndRenameField })) }));
|
|
138
151
|
useEffect(() => {
|
|
139
152
|
if (currentElementContent)
|
|
140
153
|
modalMethods.current = create(Modal, modalProps);
|
|
141
154
|
}, [currentElementContent]);
|
|
142
155
|
useEffect(() => {
|
|
143
|
-
|
|
156
|
+
editor?.getDoc().addEventListener('click', handleElementClick);
|
|
144
157
|
editorRef.current?.insertHtml(defaultValue?.trim() || '', false);
|
|
145
158
|
return () => {
|
|
146
|
-
|
|
159
|
+
editor?.getDoc().removeEventListener('click', handleElementClick);
|
|
147
160
|
};
|
|
148
161
|
}, [editor, editorRef.current]);
|
|
149
162
|
useEffect(() => {
|
|
@@ -187,8 +200,9 @@ const DynamicContentEditor = forwardRef(({ form: { dynamicContentPicker, onSubmi
|
|
|
187
200
|
};
|
|
188
201
|
return (_jsx(_Fragment, { children: _jsx(Editor, { ref: editorRef, ...restProps, label: label, toolbar: toolbar, customComponents: [
|
|
189
202
|
{
|
|
190
|
-
|
|
191
|
-
name: 'pega-reference'
|
|
203
|
+
createCustomElement: createPegaReferenceElement,
|
|
204
|
+
name: 'pega-reference',
|
|
205
|
+
style: pegaReferenceElementStyle
|
|
192
206
|
}
|
|
193
207
|
], customActions: [
|
|
194
208
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DynamicContentEditor.js","sourceRoot":"","sources":["../../../src/components/DynamicContentEditor/DynamicContentEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useContext,\n useRef,\n useEffect,\n useState\n} from 'react';\nimport styled from 'styled-components';\nimport { Bookmark, Editor as TinymceEditor, EditorSelection } from 'tinymce';\n\nimport { Editor, EditorProps } from '@pega/cosmos-react-rte';\nimport {\n Button,\n defaultThemeProp,\n ForwardProps,\n Menu,\n MenuItemProps,\n MenuProps,\n Modal,\n ModalManagerContext,\n ModalMethods,\n Popover,\n PropsWithDefaults,\n StyledPopover,\n useConsolidatedRef,\n useI18n\n} from '@pega/cosmos-react-core';\nimport { getKeyCommand } from '@pega/cosmos-react-rte/lib/components/RichTextEditor/Toolbar/utils';\n\nimport { DynamicContentEditorProps, ItemType } from './DynamicContentEditor.types';\nimport PegaCustomElement from './PegaCustomElement';\n\ntype DynamicContentEditorPropsWithDefaults = PropsWithDefaults<DynamicContentEditorProps>;\n\nconst StyledDynamicContentEditor = styled.div<DynamicContentEditorPropsWithDefaults>``;\n\nexport const StyledSearchPopover = styled(StyledPopover)`\n min-width: 20rem;\n`;\n\nStyledDynamicContentEditor.defaultProps = defaultThemeProp;\n\nconst DynamicContentEditor: FunctionComponent<DynamicContentEditorProps & ForwardProps> =\n forwardRef(\n (\n {\n form: { dynamicContentPicker, onSubmit },\n onActiveFieldChange,\n label,\n toolbar,\n fieldItems,\n defaultValue,\n onBlur,\n ...restProps\n }: PropsWithoutRef<DynamicContentEditorProps>,\n ref: DynamicContentEditorProps['ref']\n ) => {\n const { create } = useContext(ModalManagerContext);\n const t = useI18n();\n\n const modalMethods = useRef<ModalMethods>();\n const [editor, setEditor] = useState<TinymceEditor | undefined>();\n const [bookmark, setBookmark] = useState<Bookmark | undefined>();\n const [fieldMenu, setFieldMenu] = useState<MenuProps>({ items: fieldItems || [] });\n const [currentElementContent, setCurrentElementContent] = useState<string | null>(null);\n const [currentCursorPosition, setCurrentCursorPosition] = useState({\n bottom: 0,\n height: 0,\n left: 0,\n right: 0,\n top: 0,\n width: 0,\n x: 0,\n y: 0,\n toJSON: () => {}\n });\n const [showFieldsPopover, setShowFieldsPopover] = useState<boolean>(false);\n\n const fieldPopoverRef = useRef<HTMLDivElement>(null);\n const editorRef = useConsolidatedRef(ref);\n\n const tooltip = getKeyCommand(\n navigator.appVersion.includes('Mac'),\n ({ ctrl }) => `${t('rte_insert_field')} (${ctrl}/)`\n );\n\n const insertField = (field: ItemType) => {\n if (!editor) return;\n\n const fieldContent = `<pega-reference role=\"button\" contenteditable=\"false\" data-rule-type='field' data-rule-id=${field.id}>${field.text}</pega-reference>`;\n if (bookmark) {\n editor.selection.moveToBookmark(bookmark);\n editor.selection.setContent(fieldContent);\n } else {\n editor.insertContent(fieldContent);\n }\n\n modalMethods.current?.dismiss();\n };\n\n const modalProps = {\n children: dynamicContentPicker,\n heading: t('rte_insert_field'),\n actions: (\n <>\n <Button variant='secondary' onClick={() => modalMethods.current?.dismiss()}>\n {t('cancel')}\n </Button>\n <Button variant='primary' onClick={() => onSubmit(insertField)}>\n {t('submit')}\n </Button>\n </>\n ),\n center: true,\n onAfterClose: () => {\n setBookmark(undefined);\n setCurrentElementContent('');\n onActiveFieldChange({ id: '', text: '' });\n },\n onBeforeOpen: () => {\n if (currentElementContent)\n onActiveFieldChange({ id: currentElementContent, text: currentElementContent });\n }\n };\n\n const findAndRenameField = (fieldId: string) => {\n if (!editor || !fieldItems) return;\n\n const selectedRange = editor.selection.getRng();\n const endOffset = selectedRange.endOffset;\n const stringToSearch = selectedRange.commonAncestorContainer.nodeValue?.slice(0, endOffset);\n if (stringToSearch === undefined) return;\n\n const splitSearch = stringToSearch.split(' ');\n const fieldString = splitSearch[splitSearch.length - 1];\n const range = document.createRange();\n\n const startPos = stringToSearch.lastIndexOf(fieldString);\n const endPos = startPos + fieldString.length;\n range.setStart(selectedRange.commonAncestorContainer, startPos);\n range.setEnd(selectedRange.commonAncestorContainer, endPos);\n document.getSelection()?.removeAllRanges();\n document.getSelection()?.addRange(range);\n const selectedFieldId = fieldItems.find(item => item.id === fieldId)?.id;\n if (selectedFieldId) {\n editor.selection.setContent(\n `<pega-reference contenteditable=\"false\" data-rule-type=\"field\" data-rule-id=${selectedFieldId}>${selectedFieldId}</pega-reference>`\n );\n setShowFieldsPopover(false);\n }\n };\n\n const hidePopover = () => {\n if (fieldPopoverRef) setShowFieldsPopover(false);\n };\n\n const filterFieldMenu = (searchString: string) => {\n setShowFieldsPopover(true);\n setFieldMenu({ items: fieldItems || [] });\n if (/\\s/.test(searchString)) {\n setShowFieldsPopover(false);\n return;\n }\n if (searchString && fieldItems) {\n const newFieldItems: MenuItemProps[] = fieldItems.filter(item =>\n item.id.toLowerCase().startsWith(searchString.toLowerCase())\n );\n if (newFieldItems) {\n setShowFieldsPopover(true);\n setFieldMenu({ items: newFieldItems });\n } else setShowFieldsPopover(false);\n }\n };\n\n const updateBookmarkAndCurrentElement = (editorSelection: EditorSelection) => {\n const targetEl = editorSelection.getNode();\n const fieldValue = targetEl.getAttribute('data-rule-id');\n setBookmark(editorSelection.getBookmark());\n setCurrentElementContent(fieldValue);\n };\n\n const handleElementClick = ({ target }: MouseEvent) => {\n if (editor && target instanceof HTMLElement && target.tagName === 'PEGA-REFERENCE') {\n updateBookmarkAndCurrentElement(editor.selection);\n }\n hidePopover();\n };\n\n const onInsertField = (incEditor: TinymceEditor) => {\n const targetEl = incEditor.selection.getNode();\n if (targetEl.tagName === 'PEGA-REFERENCE') {\n updateBookmarkAndCurrentElement(incEditor.selection);\n } else {\n modalMethods.current = create(Modal, modalProps);\n }\n };\n\n const isPegaRefActive = (incEditor: TinymceEditor) => {\n const targetEl = incEditor.selection.getNode();\n return targetEl.tagName === 'PEGA-REFERENCE';\n };\n\n const fieldSelectionPopover = (\n <Popover\n show={showFieldsPopover}\n strategy='fixed'\n ref={fieldPopoverRef}\n target={{\n getBoundingClientRect: () => {\n return currentCursorPosition;\n }\n }}\n placement='bottom-start'\n >\n {fieldItems && (\n <Menu\n {...fieldMenu}\n as={StyledSearchPopover}\n focusControlEl={\n editorRef.current?.element?.querySelector('[role=\"textbox\"]') || undefined\n }\n mode='action'\n onItemClick={findAndRenameField}\n />\n )}\n </Popover>\n );\n\n useEffect(() => {\n if (currentElementContent) modalMethods.current = create(Modal, modalProps);\n }, [currentElementContent]);\n\n useEffect(() => {\n editorRef.current?.element?.addEventListener('click', handleElementClick);\n editorRef.current?.insertHtml(defaultValue?.trim() || '', false);\n return () => {\n editorRef.current?.element?.removeEventListener('click', handleElementClick);\n };\n }, [editor, editorRef.current]);\n\n useEffect(() => {\n if (modalMethods.current) {\n modalMethods.current.update(modalProps);\n }\n }, [modalProps]);\n\n const onEditorChange: EditorProps['onChange'] = (formEditor?: TinymceEditor) => {\n if (formEditor) {\n const targetEl = formEditor?.selection?.getBoundingClientRect();\n const { left = 0, top = 0 } = targetEl;\n setCurrentCursorPosition({\n ...formEditor?.selection?.getBoundingClientRect(),\n x: left,\n y: top,\n toJSON: () => {}\n });\n }\n\n if (formEditor?.selection?.isCollapsed()) {\n // get the full line string\n const selectedRange = formEditor.selection.getRng();\n const endOffset = selectedRange.endOffset;\n const stringToSearch = selectedRange.commonAncestorContainer.nodeValue?.slice(\n 0,\n endOffset\n );\n const fieldString = stringToSearch?.split(' ')[stringToSearch?.split(' ').length - 1];\n if (\n fieldString?.startsWith('@') &&\n fieldString.indexOf('@') === fieldString.lastIndexOf('@')\n ) {\n filterFieldMenu(fieldString.slice(1));\n } else setShowFieldsPopover(false);\n }\n };\n\n const onKeyDown: EditorProps['onKeyDown'] = event => {\n if (\n (event?.key === 'Enter' || event?.key === 'ArrowLeft' || event?.key === 'ArrowRight') &&\n !!fieldPopoverRef.current\n ) {\n event?.preventDefault();\n }\n if (event?.key === 'Escape' && !!fieldPopoverRef.current) {\n hidePopover();\n }\n };\n\n return (\n <>\n <Editor\n ref={editorRef}\n {...restProps}\n label={label}\n toolbar={toolbar}\n customComponents={[\n {\n customElement: PegaCustomElement,\n name: 'pega-reference'\n }\n ]}\n customActions={[\n {\n icon: 'code',\n text: tooltip,\n onMouseDown: () => {\n modalMethods.current = create(Modal, modalProps);\n },\n active: isPegaRefActive,\n shortcut: {\n pattern: 'meta+191',\n description: tooltip,\n command: onInsertField\n }\n }\n ]}\n onInit={setEditor}\n onChange={onEditorChange}\n onBlur={() => {\n onBlur?.();\n hidePopover();\n }}\n onKeyDown={onKeyDown}\n >\n {fieldSelectionPopover}\n </Editor>\n </>\n );\n }\n );\n\nexport default DynamicContentEditor;\n"]}
|
|
1
|
+
{"version":3,"file":"DynamicContentEditor.js","sourceRoot":"","sources":["../../../src/components/DynamicContentEditor/DynamicContentEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useContext,\n useRef,\n useEffect,\n useState\n} from 'react';\nimport styled from 'styled-components';\nimport { Bookmark, Editor as TinyMCEEditor, EditorSelection } from 'tinymce';\n\nimport { Editor, EditorProps } from '@pega/cosmos-react-rte';\nimport {\n Button,\n defaultThemeProp,\n ForwardProps,\n Menu,\n MenuItemProps,\n MenuProps,\n Modal,\n ModalManagerContext,\n ModalMethods,\n Popover,\n PropsWithDefaults,\n StyledPopover,\n useConsolidatedRef,\n useI18n\n} from '@pega/cosmos-react-core';\nimport { getKeyCommand } from '@pega/cosmos-react-rte/lib/components/RichTextEditor/Toolbar/utils';\n\nimport { DynamicContentEditorProps, ItemType } from './DynamicContentEditor.types';\nimport { pegaReferenceElementStyle, createPegaReferenceElement } from './PegaCustomElement';\n\ntype DynamicContentEditorPropsWithDefaults = PropsWithDefaults<DynamicContentEditorProps>;\n\nconst StyledDynamicContentEditor = styled.div<DynamicContentEditorPropsWithDefaults>``;\n\nexport const StyledSearchPopover = styled(StyledPopover)`\n min-width: 20rem;\n`;\n\nStyledDynamicContentEditor.defaultProps = defaultThemeProp;\n\nconst DynamicContentEditor: FunctionComponent<DynamicContentEditorProps & ForwardProps> =\n forwardRef(\n (\n {\n form: { dynamicContentPicker, onSubmit },\n onActiveFieldChange,\n label,\n toolbar,\n fieldItems,\n defaultValue,\n onBlur,\n ...restProps\n }: PropsWithoutRef<DynamicContentEditorProps>,\n ref: DynamicContentEditorProps['ref']\n ) => {\n const { create } = useContext(ModalManagerContext);\n const t = useI18n();\n\n const modalMethods = useRef<ModalMethods>();\n const [editor, setEditor] = useState<TinyMCEEditor | undefined>();\n const [bookmark, setBookmark] = useState<Bookmark | undefined>();\n const [fieldMenu, setFieldMenu] = useState<MenuProps>({ items: fieldItems || [] });\n const [currentElementContent, setCurrentElementContent] = useState<string | null>(null);\n const [currentCursorPosition, setCurrentCursorPosition] = useState({\n bottom: 0,\n height: 0,\n left: 0,\n right: 0,\n top: 0,\n width: 0,\n x: 0,\n y: 0,\n toJSON: () => {}\n });\n const [showFieldsPopover, setShowFieldsPopover] = useState<boolean>(false);\n\n const fieldPopoverRef = useRef<HTMLDivElement>(null);\n const editorRef = useConsolidatedRef(ref);\n\n const tooltip = getKeyCommand(\n navigator.appVersion.includes('Mac'),\n ({ ctrl }) => `${t('rte_insert_field')} (${ctrl}/)`\n );\n\n const insertField = (field: ItemType) => {\n if (!editor) return;\n\n const fieldContent = `<pega-reference role=\"button\" contenteditable=\"false\" data-rule-type='field' data-rule-id=${field.id}>${field.text}</pega-reference>`;\n if (bookmark) {\n editor.selection.moveToBookmark(bookmark);\n editor.selection.setContent(fieldContent);\n } else {\n editor.insertContent(fieldContent);\n }\n\n modalMethods.current?.dismiss();\n };\n\n const modalProps = {\n children: dynamicContentPicker,\n heading: t('rte_insert_field'),\n actions: (\n <>\n <Button variant='secondary' onClick={() => modalMethods.current?.dismiss()}>\n {t('cancel')}\n </Button>\n <Button variant='primary' onClick={() => onSubmit(insertField)}>\n {t('submit')}\n </Button>\n </>\n ),\n center: true,\n onAfterClose: () => {\n setBookmark(undefined);\n setCurrentElementContent('');\n onActiveFieldChange({ id: '', text: '' });\n },\n onBeforeOpen: () => {\n if (currentElementContent)\n onActiveFieldChange({ id: currentElementContent, text: currentElementContent });\n }\n };\n\n const findAndRenameField = (fieldId: string) => {\n if (!editor || !fieldItems) return;\n\n const selectedRange = editor.selection.getRng();\n const endOffset = selectedRange.endOffset;\n const stringToSearch = selectedRange.commonAncestorContainer.nodeValue?.slice(0, endOffset);\n if (stringToSearch === undefined) return;\n\n const splitSearch = stringToSearch.split(' ');\n const fieldString = splitSearch[splitSearch.length - 1];\n const range = editor.getDoc().createRange();\n\n const startPos = stringToSearch.lastIndexOf(fieldString);\n const endPos = startPos + fieldString.length;\n range.setStart(selectedRange.commonAncestorContainer, startPos);\n range.setEnd(selectedRange.commonAncestorContainer, endPos);\n editor.getDoc().getSelection()?.removeAllRanges();\n editor.getDoc().getSelection()?.addRange(range);\n const selectedFieldId = fieldItems.find(item => item.id === fieldId)?.id;\n if (selectedFieldId) {\n editor.selection.setContent(\n `<pega-reference contenteditable=\"false\" data-rule-type=\"field\" data-rule-id=${selectedFieldId}>${selectedFieldId}</pega-reference>`\n );\n setShowFieldsPopover(false);\n }\n };\n\n const hidePopover = () => {\n if (fieldPopoverRef) setShowFieldsPopover(false);\n };\n\n const filterFieldMenu = (searchString: string) => {\n setShowFieldsPopover(true);\n setFieldMenu({ items: fieldItems || [] });\n if (/\\s/.test(searchString)) {\n setShowFieldsPopover(false);\n return;\n }\n if (searchString && fieldItems) {\n const newFieldItems: MenuItemProps[] = fieldItems.filter(item =>\n item.id.toLowerCase().startsWith(searchString.toLowerCase())\n );\n if (newFieldItems) {\n setShowFieldsPopover(true);\n setFieldMenu({ items: newFieldItems });\n } else setShowFieldsPopover(false);\n }\n };\n\n const updateBookmarkAndCurrentElement = (editorSelection: EditorSelection) => {\n const targetEl = editorSelection.getNode();\n const fieldValue = targetEl.getAttribute('data-rule-id');\n setBookmark(editorSelection.getBookmark());\n setCurrentElementContent(fieldValue);\n };\n\n const handleElementClick = ({ target }: MouseEvent) => {\n if (editor && target && (target as HTMLElement).tagName === 'PEGA-REFERENCE') {\n updateBookmarkAndCurrentElement(editor.selection);\n }\n hidePopover();\n };\n\n const onInsertField = (incEditor: TinyMCEEditor) => {\n const targetEl = incEditor.selection.getNode();\n if (targetEl.tagName === 'PEGA-REFERENCE') {\n updateBookmarkAndCurrentElement(incEditor.selection);\n } else {\n modalMethods.current = create(Modal, modalProps);\n }\n };\n\n const isPegaRefActive = (incEditor: TinyMCEEditor) => {\n const targetEl = incEditor.selection.getNode();\n return targetEl.tagName === 'PEGA-REFERENCE';\n };\n\n const fieldSelectionPopover = (\n <Popover\n show={showFieldsPopover}\n strategy='fixed'\n ref={fieldPopoverRef}\n target={{\n getBoundingClientRect() {\n return currentCursorPosition;\n }\n }}\n modifiers={[\n {\n name: 'offset',\n options: {\n offset: () => {\n const iframe = editorRef.current?.element?.querySelector('iframe');\n const iframeRect = iframe?.getBoundingClientRect();\n const x = iframeRect?.x ?? 0;\n const y = iframeRect?.y ?? 0;\n return [x, y];\n }\n }\n }\n ]}\n placement='bottom-start'\n >\n {fieldItems && (\n <Menu\n {...fieldMenu}\n as={StyledSearchPopover}\n focusControlEl={editor?.getBody() || undefined}\n mode='action'\n onItemClick={findAndRenameField}\n />\n )}\n </Popover>\n );\n\n useEffect(() => {\n if (currentElementContent) modalMethods.current = create(Modal, modalProps);\n }, [currentElementContent]);\n\n useEffect(() => {\n editor?.getDoc().addEventListener('click', handleElementClick);\n editorRef.current?.insertHtml(defaultValue?.trim() || '', false);\n return () => {\n editor?.getDoc().removeEventListener('click', handleElementClick);\n };\n }, [editor, editorRef.current]);\n\n useEffect(() => {\n if (modalMethods.current) {\n modalMethods.current.update(modalProps);\n }\n }, [modalProps]);\n\n const onEditorChange: EditorProps['onChange'] = (formEditor?: TinyMCEEditor) => {\n if (formEditor) {\n const targetEl = formEditor?.selection?.getBoundingClientRect();\n const { left = 0, top = 0 } = targetEl;\n setCurrentCursorPosition({\n ...formEditor?.selection?.getBoundingClientRect(),\n x: left,\n y: top,\n toJSON: () => {}\n });\n }\n\n if (formEditor?.selection?.isCollapsed()) {\n // get the full line string\n const selectedRange = formEditor.selection.getRng();\n const endOffset = selectedRange.endOffset;\n const stringToSearch = selectedRange.commonAncestorContainer.nodeValue?.slice(\n 0,\n endOffset\n );\n const fieldString = stringToSearch?.split(' ')[stringToSearch?.split(' ').length - 1];\n if (\n fieldString?.startsWith('@') &&\n fieldString.indexOf('@') === fieldString.lastIndexOf('@')\n ) {\n filterFieldMenu(fieldString.slice(1));\n } else setShowFieldsPopover(false);\n }\n };\n\n const onKeyDown: EditorProps['onKeyDown'] = event => {\n if (\n (event?.key === 'Enter' || event?.key === 'ArrowLeft' || event?.key === 'ArrowRight') &&\n !!fieldPopoverRef.current\n ) {\n event?.preventDefault();\n }\n if (event?.key === 'Escape' && !!fieldPopoverRef.current) {\n hidePopover();\n }\n };\n\n return (\n <>\n <Editor\n ref={editorRef}\n {...restProps}\n label={label}\n toolbar={toolbar}\n customComponents={[\n {\n createCustomElement: createPegaReferenceElement,\n name: 'pega-reference',\n style: pegaReferenceElementStyle\n }\n ]}\n customActions={[\n {\n icon: 'code',\n text: tooltip,\n onMouseDown: () => {\n modalMethods.current = create(Modal, modalProps);\n },\n active: isPegaRefActive,\n shortcut: {\n pattern: 'meta+191',\n description: tooltip,\n command: onInsertField\n }\n }\n ]}\n onInit={setEditor}\n onChange={onEditorChange}\n onBlur={() => {\n onBlur?.();\n hidePopover();\n }}\n onKeyDown={onKeyDown}\n >\n {fieldSelectionPopover}\n </Editor>\n </>\n );\n }\n );\n\nexport default DynamicContentEditor;\n"]}
|
|
@@ -1,4 +1,308 @@
|
|
|
1
|
-
export
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
export declare const pegaReferenceElementStyle = "pega-reference {\n color:#076bc9;\n cursor:pointer;\n}\npega-reference:hover{\n text-decoration:underline;\n}\npega-reference::before{\n content: '['\n}\npega-reference::after{\n content: ']'\n}";
|
|
2
|
+
export declare const createPegaReferenceElement: (win: typeof globalThis) => {
|
|
3
|
+
new (): {
|
|
4
|
+
connectedCallback(): void;
|
|
5
|
+
accessKey: string;
|
|
6
|
+
readonly accessKeyLabel: string;
|
|
7
|
+
autocapitalize: string;
|
|
8
|
+
dir: string;
|
|
9
|
+
draggable: boolean;
|
|
10
|
+
hidden: boolean;
|
|
11
|
+
innerText: string;
|
|
12
|
+
lang: string;
|
|
13
|
+
readonly offsetHeight: number;
|
|
14
|
+
readonly offsetLeft: number;
|
|
15
|
+
readonly offsetParent: Element | null;
|
|
16
|
+
readonly offsetTop: number;
|
|
17
|
+
readonly offsetWidth: number;
|
|
18
|
+
outerText: string;
|
|
19
|
+
spellcheck: boolean;
|
|
20
|
+
title: string;
|
|
21
|
+
translate: boolean;
|
|
22
|
+
attachInternals(): ElementInternals;
|
|
23
|
+
click(): void;
|
|
24
|
+
addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
|
|
25
|
+
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
|
|
26
|
+
removeEventListener<K_1 extends keyof HTMLElementEventMap>(type: K_1, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_1]) => any, options?: boolean | EventListenerOptions | undefined): void;
|
|
27
|
+
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions | undefined): void;
|
|
28
|
+
readonly attributes: NamedNodeMap;
|
|
29
|
+
readonly classList: DOMTokenList;
|
|
30
|
+
className: string;
|
|
31
|
+
readonly clientHeight: number;
|
|
32
|
+
readonly clientLeft: number;
|
|
33
|
+
readonly clientTop: number;
|
|
34
|
+
readonly clientWidth: number;
|
|
35
|
+
id: string;
|
|
36
|
+
readonly localName: string;
|
|
37
|
+
readonly namespaceURI: string | null;
|
|
38
|
+
onfullscreenchange: ((this: Element, ev: Event) => any) | null;
|
|
39
|
+
onfullscreenerror: ((this: Element, ev: Event) => any) | null;
|
|
40
|
+
outerHTML: string;
|
|
41
|
+
readonly ownerDocument: Document;
|
|
42
|
+
readonly part: DOMTokenList;
|
|
43
|
+
readonly prefix: string | null;
|
|
44
|
+
readonly scrollHeight: number;
|
|
45
|
+
scrollLeft: number;
|
|
46
|
+
scrollTop: number;
|
|
47
|
+
readonly scrollWidth: number;
|
|
48
|
+
readonly shadowRoot: ShadowRoot | null;
|
|
49
|
+
slot: string;
|
|
50
|
+
readonly tagName: string;
|
|
51
|
+
attachShadow(init: ShadowRootInit): ShadowRoot;
|
|
52
|
+
closest<K_2 extends keyof HTMLElementTagNameMap>(selector: K_2): HTMLElementTagNameMap[K_2] | null;
|
|
53
|
+
closest<K_3 extends keyof SVGElementTagNameMap>(selector: K_3): SVGElementTagNameMap[K_3] | null;
|
|
54
|
+
closest<E extends Element = Element>(selectors: string): E | null;
|
|
55
|
+
getAttribute(qualifiedName: string): string | null;
|
|
56
|
+
getAttributeNS(namespace: string | null, localName: string): string | null;
|
|
57
|
+
getAttributeNames(): string[];
|
|
58
|
+
getAttributeNode(qualifiedName: string): Attr | null;
|
|
59
|
+
getAttributeNodeNS(namespace: string | null, localName: string): Attr | null;
|
|
60
|
+
getBoundingClientRect(): DOMRect;
|
|
61
|
+
getClientRects(): DOMRectList;
|
|
62
|
+
getElementsByClassName(classNames: string): HTMLCollectionOf<Element>;
|
|
63
|
+
getElementsByTagName<K_4 extends keyof HTMLElementTagNameMap>(qualifiedName: K_4): HTMLCollectionOf<HTMLElementTagNameMap[K_4]>;
|
|
64
|
+
getElementsByTagName<K_5 extends keyof SVGElementTagNameMap>(qualifiedName: K_5): HTMLCollectionOf<SVGElementTagNameMap[K_5]>;
|
|
65
|
+
getElementsByTagName(qualifiedName: string): HTMLCollectionOf<Element>;
|
|
66
|
+
getElementsByTagNameNS(namespaceURI: "http://www.w3.org/1999/xhtml", localName: string): HTMLCollectionOf<HTMLElement>;
|
|
67
|
+
getElementsByTagNameNS(namespaceURI: "http://www.w3.org/2000/svg", localName: string): HTMLCollectionOf<SVGElement>;
|
|
68
|
+
getElementsByTagNameNS(namespace: string | null, localName: string): HTMLCollectionOf<Element>;
|
|
69
|
+
hasAttribute(qualifiedName: string): boolean;
|
|
70
|
+
hasAttributeNS(namespace: string | null, localName: string): boolean;
|
|
71
|
+
hasAttributes(): boolean;
|
|
72
|
+
hasPointerCapture(pointerId: number): boolean;
|
|
73
|
+
insertAdjacentElement(where: InsertPosition, element: Element): Element | null;
|
|
74
|
+
insertAdjacentHTML(position: InsertPosition, text: string): void;
|
|
75
|
+
insertAdjacentText(where: InsertPosition, data: string): void;
|
|
76
|
+
matches(selectors: string): boolean;
|
|
77
|
+
releasePointerCapture(pointerId: number): void;
|
|
78
|
+
removeAttribute(qualifiedName: string): void;
|
|
79
|
+
removeAttributeNS(namespace: string | null, localName: string): void;
|
|
80
|
+
removeAttributeNode(attr: Attr): Attr;
|
|
81
|
+
requestFullscreen(options?: FullscreenOptions | undefined): Promise<void>;
|
|
82
|
+
requestPointerLock(): void;
|
|
83
|
+
scroll(options?: ScrollToOptions | undefined): void;
|
|
84
|
+
scroll(x: number, y: number): void;
|
|
85
|
+
scrollBy(options?: ScrollToOptions | undefined): void;
|
|
86
|
+
scrollBy(x: number, y: number): void;
|
|
87
|
+
scrollIntoView(arg?: boolean | ScrollIntoViewOptions | undefined): void;
|
|
88
|
+
scrollTo(options?: ScrollToOptions | undefined): void;
|
|
89
|
+
scrollTo(x: number, y: number): void;
|
|
90
|
+
setAttribute(qualifiedName: string, value: string): void;
|
|
91
|
+
setAttributeNS(namespace: string | null, qualifiedName: string, value: string): void;
|
|
92
|
+
setAttributeNode(attr: Attr): Attr | null;
|
|
93
|
+
setAttributeNodeNS(attr: Attr): Attr | null;
|
|
94
|
+
setPointerCapture(pointerId: number): void;
|
|
95
|
+
toggleAttribute(qualifiedName: string, force?: boolean | undefined): boolean;
|
|
96
|
+
webkitMatchesSelector(selectors: string): boolean;
|
|
97
|
+
readonly baseURI: string;
|
|
98
|
+
readonly childNodes: NodeListOf<ChildNode>;
|
|
99
|
+
readonly firstChild: ChildNode | null;
|
|
100
|
+
readonly isConnected: boolean;
|
|
101
|
+
readonly lastChild: ChildNode | null;
|
|
102
|
+
readonly nextSibling: ChildNode | null;
|
|
103
|
+
readonly nodeName: string;
|
|
104
|
+
readonly nodeType: number;
|
|
105
|
+
nodeValue: string | null;
|
|
106
|
+
readonly parentElement: HTMLElement | null;
|
|
107
|
+
readonly parentNode: ParentNode | null;
|
|
108
|
+
readonly previousSibling: ChildNode | null;
|
|
109
|
+
textContent: string | null;
|
|
110
|
+
appendChild<T extends Node>(node: T): T;
|
|
111
|
+
cloneNode(deep?: boolean | undefined): Node;
|
|
112
|
+
compareDocumentPosition(other: Node): number;
|
|
113
|
+
contains(other: Node | null): boolean;
|
|
114
|
+
getRootNode(options?: GetRootNodeOptions | undefined): Node;
|
|
115
|
+
hasChildNodes(): boolean;
|
|
116
|
+
insertBefore<T_1 extends Node>(node: T_1, child: Node | null): T_1;
|
|
117
|
+
isDefaultNamespace(namespace: string | null): boolean;
|
|
118
|
+
isEqualNode(otherNode: Node | null): boolean;
|
|
119
|
+
isSameNode(otherNode: Node | null): boolean;
|
|
120
|
+
lookupNamespaceURI(prefix: string | null): string | null;
|
|
121
|
+
lookupPrefix(namespace: string | null): string | null;
|
|
122
|
+
normalize(): void;
|
|
123
|
+
removeChild<T_2 extends Node>(child: T_2): T_2;
|
|
124
|
+
replaceChild<T_3 extends Node>(node: Node, child: T_3): T_3;
|
|
125
|
+
readonly ATTRIBUTE_NODE: number;
|
|
126
|
+
readonly CDATA_SECTION_NODE: number;
|
|
127
|
+
readonly COMMENT_NODE: number;
|
|
128
|
+
readonly DOCUMENT_FRAGMENT_NODE: number;
|
|
129
|
+
readonly DOCUMENT_NODE: number;
|
|
130
|
+
readonly DOCUMENT_POSITION_CONTAINED_BY: number;
|
|
131
|
+
readonly DOCUMENT_POSITION_CONTAINS: number;
|
|
132
|
+
readonly DOCUMENT_POSITION_DISCONNECTED: number;
|
|
133
|
+
readonly DOCUMENT_POSITION_FOLLOWING: number;
|
|
134
|
+
readonly DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: number;
|
|
135
|
+
readonly DOCUMENT_POSITION_PRECEDING: number;
|
|
136
|
+
readonly DOCUMENT_TYPE_NODE: number;
|
|
137
|
+
readonly ELEMENT_NODE: number;
|
|
138
|
+
readonly ENTITY_NODE: number;
|
|
139
|
+
readonly ENTITY_REFERENCE_NODE: number;
|
|
140
|
+
readonly NOTATION_NODE: number;
|
|
141
|
+
readonly PROCESSING_INSTRUCTION_NODE: number;
|
|
142
|
+
readonly TEXT_NODE: number;
|
|
143
|
+
dispatchEvent(event: Event): boolean;
|
|
144
|
+
ariaAtomic: string | null;
|
|
145
|
+
ariaAutoComplete: string | null;
|
|
146
|
+
ariaBusy: string | null;
|
|
147
|
+
ariaChecked: string | null;
|
|
148
|
+
ariaColCount: string | null;
|
|
149
|
+
ariaColIndex: string | null;
|
|
150
|
+
ariaColSpan: string | null;
|
|
151
|
+
ariaCurrent: string | null;
|
|
152
|
+
ariaDisabled: string | null;
|
|
153
|
+
ariaExpanded: string | null;
|
|
154
|
+
ariaHasPopup: string | null;
|
|
155
|
+
ariaHidden: string | null;
|
|
156
|
+
ariaKeyShortcuts: string | null;
|
|
157
|
+
ariaLabel: string | null;
|
|
158
|
+
ariaLevel: string | null;
|
|
159
|
+
ariaLive: string | null;
|
|
160
|
+
ariaModal: string | null;
|
|
161
|
+
ariaMultiLine: string | null;
|
|
162
|
+
ariaMultiSelectable: string | null;
|
|
163
|
+
ariaOrientation: string | null;
|
|
164
|
+
ariaPlaceholder: string | null;
|
|
165
|
+
ariaPosInSet: string | null;
|
|
166
|
+
ariaPressed: string | null;
|
|
167
|
+
ariaReadOnly: string | null;
|
|
168
|
+
ariaRequired: string | null;
|
|
169
|
+
ariaRoleDescription: string | null;
|
|
170
|
+
ariaRowCount: string | null;
|
|
171
|
+
ariaRowIndex: string | null;
|
|
172
|
+
ariaRowSpan: string | null;
|
|
173
|
+
ariaSelected: string | null;
|
|
174
|
+
ariaSetSize: string | null;
|
|
175
|
+
ariaSort: string | null;
|
|
176
|
+
ariaValueMax: string | null;
|
|
177
|
+
ariaValueMin: string | null;
|
|
178
|
+
ariaValueNow: string | null;
|
|
179
|
+
ariaValueText: string | null;
|
|
180
|
+
animate(keyframes: PropertyIndexedKeyframes | Keyframe[] | null, options?: number | KeyframeAnimationOptions | undefined): Animation;
|
|
181
|
+
getAnimations(options?: GetAnimationsOptions | undefined): Animation[];
|
|
182
|
+
after(...nodes: (string | Node)[]): void;
|
|
183
|
+
before(...nodes: (string | Node)[]): void;
|
|
184
|
+
remove(): void;
|
|
185
|
+
replaceWith(...nodes: (string | Node)[]): void;
|
|
186
|
+
innerHTML: string;
|
|
187
|
+
readonly nextElementSibling: Element | null;
|
|
188
|
+
readonly previousElementSibling: Element | null;
|
|
189
|
+
readonly childElementCount: number;
|
|
190
|
+
readonly children: HTMLCollection;
|
|
191
|
+
readonly firstElementChild: Element | null;
|
|
192
|
+
readonly lastElementChild: Element | null;
|
|
193
|
+
append(...nodes: (string | Node)[]): void;
|
|
194
|
+
prepend(...nodes: (string | Node)[]): void;
|
|
195
|
+
querySelector<K_6 extends keyof HTMLElementTagNameMap>(selectors: K_6): HTMLElementTagNameMap[K_6] | null;
|
|
196
|
+
querySelector<K_7 extends keyof SVGElementTagNameMap>(selectors: K_7): SVGElementTagNameMap[K_7] | null;
|
|
197
|
+
querySelector<E_1 extends Element = Element>(selectors: string): E_1 | null;
|
|
198
|
+
querySelectorAll<K_8 extends keyof HTMLElementTagNameMap>(selectors: K_8): NodeListOf<HTMLElementTagNameMap[K_8]>;
|
|
199
|
+
querySelectorAll<K_9 extends keyof SVGElementTagNameMap>(selectors: K_9): NodeListOf<SVGElementTagNameMap[K_9]>;
|
|
200
|
+
querySelectorAll<E_2 extends Element = Element>(selectors: string): NodeListOf<E_2>;
|
|
201
|
+
replaceChildren(...nodes: (string | Node)[]): void;
|
|
202
|
+
readonly assignedSlot: HTMLSlotElement | null;
|
|
203
|
+
oncopy: ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any) | null;
|
|
204
|
+
oncut: ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any) | null;
|
|
205
|
+
onpaste: ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any) | null;
|
|
206
|
+
readonly style: CSSStyleDeclaration;
|
|
207
|
+
contentEditable: string;
|
|
208
|
+
enterKeyHint: string;
|
|
209
|
+
inputMode: string;
|
|
210
|
+
readonly isContentEditable: boolean;
|
|
211
|
+
onabort: ((this: GlobalEventHandlers, ev: UIEvent) => any) | null;
|
|
212
|
+
onanimationcancel: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
|
|
213
|
+
onanimationend: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
|
|
214
|
+
onanimationiteration: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
|
|
215
|
+
onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
|
|
216
|
+
onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
217
|
+
onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
|
|
218
|
+
oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
219
|
+
oncanplaythrough: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
220
|
+
onchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
221
|
+
onclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
222
|
+
onclose: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
223
|
+
oncontextmenu: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
224
|
+
oncuechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
225
|
+
ondblclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
226
|
+
ondrag: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
227
|
+
ondragend: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
228
|
+
ondragenter: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
229
|
+
ondragleave: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
230
|
+
ondragover: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
231
|
+
ondragstart: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
232
|
+
ondrop: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
|
|
233
|
+
ondurationchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
234
|
+
onemptied: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
235
|
+
onended: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
236
|
+
onerror: OnErrorEventHandler;
|
|
237
|
+
onfocus: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
|
|
238
|
+
onformdata: ((this: GlobalEventHandlers, ev: FormDataEvent) => any) | null;
|
|
239
|
+
ongotpointercapture: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
240
|
+
oninput: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
241
|
+
oninvalid: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
242
|
+
onkeydown: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
|
|
243
|
+
onkeypress: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
|
|
244
|
+
onkeyup: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
|
|
245
|
+
onload: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
246
|
+
onloadeddata: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
247
|
+
onloadedmetadata: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
248
|
+
onloadstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
249
|
+
onlostpointercapture: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
250
|
+
onmousedown: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
251
|
+
onmouseenter: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
252
|
+
onmouseleave: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
253
|
+
onmousemove: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
254
|
+
onmouseout: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
255
|
+
onmouseover: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
256
|
+
onmouseup: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
|
|
257
|
+
onpause: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
258
|
+
onplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
259
|
+
onplaying: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
260
|
+
onpointercancel: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
261
|
+
onpointerdown: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
262
|
+
onpointerenter: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
263
|
+
onpointerleave: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
264
|
+
onpointermove: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
265
|
+
onpointerout: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
266
|
+
onpointerover: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
267
|
+
onpointerup: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
|
|
268
|
+
onprogress: ((this: GlobalEventHandlers, ev: ProgressEvent<EventTarget>) => any) | null;
|
|
269
|
+
onratechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
270
|
+
onreset: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
271
|
+
onresize: ((this: GlobalEventHandlers, ev: UIEvent) => any) | null;
|
|
272
|
+
onscroll: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
273
|
+
onsecuritypolicyviolation: ((this: GlobalEventHandlers, ev: SecurityPolicyViolationEvent) => any) | null;
|
|
274
|
+
onseeked: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
275
|
+
onseeking: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
276
|
+
onselect: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
277
|
+
onselectionchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
278
|
+
onselectstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
279
|
+
onslotchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
280
|
+
onstalled: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
281
|
+
onsubmit: ((this: GlobalEventHandlers, ev: SubmitEvent) => any) | null;
|
|
282
|
+
onsuspend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
283
|
+
ontimeupdate: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
284
|
+
ontoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
285
|
+
ontouchcancel?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
|
|
286
|
+
ontouchend?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
|
|
287
|
+
ontouchmove?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
|
|
288
|
+
ontouchstart?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
|
|
289
|
+
ontransitioncancel: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
|
|
290
|
+
ontransitionend: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
|
|
291
|
+
ontransitionrun: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
|
|
292
|
+
ontransitionstart: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
|
|
293
|
+
onvolumechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
294
|
+
onwaiting: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
295
|
+
onwebkitanimationend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
296
|
+
onwebkitanimationiteration: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
297
|
+
onwebkitanimationstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
298
|
+
onwebkittransitionend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
|
|
299
|
+
onwheel: ((this: GlobalEventHandlers, ev: WheelEvent) => any) | null;
|
|
300
|
+
autofocus: boolean;
|
|
301
|
+
readonly dataset: DOMStringMap;
|
|
302
|
+
nonce?: string | undefined;
|
|
303
|
+
tabIndex: number;
|
|
304
|
+
blur(): void;
|
|
305
|
+
focus(options?: FocusOptions | undefined): void;
|
|
306
|
+
};
|
|
307
|
+
};
|
|
4
308
|
//# sourceMappingURL=PegaCustomElement.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PegaCustomElement.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicContentEditor/PegaCustomElement.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,
|
|
1
|
+
{"version":3,"file":"PegaCustomElement.d.ts","sourceRoot":"","sources":["../../../src/components/DynamicContentEditor/PegaCustomElement.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,yBAAyB,4MAYpC,CAAC;AAEH,eAAO,MAAM,0BAA0B,QAAS,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAQhE,CAAC"}
|
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
export
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
template.innerHTML = `<style>
|
|
5
|
-
pega-reference {
|
|
6
|
-
color:#076bc9;
|
|
7
|
-
cursor:pointer;
|
|
8
|
-
}
|
|
9
|
-
pega-reference:hover{
|
|
10
|
-
text-decoration:underline;
|
|
11
|
-
}
|
|
12
|
-
pega-reference::before{
|
|
13
|
-
content: '['
|
|
14
|
-
}
|
|
15
|
-
pega-reference::after{
|
|
16
|
-
content: ']'
|
|
17
|
-
}
|
|
18
|
-
</style>`;
|
|
19
|
-
const temp = document.importNode(template.content, true);
|
|
20
|
-
this.append(temp);
|
|
21
|
-
}
|
|
1
|
+
export const pegaReferenceElementStyle = `pega-reference {
|
|
2
|
+
color:#076bc9;
|
|
3
|
+
cursor:pointer;
|
|
22
4
|
}
|
|
5
|
+
pega-reference:hover{
|
|
6
|
+
text-decoration:underline;
|
|
7
|
+
}
|
|
8
|
+
pega-reference::before{
|
|
9
|
+
content: '['
|
|
10
|
+
}
|
|
11
|
+
pega-reference::after{
|
|
12
|
+
content: ']'
|
|
13
|
+
}`;
|
|
14
|
+
export const createPegaReferenceElement = (win) => {
|
|
15
|
+
return class PegaReferenceElement extends win.HTMLElement {
|
|
16
|
+
connectedCallback() {
|
|
17
|
+
const template = document.createElement('template');
|
|
18
|
+
const temp = document.importNode(template.content, true);
|
|
19
|
+
this.append(temp);
|
|
20
|
+
}
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
23
|
//# sourceMappingURL=PegaCustomElement.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PegaCustomElement.js","sourceRoot":"","sources":["../../../src/components/DynamicContentEditor/PegaCustomElement.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,
|
|
1
|
+
{"version":3,"file":"PegaCustomElement.js","sourceRoot":"","sources":["../../../src/components/DynamicContentEditor/PegaCustomElement.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,yBAAyB,GAAG;;;;;;;;;;;;EAYvC,CAAC;AAEH,MAAM,CAAC,MAAM,0BAA0B,GAAG,CAAC,GAAsB,EAAE,EAAE;IACnE,OAAO,MAAM,oBAAqB,SAAQ,GAAG,CAAC,WAAW;QACvD,iBAAiB;YACf,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;YACpD,MAAM,IAAI,GAAG,QAAQ,CAAC,UAAU,CAAC,QAAQ,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;YACzD,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;QACpB,CAAC;KACF,CAAC;AACJ,CAAC,CAAC","sourcesContent":["export const pegaReferenceElementStyle = `pega-reference {\n color:#076bc9;\n cursor:pointer;\n}\npega-reference:hover{\n text-decoration:underline;\n}\npega-reference::before{\n content: '['\n}\npega-reference::after{\n content: ']'\n}`;\n\nexport const createPegaReferenceElement = (win: typeof globalThis) => {\n return class PegaReferenceElement extends win.HTMLElement {\n connectedCallback() {\n const template = document.createElement('template');\n const temp = document.importNode(template.content, true);\n this.append(temp);\n }\n };\n};\n"]}
|
|
@@ -1,14 +1,7 @@
|
|
|
1
1
|
import { ChangeEvent, Ref } from 'react';
|
|
2
2
|
import { PopoverProps } from '@pega/cosmos-react-core';
|
|
3
|
-
import { GraphData
|
|
4
|
-
import { GraphDataAsMap } from './Utils/deleteNodeUtils';
|
|
5
|
-
export interface DeleteNodeOutcome {
|
|
6
|
-
graphData: GraphData;
|
|
7
|
-
updates: {
|
|
8
|
-
connectors: ConnectorProps[];
|
|
9
|
-
};
|
|
10
|
-
deletes: GraphDataAsMap;
|
|
11
|
-
}
|
|
3
|
+
import { GraphData } from './Renderer/Utils/Graph';
|
|
4
|
+
import { GraphDataAsMap, DeleteNodeOutcome } from './Utils/deleteNodeUtils';
|
|
12
5
|
export interface DeleteNodePopoverProps {
|
|
13
6
|
show: boolean;
|
|
14
7
|
target: PopoverProps['target'];
|