@contentful/field-editor-markdown 1.5.3 → 1.5.6
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/dist/cjs/MarkdownActions.js +6 -4
- package/dist/cjs/MarkdownEditor.js +4 -2
- package/dist/cjs/__fixtures__/FakeSdk.js +3 -3
- package/dist/cjs/__fixtures__/asset/index.js +5 -5
- package/dist/cjs/__fixtures__/entry/index.js +3 -3
- package/dist/cjs/__fixtures__/fixtures.js +3 -1
- package/dist/cjs/components/HeadingSelector.js +3 -1
- package/dist/cjs/components/InsertLinkSelector.js +3 -1
- package/dist/cjs/components/MarkdownBottomBar.js +7 -5
- package/dist/cjs/components/MarkdownConstraints.js +3 -1
- package/dist/cjs/components/MarkdownPreview.js +4 -2
- package/dist/cjs/components/MarkdownTabs.js +3 -1
- package/dist/cjs/components/MarkdownTextarea/CodeMirrorWrapper.js +4 -2
- package/dist/cjs/components/MarkdownTextarea/MarkdownTextarea.js +3 -1
- package/dist/cjs/components/MarkdownTextarea/createMarkdownEditor.js +3 -1
- package/dist/cjs/components/MarkdownToolbar.js +7 -5
- package/dist/cjs/components/icons.js +28 -26
- package/dist/cjs/dialogs/CheatsheetModalDialog.js +3 -1
- package/dist/cjs/dialogs/ConfirmInsertAssetModalDialog.js +5 -3
- package/dist/cjs/dialogs/EmdebExternalContentDialog.js +7 -5
- package/dist/cjs/dialogs/InsertLinkModalDialog.js +4 -2
- package/dist/cjs/dialogs/InsertTableModalDialog.js +4 -2
- package/dist/cjs/dialogs/SpecialCharacterModalDialog.js +4 -2
- package/dist/cjs/dialogs/ZenModeModalDialog.js +3 -1
- package/dist/cjs/dialogs/openMarkdownDialog.js +9 -7
- package/dist/cjs/dialogs/renderMarkdownDialog.js +3 -1
- package/dist/cjs/types.js +7 -7
- package/dist/cjs/utils/insertAssetLinks.js +5 -5
- package/dist/cjs/utils/isValidUrl.js +3 -3
- package/dist/cjs/utils/linkOrganizer.js +10 -11
- package/dist/cjs/utils/linkOrganizer.spec.js +3 -1
- package/dist/esm/MarkdownActions.js +3 -3
- package/dist/esm/MarkdownEditor.js +1 -1
- package/dist/esm/__fixtures__/FakeSdk.js +3 -3
- package/dist/esm/components/MarkdownBottomBar.js +1 -1
- package/dist/esm/components/MarkdownPreview.js +1 -1
- package/dist/esm/components/MarkdownTextarea/CodeMirrorWrapper.js +1 -1
- package/dist/esm/components/MarkdownToolbar.js +1 -1
- package/dist/esm/components/icons.js +10 -10
- package/dist/esm/dialogs/ConfirmInsertAssetModalDialog.js +2 -2
- package/dist/esm/dialogs/EmdebExternalContentDialog.js +4 -4
- package/dist/esm/dialogs/InsertLinkModalDialog.js +1 -1
- package/dist/esm/dialogs/InsertTableModalDialog.js +1 -1
- package/dist/esm/dialogs/SpecialCharacterModalDialog.js +1 -1
- package/dist/esm/dialogs/openMarkdownDialog.js +6 -6
- package/dist/esm/types.js +7 -7
- package/dist/esm/utils/insertAssetLinks.js +2 -2
- package/dist/esm/utils/linkOrganizer.js +2 -3
- package/dist/types/MarkdownEditor.d.ts +3 -3
- package/dist/types/components/HeadingSelector.d.ts +1 -1
- package/dist/types/components/InsertLinkSelector.d.ts +2 -2
- package/dist/types/components/MarkdownBottomBar.d.ts +3 -3
- package/dist/types/components/MarkdownConstraints.d.ts +2 -2
- package/dist/types/components/MarkdownPreview.d.ts +1 -1
- package/dist/types/components/MarkdownPreviewSkeleton.d.ts +2 -2
- package/dist/types/components/MarkdownTabs.d.ts +2 -2
- package/dist/types/components/MarkdownTextarea/MarkdownTextarea.d.ts +1 -1
- package/dist/types/components/MarkdownToolbar.d.ts +3 -3
- package/dist/types/components/icons.d.ts +11 -11
- package/dist/types/dialogs/CheatsheetModalDialog.d.ts +2 -2
- package/dist/types/dialogs/ConfirmInsertAssetModalDialog.d.ts +2 -2
- package/dist/types/dialogs/EmdebExternalContentDialog.d.ts +2 -2
- package/dist/types/dialogs/InsertLinkModalDialog.d.ts +2 -2
- package/dist/types/dialogs/InsertTableModalDialog.d.ts +2 -2
- package/dist/types/dialogs/SpecialCharacterModalDialog.d.ts +2 -2
- package/dist/types/dialogs/ZenModeModalDialog.d.ts +2 -2
- package/dist/types/dialogs/renderMarkdownDialog.d.ts +2 -2
- package/package.json +7 -4
|
@@ -39,7 +39,9 @@ function _interop_require_wildcard(obj, nodeInterop) {
|
|
|
39
39
|
if (cache && cache.has(obj)) {
|
|
40
40
|
return cache.get(obj);
|
|
41
41
|
}
|
|
42
|
-
var newObj = {
|
|
42
|
+
var newObj = {
|
|
43
|
+
__proto__: null
|
|
44
|
+
};
|
|
43
45
|
var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
|
|
44
46
|
for(var key in obj){
|
|
45
47
|
if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
@@ -64,26 +66,26 @@ const openMarkdownDialog = (sdk, previewComponents)=>(options)=>{
|
|
|
64
66
|
});
|
|
65
67
|
} else if (options.parameters?.type === _types.MarkdownDialogType.insertLink) {
|
|
66
68
|
const selectedText = options.parameters.selectedText;
|
|
67
|
-
return _fieldeditorshared.ModalDialogLauncher.openDialog(options, ({ onClose
|
|
69
|
+
return _fieldeditorshared.ModalDialogLauncher.openDialog(options, ({ onClose })=>{
|
|
68
70
|
return _react.createElement(_InsertLinkModalDialog.InsertLinkModal, {
|
|
69
71
|
selectedText: selectedText,
|
|
70
72
|
onClose: onClose
|
|
71
73
|
});
|
|
72
74
|
});
|
|
73
75
|
} else if (options.parameters?.type === _types.MarkdownDialogType.insertSpecialCharacter) {
|
|
74
|
-
return _fieldeditorshared.ModalDialogLauncher.openDialog(options, ({ onClose
|
|
76
|
+
return _fieldeditorshared.ModalDialogLauncher.openDialog(options, ({ onClose })=>{
|
|
75
77
|
return _react.createElement(_SpecialCharacterModalDialog.SpecialCharacterModalDialog, {
|
|
76
78
|
onClose: onClose
|
|
77
79
|
});
|
|
78
80
|
});
|
|
79
81
|
} else if (options.parameters?.type === _types.MarkdownDialogType.insertTable) {
|
|
80
|
-
return _fieldeditorshared.ModalDialogLauncher.openDialog(options, ({ onClose
|
|
82
|
+
return _fieldeditorshared.ModalDialogLauncher.openDialog(options, ({ onClose })=>{
|
|
81
83
|
return _react.createElement(_InsertTableModalDialog.InsertTableModal, {
|
|
82
84
|
onClose: onClose
|
|
83
85
|
});
|
|
84
86
|
});
|
|
85
87
|
} else if (options.parameters?.type === _types.MarkdownDialogType.embedExternalContent) {
|
|
86
|
-
return _fieldeditorshared.ModalDialogLauncher.openDialog(options, ({ onClose
|
|
88
|
+
return _fieldeditorshared.ModalDialogLauncher.openDialog(options, ({ onClose })=>{
|
|
87
89
|
return _react.createElement(_EmdebExternalContentDialog.EmbedExternalContentModal, {
|
|
88
90
|
onClose: onClose
|
|
89
91
|
});
|
|
@@ -91,7 +93,7 @@ const openMarkdownDialog = (sdk, previewComponents)=>(options)=>{
|
|
|
91
93
|
} else if (options.parameters?.type === _types.MarkdownDialogType.confirmInsertAsset) {
|
|
92
94
|
const locale = options.parameters.locale;
|
|
93
95
|
const assets = options.parameters.assets;
|
|
94
|
-
return _fieldeditorshared.ModalDialogLauncher.openDialog(options, ({ onClose
|
|
96
|
+
return _fieldeditorshared.ModalDialogLauncher.openDialog(options, ({ onClose })=>{
|
|
95
97
|
return _react.createElement(_ConfirmInsertAssetModalDialog.ConfirmInsertAssetModalDialog, {
|
|
96
98
|
onClose: onClose,
|
|
97
99
|
locale: locale,
|
|
@@ -101,7 +103,7 @@ const openMarkdownDialog = (sdk, previewComponents)=>(options)=>{
|
|
|
101
103
|
} else if (options.parameters?.type === _types.MarkdownDialogType.zenMode) {
|
|
102
104
|
const initialValue = options.parameters.initialValue;
|
|
103
105
|
const locale = options.parameters.locale;
|
|
104
|
-
return _fieldeditorshared.ModalDialogLauncher.openDialog(options, ({ onClose
|
|
106
|
+
return _fieldeditorshared.ModalDialogLauncher.openDialog(options, ({ onClose })=>{
|
|
105
107
|
return _react.createElement(_ZenModeModalDialog.ZenModeModalDialog, {
|
|
106
108
|
saveValueToSDK: (value)=>{
|
|
107
109
|
if (value) {
|
|
@@ -38,7 +38,9 @@ function _interop_require_wildcard(obj, nodeInterop) {
|
|
|
38
38
|
if (cache && cache.has(obj)) {
|
|
39
39
|
return cache.get(obj);
|
|
40
40
|
}
|
|
41
|
-
var newObj = {
|
|
41
|
+
var newObj = {
|
|
42
|
+
__proto__: null
|
|
43
|
+
};
|
|
42
44
|
var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
|
|
43
45
|
for(var key in obj){
|
|
44
46
|
if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
|
package/dist/cjs/types.js
CHANGED
|
@@ -10,11 +10,11 @@ Object.defineProperty(exports, "MarkdownDialogType", {
|
|
|
10
10
|
});
|
|
11
11
|
var MarkdownDialogType;
|
|
12
12
|
(function(MarkdownDialogType) {
|
|
13
|
-
MarkdownDialogType["cheatsheet"] =
|
|
14
|
-
MarkdownDialogType["insertLink"] =
|
|
15
|
-
MarkdownDialogType["insertSpecialCharacter"] =
|
|
16
|
-
MarkdownDialogType["insertTable"] =
|
|
17
|
-
MarkdownDialogType["embedExternalContent"] =
|
|
18
|
-
MarkdownDialogType["confirmInsertAsset"] =
|
|
19
|
-
MarkdownDialogType["zenMode"] =
|
|
13
|
+
MarkdownDialogType["cheatsheet"] = "markdown-cheatsheet";
|
|
14
|
+
MarkdownDialogType["insertLink"] = "markdown-insertLink";
|
|
15
|
+
MarkdownDialogType["insertSpecialCharacter"] = "markdown-insertSpecialCharacter";
|
|
16
|
+
MarkdownDialogType["insertTable"] = "markdown-insertTable";
|
|
17
|
+
MarkdownDialogType["embedExternalContent"] = "markdown-embedExternalContent";
|
|
18
|
+
MarkdownDialogType["confirmInsertAsset"] = "markdown-confirmInsertAsset";
|
|
19
|
+
MarkdownDialogType["zenMode"] = "markdown-zenMode";
|
|
20
20
|
})(MarkdownDialogType || (MarkdownDialogType = {}));
|
|
@@ -9,11 +9,11 @@ function _export(target, all) {
|
|
|
9
9
|
});
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
|
-
replaceAssetDomain: function() {
|
|
13
|
-
return replaceAssetDomain;
|
|
14
|
-
},
|
|
15
12
|
insertAssetLinks: function() {
|
|
16
13
|
return insertAssetLinks;
|
|
14
|
+
},
|
|
15
|
+
replaceAssetDomain: function() {
|
|
16
|
+
return replaceAssetDomain;
|
|
17
17
|
}
|
|
18
18
|
});
|
|
19
19
|
const _get = _interop_require_default(require("lodash/get"));
|
|
@@ -47,7 +47,7 @@ function replaceAssetDomain(fileUrl) {
|
|
|
47
47
|
return assetDomainMap[p1];
|
|
48
48
|
});
|
|
49
49
|
}
|
|
50
|
-
function makeAssetLink(asset, { localeCode
|
|
50
|
+
function makeAssetLink(asset, { localeCode, fallbackCode, defaultLocaleCode }) {
|
|
51
51
|
const localizedFile = (0, _get.default)(asset, [
|
|
52
52
|
'fields',
|
|
53
53
|
'file',
|
|
@@ -101,7 +101,7 @@ async function insertAssetLinks(assets, locales) {
|
|
|
101
101
|
});
|
|
102
102
|
const linksWithMeta = assets.map((asset)=>makeAssetLink(asset, locales)).filter((asset)=>asset !== null);
|
|
103
103
|
if (otherLocales.length > 0) {
|
|
104
|
-
const fallbackAssets = linksWithMeta.filter(({ isLocalized
|
|
104
|
+
const fallbackAssets = linksWithMeta.filter(({ isLocalized })=>!isLocalized).map(({ title, isFallback, asset })=>{
|
|
105
105
|
const code = isFallback ? locales.fallbackCode : locales.defaultLocaleCode;
|
|
106
106
|
return {
|
|
107
107
|
title,
|
|
@@ -9,11 +9,11 @@ function _export(target, all) {
|
|
|
9
9
|
});
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
|
-
urlRegex: function() {
|
|
13
|
-
return urlRegex;
|
|
14
|
-
},
|
|
15
12
|
isValidUrl: function() {
|
|
16
13
|
return isValidUrl;
|
|
14
|
+
},
|
|
15
|
+
urlRegex: function() {
|
|
16
|
+
return urlRegex;
|
|
17
17
|
}
|
|
18
18
|
});
|
|
19
19
|
const urlRegex = /^(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-/]))?$/;
|
|
@@ -9,28 +9,27 @@ function _export(target, all) {
|
|
|
9
9
|
});
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
|
+
convertInlineToRef: function() {
|
|
13
|
+
return convertInlineToRef;
|
|
14
|
+
},
|
|
12
15
|
findInline: function() {
|
|
13
16
|
return findInline;
|
|
14
17
|
},
|
|
15
|
-
findRefs: function() {
|
|
16
|
-
return findRefs;
|
|
17
|
-
},
|
|
18
18
|
findLabels: function() {
|
|
19
19
|
return findLabels;
|
|
20
20
|
},
|
|
21
|
-
|
|
22
|
-
return
|
|
21
|
+
findMaxLabelId: function() {
|
|
22
|
+
return findMaxLabelId;
|
|
23
|
+
},
|
|
24
|
+
findRefs: function() {
|
|
25
|
+
return findRefs;
|
|
23
26
|
},
|
|
24
27
|
rewriteRefs: function() {
|
|
25
28
|
return rewriteRefs;
|
|
26
|
-
},
|
|
27
|
-
findMaxLabelId: function() {
|
|
28
|
-
return findMaxLabelId;
|
|
29
29
|
}
|
|
30
30
|
});
|
|
31
31
|
const _extend = _interop_require_default(require("lodash/extend"));
|
|
32
32
|
const _isObject = _interop_require_default(require("lodash/isObject"));
|
|
33
|
-
const _isString = _interop_require_default(require("lodash/isString"));
|
|
34
33
|
const _max = _interop_require_default(require("lodash/max"));
|
|
35
34
|
const _isFinite = _interop_require_default(require("lodash/isFinite"));
|
|
36
35
|
const _forEach = _interop_require_default(require("lodash/forEach"));
|
|
@@ -154,7 +153,7 @@ function makeFinder(type) {
|
|
|
154
153
|
return (text)=>findAll(text, type).map(PROCESSORS[type]);
|
|
155
154
|
}
|
|
156
155
|
function findMaxLabelId(textOrLabels) {
|
|
157
|
-
if (
|
|
156
|
+
if (textOrLabels != null && typeof textOrLabels.valueOf() === 'string') {
|
|
158
157
|
textOrLabels = findLabels(textOrLabels);
|
|
159
158
|
}
|
|
160
159
|
const ids = textOrLabels.map((x)=>x.id).map((x)=>parseInt(x, 10)).filter((x)=>(0, _isFinite.default)(x) && x > 0);
|
|
@@ -173,7 +172,7 @@ function findAll(text, type) {
|
|
|
173
172
|
return matches;
|
|
174
173
|
}
|
|
175
174
|
function hasTitle(link) {
|
|
176
|
-
return (0, _isObject.default)(link) &&
|
|
175
|
+
return (0, _isObject.default)(link) && link.title !== null && typeof link.title.valueOf() === 'string' && link.title.length > 0;
|
|
177
176
|
}
|
|
178
177
|
function buildLabel(link, id) {
|
|
179
178
|
let markup = '[' + id + ']: ' + link.href;
|
|
@@ -24,7 +24,9 @@ function _interop_require_wildcard(obj, nodeInterop) {
|
|
|
24
24
|
if (cache && cache.has(obj)) {
|
|
25
25
|
return cache.get(obj);
|
|
26
26
|
}
|
|
27
|
-
var newObj = {
|
|
27
|
+
var newObj = {
|
|
28
|
+
__proto__: null
|
|
29
|
+
};
|
|
28
30
|
var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
|
|
29
31
|
for(var key in obj){
|
|
30
32
|
if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
@@ -7,10 +7,10 @@ import { openZenMode } from './dialogs/ZenModeModalDialog';
|
|
|
7
7
|
import { insertAssetLinks } from './utils/insertAssetLinks';
|
|
8
8
|
import * as LinkOrganizer from './utils/linkOrganizer';
|
|
9
9
|
export function createMarkdownActions(props) {
|
|
10
|
-
const { sdk
|
|
10
|
+
const { sdk, editor, locale } = props;
|
|
11
11
|
const insertAssetsWithConfirmation = async (assets)=>{
|
|
12
12
|
if (assets) {
|
|
13
|
-
const { links
|
|
13
|
+
const { links, fallbacks } = await insertAssetLinks(assets, {
|
|
14
14
|
localeCode: locale,
|
|
15
15
|
defaultLocaleCode: sdk.locales.default,
|
|
16
16
|
fallbackCode: sdk.locales.fallbacks[locale]
|
|
@@ -140,7 +140,7 @@ export function createMarkdownActions(props) {
|
|
|
140
140
|
return;
|
|
141
141
|
}
|
|
142
142
|
try {
|
|
143
|
-
const { entity: asset
|
|
143
|
+
const { entity: asset } = await sdk.navigator.openNewAsset({
|
|
144
144
|
slideIn: {
|
|
145
145
|
waitForClose: true
|
|
146
146
|
}
|
|
@@ -121,7 +121,7 @@ export function MarkdownEditorConnected(props) {
|
|
|
121
121
|
debounce: 300,
|
|
122
122
|
field: props.sdk.field,
|
|
123
123
|
isInitiallyDisabled: props.isInitiallyDisabled
|
|
124
|
-
}, ({ value
|
|
124
|
+
}, ({ value, disabled, setValue, externalReset })=>React.createElement(MarkdownEditor, {
|
|
125
125
|
...props,
|
|
126
126
|
value: value,
|
|
127
127
|
disabled: disabled,
|
|
@@ -49,7 +49,7 @@ export function newReferenceEditorFakeSdk(props) {
|
|
|
49
49
|
locales,
|
|
50
50
|
cmaAdapter: createFakeCMAAdapter({
|
|
51
51
|
Entry: {
|
|
52
|
-
get: async ({ entryId
|
|
52
|
+
get: async ({ entryId })=>{
|
|
53
53
|
if (props?.fetchDelay) {
|
|
54
54
|
await delay(props.fetchDelay);
|
|
55
55
|
}
|
|
@@ -66,7 +66,7 @@ export function newReferenceEditorFakeSdk(props) {
|
|
|
66
66
|
}
|
|
67
67
|
},
|
|
68
68
|
Asset: {
|
|
69
|
-
get: async ({ assetId
|
|
69
|
+
get: async ({ assetId })=>{
|
|
70
70
|
if (props?.fetchDelay) {
|
|
71
71
|
await delay(props.fetchDelay);
|
|
72
72
|
}
|
|
@@ -91,7 +91,7 @@ export function newReferenceEditorFakeSdk(props) {
|
|
|
91
91
|
}
|
|
92
92
|
},
|
|
93
93
|
ContentType: {
|
|
94
|
-
get: async ({ contentTypeId
|
|
94
|
+
get: async ({ contentTypeId })=>{
|
|
95
95
|
if (contentTypeId === contentTypes.published.sys.id) {
|
|
96
96
|
return contentTypes.published;
|
|
97
97
|
}
|
|
@@ -36,7 +36,7 @@ function SanitizeMessage() {
|
|
|
36
36
|
href: SANITIZE_LINK
|
|
37
37
|
}, "Learn more."));
|
|
38
38
|
}
|
|
39
|
-
function CheatSheetMessage({ onClick
|
|
39
|
+
function CheatSheetMessage({ onClick }) {
|
|
40
40
|
return React.createElement("span", null, "Format your text like a pro with the", ' ', React.createElement(TextLink, {
|
|
41
41
|
as: "button",
|
|
42
42
|
testId: "open-markdown-cheatsheet-button",
|
|
@@ -157,7 +157,7 @@ const styles = {
|
|
|
157
157
|
})
|
|
158
158
|
};
|
|
159
159
|
function MarkdownLink(props) {
|
|
160
|
-
const { Embedly
|
|
160
|
+
const { Embedly, children, ...rest } = props;
|
|
161
161
|
if (props.className === 'embedly-card' && Embedly) {
|
|
162
162
|
return React.createElement(Embedly, {
|
|
163
163
|
url: props.href ?? ''
|
|
@@ -13,7 +13,7 @@ function stripUnit(value) {
|
|
|
13
13
|
return parseFloat(value);
|
|
14
14
|
}
|
|
15
15
|
export function create(host, options) {
|
|
16
|
-
const { direction
|
|
16
|
+
const { direction, fixedHeight, height, readOnly } = options || {};
|
|
17
17
|
let initializedWithValue = false;
|
|
18
18
|
const LF = '\n';
|
|
19
19
|
const EDITOR_SIZE = {
|
|
@@ -37,7 +37,7 @@ const styles = {
|
|
|
37
37
|
})
|
|
38
38
|
};
|
|
39
39
|
const ToolbarButton = React.forwardRef((props, ref)=>{
|
|
40
|
-
const { tooltip
|
|
40
|
+
const { tooltip, onClick, children, className, variant = 'transparent', tooltipPlace = 'top', isDisabled = false, ...otherProps } = props;
|
|
41
41
|
return React.createElement(Tooltip, {
|
|
42
42
|
className: styles.tooltip,
|
|
43
43
|
usePortal: true,
|
|
@@ -10,7 +10,7 @@ const srOnly = css({
|
|
|
10
10
|
clip: 'rect(0, 0, 0, 0)',
|
|
11
11
|
border: '0'
|
|
12
12
|
});
|
|
13
|
-
export const Zen = ({ label
|
|
13
|
+
export const Zen = ({ label, ...rest })=>React.createElement("svg", {
|
|
14
14
|
width: 14,
|
|
15
15
|
height: 14,
|
|
16
16
|
viewBox: "0 0 1792 1792",
|
|
@@ -20,7 +20,7 @@ export const Zen = ({ label , ...rest })=>React.createElement("svg", {
|
|
|
20
20
|
}), React.createElement("span", {
|
|
21
21
|
className: srOnly
|
|
22
22
|
}, label));
|
|
23
|
-
export const Strikethrough = ({ label
|
|
23
|
+
export const Strikethrough = ({ label, ...rest })=>React.createElement("svg", {
|
|
24
24
|
width: 14,
|
|
25
25
|
height: 14,
|
|
26
26
|
viewBox: "0 0 1792 1792",
|
|
@@ -30,7 +30,7 @@ export const Strikethrough = ({ label , ...rest })=>React.createElement("svg", {
|
|
|
30
30
|
}), React.createElement("span", {
|
|
31
31
|
className: srOnly
|
|
32
32
|
}, label));
|
|
33
|
-
export const Indent = ({ label
|
|
33
|
+
export const Indent = ({ label, ...rest })=>React.createElement("svg", {
|
|
34
34
|
width: 14,
|
|
35
35
|
height: 14,
|
|
36
36
|
viewBox: "0 0 1792 1792",
|
|
@@ -40,7 +40,7 @@ export const Indent = ({ label , ...rest })=>React.createElement("svg", {
|
|
|
40
40
|
}), React.createElement("span", {
|
|
41
41
|
className: srOnly
|
|
42
42
|
}, label));
|
|
43
|
-
export const Dedent = ({ label
|
|
43
|
+
export const Dedent = ({ label, ...rest })=>React.createElement("svg", {
|
|
44
44
|
width: 14,
|
|
45
45
|
height: 14,
|
|
46
46
|
viewBox: "0 0 1792 1792",
|
|
@@ -50,7 +50,7 @@ export const Dedent = ({ label , ...rest })=>React.createElement("svg", {
|
|
|
50
50
|
}), React.createElement("span", {
|
|
51
51
|
className: srOnly
|
|
52
52
|
}, label));
|
|
53
|
-
export const Cubes = ({ label
|
|
53
|
+
export const Cubes = ({ label, ...rest })=>React.createElement("svg", {
|
|
54
54
|
width: 18,
|
|
55
55
|
height: 14,
|
|
56
56
|
viewBox: "0 0 2304 1792",
|
|
@@ -60,7 +60,7 @@ export const Cubes = ({ label , ...rest })=>React.createElement("svg", {
|
|
|
60
60
|
}), React.createElement("span", {
|
|
61
61
|
className: srOnly
|
|
62
62
|
}, label));
|
|
63
|
-
export const Table = ({ label
|
|
63
|
+
export const Table = ({ label, ...rest })=>React.createElement("svg", {
|
|
64
64
|
width: 14,
|
|
65
65
|
height: 14,
|
|
66
66
|
viewBox: "0 0 1792 1792",
|
|
@@ -70,7 +70,7 @@ export const Table = ({ label , ...rest })=>React.createElement("svg", {
|
|
|
70
70
|
}), React.createElement("span", {
|
|
71
71
|
className: srOnly
|
|
72
72
|
}, label));
|
|
73
|
-
export const SpecialChar = ({ label
|
|
73
|
+
export const SpecialChar = ({ label, ...rest })=>React.createElement("svg", {
|
|
74
74
|
width: 14,
|
|
75
75
|
height: 14,
|
|
76
76
|
viewBox: "0 0 1792 1792",
|
|
@@ -80,7 +80,7 @@ export const SpecialChar = ({ label , ...rest })=>React.createElement("svg", {
|
|
|
80
80
|
}), React.createElement("span", {
|
|
81
81
|
className: srOnly
|
|
82
82
|
}, label));
|
|
83
|
-
export const OrgLinks = ({ label
|
|
83
|
+
export const OrgLinks = ({ label, ...rest })=>React.createElement("svg", {
|
|
84
84
|
width: 14,
|
|
85
85
|
height: 14,
|
|
86
86
|
viewBox: "0 0 1792 1792",
|
|
@@ -90,7 +90,7 @@ export const OrgLinks = ({ label , ...rest })=>React.createElement("svg", {
|
|
|
90
90
|
}), React.createElement("span", {
|
|
91
91
|
className: srOnly
|
|
92
92
|
}, label));
|
|
93
|
-
export const Undo = ({ label
|
|
93
|
+
export const Undo = ({ label, ...rest })=>React.createElement("svg", {
|
|
94
94
|
width: 14,
|
|
95
95
|
height: 14,
|
|
96
96
|
viewBox: "0 0 1792 1792",
|
|
@@ -100,7 +100,7 @@ export const Undo = ({ label , ...rest })=>React.createElement("svg", {
|
|
|
100
100
|
}), React.createElement("span", {
|
|
101
101
|
className: srOnly
|
|
102
102
|
}, label));
|
|
103
|
-
export const Redo = ({ label
|
|
103
|
+
export const Redo = ({ label, ...rest })=>React.createElement("svg", {
|
|
104
104
|
width: 14,
|
|
105
105
|
height: 14,
|
|
106
106
|
viewBox: "0 0 1792 1792",
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { Button, EntityList, ModalContent, ModalControls, Paragraph } from '@contentful/f36-components';
|
|
3
3
|
import { MarkdownDialogType } from '../types';
|
|
4
|
-
export const ConfirmInsertAssetModalDialog = ({ onClose
|
|
4
|
+
export const ConfirmInsertAssetModalDialog = ({ onClose, assets, locale })=>{
|
|
5
5
|
const localesNumber = assets.length;
|
|
6
6
|
return React.createElement(React.Fragment, null, React.createElement(ModalContent, {
|
|
7
7
|
testId: "confirm-insert-asset"
|
|
8
|
-
}, React.createElement(Paragraph, null, localesNumber === 1 ? `Link asset with missing file for locale ${locale}` : `Link assets with missing files for locale ${locale}`), React.createElement(Paragraph, null, localesNumber === 1 ? 'Do you want to link to the file in its fallback locale?' : 'Do you want to link to the files in their fallback locales?'), React.createElement(EntityList, null, assets.map(({ title
|
|
8
|
+
}, React.createElement(Paragraph, null, localesNumber === 1 ? `Link asset with missing file for locale ${locale}` : `Link assets with missing files for locale ${locale}`), React.createElement(Paragraph, null, localesNumber === 1 ? 'Do you want to link to the file in its fallback locale?' : 'Do you want to link to the files in their fallback locales?'), React.createElement(EntityList, null, assets.map(({ title, description, thumbnailUrl, thumbnailAltText })=>React.createElement(EntityList.Item, {
|
|
9
9
|
key: thumbnailUrl,
|
|
10
10
|
title: title,
|
|
11
11
|
thumbnailUrl: `${thumbnailUrl}?w=46&h=46&fit=thumb`,
|
|
@@ -19,7 +19,7 @@ const styles = {
|
|
|
19
19
|
marginLeft: tokens.spacingM
|
|
20
20
|
})
|
|
21
21
|
};
|
|
22
|
-
const makeEmbedlyLink = ({ url
|
|
22
|
+
const makeEmbedlyLink = ({ url, width, selectedUnit, attachSocial })=>{
|
|
23
23
|
const s = {
|
|
24
24
|
percent: '%',
|
|
25
25
|
px: 'px'
|
|
@@ -32,7 +32,7 @@ const makeEmbedlyLink = ({ url , width , selectedUnit , attachSocial })=>{
|
|
|
32
32
|
].join('');
|
|
33
33
|
};
|
|
34
34
|
const isWidthValid = (width, unit)=>unit === 'percent' ? width <= 100 : true;
|
|
35
|
-
export const EmbedExternalContentModal = ({ onClose
|
|
35
|
+
export const EmbedExternalContentModal = ({ onClose })=>{
|
|
36
36
|
const mainInputRef = useRef(null);
|
|
37
37
|
const [url, setUrl] = useState('https://');
|
|
38
38
|
const [selectedUnit, setUnit] = useState('percent');
|
|
@@ -105,11 +105,11 @@ export const EmbedExternalContentModal = ({ onClose })=>{
|
|
|
105
105
|
as: "p",
|
|
106
106
|
fontColor: "gray500",
|
|
107
107
|
marginTop: "spacingXs"
|
|
108
|
-
}, "To enable this embedded content in your application make sure to add the
|
|
108
|
+
}, "To enable this embedded content in your application make sure to add the ", React.createElement(TextLink, {
|
|
109
109
|
href: "http://embed.ly/docs/products/cards",
|
|
110
110
|
target: "_blank",
|
|
111
111
|
rel: "noopener noreferrer"
|
|
112
|
-
}, "Embedly's platform.js"), "
|
|
112
|
+
}, "Embedly's platform.js"), " on your development environment"))), React.createElement(ModalControls, null, React.createElement(Button, {
|
|
113
113
|
testId: "emded-external-cancel",
|
|
114
114
|
onClick: ()=>onClose(false),
|
|
115
115
|
variant: "secondary",
|
|
@@ -2,7 +2,7 @@ import React, { useState, useRef, useEffect } from 'react';
|
|
|
2
2
|
import { ModalContent, ModalControls, Button, Form, FormControl, TextInput } from '@contentful/f36-components';
|
|
3
3
|
import { MarkdownDialogType } from '../types';
|
|
4
4
|
import { isValidUrl } from '../utils/isValidUrl';
|
|
5
|
-
export const InsertLinkModal = ({ selectedText
|
|
5
|
+
export const InsertLinkModal = ({ selectedText, onClose })=>{
|
|
6
6
|
const mainInputRef = useRef(null);
|
|
7
7
|
const [text, setText] = useState(selectedText || '');
|
|
8
8
|
const [url, setUrl] = useState('');
|
|
@@ -2,7 +2,7 @@ import React, { useState, useRef, useEffect } from 'react';
|
|
|
2
2
|
import { ModalContent, ModalControls, Button, Form, FormControl, TextInput } from '@contentful/f36-components';
|
|
3
3
|
import inRange from 'lodash/inRange';
|
|
4
4
|
import { MarkdownDialogType } from '../types';
|
|
5
|
-
export const InsertTableModal = ({ onClose
|
|
5
|
+
export const InsertTableModal = ({ onClose })=>{
|
|
6
6
|
const mainInputRef = useRef(null);
|
|
7
7
|
const [rows, setRows] = useState(2);
|
|
8
8
|
const [cols, setColumns] = useState(1);
|
|
@@ -28,7 +28,7 @@ const styles = {
|
|
|
28
28
|
marginRight: tokens.spacingS
|
|
29
29
|
})
|
|
30
30
|
};
|
|
31
|
-
export const SpecialCharacterModalDialog = ({ onClose
|
|
31
|
+
export const SpecialCharacterModalDialog = ({ onClose })=>{
|
|
32
32
|
const [selectedCharacter, setSelectedCharacter] = useState(specialCharacters[0]);
|
|
33
33
|
return React.createElement(React.Fragment, null, React.createElement(ModalContent, {
|
|
34
34
|
testId: "insert-special-character-modal"
|
|
@@ -15,26 +15,26 @@ export const openMarkdownDialog = (sdk, previewComponents)=>(options)=>{
|
|
|
15
15
|
});
|
|
16
16
|
} else if (options.parameters?.type === MarkdownDialogType.insertLink) {
|
|
17
17
|
const selectedText = options.parameters.selectedText;
|
|
18
|
-
return ModalDialogLauncher.openDialog(options, ({ onClose
|
|
18
|
+
return ModalDialogLauncher.openDialog(options, ({ onClose })=>{
|
|
19
19
|
return React.createElement(InsertLinkModal, {
|
|
20
20
|
selectedText: selectedText,
|
|
21
21
|
onClose: onClose
|
|
22
22
|
});
|
|
23
23
|
});
|
|
24
24
|
} else if (options.parameters?.type === MarkdownDialogType.insertSpecialCharacter) {
|
|
25
|
-
return ModalDialogLauncher.openDialog(options, ({ onClose
|
|
25
|
+
return ModalDialogLauncher.openDialog(options, ({ onClose })=>{
|
|
26
26
|
return React.createElement(SpecialCharacterModalDialog, {
|
|
27
27
|
onClose: onClose
|
|
28
28
|
});
|
|
29
29
|
});
|
|
30
30
|
} else if (options.parameters?.type === MarkdownDialogType.insertTable) {
|
|
31
|
-
return ModalDialogLauncher.openDialog(options, ({ onClose
|
|
31
|
+
return ModalDialogLauncher.openDialog(options, ({ onClose })=>{
|
|
32
32
|
return React.createElement(InsertTableModal, {
|
|
33
33
|
onClose: onClose
|
|
34
34
|
});
|
|
35
35
|
});
|
|
36
36
|
} else if (options.parameters?.type === MarkdownDialogType.embedExternalContent) {
|
|
37
|
-
return ModalDialogLauncher.openDialog(options, ({ onClose
|
|
37
|
+
return ModalDialogLauncher.openDialog(options, ({ onClose })=>{
|
|
38
38
|
return React.createElement(EmbedExternalContentModal, {
|
|
39
39
|
onClose: onClose
|
|
40
40
|
});
|
|
@@ -42,7 +42,7 @@ export const openMarkdownDialog = (sdk, previewComponents)=>(options)=>{
|
|
|
42
42
|
} else if (options.parameters?.type === MarkdownDialogType.confirmInsertAsset) {
|
|
43
43
|
const locale = options.parameters.locale;
|
|
44
44
|
const assets = options.parameters.assets;
|
|
45
|
-
return ModalDialogLauncher.openDialog(options, ({ onClose
|
|
45
|
+
return ModalDialogLauncher.openDialog(options, ({ onClose })=>{
|
|
46
46
|
return React.createElement(ConfirmInsertAssetModalDialog, {
|
|
47
47
|
onClose: onClose,
|
|
48
48
|
locale: locale,
|
|
@@ -52,7 +52,7 @@ export const openMarkdownDialog = (sdk, previewComponents)=>(options)=>{
|
|
|
52
52
|
} else if (options.parameters?.type === MarkdownDialogType.zenMode) {
|
|
53
53
|
const initialValue = options.parameters.initialValue;
|
|
54
54
|
const locale = options.parameters.locale;
|
|
55
|
-
return ModalDialogLauncher.openDialog(options, ({ onClose
|
|
55
|
+
return ModalDialogLauncher.openDialog(options, ({ onClose })=>{
|
|
56
56
|
return React.createElement(ZenModeModalDialog, {
|
|
57
57
|
saveValueToSDK: (value)=>{
|
|
58
58
|
if (value) {
|
package/dist/esm/types.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
export var MarkdownDialogType;
|
|
2
2
|
(function(MarkdownDialogType) {
|
|
3
|
-
MarkdownDialogType["cheatsheet"] =
|
|
4
|
-
MarkdownDialogType["insertLink"] =
|
|
5
|
-
MarkdownDialogType["insertSpecialCharacter"] =
|
|
6
|
-
MarkdownDialogType["insertTable"] =
|
|
7
|
-
MarkdownDialogType["embedExternalContent"] =
|
|
8
|
-
MarkdownDialogType["confirmInsertAsset"] =
|
|
9
|
-
MarkdownDialogType["zenMode"] =
|
|
3
|
+
MarkdownDialogType["cheatsheet"] = "markdown-cheatsheet";
|
|
4
|
+
MarkdownDialogType["insertLink"] = "markdown-insertLink";
|
|
5
|
+
MarkdownDialogType["insertSpecialCharacter"] = "markdown-insertSpecialCharacter";
|
|
6
|
+
MarkdownDialogType["insertTable"] = "markdown-insertTable";
|
|
7
|
+
MarkdownDialogType["embedExternalContent"] = "markdown-embedExternalContent";
|
|
8
|
+
MarkdownDialogType["confirmInsertAsset"] = "markdown-confirmInsertAsset";
|
|
9
|
+
MarkdownDialogType["zenMode"] = "markdown-zenMode";
|
|
10
10
|
})(MarkdownDialogType || (MarkdownDialogType = {}));
|
|
@@ -24,7 +24,7 @@ export function replaceAssetDomain(fileUrl) {
|
|
|
24
24
|
return assetDomainMap[p1];
|
|
25
25
|
});
|
|
26
26
|
}
|
|
27
|
-
function makeAssetLink(asset, { localeCode
|
|
27
|
+
function makeAssetLink(asset, { localeCode, fallbackCode, defaultLocaleCode }) {
|
|
28
28
|
const localizedFile = get(asset, [
|
|
29
29
|
'fields',
|
|
30
30
|
'file',
|
|
@@ -78,7 +78,7 @@ export async function insertAssetLinks(assets, locales) {
|
|
|
78
78
|
});
|
|
79
79
|
const linksWithMeta = assets.map((asset)=>makeAssetLink(asset, locales)).filter((asset)=>asset !== null);
|
|
80
80
|
if (otherLocales.length > 0) {
|
|
81
|
-
const fallbackAssets = linksWithMeta.filter(({ isLocalized
|
|
81
|
+
const fallbackAssets = linksWithMeta.filter(({ isLocalized })=>!isLocalized).map(({ title, isFallback, asset })=>{
|
|
82
82
|
const code = isFallback ? locales.fallbackCode : locales.defaultLocaleCode;
|
|
83
83
|
return {
|
|
84
84
|
title,
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import extend from 'lodash/extend';
|
|
2
2
|
import isObject from 'lodash/isObject';
|
|
3
|
-
import isString from 'lodash/isString';
|
|
4
3
|
import max from 'lodash/max';
|
|
5
4
|
import isFinite from 'lodash/isFinite';
|
|
6
5
|
import forEach from 'lodash/forEach';
|
|
@@ -119,7 +118,7 @@ function makeFinder(type) {
|
|
|
119
118
|
return (text)=>findAll(text, type).map(PROCESSORS[type]);
|
|
120
119
|
}
|
|
121
120
|
export function findMaxLabelId(textOrLabels) {
|
|
122
|
-
if (
|
|
121
|
+
if (textOrLabels != null && typeof textOrLabels.valueOf() === 'string') {
|
|
123
122
|
textOrLabels = findLabels(textOrLabels);
|
|
124
123
|
}
|
|
125
124
|
const ids = textOrLabels.map((x)=>x.id).map((x)=>parseInt(x, 10)).filter((x)=>isFinite(x) && x > 0);
|
|
@@ -138,7 +137,7 @@ function findAll(text, type) {
|
|
|
138
137
|
return matches;
|
|
139
138
|
}
|
|
140
139
|
function hasTitle(link) {
|
|
141
|
-
return isObject(link) &&
|
|
140
|
+
return isObject(link) && link.title !== null && typeof link.title.valueOf() === 'string' && link.title.length > 0;
|
|
142
141
|
}
|
|
143
142
|
function buildLabel(link, id) {
|
|
144
143
|
let markup = '[' + id + ']: ' + link.href;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
/// <reference types="react" />
|
|
2
2
|
import { FieldAppSDK } from '@contentful/app-sdk';
|
|
3
3
|
import { PreviewComponents } from './types';
|
|
4
4
|
export interface MarkdownEditorProps {
|
|
@@ -19,5 +19,5 @@ export declare function MarkdownEditor(props: MarkdownEditorProps & {
|
|
|
19
19
|
value: string | null | undefined;
|
|
20
20
|
saveValueToSDK: Function;
|
|
21
21
|
externalReset?: number;
|
|
22
|
-
}):
|
|
23
|
-
export declare function MarkdownEditorConnected(props: MarkdownEditorProps):
|
|
22
|
+
}): JSX.Element;
|
|
23
|
+
export declare function MarkdownEditorConnected(props: MarkdownEditorProps): JSX.Element;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
|
|
1
|
+
/// <reference types="react" />
|
|
2
2
|
interface InsertLinkSelectorProps {
|
|
3
3
|
onSelectExisting: Function;
|
|
4
4
|
onAddNew: Function;
|
|
5
5
|
canAddNew: boolean;
|
|
6
6
|
disabled: boolean;
|
|
7
7
|
}
|
|
8
|
-
export declare const InsertLinkSelector: (props: InsertLinkSelectorProps) =>
|
|
8
|
+
export declare const InsertLinkSelector: (props: InsertLinkSelectorProps) => JSX.Element;
|
|
9
9
|
export {};
|