@gxp-dev/mod-ui 2.0.0

package/dist/definitions/elements/DisplayElement.js

@@ -0,0 +1,121 @@
+const e = {
+  type: "display.type",
+  contentType: "paragraph",
+  defaultValue: "",
+  name: null,
+  columns: 12,
+  columnsSm: 12,
+  columnsMd: 12,
+  columnsLg: 12,
+  columnsXl: 12
+}, a = {
+  icon: "type",
+  displayLabel: "Display Content",
+  elementCategory: "display",
+  description: "Read-only content: typography, markdown, images, video, charts, barcodes, icons, and more."
+}, l = {
+  style: {
+    type: "option-select.select",
+    defaultValue: "type",
+    label: "Display Style",
+    columns: 12,
+    selectOptions: [
+      { label: "Typography", value: "type" },
+      { label: "Markdown", value: "markdown" },
+      { label: "HTML", value: "html" },
+      { label: "Iframe", value: "iframe" },
+      { label: "Image", value: "image" },
+      { label: "Video", value: "video" },
+      { label: "Banner", value: "banner" },
+      { label: "Chart", value: "chart" },
+      { label: "Carousel", value: "carousel" },
+      { label: "Barcode", value: "barcode" },
+      { label: "QR Code", value: "qrcode" },
+      { label: "Icon", value: "icon" },
+      { label: "Progress Bar", value: "progress-bar" },
+      { label: "Sprite", value: "sprite" },
+      { label: "Reactive Canvas", value: "reactive-canvas" }
+    ],
+    section: "layout"
+  },
+  contentType: {
+    type: "option-select.select",
+    defaultValue: "paragraph",
+    label: "Content Type",
+    columns: 12,
+    selectOptions: [
+      { label: "Heading 1", value: "heading-1" },
+      { label: "Heading 2", value: "heading-2" },
+      { label: "Heading 3", value: "heading-3" },
+      { label: "Heading 4", value: "heading-4" },
+      { label: "Heading 5", value: "heading-5" },
+      { label: "Heading 6", value: "heading-6" },
+      { label: "Paragraph", value: "paragraph" },
+      { label: "Lead", value: "lead" },
+      { label: "Small", value: "small" },
+      { label: "Caption", value: "caption" },
+      { label: "Code", value: "code" },
+      { label: "Quote", value: "quote" }
+    ],
+    section: "layout",
+    conditionParams: [{ name: "style", logic: "==", value: "type" }]
+  },
+  defaultValue: {
+    type: "input.textarea",
+    label: "Content",
+    columns: 12,
+    section: "configuration"
+  },
+  name: {
+    type: "picker.data-model",
+    label: "Data Source Name",
+    columns: 12,
+    section: "configuration"
+  },
+  src: {
+    type: "input.text",
+    label: "Source URL",
+    columns: 12,
+    section: "configuration",
+    conditionParams: [
+      { name: "style", logic: "in-array", value: ["image", "video", "iframe"] }
+    ]
+  },
+  alt: {
+    type: "input.text",
+    label: "Alt Text",
+    columns: 12,
+    section: "configuration",
+    conditionParams: [{ name: "style", logic: "==", value: "image" }]
+  },
+  iconName: {
+    type: "picker.icon",
+    label: "Icon",
+    columns: 12,
+    section: "configuration",
+    conditionParams: [{ name: "style", logic: "==", value: "icon" }]
+  }
+}, n = {
+  type: { displayLabel: "Typography", description: "Render styled text: headings, paragraphs, captions, quotes." },
+  markdown: { displayLabel: "Markdown", description: "Render a Markdown string as formatted HTML." },
+  html: { displayLabel: "HTML", description: "Render raw HTML content safely." },
+  iframe: { displayLabel: "Iframe", description: "Embed an external page or document in an iframe." },
+  image: { displayLabel: "Image", description: "Display an image from a URL or asset library." },
+  video: { displayLabel: "Video", description: "Embed and play a video from a URL or asset." },
+  banner: { displayLabel: "Banner", description: "A full-width banner with a background image and overlay text." },
+  chart: { displayLabel: "Chart", description: "Render a Chart.js chart from a data config." },
+  carousel: { displayLabel: "Carousel", description: "Display a scrollable slide carousel." },
+  barcode: { displayLabel: "Barcode", description: "Render a 1D barcode from a string value." },
+  qrcode: { displayLabel: "QR Code", description: "Render a QR code from a string value." },
+  icon: { displayLabel: "Icon", description: "Display a single lucide icon with optional colour and size." },
+  "progress-bar": { displayLabel: "Progress Bar", description: "A percentage-based progress bar." },
+  sprite: { displayLabel: "Sprite", description: "Render an SVG sprite or icon sheet frame." },
+  "reactive-canvas": { displayLabel: "Reactive Canvas", description: "A canvas that reactively renders positioned block elements." }
+};
+export {
+  e as DisplayElementDefaults,
+  l as DisplayElementEditConfig,
+  a as DisplayElementMetadata,
+  n as DisplayStyleMetadataMap
+};
+//# sourceMappingURL=DisplayElement.js.map

package/dist/definitions/elements/DisplayElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DisplayElement.js","sources":["../../../src/definitions/elements/DisplayElement.ts"],"sourcesContent":["import type {\n  BaseElement,\n  EditConfig,\n  ElementMetadata,\n} from \"@/definitions/shared/base\"\n\n/**\n * Variants of the `display` element type. Display elements render\n * content (read-only) — they don't bind to form data the way inputs do.\n */\nexport type DisplayStyle =\n  | \"type\" // Plain typography. The default.\n  | \"markdown\"\n  | \"html\"\n  | \"iframe\"\n  | \"image\"\n  | \"video\"\n  | \"banner\"\n  | \"chart\"\n  | \"carousel\"\n  | \"barcode\"\n  | \"qrcode\"\n  | \"icon\"\n  | \"progress-bar\"\n  | \"sprite\"\n  | \"reactive-canvas\"\n\n/**\n * Sub-style for the `type` display — picks a typographic role.\n * Lets the same renderer produce headings, paragraphs, captions, etc.\n */\nexport type DisplayContentType =\n  | \"heading-1\"\n  | \"heading-2\"\n  | \"heading-3\"\n  | \"heading-4\"\n  | \"heading-5\"\n  | \"heading-6\"\n  | \"paragraph\"\n  | \"lead\"\n  | \"small\"\n  | \"caption\"\n  | \"code\"\n  | \"quote\"\n\nexport interface DisplayElement extends BaseElement<`display.${DisplayStyle}`> {\n  /**\n   * Optional data-model key. When set, the value at that path overrides\n   * `defaultValue` at render time (useful for binding display content to\n   * a sibling field's value).\n   */\n  name?: string | null\n  /**\n   * Static content. Strings are treated as the raw display value; the\n   * renderer interprets them according to `style` + `contentType`.\n   */\n  defaultValue?: string | number | null\n  /** Sub-style for the `type` display. */\n  contentType?: DisplayContentType\n  /** For `image` / `video` / `iframe`: source URL. */\n  src?: string\n  /** For `image`: alt text. */\n  alt?: string\n  /** For `icon`: lucide icon name. */\n  iconName?: string\n  /** For `progress-bar`: 0–100 percentage. */\n  progress?: number\n  /** For `chart`: chart config payload. */\n  chartConfig?: Record<string, unknown>\n  /** For `carousel`: slide payload. */\n  slides?: ReadonlyArray<Record<string, unknown>>\n}\n\nexport const DisplayElementDefaults = {\n  type: \"display.type\",\n  contentType: \"paragraph\",\n  defaultValue: \"\",\n  name: null,\n  columns: 12,\n  columnsSm: 12,\n  columnsMd: 12,\n  columnsLg: 12,\n  columnsXl: 12,\n} as const satisfies Partial<DisplayElement>\n\nexport const DisplayElementMetadata = {\n  icon: \"type\",\n  displayLabel: \"Display Content\",\n  elementCategory: \"display\",\n  description:\n    \"Read-only content: typography, markdown, images, video, charts, barcodes, icons, and more.\",\n} as const satisfies ElementMetadata\n\nexport const DisplayElementEditConfig = {\n  style: {\n    type: \"option-select.select\",\n    defaultValue: \"type\",\n    label: \"Display Style\",\n    columns: 12,\n    selectOptions: [\n      { label: \"Typography\", value: \"type\" },\n      { label: \"Markdown\", value: \"markdown\" },\n      { label: \"HTML\", value: \"html\" },\n      { label: \"Iframe\", value: \"iframe\" },\n      { label: \"Image\", value: \"image\" },\n      { label: \"Video\", value: \"video\" },\n      { label: \"Banner\", value: \"banner\" },\n      { label: \"Chart\", value: \"chart\" },\n      { label: \"Carousel\", value: \"carousel\" },\n      { label: \"Barcode\", value: \"barcode\" },\n      { label: \"QR Code\", value: \"qrcode\" },\n      { label: \"Icon\", value: \"icon\" },\n      { label: \"Progress Bar\", value: \"progress-bar\" },\n      { label: \"Sprite\", value: \"sprite\" },\n      { label: \"Reactive Canvas\", value: \"reactive-canvas\" },\n    ],\n    section: \"layout\",\n  },\n  contentType: {\n    type: \"option-select.select\",\n    defaultValue: \"paragraph\",\n    label: \"Content Type\",\n    columns: 12,\n    selectOptions: [\n      { label: \"Heading 1\", value: \"heading-1\" },\n      { label: \"Heading 2\", value: \"heading-2\" },\n      { label: \"Heading 3\", value: \"heading-3\" },\n      { label: \"Heading 4\", value: \"heading-4\" },\n      { label: \"Heading 5\", value: \"heading-5\" },\n      { label: \"Heading 6\", value: \"heading-6\" },\n      { label: \"Paragraph\", value: \"paragraph\" },\n      { label: \"Lead\", value: \"lead\" },\n      { label: \"Small\", value: \"small\" },\n      { label: \"Caption\", value: \"caption\" },\n      { label: \"Code\", value: \"code\" },\n      { label: \"Quote\", value: \"quote\" },\n    ],\n    section: \"layout\",\n    conditionParams: [{ name: \"style\", logic: \"==\", value: \"type\" }],\n  },\n  defaultValue: {\n    type: \"input.textarea\",\n    label: \"Content\",\n    columns: 12,\n    section: \"configuration\",\n  },\n  name: {\n    type: \"picker.data-model\",\n    label: \"Data Source Name\",\n    columns: 12,\n    section: \"configuration\",\n  },\n  src: {\n    type: \"input.text\",\n    label: \"Source URL\",\n    columns: 12,\n    section: \"configuration\",\n    conditionParams: [\n      { name: \"style\", logic: \"in-array\", value: [\"image\", \"video\", \"iframe\"] },\n    ],\n  },\n  alt: {\n    type: \"input.text\",\n    label: \"Alt Text\",\n    columns: 12,\n    section: \"configuration\",\n    conditionParams: [{ name: \"style\", logic: \"==\", value: \"image\" }],\n  },\n  iconName: {\n    type: \"picker.icon\",\n    label: \"Icon\",\n    columns: 12,\n    section: \"configuration\",\n    conditionParams: [{ name: \"style\", logic: \"==\", value: \"icon\" }],\n  },\n} as const satisfies EditConfig\n\nexport const DisplayStyleMetadataMap: Partial<Record<DisplayStyle, { displayLabel: string; description: string }>> = {\n  type: { displayLabel: \"Typography\", description: \"Render styled text: headings, paragraphs, captions, quotes.\" },\n  markdown: { displayLabel: \"Markdown\", description: \"Render a Markdown string as formatted HTML.\" },\n  html: { displayLabel: \"HTML\", description: \"Render raw HTML content safely.\" },\n  iframe: { displayLabel: \"Iframe\", description: \"Embed an external page or document in an iframe.\" },\n  image: { displayLabel: \"Image\", description: \"Display an image from a URL or asset library.\" },\n  video: { displayLabel: \"Video\", description: \"Embed and play a video from a URL or asset.\" },\n  banner: { displayLabel: \"Banner\", description: \"A full-width banner with a background image and overlay text.\" },\n  chart: { displayLabel: \"Chart\", description: \"Render a Chart.js chart from a data config.\" },\n  carousel: { displayLabel: \"Carousel\", description: \"Display a scrollable slide carousel.\" },\n  barcode: { displayLabel: \"Barcode\", description: \"Render a 1D barcode from a string value.\" },\n  qrcode: { displayLabel: \"QR Code\", description: \"Render a QR code from a string value.\" },\n  icon: { displayLabel: \"Icon\", description: \"Display a single lucide icon with optional colour and size.\" },\n  \"progress-bar\": { displayLabel: \"Progress Bar\", description: \"A percentage-based progress bar.\" },\n  sprite: { displayLabel: \"Sprite\", description: \"Render an SVG sprite or icon sheet frame.\" },\n  \"reactive-canvas\": { displayLabel: \"Reactive Canvas\", description: \"A canvas that reactively renders positioned block elements.\" },\n}\n"],"names":["DisplayElementDefaults","DisplayElementMetadata","DisplayElementEditConfig","DisplayStyleMetadataMap"],"mappings":"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"}

package/dist/definitions/elements/EditorElement.d.ts

@@ -0,0 +1,155 @@
+import { BaseElement } from '../shared/base';
+import { ValidationConfig } from '../shared/validation';
+/**
+ * Variants of the `editor` element type. Each value here maps 1:1 to a
+ * Vue file under `src/elements/editor/` via the engine's registry.
+ *
+ * The v2 schema spells the HTML variant as "html" — we accept both
+ * "html" (legacy) and "html-editor" (canonical) by widening the style
+ * accordingly. JSON authored against the platform deserialises either way.
+ */
+export type EditorStyle = "code-editor" | "markdown-editor" | "html-editor" | "image-editor" | "rich-text-editor";
+export interface EditorElement extends BaseElement<`editor.${EditorStyle}`> {
+    name: string;
+    label: string;
+    defaultValue?: string | number | null;
+    /** Help / hint markup rendered above the editor. */
+    instructions?: string;
+    /** CSS height (e.g. "40vh", "320px"). */
+    height?: string;
+    /** For `code-editor`: language hint (e.g. "javascript", "json"). */
+    language?: string;
+    /** Render line numbers (code/markdown editors). */
+    showLineNumbers?: boolean;
+    /** Soft-wrap long lines (code/markdown editors). */
+    wordWrap?: boolean;
+    /** Validation rules (Laravel-style strings). */
+    validation?: ValidationConfig;
+}
+export declare const EditorElementDefaults: {
+    readonly type: "editor.code-editor";
+    readonly defaultValue: "";
+    readonly height: "40vh";
+    readonly columns: 12;
+    readonly columnsSm: 12;
+    readonly columnsMd: 12;
+    readonly columnsLg: 12;
+    readonly columnsXl: 12;
+};
+export declare const EditorElementMetadata: {
+    readonly icon: "file-lines";
+    readonly displayLabel: "Editor";
+    readonly elementCategory: "editor";
+    readonly description: "Create a large text field to allow users to enter a large amount of text as either HTML, Markdown, Code or plain text.";
+};
+export declare const EditorElementEditConfig: {
+    readonly label: {
+        readonly type: "input.text";
+        readonly defaultValue: "";
+        readonly label: "Label";
+        readonly columnsMd: 6;
+        readonly columns: 12;
+        readonly section: "configuration";
+    };
+    readonly defaultValue: {
+        readonly type: "input.text";
+        readonly label: "Default Value";
+        readonly columnsMd: 6;
+        readonly columns: 12;
+        readonly section: "configuration";
+    };
+    readonly name: {
+        readonly type: "picker.data-model";
+        readonly defaultValue: "";
+        readonly label: "Name";
+        readonly columns: 12;
+        readonly section: "advanced";
+    };
+    readonly style: {
+        readonly type: "option-select.select";
+        readonly defaultValue: "code-editor";
+        readonly label: "Display Style";
+        readonly section: "layout";
+        readonly selectOptions: readonly [{
+            readonly label: "Code Editor";
+            readonly value: "code-editor";
+        }, {
+            readonly label: "Markdown Editor";
+            readonly value: "markdown-editor";
+        }, {
+            readonly label: "HTML Editor";
+            readonly value: "html-editor";
+        }, {
+            readonly label: "Image Editor";
+            readonly value: "image-editor";
+        }, {
+            readonly label: "Rich Text Editor";
+            readonly value: "rich-text-editor";
+        }];
+        readonly columns: 12;
+    };
+    readonly instructions: {
+        readonly type: "editor.html-editor";
+        readonly label: "Instructions";
+        readonly defaultValue: "";
+        readonly columns: 12;
+        readonly section: "configuration";
+    };
+    readonly height: {
+        readonly type: "input.text";
+        readonly label: "Height";
+        readonly defaultValue: "40vh";
+        readonly columns: 6;
+        readonly section: "layout";
+    };
+    readonly language: {
+        readonly type: "input.text";
+        readonly label: "Language";
+        readonly columns: 6;
+        readonly section: "layout";
+        readonly conditionParams: [{
+            readonly name: "style";
+            readonly logic: "==";
+            readonly value: "code-editor";
+        }];
+    };
+    readonly showLineNumbers: {
+        readonly type: "boolean.switch";
+        readonly label: "Show line numbers";
+        readonly columns: 6;
+        readonly section: "layout";
+        readonly conditionParams: [{
+            readonly name: "style";
+            readonly logic: "in-array";
+            readonly value: readonly ["code-editor", "markdown-editor"];
+        }];
+    };
+    readonly wordWrap: {
+        readonly type: "boolean.switch";
+        readonly label: "Word wrap";
+        readonly columns: 6;
+        readonly section: "layout";
+        readonly conditionParams: [{
+            readonly name: "style";
+            readonly logic: "in-array";
+            readonly value: readonly ["code-editor", "markdown-editor"];
+        }];
+    };
+    readonly required: {
+        readonly type: "boolean.switch";
+        readonly label: "Make item required";
+        readonly columns: 12;
+        readonly section: "configuration";
+    };
+    readonly readonly: {
+        readonly type: "boolean.switch";
+        readonly label: "Make item read-only";
+        readonly columns: 12;
+        readonly section: "configuration";
+    };
+};
+export declare const EditorStyleMetadataMap: Partial<Record<EditorStyle, {
+    displayLabel: string;
+    description: string;
+}>>;
+//# sourceMappingURL=EditorElement.d.ts.map

package/dist/definitions/elements/EditorElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditorElement.d.ts","sourceRoot":"","sources":["../../../src/definitions/elements/EditorElement.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,WAAW,EAGZ,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAA;AAEvE;;;;;;;GAOG;AACH,MAAM,MAAM,WAAW,GACnB,aAAa,GACb,iBAAiB,GACjB,aAAa,GACb,cAAc,GACd,kBAAkB,CAAA;AAEtB,MAAM,WAAW,aAAc,SAAQ,WAAW,CAAC,UAAU,WAAW,EAAE,CAAC;IACzE,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAA;IACrC,oDAAoD;IACpD,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,yCAAyC;IACzC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,oEAAoE;IACpE,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,mDAAmD;IACnD,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,oDAAoD;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,gDAAgD;IAChD,UAAU,CAAC,EAAE,gBAAgB,CAAA;CAC9B;AAED,eAAO,MAAM,qBAAqB;;;;;;;;;CASS,CAAA;AAE3C,eAAO,MAAM,qBAAqB;;;;;CAME,CAAA;AAEpC,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgGL,CAAA;AAE/B,eAAO,MAAM,sBAAsB,EAAE,OAAO,CAAC,MAAM,CAAC,WAAW,EAAE;IAAE,YAAY,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,CAAC,CAM9G,CAAA"}

package/dist/definitions/elements/EditorElement.js

@@ -0,0 +1,124 @@
+const e = {
+  type: "editor.code-editor",
+  defaultValue: "",
+  height: "40vh",
+  columns: 12,
+  columnsSm: 12,
+  columnsMd: 12,
+  columnsLg: 12,
+  columnsXl: 12
+}, t = {
+  icon: "file-lines",
+  displayLabel: "Editor",
+  elementCategory: "editor",
+  description: "Create a large text field to allow users to enter a large amount of text as either HTML, Markdown, Code or plain text."
+}, o = {
+  label: {
+    type: "input.text",
+    defaultValue: "",
+    label: "Label",
+    columnsMd: 6,
+    columns: 12,
+    section: "configuration"
+  },
+  defaultValue: {
+    type: "input.text",
+    label: "Default Value",
+    columnsMd: 6,
+    columns: 12,
+    section: "configuration"
+  },
+  name: {
+    type: "picker.data-model",
+    defaultValue: "",
+    label: "Name",
+    columns: 12,
+    section: "advanced"
+  },
+  style: {
+    type: "option-select.select",
+    defaultValue: "code-editor",
+    label: "Display Style",
+    section: "layout",
+    selectOptions: [
+      { label: "Code Editor", value: "code-editor" },
+      { label: "Markdown Editor", value: "markdown-editor" },
+      { label: "HTML Editor", value: "html-editor" },
+      { label: "Image Editor", value: "image-editor" },
+      { label: "Rich Text Editor", value: "rich-text-editor" }
+    ],
+    columns: 12
+  },
+  instructions: {
+    type: "editor.html-editor",
+    label: "Instructions",
+    defaultValue: "",
+    columns: 12,
+    section: "configuration"
+  },
+  height: {
+    type: "input.text",
+    label: "Height",
+    defaultValue: "40vh",
+    columns: 6,
+    section: "layout"
+  },
+  language: {
+    type: "input.text",
+    label: "Language",
+    columns: 6,
+    section: "layout",
+    conditionParams: [{ name: "style", logic: "==", value: "code-editor" }]
+  },
+  showLineNumbers: {
+    type: "boolean.switch",
+    label: "Show line numbers",
+    columns: 6,
+    section: "layout",
+    conditionParams: [
+      {
+        name: "style",
+        logic: "in-array",
+        value: ["code-editor", "markdown-editor"]
+      }
+    ]
+  },
+  wordWrap: {
+    type: "boolean.switch",
+    label: "Word wrap",
+    columns: 6,
+    section: "layout",
+    conditionParams: [
+      {
+        name: "style",
+        logic: "in-array",
+        value: ["code-editor", "markdown-editor"]
+      }
+    ]
+  },
+  required: {
+    type: "boolean.switch",
+    label: "Make item required",
+    columns: 12,
+    section: "configuration"
+  },
+  readonly: {
+    type: "boolean.switch",
+    label: "Make item read-only",
+    columns: 12,
+    section: "configuration"
+  }
+}, i = {
+  "code-editor": { displayLabel: "Code Editor", description: "A syntax-highlighted code editor for scripting or config." },
+  "markdown-editor": { displayLabel: "Markdown Editor", description: "A live-preview Markdown editor." },
+  "html-editor": { displayLabel: "HTML Editor", description: "A WYSIWYG HTML editor with source toggle." },
+  "image-editor": { displayLabel: "Image Editor", description: "An in-browser image editor with cropping and filters." },
+  "rich-text-editor": { displayLabel: "Rich Text Editor", description: "A Tiptap-powered rich text editor with formatting tools." }
+};
+export {
+  e as EditorElementDefaults,
+  o as EditorElementEditConfig,
+  t as EditorElementMetadata,
+  i as EditorStyleMetadataMap
+};
+//# sourceMappingURL=EditorElement.js.map

package/dist/definitions/elements/EditorElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditorElement.js","sources":["../../../src/definitions/elements/EditorElement.ts"],"sourcesContent":["import type {\n  BaseElement,\n  EditConfig,\n  ElementMetadata,\n} from \"@/definitions/shared/base\"\nimport type { ValidationConfig } from \"@/definitions/shared/validation\"\n\n/**\n * Variants of the `editor` element type. Each value here maps 1:1 to a\n * Vue file under `src/elements/editor/` via the engine's registry.\n *\n * The v2 schema spells the HTML variant as \"html\" — we accept both\n * \"html\" (legacy) and \"html-editor\" (canonical) by widening the style\n * accordingly. JSON authored against the platform deserialises either way.\n */\nexport type EditorStyle =\n  | \"code-editor\"\n  | \"markdown-editor\"\n  | \"html-editor\"\n  | \"image-editor\"\n  | \"rich-text-editor\"\n\nexport interface EditorElement extends BaseElement<`editor.${EditorStyle}`> {\n  name: string\n  label: string\n  defaultValue?: string | number | null\n  /** Help / hint markup rendered above the editor. */\n  instructions?: string\n  /** CSS height (e.g. \"40vh\", \"320px\"). */\n  height?: string\n  /** For `code-editor`: language hint (e.g. \"javascript\", \"json\"). */\n  language?: string\n  /** Render line numbers (code/markdown editors). */\n  showLineNumbers?: boolean\n  /** Soft-wrap long lines (code/markdown editors). */\n  wordWrap?: boolean\n  /** Validation rules (Laravel-style strings). */\n  validation?: ValidationConfig\n}\n\nexport const EditorElementDefaults = {\n  type: \"editor.code-editor\",\n  defaultValue: \"\",\n  height: \"40vh\",\n  columns: 12,\n  columnsSm: 12,\n  columnsMd: 12,\n  columnsLg: 12,\n  columnsXl: 12,\n} as const satisfies Partial<EditorElement>\n\nexport const EditorElementMetadata = {\n  icon: \"file-lines\",\n  displayLabel: \"Editor\",\n  elementCategory: \"editor\",\n  description:\n    \"Create a large text field to allow users to enter a large amount of text as either HTML, Markdown, Code or plain text.\",\n} as const satisfies ElementMetadata\n\nexport const EditorElementEditConfig = {\n  label: {\n    type: \"input.text\",\n    defaultValue: \"\",\n    label: \"Label\",\n    columnsMd: 6,\n    columns: 12,\n    section: \"configuration\",\n  },\n  defaultValue: {\n    type: \"input.text\",\n    label: \"Default Value\",\n    columnsMd: 6,\n    columns: 12,\n    section: \"configuration\",\n  },\n  name: {\n    type: \"picker.data-model\",\n    defaultValue: \"\",\n    label: \"Name\",\n    columns: 12,\n    section: \"advanced\",\n  },\n  style: {\n    type: \"option-select.select\",\n    defaultValue: \"code-editor\",\n    label: \"Display Style\",\n    section: \"layout\",\n    selectOptions: [\n      { label: \"Code Editor\", value: \"code-editor\" },\n      { label: \"Markdown Editor\", value: \"markdown-editor\" },\n      { label: \"HTML Editor\", value: \"html-editor\" },\n      { label: \"Image Editor\", value: \"image-editor\" },\n      { label: \"Rich Text Editor\", value: \"rich-text-editor\" },\n    ],\n    columns: 12,\n  },\n  instructions: {\n    type: \"editor.html-editor\",\n    label: \"Instructions\",\n    defaultValue: \"\",\n    columns: 12,\n    section: \"configuration\",\n  },\n  height: {\n    type: \"input.text\",\n    label: \"Height\",\n    defaultValue: \"40vh\",\n    columns: 6,\n    section: \"layout\",\n  },\n  language: {\n    type: \"input.text\",\n    label: \"Language\",\n    columns: 6,\n    section: \"layout\",\n    conditionParams: [{ name: \"style\", logic: \"==\", value: \"code-editor\" }],\n  },\n  showLineNumbers: {\n    type: \"boolean.switch\",\n    label: \"Show line numbers\",\n    columns: 6,\n    section: \"layout\",\n    conditionParams: [\n      {\n        name: \"style\",\n        logic: \"in-array\",\n        value: [\"code-editor\", \"markdown-editor\"],\n      },\n    ],\n  },\n  wordWrap: {\n    type: \"boolean.switch\",\n    label: \"Word wrap\",\n    columns: 6,\n    section: \"layout\",\n    conditionParams: [\n      {\n        name: \"style\",\n        logic: \"in-array\",\n        value: [\"code-editor\", \"markdown-editor\"],\n      },\n    ],\n  },\n  required: {\n    type: \"boolean.switch\",\n    label: \"Make item required\",\n    columns: 12,\n    section: \"configuration\",\n  },\n  readonly: {\n    type: \"boolean.switch\",\n    label: \"Make item read-only\",\n    columns: 12,\n    section: \"configuration\",\n  },\n} as const satisfies EditConfig\n\nexport const EditorStyleMetadataMap: Partial<Record<EditorStyle, { displayLabel: string; description: string }>> = {\n  \"code-editor\": { displayLabel: \"Code Editor\", description: \"A syntax-highlighted code editor for scripting or config.\" },\n  \"markdown-editor\": { displayLabel: \"Markdown Editor\", description: \"A live-preview Markdown editor.\" },\n  \"html-editor\": { displayLabel: \"HTML Editor\", description: \"A WYSIWYG HTML editor with source toggle.\" },\n  \"image-editor\": { displayLabel: \"Image Editor\", description: \"An in-browser image editor with cropping and filters.\" },\n  \"rich-text-editor\": { displayLabel: \"Rich Text Editor\", description: \"A Tiptap-powered rich text editor with formatting tools.\" },\n}\n"],"names":["EditorElementDefaults","EditorElementMetadata","EditorElementEditConfig","EditorStyleMetadataMap"],"mappings":"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"}

package/dist/definitions/elements/FileElement.d.ts

@@ -0,0 +1,130 @@
+import { BaseElement } from '../shared/base';
+import { ValidationConfig } from '../shared/validation';
+/**
+ * Variants of the `file` element type. Each value here maps 1:1 to a
+ * Vue file under `src/elements/file/` via the engine's registry.
+ */
+export type FileStyle = "upload" | "dropzone" | "asset-picker";
+export interface FileElement extends BaseElement<`file.${FileStyle}`> {
+    name: string;
+    label?: string;
+    /**
+     * MIME-type / extension hint string. Mirrors the HTML `accept` attribute
+     * and the v2 schema (e.g. "image/jpg, image/jpeg, image/png, application/pdf").
+     */
+    accept?: string;
+    /** Parsed list form — engine accepts either `accept` or `acceptedFileTypes`. */
+    acceptedFileTypes?: ReadonlyArray<string>;
+    /** Allow selecting more than one file. */
+    multiple?: boolean;
+    /** Maximum size in bytes for any single uploaded file. */
+    maxFileSize?: number;
+    /** For `asset-picker`: filter the asset library to a specific category. */
+    assetType?: string;
+    /** Validation rules (Laravel-style strings). */
+    validation?: ValidationConfig;
+}
+export declare const FileElementDefaults: {
+    readonly type: "file.upload";
+    readonly label: "File Upload";
+    readonly disabled: false;
+    readonly columns: 12;
+    readonly columnsSm: 12;
+    readonly columnsMd: 12;
+    readonly columnsLg: 12;
+    readonly columnsXl: 12;
+};
+export declare const FileElementMetadata: {
+    readonly icon: "photo-film-music";
+    readonly displayLabel: "File Upload";
+    readonly elementCategory: "file";
+    readonly description: "Upload files or invoke the asset picker to select an asset from the library.";
+};
+export declare const FileElementEditConfig: {
+    readonly label: {
+        readonly type: "input.text";
+        readonly defaultValue: "";
+        readonly label: "Label";
+        readonly columnsMd: 6;
+        readonly columns: 12;
+        readonly section: "configuration";
+    };
+    readonly defaultValue: {
+        readonly type: "input.text";
+        readonly label: "Default Value";
+        readonly columnsMd: 6;
+        readonly columns: 12;
+        readonly section: "configuration";
+    };
+    readonly name: {
+        readonly type: "picker.data-model";
+        readonly defaultValue: "";
+        readonly label: "Name";
+        readonly columns: 12;
+        readonly section: "advanced";
+    };
+    readonly style: {
+        readonly type: "option-select.select";
+        readonly defaultValue: "upload";
+        readonly label: "Input Style";
+        readonly columns: 6;
+        readonly selectOptions: readonly [{
+            readonly label: "Upload";
+            readonly value: "upload";
+        }, {
+            readonly label: "Dropzone";
+            readonly value: "dropzone";
+        }, {
+            readonly label: "Asset Picker";
+            readonly value: "asset-picker";
+        }];
+        readonly section: "layout";
+    };
+    readonly accept: {
+        readonly type: "input.text";
+        readonly label: "Accept File Types (comma separated: 'image/jpg, image/jpeg, image/png, image/*, application/pdf')";
+        readonly columns: 12;
+        readonly section: "configuration";
+    };
+    readonly multiple: {
+        readonly type: "boolean.switch";
+        readonly label: "Allow multiple files";
+        readonly columns: 6;
+        readonly section: "configuration";
+    };
+    readonly maxFileSize: {
+        readonly type: "input.text";
+        readonly contentType: "integer";
+        readonly label: "Max File Size (bytes)";
+        readonly columns: 6;
+        readonly section: "configuration";
+    };
+    readonly assetType: {
+        readonly type: "input.text";
+        readonly label: "Asset Type";
+        readonly columns: 12;
+        readonly section: "configuration";
+        readonly conditionParams: [{
+            readonly name: "style";
+            readonly logic: "==";
+            readonly value: "asset-picker";
+        }];
+    };
+    readonly required: {
+        readonly type: "boolean.switch";
+        readonly label: "Make item required";
+        readonly columns: 12;
+        readonly section: "configuration";
+    };
+    readonly readonly: {
+        readonly type: "boolean.switch";
+        readonly label: "Make item read-only";
+        readonly columns: 12;
+        readonly section: "configuration";
+    };
+};
+export declare const FileStyleMetadataMap: Partial<Record<FileStyle, {
+    displayLabel: string;
+    description: string;
+}>>;
+//# sourceMappingURL=FileElement.d.ts.map

package/dist/definitions/elements/FileElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileElement.d.ts","sourceRoot":"","sources":["../../../src/definitions/elements/FileElement.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,WAAW,EAGZ,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAA;AAEvE;;;GAGG;AACH,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,UAAU,GAAG,cAAc,CAAA;AAE9D,MAAM,WAAW,WAAY,SAAQ,WAAW,CAAC,QAAQ,SAAS,EAAE,CAAC;IACnE,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,gFAAgF;IAChF,iBAAiB,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAA;IACzC,0CAA0C;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,0DAA0D;IAC1D,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,2EAA2E;IAC3E,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gDAAgD;IAChD,UAAU,CAAC,EAAE,gBAAgB,CAAA;CAC9B;AAED,eAAO,MAAM,mBAAmB;;;;;;;;;CASS,CAAA;AAEzC,eAAO,MAAM,mBAAmB;;;;;CAMI,CAAA;AAEpC,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0EH,CAAA;AAE/B,eAAO,MAAM,oBAAoB,EAAE,OAAO,CAAC,MAAM,CAAC,SAAS,EAAE;IAAE,YAAY,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,CAAC,CAI1G,CAAA"}