npm - @pega/cosmos-react-build - Versions diffs - 3.0.0-dev.11.0 → 3.0.0-dev.14.0 - Mend

@pega/cosmos-react-build 3.0.0-dev.11.0 → 3.0.0-dev.14.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.

Files changed (38) hide show

package/lib/components/DynamicContentEditor/DynamicContentEditor.d.ts.map CHANGED Viewed

	@@ -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,EAab,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,~~CAuTnF~~,CAAC;AAEJ,eAAe,oBAAoB,CAAC"}
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,EAab,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,CAwTnF,CAAC;AAEJ,eAAe,oBAAoB,CAAC"}

package/lib/components/DynamicContentEditor/DynamicContentEditor.js CHANGED Viewed

@@ -210,6 +210,7 @@ const DynamicContentEditor = forwardRef(({ form: { dynamicContentPicker, onSubmi
                 {
                     createCustomElement: createPegaReferenceElement,
                     name: 'pega-reference',
+                    extensionAttributes: ['contenteditable'],
                     style: pegaReferenceElementStyle
                 }
             ], customActions: [

package/lib/components/DynamicContentEditor/DynamicContentEditor.js.map CHANGED Viewed

	@@ -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 menuHelpers,\n MenuProps,\n Modal,\n ModalManagerContext,\n ModalMethods,\n Popover,\n PropsWithDefaults,\n StyledPopover,\n useConsolidatedRef,\n useI18n,\n useUID\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 menuID = useUID();\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 [fieldMenuItems, setFieldMenuItems] = useState<MenuProps['items']>(fieldItems \|\| []);\n const [currentElementId, setCurrentElementId] = useState('');\n const [currentElementContent, setCurrentElementContent] = useState('');\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 setCurrentElementId('');\n setCurrentElementContent('');\n onActiveFieldChange({ id: '', text: '' });\n },\n onBeforeOpen: () => {\n if (currentElementId) {\n onActiveFieldChange({ id: currentElementId, text: currentElementContent });\n }\n }\n };\n\n const findAndRenameField = (fieldId: string) => {\n if (!editor \|\| !fieldMenuItems) 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\n const selectedField = menuHelpers.getItem(fieldMenuItems, fieldId);\n if (selectedField) {\n editor.selection.setContent(\n `<pega-reference role=\"button\" contenteditable=\"false\" data-rule-type=\"field\" data-rule-id=${selectedField.id}>${selectedField.primary}</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 setFieldMenuItems(fieldItems \|\| []);\n if (/\\s/.test(searchString)) {\n setShowFieldsPopover(false);\n return;\n }\n if (searchString && fieldMenuItems) {\n const newFieldMenuItems: MenuProps['items'] = menuHelpers\n .flatten(fieldMenuItems)\n .filter(({ primary }) =>\n primary.toLowerCase().startsWith(searchString.toLocaleLowerCase())\n );\n if (newFieldMenuItems) {\n setShowFieldsPopover(true);\n setFieldMenuItems(newFieldMenuItems);\n } else setShowFieldsPopover(false);\n }\n };\n\n const updateBookmarkAndCurrentElement = (editorSelection: EditorSelection) => {\n const targetEl = editorSelection.getNode() as HTMLElement;\n const fieldId = targetEl.getAttribute('data-rule-id');\n const fieldValue = targetEl.innerText;\n setBookmark(editorSelection.getBookmark());\n setCurrentElementId(fieldId \|\| '');\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 {fieldMenuItems && (\n <Menu\n id={menuID}\n items={fieldMenuItems}\n as={StyledSearchPopover}\n focusControlEl={editor?.getBody() \|\| undefined}\n mode='action'\n onItemClick={findAndRenameField}\n variant='drill-down'\n />\n )}\n </Popover>\n );\n\n useEffect(() => {\n if (currentElementId) modalMethods.current = create(Modal, modalProps);\n }, [currentElementId]);\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	+ {"version":3,"file":"DynamicContentEditor.js","sourceRoot":"","sources":["../../../src/components/DynamicContentEditor/DynamicContentEditor.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EAGV,UAAU,EACV,MAAM,EACN,SAAS,EACT,QAAQ,EACT,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAGvC,OAAO,EAAE,MAAM,EAAe,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EACL,MAAM,EACN,gBAAgB,EAEhB,IAAI,EACJ,WAAW,EAEX,KAAK,EACL,mBAAmB,EAEnB,OAAO,EAEP,aAAa,EACb,kBAAkB,EAClB,OAAO,EACP,MAAM,EACP,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,aAAa,EAAE,MAAM,oEAAoE,CAAC;AAGnG,OAAO,EAAE,yBAAyB,EAAE,0BAA0B,EAAE,MAAM,qBAAqB,CAAC;AAI5F,MAAM,0BAA0B,GAAG,MAAM,CAAC,GAAG,CAAuC,EAAE,CAAC;AAEvF,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,aAAa,CAAC,CAAA;;CAEvD,CAAC;AAEF,0BAA0B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3D,MAAM,oBAAoB,GACxB,UAAU,CACR,CACE,EACE,IAAI,EAAE,EAAE,oBAAoB,EAAE,QAAQ,EAAE,EACxC,mBAAmB,EACnB,KAAK,EACL,OAAO,EACP,UAAU,EACV,YAAY,EACZ,MAAM,EACN,GAAG,SAAS,EAC+B,EAC7C,GAAqC,EACrC,EAAE;IACF,MAAM,MAAM,GAAG,MAAM,EAAE,CAAC;IACxB,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IACnD,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,YAAY,GAAG,MAAM,EAAgB,CAAC;IAC5C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,EAA6B,CAAC;IAClE,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,EAAwB,CAAC;IACjE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAqB,UAAU,IAAI,EAAE,CAAC,CAAC;IAC3F,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC7D,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACvE,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAAC;QACjE,MAAM,EAAE,CAAC;QACT,MAAM,EAAE,CAAC;QACT,IAAI,EAAE,CAAC;QACP,KAAK,EAAE,CAAC;QACR,GAAG,EAAE,CAAC;QACN,KAAK,EAAE,CAAC;QACR,CAAC,EAAE,CAAC;QACJ,CAAC,EAAE,CAAC;QACJ,MAAM,EAAE,GAAG,EAAE,GAAE,CAAC;KACjB,CAAC,CAAC;IACH,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAE3E,MAAM,eAAe,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACrD,MAAM,SAAS,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAE1C,MAAM,OAAO,GAAG,aAAa,CAC3B,SAAS,CAAC,UAAU,CAAC,QAAQ,CAAC,KAAK,CAAC,EACpC,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,GAAG,CAAC,CAAC,kBAAkB,CAAC,KAAK,IAAI,IAAI,CACpD,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,KAAe,EAAE,EAAE;QACtC,IAAI,CAAC,MAAM;YAAE,OAAO;QAEpB,MAAM,YAAY,GAAG,6FAA6F,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,IAAI,mBAAmB,CAAC;QAC5J,IAAI,QAAQ,EAAE;YACZ,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;YAC1C,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC;SAC3C;aAAM;YACL,MAAM,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;SACpC;QAED,YAAY,CAAC,OAAO,EAAE,OAAO,EAAE,CAAC;IAClC,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG;QACjB,QAAQ,EAAE,oBAAoB;QAC9B,OAAO,EAAE,CAAC,CAAC,kBAAkB,CAAC;QAC9B,OAAO,EAAE,CACP,8BACE,KAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,OAAO,EAAE,OAAO,EAAE,YACvE,CAAC,CAAC,QAAQ,CAAC,GACL,EACT,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,WAAW,CAAC,YAC3D,CAAC,CAAC,QAAQ,CAAC,GACL,IACR,CACJ;QACD,MAAM,EAAE,IAAI;QACZ,YAAY,EAAE,GAAG,EAAE;YACjB,WAAW,CAAC,SAAS,CAAC,CAAC;YACvB,mBAAmB,CAAC,EAAE,CAAC,CAAC;YACxB,wBAAwB,CAAC,EAAE,CAAC,CAAC;YAC7B,mBAAmB,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC;QAC5C,CAAC;QACD,YAAY,EAAE,GAAG,EAAE;YACjB,IAAI,gBAAgB,EAAE;gBACpB,mBAAmB,CAAC,EAAE,EAAE,EAAE,gBAAgB,EAAE,IAAI,EAAE,qBAAqB,EAAE,CAAC,CAAC;aAC5E;QACH,CAAC;KACF,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,OAAe,EAAE,EAAE;QAC7C,IAAI,CAAC,MAAM,IAAI,CAAC,cAAc;YAAE,OAAO;QAEvC,MAAM,aAAa,GAAG,MAAM,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC;QAChD,MAAM,SAAS,GAAG,aAAa,CAAC,SAAS,CAAC;QAC1C,MAAM,cAAc,GAAG,aAAa,CAAC,uBAAuB,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC;QAC5F,IAAI,cAAc,KAAK,SAAS;YAAE,OAAO;QAEzC,MAAM,WAAW,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAC9C,MAAM,WAAW,GAAG,WAAW,CAAC,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QACxD,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,WAAW,EAAE,CAAC;QAE5C,MAAM,QAAQ,GAAG,cAAc,CAAC,WAAW,CAAC,WAAW,CAAC,CAAC;QACzD,MAAM,MAAM,GAAG,QAAQ,GAAG,WAAW,CAAC,MAAM,CAAC;QAC7C,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,uBAAuB,EAAE,QAAQ,CAAC,CAAC;QAChE,KAAK,CAAC,MAAM,CAAC,aAAa,CAAC,uBAAuB,EAAE,MAAM,CAAC,CAAC;QAC5D,MAAM,CAAC,MAAM,EAAE,CAAC,YAAY,EAAE,EAAE,eAAe,EAAE,CAAC;QAClD,MAAM,CAAC,MAAM,EAAE,CAAC,YAAY,EAAE,EAAE,QAAQ,CAAC,KAAK,CAAC,CAAC;QAEhD,MAAM,aAAa,GAAG,WAAW,CAAC,OAAO,CAAC,cAAc,EAAE,OAAO,CAAC,CAAC;QACnE,IAAI,aAAa,EAAE;YACjB,MAAM,CAAC,SAAS,CAAC,UAAU,CACzB,6FAA6F,aAAa,CAAC,EAAE,IAAI,aAAa,CAAC,OAAO,mBAAmB,CAC1J,CAAC;YACF,oBAAoB,CAAC,KAAK,CAAC,CAAC;SAC7B;IACH,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,eAAe;YAAE,oBAAoB,CAAC,KAAK,CAAC,CAAC;IACnD,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,YAAoB,EAAE,EAAE;QAC/C,oBAAoB,CAAC,IAAI,CAAC,CAAC;QAC3B,iBAAiB,CAAC,UAAU,IAAI,EAAE,CAAC,CAAC;QACpC,IAAI,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,EAAE;YAC3B,oBAAoB,CAAC,KAAK,CAAC,CAAC;YAC5B,OAAO;SACR;QACD,IAAI,YAAY,IAAI,cAAc,EAAE;YAClC,MAAM,iBAAiB,GAAuB,WAAW;iBACtD,OAAO,CAAC,cAAc,CAAC;iBACvB,MAAM,CAAC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CACtB,OAAO,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,YAAY,CAAC,iBAAiB,EAAE,CAAC,CACnE,CAAC;YACJ,IAAI,iBAAiB,EAAE;gBACrB,oBAAoB,CAAC,IAAI,CAAC,CAAC;gBAC3B,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;aACtC;;gBAAM,oBAAoB,CAAC,KAAK,CAAC,CAAC;SACpC;IACH,CAAC,CAAC;IAEF,MAAM,+BAA+B,GAAG,CAAC,eAAgC,EAAE,EAAE;QAC3E,MAAM,QAAQ,GAAG,eAAe,CAAC,OAAO,EAAiB,CAAC;QAC1D,MAAM,OAAO,GAAG,QAAQ,CAAC,YAAY,CAAC,cAAc,CAAC,CAAC;QACtD,MAAM,UAAU,GAAG,QAAQ,CAAC,SAAS,CAAC;QACtC,WAAW,CAAC,eAAe,CAAC,WAAW,EAAE,CAAC,CAAC;QAC3C,mBAAmB,CAAC,OAAO,IAAI,EAAE,CAAC,CAAC;QACnC,wBAAwB,CAAC,UAAU,CAAC,CAAC;IACvC,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,EAAE,MAAM,EAAc,EAAE,EAAE;QACpD,IAAI,MAAM,IAAI,MAAM,IAAK,MAAsB,CAAC,OAAO,KAAK,gBAAgB,EAAE;YAC5E,+BAA+B,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;SACnD;QACD,WAAW,EAAE,CAAC;IAChB,CAAC,CAAC;IAEF,MAAM,aAAa,GAAG,CAAC,SAAwB,EAAE,EAAE;QACjD,MAAM,QAAQ,GAAG,SAAS,CAAC,SAAS,CAAC,OAAO,EAAE,CAAC;QAC/C,IAAI,QAAQ,CAAC,OAAO,KAAK,gBAAgB,EAAE;YACzC,+BAA+B,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;SACtD;aAAM;YACL,YAAY,CAAC,OAAO,GAAG,MAAM,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC;SAClD;IACH,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,SAAwB,EAAE,EAAE;QACnD,MAAM,QAAQ,GAAG,SAAS,CAAC,SAAS,CAAC,OAAO,EAAE,CAAC;QAC/C,OAAO,QAAQ,CAAC,OAAO,KAAK,gBAAgB,CAAC;IAC/C,CAAC,CAAC;IAEF,MAAM,qBAAqB,GAAG,CAC5B,KAAC,OAAO,IACN,IAAI,EAAE,iBAAiB,EACvB,QAAQ,EAAC,OAAO,EAChB,GAAG,EAAE,eAAe,EACpB,MAAM,EAAE;YACN,qBAAqB;gBACnB,OAAO,qBAAqB,CAAC;YAC/B,CAAC;SACF,EACD,SAAS,EAAE;YACT;gBACE,IAAI,EAAE,QAAQ;gBACd,OAAO,EAAE;oBACP,MAAM,EAAE,GAAG,EAAE;wBACX,MAAM,MAAM,GAAG,SAAS,CAAC,OAAO,EAAE,OAAO,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;wBACnE,MAAM,UAAU,GAAG,MAAM,EAAE,qBAAqB,EAAE,CAAC;wBACnD,MAAM,CAAC,GAAG,UAAU,EAAE,CAAC,IAAI,CAAC,CAAC;wBAC7B,MAAM,CAAC,GAAG,UAAU,EAAE,CAAC,IAAI,CAAC,CAAC;wBAC7B,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;oBAChB,CAAC;iBACF;aACF;SACF,EACD,SAAS,EAAC,cAAc,YAEvB,cAAc,IAAI,CACjB,KAAC,IAAI,IACH,EAAE,EAAE,MAAM,EACV,KAAK,EAAE,cAAc,EACrB,EAAE,EAAE,mBAAmB,EACvB,cAAc,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,SAAS,EAC9C,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE,kBAAkB,EAC/B,OAAO,EAAC,YAAY,GACpB,CACH,GACO,CACX,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,gBAAgB;YAAE,YAAY,CAAC,OAAO,GAAG,MAAM,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC;IACzE,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,EAAE,MAAM,EAAE,CAAC,gBAAgB,CAAC,OAAO,EAAE,kBAAkB,CAAC,CAAC;QAC/D,SAAS,CAAC,OAAO,EAAE,UAAU,CAAC,YAAY,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,KAAK,CAAC,CAAC;QACjE,OAAO,GAAG,EAAE;YACV,MAAM,EAAE,MAAM,EAAE,CAAC,mBAAmB,CAAC,OAAO,EAAE,kBAAkB,CAAC,CAAC;QACpE,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC;IAEhC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,YAAY,CAAC,OAAO,EAAE;YACxB,YAAY,CAAC,OAAO,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;SACzC;IACH,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,MAAM,cAAc,GAA4B,CAAC,UAA0B,EAAE,EAAE;QAC7E,IAAI,UAAU,EAAE;YACd,MAAM,QAAQ,GAAG,UAAU,EAAE,SAAS,EAAE,qBAAqB,EAAE,CAAC;YAChE,MAAM,EAAE,IAAI,GAAG,CAAC,EAAE,GAAG,GAAG,CAAC,EAAE,GAAG,QAAQ,CAAC;YACvC,wBAAwB,CAAC;gBACvB,GAAG,UAAU,EAAE,SAAS,EAAE,qBAAqB,EAAE;gBACjD,CAAC,EAAE,IAAI;gBACP,CAAC,EAAE,GAAG;gBACN,MAAM,EAAE,GAAG,EAAE,GAAE,CAAC;aACjB,CAAC,CAAC;SACJ;QAED,IAAI,UAAU,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE;YACxC,2BAA2B;YAC3B,MAAM,aAAa,GAAG,UAAU,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC;YACpD,MAAM,SAAS,GAAG,aAAa,CAAC,SAAS,CAAC;YAC1C,MAAM,cAAc,GAAG,aAAa,CAAC,uBAAuB,CAAC,SAAS,EAAE,KAAK,CAC3E,CAAC,EACD,SAAS,CACV,CAAC;YACF,MAAM,WAAW,GAAG,cAAc,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,cAAc,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;YACtF,IACE,WAAW,EAAE,UAAU,CAAC,GAAG,CAAC;gBAC5B,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,WAAW,CAAC,WAAW,CAAC,GAAG,CAAC,EACzD;gBACA,eAAe,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;aACvC;;gBAAM,oBAAoB,CAAC,KAAK,CAAC,CAAC;SACpC;IACH,CAAC,CAAC;IAEF,MAAM,SAAS,GAA6B,KAAK,CAAC,EAAE;QAClD,IACE,CAAC,KAAK,EAAE,GAAG,KAAK,OAAO,IAAI,KAAK,EAAE,GAAG,KAAK,WAAW,IAAI,KAAK,EAAE,GAAG,KAAK,YAAY,CAAC;YACrF,CAAC,CAAC,eAAe,CAAC,OAAO,EACzB;YACA,KAAK,EAAE,cAAc,EAAE,CAAC;SACzB;QACD,IAAI,KAAK,EAAE,GAAG,KAAK,QAAQ,IAAI,CAAC,CAAC,eAAe,CAAC,OAAO,EAAE;YACxD,WAAW,EAAE,CAAC;SACf;IACH,CAAC,CAAC;IAEF,OAAO,CACL,4BACE,KAAC,MAAM,IACL,GAAG,EAAE,SAAS,KACV,SAAS,EACb,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,gBAAgB,EAAE;gBAChB;oBACE,mBAAmB,EAAE,0BAA0B;oBAC/C,IAAI,EAAE,gBAAgB;oBACtB,mBAAmB,EAAE,CAAC,iBAAiB,CAAC;oBACxC,KAAK,EAAE,yBAAyB;iBACjC;aACF,EACD,aAAa,EAAE;gBACb;oBACE,IAAI,EAAE,MAAM;oBACZ,IAAI,EAAE,OAAO;oBACb,WAAW,EAAE,GAAG,EAAE;wBAChB,YAAY,CAAC,OAAO,GAAG,MAAM,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC;oBACnD,CAAC;oBACD,MAAM,EAAE,eAAe;oBACvB,QAAQ,EAAE;wBACR,OAAO,EAAE,UAAU;wBACnB,WAAW,EAAE,OAAO;wBACpB,OAAO,EAAE,aAAa;qBACvB;iBACF;aACF,EACD,MAAM,EAAE,SAAS,EACjB,QAAQ,EAAE,cAAc,EACxB,MAAM,EAAE,GAAG,EAAE;gBACX,MAAM,EAAE,EAAE,CAAC;gBACX,WAAW,EAAE,CAAC;YAChB,CAAC,EACD,SAAS,EAAE,SAAS,YAEnB,qBAAqB,GACf,GACR,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEJ,eAAe,oBAAoB,CAAC","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 menuHelpers,\n MenuProps,\n Modal,\n ModalManagerContext,\n ModalMethods,\n Popover,\n PropsWithDefaults,\n StyledPopover,\n useConsolidatedRef,\n useI18n,\n useUID\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 menuID = useUID();\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 [fieldMenuItems, setFieldMenuItems] = useState<MenuProps['items']>(fieldItems \|\| []);\n const [currentElementId, setCurrentElementId] = useState('');\n const [currentElementContent, setCurrentElementContent] = useState('');\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 setCurrentElementId('');\n setCurrentElementContent('');\n onActiveFieldChange({ id: '', text: '' });\n },\n onBeforeOpen: () => {\n if (currentElementId) {\n onActiveFieldChange({ id: currentElementId, text: currentElementContent });\n }\n }\n };\n\n const findAndRenameField = (fieldId: string) => {\n if (!editor \|\| !fieldMenuItems) 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\n const selectedField = menuHelpers.getItem(fieldMenuItems, fieldId);\n if (selectedField) {\n editor.selection.setContent(\n `<pega-reference role=\"button\" contenteditable=\"false\" data-rule-type=\"field\" data-rule-id=${selectedField.id}>${selectedField.primary}</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 setFieldMenuItems(fieldItems \|\| []);\n if (/\\s/.test(searchString)) {\n setShowFieldsPopover(false);\n return;\n }\n if (searchString && fieldMenuItems) {\n const newFieldMenuItems: MenuProps['items'] = menuHelpers\n .flatten(fieldMenuItems)\n .filter(({ primary }) =>\n primary.toLowerCase().startsWith(searchString.toLocaleLowerCase())\n );\n if (newFieldMenuItems) {\n setShowFieldsPopover(true);\n setFieldMenuItems(newFieldMenuItems);\n } else setShowFieldsPopover(false);\n }\n };\n\n const updateBookmarkAndCurrentElement = (editorSelection: EditorSelection) => {\n const targetEl = editorSelection.getNode() as HTMLElement;\n const fieldId = targetEl.getAttribute('data-rule-id');\n const fieldValue = targetEl.innerText;\n setBookmark(editorSelection.getBookmark());\n setCurrentElementId(fieldId \|\| '');\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 {fieldMenuItems && (\n <Menu\n id={menuID}\n items={fieldMenuItems}\n as={StyledSearchPopover}\n focusControlEl={editor?.getBody() \|\| undefined}\n mode='action'\n onItemClick={findAndRenameField}\n variant='drill-down'\n />\n )}\n </Popover>\n );\n\n useEffect(() => {\n if (currentElementId) modalMethods.current = create(Modal, modalProps);\n }, [currentElementId]);\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 extensionAttributes: ['contenteditable'],\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"]}

package/lib/components/FlowModeller/Connector.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Connector.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/Connector.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAwB,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AACzF,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;~~AAwB5D~~,aAAK,cAAc,GAAG,IAAI,CAAC,sBAAsB,EAAE,IAAI,GAAG,MAAM,GAAG,aAAa,GAAG,WAAW,CAAC,GAC7F,OAAO,CAAC,IAAI,CAAC,oBAAoB,EAAE,gBAAgB,CAAC,CAAC,CAAC;AAExD,QAAA,MAAM,SAAS,yDAA0D,cAAc,~~gBAuBtF~~,CAAC;AAEF,eAAe,SAAS,CAAC"}
1	+ {"version":3,"file":"Connector.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/Connector.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAwB,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AACzF,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAyB5D,aAAK,cAAc,GAAG,IAAI,CAAC,sBAAsB,EAAE,IAAI,GAAG,MAAM,GAAG,aAAa,GAAG,WAAW,CAAC,GAC7F,OAAO,CAAC,IAAI,CAAC,oBAAoB,EAAE,gBAAgB,CAAC,CAAC,CAAC;AAExD,QAAA,MAAM,SAAS,yDAA0D,cAAc,gBA0BtF,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/lib/components/FlowModeller/Connector.js CHANGED Viewed

@@ -1,7 +1,9 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useContext } from 'react';
 import styled, { css } from 'styled-components';
 import { defaultThemeProp, Flex, Text } from '@pega/cosmos-react-core';
 import { AddButton } from './AddNode';
+import FlowModellerContext from './FlowModellerContext';
 const StyledLabel = styled(Text)(({ theme, highlight }) => {
     return css `
     border-radius: ${theme.base['border-radius']};
@@ -24,11 +26,12 @@ const StyledLabel = styled(Text)(({ theme, highlight }) => {
 StyledLabel.defaultProps = defaultThemeProp;
 const Connector = ({ id, labelLayout, highlight, data, realConnectors }) => {
     const refId = realConnectors || id;
+    const { readOnly } = useContext(FlowModellerContext);
     const metaData = {
         refType: 'connector',
         refId
     };
-    return (_jsxs(_Fragment, { children: [labelLayout?.value && (_jsx(Flex, { container: { justify: 'center' }, children: _jsx(StyledLabel, { highlight: highlight, children: labelLayout.value }) })), _jsx(AddButton, { highlight: highlight, addNodeHandler: (e) => data?.onNodeCreate(e.currentTarget, metaData) })] }));
+    return (_jsxs(_Fragment, { children: [labelLayout?.value && (_jsx(Flex, { container: { justify: 'center' }, children: _jsx(StyledLabel, { highlight: highlight, children: labelLayout.value }) })), !readOnly && (_jsx(AddButton, { highlight: highlight, addNodeHandler: (e) => data?.onNodeCreate(e.currentTarget, metaData) }))] }));
 };
 export default Connector;
 //# sourceMappingURL=Connector.js.map

package/lib/components/FlowModeller/Connector.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Connector.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/Connector.tsx"],"names":[],"mappings":";~~AACA~~,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAEvE,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;~~AAItC~~,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,CAAyB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;IAChF,OAAO,GAAG,CAAA;qBACS,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;kBAC9B,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI;MACxC,SAAS;QACX,GAAG,CAAA;;4BAEqB,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI;;KAEjD;aACQ,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;;0BAEV,KAAK,CAAC,IAAI,CAAC,OAAO,KAAK,KAAK,CAAC,IAAI,CAAC,OAAO;;;;;GAKhE,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,WAAW,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAK5C,MAAM,SAAS,GAAG,CAAC,EAAE,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,EAAE,cAAc,EAAkB,EAAE,EAAE;IACzF,MAAM,KAAK,GAAG,cAAc,IAAI,EAAE,CAAC;~~IAEnC~~,MAAM,QAAQ,GAAyB;QACrC,OAAO,EAAE,WAAW;QACpB,KAAK;KACN,CAAC;IAEF,OAAO,CACL,8BACG,WAAW,EAAE,KAAK,IAAI,CACrB,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,YACpC,KAAC,WAAW,IAAC,SAAS,EAAE,SAAS,YAAG,WAAW,CAAC,KAAK,GAAe,GAC/D,CACR,~~EACD~~,KAAC,SAAS,IACR,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,CAAC,CAAgC,EAAE,EAAE,CACnD,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,aAAa,EAAE,QAAQ,CAAC,GAE/C,~~IACD~~,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import { MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp, Flex, Text } from '@pega/cosmos-react-core';\n\nimport { AddButton } from './AddNode';\nimport { AddNodeHandlerParams, RendererConnectorProps } from './Renderer/Renderer.types';\nimport { PlaceHolderConnector } from './Utils/addNodeUtils';\n\nconst StyledLabel = styled(Text)<{ highlight: boolean }>(({ theme, highlight }) => {\n return css`\n border-radius: ${theme.base['border-radius']};\n background: ${theme.base.colors.slate.dark};\n ${highlight &&\n css`\n {\n background-color: ${theme.base.colors.red.dark};\n }\n `}\n color: ${theme.base.colors.white};\n text-align: center;\n padding: calc(0.5 * ${theme.base.spacing}) ${theme.base.spacing};\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 32ch;\n white-space: nowrap;\n `;\n});\n\nStyledLabel.defaultProps = defaultThemeProp;\n\ntype ConnectorProps = Pick<RendererConnectorProps, 'id' \| 'data' \| 'labelLayout' \| 'highlight'> &\n Partial<Pick<PlaceHolderConnector, 'realConnectors'>>;\n\nconst Connector = ({ id, labelLayout, highlight, data, realConnectors }: ConnectorProps) => {\n const refId = realConnectors \|\| id;\n\n const metaData: AddNodeHandlerParams = {\n refType: 'connector',\n refId\n };\n\n return (\n <>\n {labelLayout?.value && (\n <Flex container={{ justify: 'center' }}>\n <StyledLabel highlight={highlight}>{labelLayout.value}</StyledLabel>\n </Flex>\n )}\n <AddButton\n highlight={highlight}\n addNodeHandler={(e: MouseEvent<HTMLButtonElement>) =>\n data?.onNodeCreate(e.currentTarget, metaData)\n }\n />\n </>\n );\n};\n\nexport default Connector;\n"]}
1	+ {"version":3,"file":"Connector.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/Connector.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAc,UAAU,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAEvE,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAGtC,OAAO,mBAAmB,MAAM,uBAAuB,CAAC;AAExD,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,CAAyB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;IAChF,OAAO,GAAG,CAAA;qBACS,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;kBAC9B,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI;MACxC,SAAS;QACX,GAAG,CAAA;;4BAEqB,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI;;KAEjD;aACQ,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;;0BAEV,KAAK,CAAC,IAAI,CAAC,OAAO,KAAK,KAAK,CAAC,IAAI,CAAC,OAAO;;;;;GAKhE,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,WAAW,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAK5C,MAAM,SAAS,GAAG,CAAC,EAAE,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,EAAE,cAAc,EAAkB,EAAE,EAAE;IACzF,MAAM,KAAK,GAAG,cAAc,IAAI,EAAE,CAAC;IACnC,MAAM,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAErD,MAAM,QAAQ,GAAyB;QACrC,OAAO,EAAE,WAAW;QACpB,KAAK;KACN,CAAC;IAEF,OAAO,CACL,8BACG,WAAW,EAAE,KAAK,IAAI,CACrB,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,YACpC,KAAC,WAAW,IAAC,SAAS,EAAE,SAAS,YAAG,WAAW,CAAC,KAAK,GAAe,GAC/D,CACR,EACA,CAAC,QAAQ,IAAI,CACZ,KAAC,SAAS,IACR,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,CAAC,CAAgC,EAAE,EAAE,CACnD,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,aAAa,EAAE,QAAQ,CAAC,GAE/C,CACH,IACA,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import { MouseEvent, useContext } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp, Flex, Text } from '@pega/cosmos-react-core';\n\nimport { AddButton } from './AddNode';\nimport { AddNodeHandlerParams, RendererConnectorProps } from './Renderer/Renderer.types';\nimport { PlaceHolderConnector } from './Utils/addNodeUtils';\nimport FlowModellerContext from './FlowModellerContext';\n\nconst StyledLabel = styled(Text)<{ highlight: boolean }>(({ theme, highlight }) => {\n return css`\n border-radius: ${theme.base['border-radius']};\n background: ${theme.base.colors.slate.dark};\n ${highlight &&\n css`\n {\n background-color: ${theme.base.colors.red.dark};\n }\n `}\n color: ${theme.base.colors.white};\n text-align: center;\n padding: calc(0.5 * ${theme.base.spacing}) ${theme.base.spacing};\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 32ch;\n white-space: nowrap;\n `;\n});\n\nStyledLabel.defaultProps = defaultThemeProp;\n\ntype ConnectorProps = Pick<RendererConnectorProps, 'id' \| 'data' \| 'labelLayout' \| 'highlight'> &\n Partial<Pick<PlaceHolderConnector, 'realConnectors'>>;\n\nconst Connector = ({ id, labelLayout, highlight, data, realConnectors }: ConnectorProps) => {\n const refId = realConnectors \|\| id;\n const { readOnly } = useContext(FlowModellerContext);\n\n const metaData: AddNodeHandlerParams = {\n refType: 'connector',\n refId\n };\n\n return (\n <>\n {labelLayout?.value && (\n <Flex container={{ justify: 'center' }}>\n <StyledLabel highlight={highlight}>{labelLayout.value}</StyledLabel>\n </Flex>\n )}\n {!readOnly && (\n <AddButton\n highlight={highlight}\n addNodeHandler={(e: MouseEvent<HTMLButtonElement>) =>\n data?.onNodeCreate(e.currentTarget, metaData)\n }\n />\n )}\n </>\n );\n};\n\nexport default Connector;\n"]}

package/lib/components/FlowModeller/FlowModeller.d.ts CHANGED Viewed

@@ -1,25 +1,5 @@
-import { PropsWithoutRef, MouseEvent } from 'react';
-import { Action } from '@pega/cosmos-react-core';
-import { GraphData, ConnectorProps } from './Renderer/Utils/Graph';
-import { AddNodeHandlerParams, RendererProps } from './Renderer/Renderer.types';
-import { ActionParams, NodeProps, NodeLibraryItem, NodeType } from './Node/Node.types';
-export interface FlowModellerProps {
-    graphData: GraphData<NodeProps, ConnectorProps>;
-    /** Node actions */
-    actions?: Action[];
-    /** Callback to add node from connector */
-    onNodeAdd: (nodeType: NodeType, params: AddNodeHandlerParams) => void;
-    /** Callback for handling the click on the node */
-    onNodeClick?: (nodeId: string) => void;
-    /** Callback for actions on Node */
-    onNodeActionClick?: (param: ActionParams, e: MouseEvent) => void;
-    /** Callback for node deletion */
-    onDelete?: (param: ActionParams, e: MouseEvent) => void;
-    /** Types of nodes */
-    nodeLibrary: NodeLibraryItem[];
-    /** Highlights */
-    highlightData?: RendererProps['highlights'];
-}
-declare const FlowModeller: ({ graphData, highlightData, onNodeActionClick, onNodeAdd, nodeLibrary, onNodeClick, onDelete, actions }: PropsWithoutRef<FlowModellerProps>) => JSX.Element;
+import { PropsWithoutRef } from 'react';
+import { FlowModellerProps } from './FlowModeller.types';
+declare const FlowModeller: ({ graphData, highlightData, onNodeActionClick, onNodeAdd, nodeLibrary, onNodeClick, onDelete, actions, readOnly }: PropsWithoutRef<FlowModellerProps>) => JSX.Element;
 export default FlowModeller;
 //# sourceMappingURL=FlowModeller.d.ts.map

package/lib/components/FlowModeller/FlowModeller.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FlowModeller.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,~~EAEf~~,~~UAAU,EAKX,~~MAAM,OAAO,CAAC;~~AAEf~~,OAAO,~~EAEL,MAAM,EAMP,MAAM,yBAAyB,CAAC;AAIjC,OAAO,~~EAAE,~~SAAS,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACnE,OAAO,EACL,oBAAoB,EAGpB,aAAa,EACd,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EACL,YAAY,EACZ,SAAS,EACT,eAAe,EAGf,QAAQ,EAET,MAAM,mBAAmB,CAAC;AAS3B,MAAM,WAAW,~~iBAAiB~~;IAChC~~,~~SAAS,~~EAAE,~~SAAS,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;IAChD,mBAAmB;IACnB,OAAO,CAAC,EAAE,~~MAAM,~~EAAE~~,CAAC;~~IACnB~~,0CAA0C;IAC1C,SAAS,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,oBAAoB,KAAK,IAAI,CAAC;IACtE,kDAAkD;IAClD,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,mCAAmC;IACnC,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,EAAE,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IACjE,iCAAiC;IACjC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,EAAE,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IACxD,qBAAqB;IACrB,WAAW,EAAE,eAAe,EAAE,CAAC;IAC/B,iBAAiB;IACjB,aAAa,CAAC,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;CAC7C;AAiFD,QAAA,MAAM,YAAY,~~4GASf~~,gBAAgB,iBAAiB,CAAC,~~gBA8OpC~~,CAAC;AAEF,eAAe,YAAY,CAAC"}
1	+ {"version":3,"file":"FlowModeller.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EAQhB,MAAM,OAAO,CAAC;AAmCf,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAiFzD,QAAA,MAAM,YAAY,sHAUf,gBAAgB,iBAAiB,CAAC,gBAiPpC,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/components/FlowModeller/FlowModeller.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useReducer, useCallback, useRef } from 'react';
+import { useEffect, useReducer, useCallback, useRef, useMemo } from 'react';
 import { createUID, useElement, useOuterEvent, useI18n } from '@pega/cosmos-react-core';
 import ItemLibrary from '../ItemLibrary/ItemLibrary';
 import FlowRenderer from './Renderer/Renderer';
@@ -10,6 +10,7 @@ import FlowModellerHelper from './helper';
 import DeletePopover from './DeletePopover';
 import Connector from './Connector';
 import Node from './Node';
+import FlowModellerContext from './FlowModellerContext';
 const initState = {
     showLib: false,
     activeItem: null,
@@ -71,7 +72,7 @@ const reducer = (state, action) => {
             return state;
     }
 };
-const FlowModeller = ({ graphData, highlightData, onNodeActionClick, onNodeAdd, nodeLibrary, onNodeClick, onDelete, actions }) => {
+const FlowModeller = ({ graphData, highlightData, onNodeActionClick, onNodeAdd, nodeLibrary, onNodeClick, onDelete, actions, readOnly }) => {
     const [state, dispatch] = useReducer(reducer, initState);
     const [popoverEl, setPopoverEl] = useElement(null);
     const [deletePopoverEl, setDeletePopoverEl] = useElement(null);
@@ -236,7 +237,8 @@ const FlowModeller = ({ graphData, highlightData, onNodeActionClick, onNodeAdd,
         };
     }, []);
     const items = nodeLibrary !== undefined ? nodeLibrary : [];
-    return (_jsxs("div", { children: [_jsx(FlowRenderer, { graphData: state.graphData, connector: Connector, node: Node, highlights: highlightData ?? state.highlightItems }), state.showDeletePopover && state.deleteProps && (_jsx(DeletePopover, { show: state.showDeletePopover, ref: setDeletePopoverEl, ...state.deleteProps })), _jsx(ItemLibrary, { show: state.showLib, target: state.activeAddBtnMeta.target, placeholder: t('search_nodes'), items: items, onClick: onLibraryItemSelect, ref: setPopoverEl, position: 'bottom' })] }));
+    const ctxValue = useMemo(() => ({ readOnly }), [readOnly]);
+    return (_jsxs("div", { children: [_jsx(FlowModellerContext.Provider, { value: ctxValue, children: _jsx(FlowRenderer, { graphData: state.graphData, connector: Connector, node: Node, highlights: highlightData ?? state.highlightItems }) }), state.showDeletePopover && state.deleteProps && (_jsx(DeletePopover, { show: state.showDeletePopover, ref: setDeletePopoverEl, ...state.deleteProps })), _jsx(ItemLibrary, { show: state.showLib, target: state.activeAddBtnMeta.target, placeholder: t('search_nodes'), items: items, onClick: onLibraryItemSelect, ref: setPopoverEl, position: 'bottom' })] }));
 };
 export default FlowModeller;
 //# sourceMappingURL=FlowModeller.js.map

package/lib/components/FlowModeller/FlowModeller.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FlowModeller.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n PropsWithoutRef,\n useEffect,\n MouseEvent,\n useReducer,\n Reducer,\n useCallback,\n useRef\n} from 'react';\n\nimport {\n PopoverProps,\n Action,\n createUID,\n useElement,\n useOuterEvent,\n useI18n,\n OmitStrict\n} from '@pega/cosmos-react-core';\n\nimport ItemLibrary, { LibraryItem } from '../ItemLibrary/ItemLibrary';\n\nimport { GraphData, ConnectorProps } from './Renderer/Utils/Graph';\nimport {\n AddNodeHandlerParams,\n RendererConnectorProps,\n RendererNodeProps,\n RendererProps\n} from './Renderer/Renderer.types';\nimport FlowRenderer from './Renderer/Renderer';\nimport {\n ActionParams,\n NodeProps,\n NodeLibraryItem,\n START_NODETYPE,\n STOP_NODETYPE,\n NodeType,\n NodeComponentData\n} from './Node/Node.types';\nimport PlaceHolderHelper from './Utils/addNodeUtils';\nimport { AddButton } from './AddNode';\nimport FlowModellerHelper from './helper';\nimport DeletePopover, { DeleteNodePopoverProps } from './DeletePopover';\nimport Connector from './Connector';\nimport Node from './Node';\nimport { DeleteNodeModalOption, DeleteNodeOutcome } from './Utils/deleteNodeUtils';\n\nexport interface FlowModellerProps {\n graphData: GraphData<NodeProps, ConnectorProps>;\n /** Node actions /\n actions?: Action[];\n /* Callback to add node from connector /\n onNodeAdd: (nodeType: NodeType, params: AddNodeHandlerParams) => void;\n /* Callback for handling the click on the node /\n onNodeClick?: (nodeId: string) => void;\n /* Callback for actions on Node /\n onNodeActionClick?: (param: ActionParams, e: MouseEvent) => void;\n /* Callback for node deletion /\n onDelete?: (param: ActionParams, e: MouseEvent) => void;\n /* Types of nodes /\n nodeLibrary: NodeLibraryItem[];\n /* Highlights /\n highlightData?: RendererProps['highlights'];\n}\n\ntype ModellerState = {\n showLib: boolean;\n activeItem: Element \| null;\n activeAddBtnMeta: {\n target: null; // we will maintain ref of an Element\n meta: AddNodeHandlerParams;\n };\n graphData: GraphData<RendererNodeProps, RendererConnectorProps>;\n highlightItems?: DeleteNodeModalOption['pathItems'];\n showDeletePopover: boolean;\n deleteProps:\n \| OmitStrict<DeleteNodePopoverProps & { target: PopoverProps['target'] }, 'show'>\n \| undefined;\n};\n\nconst initState: ModellerState = {\n showLib: false,\n activeItem: null,\n activeAddBtnMeta: {\n target: null,\n meta: {\n refType: 'node',\n refId: ''\n }\n },\n graphData: { nodes: [], connectors: [] },\n highlightItems: undefined,\n showDeletePopover: false,\n deleteProps: undefined\n};\n\nconst reducer = (state: ModellerState, action: { type: string; payload: any }) => {\n switch (action.type) {\n case 'showLibrary':\n // minor optimization, not to update state.. if no change in the value\n return action.payload.show === state.showLib\n ? state\n : { ...state, showLib: action.payload.show };\n case 'setActiveItem':\n return {\n ...state,\n activeItem: action.payload.target\n };\n case 'setActiveAddButton':\n state.activeAddBtnMeta = {\n ...action.payload\n };\n return {\n ...state,\n showLib: true\n };\n case 'setGraphData':\n return {\n ...state,\n graphData: action.payload.graphData,\n highlightItems: action.payload.highlightItems\n };\n case 'highlight':\n // minor optimization to avoid unnecessary re-render\n if (action.payload.hideDeletePopover === !state.showDeletePopover) {\n return state;\n }\n\n return {\n ...state,\n highlightItems: action.payload.highlightItems,\n showDeletePopover: action.payload.hideDeletePopover !== true && state.showDeletePopover\n };\n case 'showDeletePopover':\n return {\n ...state,\n showDeletePopover: action.payload.showDeletePopover,\n deleteProps: action.payload.deleteProps\n };\n default:\n return state;\n }\n};\n\nconst FlowModeller = ({\n graphData,\n highlightData,\n onNodeActionClick,\n onNodeAdd,\n nodeLibrary,\n onNodeClick,\n onDelete,\n actions\n}: PropsWithoutRef<FlowModellerProps>) => {\n const [state, dispatch] = useReducer<Reducer<ModellerState, any>>(reducer, initState);\n const [popoverEl, setPopoverEl] = useElement<HTMLElement>(null);\n const [deletePopoverEl, setDeletePopoverEl] = useElement<HTMLElement>(null);\n\n const stateRef = useRef<ModellerState>(initState);\n\n // stateRef always refers to the same state obj\n // \"fixed\" callbacks can refer to this object whenever\n // it need the current value. Note: the callbacks will not\n // be reactive - they will not re-run the instant state changes,\n // but they will* see the current value whenever they do run\n stateRef.current = state;\n\n const t = useI18n();\n\n const onNodeCreate = (el: HTMLElement \| SVGForeignObjectElement, meta: AddNodeHandlerParams) => {\n dispatch({\n type: 'setActiveAddButton',\n payload: {\n target: el,\n meta\n }\n });\n };\n\n const closeMenu = () => {\n dispatch({\n type: 'showLibrary',\n payload: {\n show: false\n }\n });\n };\n\n const closeDeleteModel = () => {\n // un-highlight the nodes and connectors\n dispatch({\n type: 'highlight',\n payload: {\n highlightItems: undefined,\n hideDeletePopover: true\n }\n });\n };\n\n const onDeleteWrapper = useCallback(\n (params: ActionParams, e: MouseEvent) => {\n const result: DeleteNodeOutcome \| false = FlowModellerHelper.deleteNode(\n graphData,\n params.nodeId\n );\n\n if (result) {\n onDelete?.({ ...params, additionalData: result }, e);\n } else {\n dispatch({\n type: 'showDeletePopover',\n payload: {\n showDeletePopover: true,\n deleteProps: {\n flowGraphData: graphData,\n rendererGraphData: stateRef.current.graphData,\n nodeId: params.nodeId,\n target: {\n getBoundingClientRect: () =>\n document\n .getElementById(`modeller-node-${stateRef.current.deleteProps?.nodeId}`)\n ?.getBoundingClientRect()\n } as PopoverProps['target'],\n onChange: highlights => {\n dispatch({\n type: 'highlight',\n payload: {\n highlightItems: highlights\n }\n });\n },\n onSubmit: outcome => {\n // un-highlight the nodes and connectors\n closeDeleteModel();\n onDelete?.({ ...params, additionalData: outcome }, e);\n },\n onCancel: closeDeleteModel\n } as ModellerState['deleteProps']\n }\n });\n }\n },\n [graphData, state.graphData]\n );\n\n useEffect(() => {\n const onGetNewPHNode: (metaData: AddNodeHandlerParams) => RendererNodeProps = metaData => {\n return {\n id: createUID(),\n children: (\n <AddButton\n addNodeHandler={(e: MouseEvent<HTMLButtonElement>) => {\n onNodeCreate(e.currentTarget as HTMLElement, metaData);\n }}\n />\n ),\n position: { x: 0, y: 0 },\n dimensions: { width: 1, height: 0 }\n };\n };\n\n const onGetNewPHConnector: (\n fromNodeId: string,\n toNodeId: string,\n metaData: AddNodeHandlerParams\n ) => RendererConnectorProps = (fromNodeId, toNodeId) => {\n return {\n id: createUID(),\n fromNodeId,\n toNodeId,\n points: [],\n data: {\n onNodeCreate\n }\n };\n };\n\n const flowNodes: RendererNodeProps[] = graphData.nodes.map(node => {\n const flowNode: RendererNodeProps = {\n ...node,\n dimensions: {\n width: 280,\n height: 120\n },\n position: {\n x: 0,\n y: 0\n },\n data: {\n isActive: state.activeItem?.id === node.id,\n actions,\n onDelete: onDeleteWrapper,\n onActionClick: onNodeActionClick,\n onClick: onNodeClick\n } as NodeComponentData\n };\n\n if (node.type.id === START_NODETYPE.id \|\| node.type.id === STOP_NODETYPE.id) {\n flowNode.dimensions.width = 58;\n flowNode.dimensions.height = 58;\n }\n return flowNode;\n });\n\n const connectors: RendererConnectorProps[] = graphData.connectors.map(connector => {\n return {\n ...connector,\n points: [],\n data: {\n label: connector.label,\n onNodeCreate\n }\n };\n });\n\n // inject the placeholderAddNodes dynamically\n const newGraphData: GraphData<RendererNodeProps, RendererConnectorProps> =\n PlaceHolderHelper.injectPlaceholderNodes(\n { nodes: flowNodes, connectors },\n onGetNewPHNode,\n onGetNewPHConnector\n );\n\n dispatch({\n type: 'setGraphData',\n payload: {\n graphData: newGraphData\n }\n });\n }, [graphData]);\n\n /*\n Library popover functionality\n */\n const onLibraryItemSelect = useCallback(\n (libItem: LibraryItem) => {\n const metaData = state.activeAddBtnMeta.meta;\n closeMenu();\n onNodeAdd((libItem as NodeLibraryItem).type, metaData);\n },\n [state.activeAddBtnMeta]\n );\n\n const onKeydown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n closeMenu();\n }\n },\n [closeMenu]\n );\n\n useOuterEvent('mousedown', [popoverEl], closeMenu);\n useOuterEvent('mousedown', [deletePopoverEl], closeDeleteModel);\n\n useEffect(() => {\n document.addEventListener('keydown', onKeydown);\n\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, []);\n\n const items: NodeLibraryItem[] = nodeLibrary !== undefined ? nodeLibrary : [];\n\n return (\n <div>\n <FlowRenderer\n graphData={state.graphData}\n connector={Connector}\n node={Node}\n highlights={highlightData ?? state.highlightItems}\n />\n {state.showDeletePopover && state.deleteProps && (\n <DeletePopover\n show={state.showDeletePopover}\n ref={setDeletePopoverEl}\n {...state.deleteProps}\n />\n )}\n <ItemLibrary\n show={state.showLib}\n target={state.activeAddBtnMeta.target}\n placeholder={t('search_nodes')}\n items={items}\n onClick={onLibraryItemSelect}\n ref={setPopoverEl}\n position='bottom'\n />\n </div>\n );\n};\n\nexport default FlowModeller;\n"]}
1	+ {"version":3,"file":"FlowModeller.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n PropsWithoutRef,\n useEffect,\n MouseEvent,\n useReducer,\n Reducer,\n useCallback,\n useRef,\n useMemo\n} from 'react';\n\nimport {\n PopoverProps,\n createUID,\n useElement,\n useOuterEvent,\n useI18n,\n OmitStrict\n} from '@pega/cosmos-react-core';\n\nimport ItemLibrary, { LibraryItem } from '../ItemLibrary/ItemLibrary';\n\nimport { GraphData } from './Renderer/Utils/Graph';\nimport {\n AddNodeHandlerParams,\n RendererConnectorProps,\n RendererNodeProps\n} from './Renderer/Renderer.types';\nimport FlowRenderer from './Renderer/Renderer';\nimport {\n ActionParams,\n NodeLibraryItem,\n START_NODETYPE,\n STOP_NODETYPE,\n NodeComponentData\n} from './Node/Node.types';\nimport PlaceHolderHelper from './Utils/addNodeUtils';\nimport { AddButton } from './AddNode';\nimport FlowModellerHelper from './helper';\nimport DeletePopover, { DeleteNodePopoverProps } from './DeletePopover';\nimport Connector from './Connector';\nimport Node from './Node';\nimport { DeleteNodeModalOption, DeleteNodeOutcome } from './Utils/deleteNodeUtils';\nimport FlowModellerContext from './FlowModellerContext';\nimport { FlowModellerProps } from './FlowModeller.types';\n\ntype ModellerState = {\n showLib: boolean;\n activeItem: Element \| null;\n activeAddBtnMeta: {\n target: null; // we will maintain ref of an Element\n meta: AddNodeHandlerParams;\n };\n graphData: GraphData<RendererNodeProps, RendererConnectorProps>;\n highlightItems?: DeleteNodeModalOption['pathItems'];\n showDeletePopover: boolean;\n deleteProps:\n \| OmitStrict<DeleteNodePopoverProps & { target: PopoverProps['target'] }, 'show'>\n \| undefined;\n};\n\nconst initState: ModellerState = {\n showLib: false,\n activeItem: null,\n activeAddBtnMeta: {\n target: null,\n meta: {\n refType: 'node',\n refId: ''\n }\n },\n graphData: { nodes: [], connectors: [] },\n highlightItems: undefined,\n showDeletePopover: false,\n deleteProps: undefined\n};\n\nconst reducer = (state: ModellerState, action: { type: string; payload: any }) => {\n switch (action.type) {\n case 'showLibrary':\n // minor optimization, not to update state.. if no change in the value\n return action.payload.show === state.showLib\n ? state\n : { ...state, showLib: action.payload.show };\n case 'setActiveItem':\n return {\n ...state,\n activeItem: action.payload.target\n };\n case 'setActiveAddButton':\n state.activeAddBtnMeta = {\n ...action.payload\n };\n return {\n ...state,\n showLib: true\n };\n case 'setGraphData':\n return {\n ...state,\n graphData: action.payload.graphData,\n highlightItems: action.payload.highlightItems\n };\n case 'highlight':\n // minor optimization to avoid unnecessary re-render\n if (action.payload.hideDeletePopover === !state.showDeletePopover) {\n return state;\n }\n\n return {\n ...state,\n highlightItems: action.payload.highlightItems,\n showDeletePopover: action.payload.hideDeletePopover !== true && state.showDeletePopover\n };\n case 'showDeletePopover':\n return {\n ...state,\n showDeletePopover: action.payload.showDeletePopover,\n deleteProps: action.payload.deleteProps\n };\n default:\n return state;\n }\n};\n\nconst FlowModeller = ({\n graphData,\n highlightData,\n onNodeActionClick,\n onNodeAdd,\n nodeLibrary,\n onNodeClick,\n onDelete,\n actions,\n readOnly\n}: PropsWithoutRef<FlowModellerProps>) => {\n const [state, dispatch] = useReducer<Reducer<ModellerState, any>>(reducer, initState);\n const [popoverEl, setPopoverEl] = useElement<HTMLElement>(null);\n const [deletePopoverEl, setDeletePopoverEl] = useElement<HTMLElement>(null);\n const stateRef = useRef<ModellerState>(initState);\n\n // stateRef always refers to the same state obj\n // \"fixed\" callbacks can refer to this object whenever\n // it need the current value. Note: the callbacks will not\n // be reactive - they will not re-run the instant state changes,\n // but they will see the current value whenever they do run\n stateRef.current = state;\n\n const t = useI18n();\n\n const onNodeCreate = (el: HTMLElement \| SVGForeignObjectElement, meta: AddNodeHandlerParams) => {\n dispatch({\n type: 'setActiveAddButton',\n payload: {\n target: el,\n meta\n }\n });\n };\n\n const closeMenu = () => {\n dispatch({\n type: 'showLibrary',\n payload: {\n show: false\n }\n });\n };\n\n const closeDeleteModel = () => {\n // un-highlight the nodes and connectors\n dispatch({\n type: 'highlight',\n payload: {\n highlightItems: undefined,\n hideDeletePopover: true\n }\n });\n };\n\n const onDeleteWrapper = useCallback(\n (params: ActionParams, e: MouseEvent) => {\n const result: DeleteNodeOutcome \| false = FlowModellerHelper.deleteNode(\n graphData,\n params.nodeId\n );\n\n if (result) {\n onDelete?.({ ...params, additionalData: result }, e);\n } else {\n dispatch({\n type: 'showDeletePopover',\n payload: {\n showDeletePopover: true,\n deleteProps: {\n flowGraphData: graphData,\n rendererGraphData: stateRef.current.graphData,\n nodeId: params.nodeId,\n target: {\n getBoundingClientRect: () =>\n document\n .getElementById(`modeller-node-${stateRef.current.deleteProps?.nodeId}`)\n ?.getBoundingClientRect()\n } as PopoverProps['target'],\n onChange: highlights => {\n dispatch({\n type: 'highlight',\n payload: {\n highlightItems: highlights\n }\n });\n },\n onSubmit: outcome => {\n // un-highlight the nodes and connectors\n closeDeleteModel();\n onDelete?.({ ...params, additionalData: outcome }, e);\n },\n onCancel: closeDeleteModel\n } as ModellerState['deleteProps']\n }\n });\n }\n },\n [graphData, state.graphData]\n );\n\n useEffect(() => {\n const onGetNewPHNode: (metaData: AddNodeHandlerParams) => RendererNodeProps = metaData => {\n return {\n id: createUID(),\n children: (\n <AddButton\n addNodeHandler={(e: MouseEvent<HTMLButtonElement>) => {\n onNodeCreate(e.currentTarget as HTMLElement, metaData);\n }}\n />\n ),\n position: { x: 0, y: 0 },\n dimensions: { width: 1, height: 0 }\n };\n };\n\n const onGetNewPHConnector: (\n fromNodeId: string,\n toNodeId: string,\n metaData: AddNodeHandlerParams\n ) => RendererConnectorProps = (fromNodeId, toNodeId) => {\n return {\n id: createUID(),\n fromNodeId,\n toNodeId,\n points: [],\n data: {\n onNodeCreate\n }\n };\n };\n\n const flowNodes: RendererNodeProps[] = graphData.nodes.map(node => {\n const flowNode: RendererNodeProps = {\n ...node,\n dimensions: {\n width: 280,\n height: 120\n },\n position: {\n x: 0,\n y: 0\n },\n data: {\n isActive: state.activeItem?.id === node.id,\n actions,\n onDelete: onDeleteWrapper,\n onActionClick: onNodeActionClick,\n onClick: onNodeClick\n } as NodeComponentData\n };\n\n if (node.type.id === START_NODETYPE.id \|\| node.type.id === STOP_NODETYPE.id) {\n flowNode.dimensions.width = 58;\n flowNode.dimensions.height = 58;\n }\n return flowNode;\n });\n\n const connectors: RendererConnectorProps[] = graphData.connectors.map(connector => {\n return {\n ...connector,\n points: [],\n data: {\n label: connector.label,\n onNodeCreate\n }\n };\n });\n\n // inject the placeholderAddNodes dynamically\n const newGraphData: GraphData<RendererNodeProps, RendererConnectorProps> =\n PlaceHolderHelper.injectPlaceholderNodes(\n { nodes: flowNodes, connectors },\n onGetNewPHNode,\n onGetNewPHConnector\n );\n\n dispatch({\n type: 'setGraphData',\n payload: {\n graphData: newGraphData\n }\n });\n }, [graphData]);\n\n /*\n Library popover functionality\n */\n const onLibraryItemSelect = useCallback(\n (libItem: LibraryItem) => {\n const metaData = state.activeAddBtnMeta.meta;\n closeMenu();\n onNodeAdd((libItem as NodeLibraryItem).type, metaData);\n },\n [state.activeAddBtnMeta]\n );\n\n const onKeydown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n closeMenu();\n }\n },\n [closeMenu]\n );\n\n useOuterEvent('mousedown', [popoverEl], closeMenu);\n useOuterEvent('mousedown', [deletePopoverEl], closeDeleteModel);\n\n useEffect(() => {\n document.addEventListener('keydown', onKeydown);\n\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, []);\n\n const items: NodeLibraryItem[] = nodeLibrary !== undefined ? nodeLibrary : [];\n\n const ctxValue = useMemo(() => ({ readOnly }), [readOnly]);\n\n return (\n <div>\n <FlowModellerContext.Provider value={ctxValue}>\n <FlowRenderer\n graphData={state.graphData}\n connector={Connector}\n node={Node}\n highlights={highlightData ?? state.highlightItems}\n />\n </FlowModellerContext.Provider>\n {state.showDeletePopover && state.deleteProps && (\n <DeletePopover\n show={state.showDeletePopover}\n ref={setDeletePopoverEl}\n {...state.deleteProps}\n />\n )}\n <ItemLibrary\n show={state.showLib}\n target={state.activeAddBtnMeta.target}\n placeholder={t('search_nodes')}\n items={items}\n onClick={onLibraryItemSelect}\n ref={setPopoverEl}\n position='bottom'\n />\n </div>\n );\n};\n\nexport default FlowModeller;\n"]}

package/lib/components/FlowModeller/FlowModeller.types.d.ts ADDED Viewed

@@ -0,0 +1,25 @@
+import { MouseEvent } from 'react';
+import { Action } from '@pega/cosmos-react-core';
+import { GraphData, ConnectorProps } from './Renderer/Utils/Graph';
+import { AddNodeHandlerParams, RendererProps } from './Renderer/Renderer.types';
+import { ActionParams, NodeProps, NodeLibraryItem, NodeType } from './Node/Node.types';
+export interface FlowModellerProps {
+    graphData: GraphData<NodeProps, ConnectorProps>;
+    /** Node actions */
+    actions?: Action[];
+    /** Callback to add node from connector */
+    onNodeAdd: (nodeType: NodeType, params: AddNodeHandlerParams) => void;
+    /** Callback for handling the click on the node */
+    onNodeClick?: (nodeId: string) => void;
+    /** Callback for actions on Node */
+    onNodeActionClick?: (param: ActionParams, e: MouseEvent) => void;
+    /** Callback for node deletion */
+    onDelete?: (param: ActionParams, e: MouseEvent) => void;
+    /** Types of nodes */
+    nodeLibrary: NodeLibraryItem[];
+    /** Highlights */
+    highlightData?: RendererProps['highlights'];
+    /** To make FlowModeller readOnly state */
+    readOnly?: boolean;
+}
+//# sourceMappingURL=FlowModeller.types.d.ts.map

package/lib/components/FlowModeller/FlowModeller.types.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FlowModeller.types.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEjD,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACnE,OAAO,EAAE,oBAAoB,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAChF,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAEvF,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,SAAS,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;IAChD,mBAAmB;IACnB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,0CAA0C;IAC1C,SAAS,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,oBAAoB,KAAK,IAAI,CAAC;IACtE,kDAAkD;IAClD,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,mCAAmC;IACnC,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,EAAE,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IACjE,iCAAiC;IACjC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,EAAE,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IACxD,qBAAqB;IACrB,WAAW,EAAE,eAAe,EAAE,CAAC;IAC/B,iBAAiB;IACjB,aAAa,CAAC,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;IAC5C,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB"}

package/lib/components/FlowModeller/FlowModeller.types.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export {};
2	+ //# sourceMappingURL=FlowModeller.types.js.map

package/lib/components/FlowModeller/FlowModeller.types.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FlowModeller.types.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.types.ts"],"names":[],"mappings":"","sourcesContent":["import { MouseEvent } from 'react';\n\nimport { Action } from '@pega/cosmos-react-core';\n\nimport { GraphData, ConnectorProps } from './Renderer/Utils/Graph';\nimport { AddNodeHandlerParams, RendererProps } from './Renderer/Renderer.types';\nimport { ActionParams, NodeProps, NodeLibraryItem, NodeType } from './Node/Node.types';\n\nexport interface FlowModellerProps {\n graphData: GraphData<NodeProps, ConnectorProps>;\n /** Node actions */\n actions?: Action[];\n /** Callback to add node from connector */\n onNodeAdd: (nodeType: NodeType, params: AddNodeHandlerParams) => void;\n /** Callback for handling the click on the node */\n onNodeClick?: (nodeId: string) => void;\n /** Callback for actions on Node */\n onNodeActionClick?: (param: ActionParams, e: MouseEvent) => void;\n /** Callback for node deletion */\n onDelete?: (param: ActionParams, e: MouseEvent) => void;\n /** Types of nodes */\n nodeLibrary: NodeLibraryItem[];\n /** Highlights */\n highlightData?: RendererProps['highlights'];\n /** To make FlowModeller readOnly state */\n readOnly?: boolean;\n}\n"]}

package/lib/components/FlowModeller/FlowModellerContext.d.ts ADDED Viewed

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { FlowModellerProps } from './FlowModeller.types';
+declare const FlowModellerContext: import("react").Context<Pick<FlowModellerProps, "readOnly">>;
+export default FlowModellerContext;
+//# sourceMappingURL=FlowModellerContext.d.ts.map

package/lib/components/FlowModeller/FlowModellerContext.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"FlowModellerContext.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModellerContext.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEzD,QAAA,MAAM,mBAAmB,8DAEvB,CAAC;AAEH,eAAe,mBAAmB,CAAC"}

package/lib/components/FlowModeller/FlowModellerContext.js ADDED Viewed

@@ -0,0 +1,6 @@
+import { createContext } from 'react';
+const FlowModellerContext = createContext({
+    readOnly: false
+});
+export default FlowModellerContext;
+//# sourceMappingURL=FlowModellerContext.js.map

package/lib/components/FlowModeller/FlowModellerContext.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FlowModellerContext.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModellerContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAItC,MAAM,mBAAmB,GAAG,aAAa,CAAsC;IAC7E,QAAQ,EAAE,KAAK;CAChB,CAAC,CAAC;AAEH,eAAe,mBAAmB,CAAC","sourcesContent":["import { createContext } from 'react';\n\nimport { FlowModellerProps } from './FlowModeller.types';\n\nconst FlowModellerContext = createContext<Pick<FlowModellerProps, 'readOnly'>>({\n readOnly: false\n});\n\nexport default FlowModellerContext;\n"]}

package/lib/components/FlowModeller/Node/NodeTemplates.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NodeTemplates.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Node/NodeTemplates.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,~~EAOhB~~,MAAM,OAAO,CAAC;~~AA6Bf~~,OAAO,EAAE,SAAS,EAAE,kBAAkB,EAA2B,MAAM,cAAc,CAAC;AA8DtF,eAAO,MAAM,WAAW,gIAarB,kBAAkB,gBA6HpB,CAAC;AAEF,eAAO,MAAM,SAAS,oBAAqB,gBAAgB,SAAS,CAAC,gBAmBpE,CAAC;AAEF,eAAO,MAAM,OAAO,oBAAqB,gBAAgB,SAAS,CAAC,gBAmBlE,CAAC"}
1	+ {"version":3,"file":"NodeTemplates.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Node/NodeTemplates.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EAQhB,MAAM,OAAO,CAAC;AA8Bf,OAAO,EAAE,SAAS,EAAE,kBAAkB,EAA2B,MAAM,cAAc,CAAC;AA8DtF,eAAO,MAAM,WAAW,gIAarB,kBAAkB,gBA6HpB,CAAC;AAEF,eAAO,MAAM,SAAS,oBAAqB,gBAAgB,SAAS,CAAC,gBAmBpE,CAAC;AAEF,eAAO,MAAM,OAAO,oBAAqB,gBAAgB,SAAS,CAAC,gBAmBlE,CAAC"}

package/lib/components/FlowModeller/Node/NodeTemplates.js CHANGED Viewed

@@ -1,8 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useCallback, useEffect } from 'react';
+import { useCallback, useEffect, useContext } from 'react';
 import { readableColor } from 'polished';
 import { MenuButton, Icon, Flex, Tooltip, useElement, useI18n, cap, Text } from '@pega/cosmos-react-core';
 import { colorMap } from '../../../utils';
+import FlowModellerContext from '../FlowModellerContext';
 import { StyledLabel, StyledCircle, StyledIcon, StyledNodeTemplateHeader, StyledNodeTempleteContent, StyledNodeTemplate, StyledText, StyledTextWithEllipsis, StyledAdditionalData, StyledNodeTemplateFooter, StyledAdditionalDataItem } from './NodeTemplate.styles';
 const MetaListItem = ({ label, value }) => {
     const [nodeAdditionalDataItem, setNodeAdditionalDataItem] = useElement();
@@ -56,6 +57,7 @@ export const DefaultNode = ({ id, label, type, description, additionalData, acti
     const [nodeIcon, setNodeIcon] = useElement();
     const [nodeErrorToolTip, setNodeErrorToolTip] = useElement();
     const color = readableColor(colorMap[type.color]);
+    const { readOnly } = useContext(FlowModellerContext);
     useEffect(() => {
         if (error) {
             setNodeDescription(null);
@@ -66,7 +68,7 @@ export const DefaultNode = ({ id, label, type, description, additionalData, acti
     return (_jsxs(StyledNodeTemplate, { "aria-label": error || label, onClick: (e) => onClick?.(id, e), onKeyDown: handleEnterKeyDown, ref: setNodeErrorToolTip, highlight: error ? true : highlight, error: error, id: `modeller-node-${id}`, ...restProps, children: [_jsxs(Flex, { as: StyledNodeTemplateHeader, container: { alignItems: 'center', pad: 1, justify: 'between' }, children: [_jsxs(Flex, { container: { alignItems: 'center' }, children: [_jsx(StyledIcon, { id: id, style: {
                                     '--bg-color': colorMap[type.color],
                                     '--fg-color': color
-                                }, ref: setNodeIcon, children: _jsx(Icon, { name: type.icon }) }), _jsx(Tooltip, { target: nodeIcon, hideDelay: 'none', children: cap(type.name) }), _jsx(StyledText, { variant: 'h4', ref: setNodeLabel, children: label }), _jsx(Tooltip, { describeTarget: false, target: nodeLabel, hideDelay: 'none', children: label })] }), actionItems && (_jsx(MenuButton, { portal: true, variant: 'simple', text: t('actions'), icon: 'more', iconOnly: true, onClick: (e) => e.stopPropagation(), onKeyDown: (e) => e.stopPropagation(), menu: {
+                                }, ref: setNodeIcon, children: _jsx(Icon, { name: type.icon }) }), _jsx(Tooltip, { target: nodeIcon, hideDelay: 'none', children: cap(type.name) }), _jsx(StyledText, { variant: 'h4', ref: setNodeLabel, children: label }), _jsx(Tooltip, { describeTarget: false, target: nodeLabel, hideDelay: 'none', children: label })] }), !readOnly && actionItems && (_jsx(MenuButton, { portal: true, variant: 'simple', text: t('actions'), icon: 'more', iconOnly: true, onClick: (e) => e.stopPropagation(), onKeyDown: (e) => e.stopPropagation(), menu: {
                             items: actionItems
                         } }))] }), description && (_jsxs(_Fragment, { children: [_jsx(StyledNodeTempleteContent, { ref: setNodeDescription, children: description }), _jsx(Tooltip, { describeTarget: false, target: nodeDescription, hideDelay: 'none', children: description })] })), additionalData && (_jsx(StyledNodeTemplateFooter, { children: _jsx(MetaList, { metadata: additionalData }) })), error && (_jsx(Tooltip, { target: nodeErrorToolTip, hideDelay: 'none', children: error }))] }));
 };

package/lib/components/FlowModeller/Node/NodeTemplates.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NodeTemplates.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Node/NodeTemplates.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n PropsWithoutRef,\n CSSProperties,\n useCallback,\n MouseEvent,\n KeyboardEvent,\n FC,\n useEffect\n} from 'react';\nimport { readableColor } from 'polished';\n\nimport {\n MenuButton,\n Icon,\n Flex,\n Tooltip,\n useElement,\n useI18n,\n cap,\n Text\n} from '@pega/cosmos-react-core';\n\nimport { colorMap } from '../../../utils';\n\nimport {\n StyledLabel,\n StyledCircle,\n StyledIcon,\n StyledNodeTemplateHeader,\n StyledNodeTempleteContent,\n StyledNodeTemplate,\n StyledText,\n StyledTextWithEllipsis,\n StyledAdditionalData,\n StyledNodeTemplateFooter,\n StyledAdditionalDataItem\n} from './NodeTemplate.styles';\nimport { NodeProps, NodeComponentProps, AdditionalDataItemProps } from './Node.types';\n\nconst MetaListItem = ({ label, value }: AdditionalDataItemProps) => {\n const [nodeAdditionalDataItem, setNodeAdditionalDataItem] = useElement();\n return (\n <>\n <Flex\n as={StyledAdditionalDataItem}\n container={{ wrap: 'nowrap', pad: 0.25, gap: 0.25 }}\n item={{ grow: 1 }}\n ref={setNodeAdditionalDataItem}\n >\n <StyledTextWithEllipsis as='dd'>{label}</StyledTextWithEllipsis>\n <Text role='separator' variant='secondary' aria-hidden='true'>\n : \n </Text>\n <StyledTextWithEllipsis as='dt'>{value}</StyledTextWithEllipsis>\n </Flex>\n <Tooltip target={nodeAdditionalDataItem} hideDelay='none'>\n {`${label}:${value}`}\n </Tooltip>\n </>\n );\n};\n\nconst MetaList: FC<{ metadata: NodeProps['additionalData'] }> = ({ metadata }) => {\n const [nodeAdditionalData, setNodeAdditionalData] = useElement();\n let additionalDataValue = '';\n metadata?.forEach((item: AdditionalDataItemProps, index: number) => {\n if (index > 1) {\n additionalDataValue += `${item.label}: ${item.value}\n `;\n }\n });\n return (\n <Flex as={StyledAdditionalData} container={{ wrap: 'nowrap', colGap: 1, rowGap: 0.25 }}>\n {metadata?.map((data: AdditionalDataItemProps, index: number) => {\n if (index >= 2) {\n return;\n }\n return <MetaListItem key={data.id} {...data} />;\n })}\n {metadata && metadata.length > 2 && (\n <>\n <Flex\n as={StyledAdditionalDataItem}\n container={{ pad: 0.25 }}\n item={{ grow: 1, shrink: 0 }}\n ref={setNodeAdditionalData}\n >\n <StyledTextWithEllipsis as='dt'>{`+${metadata?.length - 2}`}</StyledTextWithEllipsis>\n </Flex>\n {additionalDataValue && (\n <Tooltip target={nodeAdditionalData} hideDelay='none'>\n {additionalDataValue}\n </Tooltip>\n )}\n </>\n )}\n </Flex>\n );\n};\nexport const DefaultNode = ({\n id,\n label,\n type,\n description,\n additionalData,\n actions,\n onActionClick,\n onClick,\n onDelete,\n highlight,\n error,\n ...restProps\n}: NodeComponentProps) => {\n const t = useI18n();\n\n const actionItems = actions?.map(actionItem => {\n return {\n id: actionItem.id,\n primary: actionItem.text,\n onClick: (actionId: string, e: MouseEvent) => {\n e.stopPropagation();\n onActionClick?.({ actionId, nodeId: id }, e);\n }\n };\n });\n\n if (onDelete !== undefined) {\n actionItems?.push({\n id: 'flowmodeller-delete-node',\n primary: t('delete'),\n onClick: (actionId: string, e: MouseEvent) => {\n e.stopPropagation();\n onDelete?.({ actionId, nodeId: id }, e);\n }\n });\n }\n\n const handleEnterKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n onClick?.(id, e);\n }\n },\n [onClick]\n );\n\n const [nodeLabel, setNodeLabel] = useElement();\n const [nodeDescription, setNodeDescription] = useElement();\n\n const [nodeIcon, setNodeIcon] = useElement();\n const [nodeErrorToolTip, setNodeErrorToolTip] = useElement();\n const color = readableColor(colorMap[type.color]);\n\n useEffect(() => {\n if (error) {\n setNodeDescription(null);\n setNodeLabel(null);\n setNodeIcon(null);\n }\n }, [error]);\n\n return (\n <StyledNodeTemplate\n aria-label={error \|\| label}\n onClick={(e: MouseEvent) => onClick?.(id, e)}\n onKeyDown={handleEnterKeyDown}\n ref={setNodeErrorToolTip}\n highlight={error ? true : highlight}\n error={error}\n id={`modeller-node-${id}`}\n {...restProps}\n >\n <Flex\n as={StyledNodeTemplateHeader}\n container={{ alignItems: 'center', pad: 1, justify: 'between' }}\n >\n <Flex container={{ alignItems: 'center' }}>\n <StyledIcon\n id={id}\n style={\n {\n '--bg-color': colorMap[type.color],\n '--fg-color': color\n } as CSSProperties\n }\n ref={setNodeIcon}\n >\n <Icon name={type.icon} />\n </StyledIcon>\n <Tooltip target={nodeIcon} hideDelay='none'>\n {cap(type.name)}\n </Tooltip>\n <StyledText variant='h4' ref={setNodeLabel}>\n {label}\n </StyledText>\n <Tooltip describeTarget={false} target={nodeLabel} hideDelay='none'>\n {label}\n </Tooltip>\n </Flex>\n\n {actionItems && (\n <MenuButton\n portal\n variant='simple'\n text={t('actions')}\n icon='more'\n iconOnly\n onClick={(e: MouseEvent) => e.stopPropagation()}\n onKeyDown={(e: KeyboardEvent) => e.stopPropagation()}\n menu={{\n items: actionItems\n }}\n />\n )}\n </Flex>\n {description && (\n <>\n <StyledNodeTempleteContent ref={setNodeDescription}>\n {description}\n </StyledNodeTempleteContent>\n <Tooltip describeTarget={false} target={nodeDescription} hideDelay='none'>\n {description}\n </Tooltip>\n </>\n )}\n {additionalData && (\n <StyledNodeTemplateFooter>\n <MetaList metadata={additionalData} />\n </StyledNodeTemplateFooter>\n )}\n {error && (\n <Tooltip target={nodeErrorToolTip} hideDelay='none'>\n {error}\n </Tooltip>\n )}\n </StyledNodeTemplate>\n );\n};\n\nexport const StartNode = ({ type, label }: PropsWithoutRef<NodeProps>) => {\n return (\n <Flex container={{ justify: 'center', direction: 'column' }}>\n <Flex as={StyledLabel} nodeType={type}>\n {label}\n </Flex>\n <Flex\n as={StyledCircle}\n style={\n {\n '--bg-color': colorMap[type.color]\n } as CSSProperties\n }\n tabIndex='0'\n aria-label={label}\n role='button'\n />\n </Flex>\n );\n};\n\nexport const EndNode = ({ type, label }: PropsWithoutRef<NodeProps>) => {\n return (\n <Flex container={{ justify: 'center', direction: 'column' }}>\n <Flex\n as={StyledCircle}\n style={\n {\n '--bg-color': colorMap[type.color]\n } as CSSProperties\n }\n tabIndex='0'\n aria-label={label}\n role='button'\n />\n <Flex as={StyledLabel} nodeType={type}>\n {label}\n </Flex>\n </Flex>\n );\n};\n"]}
1	+ {"version":3,"file":"NodeTemplates.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Node/NodeTemplates.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n PropsWithoutRef,\n CSSProperties,\n useCallback,\n MouseEvent,\n KeyboardEvent,\n FC,\n useEffect,\n useContext\n} from 'react';\nimport { readableColor } from 'polished';\n\nimport {\n MenuButton,\n Icon,\n Flex,\n Tooltip,\n useElement,\n useI18n,\n cap,\n Text\n} from '@pega/cosmos-react-core';\n\nimport { colorMap } from '../../../utils';\nimport FlowModellerContext from '../FlowModellerContext';\n\nimport {\n StyledLabel,\n StyledCircle,\n StyledIcon,\n StyledNodeTemplateHeader,\n StyledNodeTempleteContent,\n StyledNodeTemplate,\n StyledText,\n StyledTextWithEllipsis,\n StyledAdditionalData,\n StyledNodeTemplateFooter,\n StyledAdditionalDataItem\n} from './NodeTemplate.styles';\nimport { NodeProps, NodeComponentProps, AdditionalDataItemProps } from './Node.types';\n\nconst MetaListItem = ({ label, value }: AdditionalDataItemProps) => {\n const [nodeAdditionalDataItem, setNodeAdditionalDataItem] = useElement();\n return (\n <>\n <Flex\n as={StyledAdditionalDataItem}\n container={{ wrap: 'nowrap', pad: 0.25, gap: 0.25 }}\n item={{ grow: 1 }}\n ref={setNodeAdditionalDataItem}\n >\n <StyledTextWithEllipsis as='dd'>{label}</StyledTextWithEllipsis>\n <Text role='separator' variant='secondary' aria-hidden='true'>\n : \n </Text>\n <StyledTextWithEllipsis as='dt'>{value}</StyledTextWithEllipsis>\n </Flex>\n <Tooltip target={nodeAdditionalDataItem} hideDelay='none'>\n {`${label}:${value}`}\n </Tooltip>\n </>\n );\n};\n\nconst MetaList: FC<{ metadata: NodeProps['additionalData'] }> = ({ metadata }) => {\n const [nodeAdditionalData, setNodeAdditionalData] = useElement();\n let additionalDataValue = '';\n metadata?.forEach((item: AdditionalDataItemProps, index: number) => {\n if (index > 1) {\n additionalDataValue += `${item.label}: ${item.value}\n `;\n }\n });\n return (\n <Flex as={StyledAdditionalData} container={{ wrap: 'nowrap', colGap: 1, rowGap: 0.25 }}>\n {metadata?.map((data: AdditionalDataItemProps, index: number) => {\n if (index >= 2) {\n return;\n }\n return <MetaListItem key={data.id} {...data} />;\n })}\n {metadata && metadata.length > 2 && (\n <>\n <Flex\n as={StyledAdditionalDataItem}\n container={{ pad: 0.25 }}\n item={{ grow: 1, shrink: 0 }}\n ref={setNodeAdditionalData}\n >\n <StyledTextWithEllipsis as='dt'>{`+${metadata?.length - 2}`}</StyledTextWithEllipsis>\n </Flex>\n {additionalDataValue && (\n <Tooltip target={nodeAdditionalData} hideDelay='none'>\n {additionalDataValue}\n </Tooltip>\n )}\n </>\n )}\n </Flex>\n );\n};\nexport const DefaultNode = ({\n id,\n label,\n type,\n description,\n additionalData,\n actions,\n onActionClick,\n onClick,\n onDelete,\n highlight,\n error,\n ...restProps\n}: NodeComponentProps) => {\n const t = useI18n();\n\n const actionItems = actions?.map(actionItem => {\n return {\n id: actionItem.id,\n primary: actionItem.text,\n onClick: (actionId: string, e: MouseEvent) => {\n e.stopPropagation();\n onActionClick?.({ actionId, nodeId: id }, e);\n }\n };\n });\n\n if (onDelete !== undefined) {\n actionItems?.push({\n id: 'flowmodeller-delete-node',\n primary: t('delete'),\n onClick: (actionId: string, e: MouseEvent) => {\n e.stopPropagation();\n onDelete?.({ actionId, nodeId: id }, e);\n }\n });\n }\n\n const handleEnterKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n onClick?.(id, e);\n }\n },\n [onClick]\n );\n\n const [nodeLabel, setNodeLabel] = useElement();\n const [nodeDescription, setNodeDescription] = useElement();\n\n const [nodeIcon, setNodeIcon] = useElement();\n const [nodeErrorToolTip, setNodeErrorToolTip] = useElement();\n const color = readableColor(colorMap[type.color]);\n const { readOnly } = useContext(FlowModellerContext);\n\n useEffect(() => {\n if (error) {\n setNodeDescription(null);\n setNodeLabel(null);\n setNodeIcon(null);\n }\n }, [error]);\n\n return (\n <StyledNodeTemplate\n aria-label={error \|\| label}\n onClick={(e: MouseEvent) => onClick?.(id, e)}\n onKeyDown={handleEnterKeyDown}\n ref={setNodeErrorToolTip}\n highlight={error ? true : highlight}\n error={error}\n id={`modeller-node-${id}`}\n {...restProps}\n >\n <Flex\n as={StyledNodeTemplateHeader}\n container={{ alignItems: 'center', pad: 1, justify: 'between' }}\n >\n <Flex container={{ alignItems: 'center' }}>\n <StyledIcon\n id={id}\n style={\n {\n '--bg-color': colorMap[type.color],\n '--fg-color': color\n } as CSSProperties\n }\n ref={setNodeIcon}\n >\n <Icon name={type.icon} />\n </StyledIcon>\n <Tooltip target={nodeIcon} hideDelay='none'>\n {cap(type.name)}\n </Tooltip>\n <StyledText variant='h4' ref={setNodeLabel}>\n {label}\n </StyledText>\n <Tooltip describeTarget={false} target={nodeLabel} hideDelay='none'>\n {label}\n </Tooltip>\n </Flex>\n {!readOnly && actionItems && (\n <MenuButton\n portal\n variant='simple'\n text={t('actions')}\n icon='more'\n iconOnly\n onClick={(e: MouseEvent) => e.stopPropagation()}\n onKeyDown={(e: KeyboardEvent) => e.stopPropagation()}\n menu={{\n items: actionItems\n }}\n />\n )}\n </Flex>\n {description && (\n <>\n <StyledNodeTempleteContent ref={setNodeDescription}>\n {description}\n </StyledNodeTempleteContent>\n <Tooltip describeTarget={false} target={nodeDescription} hideDelay='none'>\n {description}\n </Tooltip>\n </>\n )}\n {additionalData && (\n <StyledNodeTemplateFooter>\n <MetaList metadata={additionalData} />\n </StyledNodeTemplateFooter>\n )}\n {error && (\n <Tooltip target={nodeErrorToolTip} hideDelay='none'>\n {error}\n </Tooltip>\n )}\n </StyledNodeTemplate>\n );\n};\n\nexport const StartNode = ({ type, label }: PropsWithoutRef<NodeProps>) => {\n return (\n <Flex container={{ justify: 'center', direction: 'column' }}>\n <Flex as={StyledLabel} nodeType={type}>\n {label}\n </Flex>\n <Flex\n as={StyledCircle}\n style={\n {\n '--bg-color': colorMap[type.color]\n } as CSSProperties\n }\n tabIndex='0'\n aria-label={label}\n role='button'\n />\n </Flex>\n );\n};\n\nexport const EndNode = ({ type, label }: PropsWithoutRef<NodeProps>) => {\n return (\n <Flex container={{ justify: 'center', direction: 'column' }}>\n <Flex\n as={StyledCircle}\n style={\n {\n '--bg-color': colorMap[type.color]\n } as CSSProperties\n }\n tabIndex='0'\n aria-label={label}\n role='button'\n />\n <Flex as={StyledLabel} nodeType={type}>\n {label}\n </Flex>\n </Flex>\n );\n};\n"]}

package/lib/components/FlowModeller/helper.d.ts CHANGED Viewed

@@ -11,7 +11,10 @@ export interface AddHelperParams {
     getNewConnector?: (fromNodeId: string, toNodeId: string) => ConnectorProps;
 }
 declare const helpers: {
-    addConnector(graphData: GraphData<NodeProps, ConnectorProps>, nodeId: string, label?: string | undefined, getNewConnector?: AddHelperParams['getNewConnector']): GraphData<NodeProps, ConnectorProps<unknown>>;
+    addConnector(graphData: GraphData<NodeProps, ConnectorProps>, nodeId: string, label?: string | undefined, getNewConnector?: AddHelperParams['getNewConnector']): {
+        graphData: GraphData<NodeProps, ConnectorProps<unknown>>;
+        connector: ConnectorProps<unknown>;
+    };
     deleteConnector: (graphData: GraphData<NodeProps, ConnectorProps>, connector: ConnectorProps) => DeleteNodeOutcome;
     addNode: ({ graphData, nodeType, metaData, getNewNode, getNewConnector, connectorsCount }: AddHelperParams) => GraphData<NodeProps, ConnectorProps<unknown>>;
     deleteNode(graphData: GraphData<NodeProps, ConnectorProps>, nodeId: string): DeleteNodeOutcome | false;

package/lib/components/FlowModeller/helper.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"helper.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/helper.ts"],"names":[],"mappings":"AAEA,OAAO,EAAiB,SAAS,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAClF,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAExD,OAAwB,EAAE,iBAAiB,EAAkB,MAAM,yBAAyB,CAAC;AAE7F,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,QAAQ,CAAC;IACnB,SAAS,EAAE,SAAS,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;IAChD,QAAQ,EAAE,oBAAoB,CAAC;IAC/B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,SAAS,CAAC;IAC7B,eAAe,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,cAAc,CAAC;CAC5E;AAED,QAAA,MAAM,OAAO;4BAEE,UAAU,SAAS,EAAE,cAAc,CAAC,UACvC,MAAM,gDAEI,eAAe,CAAC,iBAAiB,CAAC~~;iCAwBzB~~,UAAU,SAAS,EAAE,cAAc,CAAC,aAAa,cAAc;+FAiDzF,eAAe;0BAgEL,UAAU,SAAS,EAAE,cAAc,CAAC,UACvC,MAAM,GACb,iBAAiB,GAAG,KAAK;CAwC7B,CAAC;AAEF,eAAe,OAAO,CAAC"}
1	+ {"version":3,"file":"helper.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/helper.ts"],"names":[],"mappings":"AAEA,OAAO,EAAiB,SAAS,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAClF,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAExD,OAAwB,EAAE,iBAAiB,EAAkB,MAAM,yBAAyB,CAAC;AAE7F,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,QAAQ,CAAC;IACnB,SAAS,EAAE,SAAS,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;IAChD,QAAQ,EAAE,oBAAoB,CAAC;IAC/B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,SAAS,CAAC;IAC7B,eAAe,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,cAAc,CAAC;CAC5E;AAED,QAAA,MAAM,OAAO;4BAEE,UAAU,SAAS,EAAE,cAAc,CAAC,UACvC,MAAM,gDAEI,eAAe,CAAC,iBAAiB,CAAC;;;;iCA2BzB,UAAU,SAAS,EAAE,cAAc,CAAC,aAAa,cAAc;+FAiDzF,eAAe;0BAgEL,UAAU,SAAS,EAAE,cAAc,CAAC,UACvC,MAAM,GACb,iBAAiB,GAAG,KAAK;CAwC7B,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/lib/components/FlowModeller/helper.js CHANGED Viewed

@@ -6,8 +6,9 @@ const helpers = {
     addConnector(graphData, nodeId, label, getNewConnector) {
         const graph = new DirectedGraph(graphData);
         const convergeData = GraphTraversal.getConvergenceData(graphData, nodeId);
+        let newConnector;
         if (convergeData) {
-            const newConnector = getNewConnector
+            newConnector = getNewConnector
                 ? getNewConnector(nodeId, convergeData.nodeId)
                 : {
                     id: createUID(),
@@ -20,7 +21,10 @@ const helpers = {
         else {
             throw new Error('Invalid node, either the node does not exist or it does not support branches');
         }
-        return graph.getGraphData();
+        return {
+            graphData: graph.getGraphData(),
+            connector: newConnector
+        };
     },
     deleteConnector: (graphData, connector) => {
         const nodeId = connector.fromNodeId;

package/lib/components/FlowModeller/helper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"helper.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/helper.ts"],"names":[],"mappings":"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","sourcesContent":["import { createUID } from '@pega/cosmos-react-core';\n\nimport { DirectedGraph, GraphData, ConnectorProps } from './Renderer/Utils/Graph';\nimport { AddNodeHandlerParams } from './Renderer/Renderer.types';\nimport { NodeProps, NodeType } from './Node/Node.types';\nimport GraphTraversal from './Renderer/Utils/GraphTraversal';\nimport deleteNodeUtils, { DeleteNodeOutcome, GraphDataAsMap } from './Utils/deleteNodeUtils';\n\nexport interface AddHelperParams {\n nodeType: NodeType;\n graphData: GraphData<NodeProps, ConnectorProps>;\n metaData: AddNodeHandlerParams;\n connectorsCount?: number;\n getNewNode?: () => NodeProps;\n getNewConnector?: (fromNodeId: string, toNodeId: string) => ConnectorProps;\n}\n\nconst helpers = {\n addConnector(\n graphData: GraphData<NodeProps, ConnectorProps>,\n nodeId: string,\n label?: string,\n getNewConnector?: AddHelperParams['getNewConnector']\n ) {\n const graph = new DirectedGraph<NodeProps, ConnectorProps>(graphData);\n const convergeData = GraphTraversal.getConvergenceData(graphData, nodeId);\n\n if (convergeData) {\n const newConnector = getNewConnector\n ? getNewConnector(nodeId, convergeData.nodeId)\n : {\n id: createUID(),\n fromNodeId: nodeId,\n toNodeId: convergeData.nodeId,\n label: label \|\| ''\n };\n\n graph.addConnector(newConnector);\n } else {\n throw new Error(\n 'Invalid node, either the node does not exist or it does not support branches'\n );\n }\n\n return graph.getGraphData();\n },\n deleteConnector: (graphData: GraphData<NodeProps, ConnectorProps>, connector: ConnectorProps) => {\n const nodeId = connector.fromNodeId;\n\n const graph = new DirectedGraph(graphData);\n const deleteOptionsResult = deleteNodeUtils.getDeleteNodeOptions(graph, nodeId);\n const deleteOptions = deleteOptionsResult!.options;\n let targetBranch = null;\n let itemsToDelete: GraphDataAsMap = deleteOptionsResult!.allItems;\n targetBranch = deleteOptions.find(current => {\n if (connector.id === current.connector.id) {\n return true;\n }\n\n return false;\n });\n if (targetBranch) {\n itemsToDelete = targetBranch?.pathItems;\n }\n const resultGraphData = graph.getGraphData();\n // filter the highlighted nodes, including the selected node\n const nodes = resultGraphData.nodes.filter(item => {\n return itemsToDelete.nodes[item.id] === undefined;\n });\n // filter the highlighted connectors\n const connectors = resultGraphData.connectors.filter(item => {\n // if not in items to delete, add to list\n if (itemsToDelete.connectors[item.id] === undefined) {\n return true;\n }\n\n return false;\n });\n\n const outcome: DeleteNodeOutcome = {\n graphData: {\n nodes: nodes as NodeProps[],\n connectors\n },\n deletes: itemsToDelete\n };\n return outcome;\n },\n addNode: ({\n graphData,\n nodeType,\n metaData,\n getNewNode,\n getNewConnector,\n connectorsCount\n }: AddHelperParams) => {\n const graph = new DirectedGraph(graphData);\n\n const newNode = getNewNode\n ? getNewNode()\n : {\n ...nodeType.defaults.node,\n id: createUID(),\n type: nodeType\n };\n\n // add new node\n graph.addNode(newNode);\n\n let toNodeId = '';\n if (metaData.refType === 'connector') {\n if (!Array.isArray(metaData.refId)) {\n metaData.refId = [metaData.refId];\n }\n\n metaData.refId.forEach(conId => {\n const refConnector = graph.getConnector(conId);\n\n // backup current connectors toNodeId\n toNodeId = refConnector.toNodeId;\n\n // update the actual connector\n graph.setConnector(conId, {\n toNodeId: newNode.id\n });\n });\n } else if (metaData.refType === 'node') {\n toNodeId = metaData.refId as string;\n\n // iterate and update all in-connectors to point to the new node\n graph.getInConnectors(metaData.refId as string).forEach(con => {\n graph.setConnector(con.id, {\n toNodeId: newNode.id\n });\n });\n }\n\n let minConnectors = 1;\n if (connectorsCount !== undefined) {\n minConnectors = connectorsCount;\n } else {\n minConnectors = nodeType.minConnectors !== undefined ? nodeType.minConnectors : 1;\n }\n\n for (let i = 0; i < minConnectors; i += 1) {\n const newConnector = getNewConnector\n ? getNewConnector(newNode.id, toNodeId)\n : {\n id: createUID(),\n fromNodeId: newNode.id,\n toNodeId,\n label: nodeType.defaults?.connector[i].label\n };\n graph.addConnector(newConnector);\n }\n // return the updated graphData\n return graph.getGraphData();\n },\n deleteNode(\n graphData: GraphData<NodeProps, ConnectorProps>,\n nodeId: string\n ): DeleteNodeOutcome \| false {\n const graph = new DirectedGraph<NodeProps, ConnectorProps>(graphData);\n const outConnectors = graph.getOutConnectors(nodeId);\n\n if (outConnectors.length > 1) {\n return false;\n }\n\n const inConnectors = graph.getInConnectors(nodeId);\n\n const connectorUpdates: ConnectorProps[] = [];\n\n inConnectors.forEach(con => {\n graph.setConnector(con.id, {\n toNodeId: outConnectors[0].toNodeId\n });\n\n connectorUpdates.push(con);\n });\n\n graph.removeConnector(outConnectors[0].id);\n\n const node = graph.getNode(nodeId);\n graph.deleteNode(nodeId, true);\n\n const outcome: DeleteNodeOutcome = {\n graphData: graph.getGraphData(),\n deletes: {\n nodes: {\n [nodeId]: node\n },\n connectors: {}\n },\n updates: {\n connectors: connectorUpdates\n }\n };\n\n return outcome;\n }\n};\n\nexport default helpers;\n"]}
1	+ {"version":3,"file":"helper.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/helper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAEpD,OAAO,EAAE,aAAa,EAA6B,MAAM,wBAAwB,CAAC;AAGlF,OAAO,cAAc,MAAM,iCAAiC,CAAC;AAC7D,OAAO,eAAsD,MAAM,yBAAyB,CAAC;AAW7F,MAAM,OAAO,GAAG;IACd,YAAY,CACV,SAA+C,EAC/C,MAAc,EACd,KAAc,EACd,eAAoD;QAEpD,MAAM,KAAK,GAAG,IAAI,aAAa,CAA4B,SAAS,CAAC,CAAC;QACtE,MAAM,YAAY,GAAG,cAAc,CAAC,kBAAkB,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;QAC1E,IAAI,YAAY,CAAC;QACjB,IAAI,YAAY,EAAE;YAChB,YAAY,GAAG,eAAe;gBAC5B,CAAC,CAAC,eAAe,CAAC,MAAM,EAAE,YAAY,CAAC,MAAM,CAAC;gBAC9C,CAAC,CAAC;oBACE,EAAE,EAAE,SAAS,EAAE;oBACf,UAAU,EAAE,MAAM;oBAClB,QAAQ,EAAE,YAAY,CAAC,MAAM;oBAC7B,KAAK,EAAE,KAAK,IAAI,EAAE;iBACnB,CAAC;YAEN,KAAK,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;SAClC;aAAM;YACL,MAAM,IAAI,KAAK,CACb,8EAA8E,CAC/E,CAAC;SACH;QAED,OAAO;YACL,SAAS,EAAE,KAAK,CAAC,YAAY,EAAE;YAC/B,SAAS,EAAE,YAAY;SACxB,CAAC;IACJ,CAAC;IACD,eAAe,EAAE,CAAC,SAA+C,EAAE,SAAyB,EAAE,EAAE;QAC9F,MAAM,MAAM,GAAG,SAAS,CAAC,UAAU,CAAC;QAEpC,MAAM,KAAK,GAAG,IAAI,aAAa,CAAC,SAAS,CAAC,CAAC;QAC3C,MAAM,mBAAmB,GAAG,eAAe,CAAC,oBAAoB,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;QAChF,MAAM,aAAa,GAAG,mBAAoB,CAAC,OAAO,CAAC;QACnD,IAAI,YAAY,GAAG,IAAI,CAAC;QACxB,IAAI,aAAa,GAAmB,mBAAoB,CAAC,QAAQ,CAAC;QAClE,YAAY,GAAG,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE;YAC1C,IAAI,SAAS,CAAC,EAAE,KAAK,OAAO,CAAC,SAAS,CAAC,EAAE,EAAE;gBACzC,OAAO,IAAI,CAAC;aACb;YAED,OAAO,KAAK,CAAC;QACf,CAAC,CAAC,CAAC;QACH,IAAI,YAAY,EAAE;YAChB,aAAa,GAAG,YAAY,EAAE,SAAS,CAAC;SACzC;QACD,MAAM,eAAe,GAAG,KAAK,CAAC,YAAY,EAAE,CAAC;QAC7C,4DAA4D;QAC5D,MAAM,KAAK,GAAG,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE;YAChD,OAAO,aAAa,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,SAAS,CAAC;QACpD,CAAC,CAAC,CAAC;QACH,oCAAoC;QACpC,MAAM,UAAU,GAAG,eAAe,CAAC,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE;YAC1D,yCAAyC;YACzC,IAAI,aAAa,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,SAAS,EAAE;gBACnD,OAAO,IAAI,CAAC;aACb;YAED,OAAO,KAAK,CAAC;QACf,CAAC,CAAC,CAAC;QAEH,MAAM,OAAO,GAAsB;YACjC,SAAS,EAAE;gBACT,KAAK,EAAE,KAAoB;gBAC3B,UAAU;aACX;YACD,OAAO,EAAE,aAAa;SACvB,CAAC;QACF,OAAO,OAAO,CAAC;IACjB,CAAC;IACD,OAAO,EAAE,CAAC,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,eAAe,EACf,eAAe,EACC,EAAE,EAAE;QACpB,MAAM,KAAK,GAAG,IAAI,aAAa,CAAC,SAAS,CAAC,CAAC;QAE3C,MAAM,OAAO,GAAG,UAAU;YACxB,CAAC,CAAC,UAAU,EAAE;YACd,CAAC,CAAC;gBACE,GAAG,QAAQ,CAAC,QAAQ,CAAC,IAAI;gBACzB,EAAE,EAAE,SAAS,EAAE;gBACf,IAAI,EAAE,QAAQ;aACf,CAAC;QAEN,eAAe;QACf,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;QAEvB,IAAI,QAAQ,GAAG,EAAE,CAAC;QAClB,IAAI,QAAQ,CAAC,OAAO,KAAK,WAAW,EAAE;YACpC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;gBAClC,QAAQ,CAAC,KAAK,GAAG,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;aACnC;YAED,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;gBAC7B,MAAM,YAAY,GAAG,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;gBAE/C,qCAAqC;gBACrC,QAAQ,GAAG,YAAY,CAAC,QAAQ,CAAC;gBAEjC,8BAA8B;gBAC9B,KAAK,CAAC,YAAY,CAAC,KAAK,EAAE;oBACxB,QAAQ,EAAE,OAAO,CAAC,EAAE;iBACrB,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;SACJ;aAAM,IAAI,QAAQ,CAAC,OAAO,KAAK,MAAM,EAAE;YACtC,QAAQ,GAAG,QAAQ,CAAC,KAAe,CAAC;YAEpC,gEAAgE;YAChE,KAAK,CAAC,eAAe,CAAC,QAAQ,CAAC,KAAe,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;gBAC5D,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,EAAE;oBACzB,QAAQ,EAAE,OAAO,CAAC,EAAE;iBACrB,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;SACJ;QAED,IAAI,aAAa,GAAG,CAAC,CAAC;QACtB,IAAI,eAAe,KAAK,SAAS,EAAE;YACjC,aAAa,GAAG,eAAe,CAAC;SACjC;aAAM;YACL,aAAa,GAAG,QAAQ,CAAC,aAAa,KAAK,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC;SACnF;QAED,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,aAAa,EAAE,CAAC,IAAI,CAAC,EAAE;YACzC,MAAM,YAAY,GAAG,eAAe;gBAClC,CAAC,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,EAAE,QAAQ,CAAC;gBACvC,CAAC,CAAC;oBACE,EAAE,EAAE,SAAS,EAAE;oBACf,UAAU,EAAE,OAAO,CAAC,EAAE;oBACtB,QAAQ;oBACR,KAAK,EAAE,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,KAAK;iBAC7C,CAAC;YACN,KAAK,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC;SAClC;QACD,+BAA+B;QAC/B,OAAO,KAAK,CAAC,YAAY,EAAE,CAAC;IAC9B,CAAC;IACD,UAAU,CACR,SAA+C,EAC/C,MAAc;QAEd,MAAM,KAAK,GAAG,IAAI,aAAa,CAA4B,SAAS,CAAC,CAAC;QACtE,MAAM,aAAa,GAAG,KAAK,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC;QAErD,IAAI,aAAa,CAAC,MAAM,GAAG,CAAC,EAAE;YAC5B,OAAO,KAAK,CAAC;SACd;QAED,MAAM,YAAY,GAAG,KAAK,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;QAEnD,MAAM,gBAAgB,GAAqB,EAAE,CAAC;QAE9C,YAAY,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;YACzB,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,EAAE;gBACzB,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC,QAAQ;aACpC,CAAC,CAAC;YAEH,gBAAgB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAC7B,CAAC,CAAC,CAAC;QAEH,KAAK,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;QAE3C,MAAM,IAAI,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QACnC,KAAK,CAAC,UAAU,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;QAE/B,MAAM,OAAO,GAAsB;YACjC,SAAS,EAAE,KAAK,CAAC,YAAY,EAAE;YAC/B,OAAO,EAAE;gBACP,KAAK,EAAE;oBACL,CAAC,MAAM,CAAC,EAAE,IAAI;iBACf;gBACD,UAAU,EAAE,EAAE;aACf;YACD,OAAO,EAAE;gBACP,UAAU,EAAE,gBAAgB;aAC7B;SACF,CAAC;QAEF,OAAO,OAAO,CAAC;IACjB,CAAC;CACF,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["import { createUID } from '@pega/cosmos-react-core';\n\nimport { DirectedGraph, GraphData, ConnectorProps } from './Renderer/Utils/Graph';\nimport { AddNodeHandlerParams } from './Renderer/Renderer.types';\nimport { NodeProps, NodeType } from './Node/Node.types';\nimport GraphTraversal from './Renderer/Utils/GraphTraversal';\nimport deleteNodeUtils, { DeleteNodeOutcome, GraphDataAsMap } from './Utils/deleteNodeUtils';\n\nexport interface AddHelperParams {\n nodeType: NodeType;\n graphData: GraphData<NodeProps, ConnectorProps>;\n metaData: AddNodeHandlerParams;\n connectorsCount?: number;\n getNewNode?: () => NodeProps;\n getNewConnector?: (fromNodeId: string, toNodeId: string) => ConnectorProps;\n}\n\nconst helpers = {\n addConnector(\n graphData: GraphData<NodeProps, ConnectorProps>,\n nodeId: string,\n label?: string,\n getNewConnector?: AddHelperParams['getNewConnector']\n ) {\n const graph = new DirectedGraph<NodeProps, ConnectorProps>(graphData);\n const convergeData = GraphTraversal.getConvergenceData(graphData, nodeId);\n let newConnector;\n if (convergeData) {\n newConnector = getNewConnector\n ? getNewConnector(nodeId, convergeData.nodeId)\n : {\n id: createUID(),\n fromNodeId: nodeId,\n toNodeId: convergeData.nodeId,\n label: label \|\| ''\n };\n\n graph.addConnector(newConnector);\n } else {\n throw new Error(\n 'Invalid node, either the node does not exist or it does not support branches'\n );\n }\n\n return {\n graphData: graph.getGraphData(),\n connector: newConnector\n };\n },\n deleteConnector: (graphData: GraphData<NodeProps, ConnectorProps>, connector: ConnectorProps) => {\n const nodeId = connector.fromNodeId;\n\n const graph = new DirectedGraph(graphData);\n const deleteOptionsResult = deleteNodeUtils.getDeleteNodeOptions(graph, nodeId);\n const deleteOptions = deleteOptionsResult!.options;\n let targetBranch = null;\n let itemsToDelete: GraphDataAsMap = deleteOptionsResult!.allItems;\n targetBranch = deleteOptions.find(current => {\n if (connector.id === current.connector.id) {\n return true;\n }\n\n return false;\n });\n if (targetBranch) {\n itemsToDelete = targetBranch?.pathItems;\n }\n const resultGraphData = graph.getGraphData();\n // filter the highlighted nodes, including the selected node\n const nodes = resultGraphData.nodes.filter(item => {\n return itemsToDelete.nodes[item.id] === undefined;\n });\n // filter the highlighted connectors\n const connectors = resultGraphData.connectors.filter(item => {\n // if not in items to delete, add to list\n if (itemsToDelete.connectors[item.id] === undefined) {\n return true;\n }\n\n return false;\n });\n\n const outcome: DeleteNodeOutcome = {\n graphData: {\n nodes: nodes as NodeProps[],\n connectors\n },\n deletes: itemsToDelete\n };\n return outcome;\n },\n addNode: ({\n graphData,\n nodeType,\n metaData,\n getNewNode,\n getNewConnector,\n connectorsCount\n }: AddHelperParams) => {\n const graph = new DirectedGraph(graphData);\n\n const newNode = getNewNode\n ? getNewNode()\n : {\n ...nodeType.defaults.node,\n id: createUID(),\n type: nodeType\n };\n\n // add new node\n graph.addNode(newNode);\n\n let toNodeId = '';\n if (metaData.refType === 'connector') {\n if (!Array.isArray(metaData.refId)) {\n metaData.refId = [metaData.refId];\n }\n\n metaData.refId.forEach(conId => {\n const refConnector = graph.getConnector(conId);\n\n // backup current connectors toNodeId\n toNodeId = refConnector.toNodeId;\n\n // update the actual connector\n graph.setConnector(conId, {\n toNodeId: newNode.id\n });\n });\n } else if (metaData.refType === 'node') {\n toNodeId = metaData.refId as string;\n\n // iterate and update all in-connectors to point to the new node\n graph.getInConnectors(metaData.refId as string).forEach(con => {\n graph.setConnector(con.id, {\n toNodeId: newNode.id\n });\n });\n }\n\n let minConnectors = 1;\n if (connectorsCount !== undefined) {\n minConnectors = connectorsCount;\n } else {\n minConnectors = nodeType.minConnectors !== undefined ? nodeType.minConnectors : 1;\n }\n\n for (let i = 0; i < minConnectors; i += 1) {\n const newConnector = getNewConnector\n ? getNewConnector(newNode.id, toNodeId)\n : {\n id: createUID(),\n fromNodeId: newNode.id,\n toNodeId,\n label: nodeType.defaults?.connector[i].label\n };\n graph.addConnector(newConnector);\n }\n // return the updated graphData\n return graph.getGraphData();\n },\n deleteNode(\n graphData: GraphData<NodeProps, ConnectorProps>,\n nodeId: string\n ): DeleteNodeOutcome \| false {\n const graph = new DirectedGraph<NodeProps, ConnectorProps>(graphData);\n const outConnectors = graph.getOutConnectors(nodeId);\n\n if (outConnectors.length > 1) {\n return false;\n }\n\n const inConnectors = graph.getInConnectors(nodeId);\n\n const connectorUpdates: ConnectorProps[] = [];\n\n inConnectors.forEach(con => {\n graph.setConnector(con.id, {\n toNodeId: outConnectors[0].toNodeId\n });\n\n connectorUpdates.push(con);\n });\n\n graph.removeConnector(outConnectors[0].id);\n\n const node = graph.getNode(nodeId);\n graph.deleteNode(nodeId, true);\n\n const outcome: DeleteNodeOutcome = {\n graphData: graph.getGraphData(),\n deletes: {\n nodes: {\n [nodeId]: node\n },\n connectors: {}\n },\n updates: {\n connectors: connectorUpdates\n }\n };\n\n return outcome;\n }\n};\n\nexport default helpers;\n"]}

package/lib/components/FlowModeller/index.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
-export { default, FlowModellerProps } from './FlowModeller';
+export { default } from './FlowModeller';
+export { FlowModellerProps } from './FlowModeller.types';
 export { ActionParams, NodeProps, NodeType, NodeLibraryItem, START_NODETYPE, STOP_NODETYPE } from './Node/Node.types';
 export { default as FlowRenderer } from './Renderer/Renderer';
 export { RendererProps, RendererConnectorProps, RendererNodeProps, AddNodeHandlerParams } from './Renderer/Renderer.types';

package/lib/components/FlowModeller/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,iBAAiB,EAAE,MAAM,~~gBAAgB~~,CAAC;~~AAC5D~~,OAAO,EACL,YAAY,EACZ,SAAS,EACT,QAAQ,EACR,eAAe,EACf,cAAc,EACd,aAAa,EACd,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAC9D,OAAO,EACL,aAAa,EACb,sBAAsB,EACtB,iBAAiB,EACjB,oBAAoB,EACrB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAC5E,OAAO,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AACvF,OAAO,EACL,OAAO,IAAI,iBAAiB,EAC5B,sBAAsB,EACtB,iBAAiB,EACjB,oBAAoB,EACpB,eAAe,EAChB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,UAAU,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EACL,YAAY,EACZ,SAAS,EACT,QAAQ,EACR,eAAe,EACf,cAAc,EACd,aAAa,EACd,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAC9D,OAAO,EACL,aAAa,EACb,sBAAsB,EACtB,iBAAiB,EACjB,oBAAoB,EACrB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAC5E,OAAO,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AACvF,OAAO,EACL,OAAO,IAAI,iBAAiB,EAC5B,sBAAsB,EACtB,iBAAiB,EACjB,oBAAoB,EACpB,eAAe,EAChB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,UAAU,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC"}

package/lib/components/FlowModeller/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,~~EAAqB~~,MAAM,gBAAgB,CAAC;~~AAC5D~~,OAAO,EAKL,cAAc,EACd,aAAa,EACd,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAO9D,OAAO,EAAE,aAAa,EAA6B,MAAM,wBAAwB,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAE5E,OAAO,EACL,OAAO,IAAI,iBAAiB,EAC5B,sBAAsB,EACtB,iBAAiB,EAGlB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,UAAU,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,eAAe,EAAqB,MAAM,yBAAyB,CAAC","sourcesContent":["export { default, FlowModellerProps } from './FlowModeller';\nexport {\n ActionParams,\n NodeProps,\n NodeType,\n NodeLibraryItem,\n START_NODETYPE,\n STOP_NODETYPE\n} from './Node/Node.types';\nexport { default as FlowRenderer } from './Renderer/Renderer';\nexport {\n RendererProps,\n RendererConnectorProps,\n RendererNodeProps,\n AddNodeHandlerParams\n} from './Renderer/Renderer.types';\nexport { DirectedGraph, GraphData, ConnectorProps } from './Renderer/Utils/Graph';\nexport { default as GraphTraversal } from './Renderer/Utils/GraphTraversal';\nexport { PlottedGraphConnector, PlottedGraphNode } from './Renderer/Utils/GraphLayout';\nexport {\n default as PlaceHolderHelper,\n isPlaceHolderConnector,\n isPlaceHolderNode,\n PlaceHolderConnector,\n PlaceHolderNode\n} from './Utils/addNodeUtils';\nexport { default as FlowModellerHelper } from './helper';\nexport { default as DeletePopover } from './DeletePopover';\nexport { default as Connector } from './Connector';\nexport { default as Node } from './Node';\nexport { default as deleteNodeUtils, DeleteNodeOutcome } from './Utils/deleteNodeUtils';\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEzC,OAAO,EAKL,cAAc,EACd,aAAa,EACd,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAO9D,OAAO,EAAE,aAAa,EAA6B,MAAM,wBAAwB,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,iCAAiC,CAAC;AAE5E,OAAO,EACL,OAAO,IAAI,iBAAiB,EAC5B,sBAAsB,EACtB,iBAAiB,EAGlB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,UAAU,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,eAAe,EAAqB,MAAM,yBAAyB,CAAC","sourcesContent":["export { default } from './FlowModeller';\nexport { FlowModellerProps } from './FlowModeller.types';\nexport {\n ActionParams,\n NodeProps,\n NodeType,\n NodeLibraryItem,\n START_NODETYPE,\n STOP_NODETYPE\n} from './Node/Node.types';\nexport { default as FlowRenderer } from './Renderer/Renderer';\nexport {\n RendererProps,\n RendererConnectorProps,\n RendererNodeProps,\n AddNodeHandlerParams\n} from './Renderer/Renderer.types';\nexport { DirectedGraph, GraphData, ConnectorProps } from './Renderer/Utils/Graph';\nexport { default as GraphTraversal } from './Renderer/Utils/GraphTraversal';\nexport { PlottedGraphConnector, PlottedGraphNode } from './Renderer/Utils/GraphLayout';\nexport {\n default as PlaceHolderHelper,\n isPlaceHolderConnector,\n isPlaceHolderNode,\n PlaceHolderConnector,\n PlaceHolderNode\n} from './Utils/addNodeUtils';\nexport { default as FlowModellerHelper } from './helper';\nexport { default as DeletePopover } from './DeletePopover';\nexport { default as Connector } from './Connector';\nexport { default as Node } from './Node';\nexport { default as deleteNodeUtils, DeleteNodeOutcome } from './Utils/deleteNodeUtils';\n"]}

package/lib/components/ItemLibrary/ItemLibrary.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ItemLibrary.d.ts","sourceRoot":"","sources":["../../../src/components/ItemLibrary/ItemLibrary.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,EAAE,EAGF,GAAG,EAOJ,MAAM,OAAO,CAAC;AAIf,OAAO,EACL,gBAAgB,EAChB,YAAY,EAKZ,aAAa,EAMb,YAAY,EACb,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAY,SAAS,EAAE,MAAM,aAAa,CAAC;AAElD,MAAM,WAAW,WAAY,SAAQ,aAAa;IAChD,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,CAAC,EAAE,WAAW,EAAE,CAAC;CACvB;AACD,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;CACd;AACD,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW;IACnE,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,CAAC,KAAK,IAAI,CAAC;IAC/B,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,QAAQ,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;CACtC;AAED,eAAO,MAAM,UAAU,yGAWrB,CAAC;~~AAQH~~,QAAA,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,GAAG,YAAY,~~CAiGpD~~,CAAC;AAEF,eAAe,WAAW,CAAC"}
1	+ {"version":3,"file":"ItemLibrary.d.ts","sourceRoot":"","sources":["../../../src/components/ItemLibrary/ItemLibrary.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,EAAE,EAGF,GAAG,EAOJ,MAAM,OAAO,CAAC;AAIf,OAAO,EACL,gBAAgB,EAChB,YAAY,EAKZ,aAAa,EAMb,YAAY,EACb,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAY,SAAS,EAAE,MAAM,aAAa,CAAC;AAElD,MAAM,WAAW,WAAY,SAAQ,aAAa;IAChD,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,CAAC,EAAE,WAAW,EAAE,CAAC;CACvB;AACD,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;CACd;AACD,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW;IACnE,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,OAAO,CAAC,EAAE,CAAC,OAAO,EAAE,CAAC,KAAK,IAAI,CAAC;IAC/B,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,QAAQ,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;CACtC;AAED,eAAO,MAAM,UAAU,yGAWrB,CAAC;AAIH,QAAA,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,GAAG,YAAY,CAkGpD,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/lib/components/ItemLibrary/ItemLibrary.js CHANGED Viewed

@@ -17,9 +17,6 @@ export const StyledIcon = styled.div(({ theme }) => {
   `;
 });
 StyledIcon.defaultProps = defaultThemeProp;
-const StyledPopover = styled(Popover) `
-  min-width: 40ch;
-`;
 const ItemLibrary = forwardRef(({ show, target, items, onClick, placeholder, position = 'bottom-start' }, ref) => {
     const [search, setSearch] = useState('');
     const searchEleRef = useRef(null);
@@ -59,7 +56,7 @@ const ItemLibrary = forwardRef(({ show, target, items, onClick, placeholder, pos
             onClick(selectedNode);
         }
     }, [onClick]);
-    return (_jsx(_Fragment, { children: show && (_jsx(StyledPopover, { show: show, placement: position, target: target, ref: ref, children: _jsx(Menu, { items: itemsToRender, onItemClick: onItemSelect, header: _jsx(SearchInput, { ref: searchEleRef, onSearchChange: setSearch, value: search, searchInputAriaLabel: placeholder, placeholder: placeholder }), focusControlEl: searchEleRef.current || undefined }) })) }));
+    return (_jsx(_Fragment, { children: show && (_jsx(Popover, { show: show, placement: position, target: target, ref: ref, children: _jsx(Menu, { items: itemsToRender, onItemClick: onItemSelect, header: _jsx(SearchInput, { ref: searchEleRef, onSearchChange: setSearch, value: search, searchInputAriaLabel: placeholder, placeholder: placeholder }), focusControlEl: searchEleRef.current || undefined }) })) }));
 });
 export default ItemLibrary;
 //# sourceMappingURL=ItemLibrary.js.map

package/lib/components/ItemLibrary/ItemLibrary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ItemLibrary.js","sourceRoot":"","sources":["../../../src/components/ItemLibrary/ItemLibrary.tsx"],"names":[],"mappings":";AAAA,OAAO,EAEL,UAAU,EAGV,WAAW,EACX,SAAS,EACT,OAAO,EACP,MAAM,EACN,QAAQ,EAET,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,OAAO,EAGL,IAAI,EACJ,IAAI,EAEJ,WAAW,EAEX,OAAO,EACP,WAAW,EACX,GAAG,EACH,mBAAmB,EACnB,gBAAgB,EAEjB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,QAAQ,EAAa,MAAM,aAAa,CAAC;AAqBlD,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACjD,OAAO,GAAG,CAAA;;;0BAGc,KAAK,CAAC,IAAI,CAAC,OAAO;yBACnB,KAAK,CAAC,IAAI,CAAC,OAAO;;;;qBAItB,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;GAC7C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,~~aAAa,GAAmB,MAAM,CAAC,OAAO,CAAC,CAAA;;CAEpD,CAAC;AAEF,MAAM,~~WAAW,GAAwC,UAAU,CACjE,CACE,EACE,IAAI,EACJ,MAAM,EACN,KAAK,EACL,OAAO,EACP,WAAW,EACX,QAAQ,GAAG,cAAc,EACS,EACpC,GAA4B,EAC5B,EAAE;IACF,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAEzC,MAAM,YAAY,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAEpD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,EAAE;YACR,SAAS,CAAC,EAAE,CAAC,CAAC;YACd,YAAY,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;SAChC;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC;IAEjC,MAAM,WAAW,GAAG,OAAO,CACzB,GAAG,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,mBAAmB,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,UAAU,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EACxE,CAAC,MAAM,CAAC,CACT,CAAC;IAEF,MAAM,aAAa,GAAuC,OAAO,CAAC,GAAG,EAAE;QACrE,OAAO,WAAW,CAAC,OAAO,CACxB,WAAW;YACT,CAAC,CAAC,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,OAAO,EAAiB,EAAE,EAAE;gBAC/D,OAAO,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACnC,CAAC,CAAC;YACJ,CAAC,CAAC,KAAK,EACT,IAAI,CAAC,EAAE;YACL,IAAI,UAAU,GAAG,KAAK,CAAC;YACvB,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;gBACf,UAAU,GAAG,IAAI,CAAC;aACnB;YAED,MAAM,QAAQ,GAAgB,IAAmB,CAAC;YAClD,OAAO;gBACL,GAAG,IAAI;gBACP,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CACtB,KAAC,UAAU,IACT,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,KAAK,EACH;wBACE,YAAY,EAAE,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;wBAC3C,YAAY,EAAE,aAAa,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;qBAC1C,YAGpB,KAAC,IAAI,IAAC,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC,IAAI,GAAI,GACvB,CACd,CAAC,CAAC,CAAC,SAAS;gBACb,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;gBACjD,SAAS,EAAE,IAAI,CAAC,SAAS;gBACzB,QAAQ,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;aACnD,CAAC;QACJ,CAAC,CACF,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC;IAEzB,MAAM,YAAY,GAAG,WAAW,CAC9B,CAAC,EAAuB,EAAE,EAAE;QAC1B,MAAM,YAAY,GAAG,WAAW,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAgB,CAAC;QACnE,IAAI,OAAO,EAAE;YACX,OAAO,CAAC,YAAY,CAAC,CAAC;SACvB;IACH,CAAC,EACD,CAAC,OAAO,CAAC,CACV,CAAC;~~IACF~~,OAAO,CACL,4BACG,IAAI,IAAI,CACP,KAAC,~~aAAa~~,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,~~YACtE~~,KAAC,IAAI,IACH,KAAK,EAAE,aAAa,EACpB,WAAW,EAAE,YAAY,EACzB,MAAM,EACJ,KAAC,WAAW,IACV,GAAG,EAAE,YAAY,EACjB,cAAc,EAAE,SAAS,EACzB,KAAK,EAAE,MAAM,EACb,oBAAoB,EAAE,WAAW,EACjC,WAAW,EAAE,WAAW,GACxB,EAEJ,cAAc,EAAE,YAAY,CAAC,OAAO,IAAI,SAAS,GACjD,~~GACY~~,~~CACjB~~,GACA,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import {\n FC,\n forwardRef,\n PropsWithoutRef,\n Ref,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n CSSProperties\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport {\n SearchInputProps,\n ForwardProps,\n Icon,\n Menu,\n MenuGroupProps,\n menuHelpers,\n MenuItemProps,\n Popover,\n SearchInput,\n cap,\n createStringMatcher,\n defaultThemeProp,\n PopoverProps\n} from '@pega/cosmos-react-core';\n\nimport { colorMap, ColorName } from '../../utils';\n\nexport interface LibraryItem extends MenuItemProps {\n id: string;\n type: ItemVisual;\n items?: LibraryItem[];\n}\nexport interface ItemVisual {\n color: ColorName;\n icon: string;\n}\nexport interface ItemLibraryProps<T extends LibraryItem = LibraryItem> {\n show: boolean;\n target: HTMLElement \| null;\n items: T[];\n onClick?: (libItem: T) => void;\n ref?: Ref<HTMLDivElement>;\n placeholder?: SearchInputProps['placeholder'];\n position?: PopoverProps['placement'];\n}\n\nexport const StyledIcon = styled.div(({ theme }) => {\n return css`\n min-height: 2rem;\n min-width: 2rem;\n padding: calc(0.5 * ${theme.base.spacing});\n margin-inline-end: ${theme.base.spacing};\n text-align: center;\n background-color: var(--bg-color);\n color: var(--fg-color);\n border-radius: ${theme.base['border-radius']};\n `;\n});\n\nStyledIcon.defaultProps = defaultThemeProp;\n\nconst ~~StyledPopover: typeof Popover = styled(Popover)`\n min-width: 40ch;\n`;\n\nconst~~ ItemLibrary: FC<ItemLibraryProps & ForwardProps> = forwardRef(\n (\n {\n show,\n target,\n items,\n onClick,\n placeholder,\n position = 'bottom-start'\n }: PropsWithoutRef<ItemLibraryProps>,\n ref: ItemLibraryProps['ref']\n ) => {\n const [search, setSearch] = useState('');\n\n const searchEleRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (show) {\n setSearch('');\n searchEleRef?.current?.focus();\n }\n }, [show, searchEleRef.current]);\n\n const searchRegex = useMemo(\n () => (search ? createStringMatcher(cap(search), 'contains', '') : null),\n [search]\n );\n\n const itemsToRender: (MenuItemProps \| MenuGroupProps)[] = useMemo(() => {\n return menuHelpers.mapTree(\n searchRegex\n ? menuHelpers.flatten(items).filter(({ primary }: MenuItemProps) => {\n return searchRegex.test(primary);\n })\n : items,\n node => {\n let selectable = false;\n if (!node.items) {\n selectable = true;\n }\n\n const nodeItem: LibraryItem = node as LibraryItem;\n return {\n ...node,\n visual: nodeItem.type ? (\n <StyledIcon\n id={node.id}\n style={\n {\n '--bg-color': colorMap[nodeItem.type.color],\n '--fg-color': readableColor(colorMap[nodeItem.type.color])\n } as CSSProperties\n }\n >\n <Icon name={nodeItem.type.icon} />\n </StyledIcon>\n ) : undefined,\n count: node.items ? node.items.length : undefined,\n secondary: node.secondary,\n selected: selectable ? !!node.selected : undefined\n };\n }\n );\n }, [items, searchRegex]);\n\n const onItemSelect = useCallback(\n (id: MenuItemProps['id']) => {\n const selectedNode = menuHelpers.getItem(items, id) as LibraryItem;\n if (onClick) {\n onClick(selectedNode);\n }\n },\n [onClick]\n );\n return (\n <>\n {show && (\n <~~StyledPopover~~ show={show} placement={position} target={target} ref={ref}>\n <Menu\n items={itemsToRender}\n onItemClick={onItemSelect}\n header={\n <SearchInput\n ref={searchEleRef}\n onSearchChange={setSearch}\n value={search}\n searchInputAriaLabel={placeholder}\n placeholder={placeholder}\n />\n }\n focusControlEl={searchEleRef.current \|\| undefined}\n />\n </~~StyledPopover~~>\n )}\n </>\n );\n }\n);\n\nexport default ItemLibrary;\n"]}
1	+ {"version":3,"file":"ItemLibrary.js","sourceRoot":"","sources":["../../../src/components/ItemLibrary/ItemLibrary.tsx"],"names":[],"mappings":";AAAA,OAAO,EAEL,UAAU,EAGV,WAAW,EACX,SAAS,EACT,OAAO,EACP,MAAM,EACN,QAAQ,EAET,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,OAAO,EAGL,IAAI,EACJ,IAAI,EAEJ,WAAW,EAEX,OAAO,EACP,WAAW,EACX,GAAG,EACH,mBAAmB,EACnB,gBAAgB,EAEjB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,QAAQ,EAAa,MAAM,aAAa,CAAC;AAqBlD,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACjD,OAAO,GAAG,CAAA;;;0BAGc,KAAK,CAAC,IAAI,CAAC,OAAO;yBACnB,KAAK,CAAC,IAAI,CAAC,OAAO;;;;qBAItB,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;GAC7C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,WAAW,GAAwC,UAAU,CACjE,CACE,EACE,IAAI,EACJ,MAAM,EACN,KAAK,EACL,OAAO,EACP,WAAW,EACX,QAAQ,GAAG,cAAc,EACS,EACpC,GAA4B,EAC5B,EAAE;IACF,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAEzC,MAAM,YAAY,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAEpD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,EAAE;YACR,SAAS,CAAC,EAAE,CAAC,CAAC;YACd,YAAY,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;SAChC;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC;IAEjC,MAAM,WAAW,GAAG,OAAO,CACzB,GAAG,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,mBAAmB,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,UAAU,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EACxE,CAAC,MAAM,CAAC,CACT,CAAC;IAEF,MAAM,aAAa,GAAuC,OAAO,CAAC,GAAG,EAAE;QACrE,OAAO,WAAW,CAAC,OAAO,CACxB,WAAW;YACT,CAAC,CAAC,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,OAAO,EAAiB,EAAE,EAAE;gBAC/D,OAAO,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACnC,CAAC,CAAC;YACJ,CAAC,CAAC,KAAK,EACT,IAAI,CAAC,EAAE;YACL,IAAI,UAAU,GAAG,KAAK,CAAC;YACvB,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;gBACf,UAAU,GAAG,IAAI,CAAC;aACnB;YAED,MAAM,QAAQ,GAAgB,IAAmB,CAAC;YAClD,OAAO;gBACL,GAAG,IAAI;gBACP,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CACtB,KAAC,UAAU,IACT,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,KAAK,EACH;wBACE,YAAY,EAAE,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC;wBAC3C,YAAY,EAAE,aAAa,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;qBAC1C,YAGpB,KAAC,IAAI,IAAC,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC,IAAI,GAAI,GACvB,CACd,CAAC,CAAC,CAAC,SAAS;gBACb,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;gBACjD,SAAS,EAAE,IAAI,CAAC,SAAS;gBACzB,QAAQ,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;aACnD,CAAC;QACJ,CAAC,CACF,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC;IAEzB,MAAM,YAAY,GAAG,WAAW,CAC9B,CAAC,EAAuB,EAAE,EAAE;QAC1B,MAAM,YAAY,GAAG,WAAW,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAgB,CAAC;QACnE,IAAI,OAAO,EAAE;YACX,OAAO,CAAC,YAAY,CAAC,CAAC;SACvB;IACH,CAAC,EACD,CAAC,OAAO,CAAC,CACV,CAAC;IAEF,OAAO,CACL,4BACG,IAAI,IAAI,CACP,KAAC,OAAO,IAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,YAChE,KAAC,IAAI,IACH,KAAK,EAAE,aAAa,EACpB,WAAW,EAAE,YAAY,EACzB,MAAM,EACJ,KAAC,WAAW,IACV,GAAG,EAAE,YAAY,EACjB,cAAc,EAAE,SAAS,EACzB,KAAK,EAAE,MAAM,EACb,oBAAoB,EAAE,WAAW,EACjC,WAAW,EAAE,WAAW,GACxB,EAEJ,cAAc,EAAE,YAAY,CAAC,OAAO,IAAI,SAAS,GACjD,GACM,CACX,GACA,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import {\n FC,\n forwardRef,\n PropsWithoutRef,\n Ref,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n CSSProperties\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport {\n SearchInputProps,\n ForwardProps,\n Icon,\n Menu,\n MenuGroupProps,\n menuHelpers,\n MenuItemProps,\n Popover,\n SearchInput,\n cap,\n createStringMatcher,\n defaultThemeProp,\n PopoverProps\n} from '@pega/cosmos-react-core';\n\nimport { colorMap, ColorName } from '../../utils';\n\nexport interface LibraryItem extends MenuItemProps {\n id: string;\n type: ItemVisual;\n items?: LibraryItem[];\n}\nexport interface ItemVisual {\n color: ColorName;\n icon: string;\n}\nexport interface ItemLibraryProps<T extends LibraryItem = LibraryItem> {\n show: boolean;\n target: HTMLElement \| null;\n items: T[];\n onClick?: (libItem: T) => void;\n ref?: Ref<HTMLDivElement>;\n placeholder?: SearchInputProps['placeholder'];\n position?: PopoverProps['placement'];\n}\n\nexport const StyledIcon = styled.div(({ theme }) => {\n return css`\n min-height: 2rem;\n min-width: 2rem;\n padding: calc(0.5 * ${theme.base.spacing});\n margin-inline-end: ${theme.base.spacing};\n text-align: center;\n background-color: var(--bg-color);\n color: var(--fg-color);\n border-radius: ${theme.base['border-radius']};\n `;\n});\n\nStyledIcon.defaultProps = defaultThemeProp;\n\nconst ItemLibrary: FC<ItemLibraryProps & ForwardProps> = forwardRef(\n (\n {\n show,\n target,\n items,\n onClick,\n placeholder,\n position = 'bottom-start'\n }: PropsWithoutRef<ItemLibraryProps>,\n ref: ItemLibraryProps['ref']\n ) => {\n const [search, setSearch] = useState('');\n\n const searchEleRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (show) {\n setSearch('');\n searchEleRef?.current?.focus();\n }\n }, [show, searchEleRef.current]);\n\n const searchRegex = useMemo(\n () => (search ? createStringMatcher(cap(search), 'contains', '') : null),\n [search]\n );\n\n const itemsToRender: (MenuItemProps \| MenuGroupProps)[] = useMemo(() => {\n return menuHelpers.mapTree(\n searchRegex\n ? menuHelpers.flatten(items).filter(({ primary }: MenuItemProps) => {\n return searchRegex.test(primary);\n })\n : items,\n node => {\n let selectable = false;\n if (!node.items) {\n selectable = true;\n }\n\n const nodeItem: LibraryItem = node as LibraryItem;\n return {\n ...node,\n visual: nodeItem.type ? (\n <StyledIcon\n id={node.id}\n style={\n {\n '--bg-color': colorMap[nodeItem.type.color],\n '--fg-color': readableColor(colorMap[nodeItem.type.color])\n } as CSSProperties\n }\n >\n <Icon name={nodeItem.type.icon} />\n </StyledIcon>\n ) : undefined,\n count: node.items ? node.items.length : undefined,\n secondary: node.secondary,\n selected: selectable ? !!node.selected : undefined\n };\n }\n );\n }, [items, searchRegex]);\n\n const onItemSelect = useCallback(\n (id: MenuItemProps['id']) => {\n const selectedNode = menuHelpers.getItem(items, id) as LibraryItem;\n if (onClick) {\n onClick(selectedNode);\n }\n },\n [onClick]\n );\n\n return (\n <>\n {show && (\n <Popover show={show} placement={position} target={target} ref={ref}>\n <Menu\n items={itemsToRender}\n onItemClick={onItemSelect}\n header={\n <SearchInput\n ref={searchEleRef}\n onSearchChange={setSearch}\n value={search}\n searchInputAriaLabel={placeholder}\n placeholder={placeholder}\n />\n }\n focusControlEl={searchEleRef.current \|\| undefined}\n />\n </Popover>\n )}\n </>\n );\n }\n);\n\nexport default ItemLibrary;\n"]}

package/lib/components/ObjectPreview/ObjectPreview.d.ts CHANGED Viewed

@@ -4,7 +4,7 @@ import { PageHeaderProps } from '@pega/cosmos-react-build/lib/components/PageTem
 export interface ObjectPreviewProps extends Pick<DrawerProps, 'onAfterOpen' | 'onAfterClose' | 'onBeforeOpen' | 'onBeforeClose'> {
     open?: boolean;
     header: OmitStrict<PageHeaderProps, 'status'>;
-    primaryAction: Action;
+    primaryAction?: Action;
     secondaryAction?: Action;
     additionalActions?: ActionsProps;
     content: ReactNode;

package/lib/components/ObjectPreview/ObjectPreview.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ObjectPreview.d.ts","sourceRoot":"","sources":["../../../src/components/ObjectPreview/ObjectPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,EAAE,EAEF,eAAe,EACf,SAAS,EACT,GAAG,EAIJ,MAAM,OAAO,CAAC;AAGf,OAAO,EACL,MAAM,EAEN,YAAY,EAGZ,YAAY,EAGZ,UAAU,EAIV,WAAW,EACZ,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,eAAe,EAGhB,MAAM,qEAAqE,CAAC;AAE7E,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,WAAW,EAAE,aAAa,GAAG,cAAc,GAAG,cAAc,GAAG,eAAe,CAAC;IAC5F,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,UAAU,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAC;IAC9C,aAAa,EAAE,MAAM,CAAC;~~IACtB~~,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,YAAY,CAAC;IACjC,OAAO,EAAE,SAAS,CAAC;IACnB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;~~AA+CD~~,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,GAAG,YAAY,CAyCzE,CAAC;AAEF,eAAe,aAAa,CAAC"}
1	+ {"version":3,"file":"ObjectPreview.d.ts","sourceRoot":"","sources":["../../../src/components/ObjectPreview/ObjectPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,EAAE,EAEF,eAAe,EACf,SAAS,EACT,GAAG,EAIJ,MAAM,OAAO,CAAC;AAGf,OAAO,EACL,MAAM,EAEN,YAAY,EAGZ,YAAY,EAGZ,UAAU,EAIV,WAAW,EACZ,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,eAAe,EAGhB,MAAM,qEAAqE,CAAC;AAE7E,MAAM,WAAW,kBACf,SAAQ,IAAI,CAAC,WAAW,EAAE,aAAa,GAAG,cAAc,GAAG,cAAc,GAAG,eAAe,CAAC;IAC5F,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,UAAU,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAC;IAC9C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,YAAY,CAAC;IACjC,OAAO,EAAE,SAAS,CAAC;IACnB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAiDD,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,GAAG,YAAY,CAyCzE,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/components/ObjectPreview/ObjectPreview.js CHANGED Viewed

@@ -9,7 +9,7 @@ const StyledObjectPreview = styled(Drawer) `
 `;
 const PreviewHeader = ({ header, primaryAction, secondaryAction, additionalActions, onDismiss, dismissButtonRef }) => {
     const t = useI18n();
-    return (_jsxs(Flex, { container: { direction: 'column', rowGap: 1 }, children: [_jsxs(Flex, { container: { justify: 'between' }, children: [_jsx(Button, { icon: true, variant: 'simple', ref: dismissButtonRef, label: t('dismiss_label_a11y'), onClick: onDismiss, children: _jsx(Icon, { name: 'times' }) }), _jsxs(Flex, { container: true, children: [secondaryAction && (_jsx(Button, { onClick: secondaryAction.onClick, children: secondaryAction.text })), _jsx(Button, { variant: 'primary', onClick: primaryAction.onClick, children: primaryAction.text }), additionalActions && _jsx(Actions, { ...additionalActions })] })] }), _jsx(PageHeader, { ...header, titleTag: 'h2' })] }));
+    return (_jsxs(Flex, { container: { direction: 'column', rowGap: 1 }, children: [_jsxs(Flex, { container: { justify: 'between' }, children: [_jsx(Button, { icon: true, variant: 'simple', ref: dismissButtonRef, label: t('dismiss_label_a11y'), onClick: onDismiss, children: _jsx(Icon, { name: 'times' }) }), _jsxs(Flex, { container: true, children: [secondaryAction && (_jsx(Button, { onClick: secondaryAction.onClick, children: secondaryAction.text })), primaryAction && (_jsx(Button, { variant: 'primary', onClick: primaryAction.onClick, children: primaryAction.text })), additionalActions && _jsx(Actions, { ...additionalActions })] })] }), _jsx(PageHeader, { ...header, titleTag: 'h2' })] }));
 };
 const ObjectPreview = forwardRef(({ content, header, open, onAfterOpen, onAfterClose, onBeforeOpen, onBeforeClose, ...restprops }, ref) => {
     const contentRef = useConsolidatedRef(ref);

package/lib/components/ObjectPreview/ObjectPreview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ObjectPreview.js","sourceRoot":"","sources":["../../../src/components/ObjectPreview/ObjectPreview.tsx"],"names":[],"mappings":";AAAA,OAAO,EAEL,UAAU,EAIV,MAAM,EACN,SAAS,EAEV,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAEL,OAAO,EAEP,MAAM,EACN,IAAI,EAEJ,IAAI,EACJ,aAAa,EAEb,MAAM,EACN,OAAO,EACP,kBAAkB,EAEnB,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAEL,UAAU,EACV,UAAU,EACX,MAAM,qEAAqE,CAAC;AAc7E,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAA;;;CAGzC,CAAC;AAEF,MAAM,aAAa,GAIf,CAAC,EACH,MAAM,EACN,aAAa,EACb,eAAe,EACf,iBAAiB,EACjB,SAAS,EACT,gBAAgB,EACjB,EAAE,EAAE;IACH,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC,EAAE,aACjD,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,aACrC,KAAC,MAAM,IACL,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,GAAG,EAAE,gBAAgB,EACrB,KAAK,EAAE,CAAC,CAAC,oBAAoB,CAAC,EAC9B,OAAO,EAAE,SAAS,YAElB,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,EACT,MAAC,IAAI,IAAC,SAAS,mBACZ,eAAe,IAAI,CAClB,KAAC,MAAM,IAAC,OAAO,EAAE,eAAe,CAAC,OAAO,YAAG,eAAe,CAAC,IAAI,GAAU,CAC1E,~~EACD~~,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,EAAC,OAAO,EAAE,aAAa,CAAC,OAAO,YACrD,aAAa,CAAC,IAAI,GACZ,~~EACR~~,iBAAiB,IAAI,KAAC,OAAO,OAAK,iBAAiB,GAAI,IACnD,IACF,EACP,KAAC,UAAU,OAAK,MAAM,EAAE,QAAQ,EAAC,IAAI,GAAG,IACnC,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,aAAa,GAA2D,UAAU,CACtF,CACE,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,GAAG,SAAS,EAAE,EAC/F,GAA8B,EAC9B,EAAE;IACF,MAAM,UAAU,GAAG,kBAAkB,CAAiB,GAAG,CAAC,CAAC;IAC3D,MAAM,gBAAgB,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAEzD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,IAAI,UAAU,CAAC,OAAO,EAAE;YAC9B,UAAU,CAAC,OAAO,EAAE,aAAa,CAAC,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC;SACtD;IACH,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,OAAO,CACL,KAAC,mBAAmB,IAClB,GAAG,EAAE,UAAU,EACf,IAAI,EAAE,CAAC,CAAC,IAAI,EACZ,cAAc,QACd,QAAQ,EAAC,OAAO,EAChB,IAAI,EAAC,KAAK,EACV,MAAM,QACN,SAAS,EAAC,OAAO,EACjB,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,aAAa,YAE5B,KAAC,aAAa,IACZ,GAAG,EAAE,UAAU,EACf,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,EAAE,EAAE,UAAU,EACd,MAAM,EACJ,KAAC,aAAa,IAAC,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,EAAE,MAAM,KAAM,SAAS,GAAI,EAEtF,aAAa,QACb,CAAC,EAAE,OAAO,GACV,GACkB,CACvB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import {\n FC,\n forwardRef,\n PropsWithoutRef,\n ReactNode,\n Ref,\n useRef,\n useEffect,\n RefObject\n} from 'react';\nimport styled from 'styled-components';\n\nimport {\n Action,\n Actions,\n ActionsProps,\n Button,\n Flex,\n ForwardProps,\n Icon,\n OneColumnPage,\n OmitStrict,\n Drawer,\n useI18n,\n useConsolidatedRef,\n DrawerProps\n} from '@pega/cosmos-react-core';\nimport {\n PageHeaderProps,\n PageHeader,\n StyledPage\n} from '@pega/cosmos-react-build/lib/components/PageTemplates/PageTemplates';\n\nexport interface ObjectPreviewProps\n extends Pick<DrawerProps, 'onAfterOpen' \| 'onAfterClose' \| 'onBeforeOpen' \| 'onBeforeClose'> {\n open?: boolean;\n header: OmitStrict<PageHeaderProps, 'status'>;\n primaryAction: Action;\n secondaryAction?: Action;\n additionalActions?: ActionsProps;\n content: ReactNode;\n onDismiss: () => void;\n ref?: Ref<HTMLDivElement>;\n}\n\nconst StyledObjectPreview = styled(Drawer)`\n height: calc(100vh - 3rem);\n top: 3rem;\n`;\n\nconst PreviewHeader: FC<\n OmitStrict<ObjectPreviewProps, 'ref' \| 'content' \| 'open'> & {\n dismissButtonRef: RefObject<HTMLButtonElement>;\n }\n> = ({\n header,\n primaryAction,\n secondaryAction,\n additionalActions,\n onDismiss,\n dismissButtonRef\n}) => {\n const t = useI18n();\n return (\n <Flex container={{ direction: 'column', rowGap: 1 }}>\n <Flex container={{ justify: 'between' }}>\n <Button\n icon\n variant='simple'\n ref={dismissButtonRef}\n label={t('dismiss_label_a11y')}\n onClick={onDismiss}\n >\n <Icon name='times' />\n </Button>\n <Flex container>\n {secondaryAction && (\n <Button onClick={secondaryAction.onClick}>{secondaryAction.text}</Button>\n )}\n <Button variant='primary' onClick={primaryAction.onClick}>\n {primaryAction.text}\n </Button>\n {additionalActions && <Actions {...additionalActions} />}\n </Flex>\n </Flex>\n <PageHeader {...header} titleTag='h2' />\n </Flex>\n );\n};\n\nconst ObjectPreview: FC<PropsWithoutRef<ObjectPreviewProps> & ForwardProps> = forwardRef(\n (\n { content, header, open, onAfterOpen, onAfterClose, onBeforeOpen, onBeforeClose, ...restprops },\n ref: ObjectPreviewProps['ref']\n ) => {\n const contentRef = useConsolidatedRef<HTMLDivElement>(ref);\n const dismissButtonRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (open && contentRef.current) {\n contentRef.current?.querySelector('button')?.focus();\n }\n }, [open]);\n\n return (\n <StyledObjectPreview\n ref={contentRef}\n open={!!open}\n nullWhenClosed\n position='fixed'\n size='30%'\n shadow\n placement='right'\n onAfterOpen={onAfterOpen}\n onAfterClose={onAfterClose}\n onBeforeOpen={onBeforeOpen}\n onBeforeClose={onBeforeClose}\n >\n <OneColumnPage\n ref={contentRef}\n title={header.title}\n as={StyledPage}\n header={\n <PreviewHeader dismissButtonRef={dismissButtonRef} header={header} {...restprops} />\n }\n scrollContent\n a={content}\n />\n </StyledObjectPreview>\n );\n }\n);\n\nexport default ObjectPreview;\n"]}
1	+ {"version":3,"file":"ObjectPreview.js","sourceRoot":"","sources":["../../../src/components/ObjectPreview/ObjectPreview.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FC,\n forwardRef,\n PropsWithoutRef,\n ReactNode,\n Ref,\n useRef,\n useEffect,\n RefObject\n} from 'react';\nimport styled from 'styled-components';\n\nimport {\n Action,\n Actions,\n ActionsProps,\n Button,\n Flex,\n ForwardProps,\n Icon,\n OneColumnPage,\n OmitStrict,\n Drawer,\n useI18n,\n useConsolidatedRef,\n DrawerProps\n} from '@pega/cosmos-react-core';\nimport {\n PageHeaderProps,\n PageHeader,\n StyledPage\n} from '@pega/cosmos-react-build/lib/components/PageTemplates/PageTemplates';\n\nexport interface ObjectPreviewProps\n extends Pick<DrawerProps, 'onAfterOpen' \| 'onAfterClose' \| 'onBeforeOpen' \| 'onBeforeClose'> {\n open?: boolean;\n header: OmitStrict<PageHeaderProps, 'status'>;\n primaryAction?: Action;\n secondaryAction?: Action;\n additionalActions?: ActionsProps;\n content: ReactNode;\n onDismiss: () => void;\n ref?: Ref<HTMLDivElement>;\n}\n\nconst StyledObjectPreview = styled(Drawer)`\n height: calc(100vh - 3rem);\n top: 3rem;\n`;\n\nconst PreviewHeader: FC<\n OmitStrict<ObjectPreviewProps, 'ref' \| 'content' \| 'open'> & {\n dismissButtonRef: RefObject<HTMLButtonElement>;\n }\n> = ({\n header,\n primaryAction,\n secondaryAction,\n additionalActions,\n onDismiss,\n dismissButtonRef\n}) => {\n const t = useI18n();\n return (\n <Flex container={{ direction: 'column', rowGap: 1 }}>\n <Flex container={{ justify: 'between' }}>\n <Button\n icon\n variant='simple'\n ref={dismissButtonRef}\n label={t('dismiss_label_a11y')}\n onClick={onDismiss}\n >\n <Icon name='times' />\n </Button>\n <Flex container>\n {secondaryAction && (\n <Button onClick={secondaryAction.onClick}>{secondaryAction.text}</Button>\n )}\n {primaryAction && (\n <Button variant='primary' onClick={primaryAction.onClick}>\n {primaryAction.text}\n </Button>\n )}\n {additionalActions && <Actions {...additionalActions} />}\n </Flex>\n </Flex>\n <PageHeader {...header} titleTag='h2' />\n </Flex>\n );\n};\n\nconst ObjectPreview: FC<PropsWithoutRef<ObjectPreviewProps> & ForwardProps> = forwardRef(\n (\n { content, header, open, onAfterOpen, onAfterClose, onBeforeOpen, onBeforeClose, ...restprops },\n ref: ObjectPreviewProps['ref']\n ) => {\n const contentRef = useConsolidatedRef<HTMLDivElement>(ref);\n const dismissButtonRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (open && contentRef.current) {\n contentRef.current?.querySelector('button')?.focus();\n }\n }, [open]);\n\n return (\n <StyledObjectPreview\n ref={contentRef}\n open={!!open}\n nullWhenClosed\n position='fixed'\n size='30%'\n shadow\n placement='right'\n onAfterOpen={onAfterOpen}\n onAfterClose={onAfterClose}\n onBeforeOpen={onBeforeOpen}\n onBeforeClose={onBeforeClose}\n >\n <OneColumnPage\n ref={contentRef}\n title={header.title}\n as={StyledPage}\n header={\n <PreviewHeader dismissButtonRef={dismissButtonRef} header={header} {...restprops} />\n }\n scrollContent\n a={content}\n />\n </StyledObjectPreview>\n );\n }\n);\n\nexport default ObjectPreview;\n"]}

package/lib/components/PageTemplates/PageTemplates.js CHANGED Viewed

@@ -4,7 +4,7 @@ import styled, { css } from 'styled-components';
 import { OneColumnPage as CoreOneColumnPage, TabbedPage as CoreTabbedPage, Flex, Status, SummaryItem, Text, Button, Popover, FieldValueList, Icon, defaultThemeProp, useI18n, useDirection, useElement, useOuterEvent, StyledSummaryItemActions, registerIcon, StyledRegion, MetaList, StyledBreadcrumbs, StyledPageHeader } from '@pega/cosmos-react-core';
 import * as nodesDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/nodes-down.icon';
 import * as informationIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/information.icon';
-import { StyledForm } from '@pega/cosmos-react-core/lib/components/Form/Form';
+import { StyledForm } from '@pega/cosmos-react-core/lib/components/MultiStepForm/MultiStepForm';
 import { StyledWorkbench } from '../Workbench/Workbench.styles';
 registerIcon(nodesDownIcon, informationIcon);
 const StyledTextWithEllipsis = styled(Text) `

package/lib/components/PageTemplates/PageTemplates.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PageTemplates.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplates.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n PropsWithoutRef,\n Ref,\n FunctionComponent,\n forwardRef,\n useState,\n useEffect,\n MouseEvent,\n useMemo\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n OneColumnPage as CoreOneColumnPage,\n OneColumnPageProps as CoreOneColumnPageProps,\n TabbedPage as CoreTabbedPage,\n TabbedPageProps as CoreTabbedPageProps,\n FieldValueListProps,\n Flex,\n Status,\n SummaryItem,\n Text,\n Button,\n Popover,\n FieldValueList,\n Icon,\n ForwardProps,\n defaultThemeProp,\n useI18n,\n useDirection,\n useElement,\n useOuterEvent,\n PageTemplateProps,\n OmitStrict,\n StyledSummaryItemActions,\n StatusProps,\n registerIcon,\n StyledRegion,\n MetaList,\n StyledBreadcrumbs,\n StyledPageHeader\n} from '@pega/cosmos-react-core';\nimport * as nodesDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/nodes-down.icon';\nimport * as informationIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/information.icon';\nimport { StyledForm } from '@pega/cosmos-react-core/lib/components/Form/Form';\n\nimport { StyledWorkbench } from '../Workbench/Workbench.styles';\n\nregisterIcon(nodesDownIcon, informationIcon);\n\nexport interface PageHeaderProps extends Pick<PageTemplateProps, 'title' \| 'actions'> {\n metadata?: FieldValueListProps['fields'];\n status?: { type: StatusProps['variant']; label: string };\n titleTag?: 'h1' \| 'h2';\n additionalInfo?: {\n title: string;\n description?: string;\n fields: FieldValueListProps['fields'];\n onEdit?: (e: MouseEvent<HTMLButtonElement>) => void;\n };\n}\n\ntype OmittedPageProps = 'header' \| 'scrollContent';\n\nexport interface OneColumnPageProps\n extends OmitStrict<CoreOneColumnPageProps, OmittedPageProps>,\n PageHeaderProps {}\n\nexport interface TabbedPageProps\n extends OmitStrict<CoreTabbedPageProps, OmittedPageProps>,\n PageHeaderProps {}\n\nconst StyledTextWithEllipsis: typeof Text = styled(Text)`\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n line-height: 1.15;\n`;\n\nconst StyledInfoPopover: typeof Popover = styled(Popover)`\n max-width: 60ch;\n overflow-wrap: break-word;\n`;\n\nconst StyledHeaderContent = styled(SummaryItem)`\n ${StyledSummaryItemActions} {\n align-self: start;\n }\n`;\n\nexport const StyledPage = styled.div(\n ({\n theme: {\n base: {\n spacing,\n palette: { 'primary-background': primaryBackground }\n }\n }\n }) => {\n return css`\n background: ${primaryBackground};\n height: 100%;\n\n ${StyledRegion} ${StyledWorkbench} {\n position: absolute;\n width: 100%;\n margin: 0 calc(-2 * ${spacing});\n }\n\n ${StyledRegion} ${StyledForm} {\n max-width: 80ch;\n }\n\n ${StyledPageHeader} > ${StyledBreadcrumbs} {\n margin-block-end: 0;\n }\n `;\n }\n);\n\nStyledPage.defaultProps = defaultThemeProp;\n\nexport const PageHeader = ({\n title,\n metadata,\n additionalInfo,\n actions,\n status,\n titleTag\n}: PageHeaderProps) => {\n const [open, setOpen] = useState(false);\n const [popoverEl, setPopoverRef] = useElement<HTMLElement>();\n const [buttonEl, setButtonEl] = useElement<HTMLElement>();\n const t = useI18n();\n const { rtl } = useDirection();\n\n useOuterEvent('mousedown', [popoverEl, buttonEl], () => {\n if (open) setOpen(false);\n });\n\n useEffect(() => {\n const closePopover = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n e.preventDefault();\n setOpen(false);\n if (e.currentTarget === popoverEl) {\n e.stopPropagation();\n buttonEl?.focus();\n }\n }\n };\n\n document.addEventListener('keydown', closePopover);\n popoverEl?.addEventListener('keydown', closePopover);\n\n return () => {\n document.removeEventListener('keydown', closePopover);\n popoverEl?.removeEventListener('keydown', closePopover);\n };\n }, [popoverEl]);\n\n const metaListItems = useMemo(\n () => metadata?.map(({ name, value }) => `${name}: ${value}`),\n [metadata]\n );\n\n return (\n <StyledHeaderContent\n container\n primary={\n <Flex container={{ alignItems: 'center', gap: 0.5, wrap: 'wrap' }}>\n <Flex container={{ gap: 0.5 }} item={{ shrink: 0 }}>\n <StyledTextWithEllipsis variant='h1' forwardedAs={titleTag}>\n {title}\n </StyledTextWithEllipsis>\n {additionalInfo && (\n <>\n <Button\n label={t('additional_info')}\n variant='simple'\n icon\n ref={setButtonEl}\n onClick={() => setOpen(cur => !cur)}\n >\n <Icon name='information' />\n </Button>\n <StyledInfoPopover\n ref={setPopoverRef}\n show={open}\n target={buttonEl}\n placement={rtl ? 'bottom-end' : 'bottom-start'}\n >\n <Flex container={{ direction: 'column', alignItems: 'start', gap: 2, pad: 2 }}>\n <Flex container={{ direction: 'column', gap: 1 }}>\n <Text variant='h3'>{additionalInfo.title}</Text>\n {additionalInfo.description && (\n <Text as='p'>{additionalInfo.description}</Text>\n )}\n <FieldValueList variant='inline' fields={additionalInfo.fields} />\n </Flex>\n {additionalInfo.onEdit && (\n <Button\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n setOpen(false);\n additionalInfo.onEdit?.(e);\n }}\n >\n {t('edit_details')}\n </Button>\n )}\n </Flex>\n </StyledInfoPopover>\n </>\n )}\n </Flex>\n {status && <Status variant={status.type}>{status.label}</Status>}\n </Flex>\n }\n secondary={metaListItems && <MetaList items={metaListItems} />}\n actions={actions}\n />\n );\n};\n\nexport const TabbedPage: FunctionComponent<TabbedPageProps & ForwardProps> = forwardRef(\n ({ tabs, ...restProps }: PropsWithoutRef<TabbedPageProps>, ref: Ref<HTMLDivElement>) => {\n return (\n <CoreTabbedPage\n {...restProps}\n as={StyledPage}\n header={<PageHeader {...restProps} />}\n tabs={tabs}\n ref={ref}\n scrollContent\n />\n );\n }\n);\n\nexport const OneColumnPage: FunctionComponent<OneColumnPageProps & ForwardProps> = forwardRef(\n (\n {\n a,\n\n ...restProps\n }: PropsWithoutRef<OneColumnPageProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n return (\n <CoreOneColumnPage\n {...restProps}\n as={StyledPage}\n header={<PageHeader {...restProps} />}\n scrollContent\n a={a}\n ref={ref}\n />\n );\n }\n);\n"]}
1	+ {"version":3,"file":"PageTemplates.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplates.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n PropsWithoutRef,\n Ref,\n FunctionComponent,\n forwardRef,\n useState,\n useEffect,\n MouseEvent,\n useMemo\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n OneColumnPage as CoreOneColumnPage,\n OneColumnPageProps as CoreOneColumnPageProps,\n TabbedPage as CoreTabbedPage,\n TabbedPageProps as CoreTabbedPageProps,\n FieldValueListProps,\n Flex,\n Status,\n SummaryItem,\n Text,\n Button,\n Popover,\n FieldValueList,\n Icon,\n ForwardProps,\n defaultThemeProp,\n useI18n,\n useDirection,\n useElement,\n useOuterEvent,\n PageTemplateProps,\n OmitStrict,\n StyledSummaryItemActions,\n StatusProps,\n registerIcon,\n StyledRegion,\n MetaList,\n StyledBreadcrumbs,\n StyledPageHeader\n} from '@pega/cosmos-react-core';\nimport * as nodesDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/nodes-down.icon';\nimport * as informationIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/information.icon';\nimport { StyledForm } from '@pega/cosmos-react-core/lib/components/MultiStepForm/MultiStepForm';\n\nimport { StyledWorkbench } from '../Workbench/Workbench.styles';\n\nregisterIcon(nodesDownIcon, informationIcon);\n\nexport interface PageHeaderProps extends Pick<PageTemplateProps, 'title' \| 'actions'> {\n metadata?: FieldValueListProps['fields'];\n status?: { type: StatusProps['variant']; label: string };\n titleTag?: 'h1' \| 'h2';\n additionalInfo?: {\n title: string;\n description?: string;\n fields: FieldValueListProps['fields'];\n onEdit?: (e: MouseEvent<HTMLButtonElement>) => void;\n };\n}\n\ntype OmittedPageProps = 'header' \| 'scrollContent';\n\nexport interface OneColumnPageProps\n extends OmitStrict<CoreOneColumnPageProps, OmittedPageProps>,\n PageHeaderProps {}\n\nexport interface TabbedPageProps\n extends OmitStrict<CoreTabbedPageProps, OmittedPageProps>,\n PageHeaderProps {}\n\nconst StyledTextWithEllipsis: typeof Text = styled(Text)`\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n line-height: 1.15;\n`;\n\nconst StyledInfoPopover: typeof Popover = styled(Popover)`\n max-width: 60ch;\n overflow-wrap: break-word;\n`;\n\nconst StyledHeaderContent = styled(SummaryItem)`\n ${StyledSummaryItemActions} {\n align-self: start;\n }\n`;\n\nexport const StyledPage = styled.div(\n ({\n theme: {\n base: {\n spacing,\n palette: { 'primary-background': primaryBackground }\n }\n }\n }) => {\n return css`\n background: ${primaryBackground};\n height: 100%;\n\n ${StyledRegion} ${StyledWorkbench} {\n position: absolute;\n width: 100%;\n margin: 0 calc(-2 * ${spacing});\n }\n\n ${StyledRegion} ${StyledForm} {\n max-width: 80ch;\n }\n\n ${StyledPageHeader} > ${StyledBreadcrumbs} {\n margin-block-end: 0;\n }\n `;\n }\n);\n\nStyledPage.defaultProps = defaultThemeProp;\n\nexport const PageHeader = ({\n title,\n metadata,\n additionalInfo,\n actions,\n status,\n titleTag\n}: PageHeaderProps) => {\n const [open, setOpen] = useState(false);\n const [popoverEl, setPopoverRef] = useElement<HTMLElement>();\n const [buttonEl, setButtonEl] = useElement<HTMLElement>();\n const t = useI18n();\n const { rtl } = useDirection();\n\n useOuterEvent('mousedown', [popoverEl, buttonEl], () => {\n if (open) setOpen(false);\n });\n\n useEffect(() => {\n const closePopover = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n e.preventDefault();\n setOpen(false);\n if (e.currentTarget === popoverEl) {\n e.stopPropagation();\n buttonEl?.focus();\n }\n }\n };\n\n document.addEventListener('keydown', closePopover);\n popoverEl?.addEventListener('keydown', closePopover);\n\n return () => {\n document.removeEventListener('keydown', closePopover);\n popoverEl?.removeEventListener('keydown', closePopover);\n };\n }, [popoverEl]);\n\n const metaListItems = useMemo(\n () => metadata?.map(({ name, value }) => `${name}: ${value}`),\n [metadata]\n );\n\n return (\n <StyledHeaderContent\n container\n primary={\n <Flex container={{ alignItems: 'center', gap: 0.5, wrap: 'wrap' }}>\n <Flex container={{ gap: 0.5 }} item={{ shrink: 0 }}>\n <StyledTextWithEllipsis variant='h1' forwardedAs={titleTag}>\n {title}\n </StyledTextWithEllipsis>\n {additionalInfo && (\n <>\n <Button\n label={t('additional_info')}\n variant='simple'\n icon\n ref={setButtonEl}\n onClick={() => setOpen(cur => !cur)}\n >\n <Icon name='information' />\n </Button>\n <StyledInfoPopover\n ref={setPopoverRef}\n show={open}\n target={buttonEl}\n placement={rtl ? 'bottom-end' : 'bottom-start'}\n >\n <Flex container={{ direction: 'column', alignItems: 'start', gap: 2, pad: 2 }}>\n <Flex container={{ direction: 'column', gap: 1 }}>\n <Text variant='h3'>{additionalInfo.title}</Text>\n {additionalInfo.description && (\n <Text as='p'>{additionalInfo.description}</Text>\n )}\n <FieldValueList variant='inline' fields={additionalInfo.fields} />\n </Flex>\n {additionalInfo.onEdit && (\n <Button\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n setOpen(false);\n additionalInfo.onEdit?.(e);\n }}\n >\n {t('edit_details')}\n </Button>\n )}\n </Flex>\n </StyledInfoPopover>\n </>\n )}\n </Flex>\n {status && <Status variant={status.type}>{status.label}</Status>}\n </Flex>\n }\n secondary={metaListItems && <MetaList items={metaListItems} />}\n actions={actions}\n />\n );\n};\n\nexport const TabbedPage: FunctionComponent<TabbedPageProps & ForwardProps> = forwardRef(\n ({ tabs, ...restProps }: PropsWithoutRef<TabbedPageProps>, ref: Ref<HTMLDivElement>) => {\n return (\n <CoreTabbedPage\n {...restProps}\n as={StyledPage}\n header={<PageHeader {...restProps} />}\n tabs={tabs}\n ref={ref}\n scrollContent\n />\n );\n }\n);\n\nexport const OneColumnPage: FunctionComponent<OneColumnPageProps & ForwardProps> = forwardRef(\n (\n {\n a,\n\n ...restProps\n }: PropsWithoutRef<OneColumnPageProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n return (\n <CoreOneColumnPage\n {...restProps}\n as={StyledPage}\n header={<PageHeader {...restProps} />}\n scrollContent\n a={a}\n ref={ref}\n />\n );\n }\n);\n"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@pega/cosmos-react-build",
-  "version": "3.0.0-dev.11.0",
+  "version": "3.0.0-dev.14.0",
   "author": "Pegasystems",
   "license": "SEE LICENSE IN LICENSE",
   "repository": {
@@ -20,8 +20,8 @@
     "build": "tsc -b"
   },
   "dependencies": {
-    "@pega/cosmos-react-core": "3.0.0-dev.11.0",
-    "@pega/cosmos-react-dnd": "3.0.0-dev.11.0",
+    "@pega/cosmos-react-core": "3.0.0-dev.14.0",
+    "@pega/cosmos-react-dnd": "3.0.0-dev.14.0",
     "@types/dagre": "^0.7.46",
     "@types/react": "^16.14.24 || ^17.0.38",
     "@types/react-dom": "^16.9.14 || ^17.0.11",
@@ -43,6 +43,8 @@
     "@storybook/react": "^6.4.19",
     "@storybook/testing-react": "^1.2.4",
     "@storybook/theming": "^6.4.19",
+    "@testing-library/jest-dom": "^5.16.2",
+    "@testing-library/react": "^12.1.3",
     "enzyme": "^3.11.0",
     "typescript": "~4.6.2"
   }