This commit is contained in:
Rizky 2024-01-30 06:08:21 +07:00
parent 148196f626
commit 164bcbf821
9 changed files with 113 additions and 65 deletions

View File

@ -161,11 +161,14 @@ export const code_edit: SAction["code"]["edit"] = async function (
const mprop = mprops?.get(prop_name);
if (mprop) {
try {
const res = await transform(`return ${src}`, {
jsx: "transform",
format: "cjs",
loader: "tsx",
});
const res =
prop_kind !== "typings"
? await transform(`return ${src}`, {
jsx: "transform",
format: "cjs",
loader: "tsx",
})
: { code: src };
doc?.transact(() => {
if (prop_kind === "value") {
mprop.set("value", src);
@ -175,6 +178,8 @@ export const code_edit: SAction["code"]["edit"] = async function (
mprop.set("genBuilt", res.code.substring(6));
} else if (prop_kind === "visible") {
mprop.set("visible", src);
} else if (prop_kind === "typings") {
mprop.set("typings", src);
} else if (prop_kind === "option") {
const meta = mprop.get("meta");
if (meta) {

View File

@ -90,11 +90,13 @@ export const loadCompForPage = async (ctree: IRoot, sync: SyncConnection) => {
userSyncComponent(sync, id);
}
result.add(id);
mcomps[id] = docs.comp[id].doc
.getMap("map")
.get("root")
?.toJSON() as IItem;
if (docs.comp[id]) {
result.add(id);
mcomps[id] = docs.comp[id].doc
.getMap("map")
.get("root")
?.toJSON() as IItem;
}
}
},
}

View File

@ -40,7 +40,7 @@ export const EmptySite = {
export type ESite = typeof EmptySite;
export type EPage = typeof EmptyPage;
export type EComp = typeof EmptyComp;
export type PropFieldKind = "visible" | "gen" | "value" | "option";
export type PropFieldKind = "visible" | "gen" | "value" | "option" | "typings";
export type ISingleScope = {
p: string[];
n: string;

View File

@ -60,11 +60,18 @@ 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);
let mprop = m.mitem?.get("component")?.get("props")?.get(prop_name);
if (!mprop) {
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");
}

View File

@ -8,6 +8,8 @@ import { loadCompSnapshot, loadComponent } from "../comp/load";
import { IMeta, PG, active } from "../ed-global";
import { assignMitem } from "./assign-mitem";
import { pushTreeNode } from "./build/push-tree";
import { createId } from "@paralleldrive/cuid2";
import { FMCompDef } from "../../../../utils/types/meta-fn";
export const treeCacheBuild = async (p: PG, page_id: string) => {
const page_cache = p.preview.page_cache[page_id];
@ -125,14 +127,11 @@ export const treeRebuild = async (p: PG, arg?: { note?: string }) => {
mitem,
meta,
new_prop_jsx(meta, mprops, prop_name, prop_val) {
// if (prop_val.meta?.type === "content-element") {
// 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);
// });
// }
if (!mprops.get(prop_name)) {
const map = new Y.Map();
syncronize(map, prop_val);
mprops.set(prop_name, map as FMCompDef);
}
},
});
}
@ -141,14 +140,6 @@ export const treeRebuild = async (p: PG, arg?: { note?: string }) => {
},
{ item }
);
if (transact.list.length > 0) {
p.page.doc?.transact(() => {
for (const fn of transact.list) {
fn();
}
});
}
}
}
@ -183,7 +174,3 @@ export const treeRebuild = async (p: PG, arg?: { note?: string }) => {
}
}
};
const transact = {
list: [] as (() => void)[],
};

View File

@ -44,6 +44,8 @@ async () => {
}`;
} else if (kind === "visible") {
val = mprop.get("visible") || "true";
} else if (kind === "typings") {
val = mprop.get("typings") || "const typings = {}";
} else if (kind === "option") {
val =
mprop.get("meta")?.get("options") ||

View File

@ -16,6 +16,7 @@ import { declareScope } from "./scope/scope";
// @ts-ignore
import { constrainedEditor } from "constrained-editor-plugin/dist/esm/constrainedEditor";
import { addScope } from "./scope/add-scope";
import { FNCompDef } from "../../../../../utils/types/meta-fn";
const scriptEdit = {
timeout: null as any,
@ -95,6 +96,7 @@ export const EdScriptMonaco: FC<{}> = () => {
}
}
}
if (p.ui.popup.script.mode === "js") {
const w = window as any;
const types: any = {};
@ -109,20 +111,20 @@ export const EdScriptMonaco: FC<{}> = () => {
}
}
await monacoTypings(
{
site_dts: p.site_dts,
script: {
siteTypes: p.script.site_types,
},
site: p.site.config,
},
monaco,
{
types,
values: {},
let component = { id: "", props: {} as Record<string, FNCompDef> };
if (meta?.item.component?.id && meta.item.component.props) {
component.id = meta.item.component.id;
component.props = meta.item.component.props;
}
if (meta?.parent?.comp_id && meta.parent.instance_id) {
const comp_meta = p.page.meta[meta.parent.instance_id];
if (comp_meta && comp_meta.item.component?.id) {
component.id = comp_meta.item.component.id;
component.props = comp_meta.item.component.props;
}
);
}
if (meta) {
switch (type) {
case "prop-master":
@ -143,25 +145,24 @@ export const EdScriptMonaco: FC<{}> = () => {
monaco.Uri.parse("file:///active.tsx")
);
editor.setModel(nmodel);
const constrainedInstance = constrainedEditor(monaco);
constrainedInstance.initializeIn(editor);
const model = editor.getModel();
constrainedInstance.removeRestrictionsIn(model);
const frange = model?.getFullModelRange();
if (frange) {
// const ranges = [
// {
// range: [
// end_hide + 1,
// `export const ${p.ui.popup.script.prop_name} = `
// .length,
// frange.getEndPosition().lineNumber,
// frange.getEndPosition().column,
// ],
// allowMultiline: true,
// },
// ];
// constrainedInstance.addRestrictionsTo(model, ranges);
if (component.id) {
const prop_name = p.ui.popup.script.prop_name;
const prop = component.props[prop_name];
if (typeof prop.typings === "string") {
const typings_src = prop.typings.substring(
`const typings = `.length
);
const typings_fn = new Function(
`return ${typings_src}`
);
const typings = typings_fn();
for (const [k, v] of Object.entries(typings)) {
if (typeof v === "string") {
types[k] = v;
}
}
}
}
}
break;
@ -199,10 +200,44 @@ export const EdScriptMonaco: FC<{}> = () => {
const range = new monaco.Range(1, 1, end_hide, 1);
(editor as any).setHiddenAreas([range]);
}
if (component.id && meta.jsx_prop?.name) {
const prop_name = meta.jsx_prop.name;
const prop = component.props[prop_name];
if (typeof prop.typings === "string") {
const typings_src = prop.typings.substring(
`const typings = `.length
);
const typings_fn = new Function(
`return ${typings_src}`
);
const typings = typings_fn();
for (const [k, v] of Object.entries(typings)) {
if (typeof v === "string") {
types[k] = v;
}
}
}
}
}
break;
}
}
await monacoTypings(
{
site_dts: p.site_dts,
script: {
siteTypes: p.script.site_types,
},
site: p.site.config,
},
monaco,
{
types,
values: {},
}
);
await jsMount(editor, monaco, p);
} else {
const model = monaco.editor.createModel(
@ -362,7 +397,6 @@ export const EdScriptMonaco: FC<{}> = () => {
scope = code_result;
}
} else {
console.log(value);
const code_result = await p.sync.code.edit({
type: "adv",
mode: mode,

View File

@ -232,6 +232,16 @@ export const EdPropPopoverForm: FC<{
</div>
</div>
)}
<div className="border-t border-slate-300 pl-2 pt-1 flex justify-between items-center">
<div className="uppercase text-xs">TYPINGS</div>
<div
className="m-1 px-1 bg-white cursor-pointer hover:bg-blue-500 hover:text-white hover:border-blue-500 font-mono border border-slate-300 text-[11px]"
onClick={createEditScript(p, "typings", mprop, name)}
>
EDIT CODE
</div>
</div>
</div>
);
};

View File

@ -25,6 +25,7 @@ export type FNComponent = {
export type FNCompDef = {
idx: number;
typings: string;
type: string;
value: any;
valueBuilt: any;