@pega/cosmos-react-rte 9.0.0-build.29.2 → 9.0.0-build.29.21

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.
@@ -1 +1 @@
1
- {"version":3,"file":"Editor.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Editor/Editor.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,qBAAqB,6NAOjC,CAAC;AAIF,UAAU,uBAAuB;IAC/B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,kBAAkB,wQAmB9B,CAAC;AAIF,eAAO,MAAM,gBAAgB;2BAe2gF,CAAC;iDAft/E,CAAC;AAIpD,eAAO,MAAM,iBAAiB,0dAE7B,CAAC;AAIF,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;qSAE5B,CAAC"}
1
+ {"version":3,"file":"Editor.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Editor/Editor.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,qBAAqB,6NAOjC,CAAC;AAIF,UAAU,uBAAuB;IAC/B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,kBAAkB,wQAmB9B,CAAC;AAIF,eAAO,MAAM,gBAAgB;2BAeogF,CAAC;iDAf/+E,CAAC;AAIpD,eAAO,MAAM,iBAAiB,0dAE7B,CAAC;AAIF,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;qSAE5B,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"AnchorButton.d.ts","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/AnchorButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,cAAc,CAAC;AAa3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAS5D,UAAU,iBAAiB;IACzB,GAAG,EAAE,OAAO,CAAC;IACb,MAAM,EAAE,YAAY,CAAC;CACtB;AAED,QAAA,MAAM,YAAY,GAAI,+BAA+B,iBAAiB,GAAG,YAAY,4CAiRpF,CAAC;AAEF,eAAe,YAAY,CAAC"}
1
+ {"version":3,"file":"AnchorButton.d.ts","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/AnchorButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,cAAc,CAAC;AAe3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAS5D,UAAU,iBAAiB;IACzB,GAAG,EAAE,OAAO,CAAC;IACb,MAAM,EAAE,YAAY,CAAC;CACtB;AAED,QAAA,MAAM,YAAY,GAAI,+BAA+B,iBAAiB,GAAG,YAAY,4CAmRpF,CAAC;AAEF,eAAe,YAAY,CAAC"}
@@ -1,6 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
- import { useRef, useState, useEffect, useLayoutEffect } from 'react';
3
- import { Button, CardContent, Grid, Icon, registerIcon, Input, useOuterEvent, Form, useI18n } from '@pega/cosmos-react-core';
2
+ import { useRef, useState, useEffect, useLayoutEffect, useCallback } from 'react';
3
+ import { Button, CardContent, Grid, Icon, registerIcon, Input, useOuterEvent, Form, useI18n, useElement, useEscape } from '@pega/cosmos-react-core';
4
4
  import * as chainIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/chain.icon';
5
5
  import ToolbarButton from '../../RichTextEditor/Toolbar/ToolbarButton';
6
6
  import { getKeyCommand } from '../../RichTextEditor/Toolbar/utils';
@@ -9,9 +9,9 @@ registerIcon(chainIcon);
9
9
  const AnchorButton = ({ osx, editor, ...restProps }) => {
10
10
  const t = useI18n();
11
11
  const buttonRef = useRef(null);
12
- const textInputRef = useRef(null);
13
- const urlInputRef = useRef(null);
14
- const popoverRef = useRef(null);
12
+ const [textInputEl, setTextInputEl] = useElement();
13
+ const [urlInputEl, setUrlInputEl] = useElement();
14
+ const [popoverEl, setPopoverEl] = useElement();
15
15
  const [linkText, setLinkText] = useState('');
16
16
  const [url, setUrl] = useState('');
17
17
  const [urlMatch, setUrlMatch] = useState(false);
@@ -29,19 +29,19 @@ const AnchorButton = ({ osx, editor, ...restProps }) => {
29
29
  setShouldFocusInput(true);
30
30
  }
31
31
  };
32
- const resetMenu = () => {
32
+ const resetMenu = useCallback(() => {
33
33
  setLinkText('');
34
34
  setUrl('');
35
35
  setUrlMatch(true);
36
36
  setAnchorMenu(false);
37
37
  originalSelectionRef.current = null;
38
- };
39
- useOuterEvent('mousedown', [popoverRef, buttonRef], () => {
38
+ }, []);
39
+ useOuterEvent('mousedown', [popoverEl, buttonRef], () => {
40
40
  if (anchorMenu) {
41
41
  resetMenu();
42
42
  }
43
43
  });
44
- const createLink = () => {
44
+ const createLink = useCallback(() => {
45
45
  if (url) {
46
46
  // Only allow safe protocols to prevent XSS (e.g., javascript: URLs)
47
47
  const allowedProtocols = /^(https?|mailto|tel):/i;
@@ -87,7 +87,7 @@ const AnchorButton = ({ osx, editor, ...restProps }) => {
87
87
  }
88
88
  resetMenu();
89
89
  }
90
- };
90
+ }, [url, linkText, editor, resetMenu]);
91
91
  useEffect(() => {
92
92
  if (anchorMenu && originalSelectionRef.current) {
93
93
  // Use the stored original selection to populate the modal
@@ -114,16 +114,18 @@ const AnchorButton = ({ osx, editor, ...restProps }) => {
114
114
  const isLinkActive = () => {
115
115
  return editor.isActive('link') && editor.isFocused;
116
116
  };
117
- const cancelAnchorCreation = (event) => {
118
- if (((event && 'key' in event && event.key === 'Enter') ||
119
- event?.type === 'mousedown' ||
117
+ const cancelAnchorCreation = useCallback((event) => {
118
+ if (((event && 'key' in event && event.key === 'Escape') ||
119
+ event?.type === 'click' ||
120
120
  !event) &&
121
121
  anchorMenu) {
122
- event?.preventDefault();
122
+ if (event && 'key' in event && event.key === 'Escape') {
123
+ event.stopPropagation();
124
+ }
123
125
  resetMenu();
124
126
  buttonRef.current?.focus();
125
127
  }
126
- };
128
+ }, [anchorMenu, resetMenu]);
127
129
  useEffect(() => {
128
130
  const keyCommandListener = (e) => {
129
131
  if (e.key === 'k' && (e.metaKey || e.ctrlKey)) {
@@ -141,25 +143,28 @@ const AnchorButton = ({ osx, editor, ...restProps }) => {
141
143
  return () => {
142
144
  iframeWindow?.removeEventListener('keydown', keyCommandListener);
143
145
  };
144
- }, [editor]);
146
+ }, [editor, cancelAnchorCreation]);
147
+ useEscape(cancelAnchorCreation, popoverEl);
145
148
  useLayoutEffect(() => {
146
- if (anchorMenu && shouldFocusInput) {
147
- textInputRef.current?.focus();
149
+ if (textInputEl && shouldFocusInput) {
150
+ textInputEl.focus();
148
151
  setShouldFocusInput(false);
149
152
  }
150
- }, [textInputRef.current]);
153
+ }, [textInputEl, shouldFocusInput]);
151
154
  useEffect(() => {
152
155
  // These events must be added here so they run before the native event in useArrows (used in the toolbar).
153
156
  const onKeyDown = (e) => {
154
- e.stopPropagation();
157
+ if (e.key !== 'Escape') {
158
+ e.stopPropagation();
159
+ }
155
160
  };
156
- textInputRef.current?.addEventListener('keydown', onKeyDown);
157
- urlInputRef.current?.addEventListener('keydown', onKeyDown);
161
+ textInputEl?.addEventListener('keydown', onKeyDown);
162
+ urlInputEl?.addEventListener('keydown', onKeyDown);
158
163
  return () => {
159
- textInputRef.current?.removeEventListener('keydown', onKeyDown);
160
- urlInputRef.current?.removeEventListener('keydown', onKeyDown);
164
+ textInputEl?.removeEventListener('keydown', onKeyDown);
165
+ urlInputEl?.removeEventListener('keydown', onKeyDown);
161
166
  };
162
- }, [textInputRef.current, urlInputRef.current]);
167
+ }, [textInputEl, urlInputEl]);
163
168
  return (_jsxs(_Fragment, { children: [_jsx(ToolbarButton, { ref: buttonRef, onMouseDown: e => {
164
169
  e.preventDefault();
165
170
  openMenu();
@@ -168,12 +173,9 @@ const AnchorButton = ({ osx, editor, ...restProps }) => {
168
173
  e.preventDefault();
169
174
  openMenu({ focusInput: true });
170
175
  }
171
- }, active: isLinkActive(), tooltip: tooltip, label: t('rte_link'), ...restProps, children: _jsx(Icon, { name: 'chain' }) }), _jsx(StyledEditPopover, { show: anchorMenu, target: buttonRef.current, ref: popoverRef, placement: 'bottom', children: _jsx(CardContent, { children: _jsx(Form, { as: 'div', actions: _jsxs(_Fragment, { children: [_jsx(Button, { variant: 'secondary', onKeyDown: cancelAnchorCreation, onMouseDown: cancelAnchorCreation, type: 'button', children: t('cancel') }), _jsx(Button, { disabled: !url || !urlMatch, name: 'apply', variant: 'primary', onClick: (e) => {
172
- e.preventDefault();
173
- createLink();
174
- }, children: t('apply') })] }), children: _jsxs(Grid, { container: { rowGap: 2 }, children: [_jsx(Input, { label: t('rte_link_text'), value: linkText, onClick: preventDef, onChange: (e) => {
176
+ }, active: isLinkActive(), tooltip: tooltip, label: t('rte_link'), ...restProps, children: _jsx(Icon, { name: 'chain' }) }), _jsx(StyledEditPopover, { show: anchorMenu, target: buttonRef.current, ref: setPopoverEl, placement: 'bottom', children: _jsx(CardContent, { children: _jsx(Form, { as: 'div', actions: _jsxs(_Fragment, { children: [_jsx(Button, { variant: 'secondary', onClick: cancelAnchorCreation, type: 'button', children: t('cancel') }), _jsx(Button, { disabled: !url || !urlMatch, name: 'apply', variant: 'primary', onClick: createLink, children: t('apply') })] }), children: _jsxs(Grid, { container: { rowGap: 2 }, children: [_jsx(Input, { label: t('rte_link_text'), value: linkText, onClick: preventDef, onChange: (e) => {
175
177
  setLinkText(e.target.value);
176
- }, ref: textInputRef }), _jsx(Input, { label: t('rte_link_url'), value: url, onClick: preventDef, onChange: (e) => {
178
+ }, ref: setTextInputEl }), _jsx(Input, { label: t('rte_link_url'), value: url, onClick: preventDef, onChange: (e) => {
177
179
  const urlInput = e.target.value;
178
180
  setUrl(urlInput);
179
181
  if (!urlMatch) {
@@ -195,7 +197,7 @@ const AnchorButton = ({ osx, editor, ...restProps }) => {
195
197
  catch {
196
198
  setUrlMatch(false);
197
199
  }
198
- }, info: !urlMatch ? t('rte_invalid_url') : '', status: !urlMatch ? 'error' : undefined, ref: urlInputRef })] }) }) }) })] }));
200
+ }, info: !urlMatch ? t('rte_invalid_url') : '', status: !urlMatch ? 'error' : undefined, ref: setUrlInputEl })] }) }) }) })] }));
199
201
  };
200
202
  export default AnchorButton;
201
203
  //# sourceMappingURL=AnchorButton.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"AnchorButton.js","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/AnchorButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, useState, useEffect, useLayoutEffect } from 'react';\nimport type { ChangeEvent, MouseEvent, KeyboardEvent as ReactKeyboardEvent } from 'react';\nimport type { Editor as TiptapEditor } from '@tiptap/core';\n\nimport {\n Button,\n CardContent,\n Grid,\n Icon,\n registerIcon,\n Input,\n useOuterEvent,\n Form,\n useI18n\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps } from '@pega/cosmos-react-core';\nimport * as chainIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/chain.icon';\n\nimport ToolbarButton from '../../RichTextEditor/Toolbar/ToolbarButton';\nimport { getKeyCommand } from '../../RichTextEditor/Toolbar/utils';\nimport { StyledEditPopover } from '../Editor.styles';\n\nregisterIcon(chainIcon);\n\ninterface AnchorButtonProps {\n osx: boolean;\n editor: TiptapEditor;\n}\n\nconst AnchorButton = ({ osx, editor, ...restProps }: AnchorButtonProps & ForwardProps) => {\n const t = useI18n();\n const buttonRef = useRef<HTMLButtonElement>(null);\n const textInputRef = useRef<HTMLInputElement>(null);\n const urlInputRef = useRef<HTMLInputElement>(null);\n const popoverRef = useRef(null);\n const [linkText, setLinkText] = useState('');\n const [url, setUrl] = useState('');\n const [urlMatch, setUrlMatch] = useState(false);\n const [anchorMenu, setAnchorMenu] = useState(false);\n const [shouldFocusInput, setShouldFocusInput] = useState(false);\n // Store the original selection range when menu opens so we can restore it when creating the link\n const originalSelectionRef = useRef<{ from: number; to: number } | null>(null);\n const tooltip = getKeyCommand(osx, ({ ctrl }) => `${t('rte_link')} (${ctrl}K)`);\n\n const openMenu = (opts: { focusInput?: boolean } = {}) => {\n // Save the original selection before opening the menu\n const { from, to } = editor.state.selection;\n originalSelectionRef.current = { from, to };\n setAnchorMenu(true);\n if (opts.focusInput) {\n setShouldFocusInput(true);\n }\n };\n\n const resetMenu = () => {\n setLinkText('');\n setUrl('');\n setUrlMatch(true);\n setAnchorMenu(false);\n originalSelectionRef.current = null;\n };\n\n useOuterEvent('mousedown', [popoverRef, buttonRef], () => {\n if (anchorMenu) {\n resetMenu();\n }\n });\n\n const createLink = () => {\n if (url) {\n // Only allow safe protocols to prevent XSS (e.g., javascript: URLs)\n const allowedProtocols = /^(https?|mailto|tel):/i;\n const hasProtocol = /^[a-z][a-z0-9.+-]*:/i.test(url);\n\n let normalizedUrl: string;\n if (hasProtocol) {\n // Reject URLs with disallowed protocols\n if (!allowedProtocols.test(url)) {\n return;\n }\n normalizedUrl = url;\n } else {\n normalizedUrl = `https://${url}`;\n }\n\n // Use the original selection to determine if text was selected in the editor\n const originalSelection = originalSelectionRef.current;\n\n if (originalSelection && originalSelection.from !== originalSelection.to) {\n // Text was originally selected - restore selection and apply link\n // Then collapse selection to end and clear stored mark so subsequent typing isn't linked\n editor\n .chain()\n .focus()\n .setTextSelection({ from: originalSelection.from, to: originalSelection.to })\n .setLink({ href: normalizedUrl })\n .setTextSelection(originalSelection.to)\n .unsetMark('link')\n .run();\n } else if (linkText) {\n // No text was originally selected, insert new link with the text entered in modal\n editor\n .chain()\n .focus()\n .insertContent({\n type: 'text',\n text: linkText,\n marks: [{ type: 'link', attrs: { href: normalizedUrl } }]\n })\n .unsetMark('link')\n .insertContent(' ')\n .run();\n }\n resetMenu();\n }\n };\n\n useEffect(() => {\n if (anchorMenu && originalSelectionRef.current) {\n // Use the stored original selection to populate the modal\n // This avoids issues where focus shift may collapse the editor selection\n const { from, to } = originalSelectionRef.current;\n const text = editor.state.doc.textBetween(from, to);\n const linkMark = editor.getAttributes('link');\n\n if (linkMark.href) {\n setUrl(linkMark.href);\n setLinkText(text || '');\n } else {\n setLinkText(text || '');\n }\n } else if (!anchorMenu) {\n resetMenu();\n }\n }, [anchorMenu]);\n\n const preventDef = (e: MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n };\n\n const isLinkActive = () => {\n return editor.isActive('link') && editor.isFocused;\n };\n\n const cancelAnchorCreation = (event?: KeyboardEvent | MouseEvent) => {\n if (\n ((event && 'key' in event && event.key === 'Enter') ||\n event?.type === 'mousedown' ||\n !event) &&\n anchorMenu\n ) {\n event?.preventDefault();\n resetMenu();\n buttonRef.current?.focus();\n }\n };\n\n useEffect(() => {\n const keyCommandListener = (e: KeyboardEvent) => {\n if (e.key === 'k' && (e.metaKey || e.ctrlKey)) {\n e.preventDefault();\n openMenu({ focusInput: true });\n }\n if (e.key === 'Escape') {\n cancelAnchorCreation();\n }\n };\n\n // Get the iframe's window where editor content lives\n const iframeWindow = editor.view.dom.ownerDocument.defaultView;\n\n // Listen on iframe window for keyboard shortcuts (editor content is in iframe)\n iframeWindow?.addEventListener('keydown', keyCommandListener);\n return () => {\n iframeWindow?.removeEventListener('keydown', keyCommandListener);\n };\n }, [editor]);\n\n useLayoutEffect(() => {\n if (anchorMenu && shouldFocusInput) {\n textInputRef.current?.focus();\n setShouldFocusInput(false);\n }\n }, [textInputRef.current]);\n\n useEffect(() => {\n // These events must be added here so they run before the native event in useArrows (used in the toolbar).\n const onKeyDown = (e: KeyboardEvent) => {\n e.stopPropagation();\n };\n textInputRef.current?.addEventListener('keydown', onKeyDown);\n urlInputRef.current?.addEventListener('keydown', onKeyDown);\n return () => {\n textInputRef.current?.removeEventListener('keydown', onKeyDown);\n urlInputRef.current?.removeEventListener('keydown', onKeyDown);\n };\n }, [textInputRef.current, urlInputRef.current]);\n\n return (\n <>\n <ToolbarButton\n ref={buttonRef}\n onMouseDown={e => {\n e.preventDefault();\n openMenu();\n }}\n onKeyDown={(e: ReactKeyboardEvent) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n openMenu({ focusInput: true });\n }\n }}\n active={isLinkActive()}\n tooltip={tooltip}\n label={t('rte_link')}\n {...restProps}\n >\n <Icon name='chain' />\n </ToolbarButton>\n <StyledEditPopover\n show={anchorMenu}\n target={buttonRef.current}\n ref={popoverRef}\n placement='bottom'\n >\n <CardContent>\n <Form\n as='div'\n actions={\n <>\n <Button\n variant='secondary'\n onKeyDown={cancelAnchorCreation}\n onMouseDown={cancelAnchorCreation}\n type='button'\n >\n {t('cancel')}\n </Button>\n <Button\n disabled={!url || !urlMatch}\n name='apply'\n variant='primary'\n onClick={(e: MouseEvent) => {\n e.preventDefault();\n createLink();\n }}\n >\n {t('apply')}\n </Button>\n </>\n }\n >\n <Grid container={{ rowGap: 2 }}>\n <Input\n label={t('rte_link_text')}\n value={linkText}\n onClick={preventDef}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n setLinkText(e.target.value);\n }}\n ref={textInputRef}\n />\n <Input\n label={t('rte_link_url')}\n value={url}\n onClick={preventDef}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n const urlInput = e.target.value;\n setUrl(urlInput);\n\n if (!urlMatch) {\n try {\n // eslint-disable-next-line no-new\n new URL(\n /^[a-z][a-z0-9+.-]*:/i.test(urlInput) ? urlInput : `https:${urlInput}`\n );\n setUrlMatch(true);\n } catch {\n setUrlMatch(false);\n }\n }\n }}\n onBlur={() => {\n try {\n // eslint-disable-next-line no-new\n new URL(/^[a-z][a-z0-9+.-]*:/i.test(url) ? url : `https:${url}`);\n setUrlMatch(true);\n } catch {\n setUrlMatch(false);\n }\n }}\n info={!urlMatch ? t('rte_invalid_url') : ''}\n status={!urlMatch ? 'error' : undefined}\n ref={urlInputRef}\n />\n </Grid>\n </Form>\n </CardContent>\n </StyledEditPopover>\n </>\n );\n};\n\nexport default AnchorButton;\n"]}
1
+ {"version":3,"file":"AnchorButton.js","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/AnchorButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, useState, useEffect, useLayoutEffect, useCallback } from 'react';\nimport type { ChangeEvent, MouseEvent, KeyboardEvent as ReactKeyboardEvent } from 'react';\nimport type { Editor as TiptapEditor } from '@tiptap/core';\n\nimport {\n Button,\n CardContent,\n Grid,\n Icon,\n registerIcon,\n Input,\n useOuterEvent,\n Form,\n useI18n,\n useElement,\n useEscape\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps } from '@pega/cosmos-react-core';\nimport * as chainIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/chain.icon';\n\nimport ToolbarButton from '../../RichTextEditor/Toolbar/ToolbarButton';\nimport { getKeyCommand } from '../../RichTextEditor/Toolbar/utils';\nimport { StyledEditPopover } from '../Editor.styles';\n\nregisterIcon(chainIcon);\n\ninterface AnchorButtonProps {\n osx: boolean;\n editor: TiptapEditor;\n}\n\nconst AnchorButton = ({ osx, editor, ...restProps }: AnchorButtonProps & ForwardProps) => {\n const t = useI18n();\n const buttonRef = useRef<HTMLButtonElement>(null);\n const [textInputEl, setTextInputEl] = useElement<HTMLInputElement>();\n const [urlInputEl, setUrlInputEl] = useElement<HTMLInputElement>();\n const [popoverEl, setPopoverEl] = useElement<HTMLDivElement>();\n const [linkText, setLinkText] = useState('');\n const [url, setUrl] = useState('');\n const [urlMatch, setUrlMatch] = useState(false);\n const [anchorMenu, setAnchorMenu] = useState(false);\n const [shouldFocusInput, setShouldFocusInput] = useState(false);\n // Store the original selection range when menu opens so we can restore it when creating the link\n const originalSelectionRef = useRef<{ from: number; to: number } | null>(null);\n const tooltip = getKeyCommand(osx, ({ ctrl }) => `${t('rte_link')} (${ctrl}K)`);\n\n const openMenu = (opts: { focusInput?: boolean } = {}) => {\n // Save the original selection before opening the menu\n const { from, to } = editor.state.selection;\n originalSelectionRef.current = { from, to };\n setAnchorMenu(true);\n if (opts.focusInput) {\n setShouldFocusInput(true);\n }\n };\n\n const resetMenu = useCallback(() => {\n setLinkText('');\n setUrl('');\n setUrlMatch(true);\n setAnchorMenu(false);\n originalSelectionRef.current = null;\n }, []);\n\n useOuterEvent('mousedown', [popoverEl, buttonRef], () => {\n if (anchorMenu) {\n resetMenu();\n }\n });\n\n const createLink = useCallback(() => {\n if (url) {\n // Only allow safe protocols to prevent XSS (e.g., javascript: URLs)\n const allowedProtocols = /^(https?|mailto|tel):/i;\n const hasProtocol = /^[a-z][a-z0-9.+-]*:/i.test(url);\n\n let normalizedUrl: string;\n if (hasProtocol) {\n // Reject URLs with disallowed protocols\n if (!allowedProtocols.test(url)) {\n return;\n }\n normalizedUrl = url;\n } else {\n normalizedUrl = `https://${url}`;\n }\n\n // Use the original selection to determine if text was selected in the editor\n const originalSelection = originalSelectionRef.current;\n\n if (originalSelection && originalSelection.from !== originalSelection.to) {\n // Text was originally selected - restore selection and apply link\n // Then collapse selection to end and clear stored mark so subsequent typing isn't linked\n editor\n .chain()\n .focus()\n .setTextSelection({ from: originalSelection.from, to: originalSelection.to })\n .setLink({ href: normalizedUrl })\n .setTextSelection(originalSelection.to)\n .unsetMark('link')\n .run();\n } else if (linkText) {\n // No text was originally selected, insert new link with the text entered in modal\n editor\n .chain()\n .focus()\n .insertContent({\n type: 'text',\n text: linkText,\n marks: [{ type: 'link', attrs: { href: normalizedUrl } }]\n })\n .unsetMark('link')\n .insertContent(' ')\n .run();\n }\n resetMenu();\n }\n }, [url, linkText, editor, resetMenu]);\n\n useEffect(() => {\n if (anchorMenu && originalSelectionRef.current) {\n // Use the stored original selection to populate the modal\n // This avoids issues where focus shift may collapse the editor selection\n const { from, to } = originalSelectionRef.current;\n const text = editor.state.doc.textBetween(from, to);\n const linkMark = editor.getAttributes('link');\n\n if (linkMark.href) {\n setUrl(linkMark.href);\n setLinkText(text || '');\n } else {\n setLinkText(text || '');\n }\n } else if (!anchorMenu) {\n resetMenu();\n }\n }, [anchorMenu]);\n\n const preventDef = (e: MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n };\n\n const isLinkActive = () => {\n return editor.isActive('link') && editor.isFocused;\n };\n\n const cancelAnchorCreation = useCallback(\n (event?: KeyboardEvent | MouseEvent) => {\n if (\n ((event && 'key' in event && event.key === 'Escape') ||\n event?.type === 'click' ||\n !event) &&\n anchorMenu\n ) {\n if (event && 'key' in event && event.key === 'Escape') {\n event.stopPropagation();\n }\n\n resetMenu();\n buttonRef.current?.focus();\n }\n },\n [anchorMenu, resetMenu]\n );\n\n useEffect(() => {\n const keyCommandListener = (e: KeyboardEvent) => {\n if (e.key === 'k' && (e.metaKey || e.ctrlKey)) {\n e.preventDefault();\n openMenu({ focusInput: true });\n }\n if (e.key === 'Escape') {\n cancelAnchorCreation();\n }\n };\n\n // Get the iframe's window where editor content lives\n const iframeWindow = editor.view.dom.ownerDocument.defaultView;\n\n // Listen on iframe window for keyboard shortcuts (editor content is in iframe)\n iframeWindow?.addEventListener('keydown', keyCommandListener);\n return () => {\n iframeWindow?.removeEventListener('keydown', keyCommandListener);\n };\n }, [editor, cancelAnchorCreation]);\n\n useEscape(cancelAnchorCreation, popoverEl);\n\n useLayoutEffect(() => {\n if (textInputEl && shouldFocusInput) {\n textInputEl.focus();\n setShouldFocusInput(false);\n }\n }, [textInputEl, shouldFocusInput]);\n\n useEffect(() => {\n // These events must be added here so they run before the native event in useArrows (used in the toolbar).\n const onKeyDown = (e: KeyboardEvent) => {\n if (e.key !== 'Escape') {\n e.stopPropagation();\n }\n };\n textInputEl?.addEventListener('keydown', onKeyDown);\n urlInputEl?.addEventListener('keydown', onKeyDown);\n return () => {\n textInputEl?.removeEventListener('keydown', onKeyDown);\n urlInputEl?.removeEventListener('keydown', onKeyDown);\n };\n }, [textInputEl, urlInputEl]);\n\n return (\n <>\n <ToolbarButton\n ref={buttonRef}\n onMouseDown={e => {\n e.preventDefault();\n openMenu();\n }}\n onKeyDown={(e: ReactKeyboardEvent) => {\n if (e.key === 'Enter') {\n e.preventDefault();\n openMenu({ focusInput: true });\n }\n }}\n active={isLinkActive()}\n tooltip={tooltip}\n label={t('rte_link')}\n {...restProps}\n >\n <Icon name='chain' />\n </ToolbarButton>\n <StyledEditPopover\n show={anchorMenu}\n target={buttonRef.current}\n ref={setPopoverEl}\n placement='bottom'\n >\n <CardContent>\n <Form\n as='div'\n actions={\n <>\n <Button variant='secondary' onClick={cancelAnchorCreation} type='button'>\n {t('cancel')}\n </Button>\n <Button\n disabled={!url || !urlMatch}\n name='apply'\n variant='primary'\n onClick={createLink}\n >\n {t('apply')}\n </Button>\n </>\n }\n >\n <Grid container={{ rowGap: 2 }}>\n <Input\n label={t('rte_link_text')}\n value={linkText}\n onClick={preventDef}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n setLinkText(e.target.value);\n }}\n ref={setTextInputEl}\n />\n <Input\n label={t('rte_link_url')}\n value={url}\n onClick={preventDef}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n const urlInput = e.target.value;\n setUrl(urlInput);\n\n if (!urlMatch) {\n try {\n // eslint-disable-next-line no-new\n new URL(\n /^[a-z][a-z0-9+.-]*:/i.test(urlInput) ? urlInput : `https:${urlInput}`\n );\n setUrlMatch(true);\n } catch {\n setUrlMatch(false);\n }\n }\n }}\n onBlur={() => {\n try {\n // eslint-disable-next-line no-new\n new URL(/^[a-z][a-z0-9+.-]*:/i.test(url) ? url : `https:${url}`);\n setUrlMatch(true);\n } catch {\n setUrlMatch(false);\n }\n }}\n info={!urlMatch ? t('rte_invalid_url') : ''}\n status={!urlMatch ? 'error' : undefined}\n ref={setUrlInputEl}\n />\n </Grid>\n </Form>\n </CardContent>\n </StyledEditPopover>\n </>\n );\n};\n\nexport default AnchorButton;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"ImageButton.d.ts","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/ImageButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,cAAc,CAAC;AAa3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAS5D,QAAA,MAAM,WAAW,GAAI,8CAIlB;IAAE,MAAM,EAAE,YAAY,CAAC;IAAC,kBAAkB,EAAE,MAAM,GAAG,KAAK,GAAG,KAAK,CAAA;CAAE,GAAG,YAAY,4CA8NrF,CAAC;AAEF,eAAe,WAAW,CAAC"}
1
+ {"version":3,"file":"ImageButton.d.ts","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/ImageButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,cAAc,CAAC;AAa3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAS5D,QAAA,MAAM,WAAW,GAAI,8CAIlB;IAAE,MAAM,EAAE,YAAY,CAAC;IAAC,kBAAkB,EAAE,MAAM,GAAG,KAAK,GAAG,KAAK,CAAA;CAAE,GAAG,YAAY,4CA+NrF,CAAC;AAEF,eAAe,WAAW,CAAC"}
@@ -57,36 +57,35 @@ const ImageButton = ({ editor, imageInsertionMode, ...restProps }) => {
57
57
  }
58
58
  }
59
59
  else if (selectedAttachmentType === 'link') {
60
- if (url) {
61
- const imageUid = createUID();
62
- // Tiptap API - insert image using the Image extension command
63
- editor
64
- .chain()
65
- .focus()
66
- .setImage({
67
- src: url,
68
- alt: imageLinkTitle || t('rte_broken_image')
69
- })
70
- .updateAttributes('image', { 'data-id': imageUid })
71
- .run();
72
- // Add error handler for broken images if no alt text was provided
73
- if (!imageLinkTitle) {
74
- // Use the editor's document to target the correct iframe
75
- const editorDoc = editor.view.dom.ownerDocument;
76
- requestAnimationFrame(() => {
77
- const imageEl = editorDoc.querySelector(`img[data-id="${imageUid}"]`);
78
- if (imageEl) {
79
- imageEl.onerror = () => {
80
- imageEl.alt = t('rte_broken_image');
81
- };
82
- }
83
- });
84
- }
85
- resetMenu();
86
- }
87
- else {
60
+ if (!url || incorrectUrl) {
88
61
  setIncorrectUrl(true);
62
+ return;
63
+ }
64
+ const imageUid = createUID();
65
+ // Tiptap API - insert image using the Image extension command
66
+ editor
67
+ .chain()
68
+ .focus()
69
+ .setImage({
70
+ src: url,
71
+ alt: imageLinkTitle || t('rte_broken_image')
72
+ })
73
+ .updateAttributes('image', { 'data-id': imageUid })
74
+ .run();
75
+ // Add error handler for broken images if no alt text was provided
76
+ if (!imageLinkTitle) {
77
+ // Use the editor's document to target the correct iframe
78
+ const editorDoc = editor.view.dom.ownerDocument;
79
+ requestAnimationFrame(() => {
80
+ const imageEl = editorDoc.querySelector(`img[data-id="${imageUid}"]`);
81
+ if (imageEl) {
82
+ imageEl.onerror = () => {
83
+ imageEl.alt = t('rte_broken_image');
84
+ };
85
+ }
86
+ });
89
87
  }
88
+ resetMenu();
90
89
  }
91
90
  };
92
91
  const onImageAddCancel = () => {
@@ -1 +1 @@
1
- {"version":3,"file":"ImageButton.js","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/ImageButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useRef, useContext, useEffect } from 'react';\nimport type { KeyboardEvent as ReactKeyboardEvent } from 'react';\nimport type { Editor as TiptapEditor } from '@tiptap/core';\n\nimport {\n createUID,\n FileInput,\n Grid,\n Icon,\n Input,\n RadioButton,\n RadioButtonGroup,\n registerIcon,\n useI18n\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps } from '@pega/cosmos-react-core';\nimport * as pictureIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/picture.icon';\n\nimport ToolbarButton from '../../RichTextEditor/Toolbar/ToolbarButton';\nimport EditorContext from '../Editor.context';\nimport { StyledFormDialog } from '../Editor.styles';\n\nregisterIcon(pictureIcon);\n\nconst ImageButton = ({\n editor,\n imageInsertionMode,\n ...restProps\n}: { editor: TiptapEditor; imageInsertionMode: 'file' | 'url' | 'all' } & ForwardProps) => {\n const t = useI18n();\n const { addImage } = useContext(EditorContext);\n const [showImageDialog, setShowImageDialog] = useState(false);\n const imagebuttonRef = useRef<HTMLElement>(null);\n const imagepopoverRef = useRef(null);\n const [imageTitle, setImageTitle] = useState('');\n const [imageLinkTitle, setImageLinkTitle] = useState('');\n const [selectedAttachmentType, setSelectedAttachmentType] = useState(() => {\n if (imageInsertionMode === 'url') {\n return 'link';\n }\n return 'file';\n });\n const [url, setUrl] = useState('');\n const [tempfile, setTempFile] = useState<File>();\n const [incorrectUrl, setIncorrectUrl] = useState(false);\n const [fileEmpty, setFileEmpty] = useState(false);\n\n useEffect(() => {\n if (imageInsertionMode === 'url') {\n setSelectedAttachmentType('link');\n } else {\n setSelectedAttachmentType('file');\n }\n }, [imageInsertionMode]);\n\n const onImageInputChange = (addedFiles: File[]) => {\n setTempFile(addedFiles[0]);\n setFileEmpty(false);\n };\n\n const resetMenu = () => {\n setUrl('');\n setIncorrectUrl(false);\n setImageLinkTitle('');\n setImageTitle('');\n setTempFile(undefined);\n setSelectedAttachmentType('file');\n setFileEmpty(false);\n setShowImageDialog(false);\n };\n\n const onImageAddSubmit = () => {\n if (selectedAttachmentType === 'file') {\n if (tempfile) {\n addImage(tempfile, undefined, imageTitle);\n resetMenu();\n } else {\n setFileEmpty(true);\n }\n } else if (selectedAttachmentType === 'link') {\n if (url) {\n const imageUid = createUID();\n // Tiptap API - insert image using the Image extension command\n editor\n .chain()\n .focus()\n .setImage({\n src: url,\n alt: imageLinkTitle || t('rte_broken_image')\n })\n .updateAttributes('image', { 'data-id': imageUid })\n .run();\n\n // Add error handler for broken images if no alt text was provided\n if (!imageLinkTitle) {\n // Use the editor's document to target the correct iframe\n const editorDoc = editor.view.dom.ownerDocument;\n requestAnimationFrame(() => {\n const imageEl = editorDoc.querySelector<HTMLImageElement>(`img[data-id=\"${imageUid}\"]`);\n if (imageEl) {\n imageEl.onerror = () => {\n imageEl.alt = t('rte_broken_image');\n };\n }\n });\n }\n resetMenu();\n } else {\n setIncorrectUrl(true);\n }\n }\n };\n\n const onImageAddCancel = () => {\n resetMenu();\n };\n\n return (\n <>\n <ToolbarButton\n ref={imagebuttonRef}\n onClick={() => {\n setShowImageDialog(true);\n }}\n onKeyDown={(e: ReactKeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n setShowImageDialog(true);\n }\n }}\n tooltip={t('rte_image')}\n label={t('rte_image')}\n {...restProps}\n >\n <Icon name='picture' />\n </ToolbarButton>\n {showImageDialog && imagebuttonRef.current && (\n <form>\n <StyledFormDialog\n heading={t('rte_add_image')}\n onSubmit={onImageAddSubmit}\n onCancel={onImageAddCancel}\n onDismiss={() => {\n resetMenu();\n }}\n target={imagebuttonRef.current}\n ref={imagepopoverRef}\n >\n <Grid\n container={{\n gap: 2\n }}\n >\n {imageInsertionMode === 'all' && (\n <Grid container={{ rowGap: 2 }}>\n <RadioButtonGroup\n name='chooseListView'\n label={t('rte_image_source')}\n onChange={e => {\n setSelectedAttachmentType(e.target.value);\n }}\n data-testid='chooseListView'\n inline\n required\n >\n <RadioButton\n id='file'\n label={t('rte_image_file')}\n value='file'\n checked={selectedAttachmentType === 'file'}\n />\n <RadioButton\n id='link'\n label={t('rte_image_link')}\n value='link'\n checked={selectedAttachmentType === 'link'}\n />\n </RadioButtonGroup>\n </Grid>\n )}\n {selectedAttachmentType === 'file' && (\n <Grid container={{ rowGap: 2 }}>\n <FileInput\n multiple={false}\n label={t('rte_image_file')}\n onFilesAdded={onImageInputChange}\n required\n accept='image/*'\n info={fileEmpty ? t('rte_empty_image') : ''}\n status={fileEmpty ? 'error' : undefined}\n files={\n tempfile\n ? [\n {\n name: tempfile.name,\n id: createUID(),\n thumbnail: URL.createObjectURL(tempfile),\n onDelete: () => {\n setTempFile(undefined);\n }\n }\n ]\n : []\n }\n />\n <Input\n label={t('description')}\n value={imageTitle}\n onChange={e => {\n setImageTitle(e.target.value);\n }}\n info={t('rte_image_description_info')}\n />\n </Grid>\n )}\n {selectedAttachmentType === 'link' && (\n <Grid container={{ rowGap: 2 }}>\n <Input\n label={t('rte_image_url')}\n value={url}\n required\n info={incorrectUrl ? t('rte_invalid_url') : ''}\n status={incorrectUrl ? 'error' : undefined}\n onChange={e => {\n const urlInput = e.target.value;\n setUrl(urlInput);\n try {\n const newUrl = new URL(urlInput);\n setIncorrectUrl(!['http:', 'https:'].includes(newUrl.protocol));\n } catch {\n setIncorrectUrl(true);\n }\n }}\n />\n <Input\n label={t('description')}\n value={imageLinkTitle}\n onChange={e => {\n setImageLinkTitle(e.target.value);\n }}\n info={t('rte_image_description_info')}\n />\n </Grid>\n )}\n </Grid>\n </StyledFormDialog>\n </form>\n )}\n </>\n );\n};\n\nexport default ImageButton;\n"]}
1
+ {"version":3,"file":"ImageButton.js","sourceRoot":"","sources":["../../../../src/components/Editor/Toolbar/ImageButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useRef, useContext, useEffect } from 'react';\nimport type { KeyboardEvent as ReactKeyboardEvent } from 'react';\nimport type { Editor as TiptapEditor } from '@tiptap/core';\n\nimport {\n createUID,\n FileInput,\n Grid,\n Icon,\n Input,\n RadioButton,\n RadioButtonGroup,\n registerIcon,\n useI18n\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps } from '@pega/cosmos-react-core';\nimport * as pictureIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/picture.icon';\n\nimport ToolbarButton from '../../RichTextEditor/Toolbar/ToolbarButton';\nimport EditorContext from '../Editor.context';\nimport { StyledFormDialog } from '../Editor.styles';\n\nregisterIcon(pictureIcon);\n\nconst ImageButton = ({\n editor,\n imageInsertionMode,\n ...restProps\n}: { editor: TiptapEditor; imageInsertionMode: 'file' | 'url' | 'all' } & ForwardProps) => {\n const t = useI18n();\n const { addImage } = useContext(EditorContext);\n const [showImageDialog, setShowImageDialog] = useState(false);\n const imagebuttonRef = useRef<HTMLElement>(null);\n const imagepopoverRef = useRef(null);\n const [imageTitle, setImageTitle] = useState('');\n const [imageLinkTitle, setImageLinkTitle] = useState('');\n const [selectedAttachmentType, setSelectedAttachmentType] = useState(() => {\n if (imageInsertionMode === 'url') {\n return 'link';\n }\n return 'file';\n });\n const [url, setUrl] = useState('');\n const [tempfile, setTempFile] = useState<File>();\n const [incorrectUrl, setIncorrectUrl] = useState(false);\n const [fileEmpty, setFileEmpty] = useState(false);\n\n useEffect(() => {\n if (imageInsertionMode === 'url') {\n setSelectedAttachmentType('link');\n } else {\n setSelectedAttachmentType('file');\n }\n }, [imageInsertionMode]);\n\n const onImageInputChange = (addedFiles: File[]) => {\n setTempFile(addedFiles[0]);\n setFileEmpty(false);\n };\n\n const resetMenu = () => {\n setUrl('');\n setIncorrectUrl(false);\n setImageLinkTitle('');\n setImageTitle('');\n setTempFile(undefined);\n setSelectedAttachmentType('file');\n setFileEmpty(false);\n setShowImageDialog(false);\n };\n\n const onImageAddSubmit = () => {\n if (selectedAttachmentType === 'file') {\n if (tempfile) {\n addImage(tempfile, undefined, imageTitle);\n resetMenu();\n } else {\n setFileEmpty(true);\n }\n } else if (selectedAttachmentType === 'link') {\n if (!url || incorrectUrl) {\n setIncorrectUrl(true);\n return;\n }\n\n const imageUid = createUID();\n // Tiptap API - insert image using the Image extension command\n editor\n .chain()\n .focus()\n .setImage({\n src: url,\n alt: imageLinkTitle || t('rte_broken_image')\n })\n .updateAttributes('image', { 'data-id': imageUid })\n .run();\n\n // Add error handler for broken images if no alt text was provided\n if (!imageLinkTitle) {\n // Use the editor's document to target the correct iframe\n const editorDoc = editor.view.dom.ownerDocument;\n requestAnimationFrame(() => {\n const imageEl = editorDoc.querySelector<HTMLImageElement>(`img[data-id=\"${imageUid}\"]`);\n if (imageEl) {\n imageEl.onerror = () => {\n imageEl.alt = t('rte_broken_image');\n };\n }\n });\n }\n resetMenu();\n }\n };\n\n const onImageAddCancel = () => {\n resetMenu();\n };\n\n return (\n <>\n <ToolbarButton\n ref={imagebuttonRef}\n onClick={() => {\n setShowImageDialog(true);\n }}\n onKeyDown={(e: ReactKeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n setShowImageDialog(true);\n }\n }}\n tooltip={t('rte_image')}\n label={t('rte_image')}\n {...restProps}\n >\n <Icon name='picture' />\n </ToolbarButton>\n {showImageDialog && imagebuttonRef.current && (\n <form>\n <StyledFormDialog\n heading={t('rte_add_image')}\n onSubmit={onImageAddSubmit}\n onCancel={onImageAddCancel}\n onDismiss={() => {\n resetMenu();\n }}\n target={imagebuttonRef.current}\n ref={imagepopoverRef}\n >\n <Grid\n container={{\n gap: 2\n }}\n >\n {imageInsertionMode === 'all' && (\n <Grid container={{ rowGap: 2 }}>\n <RadioButtonGroup\n name='chooseListView'\n label={t('rte_image_source')}\n onChange={e => {\n setSelectedAttachmentType(e.target.value);\n }}\n data-testid='chooseListView'\n inline\n required\n >\n <RadioButton\n id='file'\n label={t('rte_image_file')}\n value='file'\n checked={selectedAttachmentType === 'file'}\n />\n <RadioButton\n id='link'\n label={t('rte_image_link')}\n value='link'\n checked={selectedAttachmentType === 'link'}\n />\n </RadioButtonGroup>\n </Grid>\n )}\n {selectedAttachmentType === 'file' && (\n <Grid container={{ rowGap: 2 }}>\n <FileInput\n multiple={false}\n label={t('rte_image_file')}\n onFilesAdded={onImageInputChange}\n required\n accept='image/*'\n info={fileEmpty ? t('rte_empty_image') : ''}\n status={fileEmpty ? 'error' : undefined}\n files={\n tempfile\n ? [\n {\n name: tempfile.name,\n id: createUID(),\n thumbnail: URL.createObjectURL(tempfile),\n onDelete: () => {\n setTempFile(undefined);\n }\n }\n ]\n : []\n }\n />\n <Input\n label={t('description')}\n value={imageTitle}\n onChange={e => {\n setImageTitle(e.target.value);\n }}\n info={t('rte_image_description_info')}\n />\n </Grid>\n )}\n {selectedAttachmentType === 'link' && (\n <Grid container={{ rowGap: 2 }}>\n <Input\n label={t('rte_image_url')}\n value={url}\n required\n info={incorrectUrl ? t('rte_invalid_url') : ''}\n status={incorrectUrl ? 'error' : undefined}\n onChange={e => {\n const urlInput = e.target.value;\n setUrl(urlInput);\n try {\n const newUrl = new URL(urlInput);\n setIncorrectUrl(!['http:', 'https:'].includes(newUrl.protocol));\n } catch {\n setIncorrectUrl(true);\n }\n }}\n />\n <Input\n label={t('description')}\n value={imageLinkTitle}\n onChange={e => {\n setImageLinkTitle(e.target.value);\n }}\n info={t('rte_image_description_info')}\n />\n </Grid>\n )}\n </Grid>\n </StyledFormDialog>\n </form>\n )}\n </>\n );\n};\n\nexport default ImageButton;\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pega/cosmos-react-rte",
3
- "version": "9.0.0-build.29.2",
3
+ "version": "9.0.0-build.29.21",
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.0.0-build.29.2",
18
+ "@pega/cosmos-react-core": "9.0.0-build.29.21",
19
19
  "@popperjs/core": "^2.11.6",
20
20
  "@tiptap/core": "^3.12.1",
21
21
  "@tiptap/extension-blockquote": "^3.12.1",
@@ -39,7 +39,7 @@
39
39
  "slate": "^0.76.1",
40
40
  "slate-history": "^0.66.0",
41
41
  "slate-react": "^0.76.1",
42
- "styled-components": "^6.3.11",
42
+ "styled-components": "~6.3.11",
43
43
  "stylis": "^4.3.6"
44
44
  },
45
45
  "devDependencies": {