@sealcode/jdd-editor 0.1.23 → 0.2.1

package/.husky/pre-commit

@@ -0,0 +1 @@
+npm run typecheck && npm run lint 

package/@types/component-preview-actions.d.ts

@@ -1,6 +1,6 @@
 import type { Registry } from "@sealcode/jdd";
 import type { JDDPageState } from "./jdd-page.js";
-import type { StatefulPageActionArgument } from "@sealcode/sealgen";
+import type { StatefulPageAction } from "@sealcode/sealgen";
 export declare function getComponentData(state: JDDPageState, arg_path: string[], registry: Registry): {
     component_index: number;
     component_args: Record<string, unknown>;
@@ -10,28 +10,4 @@ export declare function getComponentData(state: JDDPageState, arg_path: string[]
     argument_value: unknown;
     arg_path_within_component: string[];
 };
-export declare const ComponentPreviewActions: {
-    readonly add_array_item: ({ ctx, state, args: [arg_path], page, }: StatefulPageActionArgument<JDDPageState, [string[]]>) => Promise<JDDPageState>;
-    readonly remove_array_item: ({ state, args: [arg_path, index_to_remove], }: StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-    readonly move_array_item_up: ({ state, args: [arg_path, element_index], }: StatefulPageActionArgument<JDDPageState, [string[], number]>) => Promise<JDDPageState>;
-    readonly move_array_item_down: ({ state, args: [arg_path, element_index], }: StatefulPageActionArgument<JDDPageState, [string[], number]>) => Promise<JDDPageState>;
-    readonly change_component: ({ ctx, inputs, state, page, }: StatefulPageActionArgument<JDDPageState, []>) => Promise<JDDPageState>;
-    readonly randomize_args: ({ ctx, state, page, args: [component_index_str], }: StatefulPageActionArgument<JDDPageState, [string]>) => Promise<JDDPageState>;
-    readonly add_table_row: ({ ctx, state, page, args: [arg_path, columns, type], }: StatefulPageActionArgument<JDDPageState, [string[], number, "header" | "row" | undefined]>) => Promise<JDDPageState>;
-    readonly add_table_column: ({ ctx, state, page, args: [arg_path], }: StatefulPageActionArgument<JDDPageState, [string[]]>) => Promise<JDDPageState>;
-    readonly remove_table_column: ({ state, args: [arg_path, column_index_to_remove], }: StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-    readonly remove_table_row: ({ state, args: [arg_path, row_index], }: StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-    readonly move_table_column_right: ({ state, page, args: [arg_path, column_index], }: StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-    readonly move_table_row_down: ({ state, page, args: [arg_path, row_index], }: StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-    readonly change_size: ({ state, inputs, }: StatefulPageActionArgument<JDDPageState>) => {
-        preview_size: string | undefined;
-        components: import("@sealcode/jdd").RawJDDocument;
-        messages?: string[];
-    };
-    readonly add_component: ({ ctx, state, inputs, page, }: StatefulPageActionArgument<JDDPageState, []>) => Promise<JDDPageState>;
-    readonly remove_component: ({ state, args: [component_index], }: StatefulPageActionArgument<JDDPageState, [number]>) => Promise<JDDPageState>;
-    readonly move_component_up: ({ state, args: [component_index], }: StatefulPageActionArgument<JDDPageState, [number]>) => Promise<JDDPageState>;
-    readonly move_component_down: ({ state, args: [component_index], }: StatefulPageActionArgument<JDDPageState, [number]>) => Promise<JDDPageState>;
-    readonly remove_file: ({ state, args: [arg_path], }: StatefulPageActionArgument<JDDPageState, [string[]]>) => Promise<JDDPageState>;
-    readonly replace_state: ({ ctx, state, inputs, page, }: StatefulPageActionArgument<JDDPageState>) => Promise<any>;
-};
+export declare const ComponentPreviewActions: Record<string, StatefulPageAction<JDDPageState>>;

package/@types/components.sreact.d.ts

@@ -5,31 +5,7 @@ import type { JDDPageState } from "./jdd-page.js";
 import JDDPage from "./jdd-page.js";
 export declare class JDDDebugger extends JDDPage {
     renderParameterButtons(state: JDDPageState): Stringifiable;
-    actions: {
-        readonly add_array_item: ({ ctx, state, args: [arg_path], page, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[]]>) => Promise<JDDPageState>;
-        readonly remove_array_item: ({ state, args: [arg_path, index_to_remove], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly move_array_item_up: ({ state, args: [arg_path, element_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => Promise<JDDPageState>;
-        readonly move_array_item_down: ({ state, args: [arg_path, element_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => Promise<JDDPageState>;
-        readonly change_component: ({ ctx, inputs, state, page, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, []>) => Promise<JDDPageState>;
-        readonly randomize_args: ({ ctx, state, page, args: [component_index_str], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string]>) => Promise<JDDPageState>;
-        readonly add_table_row: ({ ctx, state, page, args: [arg_path, columns, type], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number, "header" | "row" | undefined]>) => Promise<JDDPageState>;
-        readonly add_table_column: ({ ctx, state, page, args: [arg_path], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[]]>) => Promise<JDDPageState>;
-        readonly remove_table_column: ({ state, args: [arg_path, column_index_to_remove], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly remove_table_row: ({ state, args: [arg_path, row_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly move_table_column_right: ({ state, page, args: [arg_path, column_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly move_table_row_down: ({ state, page, args: [arg_path, row_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly change_size: ({ state, inputs, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState>) => {
-            preview_size: string | undefined;
-            components: import("@sealcode/jdd").RawJDDocument;
-            messages?: string[];
-        };
-        readonly add_component: ({ ctx, state, inputs, page, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, []>) => Promise<JDDPageState>;
-        readonly remove_component: ({ state, args: [component_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [number]>) => Promise<JDDPageState>;
-        readonly move_component_up: ({ state, args: [component_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [number]>) => Promise<JDDPageState>;
-        readonly move_component_down: ({ state, args: [component_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [number]>) => Promise<JDDPageState>;
-        readonly remove_file: ({ state, args: [arg_path], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[]]>) => Promise<JDDPageState>;
-        readonly replace_state: ({ ctx, state, inputs, page, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState>) => Promise<any>;
-    };
+    actions: Record<string, import("@sealcode/sealgen").StatefulPageAction<JDDPageState>>;
     getInitialState(ctx: Context): Promise<{
         components: {
             component_name: string;

package/@types/jdd-creator.d.ts

@@ -3,31 +3,7 @@ import type { JDDPageState } from "./jdd-page.js";
 import JDDPage from "./jdd-page.js";
 import { Stringifiable } from "tempstream/@types/stringify.js";
 export default abstract class JDDCreator extends JDDPage {
-    actions: {
-        readonly add_array_item: ({ ctx, state, args: [arg_path], page, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[]]>) => Promise<JDDPageState>;
-        readonly remove_array_item: ({ state, args: [arg_path, index_to_remove], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly move_array_item_up: ({ state, args: [arg_path, element_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => Promise<JDDPageState>;
-        readonly move_array_item_down: ({ state, args: [arg_path, element_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => Promise<JDDPageState>;
-        readonly change_component: ({ ctx, inputs, state, page, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, []>) => Promise<JDDPageState>;
-        readonly randomize_args: ({ ctx, state, page, args: [component_index_str], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string]>) => Promise<JDDPageState>;
-        readonly add_table_row: ({ ctx, state, page, args: [arg_path, columns, type], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number, "header" | "row" | undefined]>) => Promise<JDDPageState>;
-        readonly add_table_column: ({ ctx, state, page, args: [arg_path], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[]]>) => Promise<JDDPageState>;
-        readonly remove_table_column: ({ state, args: [arg_path, column_index_to_remove], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly remove_table_row: ({ state, args: [arg_path, row_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly move_table_column_right: ({ state, page, args: [arg_path, column_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly move_table_row_down: ({ state, page, args: [arg_path, row_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly change_size: ({ state, inputs, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState>) => {
-            preview_size: string | undefined;
-            components: import("@sealcode/jdd").RawJDDocument;
-            messages?: string[];
-        };
-        readonly add_component: ({ ctx, state, inputs, page, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, []>) => Promise<JDDPageState>;
-        readonly remove_component: ({ state, args: [component_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [number]>) => Promise<JDDPageState>;
-        readonly move_component_up: ({ state, args: [component_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [number]>) => Promise<JDDPageState>;
-        readonly move_component_down: ({ state, args: [component_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [number]>) => Promise<JDDPageState>;
-        readonly remove_file: ({ state, args: [arg_path], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[]]>) => Promise<JDDPageState>;
-        readonly replace_state: ({ ctx, state, inputs, page, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState>) => Promise<any>;
-    };
+    actions: Record<string, import("@sealcode/sealgen").StatefulPageAction<JDDPageState>>;
     /**
      * This method returns list of components allowed in JDD Editor instance.
      * If list is empty it will allow all of the components in registry,

package/@types/jdd-page.d.ts

@@ -12,31 +12,7 @@ export type JDDPageState = {
     messages?: string[];
 };
 export default abstract class JDDPage extends StatefulPage<JDDPageState, typeof ComponentPreviewActions> {
-    actions: {
-        readonly add_array_item: ({ ctx, state, args: [arg_path], page, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[]]>) => Promise<JDDPageState>;
-        readonly remove_array_item: ({ state, args: [arg_path, index_to_remove], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly move_array_item_up: ({ state, args: [arg_path, element_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => Promise<JDDPageState>;
-        readonly move_array_item_down: ({ state, args: [arg_path, element_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => Promise<JDDPageState>;
-        readonly change_component: ({ ctx, inputs, state, page, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, []>) => Promise<JDDPageState>;
-        readonly randomize_args: ({ ctx, state, page, args: [component_index_str], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string]>) => Promise<JDDPageState>;
-        readonly add_table_row: ({ ctx, state, page, args: [arg_path, columns, type], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number, "header" | "row" | undefined]>) => Promise<JDDPageState>;
-        readonly add_table_column: ({ ctx, state, page, args: [arg_path], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[]]>) => Promise<JDDPageState>;
-        readonly remove_table_column: ({ state, args: [arg_path, column_index_to_remove], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly remove_table_row: ({ state, args: [arg_path, row_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly move_table_column_right: ({ state, page, args: [arg_path, column_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly move_table_row_down: ({ state, page, args: [arg_path, row_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[], number]>) => JDDPageState;
-        readonly change_size: ({ state, inputs, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState>) => {
-            preview_size: string | undefined;
-            components: RawJDDocument;
-            messages?: string[];
-        };
-        readonly add_component: ({ ctx, state, inputs, page, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, []>) => Promise<JDDPageState>;
-        readonly remove_component: ({ state, args: [component_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [number]>) => Promise<JDDPageState>;
-        readonly move_component_up: ({ state, args: [component_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [number]>) => Promise<JDDPageState>;
-        readonly move_component_down: ({ state, args: [component_index], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [number]>) => Promise<JDDPageState>;
-        readonly remove_file: ({ state, args: [arg_path], }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState, [string[]]>) => Promise<JDDPageState>;
-        readonly replace_state: ({ ctx, state, inputs, page, }: import("@sealcode/sealgen").StatefulPageActionArgument<JDDPageState>) => Promise<any>;
-    };
+    actions: Record<string, import("@sealcode/sealgen").StatefulPageAction<JDDPageState>>;
     previewSizes: string[];
     classes: string[];
     registry: Registry;
@@ -67,7 +43,12 @@ export default abstract class JDDPage extends StatefulPage<JDDPageState, typeof
         args: Record<string, unknown>;
     }, component_index: number): Promise<import("tempstream/@types/stringify.js").Stringifiable> | null;
     serializeState(ctx: Context, state: JDDPageState, pretty?: boolean): Promise<string>;
-    deserializeState(ctx: Context, state_string: string): Promise<any>;
+    deserializeState(ctx: Context, state_string: string): Promise<{
+        components: {
+            component_name: string;
+            args: import("@sealcode/jdd").ExtractStructuredComponentArgumentsParsed<Record<string, import("@sealcode/jdd").ComponentArgument<unknown, unknown, unknown>>>;
+        }[];
+    }>;
     renderPreParameterButtons(_ctx: Context, _state: JDDPageState): FlatTemplatable | Promise<FlatTemplatable>;
     renderMessages(_ctx: Context, state: JDDPageState): string;
     render(ctx: Context, state: JDDPageState): Promise<string>;

package/dist/src/component-preview-actions.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/component-preview-actions.ts"],
-  "sourcesContent": ["/* eslint-disable @typescript-eslint/consistent-type-assertions */\nimport type { Registry, TableData } from \"@sealcode/jdd\";\nimport { List, makeSimpleEnglishJDDContext, Table } from \"@sealcode/jdd\";\nimport { isTableData, isTableRegularRow } from \"@sealcode/jdd\";\nimport objectPath from \"object-path\";\nimport type { JDDPageState } from \"./jdd-page.js\";\nimport type { StatefulPageActionArgument } from \"@sealcode/sealgen\";\nimport type JDDPage from \"./jdd-page.js\";\n\nfunction moveElement<T>(\n\tarray: Array<T>,\n\tfromIndex: number,\n\ttoIndex: number\n): Array<T> {\n\tconst element = array.splice(fromIndex, 1)[0];\n\tarray.splice(toIndex, 0, element as T);\n\treturn array;\n}\n\nexport function getComponentData(\n\tstate: JDDPageState,\n\targ_path: string[],\n\tregistry: Registry\n) {\n\tconst index_arg = arg_path[1];\n\tif (!index_arg) {\n\t\tthrow new Error(\"Missing component index in arg path\");\n\t}\n\tconst component_index = parseInt(index_arg);\n\tconst component_args = state.components[component_index]?.args || {};\n\tconst component_name =\n\t\tstate.components[component_index]?.component_name || \"\";\n\tconst component = registry.get(component_name);\n\tconst arg_path_within_component = arg_path.slice(3); // remove \"components\" and the index of the component and \"args\"\n\n\tconst [argument, , argument_value] = component?.getArgumentAtPath(\n\t\tmakeSimpleEnglishJDDContext({ registry }),\n\t\targ_path_within_component,\n\t\tcomponent_args\n\t) || [null, null, null];\n\n\treturn {\n\t\tcomponent_index,\n\t\tcomponent_args,\n\t\tcomponent_name,\n\t\tcomponent,\n\t\targument,\n\t\targument_value,\n\t\targ_path_within_component,\n\t};\n}\n\nexport const ComponentPreviewActions = <const>{\n\tadd_array_item: async ({\n\t\tctx,\n\t\tstate,\n\t\targs: [arg_path],\n\t\tpage,\n\t}: StatefulPageActionArgument<JDDPageState, [string[]]>) => {\n\t\tconst {\n\t\t\tcomponent_name,\n\t\t\tcomponent,\n\t\t\targument,\n\t\t\targ_path_within_component,\n\t\t\targument_value,\n\t\t} = getComponentData(state, arg_path, (page as JDDPage).registry);\n\t\tif (!component) {\n\t\t\tconsole.error(\"unknown component: \", component_name);\n\t\t\treturn state;\n\t\t}\n\t\tif (!argument) {\n\t\t\tconsole.error(\n\t\t\t\t\"Didn't find a list argument at this path\",\n\t\t\t\targ_path_within_component\n\t\t\t);\n\t\t\tconsole.debug(\"Found this instead:\", argument);\n\t\t\treturn state;\n\t\t}\n\t\tif (!(argument instanceof List)) {\n\t\t\tthrow new Error(\n\t\t\t\t`Expected argument in path ${arg_path.join(\n\t\t\t\t\t\".\"\n\t\t\t\t)} to be an instance of List`\n\t\t\t);\n\t\t}\n\t\tobjectPath.insert(\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\tawait argument.item_type.getExampleValue(\n\t\t\t\t(page as JDDPage).makeJDDContext(ctx)\n\t\t\t),\n\t\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\t\tArray.isArray(argument_value) ? argument_value.length : 0\n\t\t);\n\t\treturn state;\n\t},\n\n\tremove_array_item: ({\n\t\tstate,\n\t\targs: [arg_path, index_to_remove],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[], number]\n\t>): JDDPageState => {\n\t\tobjectPath.del(state, [...arg_path, index_to_remove]);\n\t\treturn state;\n\t},\n\n\tmove_array_item_up: async ({\n\t\tstate,\n\t\targs: [arg_path, element_index],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[], number]\n\t>): Promise<JDDPageState> => {\n\t\tconst array_values = objectPath.get(state, arg_path) as unknown[];\n\t\tconst curr = array_values[element_index];\n\t\tconst prev = array_values[element_index - 1];\n\t\tif (!prev || !curr) {\n\t\t\tthrow new Error(\"No element at such index or cannot move it up\");\n\t\t}\n\t\t[array_values[element_index - 1], array_values[element_index]] = [\n\t\t\tcurr,\n\t\t\tprev,\n\t\t];\n\t\treturn state;\n\t},\n\n\tmove_array_item_down: async ({\n\t\tstate,\n\t\targs: [arg_path, element_index],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[], number]\n\t>): Promise<JDDPageState> => {\n\t\tconst array_values = objectPath.get(state, arg_path) as unknown[];\n\t\tconst curr = array_values[element_index];\n\t\tconst next = array_values[element_index + 1];\n\t\tif (!next || !curr) {\n\t\t\tthrow new Error(\"No element at such index or cannot move it up\");\n\t\t}\n\t\t[array_values[element_index], array_values[element_index + 1]] = [\n\t\t\tnext,\n\t\t\tcurr,\n\t\t];\n\t\treturn state;\n\t},\n\n\tchange_component: async ({\n\t\tctx,\n\t\tinputs,\n\t\tstate,\n\t\tpage,\n\t}: StatefulPageActionArgument<JDDPageState, []>): Promise<JDDPageState> => {\n\t\tconst component_name = inputs.component;\n\t\tif (!component_name || typeof component_name !== \"string\") {\n\t\t\tthrow new Error(\n\t\t\t\t\"Missing input: 'component' for action change_component. It should contain the name of the new component type\"\n\t\t\t);\n\t\t}\n\t\tconst component = (page as JDDPage).registry.get(component_name);\n\t\tif (!component) {\n\t\t\tthrow new Error(\n\t\t\t\t`Unknown or disallowed component name: ${component_name}`\n\t\t\t);\n\t\t}\n\t\treturn {\n\t\t\t...state,\n\t\t\tcomponents: [\n\t\t\t\t{\n\t\t\t\t\tcomponent_name: component_name,\n\t\t\t\t\targs:\n\t\t\t\t\t\t(await component?.getExampleValues(\n\t\t\t\t\t\t\t(page as JDDPage).makeJDDContext(ctx)\n\t\t\t\t\t\t)) || {},\n\t\t\t\t},\n\t\t\t],\n\t\t};\n\t},\n\n\trandomize_args: async ({\n\t\tctx,\n\t\tstate,\n\t\tpage,\n\t\targs: [component_index_str],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string]\n\t>): Promise<JDDPageState> => {\n\t\tconst { component_index, component } = getComponentData(\n\t\t\tstate,\n\t\t\t[\"components\", component_index_str],\n\t\t\t(page as JDDPage).registry\n\t\t);\n\n\t\tconst component_data = state.components[component_index];\n\t\tif (!component_data) {\n\t\t\tthrow new Error(\"Missing component data\");\n\t\t}\n\t\tcomponent_data.args =\n\t\t\t(await component?.getExampleValues(\n\t\t\t\t(page as JDDPage).makeJDDContext(ctx)\n\t\t\t)) || {};\n\t\treturn {\n\t\t\t...state,\n\t\t};\n\t},\n\n\tadd_table_row: async ({\n\t\tctx,\n\t\tstate,\n\t\tpage,\n\t\targs: [arg_path, columns, type = \"row\"],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[], number, \"header\" | \"row\" | undefined]\n\t>) => {\n\t\tconst jdd_context = (page as JDDPage).makeJDDContext(ctx);\n\t\tconst { component_args, argument } = getComponentData(\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\t(page as JDDPage).registry\n\t\t);\n\t\tlet row;\n\n\t\tif (!argument) {\n\t\t\tconsole.error(\"Unknown component at path\", arg_path);\n\t\t\treturn state;\n\t\t}\n\t\tif (!(argument instanceof Table)) {\n\t\t\tthrow new Error(\n\t\t\t\t`Expected argument at path ${arg_path.join(\n\t\t\t\t\t\".\"\n\t\t\t\t)} to be of type Table`\n\t\t\t);\n\t\t}\n\t\tif (type == \"header\") {\n\t\t\trow = {\n\t\t\t\ttype: \"header\",\n\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\theader_content: await argument.header_type.getExampleValue(\n\t\t\t\t\tjdd_context\n\t\t\t\t),\n\t\t\t};\n\t\t} else {\n\t\t\tconst cells = [];\n\t\t\tfor (let i = 0; i < columns; i++) {\n\t\t\t\tcells.push(\n\t\t\t\t\t// eslint-disable-next-line no-await-in-loop\n\t\t\t\t\tawait argument.cell_type.getExampleValue(jdd_context)\n\t\t\t\t);\n\t\t\t}\n\t\t\trow = { type: \"row\", cells };\n\t\t}\n\t\tobjectPath.push(state, [...arg_path, \"rows\"], row);\n\t\treturn state;\n\t},\n\n\tadd_table_column: async ({\n\t\tctx,\n\t\tstate,\n\t\tpage,\n\t\targs: [arg_path],\n\t}: StatefulPageActionArgument<JDDPageState, [string[]]>) => {\n\t\tconst { argument } = getComponentData(\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\t(page as JDDPage).registry\n\t\t) as unknown as {\n\t\t\targument: Table<unknown, unknown>;\n\t\t};\n\t\tif (!argument) {\n\t\t\tconsole.error(\"Unknown component at path\", arg_path);\n\t\t\treturn state;\n\t\t}\n\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\tconst tableData: TableData<unknown, unknown> = objectPath.get(\n\t\t\tstate,\n\t\t\targ_path\n\t\t);\n\t\tif (!isTableData(tableData)) {\n\t\t\tthrow new Error(\"wrong table data\");\n\t\t}\n\t\t// eslint-disable-next-line @typescript-eslint/no-for-in-array\n\t\tfor (const i in tableData.rows) {\n\t\t\tconst row = tableData.rows[i];\n\t\t\tif (isTableRegularRow(row)) {\n\t\t\t\trow.cells.push(\n\t\t\t\t\t// eslint-disable-next-line no-await-in-loop\n\t\t\t\t\tawait argument.cell_type.getExampleValue(\n\t\t\t\t\t\t(page as JDDPage).makeJDDContext(ctx)\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\t\tobjectPath.set(state, arg_path, tableData);\n\t\tconsole.log(\"NEW STATE AFTER ADDING THE COLUN\");\n\t\tconsole.dir(state, { depth: 10 });\n\t\treturn state;\n\t},\n\n\tremove_table_column: ({\n\t\tstate,\n\t\targs: [arg_path, column_index_to_remove],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[], number]\n\t>): JDDPageState => {\n\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\tconst tableData: TableData<unknown, unknown> = objectPath.get(\n\t\t\tstate,\n\t\t\targ_path\n\t\t);\n\t\tif (!isTableData(tableData)) {\n\t\t\tthrow new Error(\"wrong table data\");\n\t\t}\n\t\t// eslint-disable-next-line @typescript-eslint/no-for-in-array\n\t\tfor (const i in tableData.rows) {\n\t\t\tconst row = tableData.rows[i];\n\t\t\tif (isTableRegularRow(row)) {\n\t\t\t\trow.cells = row.cells.filter(\n\t\t\t\t\t(_, i) => i != column_index_to_remove\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\t\tobjectPath.set(state, arg_path, tableData);\n\t\treturn state;\n\t},\n\n\tremove_table_row: ({\n\t\tstate,\n\t\targs: [arg_path, row_index],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[], number]\n\t>): JDDPageState => {\n\t\tobjectPath.del(state, [...arg_path, \"rows\", row_index]);\n\t\treturn state;\n\t},\n\n\tmove_table_column_right: ({\n\t\tstate,\n\t\tpage,\n\t\targs: [arg_path, column_index],\n\t}: StatefulPageActionArgument<JDDPageState, [string[], number]>) => {\n\t\tconst { component_args } = getComponentData(\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\t(page as JDDPage).registry\n\t\t);\n\n\t\tconst last_path_element = arg_path.at(-1);\n\t\tif (!last_path_element) {\n\t\t\tthrow new Error(\"arg path is empty\");\n\t\t}\n\t\tconst data = objectPath.get<unknown>(\n\t\t\tcomponent_args,\n\t\t\tlast_path_element,\n\t\t\t\"\"\n\t\t);\n\t\tif (!isTableData(data)) {\n\t\t\tthrow new Error(\n\t\t\t\t\"Expected arg value for a table to be properly shaped\"\n\t\t\t);\n\t\t}\n\t\tfor (const row of data.rows) {\n\t\t\tif (row.type == \"row\") {\n\t\t\t\tmoveElement(row.cells, column_index, column_index + 1);\n\t\t\t}\n\t\t}\n\t\tobjectPath.set(state, [...arg_path, \"rows\"], data.rows);\n\t\treturn state;\n\t},\n\n\tmove_table_row_down: ({\n\t\tstate,\n\t\tpage,\n\t\targs: [arg_path, row_index],\n\t}: StatefulPageActionArgument<JDDPageState, [string[], number]>) => {\n\t\tconst { component_args } = getComponentData(\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\t(page as JDDPage).registry\n\t\t);\n\t\tconst last_path_element = arg_path.at(-1);\n\t\tif (!last_path_element) {\n\t\t\tthrow new Error(\"arg path is empty\");\n\t\t}\n\t\tconst data = objectPath.get<unknown>(\n\t\t\tcomponent_args,\n\t\t\tlast_path_element,\n\t\t\t\"\"\n\t\t);\n\t\tif (!isTableData(data)) {\n\t\t\tthrow new Error(\n\t\t\t\t\"Expected arg value for a table to be properly shaped\"\n\t\t\t);\n\t\t}\n\t\tmoveElement(data.rows, row_index, row_index + 1);\n\t\tobjectPath.set(state, [...arg_path, \"rows\"], data.rows);\n\t\treturn state;\n\t},\n\n\tchange_size: ({\n\t\tstate,\n\t\tinputs,\n\t}: StatefulPageActionArgument<JDDPageState>) => {\n\t\treturn {\n\t\t\t...state,\n\t\t\tpreview_size: inputs.size,\n\t\t};\n\t},\n\n\tadd_component: async ({\n\t\tctx,\n\t\tstate,\n\t\tinputs,\n\t\tpage,\n\t}: StatefulPageActionArgument<JDDPageState, []>): Promise<JDDPageState> => {\n\t\tconst component_name = inputs.component;\n\t\tif (!component_name) {\n\t\t\tthrow new Error(\"Missing component name\");\n\t\t}\n\t\tconst component = (page as JDDPage).registry.get(component_name);\n\n\t\treturn {\n\t\t\t...state,\n\t\t\tcomponents: [\n\t\t\t\t...state.components,\n\t\t\t\t{\n\t\t\t\t\tcomponent_name: component_name,\n\t\t\t\t\targs:\n\t\t\t\t\t\t(await component?.getExampleValues(\n\t\t\t\t\t\t\t(page as JDDPage).makeJDDContext(ctx)\n\t\t\t\t\t\t)) || {},\n\t\t\t\t},\n\t\t\t],\n\t\t};\n\t},\n\n\tremove_component: async ({\n\t\tstate,\n\t\targs: [component_index],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[number]\n\t>): Promise<JDDPageState> => {\n\t\tconst newComponentState = [...state.components];\n\t\tnewComponentState.splice(component_index, 1);\n\t\treturn {\n\t\t\t...state,\n\t\t\tcomponents: newComponentState,\n\t\t};\n\t},\n\n\tmove_component_up: async ({\n\t\tstate,\n\t\targs: [component_index],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[number]\n\t>): Promise<JDDPageState> => {\n\t\tconst newComps = [...state.components];\n\t\tconst prev = newComps[component_index - 1];\n\t\tconst curr = newComps[component_index];\n\t\tif (!prev || !curr) {\n\t\t\tthrow new Error(\"No component at such index or cannot move it up\");\n\t\t}\n\t\t[newComps[component_index], newComps[component_index - 1]] = [\n\t\t\tprev,\n\t\t\tcurr,\n\t\t];\n\t\treturn { ...state, components: newComps };\n\t},\n\n\tmove_component_down: async ({\n\t\tstate,\n\t\targs: [component_index],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[number]\n\t>): Promise<JDDPageState> => {\n\t\tconst newComps = [...state.components];\n\t\tconst next = newComps[component_index + 1];\n\t\tconst curr = newComps[component_index];\n\t\tif (!next || !curr) {\n\t\t\tthrow new Error(\"No component at such index or cannot move it up\");\n\t\t}\n\t\t[newComps[component_index], newComps[component_index + 1]] = [\n\t\t\tnext,\n\t\t\tcurr,\n\t\t];\n\t\treturn { ...state, components: newComps };\n\t},\n\n\tremove_file: async ({\n\t\tstate,\n\t\targs: [arg_path],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[]]\n\t>): Promise<JDDPageState> => {\n\t\tobjectPath.set(state, arg_path, null);\n\t\treturn state;\n\t},\n\n\treplace_state: async ({\n\t\tctx,\n\t\tstate,\n\t\tinputs,\n\t\tpage,\n\t}: StatefulPageActionArgument<JDDPageState>) => {\n\t\tconst new_state = await (page as JDDPage).deserializeState(\n\t\t\tctx,\n\t\t\tinputs[\"state_override\"] || \"{}\"\n\t\t);\n\t\treturn {\n\t\t\t...new_state,\n\t\t\tpreview_size: state.preview_size,\n\t\t};\n\t},\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable @typescript-eslint/consistent-type-assertions */\nimport type { Registry, TableData } from \"@sealcode/jdd\";\nimport { List, makeSimpleEnglishJDDContext, Table } from \"@sealcode/jdd\";\nimport { isTableData, isTableRegularRow } from \"@sealcode/jdd\";\nimport objectPath from \"object-path\";\nimport type { JDDPageState } from \"./jdd-page.js\";\nimport type {\n\tStatefulPageAction,\n\tStatefulPageActionArgument,\n} from \"@sealcode/sealgen\";\nimport type JDDPage from \"./jdd-page.js\";\n\nfunction moveElement<T>(\n\tarray: Array<T>,\n\tfromIndex: number,\n\ttoIndex: number\n): Array<T> {\n\tconst element = array.splice(fromIndex, 1)[0];\n\tarray.splice(toIndex, 0, element as T);\n\treturn array;\n}\n\nexport function getComponentData(\n\tstate: JDDPageState,\n\targ_path: string[],\n\tregistry: Registry\n) {\n\tconst index_arg = arg_path[1];\n\tif (!index_arg) {\n\t\tthrow new Error(\"Missing component index in arg path\");\n\t}\n\tconst component_index = parseInt(index_arg);\n\tconst component_args = state.components[component_index]?.args || {};\n\tconst component_name =\n\t\tstate.components[component_index]?.component_name || \"\";\n\tconst component = registry.get(component_name);\n\tconst arg_path_within_component = arg_path.slice(3); // remove \"components\" and the index of the component and \"args\"\n\n\tconst [argument, , argument_value] = component?.getArgumentAtPath(\n\t\tmakeSimpleEnglishJDDContext({ registry }),\n\t\targ_path_within_component,\n\t\tcomponent_args\n\t) || [null, null, null];\n\n\treturn {\n\t\tcomponent_index,\n\t\tcomponent_args,\n\t\tcomponent_name,\n\t\tcomponent,\n\t\targument,\n\t\targument_value,\n\t\targ_path_within_component,\n\t};\n}\n\nexport const ComponentPreviewActions = (<const>{\n\tadd_array_item: async ({\n\t\tctx,\n\t\tstate,\n\t\targs: [arg_path],\n\t\tpage,\n\t}: StatefulPageActionArgument<JDDPageState, [string[]]>) => {\n\t\tconst {\n\t\t\tcomponent_name,\n\t\t\tcomponent,\n\t\t\targument,\n\t\t\targ_path_within_component,\n\t\t\targument_value,\n\t\t} = getComponentData(state, arg_path, (page as JDDPage).registry);\n\t\tif (!component) {\n\t\t\tconsole.error(\"unknown component: \", component_name);\n\t\t\treturn state;\n\t\t}\n\t\tif (!argument) {\n\t\t\tconsole.error(\n\t\t\t\t\"Didn't find a list argument at this path\",\n\t\t\t\targ_path_within_component\n\t\t\t);\n\t\t\tconsole.debug(\"Found this instead:\", argument);\n\t\t\treturn state;\n\t\t}\n\t\tif (!(argument instanceof List)) {\n\t\t\tthrow new Error(\n\t\t\t\t`Expected argument in path ${arg_path.join(\n\t\t\t\t\t\".\"\n\t\t\t\t)} to be an instance of List`\n\t\t\t);\n\t\t}\n\t\tobjectPath.insert(\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\tawait argument.item_type.getExampleValue(\n\t\t\t\t(page as JDDPage).makeJDDContext(ctx)\n\t\t\t),\n\t\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\t\tArray.isArray(argument_value) ? argument_value.length : 0\n\t\t);\n\t\treturn state;\n\t},\n\n\tremove_array_item: ({\n\t\tstate,\n\t\targs: [arg_path, index_to_remove],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[], number]\n\t>): JDDPageState => {\n\t\tobjectPath.del(state, [...arg_path, index_to_remove]);\n\t\treturn state;\n\t},\n\n\tmove_array_item_up: async ({\n\t\tstate,\n\t\targs: [arg_path, element_index],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[], number]\n\t>): Promise<JDDPageState> => {\n\t\tconst array_values = objectPath.get(state, arg_path) as unknown[];\n\t\tconst curr = array_values[element_index];\n\t\tconst prev = array_values[element_index - 1];\n\t\tif (!prev || !curr) {\n\t\t\tthrow new Error(\"No element at such index or cannot move it up\");\n\t\t}\n\t\t[array_values[element_index - 1], array_values[element_index]] = [\n\t\t\tcurr,\n\t\t\tprev,\n\t\t];\n\t\treturn state;\n\t},\n\n\tmove_array_item_down: async ({\n\t\tstate,\n\t\targs: [arg_path, element_index],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[], number]\n\t>): Promise<JDDPageState> => {\n\t\tconst array_values = objectPath.get(state, arg_path) as unknown[];\n\t\tconst curr = array_values[element_index];\n\t\tconst next = array_values[element_index + 1];\n\t\tif (!next || !curr) {\n\t\t\tthrow new Error(\"No element at such index or cannot move it up\");\n\t\t}\n\t\t[array_values[element_index], array_values[element_index + 1]] = [\n\t\t\tnext,\n\t\t\tcurr,\n\t\t];\n\t\treturn state;\n\t},\n\n\tchange_component: async ({\n\t\tctx,\n\t\tinputs,\n\t\tstate,\n\t\tpage,\n\t}: StatefulPageActionArgument<JDDPageState, []>): Promise<JDDPageState> => {\n\t\tconst component_name = inputs.component;\n\t\tif (!component_name || typeof component_name !== \"string\") {\n\t\t\tthrow new Error(\n\t\t\t\t\"Missing input: 'component' for action change_component. It should contain the name of the new component type\"\n\t\t\t);\n\t\t}\n\t\tconst component = (page as JDDPage).registry.get(component_name);\n\t\tif (!component) {\n\t\t\tthrow new Error(\n\t\t\t\t`Unknown or disallowed component name: ${component_name}`\n\t\t\t);\n\t\t}\n\t\treturn {\n\t\t\t...state,\n\t\t\tcomponents: [\n\t\t\t\t{\n\t\t\t\t\tcomponent_name: component_name,\n\t\t\t\t\targs:\n\t\t\t\t\t\t(await component?.getExampleValues(\n\t\t\t\t\t\t\t(page as JDDPage).makeJDDContext(ctx)\n\t\t\t\t\t\t)) || {},\n\t\t\t\t},\n\t\t\t],\n\t\t};\n\t},\n\n\trandomize_args: async ({\n\t\tctx,\n\t\tstate,\n\t\tpage,\n\t\targs: [component_index_str],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string]\n\t>): Promise<JDDPageState> => {\n\t\tconst { component_index, component } = getComponentData(\n\t\t\tstate,\n\t\t\t[\"components\", component_index_str],\n\t\t\t(page as JDDPage).registry\n\t\t);\n\n\t\tconst component_data = state.components[component_index];\n\t\tif (!component_data) {\n\t\t\tthrow new Error(\"Missing component data\");\n\t\t}\n\t\tcomponent_data.args =\n\t\t\t(await component?.getExampleValues(\n\t\t\t\t(page as JDDPage).makeJDDContext(ctx)\n\t\t\t)) || {};\n\t\treturn {\n\t\t\t...state,\n\t\t};\n\t},\n\n\tadd_table_row: async ({\n\t\tctx,\n\t\tstate,\n\t\tpage,\n\t\targs: [arg_path, columns, type = \"row\"],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[], number, \"header\" | \"row\" | undefined]\n\t>) => {\n\t\tconst jdd_context = (page as JDDPage).makeJDDContext(ctx);\n\t\tconst { component_args, argument } = getComponentData(\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\t(page as JDDPage).registry\n\t\t);\n\t\tlet row;\n\n\t\tif (!argument) {\n\t\t\tconsole.error(\"Unknown component at path\", arg_path);\n\t\t\treturn state;\n\t\t}\n\t\tif (!(argument instanceof Table)) {\n\t\t\tthrow new Error(\n\t\t\t\t`Expected argument at path ${arg_path.join(\n\t\t\t\t\t\".\"\n\t\t\t\t)} to be of type Table`\n\t\t\t);\n\t\t}\n\t\tif (type == \"header\") {\n\t\t\trow = {\n\t\t\t\ttype: \"header\",\n\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\t\t\theader_content: await argument.header_type.getExampleValue(\n\t\t\t\t\tjdd_context\n\t\t\t\t),\n\t\t\t};\n\t\t} else {\n\t\t\tconst cells = [];\n\t\t\tfor (let i = 0; i < columns; i++) {\n\t\t\t\tcells.push(\n\t\t\t\t\t// eslint-disable-next-line no-await-in-loop\n\t\t\t\t\tawait argument.cell_type.getExampleValue(jdd_context)\n\t\t\t\t);\n\t\t\t}\n\t\t\trow = { type: \"row\", cells };\n\t\t}\n\t\tobjectPath.push(state, [...arg_path, \"rows\"], row);\n\t\treturn state;\n\t},\n\n\tadd_table_column: async ({\n\t\tctx,\n\t\tstate,\n\t\tpage,\n\t\targs: [arg_path],\n\t}: StatefulPageActionArgument<JDDPageState, [string[]]>) => {\n\t\tconst { argument } = getComponentData(\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\t(page as JDDPage).registry\n\t\t) as unknown as {\n\t\t\targument: Table<unknown, unknown>;\n\t\t};\n\t\tif (!argument) {\n\t\t\tconsole.error(\"Unknown component at path\", arg_path);\n\t\t\treturn state;\n\t\t}\n\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\tconst tableData: TableData<unknown, unknown> = objectPath.get(\n\t\t\tstate,\n\t\t\targ_path\n\t\t);\n\t\tif (!isTableData(tableData)) {\n\t\t\tthrow new Error(\"wrong table data\");\n\t\t}\n\t\t// eslint-disable-next-line @typescript-eslint/no-for-in-array\n\t\tfor (const i in tableData.rows) {\n\t\t\tconst row = tableData.rows[i];\n\t\t\tif (isTableRegularRow(row)) {\n\t\t\t\trow.cells.push(\n\t\t\t\t\t// eslint-disable-next-line no-await-in-loop\n\t\t\t\t\tawait argument.cell_type.getExampleValue(\n\t\t\t\t\t\t(page as JDDPage).makeJDDContext(ctx)\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\t\tobjectPath.set(state, arg_path, tableData);\n\t\tconsole.log(\"NEW STATE AFTER ADDING THE COLUN\");\n\t\tconsole.dir(state, { depth: 10 });\n\t\treturn state;\n\t},\n\n\tremove_table_column: ({\n\t\tstate,\n\t\targs: [arg_path, column_index_to_remove],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[], number]\n\t>): JDDPageState => {\n\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\tconst tableData: TableData<unknown, unknown> = objectPath.get(\n\t\t\tstate,\n\t\t\targ_path\n\t\t);\n\t\tif (!isTableData(tableData)) {\n\t\t\tthrow new Error(\"wrong table data\");\n\t\t}\n\t\t// eslint-disable-next-line @typescript-eslint/no-for-in-array\n\t\tfor (const i in tableData.rows) {\n\t\t\tconst row = tableData.rows[i];\n\t\t\tif (isTableRegularRow(row)) {\n\t\t\t\trow.cells = row.cells.filter(\n\t\t\t\t\t(_, i) => i != column_index_to_remove\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\t\tobjectPath.set(state, arg_path, tableData);\n\t\treturn state;\n\t},\n\n\tremove_table_row: ({\n\t\tstate,\n\t\targs: [arg_path, row_index],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[], number]\n\t>): JDDPageState => {\n\t\tobjectPath.del(state, [...arg_path, \"rows\", row_index]);\n\t\treturn state;\n\t},\n\n\tmove_table_column_right: ({\n\t\tstate,\n\t\tpage,\n\t\targs: [arg_path, column_index],\n\t}: StatefulPageActionArgument<JDDPageState, [string[], number]>) => {\n\t\tconst { component_args } = getComponentData(\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\t(page as JDDPage).registry\n\t\t);\n\n\t\tconst last_path_element = arg_path.at(-1);\n\t\tif (!last_path_element) {\n\t\t\tthrow new Error(\"arg path is empty\");\n\t\t}\n\t\tconst data = objectPath.get<unknown>(\n\t\t\tcomponent_args,\n\t\t\tlast_path_element,\n\t\t\t\"\"\n\t\t);\n\t\tif (!isTableData(data)) {\n\t\t\tthrow new Error(\n\t\t\t\t\"Expected arg value for a table to be properly shaped\"\n\t\t\t);\n\t\t}\n\t\tfor (const row of data.rows) {\n\t\t\tif (row.type == \"row\") {\n\t\t\t\tmoveElement(row.cells, column_index, column_index + 1);\n\t\t\t}\n\t\t}\n\t\tobjectPath.set(state, [...arg_path, \"rows\"], data.rows);\n\t\treturn state;\n\t},\n\n\tmove_table_row_down: ({\n\t\tstate,\n\t\tpage,\n\t\targs: [arg_path, row_index],\n\t}: StatefulPageActionArgument<JDDPageState, [string[], number]>) => {\n\t\tconst { component_args } = getComponentData(\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\t(page as JDDPage).registry\n\t\t);\n\t\tconst last_path_element = arg_path.at(-1);\n\t\tif (!last_path_element) {\n\t\t\tthrow new Error(\"arg path is empty\");\n\t\t}\n\t\tconst data = objectPath.get<unknown>(\n\t\t\tcomponent_args,\n\t\t\tlast_path_element,\n\t\t\t\"\"\n\t\t);\n\t\tif (!isTableData(data)) {\n\t\t\tthrow new Error(\n\t\t\t\t\"Expected arg value for a table to be properly shaped\"\n\t\t\t);\n\t\t}\n\t\tmoveElement(data.rows, row_index, row_index + 1);\n\t\tobjectPath.set(state, [...arg_path, \"rows\"], data.rows);\n\t\treturn state;\n\t},\n\n\tchange_size: ({\n\t\tstate,\n\t\tinputs,\n\t}: StatefulPageActionArgument<JDDPageState>) => {\n\t\treturn {\n\t\t\t...state,\n\t\t\tpreview_size: inputs.size,\n\t\t};\n\t},\n\n\tadd_component: async ({\n\t\tctx,\n\t\tstate,\n\t\tinputs,\n\t\tpage,\n\t}: StatefulPageActionArgument<JDDPageState, []>): Promise<JDDPageState> => {\n\t\tconst component_name = inputs.component;\n\t\tif (!component_name) {\n\t\t\tthrow new Error(\"Missing component name\");\n\t\t}\n\t\tconst component = (page as JDDPage).registry.get(component_name);\n\n\t\treturn {\n\t\t\t...state,\n\t\t\tcomponents: [\n\t\t\t\t...state.components,\n\t\t\t\t{\n\t\t\t\t\tcomponent_name: component_name,\n\t\t\t\t\targs:\n\t\t\t\t\t\t(await component?.getExampleValues(\n\t\t\t\t\t\t\t(page as JDDPage).makeJDDContext(ctx)\n\t\t\t\t\t\t)) || {},\n\t\t\t\t},\n\t\t\t],\n\t\t};\n\t},\n\n\tremove_component: async ({\n\t\tstate,\n\t\targs: [component_index],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[number]\n\t>): Promise<JDDPageState> => {\n\t\tconst newComponentState = [...state.components];\n\t\tnewComponentState.splice(component_index, 1);\n\t\treturn {\n\t\t\t...state,\n\t\t\tcomponents: newComponentState,\n\t\t};\n\t},\n\n\tmove_component_up: async ({\n\t\tstate,\n\t\targs: [component_index],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[number]\n\t>): Promise<JDDPageState> => {\n\t\tconst newComps = [...state.components];\n\t\tconst prev = newComps[component_index - 1];\n\t\tconst curr = newComps[component_index];\n\t\tif (!prev || !curr) {\n\t\t\tthrow new Error(\"No component at such index or cannot move it up\");\n\t\t}\n\t\t[newComps[component_index], newComps[component_index - 1]] = [\n\t\t\tprev,\n\t\t\tcurr,\n\t\t];\n\t\treturn { ...state, components: newComps };\n\t},\n\n\tmove_component_down: async ({\n\t\tstate,\n\t\targs: [component_index],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[number]\n\t>): Promise<JDDPageState> => {\n\t\tconst newComps = [...state.components];\n\t\tconst next = newComps[component_index + 1];\n\t\tconst curr = newComps[component_index];\n\t\tif (!next || !curr) {\n\t\t\tthrow new Error(\"No component at such index or cannot move it up\");\n\t\t}\n\t\t[newComps[component_index], newComps[component_index + 1]] = [\n\t\t\tnext,\n\t\t\tcurr,\n\t\t];\n\t\treturn { ...state, components: newComps };\n\t},\n\n\tremove_file: async ({\n\t\tstate,\n\t\targs: [arg_path],\n\t}: StatefulPageActionArgument<\n\t\tJDDPageState,\n\t\t[string[]]\n\t>): Promise<JDDPageState> => {\n\t\tobjectPath.set(state, arg_path, null);\n\t\treturn state;\n\t},\n\n\treplace_state: async ({\n\t\tctx,\n\t\tstate,\n\t\tinputs,\n\t\tpage,\n\t}: StatefulPageActionArgument<JDDPageState>): Promise<JDDPageState> => {\n\t\tconst new_state = (await (page as JDDPage).deserializeState(\n\t\t\tctx,\n\t\t\tinputs[\"state_override\"] || \"{}\"\n\t\t)) as JDDPageState;\n\t\treturn {\n\t\t\t...new_state,\n\t\t\tpreview_size: state.preview_size,\n\t\t};\n\t},\n}) as Record<string, StatefulPageAction<JDDPageState>>;\n"],
+  "mappings": "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",
   "names": ["i"]
 }

package/dist/src/controllers/refresh-styles.stimulus.js

@@ -40,17 +40,17 @@ class RefreshStyles extends Controller {
     );
     try {
       this.socket = new WebSocket(`ws://localhost:${port}`);
+      this.socket.onmessage = async (message) => {
+        if (message.data === "css") {
+          refresh_css();
+        }
+      };
     } catch (e) {
       console.error(e);
       console.warn(
         "Not enabling auto style refresh due to the above error"
       );
     }
-    this.socket.onmessage = async (message) => {
-      if (message.data === "css") {
-        refresh_css();
-      }
-    };
     document.documentElement.addEventListener("turbo:morph", refresh_css);
   }
   async disconnect() {

package/dist/src/controllers/refresh-styles.stimulus.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/controllers/refresh-styles.stimulus.ts"],
-  "sourcesContent": ["import { Controller } from \"stimulus\";\n\nfunction make_new_link(href: string) {\n\tconst new_link = document.createElement(\"link\");\n\tnew_link.rel = \"stylesheet\";\n\tnew_link.href = `${\n\t\thref.split(\"?\")[0] || \"\"\n\t}?${Math.random()}+${Math.random()}`;\n\tnew_link.type = \"text/css\";\n\treturn new_link;\n}\n\nfunction refresh_css() {\n\tconst actual_hrefs = new Set(\n\t\tArray.from(document.querySelectorAll(\"head link[rel=stylesheet]\")).map(\n\t\t\t(e) => e?.getAttribute(\"href\")?.split(\"?\")[0]\n\t\t)\n\t);\n\treturn actual_hrefs.forEach((href: string) => {\n\t\tconst new_link = make_new_link(href);\n\t\tconst to_delete_after_load = Array.from(\n\t\t\tdocument.querySelectorAll(\n\t\t\t\t`head link[rel=stylesheet][href^=\"${href}\"]`\n\t\t\t)\n\t\t);\n\t\tnew_link.onload = function () {\n\t\t\t// delay to prevent flicker\n\t\t\tsetTimeout(() => {\n\t\t\t\tto_delete_after_load.forEach((to_remove) => {\n\t\t\t\t\tto_remove.remove();\n\t\t\t\t});\n\t\t\t}, 100);\n\t\t};\n\t\tdocument.querySelector(\"head\")?.appendChild(new_link);\n\t});\n}\n\nexport default class RefreshStyles extends Controller {\n\tsocket: WebSocket;\n\n\tasync connect() {\n\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\tconst { port } = await fetch(\"/dist/notifier.json\").then((r) =>\n\t\t\tr.json()\n\t\t);\n\t\ttry {\n\t\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\n\t\t\tthis.socket = new WebSocket(`ws://localhost:${port as number}`);\n\t\t} catch (e) {\n\t\t\tconsole.error(e);\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t\"Not enabling auto style refresh due to the above error\"\n\t\t\t);\n\t\t}\n\t\tthis.socket.onmessage = async (message) => {\n\t\t\tif (message.data === \"css\") {\n\t\t\t\trefresh_css();\n\t\t\t}\n\t\t};\n\t\tdocument.documentElement.addEventListener(\"turbo:morph\", refresh_css);\n\t}\n\n\tasync disconnect() {\n\t\tthis.socket.close();\n\t\tdocument.documentElement.removeEventListener(\n\t\t\t\"turbo:morph\",\n\t\t\trefresh_css\n\t\t);\n\t}\n}\n"],
-  "mappings": "AAAA,SAAS,kBAAkB;AAE3B,SAAS,cAAc,MAAc;AACpC,QAAM,WAAW,SAAS,cAAc,MAAM;AAC9C,WAAS,MAAM;AACf,WAAS,OAAO,GACf,KAAK,MAAM,GAAG,EAAE,MAAM,MACnB,KAAK,OAAO,KAAK,KAAK,OAAO;AACjC,WAAS,OAAO;AAChB,SAAO;AACR;AAEA,SAAS,cAAc;AACtB,QAAM,eAAe,IAAI;AAAA,IACxB,MAAM,KAAK,SAAS,iBAAiB,2BAA2B,CAAC,EAAE;AAAA,MAClE,CAAC,MAAG;AAfP;AAeU,4CAAG,aAAa,YAAhB,mBAAyB,MAAM,KAAK;AAAA;AAAA,IAC5C;AAAA,EACD;AACA,SAAO,aAAa,QAAQ,CAAC,SAAiB;AAlB/C;AAmBE,UAAM,WAAW,cAAc,IAAI;AACnC,UAAM,uBAAuB,MAAM;AAAA,MAClC,SAAS;AAAA,QACR,oCAAoC;AAAA,MACrC;AAAA,IACD;AACA,aAAS,SAAS,WAAY;AAE7B,iBAAW,MAAM;AAChB,6BAAqB,QAAQ,CAAC,cAAc;AAC3C,oBAAU,OAAO;AAAA,QAClB,CAAC;AAAA,MACF,GAAG,GAAG;AAAA,IACP;AACA,mBAAS,cAAc,MAAM,MAA7B,mBAAgC,YAAY;AAAA,EAC7C,CAAC;AACF;AAEA,MAAO,sBAAoC,WAAW;AAAA,EAGrD,MAAM,UAAU;AAEf,UAAM,EAAE,KAAK,IAAI,MAAM,MAAM,qBAAqB,EAAE;AAAA,MAAK,CAAC,MACzD,EAAE,KAAK;AAAA,IACR;AACA,QAAI;AAGH,WAAK,SAAS,IAAI,UAAU,kBAAkB,MAAgB;AAAA,IAC/D,SAAS,GAAP;AACD,cAAQ,MAAM,CAAC;AAEf,cAAQ;AAAA,QACP;AAAA,MACD;AAAA,IACD;AACA,SAAK,OAAO,YAAY,OAAO,YAAY;AAC1C,UAAI,QAAQ,SAAS,OAAO;AAC3B,oBAAY;AAAA,MACb;AAAA,IACD;AACA,aAAS,gBAAgB,iBAAiB,eAAe,WAAW;AAAA,EACrE;AAAA,EAEA,MAAM,aAAa;AAClB,SAAK,OAAO,MAAM;AAClB,aAAS,gBAAgB;AAAA,MACxB;AAAA,MACA;AAAA,IACD;AAAA,EACD;AACD;",
+  "sourcesContent": ["import { Controller } from \"stimulus\";\n\nfunction make_new_link(href: string) {\n\tconst new_link = document.createElement(\"link\");\n\tnew_link.rel = \"stylesheet\";\n\tnew_link.href = `${\n\t\thref.split(\"?\")[0] || \"\"\n\t}?${Math.random()}+${Math.random()}`;\n\tnew_link.type = \"text/css\";\n\treturn new_link;\n}\n\nfunction refresh_css() {\n\tconst actual_hrefs = new Set(\n\t\tArray.from(document.querySelectorAll(\"head link[rel=stylesheet]\")).map(\n\t\t\t(e) => e?.getAttribute(\"href\")?.split(\"?\")[0]\n\t\t)\n\t);\n\treturn actual_hrefs.forEach((href: string) => {\n\t\tconst new_link = make_new_link(href);\n\t\tconst to_delete_after_load = Array.from(\n\t\t\tdocument.querySelectorAll(\n\t\t\t\t`head link[rel=stylesheet][href^=\"${href}\"]`\n\t\t\t)\n\t\t);\n\t\tnew_link.onload = function () {\n\t\t\t// delay to prevent flicker\n\t\t\tsetTimeout(() => {\n\t\t\t\tto_delete_after_load.forEach((to_remove) => {\n\t\t\t\t\tto_remove.remove();\n\t\t\t\t});\n\t\t\t}, 100);\n\t\t};\n\t\tdocument.querySelector(\"head\")?.appendChild(new_link);\n\t});\n}\n\nexport default class RefreshStyles extends Controller {\n\tsocket: WebSocket;\n\n\tasync connect() {\n\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\tconst { port } = await fetch(\"/dist/notifier.json\").then((r) =>\n\t\t\tr.json()\n\t\t);\n\t\ttry {\n\t\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\n\t\t\tthis.socket = new WebSocket(`ws://localhost:${port as number}`);\n\t\t\tthis.socket.onmessage = async (message) => {\n\t\t\t\tif (message.data === \"css\") {\n\t\t\t\t\trefresh_css();\n\t\t\t\t}\n\t\t\t};\n\t\t} catch (e) {\n\t\t\tconsole.error(e);\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.warn(\n\t\t\t\t\"Not enabling auto style refresh due to the above error\"\n\t\t\t);\n\t\t}\n\t\tdocument.documentElement.addEventListener(\"turbo:morph\", refresh_css);\n\t}\n\n\tasync disconnect() {\n\t\tthis.socket.close();\n\t\tdocument.documentElement.removeEventListener(\n\t\t\t\"turbo:morph\",\n\t\t\trefresh_css\n\t\t);\n\t}\n}\n"],
+  "mappings": "AAAA,SAAS,kBAAkB;AAE3B,SAAS,cAAc,MAAc;AACpC,QAAM,WAAW,SAAS,cAAc,MAAM;AAC9C,WAAS,MAAM;AACf,WAAS,OAAO,GACf,KAAK,MAAM,GAAG,EAAE,MAAM,MACnB,KAAK,OAAO,KAAK,KAAK,OAAO;AACjC,WAAS,OAAO;AAChB,SAAO;AACR;AAEA,SAAS,cAAc;AACtB,QAAM,eAAe,IAAI;AAAA,IACxB,MAAM,KAAK,SAAS,iBAAiB,2BAA2B,CAAC,EAAE;AAAA,MAClE,CAAC,MAAG;AAfP;AAeU,4CAAG,aAAa,YAAhB,mBAAyB,MAAM,KAAK;AAAA;AAAA,IAC5C;AAAA,EACD;AACA,SAAO,aAAa,QAAQ,CAAC,SAAiB;AAlB/C;AAmBE,UAAM,WAAW,cAAc,IAAI;AACnC,UAAM,uBAAuB,MAAM;AAAA,MAClC,SAAS;AAAA,QACR,oCAAoC;AAAA,MACrC;AAAA,IACD;AACA,aAAS,SAAS,WAAY;AAE7B,iBAAW,MAAM;AAChB,6BAAqB,QAAQ,CAAC,cAAc;AAC3C,oBAAU,OAAO;AAAA,QAClB,CAAC;AAAA,MACF,GAAG,GAAG;AAAA,IACP;AACA,mBAAS,cAAc,MAAM,MAA7B,mBAAgC,YAAY;AAAA,EAC7C,CAAC;AACF;AAEA,MAAO,sBAAoC,WAAW;AAAA,EAGrD,MAAM,UAAU;AAEf,UAAM,EAAE,KAAK,IAAI,MAAM,MAAM,qBAAqB,EAAE;AAAA,MAAK,CAAC,MACzD,EAAE,KAAK;AAAA,IACR;AACA,QAAI;AAGH,WAAK,SAAS,IAAI,UAAU,kBAAkB,MAAgB;AAC9D,WAAK,OAAO,YAAY,OAAO,YAAY;AAC1C,YAAI,QAAQ,SAAS,OAAO;AAC3B,sBAAY;AAAA,QACb;AAAA,MACD;AAAA,IACD,SAAS,GAAP;AACD,cAAQ,MAAM,CAAC;AAEf,cAAQ;AAAA,QACP;AAAA,MACD;AAAA,IACD;AACA,aAAS,gBAAgB,iBAAiB,eAAe,WAAW;AAAA,EACrE;AAAA,EAEA,MAAM,aAAa;AAClB,SAAK,OAAO,MAAM;AAClB,aAAS,gBAAgB;AAAA,MACxB;AAAA,MACA;AAAA,IACD;AAAA,EACD;AACD;",
   "names": []
 }

package/dist/src/jdd-page.js

@@ -5,6 +5,7 @@ import { hasFieldOfType, hasShape, predicates } from "@sealcode/ts-predicates";
 import { tempstream } from "tempstream";
 import { ComponentInput } from "./inputs/component-input.js";
 import { ComponentPreviewActions } from "./component-preview-actions.js";
+import { htmlEscape } from "escape-goat";
 const actionName = "Components";
 class JDDPage extends StatefulPage {
   constructor(args) {
@@ -230,9 +231,7 @@ class JDDPage extends StatefulPage {
   }
   async render(ctx, state) {
     return tempstream`<div
-			class="${["two-column", "component-debugger", ...this.classes].join(
-      " "
-    )}"
+			class="${["two-column", "component-debugger", ...this.classes].join(" ")}"
 			id="component-debugger"
 			style="${`--resizable-column-width: ${state.preview_size ? state.preview_size + "px" : "50vw"}`}"
 			data-controller="component-debugger"
@@ -264,8 +263,8 @@ class JDDPage extends StatefulPage {
 						id="component-debugger-json-textarea"
 						autocomplete="off"
 					>
-							${(await this.serializeState(ctx, state, true)).replaceAll("<", "&lt;")}
-						</textarea
+						${(await this.serializeState(ctx, state, true)).replaceAll("<", "&lt;")}
+					</textarea
 					>
 					${this.makeActionButton(state, {
       action: "replace_state",
@@ -295,39 +294,85 @@ class JDDPage extends StatefulPage {
 					id="component-preview__header"
 					class="component-preview__header"
 				>
-					<span>Preview</span>
-					<select
-						name="$[preview_size]"
-						autocomplete="off"
-						class="component-preview-size-select"
-						data-component-debugger-target="sizeSelect"
-						data-action="change->component-debugger#handleWidthDropdown"
-						data-turbo-data-turbo-permanent
-					>
-						${state.preview_size ? `<option
-									class="dynamic"
-									value="${state.preview_size}"
-									selected
-							  >
-									${state.preview_size} px
-							  </option>` : ""}
-						${this.previewSizes.map(
+					<div class="component-preview__item">
+						<span>Window size</span>
+						<select
+							name="$[preview_size]"
+							autocomplete="off"
+							class="component-preview-size-select"
+							data-component-debugger-target="sizeSelect"
+							data-action="change->component-debugger#handleWidthDropdown"
+							data-turbo-data-turbo-permanent
+						>
+							${state.preview_size ? `<option
+											class="dynamic"
+											value="${state.preview_size}"
+											selected
+									  >
+											${state.preview_size} px
+									  </option>` : ""}
+							${this.previewSizes.map(
       (size) => `<option value="${size}">
-								${`${size} px`}
-							</option>`
+									${`${size} px`}
+								</option>`
     )}
-					</select>
-					<noscript>
-						${this.makeActionButton(state, "change_size")}
-					</noscript>
+						</select>
+						<noscript>
+							${this.makeActionButton(state, "change_size")}
+						</noscript>
+					</div>
+					<style>
+						.component-preview .component-raw-view {
+							display: none;
+						}
+
+						.component-preview .jdd-outer-container {
+							display: block;
+						}
+
+						.component-preview:has(
+								.component-preview-checkbox:checked
+							)
+							.component-raw-view {
+							display: block;
+						}
+
+						.component-preview:has(
+								.component-preview-checkbox:checked
+							)
+							.jdd-outer-container {
+							display: none;
+						}
+					</style>
+					<label class="component-preview__item" for="show-html">
+						Show HTML
+						<input
+							type="checkbox"
+							id="show-html"
+							class="component-preview-checkbox"
+						/>
+					</label>
 				</div>
-				<div class="jdd-outer-container">
-					<div class="jdd-container">
-						${JDD.render(
-      this.registry,
-      documentContainerFromParsed(state.components),
-      this.makeJDDContext(ctx)
-    )}
+				
+						${(async () => {
+      const currentComponent = await JDD.render(
+        this.registry,
+        documentContainerFromParsed(state.components),
+        this.makeJDDContext(ctx)
+      );
+      return ` <div
+									class="jdd-outer-container"
+								>
+									<div class="jdd-container">
+										${currentComponent}
+									</div>
+								</div>
+								<div class="component-raw-view">
+									<pre><code>${htmlEscape(
+        currentComponent
+      )}</code></pre>
+								</div>`;
+    })()}
 					</div>
 				</div>
 			</div>

package/dist/src/jdd-page.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/jdd-page.ts"],
-  "sourcesContent": ["/* eslint-disable @typescript-eslint/restrict-template-expressions */\nimport type { Readable } from \"node:stream\";\nimport type { Component, JDDContext, RawJDDocument } from \"@sealcode/jdd\";\nimport { documentContainerFromParsed, Registry } from \"@sealcode/jdd\";\nimport { JDD } from \"@sealcode/jdd\";\nimport { StatefulPage } from \"@sealcode/sealgen\";\nimport { hasFieldOfType, hasShape, predicates } from \"@sealcode/ts-predicates\";\nimport type { Context } from \"koa\";\nimport type { FlatTemplatable, Templatable } from \"tempstream\";\nimport { tempstream } from \"tempstream\";\nimport { ComponentInput } from \"./inputs/component-input.js\";\nimport { ComponentPreviewActions } from \"./component-preview-actions.js\";\n\nexport const actionName = \"Components\";\n\nexport type JDDPageState = {\n\tcomponents: RawJDDocument;\n\tpreview_size?: string;\n\tmessages?: string[];\n};\n\nexport default abstract class JDDPage extends StatefulPage<\n\tJDDPageState,\n\ttypeof ComponentPreviewActions\n> {\n\tactions = ComponentPreviewActions;\n\n\tpreviewSizes = [\"320\", \"600\", \"800\", \"1024\", \"1300\", \"1920\"];\n\tclasses: string[] = [];\n\n\tpublic registry: Registry;\n\tpublic makeJDDContext: (ctx: Context) => JDDContext;\n\tpublic html: (\n\t\targs: unknown\n\t) => string | Promise<string> | Readable | Promise<Readable>;\n\tpublic defaultHead: (\n\t\t...args: unknown[]\n\t) => string | Promise<string> | Readable | Promise<Readable>;\n\tpublic makeAssetURL: (asset: string) => string;\n\n\tconstructor(args: {\n\t\tregistry: Registry;\n\t\tmakeJDDContext: (ctx: Context) => JDDContext;\n\t\thtml: (\n\t\t\targs: unknown\n\t\t) => string | Promise<string> | Readable | Promise<Readable>;\n\t\tdefaultHead: (\n\t\t\t...args: unknown[]\n\t\t) => string | Promise<string> | Readable | Promise<Readable>;\n\t\tmakeAssetURL?: (asset: string) => string;\n\t}) {\n\t\tsuper();\n\t\tthis.registry = args.registry;\n\t\tthis.makeJDDContext = args.makeJDDContext;\n\t\tthis.defaultHead = args.defaultHead;\n\t\tthis.html = args.html;\n\t\tthis.makeAssetURL =\n\t\t\targs.makeAssetURL ||\n\t\t\t((str) =>\n\t\t\t\t`/dist/jdd-page/${str.startsWith(\"/\") ? str.slice(1) : str}`);\n\t}\n\n\tgetRegistryComponents() {\n\t\treturn this.registry.getAll();\n\t}\n\n\tasync getInitialState(ctx: Context) {\n\t\tconst all_components = Object.entries(this.getRegistryComponents());\n\t\tconst first_component = all_components[0];\n\t\tif (!first_component) {\n\t\t\tthrow new Error(\"No defined components!\");\n\t\t}\n\t\tconst [component_name, component] = first_component;\n\t\tconst initial_state = {\n\t\t\tcomponents: [\n\t\t\t\t{\n\t\t\t\t\tcomponent_name: component_name,\n\t\t\t\t\targs: await component.getExampleValues(\n\t\t\t\t\t\tthis.makeJDDContext(ctx)\n\t\t\t\t\t),\n\t\t\t\t},\n\t\t\t],\n\t\t};\n\t\treturn initial_state;\n\t}\n\n\twrapInLayout(\n\t\tctx: Context,\n\t\tcontent: Templatable,\n\t\tstate: JDDPageState\n\t): Templatable {\n\t\tconst jdd_context = this.makeJDDContext(ctx);\n\t\tconst jdd = new JDD(\n\t\t\tthis.registry,\n\t\t\tjdd_context,\n\t\t\tdocumentContainerFromParsed(state.components)\n\t\t);\n\t\treturn this.html({\n\t\t\tctx,\n\t\t\ttitle: \"Components\",\n\t\t\tbody: content,\n\t\t\tdescription: \"\",\n\t\t\tcss_clumps: [\"jdd-page\", ...jdd.getAllCSSClumps()],\n\t\t\thtmlOptions: {\n\t\t\t\tmorphing: true,\n\t\t\t\tpreserveScroll: true,\n\t\t\t\tautoRefreshCSS: false,\n\t\t\t\tnavbar: () => ``,\n\t\t\t\tbodyClasses: [\"jdd-editor\"],\n\t\t\t\tshowBottomNavbar: false,\n\t\t\t\tshowBanner: false,\n\t\t\t\tshowFooter: false,\n\t\t\t\tloadHamburgerMenu: false,\n\t\t\t\tloadSearchModal: false,\n\t\t\t},\n\t\t\tmakeHead: (...args: unknown[]) =>\n\t\t\t\ttempstream/* HTML */ `${this.defaultHead(...args)}\n\t\t\t\t\t<link\n\t\t\t\t\t\thref=\"/dist/jdd-page.entrypoint.css\"\n\t\t\t\t\t\trel=\"stylesheet\"\n\t\t\t\t\t\ttype=\"text/css\"\n\t\t\t\t\t/>\n\t\t\t\t\t${jdd.renderEarlyAssets()}`,\n\t\t});\n\t}\n\n\tasync preprocessOverrides(\n\t\t_ctx: Context,\n\t\tstate: JDDPageState,\n\t\toverrides: Record<string, unknown>\n\t) {\n\t\tconst jdd_context = this.makeJDDContext(_ctx);\n\t\tif (\n\t\t\t!hasFieldOfType(\n\t\t\t\t\"components\",\n\t\t\t\toverrides,\n\t\t\t\tpredicates.array(\n\t\t\t\t\tpredicates.shape({\n\t\t\t\t\t\targs: predicates.object,\n\t\t\t\t\t})\n\t\t\t\t)\n\t\t\t)\n\t\t) {\n\t\t\treturn {};\n\t\t}\n\t\tfor (const [component_index, { component_name }] of Object.entries(\n\t\t\tstate.components\n\t\t)) {\n\t\t\tconst component = this.registry.get(component_name);\n\t\t\tif (!component) {\n\t\t\t\tthrow new Error(`Unknown component: ${component_name}`);\n\t\t\t}\n\t\t\tconst overrides_for_component = overrides.components[\n\t\t\t\tparseInt(component_index)\n\t\t\t] || { args: {} };\n\t\t\tconst promises = Object.entries(component.getArguments()).map(\n\t\t\t\tasync ([arg_name, arg]) => {\n\t\t\t\t\tconst value = overrides_for_component.args[arg_name];\n\t\t\t\t\tif (value) {\n\t\t\t\t\t\tconst new_value = await arg.receivedToParsed(\n\t\t\t\t\t\t\tjdd_context,\n\t\t\t\t\t\t\tvalue\n\t\t\t\t\t\t);\n\t\t\t\t\t\toverrides_for_component.args[arg_name] = new_value;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t);\n\t\t\t// eslint-disable-next-line no-await-in-loop\n\t\t\tawait Promise.all(promises);\n\t\t}\n\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\treturn overrides;\n\t}\n\n\t// eslint-disable-next-line no-unused-vars\n\tabstract renderParameterButtons(_state: JDDPageState): FlatTemplatable;\n\n\tasync renderComponentArgs<C extends Component>(\n\t\tctx: Context,\n\t\tstate: JDDPageState,\n\t\tcomponent: C,\n\t\targs: Record<string, unknown>,\n\t\tindex: number\n\t): Promise<FlatTemplatable> {\n\t\tconst jdd_context = this.makeJDDContext(ctx);\n\t\treturn tempstream/* HTML */ `<div\n\t\t\tclass=\"component-preview-parameters\"\n\t\t\tid=\"${`component-preview-parameters--${index}`}\"\n\t\t>\n\t\t\t${Object.entries(component.getArguments()).map(\n\t\t\t\tasync ([arg_name, arg]) =>\n\t\t\t\t\tComponentInput({\n\t\t\t\t\t\tstate,\n\t\t\t\t\t\targ_path: [\n\t\t\t\t\t\t\t\"components\",\n\t\t\t\t\t\t\tindex.toString(),\n\t\t\t\t\t\t\t\"args\",\n\t\t\t\t\t\t\targ_name,\n\t\t\t\t\t\t],\n\t\t\t\t\t\tctx,\n\t\t\t\t\t\targ,\n\t\t\t\t\t\tvalue:\n\t\t\t\t\t\t\targs[arg_name] === undefined ||\n\t\t\t\t\t\t\tcomponent\n\t\t\t\t\t\t\t\t.getArguments()\n\t\t\t\t\t\t\t\t[arg_name]?.isEmpty(args[arg_name])\n\t\t\t\t\t\t\t\t? await arg.getExampleValue(jdd_context)\n\t\t\t\t\t\t\t\t: args[arg_name],\n\t\t\t\t\t\tpage: this,\n\t\t\t\t\t\tmakeJDDContext: this.makeJDDContext,\n\t\t\t\t\t\tmakeAssetURL: this.makeAssetURL,\n\t\t\t\t\t})\n\t\t\t)}\n\t\t</div>`;\n\t}\n\n\trenderComponentBlock(\n\t\tctx: Context,\n\t\tstate: JDDPageState,\n\t\t{\n\t\t\tcomponent_name,\n\t\t\targs: component_args,\n\t\t}: {\n\t\t\tcomponent_name: string;\n\t\t\targs: Record<string, unknown>;\n\t\t},\n\t\tcomponent_index: number\n\t) {\n\t\tconst component = this.registry.get(component_name);\n\t\tif (!component) {\n\t\t\treturn null;\n\t\t}\n\t\treturn this.renderComponentArgs(\n\t\t\tctx,\n\t\t\tstate,\n\t\t\tcomponent,\n\t\t\tcomponent_args,\n\t\t\tcomponent_index\n\t\t);\n\t}\n\n\tasync serializeState(ctx: Context, state: JDDPageState, pretty = false) {\n\t\tconst serialized_components = await Promise.all(\n\t\t\tstate.components.map(async ({ component_name, args }) => {\n\t\t\t\tconst component = this.registry.get(component_name);\n\t\t\t\tconst single_result = {\n\t\t\t\t\tcomponent_name,\n\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-call\n\t\t\t\t\targs: component\n\t\t\t\t\t\t? await component.convertParsedToStorage(\n\t\t\t\t\t\t\t\tthis.makeJDDContext(ctx),\n\t\t\t\t\t\t\t\targs\n\t\t\t\t\t\t  )\n\t\t\t\t\t\t: {},\n\t\t\t\t};\n\t\t\t\treturn single_result;\n\t\t\t})\n\t\t);\n\t\tconst serialized_state = JSON.stringify(\n\t\t\t{ ...state, components: serialized_components },\n\t\t\tnull,\n\t\t\tpretty ? 4 : \"\"\n\t\t);\n\t\treturn serialized_state;\n\t}\n\n\tasync deserializeState(ctx: Context, state_string: string) {\n\t\tconst jdd_context = this.makeJDDContext(ctx);\n\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\tconst raw = JSON.parse(state_string);\n\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access\n\t\tconst components_storage = raw.components;\n\t\tif (!Array.isArray(components_storage)) {\n\t\t\tthrow new Error(\n\t\t\t\t\"'components' key is not an array, got ${components_storage}\"\n\t\t\t);\n\t\t}\n\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\tconst components_parsed = await Promise.all(\n\t\t\tcomponents_storage.map(async (entry) => {\n\t\t\t\tif (\n\t\t\t\t\t!hasShape(\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tcomponent_name: predicates.string,\n\t\t\t\t\t\t\targs: predicates.object,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tentry\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\tthrow new Error(\n\t\t\t\t\t\t`Expected components[] items to be objects with 'component_name' and 'args' keys, got ${entry}`\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tconst { component_name, args } = entry;\n\t\t\t\tconst component = this.registry.get(component_name);\n\t\t\t\tif (!component) {\n\t\t\t\t\tthrow new Error(\"Unknown component: ${component_name}\");\n\t\t\t\t}\n\t\t\t\treturn {\n\t\t\t\t\tcomponent_name,\n\t\t\t\t\targs: await component.convertStorageToParsed(\n\t\t\t\t\t\tjdd_context,\n\t\t\t\t\t\targs\n\t\t\t\t\t),\n\t\t\t\t};\n\t\t\t})\n\t\t);\n\t\tconst result = { ...raw, components: components_parsed };\n\t\treturn result;\n\t}\n\n\trenderPreParameterButtons(\n\t\t// eslint-disable-next-line @typescript-eslint/no-unused-vars\n\t\t_ctx: Context,\n\t\t// eslint-disable-next-line @typescript-eslint/no-unused-vars\n\t\t_state: JDDPageState\n\t): FlatTemplatable | Promise<FlatTemplatable> {\n\t\treturn \"\";\n\t}\n\n\trenderMessages(_ctx: Context, state: JDDPageState) {\n\t\treturn /* HTML */ `<ul\n\t\t\tclass=\"jdd-editor__messages\"\n\t\t\tdata-controller=\"toast\"\n\t\t>\n\t\t\t${(state.messages || []).map(\n\t\t\t\t(e) => `<li class=\"jdd-editor__message\">${e}</li>`\n\t\t\t)}\n\t\t</ul>`;\n\t}\n\n\tasync render(ctx: Context, state: JDDPageState): Promise<string> {\n\t\treturn tempstream/* HTML */ `<div\n\t\t\tclass=\"${[\"two-column\", \"component-debugger\", ...this.classes].join(\n\t\t\t\t\" \"\n\t\t\t)}\"\n\t\t\tid=\"component-debugger\"\n\t\t\tstyle=\"${`--resizable-column-width: ${\n\t\t\t\tstate.preview_size ? state.preview_size + \"px\" : \"50vw\"\n\t\t\t}`}\"\n\t\t\tdata-controller=\"component-debugger\"\n\t\t>\n\t\t\t<div class=\"component-arguments\" id=\"component-arguments\">\n\t\t\t\t${this.renderPreParameterButtons(ctx, state)}\n\t\t\t\t${this.renderParameterButtons(state)}\n\t\t\t\t${this.renderMessages(ctx, state)}\n\t\t\t\t${state.components.map((component, component_index) =>\n\t\t\t\t\tthis.renderComponentBlock(\n\t\t\t\t\t\tctx,\n\t\t\t\t\t\tstate,\n\t\t\t\t\t\tcomponent,\n\t\t\t\t\t\tcomponent_index\n\t\t\t\t\t)\n\t\t\t\t)}\n\t\t\t\t<details\n\t\t\t\t\tclass=\"component-debugger__json\"\n\t\t\t\t\tdata-controller=\"exportable-textarea\"\n\t\t\t\t\tid=\"exportable-textarea\"\n\t\t\t\t\topen\n\t\t\t\t>\n\t\t\t\t\t<summary>Edit/Export raw JSON</summary>\n\t\t\t\t\t<textarea\n\t\t\t\t\t\tname=\"state_override\"\n\t\t\t\t\t\trows=\"40\"\n\t\t\t\t\t\tcols=\"40\"\n\t\t\t\t\t\tdata-controller=\"json-editor\"\n\t\t\t\t\t\tid=\"component-debugger-json-textarea\"\n\t\t\t\t\t\tautocomplete=\"off\"\n\t\t\t\t\t>\n\t\t\t\t\t\t\t${(await this.serializeState(ctx, state, true)).replaceAll(\"<\", \"&lt;\")}\n\t\t\t\t\t\t</textarea\n\t\t\t\t\t>\n\t\t\t\t\t${this.makeActionButton(state, {\n\t\t\t\t\t\taction: \"replace_state\",\n\t\t\t\t\t\tlabel: \"Apply\",\n\t\t\t\t\t})}\n\t\t\t\t\t<button data-action=\"exportable-textarea#copy\">Copy</button>\n\t\t\t\t\t<button data-action=\"exportable-textarea#download\">\n\t\t\t\t\t\tDownload\n\t\t\t\t\t</button>\n\t\t\t\t\t<input type=\"file\" />${\" \"}\n\t\t\t\t\t<button data-action=\"exportable-textarea#import\">\n\t\t\t\t\t\tImport\n\t\t\t\t\t</button>\n\t\t\t\t</details>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tid=\"resize-gutter\"\n\t\t\t\tclass=\"resize-gutter\"\n\t\t\t\tdata-component-debugger-target=\"gutter\"\n\t\t\t></div>\n\t\t\t<div\n\t\t\t\tid=\"component-preview\"\n\t\t\t\tclass=\"component-preview\"\n\t\t\t\tdata-component-debugger-target=\"preview\"\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tid=\"component-preview__header\"\n\t\t\t\t\tclass=\"component-preview__header\"\n\t\t\t\t>\n\t\t\t\t\t<span>Preview</span>\n\t\t\t\t\t<select\n\t\t\t\t\t\tname=\"$[preview_size]\"\n\t\t\t\t\t\tautocomplete=\"off\"\n\t\t\t\t\t\tclass=\"component-preview-size-select\"\n\t\t\t\t\t\tdata-component-debugger-target=\"sizeSelect\"\n\t\t\t\t\t\tdata-action=\"change->component-debugger#handleWidthDropdown\"\n\t\t\t\t\t\tdata-turbo-data-turbo-permanent\n\t\t\t\t\t>\n\t\t\t\t\t\t${state.preview_size\n\t\t\t\t\t\t\t? /* HTML */ `<option\n\t\t\t\t\t\t\t\t\tclass=\"dynamic\"\n\t\t\t\t\t\t\t\t\tvalue=\"${state.preview_size}\"\n\t\t\t\t\t\t\t\t\tselected\n\t\t\t\t\t\t\t  >\n\t\t\t\t\t\t\t\t\t${state.preview_size} px\n\t\t\t\t\t\t\t  </option>`\n\t\t\t\t\t\t\t: \"\"}\n\t\t\t\t\t\t${this.previewSizes.map(\n\t\t\t\t\t\t\t(size) => /* HTML */ `<option value=\"${size}\">\n\t\t\t\t\t\t\t\t${`${size} px`}\n\t\t\t\t\t\t\t</option>`\n\t\t\t\t\t\t)}\n\t\t\t\t\t</select>\n\t\t\t\t\t<noscript>\n\t\t\t\t\t\t${this.makeActionButton(state, \"change_size\")}\n\t\t\t\t\t</noscript>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"jdd-outer-container\">\n\t\t\t\t\t<div class=\"jdd-container\">\n\t\t\t\t\t\t${JDD.render(\n\t\t\t\t\t\t\tthis.registry,\n\t\t\t\t\t\t\tdocumentContainerFromParsed(state.components),\n\t\t\t\t\t\t\tthis.makeJDDContext(ctx)\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>`;\n\t}\n}\n"],
-  "mappings": "AAGA,SAAS,mCAA6C;AACtD,SAAS,WAAW;AACpB,SAAS,oBAAoB;AAC7B,SAAS,gBAAgB,UAAU,kBAAkB;AAGrD,SAAS,kBAAkB;AAC3B,SAAS,sBAAsB;AAC/B,SAAS,+BAA+B;AAEjC,MAAM,aAAa;AAQ1B,MAAO,gBAAuC,aAG5C;AAAA,EAgBD,YAAY,MAUT;AACF,UAAM;AA1BP,mBAAU;AAEV,wBAAe,CAAC,OAAO,OAAO,OAAO,QAAQ,QAAQ,MAAM;AAC3D,mBAAoB,CAAC;AAwBpB,SAAK,WAAW,KAAK;AACrB,SAAK,iBAAiB,KAAK;AAC3B,SAAK,cAAc,KAAK;AACxB,SAAK,OAAO,KAAK;AACjB,SAAK,eACJ,KAAK,iBACJ,CAAC,QACD,kBAAkB,IAAI,WAAW,GAAG,IAAI,IAAI,MAAM,CAAC,IAAI;AAAA,EAC1D;AAAA,EAEA,wBAAwB;AACvB,WAAO,KAAK,SAAS,OAAO;AAAA,EAC7B;AAAA,EAEA,MAAM,gBAAgB,KAAc;AACnC,UAAM,iBAAiB,OAAO,QAAQ,KAAK,sBAAsB,CAAC;AAClE,UAAM,kBAAkB,eAAe;AACvC,QAAI,CAAC,iBAAiB;AACrB,YAAM,IAAI,MAAM,wBAAwB;AAAA,IACzC;AACA,UAAM,CAAC,gBAAgB,SAAS,IAAI;AACpC,UAAM,gBAAgB;AAAA,MACrB,YAAY;AAAA,QACX;AAAA,UACC;AAAA,UACA,MAAM,MAAM,UAAU;AAAA,YACrB,KAAK,eAAe,GAAG;AAAA,UACxB;AAAA,QACD;AAAA,MACD;AAAA,IACD;AACA,WAAO;AAAA,EACR;AAAA,EAEA,aACC,KACA,SACA,OACc;AACd,UAAM,cAAc,KAAK,eAAe,GAAG;AAC3C,UAAM,MAAM,IAAI;AAAA,MACf,KAAK;AAAA,MACL;AAAA,MACA,4BAA4B,MAAM,UAAU;AAAA,IAC7C;AACA,WAAO,KAAK,KAAK;AAAA,MAChB;AAAA,MACA,OAAO;AAAA,MACP,MAAM;AAAA,MACN,aAAa;AAAA,MACb,YAAY,CAAC,YAAY,GAAG,IAAI,gBAAgB,CAAC;AAAA,MACjD,aAAa;AAAA,QACZ,UAAU;AAAA,QACV,gBAAgB;AAAA,QAChB,gBAAgB;AAAA,QAChB,QAAQ,MAAM;AAAA,QACd,aAAa,CAAC,YAAY;AAAA,QAC1B,kBAAkB;AAAA,QAClB,YAAY;AAAA,QACZ,YAAY;AAAA,QACZ,mBAAmB;AAAA,QACnB,iBAAiB;AAAA,MAClB;AAAA,MACA,UAAU,IAAI,SACb,aAAwB,KAAK,YAAY,GAAG,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAM7C,IAAI,kBAAkB;AAAA,IAC3B,CAAC;AAAA,EACF;AAAA,EAEA,MAAM,oBACL,MACA,OACA,WACC;AACD,UAAM,cAAc,KAAK,eAAe,IAAI;AAC5C,QACC,CAAC;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,QACV,WAAW,MAAM;AAAA,UAChB,MAAM,WAAW;AAAA,QAClB,CAAC;AAAA,MACF;AAAA,IACD,GACC;AACD,aAAO,CAAC;AAAA,IACT;AACA,eAAW,CAAC,iBAAiB,EAAE,eAAe,CAAC,KAAK,OAAO;AAAA,MAC1D,MAAM;AAAA,IACP,GAAG;AACF,YAAM,YAAY,KAAK,SAAS,IAAI,cAAc;AAClD,UAAI,CAAC,WAAW;AACf,cAAM,IAAI,MAAM,sBAAsB,gBAAgB;AAAA,MACvD;AACA,YAAM,0BAA0B,UAAU,WACzC,SAAS,eAAe,MACpB,EAAE,MAAM,CAAC,EAAE;AAChB,YAAM,WAAW,OAAO,QAAQ,UAAU,aAAa,CAAC,EAAE;AAAA,QACzD,OAAO,CAAC,UAAU,GAAG,MAAM;AAC1B,gBAAM,QAAQ,wBAAwB,KAAK;AAC3C,cAAI,OAAO;AACV,kBAAM,YAAY,MAAM,IAAI;AAAA,cAC3B;AAAA,cACA;AAAA,YACD;AACA,oCAAwB,KAAK,YAAY;AAAA,UAC1C;AAAA,QACD;AAAA,MACD;AAEA,YAAM,QAAQ,IAAI,QAAQ;AAAA,IAC3B;AAEA,WAAO;AAAA,EACR;AAAA,EAKA,MAAM,oBACL,KACA,OACA,WACA,MACA,OAC2B;AAC3B,UAAM,cAAc,KAAK,eAAe,GAAG;AAC3C,WAAO;AAAA;AAAA,SAEA,iCAAiC;AAAA;AAAA,KAErC,OAAO,QAAQ,UAAU,aAAa,CAAC,EAAE;AAAA,MAC1C,OAAO,CAAC,UAAU,GAAG,MAAG;AA9L5B;AA+LK,8BAAe;AAAA,UACd;AAAA,UACA,UAAU;AAAA,YACT;AAAA,YACA,MAAM,SAAS;AAAA,YACf;AAAA,YACA;AAAA,UACD;AAAA,UACA;AAAA,UACA;AAAA,UACA,OACC,KAAK,cAAc,YACnB,eACE,aAAa,EACb,cAFF,mBAEa,QAAQ,KAAK,cACvB,MAAM,IAAI,gBAAgB,WAAW,IACrC,KAAK;AAAA,UACT,MAAM;AAAA,UACN,gBAAgB,KAAK;AAAA,UACrB,cAAc,KAAK;AAAA,QACpB,CAAC;AAAA;AAAA,IACH;AAAA;AAAA,EAEF;AAAA,EAEA,qBACC,KACA,OACA;AAAA,IACC;AAAA,IACA,MAAM;AAAA,EACP,GAIA,iBACC;AACD,UAAM,YAAY,KAAK,SAAS,IAAI,cAAc;AAClD,QAAI,CAAC,WAAW;AACf,aAAO;AAAA,IACR;AACA,WAAO,KAAK;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,EACD;AAAA,EAEA,MAAM,eAAe,KAAc,OAAqB,SAAS,OAAO;AACvE,UAAM,wBAAwB,MAAM,QAAQ;AAAA,MAC3C,MAAM,WAAW,IAAI,OAAO,EAAE,gBAAgB,KAAK,MAAM;AACxD,cAAM,YAAY,KAAK,SAAS,IAAI,cAAc;AAClD,cAAM,gBAAgB;AAAA,UACrB;AAAA,UAEA,MAAM,YACH,MAAM,UAAU;AAAA,YAChB,KAAK,eAAe,GAAG;AAAA,YACvB;AAAA,UACA,IACA,CAAC;AAAA,QACL;AACA,eAAO;AAAA,MACR,CAAC;AAAA,IACF;AACA,UAAM,mBAAmB,KAAK;AAAA,MAC7B,EAAE,GAAG,OAAO,YAAY,sBAAsB;AAAA,MAC9C;AAAA,MACA,SAAS,IAAI;AAAA,IACd;AACA,WAAO;AAAA,EACR;AAAA,EAEA,MAAM,iBAAiB,KAAc,cAAsB;AAC1D,UAAM,cAAc,KAAK,eAAe,GAAG;AAE3C,UAAM,MAAM,KAAK,MAAM,YAAY;AAEnC,UAAM,qBAAqB,IAAI;AAC/B,QAAI,CAAC,MAAM,QAAQ,kBAAkB,GAAG;AACvC,YAAM,IAAI;AAAA,QACT;AAAA,MACD;AAAA,IACD;AAEA,UAAM,oBAAoB,MAAM,QAAQ;AAAA,MACvC,mBAAmB,IAAI,OAAO,UAAU;AACvC,YACC,CAAC;AAAA,UACA;AAAA,YACC,gBAAgB,WAAW;AAAA,YAC3B,MAAM,WAAW;AAAA,UAClB;AAAA,UACA;AAAA,QACD,GACC;AACD,gBAAM,IAAI;AAAA,YACT,wFAAwF;AAAA,UACzF;AAAA,QACD;AACA,cAAM,EAAE,gBAAgB,KAAK,IAAI;AACjC,cAAM,YAAY,KAAK,SAAS,IAAI,cAAc;AAClD,YAAI,CAAC,WAAW;AACf,gBAAM,IAAI,MAAM,sCAAsC;AAAA,QACvD;AACA,eAAO;AAAA,UACN;AAAA,UACA,MAAM,MAAM,UAAU;AAAA,YACrB;AAAA,YACA;AAAA,UACD;AAAA,QACD;AAAA,MACD,CAAC;AAAA,IACF;AACA,UAAM,SAAS,EAAE,GAAG,KAAK,YAAY,kBAAkB;AACvD,WAAO;AAAA,EACR;AAAA,EAEA,0BAEC,MAEA,QAC6C;AAC7C,WAAO;AAAA,EACR;AAAA,EAEA,eAAe,MAAe,OAAqB;AAClD,WAAkB;AAAA;AAAA;AAAA;AAAA,MAId,MAAM,YAAY,CAAC,GAAG;AAAA,MACxB,CAAC,MAAM,mCAAmC;AAAA,IAC3C;AAAA;AAAA,EAEF;AAAA,EAEA,MAAM,OAAO,KAAc,OAAsC;AAChE,WAAO;AAAA,YACG,CAAC,cAAc,sBAAsB,GAAG,KAAK,OAAO,EAAE;AAAA,MAC9D;AAAA,IACD;AAAA;AAAA,YAES,6BACR,MAAM,eAAe,MAAM,eAAe,OAAO;AAAA;AAAA;AAAA;AAAA,MAK/C,KAAK,0BAA0B,KAAK,KAAK;AAAA,MACzC,KAAK,uBAAuB,KAAK;AAAA,MACjC,KAAK,eAAe,KAAK,KAAK;AAAA,MAC9B,MAAM,WAAW;AAAA,MAAI,CAAC,WAAW,oBAClC,KAAK;AAAA,QACJ;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACD;AAAA,IACD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAgBM,MAAM,KAAK,eAAe,KAAK,OAAO,IAAI,GAAG,WAAW,KAAK,MAAM;AAAA;AAAA;AAAA,OAGtE,KAAK,iBAAiB,OAAO;AAAA,MAC9B,QAAQ;AAAA,MACR,OAAO;AAAA,IACR,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,4BAKsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QA6BpB,MAAM,eACM;AAAA;AAAA,kBAEF,MAAM;AAAA;AAAA;AAAA,WAGb,MAAM;AAAA,sBAER;AAAA,QACD,KAAK,aAAa;AAAA,MACnB,CAAC,SAAoB,kBAAkB;AAAA,UACpC,GAAG;AAAA;AAAA,IAEP;AAAA;AAAA;AAAA,QAGE,KAAK,iBAAiB,OAAO,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA,QAK1C,IAAI;AAAA,MACL,KAAK;AAAA,MACL,4BAA4B,MAAM,UAAU;AAAA,MAC5C,KAAK,eAAe,GAAG;AAAA,IACxB;AAAA;AAAA;AAAA;AAAA;AAAA,EAKL;AACD;",
+  "sourcesContent": ["/* eslint-disable @typescript-eslint/restrict-template-expressions */\nimport type { Readable } from \"node:stream\";\nimport type { Component, JDDContext, RawJDDocument } from \"@sealcode/jdd\";\nimport { documentContainerFromParsed, Registry } from \"@sealcode/jdd\";\nimport { JDD } from \"@sealcode/jdd\";\nimport { StatefulPage } from \"@sealcode/sealgen\";\nimport { hasFieldOfType, hasShape, predicates } from \"@sealcode/ts-predicates\";\nimport type { Context } from \"koa\";\nimport type { FlatTemplatable, Templatable } from \"tempstream\";\nimport { tempstream } from \"tempstream\";\nimport { ComponentInput } from \"./inputs/component-input.js\";\nimport { ComponentPreviewActions } from \"./component-preview-actions.js\";\nimport { htmlEscape } from \"escape-goat\";\n\nexport const actionName = \"Components\";\n\nexport type JDDPageState = {\n\tcomponents: RawJDDocument;\n\tpreview_size?: string;\n\tmessages?: string[];\n};\n\nexport default abstract class JDDPage extends StatefulPage<\n\tJDDPageState,\n\ttypeof ComponentPreviewActions\n> {\n\tactions = ComponentPreviewActions;\n\n\tpreviewSizes = [\"320\", \"600\", \"800\", \"1024\", \"1300\", \"1920\"];\n\tclasses: string[] = [];\n\n\tpublic registry: Registry;\n\tpublic makeJDDContext: (ctx: Context) => JDDContext;\n\tpublic html: (\n\t\targs: unknown\n\t) => string | Promise<string> | Readable | Promise<Readable>;\n\tpublic defaultHead: (\n\t\t...args: unknown[]\n\t) => string | Promise<string> | Readable | Promise<Readable>;\n\tpublic makeAssetURL: (asset: string) => string;\n\n\tconstructor(args: {\n\t\tregistry: Registry;\n\t\tmakeJDDContext: (ctx: Context) => JDDContext;\n\t\thtml: (\n\t\t\targs: unknown\n\t\t) => string | Promise<string> | Readable | Promise<Readable>;\n\t\tdefaultHead: (\n\t\t\t...args: unknown[]\n\t\t) => string | Promise<string> | Readable | Promise<Readable>;\n\t\tmakeAssetURL?: (asset: string) => string;\n\t}) {\n\t\tsuper();\n\t\tthis.registry = args.registry;\n\t\tthis.makeJDDContext = args.makeJDDContext;\n\t\tthis.defaultHead = args.defaultHead;\n\t\tthis.html = args.html;\n\t\tthis.makeAssetURL =\n\t\t\targs.makeAssetURL ||\n\t\t\t((str) =>\n\t\t\t\t`/dist/jdd-page/${str.startsWith(\"/\") ? str.slice(1) : str}`);\n\t}\n\n\tgetRegistryComponents() {\n\t\treturn this.registry.getAll();\n\t}\n\n\tasync getInitialState(ctx: Context) {\n\t\tconst all_components = Object.entries(this.getRegistryComponents());\n\t\tconst first_component = all_components[0];\n\t\tif (!first_component) {\n\t\t\tthrow new Error(\"No defined components!\");\n\t\t}\n\t\tconst [component_name, component] = first_component;\n\t\tconst initial_state = {\n\t\t\tcomponents: [\n\t\t\t\t{\n\t\t\t\t\tcomponent_name: component_name,\n\t\t\t\t\targs: await component.getExampleValues(\n\t\t\t\t\t\tthis.makeJDDContext(ctx)\n\t\t\t\t\t),\n\t\t\t\t},\n\t\t\t],\n\t\t};\n\t\treturn initial_state;\n\t}\n\n\twrapInLayout(\n\t\tctx: Context,\n\t\tcontent: Templatable,\n\t\tstate: JDDPageState\n\t): Templatable {\n\t\tconst jdd_context = this.makeJDDContext(ctx);\n\t\tconst jdd = new JDD(\n\t\t\tthis.registry,\n\t\t\tjdd_context,\n\t\t\tdocumentContainerFromParsed(state.components)\n\t\t);\n\t\treturn this.html({\n\t\t\tctx,\n\t\t\ttitle: \"Components\",\n\t\t\tbody: content,\n\t\t\tdescription: \"\",\n\t\t\tcss_clumps: [\"jdd-page\", ...jdd.getAllCSSClumps()],\n\t\t\thtmlOptions: {\n\t\t\t\tmorphing: true,\n\t\t\t\tpreserveScroll: true,\n\t\t\t\tautoRefreshCSS: false,\n\t\t\t\tnavbar: () => ``,\n\t\t\t\tbodyClasses: [\"jdd-editor\"],\n\t\t\t\tshowBottomNavbar: false,\n\t\t\t\tshowBanner: false,\n\t\t\t\tshowFooter: false,\n\t\t\t\tloadHamburgerMenu: false,\n\t\t\t\tloadSearchModal: false,\n\t\t\t},\n\t\t\tmakeHead: (...args: unknown[]) =>\n\t\t\t\ttempstream/* HTML */ `${this.defaultHead(...args)}\n\t\t\t\t\t<link\n\t\t\t\t\t\thref=\"/dist/jdd-page.entrypoint.css\"\n\t\t\t\t\t\trel=\"stylesheet\"\n\t\t\t\t\t\ttype=\"text/css\"\n\t\t\t\t\t/>\n\t\t\t\t\t${jdd.renderEarlyAssets()}`,\n\t\t});\n\t}\n\n\tasync preprocessOverrides(\n\t\t_ctx: Context,\n\t\tstate: JDDPageState,\n\t\toverrides: Record<string, unknown>\n\t) {\n\t\tconst jdd_context = this.makeJDDContext(_ctx);\n\t\tif (\n\t\t\t!hasFieldOfType(\n\t\t\t\t\"components\",\n\t\t\t\toverrides,\n\t\t\t\tpredicates.array(\n\t\t\t\t\tpredicates.shape({\n\t\t\t\t\t\targs: predicates.object,\n\t\t\t\t\t})\n\t\t\t\t)\n\t\t\t)\n\t\t) {\n\t\t\treturn {};\n\t\t}\n\t\tfor (const [component_index, { component_name }] of Object.entries(\n\t\t\tstate.components\n\t\t)) {\n\t\t\tconst component = this.registry.get(component_name);\n\t\t\tif (!component) {\n\t\t\t\tthrow new Error(`Unknown component: ${component_name}`);\n\t\t\t}\n\t\t\tconst overrides_for_component = overrides.components[\n\t\t\t\tparseInt(component_index)\n\t\t\t] || { args: {} };\n\t\t\tconst promises = Object.entries(component.getArguments()).map(\n\t\t\t\tasync ([arg_name, arg]) => {\n\t\t\t\t\tconst value = overrides_for_component.args[arg_name];\n\t\t\t\t\tif (value) {\n\t\t\t\t\t\tconst new_value = await arg.receivedToParsed(\n\t\t\t\t\t\t\tjdd_context,\n\t\t\t\t\t\t\tvalue\n\t\t\t\t\t\t);\n\t\t\t\t\t\toverrides_for_component.args[arg_name] = new_value;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t);\n\t\t\t// eslint-disable-next-line no-await-in-loop\n\t\t\tawait Promise.all(promises);\n\t\t}\n\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\treturn overrides;\n\t}\n\n\t// eslint-disable-next-line no-unused-vars\n\tabstract renderParameterButtons(_state: JDDPageState): FlatTemplatable;\n\n\tasync renderComponentArgs<C extends Component>(\n\t\tctx: Context,\n\t\tstate: JDDPageState,\n\t\tcomponent: C,\n\t\targs: Record<string, unknown>,\n\t\tindex: number\n\t): Promise<FlatTemplatable> {\n\t\tconst jdd_context = this.makeJDDContext(ctx);\n\t\treturn tempstream/* HTML */ `<div\n\t\t\tclass=\"component-preview-parameters\"\n\t\t\tid=\"${`component-preview-parameters--${index}`}\"\n\t\t>\n\t\t\t${Object.entries(component.getArguments()).map(\n\t\t\t\tasync ([arg_name, arg]) =>\n\t\t\t\t\tComponentInput({\n\t\t\t\t\t\tstate,\n\t\t\t\t\t\targ_path: [\n\t\t\t\t\t\t\t\"components\",\n\t\t\t\t\t\t\tindex.toString(),\n\t\t\t\t\t\t\t\"args\",\n\t\t\t\t\t\t\targ_name,\n\t\t\t\t\t\t],\n\t\t\t\t\t\tctx,\n\t\t\t\t\t\targ,\n\t\t\t\t\t\tvalue:\n\t\t\t\t\t\t\targs[arg_name] === undefined ||\n\t\t\t\t\t\t\tcomponent\n\t\t\t\t\t\t\t\t.getArguments()\n\t\t\t\t\t\t\t\t[arg_name]?.isEmpty(args[arg_name])\n\t\t\t\t\t\t\t\t? await arg.getExampleValue(jdd_context)\n\t\t\t\t\t\t\t\t: args[arg_name],\n\t\t\t\t\t\tpage: this,\n\t\t\t\t\t\tmakeJDDContext: this.makeJDDContext,\n\t\t\t\t\t\tmakeAssetURL: this.makeAssetURL,\n\t\t\t\t\t})\n\t\t\t)}\n\t\t</div>`;\n\t}\n\n\trenderComponentBlock(\n\t\tctx: Context,\n\t\tstate: JDDPageState,\n\t\t{\n\t\t\tcomponent_name,\n\t\t\targs: component_args,\n\t\t}: {\n\t\t\tcomponent_name: string;\n\t\t\targs: Record<string, unknown>;\n\t\t},\n\t\tcomponent_index: number\n\t) {\n\t\tconst component = this.registry.get(component_name);\n\t\tif (!component) {\n\t\t\treturn null;\n\t\t}\n\t\treturn this.renderComponentArgs(\n\t\t\tctx,\n\t\t\tstate,\n\t\t\tcomponent,\n\t\t\tcomponent_args,\n\t\t\tcomponent_index\n\t\t);\n\t}\n\n\tasync serializeState(ctx: Context, state: JDDPageState, pretty = false) {\n\t\tconst serialized_components = await Promise.all(\n\t\t\tstate.components.map(async ({ component_name, args }) => {\n\t\t\t\tconst component = this.registry.get(component_name);\n\t\t\t\tconst single_result = {\n\t\t\t\t\tcomponent_name,\n\t\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-call\n\t\t\t\t\targs: component\n\t\t\t\t\t\t? await component.convertParsedToStorage(\n\t\t\t\t\t\t\t\tthis.makeJDDContext(ctx),\n\t\t\t\t\t\t\t\targs\n\t\t\t\t\t\t  )\n\t\t\t\t\t\t: {},\n\t\t\t\t};\n\t\t\t\treturn single_result;\n\t\t\t})\n\t\t);\n\t\tconst serialized_state = JSON.stringify(\n\t\t\t{ ...state, components: serialized_components },\n\t\t\tnull,\n\t\t\tpretty ? 4 : \"\"\n\t\t);\n\t\treturn serialized_state;\n\t}\n\n\tasync deserializeState(ctx: Context, state_string: string) {\n\t\tconst jdd_context = this.makeJDDContext(ctx);\n\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\tconst raw = JSON.parse(state_string) as Record<string, unknown>;\n\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access\n\t\tconst components_storage = raw.components;\n\t\tif (!Array.isArray(components_storage)) {\n\t\t\tthrow new Error(\n\t\t\t\t\"'components' key is not an array, got ${components_storage}\"\n\t\t\t);\n\t\t}\n\t\t// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n\t\tconst components_parsed = await Promise.all(\n\t\t\tcomponents_storage.map(async (entry) => {\n\t\t\t\tif (\n\t\t\t\t\t!hasShape(\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tcomponent_name: predicates.string,\n\t\t\t\t\t\t\targs: predicates.object,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tentry\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\tthrow new Error(\n\t\t\t\t\t\t`Expected components[] items to be objects with 'component_name' and 'args' keys, got ${entry}`\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tconst { component_name, args } = entry;\n\t\t\t\tconst component = this.registry.get(component_name);\n\t\t\t\tif (!component) {\n\t\t\t\t\tthrow new Error(\"Unknown component: ${component_name}\");\n\t\t\t\t}\n\t\t\t\treturn {\n\t\t\t\t\tcomponent_name,\n\t\t\t\t\targs: await component.convertStorageToParsed(\n\t\t\t\t\t\tjdd_context,\n\t\t\t\t\t\targs\n\t\t\t\t\t),\n\t\t\t\t};\n\t\t\t})\n\t\t);\n\t\tconst result = { ...raw, components: components_parsed };\n\t\treturn result;\n\t}\n\n\trenderPreParameterButtons(\n\t\t// eslint-disable-next-line @typescript-eslint/no-unused-vars\n\t\t_ctx: Context,\n\t\t// eslint-disable-next-line @typescript-eslint/no-unused-vars\n\t\t_state: JDDPageState\n\t): FlatTemplatable | Promise<FlatTemplatable> {\n\t\treturn \"\";\n\t}\n\n\trenderMessages(_ctx: Context, state: JDDPageState) {\n\t\treturn /* HTML */ `<ul\n\t\t\tclass=\"jdd-editor__messages\"\n\t\t\tdata-controller=\"toast\"\n\t\t>\n\t\t\t${(state.messages || []).map(\n\t\t\t\t(e) => `<li class=\"jdd-editor__message\">${e}</li>`\n\t\t\t)}\n\t\t</ul>`;\n\t}\n\n\tasync render(ctx: Context, state: JDDPageState): Promise<string> {\n\t\treturn tempstream/* HTML */ `<div\n\t\t\tclass=\"${[\"two-column\", \"component-debugger\", ...this.classes].join(\" \")}\"\n\t\t\tid=\"component-debugger\"\n\t\t\tstyle=\"${`--resizable-column-width: ${\n\t\t\t\tstate.preview_size ? state.preview_size + \"px\" : \"50vw\"\n\t\t\t}`}\"\n\t\t\tdata-controller=\"component-debugger\"\n\t\t>\n\t\t\t<div class=\"component-arguments\" id=\"component-arguments\">\n\t\t\t\t${this.renderPreParameterButtons(ctx, state)}\n\t\t\t\t${this.renderParameterButtons(state)}\n\t\t\t\t${this.renderMessages(ctx, state)}\n\t\t\t\t${state.components.map((component, component_index) =>\n\t\t\t\t\tthis.renderComponentBlock(\n\t\t\t\t\t\tctx,\n\t\t\t\t\t\tstate,\n\t\t\t\t\t\tcomponent,\n\t\t\t\t\t\tcomponent_index\n\t\t\t\t\t)\n\t\t\t\t)}\n\t\t\t\t<details\n\t\t\t\t\tclass=\"component-debugger__json\"\n\t\t\t\t\tdata-controller=\"exportable-textarea\"\n\t\t\t\t\tid=\"exportable-textarea\"\n\t\t\t\t\topen\n\t\t\t\t>\n\t\t\t\t\t<summary>Edit/Export raw JSON</summary>\n\t\t\t\t\t<textarea\n\t\t\t\t\t\tname=\"state_override\"\n\t\t\t\t\t\trows=\"40\"\n\t\t\t\t\t\tcols=\"40\"\n\t\t\t\t\t\tdata-controller=\"json-editor\"\n\t\t\t\t\t\tid=\"component-debugger-json-textarea\"\n\t\t\t\t\t\tautocomplete=\"off\"\n\t\t\t\t\t>\n\t\t\t\t\t\t${(await this.serializeState(ctx, state, true)).replaceAll(\"<\", \"&lt;\")}\n\t\t\t\t\t</textarea\n\t\t\t\t\t>\n\t\t\t\t\t${this.makeActionButton(state, {\n\t\t\t\t\t\taction: \"replace_state\",\n\t\t\t\t\t\tlabel: \"Apply\",\n\t\t\t\t\t})}\n\t\t\t\t\t<button data-action=\"exportable-textarea#copy\">Copy</button>\n\t\t\t\t\t<button data-action=\"exportable-textarea#download\">\n\t\t\t\t\t\tDownload\n\t\t\t\t\t</button>\n\t\t\t\t\t<input type=\"file\" />${\" \"}\n\t\t\t\t\t<button data-action=\"exportable-textarea#import\">\n\t\t\t\t\t\tImport\n\t\t\t\t\t</button>\n\t\t\t\t</details>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tid=\"resize-gutter\"\n\t\t\t\tclass=\"resize-gutter\"\n\t\t\t\tdata-component-debugger-target=\"gutter\"\n\t\t\t></div>\n\t\t\t<div\n\t\t\t\tid=\"component-preview\"\n\t\t\t\tclass=\"component-preview\"\n\t\t\t\tdata-component-debugger-target=\"preview\"\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tid=\"component-preview__header\"\n\t\t\t\t\tclass=\"component-preview__header\"\n\t\t\t\t>\n\t\t\t\t\t<div class=\"component-preview__item\">\n\t\t\t\t\t\t<span>Window size</span>\n\t\t\t\t\t\t<select\n\t\t\t\t\t\t\tname=\"$[preview_size]\"\n\t\t\t\t\t\t\tautocomplete=\"off\"\n\t\t\t\t\t\t\tclass=\"component-preview-size-select\"\n\t\t\t\t\t\t\tdata-component-debugger-target=\"sizeSelect\"\n\t\t\t\t\t\t\tdata-action=\"change->component-debugger#handleWidthDropdown\"\n\t\t\t\t\t\t\tdata-turbo-data-turbo-permanent\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t${\n\t\t\t\t\t\t\t\tstate.preview_size\n\t\t\t\t\t\t\t\t\t? /* HTML */ `<option\n\t\t\t\t\t\t\t\t\t\t\tclass=\"dynamic\"\n\t\t\t\t\t\t\t\t\t\t\tvalue=\"${state.preview_size}\"\n\t\t\t\t\t\t\t\t\t\t\tselected\n\t\t\t\t\t\t\t\t\t  >\n\t\t\t\t\t\t\t\t\t\t\t${state.preview_size} px\n\t\t\t\t\t\t\t\t\t  </option>`\n\t\t\t\t\t\t\t\t\t: \"\"\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t${this.previewSizes.map(\n\t\t\t\t\t\t\t\t(size) => /* HTML */ `<option value=\"${size}\">\n\t\t\t\t\t\t\t\t\t${`${size} px`}\n\t\t\t\t\t\t\t\t</option>`\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</select>\n\t\t\t\t\t\t<noscript>\n\t\t\t\t\t\t\t${this.makeActionButton(state, \"change_size\")}\n\t\t\t\t\t\t</noscript>\n\t\t\t\t\t</div>\n\t\t\t\t\t<style>\n\t\t\t\t\t\t.component-preview .component-raw-view {\n\t\t\t\t\t\t\tdisplay: none;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t.component-preview .jdd-outer-container {\n\t\t\t\t\t\t\tdisplay: block;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t.component-preview:has(\n\t\t\t\t\t\t\t\t.component-preview-checkbox:checked\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t.component-raw-view {\n\t\t\t\t\t\t\tdisplay: block;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t.component-preview:has(\n\t\t\t\t\t\t\t\t.component-preview-checkbox:checked\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t.jdd-outer-container {\n\t\t\t\t\t\t\tdisplay: none;\n\t\t\t\t\t\t}\n\t\t\t\t\t</style>\n\t\t\t\t\t<label class=\"component-preview__item\" for=\"show-html\">\n\t\t\t\t\t\tShow HTML\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\tid=\"show-html\"\n\t\t\t\t\t\t\tclass=\"component-preview-checkbox\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</label>\n\t\t\t\t</div>\n\t\t\t\t\n\t\t\t\t\t\t${(async () => {\n\t\t\t\t\t\t\tconst currentComponent = await JDD.render(\n\t\t\t\t\t\t\t\tthis.registry,\n\t\t\t\t\t\t\t\tdocumentContainerFromParsed(state.components),\n\t\t\t\t\t\t\t\tthis.makeJDDContext(ctx)\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\treturn /* HTML */ ` <div\n\t\t\t\t\t\t\t\t\tclass=\"jdd-outer-container\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<div class=\"jdd-container\">\n\t\t\t\t\t\t\t\t\t\t${currentComponent}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t<div class=\"component-raw-view\">\n\t\t\t\t\t\t\t\t\t<pre><code>${htmlEscape(\n\t\t\t\t\t\t\t\t\t\tcurrentComponent\n\t\t\t\t\t\t\t\t\t)}</code></pre>\n\t\t\t\t\t\t\t\t</div>`;\n\t\t\t\t\t\t})()}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>`;\n\t}\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/package.json

@@ -1,11 +1,11 @@
 {
 	"name": "@sealcode/jdd-editor",
-	"version": "0.1.23",
+	"version": "0.2.1",
 	"main": "dist/src/index.js",
 	"scripts": {
 		"build": "rm -rf dist && node ./esbuild.cjs",
-		"prepare": "rm -rf @types && npm run typecheck && npm run build-declarations && npm run build",
-		"pretest": "npm run build",
+		"prepare": "husky && rm -rf @types && npm run typecheck && npm run build-declarations && npm run build",
+		"pretest": "npm run build && npm run typecheck",
 		"test": "node test.cjs",
 		"lint": "eslint src",
 		"build-declarations": "tsc --emitDeclarationOnly",
@@ -32,6 +32,7 @@
 		"eslint-plugin-prettier": "^4.2.1",
 		"eslint-plugin-with-tsc-error": "^0.0.8",
 		"fs": "^0.0.1-security",
+		"husky": "^9.1.7",
 		"mocha": "^10.2.0",
 		"mri": "^1.2.0",
 		"nyc": "^15.1.0",
@@ -46,14 +47,14 @@
 	"types": "./@types/index.d.ts",
 	"dependencies": {
 		"@koa/router": "^13.1.0",
-		"@sealcode/jdd": "^0.7.7",
+		"@sealcode/jdd": "^0.8.0",
 		"@sealcode/sealcodemirror": "^5.70.0-beta5",
-		"@sealcode/sealgen": "^0.17.31",
+		"@sealcode/sealgen": "^0.18",
 		"@types/object-path": "^0.11.4",
 		"@types/throttle-debounce": "^5.0.2",
 		"@types/turndown": "^5.0.5",
 		"object-path": "^0.11.8",
-		"sealious": "^0.20.0",
+		"sealious": "^0.21.0",
 		"stimulus": "^3.2.2",
 		"tempstream": "^0.4.6",
 		"throttle-debounce": "^5.0.2",

package/src/component-preview-actions.ts

@@ -4,7 +4,10 @@ import { List, makeSimpleEnglishJDDContext, Table } from "@sealcode/jdd";
 import { isTableData, isTableRegularRow } from "@sealcode/jdd";
 import objectPath from "object-path";
 import type { JDDPageState } from "./jdd-page.js";
-import type { StatefulPageActionArgument } from "@sealcode/sealgen";
+import type {
+	StatefulPageAction,
+	StatefulPageActionArgument,
+} from "@sealcode/sealgen";
 import type JDDPage from "./jdd-page.js";
 
 function moveElement<T>(
@@ -50,7 +53,7 @@ export function getComponentData(
 	};
 }
 
-export const ComponentPreviewActions = <const>{
+export const ComponentPreviewActions = (<const>{
 	add_array_item: async ({
 		ctx,
 		state,
@@ -509,14 +512,14 @@ export const ComponentPreviewActions = <const>{
 		state,
 		inputs,
 		page,
-	}: StatefulPageActionArgument<JDDPageState>) => {
-		const new_state = await (page as JDDPage).deserializeState(
+	}: StatefulPageActionArgument<JDDPageState>): Promise<JDDPageState> => {
+		const new_state = (await (page as JDDPage).deserializeState(
 			ctx,
 			inputs["state_override"] || "{}"
-		);
+		)) as JDDPageState;
 		return {
 			...new_state,
 			preview_size: state.preview_size,
 		};
 	},
-};
+}) as Record<string, StatefulPageAction<JDDPageState>>;

package/src/controllers/refresh-styles.stimulus.ts

@@ -47,6 +47,11 @@ export default class RefreshStyles extends Controller {
 			// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
 
 			this.socket = new WebSocket(`ws://localhost:${port as number}`);
+			this.socket.onmessage = async (message) => {
+				if (message.data === "css") {
+					refresh_css();
+				}
+			};
 		} catch (e) {
 			console.error(e);
 			// eslint-disable-next-line no-console
@@ -54,11 +59,6 @@ export default class RefreshStyles extends Controller {
 				"Not enabling auto style refresh due to the above error"
 			);
 		}
-		this.socket.onmessage = async (message) => {
-			if (message.data === "css") {
-				refresh_css();
-			}
-		};
 		document.documentElement.addEventListener("turbo:morph", refresh_css);
 	}
 

package/src/jdd-page.ts

@@ -10,6 +10,7 @@ import type { FlatTemplatable, Templatable } from "tempstream";
 import { tempstream } from "tempstream";
 import { ComponentInput } from "./inputs/component-input.js";
 import { ComponentPreviewActions } from "./component-preview-actions.js";
+import { htmlEscape } from "escape-goat";
 
 export const actionName = "Components";
 
@@ -267,7 +268,7 @@ export default abstract class JDDPage extends StatefulPage<
 	async deserializeState(ctx: Context, state_string: string) {
 		const jdd_context = this.makeJDDContext(ctx);
 		// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-		const raw = JSON.parse(state_string);
+		const raw = JSON.parse(state_string) as Record<string, unknown>;
 		// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access
 		const components_storage = raw.components;
 		if (!Array.isArray(components_storage)) {
@@ -331,9 +332,7 @@ export default abstract class JDDPage extends StatefulPage<
 
 	async render(ctx: Context, state: JDDPageState): Promise<string> {
 		return tempstream/* HTML */ `<div
-			class="${["two-column", "component-debugger", ...this.classes].join(
-				" "
-			)}"
+			class="${["two-column", "component-debugger", ...this.classes].join(" ")}"
 			id="component-debugger"
 			style="${`--resizable-column-width: ${
 				state.preview_size ? state.preview_size + "px" : "50vw"
@@ -367,8 +366,8 @@ export default abstract class JDDPage extends StatefulPage<
 						id="component-debugger-json-textarea"
 						autocomplete="off"
 					>
-							${(await this.serializeState(ctx, state, true)).replaceAll("<", "&lt;")}
-						</textarea
+						${(await this.serializeState(ctx, state, true)).replaceAll("<", "&lt;")}
+					</textarea
 					>
 					${this.makeActionButton(state, {
 						action: "replace_state",
@@ -398,41 +397,89 @@ export default abstract class JDDPage extends StatefulPage<
 					id="component-preview__header"
 					class="component-preview__header"
 				>
-					<span>Preview</span>
-					<select
-						name="$[preview_size]"
-						autocomplete="off"
-						class="component-preview-size-select"
-						data-component-debugger-target="sizeSelect"
-						data-action="change->component-debugger#handleWidthDropdown"
-						data-turbo-data-turbo-permanent
-					>
-						${state.preview_size
-							? /* HTML */ `<option
-									class="dynamic"
-									value="${state.preview_size}"
-									selected
-							  >
-									${state.preview_size} px
-							  </option>`
-							: ""}
-						${this.previewSizes.map(
-							(size) => /* HTML */ `<option value="${size}">
-								${`${size} px`}
-							</option>`
-						)}
-					</select>
-					<noscript>
-						${this.makeActionButton(state, "change_size")}
-					</noscript>
+					<div class="component-preview__item">
+						<span>Window size</span>
+						<select
+							name="$[preview_size]"
+							autocomplete="off"
+							class="component-preview-size-select"
+							data-component-debugger-target="sizeSelect"
+							data-action="change->component-debugger#handleWidthDropdown"
+							data-turbo-data-turbo-permanent
+						>
+							${
+								state.preview_size
+									? /* HTML */ `<option
+											class="dynamic"
+											value="${state.preview_size}"
+											selected
+									  >
+											${state.preview_size} px
+									  </option>`
+									: ""
+							}
+							${this.previewSizes.map(
+								(size) => /* HTML */ `<option value="${size}">
+									${`${size} px`}
+								</option>`
+							)}
+						</select>
+						<noscript>
+							${this.makeActionButton(state, "change_size")}
+						</noscript>
+					</div>
+					<style>
+						.component-preview .component-raw-view {
+							display: none;
+						}
+
+						.component-preview .jdd-outer-container {
+							display: block;
+						}
+
+						.component-preview:has(
+								.component-preview-checkbox:checked
+							)
+							.component-raw-view {
+							display: block;
+						}
+
+						.component-preview:has(
+								.component-preview-checkbox:checked
+							)
+							.jdd-outer-container {
+							display: none;
+						}
+					</style>
+					<label class="component-preview__item" for="show-html">
+						Show HTML
+						<input
+							type="checkbox"
+							id="show-html"
+							class="component-preview-checkbox"
+						/>
+					</label>
 				</div>
-				<div class="jdd-outer-container">
-					<div class="jdd-container">
-						${JDD.render(
-							this.registry,
-							documentContainerFromParsed(state.components),
-							this.makeJDDContext(ctx)
-						)}
+				
+						${(async () => {
+							const currentComponent = await JDD.render(
+								this.registry,
+								documentContainerFromParsed(state.components),
+								this.makeJDDContext(ctx)
+							);
+							return /* HTML */ ` <div
+									class="jdd-outer-container"
+								>
+									<div class="jdd-container">
+										${currentComponent}
+									</div>
+								</div>
+								<div class="component-raw-view">
+									<pre><code>${htmlEscape(
+										currentComponent
+									)}</code></pre>
+								</div>`;
+						})()}
 					</div>
 				</div>
 			</div>