wip fix jsx prop scope
This commit is contained in:
parent
fde0be57eb
commit
ec85c9c981
|
|
@ -11,9 +11,17 @@ export const EdMain = () => {
|
|||
first_load: false,
|
||||
});
|
||||
|
||||
const meta = active.comp_id
|
||||
? p.comp.list[active.comp_id].meta[active.item_id]
|
||||
: p.page.meta[active.item_id];
|
||||
let meta: undefined | IMeta = undefined;
|
||||
|
||||
if (active.comp_id) {
|
||||
if (p.comp.list[active.comp_id]) {
|
||||
meta = p.comp.list[active.comp_id].meta[active.item_id];
|
||||
} else {
|
||||
active.comp_id = "";
|
||||
}
|
||||
} else {
|
||||
meta = p.page.meta[active.item_id];
|
||||
}
|
||||
|
||||
if (active.should_render_main) {
|
||||
local.cache = (
|
||||
|
|
|
|||
|
|
@ -142,10 +142,11 @@ export const EdScriptMonaco: FC<{}> = () => {
|
|||
if (imports) {
|
||||
local.imports = imports;
|
||||
end_hide = imports.split("\n").length + 1;
|
||||
const range = new monaco.Range(1, 0, end_hide, 0);
|
||||
(editor as any).setHiddenAreas([range]);
|
||||
// const range = new monaco.Range(1, 0, end_hide, 0);
|
||||
// (editor as any).setHiddenAreas([range]);
|
||||
}
|
||||
}
|
||||
editor.trigger("fold", "editor.foldAllMarkerRegions", {});
|
||||
await jsMount(editor, monaco, p);
|
||||
|
||||
if (type === "prop-instance") {
|
||||
|
|
|
|||
|
|
@ -13,18 +13,18 @@ export const addScope = (
|
|||
});
|
||||
|
||||
if (model) {
|
||||
if (model.getValue() !== source) {
|
||||
model.setValue(source);
|
||||
}
|
||||
} else {
|
||||
const uri = monaco.Uri.parse(filename);
|
||||
const model = monaco.editor.createModel(source, "typescript", uri);
|
||||
|
||||
const arg = extractLoc(uri.path.split("_"), p);
|
||||
model.onDidChangeContent((e) => {
|
||||
if (arg.id !== active.item_id) {
|
||||
const text = model.getValue();
|
||||
console.log(arg);
|
||||
console.warn(text);
|
||||
}
|
||||
// if (arg.id !== active.item_id && arg.type === "src") {
|
||||
// console.log("changed", arg.id, e.changes);
|
||||
// }
|
||||
});
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -37,6 +37,19 @@ export const extractExport = (p: PG, m: IMeta) => {
|
|||
}
|
||||
}
|
||||
|
||||
if (m.script?.passprop) {
|
||||
for (const [k, v] of Object.entries(m.script.passprop)) {
|
||||
if (k === "key") continue;
|
||||
result[k] = {
|
||||
type: "passprop",
|
||||
id: m.item.id,
|
||||
start: 0,
|
||||
end: 0,
|
||||
val: "null as any",
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
if (script?.props) {
|
||||
for (const [k, v] of Object.entries(script.props)) {
|
||||
result[k] = {
|
||||
|
|
|
|||
|
|
@ -34,6 +34,7 @@ export const declareScope = (p: PG, meta: IMeta, monaco: Monaco) => {
|
|||
paths,
|
||||
meta,
|
||||
p,
|
||||
false,
|
||||
monaco
|
||||
);
|
||||
|
||||
|
|
@ -94,17 +95,28 @@ const extract_import_map = (
|
|||
paths: IMeta[][],
|
||||
meta: IMeta,
|
||||
p: PG,
|
||||
include_cur?: boolean,
|
||||
monaco?: Monaco
|
||||
) => {
|
||||
const added = new Set<string>();
|
||||
let parent_id = "";
|
||||
const import_map = {} as Record<string, string>;
|
||||
const cur_id = meta.item.id;
|
||||
let cur_id = meta.item.id;
|
||||
|
||||
if (cur_id) {
|
||||
for (const path of paths) {
|
||||
const imports = new Set<string>();
|
||||
const import_exists = {} as Record<
|
||||
string,
|
||||
{ type: "prop" | "local" | "passprop"; str: string }
|
||||
>;
|
||||
|
||||
if (path.map((e) => e.item.id).includes(cur_id)) {
|
||||
if (
|
||||
path
|
||||
.map((e) => {
|
||||
return e.item.id;
|
||||
})
|
||||
.includes(cur_id)
|
||||
) {
|
||||
let i = 0;
|
||||
|
||||
let prev_m = null as any;
|
||||
|
|
@ -113,7 +125,7 @@ const extract_import_map = (
|
|||
if (prev_m) parent_id = prev_m.item.id;
|
||||
}
|
||||
prev_m = m;
|
||||
if (!added.has(m.item.id)) {
|
||||
if (include_cur || (!include_cur && !added.has(m.item.id))) {
|
||||
added.add(m.item.id);
|
||||
|
||||
const ex = extractExport(p, m);
|
||||
|
|
@ -127,13 +139,14 @@ export const ${k}: typeof _local & { render: ()=>void } = _local;
|
|||
} else {
|
||||
src = `export const ${k} = ${v.val}`;
|
||||
}
|
||||
|
||||
if (src && monaco) {
|
||||
addScope(
|
||||
p,
|
||||
monaco,
|
||||
`file:///${cur}_${v.id}_${v.type}_${k}.tsx`,
|
||||
`\
|
||||
${[...imports].join("\n")}
|
||||
${[...Object.values(import_exists).map((e) => e.str)].join("\n")}
|
||||
/** IMPORT MODULE **/
|
||||
${src}`
|
||||
);
|
||||
|
|
@ -142,18 +155,22 @@ ${src}`
|
|||
|
||||
for (const [k, v] of Object.entries(ex)) {
|
||||
if (
|
||||
!include_cur &&
|
||||
m.item.id === cur_id &&
|
||||
["local", "passprop"].includes(v.type)
|
||||
) {
|
||||
continue;
|
||||
}
|
||||
|
||||
imports.add(
|
||||
`import { ${k} } from './${cur}_${v.id}_${v.type}_${k}';`
|
||||
);
|
||||
import_exists[k] = {
|
||||
type: v.type,
|
||||
str: `import { ${k} } from './${cur}_${v.id}_${v.type}_${k}';`,
|
||||
};
|
||||
}
|
||||
|
||||
import_map[m.item.id] = [...imports].join("\n");
|
||||
import_map[m.item.id] = [
|
||||
...Object.values(import_exists).map((e) => e.str),
|
||||
].join("\n");
|
||||
}
|
||||
i++;
|
||||
}
|
||||
|
|
@ -185,87 +202,92 @@ const map_childs = (
|
|||
const meta = metas[m.id];
|
||||
if (meta) {
|
||||
paths.push([...(curpath || []), meta]);
|
||||
if (
|
||||
meta.item.type === "item" &&
|
||||
meta.item.component?.id &&
|
||||
!skip_comp_id.includes(meta.item.component?.id)
|
||||
) {
|
||||
const comp_id = meta.item.component.id;
|
||||
let jprop = comp_map[comp_id];
|
||||
if (!jprop) {
|
||||
const comp_metas = p.comp.list[comp_id].meta;
|
||||
comp_map[meta.item.component.id] = {
|
||||
paths: [],
|
||||
exports: {},
|
||||
};
|
||||
const id = p.comp.list[comp_id].doc
|
||||
.getMap("map")
|
||||
.get("root")
|
||||
?.get("id");
|
||||
// if (
|
||||
// meta.item.type === "item" &&
|
||||
// meta.item.component?.id &&
|
||||
// !skip_comp_id.includes(meta.item.component?.id)
|
||||
// ) {
|
||||
// const comp_id = meta.item.component.id;
|
||||
// let jprop = comp_map[comp_id];
|
||||
// // if (!jprop) {
|
||||
// // const comp_metas = p.comp.list[comp_id].meta;
|
||||
// // comp_map[meta.item.component.id] = {
|
||||
// // paths: [],
|
||||
// // exports: {},
|
||||
// // };
|
||||
// // const id = p.comp.list[comp_id].doc
|
||||
// // .getMap("map")
|
||||
// // .get("root")
|
||||
// // ?.get("id");
|
||||
|
||||
if (id) {
|
||||
map_childs(
|
||||
monaco,
|
||||
p,
|
||||
comp_metas,
|
||||
[comp_metas[id].item],
|
||||
comp_map[meta.item.component.id].paths,
|
||||
[...skip_comp_id, comp_id]
|
||||
);
|
||||
// // if (id) {
|
||||
// // map_childs(
|
||||
// // monaco,
|
||||
// // p,
|
||||
// // comp_metas,
|
||||
// // [comp_metas[id].item],
|
||||
// // comp_map[meta.item.component.id].paths,
|
||||
// // [...skip_comp_id, comp_id]
|
||||
// // );
|
||||
|
||||
jprop = comp_map[meta.item.component.id];
|
||||
for (const path of jprop.paths) {
|
||||
for (const m of path) {
|
||||
if (!jprop.exports[m.item.id]) {
|
||||
jprop.exports[m.item.id] = extractExport(p, m);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// // jprop = comp_map[meta.item.component.id];
|
||||
// // for (const path of jprop.paths) {
|
||||
// // for (const m of path) {
|
||||
// // if (!jprop.exports[m.item.id]) {
|
||||
// // jprop.exports[m.item.id] = extractExport(p, m);
|
||||
// // }
|
||||
// // }
|
||||
// // }
|
||||
// // }
|
||||
// // }
|
||||
|
||||
if (jprop) {
|
||||
for (const [name, prop] of Object.entries(
|
||||
meta.item.component.props
|
||||
)) {
|
||||
if (
|
||||
prop.meta?.type === "content-element" &&
|
||||
prop.content &&
|
||||
prop.jsxCalledBy
|
||||
) {
|
||||
const mjsx = p.comp.list[comp_id].meta[prop.jsxCalledBy[0]];
|
||||
const { import_map, parent_id } = extract_import_map(
|
||||
meta.item.component.id,
|
||||
jprop.paths,
|
||||
mjsx,
|
||||
p,
|
||||
monaco
|
||||
);
|
||||
// if (jprop) {
|
||||
// for (const [name, prop] of Object.entries(
|
||||
// meta.item.component.props
|
||||
// )) {
|
||||
// if (
|
||||
// prop.meta?.type === "content-element" &&
|
||||
// prop.content &&
|
||||
// prop.jsxCalledBy
|
||||
// ) {
|
||||
// const m = metas[prop.jsxCalledBy[0]];
|
||||
// if (m && m.instances) {
|
||||
// const instances = m.instances[prop.jsxCalledBy[0]];
|
||||
// if (instances) {
|
||||
// const instance_id = instances[prop.jsxCalledBy[1]];
|
||||
// if (instance_id) {
|
||||
// const mjsx = metas[instance_id];
|
||||
|
||||
gen_content(
|
||||
meta.item.component.id,
|
||||
p,
|
||||
jprop.paths,
|
||||
import_map,
|
||||
monaco
|
||||
);
|
||||
// const { import_map, parent_id } = extract_import_map(
|
||||
// "page",
|
||||
// jprop.paths,
|
||||
// mjsx,
|
||||
// p,
|
||||
// true,
|
||||
// monaco
|
||||
// );
|
||||
|
||||
jsxprop_import_map[prop.content.id] = import_map[parent_id];
|
||||
const prop_meta = metas[prop.content.id];
|
||||
map_childs(
|
||||
monaco,
|
||||
p,
|
||||
metas,
|
||||
prop.content.childs,
|
||||
paths,
|
||||
[...skip_comp_id, comp_id],
|
||||
jsxprop_import_map,
|
||||
[...(curpath || []), prop_meta]
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
// gen_content("page", p, jprop.paths, import_map, monaco);
|
||||
|
||||
// jsxprop_import_map[prop.content.id] = import_map[parent_id];
|
||||
// const prop_meta = metas[prop.content.id];
|
||||
// map_childs(
|
||||
// monaco,
|
||||
// p,
|
||||
// metas,
|
||||
// prop.content.childs,
|
||||
// paths,
|
||||
// [...skip_comp_id, comp_id],
|
||||
// jsxprop_import_map,
|
||||
// [...(curpath || []), prop_meta]
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// } else {
|
||||
if (Array.isArray(meta.item.childs)) {
|
||||
map_childs(
|
||||
monaco,
|
||||
|
|
@ -278,7 +300,7 @@ const map_childs = (
|
|||
[...(curpath || []), meta]
|
||||
);
|
||||
}
|
||||
}
|
||||
// }
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -49,6 +49,7 @@ export const genComp = (p: GenMetaP, arg: GenMetaArg) => {
|
|||
comp_id: arg.parent?.comp?.component?.id,
|
||||
instance_id: arg.parent?.instance_id,
|
||||
},
|
||||
instances,
|
||||
};
|
||||
|
||||
if (p.on?.visit) {
|
||||
|
|
|
|||
|
|
@ -35,11 +35,21 @@ export const viEvalProps = (
|
|||
const id = prop.content?.id;
|
||||
if (id) {
|
||||
const m = vi.meta[id];
|
||||
|
||||
const instances = meta.instances;
|
||||
if (!arg.meta.item.originalId || !instances) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const instance = instances[meta.item.id];
|
||||
if (!instance) return null;
|
||||
const original_id = arg.meta.item.originalId;
|
||||
if (
|
||||
m.mitem &&
|
||||
prop.jsxCalledBy?.includes(
|
||||
arg.meta.item.originalId || arg.meta.item.id
|
||||
)
|
||||
((prop.jsxCalledBy &&
|
||||
(!prop.jsxCalledBy.includes(original_id) ||
|
||||
prop.jsxCalledBy.length !== 2)) ||
|
||||
!prop.jsxCalledBy)
|
||||
) {
|
||||
const mprop = meta.mitem
|
||||
?.get("component")
|
||||
|
|
@ -48,19 +58,15 @@ export const viEvalProps = (
|
|||
if (mprop) {
|
||||
let mjby = mprop.get("jsxCalledBy");
|
||||
if (!mjby || typeof mjby !== "object") {
|
||||
mprop.set("jsxCalledBy", [
|
||||
arg.meta.item.originalId || arg.meta.item.id,
|
||||
]);
|
||||
mprop.set("jsxCalledBy", [meta.item.id, original_id]);
|
||||
} else {
|
||||
if (
|
||||
!mjby.includes(
|
||||
arg.meta.item.originalId || arg.meta.item.id
|
||||
)
|
||||
!mjby.includes(original_id) ||
|
||||
mjby.length !== 2 ||
|
||||
mjby[0] !== meta.item.id ||
|
||||
mjby[1] !== original_id
|
||||
) {
|
||||
mjby.push(
|
||||
arg.meta.item.originalId || arg.meta.item.id
|
||||
);
|
||||
mprop.set("jsxCalledBy", mjby);
|
||||
mprop.set("jsxCalledBy", [meta.item.id, original_id]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,14 +7,22 @@ import { watch } from "fs";
|
|||
import mime from "mime";
|
||||
import { g } from "utils/global";
|
||||
|
||||
const webPath = "app/static";
|
||||
const web = {
|
||||
get path() {
|
||||
if (g.mode === "dev") return "static";
|
||||
return "static-br";
|
||||
},
|
||||
};
|
||||
const cache = {
|
||||
static: {} as Record<string, { type: string; content: any }>,
|
||||
static: {} as Record<
|
||||
string,
|
||||
{ type: string; content: any; compression: "" | "br" }
|
||||
>,
|
||||
};
|
||||
|
||||
export const serveStatic = {
|
||||
init: async () => {
|
||||
const list = await inspectTreeAsync(dir.path(`${webPath}`));
|
||||
const list = await inspectTreeAsync(dir.path(`app/${web.path}`));
|
||||
const walk = async (
|
||||
list: InspectTreeResult,
|
||||
parent?: InspectTreeResult[]
|
||||
|
|
@ -27,8 +35,9 @@ export const serveStatic = {
|
|||
const path = join(...(parent || []).map((e) => e.name), list.name);
|
||||
const file = Bun.file(dir.path(`app/${path}`));
|
||||
if (await file.exists()) {
|
||||
cache.static[path.substring("static".length)] = {
|
||||
cache.static[path.substring(web.path.length)] = {
|
||||
type: mime.getType(path) || "application/octet-stream",
|
||||
compression: g.mode === "prod" ? "br" : "",
|
||||
content: await file.arrayBuffer(),
|
||||
};
|
||||
}
|
||||
|
|
@ -46,6 +55,7 @@ export const serveStatic = {
|
|||
if (await file.exists()) {
|
||||
cache.static[`/${filename}`] = {
|
||||
type: mime.getType(path) || "application/octet-stream",
|
||||
compression: g.mode === "prod" ? "br" : "",
|
||||
content: await file.arrayBuffer(),
|
||||
};
|
||||
}
|
||||
|
|
@ -57,17 +67,23 @@ export const serveStatic = {
|
|||
return !!cache.static[url.pathname];
|
||||
},
|
||||
serve: (url: URL) => {
|
||||
const file = cache.static[url.pathname];
|
||||
let file = cache.static[url.pathname];
|
||||
if (file) {
|
||||
return new Response(file.content, {
|
||||
headers: { "content-type": file.type },
|
||||
headers: {
|
||||
...{ "content-type": file.type },
|
||||
...(file.compression ? { "content-encoding": file.compression } : {}),
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
const index = cache.static["/index.html"];
|
||||
if (index) {
|
||||
return new Response(index.content, {
|
||||
headers: { "content-type": index.type },
|
||||
file = cache.static["/index.html"];
|
||||
if (file) {
|
||||
return new Response(file.content, {
|
||||
headers: {
|
||||
...{ "content-type": file.type },
|
||||
...(file.compression ? { "content-encoding": file.compression } : {}),
|
||||
},
|
||||
});
|
||||
}
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue