@pega/cosmos-react-rte 9.36.1 → 9.37.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/Editor/Editor.styles.d.ts +32 -4
- package/lib/components/Editor/Editor.styles.d.ts.map +1 -1
- package/lib/components/Editor/Editor.styles.js +4 -2
- package/lib/components/Editor/Editor.styles.js.map +1 -1
- package/lib/components/Editor/ImageEditDialog.d.ts.map +1 -1
- package/lib/components/Editor/ImageEditDialog.js +3 -6
- package/lib/components/Editor/ImageEditDialog.js.map +1 -1
- package/lib/components/Editor/Toolbar/AIRewriteButton.d.ts.map +1 -1
- package/lib/components/Editor/Toolbar/AIRewriteButton.js +4 -7
- package/lib/components/Editor/Toolbar/AIRewriteButton.js.map +1 -1
- package/package.json +2 -2
|
@@ -11,23 +11,51 @@ export declare const StyledEditorRoot: import("styled-components/dist/types").IS
|
|
|
11
11
|
export declare const StyledEditPopover: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("@pega/cosmos-react-core").PopoverProps<string> & import("@pega/cosmos-react-core").ForwardProps, never>> & string & Omit<(<Modifiers extends string = string>(props: import("@pega/cosmos-react-core").PopoverProps<Modifiers> & import("@pega/cosmos-react-core").ForwardProps) => import("react").ReactElement | null), keyof import("react").Component<any, {}, any>>;
|
|
12
12
|
export declare const StyledFormDialog: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<(Omit<Omit<import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").BaseDialogProps & {
|
|
13
13
|
onDismiss?: () => void;
|
|
14
|
-
onCancel: import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").FormAction;
|
|
15
14
|
onSubmit: import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").FormAction;
|
|
16
15
|
} & {
|
|
17
16
|
heading: string;
|
|
18
17
|
additionalInfo?: import("@pega/cosmos-react-core").AdditionalInfoProps;
|
|
19
18
|
'aria-label'?: never;
|
|
20
|
-
} &
|
|
19
|
+
} & {
|
|
20
|
+
onAfterClose?: () => void;
|
|
21
|
+
onCancel: import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").FormAction | undefined;
|
|
22
|
+
} & Omit<import("@pega/cosmos-react-core").Attributes<"div">, "aria-label" | "onSubmit" | "onCancel" | "heading" | keyof import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").BaseDialogProps | "onDismiss" | "additionalInfo" | "onAfterClose">, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
|
|
23
|
+
ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
24
|
+
}) | (Omit<Omit<import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").BaseDialogProps & {
|
|
25
|
+
onDismiss?: () => void;
|
|
26
|
+
onSubmit: import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").FormAction;
|
|
27
|
+
} & {
|
|
28
|
+
heading: string;
|
|
29
|
+
additionalInfo?: import("@pega/cosmos-react-core").AdditionalInfoProps;
|
|
30
|
+
'aria-label'?: never;
|
|
31
|
+
} & {
|
|
32
|
+
onAfterClose: () => void;
|
|
33
|
+
onCancel?: import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").FormAction;
|
|
34
|
+
} & Omit<import("@pega/cosmos-react-core").Attributes<"div">, "aria-label" | "onSubmit" | "onCancel" | "heading" | keyof import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").BaseDialogProps | "onDismiss" | "additionalInfo" | "onAfterClose">, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
|
|
21
35
|
ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
22
36
|
}) | (Omit<Omit<import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").BaseDialogProps & {
|
|
23
37
|
onDismiss?: () => void;
|
|
24
|
-
onCancel: import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").FormAction;
|
|
25
38
|
onSubmit: import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").FormAction;
|
|
26
39
|
} & {
|
|
27
40
|
heading?: never;
|
|
28
41
|
'aria-label': string;
|
|
29
42
|
additionalInfo?: never;
|
|
30
|
-
} &
|
|
43
|
+
} & {
|
|
44
|
+
onAfterClose?: () => void;
|
|
45
|
+
onCancel: import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").FormAction | undefined;
|
|
46
|
+
} & Omit<import("@pega/cosmos-react-core").Attributes<"div">, "aria-label" | "onSubmit" | "onCancel" | "heading" | keyof import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").BaseDialogProps | "onDismiss" | "additionalInfo" | "onAfterClose">, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
|
|
47
|
+
ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
48
|
+
}) | (Omit<Omit<import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").BaseDialogProps & {
|
|
49
|
+
onDismiss?: () => void;
|
|
50
|
+
onSubmit: import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").FormAction;
|
|
51
|
+
} & {
|
|
52
|
+
heading?: never;
|
|
53
|
+
'aria-label': string;
|
|
54
|
+
additionalInfo?: never;
|
|
55
|
+
} & {
|
|
56
|
+
onAfterClose: () => void;
|
|
57
|
+
onCancel?: import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").FormAction;
|
|
58
|
+
} & Omit<import("@pega/cosmos-react-core").Attributes<"div">, "aria-label" | "onSubmit" | "onCancel" | "heading" | keyof import("@pega/cosmos-react-core/lib/components/Dialog/Dialog.types").BaseDialogProps | "onDismiss" | "additionalInfo" | "onAfterClose">, "ref"> & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
|
|
31
59
|
ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
32
60
|
}), import("styled-components/dist/types").BaseObject>> & string & Omit<import("react").ForwardRefExoticComponent<import("react").PropsWithoutRef<import("@pega/cosmos-react-core").FormDialogProps> & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
|
|
33
61
|
interface StyledSourceTextareaProps {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Editor.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Editor/Editor.styles.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Editor.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Editor/Editor.styles.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,qBAAqB,6NAOjC,CAAC;AAIF,UAAU,uBAAuB;IAC/B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,kBAAkB,wQAyB9B,CAAC;AAIF,eAAO,MAAM,gBAAgB;2BAyD+wC,CAAC;iDAzD1vC,CAAC;AAIpD,eAAO,MAAM,iBAAiB,0dAE7B,CAAC;AAIF,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qSAI5B,CAAC;AAIF,UAAU,yBAAyB;IACjC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,oBAAoB,gRA+BhC,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import styled, { css } from 'styled-components';
|
|
2
|
-
import { FormDialog, FormField, Popover, defaultThemeProp } from '@pega/cosmos-react-core';
|
|
2
|
+
import { FormDialog, FormField, Popover, defaultThemeProp, StyledTouchDialog } from '@pega/cosmos-react-core';
|
|
3
3
|
export const StyledEditorContainer = styled.div `
|
|
4
4
|
position: relative;
|
|
5
5
|
cursor: text;
|
|
@@ -40,7 +40,9 @@ export const StyledEditPopover = styled(Popover) `
|
|
|
40
40
|
`;
|
|
41
41
|
StyledEditPopover.defaultProps = defaultThemeProp;
|
|
42
42
|
export const StyledFormDialog = styled(FormDialog) `
|
|
43
|
-
|
|
43
|
+
&:not(${StyledTouchDialog}) {
|
|
44
|
+
overflow: auto;
|
|
45
|
+
}
|
|
44
46
|
`;
|
|
45
47
|
StyledFormDialog.defaultProps = defaultThemeProp;
|
|
46
48
|
export const StyledSourceTextarea = styled.textarea(({ theme, $minHeight, $maxHeight }) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Editor.styles.js","sourceRoot":"","sources":["../../../src/components/Editor/Editor.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,
|
|
1
|
+
{"version":3,"file":"Editor.styles.js","sourceRoot":"","sources":["../../../src/components/Editor/Editor.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,UAAU,EACV,SAAS,EACT,OAAO,EACP,gBAAgB,EAChB,iBAAiB,EAClB,MAAM,yBAAyB,CAAC;AAEjC,MAAM,CAAC,MAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;CAO9C,CAAC;AAEF,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAQtD,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,MAAM,CAC7C,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,EAAE,EAAE;IAC7C,MAAM,cAAc,GAAG,UAAU;QAC/B,CAAC,CAAC,GAAG,UAAU,IAAI;QACnB,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,YAAY,CAAC,CAAC;IAChD,MAAM,cAAc,GAAG,UAAU,CAAC,CAAC,CAAC,GAAG,UAAU,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;IAElE,OAAO,GAAG,CAAA;;;;oBAIM,cAAc;QAC1B,cAAc;QAChB,GAAG,CAAA;sBACa,cAAc;;OAE7B;QACC,OAAO;QACT,GAAG,CAAA;;;;OAIF;KACF,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,SAAS,CAAC,CAAA,EAAE,CAAC;AAEpD,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,OAAO,CAAC,CAAA;;CAE/C,CAAC;AAEF,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,UAAU,CAAC,CAAA;UACxC,iBAAiB;;;CAG1B,CAAC;AAEF,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAOjD,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,QAAQ,CACjD,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,EAAE,EAAE;IACpC,MAAM,cAAc,GAAG,UAAU;QAC/B,CAAC,CAAC,GAAG,UAAU,IAAI;QACnB,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,YAAY,CAAC,CAAC;IAChD,MAAM,cAAc,GAAG,UAAU,CAAC,CAAC,CAAC,GAAG,UAAU,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;IAElE,OAAO,GAAG,CAAA;;;;oBAIM,cAAc;;mBAEf,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC;iBACzB,KAAK,CAAC,IAAI,CAAC,OAAO;;0BAET,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC,kBAAkB,CAAC;eAC/D,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC;;QAE7C,cAAc;QAChB,GAAG,CAAA;sBACa,cAAc;;OAE7B;;;;sBAIe,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;;KAExC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport {\n FormDialog,\n FormField,\n Popover,\n defaultThemeProp,\n StyledTouchDialog\n} from '@pega/cosmos-react-core';\n\nexport const StyledEditorContainer = styled.div`\n position: relative;\n cursor: text;\n\n .ProseMirror:focus {\n outline: none;\n }\n`;\n\nStyledEditorContainer.defaultProps = defaultThemeProp;\n\ninterface StyledEditorIframeProps {\n $minHeight?: number;\n $maxHeight?: number;\n $hidden?: boolean;\n}\n\nexport const StyledEditorIframe = styled.iframe<StyledEditorIframeProps>(\n ({ theme, $minHeight, $maxHeight, $hidden }) => {\n const minHeightValue = $minHeight\n ? `${$minHeight}px`\n : theme.components['text-area']['min-height'];\n const maxHeightValue = $maxHeight ? `${$maxHeight}px` : undefined;\n\n return css`\n display: block;\n width: 100%;\n border: none;\n min-height: ${minHeightValue};\n ${maxHeightValue &&\n css`\n max-height: ${maxHeightValue};\n overflow: auto;\n `}\n ${$hidden &&\n css`\n position: absolute;\n visibility: hidden;\n pointer-events: none;\n `}\n `;\n }\n);\n\nStyledEditorIframe.defaultProps = defaultThemeProp;\n\nexport const StyledEditorRoot = styled(FormField)``;\n\nStyledEditorRoot.defaultProps = defaultThemeProp;\n\nexport const StyledEditPopover = styled(Popover)`\n overflow: auto;\n`;\n\nStyledEditPopover.defaultProps = defaultThemeProp;\n\nexport const StyledFormDialog = styled(FormDialog)`\n &:not(${StyledTouchDialog}) {\n overflow: auto;\n }\n`;\n\nStyledFormDialog.defaultProps = defaultThemeProp;\n\ninterface StyledSourceTextareaProps {\n $minHeight?: number;\n $maxHeight?: number;\n}\n\nexport const StyledSourceTextarea = styled.textarea<StyledSourceTextareaProps>(\n ({ theme, $minHeight, $maxHeight }) => {\n const minHeightValue = $minHeight\n ? `${$minHeight}px`\n : theme.components['text-area']['min-height'];\n const maxHeightValue = $maxHeight ? `${$maxHeight}px` : undefined;\n\n return css`\n display: block;\n width: 100%;\n border: none;\n min-height: ${minHeightValue};\n font-family: monospace;\n font-size: ${theme.base['font-size']};\n padding: ${theme.base.spacing};\n resize: none;\n background-color: ${theme.components['form-control']['background-color']};\n color: ${theme.base.palette['foreground-color']};\n\n ${maxHeightValue &&\n css`\n max-height: ${maxHeightValue};\n overflow: auto;\n `}\n\n &:focus {\n outline: none;\n box-shadow: ${theme.base.shadow.focus};\n }\n `;\n }\n);\n\nStyledSourceTextarea.defaultProps = defaultThemeProp;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageEditDialog.d.ts","sourceRoot":"","sources":["../../../src/components/Editor/ImageEditDialog.tsx"],"names":[],"mappings":"AAOA,UAAU,oBAAoB;IAC5B,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IACzC,iBAAiB,EAAE,eAAe,CAAC;IACnC,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;CAC7B;AAED,MAAM,WAAW,eAAe;IAC9B,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,eAAe,CAAC,EAC9B,MAAM,EACN,OAAO,EACP,MAAM,EACN,iBAAiB,EACjB,MAAM,EACP,EAAE,oBAAoB,
|
|
1
|
+
{"version":3,"file":"ImageEditDialog.d.ts","sourceRoot":"","sources":["../../../src/components/Editor/ImageEditDialog.tsx"],"names":[],"mappings":"AAOA,UAAU,oBAAoB;IAC5B,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IACzC,iBAAiB,EAAE,eAAe,CAAC;IACnC,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;CAC7B;AAED,MAAM,WAAW,eAAe;IAC9B,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,eAAe,CAAC,EAC9B,MAAM,EACN,OAAO,EACP,MAAM,EACN,iBAAiB,EACjB,MAAM,EACP,EAAE,oBAAoB,kDAoItB"}
|
|
@@ -50,7 +50,7 @@ export function ImageEditDialog({ isOpen, onClose, onSave, initialAttributes, ta
|
|
|
50
50
|
};
|
|
51
51
|
const handleSave = () => {
|
|
52
52
|
if (incorrectUrl)
|
|
53
|
-
return;
|
|
53
|
+
return false;
|
|
54
54
|
const parsedWidth = parseFloat(width);
|
|
55
55
|
const parsedHeight = parseFloat(height);
|
|
56
56
|
const attrs = {
|
|
@@ -61,15 +61,12 @@ export function ImageEditDialog({ isOpen, onClose, onSave, initialAttributes, ta
|
|
|
61
61
|
actionUrl: actionUrl.trim() || undefined
|
|
62
62
|
};
|
|
63
63
|
onSave(attrs);
|
|
64
|
-
|
|
65
|
-
};
|
|
66
|
-
const handleCancel = () => {
|
|
67
|
-
onClose();
|
|
64
|
+
return true;
|
|
68
65
|
};
|
|
69
66
|
if (!isOpen || !target) {
|
|
70
67
|
return null;
|
|
71
68
|
}
|
|
72
|
-
return (_jsx(StyledFormDialog, { heading: t('rte_edit_image'), onSubmit: handleSave,
|
|
69
|
+
return (_jsx(StyledFormDialog, { heading: t('rte_edit_image'), onSubmit: handleSave, onAfterClose: onClose, target: target, ref: popoverRef, children: _jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(Input, { label: t('description'), value: alt, onChange: (e) => setAlt(e.target.value), info: t('rte_image_description_info') }), _jsx(Input, { label: t('rte_action_url'), value: actionUrl, info: incorrectUrl ? t('rte_invalid_url') : '', status: incorrectUrl ? 'error' : undefined, onChange: e => {
|
|
73
70
|
const actionUrlInput = e.target.value;
|
|
74
71
|
setActionUrl(actionUrlInput);
|
|
75
72
|
if (actionUrlInput === '') {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageEditDialog.js","sourceRoot":"","sources":["../../../src/components/Editor/ImageEditDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useEffect, useRef } from 'react';\nimport type { ChangeEvent } from 'react';\n\nimport { Flex, Input, NumberInput, Checkbox, useI18n } from '@pega/cosmos-react-core';\n\nimport { StyledFormDialog } from './Editor.styles';\n\ninterface ImageEditDialogProps {\n isOpen: boolean;\n onClose: () => void;\n onSave: (attrs: ImageAttributes) => void;\n initialAttributes: ImageAttributes;\n target?: HTMLElement | null;\n}\n\nexport interface ImageAttributes {\n src: string;\n alt?: string;\n width?: number;\n height?: number;\n actionUrl?: string;\n}\n\nexport function ImageEditDialog({\n isOpen,\n onClose,\n onSave,\n initialAttributes,\n target\n}: ImageEditDialogProps) {\n const t = useI18n();\n const popoverRef = useRef(null);\n const [alt, setAlt] = useState(initialAttributes.alt || '');\n const [width, setWidth] = useState(initialAttributes.width?.toString() || '');\n const [height, setHeight] = useState(initialAttributes.height?.toString() || '');\n const [actionUrl, setActionUrl] = useState(initialAttributes.actionUrl || '');\n const [customSize, setCustomSize] = useState(false);\n const [aspectRatio, setAspectRatio] = useState(0);\n const [incorrectUrl, setIncorrectUrl] = useState(false);\n\n useEffect(() => {\n if (isOpen) {\n setAlt(initialAttributes.alt || '');\n setWidth(initialAttributes.width?.toString() || '');\n setHeight(initialAttributes.height?.toString() || '');\n setActionUrl(initialAttributes.actionUrl || '');\n setCustomSize(false); // Always unchecked by default\n\n // Calculate aspect ratio from initial dimensions\n if (initialAttributes.width && initialAttributes.height) {\n setAspectRatio(initialAttributes.width / initialAttributes.height);\n }\n setIncorrectUrl(false);\n }\n }, [isOpen, initialAttributes]);\n\n const onHeightChange = (incomingValue: string) => {\n const inputHeight = parseInt(incomingValue, 10);\n if (Number.isNaN(inputHeight)) {\n setHeight('');\n return;\n }\n setHeight(inputHeight.toString());\n if (aspectRatio) {\n setWidth(Math.floor(inputHeight * aspectRatio).toString());\n }\n };\n\n const onWidthChange = (incomingValue: string) => {\n const inputWidth = parseInt(incomingValue, 10);\n if (Number.isNaN(inputWidth)) {\n setWidth('');\n return;\n }\n setWidth(inputWidth.toString());\n if (aspectRatio) {\n setHeight(Math.floor(inputWidth / aspectRatio).toString());\n }\n };\n\n const handleSave = () => {\n if (incorrectUrl) return;\n\n const parsedWidth = parseFloat(width);\n const parsedHeight = parseFloat(height);\n\n const attrs: ImageAttributes = {\n src: initialAttributes.src,\n alt: alt.trim() || undefined,\n width: customSize && Number.isFinite(parsedWidth) ? parsedWidth : undefined,\n height: customSize && Number.isFinite(parsedHeight) ? parsedHeight : undefined,\n actionUrl: actionUrl.trim() || undefined\n };\n\n onSave(attrs);\n onClose();\n };\n\n const handleCancel = () => {\n onClose();\n };\n\n if (!isOpen || !target) {\n return null;\n }\n\n return (\n <StyledFormDialog\n heading={t('rte_edit_image')}\n onSubmit={handleSave}\n onCancel={handleCancel}\n onDismiss={onClose}\n target={target}\n ref={popoverRef}\n >\n <Flex container={{ direction: 'column', gap: 2 }}>\n <Input\n label={t('description')}\n value={alt}\n onChange={(e: ChangeEvent<HTMLInputElement>) => setAlt(e.target.value)}\n info={t('rte_image_description_info')}\n />\n <Input\n label={t('rte_action_url')}\n value={actionUrl}\n info={incorrectUrl ? t('rte_invalid_url') : ''}\n status={incorrectUrl ? 'error' : undefined}\n onChange={e => {\n const actionUrlInput = e.target.value;\n setActionUrl(actionUrlInput);\n if (actionUrlInput === '') {\n setIncorrectUrl(false);\n return;\n }\n try {\n const newUrl = new URL(actionUrlInput);\n setIncorrectUrl(!['http:', 'https:'].includes(newUrl.protocol));\n } catch {\n setIncorrectUrl(true);\n }\n }}\n />\n <Checkbox\n checked={customSize}\n label={t('rte_image_custom_size')}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n setCustomSize(e.target.checked);\n }}\n />\n {customSize && (\n <>\n <NumberInput\n label={t('rte_width_in_pixels')}\n value={Math.floor(Math.max(parseFloat(width) || 1, 1)).toString()}\n onChange={onWidthChange}\n />\n <NumberInput\n label={t('rte_height_in_pixels')}\n value={Math.floor(Math.max(parseFloat(height) || 1, 1)).toString()}\n onChange={onHeightChange}\n />\n </>\n )}\n </Flex>\n </StyledFormDialog>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"ImageEditDialog.js","sourceRoot":"","sources":["../../../src/components/Editor/ImageEditDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useEffect, useRef } from 'react';\nimport type { ChangeEvent } from 'react';\n\nimport { Flex, Input, NumberInput, Checkbox, useI18n } from '@pega/cosmos-react-core';\n\nimport { StyledFormDialog } from './Editor.styles';\n\ninterface ImageEditDialogProps {\n isOpen: boolean;\n onClose: () => void;\n onSave: (attrs: ImageAttributes) => void;\n initialAttributes: ImageAttributes;\n target?: HTMLElement | null;\n}\n\nexport interface ImageAttributes {\n src: string;\n alt?: string;\n width?: number;\n height?: number;\n actionUrl?: string;\n}\n\nexport function ImageEditDialog({\n isOpen,\n onClose,\n onSave,\n initialAttributes,\n target\n}: ImageEditDialogProps) {\n const t = useI18n();\n const popoverRef = useRef(null);\n const [alt, setAlt] = useState(initialAttributes.alt || '');\n const [width, setWidth] = useState(initialAttributes.width?.toString() || '');\n const [height, setHeight] = useState(initialAttributes.height?.toString() || '');\n const [actionUrl, setActionUrl] = useState(initialAttributes.actionUrl || '');\n const [customSize, setCustomSize] = useState(false);\n const [aspectRatio, setAspectRatio] = useState(0);\n const [incorrectUrl, setIncorrectUrl] = useState(false);\n\n useEffect(() => {\n if (isOpen) {\n setAlt(initialAttributes.alt || '');\n setWidth(initialAttributes.width?.toString() || '');\n setHeight(initialAttributes.height?.toString() || '');\n setActionUrl(initialAttributes.actionUrl || '');\n setCustomSize(false); // Always unchecked by default\n\n // Calculate aspect ratio from initial dimensions\n if (initialAttributes.width && initialAttributes.height) {\n setAspectRatio(initialAttributes.width / initialAttributes.height);\n }\n setIncorrectUrl(false);\n }\n }, [isOpen, initialAttributes]);\n\n const onHeightChange = (incomingValue: string) => {\n const inputHeight = parseInt(incomingValue, 10);\n if (Number.isNaN(inputHeight)) {\n setHeight('');\n return;\n }\n setHeight(inputHeight.toString());\n if (aspectRatio) {\n setWidth(Math.floor(inputHeight * aspectRatio).toString());\n }\n };\n\n const onWidthChange = (incomingValue: string) => {\n const inputWidth = parseInt(incomingValue, 10);\n if (Number.isNaN(inputWidth)) {\n setWidth('');\n return;\n }\n setWidth(inputWidth.toString());\n if (aspectRatio) {\n setHeight(Math.floor(inputWidth / aspectRatio).toString());\n }\n };\n\n const handleSave = () => {\n if (incorrectUrl) return false;\n\n const parsedWidth = parseFloat(width);\n const parsedHeight = parseFloat(height);\n\n const attrs: ImageAttributes = {\n src: initialAttributes.src,\n alt: alt.trim() || undefined,\n width: customSize && Number.isFinite(parsedWidth) ? parsedWidth : undefined,\n height: customSize && Number.isFinite(parsedHeight) ? parsedHeight : undefined,\n actionUrl: actionUrl.trim() || undefined\n };\n\n onSave(attrs);\n return true;\n };\n\n if (!isOpen || !target) {\n return null;\n }\n\n return (\n <StyledFormDialog\n heading={t('rte_edit_image')}\n onSubmit={handleSave}\n onAfterClose={onClose}\n target={target}\n ref={popoverRef}\n >\n <Flex container={{ direction: 'column', gap: 2 }}>\n <Input\n label={t('description')}\n value={alt}\n onChange={(e: ChangeEvent<HTMLInputElement>) => setAlt(e.target.value)}\n info={t('rte_image_description_info')}\n />\n <Input\n label={t('rte_action_url')}\n value={actionUrl}\n info={incorrectUrl ? t('rte_invalid_url') : ''}\n status={incorrectUrl ? 'error' : undefined}\n onChange={e => {\n const actionUrlInput = e.target.value;\n setActionUrl(actionUrlInput);\n if (actionUrlInput === '') {\n setIncorrectUrl(false);\n return;\n }\n try {\n const newUrl = new URL(actionUrlInput);\n setIncorrectUrl(!['http:', 'https:'].includes(newUrl.protocol));\n } catch {\n setIncorrectUrl(true);\n }\n }}\n />\n <Checkbox\n checked={customSize}\n label={t('rte_image_custom_size')}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n setCustomSize(e.target.checked);\n }}\n />\n {customSize && (\n <>\n <NumberInput\n label={t('rte_width_in_pixels')}\n value={Math.floor(Math.max(parseFloat(width) || 1, 1)).toString()}\n onChange={onWidthChange}\n />\n <NumberInput\n label={t('rte_height_in_pixels')}\n value={Math.floor(Math.max(parseFloat(height) || 1, 1)).toString()}\n onChange={onHeightChange}\n />\n </>\n )}\n </Flex>\n </StyledFormDialog>\n );\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AIRewriteButton.d.ts","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/AIRewriteButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,cAAc,CAAC;AAG3D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AASxD,MAAM,WAAW,oBAAoB;IACnC,MAAM,EAAE,YAAY,CAAC;IACrB,cAAc,EAAE,CACd,YAAY,EAAE,MAAM,EACpB,aAAa,EAAE,QAAQ,EACvB,sBAAsB,EAAE,MAAM,EAC9B,SAAS,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,KACvC,IAAI,CAAC;IACV,sBAAsB,CAAC,EAAE,CAAC,KAAK,EAAE;QAC/B,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,QAAQ,EAAE,OAAO,CAAC;QAClB,QAAQ,EAAE,OAAO,CAAC;QAClB,YAAY,EAAE,CAAC,UAAU,EAAE,MAAM,MAAM,KAAK,IAAI,CAAC;QACjD,eAAe,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;KAChD,KAAK,SAAS,CAAC;CACjB;AAED,QAAA,MAAM,eAAe,GAAI,oDAItB,oBAAoB,
|
|
1
|
+
{"version":3,"file":"AIRewriteButton.d.ts","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/AIRewriteButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,cAAc,CAAC;AAG3D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AASxD,MAAM,WAAW,oBAAoB;IACnC,MAAM,EAAE,YAAY,CAAC;IACrB,cAAc,EAAE,CACd,YAAY,EAAE,MAAM,EACpB,aAAa,EAAE,QAAQ,EACvB,sBAAsB,EAAE,MAAM,EAC9B,SAAS,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,KACvC,IAAI,CAAC;IACV,sBAAsB,CAAC,EAAE,CAAC,KAAK,EAAE;QAC/B,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,QAAQ,EAAE,OAAO,CAAC;QAClB,QAAQ,EAAE,OAAO,CAAC;QAClB,YAAY,EAAE,CAAC,UAAU,EAAE,MAAM,MAAM,KAAK,IAAI,CAAC;QACjD,eAAe,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;KAChD,KAAK,SAAS,CAAC;CACjB;AAED,QAAA,MAAM,eAAe,GAAI,oDAItB,oBAAoB,4CA6GtB,CAAC;AAEF,eAAe,eAAe,CAAC"}
|
|
@@ -45,25 +45,22 @@ const AIRewriteButton = ({ editor, onRewriteClick, renderSuggestionEditor }) =>
|
|
|
45
45
|
const editedContent = getContentRef.current?.() ?? suggestion ?? '';
|
|
46
46
|
const restoredContent = restorePlaceholders(editedContent, placeholderMapRef.current, userPlaceholdersRef.current);
|
|
47
47
|
editor.chain().setContent(restoredContent).focus('end').run();
|
|
48
|
-
setShowPopover(false);
|
|
49
|
-
setSuggestion(undefined);
|
|
50
|
-
setHasSuggestionContent(false);
|
|
51
|
-
placeholderMapRef.current = {};
|
|
52
|
-
userPlaceholdersRef.current = [];
|
|
53
48
|
};
|
|
54
49
|
const handleCancel = () => {
|
|
55
50
|
generationTokenRef.current += 1;
|
|
51
|
+
buttonEl?.focus();
|
|
52
|
+
};
|
|
53
|
+
const handleAfterClose = () => {
|
|
56
54
|
setShowPopover(false);
|
|
57
55
|
setSuggestion(undefined);
|
|
58
56
|
setIsGenerating(false);
|
|
59
57
|
setHasSuggestionContent(false);
|
|
60
58
|
placeholderMapRef.current = {};
|
|
61
59
|
userPlaceholdersRef.current = [];
|
|
62
|
-
buttonEl?.focus();
|
|
63
60
|
};
|
|
64
61
|
return (_jsxs(_Fragment, { children: [_jsx(ToolbarButton, { ref: setButtonEl, onClick: () => {
|
|
65
62
|
setShowPopover(true);
|
|
66
|
-
}, disabled: !hasContent(), tooltip: t('ai_rewrite_title'), label: t('ai_rewrite_title'), children: _jsx(Icon, { name: 'polaris' }) }), showPopover && buttonEl && (_jsx(AIRewrite, { target: buttonEl, isGenerating: isGenerating, suggestion: hasSuggestionContent ? suggestion : undefined, onGenerate: handleGenerate, onSubmit: handleSubmit, onCancel: handleCancel, suggestionEditor: renderSuggestionEditor
|
|
63
|
+
}, disabled: !hasContent(), tooltip: t('ai_rewrite_title'), label: t('ai_rewrite_title'), children: _jsx(Icon, { name: 'polaris' }) }), showPopover && buttonEl && (_jsx(AIRewrite, { target: buttonEl, isGenerating: isGenerating, suggestion: hasSuggestionContent ? suggestion : undefined, onGenerate: handleGenerate, onSubmit: handleSubmit, onCancel: handleCancel, onAfterClose: handleAfterClose, suggestionEditor: renderSuggestionEditor
|
|
67
64
|
? renderSuggestionEditor({
|
|
68
65
|
defaultValue: suggestion,
|
|
69
66
|
disabled: isGenerating || !suggestion,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AIRewriteButton.js","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/AIRewriteButton.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"AIRewriteButton.js","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/AIRewriteButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, useState } from 'react';\nimport type { ReactNode } from 'react';\nimport type { Editor as TiptapEditor } from '@tiptap/core';\n\nimport { AIRewrite, Icon, registerIcon, useElement, useI18n } from '@pega/cosmos-react-core';\nimport type { AIAction } from '@pega/cosmos-react-core';\nimport * as polarisIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/polaris.icon';\n\nimport ToolbarButton from '../../RichTextEditor/Toolbar/ToolbarButton';\nimport { extractLinkAndImg, restorePlaceholders } from '../utils/htmlPlaceholder';\nimport type { PlaceholderMap } from '../utils/htmlPlaceholder';\n\nregisterIcon(polarisIcon);\n\nexport interface AIRewriteButtonProps {\n editor: TiptapEditor;\n onRewriteClick: (\n originalText: string,\n rewriteAction: AIAction,\n additionalInstructions: string,\n onSuccess: (rewrittenText: string) => void\n ) => void;\n renderSuggestionEditor?: (props: {\n defaultValue?: string;\n disabled: boolean;\n readOnly: boolean;\n onGetContent: (getContent: () => string) => void;\n onContentChange: (hasContent: boolean) => void;\n }) => ReactNode;\n}\n\nconst AIRewriteButton = ({\n editor,\n onRewriteClick,\n renderSuggestionEditor\n}: AIRewriteButtonProps) => {\n const t = useI18n();\n const [buttonEl, setButtonEl] = useElement<HTMLElement>();\n const [showPopover, setShowPopover] = useState(false);\n const [isGenerating, setIsGenerating] = useState(false);\n const [suggestion, setSuggestion] = useState<string | undefined>(undefined);\n const [hasSuggestionContent, setHasSuggestionContent] = useState(false);\n const getContentRef = useRef<(() => string) | undefined>(undefined);\n const generationTokenRef = useRef(0);\n const placeholderMapRef = useRef<PlaceholderMap>({});\n const userPlaceholdersRef = useRef<string[]>([]);\n\n const getHtmlContent = (): string => {\n return editor ? editor.getHTML().trim() : '';\n };\n\n const hasContent = (): boolean => {\n return editor ? editor.getText().trim() !== '' : false;\n };\n\n const handleGenerate = (rewriteAction: AIAction, additionalInstructions: string) => {\n const originalContent = getHtmlContent();\n const { placeholderHtml, placeholderMap, userPlaceholders } =\n extractLinkAndImg(originalContent);\n placeholderMapRef.current = placeholderMap;\n userPlaceholdersRef.current = userPlaceholders;\n generationTokenRef.current += 1;\n const token = generationTokenRef.current;\n setIsGenerating(true);\n setSuggestion(undefined);\n setHasSuggestionContent(false);\n\n onRewriteClick(\n placeholderHtml,\n rewriteAction,\n additionalInstructions || '',\n (rewrittenText: string) => {\n if (token !== generationTokenRef.current) return;\n setIsGenerating(false);\n const trimmedText = rewrittenText.trim();\n setSuggestion(trimmedText || undefined);\n setHasSuggestionContent(trimmedText.length > 0);\n }\n );\n };\n\n const handleSubmit = () => {\n const editedContent = getContentRef.current?.() ?? suggestion ?? '';\n const restoredContent = restorePlaceholders(\n editedContent,\n placeholderMapRef.current,\n userPlaceholdersRef.current\n );\n editor.chain().setContent(restoredContent).focus('end').run();\n };\n\n const handleCancel = () => {\n generationTokenRef.current += 1;\n buttonEl?.focus();\n };\n\n const handleAfterClose = () => {\n setShowPopover(false);\n setSuggestion(undefined);\n setIsGenerating(false);\n setHasSuggestionContent(false);\n placeholderMapRef.current = {};\n userPlaceholdersRef.current = [];\n };\n\n return (\n <>\n <ToolbarButton\n ref={setButtonEl}\n onClick={() => {\n setShowPopover(true);\n }}\n disabled={!hasContent()}\n tooltip={t('ai_rewrite_title')}\n label={t('ai_rewrite_title')}\n >\n <Icon name='polaris' />\n </ToolbarButton>\n {showPopover && buttonEl && (\n <AIRewrite\n target={buttonEl}\n isGenerating={isGenerating}\n suggestion={hasSuggestionContent ? suggestion : undefined}\n onGenerate={handleGenerate}\n onSubmit={handleSubmit}\n onCancel={handleCancel}\n onAfterClose={handleAfterClose}\n suggestionEditor={\n renderSuggestionEditor\n ? renderSuggestionEditor({\n defaultValue: suggestion,\n disabled: isGenerating || !suggestion,\n readOnly: false,\n onGetContent: getContent => {\n getContentRef.current = getContent;\n },\n onContentChange: setHasSuggestionContent\n })\n : undefined\n }\n />\n )}\n </>\n );\n};\n\nexport default AIRewriteButton;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-rte",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.37.1",
|
|
4
4
|
"license": "SEE LICENSE IN LICENSE",
|
|
5
5
|
"author": "Pegasystems",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
17
|
"@intevation/tiptap-extension-office-paste": "^0.1.2",
|
|
18
|
-
"@pega/cosmos-react-core": "9.
|
|
18
|
+
"@pega/cosmos-react-core": "9.37.1",
|
|
19
19
|
"@popperjs/core": "^2.11.6",
|
|
20
20
|
"@tiptap/core": "^3.12.1",
|
|
21
21
|
"@tiptap/extension-blockquote": "^3.12.1",
|