@pega/cosmos-react-build 5.0.0-dev.1.0 → 5.0.0-dev.10.1

package/lib/components/ExpressionBuilder/CodeEditor/getCodeSuggestions.js.map

@@ -1 +1 @@
-{"version":3,"file":"getCodeSuggestions.js","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/getCodeSuggestions.tsx"],"names":[],"mappings":";;AAAA,OAAO,QAAQ,MAAM,WAAW,CAAC;AACjC,OAAO,EAAU,GAAG,EAAE,MAAM,YAAY,CAAC;AAEzC,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrE,OAAO,QAAQ,MAAM,sDAAsD,CAAC;AAG5E,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEpD,MAAM,kBAAkB,GAAG,CACzB,UAAkB,EAClB,EACE,WAAW,GAAG,EAAE,EAChB,OAAO,GAAG,KAAK,EACf,yBAAyB,GAAG;IAC1B,EAAE,EAAE,CAAC;IACL,IAAI,EAAE,CAAC;CACR,EACiB,EACpB,EAAE;IACF,MAAM,eAAe,GAAG,UAAU,CAAC,SAAS,EAAE,CAAC;IAC/C,MAAM,WAAW,GAAG,UAAU;SAC3B,QAAQ,EAAE;SACV,KAAK,CAAC,IAAI,CAAC,CACX,yBAAyB,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,yBAAyB,CAAC,EAAE,EAAE,eAAe,CAAC,EAAE,CAAC,CAAC;IAEhG,IAAI,YAAY,GAIV,EAAE,CAAC;IAET,IAAI,OAAO,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC,EAAE;QACvC,YAAY,GAAG;YACb;gBACE,IAAI,EAAE,EAAE;gBACR,WAAW,EAAE,EAAE;gBACf,MAAM,EAAE,CAAC,OAAsB,EAAE,EAAE;oBACjC,QAAQ,CAAC,MAAM,CACb,KAAC,IAAI,IACH,SAAS,EAAE;4BACT,OAAO,EAAE,QAAQ;4BACjB,GAAG,EAAE,CAAC;yBACP,YAEA,OAAO,CAAC,CAAC,CAAC,CACT,KAAC,QAAQ,IAAC,OAAO,EAAC,MAAM,EAAC,SAAS,EAAC,QAAQ,EAAC,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE,aAAa,GAAI,CACpF,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,KAAG,CACf,GACI,EACP,OAAO,CACR,CAAC;gBACJ,CAAC;aACF;SACF,CAAC;KACH;SAAM;QACL,YAAY,GAAG,WAAW;aACvB,GAAG,CAAC,IAAI,CAAC,EAAE;YACV,OAAO;gBACL,IAAI,EAAE,IAAI,CAAC,EAAE;gBACb,WAAW,EAAE,IAAI,CAAC,OAAO;gBACzB,MAAM,EAAE,CAAC,OAAsB,EAAE,EAAE;oBACjC,QAAQ,CAAC,MAAM,CAAC,eAAC,QAAQ,OAAK,IAAI,EAAE,GAAG,EAAE,IAAI,CAAC,EAAE,EAAE,IAAI,EAAC,UAAU,GAAG,EAAE,OAAO,CAAC,CAAC;gBACjF,CAAC;aACF,CAAC;QACJ,CAAC,CAAC;aACD,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC;KACzF;IAED,OAAO;QACL,IAAI,EAAE,YAAY;QAClB,IAAI,EAAE,GAAG,CAAC,eAAe,CAAC,IAAI,EAAE,yBAAyB,CAAC,EAAE,GAAG,CAAC,CAAC;QACjE,EAAE,EAAE,GAAG,CAAC,eAAe,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC;KAClD,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import ReactDOM from 'react-dom';\nimport { Editor, Pos } from 'codemirror';\n\nimport { Progress, Flex, EmptyState } from '@pega/cosmos-react-core';\nimport MenuItem from '@pega/cosmos-react-core/lib/components/Menu/MenuItem';\n\nimport { EditorHintOptions } from './CodeEditor.types';\nimport { StyledLoading } from './CodeEditor.styles';\n\nconst getCodeSuggestions = (\n  codeMirror: Editor,\n  {\n    suggestions = [],\n    loading = false,\n    triggerCharacterCursorPos = {\n      ch: 0,\n      line: 0\n    }\n  }: EditorHintOptions\n) => {\n  const currentPosition = codeMirror.getCursor();\n  const filterQuery = codeMirror\n    .getValue()\n    .split('\\n')\n    [triggerCharacterCursorPos.line]?.substring(triggerCharacterCursorPos.ch, currentPosition.ch);\n\n  let filteredList: {\n    text: string;\n    displayText: string;\n    render: (element: HTMLLIElement) => void;\n  }[] = [];\n\n  if (loading || suggestions.length === 0) {\n    filteredList = [\n      {\n        text: '',\n        displayText: '',\n        render: (element: HTMLLIElement) => {\n          ReactDOM.render(\n            <Flex\n              container={{\n                justify: 'center',\n                pad: 1\n              }}\n            >\n              {loading ? (\n                <Progress variant='ring' placement='inline' visible={loading} as={StyledLoading} />\n              ) : (\n                <EmptyState />\n              )}\n            </Flex>,\n            element\n          );\n        }\n      }\n    ];\n  } else {\n    filteredList = suggestions\n      .map(hint => {\n        return {\n          text: hint.id,\n          displayText: hint.primary,\n          render: (element: HTMLLIElement) => {\n            ReactDOM.render(<MenuItem {...hint} key={hint.id} role='menuitem' />, element);\n          }\n        };\n      })\n      .filter(item => item.displayText.toLowerCase().startsWith(filterQuery.toLowerCase()));\n  }\n\n  return {\n    list: filteredList,\n    from: Pos(currentPosition.line, triggerCharacterCursorPos.ch - 1),\n    to: Pos(currentPosition.line, currentPosition.ch)\n  };\n};\n\nexport default getCodeSuggestions;\n"]}
+{"version":3,"file":"getCodeSuggestions.js","sourceRoot":"","sources":["../../../../src/components/ExpressionBuilder/CodeEditor/getCodeSuggestions.tsx"],"names":[],"mappings":";;AAAA,OAAO,QAAQ,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,GAAG,EAAE,MAAM,YAAY,CAAC;AAGjC,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrE,OAAO,QAAQ,MAAM,sDAAsD,CAAC;AAG5E,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEpD,MAAM,kBAAkB,GAAG,CACzB,UAAkB,EAClB,EACE,WAAW,GAAG,EAAE,EAChB,OAAO,GAAG,KAAK,EACf,yBAAyB,GAAG;IAC1B,EAAE,EAAE,CAAC;IACL,IAAI,EAAE,CAAC;CACR,EACiB,EACpB,EAAE;IACF,MAAM,eAAe,GAAG,UAAU,CAAC,SAAS,EAAE,CAAC;IAC/C,MAAM,WAAW,GAAG,UAAU;SAC3B,QAAQ,EAAE;SACV,KAAK,CAAC,IAAI,CAAC,CACX,yBAAyB,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,yBAAyB,CAAC,EAAE,EAAE,eAAe,CAAC,EAAE,CAAC,CAAC;IAEhG,IAAI,YAAY,GAIV,EAAE,CAAC;IAET,IAAI,OAAO,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC,EAAE;QACvC,YAAY,GAAG;YACb;gBACE,IAAI,EAAE,EAAE;gBACR,WAAW,EAAE,EAAE;gBACf,MAAM,EAAE,CAAC,OAAsB,EAAE,EAAE;oBACjC,QAAQ,CAAC,MAAM,CACb,KAAC,IAAI,IACH,SAAS,EAAE;4BACT,OAAO,EAAE,QAAQ;4BACjB,GAAG,EAAE,CAAC;yBACP,YAEA,OAAO,CAAC,CAAC,CAAC,CACT,KAAC,QAAQ,IAAC,OAAO,EAAC,MAAM,EAAC,SAAS,EAAC,QAAQ,EAAC,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE,aAAa,GAAI,CACpF,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,KAAG,CACf,GACI,EACP,OAAO,CACR,CAAC;gBACJ,CAAC;aACF;SACF,CAAC;KACH;SAAM;QACL,YAAY,GAAG,WAAW;aACvB,GAAG,CAAC,IAAI,CAAC,EAAE;YACV,OAAO;gBACL,IAAI,EAAE,IAAI,CAAC,EAAE;gBACb,WAAW,EAAE,IAAI,CAAC,OAAO;gBACzB,MAAM,EAAE,CAAC,OAAsB,EAAE,EAAE;oBACjC,QAAQ,CAAC,MAAM,CAAC,eAAC,QAAQ,OAAK,IAAI,EAAE,GAAG,EAAE,IAAI,CAAC,EAAE,EAAE,IAAI,EAAC,UAAU,GAAG,EAAE,OAAO,CAAC,CAAC;gBACjF,CAAC;aACF,CAAC;QACJ,CAAC,CAAC;aACD,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC;KACzF;IAED,OAAO;QACL,IAAI,EAAE,YAAY;QAClB,IAAI,EAAE,GAAG,CAAC,eAAe,CAAC,IAAI,EAAE,yBAAyB,CAAC,EAAE,GAAG,CAAC,CAAC;QACjE,EAAE,EAAE,GAAG,CAAC,eAAe,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC;KAClD,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import ReactDOM from 'react-dom';\nimport { Pos } from 'codemirror';\nimport type { Editor } from 'codemirror';\n\nimport { Progress, Flex, EmptyState } from '@pega/cosmos-react-core';\nimport MenuItem from '@pega/cosmos-react-core/lib/components/Menu/MenuItem';\n\nimport type { EditorHintOptions } from './CodeEditor.types';\nimport { StyledLoading } from './CodeEditor.styles';\n\nconst getCodeSuggestions = (\n  codeMirror: Editor,\n  {\n    suggestions = [],\n    loading = false,\n    triggerCharacterCursorPos = {\n      ch: 0,\n      line: 0\n    }\n  }: EditorHintOptions\n) => {\n  const currentPosition = codeMirror.getCursor();\n  const filterQuery = codeMirror\n    .getValue()\n    .split('\\n')\n    [triggerCharacterCursorPos.line]?.substring(triggerCharacterCursorPos.ch, currentPosition.ch);\n\n  let filteredList: {\n    text: string;\n    displayText: string;\n    render: (element: HTMLLIElement) => void;\n  }[] = [];\n\n  if (loading || suggestions.length === 0) {\n    filteredList = [\n      {\n        text: '',\n        displayText: '',\n        render: (element: HTMLLIElement) => {\n          ReactDOM.render(\n            <Flex\n              container={{\n                justify: 'center',\n                pad: 1\n              }}\n            >\n              {loading ? (\n                <Progress variant='ring' placement='inline' visible={loading} as={StyledLoading} />\n              ) : (\n                <EmptyState />\n              )}\n            </Flex>,\n            element\n          );\n        }\n      }\n    ];\n  } else {\n    filteredList = suggestions\n      .map(hint => {\n        return {\n          text: hint.id,\n          displayText: hint.primary,\n          render: (element: HTMLLIElement) => {\n            ReactDOM.render(<MenuItem {...hint} key={hint.id} role='menuitem' />, element);\n          }\n        };\n      })\n      .filter(item => item.displayText.toLowerCase().startsWith(filterQuery.toLowerCase()));\n  }\n\n  return {\n    list: filteredList,\n    from: Pos(currentPosition.line, triggerCharacterCursorPos.ch - 1),\n    to: Pos(currentPosition.line, currentPosition.ch)\n  };\n};\n\nexport default getCodeSuggestions;\n"]}

package/lib/components/ExpressionBuilder/ExpressionBuilder.d.ts

@@ -1,6 +1,6 @@
-import { FunctionComponent } from 'react';
-import { ForwardProps } from '@pega/cosmos-react-core';
-import { ExpressionBuilderProps } from './ExpressionBuilder.types';
+import type { FunctionComponent } from 'react';
+import type { ForwardProps } from '@pega/cosmos-react-core';
+import type { ExpressionBuilderProps } from './ExpressionBuilder.types';
 declare const ExpressionBuilder: FunctionComponent<ExpressionBuilderProps & ForwardProps>;
 export default ExpressionBuilder;
 //# sourceMappingURL=ExpressionBuilder.d.ts.map

package/lib/components/ExpressionBuilder/ExpressionBuilder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionBuilder.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAKlB,MAAM,OAAO,CAAC;AAEf,OAAO,EAEL,YAAY,EAIb,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAuB,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AAOxF,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,GAAG,YAAY,CAiH/E,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"ExpressionBuilder.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAmB,MAAM,OAAO,CAAC;AAGhE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAE5D,OAAO,KAAK,EAAuB,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AAO7F,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,GAAG,YAAY,CAiH/E,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/lib/components/ExpressionBuilder/ExpressionBuilder.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionBuilder.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  forwardRef,\n  FunctionComponent,\n  PropsWithoutRef,\n  useImperativeHandle,\n  useMemo,\n  useRef\n} from 'react';\n\nimport {\n  Flex,\n  ForwardProps,\n  SearchInput,\n  useI18n,\n  VisuallyHiddenText\n} from '@pega/cosmos-react-core';\n\nimport { ExpressionItemProps, ExpressionBuilderProps } from './ExpressionBuilder.types';\nimport { EditorState } from './CodeEditor/CodeEditor.types';\nimport ExpressionList from './ExpressionList';\nimport { StyledExpressionBuilder } from './ExpressionBuilder.styles';\nimport CodeEditor from './CodeEditor/CodeEditor';\nimport ExpressionBuilderContext from './ExpressionBuilderContext';\n\nconst ExpressionBuilder: FunctionComponent<ExpressionBuilderProps & ForwardProps> = forwardRef(\n  function ExpressionBuilder(\n    {\n      list,\n      search,\n      errors,\n      defaultValue,\n      handle,\n      fetchSuggestions,\n      loading,\n      readOnly,\n      onChange,\n      ...restProps\n    }: PropsWithoutRef<ExpressionBuilderProps>,\n    ref: ExpressionBuilderProps['ref']\n  ) {\n    const t = useI18n();\n    const codeEditorHandle = useRef<EditorState>(null);\n\n    const getExpression = () => {\n      return codeEditorHandle.current?.getValue() || '';\n    };\n\n    useImperativeHandle(\n      handle,\n      () => ({\n        getExpression\n      }),\n      [getExpression]\n    );\n\n    const addExpression = (expression: string) => {\n      codeEditorHandle.current?.insertText(expression);\n    };\n    const onItemAdd = (id: ExpressionItemProps['id']) => {\n      list.onItemAdd(id, addExpression);\n    };\n\n    const ctxValue = useMemo(\n      () => ({\n        accent: search.accent\n      }),\n      [search.accent]\n    );\n\n    return (\n      <Flex\n        {...restProps}\n        as={StyledExpressionBuilder}\n        ref={ref}\n        container={{\n          justify: 'between',\n          colGap: 2,\n          pad: 1\n        }}\n        item={{\n          grow: 1\n        }}\n      >\n        {!readOnly && (\n          <VisuallyHiddenText aria-live='polite' role='status'>\n            {t('results_count', [list.items?.length || 0], { count: list.items?.length || 0 })}\n          </VisuallyHiddenText>\n        )}\n        {/* Column 1 */}\n        {!readOnly && (\n          <Flex\n            container={{\n              direction: 'column',\n              justify: 'between',\n              gap: 1\n            }}\n            item={{\n              grow: 1,\n              basis: '50%'\n            }}\n          >\n            <SearchInput {...search} />\n            <ExpressionBuilderContext.Provider value={ctxValue}>\n              <ExpressionList {...list} onItemAdd={onItemAdd} />\n            </ExpressionBuilderContext.Provider>\n          </Flex>\n        )}\n        {/* Column 2 */}\n        <Flex\n          container={{\n            direction: 'column',\n            justify: 'between'\n          }}\n          item={{\n            grow: 1,\n            basis: '50%'\n          }}\n        >\n          <CodeEditor\n            fetchSuggestions={fetchSuggestions}\n            codeEditorHandle={codeEditorHandle}\n            autoCompleteTriggers={['.', '@', ':']}\n            editorConfigProps={{\n              mode: 'expression',\n              readOnly\n            }}\n            defaultValue={defaultValue}\n            loading={loading}\n            errors={errors}\n            readOnly={readOnly}\n            onChange={onChange}\n            aria-label={t('expression_editor')}\n          />\n        </Flex>\n      </Flex>\n    );\n  }\n);\n\nexport default ExpressionBuilder;\n"]}
+{"version":3,"file":"ExpressionBuilder.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useImperativeHandle, useMemo, useRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef } from 'react';\n\nimport { Flex, SearchInput, useI18n, VisuallyHiddenText } from '@pega/cosmos-react-core';\nimport type { ForwardProps } from '@pega/cosmos-react-core';\n\nimport type { ExpressionItemProps, ExpressionBuilderProps } from './ExpressionBuilder.types';\nimport type { EditorState } from './CodeEditor/CodeEditor.types';\nimport ExpressionList from './ExpressionList';\nimport { StyledExpressionBuilder } from './ExpressionBuilder.styles';\nimport CodeEditor from './CodeEditor/CodeEditor';\nimport ExpressionBuilderContext from './ExpressionBuilderContext';\n\nconst ExpressionBuilder: FunctionComponent<ExpressionBuilderProps & ForwardProps> = forwardRef(\n  function ExpressionBuilder(\n    {\n      list,\n      search,\n      errors,\n      defaultValue,\n      handle,\n      fetchSuggestions,\n      loading,\n      readOnly,\n      onChange,\n      ...restProps\n    }: PropsWithoutRef<ExpressionBuilderProps>,\n    ref: ExpressionBuilderProps['ref']\n  ) {\n    const t = useI18n();\n    const codeEditorHandle = useRef<EditorState>(null);\n\n    const getExpression = () => {\n      return codeEditorHandle.current?.getValue() || '';\n    };\n\n    useImperativeHandle(\n      handle,\n      () => ({\n        getExpression\n      }),\n      [getExpression]\n    );\n\n    const addExpression = (expression: string) => {\n      codeEditorHandle.current?.insertText(expression);\n    };\n    const onItemAdd = (id: ExpressionItemProps['id']) => {\n      list.onItemAdd(id, addExpression);\n    };\n\n    const ctxValue = useMemo(\n      () => ({\n        accent: search.accent\n      }),\n      [search.accent]\n    );\n\n    return (\n      <Flex\n        {...restProps}\n        as={StyledExpressionBuilder}\n        ref={ref}\n        container={{\n          justify: 'between',\n          colGap: 2,\n          pad: 1\n        }}\n        item={{\n          grow: 1\n        }}\n      >\n        {!readOnly && (\n          <VisuallyHiddenText aria-live='polite' role='status'>\n            {t('results_count', [list.items?.length || 0], { count: list.items?.length || 0 })}\n          </VisuallyHiddenText>\n        )}\n        {/* Column 1 */}\n        {!readOnly && (\n          <Flex\n            container={{\n              direction: 'column',\n              justify: 'between',\n              gap: 1\n            }}\n            item={{\n              grow: 1,\n              basis: '50%'\n            }}\n          >\n            <SearchInput {...search} />\n            <ExpressionBuilderContext.Provider value={ctxValue}>\n              <ExpressionList {...list} onItemAdd={onItemAdd} />\n            </ExpressionBuilderContext.Provider>\n          </Flex>\n        )}\n        {/* Column 2 */}\n        <Flex\n          container={{\n            direction: 'column',\n            justify: 'between'\n          }}\n          item={{\n            grow: 1,\n            basis: '50%'\n          }}\n        >\n          <CodeEditor\n            fetchSuggestions={fetchSuggestions}\n            codeEditorHandle={codeEditorHandle}\n            autoCompleteTriggers={['.', '@', ':']}\n            editorConfigProps={{\n              mode: 'expression',\n              readOnly\n            }}\n            defaultValue={defaultValue}\n            loading={loading}\n            errors={errors}\n            readOnly={readOnly}\n            onChange={onChange}\n            aria-label={t('expression_editor')}\n          />\n        </Flex>\n      </Flex>\n    );\n  }\n);\n\nexport default ExpressionBuilder;\n"]}

package/lib/components/ExpressionBuilder/ExpressionBuilder.styles.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { ExpressionItemProps } from './ExpressionBuilder.types';
+import type { ExpressionItemProps } from './ExpressionBuilder.types';
 export declare const StyledPrimaryText: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").TextProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledExpressionSummary: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledExpressionList: import("styled-components").StyledComponent<"ul", import("styled-components").DefaultTheme, {}, never>;

package/lib/components/ExpressionBuilder/ExpressionBuilder.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionBuilder.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.styles.ts"],"names":[],"mappings":";AAUA,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAEhE,eAAO,MAAM,iBAAiB,mOAE7B,CAAC;AAEF,eAAO,MAAM,uBAAuB,yGAKlC,CAAC;AAIH,eAAO,MAAM,oBAAoB,wGAIhC,CAAC;AAEF,eAAO,MAAM,uBAAuB,yGASlC,CAAC;AAIH,eAAO,MAAM,iBAAiB,yGAQ5B,CAAC;AAIH,eAAO,MAAM,sBAAsB,yGAIjC,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAAe,CAAC;AAIpD,eAAO,MAAM,2BAA2B,yGAQtC,CAAC;AAIH,eAAO,MAAM,oBAAoB;cACrB,mBAAmB,CAAC,UAAU,CAAC;SAuBzC,CAAC"}
+{"version":3,"file":"ExpressionBuilder.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.styles.ts"],"names":[],"mappings":";AAUA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAErE,eAAO,MAAM,iBAAiB,mOAE7B,CAAC;AAEF,eAAO,MAAM,uBAAuB,yGAKlC,CAAC;AAIH,eAAO,MAAM,oBAAoB,wGAIhC,CAAC;AAEF,eAAO,MAAM,uBAAuB,yGASlC,CAAC;AAIH,eAAO,MAAM,iBAAiB,yGAQ5B,CAAC;AAIH,eAAO,MAAM,sBAAsB,yGAIjC,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAAe,CAAC;AAIpD,eAAO,MAAM,2BAA2B,yGAQtC,CAAC;AAIH,eAAO,MAAM,oBAAoB;cACrB,mBAAmB,CAAC,UAAU,CAAC;SAuBzC,CAAC"}

package/lib/components/ExpressionBuilder/ExpressionBuilder.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionBuilder.styles.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport {\n  defaultThemeProp,\n  StyledButton,\n  StyledLabel,\n  StyledText,\n  Text\n} from '@pega/cosmos-react-core';\n\nimport { ExpressionItemProps } from './ExpressionBuilder.types';\n\nexport const StyledPrimaryText = styled(Text)`\n  word-break: break-word;\n`;\n\nexport const StyledExpressionSummary = styled.div(({ theme }) => {\n  return css`\n    padding-block: ${theme.base.spacing};\n    padding-inline: calc(0.5 * ${theme.base.spacing});\n  `;\n});\n\nStyledExpressionSummary.defaultProps = defaultThemeProp;\n\nexport const StyledExpressionList = styled.ul`\n  overflow-y: auto;\n  flex-grow: 1;\n  list-style: none;\n`;\n\nexport const StyledExpressionBuilder = styled.div(({ theme }) => {\n  return css`\n    position: relative;\n    background-color: ${theme.base.palette['primary-background']};\n    min-height: calc(30 * ${theme.base.spacing});\n    max-height: 100%;\n    max-width: calc(2 * ${theme.base['content-width'].lg} + 4 * ${theme.base.spacing});\n    min-width: calc(${theme.base['content-width'].lg} + 4 * ${theme.base.spacing});\n  `;\n});\n\nStyledExpressionBuilder.defaultProps = defaultThemeProp;\n\nexport const StyledParamsGroup = styled.div(({ theme }) => {\n  return css`\n    margin-block-start: calc(2 * ${theme.base.spacing});\n\n    ${StyledText} {\n      margin-block-end: ${theme.base.spacing};\n    }\n  `;\n});\n\nStyledParamsGroup.defaultProps = defaultThemeProp;\n\nexport const StyledInputParamsGroup = styled(StyledParamsGroup)(({ theme }) => {\n  return css`\n    max-width: ${theme.base['content-width'].lg};\n  `;\n});\n\nStyledInputParamsGroup.defaultProps = defaultThemeProp;\n\nexport const StyledExpressionDetails = styled.div``;\n\nStyledExpressionDetails.defaultProps = defaultThemeProp;\n\nexport const StyledExpandCollapseContent = styled.div(({ theme }) => {\n  return css`\n    padding-inline: calc(2 * ${theme.base.spacing});\n    padding-block-end: calc(2 * ${theme.base.spacing});\n    ${StyledButton} {\n      align-self: flex-end;\n    }\n  `;\n});\n\nStyledExpandCollapseContent.defaultProps = defaultThemeProp;\n\nexport const StyledExpressionItem = styled.li<{\n  expanded: ExpressionItemProps['expanded'];\n}>(({ theme, expanded }) => {\n  return css`\n    list-style: none;\n    background-color: ${theme.base.palette['primary-background']};\n    ${expanded &&\n    css`\n      background-color: ${theme.base.palette['secondary-background']};\n    `}\n\n    :not(:last-child) {\n      border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n    }\n\n    ${StyledExpressionDetails} {\n      padding-block-end: calc(2 * ${theme.base.spacing});\n    }\n\n    ${StyledLabel} {\n      margin-inline-end: calc(0.5 * ${theme.base.spacing});\n      color: ${theme.base.palette['foreground-color']};\n    }\n  `;\n});\n\nStyledExpressionItem.defaultProps = defaultThemeProp;\n"]}
+{"version":3,"file":"ExpressionBuilder.styles.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport {\n  defaultThemeProp,\n  StyledButton,\n  StyledLabel,\n  StyledText,\n  Text\n} from '@pega/cosmos-react-core';\n\nimport type { ExpressionItemProps } from './ExpressionBuilder.types';\n\nexport const StyledPrimaryText = styled(Text)`\n  word-break: break-word;\n`;\n\nexport const StyledExpressionSummary = styled.div(({ theme }) => {\n  return css`\n    padding-block: ${theme.base.spacing};\n    padding-inline: calc(0.5 * ${theme.base.spacing});\n  `;\n});\n\nStyledExpressionSummary.defaultProps = defaultThemeProp;\n\nexport const StyledExpressionList = styled.ul`\n  overflow-y: auto;\n  flex-grow: 1;\n  list-style: none;\n`;\n\nexport const StyledExpressionBuilder = styled.div(({ theme }) => {\n  return css`\n    position: relative;\n    background-color: ${theme.base.palette['primary-background']};\n    min-height: calc(30 * ${theme.base.spacing});\n    max-height: 100%;\n    max-width: calc(2 * ${theme.base['content-width'].lg} + 4 * ${theme.base.spacing});\n    min-width: calc(${theme.base['content-width'].lg} + 4 * ${theme.base.spacing});\n  `;\n});\n\nStyledExpressionBuilder.defaultProps = defaultThemeProp;\n\nexport const StyledParamsGroup = styled.div(({ theme }) => {\n  return css`\n    margin-block-start: calc(2 * ${theme.base.spacing});\n\n    ${StyledText} {\n      margin-block-end: ${theme.base.spacing};\n    }\n  `;\n});\n\nStyledParamsGroup.defaultProps = defaultThemeProp;\n\nexport const StyledInputParamsGroup = styled(StyledParamsGroup)(({ theme }) => {\n  return css`\n    max-width: ${theme.base['content-width'].lg};\n  `;\n});\n\nStyledInputParamsGroup.defaultProps = defaultThemeProp;\n\nexport const StyledExpressionDetails = styled.div``;\n\nStyledExpressionDetails.defaultProps = defaultThemeProp;\n\nexport const StyledExpandCollapseContent = styled.div(({ theme }) => {\n  return css`\n    padding-inline: calc(2 * ${theme.base.spacing});\n    padding-block-end: calc(2 * ${theme.base.spacing});\n    ${StyledButton} {\n      align-self: flex-end;\n    }\n  `;\n});\n\nStyledExpandCollapseContent.defaultProps = defaultThemeProp;\n\nexport const StyledExpressionItem = styled.li<{\n  expanded: ExpressionItemProps['expanded'];\n}>(({ theme, expanded }) => {\n  return css`\n    list-style: none;\n    background-color: ${theme.base.palette['primary-background']};\n    ${expanded &&\n    css`\n      background-color: ${theme.base.palette['secondary-background']};\n    `}\n\n    :not(:last-child) {\n      border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n    }\n\n    ${StyledExpressionDetails} {\n      padding-block-end: calc(2 * ${theme.base.spacing});\n    }\n\n    ${StyledLabel} {\n      margin-inline-end: calc(0.5 * ${theme.base.spacing});\n      color: ${theme.base.palette['foreground-color']};\n    }\n  `;\n});\n\nStyledExpressionItem.defaultProps = defaultThemeProp;\n"]}

package/lib/components/ExpressionBuilder/ExpressionBuilder.types.d.ts

@@ -1,6 +1,6 @@
-import { ComponentType, Ref } from 'react';
-import { BaseProps, EmptyStateProps, OmitStrict, SearchInputProps, FieldValueListProps, MenuProps } from '@pega/cosmos-react-core';
-import { CodeEditorProps } from './CodeEditor/CodeEditor.types';
+import type { ComponentType, Ref } from 'react';
+import type { BaseProps, EmptyStateProps, OmitStrict, SearchInputProps, FieldValueListProps, MenuProps } from '@pega/cosmos-react-core';
+import type { CodeEditorProps } from './CodeEditor/CodeEditor.types';
 export interface ExpressionItemProps {
     /** Id of the item */
     id: string;

package/lib/components/ExpressionBuilder/ExpressionBuilder.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionBuilder.types.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE3C,OAAO,EACL,SAAS,EACT,eAAe,EACf,UAAU,EACV,gBAAgB,EAChB,mBAAmB,EACnB,SAAS,EACV,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AAEhE,MAAM,WAAW,mBAAmB;IAClC,qBAAqB;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,6CAA6C;IAC7C,OAAO,EAAE,MAAM,CAAC;IAChB,mEAAmE;IACnE,IAAI,EAAE,MAAM,CAAC;IACb,6BAA6B;IAC7B,KAAK,EAAE,CAAC,EAAE,EAAE,mBAAmB,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAC/C,gCAAgC;IAChC,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,mBAAmB,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IACnD,kCAAkC;IAClC,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,mBAAmB,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IACrD,gCAAgC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kDAAkD;IAClD,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,gFAAgF;IAChF,YAAY,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;CAChD;AAED,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAC5B,+BAA+B;IAC/B,KAAK,CAAC,EAAE,UAAU,CAAC,mBAAmB,EAAE,OAAO,GAAG,UAAU,GAAG,YAAY,GAAG,SAAS,CAAC,EAAE,CAAC;IAC3F,4BAA4B;IAC5B,SAAS,EAAE,mBAAmB,CAAC,OAAO,CAAC,CAAC;IACxC,+BAA+B;IAC/B,YAAY,CAAC,EAAE,mBAAmB,CAAC,UAAU,CAAC,CAAC;IAC/C,iCAAiC;IACjC,cAAc,CAAC,EAAE,mBAAmB,CAAC,YAAY,CAAC,CAAC;IACnD,eAAe;IACf,SAAS,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;IACvC,0BAA0B;IAC1B,OAAO,EAAE;QACP,CAAC,EAAE,EAAE,MAAM,GAAG,sBAAsB,CAAC;KACtC,CAAC;CACH;AAED,MAAM,WAAW,WAAW;IAC1B,mCAAmC;IACnC,aAAa,EAAE,MAAM,MAAM,CAAC;CAC7B;AAED,MAAM,WAAW,sBACf,SAAQ,SAAS,EACf,UAAU,CAAC,eAAe,EAAE,KAAK,GAAG,kBAAkB,CAAC;IACzD,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,4BAA4B;IAC5B,IAAI,EAAE,UAAU,CAAC,mBAAmB,EAAE,KAAK,GAAG,WAAW,CAAC,GAAG;QAC3D,SAAS,EAAE,CAAC,EAAE,EAAE,mBAAmB,CAAC,IAAI,CAAC,EAAE,aAAa,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,KAAK,IAAI,CAAC;KACjG,CAAC;IACF,yBAAyB;IACzB,MAAM,EAAE,IAAI,CACV,QAAQ,CAAC,gBAAgB,CAAC,EAC1B,SAAS,GAAG,gBAAgB,GAAG,gBAAgB,GAAG,OAAO,CAC1D,GACC,IAAI,CAAC,gBAAgB,EAAE,eAAe,CAAC,GACvC,IAAI,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;IAE5B,wBAAwB;IACxB,MAAM,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CAC3B;AAED,MAAM,WAAW,WAAW,CAAC,CAAC;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IAC3B,aAAa,EAAE,CAAC,CAAC;CAClB;AAED,MAAM,WAAW,sBAAuB,SAAQ,SAAS;IACvD,wCAAwC;IACxC,OAAO,EAAE,QAAQ,CAAC,mBAAmB,CAAC,QAAQ,CAAC,CAAC,CAAC;IACjD,sCAAsC;IACtC,YAAY,CAAC,EAAE,QAAQ,CAAC,mBAAmB,CAAC,QAAQ,CAAC,CAAC,CAAC;IACvD,qCAAqC;IACrC,WAAW,CAAC,EAAE,WAAW,CAAC,GAAG,CAAC,EAAE,CAAC;IACjC,2BAA2B;IAC3B,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CACxB"}
+{"version":3,"file":"ExpressionBuilder.types.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.types.ts"],"names":[],"mappings":"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"}

package/lib/components/ExpressionBuilder/ExpressionBuilder.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionBuilder.types.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ComponentType, Ref } from 'react';\n\nimport {\n  BaseProps,\n  EmptyStateProps,\n  OmitStrict,\n  SearchInputProps,\n  FieldValueListProps,\n  MenuProps\n} from '@pega/cosmos-react-core';\n\nimport { CodeEditorProps } from './CodeEditor/CodeEditor.types';\n\nexport interface ExpressionItemProps {\n  /** Id of the item */\n  id: string;\n  /** Item name to be displayed as rule name */\n  primary: string;\n  /** Type of expression item. Eg: Decision, When, Automation etc. */\n  type: string;\n  /** Callback for add event */\n  onAdd: (id: ExpressionItemProps['id']) => void;\n  /** Callback for expand event */\n  onExpand?: (id: ExpressionItemProps['id']) => void;\n  /** Callback for collapse event */\n  onCollapse?: (id: ExpressionItemProps['id']) => void;\n  /** Show the expanded details */\n  expanded?: boolean;\n  /** Expression details to show in expanded view */\n  details?: ExpressionDetailsProps;\n  /** Matched field to be shown in expression item collapsed mode during search */\n  matchedField?: { name: string; value: string };\n}\n\nexport interface ExpressionListProps extends BaseProps {\n  ref?: Ref<HTMLUListElement>;\n  /** Expression builder items */\n  items?: OmitStrict<ExpressionItemProps, 'onAdd' | 'onExpand' | 'onCollapse' | 'details'>[];\n  /** Callback for item add */\n  onItemAdd: ExpressionItemProps['onAdd'];\n  /** Callback for item expand */\n  onItemExpand?: ExpressionItemProps['onExpand'];\n  /** Callback for item collapse */\n  onItemCollapse?: ExpressionItemProps['onCollapse'];\n  /** No items */\n  emptyText?: EmptyStateProps['message'];\n  /** Expanded items data */\n  details: {\n    [id: string]: ExpressionDetailsProps;\n  };\n}\n\nexport interface HandleValue {\n  /** Returns the expression value */\n  getExpression: () => string;\n}\n\nexport interface ExpressionBuilderProps\n  extends BaseProps,\n    OmitStrict<CodeEditorProps, 'ref' | 'codeEditorHandle'> {\n  ref?: Ref<HTMLDivElement>;\n  /** Expression items list */\n  list: OmitStrict<ExpressionListProps, 'ref' | 'onItemAdd'> & {\n    onItemAdd: (id: ExpressionItemProps['id'], addExpression: (expression: string) => void) => void;\n  };\n  /** Search input props */\n  search: Pick<\n    Required<SearchInputProps>,\n    'filters' | 'onFilterChange' | 'onSearchChange' | 'value'\n  > &\n    Pick<SearchInputProps, 'defaultFilter'> &\n    Pick<MenuProps, 'accent'>;\n\n  /** Imperative handle */\n  handle?: Ref<HandleValue>;\n}\n\nexport interface InputParams<P> {\n  id: string;\n  renderer: ComponentType<P>;\n  rendererProps: P;\n}\n\nexport interface ExpressionDetailsProps extends BaseProps {\n  /** Primary details of the expression */\n  primary: Required<FieldValueListProps['fields']>;\n  /** Output params of the expression */\n  outputParams?: Required<FieldValueListProps['fields']>;\n  /** Input params of the expression */\n  inputParams?: InputParams<any>[];\n  /** Ref to the component */\n  ref?: Ref<HTMLElement>;\n}\n"]}
+{"version":3,"file":"ExpressionBuilder.types.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilder.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentType, Ref } from 'react';\n\nimport type {\n  BaseProps,\n  EmptyStateProps,\n  OmitStrict,\n  SearchInputProps,\n  FieldValueListProps,\n  MenuProps\n} from '@pega/cosmos-react-core';\n\nimport type { CodeEditorProps } from './CodeEditor/CodeEditor.types';\n\nexport interface ExpressionItemProps {\n  /** Id of the item */\n  id: string;\n  /** Item name to be displayed as rule name */\n  primary: string;\n  /** Type of expression item. Eg: Decision, When, Automation etc. */\n  type: string;\n  /** Callback for add event */\n  onAdd: (id: ExpressionItemProps['id']) => void;\n  /** Callback for expand event */\n  onExpand?: (id: ExpressionItemProps['id']) => void;\n  /** Callback for collapse event */\n  onCollapse?: (id: ExpressionItemProps['id']) => void;\n  /** Show the expanded details */\n  expanded?: boolean;\n  /** Expression details to show in expanded view */\n  details?: ExpressionDetailsProps;\n  /** Matched field to be shown in expression item collapsed mode during search */\n  matchedField?: { name: string; value: string };\n}\n\nexport interface ExpressionListProps extends BaseProps {\n  ref?: Ref<HTMLUListElement>;\n  /** Expression builder items */\n  items?: OmitStrict<ExpressionItemProps, 'onAdd' | 'onExpand' | 'onCollapse' | 'details'>[];\n  /** Callback for item add */\n  onItemAdd: ExpressionItemProps['onAdd'];\n  /** Callback for item expand */\n  onItemExpand?: ExpressionItemProps['onExpand'];\n  /** Callback for item collapse */\n  onItemCollapse?: ExpressionItemProps['onCollapse'];\n  /** No items */\n  emptyText?: EmptyStateProps['message'];\n  /** Expanded items data */\n  details: {\n    [id: string]: ExpressionDetailsProps;\n  };\n}\n\nexport interface HandleValue {\n  /** Returns the expression value */\n  getExpression: () => string;\n}\n\nexport interface ExpressionBuilderProps\n  extends BaseProps,\n    OmitStrict<CodeEditorProps, 'ref' | 'codeEditorHandle'> {\n  ref?: Ref<HTMLDivElement>;\n  /** Expression items list */\n  list: OmitStrict<ExpressionListProps, 'ref' | 'onItemAdd'> & {\n    onItemAdd: (id: ExpressionItemProps['id'], addExpression: (expression: string) => void) => void;\n  };\n  /** Search input props */\n  search: Pick<\n    Required<SearchInputProps>,\n    'filters' | 'onFilterChange' | 'onSearchChange' | 'value'\n  > &\n    Pick<SearchInputProps, 'defaultFilter'> &\n    Pick<MenuProps, 'accent'>;\n\n  /** Imperative handle */\n  handle?: Ref<HandleValue>;\n}\n\nexport interface InputParams<P> {\n  id: string;\n  renderer: ComponentType<P>;\n  rendererProps: P;\n}\n\nexport interface ExpressionDetailsProps extends BaseProps {\n  /** Primary details of the expression */\n  primary: Required<FieldValueListProps['fields']>;\n  /** Output params of the expression */\n  outputParams?: Required<FieldValueListProps['fields']>;\n  /** Input params of the expression */\n  inputParams?: InputParams<any>[];\n  /** Ref to the component */\n  ref?: Ref<HTMLElement>;\n}\n"]}

package/lib/components/ExpressionBuilder/ExpressionBuilderContext.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { MenuProps } from '@pega/cosmos-react-core';
+import type { MenuProps } from '@pega/cosmos-react-core';
 declare const ExpressionBuilderContext: import("react").Context<{
     accent: MenuProps['accent'];
 }>;

package/lib/components/ExpressionBuilder/ExpressionBuilderContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionBuilderContext.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilderContext.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAEpD,QAAA,MAAM,wBAAwB;YAA2B,SAAS,CAAC,QAAQ,CAAC;EAE1E,CAAC;AAEH,eAAe,wBAAwB,CAAC"}
+{"version":3,"file":"ExpressionBuilderContext.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilderContext.ts"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAEzD,QAAA,MAAM,wBAAwB;YAA2B,SAAS,CAAC,QAAQ,CAAC;EAE1E,CAAC;AAEH,eAAe,wBAAwB,CAAC"}

package/lib/components/ExpressionBuilder/ExpressionBuilderContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionBuilderContext.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilderContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAItC,MAAM,wBAAwB,GAAG,aAAa,CAAkC;IAC9E,MAAM,EAAE,SAAS;CAClB,CAAC,CAAC;AAEH,eAAe,wBAAwB,CAAC","sourcesContent":["import { createContext } from 'react';\n\nimport { MenuProps } from '@pega/cosmos-react-core';\n\nconst ExpressionBuilderContext = createContext<{ accent: MenuProps['accent'] }>({\n  accent: undefined\n});\n\nexport default ExpressionBuilderContext;\n"]}
+{"version":3,"file":"ExpressionBuilderContext.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionBuilderContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAItC,MAAM,wBAAwB,GAAG,aAAa,CAAkC;IAC9E,MAAM,EAAE,SAAS;CAClB,CAAC,CAAC;AAEH,eAAe,wBAAwB,CAAC","sourcesContent":["import { createContext } from 'react';\n\nimport type { MenuProps } from '@pega/cosmos-react-core';\n\nconst ExpressionBuilderContext = createContext<{ accent: MenuProps['accent'] }>({\n  accent: undefined\n});\n\nexport default ExpressionBuilderContext;\n"]}

package/lib/components/ExpressionBuilder/ExpressionDetails.d.ts

@@ -1,6 +1,6 @@
-import { FunctionComponent } from 'react';
-import { ForwardProps } from '@pega/cosmos-react-core';
-import { ExpressionDetailsProps } from './ExpressionBuilder.types';
+import type { FunctionComponent } from 'react';
+import type { ForwardProps } from '@pega/cosmos-react-core';
+import type { ExpressionDetailsProps } from './ExpressionBuilder.types';
 declare const ExpressionDetails: FunctionComponent<ExpressionDetailsProps & ForwardProps>;
 export default ExpressionDetails;
 //# sourceMappingURL=ExpressionDetails.d.ts.map

package/lib/components/ExpressionBuilder/ExpressionDetails.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionDetails.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionDetails.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAEtD,OAAO,EAAwB,YAAY,EAAiB,MAAM,yBAAyB,CAAC;AAE5F,OAAO,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AAOnE,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,GAAG,YAAY,CAiC/E,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"ExpressionDetails.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionDetails.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG/C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAE5D,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AAOxE,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,GAAG,YAAY,CAiC/E,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/lib/components/ExpressionBuilder/ExpressionDetails.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionDetails.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionDetails.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAqB,MAAM,OAAO,CAAC;AAEtD,OAAO,EAAE,cAAc,EAAE,IAAI,EAAgB,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAG5F,OAAO,EACL,uBAAuB,EACvB,sBAAsB,EACtB,iBAAiB,EAClB,MAAM,4BAA4B,CAAC;AAEpC,MAAM,iBAAiB,GAA6D,UAAU,CAC5F,SAAS,iBAAiB,CACxB,EAAE,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,SAAS,EAAE,EACpD,GAAkC;IAElC,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,CACL,MAAC,IAAI,OACC,SAAS,EACb,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAClC,EAAE,EAAE,uBAAuB,aAE3B,KAAC,cAAc,IAAC,MAAM,EAAE,OAAO,GAAI,EAClC,YAAY,IAAI,CACf,MAAC,iBAAiB,eAChB,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,CAAC,CAAC,mBAAmB,CAAC,GAAQ,EAClD,KAAC,cAAc,IAAC,MAAM,EAAE,YAAY,GAAI,IACtB,CACrB,EACA,WAAW,IAAI,CACd,MAAC,sBAAsB,eACrB,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,CAAC,CAAC,kBAAkB,CAAC,GAAQ,EACjD,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,YAC7C,WAAW,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,aAAa,EAAE,EAAE,EAAE;4BAC7D,OAAO,KAAC,QAAQ,OAAc,aAAa,IAArB,EAAE,CAAuB,CAAC;wBAClD,CAAC,CAAC,GACG,IACgB,CAC1B,IACI,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import { forwardRef, FunctionComponent } from 'react';\n\nimport { FieldValueList, Flex, ForwardProps, Text, useI18n } from '@pega/cosmos-react-core';\n\nimport { ExpressionDetailsProps } from './ExpressionBuilder.types';\nimport {\n  StyledExpressionDetails,\n  StyledInputParamsGroup,\n  StyledParamsGroup\n} from './ExpressionBuilder.styles';\n\nconst ExpressionDetails: FunctionComponent<ExpressionDetailsProps & ForwardProps> = forwardRef(\n  function ExpressionDetails(\n    { primary, inputParams, outputParams, ...restProps },\n    ref: ExpressionDetailsProps['ref']\n  ) {\n    const t = useI18n();\n    return (\n      <Flex\n        {...restProps}\n        ref={ref}\n        container={{ direction: 'column' }}\n        as={StyledExpressionDetails}\n      >\n        <FieldValueList fields={primary} />\n        {outputParams && (\n          <StyledParamsGroup>\n            <Text variant='h4'>{t('output_parameters')}</Text>\n            <FieldValueList fields={outputParams} />\n          </StyledParamsGroup>\n        )}\n        {inputParams && (\n          <StyledInputParamsGroup>\n            <Text variant='h4'>{t('input_parameters')}</Text>\n            <Flex container={{ direction: 'column', gap: 1 }}>\n              {inputParams.map(({ id, renderer: Renderer, rendererProps }) => {\n                return <Renderer key={id} {...rendererProps} />;\n              })}\n            </Flex>\n          </StyledInputParamsGroup>\n        )}\n      </Flex>\n    );\n  }\n);\n\nexport default ExpressionDetails;\n"]}
+{"version":3,"file":"ExpressionDetails.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionDetails.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAGnC,OAAO,EAAE,cAAc,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAI9E,OAAO,EACL,uBAAuB,EACvB,sBAAsB,EACtB,iBAAiB,EAClB,MAAM,4BAA4B,CAAC;AAEpC,MAAM,iBAAiB,GAA6D,UAAU,CAC5F,SAAS,iBAAiB,CACxB,EAAE,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,SAAS,EAAE,EACpD,GAAkC;IAElC,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,CACL,MAAC,IAAI,OACC,SAAS,EACb,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAClC,EAAE,EAAE,uBAAuB,aAE3B,KAAC,cAAc,IAAC,MAAM,EAAE,OAAO,GAAI,EAClC,YAAY,IAAI,CACf,MAAC,iBAAiB,eAChB,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,CAAC,CAAC,mBAAmB,CAAC,GAAQ,EAClD,KAAC,cAAc,IAAC,MAAM,EAAE,YAAY,GAAI,IACtB,CACrB,EACA,WAAW,IAAI,CACd,MAAC,sBAAsB,eACrB,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,CAAC,CAAC,kBAAkB,CAAC,GAAQ,EACjD,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,YAC7C,WAAW,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,aAAa,EAAE,EAAE,EAAE;4BAC7D,OAAO,KAAC,QAAQ,OAAc,aAAa,IAArB,EAAE,CAAuB,CAAC;wBAClD,CAAC,CAAC,GACG,IACgB,CAC1B,IACI,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { FunctionComponent } from 'react';\n\nimport { FieldValueList, Flex, Text, useI18n } from '@pega/cosmos-react-core';\nimport type { ForwardProps } from '@pega/cosmos-react-core';\n\nimport type { ExpressionDetailsProps } from './ExpressionBuilder.types';\nimport {\n  StyledExpressionDetails,\n  StyledInputParamsGroup,\n  StyledParamsGroup\n} from './ExpressionBuilder.styles';\n\nconst ExpressionDetails: FunctionComponent<ExpressionDetailsProps & ForwardProps> = forwardRef(\n  function ExpressionDetails(\n    { primary, inputParams, outputParams, ...restProps },\n    ref: ExpressionDetailsProps['ref']\n  ) {\n    const t = useI18n();\n    return (\n      <Flex\n        {...restProps}\n        ref={ref}\n        container={{ direction: 'column' }}\n        as={StyledExpressionDetails}\n      >\n        <FieldValueList fields={primary} />\n        {outputParams && (\n          <StyledParamsGroup>\n            <Text variant='h4'>{t('output_parameters')}</Text>\n            <FieldValueList fields={outputParams} />\n          </StyledParamsGroup>\n        )}\n        {inputParams && (\n          <StyledInputParamsGroup>\n            <Text variant='h4'>{t('input_parameters')}</Text>\n            <Flex container={{ direction: 'column', gap: 1 }}>\n              {inputParams.map(({ id, renderer: Renderer, rendererProps }) => {\n                return <Renderer key={id} {...rendererProps} />;\n              })}\n            </Flex>\n          </StyledInputParamsGroup>\n        )}\n      </Flex>\n    );\n  }\n);\n\nexport default ExpressionDetails;\n"]}

package/lib/components/ExpressionBuilder/ExpressionItem.d.ts

@@ -1,6 +1,6 @@
-import { FunctionComponent } from 'react';
-import { ForwardProps } from '@pega/cosmos-react-core';
-import { ExpressionItemProps } from './ExpressionBuilder.types';
+import type { FunctionComponent } from 'react';
+import type { ForwardProps } from '@pega/cosmos-react-core';
+import type { ExpressionItemProps } from './ExpressionBuilder.types';
 declare const ExpressionItem: FunctionComponent<ExpressionItemProps & ForwardProps>;
 export default ExpressionItem;
 //# sourceMappingURL=ExpressionItem.d.ts.map

package/lib/components/ExpressionBuilder/ExpressionItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionItem.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAuB,MAAM,OAAO,CAAC;AAE/D,OAAO,EAIL,YAAY,EASb,MAAM,yBAAyB,CAAC;AAIjC,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAYhE,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,mBAAmB,GAAG,YAAY,CAsGzE,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"ExpressionItem.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAe/C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAI5D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAYrE,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,mBAAmB,GAAG,YAAY,CAsGzE,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/ExpressionBuilder/ExpressionItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionItem.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent, useContext, useMemo } from 'react';\n\nimport {\n  Button,\n  ExpandCollapse,\n  Flex,\n  ForwardProps,\n  Icon,\n  Mark,\n  registerIcon,\n  replaceMatchWithElement,\n  StyledLabel,\n  Text,\n  useDirection,\n  useI18n\n} from '@pega/cosmos-react-core';\nimport * as caretRightIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-right.icon';\nimport * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';\n\nimport { ExpressionItemProps } from './ExpressionBuilder.types';\nimport {\n  StyledPrimaryText,\n  StyledExpandCollapseContent,\n  StyledExpressionSummary,\n  StyledExpressionItem\n} from './ExpressionBuilder.styles';\nimport ExpressionDetails from './ExpressionDetails';\nimport ExpressionBuilderContext from './ExpressionBuilderContext';\n\nregisterIcon(caretLeftIcon, caretRightIcon);\n\nconst ExpressionItem: FunctionComponent<ExpressionItemProps & ForwardProps> = ({\n  id,\n  primary,\n  type,\n  onAdd,\n  onExpand,\n  onCollapse,\n  details,\n  matchedField,\n  expanded = false,\n  ...restProps\n}) => {\n  const { end: caretDirection } = useDirection();\n  const t = useI18n();\n\n  const { accent } = useContext(ExpressionBuilderContext);\n\n  const accentedText = (text: string) => {\n    if (accent) {\n      const accentRegex = typeof accent === 'function' ? accent(text) : accent;\n      return replaceMatchWithElement(text, accentRegex, str => {\n        return <Mark>{str}</Mark>;\n      });\n    }\n    return text;\n  };\n\n  const caretIcon = useMemo(() => {\n    return expanded ? 'caret-down' : `caret-${caretDirection}`;\n  }, [expanded, caretDirection]);\n\n  const accentedMeta = matchedField && !expanded ? accentedText(matchedField.value) : undefined;\n\n  return (\n    <StyledExpressionItem expanded={expanded}>\n      <Flex\n        {...restProps}\n        as={StyledExpressionSummary}\n        id={id}\n        container={{ gap: 1, alignItems: 'start' }}\n      >\n        <Button\n          icon\n          variant='simple'\n          onClick={\n            onCollapse || onExpand\n              ? () => {\n                  if (expanded) {\n                    onCollapse?.(id);\n                  } else {\n                    onExpand?.(id);\n                  }\n                }\n              : undefined\n          }\n          aria-label={`${type}: ${primary}`}\n          aria-expanded={expanded}\n          label={expanded ? t('collapse') : t('expand')}\n        >\n          <Icon name={caretIcon} />\n        </Button>\n\n        <Flex container={{ alignItems: 'start', direction: 'column' }} item={{ grow: 1 }}>\n          <StyledPrimaryText variant='primary'>\n            {!matchedField ? accentedText(primary) : primary}\n          </StyledPrimaryText>\n          {accentedMeta ? (\n            <div>\n              <StyledLabel as='span'>{matchedField?.name}:</StyledLabel>\n              {accentedMeta}\n            </div>\n          ) : (\n            <Text variant='secondary'>{type}</Text>\n          )}\n        </Flex>\n\n        {!expanded && (\n          <Button\n            icon\n            variant='simple'\n            onClick={() => onAdd(id)}\n            aria-label={t('add_noun', [`${type}: ${primary}`])}\n            label={t('add')}\n          >\n            <Icon name='plus' />\n          </Button>\n        )}\n      </Flex>\n      <ExpandCollapse collapsed={!expanded}>\n        <Flex as={StyledExpandCollapseContent} container={{ direction: 'column' }}>\n          {details && <ExpressionDetails {...details} />}\n          <Button\n            variant='primary'\n            onClick={() => onAdd(id)}\n            aria-label={t('add_noun', [`${type}: ${primary}`])}\n          >\n            {t('add')}\n          </Button>\n        </Flex>\n      </ExpandCollapse>\n    </StyledExpressionItem>\n  );\n};\n\nexport default ExpressionItem;\n"]}
+{"version":3,"file":"ExpressionItem.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionItem.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useContext, useMemo } from 'react';\nimport type { FunctionComponent } from 'react';\n\nimport {\n  Button,\n  ExpandCollapse,\n  Flex,\n  Icon,\n  Mark,\n  registerIcon,\n  replaceMatchWithElement,\n  StyledLabel,\n  Text,\n  useDirection,\n  useI18n\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps } from '@pega/cosmos-react-core';\nimport * as caretRightIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-right.icon';\nimport * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';\n\nimport type { ExpressionItemProps } from './ExpressionBuilder.types';\nimport {\n  StyledPrimaryText,\n  StyledExpandCollapseContent,\n  StyledExpressionSummary,\n  StyledExpressionItem\n} from './ExpressionBuilder.styles';\nimport ExpressionDetails from './ExpressionDetails';\nimport ExpressionBuilderContext from './ExpressionBuilderContext';\n\nregisterIcon(caretLeftIcon, caretRightIcon);\n\nconst ExpressionItem: FunctionComponent<ExpressionItemProps & ForwardProps> = ({\n  id,\n  primary,\n  type,\n  onAdd,\n  onExpand,\n  onCollapse,\n  details,\n  matchedField,\n  expanded = false,\n  ...restProps\n}) => {\n  const { end: caretDirection } = useDirection();\n  const t = useI18n();\n\n  const { accent } = useContext(ExpressionBuilderContext);\n\n  const accentedText = (text: string) => {\n    if (accent) {\n      const accentRegex = typeof accent === 'function' ? accent(text) : accent;\n      return replaceMatchWithElement(text, accentRegex, str => {\n        return <Mark>{str}</Mark>;\n      });\n    }\n    return text;\n  };\n\n  const caretIcon = useMemo(() => {\n    return expanded ? 'caret-down' : `caret-${caretDirection}`;\n  }, [expanded, caretDirection]);\n\n  const accentedMeta = matchedField && !expanded ? accentedText(matchedField.value) : undefined;\n\n  return (\n    <StyledExpressionItem expanded={expanded}>\n      <Flex\n        {...restProps}\n        as={StyledExpressionSummary}\n        id={id}\n        container={{ gap: 1, alignItems: 'start' }}\n      >\n        <Button\n          icon\n          variant='simple'\n          onClick={\n            onCollapse || onExpand\n              ? () => {\n                  if (expanded) {\n                    onCollapse?.(id);\n                  } else {\n                    onExpand?.(id);\n                  }\n                }\n              : undefined\n          }\n          aria-label={`${type}: ${primary}`}\n          aria-expanded={expanded}\n          label={expanded ? t('collapse') : t('expand')}\n        >\n          <Icon name={caretIcon} />\n        </Button>\n\n        <Flex container={{ alignItems: 'start', direction: 'column' }} item={{ grow: 1 }}>\n          <StyledPrimaryText variant='primary'>\n            {!matchedField ? accentedText(primary) : primary}\n          </StyledPrimaryText>\n          {accentedMeta ? (\n            <div>\n              <StyledLabel as='span'>{matchedField?.name}:</StyledLabel>\n              {accentedMeta}\n            </div>\n          ) : (\n            <Text variant='secondary'>{type}</Text>\n          )}\n        </Flex>\n\n        {!expanded && (\n          <Button\n            icon\n            variant='simple'\n            onClick={() => onAdd(id)}\n            aria-label={t('add_noun', [`${type}: ${primary}`])}\n            label={t('add')}\n          >\n            <Icon name='plus' />\n          </Button>\n        )}\n      </Flex>\n      <ExpandCollapse collapsed={!expanded}>\n        <Flex as={StyledExpandCollapseContent} container={{ direction: 'column' }}>\n          {details && <ExpressionDetails {...details} />}\n          <Button\n            variant='primary'\n            onClick={() => onAdd(id)}\n            aria-label={t('add_noun', [`${type}: ${primary}`])}\n          >\n            {t('add')}\n          </Button>\n        </Flex>\n      </ExpandCollapse>\n    </StyledExpressionItem>\n  );\n};\n\nexport default ExpressionItem;\n"]}

package/lib/components/ExpressionBuilder/ExpressionList.d.ts

@@ -1,6 +1,6 @@
-import { FunctionComponent } from 'react';
-import { ForwardProps } from '@pega/cosmos-react-core';
-import { ExpressionListProps } from './ExpressionBuilder.types';
+import type { FunctionComponent } from 'react';
+import type { ForwardProps } from '@pega/cosmos-react-core';
+import type { ExpressionListProps } from './ExpressionBuilder.types';
 declare const ExpressionList: FunctionComponent<ExpressionListProps & ForwardProps>;
 export default ExpressionList;
 //# sourceMappingURL=ExpressionList.d.ts.map

package/lib/components/ExpressionBuilder/ExpressionList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionList.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAY,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAc,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAEnE,OAAO,EAAuB,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAIrF,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,mBAAmB,GAAG,YAAY,CA+CzE,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"ExpressionList.d.ts","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG/C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAE5D,OAAO,KAAK,EAAuB,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAI1F,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,mBAAmB,GAAG,YAAY,CA+CzE,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/ExpressionBuilder/ExpressionList.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpressionList.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionList.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAqB,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAE,UAAU,EAAgB,MAAM,yBAAyB,CAAC;AAGnE,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAElE,MAAM,cAAc,GAA0D,UAAU,CACtF,SAAS,cAAc,CACrB,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,EACpF,GAA+B;IAE/B,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAA8B,EAAE,CAAC,CAAC;IAEpF,MAAM,gBAAgB,GAAG,CAAC,EAA6B,EAAE,EAAE;QACzD,gBAAgB,CAAC,IAAI,CAAC,EAAE;YACtB,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;YACnC,IAAI,SAAS,KAAK,CAAC,CAAC;gBAAE,OAAO,IAAI,CAAC;YAClC,YAAY,EAAE,CAAC,EAAE,CAAC,CAAC;YACnB,OAAO,CAAC,GAAG,IAAI,EAAE,EAAE,CAAC,CAAC;QACvB,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,EAA6B,EAAE,EAAE;QAC3D,gBAAgB,CAAC,IAAI,CAAC,EAAE;YACtB,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;YACnC,IAAI,SAAS,KAAK,CAAC,CAAC;gBAAE,OAAO,IAAI,CAAC;YAClC,cAAc,EAAE,CAAC,EAAE,CAAC,CAAC;YACrB,OAAO,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,KAAK,EAAE,CAAC,CAAC;QAC9C,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,oBAAoB,OAAK,SAAS,EAAE,GAAG,EAAE,GAAG,YAC1C,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAC3B,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YACf,OAAO,CACL,eAAC,cAAc,OACT,IAAI,EACR,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,gBAAgB,EAC1B,UAAU,EAAE,kBAAkB,EAC9B,QAAQ,EAAE,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,EACzC,GAAG,EAAE,IAAI,CAAC,EAAE,EACZ,OAAO,EAAE,OAAO,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,GAC3B,CACH,CAAC;QACJ,CAAC,CAAC,CACH,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,IAAC,OAAO,EAAE,SAAS,GAAI,CACnC,GACoB,CACxB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, useState } from 'react';\n\nimport { EmptyState, ForwardProps } from '@pega/cosmos-react-core';\n\nimport { ExpressionItemProps, ExpressionListProps } from './ExpressionBuilder.types';\nimport ExpressionItem from './ExpressionItem';\nimport { StyledExpressionList } from './ExpressionBuilder.styles';\n\nconst ExpressionList: FunctionComponent<ExpressionListProps & ForwardProps> = forwardRef(\n  function ExpressionList(\n    { items, emptyText, onItemAdd, onItemExpand, onItemCollapse, details, ...restProps },\n    ref: ExpressionListProps['ref']\n  ) {\n    const [expandedItems, setExpandedItems] = useState<ExpressionItemProps['id'][]>([]);\n\n    const handleItemExpand = (id: ExpressionItemProps['id']) => {\n      setExpandedItems(prev => {\n        const itemIndex = prev.indexOf(id);\n        if (itemIndex !== -1) return prev;\n        onItemExpand?.(id);\n        return [...prev, id];\n      });\n    };\n\n    const handleItemCollapse = (id: ExpressionItemProps['id']) => {\n      setExpandedItems(prev => {\n        const itemIndex = prev.indexOf(id);\n        if (itemIndex === -1) return prev;\n        onItemCollapse?.(id);\n        return prev.filter(itemId => itemId !== id);\n      });\n    };\n\n    return (\n      <StyledExpressionList {...restProps} ref={ref}>\n        {items && items.length > 0 ? (\n          items.map(item => {\n            return (\n              <ExpressionItem\n                {...item}\n                onAdd={onItemAdd}\n                onExpand={handleItemExpand}\n                onCollapse={handleItemCollapse}\n                expanded={expandedItems.includes(item.id)}\n                key={item.id}\n                details={details?.[item.id]}\n              />\n            );\n          })\n        ) : (\n          <EmptyState message={emptyText} />\n        )}\n      </StyledExpressionList>\n    );\n  }\n);\n\nexport default ExpressionList;\n"]}
+{"version":3,"file":"ExpressionList.js","sourceRoot":"","sources":["../../../src/components/ExpressionBuilder/ExpressionList.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAG7C,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAIrD,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAElE,MAAM,cAAc,GAA0D,UAAU,CACtF,SAAS,cAAc,CACrB,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,EACpF,GAA+B;IAE/B,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAA8B,EAAE,CAAC,CAAC;IAEpF,MAAM,gBAAgB,GAAG,CAAC,EAA6B,EAAE,EAAE;QACzD,gBAAgB,CAAC,IAAI,CAAC,EAAE;YACtB,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;YACnC,IAAI,SAAS,KAAK,CAAC,CAAC;gBAAE,OAAO,IAAI,CAAC;YAClC,YAAY,EAAE,CAAC,EAAE,CAAC,CAAC;YACnB,OAAO,CAAC,GAAG,IAAI,EAAE,EAAE,CAAC,CAAC;QACvB,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,EAA6B,EAAE,EAAE;QAC3D,gBAAgB,CAAC,IAAI,CAAC,EAAE;YACtB,MAAM,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;YACnC,IAAI,SAAS,KAAK,CAAC,CAAC;gBAAE,OAAO,IAAI,CAAC;YAClC,cAAc,EAAE,CAAC,EAAE,CAAC,CAAC;YACrB,OAAO,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,KAAK,EAAE,CAAC,CAAC;QAC9C,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,oBAAoB,OAAK,SAAS,EAAE,GAAG,EAAE,GAAG,YAC1C,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAC3B,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YACf,OAAO,CACL,eAAC,cAAc,OACT,IAAI,EACR,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,gBAAgB,EAC1B,UAAU,EAAE,kBAAkB,EAC9B,QAAQ,EAAE,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,EACzC,GAAG,EAAE,IAAI,CAAC,EAAE,EACZ,OAAO,EAAE,OAAO,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,GAC3B,CACH,CAAC;QACJ,CAAC,CAAC,CACH,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,IAAC,OAAO,EAAE,SAAS,GAAI,CACnC,GACoB,CACxB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { forwardRef, useState } from 'react';\nimport type { FunctionComponent } from 'react';\n\nimport { EmptyState } from '@pega/cosmos-react-core';\nimport type { ForwardProps } from '@pega/cosmos-react-core';\n\nimport type { ExpressionItemProps, ExpressionListProps } from './ExpressionBuilder.types';\nimport ExpressionItem from './ExpressionItem';\nimport { StyledExpressionList } from './ExpressionBuilder.styles';\n\nconst ExpressionList: FunctionComponent<ExpressionListProps & ForwardProps> = forwardRef(\n  function ExpressionList(\n    { items, emptyText, onItemAdd, onItemExpand, onItemCollapse, details, ...restProps },\n    ref: ExpressionListProps['ref']\n  ) {\n    const [expandedItems, setExpandedItems] = useState<ExpressionItemProps['id'][]>([]);\n\n    const handleItemExpand = (id: ExpressionItemProps['id']) => {\n      setExpandedItems(prev => {\n        const itemIndex = prev.indexOf(id);\n        if (itemIndex !== -1) return prev;\n        onItemExpand?.(id);\n        return [...prev, id];\n      });\n    };\n\n    const handleItemCollapse = (id: ExpressionItemProps['id']) => {\n      setExpandedItems(prev => {\n        const itemIndex = prev.indexOf(id);\n        if (itemIndex === -1) return prev;\n        onItemCollapse?.(id);\n        return prev.filter(itemId => itemId !== id);\n      });\n    };\n\n    return (\n      <StyledExpressionList {...restProps} ref={ref}>\n        {items && items.length > 0 ? (\n          items.map(item => {\n            return (\n              <ExpressionItem\n                {...item}\n                onAdd={onItemAdd}\n                onExpand={handleItemExpand}\n                onCollapse={handleItemCollapse}\n                expanded={expandedItems.includes(item.id)}\n                key={item.id}\n                details={details?.[item.id]}\n              />\n            );\n          })\n        ) : (\n          <EmptyState message={emptyText} />\n        )}\n      </StyledExpressionList>\n    );\n  }\n);\n\nexport default ExpressionList;\n"]}

package/lib/components/FlowModeller/AddNode.d.ts

@@ -1,9 +1,9 @@
-import { FC, MouseEvent } from 'react';
-import { PlottedGraphNode } from './Renderer/Utils/GraphLayout';
-export declare const StyledDot: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").IconProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {
-    highlight: boolean;
+import type { FC, MouseEvent } from 'react';
+import type { PlottedGraphNode } from './Renderer/Utils/GraphLayout';
+export declare const StyledDot: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@pega/cosmos-react-core").IconProps>, import("styled-components").DefaultTheme, {
+    highlight?: boolean | undefined;
 }, never>;
-export declare const StyledPlus: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").IconProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledPlus: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@pega/cosmos-react-core").IconProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledButton: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").ButtonProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export interface AddNodeProps extends PlottedGraphNode {

package/lib/components/FlowModeller/AddNode.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AddNode.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/AddNode.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAE,UAAU,EAAmC,MAAM,OAAO,CAAC;AAYxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAGhE,eAAO,MAAM,SAAS;eAA6B,OAAO;SAWxD,CAAC;AAIH,eAAO,MAAM,UAAU,mOAEtB,CAAC;AAEF,eAAO,MAAM,aAAa,yGASxB,CAAC;AAIH,eAAO,MAAM,YAAY,qOA0BvB,CAAC;AAIH,MAAM,WAAW,YAAa,SAAQ,gBAAgB;IACpD,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,KAAK,KAAK,IAAI,CAAC;IAC9B,cAAc,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC3D,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,oBAAoB;eAA6B,OAAO;SAQnE,CAAC;AAIH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,EAAE,gBAAgB,GAAG,WAAW,CAAC,CAgC5E,CAAC"}
+{"version":3,"file":"AddNode.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/AddNode.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAY5C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAGrE,eAAO,MAAM,SAAS;;SAWpB,CAAC;AAIH,eAAO,MAAM,UAAU,0LAEtB,CAAC;AAEF,eAAO,MAAM,aAAa,yGASxB,CAAC;AAIH,eAAO,MAAM,YAAY,qOA0BvB,CAAC;AAIH,MAAM,WAAW,YAAa,SAAQ,gBAAgB;IACpD,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,KAAK,KAAK,IAAI,CAAC;IAC9B,cAAc,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC3D,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,oBAAoB;eAA6B,OAAO;SAQnE,CAAC;AAIH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,EAAE,gBAAgB,GAAG,WAAW,CAAC,CAgC5E,CAAC"}

package/lib/components/FlowModeller/AddNode.js.map

@@ -1 +1 @@
-{"version":3,"file":"AddNode.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/AddNode.tsx"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { FC, MouseEvent, useContext, useState, useEffect } from 'react';\n\nimport {\n  Button,\n  defaultThemeProp,\n  Flex,\n  Icon,\n  useI18n,\n  StyledTooltip,\n  Text\n} from '@pega/cosmos-react-core';\n\nimport { PlottedGraphNode } from './Renderer/Utils/GraphLayout';\nimport FlowModellerContext from './FlowModellerContext';\n\nexport const StyledDot = styled(Icon)<{ highlight: boolean }>(({ theme, highlight }) => {\n  return css`\n    position: absolute;\n    color: ${theme.base.colors.slate.dark};\n    ${highlight &&\n    css`\n       {\n        color: ${theme.base.colors.red.dark};\n      }\n    `}\n  `;\n});\n\nStyledDot.defaultProps = defaultThemeProp;\n\nexport const StyledPlus = styled(Icon)`\n  opacity: 0;\n`;\n\nexport const StyledWrapper = styled.div(({ theme }) => {\n  return css`\n    margin-block-start: ${theme.base.spacing};\n\n    ${StyledTooltip} {\n      min-width: 12ch;\n      text-align: center;\n    }\n  `;\n});\n\nStyledWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledButton = styled(Button)(({ theme }) => {\n  return css`\n    top: -0.25rem;\n    border: 0;\n    background: transparent;\n    color: ${theme.base.colors.black};\n    &:hover,\n    &:focus {\n      background: ${theme.base.colors.white};\n      ${StyledDot} {\n        opacity: 0;\n      }\n      ${StyledPlus} {\n        opacity: 1;\n      }\n    }\n    &[aria-haspopup='menu'] {\n      background: ${theme.base.colors.white};\n      ${StyledDot} {\n        opacity: 0;\n      }\n      ${StyledPlus} {\n        opacity: 1;\n      }\n    }\n  `;\n});\n\nStyledButton.defaultProps = defaultThemeProp;\n\nexport interface AddNodeProps extends PlottedGraphNode {\n  onClick?: (ev: Event) => void;\n  addNodeHandler: (e: MouseEvent<HTMLButtonElement>) => void;\n  highlight?: boolean;\n}\n\nexport const StyledConnectorLabel = styled(Text)<{ highlight: boolean }>(({ theme }) => {\n  return css`\n    border-radius: ${theme.base['border-radius']};\n    background: ${theme.base.colors.slate.dark};\n    color: ${theme.base.colors.white};\n    text-align: center;\n    padding: calc(0.5 * ${theme.base.spacing});\n  `;\n});\n\nStyledConnectorLabel.defaultProps = defaultThemeProp;\n\nexport const AddButton: FC<Pick<AddNodeProps, 'addNodeHandler' | 'highlight'>> = ({\n  addNodeHandler,\n  highlight\n}) => {\n  const t = useI18n();\n  const [hasMenuActive, setHasMenuActive] = useState(false);\n  const { showNodeLibrary } = useContext(FlowModellerContext);\n\n  const addNodeClickHandler = (e: MouseEvent<HTMLButtonElement>) => {\n    setHasMenuActive(true);\n    addNodeHandler(e);\n  };\n\n  useEffect(() => {\n    if (!showNodeLibrary) {\n      setHasMenuActive(false);\n    }\n  }, [showNodeLibrary]);\n\n  return (\n    <Flex container={{ justify: 'center' }} as={StyledWrapper}>\n      <StyledButton\n        label={t('add_node')}\n        aria-haspopup={hasMenuActive ? 'menu' : false}\n        icon\n        onClick={addNodeClickHandler}\n      >\n        <StyledDot name='circle-solid' highlight={highlight} />\n        <StyledPlus name='plus' />\n      </StyledButton>\n    </Flex>\n  );\n};\n"]}
+{"version":3,"file":"AddNode.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/AddNode.tsx"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { useContext, useState, useEffect } from 'react';\nimport type { FC, MouseEvent } from 'react';\n\nimport {\n  Button,\n  defaultThemeProp,\n  Flex,\n  Icon,\n  useI18n,\n  StyledTooltip,\n  Text\n} from '@pega/cosmos-react-core';\n\nimport type { PlottedGraphNode } from './Renderer/Utils/GraphLayout';\nimport FlowModellerContext from './FlowModellerContext';\n\nexport const StyledDot = styled(Icon)<{ highlight?: boolean }>(({ theme, highlight }) => {\n  return css`\n    position: absolute;\n    color: ${theme.base.colors.slate.dark};\n    ${highlight &&\n    css`\n       {\n        color: ${theme.base.colors.red.dark};\n      }\n    `}\n  `;\n});\n\nStyledDot.defaultProps = defaultThemeProp;\n\nexport const StyledPlus = styled(Icon)`\n  opacity: 0;\n`;\n\nexport const StyledWrapper = styled.div(({ theme }) => {\n  return css`\n    margin-block-start: ${theme.base.spacing};\n\n    ${StyledTooltip} {\n      min-width: 12ch;\n      text-align: center;\n    }\n  `;\n});\n\nStyledWrapper.defaultProps = defaultThemeProp;\n\nexport const StyledButton = styled(Button)(({ theme }) => {\n  return css`\n    top: -0.25rem;\n    border: 0;\n    background: transparent;\n    color: ${theme.base.colors.black};\n    &:hover,\n    &:focus {\n      background: ${theme.base.colors.white};\n      ${StyledDot} {\n        opacity: 0;\n      }\n      ${StyledPlus} {\n        opacity: 1;\n      }\n    }\n    &[aria-haspopup='menu'] {\n      background: ${theme.base.colors.white};\n      ${StyledDot} {\n        opacity: 0;\n      }\n      ${StyledPlus} {\n        opacity: 1;\n      }\n    }\n  `;\n});\n\nStyledButton.defaultProps = defaultThemeProp;\n\nexport interface AddNodeProps extends PlottedGraphNode {\n  onClick?: (ev: Event) => void;\n  addNodeHandler: (e: MouseEvent<HTMLButtonElement>) => void;\n  highlight?: boolean;\n}\n\nexport const StyledConnectorLabel = styled(Text)<{ highlight: boolean }>(({ theme }) => {\n  return css`\n    border-radius: ${theme.base['border-radius']};\n    background: ${theme.base.colors.slate.dark};\n    color: ${theme.base.colors.white};\n    text-align: center;\n    padding: calc(0.5 * ${theme.base.spacing});\n  `;\n});\n\nStyledConnectorLabel.defaultProps = defaultThemeProp;\n\nexport const AddButton: FC<Pick<AddNodeProps, 'addNodeHandler' | 'highlight'>> = ({\n  addNodeHandler,\n  highlight\n}) => {\n  const t = useI18n();\n  const [hasMenuActive, setHasMenuActive] = useState(false);\n  const { showNodeLibrary } = useContext(FlowModellerContext);\n\n  const addNodeClickHandler = (e: MouseEvent<HTMLButtonElement>) => {\n    setHasMenuActive(true);\n    addNodeHandler(e);\n  };\n\n  useEffect(() => {\n    if (!showNodeLibrary) {\n      setHasMenuActive(false);\n    }\n  }, [showNodeLibrary]);\n\n  return (\n    <Flex container={{ justify: 'center' }} as={StyledWrapper}>\n      <StyledButton\n        label={t('add_node')}\n        aria-haspopup={hasMenuActive ? 'menu' : false}\n        icon\n        onClick={addNodeClickHandler}\n      >\n        <StyledDot name='circle-solid' highlight={highlight} />\n        <StyledPlus name='plus' />\n      </StyledButton>\n    </Flex>\n  );\n};\n"]}

package/lib/components/FlowModeller/Connector.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-import { PlaceHolderConnector } from './Utils/addNodeUtils';
-import { PlottedGraphConnector } from './Renderer/Utils/GraphLayout';
+import type { PlaceHolderConnector } from './Utils/addNodeUtils';
+import type { PlottedGraphConnector } from './Renderer/Utils/GraphLayout';
 type ConnectorProps = Pick<PlottedGraphConnector, 'id' | 'data' | 'labelLayout' | 'points'> & Partial<Pick<PlaceHolderConnector, 'realConnectors'>>;
 declare const Connector: ({ id, labelLayout, data, realConnectors, points }: ConnectorProps) => JSX.Element | null;
 export default Connector;

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

@@ -1 +1 @@
-{"version":3,"file":"Connector.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/Connector.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAE5D,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAC;AA0ErE,KAAK,cAAc,GAAG,IAAI,CAAC,qBAAqB,EAAE,IAAI,GAAG,MAAM,GAAG,aAAa,GAAG,QAAQ,CAAC,GACzF,OAAO,CAAC,IAAI,CAAC,oBAAoB,EAAE,gBAAgB,CAAC,CAAC,CAAC;AAExD,QAAA,MAAM,SAAS,sDAAuD,cAAc,uBA8CnF,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"Connector.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/Connector.tsx"],"names":[],"mappings":";AAQA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAEjE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAC;AA0E1E,KAAK,cAAc,GAAG,IAAI,CAAC,qBAAqB,EAAE,IAAI,GAAG,MAAM,GAAG,aAAa,GAAG,QAAQ,CAAC,GACzF,OAAO,CAAC,IAAI,CAAC,oBAAoB,EAAE,gBAAgB,CAAC,CAAC,CAAC;AAExD,QAAA,MAAM,SAAS,sDAAuD,cAAc,uBA8CnF,CAAC;AAEF,eAAe,SAAS,CAAC"}

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

@@ -1 +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,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAEjF,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAGtC,OAAO,mBAAmB,MAAM,uBAAuB,CAAC;AAGxD,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;AAO5C,MAAM,WAAW,GAAG,EAAE,CAAC;AACvB,MAAM,OAAO,GAAG,CAAC,MAAgB,EAAE,EAAE;IACnC,MAAM,OAAO,GAAW,MAAM;SAC3B,GAAG,CAAC,CAAC,KAAa,EAAE,GAAW,EAAE,GAAa,EAAE,EAAE;QACjD,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,KAAK,CAAC;QACvB,MAAM,IAAI,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC;QAC1B,MAAM,IAAI,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC;QAC1B,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;QAE1B,sDAAsD;QACtD,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI;YAAE,OAAO,IAAI,CAAC;QAEhC,kEAAkE;QAClE,IAAI,IAAI,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC;YAAE,OAAO,IAAI,CAAC;QAExD,IAAI,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC;YAClB,iBAAiB;YACjB,OAAO,IAAI,CAAC,IACV,CAAC,GAAG,WACN,IAAI,WAAW,IAAI,WAAW,WAAW,WAAW,IAAI,WAAW,EAAE,CAAC;QAExE,gBAAgB;QAChB,IAAI,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC;YAClB,OAAO,IAAI,CAAC,IACV,CAAC,GAAG,WACN,IAAI,WAAW,IAAI,WAAW,UAAU,WAAW,IAAI,WAAW,EAAE,CAAC;QAEvE,aAAa;QACb,IAAI,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC;YAClB,OAAO,IACL,CAAC,GAAG,WACN,IAAI,CAAC,IAAI,WAAW,IAAI,WAAW,WAAW,WAAW,IAAI,WAAW,EAAE,CAAC;QAE7E,cAAc;QACd,IAAI,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC;YAClB,OAAO,IACL,CAAC,GAAG,WACN,IAAI,CAAC,IAAI,WAAW,IAAI,WAAW,UAAU,WAAW,IAAI,WAAW,EAAE,CAAC;QAE5E,OAAO,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;IACtB,CAAC,CAAC;SACD,IAAI,CAAC,EAAE,CAAC,CAAC;IACZ,OAAO,IAAI,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;AACjC,CAAC,CAAC;AAKF,MAAM,SAAS,GAAG,CAAC,EAAE,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE,cAAc,EAAE,MAAM,EAAkB,EAAE,EAAE;IACtF,MAAM,KAAK,GAAG,cAAc,IAAI,EAAE,CAAC;IACnC,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IACjE,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,MAAM,QAAQ,GAAyB;QACrC,OAAO,EAAE,WAAW;QACpB,KAAK;KACN,CAAC;IACF,OAAO,IAAI,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CAC/B,wBACE,eACE,EAAE,EAAE,EAAE,EACN,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,EAClB,MAAM,EACJ,UAAU,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,EAE5F,WAAW,EAAE,UAAU,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EACjD,IAAI,EAAC,MAAM,GACX,EACD,WAAW,IAAI,CACd,yBACE,CAAC,EAAE,WAAW,CAAC,CAAC,GAAG,WAAW,CAAC,KAAK,EACpC,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,EACnB,KAAK,EAAE,WAAW,CAAC,KAAK,EACxB,MAAM,EAAE,WAAW,CAAC,MAAM,aAEzB,WAAW,EAAE,KAAK,IAAI,CACrB,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,YACpC,KAAC,WAAW,IAAC,SAAS,EAAE,CAAC,CAAC,UAAU,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,YACnD,WAAW,CAAC,KAAK,GACN,GACT,CACR,EACA,CAAC,QAAQ,IAAI,CACZ,KAAC,SAAS,IACR,SAAS,EAAE,CAAC,CAAC,UAAU,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,EACzC,cAAc,EAAE,CAAC,CAAgC,EAAE,EAAE,CACnD,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,aAAa,EAAE,QAAQ,CAAC,GAE/C,CACH,IACa,CACjB,KAjCK,EAAE,CAkCN,CACL,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import { MouseEvent, useContext } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp, Flex, Text, useTheme } from '@pega/cosmos-react-core';\n\nimport { AddButton } from './AddNode';\nimport { AddNodeHandlerParams } from './Renderer/Renderer.types';\nimport { PlaceHolderConnector } from './Utils/addNodeUtils';\nimport FlowModellerContext from './FlowModellerContext';\nimport { PlottedGraphConnector } from './Renderer/Utils/GraphLayout';\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\ninterface Points {\n  x: number;\n  y: number;\n}\n\nconst curveRadius = 12;\nconst genLine = (points: Points[]) => {\n  const lineStr: string = points\n    .map((point: Points, idx: number, arr: Points[]) => {\n      const { x, y } = point;\n      const prev = arr[idx - 1];\n      const next = arr[idx + 1];\n      const line = `L${x},${y}`;\n\n      // if the point is extreme end, no need to add a curve\n      if (!prev || !next) return line;\n\n      // if point is colinear with prev and next, no need to add a curve\n      if (prev.x === next.x || prev.y === next.y) return line;\n\n      if (point.x > next.x)\n        // BOTTOM-RIGHT ↲\n        return `L${x},${\n          y - curveRadius\n        }a${curveRadius},${curveRadius} 0 0 1 -${curveRadius},${curveRadius}`;\n\n      // BOTTOM-LEFT ↳\n      if (point.x < next.x)\n        return `L${x},${\n          y - curveRadius\n        }a${curveRadius},${curveRadius} 0 0 0 ${curveRadius},${curveRadius}`;\n\n      // TOP-LEFT ↱\n      if (point.x < prev.x)\n        return `L${\n          x + curveRadius\n        },${y}a${curveRadius},${curveRadius} 0 0 0 -${curveRadius},${curveRadius}`;\n\n      // TOP-RIGHT ↴\n      if (point.x > prev.x)\n        return `L${\n          x - curveRadius\n        },${y}a${curveRadius},${curveRadius} 0 0 1 ${curveRadius},${curveRadius}`;\n\n      return `L${x},${y}`;\n    })\n    .join('');\n  return `M${lineStr.substr(1)}`;\n};\n\ntype ConnectorProps = Pick<PlottedGraphConnector, 'id' | 'data' | 'labelLayout' | 'points'> &\n  Partial<Pick<PlaceHolderConnector, 'realConnectors'>>;\n\nconst Connector = ({ id, labelLayout, data, realConnectors, points }: ConnectorProps) => {\n  const refId = realConnectors || id;\n  const { readOnly, highlights } = useContext(FlowModellerContext);\n  const theme = useTheme();\n\n  const metaData: AddNodeHandlerParams = {\n    refType: 'connector',\n    refId\n  };\n  return data.type === 'default' ? (\n    <g key={id}>\n      <path\n        id={id}\n        d={genLine(points)}\n        stroke={\n          highlights?.connectors?.[id] ? theme.base.colors.red.medium : theme.base.colors.slate.dark\n        }\n        strokeWidth={highlights?.connectors?.[id] ? 2 : 1}\n        fill='none'\n      />\n      {labelLayout && (\n        <foreignObject\n          x={labelLayout.x - labelLayout.width}\n          y={points[3].y - 20}\n          width={labelLayout.width}\n          height={labelLayout.height}\n        >\n          {labelLayout?.value && (\n            <Flex container={{ justify: 'center' }}>\n              <StyledLabel highlight={!!highlights?.connectors?.[id]}>\n                {labelLayout.value}\n              </StyledLabel>\n            </Flex>\n          )}\n          {!readOnly && (\n            <AddButton\n              highlight={!!highlights?.connectors?.[id]}\n              addNodeHandler={(e: MouseEvent<HTMLButtonElement>) =>\n                data?.onNodeCreate(e.currentTarget, metaData)\n              }\n            />\n          )}\n        </foreignObject>\n      )}\n    </g>\n  ) : null;\n};\n\nexport default Connector;\n"]}
+{"version":3,"file":"Connector.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/Connector.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useContext } from 'react';\nimport type { MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp, Flex, Text, useTheme } from '@pega/cosmos-react-core';\n\nimport { AddButton } from './AddNode';\nimport type { AddNodeHandlerParams } from './Renderer/Renderer.types';\nimport type { PlaceHolderConnector } from './Utils/addNodeUtils';\nimport FlowModellerContext from './FlowModellerContext';\nimport type { PlottedGraphConnector } from './Renderer/Utils/GraphLayout';\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\ninterface Points {\n  x: number;\n  y: number;\n}\n\nconst curveRadius = 12;\nconst genLine = (points: Points[]) => {\n  const lineStr: string = points\n    .map((point: Points, idx: number, arr: Points[]) => {\n      const { x, y } = point;\n      const prev = arr[idx - 1];\n      const next = arr[idx + 1];\n      const line = `L${x},${y}`;\n\n      // if the point is extreme end, no need to add a curve\n      if (!prev || !next) return line;\n\n      // if point is colinear with prev and next, no need to add a curve\n      if (prev.x === next.x || prev.y === next.y) return line;\n\n      if (point.x > next.x)\n        // BOTTOM-RIGHT ↲\n        return `L${x},${\n          y - curveRadius\n        }a${curveRadius},${curveRadius} 0 0 1 -${curveRadius},${curveRadius}`;\n\n      // BOTTOM-LEFT ↳\n      if (point.x < next.x)\n        return `L${x},${\n          y - curveRadius\n        }a${curveRadius},${curveRadius} 0 0 0 ${curveRadius},${curveRadius}`;\n\n      // TOP-LEFT ↱\n      if (point.x < prev.x)\n        return `L${\n          x + curveRadius\n        },${y}a${curveRadius},${curveRadius} 0 0 0 -${curveRadius},${curveRadius}`;\n\n      // TOP-RIGHT ↴\n      if (point.x > prev.x)\n        return `L${\n          x - curveRadius\n        },${y}a${curveRadius},${curveRadius} 0 0 1 ${curveRadius},${curveRadius}`;\n\n      return `L${x},${y}`;\n    })\n    .join('');\n  return `M${lineStr.substr(1)}`;\n};\n\ntype ConnectorProps = Pick<PlottedGraphConnector, 'id' | 'data' | 'labelLayout' | 'points'> &\n  Partial<Pick<PlaceHolderConnector, 'realConnectors'>>;\n\nconst Connector = ({ id, labelLayout, data, realConnectors, points }: ConnectorProps) => {\n  const refId = realConnectors || id;\n  const { readOnly, highlights } = useContext(FlowModellerContext);\n  const theme = useTheme();\n\n  const metaData: AddNodeHandlerParams = {\n    refType: 'connector',\n    refId\n  };\n  return data.type === 'default' ? (\n    <g key={id}>\n      <path\n        id={id}\n        d={genLine(points)}\n        stroke={\n          highlights?.connectors?.[id] ? theme.base.colors.red.medium : theme.base.colors.slate.dark\n        }\n        strokeWidth={highlights?.connectors?.[id] ? 2 : 1}\n        fill='none'\n      />\n      {labelLayout && (\n        <foreignObject\n          x={labelLayout.x - labelLayout.width}\n          y={points[3].y - 20}\n          width={labelLayout.width}\n          height={labelLayout.height}\n        >\n          {labelLayout?.value && (\n            <Flex container={{ justify: 'center' }}>\n              <StyledLabel highlight={!!highlights?.connectors?.[id]}>\n                {labelLayout.value}\n              </StyledLabel>\n            </Flex>\n          )}\n          {!readOnly && (\n            <AddButton\n              highlight={!!highlights?.connectors?.[id]}\n              addNodeHandler={(e: MouseEvent<HTMLButtonElement>) =>\n                data?.onNodeCreate(e.currentTarget, metaData)\n              }\n            />\n          )}\n        </foreignObject>\n      )}\n    </g>\n  ) : null;\n};\n\nexport default Connector;\n"]}

package/lib/components/FlowModeller/DeletePopover.d.ts

@@ -1,7 +1,7 @@
-import { ChangeEvent, Ref } from 'react';
-import { PopoverProps } from '@pega/cosmos-react-core';
-import { GraphData } from './Renderer/Utils/Graph';
-import { GraphDataAsMap, DeleteNodeOutcome } from './Utils/deleteNodeUtils';
+import type { ChangeEvent, Ref } from 'react';
+import type { PopoverProps } from '@pega/cosmos-react-core';
+import type { GraphData } from './Renderer/Utils/Graph';
+import type { GraphDataAsMap, DeleteNodeOutcome } from './Utils/deleteNodeUtils';
 export interface DeletePopoverProps {
     show: boolean;
     target: PopoverProps['target'];
@@ -14,6 +14,6 @@ export interface DeletePopoverProps {
     ref?: Ref<HTMLDivElement>;
 }
 export declare const StyledDeletePopover: import("styled-components").StyledComponent<(<Modifiers extends string = string>(props: PopoverProps<Modifiers> & import("@pega/cosmos-react-core").ForwardProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null), import("styled-components").DefaultTheme, {}, never>;
-declare const DeletePopover: import("react").ForwardRefExoticComponent<Pick<DeletePopoverProps, "show" | "target" | "onChange" | "onSubmit" | "onCancel" | "flowGraphData" | "rendererGraphData" | "nodeId"> & import("react").RefAttributes<HTMLDivElement>>;
+declare const DeletePopover: import("react").ForwardRefExoticComponent<Omit<DeletePopoverProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
 export default DeletePopover;
 //# sourceMappingURL=DeletePopover.d.ts.map

package/lib/components/FlowModeller/DeletePopover.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DeletePopover.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/DeletePopover.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,WAAW,EAIX,GAAG,EACJ,MAAM,OAAO,CAAC;AAGf,OAAO,EASL,YAAY,EACb,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAiB,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAwB,EACtB,cAAc,EACd,iBAAiB,EAElB,MAAM,yBAAyB,CAAC;AAGjC,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAC;IAC/B,aAAa,EAAE,SAAS,CAAC;IACzB,iBAAiB,EAAE,SAAS,CAAC;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CACT,aAAa,EAAE,cAAc,EAC7B,aAAa,EAAE,cAAc,GAAG,SAAS,EACzC,EAAE,CAAC,EAAE,WAAW,KACb,IAAI,CAAC;IACV,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,iBAAiB,EAAE,EAAE,EAAE,KAAK,KAAK,IAAI,CAAC;IAC3D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,mBAAmB,2TAE/B,CAAC;AAEF,QAAA,MAAM,aAAa,kOA6NjB,CAAC;AAEH,eAAe,aAAa,CAAC"}
+{"version":3,"file":"DeletePopover.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/DeletePopover.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAsB,WAAW,EAAmB,GAAG,EAAE,MAAM,OAAO,CAAC;AAanF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAG5D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAExD,OAAO,KAAK,EACV,cAAc,EACd,iBAAiB,EAElB,MAAM,yBAAyB,CAAC;AAGjC,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAC;IAC/B,aAAa,EAAE,SAAS,CAAC;IACzB,iBAAiB,EAAE,SAAS,CAAC;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CACT,aAAa,EAAE,cAAc,EAC7B,aAAa,EAAE,cAAc,GAAG,SAAS,EACzC,EAAE,CAAC,EAAE,WAAW,KACb,IAAI,CAAC;IACV,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,iBAAiB,EAAE,EAAE,EAAE,KAAK,KAAK,IAAI,CAAC;IAC3D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,mBAAmB,2TAE/B,CAAC;AAEF,QAAA,MAAM,aAAa,4HA6NjB,CAAC;AAEH,eAAe,aAAa,CAAC"}

package/lib/components/FlowModeller/DeletePopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"DeletePopover.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/DeletePopover.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  useState,\n  ChangeEventHandler,\n  ChangeEvent,\n  useEffect,\n  forwardRef,\n  PropsWithoutRef,\n  Ref\n} from 'react';\nimport styled from 'styled-components';\n\nimport {\n  Button,\n  Select,\n  Option,\n  Text,\n  Flex,\n  useI18n,\n  Icon,\n  Popover,\n  PopoverProps\n} from '@pega/cosmos-react-core';\n\nimport { DirectedGraph, GraphData } from './Renderer/Utils/Graph';\nimport deleteNodeUtils, {\n  GraphDataAsMap,\n  DeleteNodeOutcome,\n  DeleteNodeModalOption\n} from './Utils/deleteNodeUtils';\nimport { NodeProps } from './Node/Node.types';\n\nexport interface DeletePopoverProps {\n  show: boolean;\n  target: PopoverProps['target'];\n  flowGraphData: GraphData;\n  rendererGraphData: GraphData;\n  nodeId: string;\n  onChange?: (\n    itemsToDelete: GraphDataAsMap,\n    itemsToRetain: GraphDataAsMap | undefined,\n    ev?: ChangeEvent\n  ) => void;\n  onSubmit?: (outcome: DeleteNodeOutcome, ev: Event) => void;\n  onCancel?: () => void;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport const StyledDeletePopover = styled(Popover)`\n  max-width: 25rem;\n`;\n\nconst DeletePopover = forwardRef(function DeletePopover(\n  {\n    show,\n    target,\n    flowGraphData,\n    rendererGraphData,\n    nodeId,\n    onChange,\n    onSubmit,\n    onCancel\n  }: PropsWithoutRef<DeletePopoverProps>,\n  ref: DeletePopoverProps['ref']\n) {\n  const [currentSelection, setCurrentSelection] = useState<number>(0);\n\n  const t = useI18n();\n\n  const graph = new DirectedGraph(rendererGraphData);\n\n  const deleteOptionsResult = deleteNodeUtils.getDeleteNodeOptions(graph, nodeId);\n\n  const deleteOptions: DeleteNodeModalOption[] = deleteOptionsResult.options;\n  const nodeType = (graph.getNode(nodeId) as NodeProps).type.name;\n\n  useEffect(() => {\n    if (deleteOptionsResult) {\n      const itemsToDelete: GraphDataAsMap =\n        nodeType !== 'Decision'\n          ? deleteOptionsResult.allItems\n          : deleteOptions[currentSelection].restItems;\n\n      // add the actual node to be deleted also, to the list\n      itemsToDelete.nodes[nodeId] = graph.getNode(nodeId);\n\n      onChange?.(itemsToDelete, deleteOptions[currentSelection].pathItems);\n    }\n  }, [rendererGraphData]);\n\n  const onChangeHandler: ChangeEventHandler = (ev: ChangeEvent<HTMLSelectElement>) => {\n    const newSelection =\n      ev.target.selectedIndex >= deleteOptions.length ? -1 : ev.target.selectedIndex;\n\n    setCurrentSelection(newSelection);\n\n    let itemsToDelete;\n    if (deleteOptionsResult) itemsToDelete = deleteOptionsResult.allItems;\n\n    let itemsToRetain;\n\n    if (newSelection !== -1) {\n      itemsToDelete = deleteOptions[newSelection].restItems;\n      itemsToRetain = deleteOptions[newSelection].pathItems;\n    }\n\n    // add the actual node to be deleted also, to the list\n    if (itemsToDelete) itemsToDelete.nodes[nodeId] = graph.getNode(nodeId);\n\n    if (itemsToDelete) onChange?.(itemsToDelete, itemsToRetain, ev);\n  };\n\n  const submitHandler = (ev: Event) => {\n    let error = true;\n    const finalGraph = new DirectedGraph(flowGraphData);\n    const finalDeleteOptionsResult = deleteNodeUtils.getDeleteNodeOptions(finalGraph, nodeId);\n\n    let newTargetNode = finalDeleteOptionsResult?.destinationNodeId\n      ? finalGraph.getNode(finalDeleteOptionsResult.destinationNodeId)\n      : undefined;\n    let itemsToDelete = finalDeleteOptionsResult.allItems;\n\n    const selectedOption =\n      currentSelection === -1 || nodeType !== 'Decision'\n        ? undefined\n        : finalDeleteOptionsResult?.options[currentSelection];\n    let finalMetaData = selectedOption;\n\n    if (selectedOption) {\n      const pathConnectors = selectedOption.pathItems.connectors;\n      const connectors = Object.keys(pathConnectors);\n      for (let i = 0; i < connectors.length; i += 1) {\n        const connectorData = pathConnectors[connectors[i]];\n        if (\n          connectorData &&\n          finalGraph.getNode(connectorData.fromNodeId).type?.minConnectors !== 0 &&\n          connectorData.toNodeId === finalDeleteOptionsResult.destinationNodeId\n        ) {\n          error = false;\n          break;\n        }\n      }\n      if (error) {\n        onSubmit?.(\n          {\n            graphData: {\n              nodes: [],\n              connectors: []\n            },\n            updates: {\n              connectors: []\n            },\n            deletes: { nodes: {}, connectors: {} },\n            error: true\n          },\n          ev\n        );\n        return;\n      }\n\n      finalMetaData = finalDeleteOptionsResult.options.find(\n        current => selectedOption.connector.id === current.connector.id\n      );\n\n      if (finalMetaData) {\n        // get the ref of the first node of the retaining path\n        newTargetNode = finalGraph.getNode(finalMetaData.connector.toNodeId);\n        itemsToDelete = finalMetaData.restItems;\n      }\n    }\n\n    // get the in-connectors of the selected node\n    const nodeInConnectors = finalGraph.getInConnectors(nodeId);\n\n    // iterate and set the targetNode to the above first node instead of the selected node.\n\n    nodeInConnectors.forEach(con => {\n      finalGraph.setConnector(con.id, {\n        toNodeId: newTargetNode ? newTargetNode.id : undefined\n      });\n    });\n\n    const resultGraphData = finalGraph.getGraphData();\n\n    itemsToDelete.nodes[nodeId] = finalGraph.getNode(nodeId);\n\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\n    if (finalMetaData) {\n      itemsToDelete.connectors[finalMetaData.connector.id] = finalMetaData.connector;\n    }\n\n    // filter the highlighted connectors\n    const connectors = resultGraphData.connectors.filter(item => {\n      return itemsToDelete.connectors[item.id] === undefined;\n    });\n\n    const outcome: DeleteNodeOutcome = {\n      graphData: {\n        nodes: nodes as NodeProps[],\n        connectors\n      },\n      updates: {\n        connectors: nodeInConnectors\n      },\n      deletes: itemsToDelete,\n      error: false\n    };\n    onSubmit?.(outcome, ev);\n  };\n\n  const onCancelHandler = () => {\n    onCancel?.();\n  };\n\n  return (\n    <StyledDeletePopover\n      show={show}\n      target={target}\n      placement='right-end'\n      ref={ref}\n      modifiers={[\n        {\n          name: 'offset',\n          options: { offset: [0, 8] }\n        }\n      ]}\n    >\n      <Flex container={{ gap: 2, pad: 2, direction: 'column' }}>\n        <Flex container={{ alignItems: 'center', justify: 'between' }}>\n          <Text variant='h4'>{t('delete_step_title')}</Text>\n          <Button variant='simple' icon label={t('close')} onClick={onCancelHandler}>\n            <Icon name='times' />\n          </Button>\n        </Flex>\n        {nodeType === 'Decision' ? (\n          <>\n            <Text>{t('delete_decision_step')}</Text>\n            <Select\n              id='select-demo'\n              label={t('delete_step_outcome')}\n              required\n              onChange={onChangeHandler}\n            >\n              {deleteOptions.map((item, index) => {\n                return (\n                  <Option key={item.connector.id} selected={currentSelection === index}>\n                    {item.connector.label ? item.connector.label : item.connector.id}\n                  </Option>\n                );\n              })}\n\n              <Option key='none' selected={currentSelection === -1}>\n                {t('delete_all_outcomes')}\n              </Option>\n            </Select>\n          </>\n        ) : (\n          <Text>{t('delete_step')}</Text>\n        )}\n\n        <Flex container={{ direction: 'row', justify: 'between' }}>\n          <Button onClick={onCancelHandler}>{t('cancel')}</Button>\n          <Button variant='primary' onClick={submitHandler}>\n            {t('delete')}\n          </Button>\n        </Flex>\n      </Flex>\n    </StyledDeletePopover>\n  );\n});\n\nexport default DeletePopover;\n"]}
+{"version":3,"file":"DeletePopover.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/DeletePopover.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useEffect, forwardRef } from 'react';\nimport type { ChangeEventHandler, ChangeEvent, PropsWithoutRef, Ref } from 'react';\nimport styled from 'styled-components';\n\nimport {\n  Button,\n  Select,\n  Option,\n  Text,\n  Flex,\n  useI18n,\n  Icon,\n  Popover\n} from '@pega/cosmos-react-core';\nimport type { PopoverProps } from '@pega/cosmos-react-core';\n\nimport { DirectedGraph } from './Renderer/Utils/Graph';\nimport type { GraphData } from './Renderer/Utils/Graph';\nimport deleteNodeUtils from './Utils/deleteNodeUtils';\nimport type {\n  GraphDataAsMap,\n  DeleteNodeOutcome,\n  DeleteNodeModalOption\n} from './Utils/deleteNodeUtils';\nimport type { NodeProps } from './Node/Node.types';\n\nexport interface DeletePopoverProps {\n  show: boolean;\n  target: PopoverProps['target'];\n  flowGraphData: GraphData;\n  rendererGraphData: GraphData;\n  nodeId: string;\n  onChange?: (\n    itemsToDelete: GraphDataAsMap,\n    itemsToRetain: GraphDataAsMap | undefined,\n    ev?: ChangeEvent\n  ) => void;\n  onSubmit?: (outcome: DeleteNodeOutcome, ev: Event) => void;\n  onCancel?: () => void;\n  ref?: Ref<HTMLDivElement>;\n}\n\nexport const StyledDeletePopover = styled(Popover)`\n  max-width: 25rem;\n`;\n\nconst DeletePopover = forwardRef(function DeletePopover(\n  {\n    show,\n    target,\n    flowGraphData,\n    rendererGraphData,\n    nodeId,\n    onChange,\n    onSubmit,\n    onCancel\n  }: PropsWithoutRef<DeletePopoverProps>,\n  ref: DeletePopoverProps['ref']\n) {\n  const [currentSelection, setCurrentSelection] = useState<number>(0);\n\n  const t = useI18n();\n\n  const graph = new DirectedGraph(rendererGraphData);\n\n  const deleteOptionsResult = deleteNodeUtils.getDeleteNodeOptions(graph, nodeId);\n\n  const deleteOptions: DeleteNodeModalOption[] = deleteOptionsResult.options;\n  const nodeType = (graph.getNode(nodeId) as NodeProps).type.name;\n\n  useEffect(() => {\n    if (deleteOptionsResult) {\n      const itemsToDelete: GraphDataAsMap =\n        nodeType !== 'Decision'\n          ? deleteOptionsResult.allItems\n          : deleteOptions[currentSelection].restItems;\n\n      // add the actual node to be deleted also, to the list\n      itemsToDelete.nodes[nodeId] = graph.getNode(nodeId);\n\n      onChange?.(itemsToDelete, deleteOptions[currentSelection].pathItems);\n    }\n  }, [rendererGraphData]);\n\n  const onChangeHandler: ChangeEventHandler = (ev: ChangeEvent<HTMLSelectElement>) => {\n    const newSelection =\n      ev.target.selectedIndex >= deleteOptions.length ? -1 : ev.target.selectedIndex;\n\n    setCurrentSelection(newSelection);\n\n    let itemsToDelete;\n    if (deleteOptionsResult) itemsToDelete = deleteOptionsResult.allItems;\n\n    let itemsToRetain;\n\n    if (newSelection !== -1) {\n      itemsToDelete = deleteOptions[newSelection].restItems;\n      itemsToRetain = deleteOptions[newSelection].pathItems;\n    }\n\n    // add the actual node to be deleted also, to the list\n    if (itemsToDelete) itemsToDelete.nodes[nodeId] = graph.getNode(nodeId);\n\n    if (itemsToDelete) onChange?.(itemsToDelete, itemsToRetain, ev);\n  };\n\n  const submitHandler = (ev: Event) => {\n    let error = true;\n    const finalGraph = new DirectedGraph(flowGraphData);\n    const finalDeleteOptionsResult = deleteNodeUtils.getDeleteNodeOptions(finalGraph, nodeId);\n\n    let newTargetNode = finalDeleteOptionsResult?.destinationNodeId\n      ? finalGraph.getNode(finalDeleteOptionsResult.destinationNodeId)\n      : undefined;\n    let itemsToDelete = finalDeleteOptionsResult.allItems;\n\n    const selectedOption =\n      currentSelection === -1 || nodeType !== 'Decision'\n        ? undefined\n        : finalDeleteOptionsResult?.options[currentSelection];\n    let finalMetaData = selectedOption;\n\n    if (selectedOption) {\n      const pathConnectors = selectedOption.pathItems.connectors;\n      const connectors = Object.keys(pathConnectors);\n      for (let i = 0; i < connectors.length; i += 1) {\n        const connectorData = pathConnectors[connectors[i]];\n        if (\n          connectorData &&\n          finalGraph.getNode(connectorData.fromNodeId).type?.minConnectors !== 0 &&\n          connectorData.toNodeId === finalDeleteOptionsResult.destinationNodeId\n        ) {\n          error = false;\n          break;\n        }\n      }\n      if (error) {\n        onSubmit?.(\n          {\n            graphData: {\n              nodes: [],\n              connectors: []\n            },\n            updates: {\n              connectors: []\n            },\n            deletes: { nodes: {}, connectors: {} },\n            error: true\n          },\n          ev\n        );\n        return;\n      }\n\n      finalMetaData = finalDeleteOptionsResult.options.find(\n        current => selectedOption.connector.id === current.connector.id\n      );\n\n      if (finalMetaData) {\n        // get the ref of the first node of the retaining path\n        newTargetNode = finalGraph.getNode(finalMetaData.connector.toNodeId);\n        itemsToDelete = finalMetaData.restItems;\n      }\n    }\n\n    // get the in-connectors of the selected node\n    const nodeInConnectors = finalGraph.getInConnectors(nodeId);\n\n    // iterate and set the targetNode to the above first node instead of the selected node.\n\n    nodeInConnectors.forEach(con => {\n      finalGraph.setConnector(con.id, {\n        toNodeId: newTargetNode ? newTargetNode.id : undefined\n      });\n    });\n\n    const resultGraphData = finalGraph.getGraphData();\n\n    itemsToDelete.nodes[nodeId] = finalGraph.getNode(nodeId);\n\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\n    if (finalMetaData) {\n      itemsToDelete.connectors[finalMetaData.connector.id] = finalMetaData.connector;\n    }\n\n    // filter the highlighted connectors\n    const connectors = resultGraphData.connectors.filter(item => {\n      return itemsToDelete.connectors[item.id] === undefined;\n    });\n\n    const outcome: DeleteNodeOutcome = {\n      graphData: {\n        nodes: nodes as NodeProps[],\n        connectors\n      },\n      updates: {\n        connectors: nodeInConnectors\n      },\n      deletes: itemsToDelete,\n      error: false\n    };\n    onSubmit?.(outcome, ev);\n  };\n\n  const onCancelHandler = () => {\n    onCancel?.();\n  };\n\n  return (\n    <StyledDeletePopover\n      show={show}\n      target={target}\n      placement='right-end'\n      ref={ref}\n      modifiers={[\n        {\n          name: 'offset',\n          options: { offset: [0, 8] }\n        }\n      ]}\n    >\n      <Flex container={{ gap: 2, pad: 2, direction: 'column' }}>\n        <Flex container={{ alignItems: 'center', justify: 'between' }}>\n          <Text variant='h4'>{t('delete_step_title')}</Text>\n          <Button variant='simple' icon label={t('close')} onClick={onCancelHandler}>\n            <Icon name='times' />\n          </Button>\n        </Flex>\n        {nodeType === 'Decision' ? (\n          <>\n            <Text>{t('delete_decision_step')}</Text>\n            <Select\n              id='select-demo'\n              label={t('delete_step_outcome')}\n              required\n              onChange={onChangeHandler}\n            >\n              {deleteOptions.map((item, index) => {\n                return (\n                  <Option key={item.connector.id} selected={currentSelection === index}>\n                    {item.connector.label ? item.connector.label : item.connector.id}\n                  </Option>\n                );\n              })}\n\n              <Option key='none' selected={currentSelection === -1}>\n                {t('delete_all_outcomes')}\n              </Option>\n            </Select>\n          </>\n        ) : (\n          <Text>{t('delete_step')}</Text>\n        )}\n\n        <Flex container={{ direction: 'row', justify: 'between' }}>\n          <Button onClick={onCancelHandler}>{t('cancel')}</Button>\n          <Button variant='primary' onClick={submitHandler}>\n            {t('delete')}\n          </Button>\n        </Flex>\n      </Flex>\n    </StyledDeletePopover>\n  );\n});\n\nexport default DeletePopover;\n"]}

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

@@ -1,5 +1,5 @@
-import { PropsWithoutRef } from 'react';
-import { FlowModellerProps } from './FlowModeller.types';
+import type { PropsWithoutRef } from 'react';
+import type { FlowModellerProps } from './FlowModeller.types';
 declare const FlowModeller: ({ graphData, highlightData, onNodeActionClick, onNodeAdd, nodeLibrary, onNodeClick, onDelete, actions, readOnly, selectedNodeId }: PropsWithoutRef<FlowModellerProps>) => JSX.Element;
 export default FlowModeller;
 //# sourceMappingURL=FlowModeller.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"FlowModeller.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EAQhB,MAAM,OAAO,CAAC;AA+Bf,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAsFzD,QAAA,MAAM,YAAY,sIAWf,gBAAgB,iBAAiB,CAAC,gBAgTpC,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"FlowModeller.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAuB,MAAM,OAAO,CAAC;AAuBlE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAsF9D,QAAA,MAAM,YAAY,sIAWf,gBAAgB,iBAAiB,CAAC,gBAgTpC,CAAC;AAEF,eAAe,YAAY,CAAC"}