@sealcode/jdd-editor 0.2.7 → 0.2.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/@types/components.sreact.d.ts +1 -1
- package/@types/inputs/component-input.d.ts +1 -1
- package/@types/jdd-creator.d.ts +2 -2
- package/dist/src/controllers/component-debugger.stimulus.js +1 -1
- package/dist/src/controllers/component-debugger.stimulus.js.map +2 -2
- package/dist/src/inputs/component-input-enum.js +2 -1
- package/dist/src/inputs/component-input-enum.js.map +2 -2
- package/dist/src/inputs/component-input.js +16 -13
- package/dist/src/inputs/component-input.js.map +2 -2
- package/package.json +1 -1
- package/src/controllers/component-debugger.stimulus.ts +1 -1
- package/src/inputs/component-input-enum.ts +2 -1
- package/src/inputs/component-input.ts +18 -15
|
@@ -5,7 +5,7 @@ import type { JDDPageState } from "./jdd-page.js";
|
|
|
5
5
|
import JDDPage from "./jdd-page.js";
|
|
6
6
|
export declare class JDDDebugger extends JDDPage {
|
|
7
7
|
renderParameterButtons(state: JDDPageState): Stringifiable;
|
|
8
|
-
actions: Record<string, import("
|
|
8
|
+
actions: Record<string, import("../../sealgen/@types/index.js").StatefulPageAction<JDDPageState>>;
|
|
9
9
|
getInitialState(ctx: Context): Promise<{
|
|
10
10
|
components: never[];
|
|
11
11
|
}>;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import type { Context } from "koa";
|
|
2
1
|
import type { ComponentArgument, JDDContext } from "@sealcode/jdd";
|
|
3
2
|
import type { StatefulPage } from "@sealcode/sealgen";
|
|
3
|
+
import type { Context } from "koa";
|
|
4
4
|
import type { ComponentPreviewActions } from "../component-preview-actions.js";
|
|
5
5
|
import type { JDDPageState } from "../jdd-page.js";
|
|
6
6
|
export declare const actionName = "Components";
|
package/@types/jdd-creator.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import type { JDDPageState } from "./jdd-page.js";
|
|
|
3
3
|
import JDDPage from "./jdd-page.js";
|
|
4
4
|
import { Stringifiable } from "tempstream/@types/stringify.js";
|
|
5
5
|
export default abstract class JDDCreator extends JDDPage {
|
|
6
|
-
actions: Record<string, import("
|
|
6
|
+
actions: Record<string, import("../../sealgen/@types/index.js").StatefulPageAction<JDDPageState>>;
|
|
7
7
|
/**
|
|
8
8
|
* This method returns list of components allowed in JDD Editor instance.
|
|
9
9
|
* If list is empty it will allow all of the components in registry,
|
|
@@ -11,7 +11,7 @@ export default abstract class JDDCreator extends JDDPage {
|
|
|
11
11
|
* available.
|
|
12
12
|
*/
|
|
13
13
|
getAllowedComponents(): string[];
|
|
14
|
-
getRegistryComponents(): Record<string, import("
|
|
14
|
+
getRegistryComponents(): Record<string, import("../../jdd/@types/component.js").Component<Record<string, import("../../jdd/@types/index.js").ComponentArgument<unknown, unknown, unknown>>>>;
|
|
15
15
|
renderParameterButtons(state: JDDPageState): string;
|
|
16
16
|
renderComponentBlock(ctx: Context, state: JDDPageState, component_data: {
|
|
17
17
|
component_name: string;
|
|
@@ -35,9 +35,9 @@ class ComponentDebugger extends Controller {
|
|
|
35
35
|
document.addEventListener("mouseup", remove_move_listener);
|
|
36
36
|
e.preventDefault();
|
|
37
37
|
});
|
|
38
|
+
this.update_width_display();
|
|
38
39
|
}
|
|
39
40
|
update_width_display() {
|
|
40
|
-
console.log("uwd");
|
|
41
41
|
const preview = this.targets.find("preview");
|
|
42
42
|
const component_width = preview.offsetWidth;
|
|
43
43
|
this.sizeSelectTarget.querySelectorAll("option").forEach((e) => e.removeAttribute("selected"));
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/controllers/component-debugger.stimulus.ts"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-non-null-assertion */\n/* eslint-disable @typescript-eslint/consistent-type-assertions */\n/* eslint-disable @typescript-eslint/no-unnecessary-type-assertion */\nimport { Controller } from \"stimulus\";\n\nexport default class ComponentDebugger extends Controller {\n\tdeclare sizeSelectTarget: HTMLSelectElement;\n\tdeclare gutterTarget: HTMLDivElement;\n\tdeclare checkboxTarget: HTMLInputElement;\n\tdeclare checkboxTargets: HTMLInputElement[];\n\tdeclare previewTarget: HTMLDivElement;\n\tdeclare componentBlockTargets: HTMLDivElement[];\n\tstatic targets = [\n\t\t\"gutter\",\n\t\t\"componentBlock\",\n\t\t\"checkbox\",\n\t\t\"preview\",\n\t\t\"sizeSelect\",\n\t];\n\n\tid: string;\n\tmain_form: HTMLFormElement;\n\torigin_x: number;\n\torigin_width: number;\n\n\thover_overlay: HTMLDivElement | null;\n\n\tconnect() {\n\t\tconst main_form = document\n\t\t\t.querySelector(\"#component-debugger\")\n\t\t\t?.closest(\"form\");\n\t\tif (!main_form) {\n\t\t\tthrow new Error(\"No main form\");\n\t\t}\n\t\tthis.main_form = main_form;\n\t\tdocument.documentElement.addEventListener(\"ts-rebuilt\", () => {\n\t\t\tthis.main_form.requestSubmit();\n\t\t});\n\t\tthis.main_form.addEventListener(\"turbo:submit-end\", () => {\n\t\t\t// this clears the values of file inputs, so they don't get unecessarily\n\t\t\t// re-uploaded on future submissions - the file is alreade there on the server\n\t\t\tthis.main_form\n\t\t\t\t.querySelectorAll(\"input[type=file]\")\n\t\t\t\t.forEach((input: HTMLInputElement) => (input.value = \"\"));\n\t\t});\n\n\t\twindow.addEventListener(\"load\", () => {\n\t\t\tthis.update_width_display();\n\t\t});\n\t\tdocument.addEventListener(\"turbo:render\", () => {\n\t\t\t// not calling that to see if that improves performance\n\t\t\t// console.log(\"UWD because of render event\");\n\t\t\t// this.update_width_display();\n\t\t});\n\n\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\tconst gutter = this.gutterTarget;\n\t\tgutter.addEventListener(\"mousedown\", (e) => {\n\t\t\tthis.origin_x = e.clientX;\n\t\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\t\tconst resizable = this.targets.find(\"preview\") as HTMLSpanElement;\n\t\t\tthis.origin_width = resizable.getBoundingClientRect().width;\n\t\t\tconst handler = (e: MouseEvent) => this.resizeHandler(e);\n\t\t\tdocument.addEventListener(\"mousemove\", handler);\n\t\t\tconst remove_move_listener = () => {\n\t\t\t\tdocument.removeEventListener(\"mousemove\", handler);\n\t\t\t\tdocument.removeEventListener(\"mouseup\", remove_move_listener);\n\t\t\t\tdocument.dispatchEvent(\n\t\t\t\t\tnew Event(\"component-debugger--resize-done\")\n\t\t\t\t);\n\t\t\t};\n\t\t\tdocument.addEventListener(\"mouseup\", remove_move_listener);\n\t\t\te.preventDefault();\n\t\t});\n\t}\n\n\tupdate_width_display() {\n\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\
|
|
5
|
-
"mappings": "AAGA,SAAS,kBAAkB;AAE3B,MAAO,0BAAwC,WAAW;AAAA,EAsBzD,UAAU;AA3BX;AA4BE,UAAM,aAAY,cAChB,cAAc,qBAAqB,MADnB,mBAEf,QAAQ;AACX,QAAI,CAAC,WAAW;AACf,YAAM,IAAI,MAAM,cAAc;AAAA,IAC/B;AACA,SAAK,YAAY;AACjB,aAAS,gBAAgB,iBAAiB,cAAc,MAAM;AAC7D,WAAK,UAAU,cAAc;AAAA,IAC9B,CAAC;AACD,SAAK,UAAU,iBAAiB,oBAAoB,MAAM;AAGzD,WAAK,UACH,iBAAiB,kBAAkB,EACnC,QAAQ,CAAC,UAA6B,MAAM,QAAQ,EAAG;AAAA,IAC1D,CAAC;AAED,WAAO,iBAAiB,QAAQ,MAAM;AACrC,WAAK,qBAAqB;AAAA,IAC3B,CAAC;AACD,aAAS,iBAAiB,gBAAgB,MAAM;AAAA,IAIhD,CAAC;AAGD,UAAM,SAAS,KAAK;AACpB,WAAO,iBAAiB,aAAa,CAAC,MAAM;AAC3C,WAAK,WAAW,EAAE;AAElB,YAAM,YAAY,KAAK,QAAQ,KAAK,SAAS;AAC7C,WAAK,eAAe,UAAU,sBAAsB,EAAE;AACtD,YAAM,UAAU,CAACA,OAAkB,KAAK,cAAcA,EAAC;AACvD,eAAS,iBAAiB,aAAa,OAAO;AAC9C,YAAM,uBAAuB,MAAM;AAClC,iBAAS,oBAAoB,aAAa,OAAO;AACjD,iBAAS,oBAAoB,WAAW,oBAAoB;AAC5D,iBAAS;AAAA,UACR,IAAI,MAAM,iCAAiC;AAAA,QAC5C;AAAA,MACD;AACA,eAAS,iBAAiB,WAAW,oBAAoB;AACzD,QAAE,eAAe;AAAA,IAClB,CAAC;AAAA,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-non-null-assertion */\n/* eslint-disable @typescript-eslint/consistent-type-assertions */\n/* eslint-disable @typescript-eslint/no-unnecessary-type-assertion */\nimport { Controller } from \"stimulus\";\n\nexport default class ComponentDebugger extends Controller {\n\tdeclare sizeSelectTarget: HTMLSelectElement;\n\tdeclare gutterTarget: HTMLDivElement;\n\tdeclare checkboxTarget: HTMLInputElement;\n\tdeclare checkboxTargets: HTMLInputElement[];\n\tdeclare previewTarget: HTMLDivElement;\n\tdeclare componentBlockTargets: HTMLDivElement[];\n\tstatic targets = [\n\t\t\"gutter\",\n\t\t\"componentBlock\",\n\t\t\"checkbox\",\n\t\t\"preview\",\n\t\t\"sizeSelect\",\n\t];\n\n\tid: string;\n\tmain_form: HTMLFormElement;\n\torigin_x: number;\n\torigin_width: number;\n\n\thover_overlay: HTMLDivElement | null;\n\n\tconnect() {\n\t\tconst main_form = document\n\t\t\t.querySelector(\"#component-debugger\")\n\t\t\t?.closest(\"form\");\n\t\tif (!main_form) {\n\t\t\tthrow new Error(\"No main form\");\n\t\t}\n\t\tthis.main_form = main_form;\n\t\tdocument.documentElement.addEventListener(\"ts-rebuilt\", () => {\n\t\t\tthis.main_form.requestSubmit();\n\t\t});\n\t\tthis.main_form.addEventListener(\"turbo:submit-end\", () => {\n\t\t\t// this clears the values of file inputs, so they don't get unecessarily\n\t\t\t// re-uploaded on future submissions - the file is alreade there on the server\n\t\t\tthis.main_form\n\t\t\t\t.querySelectorAll(\"input[type=file]\")\n\t\t\t\t.forEach((input: HTMLInputElement) => (input.value = \"\"));\n\t\t});\n\n\t\twindow.addEventListener(\"load\", () => {\n\t\t\tthis.update_width_display();\n\t\t});\n\t\tdocument.addEventListener(\"turbo:render\", () => {\n\t\t\t// not calling that to see if that improves performance\n\t\t\t// console.log(\"UWD because of render event\");\n\t\t\t// this.update_width_display();\n\t\t});\n\n\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\tconst gutter = this.gutterTarget;\n\t\tgutter.addEventListener(\"mousedown\", (e) => {\n\t\t\tthis.origin_x = e.clientX;\n\t\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\t\tconst resizable = this.targets.find(\"preview\") as HTMLSpanElement;\n\t\t\tthis.origin_width = resizable.getBoundingClientRect().width;\n\t\t\tconst handler = (e: MouseEvent) => this.resizeHandler(e);\n\t\t\tdocument.addEventListener(\"mousemove\", handler);\n\t\t\tconst remove_move_listener = () => {\n\t\t\t\tdocument.removeEventListener(\"mousemove\", handler);\n\t\t\t\tdocument.removeEventListener(\"mouseup\", remove_move_listener);\n\t\t\t\tdocument.dispatchEvent(\n\t\t\t\t\tnew Event(\"component-debugger--resize-done\")\n\t\t\t\t);\n\t\t\t};\n\t\t\tdocument.addEventListener(\"mouseup\", remove_move_listener);\n\t\t\te.preventDefault();\n\t\t});\n\t\tthis.update_width_display();\n\t}\n\n\tupdate_width_display() {\n\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\tconst preview = this.targets.find(\"preview\") as HTMLSpanElement;\n\t\tconst component_width = preview.offsetWidth;\n\t\tthis.sizeSelectTarget\n\t\t\t.querySelectorAll(\"option\")\n\t\t\t.forEach((e) => e.removeAttribute(\"selected\"));\n\t\tlet option: HTMLOptionElement | null =\n\t\t\tthis.sizeSelectTarget.querySelector(\"option.dynamic\");\n\t\tif (!option) {\n\t\t\toption = document.createElement(\"option\");\n\t\t\toption.classList.add(\"dynamic\");\n\t\t\toption.setAttribute(\"selected\", \"\");\n\t\t\tthis.sizeSelectTarget.insertBefore(\n\t\t\t\toption,\n\t\t\t\tthis.sizeSelectTarget.childNodes[0]!\n\t\t\t);\n\t\t}\n\t\toption.setAttribute(\"selected\", \"\");\n\t\toption.innerHTML = `${component_width} px`;\n\t\toption.value = String(component_width);\n\t\tthis.sizeSelectTarget.value = String(component_width);\n\t}\n\n\tresizeHandler(e: MouseEvent) {\n\t\tconst width_offset = this.origin_x - e.clientX;\n\t\tconst new_width = Math.max(this.origin_width + width_offset, 1);\n\t\tthis.setPreviewWidth(new_width);\n\t\tthis.update_width_display();\n\t\tdocument.dispatchEvent(new Event(\"component-debugger--resize\"));\n\t}\n\n\tsetPreviewWidth(width: number) {\n\t\tdocument\n\t\t\t.getElementById(\"component-debugger\")\n\t\t\t?.style.setProperty(\n\t\t\t\t\"--resizable-column-width\",\n\t\t\t\twidth.toString() + \"px\"\n\t\t\t);\n\t\tthis.update_width_display();\n\t}\n\n\thandleWidthDropdown() {\n\t\tconst value = this.sizeSelectTarget.value;\n\t\tthis.setPreviewWidth(parseInt(value));\n\t}\n\n\tgetHoverOverlay(): HTMLDivElement {\n\t\tif (\n\t\t\t!this.hover_overlay /* the node is absent */ ||\n\t\t\t!this.hover_overlay\n\t\t\t\t.parentElement /* the node was present, but it has been detached */\n\t\t) {\n\t\t\tthis.hover_overlay = document.createElement(\"div\");\n\t\t\tthis.hover_overlay.classList.add(\"hover-overlay\");\n\t\t\tthis.element\n\t\t\t\t.querySelector(\".jdd-outer-container\")\n\t\t\t\t?.append(this.hover_overlay);\n\t\t}\n\t\treturn this.hover_overlay;\n\t}\n\n\thandleBlockHover(e: MouseEvent) {\n\t\tconst index = parseInt(\n\t\t\t(e.target as HTMLDivElement)\n\t\t\t\t.closest(\".jdd-editor__component-block\")\n\t\t\t\t?.getAttribute(\"data-component-index\") || \"0\"\n\t\t);\n\t\tconst selector = `.component-number-${index}`;\n\t\tconst target_element = this.element.querySelector(\n\t\t\tselector\n\t\t) as HTMLDivElement;\n\t\tif (!target_element) {\n\t\t\tconsole.warn(`Didn't find an element matching: ${selector}`);\n\t\t\treturn;\n\t\t}\n\t\tconst width = target_element.clientWidth;\n\t\tconst height = target_element.clientHeight;\n\t\tconst top = target_element.offsetTop;\n\t\tconst overlay = this.getHoverOverlay();\n\t\toverlay.classList.remove(\"inactive\");\n\t\toverlay.style.setProperty(\"width\", `${width}px`);\n\t\toverlay.style.setProperty(\"height\", `${height}px`);\n\t\toverlay.style.setProperty(\"top\", `${top}px`);\n\t}\n\n\thandleBlockUnhover(e: MouseEvent) {\n\t\tconst overlay = this.getHoverOverlay();\n\t\toverlay.classList.add(\"inactive\");\n\t}\n\n\tcomponentBlockTargetConnected(block_element: HTMLDivElement) {\n\t\tconst index = parseInt(\n\t\t\tblock_element.getAttribute(\"data-component-index\") || \"0\"\n\t\t);\n\t\tblock_element.addEventListener(\"focusin\", () => {\n\t\t\tthis.scrollToComponentPreview(index);\n\t\t});\n\n\t\tconst summary = block_element.querySelector(\"summary\");\n\t\tif (summary) {\n\t\t\tsummary.addEventListener(\n\t\t\t\t\"mouseenter\",\n\t\t\t\tthis.handleBlockHover.bind(this)\n\t\t\t);\n\t\t\tsummary.addEventListener(\n\t\t\t\t\"mouseleave\",\n\t\t\t\tthis.handleBlockUnhover.bind(this)\n\t\t\t);\n\t\t}\n\t}\n\n\tpreviewTargetConnected(preview_element: HTMLDivElement) {\n\t\tpreview_element.addEventListener(\"click\", ({ target }) => {\n\t\t\tif (!(target instanceof HTMLElement)) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst closest = target.closest(\".jdd-component\");\n\t\t\tif (!closest) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst index = parseInt(\n\t\t\t\tString(\n\t\t\t\t\tArray.from(closest.classList)\n\t\t\t\t\t\t.find((c) => c.startsWith(\"component-number-\"))\n\t\t\t\t\t\t?.replace(\"component-number-\", \"\")\n\t\t\t\t)\n\t\t\t);\n\t\t\tif (isNaN(index)) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tthis.focusComponentBlock(index);\n\t\t});\n\t}\n\n\tfocusComponentBlock(index: number) {\n\t\tconst block = this.componentBlockTargets[index];\n\t\tif (!block) {\n\t\t\treturn;\n\t\t}\n\t\tthis.checkboxTargets[index]!.checked = true;\n\t\tthis.checkboxTargets[index]!.dispatchEvent(new Event(\"change\")); // to help with refreshing markdown editor\n\t\tblock.scrollIntoView({ behavior: \"smooth\" });\n\t\t(\n\t\t\tblock.querySelector(\n\t\t\t\t\".component-preview-parameters input\"\n\t\t\t) as HTMLInputElement\n\t\t)?.focus();\n\t}\n\n\tgetIndex(block_element: HTMLDivElement) {\n\t\tconst index = parseInt(\n\t\t\tString(block_element.getAttribute(\"data-component-index\"))\n\t\t);\n\t\treturn index;\n\t}\n\n\tlabelClicked(element: MouseEvent) {\n\t\tconst block_element = (element.target as HTMLDivElement).closest(\n\t\t\t`[data-component-debugger-target=\"componentBlock\"]`\n\t\t) as HTMLDivElement;\n\t\tconst index = this.getIndex(block_element);\n\t\tif (!this.checkboxTargets?.[index]?.checked) {\n\t\t\tthis.scrollToComponentPreview(index);\n\t\t}\n\t}\n\n\tgetPreviewElementForComponentIndex(index: number) {\n\t\tconst element = this.element.querySelector(\n\t\t\t`.component-number-${index}`\n\t\t) as HTMLDialogElement;\n\t\treturn element;\n\t}\n\n\tscrollToComponentPreview(index: number) {\n\t\tconst element = this.getPreviewElementForComponentIndex(index);\n\t\tif (!element) {\n\t\t\treturn;\n\t\t}\n\t\tconst preview_element =\n\t\t\tthis.element.querySelector(\".component-preview\");\n\t\tif (!preview_element) {\n\t\t\tthrow new Error(\"Missing preview element!\");\n\t\t}\n\t\tif (element.clientHeight > preview_element.clientHeight) {\n\t\t\tpreview_element.scrollTop = element.offsetTop - 44;\n\t\t} else {\n\t\t\tpreview_element.scrollTop =\n\t\t\t\telement.offsetTop -\n\t\t\t\t(preview_element.clientHeight - element.clientHeight) / 2 -\n\t\t\t\t44;\n\t\t}\n\t}\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["e"]
|
|
7
7
|
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { printArgPath } from "./print-arg-path.js";
|
|
2
|
+
import { htmlEscape } from "escape-goat";
|
|
2
3
|
function ComponentInputEnum({
|
|
3
4
|
arg_path,
|
|
4
5
|
arg,
|
|
@@ -15,7 +16,7 @@ function ComponentInputEnum({
|
|
|
15
16
|
>
|
|
16
17
|
${arg.getValues(jdd_context).map(
|
|
17
18
|
(v) => `<option
|
|
18
|
-
value="${v}"
|
|
19
|
+
value="${htmlEscape(v)}"
|
|
19
20
|
${value == v ? "selected" : ""}
|
|
20
21
|
>
|
|
21
22
|
${v}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/inputs/component-input-enum.ts"],
|
|
4
|
-
"sourcesContent": ["import type { Enum, JDDContext } from \"@sealcode/jdd\";\nimport { printArgPath } from \"./print-arg-path.js\";\n\nexport function ComponentInputEnum<State, S extends string, T extends Enum<S>>({\n\targ_path,\n\targ,\n\tvalue,\n\tonchange,\n\tjdd_context,\n}: {\n\tstate: State;\n\targ_path: string[];\n\targ: T;\n\tvalue: string;\n\tonchange?: string;\n\tjdd_context: JDDContext;\n}) {\n\treturn /* HTML */ `<div id=${`component-input-enum-${arg_path.join(\"-\")}`}>\n\t\t<label>\n\t\t\t${arg_path.at(-1) || \"\"}\n\t\t\t<select\n\t\t\t\tname=\"${`$${printArgPath(arg_path)}`}\"\n\t\t\t\tonchange=\"${onchange || \"\"}\"\n\t\t\t>\n\t\t\t\t${arg\n\t\t\t\t\t.getValues(jdd_context)\n\t\t\t\t\t.map(\n\t\t\t\t\t\t(v: S) =>\n\t\t\t\t\t\t\t/* HTML */ `<option\n\t\t\t\t\t\t\t\tvalue=\"${v}\"\n\t\t\t\t\t\t\t\t${value == v ? \"selected\" : \"\"}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t${v}\n\t\t\t\t\t\t\t</option>`\n\t\t\t\t\t)\n\t\t\t\t\t.join(\"\")}\n\t\t\t</select>\n\t\t</label>\n\t</div>`;\n}\n"],
|
|
5
|
-
"mappings": "AACA,SAAS,oBAAoB;
|
|
4
|
+
"sourcesContent": ["import type { Enum, JDDContext } from \"@sealcode/jdd\";\nimport { printArgPath } from \"./print-arg-path.js\";\nimport { htmlEscape } from \"escape-goat\";\n\nexport function ComponentInputEnum<State, S extends string, T extends Enum<S>>({\n\targ_path,\n\targ,\n\tvalue,\n\tonchange,\n\tjdd_context,\n}: {\n\tstate: State;\n\targ_path: string[];\n\targ: T;\n\tvalue: string;\n\tonchange?: string;\n\tjdd_context: JDDContext;\n}) {\n\treturn /* HTML */ `<div id=${`component-input-enum-${arg_path.join(\"-\")}`}>\n\t\t<label>\n\t\t\t${arg_path.at(-1) || \"\"}\n\t\t\t<select\n\t\t\t\tname=\"${`$${printArgPath(arg_path)}`}\"\n\t\t\t\tonchange=\"${onchange || \"\"}\"\n\t\t\t>\n\t\t\t\t${arg\n\t\t\t\t\t.getValues(jdd_context)\n\t\t\t\t\t.map(\n\t\t\t\t\t\t(v: S) =>\n\t\t\t\t\t\t\t/* HTML */ `<option\n\t\t\t\t\t\t\t\tvalue=\"${htmlEscape(v)}\"\n\t\t\t\t\t\t\t\t${value == v ? \"selected\" : \"\"}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t${v}\n\t\t\t\t\t\t\t</option>`\n\t\t\t\t\t)\n\t\t\t\t\t.join(\"\")}\n\t\t\t</select>\n\t\t</label>\n\t</div>`;\n}\n"],
|
|
5
|
+
"mappings": "AACA,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB;AAEpB,SAAS,mBAA+D;AAAA,EAC9E;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAOG;AACF,SAAkB,WAAW,wBAAwB,SAAS,KAAK,GAAG;AAAA;AAAA,KAElE,SAAS,GAAG,EAAE,KAAK;AAAA;AAAA,YAEZ,IAAI,aAAa,QAAQ;AAAA,gBACrB,YAAY;AAAA;AAAA,MAEtB,IACA,UAAU,WAAW,EACrB;AAAA,IACA,CAAC,MACW;AAAA,iBACD,WAAW,CAAC;AAAA,UACnB,SAAS,IAAI,aAAa;AAAA;AAAA,UAE1B;AAAA;AAAA,EAEL,EACC,KAAK,EAAE;AAAA;AAAA;AAAA;AAIb;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,24 +1,27 @@
|
|
|
1
|
-
import { printArgPath } from "./print-arg-path.js";
|
|
2
|
-
import { NestedComponent, Color, SingleReference } from "@sealcode/jdd";
|
|
3
1
|
import {
|
|
2
|
+
Code,
|
|
3
|
+
Color,
|
|
4
4
|
ComponentArguments,
|
|
5
5
|
Enum,
|
|
6
6
|
Image,
|
|
7
7
|
List,
|
|
8
|
+
NestedComponent,
|
|
9
|
+
SingleReference,
|
|
8
10
|
Structured,
|
|
9
|
-
Table
|
|
10
|
-
Code
|
|
11
|
+
Table
|
|
11
12
|
} from "@sealcode/jdd";
|
|
12
|
-
import { ComponentInputStructured } from "./component-input-structured.js";
|
|
13
|
-
import { ComponentInputList } from "./component-input-list.js";
|
|
14
|
-
import { ComponentInputEnum } from "./component-input-enum.js";
|
|
15
|
-
import { ComponentInputImage } from "./component-input-image.js";
|
|
16
|
-
import { ComponentInputTable } from "./component-input-table.js";
|
|
17
|
-
import { ComponentInputSingleReference } from "./component-input-single-reference.js";
|
|
18
13
|
import { is, predicates } from "@sealcode/ts-predicates";
|
|
14
|
+
import { htmlEscape } from "escape-goat";
|
|
19
15
|
import { tempstream } from "tempstream";
|
|
20
16
|
import { ComponentInputCode } from "./component-input-code.js";
|
|
21
17
|
import { ComponentInputColor } from "./component-input-color.js";
|
|
18
|
+
import { ComponentInputEnum } from "./component-input-enum.js";
|
|
19
|
+
import { ComponentInputImage } from "./component-input-image.js";
|
|
20
|
+
import { ComponentInputList } from "./component-input-list.js";
|
|
21
|
+
import { ComponentInputSingleReference } from "./component-input-single-reference.js";
|
|
22
|
+
import { ComponentInputStructured } from "./component-input-structured.js";
|
|
23
|
+
import { ComponentInputTable } from "./component-input-table.js";
|
|
24
|
+
import { printArgPath } from "./print-arg-path.js";
|
|
22
25
|
const actionName = "Components";
|
|
23
26
|
const absoluteUrlPattern = "http(s?)(://)((www.)?)(([^.]+).)?([a-zA-z0-9-_]+)";
|
|
24
27
|
async function ComponentInput({
|
|
@@ -129,7 +132,7 @@ async function ComponentInput({
|
|
|
129
132
|
return tempstream` <input
|
|
130
133
|
type="number"
|
|
131
134
|
name="${`$${printArgPath(arg_path)}`}"
|
|
132
|
-
value="${(value || "").toString()}"
|
|
135
|
+
value="${htmlEscape((value || "").toString())}"
|
|
133
136
|
min="${arg.min || ""}"
|
|
134
137
|
max="${arg.max || ""}"
|
|
135
138
|
step="${arg.step || ""}"
|
|
@@ -138,7 +141,7 @@ async function ComponentInput({
|
|
|
138
141
|
return tempstream` <input
|
|
139
142
|
type="${isUrlAbsolute ? "url" : "text"}"
|
|
140
143
|
name="${`$${printArgPath(arg_path)}`}"
|
|
141
|
-
value="${(value || "").toString()}"
|
|
144
|
+
value="${htmlEscape((value || "").toString())}"
|
|
142
145
|
size="40"
|
|
143
146
|
${isUrlAbsolute ? `pattern="${absoluteUrlPattern}"` : ""}
|
|
144
147
|
/>`;
|
|
@@ -146,7 +149,7 @@ async function ComponentInput({
|
|
|
146
149
|
return tempstream` <input
|
|
147
150
|
type="${inputType}"
|
|
148
151
|
name="${`$${printArgPath(arg_path)}`}"
|
|
149
|
-
value="${is(value, predicates.string) ? value : ""}"
|
|
152
|
+
value="${is(value, predicates.string) ? htmlEscape(value) : ""}"
|
|
150
153
|
size="40"
|
|
151
154
|
${isUrlAbsolute ? `pattern="${absoluteUrlPattern}"` : ""}
|
|
152
155
|
/>`;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/inputs/component-input.ts"],
|
|
4
|
-
"sourcesContent": ["import
|
|
5
|
-
"mappings": "AAAA,
|
|
4
|
+
"sourcesContent": ["import type { FilePointer } from \"@sealcode/file-manager\";\nimport type { ComponentArgument, JDDContext, TableData } from \"@sealcode/jdd\";\nimport {\n\tCode,\n\tColor,\n\tComponentArguments,\n\tEnum,\n\tImage,\n\tList,\n\tNestedComponent,\n\tSingleReference,\n\tStructured,\n\tTable,\n} from \"@sealcode/jdd\";\nimport type { StatefulPage } from \"@sealcode/sealgen\";\nimport { is, predicates } from \"@sealcode/ts-predicates\";\nimport { htmlEscape } from \"escape-goat\";\nimport type { Context } from \"koa\";\nimport { tempstream } from \"tempstream\";\nimport type { ComponentPreviewActions } from \"../component-preview-actions.js\";\nimport type { JDDPageState } from \"../jdd-page.js\";\nimport { ComponentInputCode } from \"./component-input-code.js\";\nimport { ComponentInputColor } from \"./component-input-color.js\";\nimport { ComponentInputEnum } from \"./component-input-enum.js\";\nimport { ComponentInputImage } from \"./component-input-image.js\";\nimport { ComponentInputList } from \"./component-input-list.js\";\nimport { ComponentInputSingleReference } from \"./component-input-single-reference.js\";\nimport { ComponentInputStructured } from \"./component-input-structured.js\";\nimport { ComponentInputTable } from \"./component-input-table.js\";\nimport { printArgPath } from \"./print-arg-path.js\";\nexport const actionName = \"Components\";\nconst absoluteUrlPattern = \"http(s?)(://)((www.)?)(([^.]+).)?([a-zA-z0-9-_]+)\";\n\nexport async function ComponentInput<State extends JDDPageState, T>({\n\tctx,\n\tstate,\n\targ_path,\n\targ,\n\tvalue,\n\tpage,\n\tmakeJDDContext,\n\tmakeAssetURL,\n}: {\n\tstate: State;\n\tctx: Context;\n\targ_path: string[];\n\targ: ComponentArgument<T>;\n\tvalue: T;\n\tpage: StatefulPage<JDDPageState, typeof ComponentPreviewActions>;\n\tmakeJDDContext: (ctx: Context) => JDDContext;\n\tmakeAssetURL: (asset: string) => string;\n}): Promise<string> {\n\tif (value === undefined) {\n\t\tvalue = await arg.getEmptyValue(makeJDDContext(ctx));\n\t}\n\tif (arg instanceof Color) {\n\t\treturn ComponentInputColor({\n\t\t\tctx,\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\targ,\n\t\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\t\tvalue: value as string,\n\t\t\tpage,\n\t\t\tonchange: page.rerender(),\n\t\t\tmakeJDDContext,\n\t\t});\n\t}\n\tif (arg instanceof List) {\n\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\treturn ComponentInputList({\n\t\t\tctx,\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\targ,\n\t\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\t\tvalue: value as T[],\n\t\t\tpage,\n\t\t\tmakeJDDContext,\n\t\t\tmakeAssetURL,\n\t\t});\n\t}\n\n\tconst argType = arg.getTypeName();\n\tconst isUrlAbsolute =\n\t\targ instanceof ComponentArguments.URL && arg.urlType === \"absolute\";\n\tconst inputType = isUrlAbsolute ? \"url\" : \"text\";\n\n\tif (arg instanceof Structured || arg instanceof NestedComponent) {\n\t\treturn ComponentInputStructured({\n\t\t\tctx,\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\targ,\n\t\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\t\tvalue: value as Record<string, unknown>,\n\t\t\tpage,\n\t\t\tmakeJDDContext,\n\t\t\tmakeAssetURL,\n\t\t});\n\t}\n\n\tif (arg instanceof SingleReference) {\n\t\treturn ComponentInputSingleReference({\n\t\t\tctx,\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\targ,\n\t\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\t\tvalue: value as string,\n\t\t\tonchange: page.rerender(),\n\t\t\tmakeJDDContext,\n\t\t});\n\t}\n\n\tif (arg instanceof Enum) {\n\t\treturn ComponentInputEnum({\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\targ,\n\t\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\t\tvalue: value as string,\n\t\t\tonchange: page.rerender(),\n\t\t\tjdd_context: makeJDDContext(ctx),\n\t\t});\n\t}\n\n\tif (arg instanceof Image) {\n\t\treturn ComponentInputImage({\n\t\t\tctx,\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\targ,\n\t\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\t\tvalue: value as FilePointer,\n\t\t\tpage,\n\t\t\tmakeJDDContext,\n\t\t});\n\t}\n\n\tif (arg instanceof Table) {\n\t\treturn ComponentInputTable({\n\t\t\tctx,\n\t\t\tstate,\n\t\t\targ_path,\n\t\t\targ,\n\t\t\t// eslint-disable-next-line @typescript-eslint/consistent-type-assertions\n\t\t\tvalue: value as TableData<unknown, unknown>,\n\t\t\tpage,\n\t\t\tmakeJDDContext,\n\t\t\tmakeAssetURL,\n\t\t});\n\t}\n\n\tif (arg instanceof Code) {\n\t\treturn ComponentInputCode({\n\t\t\tlanguage: arg.language,\n\t\t\tvalue: is(value, predicates.string) ? value : \"\",\n\t\t\targ_path,\n\t\t});\n\t}\n\n\tconst inputElement = () => {\n\t\tif (arg instanceof ComponentArguments.Number) {\n\t\t\treturn tempstream /* HTML */ ` <input\n\t\t\t\ttype=\"number\"\n\t\t\t\tname=\"${`$${printArgPath(arg_path)}`}\"\n\t\t\t\tvalue=\"${htmlEscape((value || \"\").toString())}\"\n\t\t\t\tmin=\"${arg.min || \"\"}\"\n\t\t\t\tmax=\"${arg.max || \"\"}\"\n\t\t\t\tstep=\"${arg.step || \"\"}\"\n\t\t\t/>`;\n\t\t} else if (arg instanceof ComponentArguments.URL) {\n\t\t\treturn tempstream /* HTML */ ` <input\n\t\t\t\ttype=\"${isUrlAbsolute ? \"url\" : \"text\"}\"\n\t\t\t\tname=\"${`$${printArgPath(arg_path)}`}\"\n\t\t\t\tvalue=\"${htmlEscape((value || \"\").toString())}\"\n\t\t\t\tsize=\"40\"\n\t\t\t\t${isUrlAbsolute ? `pattern=\"${absoluteUrlPattern}\"` : \"\"}\n\t\t\t/>`;\n\t\t} else {\n\t\t\treturn tempstream /* HTML */ ` <input\n\t\t\t\ttype=\"${inputType}\"\n\t\t\t\tname=\"${`$${printArgPath(arg_path)}`}\"\n\t\t\t\tvalue=\"${is(value, predicates.string) ? htmlEscape(value) : \"\"}\"\n\t\t\t\tsize=\"40\"\n\t\t\t\t${isUrlAbsolute ? `pattern=\"${absoluteUrlPattern}\"` : \"\"}\n\t\t\t/>`;\n\t\t}\n\t};\n\n\treturn /* HTML */ `<div>\n\t\t<label>\n\t\t\t${arg_path.at(-1) || \"\"}\n\t\t\t${argType == \"markdown\"\n\t\t\t\t? /* HTML */ `<div class=\"grow-wrap\">\n\t\t\t\t\t\t<textarea\n\t\t\t\t\t\t\tname=\"${`$${printArgPath(arg_path)}`}\"\n\t\t\t\t\t\t\tonblur=\"${page.rerender()}\"\n\t\t\t\t\t\t\tcols=\"40\"\n\t\t\t\t\t\t\tdata-controller=\"markdown-textarea submit-on-input\"\n\t\t\t\t\t\t\tdata-action=\"autogrow-textarea#autogrow blur->autogrow-textarea#autogrow resize->autogrow-textarea#autogrow submit-on-input#sendValues focus->submit-on-input#makePermanent blur->submit-on-input#makeNotPermanent\"\n\t\t\t\t\t\t\tautocomplete=\"off\"\n\t\t\t\t\t\t>\n${is(value, predicates.string) ? value : \"\"}</textarea\n\t\t\t\t\t\t>\n\t\t\t\t\t</div>`\n\t\t\t\t: await inputElement()}\n\t\t</label>\n\t</div>`;\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -72,11 +72,11 @@ export default class ComponentDebugger extends Controller {
|
|
|
72
72
|
document.addEventListener("mouseup", remove_move_listener);
|
|
73
73
|
e.preventDefault();
|
|
74
74
|
});
|
|
75
|
+
this.update_width_display();
|
|
75
76
|
}
|
|
76
77
|
|
|
77
78
|
update_width_display() {
|
|
78
79
|
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
|
|
79
|
-
console.log("uwd");
|
|
80
80
|
const preview = this.targets.find("preview") as HTMLSpanElement;
|
|
81
81
|
const component_width = preview.offsetWidth;
|
|
82
82
|
this.sizeSelectTarget
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { Enum, JDDContext } from "@sealcode/jdd";
|
|
2
2
|
import { printArgPath } from "./print-arg-path.js";
|
|
3
|
+
import { htmlEscape } from "escape-goat";
|
|
3
4
|
|
|
4
5
|
export function ComponentInputEnum<State, S extends string, T extends Enum<S>>({
|
|
5
6
|
arg_path,
|
|
@@ -27,7 +28,7 @@ export function ComponentInputEnum<State, S extends string, T extends Enum<S>>({
|
|
|
27
28
|
.map(
|
|
28
29
|
(v: S) =>
|
|
29
30
|
/* HTML */ `<option
|
|
30
|
-
value="${v}"
|
|
31
|
+
value="${htmlEscape(v)}"
|
|
31
32
|
${value == v ? "selected" : ""}
|
|
32
33
|
>
|
|
33
34
|
${v}
|
|
@@ -1,30 +1,33 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import type { Context } from "koa";
|
|
1
|
+
import type { FilePointer } from "@sealcode/file-manager";
|
|
3
2
|
import type { ComponentArgument, JDDContext, TableData } from "@sealcode/jdd";
|
|
4
|
-
import { NestedComponent, Color, SingleReference } from "@sealcode/jdd";
|
|
5
3
|
import {
|
|
4
|
+
Code,
|
|
5
|
+
Color,
|
|
6
6
|
ComponentArguments,
|
|
7
7
|
Enum,
|
|
8
8
|
Image,
|
|
9
9
|
List,
|
|
10
|
+
NestedComponent,
|
|
11
|
+
SingleReference,
|
|
10
12
|
Structured,
|
|
11
13
|
Table,
|
|
12
|
-
Code,
|
|
13
14
|
} from "@sealcode/jdd";
|
|
14
|
-
import { ComponentInputStructured } from "./component-input-structured.js";
|
|
15
15
|
import type { StatefulPage } from "@sealcode/sealgen";
|
|
16
|
+
import { is, predicates } from "@sealcode/ts-predicates";
|
|
17
|
+
import { htmlEscape } from "escape-goat";
|
|
18
|
+
import type { Context } from "koa";
|
|
19
|
+
import { tempstream } from "tempstream";
|
|
16
20
|
import type { ComponentPreviewActions } from "../component-preview-actions.js";
|
|
17
|
-
import { ComponentInputList } from "./component-input-list.js";
|
|
18
21
|
import type { JDDPageState } from "../jdd-page.js";
|
|
22
|
+
import { ComponentInputCode } from "./component-input-code.js";
|
|
23
|
+
import { ComponentInputColor } from "./component-input-color.js";
|
|
19
24
|
import { ComponentInputEnum } from "./component-input-enum.js";
|
|
20
25
|
import { ComponentInputImage } from "./component-input-image.js";
|
|
21
|
-
import {
|
|
22
|
-
import type { FilePointer } from "@sealcode/file-manager";
|
|
26
|
+
import { ComponentInputList } from "./component-input-list.js";
|
|
23
27
|
import { ComponentInputSingleReference } from "./component-input-single-reference.js";
|
|
24
|
-
import {
|
|
25
|
-
import {
|
|
26
|
-
import {
|
|
27
|
-
import { ComponentInputColor } from "./component-input-color.js";
|
|
28
|
+
import { ComponentInputStructured } from "./component-input-structured.js";
|
|
29
|
+
import { ComponentInputTable } from "./component-input-table.js";
|
|
30
|
+
import { printArgPath } from "./print-arg-path.js";
|
|
28
31
|
export const actionName = "Components";
|
|
29
32
|
const absoluteUrlPattern = "http(s?)(://)((www.)?)(([^.]+).)?([a-zA-z0-9-_]+)";
|
|
30
33
|
|
|
@@ -162,7 +165,7 @@ export async function ComponentInput<State extends JDDPageState, T>({
|
|
|
162
165
|
return tempstream /* HTML */ ` <input
|
|
163
166
|
type="number"
|
|
164
167
|
name="${`$${printArgPath(arg_path)}`}"
|
|
165
|
-
value="${(value || "").toString()}"
|
|
168
|
+
value="${htmlEscape((value || "").toString())}"
|
|
166
169
|
min="${arg.min || ""}"
|
|
167
170
|
max="${arg.max || ""}"
|
|
168
171
|
step="${arg.step || ""}"
|
|
@@ -171,7 +174,7 @@ export async function ComponentInput<State extends JDDPageState, T>({
|
|
|
171
174
|
return tempstream /* HTML */ ` <input
|
|
172
175
|
type="${isUrlAbsolute ? "url" : "text"}"
|
|
173
176
|
name="${`$${printArgPath(arg_path)}`}"
|
|
174
|
-
value="${(value || "").toString()}"
|
|
177
|
+
value="${htmlEscape((value || "").toString())}"
|
|
175
178
|
size="40"
|
|
176
179
|
${isUrlAbsolute ? `pattern="${absoluteUrlPattern}"` : ""}
|
|
177
180
|
/>`;
|
|
@@ -179,7 +182,7 @@ export async function ComponentInput<State extends JDDPageState, T>({
|
|
|
179
182
|
return tempstream /* HTML */ ` <input
|
|
180
183
|
type="${inputType}"
|
|
181
184
|
name="${`$${printArgPath(arg_path)}`}"
|
|
182
|
-
value="${is(value, predicates.string) ? value : ""}"
|
|
185
|
+
value="${is(value, predicates.string) ? htmlEscape(value) : ""}"
|
|
183
186
|
size="40"
|
|
184
187
|
${isUrlAbsolute ? `pattern="${absoluteUrlPattern}"` : ""}
|
|
185
188
|
/>`;
|