tsondb 0.1.3

package/lib/client/components/typeInputs/TypeInput.js

@@ -0,0 +1,87 @@
+import { jsx as _jsx } from "preact/jsx-runtime";
+import { assertExhaustive } from "../../../shared/utils/typeSafety.js";
+import { ArrayTypeInput } from "./ArrayTypeInput.js";
+import { BooleanTypeInput } from "./BooleanTypeInput.js";
+import { DateTypeInput } from "./DateTypeInput.js";
+import { FloatTypeInput } from "./FloatTypeInput.js";
+import { GenericArgumentIdentifierTypeInput } from "./GenericTypeArgumentIdentifierTypeInput.js";
+import { IncludeIdentifierTypeInput } from "./IncludeIdentifierTypeInput.js";
+import { IntegerTypeInput } from "./IntegerTypeInput.js";
+import { NestedEntityMapTypeInput } from "./NestedEntityMapTypeInput.js";
+import { ObjectTypeInput } from "./ObjectTypeInput.js";
+import { ReferenceIdentifierTypeInput } from "./ReferenceIdentifierTypeInput.js";
+import { StringTypeInput } from "./StringTypeInput.js";
+import { MismatchingTypeError } from "./utils/MismatchingTypeError.js";
+export const TypeInput = ({ type, value, instanceNamesByEntity, getDeclFromDeclName, onChange, }) => {
+    switch (type.kind) {
+        case "BooleanType":
+            if (typeof value === "boolean") {
+                return _jsx(BooleanTypeInput, { type: type, value: value, onChange: onChange });
+            }
+            else {
+                return _jsx(MismatchingTypeError, { expected: "boolean", actual: value });
+            }
+        case "DateType":
+            if (typeof value === "string") {
+                return _jsx(DateTypeInput, { type: type, value: value, onChange: onChange });
+            }
+            else {
+                return _jsx(MismatchingTypeError, { expected: "date string", actual: value });
+            }
+        case "FloatType":
+            if (typeof value === "number") {
+                return _jsx(FloatTypeInput, { type: type, value: value, onChange: onChange });
+            }
+            else {
+                return _jsx(MismatchingTypeError, { expected: "float", actual: value });
+            }
+        case "IntegerType":
+            if (typeof value === "number" && Number.isInteger(value)) {
+                return _jsx(IntegerTypeInput, { type: type, value: value, onChange: onChange });
+            }
+            else {
+                return _jsx(MismatchingTypeError, { expected: "integer", actual: value });
+            }
+        case "StringType":
+            if (typeof value === "string") {
+                return _jsx(StringTypeInput, { type: type, value: value, onChange: onChange });
+            }
+            else {
+                return _jsx(MismatchingTypeError, { expected: "string", actual: value });
+            }
+        case "ArrayType":
+            if (Array.isArray(value)) {
+                return (_jsx(ArrayTypeInput, { type: type, value: value, instanceNamesByEntity: instanceNamesByEntity, getDeclFromDeclName: getDeclFromDeclName, onChange: onChange }));
+            }
+            else {
+                return _jsx(MismatchingTypeError, { expected: "array", actual: value });
+            }
+        case "ObjectType":
+            if (typeof value === "object" && value !== null && !Array.isArray(value)) {
+                return (_jsx(ObjectTypeInput, { type: type, value: value, instanceNamesByEntity: instanceNamesByEntity, getDeclFromDeclName: getDeclFromDeclName, onChange: onChange }));
+            }
+            else {
+                return _jsx(MismatchingTypeError, { expected: "object", actual: value });
+            }
+        case "GenericArgumentIdentifierType":
+            return _jsx(GenericArgumentIdentifierTypeInput, { type: type });
+        case "ReferenceIdentifierType":
+            if (typeof value === "string") {
+                return (_jsx(ReferenceIdentifierTypeInput, { type: type, value: value, instanceNamesByEntity: instanceNamesByEntity, onChange: onChange }));
+            }
+            else {
+                return _jsx(MismatchingTypeError, { expected: "string identifier", actual: value });
+            }
+        case "IncludeIdentifierType":
+            return (_jsx(IncludeIdentifierTypeInput, { type: type, value: value, instanceNamesByEntity: instanceNamesByEntity, getDeclFromDeclName: getDeclFromDeclName, onChange: onChange }));
+        case "NestedEntityMapType":
+            if (typeof value === "object" && value !== null && !Array.isArray(value)) {
+                return (_jsx(NestedEntityMapTypeInput, { type: type, value: value, instanceNamesByEntity: instanceNamesByEntity, getDeclFromDeclName: getDeclFromDeclName, onChange: onChange }));
+            }
+            else {
+                return _jsx(MismatchingTypeError, { expected: "entity map", actual: value });
+            }
+        default:
+            return assertExhaustive(type);
+    }
+};

package/lib/client/components/typeInputs/utils/EnumDeclField.d.ts

@@ -0,0 +1,13 @@
+import { FunctionComponent } from "preact";
+import { SerializedEnumDecl } from "../../../../schema/declarations/EnumDecl.js";
+import { InstanceNamesByEntity } from "../../../hooks/useInstanceNamesByEntity.js";
+import { GetDeclFromDeclName } from "../../../hooks/useSecondaryDeclarations.js";
+type Props = {
+    decl: SerializedEnumDecl;
+    value: unknown;
+    instanceNamesByEntity: InstanceNamesByEntity;
+    getDeclFromDeclName: GetDeclFromDeclName;
+    onChange: (value: unknown) => void;
+};
+export declare const EnumDeclField: FunctionComponent<Props>;
+export {};

package/lib/client/components/typeInputs/utils/EnumDeclField.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { discriminatorKey } from "../../../../shared/enum.js";
+import { toTitleCase } from "../../../../shared/utils/string.js";
+import { createTypeSkeleton } from "../../../utils/typeSkeleton.js";
+import { Select } from "../../Select.js";
+import { TypeInput } from "../TypeInput.js";
+import { MismatchingTypeError } from "./MismatchingTypeError.js";
+export const EnumDeclField = ({ decl, value, instanceNamesByEntity, getDeclFromDeclName, onChange, }) => {
+    if (typeof value !== "object" ||
+        value === null ||
+        Array.isArray(value) ||
+        !(discriminatorKey in value) ||
+        typeof value[discriminatorKey] !== "string") {
+        return _jsx(MismatchingTypeError, { expected: "enumeration value", actual: value });
+    }
+    const enumValues = Object.keys(decl.values);
+    const activeEnumCase = value[discriminatorKey];
+    const associatedType = decl.values[activeEnumCase];
+    return (_jsxs("div", { class: "field field--enum", children: [_jsx(Select, { value: activeEnumCase, onInput: event => {
+                    const associatedType = decl.values[event.currentTarget.value];
+                    if (associatedType == null) {
+                        onChange({
+                            [discriminatorKey]: event.currentTarget.value,
+                        });
+                    }
+                    else {
+                        onChange({
+                            [discriminatorKey]: event.currentTarget.value,
+                            [event.currentTarget.value]: createTypeSkeleton(getDeclFromDeclName, associatedType),
+                        });
+                    }
+                }, children: enumValues.map(enumValue => (_jsx("option", { value: enumValue, selected: enumValue === activeEnumCase, children: toTitleCase(enumValue) }))) }), associatedType == null ? null : (_jsx("div", { className: "associated-type", children: _jsx(TypeInput, { type: associatedType, value: value[activeEnumCase], instanceNamesByEntity: instanceNamesByEntity, getDeclFromDeclName: getDeclFromDeclName, onChange: newValue => {
+                        onChange({
+                            [discriminatorKey]: activeEnumCase,
+                            [activeEnumCase]: newValue,
+                        });
+                    } }) }))] }));
+};

package/lib/client/components/typeInputs/utils/MismatchingTypeError.d.ts

@@ -0,0 +1,7 @@
+import { FunctionComponent } from "preact";
+type Props = {
+    expected: string;
+    actual: unknown;
+};
+export declare const MismatchingTypeError: FunctionComponent<Props>;
+export {};

package/lib/client/components/typeInputs/utils/MismatchingTypeError.js

@@ -0,0 +1,4 @@
+import { jsxs as _jsxs } from "preact/jsx-runtime";
+export const MismatchingTypeError = ({ expected, actual }) => {
+    return (_jsxs("div", { role: "alert", children: ["Expected value of type ", expected, ", but got ", JSON.stringify(actual)] }));
+};

package/lib/client/components/typeInputs/utils/ValidationErrors.d.ts

@@ -0,0 +1,6 @@
+import { FunctionComponent } from "preact";
+type Props = {
+    errors: Error[];
+};
+export declare const ValidationErrors: FunctionComponent<Props>;
+export {};

package/lib/client/components/typeInputs/utils/ValidationErrors.js

@@ -0,0 +1,4 @@
+import { jsx as _jsx } from "preact/jsx-runtime";
+export const ValidationErrors = ({ errors }) => {
+    return errors.length === 0 ? null : (_jsx("div", { role: "alert", class: "validation-errors", children: _jsx("ul", { children: errors.map((error, i) => (_jsx("li", { children: error.message }, i))) }) }));
+};

package/lib/client/hooks/useEntityFromRoute.d.ts

@@ -0,0 +1,5 @@
+import { SerializedEntityDecl } from "../../schema/declarations/EntityDecl.js";
+export declare const useEntityFromRoute: () => {
+    entity: SerializedEntityDecl;
+    isLocaleEntity: boolean;
+} | undefined;

package/lib/client/hooks/useEntityFromRoute.js

@@ -0,0 +1,20 @@
+import { useRoute } from "preact-iso";
+import { useEffect, useMemo, useState } from "preact/hooks";
+import { getEntityByName } from "../api.js";
+export const useEntityFromRoute = () => {
+    const { params: { name }, } = useRoute();
+    const [entityData, setEntityData] = useState();
+    useEffect(() => {
+        if (name) {
+            getEntityByName(name)
+                .then(data => {
+                setEntityData(data);
+            })
+                .catch(error => {
+                console.error("Error fetching data:", error);
+            });
+        }
+    }, [name]);
+    const entityObj = useMemo(() => entityData && { entity: entityData.declaration, isLocaleEntity: entityData.isLocaleEntity }, [entityData]);
+    return entityObj;
+};

package/lib/client/hooks/useInstanceNamesByEntity.d.ts

@@ -0,0 +1,3 @@
+import { GetAllInstancesResponseBody } from "../../shared/api.js";
+export type InstanceNamesByEntity = GetAllInstancesResponseBody["instances"];
+export declare const useInstanceNamesByEntity: (locales?: string[]) => [InstanceNamesByEntity, () => void];

package/lib/client/hooks/useInstanceNamesByEntity.js

@@ -0,0 +1,18 @@
+import { useEffect, useState } from "preact/hooks";
+import { getAllInstances } from "../api.js";
+export const useInstanceNamesByEntity = (locales = []) => {
+    const [instanceNamesByEntity, setInstanceNamesByEntity] = useState({});
+    const updateInstanceNamesByEntity = () => {
+        getAllInstances(locales)
+            .then(data => {
+            setInstanceNamesByEntity(data.instances);
+        })
+            .catch(error => {
+            console.error("Error fetching data:", error);
+        });
+    };
+    useEffect(() => {
+        updateInstanceNamesByEntity();
+    }, []);
+    return [instanceNamesByEntity, updateInstanceNamesByEntity];
+};

package/lib/client/hooks/useSecondaryDeclarations.d.ts

@@ -0,0 +1,3 @@
+import { SerializedSecondaryDecl } from "../../schema/declarations/Declaration.js";
+export type GetDeclFromDeclName = (name: string) => SerializedSecondaryDecl | undefined;
+export declare const useGetDeclFromDeclName: () => GetDeclFromDeclName;

package/lib/client/hooks/useSecondaryDeclarations.js

@@ -0,0 +1,18 @@
+import { useCallback, useEffect, useState } from "preact/hooks";
+import { getAllDeclarations } from "../api.js";
+export const useGetDeclFromDeclName = () => {
+    const [secondaryDeclarations, setSecondaryDeclarations] = useState([]);
+    useEffect(() => {
+        getAllDeclarations()
+            .then(data => {
+            setSecondaryDeclarations(data.declarations
+                .map(decl => decl.declaration)
+                .filter((decl) => decl.kind === "EnumDecl" || decl.kind === "TypeAliasDecl"));
+        })
+            .catch(error => {
+            console.error("Error fetching data:", error);
+        });
+    }, []);
+    const getDeclFromDeclName = useCallback((name) => secondaryDeclarations.find(decl => decl.name === name), [secondaryDeclarations]);
+    return getDeclFromDeclName;
+};

package/lib/client/index.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/client/index.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { render } from "preact";
+import { LocationProvider, Route, Router } from "preact-iso";
+import { CreateInstance } from "./routes/CreateInstance.js";
+import { Entity } from "./routes/Entity.js";
+import { Home } from "./routes/Home.js";
+import { Instance } from "./routes/Instance.js";
+import { NotFound } from "./routes/NotFound.js";
+const App = () => (_jsx(LocationProvider, { children: _jsxs(Router, { children: [_jsx(Route, { path: "/", component: Home }), _jsx(Route, { path: "/entities/:name", component: Entity }), _jsx(Route, { path: "/entities/:name/instances/create", component: CreateInstance }), _jsx(Route, { path: "/entities/:name/instances/:id", component: Instance }), _jsx(Route, { default: true, component: NotFound })] }) }));
+const root = document.getElementById("app");
+render(_jsx(App, {}), root);

package/lib/client/routes/CreateInstance.d.ts

@@ -0,0 +1,2 @@
+import { FunctionalComponent } from "preact";
+export declare const CreateInstance: FunctionalComponent;

package/lib/client/routes/CreateInstance.js

@@ -0,0 +1,68 @@
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { useLocation, useRoute } from "preact-iso";
+import { useEffect, useState } from "preact/hooks";
+import { getDisplayNameFromEntityInstance } from "../../shared/utils/displayName.js";
+import { toTitleCase } from "../../shared/utils/string.js";
+import { validateLocaleIdentifier } from "../../shared/validation/identifier.js";
+import { createInstanceByEntityNameAndId } from "../api.js";
+import { Layout } from "../components/Layout.js";
+import { TypeInput } from "../components/typeInputs/TypeInput.js";
+import { ValidationErrors } from "../components/typeInputs/utils/ValidationErrors.js";
+import { useEntityFromRoute } from "../hooks/useEntityFromRoute.js";
+import { useInstanceNamesByEntity } from "../hooks/useInstanceNamesByEntity.js";
+import { useGetDeclFromDeclName } from "../hooks/useSecondaryDeclarations.js";
+import { createTypeSkeleton } from "../utils/typeSkeleton.js";
+import { NotFound } from "./NotFound.js";
+export const CreateInstance = () => {
+    const { params: { name }, } = useRoute();
+    const getDeclFromDeclName = useGetDeclFromDeclName();
+    const entityFromRoute = useEntityFromRoute();
+    const [instanceNamesByEntity] = useInstanceNamesByEntity();
+    const [instance, setInstance] = useState();
+    const [customId, setCustomId] = useState("");
+    useEffect(() => {
+        if (entityFromRoute) {
+            setInstance(createTypeSkeleton(getDeclFromDeclName, entityFromRoute.entity.type));
+        }
+    }, [getDeclFromDeclName, entityFromRoute]);
+    const { route } = useLocation();
+    if (!name) {
+        return _jsx(NotFound, {});
+    }
+    if (!entityFromRoute) {
+        return (_jsxs("div", { children: [_jsx("h1", { children: name }), _jsx("p", { className: "loading", children: "Loading \u2026" })] }));
+    }
+    const { entity, isLocaleEntity } = entityFromRoute;
+    const handleSubmit = (event) => {
+        event.preventDefault();
+        const name = event.submitter?.getAttribute("name");
+        if (name) {
+            createInstanceByEntityNameAndId(entity.name, instance, isLocaleEntity ? customId : undefined)
+                .then(createdInstance => {
+                if (name === "saveandaddanother") {
+                    setInstance(createTypeSkeleton(getDeclFromDeclName, entity.type));
+                    setCustomId("");
+                    alert(`Instance of entity ${entity.name} created successfully with identifier ${createdInstance.instance.id}. You can add another instance now.`);
+                }
+                else {
+                    route(`/entities/${entity.name}?created=${encodeURIComponent(createdInstance.instance.id)}`);
+                }
+            })
+                .catch(error => {
+                alert(`Error updating instance:\n\n${error}`);
+            });
+        }
+    };
+    const defaultName = customId || `New ${toTitleCase(entity.name)}`;
+    const instanceName = getDisplayNameFromEntityInstance(entity, instance, defaultName);
+    const idErrors = isLocaleEntity ? validateLocaleIdentifier(customId) : [];
+    return (_jsxs(Layout, { breadcrumbs: [
+            { url: "/", label: "Home" },
+            { url: `/entities/${entity.name}`, label: entity.name },
+        ], children: [_jsx("div", { class: "header-with-btns", children: _jsx("h1", { class: instanceName.length === 0 ? "empty-name" : undefined, children: instanceName || defaultName }) }), isLocaleEntity && (_jsxs("div", { class: "field field--id", children: [_jsx("label", { htmlFor: "id", children: "ID" }), _jsx("p", { className: "comment", children: "The instance\u2019s identifier. An IETF language tag (BCP47)." }), _jsx("input", { type: "text", id: "id", value: customId, required: true, pattern: "[a-z]{2,3}(-[A-Z]{2,3})?", placeholder: "en-US, de-DE, \u2026", onInput: event => {
+                            setCustomId(event.currentTarget.value);
+                        }, "aria-invalid": idErrors.length > 0 }), _jsx(ValidationErrors, { errors: idErrors })] })), _jsxs("form", { onSubmit: handleSubmit, children: [_jsx(TypeInput, { type: entity.type, value: instance, instanceNamesByEntity: instanceNamesByEntity, getDeclFromDeclName: getDeclFromDeclName, onChange: value => {
+                            console.log("onChange", value);
+                            setInstance(value);
+                        } }), _jsxs("div", { className: "btns", children: [_jsx("button", { type: "submit", class: "primary", name: "save", children: "Save" }), _jsx("button", { type: "submit", class: "primary", name: "saveandaddanother", children: "Save and Add Another" })] })] })] }));
+};

package/lib/client/routes/Entity.d.ts

@@ -0,0 +1,2 @@
+import { FunctionalComponent } from "preact";
+export declare const Entity: FunctionalComponent;

package/lib/client/routes/Entity.js

@@ -0,0 +1,47 @@
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { useRoute } from "preact-iso";
+import { useEffect, useState } from "preact/hooks";
+import { getDisplayNameFromEntityInstance } from "../../shared/utils/displayName.js";
+import { deleteInstanceByEntityNameAndId, getEntityByName, getInstancesByEntityName, } from "../api.js";
+import { Layout } from "../components/Layout.js";
+import { NotFound } from "./NotFound.js";
+export const Entity = () => {
+    const { params: { name }, query: { created }, } = useRoute();
+    const [entity, setEntity] = useState();
+    const [instances, setInstances] = useState();
+    useEffect(() => {
+        if (name) {
+            Promise.all([getEntityByName(name), getInstancesByEntityName(name)])
+                .then(([entityData, instancesData]) => {
+                setEntity(entityData);
+                setInstances(instancesData.instances);
+            })
+                .catch(error => {
+                console.error("Error fetching entities:", error);
+            });
+        }
+        if (created) {
+            const instanceElement = document.getElementById(`instance-${created}`);
+            if (instanceElement) {
+                instanceElement.scrollIntoView({ behavior: "smooth", block: "center" });
+            }
+        }
+    }, []);
+    if (!name) {
+        return _jsx(NotFound, {});
+    }
+    if (!entity || !instances) {
+        return (_jsxs("div", { children: [_jsx("h1", { children: name }), _jsx("p", { className: "loading", children: "Loading \u2026" })] }));
+    }
+    return (_jsxs(Layout, { breadcrumbs: [{ url: "/", label: "Home" }], children: [_jsxs("div", { class: "header-with-btns", children: [_jsx("h1", { children: name }), _jsx("a", { class: "btn btn--primary", href: `/entities/${entity.declaration.name}/instances/create`, children: "Add" })] }), entity.declaration.comment && _jsx("p", { className: "description", children: entity.declaration.comment }), _jsxs("p", { children: [instances.length, " instance", instances.length === 1 ? "" : "s"] }), _jsx("ul", { class: "instances", children: instances.map(instance => (_jsxs("li", { id: `instance-${instance.id}`, class: `instance-item ${created === instance.id ? "instance-item--created" : ""}`, children: [_jsx("h2", { children: getDisplayNameFromEntityInstance(entity.declaration, instance.content, instance.id) }), _jsx("p", { "aria-hidden": true, class: "id", children: instance.id }), _jsxs("div", { className: "btns", children: [_jsx("a", { href: `/entities/${entity.declaration.name}/instances/${instance.id}`, class: "btn", children: "Edit" }), _jsx("button", { class: "destructive", onClick: () => {
+                                        if (confirm("Are you sure you want to delete this instance?")) {
+                                            deleteInstanceByEntityNameAndId(entity.declaration.name, instance.id)
+                                                .then(() => {
+                                                setInstances(instances.filter(i => i.id !== instance.id));
+                                            })
+                                                .catch(error => {
+                                                alert("Error deleting instance:\n\n" + error);
+                                            });
+                                        }
+                                    }, children: "Delete" })] })] }, instance.id))) })] }));
+};

package/lib/client/routes/Home.d.ts

@@ -0,0 +1,2 @@
+import { FunctionalComponent } from "preact";
+export declare const Home: FunctionalComponent;

package/lib/client/routes/Home.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { useEffect, useState } from "preact/hooks";
+import { toTitleCase } from "../../shared/utils/string.js";
+import { getAllEntities } from "../api.js";
+import { Layout } from "../components/Layout.js";
+export const Home = () => {
+    const [entities, setEntities] = useState([]);
+    useEffect(() => {
+        getAllEntities()
+            .then(data => {
+            setEntities(data.declarations.sort((a, b) => a.declaration.name.localeCompare(b.declaration.name)));
+        })
+            .catch(error => {
+            console.error("Error fetching entities:", error);
+        });
+    }, []);
+    return (_jsxs(Layout, { breadcrumbs: [{ url: "/", label: "Home" }], children: [_jsx("h1", { children: "Entities" }), _jsx("ul", { class: "entities", children: entities.map(entity => (_jsxs("li", { class: "entity-item", children: [_jsxs("div", { className: "title", children: [_jsx("h2", { children: toTitleCase(entity.declaration.name) }), entity.declaration.comment && _jsx("p", { children: entity.declaration.comment })] }), _jsxs("p", { class: "meta", children: [entity.instanceCount, " instance", entity.instanceCount === 1 ? "" : "s"] }), _jsx("div", { className: "btns", children: _jsx("a", { href: `/entities/${entity.declaration.name}`, class: "btn", children: "View" }) })] }, entity.declaration.name))) })] }));
+};

package/lib/client/routes/Instance.d.ts

@@ -0,0 +1,2 @@
+import { FunctionalComponent } from "preact";
+export declare const Instance: FunctionalComponent;

package/lib/client/routes/Instance.js

@@ -0,0 +1,73 @@
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { useLocation, useRoute } from "preact-iso";
+import { useEffect, useMemo, useState } from "preact/hooks";
+import { deepEqual } from "../../shared/utils/compare.js";
+import { getDisplayNameFromEntityInstance } from "../../shared/utils/displayName.js";
+import { deleteInstanceByEntityNameAndId, getInstanceByEntityNameAndId, updateInstanceByEntityNameAndId, } from "../api.js";
+import { Layout } from "../components/Layout.js";
+import { TypeInput } from "../components/typeInputs/TypeInput.js";
+import { useEntityFromRoute } from "../hooks/useEntityFromRoute.js";
+import { useInstanceNamesByEntity } from "../hooks/useInstanceNamesByEntity.js";
+import { useGetDeclFromDeclName } from "../hooks/useSecondaryDeclarations.js";
+import { NotFound } from "./NotFound.js";
+export const Instance = () => {
+    const { params: { name, id }, } = useRoute();
+    const getDeclFromDeclName = useGetDeclFromDeclName();
+    const entityFromRoute = useEntityFromRoute();
+    const [instanceNamesByEntity] = useInstanceNamesByEntity();
+    const [instance, setInstance] = useState();
+    const [originalInstance, setOriginalInstance] = useState();
+    const { route } = useLocation();
+    const hasChanges = useMemo(() => !deepEqual(instance?.content, originalInstance?.content), [instance?.content, originalInstance?.content]);
+    useEffect(() => {
+        if (name && id) {
+            getInstanceByEntityNameAndId(name, id)
+                .then(instanceData => {
+                setInstance(instanceData.instance);
+                setOriginalInstance(instanceData.instance);
+            })
+                .catch(error => {
+                console.error("Error fetching entities:", error);
+            });
+        }
+    }, []);
+    const handleSubmit = (event) => {
+        event.preventDefault();
+        if (name && id && instance) {
+            updateInstanceByEntityNameAndId(name, id, instance.content)
+                .then(updatedInstance => {
+                0;
+                setInstance(updatedInstance.instance);
+                setOriginalInstance(updatedInstance.instance);
+            })
+                .catch(error => {
+                alert(`Error updating instance:\n\n${error}`);
+            });
+        }
+    };
+    if (!name || !id) {
+        return _jsx(NotFound, {});
+    }
+    if (!entityFromRoute || !instance || !originalInstance) {
+        return (_jsxs(Layout, { breadcrumbs: [
+                { url: "/", label: "Home" },
+                { url: `/entities/${name}`, label: name },
+            ], children: [_jsx("h1", { children: id }), _jsx("p", { className: "loading", children: "Loading \u2026" })] }));
+    }
+    const defaultName = id;
+    const instanceName = getDisplayNameFromEntityInstance(entityFromRoute.entity, instance.content, defaultName);
+    return (_jsxs(Layout, { breadcrumbs: [
+            { url: "/", label: "Home" },
+            { url: `/entities/${name}`, label: entityFromRoute.entity.name },
+        ], children: [_jsxs("div", { class: "header-with-btns", children: [_jsxs("h1", { class: instanceName.length === 0 ? "empty-name" : undefined, children: [_jsx("span", { children: instanceName || defaultName }), " ", _jsx("span", { className: "id", "aria-hidden": true, children: instance.id })] }), _jsx("button", { class: "destructive", onClick: () => {
+                            if (confirm("Are you sure you want to delete this instance?")) {
+                                deleteInstanceByEntityNameAndId(entityFromRoute.entity.name, instance.id)
+                                    .then(() => {
+                                    route(`/entities/${name}`);
+                                })
+                                    .catch(error => {
+                                    alert("Error deleting instance:\n\n" + error);
+                                });
+                            }
+                        }, children: "Delete" })] }), _jsxs("form", { onSubmit: handleSubmit, children: [_jsx(TypeInput, { type: entityFromRoute.entity.type, value: instance.content, instanceNamesByEntity: instanceNamesByEntity, getDeclFromDeclName: getDeclFromDeclName, onChange: value => setInstance(container => ({ ...container, content: value })) }), _jsx("button", { type: "submit", disabled: !hasChanges, class: "primary", children: "Save" })] })] }));
+};

package/lib/client/routes/NotFound.d.ts

@@ -0,0 +1,2 @@
+import { FunctionalComponent } from "preact";
+export declare const NotFound: FunctionalComponent;

package/lib/client/routes/NotFound.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+import { Layout } from "../components/Layout.js";
+export const NotFound = () => {
+    return (_jsxs(Layout, { breadcrumbs: [{ url: "/", label: "Home" }], children: [_jsx("h1", { children: "404 Not Found" }), _jsx("p", { children: "The page you are looking for does not exist." })] }));
+};

package/lib/client/utils/typeSkeleton.d.ts

@@ -0,0 +1,3 @@
+import { SerializedType } from "../../schema/types/Type.js";
+import { GetDeclFromDeclName } from "../hooks/useSecondaryDeclarations.js";
+export declare const createTypeSkeleton: (getDeclFromDeclName: GetDeclFromDeclName, type: SerializedType) => unknown;

package/lib/client/utils/typeSkeleton.js

@@ -0,0 +1,51 @@
+import { assertExhaustive } from "../../shared/utils/typeSafety.js";
+export const createTypeSkeleton = (getDeclFromDeclName, type) => {
+    switch (type.kind) {
+        case "BooleanType":
+            return false;
+        case "DateType":
+            return type.time === true ? new Date().toISOString() : new Date().toDateString();
+        case "FloatType":
+            return 0.0;
+        case "IntegerType":
+            return 0;
+        case "StringType":
+            return "";
+        case "ArrayType":
+            return Array.from({ length: type.minItems ?? 0 }, () => createTypeSkeleton(getDeclFromDeclName, type.items));
+        case "ObjectType":
+            return Object.fromEntries(Object.entries(type.properties).flatMap(([key, memberDecl]) => memberDecl.isRequired
+                ? [[key, createTypeSkeleton(getDeclFromDeclName, memberDecl.type)]]
+                : []));
+        case "GenericArgumentIdentifierType":
+            return undefined;
+        case "ReferenceIdentifierType":
+            return "";
+        case "IncludeIdentifierType": {
+            const referencedDecl = getDeclFromDeclName(type.reference);
+            if (referencedDecl === undefined) {
+                return undefined;
+            }
+            switch (referencedDecl.kind) {
+                case "TypeAliasDecl":
+                    return createTypeSkeleton(getDeclFromDeclName, referencedDecl.type);
+                case "EnumDecl": {
+                    const firstCase = Object.entries(referencedDecl.values)[0];
+                    if (firstCase[1] === null) {
+                        return { kind: firstCase[0] };
+                    }
+                    return {
+                        kind: firstCase[0],
+                        [firstCase[0]]: createTypeSkeleton(getDeclFromDeclName, firstCase[1]),
+                    };
+                }
+                default:
+                    return assertExhaustive(referencedDecl);
+            }
+        }
+        case "NestedEntityMapType":
+            return {};
+        default:
+            return assertExhaustive(type);
+    }
+};

package/lib/index.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/index.js

@@ -0,0 +1 @@
+export {};

package/lib/renderers/Output.d.ts

@@ -0,0 +1,4 @@
+import { Schema } from "../Schema.js";
+export interface Output {
+    run: (schema: Schema) => Promise<void>;
+}

package/lib/renderers/Output.js

@@ -0,0 +1 @@
+export {};

package/lib/renderers/jsonschema/index.d.ts

@@ -0,0 +1,6 @@
+import { Output } from "../Output.js";
+import { JsonSchemaRendererOptions } from "./render.js";
+export declare const JsonSchemaOutput: (options: {
+    targetPath: string;
+    rendererOptions?: JsonSchemaRendererOptions;
+}) => Output;

package/lib/renderers/jsonschema/index.js

@@ -0,0 +1,12 @@
+import { mkdir, writeFile } from "fs/promises";
+import { dirname } from "path";
+import { resolveTypeArgumentsInDecls } from "../../schema/index.js";
+import { render } from "./render.js";
+export const JsonSchemaOutput = (options) => ({
+    run: async (schema) => {
+        await mkdir(dirname(options.targetPath), { recursive: true });
+        await writeFile(options.targetPath, render(options.rendererOptions, resolveTypeArgumentsInDecls(schema.declarations)), {
+            encoding: "utf-8",
+        });
+    },
+});

package/lib/renderers/jsonschema/render.d.ts

@@ -0,0 +1,5 @@
+import { Decl } from "../../schema/declarations/Declaration.js";
+export type JsonSchemaRendererOptions = {
+    indentation: number;
+};
+export declare const render: (options: Partial<JsonSchemaRendererOptions> | undefined, declarations: readonly Decl[]) => string;