eddev 2.0.0-beta.67 → 2.0.0-beta.69
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/app/lib/blocks/EditableText.js +1 -1
- package/dist/app/lib/blocks/editor/EditorHighlights.d.ts +7 -0
- package/dist/app/lib/blocks/editor/EditorHighlights.js +130 -0
- package/dist/app/lib/blocks/editor/installGutenbergHooks.js +3 -1
- package/dist/app/lib/devtools/components/GridIndicator.js +5 -2
- package/dist/app/lib/internal/finalize-rpc.d.ts +1 -1
- package/dist/node/cli/cli-worker.js +0 -1
- package/dist/node/cli/cli.js +7 -0
- package/dist/node/cli/display/boot-cli-app.js +1 -1
- package/dist/node/cli/version.d.ts +1 -1
- package/dist/node/cli/version.js +1 -1
- package/dist/node/graphql/graphql-codegen.js +1 -1
- package/dist/node/project/config.js +1 -1
- package/dist/node/utils/stateful-log.js +2 -0
- package/package.json +1 -1
|
@@ -7,7 +7,7 @@ export function EditableText({ id, as, appendOnEnter, store, ...props }) {
|
|
|
7
7
|
if (!readOnly) {
|
|
8
8
|
const [value, setValue] = useValueStore(store ?? id);
|
|
9
9
|
const appendBlocks = useBlockAppender();
|
|
10
|
-
return (_jsx(wp.blockEditor.RichText, { ...props, tagName: as, value: value || "", onChange: setValue, inlineToolbar: props.inlineToolbar, disableLineBreaks: props.disableLineBreaks, onKeyDownCapture: (e) => {
|
|
10
|
+
return (_jsx(wp.blockEditor.RichText, { ...props, placeholder: props.placeholder ?? props.defaultValue, tagName: as, value: value || "", onChange: setValue, inlineToolbar: props.inlineToolbar, disableLineBreaks: props.disableLineBreaks, onKeyDownCapture: (e) => {
|
|
11
11
|
if (e.key === "Enter" && appendOnEnter && appendBlocks) {
|
|
12
12
|
appendBlocks([
|
|
13
13
|
wp.blocks.createBlock(typeof appendOnEnter === "string" ? appendOnEnter : "core/paragraph"),
|
|
@@ -0,0 +1,130 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useRef, useState } from "react";
|
|
3
|
+
export function EditorHighlights(props) {
|
|
4
|
+
const ref = useRef(null);
|
|
5
|
+
const [controller, setController] = useState(null);
|
|
6
|
+
// wp.data.select('core/editor').isBlockSelected
|
|
7
|
+
// const isSelected = wp.data.useSelect(
|
|
8
|
+
// (select) => (select("core/editor") as any).isBlockSelected(props.clientId),
|
|
9
|
+
// [props.clientId]
|
|
10
|
+
// )
|
|
11
|
+
useEffect(() => {
|
|
12
|
+
if (!props.enabled)
|
|
13
|
+
return;
|
|
14
|
+
const controller = new HighlightController(ref.current);
|
|
15
|
+
setController(controller);
|
|
16
|
+
return () => controller.teardown();
|
|
17
|
+
}, [props.enabled]);
|
|
18
|
+
useEffect(() => {
|
|
19
|
+
if (controller) {
|
|
20
|
+
controller.isSelected = false;
|
|
21
|
+
controller.updateClasses();
|
|
22
|
+
controller.update();
|
|
23
|
+
}
|
|
24
|
+
}, [controller, false]);
|
|
25
|
+
return (_jsx("div", { ref: ref, style: { display: "contents" }, onPointerEnter: () => controller?.enable(), onPointerLeave: () => controller?.disable(), children: props.children }));
|
|
26
|
+
}
|
|
27
|
+
class HighlightController {
|
|
28
|
+
root;
|
|
29
|
+
enabled = false;
|
|
30
|
+
disposers = [];
|
|
31
|
+
elements = new Map();
|
|
32
|
+
block = null;
|
|
33
|
+
isSelected = false;
|
|
34
|
+
constructor(root) {
|
|
35
|
+
this.root = root;
|
|
36
|
+
}
|
|
37
|
+
setup() {
|
|
38
|
+
this.teardown();
|
|
39
|
+
const updateElements = () => {
|
|
40
|
+
let editables = Array.from(this.root.querySelectorAll("[contenteditable=true], .editable-slot"));
|
|
41
|
+
let childBlocks = Array.from(this.root.querySelectorAll(".wp-block"));
|
|
42
|
+
const childIsSelected = this.root.querySelectorAll(".editor-highlighter-root-selected").length > 0;
|
|
43
|
+
this.block = childBlocks[0];
|
|
44
|
+
childBlocks = childBlocks.slice(1);
|
|
45
|
+
editables = childIsSelected
|
|
46
|
+
? []
|
|
47
|
+
: editables.filter((element) => !childBlocks.some((block) => block.contains(element)));
|
|
48
|
+
let changed = false;
|
|
49
|
+
for (const [el, item] of this.elements) {
|
|
50
|
+
if (!editables.includes(el)) {
|
|
51
|
+
item.observer.disconnect();
|
|
52
|
+
item.overlay.remove();
|
|
53
|
+
this.elements.delete(el);
|
|
54
|
+
changed = true;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
for (let el of editables) {
|
|
58
|
+
if (!this.elements.has(el)) {
|
|
59
|
+
const observer = new ResizeObserver(() => this.update());
|
|
60
|
+
observer.observe(el);
|
|
61
|
+
this.elements.set(el, {
|
|
62
|
+
observer,
|
|
63
|
+
bounds: el.getBoundingClientRect(),
|
|
64
|
+
overlay: this.createOverlay(el),
|
|
65
|
+
});
|
|
66
|
+
changed = true;
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
if (changed) {
|
|
70
|
+
this.update();
|
|
71
|
+
this.updateClasses();
|
|
72
|
+
}
|
|
73
|
+
};
|
|
74
|
+
const mutationObserver = new MutationObserver(() => {
|
|
75
|
+
updateElements();
|
|
76
|
+
});
|
|
77
|
+
updateElements();
|
|
78
|
+
mutationObserver.observe(this.root, { childList: true, subtree: true });
|
|
79
|
+
this.disposers.push(() => {
|
|
80
|
+
mutationObserver.disconnect();
|
|
81
|
+
for (const item of this.elements.values()) {
|
|
82
|
+
item.observer.disconnect();
|
|
83
|
+
item.overlay.remove();
|
|
84
|
+
}
|
|
85
|
+
this.elements = new Map();
|
|
86
|
+
});
|
|
87
|
+
}
|
|
88
|
+
updateClasses() {
|
|
89
|
+
for (const item of this.elements.values()) {
|
|
90
|
+
item.overlay.classList.toggle("editor-highlight-selected", this.isSelected);
|
|
91
|
+
}
|
|
92
|
+
this.root.classList.toggle("editor-highlighter-root-selected", this.enabled);
|
|
93
|
+
}
|
|
94
|
+
createOverlay(target) {
|
|
95
|
+
const el = document.createElement("div");
|
|
96
|
+
el.style.position = "absolute";
|
|
97
|
+
el.style.pointerEvents = "none";
|
|
98
|
+
el.style.zIndex = "20";
|
|
99
|
+
el.className = "editor-highlight";
|
|
100
|
+
this.block.appendChild(el);
|
|
101
|
+
return el;
|
|
102
|
+
}
|
|
103
|
+
teardown() {
|
|
104
|
+
this.disposers.forEach((dispose) => dispose());
|
|
105
|
+
}
|
|
106
|
+
enable() {
|
|
107
|
+
this.enabled = true;
|
|
108
|
+
this.setup();
|
|
109
|
+
this.update();
|
|
110
|
+
this.updateClasses();
|
|
111
|
+
}
|
|
112
|
+
disable() {
|
|
113
|
+
this.enabled = false;
|
|
114
|
+
this.teardown();
|
|
115
|
+
this.update();
|
|
116
|
+
this.updateClasses();
|
|
117
|
+
}
|
|
118
|
+
update() {
|
|
119
|
+
if (!this.block)
|
|
120
|
+
return;
|
|
121
|
+
const rootBounds = this.block.getBoundingClientRect();
|
|
122
|
+
for (const [el, item] of this.elements) {
|
|
123
|
+
const bounds = el.getBoundingClientRect();
|
|
124
|
+
item.overlay.style.left = bounds.left - rootBounds.left + "px";
|
|
125
|
+
item.overlay.style.top = bounds.top - rootBounds.top + "px";
|
|
126
|
+
item.overlay.style.width = bounds.width + "px";
|
|
127
|
+
item.overlay.style.height = bounds.height + "px";
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
}
|
|
@@ -7,6 +7,7 @@ import { BlockContext, EditableBlock } from "./EditorSupport.js";
|
|
|
7
7
|
import { blocksByTag } from "./blocks-by-tag.js";
|
|
8
8
|
import { editorConfigStore, getEditingPostInfo, watchEditorTemplate } from "./editor-config.js";
|
|
9
9
|
import { rootBlocks } from "./root-blocks.js";
|
|
10
|
+
import { EditorHighlights } from "./EditorHighlights.js";
|
|
10
11
|
function listenForHandleResize() {
|
|
11
12
|
let interval = setInterval(() => {
|
|
12
13
|
let viewportTarget = document.querySelector(".interface-interface-skeleton__content");
|
|
@@ -66,6 +67,7 @@ export function installEDGutenbergHooks() {
|
|
|
66
67
|
};
|
|
67
68
|
// Add an 'inline' object attribute, which will hold all inline contents
|
|
68
69
|
item.attributes.inline = { type: "object" };
|
|
70
|
+
item.attributes.values = { type: "object" };
|
|
69
71
|
item.attributes.isFromTemplate = { type: "boolean" };
|
|
70
72
|
item.supports.customClassName = false;
|
|
71
73
|
item.edit = function (props) {
|
|
@@ -87,7 +89,7 @@ export function installEDGutenbergHooks() {
|
|
|
87
89
|
}, []);
|
|
88
90
|
return (_jsx(BlockContext.Provider, { value: { name, props }, children: _jsx(InlineEditingContextProvider, { values: props.attributes.inline || {}, innerBlocks: children, block: [name, props], index: index ?? -1, onChange: (attrs) => {
|
|
89
91
|
props.setAttributes({ ...props.attributes, inline: attrs });
|
|
90
|
-
}, insertBlocksAfter: props.insertBlocksAfter, children: edit.call(self, props) }) }));
|
|
92
|
+
}, insertBlocksAfter: props.insertBlocksAfter, children: _jsx(EditorHighlights, { enabled: true, clientId: props.clientId, children: edit.call(self, props) }) }) }));
|
|
91
93
|
};
|
|
92
94
|
}
|
|
93
95
|
// Find PHP-defined 'tags' for core blocks.
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { useEffect } from "react";
|
|
2
|
+
import { useEffect, useLayoutEffect } from "react";
|
|
3
3
|
import { usePersistState } from "../hooks/usePersistState.js";
|
|
4
4
|
export function GridIndicator() {
|
|
5
5
|
const [enabled, setEnabled] = usePersistState("gridOverlayEnabled", false);
|
|
@@ -18,7 +18,10 @@ export function GridIndicator() {
|
|
|
18
18
|
for (let i = 0; i < 12; i++) {
|
|
19
19
|
cols.push(_jsx("div", { style: { height: "100%", backgroundColor: "rgba(255,0,0,0.1)" } }));
|
|
20
20
|
}
|
|
21
|
+
useLayoutEffect(() => {
|
|
22
|
+
document.documentElement.classList.toggle("debug-grid", enabled);
|
|
23
|
+
}, [enabled]);
|
|
21
24
|
if (!enabled)
|
|
22
25
|
return null;
|
|
23
|
-
return (_jsx("div", { style: { position: "fixed", inset: 0, zIndex: 999999999, pointerEvents: "none" }, children: _jsx("div", { className: "grid-auto", style: { height: "100%" }, children: cols }) }));
|
|
26
|
+
return (_jsx("div", { style: { position: "fixed", inset: 0, zIndex: 999999999, pointerEvents: "none" }, children: _jsx("div", { className: "grid-auto debug-display", style: { height: "100%" }, children: cols }) }));
|
|
24
27
|
}
|
|
@@ -6,7 +6,7 @@ type RouterEntry<T extends RouterTable, U extends AnyTRPCProcedure, P extends st
|
|
|
6
6
|
input: inferProcedureInput<T[K]>;
|
|
7
7
|
output: inferProcedureOutput<T[K]>;
|
|
8
8
|
procedure: T[K] extends AnyTRPCProcedure ? T[K] : never;
|
|
9
|
-
} : T[K] extends Record<string,
|
|
9
|
+
} : T[K] extends Record<string, AnyTRPCProcedure> ? RouterEntry<T[K], U, `${K}.`> : never : never;
|
|
10
10
|
}[keyof T];
|
|
11
11
|
type RouterTypes<T extends RouterTable> = {
|
|
12
12
|
queries: RouterEntry<T, AnyTRPCQueryProcedure>;
|
package/dist/node/cli/cli.js
CHANGED
|
@@ -33,6 +33,13 @@ program
|
|
|
33
33
|
.option("--fast", "Shorthand for --mode graphql,serverless", false)
|
|
34
34
|
.option("--verbose", "Show extra debugging info", false)
|
|
35
35
|
.action(async (options) => {
|
|
36
|
+
console.error = (...args) => { };
|
|
37
|
+
console.log = (...args) => { };
|
|
38
|
+
console.info = (...args) => { };
|
|
39
|
+
console.warn = (...args) => { };
|
|
40
|
+
// if (typeof args[0] === "string" && args[0].includes("NODE_TLS_REJECT_UNAUTHORIZED")) return
|
|
41
|
+
// serverlessLog.error(...args)
|
|
42
|
+
// }
|
|
36
43
|
process.env["NODE_ENV"] = "development";
|
|
37
44
|
/** Ignore self-signed certificate errors in dev mode */
|
|
38
45
|
process.env["NODE_TLS_REJECT_UNAUTHORIZED"] = "0";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const VERSION = "2.0.0-beta.
|
|
1
|
+
export declare const VERSION = "2.0.0-beta.69";
|
package/dist/node/cli/version.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export const VERSION = "2.0.0-beta.
|
|
1
|
+
export const VERSION = "2.0.0-beta.69";
|
|
@@ -290,7 +290,7 @@ export class GraphQLGenerator {
|
|
|
290
290
|
hasDocuments: true,
|
|
291
291
|
banner: `import { ContentBlock } from "eddev/blocks"`,
|
|
292
292
|
footer: Object.keys(wp.scalarTypes)
|
|
293
|
-
.map((name) => `export type ${name}
|
|
293
|
+
.map((name) => `export type ${name.endsWith("Option") ? name : name + "Scalar"} = Scalars["${name}"]["output"]`)
|
|
294
294
|
.join("\n"),
|
|
295
295
|
plugins: {
|
|
296
296
|
typescript: [typescriptPlugin, {}],
|
|
@@ -133,6 +133,8 @@ export class StatefulLog {
|
|
|
133
133
|
this.notifySubscribers();
|
|
134
134
|
}
|
|
135
135
|
addLogEntry(kind, ...messages) {
|
|
136
|
+
// We ignore SSL errors in dev mode.
|
|
137
|
+
// if (typeof messages[0] === "string" && messages[0].includes("NODE_TLS_REJECT_UNAUTHORIZED")) return
|
|
136
138
|
if (cliMode.interactive) {
|
|
137
139
|
const entry = {
|
|
138
140
|
id: getID(),
|