@procore/text-editor 0.4.1 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +24 -0
- package/codemod/text-editor-migrate.js +4 -2
- package/dist/DebouncedTextEditor/DebouncedTextEditor.d.ts +3 -0
- package/dist/DebouncedTextEditor/DebouncedTextEditor.js +3 -0
- package/dist/DebouncedTextEditor/DebouncedTextEditor.js.map +1 -1
- package/dist/TextEditor/TextEditor.js +20 -10
- package/dist/TextEditor/TextEditor.js.map +1 -1
- package/dist/TextEditor/TextEditor.styles.d.ts +1 -0
- package/dist/TextEditor/TextEditor.styles.js +7 -4
- package/dist/TextEditor/TextEditor.styles.js.map +1 -1
- package/dist/TextEditor/textEditorTheming/textEditorTheming.styles.js +3 -2
- package/dist/TextEditor/textEditorTheming/textEditorTheming.styles.js.map +1 -1
- package/dist/TextEditor/useCKEditorCss.js +3 -2
- package/dist/TextEditor/useCKEditorCss.js.map +1 -1
- package/dist/TextEditor/useCKEditorFocusScope.d.ts +11 -0
- package/dist/TextEditor/useCKEditorFocusScope.js +35 -0
- package/dist/TextEditor/useCKEditorFocusScope.js.map +1 -0
- package/dist/TextEditor/utils/locale.js +1 -1
- package/dist/TextEditor/utils/locale.js.map +1 -1
- package/dist/TextEditorOutput/TextEditorOutput.js +1 -1
- package/dist/TextEditorOutput/TextEditorOutput.js.map +1 -1
- package/dist/TextEditorOutput/TextEditorOutput.styles.js +2 -2
- package/dist/TextEditorOutput/TextEditorOutput.styles.js.map +1 -1
- package/dist/TextEditorOutput/TextEditorOutput.utils.js +8 -1
- package/dist/TextEditorOutput/TextEditorOutput.utils.js.map +1 -1
- package/dist/_typedoc/TextEditor/TextEditor.types.json +17 -17
- package/dist/_typedoc/TextEditor/TextEditorProvider.types.json +2 -2
- package/dist/_typedoc/TextEditorOutput/TextEditorOutput.types.json +3 -3
- package/dist/utils/debounce.d.ts +4 -1
- package/dist/utils/debounce.js +14 -1
- package/dist/utils/debounce.js.map +1 -1
- package/package.json +8 -8
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,29 @@
|
|
|
1
1
|
# @procore/text-editor
|
|
2
2
|
|
|
3
|
+
## 0.5.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- e81ec86: Debounce the `onChange` callback internally (flushing pending edits on blur) to fix typing and pointer lag caused by expensive work running on every keystroke.
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- 4ff6292: - Fix text overflowing editor and output containers (word-break, overflow-wrap)
|
|
12
|
+
- Prevent showing editor until fully initialized (opacity gate on ready state)
|
|
13
|
+
- Updated dependencies [8da8b1d]
|
|
14
|
+
- Updated dependencies [ce61ed8]
|
|
15
|
+
- @procore/core-react@12.49.1
|
|
16
|
+
|
|
17
|
+
## 0.4.2
|
|
18
|
+
|
|
19
|
+
### Patch Changes
|
|
20
|
+
|
|
21
|
+
- 05247ae: Upgraded CKEditor to the latest version
|
|
22
|
+
- Fix toolbar icons not rendering due to CSS specificity conflicts with CKEditor's internal styles
|
|
23
|
+
- Fix focus trap blocking CKEditor floating UI (dialogs, balloon panels) inside Modals and Tearsheets
|
|
24
|
+
- 05247ae: Improve TextEditor toolbar hover and focus-visible styles
|
|
25
|
+
- Updated dependencies
|
|
26
|
+
|
|
3
27
|
## 0.4.1
|
|
4
28
|
|
|
5
29
|
### Patch Changes
|
|
@@ -857,10 +857,12 @@ ${colors.bold}Examples:${colors.reset}
|
|
|
857
857
|
)
|
|
858
858
|
console.log(` ${colors.info}For libraries:${colors.reset}`)
|
|
859
859
|
console.log(
|
|
860
|
-
` yarn add ckeditor5
|
|
860
|
+
` yarn add ckeditor5@48.1.1 ckeditor5-premium-features@48.1.1 --peer --dev\n`
|
|
861
861
|
)
|
|
862
862
|
console.log(` ${colors.info}For apps:${colors.reset}`)
|
|
863
|
-
console.log(
|
|
863
|
+
console.log(
|
|
864
|
+
` yarn add ckeditor5@48.1.1 ckeditor5-premium-features@48.1.1\n`
|
|
865
|
+
)
|
|
864
866
|
console.log(` After installing, re-run this codemod.\n`)
|
|
865
867
|
console.log(` See README_MIGRATION.md for more details.\n`)
|
|
866
868
|
return
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { TextEditorProps } from '../TextEditor';
|
|
3
3
|
/**
|
|
4
|
+
* @deprecated `DebouncedTextEditor` is deprecated and will be removed in a future version.
|
|
5
|
+
* Use `TextEditor` directly instead — it now debounces `getData()` internally.
|
|
6
|
+
*
|
|
4
7
|
* A performance-optimized version of `TextEditor` with built-in debounce on the `onChange` callback.
|
|
5
8
|
*
|
|
6
9
|
* ## When to use `DebouncedTextEditor`
|
|
@@ -14,6 +14,9 @@ import { debounce } from '../utils/debounce';
|
|
|
14
14
|
var DEBOUNCE_MS = 300;
|
|
15
15
|
|
|
16
16
|
/**
|
|
17
|
+
* @deprecated `DebouncedTextEditor` is deprecated and will be removed in a future version.
|
|
18
|
+
* Use `TextEditor` directly instead — it now debounces `getData()` internally.
|
|
19
|
+
*
|
|
17
20
|
* A performance-optimized version of `TextEditor` with built-in debounce on the `onChange` callback.
|
|
18
21
|
*
|
|
19
22
|
* ## When to use `DebouncedTextEditor`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DebouncedTextEditor.js","names":["React","useCallback","useEffect","useState","TextEditor","debounce","DEBOUNCE_MS","DebouncedTextEditor","_ref","onChange","value","rest","_objectWithoutProperties","_excluded","_useState","_useState2","_slicedToArray","internalValue","setInternalValue","debouncedOnChange","newValue","handleChange","createElement","_extends"],"sources":["../../src/DebouncedTextEditor/DebouncedTextEditor.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react'\nimport type { TextEditorProps } from '../TextEditor'\nimport { TextEditor } from '../TextEditor'\nimport { debounce } from '../utils/debounce'\n\nconst DEBOUNCE_MS = 300\n\n/**\n * A performance-optimized version of `TextEditor` with built-in debounce on the `onChange` callback.\n *\n * ## When to use `DebouncedTextEditor`\n *\n * Use this component when:\n * - The `onChange` handler triggers expensive operations (API calls, complex state updates, re-renders)\n * - You want to reduce the frequency of updates while the user is actively typing\n * - Performance is a concern in forms with multiple rich text editors\n *\n * ## How it works\n *\n * The component waits 300ms after the user stops typing before calling `onChange`.\n * If the user continues typing, the timer resets. This reduces unnecessary updates\n * while maintaining a responsive editing experience.\n *\n * @example\n * ```tsx\n * import { DebouncedTextEditor } from '@procore/text-editor'\n *\n * function MyComponent() {\n * const [value, setValue] = React.useState('')\n *\n * return (\n * <DebouncedTextEditor\n * value={value}\n * onChange={(newValue) => setValue(newValue)}\n * />\n * )\n * }\n * ```\n */\nexport const DebouncedTextEditor = ({\n onChange,\n value,\n ...rest\n}: TextEditorProps) => {\n const [internalValue, setInternalValue] = useState(value ?? '')\n\n const debouncedOnChange = useCallback(\n debounce((newValue: string) => {\n onChange?.(newValue)\n }, DEBOUNCE_MS),\n []\n )\n\n function handleChange(newValue: string) {\n setInternalValue(newValue)\n debouncedOnChange(newValue)\n }\n\n useEffect(() => {\n setInternalValue(value ?? '')\n }, [value])\n\n return <TextEditor {...rest} value={internalValue} onChange={handleChange} />\n}\n"],"mappings":";;;;;;;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAE/D,SAASC,UAAU,QAAQ,eAAe;AAC1C,SAASC,QAAQ,QAAQ,mBAAmB;AAE5C,IAAMC,WAAW,GAAG,GAAG;;AAEvB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,IAAA,EAIT;EAAA,IAHrBC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,KAAK,GAAAF,IAAA,CAALE,KAAK;IACFC,IAAI,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EAEP,IAAAC,SAAA,GAA0CX,QAAQ,CAACO,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAE,CAAC;IAAAK,UAAA,GAAAC,cAAA,CAAAF,SAAA;IAAxDG,aAAa,GAAAF,UAAA;IAAEG,gBAAgB,GAAAH,UAAA;EAEtC,IAAMI,iBAAiB,GAAGlB,WAAW,CACnCI,QAAQ,CAAC,UAACe,QAAgB,EAAK;IAC7BX,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAGW,QAAQ,CAAC;EACtB,CAAC,EAAEd,WAAW,CAAC,EACf,EACF,CAAC;EAED,SAASe,YAAYA,CAACD,QAAgB,EAAE;IACtCF,gBAAgB,CAACE,QAAQ,CAAC;IAC1BD,iBAAiB,CAACC,QAAQ,CAAC;EAC7B;EAEAlB,SAAS,CAAC,YAAM;IACdgB,gBAAgB,CAACR,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAE,CAAC;EAC/B,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEX,oBAAOV,KAAA,CAAAsB,aAAA,CAAClB,UAAU,EAAAmB,QAAA,KAAKZ,IAAI;IAAED,KAAK,EAAEO,aAAc;IAACR,QAAQ,EAAEY;EAAa,EAAE,CAAC;AAC/E,CAAC"}
|
|
1
|
+
{"version":3,"file":"DebouncedTextEditor.js","names":["React","useCallback","useEffect","useState","TextEditor","debounce","DEBOUNCE_MS","DebouncedTextEditor","_ref","onChange","value","rest","_objectWithoutProperties","_excluded","_useState","_useState2","_slicedToArray","internalValue","setInternalValue","debouncedOnChange","newValue","handleChange","createElement","_extends"],"sources":["../../src/DebouncedTextEditor/DebouncedTextEditor.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react'\nimport type { TextEditorProps } from '../TextEditor'\nimport { TextEditor } from '../TextEditor'\nimport { debounce } from '../utils/debounce'\n\nconst DEBOUNCE_MS = 300\n\n/**\n * @deprecated `DebouncedTextEditor` is deprecated and will be removed in a future version.\n * Use `TextEditor` directly instead — it now debounces `getData()` internally.\n *\n * A performance-optimized version of `TextEditor` with built-in debounce on the `onChange` callback.\n *\n * ## When to use `DebouncedTextEditor`\n *\n * Use this component when:\n * - The `onChange` handler triggers expensive operations (API calls, complex state updates, re-renders)\n * - You want to reduce the frequency of updates while the user is actively typing\n * - Performance is a concern in forms with multiple rich text editors\n *\n * ## How it works\n *\n * The component waits 300ms after the user stops typing before calling `onChange`.\n * If the user continues typing, the timer resets. This reduces unnecessary updates\n * while maintaining a responsive editing experience.\n *\n * @example\n * ```tsx\n * import { DebouncedTextEditor } from '@procore/text-editor'\n *\n * function MyComponent() {\n * const [value, setValue] = React.useState('')\n *\n * return (\n * <DebouncedTextEditor\n * value={value}\n * onChange={(newValue) => setValue(newValue)}\n * />\n * )\n * }\n * ```\n */\nexport const DebouncedTextEditor = ({\n onChange,\n value,\n ...rest\n}: TextEditorProps) => {\n const [internalValue, setInternalValue] = useState(value ?? '')\n\n const debouncedOnChange = useCallback(\n debounce((newValue: string) => {\n onChange?.(newValue)\n }, DEBOUNCE_MS),\n []\n )\n\n function handleChange(newValue: string) {\n setInternalValue(newValue)\n debouncedOnChange(newValue)\n }\n\n useEffect(() => {\n setInternalValue(value ?? '')\n }, [value])\n\n return <TextEditor {...rest} value={internalValue} onChange={handleChange} />\n}\n"],"mappings":";;;;;;;;;;AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAE/D,SAASC,UAAU,QAAQ,eAAe;AAC1C,SAASC,QAAQ,QAAQ,mBAAmB;AAE5C,IAAMC,WAAW,GAAG,GAAG;;AAEvB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,IAAA,EAIT;EAAA,IAHrBC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,KAAK,GAAAF,IAAA,CAALE,KAAK;IACFC,IAAI,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EAEP,IAAAC,SAAA,GAA0CX,QAAQ,CAACO,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAE,CAAC;IAAAK,UAAA,GAAAC,cAAA,CAAAF,SAAA;IAAxDG,aAAa,GAAAF,UAAA;IAAEG,gBAAgB,GAAAH,UAAA;EAEtC,IAAMI,iBAAiB,GAAGlB,WAAW,CACnCI,QAAQ,CAAC,UAACe,QAAgB,EAAK;IAC7BX,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAGW,QAAQ,CAAC;EACtB,CAAC,EAAEd,WAAW,CAAC,EACf,EACF,CAAC;EAED,SAASe,YAAYA,CAACD,QAAgB,EAAE;IACtCF,gBAAgB,CAACE,QAAQ,CAAC;IAC1BD,iBAAiB,CAACC,QAAQ,CAAC;EAC7B;EAEAlB,SAAS,CAAC,YAAM;IACdgB,gBAAgB,CAACR,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAE,CAAC;EAC/B,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEX,oBAAOV,KAAA,CAAAsB,aAAA,CAAClB,UAAU,EAAAmB,QAAA,KAAKZ,IAAI;IAAED,KAAK,EAAEO,aAAc;IAACR,QAAQ,EAAEY;EAAa,EAAE,CAAC;AAC/E,CAAC"}
|
|
@@ -13,13 +13,16 @@ import { ClassicEditor } from 'ckeditor5';
|
|
|
13
13
|
import React from 'react';
|
|
14
14
|
import { useI18nContext, useZIndexContext } from '@procore/core-react';
|
|
15
15
|
import { TextEditorOutput } from '../TextEditorOutput';
|
|
16
|
+
import { debounce } from '../utils/debounce';
|
|
16
17
|
import { useStickyToolbar } from './StickyToolbar';
|
|
17
18
|
import { GlobalEditorStyles, StyledTextEditor } from './TextEditor.styles';
|
|
18
19
|
import { TextEditorContext } from './TextEditorProvider';
|
|
19
20
|
import { TextEditorTheme } from './textEditorTheming';
|
|
20
21
|
import { useCKEditorCss } from './useCKEditorCss';
|
|
22
|
+
import { useCKEditorFocusScope } from './useCKEditorFocusScope';
|
|
21
23
|
import { useTabAsNavigation } from './useTabAsNavigation';
|
|
22
24
|
import { addButtonDataAttributes, getDefaultConfig } from './utils';
|
|
25
|
+
var DEBOUNCE_MS = 300;
|
|
23
26
|
|
|
24
27
|
/**
|
|
25
28
|
* To ensure your Jest tests work with the CKEditor implementation, wrap your Jest configuration with `textEditorJestConfig`:
|
|
@@ -79,9 +82,11 @@ export function TextEditor(props) {
|
|
|
79
82
|
var ariaDescription = props['aria-description'];
|
|
80
83
|
var _useCKEditorCss = useCKEditorCss(),
|
|
81
84
|
cssLoading = _useCKEditorCss.isLoading;
|
|
85
|
+
useCKEditorFocusScope();
|
|
82
86
|
var editorRef = React.useRef(null);
|
|
83
87
|
var editorInstanceRef = React.useRef(null);
|
|
84
88
|
var initialValueRef = React.useRef(value || initialValue || '');
|
|
89
|
+
var lastExternalValueRef = React.useRef(value || initialValue || '');
|
|
85
90
|
var keyDownListenerRef = React.useRef(null);
|
|
86
91
|
var _React$useState = React.useState(false),
|
|
87
92
|
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
@@ -96,9 +101,16 @@ export function TextEditor(props) {
|
|
|
96
101
|
var locale = propLocale || contextLocale;
|
|
97
102
|
React.useEffect(function () {
|
|
98
103
|
if (value !== undefined) {
|
|
99
|
-
|
|
104
|
+
lastExternalValueRef.current = value;
|
|
100
105
|
}
|
|
101
106
|
}, [value]);
|
|
107
|
+
React.useEffect(function () {
|
|
108
|
+
var editor = editorInstanceRef.current;
|
|
109
|
+
if (!isEditorReady || !editor || value === undefined) return;
|
|
110
|
+
if (editor.editing.view.document.isFocused) return;
|
|
111
|
+
if (value === editor.getData()) return;
|
|
112
|
+
editor.data.set(value);
|
|
113
|
+
}, [value, isEditorReady]);
|
|
102
114
|
|
|
103
115
|
// Cleanup keydown listener on unmount
|
|
104
116
|
React.useEffect(function () {
|
|
@@ -187,24 +199,20 @@ export function TextEditor(props) {
|
|
|
187
199
|
// Add the keydown listener
|
|
188
200
|
editor.editing.view.document.on('keydown', keyDownListener);
|
|
189
201
|
}, [onKeyDown]);
|
|
190
|
-
var
|
|
202
|
+
var debouncedChange = debounce(function (_event, editor) {
|
|
191
203
|
var data = editor.getData();
|
|
192
|
-
var isDirty = data !==
|
|
193
|
-
|
|
194
|
-
// Call onDirty only on first content modification
|
|
204
|
+
var isDirty = data !== lastExternalValueRef.current.trim();
|
|
195
205
|
if (isDirty && !isDirtyState) {
|
|
196
206
|
setIsDirtyState(true);
|
|
197
207
|
onDirty === null || onDirty === void 0 ? void 0 : onDirty();
|
|
198
208
|
}
|
|
199
209
|
onChange === null || onChange === void 0 ? void 0 : onChange(data, isDirty);
|
|
200
|
-
};
|
|
210
|
+
}, DEBOUNCE_MS);
|
|
211
|
+
var handleChange = debouncedChange;
|
|
201
212
|
var handleReady = function handleReady(editor) {
|
|
202
213
|
addButtonDataAttributes(editor);
|
|
203
214
|
editorInstanceRef.current = editor;
|
|
204
215
|
setIsEditorReady(true);
|
|
205
|
-
if (initialValue) {
|
|
206
|
-
editor.setData(initialValue);
|
|
207
|
-
}
|
|
208
216
|
|
|
209
217
|
// Set aria-label and aria-description on the editable area if provided
|
|
210
218
|
// These provide accessible context to screen reader users
|
|
@@ -225,6 +233,7 @@ export function TextEditor(props) {
|
|
|
225
233
|
onInit === null || onInit === void 0 ? void 0 : onInit(editor);
|
|
226
234
|
};
|
|
227
235
|
var handleBlur = function handleBlur(event, editor) {
|
|
236
|
+
debouncedChange.flush();
|
|
228
237
|
onBlur === null || onBlur === void 0 ? void 0 : onBlur(event, editor);
|
|
229
238
|
};
|
|
230
239
|
useStickyToolbar({
|
|
@@ -254,6 +263,7 @@ export function TextEditor(props) {
|
|
|
254
263
|
ref: editorRef,
|
|
255
264
|
key: editorKey,
|
|
256
265
|
error: error,
|
|
266
|
+
ready: isEditorReady,
|
|
257
267
|
"aria-invalid": error ? 'true' : 'false'
|
|
258
268
|
}, /*#__PURE__*/React.createElement(GlobalEditorStyles, {
|
|
259
269
|
zIndex: zIndex + 1
|
|
@@ -261,7 +271,7 @@ export function TextEditor(props) {
|
|
|
261
271
|
editor: ClassicEditor,
|
|
262
272
|
config: config,
|
|
263
273
|
disabled: disabled,
|
|
264
|
-
data:
|
|
274
|
+
data: initialValueRef.current,
|
|
265
275
|
onChange: handleChange,
|
|
266
276
|
onReady: handleReady,
|
|
267
277
|
onBlur: handleBlur
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextEditor.js","names":["CKEditor","ClassicEditor","React","useI18nContext","useZIndexContext","TextEditorOutput","useStickyToolbar","GlobalEditorStyles","StyledTextEditor","TextEditorContext","TextEditorTheme","useCKEditorCss","useTabAsNavigation","addButtonDataAttributes","getDefaultConfig","TextEditor","props","disabled","error","readonly","value","initialValue","onChange","onInit","onBlur","onKeyDown","propLocale","locale","onDirty","restProps","_objectWithoutProperties","_excluded","ariaLabel","ariaDescription","_useCKEditorCss","cssLoading","isLoading","editorRef","useRef","editorInstanceRef","initialValueRef","keyDownListenerRef","_React$useState","useState","_React$useState2","_slicedToArray","isDirtyState","setIsDirtyState","_React$useState3","_React$useState4","isEditorReady","setIsEditorReady","_useI18nContext","contextLocale","useEffect","undefined","current","editing","view","document","off","editor","change","writer","viewEditableRoot","getRoot","setAttribute","removeAttribute","_useZIndexContext","zIndex","_React$useContext","useContext","features","enableStickyToolbar","stickyToolbar","enableTabAsNavigation","tabAsNavigation","mergedConfig","useMemo","defaultConfig","label","bindKeyDownHandler","useCallback","editorElement","keyDownListener","_event","data","domEvent","key","stopPropagation","on","handleChange","getData","isDirty","handleReady","setData","handleBlur","event","enabled","_useTabAsNavigation","config","editorKey","concat","createElement","ref","_extends","onReady"],"sources":["../../src/TextEditor/TextEditor.tsx"],"sourcesContent":["import { CKEditor } from '@ckeditor/ckeditor5-react'\nimport { ClassicEditor, type EventInfo } from 'ckeditor5'\nimport React from 'react'\n\nimport { useI18nContext, useZIndexContext } from '@procore/core-react'\nimport { TextEditorOutput } from '../TextEditorOutput'\nimport { useStickyToolbar } from './StickyToolbar'\nimport { GlobalEditorStyles, StyledTextEditor } from './TextEditor.styles'\nimport type { KeyDownListener, TextEditorProps } from './TextEditor.types'\nimport { TextEditorContext } from './TextEditorProvider'\nimport { TextEditorTheme } from './textEditorTheming'\nimport { useCKEditorCss } from './useCKEditorCss'\nimport { useTabAsNavigation } from './useTabAsNavigation'\nimport { addButtonDataAttributes, getDefaultConfig } from './utils'\n\n/**\n * To ensure your Jest tests work with the CKEditor implementation, wrap your Jest configuration with `textEditorJestConfig`:\n *\n * @example\n *\n * // Using Jest config file\n *\n * const { textEditorJestConfig } = require('@procore/text-editor/jestConfig')\n *\n * module.exports = textEditorJestConfig({\n * // Your existing Jest config\n * })\n *\n * @example\n *\n * // Using Hammer\n *\n * import { textEditorJestConfig } from '@procore/text-editor/jestConfig'\n *\n * export default {\n * testJest: (defaultConfig) =>\n * textEditorJestConfig({\n * ...defaultConfig,\n * // Your existing Jest config\n * }),\n * }\n *\n * @example\n *\n * // Using Core Scripts\n *\n * const { textEditorJestConfig } = require('@procore/text-editor/jestConfig')\n *\n * module.exports = () => ({\n * jestOverride: (defaultConfig) =>\n * textEditorJestConfig({\n * ...defaultConfig,\n * // Your existing Jest config\n * }),\n * })\n */\nexport function TextEditor(props: Readonly<TextEditorProps>) {\n const {\n disabled,\n error,\n readonly,\n value,\n initialValue,\n onChange,\n onInit,\n onBlur,\n onKeyDown,\n locale: propLocale,\n onDirty,\n ...restProps\n } = props\n const ariaLabel = props['aria-label']\n const ariaDescription = props['aria-description']\n const { isLoading: cssLoading } = useCKEditorCss()\n\n const editorRef = React.useRef<HTMLDivElement>(null)\n const editorInstanceRef = React.useRef<ClassicEditor | null>(null)\n const initialValueRef = React.useRef<string>(value || initialValue || '')\n const keyDownListenerRef = React.useRef<KeyDownListener | null>(null)\n const [isDirtyState, setIsDirtyState] = React.useState(false)\n const [isEditorReady, setIsEditorReady] = React.useState(false)\n const { locale: contextLocale } = useI18nContext()\n const locale = propLocale || contextLocale\n\n React.useEffect(() => {\n if (value !== undefined) {\n initialValueRef.current = value\n }\n }, [value])\n\n // Cleanup keydown listener on unmount\n React.useEffect(() => {\n return () => {\n if (keyDownListenerRef.current && editorInstanceRef.current) {\n editorInstanceRef.current.editing.view.document.off(\n 'keydown',\n keyDownListenerRef.current\n )\n keyDownListenerRef.current = null\n }\n }\n }, [])\n\n // Update aria-label when ariaLabel prop changes\n React.useEffect(() => {\n if (!isEditorReady || !editorInstanceRef.current) {\n return\n }\n\n const editor = editorInstanceRef.current\n editor.editing.view.change((writer) => {\n const viewEditableRoot = editor.editing.view.document.getRoot()\n if (viewEditableRoot) {\n if (ariaLabel) {\n writer.setAttribute('aria-label', ariaLabel, viewEditableRoot)\n } else {\n writer.removeAttribute('aria-label', viewEditableRoot)\n }\n }\n })\n }, [ariaLabel, isEditorReady])\n\n // Update aria-description when ariaDescription prop changes\n React.useEffect(() => {\n if (!isEditorReady || !editorInstanceRef.current) {\n return\n }\n\n const editor = editorInstanceRef.current\n editor.editing.view.change((writer) => {\n const viewEditableRoot = editor.editing.view.document.getRoot()\n if (viewEditableRoot) {\n if (ariaDescription) {\n writer.setAttribute(\n 'aria-description',\n ariaDescription,\n viewEditableRoot\n )\n } else {\n writer.removeAttribute('aria-description', viewEditableRoot)\n }\n }\n })\n }, [ariaDescription, isEditorReady])\n\n const { value: zIndex } = useZIndexContext()\n\n const { features } = React.useContext(TextEditorContext)\n const enableStickyToolbar = !!features?.stickyToolbar\n const enableTabAsNavigation = !!features?.tabAsNavigation\n\n const mergedConfig = React.useMemo(() => {\n const defaultConfig = getDefaultConfig(locale)\n\n // Set accessible label for the editable area if provided\n // This is used by screen readers to announce the editor's purpose\n if (ariaLabel) {\n defaultConfig.label = ariaLabel\n }\n\n return defaultConfig\n }, [ariaLabel, locale])\n\n const bindKeyDownHandler = React.useCallback(\n (editor: ClassicEditor) => {\n const editorElement = editor.editing.view.document.getRoot()\n if (!editorElement) {\n return\n }\n\n // Remove existing keydown listener\n if (keyDownListenerRef.current) {\n editor.editing.view.document.off('keydown', keyDownListenerRef.current)\n }\n\n // Create and store the new listener\n const keyDownListener = (\n _event: EventInfo,\n data: { domEvent: Event }\n ) => {\n const domEvent = data.domEvent as KeyboardEvent\n // Prevent Enter from propagating to parent forms so the\n // editor can handle newlines without accidentally submitting.\n if (domEvent.key === 'Enter') {\n domEvent.stopPropagation()\n }\n\n onKeyDown?.(domEvent, editor)\n }\n\n keyDownListenerRef.current = keyDownListener\n\n // Add the keydown listener\n editor.editing.view.document.on('keydown', keyDownListener)\n },\n [onKeyDown]\n )\n\n const handleChange = (\n _event: EventInfo<string, unknown>,\n editor: ClassicEditor\n ) => {\n const data = editor.getData()\n const isDirty = data !== initialValueRef.current\n\n // Call onDirty only on first content modification\n if (isDirty && !isDirtyState) {\n setIsDirtyState(true)\n onDirty?.()\n }\n\n onChange?.(data, isDirty)\n }\n\n const handleReady = (editor: ClassicEditor) => {\n addButtonDataAttributes(editor)\n editorInstanceRef.current = editor\n setIsEditorReady(true)\n\n if (initialValue) {\n editor.setData(initialValue)\n }\n\n // Set aria-label and aria-description on the editable area if provided\n // These provide accessible context to screen reader users\n editor.editing.view.change((writer) => {\n const viewEditableRoot = editor.editing.view.document.getRoot()\n if (viewEditableRoot) {\n if (ariaLabel) {\n writer.setAttribute('aria-label', ariaLabel, viewEditableRoot)\n }\n if (ariaDescription) {\n writer.setAttribute(\n 'aria-description',\n ariaDescription,\n viewEditableRoot\n )\n }\n }\n })\n\n // Bind keydown handler when editor is ready\n bindKeyDownHandler(editor)\n\n onInit?.(editor)\n }\n\n const handleBlur = (\n event: EventInfo<string, unknown>,\n editor: ClassicEditor\n ) => {\n onBlur?.(event, editor)\n }\n\n useStickyToolbar({\n enabled: enableStickyToolbar,\n editor: isEditorReady ? editorInstanceRef.current : null,\n editorRef,\n cssLoading,\n })\n\n const { config } = useTabAsNavigation({\n config: mergedConfig,\n enabled: enableTabAsNavigation,\n editor: isEditorReady ? editorInstanceRef.current : null,\n })\n\n const editorKey = `${locale}-${enableTabAsNavigation}`\n\n if (cssLoading) {\n return null\n }\n\n if (readonly) {\n return (\n <TextEditorOutput\n value={value}\n aria-label={ariaLabel}\n aria-description={ariaDescription}\n />\n )\n }\n\n return (\n <StyledTextEditor\n ref={editorRef}\n key={editorKey}\n error={error}\n aria-invalid={error ? 'true' : 'false'}\n >\n <GlobalEditorStyles zIndex={zIndex + 1} />\n <TextEditorTheme />\n <CKEditor\n {...restProps}\n editor={ClassicEditor}\n config={config}\n disabled={disabled}\n data={value}\n onChange={handleChange}\n onReady={handleReady}\n onBlur={handleBlur}\n />\n </StyledTextEditor>\n )\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TextEditor.js","names":["CKEditor","ClassicEditor","React","useI18nContext","useZIndexContext","TextEditorOutput","debounce","useStickyToolbar","GlobalEditorStyles","StyledTextEditor","TextEditorContext","TextEditorTheme","useCKEditorCss","useCKEditorFocusScope","useTabAsNavigation","addButtonDataAttributes","getDefaultConfig","DEBOUNCE_MS","TextEditor","props","disabled","error","readonly","value","initialValue","onChange","onInit","onBlur","onKeyDown","propLocale","locale","onDirty","restProps","_objectWithoutProperties","_excluded","ariaLabel","ariaDescription","_useCKEditorCss","cssLoading","isLoading","editorRef","useRef","editorInstanceRef","initialValueRef","lastExternalValueRef","keyDownListenerRef","_React$useState","useState","_React$useState2","_slicedToArray","isDirtyState","setIsDirtyState","_React$useState3","_React$useState4","isEditorReady","setIsEditorReady","_useI18nContext","contextLocale","useEffect","undefined","current","editor","editing","view","document","isFocused","getData","data","set","off","change","writer","viewEditableRoot","getRoot","setAttribute","removeAttribute","_useZIndexContext","zIndex","_React$useContext","useContext","features","enableStickyToolbar","stickyToolbar","enableTabAsNavigation","tabAsNavigation","mergedConfig","useMemo","defaultConfig","label","bindKeyDownHandler","useCallback","editorElement","keyDownListener","_event","domEvent","key","stopPropagation","on","debouncedChange","isDirty","trim","handleChange","handleReady","handleBlur","event","flush","enabled","_useTabAsNavigation","config","editorKey","concat","createElement","ref","ready","_extends","onReady"],"sources":["../../src/TextEditor/TextEditor.tsx"],"sourcesContent":["import { CKEditor } from '@ckeditor/ckeditor5-react'\nimport { ClassicEditor, type EventInfo } from 'ckeditor5'\nimport React from 'react'\n\nimport { useI18nContext, useZIndexContext } from '@procore/core-react'\nimport { TextEditorOutput } from '../TextEditorOutput'\nimport { debounce } from '../utils/debounce'\nimport { useStickyToolbar } from './StickyToolbar'\nimport { GlobalEditorStyles, StyledTextEditor } from './TextEditor.styles'\nimport type { KeyDownListener, TextEditorProps } from './TextEditor.types'\nimport { TextEditorContext } from './TextEditorProvider'\nimport { TextEditorTheme } from './textEditorTheming'\nimport { useCKEditorCss } from './useCKEditorCss'\nimport { useCKEditorFocusScope } from './useCKEditorFocusScope'\nimport { useTabAsNavigation } from './useTabAsNavigation'\nimport { addButtonDataAttributes, getDefaultConfig } from './utils'\n\nconst DEBOUNCE_MS = 300\n\n/**\n * To ensure your Jest tests work with the CKEditor implementation, wrap your Jest configuration with `textEditorJestConfig`:\n *\n * @example\n *\n * // Using Jest config file\n *\n * const { textEditorJestConfig } = require('@procore/text-editor/jestConfig')\n *\n * module.exports = textEditorJestConfig({\n * // Your existing Jest config\n * })\n *\n * @example\n *\n * // Using Hammer\n *\n * import { textEditorJestConfig } from '@procore/text-editor/jestConfig'\n *\n * export default {\n * testJest: (defaultConfig) =>\n * textEditorJestConfig({\n * ...defaultConfig,\n * // Your existing Jest config\n * }),\n * }\n *\n * @example\n *\n * // Using Core Scripts\n *\n * const { textEditorJestConfig } = require('@procore/text-editor/jestConfig')\n *\n * module.exports = () => ({\n * jestOverride: (defaultConfig) =>\n * textEditorJestConfig({\n * ...defaultConfig,\n * // Your existing Jest config\n * }),\n * })\n */\nexport function TextEditor(props: Readonly<TextEditorProps>) {\n const {\n disabled,\n error,\n readonly,\n value,\n initialValue,\n onChange,\n onInit,\n onBlur,\n onKeyDown,\n locale: propLocale,\n onDirty,\n ...restProps\n } = props\n const ariaLabel = props['aria-label']\n const ariaDescription = props['aria-description']\n const { isLoading: cssLoading } = useCKEditorCss()\n useCKEditorFocusScope()\n\n const editorRef = React.useRef<HTMLDivElement>(null)\n const editorInstanceRef = React.useRef<ClassicEditor | null>(null)\n const initialValueRef = React.useRef<string>(value || initialValue || '')\n const lastExternalValueRef = React.useRef<string>(value || initialValue || '')\n const keyDownListenerRef = React.useRef<KeyDownListener | null>(null)\n const [isDirtyState, setIsDirtyState] = React.useState(false)\n const [isEditorReady, setIsEditorReady] = React.useState(false)\n const { locale: contextLocale } = useI18nContext()\n const locale = propLocale || contextLocale\n\n React.useEffect(() => {\n if (value !== undefined) {\n lastExternalValueRef.current = value\n }\n }, [value])\n\n React.useEffect(() => {\n const editor = editorInstanceRef.current\n if (!isEditorReady || !editor || value === undefined) return\n if (editor.editing.view.document.isFocused) return\n if (value === editor.getData()) return\n\n editor.data.set(value)\n }, [value, isEditorReady])\n\n // Cleanup keydown listener on unmount\n React.useEffect(() => {\n return () => {\n if (keyDownListenerRef.current && editorInstanceRef.current) {\n editorInstanceRef.current.editing.view.document.off(\n 'keydown',\n keyDownListenerRef.current\n )\n keyDownListenerRef.current = null\n }\n }\n }, [])\n\n // Update aria-label when ariaLabel prop changes\n React.useEffect(() => {\n if (!isEditorReady || !editorInstanceRef.current) {\n return\n }\n\n const editor = editorInstanceRef.current\n editor.editing.view.change((writer) => {\n const viewEditableRoot = editor.editing.view.document.getRoot()\n if (viewEditableRoot) {\n if (ariaLabel) {\n writer.setAttribute('aria-label', ariaLabel, viewEditableRoot)\n } else {\n writer.removeAttribute('aria-label', viewEditableRoot)\n }\n }\n })\n }, [ariaLabel, isEditorReady])\n\n // Update aria-description when ariaDescription prop changes\n React.useEffect(() => {\n if (!isEditorReady || !editorInstanceRef.current) {\n return\n }\n\n const editor = editorInstanceRef.current\n editor.editing.view.change((writer) => {\n const viewEditableRoot = editor.editing.view.document.getRoot()\n if (viewEditableRoot) {\n if (ariaDescription) {\n writer.setAttribute(\n 'aria-description',\n ariaDescription,\n viewEditableRoot\n )\n } else {\n writer.removeAttribute('aria-description', viewEditableRoot)\n }\n }\n })\n }, [ariaDescription, isEditorReady])\n\n const { value: zIndex } = useZIndexContext()\n\n const { features } = React.useContext(TextEditorContext)\n const enableStickyToolbar = !!features?.stickyToolbar\n const enableTabAsNavigation = !!features?.tabAsNavigation\n\n const mergedConfig = React.useMemo(() => {\n const defaultConfig = getDefaultConfig(locale)\n\n // Set accessible label for the editable area if provided\n // This is used by screen readers to announce the editor's purpose\n if (ariaLabel) {\n defaultConfig.label = ariaLabel\n }\n\n return defaultConfig\n }, [ariaLabel, locale])\n\n const bindKeyDownHandler = React.useCallback(\n (editor: ClassicEditor) => {\n const editorElement = editor.editing.view.document.getRoot()\n if (!editorElement) {\n return\n }\n\n // Remove existing keydown listener\n if (keyDownListenerRef.current) {\n editor.editing.view.document.off('keydown', keyDownListenerRef.current)\n }\n\n // Create and store the new listener\n const keyDownListener = (\n _event: EventInfo,\n data: { domEvent: Event }\n ) => {\n const domEvent = data.domEvent as KeyboardEvent\n // Prevent Enter from propagating to parent forms so the\n // editor can handle newlines without accidentally submitting.\n if (domEvent.key === 'Enter') {\n domEvent.stopPropagation()\n }\n\n onKeyDown?.(domEvent, editor)\n }\n\n keyDownListenerRef.current = keyDownListener\n\n // Add the keydown listener\n editor.editing.view.document.on('keydown', keyDownListener)\n },\n [onKeyDown]\n )\n\n const debouncedChange = debounce(\n (_event: EventInfo<string, unknown>, editor: ClassicEditor) => {\n const data = editor.getData()\n const isDirty = data !== lastExternalValueRef.current.trim()\n\n if (isDirty && !isDirtyState) {\n setIsDirtyState(true)\n onDirty?.()\n }\n\n onChange?.(data, isDirty)\n },\n DEBOUNCE_MS\n )\n\n const handleChange = debouncedChange\n\n const handleReady = (editor: ClassicEditor) => {\n addButtonDataAttributes(editor)\n editorInstanceRef.current = editor\n setIsEditorReady(true)\n\n // Set aria-label and aria-description on the editable area if provided\n // These provide accessible context to screen reader users\n editor.editing.view.change((writer) => {\n const viewEditableRoot = editor.editing.view.document.getRoot()\n if (viewEditableRoot) {\n if (ariaLabel) {\n writer.setAttribute('aria-label', ariaLabel, viewEditableRoot)\n }\n if (ariaDescription) {\n writer.setAttribute(\n 'aria-description',\n ariaDescription,\n viewEditableRoot\n )\n }\n }\n })\n\n // Bind keydown handler when editor is ready\n bindKeyDownHandler(editor)\n\n onInit?.(editor)\n }\n\n const handleBlur = (\n event: EventInfo<string, unknown>,\n editor: ClassicEditor\n ) => {\n debouncedChange.flush()\n onBlur?.(event, editor)\n }\n\n useStickyToolbar({\n enabled: enableStickyToolbar,\n editor: isEditorReady ? editorInstanceRef.current : null,\n editorRef,\n cssLoading,\n })\n\n const { config } = useTabAsNavigation({\n config: mergedConfig,\n enabled: enableTabAsNavigation,\n editor: isEditorReady ? editorInstanceRef.current : null,\n })\n\n const editorKey = `${locale}-${enableTabAsNavigation}`\n\n if (cssLoading) {\n return null\n }\n\n if (readonly) {\n return (\n <TextEditorOutput\n value={value}\n aria-label={ariaLabel}\n aria-description={ariaDescription}\n />\n )\n }\n\n return (\n <StyledTextEditor\n ref={editorRef}\n key={editorKey}\n error={error}\n ready={isEditorReady}\n aria-invalid={error ? 'true' : 'false'}\n >\n <GlobalEditorStyles zIndex={zIndex + 1} />\n <TextEditorTheme />\n <CKEditor\n {...restProps}\n editor={ClassicEditor}\n config={config}\n disabled={disabled}\n data={initialValueRef.current}\n onChange={handleChange}\n onReady={handleReady}\n onBlur={handleBlur}\n />\n </StyledTextEditor>\n )\n}\n"],"mappings":"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"}
|
|
@@ -4,4 +4,5 @@ export declare const GlobalEditorStyles: import("react").NamedExoticComponent<im
|
|
|
4
4
|
}>;
|
|
5
5
|
export declare const StyledTextEditor: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
6
6
|
error?: boolean | undefined;
|
|
7
|
+
ready?: boolean | undefined;
|
|
7
8
|
}>> & string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { colors } from '@procore/core-react';
|
|
2
2
|
import styled, { createGlobalStyle } from 'styled-components';
|
|
3
|
-
export var GlobalEditorStyles = /*#__PURE__*/createGlobalStyle([":root{--ck-z-default:", ";--ck-z-modal:", ";--ck-z-dialog:", ";}.ck-body-wrapper{--ck-z-default:", ";--ck-z-modal:", ";--ck-z-dialog:", ";}.ck-balloon-panel{z-index:", " !important;}.ck-dropdown__panel{z-index:", " !important;}.ck-toolbar__grouped-dropdown .ck-dropdown__panel{z-index:", " !important;}.ck-content{padding:16px 28px !important;--ck-content-font-family:Inter,'Noto Sans JP','Noto Sans KR','Noto Sans SC','Noto Sans TC',sans-serif;--ck-content-font-size:14px
|
|
3
|
+
export var GlobalEditorStyles = /*#__PURE__*/createGlobalStyle([":root{--ck-z-default:", ";--ck-z-modal:", ";--ck-z-dialog:", ";}.ck-body-wrapper{--ck-z-default:", ";--ck-z-modal:", ";--ck-z-dialog:", ";}.ck-balloon-panel{z-index:", " !important;}.ck-dropdown__panel{z-index:", " !important;}.ck.ck-toolbar_grouping{container-type:inline-size;}.ck.ck-toolbar__grouped-dropdown > .ck-dropdown__panel{max-width:100cqw !important;z-index:", " !important;}.ck.ck-toolbar__grouped-dropdown > .ck-dropdown__panel .ck-toolbar__items{flex-wrap:wrap !important;}.ck-content{padding:16px 28px !important;--ck-content-font-family:Inter,'Noto Sans JP','Noto Sans KR','Noto Sans SC','Noto Sans TC',sans-serif;--ck-content-font-size:14px;--ck-content-word-break:break-word;--ck-content-overflow-wrap:break-word;--ck-content-line-height:1.4;p{margin-top:0 !important;margin-bottom:0 !important;}}[data-id=\"modal\"] .ck-sticky-panel__content_sticky{top:var(--modal-header-height,84px) !important;}"], function (_ref) {
|
|
4
4
|
var zIndex = _ref.zIndex;
|
|
5
5
|
return zIndex;
|
|
6
6
|
}, function (_ref2) {
|
|
@@ -30,9 +30,12 @@ export var GlobalEditorStyles = /*#__PURE__*/createGlobalStyle([":root{--ck-z-de
|
|
|
30
30
|
});
|
|
31
31
|
export var StyledTextEditor = /*#__PURE__*/styled.div.withConfig({
|
|
32
32
|
displayName: "StyledTextEditor",
|
|
33
|
-
componentId: "text-editor-
|
|
34
|
-
})(["", ""], function (_ref0) {
|
|
35
|
-
var
|
|
33
|
+
componentId: "text-editor-0_5_0__sc-iim79x-0"
|
|
34
|
+
})([".ck.ck-editor{opacity:", ";}", ""], function (_ref0) {
|
|
35
|
+
var ready = _ref0.ready;
|
|
36
|
+
return ready ? 1 : 0;
|
|
37
|
+
}, function (_ref1) {
|
|
38
|
+
var error = _ref1.error;
|
|
36
39
|
return error && "\n .ck-sticky-panel__content {\n border-top-color: ".concat(colors.red50, " !important;\n border-left-color: ").concat(colors.red50, " !important;\n border-right-color: ").concat(colors.red50, " !important;\n }\n\n .ck-editor__editable {\n border-left-color: ").concat(colors.red50, " !important;\n border-right-color: ").concat(colors.red50, " !important;\n border-bottom-color: ").concat(colors.red50, " !important;\n }\n ");
|
|
37
40
|
});
|
|
38
41
|
//# sourceMappingURL=TextEditor.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextEditor.styles.js","names":["colors","styled","createGlobalStyle","GlobalEditorStyles","_ref","zIndex","_ref2","_ref3","_ref4","_ref5","_ref6","_ref7","_ref8","_ref9","StyledTextEditor","div","withConfig","displayName","componentId","_ref0","error","concat","red50"],"sources":["../../src/TextEditor/TextEditor.styles.ts"],"sourcesContent":["import { colors } from '@procore/core-react'\nimport styled, { createGlobalStyle } from 'styled-components'\n\nexport const GlobalEditorStyles = createGlobalStyle<{\n zIndex: number\n}>`\n :root {\n --ck-z-default: ${({ zIndex }) => zIndex};\n --ck-z-modal: ${({ zIndex }) => zIndex + 999};\n --ck-z-dialog: ${({ zIndex }) => zIndex + 1000};\n }\n \n .ck-body-wrapper {\n --ck-z-default: ${({ zIndex }) => zIndex};\n --ck-z-modal: ${({ zIndex }) => zIndex + 999};\n --ck-z-dialog: ${({ zIndex }) => zIndex + 1000};\n }\n \n .ck-balloon-panel {\n z-index: ${({ zIndex }) => zIndex + 1000} !important;\n }\n\n .ck-dropdown__panel {\n z-index: ${({ zIndex }) => zIndex + 1000} !important;\n }\n\n .ck-toolbar__grouped-dropdown .ck-dropdown__panel {\n z-index: ${({ zIndex }) => zIndex + 1000} !important;\n }\n\n .ck-content {\n padding: 16px 28px !important;\n --ck-content-font-family: Inter, 'Noto Sans JP', 'Noto Sans KR', 'Noto Sans SC', 'Noto Sans TC', sans-serif;\n --ck-content-font-size: 14px;\n line-height: 1.4;\n\n p {\n margin-top: 0 !important;\n margin-bottom: 0 !important;\n }\n }\n\n [data-id=\"modal\"] .ck-sticky-panel__content_sticky {\n top: var(--modal-header-height, 84px) !important;\n }\n`\n\nexport const StyledTextEditor = styled.div<{\n error?: boolean\n}>`\n ${({ error }) =>\n error &&\n `\n .ck-sticky-panel__content {\n border-top-color: ${colors.red50} !important;\n border-left-color: ${colors.red50} !important;\n border-right-color: ${colors.red50} !important;\n }\n\n .ck-editor__editable {\n border-left-color: ${colors.red50} !important;\n border-right-color: ${colors.red50} !important;\n border-bottom-color: ${colors.red50} !important;\n }\n `}\n`\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,qBAAqB;AAC5C,OAAOC,MAAM,IAAIC,iBAAiB,QAAQ,mBAAmB;AAE7D,OAAO,IAAMC,kBAAkB,gBAAGD,iBAAiB,
|
|
1
|
+
{"version":3,"file":"TextEditor.styles.js","names":["colors","styled","createGlobalStyle","GlobalEditorStyles","_ref","zIndex","_ref2","_ref3","_ref4","_ref5","_ref6","_ref7","_ref8","_ref9","StyledTextEditor","div","withConfig","displayName","componentId","_ref0","ready","_ref1","error","concat","red50"],"sources":["../../src/TextEditor/TextEditor.styles.ts"],"sourcesContent":["import { colors } from '@procore/core-react'\nimport styled, { createGlobalStyle } from 'styled-components'\n\nexport const GlobalEditorStyles = createGlobalStyle<{\n zIndex: number\n}>`\n :root {\n --ck-z-default: ${({ zIndex }) => zIndex};\n --ck-z-modal: ${({ zIndex }) => zIndex + 999};\n --ck-z-dialog: ${({ zIndex }) => zIndex + 1000};\n }\n \n .ck-body-wrapper {\n --ck-z-default: ${({ zIndex }) => zIndex};\n --ck-z-modal: ${({ zIndex }) => zIndex + 999};\n --ck-z-dialog: ${({ zIndex }) => zIndex + 1000};\n }\n \n .ck-balloon-panel {\n z-index: ${({ zIndex }) => zIndex + 1000} !important;\n }\n\n .ck-dropdown__panel {\n z-index: ${({ zIndex }) => zIndex + 1000} !important;\n }\n\n .ck.ck-toolbar_grouping {\n container-type: inline-size;\n }\n\n .ck.ck-toolbar__grouped-dropdown > .ck-dropdown__panel {\n max-width: 100cqw !important;\n z-index: ${({ zIndex }) => zIndex + 1000} !important;\n }\n\n .ck.ck-toolbar__grouped-dropdown > .ck-dropdown__panel .ck-toolbar__items {\n flex-wrap: wrap !important;\n }\n\n .ck-content {\n padding: 16px 28px !important;\n --ck-content-font-family: Inter, 'Noto Sans JP', 'Noto Sans KR', 'Noto Sans SC', 'Noto Sans TC', sans-serif;\n --ck-content-font-size: 14px;\n --ck-content-word-break: break-word;\n --ck-content-overflow-wrap: break-word;\n --ck-content-line-height: 1.4;\n\n p {\n margin-top: 0 !important;\n margin-bottom: 0 !important;\n }\n }\n\n [data-id=\"modal\"] .ck-sticky-panel__content_sticky {\n top: var(--modal-header-height, 84px) !important;\n }\n`\n\nexport const StyledTextEditor = styled.div<{\n error?: boolean\n ready?: boolean\n}>`\n .ck.ck-editor {\n opacity: ${({ ready }) => (ready ? 1 : 0)};\n }\n\n ${({ error }) =>\n error &&\n `\n .ck-sticky-panel__content {\n border-top-color: ${colors.red50} !important;\n border-left-color: ${colors.red50} !important;\n border-right-color: ${colors.red50} !important;\n }\n\n .ck-editor__editable {\n border-left-color: ${colors.red50} !important;\n border-right-color: ${colors.red50} !important;\n border-bottom-color: ${colors.red50} !important;\n }\n `}\n`\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,qBAAqB;AAC5C,OAAOC,MAAM,IAAIC,iBAAiB,QAAQ,mBAAmB;AAE7D,OAAO,IAAMC,kBAAkB,gBAAGD,iBAAiB,45BAI7B,UAAAE,IAAA;EAAA,IAAGC,MAAM,GAAAD,IAAA,CAANC,MAAM;EAAA,OAAOA,MAAM;AAAA,GACxB,UAAAC,KAAA;EAAA,IAAGD,MAAM,GAAAC,KAAA,CAAND,MAAM;EAAA,OAAOA,MAAM,GAAG,GAAG;AAAA,GAC3B,UAAAE,KAAA;EAAA,IAAGF,MAAM,GAAAE,KAAA,CAANF,MAAM;EAAA,OAAOA,MAAM,GAAG,IAAI;AAAA,GAI5B,UAAAG,KAAA;EAAA,IAAGH,MAAM,GAAAG,KAAA,CAANH,MAAM;EAAA,OAAOA,MAAM;AAAA,GACxB,UAAAI,KAAA;EAAA,IAAGJ,MAAM,GAAAI,KAAA,CAANJ,MAAM;EAAA,OAAOA,MAAM,GAAG,GAAG;AAAA,GAC3B,UAAAK,KAAA;EAAA,IAAGL,MAAM,GAAAK,KAAA,CAANL,MAAM;EAAA,OAAOA,MAAM,GAAG,IAAI;AAAA,GAInC,UAAAM,KAAA;EAAA,IAAGN,MAAM,GAAAM,KAAA,CAANN,MAAM;EAAA,OAAOA,MAAM,GAAG,IAAI;AAAA,GAI7B,UAAAO,KAAA;EAAA,IAAGP,MAAM,GAAAO,KAAA,CAANP,MAAM;EAAA,OAAOA,MAAM,GAAG,IAAI;AAAA,GAS7B,UAAAQ,KAAA;EAAA,IAAGR,MAAM,GAAAQ,KAAA,CAANR,MAAM;EAAA,OAAOA,MAAM,GAAG,IAAI;AAAA,EAwB3C;AAED,OAAO,IAAMS,gBAAgB,gBAAGb,MAAM,CAACc,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,yCAK3B,UAAAC,KAAA;EAAA,IAAGC,KAAK,GAAAD,KAAA,CAALC,KAAK;EAAA,OAAQA,KAAK,GAAG,CAAC,GAAG,CAAC;AAAA,CAAC,EAGzC,UAAAC,KAAA;EAAA,IAAGC,KAAK,GAAAD,KAAA,CAALC,KAAK;EAAA,OACRA,KAAK,sEAAAC,MAAA,CAGmBvB,MAAM,CAACwB,KAAK,+CAAAD,MAAA,CACXvB,MAAM,CAACwB,KAAK,gDAAAD,MAAA,CACXvB,MAAM,CAACwB,KAAK,wFAAAD,MAAA,CAIbvB,MAAM,CAACwB,KAAK,gDAAAD,MAAA,CACXvB,MAAM,CAACwB,KAAK,iDAAAD,MAAA,CACXvB,MAAM,CAACwB,KAAK,gCAEtC;AAAA,EACJ"}
|
|
@@ -5,7 +5,8 @@ var getIconUrl = function getIconUrl(icon) {
|
|
|
5
5
|
if (icon.startsWith('data:')) {
|
|
6
6
|
return icon;
|
|
7
7
|
}
|
|
8
|
-
|
|
8
|
+
var encoded = encodeURIComponent(icon).replace(/\(/g, '%28').replace(/\)/g, '%29').replace(/'/g, '%27');
|
|
9
|
+
return "data:image/svg+xml;charset=utf-8,".concat(encoded);
|
|
9
10
|
};
|
|
10
|
-
export var TextEditorTheme = /*#__PURE__*/createGlobalStyle([".ck-button:first-child .ck-icon:first-child{background-size:24px;background-repeat:no-repeat;background-position:center;}.ck.ck-input{--ck-color-input-border:", ";--ck-color-input-disabled-border:", ";}.ck-link-form .ck-button-action{font-size:13px !important;line-height:", " !important;background:", " !important;color:", " !important;border-radius:", " !important;font-family:inherit !important;font-weight:600 !important;height:", " !important;justify-content:center !important;align-items:center !important;cursor:pointer !important;&:hover{background:", " !important;}}[data-cke-command=\"bold\"],[data-cke-command=\"italic\"],[data-cke-command=\"underline\"],[data-cke-command=\"strikethrough\"],[data-cke-command=\"alignment:left\"],[data-cke-command=\"alignment:center\"],[data-cke-command=\"alignment:right\"],[data-cke-command=\"bulletedList\"],[data-cke-command=\"numberedList\"],[data-cke-command=\"outdent\"],[data-cke-command=\"indent\"],[data-cke-command=\"cut\"],[data-cke-command=\"paste\"],[data-cke-command=\"pasteAsText\"],[data-cke-command=\"fontSize\"],[data-cke-command=\"fontColor\"],[data-cke-command=\"fontBackgroundColor\"],[data-cke-command=\"link\"],[data-cke-command=\"insertTable\"],[data-cke-command=\"insertImageViaUrl\"],[data-cke-command=\"undo\"],[data-cke-command=\"redo\"]{> .ck-icon:first-child > *,> .ck-button:first-child > .ck-icon:first-child > *,> .ck-splitbutton > .ck-button:first-child > .ck-icon:first-child > *{display:none;}> .ck-icon:first-child,> .ck-splitbutton > .ck-button:first-child .ck-icon:first-child,> .ck-button > .ck-icon:first-child{width:24px !important;height:24px !important;}}[data-cke-command=\"bold\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"italic\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"underline\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"strikethrough\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"alignment:left\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"alignment:center\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"alignment:right\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"bulletedList\"] > .ck-splitbutton > .ck-button:first-child .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"numberedList\"] > .ck-splitbutton > .ck-button:first-child .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"outdent\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"indent\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"cut\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"paste\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"pasteAsText\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"fontSize\"] > .ck-button > .ck-icon:first-child{background-image:url('", "');background-size:19px;}[data-cke-command=\"fontColor\"] > .ck-button > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"fontBackgroundColor\"] > .ck-button > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"link\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"insertTable\"] > .ck-button > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"insertImageViaUrl\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"undo\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"redo\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"fontSize\"] .ck-dropdown__panel{max-width:130px !important;.ck-list__item{min-width:128px !important;}.ck-list{.ck-button{padding:4px 12px !important;font-size:14px !important;line-height:24px !important;.ck-button__label{font-size:14px !important;font-weight:normal !important;font-family:inherit !important;line-height:24px !important;}&[data-cke-tooltip-text]{font-size:14px !important;.ck-button__label{font-size:14px !important;}}&.ck-on{position:relative;padding-right:32px !important;&::after{content:\"\";position:absolute;right:8px;top:50%;transform:translateY(-50%);width:24px !important;height:24px !important;background-image:url('", "');background-size:24px 24px;background-repeat:no-repeat;background-position:center;line-height:1;}}}}.ck-list-item-button__check-holder{display:none !important;}}"], colors.gray50, colors.gray50, spacing.lg, colors.gray90, colors.gray15, spacing.xs, spacing.xl, colors.gray85, getIconUrl(boldIcon), getIconUrl(italicIcon), getIconUrl(underlineIcon), getIconUrl(strikeThroughIcon), getIconUrl(alignLeftIcon), getIconUrl(alignCenterIcon), getIconUrl(alignRightIcon), getIconUrl(unorderedListIcon), getIconUrl(orderedListIcon), getIconUrl(outdentIcon), getIconUrl(indentIcon), getIconUrl(cutIcon), getIconUrl(pasteIcon), getIconUrl(pasteAsTextIcon), getIconUrl(fontSizeIcon), getIconUrl(textColorIcon), getIconUrl(bgColorIcon), getIconUrl(linkIcon), getIconUrl(tableIcon), getIconUrl(imageIcon), getIconUrl(undoIcon), getIconUrl(redoIcon), getIconUrl(checkmarkIcon));
|
|
11
|
+
export var TextEditorTheme = /*#__PURE__*/createGlobalStyle([".ck.ck-toolbar .ck-button,.ck.ck-toolbar .ck-splitbutton .ck-button,.ck.ck-dropdown__panel .ck-button{&:hover{background-color:", ";}&:focus-visible{outline:2px solid ", " !important;outline-offset:-1px;box-shadow:none !important;border-color:transparent !important;}}.ck-button:first-child .ck-icon:first-child{background-size:24px;background-repeat:no-repeat;background-position:center;}.ck.ck-input{--ck-color-input-border:", ";--ck-color-input-disabled-border:", ";}.ck-link-form .ck-button-action{font-size:13px !important;line-height:", " !important;background:", " !important;color:", " !important;border-radius:", " !important;font-family:inherit !important;font-weight:600 !important;height:", " !important;justify-content:center !important;align-items:center !important;cursor:pointer !important;&:hover{background:", " !important;}}[data-cke-command=\"bold\"],[data-cke-command=\"italic\"],[data-cke-command=\"underline\"],[data-cke-command=\"strikethrough\"],[data-cke-command=\"alignment:left\"],[data-cke-command=\"alignment:center\"],[data-cke-command=\"alignment:right\"],[data-cke-command=\"bulletedList\"],[data-cke-command=\"numberedList\"],[data-cke-command=\"outdent\"],[data-cke-command=\"indent\"],[data-cke-command=\"cut\"],[data-cke-command=\"paste\"],[data-cke-command=\"pasteAsText\"],[data-cke-command=\"fontSize\"],[data-cke-command=\"fontColor\"],[data-cke-command=\"fontBackgroundColor\"],[data-cke-command=\"link\"],[data-cke-command=\"insertTable\"],[data-cke-command=\"insertImageViaUrl\"],[data-cke-command=\"undo\"],[data-cke-command=\"redo\"]{> .ck-icon:first-child > *,> .ck-button:first-child > .ck-icon:first-child > *,> .ck-splitbutton > .ck-button:first-child > .ck-icon:first-child > *{display:none;}> .ck-icon:first-child,> .ck-splitbutton > .ck-button:first-child .ck-icon:first-child,> .ck-button > .ck-icon:first-child{width:24px !important;height:24px !important;}}[data-cke-command=\"bold\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"italic\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"underline\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"strikethrough\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"alignment:left\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"alignment:center\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"alignment:right\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"bulletedList\"] > .ck-splitbutton > .ck-button:first-child .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"numberedList\"] > .ck-splitbutton > .ck-button:first-child .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"outdent\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"indent\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"cut\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"paste\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"pasteAsText\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"fontSize\"] > .ck-button > .ck-icon:first-child{background-image:url('", "');background-size:19px;}[data-cke-command=\"fontColor\"] > .ck-button > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"fontBackgroundColor\"] > .ck-button > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"link\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"insertTable\"] > .ck-button > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"insertImageViaUrl\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"undo\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"redo\"] > .ck-icon:first-child{background-image:url('", "');}[data-cke-command=\"fontSize\"] .ck-dropdown__panel{max-width:130px !important;.ck-list__item{min-width:128px !important;}.ck-list{.ck-button{padding:4px 12px !important;font-size:14px !important;line-height:24px !important;.ck-button__label{font-size:14px !important;font-weight:normal !important;font-family:inherit !important;line-height:24px !important;}&[data-cke-tooltip-text]{font-size:14px !important;.ck-button__label{font-size:14px !important;}}&.ck-on{position:relative;padding-right:32px !important;&::after{content:\"\";position:absolute;right:8px;top:50%;transform:translateY(-50%);width:24px !important;height:24px !important;background-image:url('", "');background-size:24px 24px;background-repeat:no-repeat;background-position:center;line-height:1;}}}}.ck-list-item-button__check-holder{display:none !important;}}"], colors.gray90, colors.blue40, colors.gray50, colors.gray50, spacing.lg, colors.gray90, colors.gray15, spacing.xs, spacing.xl, colors.gray85, getIconUrl(boldIcon), getIconUrl(italicIcon), getIconUrl(underlineIcon), getIconUrl(strikeThroughIcon), getIconUrl(alignLeftIcon), getIconUrl(alignCenterIcon), getIconUrl(alignRightIcon), getIconUrl(unorderedListIcon), getIconUrl(orderedListIcon), getIconUrl(outdentIcon), getIconUrl(indentIcon), getIconUrl(cutIcon), getIconUrl(pasteIcon), getIconUrl(pasteAsTextIcon), getIconUrl(fontSizeIcon), getIconUrl(textColorIcon), getIconUrl(bgColorIcon), getIconUrl(linkIcon), getIconUrl(tableIcon), getIconUrl(imageIcon), getIconUrl(undoIcon), getIconUrl(redoIcon), getIconUrl(checkmarkIcon));
|
|
11
12
|
//# sourceMappingURL=textEditorTheming.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textEditorTheming.styles.js","names":["colors","spacing","createGlobalStyle","alignCenterIcon","alignLeftIcon","alignRightIcon","bgColorIcon","boldIcon","checkmarkIcon","cutIcon","fontSizeIcon","imageIcon","indentIcon","italicIcon","linkIcon","orderedListIcon","outdentIcon","pasteAsTextIcon","pasteIcon","redoIcon","strikeThroughIcon","tableIcon","textColorIcon","underlineIcon","undoIcon","unorderedListIcon","getIconUrl","icon","startsWith","concat","encodeURIComponent","TextEditorTheme","gray50","lg","gray90","gray15","xs","xl","gray85"],"sources":["../../../src/TextEditor/textEditorTheming/textEditorTheming.styles.ts"],"sourcesContent":["import { colors, spacing } from '@procore/core-react'\nimport { createGlobalStyle } from 'styled-components'\nimport {\n alignCenterIcon,\n alignLeftIcon,\n alignRightIcon,\n bgColorIcon,\n boldIcon,\n checkmarkIcon,\n cutIcon,\n fontSizeIcon,\n imageIcon,\n indentIcon,\n italicIcon,\n linkIcon,\n orderedListIcon,\n outdentIcon,\n pasteAsTextIcon,\n pasteIcon,\n redoIcon,\n strikeThroughIcon,\n tableIcon,\n textColorIcon,\n underlineIcon,\n undoIcon,\n unorderedListIcon,\n} from './icons'\n\nconst getIconUrl = (icon: string) => {\n if (icon.startsWith('data:')) {\n return icon\n }\n return `data:image/svg+xml;charset=utf-8,${encodeURIComponent(icon)}`\n}\n\nexport const TextEditorTheme = createGlobalStyle`\n .ck-button:first-child .ck-icon:first-child {\n background-size: 24px;\n background-repeat: no-repeat;\n background-position: center;\n }\n\n .ck.ck-input {\n --ck-color-input-border: ${colors.gray50};\n --ck-color-input-disabled-border: ${colors.gray50};\n }\n\n .ck-link-form .ck-button-action {\n font-size: 13px !important;\n line-height: ${spacing.lg} !important;\n background: ${colors.gray90} !important;\n color: ${colors.gray15} !important;\n border-radius: ${spacing.xs} !important;\n font-family: inherit !important;\n font-weight: 600 !important;\n height: ${spacing.xl} !important;\n justify-content: center !important;\n align-items: center !important;\n cursor: pointer !important;\n \n &:hover {\n background: ${colors.gray85} !important;\n }\n }\n \n [data-cke-command=\"bold\"],\n [data-cke-command=\"italic\"],\n [data-cke-command=\"underline\"],\n [data-cke-command=\"strikethrough\"],\n [data-cke-command=\"alignment:left\"],\n [data-cke-command=\"alignment:center\"],\n [data-cke-command=\"alignment:right\"],\n [data-cke-command=\"bulletedList\"],\n [data-cke-command=\"numberedList\"],\n [data-cke-command=\"outdent\"],\n [data-cke-command=\"indent\"],\n [data-cke-command=\"cut\"],\n [data-cke-command=\"paste\"],\n [data-cke-command=\"pasteAsText\"],\n [data-cke-command=\"fontSize\"],\n [data-cke-command=\"fontColor\"],\n [data-cke-command=\"fontBackgroundColor\"],\n [data-cke-command=\"link\"],\n [data-cke-command=\"insertTable\"],\n [data-cke-command=\"insertImageViaUrl\"],\n [data-cke-command=\"undo\"],\n [data-cke-command=\"redo\"] {\n > .ck-icon:first-child > *,\n > .ck-button:first-child > .ck-icon:first-child > *,\n > .ck-splitbutton > .ck-button:first-child > .ck-icon:first-child > * {\n display: none;\n }\n\n > .ck-icon:first-child,\n > .ck-splitbutton > .ck-button:first-child .ck-icon:first-child,\n > .ck-button > .ck-icon:first-child {\n width: 24px !important;\n height: 24px !important;\n }\n }\n\n [data-cke-command=\"bold\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(boldIcon)}');\n }\n\n [data-cke-command=\"italic\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(italicIcon)}');\n }\n\n [data-cke-command=\"underline\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(underlineIcon)}');\n }\n\n [data-cke-command=\"strikethrough\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(strikeThroughIcon)}');\n }\n\n [data-cke-command=\"alignment:left\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(alignLeftIcon)}');\n }\n\n [data-cke-command=\"alignment:center\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(alignCenterIcon)}');\n }\n\n [data-cke-command=\"alignment:right\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(alignRightIcon)}');\n }\n\n [data-cke-command=\"bulletedList\"] > .ck-splitbutton > .ck-button:first-child .ck-icon:first-child {\n background-image: url('${getIconUrl(unorderedListIcon)}');\n }\n\n [data-cke-command=\"numberedList\"] > .ck-splitbutton > .ck-button:first-child .ck-icon:first-child {\n background-image: url('${getIconUrl(orderedListIcon)}');\n }\n\n [data-cke-command=\"outdent\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(outdentIcon)}');\n }\n\n [data-cke-command=\"indent\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(indentIcon)}');\n }\n\n [data-cke-command=\"cut\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(cutIcon)}');\n }\n\n [data-cke-command=\"paste\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(pasteIcon)}');\n }\n\n [data-cke-command=\"pasteAsText\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(pasteAsTextIcon)}');\n }\n\n [data-cke-command=\"fontSize\"] > .ck-button > .ck-icon:first-child {\n background-image: url('${getIconUrl(fontSizeIcon)}');\n background-size: 19px;\n }\n\n [data-cke-command=\"fontColor\"] > .ck-button > .ck-icon:first-child {\n background-image: url('${getIconUrl(textColorIcon)}');\n }\n\n [data-cke-command=\"fontBackgroundColor\"] > .ck-button > .ck-icon:first-child {\n background-image: url('${getIconUrl(bgColorIcon)}');\n }\n [data-cke-command=\"link\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(linkIcon)}');\n }\n\n [data-cke-command=\"insertTable\"] > .ck-button > .ck-icon:first-child {\n background-image: url('${getIconUrl(tableIcon)}');\n }\n\n [data-cke-command=\"insertImageViaUrl\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(imageIcon)}');\n }\n\n [data-cke-command=\"undo\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(undoIcon)}');\n }\n\n [data-cke-command=\"redo\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(redoIcon)}');\n }\n\n [data-cke-command=\"fontSize\"] .ck-dropdown__panel {\n max-width: 130px !important;\n\n .ck-list__item {\n min-width: 128px !important;\n }\n\n .ck-list {\n .ck-button {\n padding: 4px 12px !important;\n font-size: 14px !important;\n line-height: 24px !important;\n\n .ck-button__label {\n font-size: 14px !important;\n font-weight: normal !important;\n font-family: inherit !important;\n line-height: 24px !important;\n }\n\n &[data-cke-tooltip-text] {\n font-size: 14px !important;\n\n .ck-button__label {\n font-size: 14px !important;\n }\n }\n\n &.ck-on {\n position: relative;\n padding-right: 32px !important;\n\n &::after {\n content: \"\";\n position: absolute;\n right: 8px;\n top: 50%;\n transform: translateY(-50%);\n width: 24px !important;\n height: 24px !important;\n background-image: url('${getIconUrl(checkmarkIcon)}');\n background-size: 24px 24px;\n background-repeat: no-repeat;\n background-position: center;\n line-height: 1;\n }\n }\n }\n }\n\n .ck-list-item-button__check-holder {\n display: none !important;\n }\n }\n`\n"],"mappings":"AAAA,SAASA,MAAM,EAAEC,OAAO,QAAQ,qBAAqB;AACrD,SAASC,iBAAiB,QAAQ,mBAAmB;AACrD,SACEC,eAAe,EACfC,aAAa,EACbC,cAAc,EACdC,WAAW,EACXC,QAAQ,EACRC,aAAa,EACbC,OAAO,EACPC,YAAY,EACZC,SAAS,EACTC,UAAU,EACVC,UAAU,EACVC,QAAQ,EACRC,eAAe,EACfC,WAAW,EACXC,eAAe,EACfC,SAAS,EACTC,QAAQ,EACRC,iBAAiB,EACjBC,SAAS,EACTC,aAAa,EACbC,aAAa,EACbC,QAAQ,EACRC,iBAAiB,QACZ,SAAS;AAEhB,IAAMC,UAAU,GAAG,SAAbA,UAAUA,CAAIC,IAAY,EAAK;EACnC,IAAIA,IAAI,CAACC,UAAU,CAAC,OAAO,CAAC,EAAE;IAC5B,OAAOD,IAAI;EACb;EACA,2CAAAE,MAAA,CAA2CC,kBAAkB,CAACH,IAAI,CAAC;AACrE,CAAC;AAED,OAAO,IAAMI,eAAe,gBAAG7B,iBAAiB,47IAQjBF,MAAM,CAACgC,MAAM,EACJhC,MAAM,CAACgC,MAAM,EAKhC/B,OAAO,CAACgC,EAAE,EACXjC,MAAM,CAACkC,MAAM,EAClBlC,MAAM,CAACmC,MAAM,EACLlC,OAAO,CAACmC,EAAE,EAGjBnC,OAAO,CAACoC,EAAE,EAMFrC,MAAM,CAACsC,MAAM,EAyCRZ,UAAU,CAACnB,QAAQ,CAAC,EAIpBmB,UAAU,CAACb,UAAU,CAAC,EAItBa,UAAU,CAACH,aAAa,CAAC,EAIzBG,UAAU,CAACN,iBAAiB,CAAC,EAI7BM,UAAU,CAACtB,aAAa,CAAC,EAIzBsB,UAAU,CAACvB,eAAe,CAAC,EAI3BuB,UAAU,CAACrB,cAAc,CAAC,EAI1BqB,UAAU,CAACD,iBAAiB,CAAC,EAI7BC,UAAU,CAACX,eAAe,CAAC,EAI3BW,UAAU,CAACV,WAAW,CAAC,EAIvBU,UAAU,CAACd,UAAU,CAAC,EAItBc,UAAU,CAACjB,OAAO,CAAC,EAInBiB,UAAU,CAACR,SAAS,CAAC,EAIrBQ,UAAU,CAACT,eAAe,CAAC,EAI3BS,UAAU,CAAChB,YAAY,CAAC,EAKxBgB,UAAU,CAACJ,aAAa,CAAC,EAIzBI,UAAU,CAACpB,WAAW,CAAC,EAGvBoB,UAAU,CAACZ,QAAQ,CAAC,EAIpBY,UAAU,CAACL,SAAS,CAAC,EAIrBK,UAAU,CAACf,SAAS,CAAC,EAIrBe,UAAU,CAACF,QAAQ,CAAC,EAIpBE,UAAU,CAACP,QAAQ,CAAC,EA2CZO,UAAU,CAAClB,aAAa,CAAC,CAc7D"}
|
|
1
|
+
{"version":3,"file":"textEditorTheming.styles.js","names":["colors","spacing","createGlobalStyle","alignCenterIcon","alignLeftIcon","alignRightIcon","bgColorIcon","boldIcon","checkmarkIcon","cutIcon","fontSizeIcon","imageIcon","indentIcon","italicIcon","linkIcon","orderedListIcon","outdentIcon","pasteAsTextIcon","pasteIcon","redoIcon","strikeThroughIcon","tableIcon","textColorIcon","underlineIcon","undoIcon","unorderedListIcon","getIconUrl","icon","startsWith","encoded","encodeURIComponent","replace","concat","TextEditorTheme","gray90","blue40","gray50","lg","gray15","xs","xl","gray85"],"sources":["../../../src/TextEditor/textEditorTheming/textEditorTheming.styles.ts"],"sourcesContent":["import { colors, spacing } from '@procore/core-react'\nimport { createGlobalStyle } from 'styled-components'\nimport {\n alignCenterIcon,\n alignLeftIcon,\n alignRightIcon,\n bgColorIcon,\n boldIcon,\n checkmarkIcon,\n cutIcon,\n fontSizeIcon,\n imageIcon,\n indentIcon,\n italicIcon,\n linkIcon,\n orderedListIcon,\n outdentIcon,\n pasteAsTextIcon,\n pasteIcon,\n redoIcon,\n strikeThroughIcon,\n tableIcon,\n textColorIcon,\n underlineIcon,\n undoIcon,\n unorderedListIcon,\n} from './icons'\n\nconst getIconUrl = (icon: string) => {\n if (icon.startsWith('data:')) {\n return icon\n }\n const encoded = encodeURIComponent(icon)\n .replace(/\\(/g, '%28')\n .replace(/\\)/g, '%29')\n .replace(/'/g, '%27')\n\n return `data:image/svg+xml;charset=utf-8,${encoded}`\n}\n\nexport const TextEditorTheme = createGlobalStyle`\n .ck.ck-toolbar .ck-button,\n .ck.ck-toolbar .ck-splitbutton .ck-button,\n .ck.ck-dropdown__panel .ck-button {\n &:hover {\n background-color: ${colors.gray90};\n }\n\n &:focus-visible {\n outline: 2px solid ${colors.blue40} !important;\n outline-offset: -1px;\n box-shadow: none !important;\n border-color: transparent !important;\n }\n }\n\n .ck-button:first-child .ck-icon:first-child {\n background-size: 24px;\n background-repeat: no-repeat;\n background-position: center;\n }\n\n .ck.ck-input {\n --ck-color-input-border: ${colors.gray50};\n --ck-color-input-disabled-border: ${colors.gray50};\n }\n\n .ck-link-form .ck-button-action {\n font-size: 13px !important;\n line-height: ${spacing.lg} !important;\n background: ${colors.gray90} !important;\n color: ${colors.gray15} !important;\n border-radius: ${spacing.xs} !important;\n font-family: inherit !important;\n font-weight: 600 !important;\n height: ${spacing.xl} !important;\n justify-content: center !important;\n align-items: center !important;\n cursor: pointer !important;\n \n &:hover {\n background: ${colors.gray85} !important;\n }\n }\n \n [data-cke-command=\"bold\"],\n [data-cke-command=\"italic\"],\n [data-cke-command=\"underline\"],\n [data-cke-command=\"strikethrough\"],\n [data-cke-command=\"alignment:left\"],\n [data-cke-command=\"alignment:center\"],\n [data-cke-command=\"alignment:right\"],\n [data-cke-command=\"bulletedList\"],\n [data-cke-command=\"numberedList\"],\n [data-cke-command=\"outdent\"],\n [data-cke-command=\"indent\"],\n [data-cke-command=\"cut\"],\n [data-cke-command=\"paste\"],\n [data-cke-command=\"pasteAsText\"],\n [data-cke-command=\"fontSize\"],\n [data-cke-command=\"fontColor\"],\n [data-cke-command=\"fontBackgroundColor\"],\n [data-cke-command=\"link\"],\n [data-cke-command=\"insertTable\"],\n [data-cke-command=\"insertImageViaUrl\"],\n [data-cke-command=\"undo\"],\n [data-cke-command=\"redo\"] {\n > .ck-icon:first-child > *,\n > .ck-button:first-child > .ck-icon:first-child > *,\n > .ck-splitbutton > .ck-button:first-child > .ck-icon:first-child > * {\n display: none;\n }\n\n > .ck-icon:first-child,\n > .ck-splitbutton > .ck-button:first-child .ck-icon:first-child,\n > .ck-button > .ck-icon:first-child {\n width: 24px !important;\n height: 24px !important;\n }\n }\n\n [data-cke-command=\"bold\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(boldIcon)}');\n }\n\n [data-cke-command=\"italic\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(italicIcon)}');\n }\n\n [data-cke-command=\"underline\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(underlineIcon)}');\n }\n\n [data-cke-command=\"strikethrough\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(strikeThroughIcon)}');\n }\n\n [data-cke-command=\"alignment:left\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(alignLeftIcon)}');\n }\n\n [data-cke-command=\"alignment:center\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(alignCenterIcon)}');\n }\n\n [data-cke-command=\"alignment:right\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(alignRightIcon)}');\n }\n\n [data-cke-command=\"bulletedList\"] > .ck-splitbutton > .ck-button:first-child .ck-icon:first-child {\n background-image: url('${getIconUrl(unorderedListIcon)}');\n }\n\n [data-cke-command=\"numberedList\"] > .ck-splitbutton > .ck-button:first-child .ck-icon:first-child {\n background-image: url('${getIconUrl(orderedListIcon)}');\n }\n\n [data-cke-command=\"outdent\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(outdentIcon)}');\n }\n\n [data-cke-command=\"indent\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(indentIcon)}');\n }\n\n [data-cke-command=\"cut\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(cutIcon)}');\n }\n\n [data-cke-command=\"paste\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(pasteIcon)}');\n }\n\n [data-cke-command=\"pasteAsText\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(pasteAsTextIcon)}');\n }\n\n [data-cke-command=\"fontSize\"] > .ck-button > .ck-icon:first-child {\n background-image: url('${getIconUrl(fontSizeIcon)}');\n background-size: 19px;\n }\n\n [data-cke-command=\"fontColor\"] > .ck-button > .ck-icon:first-child {\n background-image: url('${getIconUrl(textColorIcon)}');\n }\n\n [data-cke-command=\"fontBackgroundColor\"] > .ck-button > .ck-icon:first-child {\n background-image: url('${getIconUrl(bgColorIcon)}');\n }\n [data-cke-command=\"link\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(linkIcon)}');\n }\n\n [data-cke-command=\"insertTable\"] > .ck-button > .ck-icon:first-child {\n background-image: url('${getIconUrl(tableIcon)}');\n }\n\n [data-cke-command=\"insertImageViaUrl\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(imageIcon)}');\n }\n\n [data-cke-command=\"undo\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(undoIcon)}');\n }\n\n [data-cke-command=\"redo\"] > .ck-icon:first-child {\n background-image: url('${getIconUrl(redoIcon)}');\n }\n\n [data-cke-command=\"fontSize\"] .ck-dropdown__panel {\n max-width: 130px !important;\n\n .ck-list__item {\n min-width: 128px !important;\n }\n\n .ck-list {\n .ck-button {\n padding: 4px 12px !important;\n font-size: 14px !important;\n line-height: 24px !important;\n\n .ck-button__label {\n font-size: 14px !important;\n font-weight: normal !important;\n font-family: inherit !important;\n line-height: 24px !important;\n }\n\n &[data-cke-tooltip-text] {\n font-size: 14px !important;\n\n .ck-button__label {\n font-size: 14px !important;\n }\n }\n\n &.ck-on {\n position: relative;\n padding-right: 32px !important;\n\n &::after {\n content: \"\";\n position: absolute;\n right: 8px;\n top: 50%;\n transform: translateY(-50%);\n width: 24px !important;\n height: 24px !important;\n background-image: url('${getIconUrl(checkmarkIcon)}');\n background-size: 24px 24px;\n background-repeat: no-repeat;\n background-position: center;\n line-height: 1;\n }\n }\n }\n }\n\n .ck-list-item-button__check-holder {\n display: none !important;\n }\n }\n`\n"],"mappings":"AAAA,SAASA,MAAM,EAAEC,OAAO,QAAQ,qBAAqB;AACrD,SAASC,iBAAiB,QAAQ,mBAAmB;AACrD,SACEC,eAAe,EACfC,aAAa,EACbC,cAAc,EACdC,WAAW,EACXC,QAAQ,EACRC,aAAa,EACbC,OAAO,EACPC,YAAY,EACZC,SAAS,EACTC,UAAU,EACVC,UAAU,EACVC,QAAQ,EACRC,eAAe,EACfC,WAAW,EACXC,eAAe,EACfC,SAAS,EACTC,QAAQ,EACRC,iBAAiB,EACjBC,SAAS,EACTC,aAAa,EACbC,aAAa,EACbC,QAAQ,EACRC,iBAAiB,QACZ,SAAS;AAEhB,IAAMC,UAAU,GAAG,SAAbA,UAAUA,CAAIC,IAAY,EAAK;EACnC,IAAIA,IAAI,CAACC,UAAU,CAAC,OAAO,CAAC,EAAE;IAC5B,OAAOD,IAAI;EACb;EACA,IAAME,OAAO,GAAGC,kBAAkB,CAACH,IAAI,CAAC,CACrCI,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC,CACrBA,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC,CACrBA,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC;EAEvB,2CAAAC,MAAA,CAA2CH,OAAO;AACpD,CAAC;AAED,OAAO,IAAMI,eAAe,gBAAG/B,iBAAiB,wsJAKtBF,MAAM,CAACkC,MAAM,EAIZlC,MAAM,CAACmC,MAAM,EAcTnC,MAAM,CAACoC,MAAM,EACJpC,MAAM,CAACoC,MAAM,EAKhCnC,OAAO,CAACoC,EAAE,EACXrC,MAAM,CAACkC,MAAM,EAClBlC,MAAM,CAACsC,MAAM,EACLrC,OAAO,CAACsC,EAAE,EAGjBtC,OAAO,CAACuC,EAAE,EAMFxC,MAAM,CAACyC,MAAM,EAyCRf,UAAU,CAACnB,QAAQ,CAAC,EAIpBmB,UAAU,CAACb,UAAU,CAAC,EAItBa,UAAU,CAACH,aAAa,CAAC,EAIzBG,UAAU,CAACN,iBAAiB,CAAC,EAI7BM,UAAU,CAACtB,aAAa,CAAC,EAIzBsB,UAAU,CAACvB,eAAe,CAAC,EAI3BuB,UAAU,CAACrB,cAAc,CAAC,EAI1BqB,UAAU,CAACD,iBAAiB,CAAC,EAI7BC,UAAU,CAACX,eAAe,CAAC,EAI3BW,UAAU,CAACV,WAAW,CAAC,EAIvBU,UAAU,CAACd,UAAU,CAAC,EAItBc,UAAU,CAACjB,OAAO,CAAC,EAInBiB,UAAU,CAACR,SAAS,CAAC,EAIrBQ,UAAU,CAACT,eAAe,CAAC,EAI3BS,UAAU,CAAChB,YAAY,CAAC,EAKxBgB,UAAU,CAACJ,aAAa,CAAC,EAIzBI,UAAU,CAACpB,WAAW,CAAC,EAGvBoB,UAAU,CAACZ,QAAQ,CAAC,EAIpBY,UAAU,CAACL,SAAS,CAAC,EAIrBK,UAAU,CAACf,SAAS,CAAC,EAIrBe,UAAU,CAACF,QAAQ,CAAC,EAIpBE,UAAU,CAACP,QAAQ,CAAC,EA2CZO,UAAU,CAAClB,aAAa,CAAC,CAc7D"}
|
|
@@ -4,11 +4,12 @@ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r)
|
|
|
4
4
|
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
5
5
|
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
6
6
|
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
7
|
+
import { version as ckeditorVersion } from 'ckeditor5';
|
|
7
8
|
import { useEffect, useState } from 'react';
|
|
8
9
|
var CKEDITOR_CSS_ID = 'ckeditor-styles';
|
|
9
|
-
var CKEDITOR_CSS_URL =
|
|
10
|
+
var CKEDITOR_CSS_URL = "https://cdn.ckeditor.com/ckeditor5/".concat(ckeditorVersion, "/ckeditor5.css");
|
|
10
11
|
var PREMIUM_FEATURE_CSS_ID = 'ckeditor-premium-styles';
|
|
11
|
-
var CKEDITOR_CSS_PREMIUM_FEATURE_URL =
|
|
12
|
+
var CKEDITOR_CSS_PREMIUM_FEATURE_URL = "https://cdn.ckeditor.com/ckeditor5-premium-features/".concat(ckeditorVersion, "/ckeditor5-premium-features.css");
|
|
12
13
|
export var useCKEditorCss = function useCKEditorCss() {
|
|
13
14
|
var _useState = useState(true),
|
|
14
15
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCKEditorCss.js","names":["useEffect","useState","CKEDITOR_CSS_ID","CKEDITOR_CSS_URL","PREMIUM_FEATURE_CSS_ID","CKEDITOR_CSS_PREMIUM_FEATURE_URL","useCKEditorCss","_useState","_useState2","_slicedToArray","isLoading","setIsLoading","document","getElementById","link","createElement","id","href","rel","premiumFeatureLink","onload","onerror","head","appendChild"],"sources":["../../src/TextEditor/useCKEditorCss.ts"],"sourcesContent":["import { useEffect, useState } from 'react'\n\nconst CKEDITOR_CSS_ID = 'ckeditor-styles'\nconst CKEDITOR_CSS_URL
|
|
1
|
+
{"version":3,"file":"useCKEditorCss.js","names":["version","ckeditorVersion","useEffect","useState","CKEDITOR_CSS_ID","CKEDITOR_CSS_URL","concat","PREMIUM_FEATURE_CSS_ID","CKEDITOR_CSS_PREMIUM_FEATURE_URL","useCKEditorCss","_useState","_useState2","_slicedToArray","isLoading","setIsLoading","document","getElementById","link","createElement","id","href","rel","premiumFeatureLink","onload","onerror","head","appendChild"],"sources":["../../src/TextEditor/useCKEditorCss.ts"],"sourcesContent":["import { version as ckeditorVersion } from 'ckeditor5'\nimport { useEffect, useState } from 'react'\n\nconst CKEDITOR_CSS_ID = 'ckeditor-styles'\nconst CKEDITOR_CSS_URL = `https://cdn.ckeditor.com/ckeditor5/${ckeditorVersion}/ckeditor5.css`\n\nconst PREMIUM_FEATURE_CSS_ID = 'ckeditor-premium-styles'\nconst CKEDITOR_CSS_PREMIUM_FEATURE_URL = `https://cdn.ckeditor.com/ckeditor5-premium-features/${ckeditorVersion}/ckeditor5-premium-features.css`\n\nexport const useCKEditorCss = () => {\n const [isLoading, setIsLoading] = useState(true)\n\n useEffect(() => {\n if (document.getElementById(CKEDITOR_CSS_ID)) {\n setIsLoading(false)\n return\n }\n\n const link = document.createElement('link')\n link.id = CKEDITOR_CSS_ID\n link.href = CKEDITOR_CSS_URL\n link.rel = 'stylesheet'\n\n const premiumFeatureLink = document.createElement('link')\n premiumFeatureLink.id = PREMIUM_FEATURE_CSS_ID\n premiumFeatureLink.href = CKEDITOR_CSS_PREMIUM_FEATURE_URL\n premiumFeatureLink.rel = 'stylesheet'\n\n link.onload = () => {\n setIsLoading(false)\n }\n\n link.onerror = () => {\n setIsLoading(false)\n }\n\n document.head.appendChild(link)\n document.head.appendChild(premiumFeatureLink)\n }, [])\n\n return { isLoading }\n}\n"],"mappings":";;;;;;AAAA,SAASA,OAAO,IAAIC,eAAe,QAAQ,WAAW;AACtD,SAASC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAE3C,IAAMC,eAAe,GAAG,iBAAiB;AACzC,IAAMC,gBAAgB,yCAAAC,MAAA,CAAyCL,eAAe,mBAAgB;AAE9F,IAAMM,sBAAsB,GAAG,yBAAyB;AACxD,IAAMC,gCAAgC,0DAAAF,MAAA,CAA0DL,eAAe,oCAAiC;AAEhJ,OAAO,IAAMQ,cAAc,GAAG,SAAjBA,cAAcA,CAAA,EAAS;EAClC,IAAAC,SAAA,GAAkCP,QAAQ,CAAC,IAAI,CAAC;IAAAQ,UAAA,GAAAC,cAAA,CAAAF,SAAA;IAAzCG,SAAS,GAAAF,UAAA;IAAEG,YAAY,GAAAH,UAAA;EAE9BT,SAAS,CAAC,YAAM;IACd,IAAIa,QAAQ,CAACC,cAAc,CAACZ,eAAe,CAAC,EAAE;MAC5CU,YAAY,CAAC,KAAK,CAAC;MACnB;IACF;IAEA,IAAMG,IAAI,GAAGF,QAAQ,CAACG,aAAa,CAAC,MAAM,CAAC;IAC3CD,IAAI,CAACE,EAAE,GAAGf,eAAe;IACzBa,IAAI,CAACG,IAAI,GAAGf,gBAAgB;IAC5BY,IAAI,CAACI,GAAG,GAAG,YAAY;IAEvB,IAAMC,kBAAkB,GAAGP,QAAQ,CAACG,aAAa,CAAC,MAAM,CAAC;IACzDI,kBAAkB,CAACH,EAAE,GAAGZ,sBAAsB;IAC9Ce,kBAAkB,CAACF,IAAI,GAAGZ,gCAAgC;IAC1Dc,kBAAkB,CAACD,GAAG,GAAG,YAAY;IAErCJ,IAAI,CAACM,MAAM,GAAG,YAAM;MAClBT,YAAY,CAAC,KAAK,CAAC;IACrB,CAAC;IAEDG,IAAI,CAACO,OAAO,GAAG,YAAM;MACnBV,YAAY,CAAC,KAAK,CAAC;IACrB,CAAC;IAEDC,QAAQ,CAACU,IAAI,CAACC,WAAW,CAACT,IAAI,CAAC;IAC/BF,QAAQ,CAACU,IAAI,CAACC,WAAW,CAACJ,kBAAkB,CAAC;EAC/C,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO;IAAET,SAAS,EAATA;EAAU,CAAC;AACtB,CAAC"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* When TextEditor is inside a Modal or Tearsheet, React Aria's FocusScope
|
|
3
|
+
* traps focus within the dialog. CKEditor renders floating UI (link dialogs,
|
|
4
|
+
* table pickers, color pickers) into a portal outside the Modal DOM tree,
|
|
5
|
+
* so focus cannot reach them. This hook dynamically disables focus containment
|
|
6
|
+
* while a CKEditor floating element is visible and re-enables it when closed.
|
|
7
|
+
*
|
|
8
|
+
* Safe to call outside Modal/Tearsheet — the context defaults to a no-op
|
|
9
|
+
* setProps (see FocusScopeOverride.tsx), so this hook silently does nothing.
|
|
10
|
+
*/
|
|
11
|
+
export declare function useCKEditorFocusScope(): void;
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { UNSAFE_useOverridableFocusScope } from '@procore/core-react';
|
|
2
|
+
import { useEffect } from 'react';
|
|
3
|
+
var isCKEditorFloatingUIOpen = function isCKEditorFloatingUIOpen() {
|
|
4
|
+
return !!document.querySelector('.ck-dialog-overlay, .ck-balloon-panel_visible');
|
|
5
|
+
};
|
|
6
|
+
|
|
7
|
+
/**
|
|
8
|
+
* When TextEditor is inside a Modal or Tearsheet, React Aria's FocusScope
|
|
9
|
+
* traps focus within the dialog. CKEditor renders floating UI (link dialogs,
|
|
10
|
+
* table pickers, color pickers) into a portal outside the Modal DOM tree,
|
|
11
|
+
* so focus cannot reach them. This hook dynamically disables focus containment
|
|
12
|
+
* while a CKEditor floating element is visible and re-enables it when closed.
|
|
13
|
+
*
|
|
14
|
+
* Safe to call outside Modal/Tearsheet — the context defaults to a no-op
|
|
15
|
+
* setProps (see FocusScopeOverride.tsx), so this hook silently does nothing.
|
|
16
|
+
*/
|
|
17
|
+
export function useCKEditorFocusScope() {
|
|
18
|
+
var _UNSAFE_useOverridabl = UNSAFE_useOverridableFocusScope(),
|
|
19
|
+
setProps = _UNSAFE_useOverridabl.setProps;
|
|
20
|
+
useEffect(function () {
|
|
21
|
+
var observer = new MutationObserver(function () {
|
|
22
|
+
setProps({
|
|
23
|
+
contain: !isCKEditorFloatingUIOpen()
|
|
24
|
+
});
|
|
25
|
+
});
|
|
26
|
+
observer.observe(document.body, {
|
|
27
|
+
childList: true,
|
|
28
|
+
subtree: true
|
|
29
|
+
});
|
|
30
|
+
return function () {
|
|
31
|
+
return observer.disconnect();
|
|
32
|
+
};
|
|
33
|
+
}, [setProps]);
|
|
34
|
+
}
|
|
35
|
+
//# sourceMappingURL=useCKEditorFocusScope.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useCKEditorFocusScope.js","names":["UNSAFE_useOverridableFocusScope","useEffect","isCKEditorFloatingUIOpen","document","querySelector","useCKEditorFocusScope","_UNSAFE_useOverridabl","setProps","observer","MutationObserver","contain","observe","body","childList","subtree","disconnect"],"sources":["../../src/TextEditor/useCKEditorFocusScope.ts"],"sourcesContent":["import { UNSAFE_useOverridableFocusScope } from '@procore/core-react'\nimport { useEffect } from 'react'\n\nconst isCKEditorFloatingUIOpen = () =>\n !!document.querySelector('.ck-dialog-overlay, .ck-balloon-panel_visible')\n\n/**\n * When TextEditor is inside a Modal or Tearsheet, React Aria's FocusScope\n * traps focus within the dialog. CKEditor renders floating UI (link dialogs,\n * table pickers, color pickers) into a portal outside the Modal DOM tree,\n * so focus cannot reach them. This hook dynamically disables focus containment\n * while a CKEditor floating element is visible and re-enables it when closed.\n *\n * Safe to call outside Modal/Tearsheet — the context defaults to a no-op\n * setProps (see FocusScopeOverride.tsx), so this hook silently does nothing.\n */\nexport function useCKEditorFocusScope() {\n const { setProps } = UNSAFE_useOverridableFocusScope()\n\n useEffect(() => {\n const observer = new MutationObserver(() => {\n setProps({ contain: !isCKEditorFloatingUIOpen() })\n })\n\n observer.observe(document.body, {\n childList: true,\n subtree: true,\n })\n\n return () => observer.disconnect()\n }, [setProps])\n}\n"],"mappings":"AAAA,SAASA,+BAA+B,QAAQ,qBAAqB;AACrE,SAASC,SAAS,QAAQ,OAAO;AAEjC,IAAMC,wBAAwB,GAAG,SAA3BA,wBAAwBA,CAAA;EAAA,OAC5B,CAAC,CAACC,QAAQ,CAACC,aAAa,CAAC,+CAA+C,CAAC;AAAA;;AAE3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,qBAAqBA,CAAA,EAAG;EACtC,IAAAC,qBAAA,GAAqBN,+BAA+B,CAAC,CAAC;IAA9CO,QAAQ,GAAAD,qBAAA,CAARC,QAAQ;EAEhBN,SAAS,CAAC,YAAM;IACd,IAAMO,QAAQ,GAAG,IAAIC,gBAAgB,CAAC,YAAM;MAC1CF,QAAQ,CAAC;QAAEG,OAAO,EAAE,CAACR,wBAAwB,CAAC;MAAE,CAAC,CAAC;IACpD,CAAC,CAAC;IAEFM,QAAQ,CAACG,OAAO,CAACR,QAAQ,CAACS,IAAI,EAAE;MAC9BC,SAAS,EAAE,IAAI;MACfC,OAAO,EAAE;IACX,CAAC,CAAC;IAEF,OAAO;MAAA,OAAMN,QAAQ,CAACO,UAAU,CAAC,CAAC;IAAA;EACpC,CAAC,EAAE,CAACR,QAAQ,CAAC,CAAC;AAChB"}
|
|
@@ -16,7 +16,7 @@ import pt from 'ckeditor5/translations/pt.js';
|
|
|
16
16
|
import th from 'ckeditor5/translations/th.js';
|
|
17
17
|
// @ts-expect-error: Translation files are not typed in the ckeditor5 package.
|
|
18
18
|
import zh from 'ckeditor5/translations/zh.js';
|
|
19
|
-
import { add } from '@ckeditor/ckeditor5-utils
|
|
19
|
+
import { add } from '@ckeditor/ckeditor5-utils';
|
|
20
20
|
var editorLocaleMap = {
|
|
21
21
|
en: 'en',
|
|
22
22
|
'en-CA': 'en',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"locale.js","names":["de","en","es","fr","ja","pl","pt","th","zh","add","editorLocaleMap","editorTranslations","Cut","Paste","PasteAsText","getValidEditorLocale","locale","getEditorTranslation","editorLocale"],"sources":["../../../src/TextEditor/utils/locale.ts"],"sourcesContent":["import type { Translations } from 'ckeditor5'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport de from 'ckeditor5/translations/de.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport en from 'ckeditor5/translations/en.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport es from 'ckeditor5/translations/es.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport fr from 'ckeditor5/translations/fr.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport ja from 'ckeditor5/translations/ja.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport pl from 'ckeditor5/translations/pl.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport pt from 'ckeditor5/translations/pt.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport th from 'ckeditor5/translations/th.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport zh from 'ckeditor5/translations/zh.js'\n\nimport { add } from '@ckeditor/ckeditor5-utils
|
|
1
|
+
{"version":3,"file":"locale.js","names":["de","en","es","fr","ja","pl","pt","th","zh","add","editorLocaleMap","editorTranslations","Cut","Paste","PasteAsText","getValidEditorLocale","locale","getEditorTranslation","editorLocale"],"sources":["../../../src/TextEditor/utils/locale.ts"],"sourcesContent":["import type { Translations } from 'ckeditor5'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport de from 'ckeditor5/translations/de.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport en from 'ckeditor5/translations/en.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport es from 'ckeditor5/translations/es.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport fr from 'ckeditor5/translations/fr.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport ja from 'ckeditor5/translations/ja.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport pl from 'ckeditor5/translations/pl.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport pt from 'ckeditor5/translations/pt.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport th from 'ckeditor5/translations/th.js'\n// @ts-expect-error: Translation files are not typed in the ckeditor5 package.\nimport zh from 'ckeditor5/translations/zh.js'\n\nimport { add } from '@ckeditor/ckeditor5-utils'\n\nconst editorLocaleMap: Record<string, string> = {\n en: 'en',\n 'en-CA': 'en',\n 'fr-CA': 'fr',\n 'fr-FR': 'fr',\n es: 'es',\n 'es-ES': 'es',\n 'en-AE': 'en',\n 'en-AU': 'en',\n 'en-GB': 'en',\n 'en-SG': 'en',\n 'th-TH': 'th',\n 'ja-JP': 'ja',\n 'pt-BR': 'pt',\n 'is-IS': 'en',\n 'de-DE': 'de',\n 'zh-SG': 'zh',\n 'pl-PL': 'pl',\n}\n\nconst editorTranslations: Record<string, Translations> = {\n en,\n fr,\n es,\n de,\n ja,\n pl,\n pt,\n th,\n zh,\n}\n\nadd('en', {\n Cut: 'Cut',\n Paste: 'Paste',\n PasteAsText: 'Paste as Text',\n})\nadd('fr', {\n Cut: 'Couper',\n Paste: 'Coller',\n PasteAsText: 'Coller comme texte',\n})\nadd('ja', {\n Cut: 'カット',\n Paste: '貼り付け',\n PasteAsText: 'テキストとして貼り付け',\n})\nadd('es', {\n Cut: 'Cortar',\n Paste: 'Pegar',\n PasteAsText: 'Pegar como texto',\n})\nadd('de', {\n Cut: 'Ausschneiden',\n Paste: 'Einfügen',\n PasteAsText: 'Als Text einfügen',\n})\nadd('pt', {\n Cut: 'Recortar',\n Paste: 'Colar',\n PasteAsText: 'Colar como texto',\n})\nadd('zh', {\n Cut: '剪切',\n Paste: '粘贴',\n PasteAsText: '以文本形式粘贴',\n})\nadd('th', {\n Cut: 'ตัด',\n Paste: 'วาง',\n PasteAsText: 'วางในรูปแบบข้อความ',\n})\nadd('pl', {\n Cut: 'Wytnij',\n Paste: 'Wklej',\n PasteAsText: 'Wklej jako tekst',\n})\n\nexport const getValidEditorLocale = (locale: string) => {\n return editorLocaleMap[locale] || 'en'\n}\n\nexport const getEditorTranslation = (locale: string) => {\n const editorLocale = getValidEditorLocale(locale)\n return editorTranslations[editorLocale] || en\n}\n"],"mappings":"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"}
|
|
@@ -14,7 +14,7 @@ import { sanitizeTextEditorHtml } from './TextEditorOutput.utils';
|
|
|
14
14
|
export var TextEditorOutput = /*#__PURE__*/React.forwardRef(function TextEditorOutput(_ref, ref) {
|
|
15
15
|
var value = _ref.value,
|
|
16
16
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
17
|
-
var sanitizedHtml = sanitizeTextEditorHtml(value || '');
|
|
17
|
+
var sanitizedHtml = sanitizeTextEditorHtml(value || '--');
|
|
18
18
|
return /*#__PURE__*/React.createElement(StyledEditor, _extends({}, props, {
|
|
19
19
|
ref: ref
|
|
20
20
|
}), /*#__PURE__*/React.createElement("div", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextEditorOutput.js","names":["React","StyledEditor","sanitizeTextEditorHtml","TextEditorOutput","forwardRef","_ref","ref","value","props","_objectWithoutProperties","_excluded","sanitizedHtml","createElement","_extends","className","dangerouslySetInnerHTML","__html","contentEditable","displayName"],"sources":["../../src/TextEditorOutput/TextEditorOutput.tsx"],"sourcesContent":["import React from 'react'\n\nimport { StyledEditor } from './TextEditorOutput.styles'\nimport type { TextEditorOutputProps } from './TextEditorOutput.types'\nimport { sanitizeTextEditorHtml } from './TextEditorOutput.utils'\n\n/**\n * Render formatted text from `TextEditor`\n *\n * @since 10.24.0\n */\nexport const TextEditorOutput = React.forwardRef<\n HTMLDivElement,\n TextEditorOutputProps & React.HTMLAttributes<HTMLDivElement>\n>(function TextEditorOutput({ value, ...props }, ref) {\n const sanitizedHtml = sanitizeTextEditorHtml(value || '')\n\n return (\n <StyledEditor {...props} ref={ref}>\n <div\n className=\"ck-content\"\n dangerouslySetInnerHTML={{ __html: sanitizedHtml }}\n contentEditable={false}\n />\n </StyledEditor>\n )\n})\n\nTextEditorOutput.displayName = 'TextEditorOutput'\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,YAAY,QAAQ,2BAA2B;AAExD,SAASC,sBAAsB,QAAQ,0BAA0B;;AAEjE;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,gBAAgB,gBAAGH,KAAK,CAACI,UAAU,CAG9C,SAASD,gBAAgBA,CAAAE,IAAA,EAAsBC,GAAG,EAAE;EAAA,IAAxBC,KAAK,GAAAF,IAAA,CAALE,KAAK;IAAKC,KAAK,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EAC3C,IAAMC,aAAa,GAAGT,sBAAsB,CAACK,KAAK,IAAI,
|
|
1
|
+
{"version":3,"file":"TextEditorOutput.js","names":["React","StyledEditor","sanitizeTextEditorHtml","TextEditorOutput","forwardRef","_ref","ref","value","props","_objectWithoutProperties","_excluded","sanitizedHtml","createElement","_extends","className","dangerouslySetInnerHTML","__html","contentEditable","displayName"],"sources":["../../src/TextEditorOutput/TextEditorOutput.tsx"],"sourcesContent":["import React from 'react'\n\nimport { StyledEditor } from './TextEditorOutput.styles'\nimport type { TextEditorOutputProps } from './TextEditorOutput.types'\nimport { sanitizeTextEditorHtml } from './TextEditorOutput.utils'\n\n/**\n * Render formatted text from `TextEditor`\n *\n * @since 10.24.0\n */\nexport const TextEditorOutput = React.forwardRef<\n HTMLDivElement,\n TextEditorOutputProps & React.HTMLAttributes<HTMLDivElement>\n>(function TextEditorOutput({ value, ...props }, ref) {\n const sanitizedHtml = sanitizeTextEditorHtml(value || '--')\n\n return (\n <StyledEditor {...props} ref={ref}>\n <div\n className=\"ck-content\"\n dangerouslySetInnerHTML={{ __html: sanitizedHtml }}\n contentEditable={false}\n />\n </StyledEditor>\n )\n})\n\nTextEditorOutput.displayName = 'TextEditorOutput'\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,YAAY,QAAQ,2BAA2B;AAExD,SAASC,sBAAsB,QAAQ,0BAA0B;;AAEjE;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,gBAAgB,gBAAGH,KAAK,CAACI,UAAU,CAG9C,SAASD,gBAAgBA,CAAAE,IAAA,EAAsBC,GAAG,EAAE;EAAA,IAAxBC,KAAK,GAAAF,IAAA,CAALE,KAAK;IAAKC,KAAK,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EAC3C,IAAMC,aAAa,GAAGT,sBAAsB,CAACK,KAAK,IAAI,IAAI,CAAC;EAE3D,oBACEP,KAAA,CAAAY,aAAA,CAACX,YAAY,EAAAY,QAAA,KAAKL,KAAK;IAAEF,GAAG,EAAEA;EAAI,iBAChCN,KAAA,CAAAY,aAAA;IACEE,SAAS,EAAC,YAAY;IACtBC,uBAAuB,EAAE;MAAEC,MAAM,EAAEL;IAAc,CAAE;IACnDM,eAAe,EAAE;EAAM,CACxB,CACW,CAAC;AAEnB,CAAC,CAAC;AAEFd,gBAAgB,CAACe,WAAW,GAAG,kBAAkB"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styled from 'styled-components';
|
|
2
2
|
export var StyledEditor = /*#__PURE__*/styled.div.withConfig({
|
|
3
3
|
displayName: "StyledEditor",
|
|
4
|
-
componentId: "text-editor-
|
|
5
|
-
})([".ck-editor__top{height:0 !important;}.ck-content{border:none !important;padding:0 !important;--ck-content-font-family:Inter,'Noto Sans JP','Noto Sans KR','Noto Sans SC','Noto Sans TC',sans-serif;--ck-content-font-size:14px;p{margin:0;}
|
|
4
|
+
componentId: "text-editor-0_5_0__sc-1oujb2g-0"
|
|
5
|
+
})([".ck-editor__top{height:0 !important;}.ck-content{border:none !important;padding:0 !important;--ck-content-font-family:Inter,'Noto Sans JP','Noto Sans KR','Noto Sans SC','Noto Sans TC',sans-serif;--ck-content-font-size:14px;--ck-content-word-break:break-word;--ck-content-overflow-wrap:break-word;--ck-content-line-height:1.4;p{margin:0;}img{margin-left:auto;margin-right:auto;}figure.table{display:table;margin-top:0.9em;margin-bottom:0.9em;}figure.table table,table{width:100%;border:1px double #b3b3b3;border-collapse:collapse;border-spacing:0;th{text-align:left;}& > thead,& > tbody{& > tr > td,& > tr > th{border:1px solid #bfbfbf;min-width:2em;padding:0.4em;}& > tr > th{background:rgba(0,0,0,0.05);font-weight:700;}}}}"]);
|
|
6
6
|
//# sourceMappingURL=TextEditorOutput.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextEditorOutput.styles.js","names":["styled","StyledEditor","div","withConfig","displayName","componentId"],"sources":["../../src/TextEditorOutput/TextEditorOutput.styles.ts"],"sourcesContent":["import styled from 'styled-components'\n\nexport const StyledEditor = styled.div`\n .ck-editor__top {\n height: 0 !important;\n }\n\n .ck-content {\n border: none !important;\n padding: 0 !important;\n --ck-content-font-family: Inter, 'Noto Sans JP', 'Noto Sans KR',\n 'Noto Sans SC', 'Noto Sans TC', sans-serif;\n --ck-content-font-size: 14px;\n\n p {\n margin: 0;\n }\n\n
|
|
1
|
+
{"version":3,"file":"TextEditorOutput.styles.js","names":["styled","StyledEditor","div","withConfig","displayName","componentId"],"sources":["../../src/TextEditorOutput/TextEditorOutput.styles.ts"],"sourcesContent":["import styled from 'styled-components'\n\nexport const StyledEditor = styled.div`\n .ck-editor__top {\n height: 0 !important;\n }\n\n .ck-content {\n border: none !important;\n padding: 0 !important;\n --ck-content-font-family: Inter, 'Noto Sans JP', 'Noto Sans KR',\n 'Noto Sans SC', 'Noto Sans TC', sans-serif;\n --ck-content-font-size: 14px;\n --ck-content-word-break: break-word;\n --ck-content-overflow-wrap: break-word;\n --ck-content-line-height: 1.4;\n\n p {\n margin: 0;\n }\n\n img {\n margin-left: auto;\n margin-right: auto;\n }\n\n figure.table {\n display: table;\n margin-top: 0.9em;\n margin-bottom: 0.9em;\n }\n\n figure.table table,\n table {\n width: 100%;\n border: 1px double #b3b3b3;\n border-collapse: collapse;\n border-spacing: 0;\n\n th {\n text-align: left;\n }\n\n & > thead,\n & > tbody {\n & > tr > td,\n & > tr > th {\n border: 1px solid #bfbfbf;\n min-width: 2em;\n padding: 0.4em;\n }\n\n & > tr > th {\n background: rgba(0, 0, 0, 0.05);\n font-weight: 700;\n }\n }\n }\n }\n`\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AAEtC,OAAO,IAAMC,YAAY,gBAAGD,MAAM,CAACE,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,4tBAyDrC"}
|
|
@@ -6,12 +6,13 @@ export var sanitizeTextEditorHtml = function sanitizeTextEditorHtml(html) {
|
|
|
6
6
|
return '';
|
|
7
7
|
}
|
|
8
8
|
return sanitizeHtml(html, {
|
|
9
|
-
allowedTags: ['p', 'br', 'strong', 'b', 'em', 'i', 'u', 's', 'span', 'div', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'ul', 'ol', 'li', 'a', 'table', 'thead', 'tbody', 'tr', 'td', 'th', 'blockquote', 'pre', 'code', 'hr', 'img', 'sub', 'sup'],
|
|
9
|
+
allowedTags: ['p', 'br', 'strong', 'b', 'em', 'i', 'u', 's', 'span', 'div', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'ul', 'ol', 'li', 'a', 'figure', 'figcaption', 'table', 'colgroup', 'col', 'thead', 'tbody', 'tr', 'td', 'th', 'blockquote', 'pre', 'code', 'hr', 'img', 'sub', 'sup'],
|
|
10
10
|
allowedAttributes: {
|
|
11
11
|
'*': ['style', 'class', 'data-*'],
|
|
12
12
|
a: ['href', 'title', 'target', 'rel'],
|
|
13
13
|
img: ['src', 'alt', 'title', 'width', 'height'],
|
|
14
14
|
table: ['border', 'cellpadding', 'cellspacing'],
|
|
15
|
+
col: ['span'],
|
|
15
16
|
td: ['colspan', 'rowspan'],
|
|
16
17
|
th: ['colspan', 'rowspan', 'scope']
|
|
17
18
|
},
|
|
@@ -26,6 +27,12 @@ export var sanitizeTextEditorHtml = function sanitizeTextEditorHtml(html) {
|
|
|
26
27
|
'text-decoration': [/^(?:none|underline|line-through|overline)$/],
|
|
27
28
|
'text-align': [/^(?:left|right|center|justify)$/],
|
|
28
29
|
'line-height': [/^\d+(?:\.\d+)?(?:px|pt|em|rem|%)?$/],
|
|
30
|
+
width: [/^\d+(?:\.\d+)?(?:px|pt|em|rem|%)$/],
|
|
31
|
+
'min-width': [/^\d+(?:\.\d+)?(?:px|pt|em|rem|%)$/],
|
|
32
|
+
'max-width': [/^\d+(?:\.\d+)?(?:px|pt|em|rem|%)$/],
|
|
33
|
+
height: [/^\d+(?:\.\d+)?(?:px|pt|em|rem|%)$/],
|
|
34
|
+
'min-height': [/^\d+(?:\.\d+)?(?:px|pt|em|rem|%)$/],
|
|
35
|
+
'max-height': [/^\d+(?:\.\d+)?(?:px|pt|em|rem|%)$/],
|
|
29
36
|
margin: [/^\d+(?:px|pt|em|rem|%)?(?:\s+\d+(?:px|pt|em|rem|%)?)*$/],
|
|
30
37
|
'margin-top': [/^\d+(?:px|pt|em|rem|%)?$/],
|
|
31
38
|
'margin-bottom': [/^\d+(?:px|pt|em|rem|%)?$/],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextEditorOutput.utils.js","names":["sanitizeHtml","sanitizeTextEditorHtml","html","allowedTags","allowedAttributes","a","img","table","td","th","allowedStyles","color","margin","padding","border","allowedSchemes","allowedSchemesByTag","allowedIframeHostnames"],"sources":["../../src/TextEditorOutput/TextEditorOutput.utils.ts"],"sourcesContent":["import sanitizeHtml from 'sanitize-html'\n\n/** Sanitize HTML content while preserving custom styling */\nexport const sanitizeTextEditorHtml = (html: string) => {\n if (!html) {\n return ''\n }\n\n return sanitizeHtml(html, {\n allowedTags: [\n 'p',\n 'br',\n 'strong',\n 'b',\n 'em',\n 'i',\n 'u',\n 's',\n 'span',\n 'div',\n 'h1',\n 'h2',\n 'h3',\n 'h4',\n 'h5',\n 'h6',\n 'ul',\n 'ol',\n 'li',\n 'a',\n 'table',\n 'thead',\n 'tbody',\n 'tr',\n 'td',\n 'th',\n 'blockquote',\n 'pre',\n 'code',\n 'hr',\n 'img',\n 'sub',\n 'sup',\n ],\n allowedAttributes: {\n '*': ['style', 'class', 'data-*'],\n a: ['href', 'title', 'target', 'rel'],\n img: ['src', 'alt', 'title', 'width', 'height'],\n table: ['border', 'cellpadding', 'cellspacing'],\n td: ['colspan', 'rowspan'],\n th: ['colspan', 'rowspan', 'scope'],\n },\n allowedStyles: {\n '*': {\n color: [\n /^#[0-9a-fA-F]{3,6}$/,\n /^rgb\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*\\)$/,\n /^rgba\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*[\\d.]+\\s*\\)$/,\n ],\n 'background-color': [\n /^#[0-9a-fA-F]{3,6}$/,\n /^rgb\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*\\)$/,\n /^rgba\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*[\\d.]+\\s*\\)$/,\n ],\n 'font-size': [/^\\d+(?:px|pt|em|rem|%)$/],\n 'font-weight': [/^(?:normal|bold|bolder|lighter|\\d{1,3})$/],\n 'font-style': [/^(?:normal|italic|oblique)$/],\n 'font-family': [/.*/],\n 'text-decoration': [/^(?:none|underline|line-through|overline)$/],\n 'text-align': [/^(?:left|right|center|justify)$/],\n 'line-height': [/^\\d+(?:\\.\\d+)?(?:px|pt|em|rem|%)?$/],\n margin: [/^\\d+(?:px|pt|em|rem|%)?(?:\\s+\\d+(?:px|pt|em|rem|%)?)*$/],\n 'margin-top': [/^\\d+(?:px|pt|em|rem|%)?$/],\n 'margin-bottom': [/^\\d+(?:px|pt|em|rem|%)?$/],\n 'margin-left': [/^\\d+(?:px|pt|em|rem|%)?$/],\n 'margin-right': [/^\\d+(?:px|pt|em|rem|%)?$/],\n padding: [/^\\d+(?:px|pt|em|rem|%)?(?:\\s+\\d+(?:px|pt|em|rem|%)?)*$/],\n 'padding-top': [/^\\d+(?:px|pt|em|rem|%)?$/],\n 'padding-bottom': [/^\\d+(?:px|pt|em|rem|%)?$/],\n 'padding-left': [/^\\d+(?:px|pt|em|rem|%)?$/],\n 'padding-right': [/^\\d+(?:px|pt|em|rem|%)?$/],\n border: [/.*/],\n 'border-top': [/.*/],\n 'border-bottom': [/.*/],\n 'border-left': [/.*/],\n 'border-right': [/.*/],\n 'border-color': [\n /^#[0-9a-fA-F]{3,6}$/,\n /^rgb\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*\\)$/,\n /^rgba\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*[\\d.]+\\s*\\)$/,\n ],\n 'border-width': [/^\\d+(?:px|pt|em|rem)?$/],\n 'border-style': [/^(?:none|solid|dashed|dotted|double)$/],\n 'list-style-type': [/.*/],\n 'vertical-align': [/.*/],\n 'white-space': [/.*/],\n },\n },\n allowedSchemes: ['http', 'https', 'mailto', 'tel'],\n allowedSchemesByTag: {\n img: ['data', 'http', 'https'],\n },\n allowedIframeHostnames: [],\n })\n}\n"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"TextEditorOutput.utils.js","names":["sanitizeHtml","sanitizeTextEditorHtml","html","allowedTags","allowedAttributes","a","img","table","col","td","th","allowedStyles","color","width","height","margin","padding","border","allowedSchemes","allowedSchemesByTag","allowedIframeHostnames"],"sources":["../../src/TextEditorOutput/TextEditorOutput.utils.ts"],"sourcesContent":["import sanitizeHtml from 'sanitize-html'\n\n/** Sanitize HTML content while preserving custom styling */\nexport const sanitizeTextEditorHtml = (html: string) => {\n if (!html) {\n return ''\n }\n\n return sanitizeHtml(html, {\n allowedTags: [\n 'p',\n 'br',\n 'strong',\n 'b',\n 'em',\n 'i',\n 'u',\n 's',\n 'span',\n 'div',\n 'h1',\n 'h2',\n 'h3',\n 'h4',\n 'h5',\n 'h6',\n 'ul',\n 'ol',\n 'li',\n 'a',\n 'figure',\n 'figcaption',\n 'table',\n 'colgroup',\n 'col',\n 'thead',\n 'tbody',\n 'tr',\n 'td',\n 'th',\n 'blockquote',\n 'pre',\n 'code',\n 'hr',\n 'img',\n 'sub',\n 'sup',\n ],\n allowedAttributes: {\n '*': ['style', 'class', 'data-*'],\n a: ['href', 'title', 'target', 'rel'],\n img: ['src', 'alt', 'title', 'width', 'height'],\n table: ['border', 'cellpadding', 'cellspacing'],\n col: ['span'],\n td: ['colspan', 'rowspan'],\n th: ['colspan', 'rowspan', 'scope'],\n },\n allowedStyles: {\n '*': {\n color: [\n /^#[0-9a-fA-F]{3,6}$/,\n /^rgb\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*\\)$/,\n /^rgba\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*[\\d.]+\\s*\\)$/,\n ],\n 'background-color': [\n /^#[0-9a-fA-F]{3,6}$/,\n /^rgb\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*\\)$/,\n /^rgba\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*[\\d.]+\\s*\\)$/,\n ],\n 'font-size': [/^\\d+(?:px|pt|em|rem|%)$/],\n 'font-weight': [/^(?:normal|bold|bolder|lighter|\\d{1,3})$/],\n 'font-style': [/^(?:normal|italic|oblique)$/],\n 'font-family': [/.*/],\n 'text-decoration': [/^(?:none|underline|line-through|overline)$/],\n 'text-align': [/^(?:left|right|center|justify)$/],\n 'line-height': [/^\\d+(?:\\.\\d+)?(?:px|pt|em|rem|%)?$/],\n width: [/^\\d+(?:\\.\\d+)?(?:px|pt|em|rem|%)$/],\n 'min-width': [/^\\d+(?:\\.\\d+)?(?:px|pt|em|rem|%)$/],\n 'max-width': [/^\\d+(?:\\.\\d+)?(?:px|pt|em|rem|%)$/],\n height: [/^\\d+(?:\\.\\d+)?(?:px|pt|em|rem|%)$/],\n 'min-height': [/^\\d+(?:\\.\\d+)?(?:px|pt|em|rem|%)$/],\n 'max-height': [/^\\d+(?:\\.\\d+)?(?:px|pt|em|rem|%)$/],\n margin: [/^\\d+(?:px|pt|em|rem|%)?(?:\\s+\\d+(?:px|pt|em|rem|%)?)*$/],\n 'margin-top': [/^\\d+(?:px|pt|em|rem|%)?$/],\n 'margin-bottom': [/^\\d+(?:px|pt|em|rem|%)?$/],\n 'margin-left': [/^\\d+(?:px|pt|em|rem|%)?$/],\n 'margin-right': [/^\\d+(?:px|pt|em|rem|%)?$/],\n padding: [/^\\d+(?:px|pt|em|rem|%)?(?:\\s+\\d+(?:px|pt|em|rem|%)?)*$/],\n 'padding-top': [/^\\d+(?:px|pt|em|rem|%)?$/],\n 'padding-bottom': [/^\\d+(?:px|pt|em|rem|%)?$/],\n 'padding-left': [/^\\d+(?:px|pt|em|rem|%)?$/],\n 'padding-right': [/^\\d+(?:px|pt|em|rem|%)?$/],\n border: [/.*/],\n 'border-top': [/.*/],\n 'border-bottom': [/.*/],\n 'border-left': [/.*/],\n 'border-right': [/.*/],\n 'border-color': [\n /^#[0-9a-fA-F]{3,6}$/,\n /^rgb\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*\\)$/,\n /^rgba\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*[\\d.]+\\s*\\)$/,\n ],\n 'border-width': [/^\\d+(?:px|pt|em|rem)?$/],\n 'border-style': [/^(?:none|solid|dashed|dotted|double)$/],\n 'list-style-type': [/.*/],\n 'vertical-align': [/.*/],\n 'white-space': [/.*/],\n },\n },\n allowedSchemes: ['http', 'https', 'mailto', 'tel'],\n allowedSchemesByTag: {\n img: ['data', 'http', 'https'],\n },\n allowedIframeHostnames: [],\n })\n}\n"],"mappings":"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"}
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
"description": "Accessible description for the editor's editable area.\nThis text provides additional context to screen reader users. It will be\nannounced after the label when the user focuses the editor.",
|
|
11
11
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Accessible description for the editor's editable area.\nThis text provides additional context to screen reader users. It will be\nannounced after the label when the user focuses the editor.</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.1.0</p>\n</dd></dl></div>",
|
|
12
12
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
13
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
13
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L68"
|
|
14
14
|
},
|
|
15
15
|
{
|
|
16
16
|
"name": "aria-label",
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
"description": "Accessible label for the editor's editable area. This text will be\nannounced by screen readers when the user focuses the editor. It should\nmatch or include the visible label associated with this editor field.\nIf not provided, screen readers will announce a generic \"Rich Text Editor\" message.",
|
|
21
21
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Accessible label for the editor's editable area. This text will be\nannounced by screen readers when the user focuses the editor. It should\nmatch or include the visible label associated with this editor field.\nIf not provided, screen readers will announce a generic "Rich Text Editor" message.</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.1.0</p>\n</dd></dl></div>",
|
|
22
22
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
23
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
23
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L59"
|
|
24
24
|
},
|
|
25
25
|
{
|
|
26
26
|
"name": "disabled",
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
"description": "Indicates if the editor is disabled",
|
|
31
31
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Indicates if the editor is disabled</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.0.1</p>\n</dd></dl></div>",
|
|
32
32
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
33
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
33
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L34"
|
|
34
34
|
},
|
|
35
35
|
{
|
|
36
36
|
"name": "error",
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
"description": "Indicates if the editor is in an error state",
|
|
41
41
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Indicates if the editor is in an error state</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.0.1</p>\n</dd></dl></div>",
|
|
42
42
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
43
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
43
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L41"
|
|
44
44
|
},
|
|
45
45
|
{
|
|
46
46
|
"name": "id",
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
"description": "Unique identifier for the editor",
|
|
51
51
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Unique identifier for the editor</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.0.1</p>\n</dd></dl></div>",
|
|
52
52
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
53
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
53
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L10"
|
|
54
54
|
},
|
|
55
55
|
{
|
|
56
56
|
"name": "initialValue",
|
|
@@ -62,7 +62,7 @@
|
|
|
62
62
|
"deprecated": "`initialValue` has been deprecated and will be removed in a future version.\nPlease use the `value` prop instead",
|
|
63
63
|
"deprecatedSince": "0.0.1",
|
|
64
64
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
65
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
65
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L20"
|
|
66
66
|
},
|
|
67
67
|
{
|
|
68
68
|
"name": "locale",
|
|
@@ -72,7 +72,7 @@
|
|
|
72
72
|
"description": "Locale which will be used for localization. Can be passed directly or\nset by wrapping components in I18n provider.",
|
|
73
73
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Locale which will be used for localization. Can be passed directly or\nset by wrapping components in I18n provider.</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.0.1</p>\n</dd></dl></div>",
|
|
74
74
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
75
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
75
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L75"
|
|
76
76
|
},
|
|
77
77
|
{
|
|
78
78
|
"name": "readonly",
|
|
@@ -82,7 +82,7 @@
|
|
|
82
82
|
"description": "Indicates if the editor is in readonly mode.\nWhen true, renders the content using TextEditorOutput instead of the editable editor.",
|
|
83
83
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Indicates if the editor is in readonly mode.\nWhen true, renders the content using TextEditorOutput instead of the editable editor.</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.2.0</p>\n</dd></dl></div>",
|
|
84
84
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
85
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
85
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L49"
|
|
86
86
|
},
|
|
87
87
|
{
|
|
88
88
|
"name": "value",
|
|
@@ -92,7 +92,7 @@
|
|
|
92
92
|
"description": "The current value of the editor",
|
|
93
93
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>The current value of the editor</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.0.1</p>\n</dd></dl></div>",
|
|
94
94
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
95
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
95
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L27"
|
|
96
96
|
},
|
|
97
97
|
{
|
|
98
98
|
"name": "onAfterDestroy",
|
|
@@ -102,7 +102,7 @@
|
|
|
102
102
|
"description": "Callback fired after the editor instance is destroyed",
|
|
103
103
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Callback fired after the editor instance is destroyed</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.0.1</p>\n</dd></dl></div>",
|
|
104
104
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
105
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
105
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L125"
|
|
106
106
|
},
|
|
107
107
|
{
|
|
108
108
|
"name": "onBlur",
|
|
@@ -112,7 +112,7 @@
|
|
|
112
112
|
"description": "Callback fired when the editor loses focus",
|
|
113
113
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Callback fired when the editor loses focus</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.0.1</p>\n</dd></dl></div>",
|
|
114
114
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
115
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
115
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L98"
|
|
116
116
|
},
|
|
117
117
|
{
|
|
118
118
|
"name": "onChange",
|
|
@@ -122,7 +122,7 @@
|
|
|
122
122
|
"description": "Callback fired when the editor content changes",
|
|
123
123
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Callback fired when the editor content changes</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.0.1</p>\n</dd></dl></div>",
|
|
124
124
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
125
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
125
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L84"
|
|
126
126
|
},
|
|
127
127
|
{
|
|
128
128
|
"name": "onDirty",
|
|
@@ -132,7 +132,7 @@
|
|
|
132
132
|
"description": "Callback fired when the editor becomes dirty (content differs from initial value)",
|
|
133
133
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Callback fired when the editor becomes dirty (content differs from initial value)</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.0.1</p>\n</dd></dl></div>",
|
|
134
134
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
135
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
135
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L132"
|
|
136
136
|
},
|
|
137
137
|
{
|
|
138
138
|
"name": "onError",
|
|
@@ -142,7 +142,7 @@
|
|
|
142
142
|
"description": "Callback fired when an error occurs in the editor",
|
|
143
143
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Callback fired when an error occurs in the editor</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.0.1</p>\n</dd></dl></div>",
|
|
144
144
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
145
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
145
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L105"
|
|
146
146
|
},
|
|
147
147
|
{
|
|
148
148
|
"name": "onFocus",
|
|
@@ -152,7 +152,7 @@
|
|
|
152
152
|
"description": "Callback fired when the editor gains focus",
|
|
153
153
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Callback fired when the editor gains focus</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.0.1</p>\n</dd></dl></div>",
|
|
154
154
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
155
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
155
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L91"
|
|
156
156
|
},
|
|
157
157
|
{
|
|
158
158
|
"name": "onInit",
|
|
@@ -162,7 +162,7 @@
|
|
|
162
162
|
"description": "Callback fired when the editor is ready",
|
|
163
163
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Callback fired when the editor is ready</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.0.1</p>\n</dd></dl></div>",
|
|
164
164
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
165
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
165
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L118"
|
|
166
166
|
},
|
|
167
167
|
{
|
|
168
168
|
"name": "onKeyDown",
|
|
@@ -172,7 +172,7 @@
|
|
|
172
172
|
"description": "Callback fired when a key is pressed in the editor",
|
|
173
173
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Callback fired when a key is pressed in the editor</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>0.0.1</p>\n</dd></dl></div>",
|
|
174
174
|
"sourceFile": "TextEditor/TextEditor.types.ts",
|
|
175
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
175
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditor.types.ts#L141"
|
|
176
176
|
}
|
|
177
177
|
],
|
|
178
178
|
"description": ""
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
"description": "",
|
|
11
11
|
"descriptionHtml": "",
|
|
12
12
|
"sourceFile": "TextEditor/TextEditorProvider.types.ts",
|
|
13
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
13
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditorProvider.types.ts#L9"
|
|
14
14
|
},
|
|
15
15
|
{
|
|
16
16
|
"name": "features",
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
"description": "- `stickyToolbar` - Have the editor toolbar stick to the top when content is longer than the page length.\n- `tabAsNavigation` - Have `Tab` key exit the editor. Support `Alt`/`Opt` + `Tab` as triple space indent.",
|
|
21
21
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<ul>\n<li><code>stickyToolbar</code> - Have the editor toolbar stick to the top when content is longer than the page length.</li>\n<li><code>tabAsNavigation</code> - Have <code>Tab</code> key exit the editor. Support <code>Alt</code>/<code>Opt</code> + <code>Tab</code> as triple space indent.</li>\n</ul>\n</div></div>",
|
|
22
22
|
"sourceFile": "TextEditor/TextEditorProvider.types.ts",
|
|
23
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
23
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditor/TextEditorProvider.types.ts#L14"
|
|
24
24
|
}
|
|
25
25
|
],
|
|
26
26
|
"description": ""
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
"description": "Additional classNames",
|
|
11
11
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Additional classNames</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>10.24.0</p>\n</dd></dl></div>",
|
|
12
12
|
"sourceFile": "TextEditorOutput/TextEditorOutput.types.ts",
|
|
13
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
13
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditorOutput/TextEditorOutput.types.ts#L14"
|
|
14
14
|
},
|
|
15
15
|
{
|
|
16
16
|
"name": "style",
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
"description": "Additional CSS styles",
|
|
21
21
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Additional CSS styles</p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>10.24.0</p>\n</dd></dl></div>",
|
|
22
22
|
"sourceFile": "TextEditorOutput/TextEditorOutput.types.ts",
|
|
23
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
23
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditorOutput/TextEditorOutput.types.ts#L21"
|
|
24
24
|
},
|
|
25
25
|
{
|
|
26
26
|
"name": "value",
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
"description": "Formatted text from `TextEditor`",
|
|
31
31
|
"descriptionHtml": "<div class=\"tsd-comment tsd-typography\"><div class=\"lead\">\n<p>Formatted text from <code>TextEditor</code></p>\n</div><dl class=\"tsd-comment-tags\"><dt>since</dt><dd><p>10.24.0</p>\n</dd></dl></div>",
|
|
32
32
|
"sourceFile": "TextEditorOutput/TextEditorOutput.types.ts",
|
|
33
|
-
"sourceUrl": "https://github.com/procore/core/blob/
|
|
33
|
+
"sourceUrl": "https://github.com/procore/core/blob/b6d942e/packages/text-editor/src/TextEditorOutput/TextEditorOutput.types.ts#L7"
|
|
34
34
|
}
|
|
35
35
|
],
|
|
36
36
|
"description": ""
|
package/dist/utils/debounce.d.ts
CHANGED
|
@@ -1 +1,4 @@
|
|
|
1
|
-
export declare function debounce<T extends (...args: any[]) => void>(func: T, wait: number, immediate?: boolean):
|
|
1
|
+
export declare function debounce<T extends (...args: any[]) => void>(func: T, wait: number, immediate?: boolean): {
|
|
2
|
+
(this: ThisParameterType<T>, ...args: Parameters<T>): void;
|
|
3
|
+
flush(): void;
|
|
4
|
+
};
|
package/dist/utils/debounce.js
CHANGED
|
@@ -1,11 +1,15 @@
|
|
|
1
1
|
export function debounce(func, wait) {
|
|
2
2
|
var immediate = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
3
3
|
var timeout = null;
|
|
4
|
-
|
|
4
|
+
var pending = null;
|
|
5
|
+
var debounced = function debounced() {
|
|
5
6
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
6
7
|
args[_key] = arguments[_key];
|
|
7
8
|
}
|
|
8
9
|
var context = this;
|
|
10
|
+
pending = function pending() {
|
|
11
|
+
return func.apply(context, args);
|
|
12
|
+
};
|
|
9
13
|
var callNow = immediate && timeout === null;
|
|
10
14
|
if (timeout !== null) {
|
|
11
15
|
clearTimeout(timeout);
|
|
@@ -20,5 +24,14 @@ export function debounce(func, wait) {
|
|
|
20
24
|
func.apply(context, args);
|
|
21
25
|
}
|
|
22
26
|
};
|
|
27
|
+
debounced.flush = function () {
|
|
28
|
+
if (timeout !== null) {
|
|
29
|
+
var _pending;
|
|
30
|
+
clearTimeout(timeout);
|
|
31
|
+
timeout = null;
|
|
32
|
+
(_pending = pending) === null || _pending === void 0 ? void 0 : _pending();
|
|
33
|
+
}
|
|
34
|
+
};
|
|
35
|
+
return debounced;
|
|
23
36
|
}
|
|
24
37
|
//# sourceMappingURL=debounce.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"debounce.js","names":["debounce","func","wait","immediate","arguments","length","undefined","timeout","_len","args","Array","_key","context","callNow","clearTimeout","setTimeout","
|
|
1
|
+
{"version":3,"file":"debounce.js","names":["debounce","func","wait","immediate","arguments","length","undefined","timeout","pending","debounced","_len","args","Array","_key","context","apply","callNow","clearTimeout","setTimeout","flush","_pending"],"sources":["../../src/utils/debounce.ts"],"sourcesContent":["export function debounce<T extends (...args: any[]) => void>(\n func: T,\n wait: number,\n immediate: boolean = false\n) {\n let timeout: ReturnType<typeof setTimeout> | null = null\n let pending: (() => void) | null = null\n\n const debounced = function (\n this: ThisParameterType<T>,\n ...args: Parameters<T>\n ): void {\n const context = this\n pending = () => func.apply(context, args)\n\n const callNow = immediate && timeout === null\n\n if (timeout !== null) {\n clearTimeout(timeout)\n }\n\n timeout = setTimeout(() => {\n timeout = null\n if (!immediate) {\n func.apply(context, args)\n }\n }, wait)\n\n if (callNow) {\n func.apply(context, args)\n }\n }\n\n debounced.flush = () => {\n if (timeout !== null) {\n clearTimeout(timeout)\n timeout = null\n pending?.()\n }\n }\n\n return debounced\n}\n"],"mappings":"AAAA,OAAO,SAASA,QAAQA,CACtBC,IAAO,EACPC,IAAY,EAEZ;EAAA,IADAC,SAAkB,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,KAAK;EAE1B,IAAIG,OAA6C,GAAG,IAAI;EACxD,IAAIC,OAA4B,GAAG,IAAI;EAEvC,IAAMC,SAAS,GAAG,SAAZA,SAASA,CAAA,EAGP;IAAA,SAAAC,IAAA,GAAAN,SAAA,CAAAC,MAAA,EADHM,IAAI,OAAAC,KAAA,CAAAF,IAAA,GAAAG,IAAA,MAAAA,IAAA,GAAAH,IAAA,EAAAG,IAAA;MAAJF,IAAI,CAAAE,IAAA,IAAAT,SAAA,CAAAS,IAAA;IAAA;IAEP,IAAMC,OAAO,GAAG,IAAI;IACpBN,OAAO,GAAG,SAAVA,OAAOA,CAAA;MAAA,OAASP,IAAI,CAACc,KAAK,CAACD,OAAO,EAAEH,IAAI,CAAC;IAAA;IAEzC,IAAMK,OAAO,GAAGb,SAAS,IAAII,OAAO,KAAK,IAAI;IAE7C,IAAIA,OAAO,KAAK,IAAI,EAAE;MACpBU,YAAY,CAACV,OAAO,CAAC;IACvB;IAEAA,OAAO,GAAGW,UAAU,CAAC,YAAM;MACzBX,OAAO,GAAG,IAAI;MACd,IAAI,CAACJ,SAAS,EAAE;QACdF,IAAI,CAACc,KAAK,CAACD,OAAO,EAAEH,IAAI,CAAC;MAC3B;IACF,CAAC,EAAET,IAAI,CAAC;IAER,IAAIc,OAAO,EAAE;MACXf,IAAI,CAACc,KAAK,CAACD,OAAO,EAAEH,IAAI,CAAC;IAC3B;EACF,CAAC;EAEDF,SAAS,CAACU,KAAK,GAAG,YAAM;IACtB,IAAIZ,OAAO,KAAK,IAAI,EAAE;MAAA,IAAAa,QAAA;MACpBH,YAAY,CAACV,OAAO,CAAC;MACrBA,OAAO,GAAG,IAAI;MACd,CAAAa,QAAA,GAAAZ,OAAO,cAAAY,QAAA,uBAAPA,QAAA,CAAU,CAAC;IACb;EACF,CAAC;EAED,OAAOX,SAAS;AAClB"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@procore/text-editor",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.5.0",
|
|
4
4
|
"description": "Rich text editor component based on CKEditor 5",
|
|
5
5
|
"author": "Procore Technologies",
|
|
6
6
|
"homepage": "https://github.com/procore/core/tree/main/packages/text-editor",
|
|
@@ -69,10 +69,10 @@
|
|
|
69
69
|
"test:watch": "yarn run test --watch"
|
|
70
70
|
},
|
|
71
71
|
"peerDependencies": {
|
|
72
|
-
"@procore/core-react": "^12.
|
|
72
|
+
"@procore/core-react": "^12.49.1",
|
|
73
73
|
"@procore/globalization-toolkit": ">= 3 < 4",
|
|
74
|
-
"ckeditor5": "
|
|
75
|
-
"ckeditor5-premium-features": "
|
|
74
|
+
"ckeditor5": ">= 47 < 49",
|
|
75
|
+
"ckeditor5-premium-features": ">= 47 < 49",
|
|
76
76
|
"react": ">=16.8.0 < 19",
|
|
77
77
|
"react-dom": ">=16.8.0 < 19",
|
|
78
78
|
"styled-components": ">= 5.1.1 < 7"
|
|
@@ -80,7 +80,7 @@
|
|
|
80
80
|
"dependencies": {
|
|
81
81
|
"@ckeditor/ckeditor5-react": "^11.1.2",
|
|
82
82
|
"@procore/core-i18n-js": "^10.30.0",
|
|
83
|
-
"@procore/core-icons": "^12.
|
|
83
|
+
"@procore/core-icons": "^12.18.0",
|
|
84
84
|
"@react-aria/focus": "3.16.2",
|
|
85
85
|
"@react-aria/utils": "3.23.2",
|
|
86
86
|
"sanitize-html": "^2.17.0"
|
|
@@ -94,7 +94,7 @@
|
|
|
94
94
|
"@babel/preset-react": "7.18.6",
|
|
95
95
|
"@babel/preset-typescript": "7.18.6",
|
|
96
96
|
"@babel/register": "7.18.9",
|
|
97
|
-
"@procore/core-react": "^12.
|
|
97
|
+
"@procore/core-react": "^12.49.1",
|
|
98
98
|
"@procore/globalization-toolkit": "3.0.0",
|
|
99
99
|
"@storybook/addon-webpack5-compiler-swc": "^4.0.2",
|
|
100
100
|
"@storybook/jest": "^0.2.3",
|
|
@@ -117,8 +117,8 @@
|
|
|
117
117
|
"babel-loader": "8.2.5",
|
|
118
118
|
"babel-plugin-styled-components": "2.1.4",
|
|
119
119
|
"chromatic": "^13.1.3",
|
|
120
|
-
"ckeditor5": "
|
|
121
|
-
"ckeditor5-premium-features": "
|
|
120
|
+
"ckeditor5": "48.1.1",
|
|
121
|
+
"ckeditor5-premium-features": "48.1.1",
|
|
122
122
|
"css-loader": "^7.1.2",
|
|
123
123
|
"eslint": "8.31.0",
|
|
124
124
|
"eslint-config-prettier": "8.6.0",
|