miqro 7.2.7 → 7.2.9

package/build/esm/editor/components/file-editor.d.ts

@@ -0,0 +1,32 @@
+interface FileEditorProps {
+    current: boolean;
+    error: string;
+    path: string;
+    previewPath: string | undefined;
+    apiPreview: undefined | {
+        path: string;
+        method: string;
+    }[];
+    content: string | null;
+    contentchange: (content: string) => void;
+    closeFile: () => void;
+    saveFile: (reload?: boolean) => void;
+    revertFile: () => void;
+    deleteFile: () => void;
+    renameFile: (newName: any) => void;
+    setlanguage: (newLanguage: any) => void;
+    language: string;
+    changed: boolean;
+    reloadString: string;
+    togglePanel: (panel: string) => void;
+    isPanelVisible: (panel: string) => boolean;
+    disableLog?: boolean;
+    disablePreview?: boolean;
+    disableReload?: boolean;
+}
+export declare function FileEditor({ disableLog, disablePreview, disableReload, togglePanel, isPanelVisible, apiPreview, reloadString, error, revertFile, changed, setlanguage, saveFile, deleteFile, renameFile, current, path, previewPath, content, contentchange, closeFile, language }: FileEditorProps): JSX.Element;
+export declare namespace FileEditor {
+    var asFragment: boolean;
+    var shadowInit: boolean;
+}
+export {};

package/build/esm/editor/components/file-editor.js

@@ -0,0 +1,61 @@
+import * as jsx from "@miqro/jsx";
+import JSX from "@miqro/jsx";
+import { APIPReview } from "./api-preview.js";
+import { FileEditorToolbar } from "./file-editor-toolbar.js";
+import { HighlightTextArea } from "./highlight-text-area.js";
+import { useScroll } from "./scroll-query.js";
+export function FileEditor({ disableLog, disablePreview, disableReload, togglePanel, isPanelVisible, apiPreview, reloadString, error, revertFile, changed, setlanguage, saveFile, deleteFile, renameFile, current, path, previewPath, content, contentchange, closeFile, language }) {
+    //console.log("FileEditor [%s]", path);
+    const iFrameRef = jsx.useRef();
+    const scrollRef = jsx.useRef();
+    const [scroll, setScroll] = useScroll();
+    jsx.useEffect(() => {
+        if (scrollRef.current) {
+            scrollRef.current.scrollLeft = scroll.scrollLeft;
+            scrollRef.current.scrollTop = scroll.scrollTop;
+        }
+    }, [scrollRef.current]);
+    jsx.useEffect(() => {
+        if (current && scrollRef.current) {
+            setScroll({
+                scrollLeft: scrollRef.current.scrollLeft,
+                scrollTop: scrollRef.current.scrollTop
+            }, true);
+        }
+    }, [current]);
+    jsx.useEffect(() => {
+        if (iFrameRef.current) {
+            iFrameRef.current.src = "";
+            iFrameRef.current.src = previewPath;
+        }
+    }, [iFrameRef.current, previewPath, reloadString]);
+    return JSX.createElement("div", { class: "file-editor" }, content === null ? JSX.createElement("p", null, "loading") : JSX.createElement(JSX.Fragment, null,
+        JSX.createElement(FileEditorToolbar, { disableLog: disableLog, disablePreview: disablePreview, disableReload: disableReload, isPanelVisible: isPanelVisible, togglePanel: togglePanel, revertFile: revertFile, closeFile: closeFile, language: language, path: path, changed: changed, saveFile: saveFile, setlanguage: setlanguage, deleteFile: deleteFile, renameFile: renameFile }),
+        JSX.createElement("div", { 
+            //class={`file-editor-content${previewPath || apiPreview ? " split" : ""}`}
+            class: "file-editor-content" },
+            JSX.createElement("div", { ref: scrollRef, class: `file-editor-text-editor${previewPath || (apiPreview && apiPreview.length > 0) && isPanelVisible("right") ? " split" : ""}`, 
+                //class={`file-editor-text-editor`}
+                onscroll: ev => {
+                    setScroll({
+                        scrollLeft: ev.target.scrollLeft,
+                        scrollTop: ev.target.scrollTop
+                    });
+                } },
+                error ?
+                    JSX.createElement("p", { class: "file-editor-content-error" }, error)
+                    : JSX.createElement(JSX.Fragment, null),
+                language !== "binary" ?
+                    JSX.createElement(HighlightTextArea, { tabChar: "  ", oncontentchange: (args) => {
+                            if (contentchange) {
+                                contentchange(args.detail);
+                            }
+                        }, content: content, language: language }) : JSX.createElement("p", null, "binary data not supported")),
+            apiPreview && apiPreview.length > 0 ? JSX.createElement(APIPReview, { isPanelVisible: isPanelVisible, apiPreview: apiPreview }) : JSX.createElement(JSX.Fragment, null),
+            previewPath && isPanelVisible("right") ? JSX.createElement("div", { class: `file-editor-preview`, style: `${!isPanelVisible("right") ? "display: none;" : ""}` },
+                JSX.createElement("div", { class: "file-editor-preview-path" },
+                    JSX.createElement("a", { href: previewPath, target: "_blank" }, "open in new window")),
+                JSX.createElement("iframe", { ref: iFrameRef, src: previewPath, sandbox: "allow-scripts allow-same-origin" })) : JSX.createElement(JSX.Fragment, null))));
+}
+FileEditor.asFragment = true;
+FileEditor.shadowInit = false;

package/build/esm/editor/components/filter-query.d.ts

@@ -0,0 +1 @@
+export declare function useFilterQuery(): [string, (newFilter: string, inmediate?: boolean) => void];

package/build/esm/editor/components/filter-query.js

@@ -0,0 +1,23 @@
+import * as jsx from "@miqro/jsx";
+let queryTimeout2 = null;
+export function useFilterQuery() {
+    const [filterQuery, setfilterQuery] = jsx.useQuery("filter", "");
+    const [filter, setfilter] = jsx.useState(typeof filterQuery === "string" ? filterQuery : "");
+    return [
+        filter,
+        (newFilter, inmediate) => {
+            clearTimeout(queryTimeout2);
+            if (inmediate) {
+                setfilter(newFilter);
+                setfilterQuery(newFilter);
+            }
+            else {
+                setfilter(newFilter);
+                queryTimeout2 = setTimeout(() => {
+                    setfilter(newFilter);
+                    setfilterQuery(newFilter);
+                }, 1000);
+            }
+        }
+    ];
+}

package/build/esm/editor/components/highlight-text-area.d.ts

@@ -0,0 +1,11 @@
+export declare function HighlightTextArea({ content, language, oncontentchange, tabChar, disabled }: {
+    language: string;
+    content: string;
+    disabled?: string;
+    tabChar?: string;
+    oncontentchange?: (ev: CustomEvent) => void;
+}): JSX.Element;
+export declare namespace HighlightTextArea {
+    var asFragment: boolean;
+    var shadowInit: boolean;
+}

package/build/esm/editor/components/highlight-text-area.js

@@ -0,0 +1,127 @@
+import * as jsx from "@miqro/jsx";
+import JSX from "@miqro/jsx";
+//import hljs from "../lib/highlight/core.min.js"
+import hljs from 'highlight.js/lib/core';
+import javascript from 'highlight.js/lib/languages/javascript';
+import xml from "highlight.js/lib/languages/xml";
+import css from "highlight.js/lib/languages/css";
+import scss from "highlight.js/lib/languages/scss";
+import markdown from "highlight.js/lib/languages/markdown";
+import dockerfile from "highlight.js/lib/languages/dockerfile";
+import yaml from "highlight.js/lib/languages/yaml";
+import typescript from "highlight.js/lib/languages/typescript";
+import c from "highlight.js/lib/languages/c";
+import cpp from "highlight.js/lib/languages/cpp";
+import bash from "highlight.js/lib/languages/bash";
+import python from "highlight.js/lib/languages/python";
+import text from "highlight.js/lib/languages/plaintext";
+import json from "highlight.js/lib/languages/json";
+// Then register the languages you need
+hljs.registerLanguage('text', text);
+hljs.registerLanguage('dockerfile', dockerfile);
+hljs.registerLanguage('yaml', yaml);
+hljs.registerLanguage('javascript', javascript);
+hljs.registerLanguage('xml', xml);
+hljs.registerLanguage('html', xml);
+hljs.registerLanguage('css', css);
+hljs.registerLanguage('scss', scss);
+hljs.registerLanguage('markdown', markdown);
+hljs.registerLanguage('typescript', typescript);
+hljs.registerLanguage('c', c);
+hljs.registerLanguage('cpp', cpp);
+hljs.registerLanguage('bash', bash);
+hljs.registerLanguage('python', python);
+hljs.registerLanguage('json', json);
+/*!
+Theme: GitHub Dark
+Description: Dark theme as seen on github.com
+Author: github.com
+Maintainer: @Hirse
+Updated: 2021-05-15
+
+Outdated base version: https://github.com/primer/github-syntax-dark
+Current colors taken from GitHub's CSS
+*/
+const STYLE = `pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{color:#c9d1d9;background:#0d1117}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ff7b72}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#79c0ff}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#a5d6ff}.hljs-built_in,.hljs-symbol{color:#ffa657}.hljs-code,.hljs-comment,.hljs-formula{color:#8b949e}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#7ee787}.hljs-subst{color:#c9d1d9}.hljs-section{color:#1f6feb;font-weight:700}.hljs-bullet{color:#f2cc60}.hljs-emphasis{color:#c9d1d9;font-style:italic}.hljs-strong{color:#c9d1d9;font-weight:700}.hljs-addition{color:#aff5b4;background-color:#033a16}.hljs-deletion{color:#ffdcd7;background-color:#67060c}code{outline: 0px solid rgba(0, 0, 0, 0.263);caret-color: red;}.hljs-name{color: #e8910d;}.hljs-tag .hljs-attr, .hljs-tag .hljs-name{color: #e8910d;}`;
+const POSTTYLE = "pre{padding:0; margin:0;} code { background-color: #000000; color: #ffffff; }";
+const TAG_NAME = "HIGHLIGHT-TEXT-AREA";
+function runHighlight(content, language) {
+    const now = Date.now();
+    console.log("runHighlight [%s]", language);
+    const value = hljs.highlight(String(content), {
+        language,
+        ignoreIllegals: true
+    }).value;
+    console.log("runHighlight [%s] took [%s]ms", language, Date.now() - now);
+    return value;
+}
+function emitEvents(elementRef, topMost, content, oncontentchange) {
+    if (elementRef.current && topMost.current) {
+        const currentContent = elementRef.current.textContent;
+        const webComponentElement = topMost.current.parentNode;
+        const event = new CustomEvent("contentchange", { detail: currentContent });
+        if (webComponentElement && webComponentElement instanceof HTMLElement && webComponentElement.tagName === TAG_NAME) {
+            try {
+                webComponentElement.dispatchEvent(event);
+            }
+            catch (e) {
+                console.error(e);
+            }
+        }
+        if (typeof oncontentchange === "function") {
+            try {
+                oncontentchange(event);
+            }
+            catch (e) {
+                console.error(e);
+            }
+        }
+    }
+}
+export function HighlightTextArea({ content, language, oncontentchange, tabChar, disabled }) {
+    const elementRef = jsx.useRef();
+    const topMost = jsx.useRef();
+    const [lastLanguage, setlastLanguage] = jsx.useState(language);
+    // effect to watch changes to language
+    jsx.useEffect(() => {
+        if (elementRef.current && (lastLanguage !== language || elementRef.current.textContent !== content)) {
+            setlastLanguage(language);
+            elementRef.current.innerHTML = runHighlight(content, language);
+        }
+    }, [lastLanguage, language, elementRef.current, content]);
+    return JSX.createElement("pre", { ref: topMost },
+        JSX.createElement("style", { innerHTML: STYLE + POSTTYLE }),
+        JSX.createElement("code", { autocomplete: "off", autocorrect: "off", autocapitalize: "off", spellcheck: "false", contenteditable: disabled ? "false" : "true", ref: elementRef, tabindex: "0", innerHTML: !elementRef.current ? runHighlight(content, language) : null, onfocusout: async (ev) => {
+                ev.preventDefault();
+                if (elementRef.current) {
+                    if (content !== elementRef.current.textContent) {
+                        //setlastContent(String(elementRef.current.textContent));
+                        //elementRef.current.innerHTML = runHighlight(elementRef.current.textContent, language);
+                    }
+                    elementRef.current.innerHTML = runHighlight(elementRef.current.textContent, language);
+                }
+            }, onkeydown: ev => {
+                if (ev.keyCode === 9) {
+                    ev.preventDefault();
+                    // now insert four non-breaking spaces for the tab key
+                    const sel = document.getSelection();
+                    if (sel && topMost.current) {
+                        if (topMost.current.contains(sel.anchorNode)) {
+                            const range = sel.getRangeAt(0);
+                            const tabNode = document.createTextNode(tabChar ? tabChar : "\t");
+                            range.insertNode(tabNode);
+                            range.setStartAfter(tabNode);
+                            range.setEndAfter(tabNode);
+                            sel.removeAllRanges();
+                            sel.addRange(range);
+                        }
+                    }
+                    emitEvents(elementRef, topMost, content, oncontentchange);
+                }
+            }, oninput: ev => {
+                ev.preventDefault();
+                emitEvents(elementRef, topMost, content, oncontentchange);
+            } }));
+}
+HighlightTextArea.asFragment = true;
+HighlightTextArea.shadowInit = false;

package/build/esm/editor/components/log-viewer.d.ts

@@ -0,0 +1,6 @@
+import { LogSocket } from "../common/log-socket.js";
+interface LogViewerProps {
+    socket: LogSocket;
+}
+export declare function LogViewer(props: LogViewerProps): JSX.Element;
+export {};

package/build/esm/editor/components/log-viewer.js

@@ -0,0 +1,71 @@
+import * as jsx from "@miqro/jsx";
+import JSX from "@miqro/jsx";
+function getUniqueIdentifiers(lines) {
+    const identifiersCache = {};
+    return lines.map(l => l.identifier).filter(identifier => {
+        const filter = !identifiersCache[identifier];
+        identifiersCache[identifier] = true;
+        return filter;
+    });
+}
+const LOG_LEVEL_MAP = {
+    "none": 0,
+    "error": 1,
+    "warn": 2,
+    "info": 3,
+    "debug": 4,
+    "trace": 5,
+};
+export function LogViewer(props) {
+    const { lines, clearLog, getMaxlogsize, setMaxLogSize } = props.socket;
+    const maxLogSize = getMaxlogsize();
+    const refresh = jsx.useRefresh();
+    jsx.useEffect(() => {
+        refresh();
+    }, [maxLogSize]);
+    const [identifier, setidentifier] = jsx.useState("");
+    const [level, setlevel] = jsx.useState("debug");
+    const [filter, setfilter] = jsx.useState("");
+    const identifiers = getUniqueIdentifiers(lines).sort();
+    //console.log(identifiers);
+    return JSX.createElement("div", { class: "log-viewer" },
+        JSX.createElement("div", { class: "log-viewer-toolbar" },
+            JSX.createElement("button", { class: "btn", onclick: e => {
+                    e.preventDefault();
+                    clearLog();
+                } }, "clear log"),
+            JSX.createElement("select", { value: maxLogSize, oninput: ev => {
+                    ev.preventDefault();
+                    if (ev.target.value === "unlimited") {
+                        setMaxLogSize("unlimited");
+                    }
+                    else {
+                        setMaxLogSize(parseInt(ev.target.value, 10));
+                    }
+                }, style: "margin: 0; padding: 0; margin-left:auto; margin-right: 0;" },
+                ["10", "1000", "5000", "10000", "15000", "20000", "25000", "50000", "100000", "500000", "1000000", "1500000", "5000000"].map(l => JSX.createElement("option", { value: l }, l)),
+                JSX.createElement("option", { value: "unlimited" }, "unlimited")),
+            JSX.createElement("select", { value: level, oninput: ev => {
+                    ev.preventDefault();
+                    setlevel(ev.target.value);
+                }, style: "margin: 0; padding: 0; margin-left:var(--file-browser-separation); margin-right: 0;" },
+                ["error", "warn", "info", "debug", "trace"].map(l => JSX.createElement("option", { value: l }, l)),
+                JSX.createElement("option", { value: "" }, "all")),
+            JSX.createElement("select", { value: identifier, oninput: ev => {
+                    ev.preventDefault();
+                    setidentifier(ev.target.value);
+                }, style: "margin: 0; padding: 0; margin-left:var(--file-browser-separation); margin-right: 0;" },
+                identifiers.map(identifier => JSX.createElement("option", { value: identifier }, identifier)),
+                JSX.createElement("option", { value: "" })),
+            JSX.createElement("input", { style: "margin: 0; padding: 0; margin-left:var(--file-browser-separation); margin-right: 0;", value: filter, oninput: ev => {
+                    ev.preventDefault();
+                    setfilter(ev.target.value);
+                }, type: "text", placeholder: "..filter.." })),
+        JSX.createElement("div", { class: "log-viewer-log" }, lines
+            .filter(line => identifier === "" || line.identifier === identifier)
+            .filter(line => filter === "" || line.out.indexOf(filter) !== -1)
+            .filter(line => {
+            return (level === "" || LOG_LEVEL_MAP[level] >= LOG_LEVEL_MAP[line.level]);
+        })
+            .map(line => JSX.createElement("p", { style: "margin: 0; padding: 0; border-radius: 0; font-size: 12px;", class: line.level === "error" ? "info-danger" : line.level === "warn" ? "info-warn" : line.level === "trace" ? "info-success" : line.level === "debug" ? "info-info" : "" }, line.out)).reverse()));
+}

package/build/esm/editor/components/new-file.d.ts

@@ -0,0 +1,10 @@
+export declare function NewFile(props: {
+    migrations: string[];
+    services: string[];
+    open: boolean;
+    ondone: (file?: string) => void;
+}): JSX.Element;
+export declare namespace NewFile {
+    var asFragment: boolean;
+    var shadowInit: boolean;
+}

package/build/esm/editor/components/new-file.js

@@ -0,0 +1,119 @@
+import * as jsx from "@miqro/jsx";
+import JSX from "@miqro/jsx";
+import { BASEEDITOR_PATH } from "../common/constants.js";
+import { TEMPLATES } from "../common/templates.js";
+import { HighlightTextArea } from "./highlight-text-area.js";
+export function NewFile(props) {
+    const [template, settemplate] = jsx.useState("EMPTY");
+    const refresh = jsx.useRefresh();
+    const [service, setservice] = jsx.useState(props.services[0]);
+    const nameInput = jsx.useRef();
+    //const open = dialog ? dialog.open : false;
+    /*jsx.useEffect(() => {
+      if (dialog) {
+        //console.log((dialogRef.current as any).open);
+        if (open !== props.open) {
+          if (nameInput.current) {
+            nameInput.current.value = "";
+            nameInput.current.focus();
+          }
+          if (props.open) {
+            console.log("showModal");
+            dialog.showModal();
+            //(dialogRef.current as any).show();
+          } else {
+            console.log("closeModal");
+            //dialog.close();
+          }
+        }
+      }
+    }, [dialog, open, props.open]);*/
+    jsx.useEffect(() => {
+        if (nameInput.current) {
+            nameInput.current.value = "";
+            nameInput.current.focus();
+        }
+    }, [nameInput.current]);
+    function close(file) {
+        //console.log("closeModal");
+        if (props.ondone) {
+            props.ondone(file);
+        }
+    }
+    let nextMigrationNumber = 1;
+    if (props.migrations.length > 0) {
+        const lastMigration = props.migrations[props.migrations.length - 1];
+        const indexOfDash = lastMigration.indexOf("-");
+        if (indexOfDash !== -1) {
+            nextMigrationNumber = parseInt(lastMigration.substring(0, indexOfDash), 10) + 1;
+        }
+    }
+    const httpPath = (TEMPLATES[template].filename ? TEMPLATES[template].filename : nameInput.current?.value) + (TEMPLATES[template].httpSufix ? TEMPLATES[template].httpSufix : "");
+    const filename = (service ? service + "/" : "") + (service && TEMPLATES[template].prefix ? TEMPLATES[template].prefix + "/" : "") + (template === "MIGRATION" ? nextMigrationNumber + "-" : "") + (TEMPLATES[template].filename ? TEMPLATES[template].filename : nameInput.current?.value) + (TEMPLATES[template].sufix ? TEMPLATES[template].sufix : "");
+    async function createNewFile() {
+        if ((nameInput.current && nameInput.current.value) || TEMPLATES[template].filename) {
+            const t = TEMPLATES[template];
+            await fetch(BASEEDITOR_PATH + "/api/fs/write", {
+                method: "POST",
+                headers: {
+                    ["content-type"]: "application/json"
+                },
+                body: JSON.stringify({
+                    path: filename,
+                    contents: t.template ? t.template(filename, httpPath) : ""
+                })
+            });
+            return filename;
+        }
+    }
+    return JSX.createElement(JSX.Fragment, null, props.open ? JSX.createElement("dialog", { class: "new-dialog", open: "" },
+        JSX.createElement("div", { class: "dialog-header" },
+            JSX.createElement("h1", null, "Create new File")),
+        JSX.createElement("div", { class: "dialog-body" },
+            JSX.createElement("select", { value: service, oninput: ev => {
+                    ev.preventDefault();
+                    ev.stopPropagation();
+                    console.log(ev.target.value);
+                    setservice(ev.target.value);
+                }, style: "margin: 0; padding: 0; margin-left:auto; margin-right: var(--file-browser-separation); width: 100%; margin-top: var(--file-browser-separation); margin-bottom: var(--file-browser-separation);" },
+                JSX.createElement("option", { value: "" }),
+                props.services.map(service => JSX.createElement("option", { value: service }, service))),
+            JSX.createElement("p", { style: "margin: 0; margin-bottom: var(--file-browser-separation);" }, filename),
+            !TEMPLATES[template].filename ? JSX.createElement("form", { style: "width: 100%;", onsubmit: async (ev) => {
+                    ev.preventDefault();
+                    ev.stopPropagation();
+                    const path = await createNewFile();
+                    close(path);
+                } },
+                JSX.createElement("input", { style: "width: 100%;", onkeydown: ev => {
+                        if (ev.keyCode === 27) {
+                            // catch esc
+                            ev.stopPropagation();
+                            ev.preventDefault();
+                            close();
+                        }
+                        refresh();
+                    }, ref: nameInput, type: "text", placeholder: "...filename..." })) : JSX.createElement(JSX.Fragment, null),
+            JSX.createElement("select", { value: template, oninput: ev => {
+                    ev.preventDefault();
+                    ev.stopPropagation();
+                    console.log(ev.target.value);
+                    settemplate(ev.target.value);
+                }, style: "margin: 0; padding: 0; margin-left:auto; margin-right: var(--file-browser-separation); width: 100%; margin-top: var(--file-browser-separation);" }, Object.keys(TEMPLATES).map(templateName => JSX.createElement("option", { value: templateName }, TEMPLATES[templateName].displayName))),
+            TEMPLATES[template].template ? JSX.createElement("div", { class: "new-dialog-preview" },
+                JSX.createElement(HighlightTextArea, { content: TEMPLATES[template].template(filename, httpPath), language: TEMPLATES[template].language, disabled: "true" })) : JSX.createElement(JSX.Fragment, null)),
+        JSX.createElement("div", { class: "dialog-footer" },
+            JSX.createElement("button", { class: "btn danger", onclick: ev => {
+                    ev.preventDefault();
+                    ev.stopPropagation();
+                    close();
+                } }, "cancel"),
+            JSX.createElement("button", { style: "margin-left: auto;", class: "btn active", onclick: async (ev) => {
+                    ev.preventDefault();
+                    ev.stopPropagation();
+                    const path = await createNewFile();
+                    close(path);
+                } }, "create"))) : JSX.createElement(JSX.Fragment, null));
+}
+NewFile.asFragment = true;
+NewFile.shadowInit = false;

package/build/esm/editor/components/scroll-query.d.ts

@@ -0,0 +1,7 @@
+export declare function useScroll(): [{
+    scrollTop: string;
+    scrollLeft: string;
+}, (newScroll: {
+    scrollTop: number;
+    scrollLeft: number;
+}, inmediate?: boolean) => void];

package/build/esm/editor/components/scroll-query.js

@@ -0,0 +1,22 @@
+import * as jsx from "@miqro/jsx";
+let scrollTimeout2 = null;
+export function useScroll() {
+    const [scrollTop, setscrollTop] = jsx.useQuery("scrollTop", "0");
+    const [scrollLeft, setscrollLeft] = jsx.useQuery("scrollLeft", "0");
+    return [{
+            scrollTop: scrollTop,
+            scrollLeft: scrollLeft
+        }, (newScroll, inmediate) => {
+            clearTimeout(scrollTimeout2);
+            if (inmediate) {
+                setscrollTop(String(newScroll.scrollTop));
+                setscrollLeft(String(newScroll.scrollLeft));
+            }
+            else {
+                scrollTimeout2 = setTimeout(() => {
+                    setscrollTop(String(newScroll.scrollTop));
+                    setscrollLeft(String(newScroll.scrollLeft));
+                }, 1000);
+            }
+        }];
+}

package/build/esm/editor/components/start-page.d.ts

@@ -0,0 +1,13 @@
+interface StartPageProps {
+    togglePanel: (panel: string) => void;
+    isPanelVisible: (panel: string) => boolean;
+    disableLog?: boolean;
+    disablePreview?: boolean;
+    disableReload?: boolean;
+}
+export declare function StartPage(props: StartPageProps): JSX.Element;
+export declare namespace StartPage {
+    var asFragment: boolean;
+    var shadowInit: boolean;
+}
+export {};

package/build/esm/editor/components/start-page.js

@@ -0,0 +1,32 @@
+import * as jsx from "@miqro/jsx";
+import JSX from "@miqro/jsx";
+export function StartPage(props) {
+    jsx.useEffect(() => {
+        if (!props.isPanelVisible("left")) {
+            props.togglePanel("left");
+        }
+    }, []);
+    return JSX.createElement("div", { class: `start-page` },
+        JSX.createElement("div", { class: "row center" },
+            JSX.createElement("h1", null, "Start Page")),
+        JSX.createElement("br", null),
+        JSX.createElement("div", { class: "row center" },
+            JSX.createElement("div", { class: "row" },
+                JSX.createElement("div", { class: `toggle-panel-button left-side-panel-button ${props.isPanelVisible("left") ? "active" : ""}`, onclick: ev => {
+                        ev.preventDefault();
+                        props.togglePanel("left");
+                    } }),
+                JSX.createElement("br", null),
+                props.disableLog ? JSX.createElement(JSX.Fragment, null) : JSX.createElement("div", { class: `toggle-panel-button bottom-side-panel-button ${props.isPanelVisible("bottom") ? "active" : ""}`, onclick: ev => {
+                        ev.preventDefault();
+                        props.togglePanel("bottom");
+                    } }),
+                JSX.createElement("br", null),
+                props.disablePreview ? JSX.createElement(JSX.Fragment, null) : JSX.createElement("div", { class: `toggle-panel-button right-side-panel-button ${props.isPanelVisible("right") ? "active" : ""}`, onclick: ev => {
+                        ev.preventDefault();
+                        props.togglePanel("right");
+                    } }))),
+        JSX.createElement("br", null));
+}
+StartPage.asFragment = true;
+StartPage.shadowInit = false;

package/build/esm/editor/http/admin/editor/api/fs/delete.api.d.ts

@@ -0,0 +1,4 @@
+declare const _default: import("@miqro/core").APIRoute<import("@miqro/core").Request, {
+    readonly path: "string";
+}, undefined, undefined>;
+export default _default;

package/build/esm/editor/http/admin/editor/api/fs/delete.api.js

@@ -0,0 +1,30 @@
+import { defineRoute, JSONParser } from "@miqro/core";
+import { unlinkSync } from "node:fs";
+import { getPath } from "./read.api.js";
+export default defineRoute({
+    description: "admin editor file deletion endpoint",
+    method: "POST",
+    path: "/delete",
+    middleware: [JSONParser()],
+    request: {
+        body: {
+            path: "string"
+        }
+    },
+    response: {
+        status: [200, 400],
+        body: {
+            message: "string"
+        }
+    },
+    handler: async (req, res) => {
+        const { path } = req.body;
+        await deleteFile(path);
+        return res?.json({
+            message: "OK"
+        });
+    }
+});
+function deleteFile(path) {
+    unlinkSync(getPath(path));
+}

package/build/esm/editor/http/admin/editor/api/fs/read.api.d.ts

@@ -0,0 +1,7 @@
+import { APIRoute } from "@miqro/core";
+declare const _default: APIRoute<import("@miqro/core").Request, {
+    readonly path: "string";
+}, undefined, undefined>;
+export default _default;
+export declare function readFile(path: string): string;
+export declare function getPath(path: string): string;

package/build/esm/editor/http/admin/editor/api/fs/read.api.js

@@ -0,0 +1,50 @@
+import { defineRoute, JSONParser } from "@miqro/core";
+import { readFileSync, realpathSync } from "node:fs";
+import { SUPPORTED_LANGUAGES } from "../../../../../common/constants.js";
+import { relative, resolve } from "node:path";
+import { getLanguage } from "./scan.api.js";
+import { BASE_PATH } from "../../../../../common/constants.server.js";
+export default defineRoute({
+    method: "POST",
+    path: "/read",
+    description: "admin editor file read endpoint",
+    middleware: [JSONParser()],
+    request: {
+        body: {
+            path: "string"
+        }
+    },
+    response: {
+        status: [200, 400],
+        body: {
+            contents: "string",
+            path: "string"
+        }
+    },
+    handler: async (req, res) => {
+        const { path } = req.body;
+        const contents = readFile(path);
+        return res?.json({
+            contents,
+            path
+        });
+    }
+});
+export function readFile(path) {
+    const filePath = getPath(path);
+    const language = getLanguage(filePath);
+    if (SUPPORTED_LANGUAGES.includes(language)) {
+        const contents = readFileSync(filePath).toString();
+        return contents;
+    }
+    else {
+        throw new Error("unsupported file format");
+    }
+}
+export function getPath(path) {
+    const realPath = realpathSync(resolve(BASE_PATH, path));
+    if (relative(BASE_PATH, realPath).startsWith("..")) {
+        throw new Error("invalid path! [" + path + "]");
+    }
+    return realPath;
+}