@sanity/code-input 3.0.0-v3-studio.2 → 3.0.0-v3-studio.3
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 +8 -15
- package/lib/cjs/index.js +141 -67
- package/lib/cjs/index.js.map +1 -1
- package/lib/esm/index.js +141 -64
- package/lib/esm/index.js.map +1 -1
- package/lib/types/index.d.ts +6 -2
- package/lib/types/index.d.ts.map +1 -1
- package/package.json +22 -7
- package/src/CodeInput.tsx +50 -32
- package/src/PreviewCode.tsx +1 -1
- package/src/ace-editor/AceEditor-client.test.tsx +24 -0
- package/src/ace-editor/AceEditor-server.test.tsx +18 -0
- package/src/ace-editor/AceEditorLazy.tsx +19 -0
- package/src/{editorSupport.ts → ace-editor/editorSupport.ts} +3 -0
- /package/src/{groq.ts → ace-editor/groq.ts} +0 -0
package/README.md
CHANGED
|
@@ -173,22 +173,15 @@ MIT-licensed. See LICENSE.
|
|
|
173
173
|
|
|
174
174
|
## Develop & test
|
|
175
175
|
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
```bash
|
|
179
|
-
npm run link-watch
|
|
180
|
-
```
|
|
181
|
-
|
|
182
|
-
In another shell, `cd` to your test studio and run:
|
|
176
|
+
This plugin uses [@sanity/plugin-kit](https://github.com/sanity-io/plugin-kit)
|
|
177
|
+
with default configuration for build & watch scripts.
|
|
183
178
|
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
```
|
|
179
|
+
See [Testing a plugin in Sanity Studio](https://github.com/sanity-io/plugin-kit#testing-a-plugin-in-sanity-studio)
|
|
180
|
+
on how to run this plugin with hotreload in the studio.
|
|
187
181
|
|
|
188
|
-
|
|
189
|
-
triggering hotreload. Yalc avoids issues with react-hooks that are typical when using yarn/npm link.
|
|
182
|
+
## Release new version
|
|
190
183
|
|
|
191
|
-
|
|
184
|
+
Run ["CI & Release" workflow](https://github.com/sanity-io/code-input/actions).
|
|
185
|
+
Make sure to select the main branch and check "Release new version".
|
|
192
186
|
|
|
193
|
-
|
|
194
|
-
with default configuration for build & watch scripts.
|
|
187
|
+
Semantic release will only release on configured branches, so it is safe to run release on any branch.
|
package/lib/cjs/index.js
CHANGED
|
@@ -1,11 +1,4 @@
|
|
|
1
|
-
var $k7rGe$sanity = require("sanity");
|
|
2
|
-
var $k7rGe$sanityicons = require("@sanity/icons");
|
|
3
|
-
var $k7rGe$reactjsxruntime = require("react/jsx-runtime");
|
|
4
|
-
var $k7rGe$react = require("react");
|
|
5
|
-
var $k7rGe$sanityform = require("sanity/form");
|
|
6
|
-
var $k7rGe$sanityui = require("@sanity/ui");
|
|
7
1
|
var $k7rGe$reactace = require("react-ace");
|
|
8
|
-
var $k7rGe$styledcomponents = require("styled-components");
|
|
9
2
|
require("ace-builds/src-noconflict/mode-batchfile");
|
|
10
3
|
require("ace-builds/src-noconflict/mode-csharp");
|
|
11
4
|
require("ace-builds/src-noconflict/mode-css");
|
|
@@ -32,16 +25,81 @@ require("ace-builds/src-noconflict/theme-github");
|
|
|
32
25
|
require("ace-builds/src-noconflict/theme-monokai");
|
|
33
26
|
require("ace-builds/src-noconflict/theme-terminal");
|
|
34
27
|
require("ace-builds/src-noconflict/theme-tomorrow");
|
|
28
|
+
var $k7rGe$sanity = require("sanity");
|
|
29
|
+
var $k7rGe$sanityicons = require("@sanity/icons");
|
|
30
|
+
var $k7rGe$reactjsxruntime = require("react/jsx-runtime");
|
|
31
|
+
var $k7rGe$react = require("react");
|
|
32
|
+
var $k7rGe$sanityform = require("sanity/form");
|
|
33
|
+
var $k7rGe$sanityui = require("@sanity/ui");
|
|
34
|
+
var $k7rGe$styledcomponents = require("styled-components");
|
|
35
35
|
|
|
36
|
+
function $parcel$interopDefault(a) {
|
|
37
|
+
return a && a.__esModule ? a.default : a;
|
|
38
|
+
}
|
|
39
|
+
function $parcel$defineInteropFlag(a) {
|
|
40
|
+
Object.defineProperty(a, '__esModule', {value: true, configurable: true});
|
|
41
|
+
}
|
|
36
42
|
function $parcel$export(e, n, v, s) {
|
|
37
43
|
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
38
44
|
}
|
|
39
|
-
|
|
40
|
-
|
|
45
|
+
var $parcel$global =
|
|
46
|
+
typeof globalThis !== 'undefined'
|
|
47
|
+
? globalThis
|
|
48
|
+
: typeof self !== 'undefined'
|
|
49
|
+
? self
|
|
50
|
+
: typeof window !== 'undefined'
|
|
51
|
+
? window
|
|
52
|
+
: typeof global !== 'undefined'
|
|
53
|
+
? global
|
|
54
|
+
: {};
|
|
55
|
+
var $parcel$modules = {};
|
|
56
|
+
var $parcel$inits = {};
|
|
57
|
+
|
|
58
|
+
var parcelRequire = $parcel$global["parcelRequire07ce"];
|
|
59
|
+
if (parcelRequire == null) {
|
|
60
|
+
parcelRequire = function(id) {
|
|
61
|
+
if (id in $parcel$modules) {
|
|
62
|
+
return $parcel$modules[id].exports;
|
|
63
|
+
}
|
|
64
|
+
if (id in $parcel$inits) {
|
|
65
|
+
var init = $parcel$inits[id];
|
|
66
|
+
delete $parcel$inits[id];
|
|
67
|
+
var module = {id: id, exports: {}};
|
|
68
|
+
$parcel$modules[id] = module;
|
|
69
|
+
init.call(module.exports, module, module.exports);
|
|
70
|
+
return module.exports;
|
|
71
|
+
}
|
|
72
|
+
var err = new Error("Cannot find module '" + id + "'");
|
|
73
|
+
err.code = 'MODULE_NOT_FOUND';
|
|
74
|
+
throw err;
|
|
75
|
+
};
|
|
76
|
+
|
|
77
|
+
parcelRequire.register = function register(id, init) {
|
|
78
|
+
$parcel$inits[id] = init;
|
|
79
|
+
};
|
|
80
|
+
|
|
81
|
+
$parcel$global["parcelRequire07ce"] = parcelRequire;
|
|
41
82
|
}
|
|
83
|
+
parcelRequire.register("lMYyH", function(module, exports) {
|
|
84
|
+
|
|
85
|
+
$parcel$defineInteropFlag(module.exports);
|
|
86
|
+
|
|
87
|
+
$parcel$export(module.exports, "default", () => $b9b128b60a9c7418$export$2e2bcd8739ae039);
|
|
88
|
+
|
|
89
|
+
parcelRequire("kmEYb");
|
|
90
|
+
|
|
91
|
+
|
|
92
|
+
|
|
93
|
+
|
|
94
|
+
|
|
95
|
+
|
|
96
|
+
|
|
97
|
+
|
|
98
|
+
|
|
99
|
+
|
|
100
|
+
|
|
101
|
+
|
|
42
102
|
|
|
43
|
-
$parcel$export(module.exports, "codeInput", () => $244e63ca53592e4d$export$d18430c17c97a000);
|
|
44
|
-
$parcel$export(module.exports, "PreviewCode", () => $15530f24e7c40879$export$2e2bcd8739ae039);
|
|
45
103
|
|
|
46
104
|
|
|
47
105
|
|
|
@@ -51,30 +109,16 @@ $parcel$export(module.exports, "PreviewCode", () => $15530f24e7c40879$export$2e2
|
|
|
51
109
|
|
|
52
110
|
|
|
53
111
|
|
|
54
|
-
const $470a71f5fffbba1a$export$ac98e174937d3154 = (0, $k7rGe$styledcomponents.css)`
|
|
55
|
-
.ace_editor_markers_highlight {
|
|
56
|
-
position: absolute;
|
|
57
|
-
background-color: ${({ theme: theme })=>theme.sanity.color.solid.primary.enabled.bg};
|
|
58
|
-
opacity: 0.2;
|
|
59
|
-
width: 100% !important;
|
|
60
|
-
border-radius: 0 !important;
|
|
61
|
-
}
|
|
62
|
-
`;
|
|
63
|
-
function $470a71f5fffbba1a$export$2e2bcd8739ae039(rows) {
|
|
64
|
-
return rows.map((row)=>({
|
|
65
|
-
startRow: Number(row) - 1,
|
|
66
|
-
startCol: 0,
|
|
67
|
-
endRow: Number(row) - 1,
|
|
68
|
-
endCol: Infinity,
|
|
69
|
-
className: "ace_editor_markers_highlight",
|
|
70
|
-
type: "screenLine",
|
|
71
|
-
inFront: true
|
|
72
|
-
}));
|
|
73
|
-
}
|
|
74
112
|
|
|
75
113
|
|
|
114
|
+
|
|
115
|
+
|
|
116
|
+
var $b9b128b60a9c7418$export$2e2bcd8739ae039 = (0, ($parcel$interopDefault($k7rGe$reactace)));
|
|
117
|
+
|
|
118
|
+
});
|
|
119
|
+
parcelRequire.register("kmEYb", function(module, exports) {
|
|
76
120
|
// Grammar from https://github.com/sanity-io/vscode-sanity
|
|
77
|
-
const $
|
|
121
|
+
const $8261c675491bb30c$var$rules = {
|
|
78
122
|
start: [
|
|
79
123
|
{
|
|
80
124
|
include: "#query"
|
|
@@ -659,7 +703,7 @@ ace.define("ace/mode/groq_highlight_rules", [
|
|
|
659
703
|
const TextHighlightRules = acequire("./text_highlight_rules").TextHighlightRules;
|
|
660
704
|
const GroqHighlightRules = function() {
|
|
661
705
|
/* eslint-disable @typescript-eslint/ban-ts-comment */ // @ts-ignore
|
|
662
|
-
this.$rules = $
|
|
706
|
+
this.$rules = $8261c675491bb30c$var$rules;
|
|
663
707
|
// @ts-ignore
|
|
664
708
|
this.normalizeRules();
|
|
665
709
|
/* eslint-enable @typescript-eslint/ban-ts-comment */ };
|
|
@@ -700,9 +744,12 @@ ace.define("ace/mode/groq", [
|
|
|
700
744
|
exports.Mode = Mode;
|
|
701
745
|
});
|
|
702
746
|
|
|
747
|
+
});
|
|
703
748
|
|
|
704
749
|
|
|
705
750
|
|
|
751
|
+
$parcel$export(module.exports, "codeInput", () => $244e63ca53592e4d$export$d18430c17c97a000);
|
|
752
|
+
$parcel$export(module.exports, "PreviewCode", () => $15530f24e7c40879$export$2e2bcd8739ae039);
|
|
706
753
|
|
|
707
754
|
|
|
708
755
|
|
|
@@ -712,21 +759,26 @@ ace.define("ace/mode/groq", [
|
|
|
712
759
|
|
|
713
760
|
|
|
714
761
|
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
762
|
+
const $470a71f5fffbba1a$export$ac98e174937d3154 = (0, $k7rGe$styledcomponents.css)`
|
|
763
|
+
.ace_editor_markers_highlight {
|
|
764
|
+
position: absolute;
|
|
765
|
+
background-color: ${({ theme: theme })=>theme.sanity.color.solid.primary.enabled.bg};
|
|
766
|
+
opacity: 0.2;
|
|
767
|
+
width: 100% !important;
|
|
768
|
+
border-radius: 0 !important;
|
|
769
|
+
}
|
|
770
|
+
`;
|
|
771
|
+
function $470a71f5fffbba1a$export$2e2bcd8739ae039(rows) {
|
|
772
|
+
return rows.map((row)=>({
|
|
773
|
+
startRow: Number(row) - 1,
|
|
774
|
+
startCol: 0,
|
|
775
|
+
endRow: Number(row) - 1,
|
|
776
|
+
endCol: Infinity,
|
|
777
|
+
className: "ace_editor_markers_highlight",
|
|
778
|
+
type: "screenLine",
|
|
779
|
+
inFront: true
|
|
780
|
+
}));
|
|
781
|
+
}
|
|
730
782
|
|
|
731
783
|
|
|
732
784
|
const $8fdae771dbccc774$export$7c77c3a9bb93870d = [
|
|
@@ -853,6 +905,17 @@ const $8fdae771dbccc774$export$4f74600301fa25db = [
|
|
|
853
905
|
|
|
854
906
|
|
|
855
907
|
|
|
908
|
+
|
|
909
|
+
const $8b53187504760ea8$export$476686f2cdb5577f = /*#__PURE__*/ (0, ($parcel$interopDefault($k7rGe$react))).lazy(()=>Promise.resolve((parcelRequire("lMYyH"))));
|
|
910
|
+
function $8b53187504760ea8$export$99999bc9085b44fd() {
|
|
911
|
+
const [mounted, setMounted] = (0, $k7rGe$react.useState)(false);
|
|
912
|
+
(0, $k7rGe$react.useEffect)(()=>{
|
|
913
|
+
setMounted(true);
|
|
914
|
+
}, []);
|
|
915
|
+
return mounted ? $8b53187504760ea8$export$476686f2cdb5577f : null;
|
|
916
|
+
}
|
|
917
|
+
|
|
918
|
+
|
|
856
919
|
const $293e4fb68be52bc5$var$EditorContainer = (0, ($parcel$interopDefault($k7rGe$styledcomponents)))((0, $k7rGe$sanityui.Card))`
|
|
857
920
|
position: relative;
|
|
858
921
|
box-sizing: border-box;
|
|
@@ -1019,31 +1082,42 @@ function $293e4fb68be52bc5$export$20d4ca75cb144ab0(props) {
|
|
|
1019
1082
|
}, [
|
|
1020
1083
|
languages
|
|
1021
1084
|
]);
|
|
1085
|
+
const AceEditor = (0, $8b53187504760ea8$export$99999bc9085b44fd)();
|
|
1022
1086
|
const renderCodeInput = (0, $k7rGe$react.useCallback)((inputProps)=>{
|
|
1023
1087
|
return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)($293e4fb68be52bc5$var$EditorContainer, {
|
|
1024
1088
|
radius: 1,
|
|
1025
1089
|
shadow: 1,
|
|
1026
1090
|
readOnly: readOnly,
|
|
1027
|
-
children: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.
|
|
1028
|
-
|
|
1029
|
-
|
|
1030
|
-
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
1036
|
-
|
|
1037
|
-
|
|
1038
|
-
|
|
1039
|
-
|
|
1040
|
-
|
|
1041
|
-
|
|
1042
|
-
|
|
1043
|
-
|
|
1091
|
+
children: AceEditor && /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $k7rGe$react.Suspense), {
|
|
1092
|
+
fallback: /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)("div", {
|
|
1093
|
+
children: "Loading code editor..."
|
|
1094
|
+
}),
|
|
1095
|
+
children: [
|
|
1096
|
+
"(",
|
|
1097
|
+
/*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsx)(AceEditor, {
|
|
1098
|
+
ref: aceEditorRef,
|
|
1099
|
+
mode: mode1,
|
|
1100
|
+
theme: theme,
|
|
1101
|
+
width: "100%",
|
|
1102
|
+
onChange: handleCodeChange,
|
|
1103
|
+
name: inputProps.id,
|
|
1104
|
+
value: inputProps.value,
|
|
1105
|
+
markers: value && value.highlightedLines ? (0, $470a71f5fffbba1a$export$2e2bcd8739ae039)(value.highlightedLines) : undefined,
|
|
1106
|
+
onLoad: handleEditorLoad,
|
|
1107
|
+
readOnly: readOnly,
|
|
1108
|
+
tabSize: 2,
|
|
1109
|
+
wrapEnabled: true,
|
|
1110
|
+
setOptions: (0, $8fdae771dbccc774$export$1d910bb34606e145),
|
|
1111
|
+
editorProps: (0, $8fdae771dbccc774$export$24aa1be5d8c3cd08),
|
|
1112
|
+
onFocus: handleCodeFocus,
|
|
1113
|
+
onBlur: onBlur
|
|
1114
|
+
}),
|
|
1115
|
+
")"
|
|
1116
|
+
]
|
|
1044
1117
|
})
|
|
1045
1118
|
});
|
|
1046
1119
|
}, [
|
|
1120
|
+
AceEditor,
|
|
1047
1121
|
theme,
|
|
1048
1122
|
handleCodeChange,
|
|
1049
1123
|
handleCodeFocus,
|
|
@@ -1051,7 +1125,7 @@ function $293e4fb68be52bc5$export$20d4ca75cb144ab0(props) {
|
|
|
1051
1125
|
mode1,
|
|
1052
1126
|
onBlur,
|
|
1053
1127
|
readOnly,
|
|
1054
|
-
value
|
|
1128
|
+
value,
|
|
1055
1129
|
]);
|
|
1056
1130
|
return /*#__PURE__*/ (0, $k7rGe$reactjsxruntime.jsxs)((0, $k7rGe$sanityui.Stack), {
|
|
1057
1131
|
space: 4,
|
|
@@ -1089,7 +1163,7 @@ function $293e4fb68be52bc5$export$20d4ca75cb144ab0(props) {
|
|
|
1089
1163
|
|
|
1090
1164
|
|
|
1091
1165
|
|
|
1092
|
-
|
|
1166
|
+
parcelRequire("lMYyH");
|
|
1093
1167
|
const $15530f24e7c40879$var$PreviewContainer = (0, ($parcel$interopDefault($k7rGe$styledcomponents)))((0, $k7rGe$sanityui.Box))`
|
|
1094
1168
|
position: relative;
|
|
1095
1169
|
`;
|