npm - @pega/cosmos-react-build - Versions diffs - 3.0.0-dev.17.0 → 3.0.0-dev.18.2 - Mend

@pega/cosmos-react-build 3.0.0-dev.17.0 → 3.0.0-dev.18.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (61) hide show

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

@@ -1,9 +1,10 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef, useRef, useState } from 'react';
-import { useAfterInitialEffect } from '@pega/cosmos-react-core';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useContext, useEffect, useRef, useState } from 'react';
+import { useI18n, Button, Modal, ModalManagerContext, useAfterInitialEffect } from '@pega/cosmos-react-core';
 import ObjectPicker from './ObjectPicker';
 import ObjectSummary from './ObjectSummary';
-const ObjectSelect = forwardRef(({ items, value, configuration, disabled, onChange, onPreview, onLinkClick, loading, ...restProps }, ref) => {
+const ObjectSelect = forwardRef(({ items, value, configuration, disabled, onChange, onPreview, onLinkClick, loading, form, ...restProps }, ref) => {
+    const t = useI18n();
     const [mode, setMode] = useState(value ? 'summary' : 'picker');
     const objectPickerRef = useRef(null);
     const objectSummaryRef = useRef(null);
@@ -13,10 +14,66 @@ const ObjectSelect = forwardRef(({ items, value, configuration, disabled, onChan
             : objectPickerRef.current?.querySelector('input');
         element?.focus();
     }, [mode]);
+    const progressMsgRef = useRef(t('loading'));
+    const modalMethods = useRef();
+    const { create: createModal } = useContext(ModalManagerContext);
+    const closeModal = () => {
+        if (form?.loading && progressMsgRef.current === t('submitting'))
+            return;
+        progressMsgRef.current = t('loading');
+    };
+    let modalContent = null;
+    if (mode === 'create' && form && !form.loading) {
+        modalContent = _jsx(form.renderer, { ...form.rendererProps });
+    }
+    let formActions = null;
+    if (mode === 'create' && (!form?.loading || progressMsgRef.current === t('submitting'))) {
+        const close = () => {
+            if (mode === 'create') {
+                modalMethods.current?.dismiss();
+            }
+            else {
+                closeModal();
+            }
+        };
+        formActions = (_jsxs(_Fragment, { children: [_jsx(Button, { disabled: form?.loading, onClick: () => {
+                        form?.onDismiss?.({ close });
+                    }, children: t('cancel') }), _jsx(Button, { disabled: form?.loading, type: 'submit', variant: 'primary', onClick: () => {
+                        progressMsgRef.current = t('submitting');
+                        form?.onSubmit?.({ close });
+                    }, children: t('submit') })] }));
+    }
+    useEffect(() => {
+        if (mode !== 'create') {
+            modalMethods.current = undefined;
+            return;
+        }
+        const modalProps = {
+            progress: form?.loading ? { message: progressMsgRef.current } : undefined,
+            children: modalContent,
+            actions: formActions,
+            onRequestDismiss: form?.loading && progressMsgRef.current === t('submitting') ? () => false : undefined
+        };
+        if (modalMethods.current) {
+            modalMethods.current.update(modalProps);
+        }
+        else {
+            modalMethods.current = createModal(Modal, {
+                ...modalProps,
+                heading: t('create_new'),
+                onBeforeOpen: form?.onBeforeOpen,
+                onAfterClose: () => {
+                    form?.onAfterClose?.();
+                    progressMsgRef.current = t('loading');
+                    setMode('summary');
+                }
+            });
+        }
+    }, [mode, modalContent, form?.loading, formActions]);
     return (_jsx("div", { ref: ref, children: value ? (_jsx(ObjectSummary, { ...restProps, value: value, disabled: disabled, onDelete: e => {
                 setMode('picker');
                 onChange?.('', e);
-            }, ref: objectSummaryRef, configuration: configuration, onPreview: e => onPreview?.(value.id, e), onLinkClick: onLinkClick })) : (_jsx(ObjectPicker, { ...restProps, loading: loading, disabled: disabled, ref: objectPickerRef, items: items, onSelect: (id, e) => {
+            }, ref: objectSummaryRef, configuration: configuration, onPreview: e => onPreview?.(value.id, e), onLinkClick: onLinkClick })) : (_jsx(ObjectPicker, { onCreateNew: form ? () => setMode('create') : undefined, ...restProps, loading: loading, disabled: disabled, ref: objectPickerRef, items: items, onSelect: (id, e) => {
                 setMode('summary');
                 onChange?.(id, e);
             } })) }));

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ObjectSelect.js","sourceRoot":"","sources":["../../../src/components/ObjectSelect/ObjectSelect.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA0B,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE7E,OAAO,EAML,qBAAqB,EAEtB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,YAAmC,MAAM,gBAAgB,CAAC;AACjE,OAAO,aAAqC,MAAM,iBAAiB,CAAC;AAwBpE,MAAM,YAAY,GAAwD,UAAU,CAClF,CACE,EACE,KAAK,EACL,KAAK,EACL,aAAa,EACb,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,WAAW,EACX,OAAO,EACP,GAAG,SAAS,EACb,EACD,GAA6B,EAC7B,EAAE;IACF,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAuB,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;IACrF,MAAM,eAAe,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACrD,MAAM,gBAAgB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEtD,qBAAqB,CAAC,GAAG,EAAE;QACzB,MAAM,OAAO,GACX,IAAI,KAAK,SAAS;YAChB,CAAC,CAAC,gBAAgB,CAAC,OAAO,EAAE,aAAa,CAAC,GAAG,CAAC;YAC9C,CAAC,CAAC,eAAe,CAAC,OAAO,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;QACtD,OAAO,EAAE,KAAK,EAAE,CAAC;IACnB,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,OAAO,CACL,cAAK,GAAG,EAAE,GAAG,YACV,KAAK,CAAC,CAAC,CAAC,CACP,KAAC,aAAa,OACR,SAAS,EACb,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,CAAC,CAAC,EAAE;gBACZ,OAAO,CAAC,QAAQ,CAAC,CAAC;gBAClB,QAAQ,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;YACpB,CAAC,EACD,GAAG,EAAE,gBAAgB,EACrB,aAAa,EAAE,aAAa,EAC5B,SAAS,EAAE,CAAC,CAAC,EAAE,CAAC,SAAS,EAAE,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC,EACxC,WAAW,EAAE,WAAW,GACxB,CACH,CAAC,CAAC,CAAC,CACF,KAAC,YAAY,OACP,SAAS,EACb,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,eAAe,EACpB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE;gBAClB,OAAO,CAAC,SAAS,CAAC,CAAC;gBACnB,QAAQ,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;YACpB,CAAC,GACD,CACH,GACG,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, Ref, useRef, useState } from 'react';\n\nimport {\n BaseProps,\n ForwardProps,\n FormControlProps,\n MenuItemProps,\n NoChildrenProp,\n useAfterInitialEffect,\n MenuProps\n} from '@pega/cosmos-react-core';\n\nimport ObjectPicker, { ObjectPickerProps } from './ObjectPicker';\nimport ObjectSummary, { ObjectSummaryProps } from './ObjectSummary';\n\nexport interface ObjectSelectProps\n extends BaseProps,\n NoChildrenProp,\n Omit<FormControlProps, 'value'> {\n /** An array of MenuItemProps to be shown in the ObjectPicker menu. /\n items: MenuProps['items'];\n /* Boolean to trigger loading state for combobox menu /\n loading?: ObjectPickerProps['loading'];\n /* The value for the ObjectSummary /\n value?: ObjectSummaryProps['value'];\n /* Props for configuration popover /\n configuration?: ObjectSummaryProps['configuration'];\n /* Callback fired when a new item is selected and on clearing the selected item. /\n onChange: MenuItemProps['onClick'];\n /* Callback fired when the preview in the ObjectSummary link is clicked. /\n onPreview?: (id: MenuItemProps['id'], e: { href: string }) => void;\n /* Callback fired on click of the link inside summary item /\n onLinkClick?: ObjectSummaryProps['onLinkClick'];\n /* Ref placed on the element. */\n ref?: Ref<HTMLDivElement>;\n}\n\nconst ObjectSelect: FunctionComponent<ObjectSelectProps & ForwardProps> = forwardRef(\n (\n {\n items,\n value,\n configuration,\n disabled,\n onChange,\n onPreview,\n onLinkClick,\n loading,\n ...restProps\n },\n ref: ObjectSelectProps['ref']\n ) => {\n const [mode, setMode] = useState<'picker' \| 'summary'>(value ? 'summary' : 'picker');\n const objectPickerRef = useRef<HTMLDivElement>(null);\n const objectSummaryRef = useRef<HTMLDivElement>(null);\n\n useAfterInitialEffect(() => {\n const element =\n mode === 'summary'\n ? objectSummaryRef.current?.querySelector('a')\n : objectPickerRef.current?.querySelector('input');\n element?.focus();\n }, [mode]);\n\n return (\n <div ref={ref}>\n {value ? (\n <ObjectSummary\n {...restProps}\n value={value}\n disabled={disabled}\n onDelete={e => {\n setMode('picker');\n onChange?.('', e);\n }}\n ref={objectSummaryRef}\n configuration={configuration}\n onPreview={e => onPreview?.(value.id, e)}\n onLinkClick={onLinkClick}\n />\n ) : (\n <ObjectPicker\n {...restProps}\n loading={loading}\n disabled={disabled}\n ref={objectPickerRef}\n items={items}\n onSelect={(id, e) => {\n setMode('summary');\n onChange?.(id, e);\n }}\n />\n )}\n </div>\n );\n }\n);\n\nexport default ObjectSelect;\n"]}
1	+ {"version":3,"file":"ObjectSelect.js","sourceRoot":"","sources":["../../../src/components/ObjectSelect/ObjectSelect.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n ComponentType,\n forwardRef,\n PropsWithoutRef,\n ReactNode,\n Ref,\n useContext,\n useEffect,\n useRef,\n useState\n} from 'react';\n\nimport {\n BaseProps,\n FormControlProps,\n MenuItemProps,\n NoChildrenProp,\n MenuProps,\n DeferInfer,\n ModalProps,\n useI18n,\n Button,\n Modal,\n ModalManagerContext,\n ModalMethods,\n OmitStrict,\n ForwardProps,\n useAfterInitialEffect\n} from '@pega/cosmos-react-core';\n\nimport ObjectPicker, { ObjectPickerProps } from './ObjectPicker';\nimport ObjectSummary, { ObjectSummaryProps } from './ObjectSummary';\n\nexport interface ObjectSelectProps<P extends object = object>\n extends BaseProps,\n NoChildrenProp,\n Omit<FormControlProps, 'value'> {\n /** An array of MenuItemProps to be shown in the ObjectPicker menu. /\n items: MenuProps['items'];\n /* Boolean to trigger loading state for combobox menu /\n loading?: ObjectPickerProps['loading'];\n /* The value for the ObjectSummary /\n value?: ObjectSummaryProps['value'];\n /* Props for configuration popover /\n configuration?: ObjectSummaryProps['configuration'];\n /* Callback fired when a new item is selected and on clearing the selected item. /\n onChange: MenuItemProps['onClick'];\n /* Callback fired when the preview in the ObjectSummary link is clicked. /\n onPreview?: (id: MenuItemProps['id'], e: { href: string }) => void;\n /* Callback fired on click of the link inside summary item /\n onLinkClick?: ObjectSummaryProps['onLinkClick'];\n /* New object creation form options. /\n form?: {\n / Indicates the form is in a loading state either initially or after add is submitted. /\n loading?: boolean;\n /\n * A component to render the add new form.\n /\n renderer: ComponentType<P>;\n /\n Called when a user submits a form.\n /\n onSubmit: ({ close }: { close: () => void }) => void;\n /\n Called when a user cancels a form.\n /\n onDismiss: ({ close }: { close: () => void }) => void;\n /\n Called before the modal opens.\n /\n onBeforeOpen?: ModalProps['onBeforeOpen'];\n /\n Called after the modal closes.\n /\n onAfterClose?: ModalProps['onAfterClose'];\n } & (Record<string, never> extends P\n ? {\n /\n A props object that will be passed to the form renderer.\n /\n rendererProps?: DeferInfer<P>;\n }\n : {\n /\n A props object that will be passed to the form renderer.\n /\n rendererProps: DeferInfer<P>;\n });\n /* Ref placed on the element. */\n ref?: Ref<HTMLDivElement>;\n}\n\nconst ObjectSelect = forwardRef(\n <P extends object = object>(\n {\n items,\n value,\n configuration,\n disabled,\n onChange,\n onPreview,\n onLinkClick,\n loading,\n form,\n ...restProps\n }: PropsWithoutRef<ObjectSelectProps<P>> & ForwardProps,\n ref: ObjectSelectProps['ref']\n ) => {\n const t = useI18n();\n\n const [mode, setMode] = useState<'picker' \| 'summary' \| 'create'>(value ? 'summary' : 'picker');\n const objectPickerRef = useRef<HTMLDivElement>(null);\n const objectSummaryRef = useRef<HTMLDivElement>(null);\n\n useAfterInitialEffect(() => {\n const element =\n mode === 'summary'\n ? objectSummaryRef.current?.querySelector('a')\n : objectPickerRef.current?.querySelector('input');\n element?.focus();\n }, [mode]);\n\n const progressMsgRef = useRef(t('loading'));\n const modalMethods = useRef<ModalMethods>();\n const { create: createModal } = useContext(ModalManagerContext);\n\n const closeModal = () => {\n if (form?.loading && progressMsgRef.current === t('submitting')) return;\n progressMsgRef.current = t('loading');\n };\n\n let modalContent: ReactNode = null;\n if (mode === 'create' && form && !form.loading) {\n modalContent = <form.renderer {...(form.rendererProps as P)} />;\n }\n\n let formActions: ReactNode = null;\n if (mode === 'create' && (!form?.loading \|\| progressMsgRef.current === t('submitting'))) {\n const close = () => {\n if (mode === 'create') {\n modalMethods.current?.dismiss();\n } else {\n closeModal();\n }\n };\n\n formActions = (\n <>\n <Button\n disabled={form?.loading}\n onClick={() => {\n form?.onDismiss?.({ close });\n }}\n >\n {t('cancel')}\n </Button>\n <Button\n disabled={form?.loading}\n type='submit'\n variant='primary'\n onClick={() => {\n progressMsgRef.current = t('submitting');\n form?.onSubmit?.({ close });\n }}\n >\n {t('submit')}\n </Button>\n </>\n );\n }\n\n useEffect(() => {\n if (mode !== 'create') {\n modalMethods.current = undefined;\n return;\n }\n\n const modalProps: OmitStrict<ModalProps, 'heading'> = {\n progress: form?.loading ? { message: progressMsgRef.current } : undefined,\n children: modalContent,\n actions: formActions,\n onRequestDismiss:\n form?.loading && progressMsgRef.current === t('submitting') ? () => false : undefined\n };\n\n if (modalMethods.current) {\n modalMethods.current.update(modalProps);\n } else {\n modalMethods.current = createModal(Modal, {\n ...modalProps,\n heading: t('create_new'),\n onBeforeOpen: form?.onBeforeOpen,\n onAfterClose: () => {\n form?.onAfterClose?.();\n progressMsgRef.current = t('loading');\n setMode('summary');\n }\n });\n }\n }, [mode, modalContent, form?.loading, formActions]);\n\n return (\n <div ref={ref}>\n {value ? (\n <ObjectSummary\n {...restProps}\n value={value}\n disabled={disabled}\n onDelete={e => {\n setMode('picker');\n onChange?.('', e);\n }}\n ref={objectSummaryRef}\n configuration={configuration}\n onPreview={e => onPreview?.(value.id, e)}\n onLinkClick={onLinkClick}\n />\n ) : (\n <ObjectPicker\n onCreateNew={form ? () => setMode('create') : undefined}\n {...restProps}\n loading={loading}\n disabled={disabled}\n ref={objectPickerRef}\n items={items}\n onSelect={(id, e) => {\n setMode('summary');\n onChange?.(id, e);\n }}\n />\n )}\n </div>\n );\n }\n) as <P extends object = object>(props: ObjectSelectProps<P> & ForwardProps) => JSX.Element \| null;\n\nexport default ObjectSelect;\n"]}

package/lib/components/ObjectSelect/ObjectSummary.d.ts CHANGED Viewed

@@ -1,12 +1,14 @@
 import { FC, Ref, PropsWithoutRef, MouseEvent } from 'react';
-import { BaseProps, ForwardProps, FormControlProps, MenuItemProps } from '@pega/cosmos-react-core';
-import { ObjectConfigProps } from './ObjectConfig';
+import { BaseProps, ForwardProps, FormControlProps, MenuItemProps, DialogProps, OmitStrict } from '@pega/cosmos-react-core';
 interface ObjectSummaryValueProps {
     id: MenuItemProps['id'];
     primary: MenuItemProps['primary'];
     href: string;
     meta?: string;
 }
+interface ObjectConfigProps extends OmitStrict<DialogProps, 'target'> {
+    label: string;
+}
 export interface ObjectSummaryProps extends BaseProps, Omit<FormControlProps, 'value'> {
     value: ObjectSummaryValueProps;
     configuration?: ObjectConfigProps;

package/lib/components/ObjectSelect/ObjectSummary.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ObjectSummary.d.ts","sourceRoot":"","sources":["../../../src/components/ObjectSelect/ObjectSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAc,GAAG,EAAE,eAAe,~~EAAY~~,UAAU,EAAE,MAAM,OAAO,CAAC;~~AAGnF~~,OAAO,EACL,SAAS,EAIT,YAAY,EAGZ,gBAAgB,EAChB,aAAa,~~EAYd~~,~~MAAM~~,~~yBAAyB~~,~~CAAC;AAIjC~~,~~OAAqB~~,~~EAAE,iBAAiB,EAAE,~~MAAM,~~gBAAgB~~,CAAC;~~AAIjE~~,UAAU,uBAAuB;IAC/B,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IACxB,OAAO,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IAClC,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,kBAAmB,SAAQ,SAAS,EAAE,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC;IACpF,KAAK,EAAE,uBAAuB,CAAC;IAC/B,aAAa,CAAC,EAAE,iBAAiB,CAAC;IAClC,QAAQ,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACrD,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC1C,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAC/D,GAAG,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC1B;~~AAaD~~,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,GAAG,YAAY,~~CAiHzE~~,CAAC;AAEF,eAAe,aAAa,CAAC"}
1	+ {"version":3,"file":"ObjectSummary.d.ts","sourceRoot":"","sources":["../../../src/components/ObjectSelect/ObjectSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAc,GAAG,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAGzE,OAAO,EACL,SAAS,EAIT,YAAY,EAGZ,gBAAgB,EAChB,aAAa,EASb,WAAW,EACX,UAAU,EAEX,MAAM,yBAAyB,CAAC;AAMjC,UAAU,uBAAuB;IAC/B,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;IACxB,OAAO,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;IAClC,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,UAAU,iBAAkB,SAAQ,UAAU,CAAC,WAAW,EAAE,QAAQ,CAAC;IACnE,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,kBAAmB,SAAQ,SAAS,EAAE,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC;IACpF,KAAK,EAAE,uBAAuB,CAAC;IAC/B,aAAa,CAAC,EAAE,iBAAiB,CAAC;IAClC,QAAQ,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACrD,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC1C,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAC/D,GAAG,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC1B;AAsDD,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,eAAe,CAAC,kBAAkB,CAAC,GAAG,YAAY,CAgFzE,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/components/ObjectSelect/ObjectSummary.js CHANGED Viewed

@@ -1,50 +1,45 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useState } from 'react';
-import styled from 'styled-components';
-import { SummaryItem, Button, Icon, StyledFormControl, FormField, useI18n, registerIcon, Text, Popover, useAfterInitialEffect, useConsolidatedRef, useDirection, useElement, useFocusTrap, Link, useEvent } from '@pega/cosmos-react-core';
+import { forwardRef } from 'react';
+import styled, { css } from 'styled-components';
+import { SummaryItem, Button, Icon, StyledFormControl, FormField, useI18n, registerIcon, Text, useDirection, useElement, Link, Dialog, defaultThemeProp, StyledLink } from '@pega/cosmos-react-core';
 import * as times from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';
 import * as gear from '@pega/cosmos-react-core/lib/components/Icon/icons/gear.icon';
-import ObjectConfig from './ObjectConfig';
 registerIcon(times, gear);
-const StyledObjectSummary = styled(StyledFormControl) `
-  padding: ${({ meta }) => (meta ? '0.5rem' : '0 0.5rem')};
-`;
+const StyledObjectSummary = styled(StyledFormControl)(({ theme: { base: { spacing, 'hit-area': { 'mouse-min': hitAreaMouse, 'finger-min': hitAreaFinger }, shadow: { focus } } }, meta }) => {
+    return css `
+      padding-block: ${meta ? spacing : '0'};
+      padding-inline-start: ${spacing};
+      min-height: ${hitAreaMouse};
+      ${StyledLink}:focus {
+        box-shadow: inset ${focus};
+      }
+      @media (pointer: coarse) {
+        min-height: ${hitAreaFinger};
+      }
+    `;
+});
+StyledObjectSummary.defaultProps = defaultThemeProp;
 const StyledMetaText = styled(Text) `
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
   overflow: hidden;
 `;
+const ScrollContainer = styled.div(({ theme: { base: { spacing } } }) => {
+    return css `
+      max-height: 12rem;
+      overflow: auto;
+      padding: calc(0.25 * ${spacing});
+    `;
+});
+ScrollContainer.defaultProps = defaultThemeProp;
 const ObjectSummary = forwardRef(({ value, configuration, label, disabled, status, readOnly, onDelete, onPreview, onLinkClick, ...restProps }, ref) => {
-    const [open, setOpen] = useState(false);
     const [buttonEl, setButtonEl] = useElement();
-    const [popoverEl, setPopoverEl] = useElement();
-    const popoverRef = useConsolidatedRef(configuration?.ref, setPopoverEl);
     const t = useI18n();
     const { rtl } = useDirection();
-    const openPopover = () => {
-        configuration?.onBeforeOpen?.();
-        setOpen(true);
-    };
-    const dismissPopover = (id) => {
-        setOpen(false);
-        configuration?.onAfterClose?.(id);
-    };
-    const onKeydown = (e) => {
-        const { key } = e;
-        if (key === 'Escape') {
-            setOpen(false);
-        }
-    };
-    useEvent('keydown', onKeydown, { target: popoverEl });
-    useFocusTrap(popoverRef);
-    useAfterInitialEffect(() => {
-        if (open)
-            popoverEl?.querySelector('button')?.focus();
-        else
-            buttonEl?.focus();
-    }, [open, popoverEl]);
-    return (_jsx(FormField, { ...restProps, ref: ref, label: label, status: status, children: _jsx(SummaryItem, { as: StyledObjectSummary, status: status, meta: value.meta, primary: _jsx(Link, { href: value.href, "aria-label": `${label} ${value.primary}`, previewable: true, onPreview: onPreview, onClick: onLinkClick ? (e) => onLinkClick(value.id, e) : undefined, children: value.primary }), secondary: value.meta && _jsx(StyledMetaText, { variant: 'secondary', children: value.meta }), actions: _jsxs(_Fragment, { children: [configuration && (_jsx(Button, { ref: setButtonEl, label: configuration?.label, icon: true, variant: 'simple', onClick: openPopover, children: _jsx(Icon, { name: 'gear' }) })), !readOnly && (_jsx(Button, { disabled: disabled, label: t('clear_object_summary', [String(label)]), icon: true, variant: 'simple', onClick: onDelete, children: _jsx(Icon, { name: 'times' }) })), _jsx(Popover, { ref: popoverRef, placement: rtl ? 'bottom-end' : 'bottom-start', hideOnTargetHidden: true, show: open, target: buttonEl, children: configuration && open && (_jsx(ObjectConfig, { ...configuration, disabled: disabled, dismissPopover: dismissPopover })) })] }) }) }));
+    return (_jsx(FormField, { ...restProps, ref: ref, label: label, status: status, children: _jsx(SummaryItem, { as: StyledObjectSummary, status: status, meta: value.meta, readOnly: readOnly, overflowStrategy: 'ellipsis', primary: _jsx(Link, { href: value.href, "aria-label": `${label} ${value.primary}`, previewable: true, onPreview: onPreview, onClick: onLinkClick ? (e) => onLinkClick(value.id, e) : undefined, children: value.primary }), secondary: value.meta && _jsx(StyledMetaText, { variant: 'secondary', children: value.meta }), actions: _jsxs(_Fragment, { children: [configuration && (_jsx(Button, { ref: setButtonEl, label: configuration?.label, icon: true, variant: 'simple', children: _jsx(Icon, { name: 'gear' }) })), !readOnly && (_jsx(Button, { disabled: disabled, label: t('clear_object_summary', [String(label)]), icon: true, variant: 'simple', onClick: onDelete, children: _jsx(Icon, { name: 'times' }) })), configuration && (_jsx(Dialog, { heading: configuration.heading, placement: rtl ? 'bottom-end' : 'bottom-start', target: buttonEl, onOpen: configuration.onOpen, onClose: configuration.onClose, onSubmit: readOnly || disabled ? undefined : configuration?.onSubmit, loading: configuration.loading, ref: configuration.ref, children: _jsx(ScrollContainer, { children: configuration?.children }) }))] }) }) }));
 });
 export default ObjectSummary;
 //# sourceMappingURL=ObjectSummary.js.map

package/lib/components/ObjectSelect/ObjectSummary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ObjectSummary.js","sourceRoot":"","sources":["../../../src/components/ObjectSelect/ObjectSummary.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,~~EAAwB~~,~~QAAQ,EAAc,~~MAAM,OAAO,CAAC;~~AACnF~~,OAAO,MAAM,MAAM,mBAAmB,CAAC;~~AAEvC~~,OAAO,EAEL,WAAW,EACX,MAAM,EACN,IAAI,EAEJ,iBAAiB,EACjB,SAAS,EAGT,OAAO,EACP,YAAY,EACZ,IAAI,EACJ,~~OAAO,EACP,qBAAqB,EACrB,kBAAkB,EAClB,~~YAAY,EACZ,UAAU,EACV,~~YAAY,EACZ,~~IAAI,EACJ,~~QAAQ~~,~~EACT~~,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,KAAK,MAAM,8DAA8D,CAAC;AACtF,OAAO,KAAK,IAAI,MAAM,6DAA6D,CAAC;AAEpF,~~OAAO,YAAmC,MAAM,gBAAgB,CAAC;AAEjE,~~YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;~~AAkB1B~~,MAAM,mBAAmB,GAAG,MAAM,CAAC,iBAAiB,CAAC,~~CAAkB;aAC1D~~,CAAC,~~EAAE~~,~~IAAI~~,EAAE,~~EAAE~~,~~EAAE,CAAC,CAAC,~~IAAI,~~CAAC~~,~~CAAC~~,~~CAAC~~,~~QAAQ~~,~~CAAC,CAAC,CAAC,~~UAAU,~~CAAC;CACxD~~,~~CAAC;AAEF~~,~~MAAM~~,~~cAAc~~,~~GAAG~~,~~MAAM~~,~~CAAC~~,~~IAAI~~,~~CAAC~~,~~CAAA;;;;;CAKlC~~,~~CAAC;AAEF~~,MAAM,~~aAAa~~,~~GAA2D~~,~~UAAU~~,~~CACtF~~,~~CACE~~,~~EACE~~,~~KAAK~~,~~EACL~~,~~aAAa,EACb,KAAK,~~EACL,~~QAAQ~~,~~EACR~~,~~MAAM~~,~~EACN,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,WAAW,EACX,~~GAAG,~~SAAS,EACb,EACD,GAA8B,EAC9B,EAAE~~;~~IACF~~,~~MAAM~~,CAAC,~~IAAI~~,~~EAAE~~,OAAO,CAAC,~~GAAG,QAAQ,~~CAAC,~~KAAK,~~CAAC,~~CAAC~~;~~IACxC~~,~~MAAM~~,~~CAAC~~,~~QAAQ~~,~~EAAE~~,~~WAAW~~,CAAC,~~GAAG~~,~~UAAU~~,~~EAAqB,~~CAAC;~~IAChE~~,~~MAAM~~,CAAC,~~SAAS,EAAE,~~YAAY,~~CAAC,~~GAAG,~~UAAU~~,~~EAAe,~~CAAC;~~IAC5D~~,MAAM,~~UAAU~~,GAAG,~~kBAAkB~~,~~CAAiB~~,~~aAAa~~,~~EAAE~~,~~GAAG~~,~~EAAE,YAAY,~~CAAC~~,CAAC~~;~~IACxF~~,MAAM,~~CAAC~~,GAAG,~~OAAO~~,~~EAAE,~~CAAC~~;IACpB~~,~~MAAM,EAAE,~~GAAG,~~EAAE~~,~~GAAG,YAAY,EAAE,~~CAAC~~;IAE/B~~,~~MAAM~~,~~WAAW~~,~~GAAG,GAAG,~~EAAE~~;QACvB~~,~~aAAa~~,~~EAAE~~,~~YAAY,~~EAAE,EAAE,~~CAAC;QAChC,~~OAAO,~~CAAC~~,~~IAAI~~,~~CAAC~~,~~CAAC;IAChB,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,EAAW,~~EAAE,EAAE;~~QACrC~~,OAAO,~~CAAC~~,~~KAAK~~,~~CAAC~~,CAAC;~~QACf~~,~~aAAa,EAAE,YAAY,EAAE,~~CAAC,~~EAAE~~,CAAC~~,CAAC~~;~~IACpC~~,~~CAAC~~,CAAC~~;IAEF~~,~~MAAM~~,~~SAAS,~~GAAG,CAAC~~,CAAgB,EAAE,EAAE~~;~~QACrC~~,MAAM,~~EAAE~~,~~GAAG~~,~~EAAE~~,~~GAAG~~,~~CAAC~~,~~CAAC;QAClB~~,~~IAAI,GAAG,~~KAAK,~~QAAQ~~,~~EAAE;YACpB~~,~~OAAO~~,~~CAAC,~~KAAK,~~CAAC~~,~~CAAC;SAChB;IACH~~,~~CAAC~~,~~CAAC;IAEF~~,QAAQ,~~CAAC~~,~~SAAS~~,~~EAAE~~,SAAS,~~EAAE~~,~~EAAE~~,~~MAAM~~,~~EAAE~~,SAAS,~~EAAE~~,~~CAAC~~,~~CAAC;IACtD~~,~~YAAY~~,~~CAAC,UAAU,CAAC,CAAC~~;~~IAEzB~~,~~qBAAqB~~,CAAC,~~GAAG~~,EAAE~~;QACzB~~,~~IAAI~~,~~IAAI;YAAE~~,~~SAAS~~,~~EAAE~~,~~aAAa~~,CAAC,~~QAAQ~~,CAAC,~~EAAE~~,~~KAAK~~,EAAE,CAAC~~;;YACjD~~,~~QAAQ~~,EAAE,~~KAAK~~,EAAE,~~CAAC;IACzB~~,~~CAAC~~,EAAE,CAAC~~,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC~~;~~IAEtB~~,OAAO,CACL,KAAC,SAAS,OAAK,SAAS,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,YAC9D,KAAC,WAAW,IACV,EAAE,EAAE,mBAAmB,EACvB,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,OAAO,EACL,KAAC,IAAI,IACH,IAAI,EAAE,KAAK,CAAC,IAAI,gBACJ,GAAG,KAAK,IAAI,KAAK,CAAC,OAAO,EAAE,EACvC,WAAW,QACX,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,CAAa,EAAE,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,YAE7E,KAAK,CAAC,OAAO,GACT,EAET,SAAS,EACP,KAAK,CAAC,IAAI,IAAI,KAAC,cAAc,IAAC,OAAO,EAAC,WAAW,YAAE,KAAK,CAAC,IAAI,GAAkB,EAEjF,OAAO,EACL,8BACG,aAAa,IAAI,CAChB,KAAC,MAAM,~~IACL~~,GAAG,EAAE,WAAW,~~EAChB~~,KAAK,EAAE,aAAa,EAAE,KAAK,~~EAC3B~~,IAAI,~~QACJ~~,OAAO,EAAC,QAAQ,~~EAChB~~,~~OAAO,EAAE,WAAW,YAEpB,~~KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,GACb,CACV,EACA,CAAC,QAAQ,IAAI,CACZ,KAAC,MAAM,IACL,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,CAAC,CAAC,sBAAsB,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,EACjD,IAAI,QACJ,OAAO,EAAC,QAAQ,EAChB,OAAO,EAAE,QAAQ,YAEjB,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,CACV,~~EACD~~,KAAC,~~OAAO~~,~~IACN~~,~~GAAG~~,EAAE,~~UAAU~~,~~EACf~~,SAAS,EAAE,GAAG,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,cAAc,EAC9C,~~kBAAkB~~,~~QAClB~~,~~IAAI~~,EAAE,~~IAAI~~,~~EACV~~,MAAM,EAAE,QAAQ,~~YAEf~~,~~aAAa~~,IAAI,~~IAAI~~,~~IAAI~~,~~CACxB~~,~~KAAC~~,~~YAAY~~,~~OACP~~,aAAa,~~EACjB~~,QAAQ,EAAE,~~QAAQ~~,~~EAClB~~,~~cAAc~~,EAAE,~~cAAc~~,~~GAC9B~~,~~CACH~~,~~GACO~~,~~IACT~~,GAEL,GACQ,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { FC, forwardRef, Ref, PropsWithoutRef, ~~useState,~~ MouseEvent } from 'react';\nimport styled from 'styled-components';\n\nimport {\n BaseProps,\n SummaryItem,\n Button,\n Icon,\n ForwardProps,\n StyledFormControl,\n FormField,\n FormControlProps,\n MenuItemProps,\n useI18n,\n registerIcon,\n Text,\n ~~Popover~~,\n ~~useAfterInitialEffect~~,\n ~~useConsolidatedRef~~,\n ~~useDirection~~,\n ~~useElement~~,\n ~~useFocusTrap~~,\n ~~Link~~,\n ~~useEvent~~\n} from '@pega/cosmos-react-core';\nimport * as times from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\nimport * as gear from '@pega/cosmos-react-core/lib/components/Icon/icons/gear.icon';\n\~~nimport ObjectConfig, { ObjectConfigProps } from './ObjectConfig';\n\~~nregisterIcon(times, gear);\n\ninterface ObjectSummaryValueProps {\n id: MenuItemProps['id'];\n primary: MenuItemProps['primary'];\n href: string;\n meta?: string;\n}\n\nexport interface ObjectSummaryProps extends BaseProps, Omit<FormControlProps, 'value'> {\n value: ObjectSummaryValueProps;\n configuration?: ObjectConfigProps;\n onDelete: (e: MouseEvent<HTMLButtonElement>) => void;\n onPreview?: (e: { href: string }) => void;\n onLinkClick?: (id: MenuItemProps['id'], e: MouseEvent) => void;\n ref: Ref<HTMLDivElement>;\n}\n\nconst StyledObjectSummary = styled(StyledFormControl)<{ meta: string }~~>`\~~n ~~padding~~: ${({ ~~meta~~ }) => (meta ? '0~~.5rem~~' : '0 ~~0.5rem'~~)};\n`;\n\nconst StyledMetaText = styled(Text)`\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n overflow: hidden;\n`;\n\nconst ObjectSummary: FC<PropsWithoutRef<ObjectSummaryProps> & ForwardProps> = forwardRef(\n (\n {\n value,\n configuration,\n label,\n disabled,\n status,\n readOnly,\n onDelete,\n onPreview,\n onLinkClick,\n ...restProps\n },\n ref: ObjectSummaryProps['ref']\n ) => {\n const [~~open, setOpen] = useState(false);\n const [~~buttonEl, setButtonEl] = useElement<HTMLButtonElement>();\n const ~~[popoverEl, setPopoverEl] = useElement<HTMLElement>();\n const popoverRef = useConsolidatedRef<HTMLDivElement>(configuration?.ref, setPopoverEl);\n const~~ t = useI18n();\n const { rtl } = useDirection();\n\n const openPopover = () => {\n configuration?.onBeforeOpen?.();\n setOpen(true);\n };\n\n const dismissPopover = (id?: string) => {\n setOpen(false);\n configuration?.onAfterClose?.(id);\n };\n\n const onKeydown = (e: KeyboardEvent) => {\n const { key } = e;\n if (key === 'Escape') {\n setOpen(false);\n }\n };\n\n useEvent('keydown', onKeydown, { target: popoverEl });\n useFocusTrap(popoverRef);\n\n useAfterInitialEffect(() => {\n if (open) popoverEl?.querySelector('button')?.focus();\n else buttonEl?.focus();\n }, [open, popoverEl]);\n\n return (\n <FormField {...restProps} ref={ref} label={label} status={status}>\n <SummaryItem\n as={StyledObjectSummary}\n status={status}\n meta={value.meta}\n primary={\n <Link\n href={value.href}\n aria-label={`${label} ${value.primary}`}\n previewable\n onPreview={onPreview}\n onClick={onLinkClick ? (e: MouseEvent) => onLinkClick(value.id, e) : undefined}\n >\n {value.primary}\n </Link>\n }\n secondary={\n value.meta && <StyledMetaText variant='secondary'>{value.meta}</StyledMetaText>\n }\n actions={\n <>\n {configuration && (\n <Button\n ref={setButtonEl}\n label={configuration?.label}\n icon\n variant='simple'~~\n onClick={openPopover}\n~~ >\n <Icon name='gear' />\n </Button>\n )}\n {!readOnly && (\n <Button\n disabled={disabled}\n label={t('clear_object_summary', [String(label)])}\n icon\n variant='simple'\n onClick={onDelete}\n >\n <Icon name='times' />\n </Button>\n )}\n <~~Popover~~\n ~~ref~~={~~popoverRef~~}\n placement={rtl ? 'bottom-end' : 'bottom-start'}\n ~~hideOnTargetHidden~~\n ~~show~~={~~open~~}\n ~~target~~={~~buttonEl~~}\n ~~>\n~~ {~~configuration~~ && ~~open~~ && (\n ~~<ObjectConfig\n~~ {~~...~~configuration}\n ~~disabled~~={~~disabled~~}\n ~~dismissPopover=~~{~~dismissPopover~~}\n ~~/>\~~n )}\n ~~</Popover>\n~~ </>\n }\n />\n </FormField>\n );\n }\n);\n\nexport default ObjectSummary;\n"]}
1	+ {"version":3,"file":"ObjectSummary.js","sourceRoot":"","sources":["../../../src/components/ObjectSelect/ObjectSummary.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, forwardRef, Ref, PropsWithoutRef, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n BaseProps,\n SummaryItem,\n Button,\n Icon,\n ForwardProps,\n StyledFormControl,\n FormField,\n FormControlProps,\n MenuItemProps,\n useI18n,\n registerIcon,\n Text,\n useDirection,\n useElement,\n Link,\n Dialog,\n defaultThemeProp,\n DialogProps,\n OmitStrict,\n StyledLink\n} from '@pega/cosmos-react-core';\nimport * as times from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\nimport * as gear from '@pega/cosmos-react-core/lib/components/Icon/icons/gear.icon';\n\nregisterIcon(times, gear);\n\ninterface ObjectSummaryValueProps {\n id: MenuItemProps['id'];\n primary: MenuItemProps['primary'];\n href: string;\n meta?: string;\n}\n\ninterface ObjectConfigProps extends OmitStrict<DialogProps, 'target'> {\n label: string;\n}\n\nexport interface ObjectSummaryProps extends BaseProps, Omit<FormControlProps, 'value'> {\n value: ObjectSummaryValueProps;\n configuration?: ObjectConfigProps;\n onDelete: (e: MouseEvent<HTMLButtonElement>) => void;\n onPreview?: (e: { href: string }) => void;\n onLinkClick?: (id: MenuItemProps['id'], e: MouseEvent) => void;\n ref: Ref<HTMLDivElement>;\n}\n\nconst StyledObjectSummary = styled(StyledFormControl)<{ meta: string }>(\n ({\n theme: {\n base: {\n spacing,\n 'hit-area': { 'mouse-min': hitAreaMouse, 'finger-min': hitAreaFinger },\n shadow: { focus }\n }\n },\n meta\n }) => {\n return css`\n padding-block: ${meta ? spacing : '0'};\n padding-inline-start: ${spacing};\n min-height: ${hitAreaMouse};\n\n ${StyledLink}:focus {\n box-shadow: inset ${focus};\n }\n\n @media (pointer: coarse) {\n min-height: ${hitAreaFinger};\n }\n `;\n }\n);\n\nStyledObjectSummary.defaultProps = defaultThemeProp;\n\nconst StyledMetaText = styled(Text)`\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n overflow: hidden;\n`;\n\nconst ScrollContainer = styled.div(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n max-height: 12rem;\n overflow: auto;\n padding: calc(0.25 * ${spacing});\n `;\n }\n);\n\nScrollContainer.defaultProps = defaultThemeProp;\n\nconst ObjectSummary: FC<PropsWithoutRef<ObjectSummaryProps> & ForwardProps> = forwardRef(\n (\n {\n value,\n configuration,\n label,\n disabled,\n status,\n readOnly,\n onDelete,\n onPreview,\n onLinkClick,\n ...restProps\n },\n ref: ObjectSummaryProps['ref']\n ) => {\n const [buttonEl, setButtonEl] = useElement<HTMLButtonElement>();\n const t = useI18n();\n const { rtl } = useDirection();\n\n return (\n <FormField {...restProps} ref={ref} label={label} status={status}>\n <SummaryItem\n as={StyledObjectSummary}\n status={status}\n meta={value.meta}\n readOnly={readOnly}\n overflowStrategy='ellipsis'\n primary={\n <Link\n href={value.href}\n aria-label={`${label} ${value.primary}`}\n previewable\n onPreview={onPreview}\n onClick={onLinkClick ? (e: MouseEvent) => onLinkClick(value.id, e) : undefined}\n >\n {value.primary}\n </Link>\n }\n secondary={\n value.meta && <StyledMetaText variant='secondary'>{value.meta}</StyledMetaText>\n }\n actions={\n <>\n {configuration && (\n <Button ref={setButtonEl} label={configuration?.label} icon variant='simple'>\n <Icon name='gear' />\n </Button>\n )}\n {!readOnly && (\n <Button\n disabled={disabled}\n label={t('clear_object_summary', [String(label)])}\n icon\n variant='simple'\n onClick={onDelete}\n >\n <Icon name='times' />\n </Button>\n )}\n {configuration && (\n <Dialog\n heading={configuration.heading}\n placement={rtl ? 'bottom-end' : 'bottom-start'}\n target={buttonEl}\n onOpen={configuration.onOpen}\n onClose={configuration.onClose}\n onSubmit={readOnly \|\| disabled ? undefined : configuration?.onSubmit}\n loading={configuration.loading}\n ref={configuration.ref}\n >\n <ScrollContainer>{configuration?.children}</ScrollContainer>\n </Dialog>\n )}\n </>\n }\n />\n </FormField>\n );\n }\n);\n\nexport default ObjectSummary;\n"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@pega/cosmos-react-build",
-  "version": "3.0.0-dev.17.0",
+  "version": "3.0.0-dev.18.2",
   "author": "Pegasystems",
   "license": "SEE LICENSE IN LICENSE",
   "repository": {
@@ -20,8 +20,8 @@
     "build": "tsc -b"
   },
   "dependencies": {
-    "@pega/cosmos-react-core": "3.0.0-dev.17.0",
-    "@pega/cosmos-react-dnd": "3.0.0-dev.17.0",
+    "@pega/cosmos-react-core": "3.0.0-dev.18.2",
+    "@pega/cosmos-react-dnd": "3.0.0-dev.18.2",
     "@types/dagre": "^0.7.46",
     "@types/react": "^16.14.24 || ^17.0.38",
     "@types/react-dom": "^16.9.14 || ^17.0.11",

package/lib/components/ObjectSelect/ObjectConfig.d.ts DELETED Viewed

@@ -1,18 +0,0 @@
-import { ReactNode, FC, Ref } from 'react';
-import { ForwardProps, Action } from '@pega/cosmos-react-core';
-export interface ObjectConfigProps {
-    label: string;
-    heading: string;
-    primaryAction: Action;
-    secondaryAction: Action;
-    content?: ReactNode;
-    onBeforeOpen?: () => void;
-    onAfterClose?: (id?: string) => void;
-    ref?: Ref<HTMLDivElement>;
-}
-declare const ObjectConfig: FC<ObjectConfigProps & ForwardProps & {
-    disabled?: boolean;
-    dismissPopover: (id?: string) => void;
-}>;
-export default ObjectConfig;
-//# sourceMappingURL=ObjectConfig.d.ts.map

package/lib/components/ObjectSelect/ObjectConfig.d.ts.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"ObjectConfig.d.ts","sourceRoot":"","sources":["../../../src/components/ObjectSelect/ObjectConfig.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,EAAE,EAAE,GAAG,EAAc,MAAM,OAAO,CAAC;AAGvD,OAAO,EACL,YAAY,EAIZ,MAAM,EAIP,MAAM,yBAAyB,CAAC;AAEjC,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,aAAa,EAAE,MAAM,CAAC;IACtB,eAAe,EAAE,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAaD,QAAA,MAAM,YAAY,EAAE,EAAE,CACpB,iBAAiB,GAAG,YAAY,GAAG;IAAE,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,cAAc,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;CAAE,CAuCjG,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/components/ObjectSelect/ObjectConfig.js DELETED Viewed

@@ -1,24 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import styled, { css } from 'styled-components';
-import { Button, Flex, Icon, Text, useI18n, defaultThemeProp } from '@pega/cosmos-react-core';
-const ScrollContainer = styled.div(({ theme: { base } }) => {
-    return css `
-    max-height: 12rem;
-    max-width: 80ch;
-    padding: calc(0.5 * ${base.spacing}) calc(2 * ${base.spacing});
-    overflow: auto;
-  `;
-});
-ScrollContainer.defaultProps = defaultThemeProp;
-const ObjectConfig = ({ heading, content, primaryAction, secondaryAction, disabled, dismissPopover }) => {
-    const t = useI18n();
-    return (_jsxs("div", { children: [_jsxs(Flex, { container: { justify: 'between', alignItems: 'center', pad: 2 }, children: [_jsx(Text, { variant: 'h3', children: heading }), _jsx(Button, { icon: true, variant: 'simple', label: t('close'), onClick: () => dismissPopover(), children: _jsx(Icon, { name: 'times' }) })] }), _jsx(Flex, { item: { grow: 1 }, as: ScrollContainer, children: content }), _jsxs(Flex, { container: { justify: 'between', pad: 2 }, children: [_jsx(Button, { variant: 'secondary', disabled: disabled, onClick: (e) => {
-                            secondaryAction.onClick?.(secondaryAction.id, e);
-                            dismissPopover(secondaryAction.id);
-                        }, children: secondaryAction.text }), _jsx(Button, { variant: 'primary', disabled: disabled, onClick: (e) => {
-                            primaryAction.onClick?.(primaryAction.id, e);
-                            dismissPopover(primaryAction.id);
-                        }, children: primaryAction.text })] })] }));
-};
-export default ObjectConfig;
-//# sourceMappingURL=ObjectConfig.js.map

package/lib/components/ObjectSelect/ObjectConfig.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"ObjectConfig.js","sourceRoot":"","sources":["../../../src/components/ObjectSelect/ObjectConfig.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAEL,MAAM,EACN,IAAI,EACJ,IAAI,EAEJ,IAAI,EACJ,OAAO,EACP,gBAAgB,EACjB,MAAM,yBAAyB,CAAC;AAajC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE;IACzD,OAAO,GAAG,CAAA;;;0BAGc,IAAI,CAAC,OAAO,cAAc,IAAI,CAAC,OAAO;;GAE7D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEhD,MAAM,YAAY,GAEd,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,QAAQ,EAAE,cAAc,EAAE,EAAE,EAAE;IACrF,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,OAAO,CACL,0BACE,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aACnE,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,OAAO,GAAQ,EACnC,KAAC,MAAM,IAAC,IAAI,QAAC,OAAO,EAAC,QAAQ,EAAC,KAAK,EAAE,CAAC,CAAC,OAAO,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,cAAc,EAAE,YAC9E,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,IACJ,EACP,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,eAAe,YACzC,OAAO,GACH,EACP,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,EAAE,aAC7C,KAAC,MAAM,IACL,OAAO,EAAC,WAAW,EACnB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,CAAC,CAAgC,EAAE,EAAE;4BAC5C,eAAe,CAAC,OAAO,EAAE,CAAC,eAAe,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;4BACjD,cAAc,CAAC,eAAe,CAAC,EAAE,CAAC,CAAC;wBACrC,CAAC,YAEA,eAAe,CAAC,IAAI,GACd,EACT,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,CAAC,CAAgC,EAAE,EAAE;4BAC5C,aAAa,CAAC,OAAO,EAAE,CAAC,aAAa,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;4BAC7C,cAAc,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;wBACnC,CAAC,YAEA,aAAa,CAAC,IAAI,GACZ,IACJ,IACH,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { ReactNode, FC, Ref, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n ForwardProps,\n Button,\n Flex,\n Icon,\n Action,\n Text,\n useI18n,\n defaultThemeProp\n} from '@pega/cosmos-react-core';\n\nexport interface ObjectConfigProps {\n label: string;\n heading: string;\n primaryAction: Action;\n secondaryAction: Action;\n content?: ReactNode;\n onBeforeOpen?: () => void;\n onAfterClose?: (id?: string) => void;\n ref?: Ref<HTMLDivElement>;\n}\n\nconst ScrollContainer = styled.div(({ theme: { base } }) => {\n return css`\n max-height: 12rem;\n max-width: 80ch;\n padding: calc(0.5 * ${base.spacing}) calc(2 * ${base.spacing});\n overflow: auto;\n `;\n});\n\nScrollContainer.defaultProps = defaultThemeProp;\n\nconst ObjectConfig: FC<\n ObjectConfigProps & ForwardProps & { disabled?: boolean; dismissPopover: (id?: string) => void }\n> = ({ heading, content, primaryAction, secondaryAction, disabled, dismissPopover }) => {\n const t = useI18n();\n\n return (\n <div>\n <Flex container={{ justify: 'between', alignItems: 'center', pad: 2 }}>\n <Text variant='h3'>{heading}</Text>\n <Button icon variant='simple' label={t('close')} onClick={() => dismissPopover()}>\n <Icon name='times' />\n </Button>\n </Flex>\n <Flex item={{ grow: 1 }} as={ScrollContainer}>\n {content}\n </Flex>\n <Flex container={{ justify: 'between', pad: 2 }}>\n <Button\n variant='secondary'\n disabled={disabled}\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n secondaryAction.onClick?.(secondaryAction.id, e);\n dismissPopover(secondaryAction.id);\n }}\n >\n {secondaryAction.text}\n </Button>\n <Button\n variant='primary'\n disabled={disabled}\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n primaryAction.onClick?.(primaryAction.id, e);\n dismissPopover(primaryAction.id);\n }}\n >\n {primaryAction.text}\n </Button>\n </Flex>\n </div>\n );\n};\n\nexport default ObjectConfig;\n"]}