wip fix compo
This commit is contained in:
parent
a353226816
commit
b8808d679a
|
|
@ -94,7 +94,7 @@ export const reloadPage = async (p: PG, page_id: string, note: string) => {
|
|||
Buffer.from(compress(diff_local))
|
||||
);
|
||||
p.ui.syncing = false;
|
||||
p.render();
|
||||
// p.render();
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -18,6 +18,7 @@ export const assignMitem = (arg: {
|
|||
}) => {
|
||||
const { p, m, root, mitem, meta } = arg;
|
||||
|
||||
console.log(m.item.name, m.item.id);
|
||||
if (m.jsx_prop && m.parent?.instance_id) {
|
||||
const instance_meta = meta[m.parent?.instance_id];
|
||||
if (instance_meta) {
|
||||
|
|
@ -59,32 +60,25 @@ export const assignMitem = (arg: {
|
|||
}
|
||||
}
|
||||
|
||||
// if (m.item.component?.props) {
|
||||
// for (const [prop_name, v] of Object.entries(
|
||||
// m.item.component.props
|
||||
// )) {
|
||||
// const mprop = m.mitem
|
||||
// ?.get("component")
|
||||
// ?.get("props")
|
||||
// ?.get(prop_name);
|
||||
if (m.item.component?.props) {
|
||||
for (const [prop_name, v] of Object.entries(m.item.component.props)) {
|
||||
const mprop = m.mitem?.get("component")?.get("props")?.get(prop_name);
|
||||
|
||||
// if (v.content) {
|
||||
// if (mprop) {
|
||||
// const pmeta = meta[v.content.id];
|
||||
// if (pmeta) {
|
||||
// pmeta.mitem = mprop.get("content");
|
||||
// }
|
||||
// } else {
|
||||
// const mprops = m.mitem?.get("component")?.get("props");
|
||||
// if (mprops) {
|
||||
// arg.new_prop_jsx(m, mprops, prop_name, v);
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
if (v.content) {
|
||||
if (mprop) {
|
||||
const pmeta = meta[v.content.id];
|
||||
if (pmeta) {
|
||||
pmeta.mitem = mprop.get("content");
|
||||
}
|
||||
} else {
|
||||
const mprops = m.mitem?.get("component")?.get("props");
|
||||
if (mprops) {
|
||||
arg.new_prop_jsx(m, mprops, prop_name, v);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -49,7 +49,6 @@ export const treeRebuild = async (p: PG, arg?: { note?: string }) => {
|
|||
if (!is_layout) {
|
||||
if (m.parent?.instance_id !== m.parent?.id || m.jsx_prop) {
|
||||
pushTreeNode(p, m, meta, p.page.tree);
|
||||
} else {
|
||||
}
|
||||
|
||||
assignMitem({
|
||||
|
|
@ -59,14 +58,13 @@ export const treeRebuild = async (p: PG, arg?: { note?: string }) => {
|
|||
mitem,
|
||||
meta,
|
||||
new_prop_jsx(meta, mprops, prop_name, prop_val) {
|
||||
transact.list.push(() => {
|
||||
const map = new Y.Map();
|
||||
|
||||
if (prop_val.content) prop_val.content.id = createId();
|
||||
|
||||
syncronize(map, prop_val);
|
||||
mprops.set(prop_name, map as any);
|
||||
});
|
||||
console.log(meta, mprops, prop_name, prop_val);
|
||||
// transact.list.push(() => {
|
||||
// const map = new Y.Map();
|
||||
// if (prop_val.content) prop_val.content.id = createId();
|
||||
// syncronize(map, prop_val);
|
||||
// mprops.set(prop_name, map as any);
|
||||
// });
|
||||
},
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import { NodeModel } from "@minoru/react-dnd-treeview";
|
||||
import { IMeta, PG, active } from "../../ed-global";
|
||||
import { IMeta, PG } from "../../ed-global";
|
||||
|
||||
export const pushTreeNode = (
|
||||
p: PG,
|
||||
|
|
@ -43,7 +43,7 @@ export const pushTreeNode = (
|
|||
tree.push({
|
||||
id: meta.item.id,
|
||||
parent: meta.parent?.instance_id || "root",
|
||||
text: meta.item.name,
|
||||
text: meta.jsx_prop.name,
|
||||
data: meta,
|
||||
});
|
||||
} else {
|
||||
|
|
|
|||
|
|
@ -109,7 +109,9 @@ export const EdScriptMonaco: FC<{}> = () => {
|
|||
const model = editor.getModel();
|
||||
if (!model) {
|
||||
const nmodel = monaco.editor.createModel(
|
||||
val,
|
||||
imports && imports.length > 0
|
||||
? `${imports}\n/** IMPORT MODULE **/\n${val}`
|
||||
: val,
|
||||
"typescript",
|
||||
monaco.Uri.parse("file:///active.tsx")
|
||||
);
|
||||
|
|
|
|||
|
|
@ -93,7 +93,6 @@ const extract_import_map = (
|
|||
added.add(m.item.id);
|
||||
|
||||
const ex = extractExport(p, m);
|
||||
|
||||
for (const [k, v] of Object.entries(ex)) {
|
||||
let src = "";
|
||||
if (v.type === "local") {
|
||||
|
|
@ -105,6 +104,7 @@ export const ${k}: typeof _local & { render: ()=>void } = _local;
|
|||
src = `export const ${k} = ${v.val}`;
|
||||
}
|
||||
if (src) {
|
||||
|
||||
addScope(
|
||||
p,
|
||||
monaco,
|
||||
|
|
@ -180,7 +180,6 @@ const map_childs = (
|
|||
);
|
||||
|
||||
jprop = comp_map[meta.item.component.id];
|
||||
//todo: comp prop src: import from page scope
|
||||
for (const path of jprop.paths) {
|
||||
for (const m of path) {
|
||||
if (!jprop.exports[m.item.id]) {
|
||||
|
|
|
|||
|
|
@ -23,6 +23,10 @@ export const EdPropCompTreeItem: FC<{
|
|||
if (node.id === "root") {
|
||||
return <></>;
|
||||
}
|
||||
|
||||
let type = "TXT";
|
||||
if (node.data?.prop.meta?.type === "option") type = "OPT";
|
||||
else if (node.data?.prop.meta?.type === "content-element") type = "JSX";
|
||||
return (
|
||||
<div className="flex items-stretch border-b text-[14px] min-h-[27px]">
|
||||
<div
|
||||
|
|
@ -74,7 +78,12 @@ export const EdPropCompTreeItem: FC<{
|
|||
}
|
||||
className="flex-1 pl-1 hover:bg-blue-100 cursor-pointer items-center flex"
|
||||
>
|
||||
{node.text}
|
||||
<div className="flex items-center justify-between flex-1">
|
||||
<div>{node.text}</div>
|
||||
<div className="text-[9px] px-1 border border-slate-400 ml-1 text-slate-500">
|
||||
{type}
|
||||
</div>
|
||||
</div>
|
||||
</Popover>
|
||||
)}
|
||||
<div
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ export const EdSideStyle: FC<{ meta: IMeta }> = ({ meta }) => {
|
|||
<div className="flex flex-col text-[12px]">
|
||||
<div className="flex border-b p-1 h-[28px] items-center bg-slate-50 justify-between select-none">
|
||||
<div className="flex-1 overflow-hidden mr-2 text-ellipsis whitespace-nowrap">
|
||||
{item.name}
|
||||
{meta.jsx_prop?.name || item.name}
|
||||
</div>
|
||||
{item.component?.id === active.comp_id && (
|
||||
<div
|
||||
|
|
|
|||
|
|
@ -86,6 +86,15 @@ export const EdTreeBody = () => {
|
|||
if (!args.dragSource?.data?.item) return false;
|
||||
return canDrop(p, args);
|
||||
}}
|
||||
canDrag={(node) => {
|
||||
if (node) {
|
||||
if (node.data?.jsx_prop?.is_root) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
return true;
|
||||
}}
|
||||
dragPreviewRender={DragPreview}
|
||||
placeholderRender={(node, params) => (
|
||||
<Placeholder node={node} params={params} />
|
||||
|
|
|
|||
|
|
@ -127,7 +127,7 @@ export const EdTreeAction = ({
|
|||
)}
|
||||
{comp.id === active.comp_id && (
|
||||
<>
|
||||
<Tooltip content="Edit Component">
|
||||
<Tooltip content="Close Component">
|
||||
<div
|
||||
className="flex items-center border border-slate-500 bg-white rounded-sm text-[10px] px-[2px] cursor-pointer hover:bg-purple-100 hover:border-purple-600"
|
||||
onClick={(e) => {
|
||||
|
|
|
|||
|
|
@ -104,9 +104,9 @@ export const EdTreeName = ({
|
|||
) : (
|
||||
<div className="flex flex-col">
|
||||
<Name name={node.text} is_jsx_prop={is_jsx_prop} />
|
||||
<div className={"text-[9px] text-gray-500 -mt-1"}>
|
||||
{/* <div className={"text-[9px] text-gray-500 -mt-1"}>
|
||||
{node.id} - {item.originalId}
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -48,32 +48,14 @@ export const genComp = (p: GenMetaP, arg: GenMetaArg) => {
|
|||
},
|
||||
};
|
||||
|
||||
if (item.id) {
|
||||
if (p.set_meta !== false) {
|
||||
p.meta[item.id] = meta;
|
||||
}
|
||||
}
|
||||
|
||||
if (p.on?.visit) {
|
||||
p.on.visit(meta, item);
|
||||
}
|
||||
|
||||
for (const child of Object.values(item.childs)) {
|
||||
if (child.name.startsWith("jsx:")) continue;
|
||||
|
||||
genMeta(
|
||||
{ ...p, mode: "comp" },
|
||||
{
|
||||
item: child,
|
||||
is_root: false,
|
||||
parent: {
|
||||
item,
|
||||
instance_id: item.id,
|
||||
root_instances: instances,
|
||||
comp: item_comp,
|
||||
},
|
||||
if (item.id) {
|
||||
if (p.set_meta !== false) {
|
||||
p.meta[item.id] = meta;
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
walkProp({
|
||||
|
|
@ -85,6 +67,8 @@ export const genComp = (p: GenMetaP, arg: GenMetaArg) => {
|
|||
|
||||
if (prop.meta?.type === "content-element" && comp_id) {
|
||||
if (prop.content) {
|
||||
prop.content.name = name;
|
||||
|
||||
genMeta(
|
||||
{ ...p },
|
||||
{
|
||||
|
|
@ -107,6 +91,25 @@ export const genComp = (p: GenMetaP, arg: GenMetaArg) => {
|
|||
}
|
||||
},
|
||||
});
|
||||
|
||||
for (const child of Object.values(item.childs)) {
|
||||
if (child.name.startsWith("jsx:")) continue;
|
||||
|
||||
genMeta(
|
||||
{ ...p, mode: "comp" },
|
||||
{
|
||||
item: child,
|
||||
is_root: false,
|
||||
parent: {
|
||||
item,
|
||||
instance_id: item.id,
|
||||
root_instances: instances,
|
||||
comp: item_comp,
|
||||
},
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -23,8 +23,6 @@ export const viEvalScript = (
|
|||
|
||||
if (vi.visit) vi.visit(meta, parts);
|
||||
|
||||
const mhash = hash_sum(flatten(passprop));
|
||||
|
||||
if (!meta.script) {
|
||||
meta.script = {
|
||||
passprop,
|
||||
|
|
@ -76,5 +74,4 @@ ${meta.item.adv?.jsBuilt || ""}
|
|||
fn(...Object.values(arg));
|
||||
|
||||
updatePropScope(meta, passprop);
|
||||
return mhash;
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue