@sanity/code-input 2.30.2-shopify.0 → 3.0.0-studio-v3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +65 -9
- package/lib/cjs/index.js +1348 -0
- package/lib/cjs/index.js.map +1 -0
- package/lib/esm/index.js +1340 -0
- package/lib/esm/index.js.map +1 -0
- package/lib/types/index.d.ts +48 -0
- package/lib/types/index.d.ts.map +1 -0
- package/package.json +53 -15
- package/src/CodeInput.tsx +332 -0
- package/src/PreviewCode.tsx +88 -0
- package/src/config.ts +46 -0
- package/src/createHighlightMarkers.ts +24 -0
- package/src/editorSupport.ts +31 -0
- package/src/getMedia.tsx +95 -0
- package/src/groq.ts +630 -0
- package/src/index.ts +12 -0
- package/src/schema.tsx +69 -0
- package/src/types.ts +26 -0
- package/dist/dts/CodeInput.d.ts +0 -22
- package/dist/dts/CodeInput.d.ts.map +0 -1
- package/dist/dts/PreviewCode.d.ts +0 -9
- package/dist/dts/PreviewCode.d.ts.map +0 -1
- package/dist/dts/config.d.ts +0 -16
- package/dist/dts/config.d.ts.map +0 -1
- package/dist/dts/createHighlightMarkers.d.ts +0 -4
- package/dist/dts/createHighlightMarkers.d.ts.map +0 -1
- package/dist/dts/deprecatedSchema.d.ts +0 -12
- package/dist/dts/deprecatedSchema.d.ts.map +0 -1
- package/dist/dts/editorSupport.d.ts +0 -28
- package/dist/dts/editorSupport.d.ts.map +0 -1
- package/dist/dts/getMedia.d.ts +0 -3
- package/dist/dts/getMedia.d.ts.map +0 -1
- package/dist/dts/groq.d.ts +0 -376
- package/dist/dts/groq.d.ts.map +0 -1
- package/dist/dts/schema.d.ts +0 -44
- package/dist/dts/schema.d.ts.map +0 -1
- package/dist/dts/types.d.ts +0 -29
- package/dist/dts/types.d.ts.map +0 -1
- package/lib/@types/css.d.js +0 -1
- package/lib/CodeInput.js +0 -325
- package/lib/PreviewCode.js +0 -79
- package/lib/config.js +0 -103
- package/lib/createHighlightMarkers.js +0 -31
- package/lib/deprecatedSchema.js +0 -26
- package/lib/editorSupport.js +0 -55
- package/lib/getMedia.js +0 -110
- package/lib/groq.js +0 -414
- package/lib/schema.js +0 -69
- package/lib/types.js +0 -5
- package/sanity.json +0 -28
- package/tsconfig.json +0 -26
package/lib/CodeInput.js
DELETED
|
@@ -1,325 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
|
|
8
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
-
|
|
10
|
-
var _components = require("@sanity/base/components");
|
|
11
|
-
|
|
12
|
-
var _ui = require("@sanity/ui");
|
|
13
|
-
|
|
14
|
-
var PathUtils = _interopRequireWildcard(require("@sanity/util/paths"));
|
|
15
|
-
|
|
16
|
-
var _changeIndicators = require("@sanity/base/change-indicators");
|
|
17
|
-
|
|
18
|
-
var _PatchEvent = _interopRequireWildcard(require("@sanity/form-builder/PatchEvent"));
|
|
19
|
-
|
|
20
|
-
var _reactAce = _interopRequireDefault(require("react-ace"));
|
|
21
|
-
|
|
22
|
-
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
23
|
-
|
|
24
|
-
var _autoId = require("@reach/auto-id");
|
|
25
|
-
|
|
26
|
-
var _createHighlightMarkers = _interopRequireWildcard(require("./createHighlightMarkers"));
|
|
27
|
-
|
|
28
|
-
require("./editorSupport");
|
|
29
|
-
|
|
30
|
-
var _config = require("./config");
|
|
31
|
-
|
|
32
|
-
var _templateObject;
|
|
33
|
-
|
|
34
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
35
|
-
|
|
36
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
37
|
-
|
|
38
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
39
|
-
|
|
40
|
-
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
41
|
-
|
|
42
|
-
var EditorContainer = (0, _styledComponents.default)(_ui.Card)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: relative;\n box-sizing: border-box;\n overflow: hidden;\n z-index: 0;\n\n .ace_editor {\n font-family: ", ";\n font-size: ", ";\n line-height: inherit;\n }\n\n ", "\n\n &:not([disabled]):not([readonly]) {\n &:focus,\n &:focus-within {\n box-shadow: 0 0 0 2px ", ";\n background-color: ", ";\n border-color: ", ";\n }\n }\n"])), _ref => {
|
|
43
|
-
var theme = _ref.theme;
|
|
44
|
-
return theme.sanity.fonts.code.family;
|
|
45
|
-
}, _ref2 => {
|
|
46
|
-
var theme = _ref2.theme;
|
|
47
|
-
return theme.sanity.fonts.code.sizes[1];
|
|
48
|
-
}, _createHighlightMarkers.highlightMarkersCSS, _ref3 => {
|
|
49
|
-
var theme = _ref3.theme;
|
|
50
|
-
return theme.sanity.color.base.focusRing;
|
|
51
|
-
}, _ref4 => {
|
|
52
|
-
var theme = _ref4.theme;
|
|
53
|
-
return theme.sanity.color.base.bg;
|
|
54
|
-
}, _ref5 => {
|
|
55
|
-
var theme = _ref5.theme;
|
|
56
|
-
return theme.sanity.color.base.focusRing;
|
|
57
|
-
});
|
|
58
|
-
|
|
59
|
-
// Returns a string with the mode name if supported (because aliases), otherwise false
|
|
60
|
-
function isSupportedLanguage(mode) {
|
|
61
|
-
var alias = _config.LANGUAGE_ALIASES[mode];
|
|
62
|
-
|
|
63
|
-
if (alias) {
|
|
64
|
-
return alias;
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
var isSupported = _config.SUPPORTED_LANGUAGES.find(lang => lang.value === mode);
|
|
68
|
-
|
|
69
|
-
if (isSupported) {
|
|
70
|
-
return mode;
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
return false;
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
var CodeInput = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
|
|
77
|
-
var _props$value, _type$options5, _type$options6, _type$options7;
|
|
78
|
-
|
|
79
|
-
var aceEditorRef = (0, _react.useRef)();
|
|
80
|
-
var aceEditorId = (0, _autoId.useId)();
|
|
81
|
-
var onFocus = props.onFocus,
|
|
82
|
-
onChange = props.onChange,
|
|
83
|
-
onBlur = props.onBlur,
|
|
84
|
-
compareValue = props.compareValue,
|
|
85
|
-
value = props.value,
|
|
86
|
-
presence = props.presence,
|
|
87
|
-
type = props.type,
|
|
88
|
-
level = props.level,
|
|
89
|
-
readOnly = props.readOnly,
|
|
90
|
-
focusPath = props.focusPath;
|
|
91
|
-
(0, _react.useImperativeHandle)(ref, () => ({
|
|
92
|
-
focus: () => {
|
|
93
|
-
var _aceEditorRef$current, _aceEditorRef$current2;
|
|
94
|
-
|
|
95
|
-
aceEditorRef === null || aceEditorRef === void 0 ? void 0 : (_aceEditorRef$current = aceEditorRef.current) === null || _aceEditorRef$current === void 0 ? void 0 : (_aceEditorRef$current2 = _aceEditorRef$current.editor) === null || _aceEditorRef$current2 === void 0 ? void 0 : _aceEditorRef$current2.focus();
|
|
96
|
-
}
|
|
97
|
-
}));
|
|
98
|
-
var handleLanguageFocus = (0, _react.useCallback)(() => {
|
|
99
|
-
onFocus(_config.PATH_LANGUAGE);
|
|
100
|
-
}, [onFocus]);
|
|
101
|
-
var handleCodeFocus = (0, _react.useCallback)(() => {
|
|
102
|
-
onFocus(_config.PATH_CODE);
|
|
103
|
-
}, [onFocus]);
|
|
104
|
-
var handleFilenameFocus = (0, _react.useCallback)(() => {
|
|
105
|
-
onFocus(_config.PATH_FILENAME);
|
|
106
|
-
}, [onFocus]);
|
|
107
|
-
var handleFilenameChange = (0, _react.useCallback)(event => {
|
|
108
|
-
var val = event.target.value;
|
|
109
|
-
var path = _config.PATH_FILENAME;
|
|
110
|
-
onChange(_PatchEvent.default.from([(0, _PatchEvent.setIfMissing)({
|
|
111
|
-
_type: type.name
|
|
112
|
-
}), val ? (0, _PatchEvent.set)(val, path) : (0, _PatchEvent.unset)(path)]));
|
|
113
|
-
}, [onChange, type.name]);
|
|
114
|
-
var getTheme = (0, _react.useCallback)(() => {
|
|
115
|
-
var _type$options;
|
|
116
|
-
|
|
117
|
-
var preferredTheme = (_type$options = type.options) === null || _type$options === void 0 ? void 0 : _type$options.theme;
|
|
118
|
-
return preferredTheme && _config.SUPPORTED_THEMES.find(theme => theme === preferredTheme) ? preferredTheme : _config.DEFAULT_THEME;
|
|
119
|
-
}, [type]);
|
|
120
|
-
var handleToggleSelectLine = (0, _react.useCallback)(lineNumber => {
|
|
121
|
-
var _aceEditorRef$current3, _aceEditorRef$current4;
|
|
122
|
-
|
|
123
|
-
var editorSession = (_aceEditorRef$current3 = aceEditorRef.current) === null || _aceEditorRef$current3 === void 0 ? void 0 : (_aceEditorRef$current4 = _aceEditorRef$current3.editor) === null || _aceEditorRef$current4 === void 0 ? void 0 : _aceEditorRef$current4.getSession();
|
|
124
|
-
var backgroundMarkers = editorSession === null || editorSession === void 0 ? void 0 : editorSession.getMarkers(true);
|
|
125
|
-
var currentHighlightedLines = Object.keys(backgroundMarkers).filter(key => backgroundMarkers[key].type === 'screenLine').map(key => backgroundMarkers[key].range.start.row);
|
|
126
|
-
var currentIndex = currentHighlightedLines.indexOf(lineNumber);
|
|
127
|
-
|
|
128
|
-
if (currentIndex > -1) {
|
|
129
|
-
// toggle remove
|
|
130
|
-
currentHighlightedLines.splice(currentIndex, 1);
|
|
131
|
-
} else {
|
|
132
|
-
// toggle add
|
|
133
|
-
currentHighlightedLines.push(lineNumber);
|
|
134
|
-
currentHighlightedLines.sort();
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
onChange(_PatchEvent.default.from((0, _PatchEvent.set)(currentHighlightedLines.map(line => // ace starts at line (row) 0, but we store it starting at line 1
|
|
138
|
-
line + 1), ['highlightedLines'])));
|
|
139
|
-
}, [aceEditorRef, onChange]);
|
|
140
|
-
var handleGutterMouseDown = (0, _react.useCallback)(event => {
|
|
141
|
-
var target = event.domEvent.target;
|
|
142
|
-
|
|
143
|
-
if (target.classList.contains('ace_gutter-cell')) {
|
|
144
|
-
var row = event.getDocumentPosition().row;
|
|
145
|
-
handleToggleSelectLine(row);
|
|
146
|
-
}
|
|
147
|
-
}, [handleToggleSelectLine]);
|
|
148
|
-
(0, _react.useEffect)(() => {
|
|
149
|
-
var _aceEditorRef$current5;
|
|
150
|
-
|
|
151
|
-
var editor = aceEditorRef === null || aceEditorRef === void 0 ? void 0 : (_aceEditorRef$current5 = aceEditorRef.current) === null || _aceEditorRef$current5 === void 0 ? void 0 : _aceEditorRef$current5.editor;
|
|
152
|
-
return () => {
|
|
153
|
-
var _editor$session;
|
|
154
|
-
|
|
155
|
-
editor === null || editor === void 0 ? void 0 : (_editor$session = editor.session) === null || _editor$session === void 0 ? void 0 : _editor$session.removeListener('guttermousedown', handleGutterMouseDown);
|
|
156
|
-
};
|
|
157
|
-
}, [aceEditorRef, handleGutterMouseDown]);
|
|
158
|
-
var handleEditorLoad = (0, _react.useCallback)(editor => {
|
|
159
|
-
editor === null || editor === void 0 ? void 0 : editor.on('guttermousedown', handleGutterMouseDown);
|
|
160
|
-
}, [handleGutterMouseDown]);
|
|
161
|
-
var getLanguageAlternatives = (0, _react.useCallback)(() => {
|
|
162
|
-
var _type$options2;
|
|
163
|
-
|
|
164
|
-
var languageAlternatives = (_type$options2 = type.options) === null || _type$options2 === void 0 ? void 0 : _type$options2.languageAlternatives;
|
|
165
|
-
|
|
166
|
-
if (!languageAlternatives) {
|
|
167
|
-
return _config.SUPPORTED_LANGUAGES;
|
|
168
|
-
}
|
|
169
|
-
|
|
170
|
-
if (!Array.isArray(languageAlternatives)) {
|
|
171
|
-
throw new Error("'options.languageAlternatives' should be an array, got ".concat(typeof languageAlternatives));
|
|
172
|
-
}
|
|
173
|
-
|
|
174
|
-
return languageAlternatives.reduce((acc, _ref6) => {
|
|
175
|
-
var title = _ref6.title,
|
|
176
|
-
val = _ref6.value,
|
|
177
|
-
mode = _ref6.mode;
|
|
178
|
-
var alias = _config.LANGUAGE_ALIASES[val];
|
|
179
|
-
|
|
180
|
-
if (alias) {
|
|
181
|
-
// eslint-disable-next-line no-console
|
|
182
|
-
console.warn("'options.languageAlternatives' lists a language with value \"%s\", which is an alias of \"%s\" - please replace the value to read \"%s\"", val, alias, alias);
|
|
183
|
-
return acc.concat({
|
|
184
|
-
title,
|
|
185
|
-
value: alias,
|
|
186
|
-
mode: mode
|
|
187
|
-
});
|
|
188
|
-
}
|
|
189
|
-
|
|
190
|
-
if (!mode && !_config.SUPPORTED_LANGUAGES.find(lang => lang.value === val)) {
|
|
191
|
-
// eslint-disable-next-line no-console
|
|
192
|
-
console.warn("'options.languageAlternatives' lists a language which is not supported: \"%s\", syntax highlighting will be disabled.", val);
|
|
193
|
-
}
|
|
194
|
-
|
|
195
|
-
return acc.concat({
|
|
196
|
-
title,
|
|
197
|
-
value: val,
|
|
198
|
-
mode
|
|
199
|
-
});
|
|
200
|
-
}, []);
|
|
201
|
-
}, [type]);
|
|
202
|
-
var handleCodeChange = (0, _react.useCallback)(code => {
|
|
203
|
-
var _type$options3;
|
|
204
|
-
|
|
205
|
-
var path = _config.PATH_CODE;
|
|
206
|
-
var fixedLanguage = (_type$options3 = type.options) === null || _type$options3 === void 0 ? void 0 : _type$options3.language;
|
|
207
|
-
onChange(_PatchEvent.default.from([(0, _PatchEvent.setIfMissing)({
|
|
208
|
-
_type: type.name,
|
|
209
|
-
language: fixedLanguage
|
|
210
|
-
}), code ? (0, _PatchEvent.set)(code, path) : (0, _PatchEvent.unset)(path)]));
|
|
211
|
-
}, [onChange, type]);
|
|
212
|
-
var handleLanguageChange = (0, _react.useCallback)(event => {
|
|
213
|
-
var val = event.currentTarget.value;
|
|
214
|
-
var path = _config.PATH_LANGUAGE;
|
|
215
|
-
onChange(_PatchEvent.default.from([(0, _PatchEvent.setIfMissing)({
|
|
216
|
-
_type: type.name
|
|
217
|
-
}), val ? (0, _PatchEvent.set)(val, path) : (0, _PatchEvent.unset)(path)]));
|
|
218
|
-
}, [onChange, type.name]);
|
|
219
|
-
var languages = getLanguageAlternatives().slice();
|
|
220
|
-
var selectedLanguage = props !== null && props !== void 0 && (_props$value = props.value) !== null && _props$value !== void 0 && _props$value.language ? languages.find(item => {
|
|
221
|
-
var _props$value2;
|
|
222
|
-
|
|
223
|
-
return item.value === (props === null || props === void 0 ? void 0 : (_props$value2 = props.value) === null || _props$value2 === void 0 ? void 0 : _props$value2.language);
|
|
224
|
-
}) : undefined;
|
|
225
|
-
var languageField = type.fields.find(field => field.name === 'language');
|
|
226
|
-
var filenameField = type.fields.find(field => field.name === 'filename');
|
|
227
|
-
var languageCompareValue = PathUtils.get(compareValue, _config.PATH_LANGUAGE);
|
|
228
|
-
var codeCompareValue = PathUtils.get(compareValue, _config.PATH_CODE);
|
|
229
|
-
var filenameCompareValue = PathUtils.get(compareValue, _config.PATH_FILENAME);
|
|
230
|
-
var languagePresence = presence.filter(presenceItem => PathUtils.startsWith(_config.PATH_LANGUAGE, presenceItem.path));
|
|
231
|
-
var codePresence = presence.filter(presenceItem => PathUtils.startsWith(_config.PATH_CODE, presenceItem.path));
|
|
232
|
-
var filenamePresence = presence.filter(presenceItem => PathUtils.startsWith(_config.PATH_FILENAME, presenceItem.path));
|
|
233
|
-
var renderLanguageAlternatives = (0, _react.useCallback)(() => {
|
|
234
|
-
return /*#__PURE__*/_react.default.createElement(_changeIndicators.ChangeIndicatorProvider, {
|
|
235
|
-
path: _config.PATH_LANGUAGE,
|
|
236
|
-
focusPath: focusPath,
|
|
237
|
-
value: selectedLanguage === null || selectedLanguage === void 0 ? void 0 : selectedLanguage.value,
|
|
238
|
-
compareValue: languageCompareValue
|
|
239
|
-
}, /*#__PURE__*/_react.default.createElement(_components.FormField, {
|
|
240
|
-
level: level + 1,
|
|
241
|
-
label: (languageField === null || languageField === void 0 ? void 0 : languageField.title) || 'Language',
|
|
242
|
-
__unstable_presence: languagePresence
|
|
243
|
-
}, /*#__PURE__*/_react.default.createElement(_ui.Select, {
|
|
244
|
-
onChange: handleLanguageChange,
|
|
245
|
-
readOnly: readOnly,
|
|
246
|
-
value: (selectedLanguage === null || selectedLanguage === void 0 ? void 0 : selectedLanguage.value) || '',
|
|
247
|
-
onFocus: handleLanguageFocus,
|
|
248
|
-
onBlur: onBlur
|
|
249
|
-
}, languages.map(lang => /*#__PURE__*/_react.default.createElement("option", {
|
|
250
|
-
key: lang.value,
|
|
251
|
-
value: lang.value
|
|
252
|
-
}, lang.title)))));
|
|
253
|
-
}, [focusPath, handleLanguageChange, handleLanguageFocus, languageCompareValue, languageField === null || languageField === void 0 ? void 0 : languageField.title, languagePresence, languages, level, onBlur, readOnly, selectedLanguage === null || selectedLanguage === void 0 ? void 0 : selectedLanguage.value]);
|
|
254
|
-
var renderFilenameInput = (0, _react.useCallback)(() => {
|
|
255
|
-
return /*#__PURE__*/_react.default.createElement(_changeIndicators.ChangeIndicatorProvider, {
|
|
256
|
-
path: _config.PATH_FILENAME,
|
|
257
|
-
focusPath: focusPath,
|
|
258
|
-
value: value === null || value === void 0 ? void 0 : value.filename,
|
|
259
|
-
compareValue: filenameCompareValue
|
|
260
|
-
}, /*#__PURE__*/_react.default.createElement(_components.FormField, {
|
|
261
|
-
label: (filenameField === null || filenameField === void 0 ? void 0 : filenameField.title) || 'Filename',
|
|
262
|
-
level: level + 1,
|
|
263
|
-
__unstable_presence: filenamePresence
|
|
264
|
-
}, /*#__PURE__*/_react.default.createElement(_ui.TextInput, {
|
|
265
|
-
name: "filename",
|
|
266
|
-
value: (value === null || value === void 0 ? void 0 : value.filename) || '',
|
|
267
|
-
placeholder: filenameField === null || filenameField === void 0 ? void 0 : filenameField.placeholder,
|
|
268
|
-
onChange: handleFilenameChange,
|
|
269
|
-
onFocus: handleFilenameFocus,
|
|
270
|
-
onBlur: onBlur
|
|
271
|
-
})));
|
|
272
|
-
}, [filenameCompareValue, filenameField === null || filenameField === void 0 ? void 0 : filenameField.placeholder, filenameField === null || filenameField === void 0 ? void 0 : filenameField.title, filenamePresence, focusPath, handleFilenameChange, handleFilenameFocus, level, onBlur, value === null || value === void 0 ? void 0 : value.filename]);
|
|
273
|
-
var renderEditor = (0, _react.useCallback)(() => {
|
|
274
|
-
var _type$options4;
|
|
275
|
-
|
|
276
|
-
var fixedLanguage = (_type$options4 = type.options) === null || _type$options4 === void 0 ? void 0 : _type$options4.language;
|
|
277
|
-
var language = (value === null || value === void 0 ? void 0 : value.language) || fixedLanguage; // the language config from the schema
|
|
278
|
-
|
|
279
|
-
var configured = languages.find(entry => entry.value === language); // is the language officially supported (e.g. we import the mode by default)
|
|
280
|
-
|
|
281
|
-
var supported = language && isSupportedLanguage(language);
|
|
282
|
-
var mode = (configured === null || configured === void 0 ? void 0 : configured.mode) || (supported ? supported : 'text');
|
|
283
|
-
return /*#__PURE__*/_react.default.createElement(_changeIndicators.ChangeIndicatorProvider, {
|
|
284
|
-
path: _config.PATH_CODE,
|
|
285
|
-
focusPath: focusPath,
|
|
286
|
-
value: value === null || value === void 0 ? void 0 : value.code,
|
|
287
|
-
compareValue: codeCompareValue
|
|
288
|
-
}, /*#__PURE__*/_react.default.createElement(_components.FormField, {
|
|
289
|
-
label: "Code",
|
|
290
|
-
level: level + 1,
|
|
291
|
-
__unstable_presence: codePresence
|
|
292
|
-
}, /*#__PURE__*/_react.default.createElement(EditorContainer, {
|
|
293
|
-
radius: 1,
|
|
294
|
-
shadow: 1,
|
|
295
|
-
readOnly: readOnly
|
|
296
|
-
}, /*#__PURE__*/_react.default.createElement(_reactAce.default, {
|
|
297
|
-
ref: aceEditorRef,
|
|
298
|
-
mode: mode,
|
|
299
|
-
theme: getTheme(),
|
|
300
|
-
width: "100%",
|
|
301
|
-
onChange: handleCodeChange,
|
|
302
|
-
name: "editor-".concat(aceEditorId),
|
|
303
|
-
value: value && value.code || '',
|
|
304
|
-
markers: value && value.highlightedLines ? (0, _createHighlightMarkers.default)(value.highlightedLines) : undefined,
|
|
305
|
-
onLoad: handleEditorLoad,
|
|
306
|
-
readOnly: readOnly,
|
|
307
|
-
tabSize: 2,
|
|
308
|
-
wrapEnabled: true,
|
|
309
|
-
setOptions: _config.ACE_SET_OPTIONS,
|
|
310
|
-
editorProps: _config.ACE_EDITOR_PROPS,
|
|
311
|
-
onFocus: handleCodeFocus,
|
|
312
|
-
onBlur: onBlur
|
|
313
|
-
}))));
|
|
314
|
-
}, [(_type$options5 = type.options) === null || _type$options5 === void 0 ? void 0 : _type$options5.language, value, languages, focusPath, codeCompareValue, level, codePresence, readOnly, getTheme, handleCodeChange, aceEditorId, handleEditorLoad, handleCodeFocus, onBlur]);
|
|
315
|
-
return /*#__PURE__*/_react.default.createElement(_components.FormFieldSet, {
|
|
316
|
-
title: type.title,
|
|
317
|
-
description: type.description,
|
|
318
|
-
level: level,
|
|
319
|
-
__unstable_changeIndicator: false
|
|
320
|
-
}, !((_type$options6 = type.options) !== null && _type$options6 !== void 0 && _type$options6.language) && renderLanguageAlternatives(), (type === null || type === void 0 ? void 0 : (_type$options7 = type.options) === null || _type$options7 === void 0 ? void 0 : _type$options7.withFilename) && renderFilenameInput(), renderEditor());
|
|
321
|
-
});
|
|
322
|
-
|
|
323
|
-
CodeInput.displayName = 'CodeInput';
|
|
324
|
-
var _default = CodeInput;
|
|
325
|
-
exports.default = _default;
|
package/lib/PreviewCode.js
DELETED
|
@@ -1,79 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = PreviewCode;
|
|
7
|
-
|
|
8
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
-
|
|
10
|
-
var _reactAce = _interopRequireDefault(require("react-ace"));
|
|
11
|
-
|
|
12
|
-
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
13
|
-
|
|
14
|
-
var _ui = require("@sanity/ui");
|
|
15
|
-
|
|
16
|
-
var _config = require("./config");
|
|
17
|
-
|
|
18
|
-
var _createHighlightMarkers = _interopRequireDefault(require("./createHighlightMarkers"));
|
|
19
|
-
|
|
20
|
-
require("./editorSupport");
|
|
21
|
-
|
|
22
|
-
var _templateObject, _templateObject2;
|
|
23
|
-
|
|
24
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
25
|
-
|
|
26
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
27
|
-
|
|
28
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
29
|
-
|
|
30
|
-
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
31
|
-
|
|
32
|
-
var PreviewContainer = (0, _styledComponents.default)(_ui.Box)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: relative;\n"])));
|
|
33
|
-
var PreviewInner = (0, _styledComponents.default)(_ui.Box)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n background-color: #272822;\n\n .ace_editor {\n box-sizing: border-box;\n cursor: default;\n pointer-events: none;\n }\n\n .ace_content {\n box-sizing: border-box;\n overflow: hidden;\n }\n"])));
|
|
34
|
-
|
|
35
|
-
function PreviewCode(props) {
|
|
36
|
-
var _type$options;
|
|
37
|
-
|
|
38
|
-
var aceEditorRef = (0, _react.useRef)();
|
|
39
|
-
(0, _react.useEffect)(() => {
|
|
40
|
-
var _aceEditorRef$current;
|
|
41
|
-
|
|
42
|
-
if (!(aceEditorRef !== null && aceEditorRef !== void 0 && aceEditorRef.current)) return;
|
|
43
|
-
var editor = (_aceEditorRef$current = aceEditorRef.current) === null || _aceEditorRef$current === void 0 ? void 0 : _aceEditorRef$current.editor;
|
|
44
|
-
|
|
45
|
-
if (editor) {
|
|
46
|
-
// Avoid cursor and focus tracking by Ace
|
|
47
|
-
editor.renderer.$cursorLayer.element.style.opacity = 0;
|
|
48
|
-
editor.textInput.getElement().disabled = true;
|
|
49
|
-
}
|
|
50
|
-
}, []);
|
|
51
|
-
var handleEditorChange = (0, _react.useCallback)(() => {// do nothing when the editor changes
|
|
52
|
-
}, []);
|
|
53
|
-
var value = props.value,
|
|
54
|
-
type = props.type;
|
|
55
|
-
var fixedLanguage = type === null || type === void 0 ? void 0 : (_type$options = type.options) === null || _type$options === void 0 ? void 0 : _type$options.language;
|
|
56
|
-
var mode = (value === null || value === void 0 ? void 0 : value.language) || fixedLanguage || 'text';
|
|
57
|
-
return /*#__PURE__*/_react.default.createElement(PreviewContainer, null, /*#__PURE__*/_react.default.createElement(PreviewInner, {
|
|
58
|
-
padding: 4
|
|
59
|
-
}, /*#__PURE__*/_react.default.createElement(_reactAce.default, {
|
|
60
|
-
ref: aceEditorRef,
|
|
61
|
-
focus: false,
|
|
62
|
-
mode: mode,
|
|
63
|
-
theme: "monokai",
|
|
64
|
-
width: "100%",
|
|
65
|
-
onChange: handleEditorChange,
|
|
66
|
-
maxLines: 200,
|
|
67
|
-
readOnly: true,
|
|
68
|
-
wrapEnabled: true,
|
|
69
|
-
showPrintMargin: false,
|
|
70
|
-
highlightActiveLine: false,
|
|
71
|
-
cursorStart: -1,
|
|
72
|
-
value: value && value.code || '',
|
|
73
|
-
markers: value && value.highlightedLines ? (0, _createHighlightMarkers.default)(value.highlightedLines) : undefined,
|
|
74
|
-
tabSize: 2,
|
|
75
|
-
showGutter: false,
|
|
76
|
-
setOptions: _config.ACE_SET_OPTIONS,
|
|
77
|
-
editorProps: _config.ACE_EDITOR_PROPS
|
|
78
|
-
})));
|
|
79
|
-
}
|
package/lib/config.js
DELETED
|
@@ -1,103 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.SUPPORTED_THEMES = exports.SUPPORTED_LANGUAGES = exports.PATH_LANGUAGE = exports.PATH_FILENAME = exports.PATH_CODE = exports.LANGUAGE_ALIASES = exports.DEFAULT_THEME = exports.ACE_SET_OPTIONS = exports.ACE_EDITOR_PROPS = void 0;
|
|
7
|
-
// NOTE: MAKE SURE THESE ALIGN WITH IMPORTS IN ./editorSupport
|
|
8
|
-
var SUPPORTED_LANGUAGES = [{
|
|
9
|
-
title: 'Batch file',
|
|
10
|
-
value: 'batchfile'
|
|
11
|
-
}, {
|
|
12
|
-
title: 'C#',
|
|
13
|
-
value: 'csharp'
|
|
14
|
-
}, {
|
|
15
|
-
title: 'CSS',
|
|
16
|
-
value: 'css'
|
|
17
|
-
}, {
|
|
18
|
-
title: 'Go',
|
|
19
|
-
value: 'golang'
|
|
20
|
-
}, {
|
|
21
|
-
title: 'GROQ',
|
|
22
|
-
value: 'groq'
|
|
23
|
-
}, {
|
|
24
|
-
title: 'HTML',
|
|
25
|
-
value: 'html'
|
|
26
|
-
}, {
|
|
27
|
-
title: 'Java',
|
|
28
|
-
value: 'java'
|
|
29
|
-
}, {
|
|
30
|
-
title: 'JavaScript',
|
|
31
|
-
value: 'javascript'
|
|
32
|
-
}, {
|
|
33
|
-
title: 'JSON',
|
|
34
|
-
value: 'json'
|
|
35
|
-
}, {
|
|
36
|
-
title: 'JSX',
|
|
37
|
-
value: 'jsx'
|
|
38
|
-
}, {
|
|
39
|
-
title: 'Markdown',
|
|
40
|
-
value: 'markdown'
|
|
41
|
-
}, {
|
|
42
|
-
title: 'MySQL',
|
|
43
|
-
value: 'mysql'
|
|
44
|
-
}, {
|
|
45
|
-
title: 'PHP',
|
|
46
|
-
value: 'php'
|
|
47
|
-
}, {
|
|
48
|
-
title: 'Plain text',
|
|
49
|
-
value: 'text'
|
|
50
|
-
}, {
|
|
51
|
-
title: 'Python',
|
|
52
|
-
value: 'python'
|
|
53
|
-
}, {
|
|
54
|
-
title: 'Ruby',
|
|
55
|
-
value: 'ruby'
|
|
56
|
-
}, {
|
|
57
|
-
title: 'SASS',
|
|
58
|
-
value: 'sass'
|
|
59
|
-
}, {
|
|
60
|
-
title: 'SCSS',
|
|
61
|
-
value: 'scss'
|
|
62
|
-
}, {
|
|
63
|
-
title: 'sh',
|
|
64
|
-
value: 'sh'
|
|
65
|
-
}, {
|
|
66
|
-
title: 'TSX',
|
|
67
|
-
value: 'tsx'
|
|
68
|
-
}, {
|
|
69
|
-
title: 'TypeScript',
|
|
70
|
-
value: 'typescript'
|
|
71
|
-
}, {
|
|
72
|
-
title: 'XML',
|
|
73
|
-
value: 'xml'
|
|
74
|
-
}, {
|
|
75
|
-
title: 'YAML',
|
|
76
|
-
value: 'yaml'
|
|
77
|
-
}];
|
|
78
|
-
exports.SUPPORTED_LANGUAGES = SUPPORTED_LANGUAGES;
|
|
79
|
-
var LANGUAGE_ALIASES = {
|
|
80
|
-
js: 'javascript'
|
|
81
|
-
};
|
|
82
|
-
exports.LANGUAGE_ALIASES = LANGUAGE_ALIASES;
|
|
83
|
-
var SUPPORTED_THEMES = ['github', 'monokai', 'terminal', 'tomorrow'];
|
|
84
|
-
exports.SUPPORTED_THEMES = SUPPORTED_THEMES;
|
|
85
|
-
var DEFAULT_THEME = 'tomorrow';
|
|
86
|
-
exports.DEFAULT_THEME = DEFAULT_THEME;
|
|
87
|
-
var ACE_SET_OPTIONS = {
|
|
88
|
-
useSoftTabs: true,
|
|
89
|
-
navigateWithinSoftTabs: true
|
|
90
|
-
/* note only supported by ace v1.2.7 or higher */
|
|
91
|
-
|
|
92
|
-
};
|
|
93
|
-
exports.ACE_SET_OPTIONS = ACE_SET_OPTIONS;
|
|
94
|
-
var ACE_EDITOR_PROPS = {
|
|
95
|
-
$blockScrolling: true
|
|
96
|
-
};
|
|
97
|
-
exports.ACE_EDITOR_PROPS = ACE_EDITOR_PROPS;
|
|
98
|
-
var PATH_LANGUAGE = ['language'];
|
|
99
|
-
exports.PATH_LANGUAGE = PATH_LANGUAGE;
|
|
100
|
-
var PATH_CODE = ['code'];
|
|
101
|
-
exports.PATH_CODE = PATH_CODE;
|
|
102
|
-
var PATH_FILENAME = ['filename'];
|
|
103
|
-
exports.PATH_FILENAME = PATH_FILENAME;
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = createHighlightMarkers;
|
|
7
|
-
exports.highlightMarkersCSS = void 0;
|
|
8
|
-
|
|
9
|
-
var _styledComponents = require("styled-components");
|
|
10
|
-
|
|
11
|
-
var _templateObject;
|
|
12
|
-
|
|
13
|
-
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
14
|
-
|
|
15
|
-
var highlightMarkersCSS = (0, _styledComponents.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n .ace_editor_markers_highlight {\n position: absolute;\n background-color: ", ";\n opacity: 0.2;\n width: 100% !important;\n border-radius: 0 !important;\n }\n"])), _ref => {
|
|
16
|
-
var theme = _ref.theme;
|
|
17
|
-
return theme.sanity.color.solid.primary.enabled.bg;
|
|
18
|
-
});
|
|
19
|
-
exports.highlightMarkersCSS = highlightMarkersCSS;
|
|
20
|
-
|
|
21
|
-
function createHighlightMarkers(rows) {
|
|
22
|
-
return rows.map(row => ({
|
|
23
|
-
startRow: Number(row) - 1,
|
|
24
|
-
startCol: 0,
|
|
25
|
-
endRow: Number(row) - 1,
|
|
26
|
-
endCol: +Infinity,
|
|
27
|
-
className: 'ace_editor_markers_highlight',
|
|
28
|
-
type: 'screenLine',
|
|
29
|
-
inFront: true
|
|
30
|
-
}));
|
|
31
|
-
}
|
package/lib/deprecatedSchema.js
DELETED
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
|
|
8
|
-
var _default = (() => {
|
|
9
|
-
/* eslint-disable no-console */
|
|
10
|
-
console.warn('@sanity/code-input has been upgraded to automatically register its schema type.');
|
|
11
|
-
console.warn('Please remove the explicit import of `part:@sanity/base/schema-type`');
|
|
12
|
-
/* eslint-enable no-console */
|
|
13
|
-
|
|
14
|
-
return {
|
|
15
|
-
name: 'oldDeprecatedCodeTypeWhichYouShouldRemove',
|
|
16
|
-
type: 'object',
|
|
17
|
-
title: 'Deprecated code type',
|
|
18
|
-
fields: [{
|
|
19
|
-
title: 'Code',
|
|
20
|
-
name: 'code',
|
|
21
|
-
type: 'text'
|
|
22
|
-
}]
|
|
23
|
-
};
|
|
24
|
-
})();
|
|
25
|
-
|
|
26
|
-
exports.default = _default;
|
package/lib/editorSupport.js
DELETED
|
@@ -1,55 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
require("./groq");
|
|
4
|
-
|
|
5
|
-
require("ace-builds/src-noconflict/mode-batchfile");
|
|
6
|
-
|
|
7
|
-
require("ace-builds/src-noconflict/mode-csharp");
|
|
8
|
-
|
|
9
|
-
require("ace-builds/src-noconflict/mode-css");
|
|
10
|
-
|
|
11
|
-
require("ace-builds/src-noconflict/mode-golang");
|
|
12
|
-
|
|
13
|
-
require("ace-builds/src-noconflict/mode-html");
|
|
14
|
-
|
|
15
|
-
require("ace-builds/src-noconflict/mode-java");
|
|
16
|
-
|
|
17
|
-
require("ace-builds/src-noconflict/mode-javascript");
|
|
18
|
-
|
|
19
|
-
require("ace-builds/src-noconflict/mode-json");
|
|
20
|
-
|
|
21
|
-
require("ace-builds/src-noconflict/mode-jsx");
|
|
22
|
-
|
|
23
|
-
require("ace-builds/src-noconflict/mode-markdown");
|
|
24
|
-
|
|
25
|
-
require("ace-builds/src-noconflict/mode-mysql");
|
|
26
|
-
|
|
27
|
-
require("ace-builds/src-noconflict/mode-php");
|
|
28
|
-
|
|
29
|
-
require("ace-builds/src-noconflict/mode-python");
|
|
30
|
-
|
|
31
|
-
require("ace-builds/src-noconflict/mode-ruby");
|
|
32
|
-
|
|
33
|
-
require("ace-builds/src-noconflict/mode-sass");
|
|
34
|
-
|
|
35
|
-
require("ace-builds/src-noconflict/mode-scss");
|
|
36
|
-
|
|
37
|
-
require("ace-builds/src-noconflict/mode-sh");
|
|
38
|
-
|
|
39
|
-
require("ace-builds/src-noconflict/mode-text");
|
|
40
|
-
|
|
41
|
-
require("ace-builds/src-noconflict/mode-tsx");
|
|
42
|
-
|
|
43
|
-
require("ace-builds/src-noconflict/mode-typescript");
|
|
44
|
-
|
|
45
|
-
require("ace-builds/src-noconflict/mode-xml");
|
|
46
|
-
|
|
47
|
-
require("ace-builds/src-noconflict/mode-yaml");
|
|
48
|
-
|
|
49
|
-
require("ace-builds/src-noconflict/theme-github");
|
|
50
|
-
|
|
51
|
-
require("ace-builds/src-noconflict/theme-monokai");
|
|
52
|
-
|
|
53
|
-
require("ace-builds/src-noconflict/theme-terminal");
|
|
54
|
-
|
|
55
|
-
require("ace-builds/src-noconflict/theme-tomorrow");
|