@duke333/builder-ui 0.2.2 → 0.2.4

package/dist/index.js

@@ -29,7 +29,8 @@ function createBuilderApiClient(rootTransport, options = {}) {
     get: (value, requestOptions) => rootTransport.get(path(value), requestOptions),
     post: (value, body, requestOptions) => rootTransport.post(path(value), body, requestOptions),
     patch: (value, body, requestOptions) => rootTransport.patch(path(value), body, requestOptions),
-    delete: (value, requestOptions) => rootTransport.delete(path(value), requestOptions)
+    delete: (value, requestOptions) => rootTransport.delete(path(value), requestOptions),
+    upload: rootTransport.upload ? (value, body, requestOptions) => rootTransport.upload(path(value), body, requestOptions) : void 0
   };
   return {
     listBuilderForms: (query) => transport.get("/builder/forms", {
@@ -104,7 +105,23 @@ function createBuilderApiClient(rootTransport, options = {}) {
     ),
     deleteBuilderViewEntry: (viewId, id) => transport.delete(
       `/builder/runtime/views/${encodeURIComponent(viewId)}/entries/${encodeURIComponent(id)}`
-    )
+    ),
+    presignRuntimeBuilderFile: (context, fieldKey, input) => {
+      const owner = context.viewId ? `views/${encodeURIComponent(context.viewId)}` : `forms/${encodeURIComponent(context.formId ?? "")}`;
+      return transport.post(
+        `/builder/runtime/${owner}/fields/${encodeURIComponent(fieldKey)}/files/presign`,
+        input
+      );
+    },
+    uploadRuntimeBuilderFile: (context, fieldKey, file) => {
+      if (!transport.upload) throw new Error("Builder transport server file upload \u0434\u044D\u043C\u0436\u0438\u0445\u0433\u04AF\u0439 \u0431\u0430\u0439\u043D\u0430");
+      const owner = context.viewId ? `views/${encodeURIComponent(context.viewId)}` : `forms/${encodeURIComponent(context.formId ?? "")}`;
+      return transport.upload(
+        `/builder/runtime/${owner}/fields/${encodeURIComponent(fieldKey)}/files/upload`,
+        file,
+        { contentType: file.type }
+      );
+    }
   };
 }
 
@@ -136,12 +153,30 @@ function createBuilderKeys() {
 }
 function createBuilderHooks(client) {
   const builderKeys = createBuilderKeys();
+  function isRuntimeEntryListCache(value) {
+    return typeof value === "object" && value !== null && "items" in value && Array.isArray(value.items) && "total" in value;
+  }
+  function replaceCachedRuntimeViewEntry(queryClient, viewId, entry) {
+    queryClient.setQueriesData(
+      { queryKey: [...builderKeys.runtimeView(viewId), "entries"] },
+      (current) => {
+        if (!isRuntimeEntryListCache(current)) return current;
+        return {
+          ...current,
+          items: current.items.map((item) => item.id === entry.id ? entry : item)
+        };
+      }
+    );
+  }
   function invalidateRuntimeViewEntries(queryClient, viewId) {
     return Promise.all([
       queryClient.invalidateQueries({ queryKey: builderKeys.runtimeView(viewId) }),
       queryClient.invalidateQueries({ queryKey: [...builderKeys.runtimeView(viewId), "entries"] })
     ]);
   }
+  function invalidateAllRuntimeViewEntries(queryClient) {
+    return queryClient.invalidateQueries({ queryKey: ["builder", "runtime", "view"] });
+  }
   function useBuilderDbTables() {
     return useQuery({ queryKey: builderKeys.dbTables(), queryFn: client.listBuilderDbTables });
   }
@@ -352,14 +387,20 @@ function createBuilderHooks(client) {
         viewId,
         input
       ),
-      onSuccess: () => invalidateRuntimeViewEntries(queryClient, viewId)
+      onSuccess: (entry) => {
+        replaceCachedRuntimeViewEntry(queryClient, viewId, entry);
+        return invalidateRuntimeViewEntries(queryClient, viewId);
+      }
     });
   }
   function useCreateCompositeBuilderViewEntry(viewId) {
     const queryClient = useQueryClient();
     return useMutation({
       mutationFn: (input) => client.createCompositeBuilderViewEntry(viewId, input),
-      onSuccess: () => invalidateRuntimeViewEntries(queryClient, viewId)
+      onSuccess: (entry) => {
+        replaceCachedRuntimeViewEntry(queryClient, viewId, entry);
+        return invalidateAllRuntimeViewEntries(queryClient);
+      }
     });
   }
   function useUpdateCompositeBuilderViewEntry(viewId) {
@@ -369,7 +410,10 @@ function createBuilderHooks(client) {
         id,
         input
       }) => client.updateCompositeBuilderViewEntry(viewId, id, input),
-      onSuccess: () => invalidateRuntimeViewEntries(queryClient, viewId)
+      onSuccess: (entry) => {
+        replaceCachedRuntimeViewEntry(queryClient, viewId, entry);
+        return invalidateAllRuntimeViewEntries(queryClient);
+      }
     });
   }
   function useDeleteBuilderViewEntry(id) {
@@ -420,11 +464,13 @@ function createBuilderClient({ transport, apiBasePath }) {
   return createBuilderApiClient(transport, { apiBasePath });
 }
 var BuilderContext = createContext(null);
+var defaultComponents = {};
 function BuilderProvider({
   children,
   client: configuredClient,
   transport,
   apiBasePath,
+  components = defaultComponents,
   queryClient,
   onNotify
 }) {
@@ -446,8 +492,8 @@ function BuilderProvider({
   const internalQueryClient = useRef(null);
   if (!internalQueryClient.current) internalQueryClient.current = queryClient ?? new QueryClient();
   const value = useMemo(
-    () => ({ client: internalClient, hooks, notify }),
-    [hooks, internalClient, notify]
+    () => ({ client: internalClient, components, hooks, notify }),
+    [components, hooks, internalClient, notify]
   );
   return /* @__PURE__ */ jsx(QueryClientProvider, { client: internalQueryClient.current, children: /* @__PURE__ */ jsxs(BuilderContext.Provider, { value, children: [
     children,
@@ -468,11 +514,49 @@ function builderErrorMessage(error, fallback) {
 }
 
 // src/ready/BuilderRuntimeComponents.tsx
-import { useMemo as useMemo4, useState as useState5 } from "react";
+import { useMemo as useMemo4, useRef as useRef7, useState as useState6 } from "react";
 import { FormProvider as FormProvider2, useForm as useForm2 } from "react-hook-form";
 
+// src/richText.ts
+var emptyDocument = { type: "doc", content: [{ type: "paragraph" }] };
+function isRichTextDocument(value) {
+  return typeof value === "object" && value !== null && "type" in value && value.type === "doc";
+}
+function plainTextDocument(value) {
+  const lines = value.split(/\r?\n/);
+  return {
+    type: "doc",
+    content: lines.map(
+      (line) => line ? { type: "paragraph", content: [{ type: "text", text: line }] } : { type: "paragraph" }
+    )
+  };
+}
+function toRichTextDocument(value) {
+  if (isRichTextDocument(value)) return value;
+  if (typeof value !== "string" || !value.trim()) return emptyDocument;
+  try {
+    const parsed = JSON.parse(value);
+    if (isRichTextDocument(parsed)) return parsed;
+  } catch {
+  }
+  return plainTextDocument(value);
+}
+function collectPlainText(node, output) {
+  if (node.type === "text" && typeof node.text === "string") output.push(node.text);
+  if (node.type === "hardBreak") output.push("\n");
+  for (const child of node.content ?? []) collectPlainText(child, output);
+  if (["paragraph", "heading", "listItem", "blockquote"].includes(node.type)) output.push("\n");
+}
+function richTextToPlainText(value) {
+  const output = [];
+  for (const node of toRichTextDocument(value).content ?? []) collectPlainText(node, output);
+  return output.join("").replace(/\n{3,}/g, "\n\n").trim();
+}
+
 // src/runtime/runtimeUtils.ts
 function emptyFieldValue(field) {
+  if (field.defaultValue !== void 0) return field.defaultValue;
+  if (field.type === "file" && field.multiple) return [];
   return field.type === "checkbox" ? false : "";
 }
 function createBuilderFormDefaultValues(schema) {
@@ -498,19 +582,277 @@ function formatBuilderRuntimeValue(value, locale = "mn-MN") {
 }
 
 // src/ready/ReadyFields.tsx
-import { useRef as useRef2 } from "react";
-import { useFormContext, useWatch } from "react-hook-form";
+import { useRef as useRef4 } from "react";
+import { useFormContext as useFormContext3, useWatch as useWatch3 } from "react-hook-form";
+
+// src/ready/ReadyFileField.tsx
+import { useId, useRef as useRef2, useState as useState2 } from "react";
+import {
+  useFormContext,
+  useWatch
+} from "react-hook-form";
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function acceptedTypes(field) {
+  return field.contentKind === "image" ? "image/jpeg,image/png,image/webp,image/gif" : "application/pdf";
+}
+function urlsFrom(value) {
+  if (typeof value === "string" && value) return [value];
+  return Array.isArray(value) ? value.filter((item) => typeof item === "string") : [];
+}
+function ReadyFileField({ field, formId, viewId, name }) {
+  const { client, notify } = useBuilderRuntime();
+  const form = useFormContext();
+  const inputId = useId();
+  const inputRef = useRef2(null);
+  const [uploading, setUploading] = useState2(false);
+  const value = useWatch({ control: form.control, name });
+  const urls = urlsFrom(value);
+  const error = form.getFieldState(name, form.formState).error;
+  const setUrls = (next) => form.setValue(
+    name,
+    field.multiple ? next : next[0] ?? "",
+    { shouldDirty: true, shouldValidate: true }
+  );
+  async function upload(files) {
+    if (!files?.length || !field.storage || !field.contentKind || !formId && !viewId) return;
+    const selected = Array.from(files);
+    if (!field.multiple) selected.splice(1);
+    setUploading(true);
+    try {
+      const uploaded = [];
+      for (const file of selected) {
+        if (field.maxBytes && file.size > field.maxBytes) throw new Error("\u0424\u0430\u0439\u043B \u0437\u04E9\u0432\u0448\u04E9\u04E9\u0440\u04E9\u0433\u0434\u0441\u04E9\u043D \u0445\u044D\u043C\u0436\u044D\u044D\u043D\u044D\u044D\u0441 \u0442\u043E\u043C \u0431\u0430\u0439\u043D\u0430");
+        const context = viewId ? { viewId } : { formId };
+        if (field.storage === "s3") {
+          const presign = await client.presignRuntimeBuilderFile(context, field.key, { contentType: file.type, contentLength: file.size });
+          const response = await fetch(presign.uploadUrl, { method: "PUT", body: file, headers: { "Content-Type": file.type }, credentials: "omit" });
+          if (!response.ok) throw new Error("S3 upload \u0430\u043C\u0436\u0438\u043B\u0442\u0433\u04AF\u0439 \u0431\u043E\u043B\u043B\u043E\u043E");
+          uploaded.push(presign.url);
+        } else {
+          uploaded.push((await client.uploadRuntimeBuilderFile(context, field.key, file)).url);
+        }
+      }
+      setUrls(field.multiple ? [...urls, ...uploaded] : uploaded);
+    } catch (cause) {
+      notify({ type: "error", message: builderErrorMessage(cause, "\u0424\u0430\u0439\u043B upload \u0430\u043C\u0436\u0438\u043B\u0442\u0433\u04AF\u0439 \u0431\u043E\u043B\u043B\u043E\u043E") });
+    } finally {
+      setUploading(false);
+      if (inputRef.current) inputRef.current.value = "";
+    }
+  }
+  const chooseLabel = field.contentKind === "image" ? field.multiple ? "\u0417\u0443\u0440\u0430\u0433 \u043D\u044D\u043C\u044D\u0445" : "\u0417\u0443\u0440\u0430\u0433 \u0441\u043E\u043D\u0433\u043E\u0445" : "\u0424\u0430\u0439\u043B \u0441\u043E\u043D\u0433\u043E\u0445";
+  return /* @__PURE__ */ jsxs2("div", { className: "builder-field", children: [
+    /* @__PURE__ */ jsxs2("label", { className: "builder-field__label", htmlFor: inputId, children: [
+      field.label,
+      field.required ? /* @__PURE__ */ jsx2("span", { "aria-hidden": "true", children: " *" }) : null
+    ] }),
+    /* @__PURE__ */ jsx2(
+      "input",
+      {
+        className: "builder-file-input",
+        ref: inputRef,
+        id: inputId,
+        type: "file",
+        accept: acceptedTypes(field),
+        multiple: field.multiple,
+        disabled: field.disabled || uploading || !formId && !viewId,
+        onChange: (event) => void upload(event.target.files)
+      }
+    ),
+    /* @__PURE__ */ jsx2(
+      "button",
+      {
+        className: "builder-button builder-button--secondary builder-file-choose",
+        disabled: field.disabled || uploading || !formId && !viewId,
+        onClick: () => inputRef.current?.click(),
+        type: "button",
+        children: uploading ? "Upload \u0445\u0438\u0439\u0436 \u0431\u0430\u0439\u043D\u0430\u2026" : chooseLabel
+      }
+    ),
+    urls.length > 0 ? /* @__PURE__ */ jsx2("div", { className: "builder-file-list", "data-kind": field.contentKind, children: urls.map((url, index) => /* @__PURE__ */ jsxs2("div", { className: "builder-file-item", children: [
+      field.contentKind === "image" ? /* @__PURE__ */ jsx2(
+        "a",
+        {
+          "aria-label": `${field.label} ${index + 1}-\u0433 \u043D\u044D\u044D\u0445`,
+          className: "builder-file-preview",
+          href: url,
+          rel: "noreferrer",
+          target: "_blank",
+          children: /* @__PURE__ */ jsx2("img", { alt: "", src: url })
+        }
+      ) : /* @__PURE__ */ jsxs2("a", { className: "builder-file-document", href: url, rel: "noreferrer", target: "_blank", children: [
+        "\u0424\u0430\u0439\u043B ",
+        index + 1
+      ] }),
+      /* @__PURE__ */ jsx2(
+        "button",
+        {
+          "aria-label": `${field.label} ${index + 1}-\u0433 \u0445\u0430\u0441\u0430\u0445`,
+          className: "builder-file-remove",
+          disabled: field.disabled || uploading,
+          onClick: () => setUrls(urls.filter((item) => item !== url)),
+          type: "button",
+          children: "\xD7"
+        }
+      )
+    ] }, url)) }) : null,
+    uploading ? /* @__PURE__ */ jsx2("small", { children: "Upload \u0445\u0438\u0439\u0436 \u0431\u0430\u0439\u043D\u0430\u2026" }) : null,
+    typeof error?.message === "string" ? /* @__PURE__ */ jsx2("small", { className: "builder-field__error", children: error.message }) : null
+  ] });
+}
+
+// src/ready/ReadyRichTextField.tsx
+import StarterKit from "@tiptap/starter-kit";
+import { EditorContent, useEditor } from "@tiptap/react";
+import { useEffect, useRef as useRef3 } from "react";
+import { useFormContext as useFormContext2, useWatch as useWatch2 } from "react-hook-form";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function ToolbarButton({ active = false, children, disabled = false, onClick, title }) {
+  return /* @__PURE__ */ jsx3(
+    "button",
+    {
+      "aria-pressed": active,
+      className: "builder-richtext__button",
+      disabled,
+      onMouseDown: (event) => event.preventDefault(),
+      onClick,
+      title,
+      type: "button",
+      children
+    }
+  );
+}
+function ReadyRichTextField({ field, name }) {
+  const form = useFormContext2();
+  const value = useWatch2({ control: form.control, name });
+  const lastValue = useRef3(value);
+  const editor = useEditor({
+    content: toRichTextDocument(value),
+    extensions: [StarterKit.configure({ heading: { levels: [2, 3] } })],
+    immediatelyRender: false,
+    editable: !field.disabled,
+    editorProps: {
+      attributes: {
+        class: "builder-richtext__content",
+        "data-placeholder": field.placeholder ?? "\u0422\u0430\u0439\u043B\u0431\u0430\u0440 \u0431\u0438\u0447\u0438\u0445"
+      }
+    },
+    onUpdate: ({ editor: instance }) => {
+      const next = JSON.stringify(instance.getJSON());
+      lastValue.current = next;
+      form.setValue(name, next, {
+        shouldDirty: true,
+        shouldValidate: true
+      });
+    }
+  });
+  form.register(name, { required: field.required ? `${field.label} \u0448\u0430\u0430\u0440\u0434\u043B\u0430\u0433\u0430\u0442\u0430\u0439` : false });
+  useEffect(() => {
+    if (!editor || value === lastValue.current) return;
+    editor.commands.setContent(toRichTextDocument(value), { emitUpdate: false });
+    lastValue.current = value;
+  }, [editor, value]);
+  const error = form.getFieldState(name, form.formState).error;
+  return /* @__PURE__ */ jsxs3("div", { className: "builder-field", children: [
+    /* @__PURE__ */ jsxs3("span", { className: "builder-field__label", children: [
+      field.label,
+      field.required ? /* @__PURE__ */ jsx3("span", { "aria-hidden": "true", children: " *" }) : null
+    ] }),
+    /* @__PURE__ */ jsxs3("div", { className: "builder-richtext", children: [
+      /* @__PURE__ */ jsxs3("div", { "aria-label": `${field.label} formatting`, className: "builder-richtext__toolbar", role: "toolbar", children: [
+        /* @__PURE__ */ jsx3(
+          ToolbarButton,
+          {
+            active: editor?.isActive("heading", { level: 2 }),
+            disabled: !editor || field.disabled,
+            onClick: () => editor?.chain().focus().toggleHeading({ level: 2 }).run(),
+            title: "\u0413\u0430\u0440\u0447\u0438\u0433",
+            children: "H2"
+          }
+        ),
+        /* @__PURE__ */ jsx3(
+          ToolbarButton,
+          {
+            active: editor?.isActive("bold"),
+            disabled: !editor || field.disabled,
+            onClick: () => editor?.chain().focus().toggleBold().run(),
+            title: "\u0422\u043E\u0434",
+            children: "B"
+          }
+        ),
+        /* @__PURE__ */ jsx3(
+          ToolbarButton,
+          {
+            active: editor?.isActive("italic"),
+            disabled: !editor || field.disabled,
+            onClick: () => editor?.chain().focus().toggleItalic().run(),
+            title: "\u041D\u0430\u043B\u0443\u0443",
+            children: "I"
+          }
+        ),
+        /* @__PURE__ */ jsx3(
+          ToolbarButton,
+          {
+            active: editor?.isActive("bulletList"),
+            disabled: !editor || field.disabled,
+            onClick: () => editor?.chain().focus().toggleBulletList().run(),
+            title: "Bullet \u0436\u0430\u0433\u0441\u0430\u0430\u043B\u0442",
+            children: "\u2022"
+          }
+        ),
+        /* @__PURE__ */ jsx3(
+          ToolbarButton,
+          {
+            active: editor?.isActive("orderedList"),
+            disabled: !editor || field.disabled,
+            onClick: () => editor?.chain().focus().toggleOrderedList().run(),
+            title: "\u0414\u0443\u0433\u0430\u0430\u0440\u0442\u0430\u0439 \u0436\u0430\u0433\u0441\u0430\u0430\u043B\u0442",
+            children: "1."
+          }
+        ),
+        /* @__PURE__ */ jsx3(
+          ToolbarButton,
+          {
+            disabled: !editor || field.disabled || !editor.can().undo(),
+            onClick: () => editor?.chain().focus().undo().run(),
+            title: "\u0411\u0443\u0446\u0430\u0430\u0445",
+            children: "\u21B6"
+          }
+        ),
+        /* @__PURE__ */ jsx3(
+          ToolbarButton,
+          {
+            disabled: !editor || field.disabled || !editor.can().redo(),
+            onClick: () => editor?.chain().focus().redo().run(),
+            title: "\u0414\u0430\u0445\u0438\u043D \u0445\u0438\u0439\u0445",
+            children: "\u21B7"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx3(EditorContent, { editor })
+    ] }),
+    field.description ? /* @__PURE__ */ jsx3("small", { className: "builder-field__description", children: field.description }) : null,
+    typeof error?.message === "string" ? /* @__PURE__ */ jsx3("small", { className: "builder-field__error", children: error.message }) : null
+  ] });
+}
+
+// src/ready/ReadyFields.tsx
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 function inputType(field) {
   if (field.type === "date") return "date";
   if (field.type === "number" || field.type === "money") return "number";
   return "text";
 }
-function ReadyField({ field, formId, viewId }) {
+function ReadyField({
+  field,
+  formId,
+  viewId,
+  parentValues
+}) {
   const { hooks, notify } = useBuilderRuntime();
-  const form = useFormContext();
-  const values = useWatch({ control: form.control, name: "values" }) ?? {};
-  const timer = useRef2(null);
+  const form = useFormContext3();
+  const values = useWatch3({ control: form.control, name: "values" }) ?? {};
+  const timer = useRef4(null);
   const source = field.optionsSource;
   const dependencyValue = source?.filterBy ? values[source.filterBy.valueFromField] : void 0;
   const depends = source?.filterBy && dependencyValue != null ? { [source.filterBy.valueFromField]: String(dependencyValue) } : void 0;
@@ -523,6 +865,12 @@ function ReadyField({ field, formId, viewId }) {
   const trigger = hooks.useRunRuntimeBuilderFieldTrigger();
   const name = `values.${field.key}`;
   if (field.hidden) return null;
+  if (field.type === "file") {
+    return /* @__PURE__ */ jsx4(ReadyFileField, { field, formId, viewId, name });
+  }
+  if (field.type === "richtext") {
+    return /* @__PURE__ */ jsx4(ReadyRichTextField, { field, name });
+  }
   const runTrigger = (event, value) => {
     const definition = field.triggers.find((item) => item.enabled && item.event === event);
     if (!definition) return;
@@ -533,7 +881,7 @@ function ReadyField({ field, formId, viewId }) {
           viewId,
           fieldKey: field.key,
           event,
-          input: { value, values: form.getValues("values") }
+          input: { value, values: form.getValues("values"), parentValues }
         });
         for (const [key, patchedValue] of Object.entries(response.valuesPatch)) {
           form.setValue(`values.${key}`, patchedValue, { shouldDirty: true, shouldValidate: true });
@@ -561,41 +909,47 @@ function ReadyField({ field, formId, viewId }) {
   });
   const error = form.formState.errors.values?.[field.key];
   const options = source ? optionsQuery.data ?? [] : field.options ?? [];
-  return /* @__PURE__ */ jsxs2("label", { className: "builder-field", children: [
-    /* @__PURE__ */ jsxs2("span", { className: "builder-field__label", children: [
+  return /* @__PURE__ */ jsxs4("label", { className: "builder-field", children: [
+    /* @__PURE__ */ jsxs4("span", { className: "builder-field__label", children: [
       field.label,
-      field.required ? /* @__PURE__ */ jsx2("span", { "aria-hidden": "true", children: " *" }) : null
+      field.required ? /* @__PURE__ */ jsx4("span", { "aria-hidden": "true", children: " *" }) : null
     ] }),
-    field.type === "textarea" ? /* @__PURE__ */ jsx2("textarea", { className: "builder-input builder-textarea", placeholder: field.placeholder, disabled: field.disabled, ...registration }) : field.type === "select" ? /* @__PURE__ */ jsxs2("select", { className: "builder-input", disabled: field.disabled || optionsQuery.isPending, ...registration, children: [
-      /* @__PURE__ */ jsx2("option", { value: "", children: field.placeholder ?? "\u0421\u043E\u043D\u0433\u043E\u0445" }),
-      options.map((option) => /* @__PURE__ */ jsx2("option", { value: option.value, children: option.label }, option.value))
-    ] }) : field.type === "checkbox" ? /* @__PURE__ */ jsx2("input", { className: "builder-checkbox", type: "checkbox", disabled: field.disabled, ...registration }) : /* @__PURE__ */ jsx2("input", { className: "builder-input", type: inputType(field), placeholder: field.placeholder, disabled: field.disabled, ...registration }),
-    field.description ? /* @__PURE__ */ jsx2("small", { className: "builder-field__description", children: field.description }) : null,
-    typeof error?.message === "string" ? /* @__PURE__ */ jsx2("small", { className: "builder-field__error", children: error.message }) : null
+    field.type === "textarea" ? /* @__PURE__ */ jsx4("textarea", { className: "builder-input builder-textarea", placeholder: field.placeholder, disabled: field.disabled, ...registration }) : field.type === "select" ? /* @__PURE__ */ jsxs4("select", { className: "builder-input", disabled: field.disabled || optionsQuery.isPending, ...registration, children: [
+      /* @__PURE__ */ jsx4("option", { value: "", children: field.placeholder ?? "\u0421\u043E\u043D\u0433\u043E\u0445" }),
+      options.map((option) => /* @__PURE__ */ jsx4("option", { value: option.value, children: option.label }, option.value))
+    ] }) : field.type === "checkbox" ? /* @__PURE__ */ jsx4("input", { className: "builder-checkbox", type: "checkbox", disabled: field.disabled, ...registration }) : /* @__PURE__ */ jsx4("input", { className: "builder-input", type: inputType(field), placeholder: field.placeholder, disabled: field.disabled, ...registration }),
+    field.description ? /* @__PURE__ */ jsx4("small", { className: "builder-field__description", children: field.description }) : null,
+    typeof error?.message === "string" ? /* @__PURE__ */ jsx4("small", { className: "builder-field__error", children: error.message }) : null
   ] });
 }
-function ReadyFields({ formId, viewId, schema, extraItems = [] }) {
+function ReadyFields({
+  formId,
+  viewId,
+  schema,
+  parentValues,
+  extraItems = []
+}) {
   const fields = new Map(schema.fields.map((field) => [field.key, field]));
   const rendered = /* @__PURE__ */ new Set();
-  return /* @__PURE__ */ jsxs2("div", { className: "builder-form-fields", children: [
-    schema.layout?.groups.map((group) => /* @__PURE__ */ jsxs2("fieldset", { className: "builder-fieldset", children: [
-      group.title ? /* @__PURE__ */ jsx2("legend", { children: group.title }) : null,
-      /* @__PURE__ */ jsx2("div", { className: "builder-form-grid", children: group.fields.map((item) => {
+  return /* @__PURE__ */ jsxs4("div", { className: "builder-form-fields", children: [
+    schema.layout?.groups.map((group) => /* @__PURE__ */ jsxs4("fieldset", { className: "builder-fieldset", children: [
+      group.title ? /* @__PURE__ */ jsx4("legend", { children: group.title }) : null,
+      /* @__PURE__ */ jsx4("div", { className: "builder-form-grid", children: group.fields.map((item) => {
         const field = fields.get(item.key);
         if (!field) return null;
         rendered.add(field.key);
-        return /* @__PURE__ */ jsx2("div", { style: { gridColumn: `span ${item.span}` }, children: /* @__PURE__ */ jsx2(ReadyField, { field, formId, viewId }) }, field.key);
+        return /* @__PURE__ */ jsx4("div", { style: { gridColumn: `span ${item.span}` }, children: /* @__PURE__ */ jsx4(ReadyField, { field, formId, viewId, parentValues }) }, field.key);
       }) })
     ] }, group.id)),
-    /* @__PURE__ */ jsx2("div", { className: "builder-form-grid", children: schema.fields.filter((field) => !rendered.has(field.key)).map((field) => /* @__PURE__ */ jsx2("div", { style: { gridColumn: "span 12" }, children: /* @__PURE__ */ jsx2(ReadyField, { field, formId, viewId }) }, field.key)) }),
-    extraItems.map((item) => /* @__PURE__ */ jsx2("div", { children: item.render() }, item.key))
+    /* @__PURE__ */ jsx4("div", { className: "builder-form-grid", children: schema.fields.filter((field) => !rendered.has(field.key)).map((field) => /* @__PURE__ */ jsx4("div", { style: { gridColumn: "span 12" }, children: /* @__PURE__ */ jsx4(ReadyField, { field, formId, viewId, parentValues }) }, field.key)) }),
+    extraItems.map((item) => /* @__PURE__ */ jsx4("div", { children: item.render() }, item.key))
   ] });
 }
 
 // src/ready/ReadyOverlay.tsx
-import { useEffect, useId, useRef as useRef3, useState as useState2 } from "react";
+import { useEffect as useEffect2, useId as useId2, useRef as useRef5, useState as useState3 } from "react";
 import { createPortal } from "react-dom";
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 function ReadyOverlay({
   open,
   presentation = "dialog",
@@ -604,15 +958,15 @@ function ReadyOverlay({
   onClose,
   children
 }) {
-  const panelRef = useRef3(null);
-  const onCloseRef = useRef3(onClose);
-  const [portalRoot, setPortalRoot] = useState2(null);
+  const panelRef = useRef5(null);
+  const onCloseRef = useRef5(onClose);
+  const [portalRoot, setPortalRoot] = useState3(null);
   onCloseRef.current = onClose;
-  const titleId = useId();
-  useEffect(() => {
+  const titleId = useId2();
+  useEffect2(() => {
     setPortalRoot(document.body);
   }, []);
-  useEffect(() => {
+  useEffect2(() => {
     if (!open || !portalRoot) return;
     const previous = document.activeElement;
     panelRef.current?.focus();
@@ -646,7 +1000,7 @@ function ReadyOverlay({
   }, [open, portalRoot]);
   if (!open || !portalRoot) return null;
   return createPortal(
-    /* @__PURE__ */ jsx3("div", { className: "builder-overlay", role: "presentation", onMouseDown: (event) => event.target === event.currentTarget && onClose(), children: /* @__PURE__ */ jsxs3(
+    /* @__PURE__ */ jsx5("div", { className: "builder-overlay", role: "presentation", onMouseDown: (event) => event.target === event.currentTarget && onClose(), children: /* @__PURE__ */ jsxs5(
       "div",
       {
         ref: panelRef,
@@ -656,14 +1010,14 @@ function ReadyOverlay({
         "aria-labelledby": titleId,
         tabIndex: -1,
         children: [
-          /* @__PURE__ */ jsxs3("header", { className: "builder-overlay__header", children: [
-            /* @__PURE__ */ jsxs3("div", { children: [
-              /* @__PURE__ */ jsx3("h2", { id: titleId, className: "builder-title", children: title }),
-              description ? /* @__PURE__ */ jsx3("p", { className: "builder-description", children: description }) : null
+          /* @__PURE__ */ jsxs5("header", { className: "builder-overlay__header", children: [
+            /* @__PURE__ */ jsxs5("div", { children: [
+              /* @__PURE__ */ jsx5("h2", { id: titleId, className: "builder-title", children: title }),
+              description ? /* @__PURE__ */ jsx5("p", { className: "builder-description", children: description }) : null
             ] }),
-            /* @__PURE__ */ jsx3("button", { type: "button", className: "builder-icon-button", "aria-label": "\u0425\u0430\u0430\u0445", onClick: onClose, children: "\xD7" })
+            /* @__PURE__ */ jsx5("button", { type: "button", className: "builder-icon-button", "aria-label": "\u0425\u0430\u0430\u0445", onClick: onClose, children: "\xD7" })
           ] }),
-          /* @__PURE__ */ jsx3("div", { className: "builder-overlay__body", children })
+          /* @__PURE__ */ jsx5("div", { className: "builder-overlay__body", children })
         ]
       }
     ) }),
@@ -679,29 +1033,29 @@ function ReadyConfirmDialog({
   onClose,
   onConfirm
 }) {
-  return /* @__PURE__ */ jsx3(ReadyOverlay, { open, title, description, onClose, children: /* @__PURE__ */ jsxs3("div", { className: "builder-actions", children: [
-    /* @__PURE__ */ jsx3("button", { type: "button", className: "builder-button builder-button--ghost", onClick: onClose, children: "\u0411\u043E\u043B\u0438\u0445" }),
-    /* @__PURE__ */ jsx3("button", { type: "button", className: "builder-button builder-button--danger", disabled: isPending, onClick: onConfirm, children: isPending ? "\u0422\u04AF\u0440 \u0445\u04AF\u043B\u044D\u044D\u043D\u044D \u04AF\u04AF\u2026" : confirmLabel })
+  return /* @__PURE__ */ jsx5(ReadyOverlay, { open, title, description, onClose, children: /* @__PURE__ */ jsxs5("div", { className: "builder-actions", children: [
+    /* @__PURE__ */ jsx5("button", { type: "button", className: "builder-button builder-button--ghost", onClick: onClose, children: "\u0411\u043E\u043B\u0438\u0445" }),
+    /* @__PURE__ */ jsx5("button", { type: "button", className: "builder-button builder-button--danger", disabled: isPending, onClick: onConfirm, children: isPending ? "\u0422\u04AF\u0440 \u0445\u04AF\u043B\u044D\u044D\u043D\u044D \u04AF\u04AF\u2026" : confirmLabel })
   ] }) });
 }
 function ReadyErrorState({ title, description }) {
-  return /* @__PURE__ */ jsxs3("div", { className: "builder-state builder-state--error", role: "alert", children: [
-    /* @__PURE__ */ jsx3("strong", { children: title }),
-    /* @__PURE__ */ jsx3("span", { children: description })
+  return /* @__PURE__ */ jsxs5("div", { className: "builder-state builder-state--error", role: "alert", children: [
+    /* @__PURE__ */ jsx5("strong", { children: title }),
+    /* @__PURE__ */ jsx5("span", { children: description })
   ] });
 }
 
 // src/ready/ReadySubform.tsx
-import { useEffect as useEffect2, useMemo as useMemo3, useRef as useRef4, useState as useState4 } from "react";
-import { FormProvider, useForm } from "react-hook-form";
+import { useEffect as useEffect3, useMemo as useMemo3, useRef as useRef6, useState as useState5 } from "react";
+import { FormProvider, useForm, useFormContext as useFormContext4, useWatch as useWatch4 } from "react-hook-form";
 
 // src/ready/ReadyTable.tsx
-import { useMemo as useMemo2, useState as useState3 } from "react";
-import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+import { useMemo as useMemo2, useState as useState4 } from "react";
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 function useReadyTableState({ pageSize = 20 } = {}) {
-  const [page, setPage] = useState3(1);
-  const [search, setSearchValue] = useState3("");
-  const [sort, setSort] = useState3();
+  const [page, setPage] = useState4(1);
+  const [search, setSearchValue] = useState4("");
+  const [sort, setSort] = useState4();
   return {
     query: { page, pageSize, search: search || void 0, sort },
     page,
@@ -720,7 +1074,7 @@ function useReadyTableState({ pageSize = 20 } = {}) {
   };
 }
 function useReadyTable(args) {
-  const [selectedIds, setSelectedIds] = useState3([]);
+  const [selectedIds, setSelectedIds] = useState4([]);
   return useMemo2(
     () => ({
       ...args,
@@ -754,14 +1108,14 @@ function ReadyDataGrid({
   selectable = false
 }) {
   const totalPages = Math.max(1, Math.ceil(controller.rowCount / controller.state.pageSize));
-  return /* @__PURE__ */ jsxs4("section", { className: "builder-card builder-grid", "aria-busy": isLoading || void 0, children: [
-    /* @__PURE__ */ jsxs4("header", { className: "builder-grid__header", children: [
-      /* @__PURE__ */ jsxs4("div", { children: [
-        title ? /* @__PURE__ */ jsx4("h2", { className: "builder-title", children: title }) : null,
-        description ? /* @__PURE__ */ jsx4("p", { className: "builder-description", children: description }) : null
+  return /* @__PURE__ */ jsxs6("section", { className: "builder-card builder-grid", "aria-busy": isLoading || void 0, children: [
+    /* @__PURE__ */ jsxs6("header", { className: "builder-grid__header", children: [
+      /* @__PURE__ */ jsxs6("div", { children: [
+        title ? /* @__PURE__ */ jsx6("h2", { className: "builder-title", children: title }) : null,
+        description ? /* @__PURE__ */ jsx6("p", { className: "builder-description", children: description }) : null
       ] }),
-      /* @__PURE__ */ jsxs4("div", { className: "builder-grid__toolbar", children: [
-        /* @__PURE__ */ jsx4(
+      /* @__PURE__ */ jsxs6("div", { className: "builder-grid__toolbar", children: [
+        /* @__PURE__ */ jsx6(
           "input",
           {
             className: "builder-input builder-grid__search",
@@ -775,19 +1129,19 @@ function ReadyDataGrid({
         toolbarExtra
       ] })
     ] }),
-    /* @__PURE__ */ jsxs4("div", { className: "builder-table-wrap", children: [
-      /* @__PURE__ */ jsxs4("table", { className: "builder-table", children: [
-        /* @__PURE__ */ jsx4("thead", { children: /* @__PURE__ */ jsxs4("tr", { children: [
-          selectable ? /* @__PURE__ */ jsx4("th", { "aria-label": "\u0421\u043E\u043D\u0433\u043E\u043B\u0442" }) : null,
-          controller.columns.map((column) => /* @__PURE__ */ jsx4("th", { className: `builder-align-${column.align}`, children: column.sortable ? /* @__PURE__ */ jsx4("button", { type: "button", className: "builder-sort", onClick: () => controller.state.toggleSort(column.key), children: column.label }) : column.label }, column.key))
+    /* @__PURE__ */ jsxs6("div", { className: "builder-table-wrap", children: [
+      /* @__PURE__ */ jsxs6("table", { className: "builder-table", children: [
+        /* @__PURE__ */ jsx6("thead", { children: /* @__PURE__ */ jsxs6("tr", { children: [
+          selectable ? /* @__PURE__ */ jsx6("th", { "aria-label": "\u0421\u043E\u043D\u0433\u043E\u043B\u0442" }) : null,
+          controller.columns.map((column) => /* @__PURE__ */ jsx6("th", { className: `builder-align-${column.align}`, children: column.sortable ? /* @__PURE__ */ jsx6("button", { type: "button", className: "builder-sort", onClick: () => controller.state.toggleSort(column.key), children: column.label }) : column.label }, column.key))
         ] }) }),
-        /* @__PURE__ */ jsx4("tbody", { children: controller.data.map((entry) => /* @__PURE__ */ jsxs4(
+        /* @__PURE__ */ jsx6("tbody", { children: controller.data.map((entry) => /* @__PURE__ */ jsxs6(
           "tr",
           {
             className: onRowClick ? "builder-row-clickable" : void 0,
             onClick: (event) => onRowClick?.(entry, event),
             children: [
-              selectable ? /* @__PURE__ */ jsx4("td", { children: /* @__PURE__ */ jsx4(
+              selectable ? /* @__PURE__ */ jsx6("td", { children: /* @__PURE__ */ jsx6(
                 "input",
                 {
                   type: "checkbox",
@@ -797,41 +1151,41 @@ function ReadyDataGrid({
                   onChange: () => controller.toggleSelected(entry.id)
                 }
               ) }) : null,
-              controller.columns.map((column) => /* @__PURE__ */ jsx4("td", { className: `builder-align-${column.align}`, children: cellValue(entry, column) }, column.key))
+              controller.columns.map((column) => /* @__PURE__ */ jsx6("td", { className: `builder-align-${column.align}`, children: cellValue(entry, column) }, column.key))
             ]
           },
           entry.id
         )) })
       ] }),
-      isLoading ? /* @__PURE__ */ jsx4("div", { className: "builder-state", children: "\u0423\u043D\u0448\u0438\u0436 \u0431\u0430\u0439\u043D\u0430\u2026" }) : null,
-      !isLoading && controller.data.length === 0 ? /* @__PURE__ */ jsxs4("div", { className: "builder-state", children: [
-        /* @__PURE__ */ jsx4("strong", { children: emptyTitle }),
-        emptyDescription ? /* @__PURE__ */ jsx4("span", { children: emptyDescription }) : null
+      isLoading ? /* @__PURE__ */ jsx6("div", { className: "builder-state", children: "\u0423\u043D\u0448\u0438\u0436 \u0431\u0430\u0439\u043D\u0430\u2026" }) : null,
+      !isLoading && controller.data.length === 0 ? /* @__PURE__ */ jsxs6("div", { className: "builder-state", children: [
+        /* @__PURE__ */ jsx6("strong", { children: emptyTitle }),
+        emptyDescription ? /* @__PURE__ */ jsx6("span", { children: emptyDescription }) : null
       ] }) : null
     ] }),
-    /* @__PURE__ */ jsxs4("footer", { className: "builder-pagination", children: [
-      /* @__PURE__ */ jsxs4("span", { children: [
+    /* @__PURE__ */ jsxs6("footer", { className: "builder-pagination", children: [
+      /* @__PURE__ */ jsxs6("span", { children: [
         controller.rowCount,
         " \u043C\u04E9\u0440"
       ] }),
-      /* @__PURE__ */ jsxs4("div", { children: [
-        /* @__PURE__ */ jsx4("button", { type: "button", className: "builder-button builder-button--ghost", disabled: controller.state.page <= 1, onClick: () => controller.state.setPage(controller.state.page - 1), children: "\u04E8\u043C\u043D\u04E9\u0445" }),
-        /* @__PURE__ */ jsxs4("span", { children: [
+      /* @__PURE__ */ jsxs6("div", { children: [
+        /* @__PURE__ */ jsx6("button", { type: "button", className: "builder-button builder-button--ghost", disabled: controller.state.page <= 1, onClick: () => controller.state.setPage(controller.state.page - 1), children: "\u04E8\u043C\u043D\u04E9\u0445" }),
+        /* @__PURE__ */ jsxs6("span", { children: [
           controller.state.page,
           " / ",
           totalPages
         ] }),
-        /* @__PURE__ */ jsx4("button", { type: "button", className: "builder-button builder-button--ghost", disabled: controller.state.page >= totalPages, onClick: () => controller.state.setPage(controller.state.page + 1), children: "\u0414\u0430\u0440\u0430\u0430\u0445" })
+        /* @__PURE__ */ jsx6("button", { type: "button", className: "builder-button builder-button--ghost", disabled: controller.state.page >= totalPages, onClick: () => controller.state.setPage(controller.state.page + 1), children: "\u0414\u0430\u0440\u0430\u0430\u0445" })
       ] })
     ] })
   ] });
 }
 function readyColumns(columns) {
-  return columns.map((column) => ({ ...column }));
+  return columns.filter((column) => !column.hidden).map((column) => ({ ...column }));
 }
 
 // src/ready/ReadySubform.tsx
-import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
 function linkedValue(entry, field) {
   if (!entry) return void 0;
   const value = field === "id" ? entry.id : entry.values[field];
@@ -845,7 +1199,7 @@ function makeDraftEntry(viewId, values, editing) {
   return {
     id: editing?.id ?? (globalThis.crypto?.randomUUID?.() ?? `draft-${Date.now()}`),
     viewId,
-    values: editing ? values.values : { ...values.values, _draftNew: true },
+    values: editing ? { ...values.values, _draftDirty: true } : { ...values.values, _draftNew: true },
     version: editing?.version ?? 0,
     createdAt: editing?.createdAt ?? now,
     updatedAt: now
@@ -853,9 +1207,12 @@ function makeDraftEntry(viewId, values, editing) {
 }
 function ReadySubform({ subform, parentEntry, rows, onRowsChange }) {
   const { hooks, notify } = useBuilderRuntime();
-  const [open, setOpen] = useState4(false);
-  const [editing, setEditing] = useState4(null);
-  const initialized = useRef4(false);
+  const parentForm = useFormContext4();
+  const watchedParentValues = useWatch4({ control: parentForm.control, name: "values" });
+  const parentValues = watchedParentValues && typeof watchedParentValues === "object" && !Array.isArray(watchedParentValues) ? watchedParentValues : void 0;
+  const [open, setOpen] = useState5(false);
+  const [editing, setEditing] = useState5(null);
+  const initialized = useRef6(false);
   const parentValue = linkedValue(parentEntry, subform.parentField);
   const viewQuery = hooks.useRuntimeBuilderView(subform.viewId, Boolean(subform.viewId));
   const tableState = useReadyTableState({ pageSize: 100 });
@@ -866,7 +1223,7 @@ function ReadySubform({ subform, parentEntry, rows, onRowsChange }) {
   const entriesQuery = hooks.useBuilderViewEntries(subform.viewId, filterQuery, Boolean(parentValue));
   const view = viewQuery.data;
   const source = view?.list?.source?.type === "dbTable" ? view.list.source.tableName : void 0;
-  useEffect2(() => {
+  useEffect3(() => {
     if (initialized.current || !view || !entriesQuery.data || !parentValue) return;
     initialized.current = true;
     onRowsChange({ key: subform.key, dataKey: dataKey(view.id, source), rows: entriesQuery.data.items });
@@ -884,8 +1241,9 @@ function ReadySubform({ subform, parentEntry, rows, onRowsChange }) {
       key: "_actions",
       label: "\u04AE\u0439\u043B\u0434\u044D\u043B",
       sortable: false,
+      hidden: false,
       align: "right",
-      render: (row) => /* @__PURE__ */ jsx5("button", { type: "button", className: "builder-link builder-link--danger", onClick: (event) => {
+      render: (row) => /* @__PURE__ */ jsx7("button", { type: "button", className: "builder-link builder-link--danger", onClick: (event) => {
         event.stopPropagation();
         removeRow(row);
       }, children: "\u0423\u0441\u0442\u0433\u0430\u0445" })
@@ -919,12 +1277,12 @@ function ReadySubform({ subform, parentEntry, rows, onRowsChange }) {
     close();
   });
   if (viewQuery.isError) {
-    return /* @__PURE__ */ jsx5("div", { className: "builder-state builder-state--error", children: builderErrorMessage(viewQuery.error, `${subform.label} \u043D\u044D\u044D\u0433\u0434\u0441\u044D\u043D\u0433\u04AF\u0439`) });
+    return /* @__PURE__ */ jsx7("div", { className: "builder-state builder-state--error", children: builderErrorMessage(viewQuery.error, `${subform.label} \u043D\u044D\u044D\u0433\u0434\u0441\u044D\u043D\u0433\u04AF\u0439`) });
   }
-  return /* @__PURE__ */ jsxs5("section", { className: "builder-subform", children: [
-    /* @__PURE__ */ jsxs5("div", { className: "builder-subform__header", children: [
-      /* @__PURE__ */ jsx5("strong", { children: subform.label }),
-      /* @__PURE__ */ jsxs5("button", { type: "button", className: "builder-button builder-button--secondary", disabled: !view?.form, onClick: () => {
+  return /* @__PURE__ */ jsxs7("section", { className: "builder-subform", children: [
+    /* @__PURE__ */ jsxs7("div", { className: "builder-subform__header", children: [
+      /* @__PURE__ */ jsx7("strong", { children: subform.label }),
+      /* @__PURE__ */ jsxs7("button", { type: "button", className: "builder-button builder-button--secondary", disabled: !view?.form, onClick: () => {
         setEditing(null);
         setOpen(true);
       }, children: [
@@ -932,7 +1290,7 @@ function ReadySubform({ subform, parentEntry, rows, onRowsChange }) {
         subform.buttonLabel ?? "\u041D\u044D\u043C\u044D\u0445"
       ] })
     ] }),
-    visibleRows.length > 0 || Boolean(parentValue) && entriesQuery.isPending ? /* @__PURE__ */ jsx5(
+    visibleRows.length > 0 || Boolean(parentValue) && entriesQuery.isPending ? /* @__PURE__ */ jsx7(
       ReadyDataGrid,
       {
         controller: table,
@@ -944,26 +1302,34 @@ function ReadySubform({ subform, parentEntry, rows, onRowsChange }) {
         emptyTitle: "\u041C\u04E9\u0440 \u0430\u043B\u0433\u0430"
       }
     ) : null,
-    view?.form ? /* @__PURE__ */ jsx5(ReadyOverlay, { open, presentation: subform.presentation, title: subform.label, description: view.title, onClose: close, children: /* @__PURE__ */ jsx5(FormProvider, { ...form, children: /* @__PURE__ */ jsxs5("form", { className: "builder-form", onSubmit: save, noValidate: true, children: [
-      /* @__PURE__ */ jsx5(ReadyFields, { formId: view.form.id, viewId: view.id, schema: view.form.schema }),
-      /* @__PURE__ */ jsxs5("div", { className: "builder-actions", children: [
-        /* @__PURE__ */ jsx5("button", { type: "button", className: "builder-button builder-button--ghost", onClick: close, children: "\u0411\u043E\u043B\u0438\u0445" }),
-        /* @__PURE__ */ jsx5("button", { type: "submit", className: "builder-button builder-button--primary", children: "\u0425\u0430\u0434\u0433\u0430\u043B\u0430\u0445" })
+    view?.form ? /* @__PURE__ */ jsx7(ReadyOverlay, { open, presentation: subform.presentation, title: subform.label, description: view.title, onClose: close, children: /* @__PURE__ */ jsx7(FormProvider, { ...form, children: /* @__PURE__ */ jsxs7("form", { className: "builder-form", onSubmit: save, noValidate: true, children: [
+      /* @__PURE__ */ jsx7(
+        ReadyFields,
+        {
+          formId: view.form.id,
+          viewId: view.id,
+          schema: view.form.schema,
+          parentValues
+        }
+      ),
+      /* @__PURE__ */ jsxs7("div", { className: "builder-actions", children: [
+        /* @__PURE__ */ jsx7("button", { type: "button", className: "builder-button builder-button--ghost", onClick: close, children: "\u0411\u043E\u043B\u0438\u0445" }),
+        /* @__PURE__ */ jsx7("button", { type: "submit", className: "builder-button builder-button--primary", children: editing ? "\u0428\u0438\u043D\u044D\u0447\u043B\u044D\u0445" : "\u041D\u044D\u043C\u044D\u0445" })
       ] })
     ] }) }) }) : null
   ] });
 }
 
 // src/ready/BuilderRuntimeComponents.tsx
-import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
-function BuilderForm({ formId }) {
+import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+function DefaultBuilderForm({ formId }) {
   const { hooks, notify } = useBuilderRuntime();
   const query = hooks.useRuntimeBuilderForm(formId);
   const save = hooks.useSaveRuntimeBuilderFormEntry(formId);
   const defaults = useMemo4(() => createBuilderFormDefaultValues(query.data?.schema), [query.data]);
   const form = useForm2({ defaultValues: defaults, values: query.data ? defaults : void 0 });
-  if (query.isError) return /* @__PURE__ */ jsx6(ReadyErrorState, { title: "Form \u043D\u044D\u044D\u0433\u0434\u0441\u044D\u043D\u0433\u04AF\u0439", description: builderErrorMessage(query.error, `\xAB${formId}\xBB form \u043E\u043B\u0434\u0441\u043E\u043D\u0433\u04AF\u0439`) });
-  if (!query.data) return /* @__PURE__ */ jsx6("div", { className: "builder-state", children: "Form \u0443\u043D\u0448\u0438\u0436 \u0431\u0430\u0439\u043D\u0430\u2026" });
+  if (query.isError) return /* @__PURE__ */ jsx8(ReadyErrorState, { title: "Form \u043D\u044D\u044D\u0433\u0434\u0441\u044D\u043D\u0433\u04AF\u0439", description: builderErrorMessage(query.error, `\xAB${formId}\xBB form \u043E\u043B\u0434\u0441\u043E\u043D\u0433\u04AF\u0439`) });
+  if (!query.data) return /* @__PURE__ */ jsx8("div", { className: "builder-state", children: "Form \u0443\u043D\u0448\u0438\u0436 \u0431\u0430\u0439\u043D\u0430\u2026" });
   const submit = form.handleSubmit(async (input) => {
     try {
       await save.mutateAsync(input);
@@ -973,16 +1339,16 @@ function BuilderForm({ formId }) {
       notify({ type: "error", message: builderErrorMessage(error, "\u0425\u0430\u0434\u0433\u0430\u043B\u0430\u0445\u0430\u0434 \u0430\u043B\u0434\u0430\u0430 \u0433\u0430\u0440\u043B\u0430\u0430") });
     }
   });
-  return /* @__PURE__ */ jsxs6("section", { className: "builder-card", children: [
-    /* @__PURE__ */ jsx6("h2", { className: "builder-title", children: query.data.title }),
-    query.data.description ? /* @__PURE__ */ jsx6("p", { className: "builder-description", children: query.data.description }) : null,
-    /* @__PURE__ */ jsx6(FormProvider2, { ...form, children: /* @__PURE__ */ jsxs6("form", { className: "builder-form", onSubmit: submit, noValidate: true, children: [
-      /* @__PURE__ */ jsx6(ReadyFields, { formId, schema: query.data.schema }),
-      /* @__PURE__ */ jsx6("div", { className: "builder-actions", children: /* @__PURE__ */ jsx6("button", { className: "builder-button builder-button--primary", type: "submit", disabled: save.isPending, children: save.isPending ? "\u0425\u0430\u0434\u0433\u0430\u043B\u0436 \u0431\u0430\u0439\u043D\u0430\u2026" : "\u0425\u0430\u0434\u0433\u0430\u043B\u0430\u0445" }) })
+  return /* @__PURE__ */ jsxs8("section", { className: "builder-card", children: [
+    /* @__PURE__ */ jsx8("h2", { className: "builder-title", children: query.data.title }),
+    query.data.description ? /* @__PURE__ */ jsx8("p", { className: "builder-description", children: query.data.description }) : null,
+    /* @__PURE__ */ jsx8(FormProvider2, { ...form, children: /* @__PURE__ */ jsxs8("form", { className: "builder-form", onSubmit: submit, noValidate: true, children: [
+      /* @__PURE__ */ jsx8(ReadyFields, { formId, schema: query.data.schema }),
+      /* @__PURE__ */ jsx8("div", { className: "builder-actions", children: /* @__PURE__ */ jsx8("button", { className: "builder-button builder-button--primary", type: "submit", disabled: save.isPending, children: save.isPending ? "\u0425\u0430\u0434\u0433\u0430\u043B\u0436 \u0431\u0430\u0439\u043D\u0430\u2026" : "\u0425\u0430\u0434\u0433\u0430\u043B\u0430\u0445" }) })
     ] }) })
   ] });
 }
-function BuilderGrid({ listId }) {
+function DefaultBuilderGrid({ listId }) {
   const { hooks } = useBuilderRuntime();
   const listQuery = hooks.useRuntimeBuilderList(listId);
   const state = useReadyTableState();
@@ -994,8 +1360,8 @@ function BuilderGrid({ listId }) {
     state,
     getRowId: (row) => row.id
   });
-  if (listQuery.isError) return /* @__PURE__ */ jsx6(ReadyErrorState, { title: "Grid \u043D\u044D\u044D\u0433\u0434\u0441\u044D\u043D\u0433\u04AF\u0439", description: builderErrorMessage(listQuery.error, `\xAB${listId}\xBB list \u043E\u043B\u0434\u0441\u043E\u043D\u0433\u04AF\u0439`) });
-  return /* @__PURE__ */ jsx6(ReadyDataGrid, { title: listQuery.data?.title ?? "Grid", description: listQuery.data?.description, controller: table, isLoading: listQuery.isPending || entriesQuery.isPending });
+  if (listQuery.isError) return /* @__PURE__ */ jsx8(ReadyErrorState, { title: "Grid \u043D\u044D\u044D\u0433\u0434\u0441\u044D\u043D\u0433\u04AF\u0439", description: builderErrorMessage(listQuery.error, `\xAB${listId}\xBB list \u043E\u043B\u0434\u0441\u043E\u043D\u0433\u04AF\u0439`) });
+  return /* @__PURE__ */ jsx8(ReadyDataGrid, { title: listQuery.data?.title ?? "Grid", description: listQuery.data?.description, controller: table, isLoading: listQuery.isPending || entriesQuery.isPending });
 }
 function dbTableName(view) {
   if (view.list?.source?.type === "dbTable") return view.list.source.tableName;
@@ -1006,9 +1372,16 @@ function childPayload(row, includeIdentity) {
   const values = Object.fromEntries(Object.entries(row.values).filter(([key]) => key === "_delete" || !key.startsWith("_")));
   return includeIdentity && row.values._draftNew !== true ? { id: row.id, version: row.version, ...values } : values;
 }
+function hasSubformChange(row) {
+  return row.values._delete === true || row.values._draftNew === true || row.values._draftDirty === true;
+}
+function changedSubformPayloads(rows, includeIdentity) {
+  return rows.filter(hasSubformChange).filter((row) => includeIdentity || row.values._delete !== true).map((row) => childPayload(row, includeIdentity));
+}
 function BuilderEntryEditor({ view, editing, open, onClose }) {
   const { hooks, notify } = useBuilderRuntime();
-  const [subforms, setSubforms] = useState5({});
+  const [subforms, setSubforms] = useState6({});
+  const isSubmittingRef = useRef7(false);
   const save = hooks.useSaveBuilderViewEntry(view.id);
   const createComposite = hooks.useCreateCompositeBuilderViewEntry(view.id);
   const updateComposite = hooks.useUpdateCompositeBuilderViewEntry(view.id);
@@ -1019,11 +1392,13 @@ function BuilderEntryEditor({ view, editing, open, onClose }) {
     onClose();
   };
   const submit = form.handleSubmit(async (input) => {
+    if (isSubmittingRef.current) return;
+    isSubmittingRef.current = true;
     try {
       const mainKey = dbTableName(view);
-      const hasSubformRows = Object.values(subforms).some((item) => item.rows.length > 0);
-      if (hasSubformRows && mainKey) {
-        const children = Object.fromEntries(Object.values(subforms).map((item) => [item.dataKey, item.rows.map((row) => childPayload(row, Boolean(editing)))]));
+      const hasSubformChanges = Object.values(subforms).some((item) => item.rows.some(hasSubformChange));
+      if (hasSubformChanges && mainKey) {
+        const children = Object.fromEntries(Object.values(subforms).map((item) => [item.dataKey, changedSubformPayloads(item.rows, Boolean(editing))]));
         if (editing) {
           await updateComposite.mutateAsync({ id: editing.id, input: { data: { [mainKey]: { id: editing.id, version: input.version, ...input.values }, ...children } } });
         } else {
@@ -1036,24 +1411,26 @@ function BuilderEntryEditor({ view, editing, open, onClose }) {
       close();
     } catch (error) {
       notify({ type: "error", message: builderErrorMessage(error, "\u0425\u0430\u0434\u0433\u0430\u043B\u0430\u0445\u0430\u0434 \u0430\u043B\u0434\u0430\u0430 \u0433\u0430\u0440\u043B\u0430\u0430") });
+    } finally {
+      isSubmittingRef.current = false;
     }
   });
   const saving = save.isPending || createComposite.isPending || updateComposite.isPending;
   const updateRows = ({ key, dataKey: dataKey2, rows }) => setSubforms((current) => ({ ...current, [key]: { dataKey: dataKey2, rows } }));
-  return /* @__PURE__ */ jsx6(ReadyOverlay, { open, presentation: view.form?.schema.presentation, title: editing ? "\u041C\u04E9\u0440 \u0437\u0430\u0441\u0430\u0445" : "\u041C\u04E9\u0440 \u043D\u044D\u043C\u044D\u0445", description: view.title, onClose: close, children: view.form ? /* @__PURE__ */ jsx6(FormProvider2, { ...form, children: /* @__PURE__ */ jsxs6("form", { className: "builder-form", onSubmit: submit, noValidate: true, children: [
-    /* @__PURE__ */ jsx6(ReadyFields, { formId: view.form.id, viewId: view.id, schema: view.form.schema }),
-    view.form.schema.subforms.map((subform) => /* @__PURE__ */ jsx6(ReadySubform, { subform, parentEntry: editing, rows: subforms[subform.key]?.rows ?? [], onRowsChange: updateRows }, subform.key)),
-    /* @__PURE__ */ jsxs6("div", { className: "builder-actions builder-actions--sticky", children: [
-      /* @__PURE__ */ jsx6("button", { type: "button", className: "builder-button builder-button--ghost", onClick: close, children: "\u0411\u043E\u043B\u0438\u0445" }),
-      /* @__PURE__ */ jsx6("button", { type: "submit", className: "builder-button builder-button--primary", disabled: saving, children: saving ? "\u0425\u0430\u0434\u0433\u0430\u043B\u0436 \u0431\u0430\u0439\u043D\u0430\u2026" : "\u0425\u0430\u0434\u0433\u0430\u043B\u0430\u0445" })
+  return /* @__PURE__ */ jsx8(ReadyOverlay, { open, presentation: view.form?.schema.presentation, title: editing ? "\u041C\u04E9\u0440 \u0437\u0430\u0441\u0430\u0445" : "\u041C\u04E9\u0440 \u043D\u044D\u043C\u044D\u0445", description: view.title, onClose: close, children: view.form ? /* @__PURE__ */ jsx8(FormProvider2, { ...form, children: /* @__PURE__ */ jsxs8("form", { className: "builder-form", onSubmit: submit, noValidate: true, children: [
+    /* @__PURE__ */ jsx8(ReadyFields, { formId: view.form.id, viewId: view.id, schema: view.form.schema }),
+    view.form.schema.subforms.map((subform) => /* @__PURE__ */ jsx8(ReadySubform, { subform, parentEntry: editing, rows: subforms[subform.key]?.rows ?? [], onRowsChange: updateRows }, subform.key)),
+    /* @__PURE__ */ jsxs8("div", { className: "builder-actions builder-actions--sticky", children: [
+      /* @__PURE__ */ jsx8("button", { type: "button", className: "builder-button builder-button--ghost", onClick: close, children: "\u0411\u043E\u043B\u0438\u0445" }),
+      /* @__PURE__ */ jsx8("button", { type: "submit", className: "builder-button builder-button--primary", disabled: saving, children: saving ? "\u0425\u0430\u0434\u0433\u0430\u043B\u0436 \u0431\u0430\u0439\u043D\u0430\u2026" : "\u0425\u0430\u0434\u0433\u0430\u043B\u0430\u0445" })
     ] })
-  ] }) }) : /* @__PURE__ */ jsx6(ReadyErrorState, { title: "Form \u0445\u043E\u043B\u0431\u043E\u043E\u0433\u04AF\u0439", description: "\u042D\u043D\u044D view-\u0434 form \u0442\u043E\u0445\u0438\u0440\u0443\u0443\u043B\u0430\u0430\u0433\u04AF\u0439 \u0431\u0430\u0439\u043D\u0430." }) });
+  ] }) }) : /* @__PURE__ */ jsx8(ReadyErrorState, { title: "Form \u0445\u043E\u043B\u0431\u043E\u043E\u0433\u04AF\u0439", description: "\u042D\u043D\u044D view-\u0434 form \u0442\u043E\u0445\u0438\u0440\u0443\u0443\u043B\u0430\u0430\u0433\u04AF\u0439 \u0431\u0430\u0439\u043D\u0430." }) });
 }
-function BuilderView({ viewId }) {
+function DefaultBuilderView({ viewId }) {
   const { hooks, notify } = useBuilderRuntime();
-  const [editing, setEditing] = useState5(null);
-  const [editorOpen, setEditorOpen] = useState5(false);
-  const [pendingDelete, setPendingDelete] = useState5(null);
+  const [editing, setEditing] = useState6(null);
+  const [editorOpen, setEditorOpen] = useState6(false);
+  const [pendingDelete, setPendingDelete] = useState6(null);
   const viewQuery = hooks.useRuntimeBuilderView(viewId);
   const state = useReadyTableState();
   const entriesQuery = hooks.useBuilderViewEntries(viewId, state.query);
@@ -1066,14 +1443,15 @@ function BuilderView({ viewId }) {
       key: "_actions",
       label: "\u04AE\u0439\u043B\u0434\u044D\u043B",
       sortable: false,
+      hidden: false,
       align: "right",
-      render: (entry) => /* @__PURE__ */ jsxs6("div", { className: "builder-row-actions", "data-builder-row-action": true, children: [
-        /* @__PURE__ */ jsx6("button", { type: "button", className: "builder-button builder-button--ghost", onClick: (event) => {
+      render: (entry) => /* @__PURE__ */ jsxs8("div", { className: "builder-row-actions", "data-builder-row-action": true, children: [
+        /* @__PURE__ */ jsx8("button", { type: "button", className: "builder-button builder-button--ghost", onClick: (event) => {
           event.stopPropagation();
           setEditing(entry);
           setEditorOpen(true);
         }, children: "\u0417\u0430\u0441\u0430\u0445" }),
-        /* @__PURE__ */ jsx6("button", { type: "button", className: "builder-button builder-button--danger", onClick: (event) => {
+        /* @__PURE__ */ jsx8("button", { type: "button", className: "builder-button builder-button--danger", onClick: (event) => {
           event.stopPropagation();
           setPendingDelete(entry);
         }, children: "\u0423\u0441\u0442\u0433\u0430\u0445" })
@@ -1082,9 +1460,9 @@ function BuilderView({ viewId }) {
     return result;
   }, [view]);
   const table = useReadyTable({ columns, data: entriesQuery.data?.items ?? [], rowCount: entriesQuery.data?.total ?? 0, state, getRowId: (row) => row.id });
-  if (viewQuery.isError) return /* @__PURE__ */ jsx6(ReadyErrorState, { title: "View \u043D\u044D\u044D\u0433\u0434\u0441\u044D\u043D\u0433\u04AF\u0439", description: builderErrorMessage(viewQuery.error, `\xAB${viewId}\xBB view \u043E\u043B\u0434\u0441\u043E\u043D\u0433\u04AF\u0439`) });
-  return /* @__PURE__ */ jsxs6("div", { className: "builder-runtime", children: [
-    /* @__PURE__ */ jsx6(
+  if (viewQuery.isError) return /* @__PURE__ */ jsx8(ReadyErrorState, { title: "View \u043D\u044D\u044D\u0433\u0434\u0441\u044D\u043D\u0433\u04AF\u0439", description: builderErrorMessage(viewQuery.error, `\xAB${viewId}\xBB view \u043E\u043B\u0434\u0441\u043E\u043D\u0433\u04AF\u0439`) });
+  return /* @__PURE__ */ jsxs8("div", { className: "builder-runtime", children: [
+    /* @__PURE__ */ jsx8(
       ReadyDataGrid,
       {
         title: view?.title ?? "View",
@@ -1095,14 +1473,14 @@ function BuilderView({ viewId }) {
           setEditing(entry);
           setEditorOpen(true);
         },
-        toolbarExtra: /* @__PURE__ */ jsx6("button", { type: "button", className: "builder-button builder-button--primary", disabled: !view?.form, onClick: () => {
+        toolbarExtra: /* @__PURE__ */ jsx8("button", { type: "button", className: "builder-button builder-button--primary", disabled: !view?.form, onClick: () => {
           setEditing(null);
           setEditorOpen(true);
         }, children: "+ \u041D\u044D\u043C\u044D\u0445" })
       }
     ),
-    view ? /* @__PURE__ */ jsx6(BuilderEntryEditor, { view, editing, open: editorOpen, onClose: () => setEditorOpen(false) }) : null,
-    /* @__PURE__ */ jsx6(
+    view ? /* @__PURE__ */ jsx8(BuilderEntryEditor, { view, editing, open: editorOpen, onClose: () => setEditorOpen(false) }) : null,
+    /* @__PURE__ */ jsx8(
       ReadyConfirmDialog,
       {
         open: Boolean(pendingDelete),
@@ -1124,6 +1502,56 @@ function BuilderView({ viewId }) {
     )
   ] });
 }
+function BuilderForm(props) {
+  const { components } = useBuilderRuntime();
+  const Component = components.Form;
+  return Component ? /* @__PURE__ */ jsx8(Component, { ...props }) : /* @__PURE__ */ jsx8(DefaultBuilderForm, { ...props });
+}
+function BuilderGrid(props) {
+  const { components } = useBuilderRuntime();
+  const Component = components.Grid;
+  return Component ? /* @__PURE__ */ jsx8(Component, { ...props }) : /* @__PURE__ */ jsx8(DefaultBuilderGrid, { ...props });
+}
+function BuilderView(props) {
+  const { components } = useBuilderRuntime();
+  const Component = components.View;
+  return Component ? /* @__PURE__ */ jsx8(Component, { ...props }) : /* @__PURE__ */ jsx8(DefaultBuilderView, { ...props });
+}
+
+// src/RichTextContent.tsx
+import { Fragment } from "react";
+import { jsx as jsx9 } from "react/jsx-runtime";
+function renderChildren(node) {
+  return (node.content ?? []).map((child, index) => renderNode(child, index));
+}
+function renderText(node, key) {
+  let value = node.text ?? "";
+  for (const mark of node.marks ?? []) {
+    if (mark.type === "bold") value = /* @__PURE__ */ jsx9("strong", { children: value });
+    if (mark.type === "italic") value = /* @__PURE__ */ jsx9("em", { children: value });
+    if (mark.type === "strike") value = /* @__PURE__ */ jsx9("s", { children: value });
+  }
+  return /* @__PURE__ */ jsx9(Fragment, { children: value }, key);
+}
+function renderNode(node, key) {
+  if (node.type === "text") return renderText(node, key);
+  if (node.type === "hardBreak") return /* @__PURE__ */ jsx9("br", {}, key);
+  if (node.type === "paragraph") return /* @__PURE__ */ jsx9("p", { children: renderChildren(node) }, key);
+  if (node.type === "heading") {
+    const level = node.attrs?.level;
+    if (level === 3) return /* @__PURE__ */ jsx9("h3", { children: renderChildren(node) }, key);
+    return /* @__PURE__ */ jsx9("h2", { children: renderChildren(node) }, key);
+  }
+  if (node.type === "bulletList") return /* @__PURE__ */ jsx9("ul", { children: renderChildren(node) }, key);
+  if (node.type === "orderedList") return /* @__PURE__ */ jsx9("ol", { children: renderChildren(node) }, key);
+  if (node.type === "listItem") return /* @__PURE__ */ jsx9("li", { children: renderChildren(node) }, key);
+  if (node.type === "blockquote") return /* @__PURE__ */ jsx9("blockquote", { children: renderChildren(node) }, key);
+  return /* @__PURE__ */ jsx9(Fragment, { children: renderChildren(node) }, key);
+}
+function RichTextContent({ className, value }) {
+  const document2 = toRichTextDocument(value);
+  return /* @__PURE__ */ jsx9("div", { className, children: (document2.content ?? []).map((node, index) => renderNode(node, index)) });
+}
 
 // src/admin/editorState.ts
 var BUILDER_EDITOR_NONE_VALUE = "__none";
@@ -1170,7 +1598,7 @@ function clampLayoutSpan(span, columns) {
   return Math.max(1, Math.min(columns, Math.trunc(span)));
 }
 function builderFormEditorDefaultSpan(field) {
-  if (field.type === "textarea" || field.type === "checkbox") return 12;
+  if (field.type === "textarea" || field.type === "richtext" || field.type === "checkbox") return 12;
   return 6;
 }
 function builderFormEditorDefaultLayoutGroups(fields, subforms = []) {
@@ -1237,6 +1665,10 @@ function builderFormEditorValuesFromEntity(form, emptyValues) {
     required: field.required,
     hidden: field.hidden ?? false,
     disabled: field.disabled ?? false,
+    storage: field.storage ?? "s3",
+    contentKind: field.contentKind ?? "image",
+    multiple: field.multiple ?? false,
+    maxMegabytes: field.maxBytes ? field.maxBytes / (1024 * 1024) : 10,
     placeholder: field.placeholder ?? "",
     optionsText: builderEditorOptionsToText(field.options),
     optionsMode: field.optionsSource?.type === "dbTable" ? "table" : "static",
@@ -1279,16 +1711,19 @@ function builderFormEditorValuesFromEntity(form, emptyValues) {
 function builderListEditorValuesFromEntity(list, emptyValues) {
   if (!list) return emptyValues;
   const source = list.source;
+  const orderBy = list.schema.orderBy ? Array.isArray(list.schema.orderBy) ? list.schema.orderBy : [list.schema.orderBy] : [];
   return {
     title: list.title,
     description: list.description ?? "",
     sourceType: source?.type ?? "none",
     sourceTable: source?.type === "dbTable" ? source.tableName : BUILDER_EDITOR_NONE_VALUE,
     apiBasePath: source?.type === "apiEndpoint" ? source.basePath : "",
+    orderBy,
     columns: list.schema.columns.map((column) => ({
       key: column.key,
       label: column.label,
       sortable: column.sortable,
+      hidden: column.hidden ?? false,
       align: column.align
     })),
     triggers: valuesFromTriggers(list.triggers),
@@ -1316,6 +1751,10 @@ function builderFormEditorFieldsFromTable(table) {
     required: !column.nullable,
     hidden: false,
     disabled: false,
+    storage: "s3",
+    contentKind: "image",
+    multiple: false,
+    maxMegabytes: 10,
     placeholder: column.label,
     optionsText: "",
     optionsMode: "static",
@@ -1333,6 +1772,7 @@ function builderListEditorColumnsFromTable(table) {
     key: column.name,
     label: column.label,
     sortable: column.sortable,
+    hidden: false,
     align: column.fieldType === "number" || column.fieldType === "money" ? "right" : "left"
   }));
 }
@@ -1351,6 +1791,10 @@ function builderFormEditorInputFromValues(values) {
         required: field.required,
         hidden: field.hidden,
         disabled: field.disabled,
+        storage: field.type === "file" ? field.storage : void 0,
+        contentKind: field.type === "file" ? field.contentKind : void 0,
+        multiple: field.type === "file" ? field.multiple : void 0,
+        maxBytes: field.type === "file" && typeof field.maxMegabytes === "number" && field.maxMegabytes > 0 ? Math.round(field.maxMegabytes * 1024 * 1024) : void 0,
         placeholder: field.placeholder?.trim() || field.label,
         options: field.type === "select" && field.optionsMode === "static" ? builderEditorTextToOptions(field.optionsText) : void 0,
         optionsSource: field.type === "select" && field.optionsMode === "table" && field.optionsTable !== BUILDER_EDITOR_NONE_VALUE && field.optionsValueField !== BUILDER_EDITOR_NONE_VALUE && field.optionsLabelField !== BUILDER_EDITOR_NONE_VALUE ? {
@@ -1404,11 +1848,19 @@ function builderFormEditorInputFromValues(values) {
 }
 function builderListEditorInputFromValues(values) {
   const source = values.sourceType === "dbTable" && values.sourceTable !== BUILDER_EDITOR_NONE_VALUE ? { type: "dbTable", tableName: values.sourceTable } : values.sourceType === "apiEndpoint" && values.apiBasePath ? { type: "apiEndpoint", basePath: values.apiBasePath } : null;
+  const orderBy = Array.from(
+    new Map(
+      values.orderBy.filter((rule) => rule.field && rule.field !== BUILDER_EDITOR_NONE_VALUE).map((rule) => [rule.field, rule])
+    ).values()
+  );
   return {
     title: values.title,
     description: values.description || null,
     source,
-    schema: { columns: values.columns },
+    schema: {
+      columns: values.columns,
+      ...source && orderBy.length > 0 ? { orderBy } : {}
+    },
     triggers: values.triggers.map((trigger) => ({
       event: trigger.event,
       action: "callApi",
@@ -1433,7 +1885,7 @@ function builderViewEditorInputFromValues(values, parseTriggers) {
 }
 
 // src/admin/BuilderDefaultEditorBodies.tsx
-import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
 var styles = {
   page: {
     display: "grid",
@@ -1554,7 +2006,7 @@ var styles = {
   }
 };
 function optionItems(options) {
-  return options.map((option) => /* @__PURE__ */ jsx7("option", { value: option.value, children: option.label }, option.value));
+  return options.map((option) => /* @__PURE__ */ jsx10("option", { value: option.value, children: option.label }, option.value));
 }
 function createBuilderDefaultFormEditorBody(options) {
   return function BuilderDefaultFormEditorBody({
@@ -1572,55 +2024,63 @@ function createBuilderDefaultFormEditorBody(options) {
     isSaving,
     importFieldsFromTable
   }) {
-    return /* @__PURE__ */ jsxs7("div", { style: styles.page, children: [
-      /* @__PURE__ */ jsxs7("div", { style: styles.header, children: [
-        /* @__PURE__ */ jsxs7("div", { children: [
-          /* @__PURE__ */ jsx7("h1", { style: styles.title, children: formId ? "Edit Dynamic Form" : "New Dynamic Form" }),
-          /* @__PURE__ */ jsx7("p", { style: styles.description, children: "Configure fields, source mapping, layout, and triggers." })
+    return /* @__PURE__ */ jsxs9("div", { style: styles.page, children: [
+      /* @__PURE__ */ jsxs9("div", { style: styles.header, children: [
+        /* @__PURE__ */ jsxs9("div", { children: [
+          /* @__PURE__ */ jsx10("h1", { style: styles.title, children: formId ? "Edit Dynamic Form" : "New Dynamic Form" }),
+          /* @__PURE__ */ jsx10("p", { style: styles.description, children: "Configure fields, source mapping, layout, and triggers." })
         ] }),
-        /* @__PURE__ */ jsxs7("div", { style: styles.actions, children: [
-          /* @__PURE__ */ jsx7("a", { href: options.backHref, style: styles.button, children: "Cancel" }),
-          /* @__PURE__ */ jsx7("button", { type: "submit", disabled: isSaving, style: styles.primaryButton, children: isSaving ? "Saving..." : "Save" })
+        /* @__PURE__ */ jsxs9("div", { style: styles.actions, children: [
+          /* @__PURE__ */ jsx10("a", { href: options.backHref, style: styles.button, children: "Cancel" }),
+          /* @__PURE__ */ jsx10("button", { type: "submit", disabled: isSaving, style: styles.primaryButton, children: isSaving ? "Saving..." : "Save" })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs7("section", { style: styles.section, children: [
-        /* @__PURE__ */ jsx7("div", { style: styles.sectionHeader, children: /* @__PURE__ */ jsx7("h2", { style: styles.sectionTitle, children: "Details" }) }),
-        /* @__PURE__ */ jsxs7("div", { style: { ...styles.grid, ...styles.twoColumn }, children: [
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Title" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register("title", { required: true }) })
+      /* @__PURE__ */ jsxs9("section", { style: styles.section, children: [
+        /* @__PURE__ */ jsx10("div", { style: styles.sectionHeader, children: /* @__PURE__ */ jsx10("h2", { style: styles.sectionTitle, children: "Details" }) }),
+        /* @__PURE__ */ jsxs9("div", { style: { ...styles.grid, ...styles.twoColumn }, children: [
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Title" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register("title", { required: true }) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Description" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register("description") })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Description" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register("description") })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Presentation" }),
-            /* @__PURE__ */ jsxs7("select", { style: styles.input, ...form.register("presentation"), children: [
-              /* @__PURE__ */ jsx7("option", { value: "dialog", children: "Dialog" }),
-              /* @__PURE__ */ jsx7("option", { value: "drawer", children: "Drawer" })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Presentation" }),
+            /* @__PURE__ */ jsxs9("select", { style: styles.input, ...form.register("presentation"), children: [
+              /* @__PURE__ */ jsx10("option", { value: "dialog", children: "Dialog" }),
+              /* @__PURE__ */ jsx10("option", { value: "drawer", children: "Drawer" })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Datasource" }),
-            /* @__PURE__ */ jsxs7("select", { style: styles.input, ...form.register("sourceType"), children: [
-              /* @__PURE__ */ jsx7("option", { value: "none", children: "None" }),
-              /* @__PURE__ */ jsx7("option", { value: "dbTable", children: "DB table" }),
-              /* @__PURE__ */ jsx7("option", { value: "apiEndpoint", children: "API endpoint" })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Datasource" }),
+            /* @__PURE__ */ jsxs9("select", { style: styles.input, ...form.register("sourceType"), children: [
+              /* @__PURE__ */ jsx10("option", { value: "none", children: "None" }),
+              /* @__PURE__ */ jsx10("option", { value: "dbTable", children: "DB table" }),
+              /* @__PURE__ */ jsx10("option", { value: "apiEndpoint", children: "API endpoint" })
             ] })
           ] }),
-          sourceType === "dbTable" ? /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Table" }),
-            /* @__PURE__ */ jsxs7("select", { style: styles.input, ...form.register("sourceTable"), children: [
-              /* @__PURE__ */ jsx7("option", { value: BUILDER_EDITOR_NONE_VALUE, children: "Select table" }),
-              tables.map((table) => /* @__PURE__ */ jsx7("option", { value: table.name, children: table.label ?? table.name }, table.name))
-            ] })
+          sourceType === "dbTable" ? /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Table" }),
+            /* @__PURE__ */ jsxs9(
+              "select",
+              {
+                style: styles.input,
+                value: sourceTable,
+                ...form.register("sourceTable"),
+                children: [
+                  /* @__PURE__ */ jsx10("option", { value: BUILDER_EDITOR_NONE_VALUE, children: "Select table" }),
+                  tables.map((table) => /* @__PURE__ */ jsx10("option", { value: table.name, children: table.label ?? table.name }, table.name))
+                ]
+              }
+            )
           ] }) : null,
-          sourceType === "apiEndpoint" ? /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "API base path" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register("apiBasePath") })
+          sourceType === "apiEndpoint" ? /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "API base path" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register("apiBasePath") })
           ] }) : null,
-          sourceType === "dbTable" ? /* @__PURE__ */ jsx7("div", { style: { ...styles.field, justifyContent: "end" }, children: /* @__PURE__ */ jsx7(
+          sourceType === "dbTable" ? /* @__PURE__ */ jsx10("div", { style: { ...styles.field, justifyContent: "end" }, children: /* @__PURE__ */ jsx10(
             "button",
             {
               type: "button",
@@ -1632,13 +2092,13 @@ function createBuilderDefaultFormEditorBody(options) {
           ) }) : null
         ] })
       ] }),
-      /* @__PURE__ */ jsxs7("section", { style: styles.section, children: [
-        /* @__PURE__ */ jsxs7("div", { style: styles.sectionHeader, children: [
-          /* @__PURE__ */ jsxs7("div", { children: [
-            /* @__PURE__ */ jsx7("h2", { style: styles.sectionTitle, children: "Fields" }),
-            /* @__PURE__ */ jsx7("p", { style: styles.description, children: "Runtime form inputs." })
+      /* @__PURE__ */ jsxs9("section", { style: styles.section, children: [
+        /* @__PURE__ */ jsxs9("div", { style: styles.sectionHeader, children: [
+          /* @__PURE__ */ jsxs9("div", { children: [
+            /* @__PURE__ */ jsx10("h2", { style: styles.sectionTitle, children: "Fields" }),
+            /* @__PURE__ */ jsx10("p", { style: styles.description, children: "Runtime form inputs." })
           ] }),
-          /* @__PURE__ */ jsx7(
+          /* @__PURE__ */ jsx10(
             "button",
             {
               type: "button",
@@ -1656,18 +2116,18 @@ function createBuilderDefaultFormEditorBody(options) {
             }
           )
         ] }),
-        fieldArray.fields.map((field, index) => /* @__PURE__ */ jsxs7("div", { style: styles.row, children: [
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Key" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register(`fields.${index}.key`) })
+        fieldArray.fields.map((field, index) => /* @__PURE__ */ jsxs9("div", { style: styles.row, children: [
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Key" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register(`fields.${index}.key`) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Label" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register(`fields.${index}.label`) })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Label" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register(`fields.${index}.label`) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Type" }),
-            /* @__PURE__ */ jsx7(
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Type" }),
+            /* @__PURE__ */ jsx10(
               "select",
               {
                 style: styles.input,
@@ -1676,27 +2136,51 @@ function createBuilderDefaultFormEditorBody(options) {
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.checkboxField, children: [
-            /* @__PURE__ */ jsx7("input", { type: "checkbox", ...form.register(`fields.${index}.required`) }),
+          /* @__PURE__ */ jsxs9("label", { style: styles.checkboxField, children: [
+            /* @__PURE__ */ jsx10("input", { type: "checkbox", ...form.register(`fields.${index}.required`) }),
             "Required"
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.checkboxField, children: [
-            /* @__PURE__ */ jsx7("input", { type: "checkbox", ...form.register(`fields.${index}.hidden`) }),
+          /* @__PURE__ */ jsxs9("label", { style: styles.checkboxField, children: [
+            /* @__PURE__ */ jsx10("input", { type: "checkbox", ...form.register(`fields.${index}.hidden`) }),
             "Hidden"
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.checkboxField, children: [
-            /* @__PURE__ */ jsx7("input", { type: "checkbox", ...form.register(`fields.${index}.disabled`) }),
+          /* @__PURE__ */ jsxs9("label", { style: styles.checkboxField, children: [
+            /* @__PURE__ */ jsx10("input", { type: "checkbox", ...form.register(`fields.${index}.disabled`) }),
             "Disabled"
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Placeholder" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register(`fields.${index}.placeholder`) })
+          fields[index]?.type === "file" ? /* @__PURE__ */ jsxs9(Fragment2, { children: [
+            /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+              /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Storage" }),
+              /* @__PURE__ */ jsxs9("select", { style: styles.input, ...form.register(`fields.${index}.storage`), children: [
+                /* @__PURE__ */ jsx10("option", { value: "s3", children: "S3" }),
+                /* @__PURE__ */ jsx10("option", { value: "server", children: "Server" })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+              /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Content type" }),
+              /* @__PURE__ */ jsxs9("select", { style: styles.input, ...form.register(`fields.${index}.contentKind`), children: [
+                /* @__PURE__ */ jsx10("option", { value: "image", children: "Image" }),
+                /* @__PURE__ */ jsx10("option", { value: "file", children: "File" })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs9("label", { style: styles.checkboxField, children: [
+              /* @__PURE__ */ jsx10("input", { type: "checkbox", ...form.register(`fields.${index}.multiple`) }),
+              "Multiple"
+            ] }),
+            /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+              /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Max size (MB)" }),
+              /* @__PURE__ */ jsx10("input", { type: "number", min: "1", max: "100", style: styles.input, ...form.register(`fields.${index}.maxMegabytes`, { valueAsNumber: true }) })
+            ] })
+          ] }) : null,
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Placeholder" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register(`fields.${index}.placeholder`) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Static options" }),
-            /* @__PURE__ */ jsx7("textarea", { style: styles.textarea, ...form.register(`fields.${index}.optionsText`) })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Static options" }),
+            /* @__PURE__ */ jsx10("textarea", { style: styles.textarea, ...form.register(`fields.${index}.optionsText`) })
           ] }),
-          /* @__PURE__ */ jsx7("div", { style: styles.actions, children: /* @__PURE__ */ jsx7(
+          /* @__PURE__ */ jsx10("div", { style: styles.actions, children: /* @__PURE__ */ jsx10(
             "button",
             {
               type: "button",
@@ -1708,13 +2192,13 @@ function createBuilderDefaultFormEditorBody(options) {
           ) })
         ] }, field.id))
       ] }),
-      /* @__PURE__ */ jsxs7("section", { style: styles.section, children: [
-        /* @__PURE__ */ jsxs7("div", { style: styles.sectionHeader, children: [
-          /* @__PURE__ */ jsxs7("div", { children: [
-            /* @__PURE__ */ jsx7("h2", { style: styles.sectionTitle, children: "Layout" }),
-            /* @__PURE__ */ jsx7("p", { style: styles.description, children: "Default layout can be regenerated from current fields." })
+      /* @__PURE__ */ jsxs9("section", { style: styles.section, children: [
+        /* @__PURE__ */ jsxs9("div", { style: styles.sectionHeader, children: [
+          /* @__PURE__ */ jsxs9("div", { children: [
+            /* @__PURE__ */ jsx10("h2", { style: styles.sectionTitle, children: "Layout" }),
+            /* @__PURE__ */ jsx10("p", { style: styles.description, children: "Default layout can be regenerated from current fields." })
           ] }),
-          /* @__PURE__ */ jsx7(
+          /* @__PURE__ */ jsx10(
             "button",
             {
               type: "button",
@@ -1726,14 +2210,14 @@ function createBuilderDefaultFormEditorBody(options) {
             }
           )
         ] }),
-        form.watch("layoutGroups").map((group, groupIndex) => /* @__PURE__ */ jsxs7("div", { style: styles.row, children: [
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Group title" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register(`layoutGroups.${groupIndex}.title`) })
+        form.watch("layoutGroups").map((group, groupIndex) => /* @__PURE__ */ jsxs9("div", { style: styles.row, children: [
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Group title" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register(`layoutGroups.${groupIndex}.title`) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Columns" }),
-            /* @__PURE__ */ jsxs7(
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Columns" }),
+            /* @__PURE__ */ jsxs9(
               "select",
               {
                 style: styles.input,
@@ -1744,16 +2228,16 @@ function createBuilderDefaultFormEditorBody(options) {
                   { shouldDirty: true }
                 ),
                 children: [
-                  /* @__PURE__ */ jsx7("option", { value: 6, children: "6" }),
-                  /* @__PURE__ */ jsx7("option", { value: 8, children: "8" }),
-                  /* @__PURE__ */ jsx7("option", { value: 12, children: "12" })
+                  /* @__PURE__ */ jsx10("option", { value: 6, children: "6" }),
+                  /* @__PURE__ */ jsx10("option", { value: 8, children: "8" }),
+                  /* @__PURE__ */ jsx10("option", { value: 12, children: "12" })
                 ]
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Fields" }),
-            /* @__PURE__ */ jsx7(
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Fields" }),
+            /* @__PURE__ */ jsx10(
               "input",
               {
                 style: styles.input,
@@ -1764,13 +2248,13 @@ function createBuilderDefaultFormEditorBody(options) {
           ] })
         ] }, group.id))
       ] }),
-      /* @__PURE__ */ jsxs7("section", { style: styles.section, children: [
-        /* @__PURE__ */ jsxs7("div", { style: styles.sectionHeader, children: [
-          /* @__PURE__ */ jsxs7("div", { children: [
-            /* @__PURE__ */ jsx7("h2", { style: styles.sectionTitle, children: "Subforms" }),
-            /* @__PURE__ */ jsx7("p", { style: styles.description, children: "Optional nested runtime view bindings." })
+      /* @__PURE__ */ jsxs9("section", { style: styles.section, children: [
+        /* @__PURE__ */ jsxs9("div", { style: styles.sectionHeader, children: [
+          /* @__PURE__ */ jsxs9("div", { children: [
+            /* @__PURE__ */ jsx10("h2", { style: styles.sectionTitle, children: "Subforms" }),
+            /* @__PURE__ */ jsx10("p", { style: styles.description, children: "Optional nested runtime view bindings." })
           ] }),
-          /* @__PURE__ */ jsx7(
+          /* @__PURE__ */ jsx10(
             "button",
             {
               type: "button",
@@ -1789,56 +2273,56 @@ function createBuilderDefaultFormEditorBody(options) {
             }
           )
         ] }),
-        subformArray.fields.map((subform, index) => /* @__PURE__ */ jsxs7("div", { style: styles.row, children: [
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Key" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register(`subforms.${index}.key`) })
+        subformArray.fields.map((subform, index) => /* @__PURE__ */ jsxs9("div", { style: styles.row, children: [
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Key" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register(`subforms.${index}.key`) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Label" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register(`subforms.${index}.label`) })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Label" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register(`subforms.${index}.label`) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "View ID" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register(`subforms.${index}.viewId`) })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "View ID" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register(`subforms.${index}.viewId`) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Parent field" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register(`subforms.${index}.parentField`) })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Parent field" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register(`subforms.${index}.parentField`) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Child field" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register(`subforms.${index}.childField`) })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Child field" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register(`subforms.${index}.childField`) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Presentation" }),
-            /* @__PURE__ */ jsxs7(
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Presentation" }),
+            /* @__PURE__ */ jsxs9(
               "select",
               {
                 style: styles.input,
                 ...form.register(`subforms.${index}.presentation`),
                 children: [
-                  /* @__PURE__ */ jsx7("option", { value: "dialog", children: "Dialog" }),
-                  /* @__PURE__ */ jsx7("option", { value: "drawer", children: "Drawer" })
+                  /* @__PURE__ */ jsx10("option", { value: "dialog", children: "Dialog" }),
+                  /* @__PURE__ */ jsx10("option", { value: "drawer", children: "Drawer" })
                 ]
               }
             )
           ] }),
-          /* @__PURE__ */ jsx7("button", { type: "button", style: styles.button, onClick: () => subformArray.remove(index), children: "Remove" })
+          /* @__PURE__ */ jsx10("button", { type: "button", style: styles.button, onClick: () => subformArray.remove(index), children: "Remove" })
         ] }, subform.id))
       ] }),
-      /* @__PURE__ */ jsxs7("section", { style: styles.section, children: [
-        /* @__PURE__ */ jsxs7("div", { style: styles.sectionHeader, children: [
-          /* @__PURE__ */ jsxs7("div", { children: [
-            /* @__PURE__ */ jsx7("h2", { style: styles.sectionTitle, children: "Form Triggers" }),
-            /* @__PURE__ */ jsx7("p", { style: styles.description, children: "Optional API callbacks for lifecycle events." })
+      /* @__PURE__ */ jsxs9("section", { style: styles.section, children: [
+        /* @__PURE__ */ jsxs9("div", { style: styles.sectionHeader, children: [
+          /* @__PURE__ */ jsxs9("div", { children: [
+            /* @__PURE__ */ jsx10("h2", { style: styles.sectionTitle, children: "Form Triggers" }),
+            /* @__PURE__ */ jsx10("p", { style: styles.description, children: "Optional API callbacks for lifecycle events." })
           ] }),
-          /* @__PURE__ */ jsx7("button", { type: "button", style: styles.button, onClick: () => triggerArray.append(emptyTrigger), children: "Add trigger" })
+          /* @__PURE__ */ jsx10("button", { type: "button", style: styles.button, onClick: () => triggerArray.append(emptyTrigger), children: "Add trigger" })
         ] }),
-        triggerArray.fields.map((trigger, index) => /* @__PURE__ */ jsxs7("div", { style: styles.row, children: [
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Event" }),
-            /* @__PURE__ */ jsx7(
+        triggerArray.fields.map((trigger, index) => /* @__PURE__ */ jsxs9("div", { style: styles.row, children: [
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Event" }),
+            /* @__PURE__ */ jsx10(
               "select",
               {
                 style: styles.input,
@@ -1849,19 +2333,19 @@ function createBuilderDefaultFormEditorBody(options) {
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Route" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register(`triggers.${index}.route`) })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Route" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register(`triggers.${index}.route`) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.checkboxField, children: [
-            /* @__PURE__ */ jsx7("input", { type: "checkbox", ...form.register(`triggers.${index}.enabled`) }),
+          /* @__PURE__ */ jsxs9("label", { style: styles.checkboxField, children: [
+            /* @__PURE__ */ jsx10("input", { type: "checkbox", ...form.register(`triggers.${index}.enabled`) }),
             "Enabled"
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.checkboxField, children: [
-            /* @__PURE__ */ jsx7("input", { type: "checkbox", ...form.register(`triggers.${index}.blocking`) }),
+          /* @__PURE__ */ jsxs9("label", { style: styles.checkboxField, children: [
+            /* @__PURE__ */ jsx10("input", { type: "checkbox", ...form.register(`triggers.${index}.blocking`) }),
             "Blocking"
           ] }),
-          /* @__PURE__ */ jsx7("button", { type: "button", style: styles.button, onClick: () => triggerArray.remove(index), children: "Remove" })
+          /* @__PURE__ */ jsx10("button", { type: "button", style: styles.button, onClick: () => triggerArray.remove(index), children: "Remove" })
         ] }, trigger.id))
       ] })
     ] });
@@ -1872,6 +2356,7 @@ function createBuilderDefaultListEditorBody(options) {
     listId,
     form,
     columnArray,
+    orderByArray,
     triggerArray,
     sourceType,
     sourceTable,
@@ -1881,48 +2366,58 @@ function createBuilderDefaultListEditorBody(options) {
     isSaving,
     importColumnsFromTable
   }) {
-    return /* @__PURE__ */ jsxs7("div", { style: styles.page, children: [
-      /* @__PURE__ */ jsxs7("div", { style: styles.header, children: [
-        /* @__PURE__ */ jsxs7("div", { children: [
-          /* @__PURE__ */ jsx7("h1", { style: styles.title, children: listId ? "Edit Dynamic List" : "New Dynamic List" }),
-          /* @__PURE__ */ jsx7("p", { style: styles.description, children: "Configure list columns, source mapping, and triggers." })
+    const selectedTable = tables.find((table) => table.name === sourceTable);
+    const orderByColumns = selectedTable?.columns.filter((column) => column.sortable) ?? [];
+    return /* @__PURE__ */ jsxs9("div", { style: styles.page, children: [
+      /* @__PURE__ */ jsxs9("div", { style: styles.header, children: [
+        /* @__PURE__ */ jsxs9("div", { children: [
+          /* @__PURE__ */ jsx10("h1", { style: styles.title, children: listId ? "Edit Dynamic List" : "New Dynamic List" }),
+          /* @__PURE__ */ jsx10("p", { style: styles.description, children: "Configure list columns, source mapping, and triggers." })
         ] }),
-        /* @__PURE__ */ jsxs7("div", { style: styles.actions, children: [
-          /* @__PURE__ */ jsx7("a", { href: options.backHref, style: styles.button, children: "Cancel" }),
-          /* @__PURE__ */ jsx7("button", { type: "submit", disabled: isSaving, style: styles.primaryButton, children: isSaving ? "Saving..." : "Save" })
+        /* @__PURE__ */ jsxs9("div", { style: styles.actions, children: [
+          /* @__PURE__ */ jsx10("a", { href: options.backHref, style: styles.button, children: "Cancel" }),
+          /* @__PURE__ */ jsx10("button", { type: "submit", disabled: isSaving, style: styles.primaryButton, children: isSaving ? "Saving..." : "Save" })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs7("section", { style: styles.section, children: [
-        /* @__PURE__ */ jsx7("div", { style: styles.sectionHeader, children: /* @__PURE__ */ jsx7("h2", { style: styles.sectionTitle, children: "Details" }) }),
-        /* @__PURE__ */ jsxs7("div", { style: { ...styles.grid, ...styles.twoColumn }, children: [
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Title" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register("title", { required: true }) })
+      /* @__PURE__ */ jsxs9("section", { style: styles.section, children: [
+        /* @__PURE__ */ jsx10("div", { style: styles.sectionHeader, children: /* @__PURE__ */ jsx10("h2", { style: styles.sectionTitle, children: "Details" }) }),
+        /* @__PURE__ */ jsxs9("div", { style: { ...styles.grid, ...styles.twoColumn }, children: [
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Title" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register("title", { required: true }) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Description" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register("description") })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Description" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register("description") })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Datasource" }),
-            /* @__PURE__ */ jsxs7("select", { style: styles.input, ...form.register("sourceType"), children: [
-              /* @__PURE__ */ jsx7("option", { value: "none", children: "None" }),
-              /* @__PURE__ */ jsx7("option", { value: "dbTable", children: "DB table" }),
-              /* @__PURE__ */ jsx7("option", { value: "apiEndpoint", children: "API endpoint" })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Datasource" }),
+            /* @__PURE__ */ jsxs9("select", { style: styles.input, ...form.register("sourceType"), children: [
+              /* @__PURE__ */ jsx10("option", { value: "none", children: "None" }),
+              /* @__PURE__ */ jsx10("option", { value: "dbTable", children: "DB table" }),
+              /* @__PURE__ */ jsx10("option", { value: "apiEndpoint", children: "API endpoint" })
             ] })
           ] }),
-          sourceType === "dbTable" ? /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Table" }),
-            /* @__PURE__ */ jsxs7("select", { style: styles.input, ...form.register("sourceTable"), children: [
-              /* @__PURE__ */ jsx7("option", { value: BUILDER_EDITOR_NONE_VALUE, children: "Select table" }),
-              tables.map((table) => /* @__PURE__ */ jsx7("option", { value: table.name, children: table.label ?? table.name }, table.name))
-            ] })
+          sourceType === "dbTable" ? /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Table" }),
+            /* @__PURE__ */ jsxs9(
+              "select",
+              {
+                style: styles.input,
+                value: sourceTable,
+                ...form.register("sourceTable"),
+                children: [
+                  /* @__PURE__ */ jsx10("option", { value: BUILDER_EDITOR_NONE_VALUE, children: "Select table" }),
+                  tables.map((table) => /* @__PURE__ */ jsx10("option", { value: table.name, children: table.label ?? table.name }, table.name))
+                ]
+              }
+            )
           ] }) : null,
-          sourceType === "apiEndpoint" ? /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "API base path" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register("apiBasePath") })
+          sourceType === "apiEndpoint" ? /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "API base path" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register("apiBasePath") })
           ] }) : null,
-          sourceType === "dbTable" ? /* @__PURE__ */ jsx7("div", { style: { ...styles.field, justifyContent: "end" }, children: /* @__PURE__ */ jsx7(
+          sourceType === "dbTable" ? /* @__PURE__ */ jsx10("div", { style: { ...styles.field, justifyContent: "end" }, children: /* @__PURE__ */ jsx10(
             "button",
             {
               type: "button",
@@ -1934,13 +2429,92 @@ function createBuilderDefaultListEditorBody(options) {
           ) }) : null
         ] })
       ] }),
-      /* @__PURE__ */ jsxs7("section", { style: styles.section, children: [
-        /* @__PURE__ */ jsxs7("div", { style: styles.sectionHeader, children: [
-          /* @__PURE__ */ jsxs7("div", { children: [
-            /* @__PURE__ */ jsx7("h2", { style: styles.sectionTitle, children: "Columns" }),
-            /* @__PURE__ */ jsx7("p", { style: styles.description, children: "Runtime list columns." })
+      /* @__PURE__ */ jsxs9("section", { style: styles.section, children: [
+        /* @__PURE__ */ jsxs9("div", { style: styles.sectionHeader, children: [
+          /* @__PURE__ */ jsxs9("div", { children: [
+            /* @__PURE__ */ jsx10("h2", { style: styles.sectionTitle, children: "Default ordering" }),
+            /* @__PURE__ */ jsx10("p", { style: styles.description, children: "Rules are applied from top to bottom." })
           ] }),
-          /* @__PURE__ */ jsx7(
+          /* @__PURE__ */ jsx10(
+            "button",
+            {
+              type: "button",
+              style: styles.button,
+              disabled: sourceType === "none" || orderByArray.fields.length >= 8,
+              onClick: () => orderByArray.append({
+                field: sourceType === "dbTable" ? orderByColumns[0]?.name ?? BUILDER_EDITOR_NONE_VALUE : "",
+                direction: "desc"
+              }),
+              children: "Add ordering"
+            }
+          )
+        ] }),
+        orderByArray.fields.length === 0 ? /* @__PURE__ */ jsx10("div", { style: styles.grid, children: /* @__PURE__ */ jsx10("p", { style: styles.description, children: "Automatic ordering is used." }) }) : null,
+        orderByArray.fields.map((rule, index) => /* @__PURE__ */ jsxs9("div", { style: styles.row, children: [
+          sourceType === "dbTable" ? /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Order by field" }),
+            /* @__PURE__ */ jsxs9("select", { style: styles.input, ...form.register(`orderBy.${index}.field`), children: [
+              /* @__PURE__ */ jsx10("option", { value: BUILDER_EDITOR_NONE_VALUE, children: "Select field" }),
+              orderByColumns.map((column) => /* @__PURE__ */ jsx10("option", { value: column.name, children: column.label }, column.name))
+            ] })
+          ] }) : /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Order by field" }),
+            /* @__PURE__ */ jsx10(
+              "input",
+              {
+                style: styles.input,
+                placeholder: "createdAt",
+                ...form.register(`orderBy.${index}.field`)
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Direction" }),
+            /* @__PURE__ */ jsxs9("select", { style: styles.input, ...form.register(`orderBy.${index}.direction`), children: [
+              /* @__PURE__ */ jsx10("option", { value: "asc", children: "Ascending" }),
+              /* @__PURE__ */ jsx10("option", { value: "desc", children: "Descending" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs9("div", { style: styles.actions, children: [
+            /* @__PURE__ */ jsx10(
+              "button",
+              {
+                type: "button",
+                style: styles.button,
+                disabled: index === 0,
+                onClick: () => orderByArray.move(index, index - 1),
+                children: "Move up"
+              }
+            ),
+            /* @__PURE__ */ jsx10(
+              "button",
+              {
+                type: "button",
+                style: styles.button,
+                disabled: index === orderByArray.fields.length - 1,
+                onClick: () => orderByArray.move(index, index + 1),
+                children: "Move down"
+              }
+            ),
+            /* @__PURE__ */ jsx10(
+              "button",
+              {
+                type: "button",
+                style: styles.button,
+                onClick: () => orderByArray.remove(index),
+                children: "Remove"
+              }
+            )
+          ] })
+        ] }, rule.id))
+      ] }),
+      /* @__PURE__ */ jsxs9("section", { style: styles.section, children: [
+        /* @__PURE__ */ jsxs9("div", { style: styles.sectionHeader, children: [
+          /* @__PURE__ */ jsxs9("div", { children: [
+            /* @__PURE__ */ jsx10("h2", { style: styles.sectionTitle, children: "Columns" }),
+            /* @__PURE__ */ jsx10("p", { style: styles.description, children: "Runtime list columns." })
+          ] }),
+          /* @__PURE__ */ jsx10(
             "button",
             {
               type: "button",
@@ -1954,50 +2528,44 @@ function createBuilderDefaultListEditorBody(options) {
             }
           )
         ] }),
-        columnArray.fields.map((column, index) => /* @__PURE__ */ jsxs7("div", { style: styles.row, children: [
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Key" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register(`columns.${index}.key`) })
+        columnArray.fields.map((column, index) => /* @__PURE__ */ jsxs9("div", { style: styles.row, children: [
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Key" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register(`columns.${index}.key`) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Label" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register(`columns.${index}.label`) })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Label" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register(`columns.${index}.label`) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Align" }),
-            /* @__PURE__ */ jsxs7("select", { style: styles.input, ...form.register(`columns.${index}.align`), children: [
-              /* @__PURE__ */ jsx7("option", { value: "left", children: "Left" }),
-              /* @__PURE__ */ jsx7("option", { value: "right", children: "Right" })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Align" }),
+            /* @__PURE__ */ jsxs9("select", { style: styles.input, ...form.register(`columns.${index}.align`), children: [
+              /* @__PURE__ */ jsx10("option", { value: "left", children: "Left" }),
+              /* @__PURE__ */ jsx10("option", { value: "right", children: "Right" })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.checkboxField, children: [
-            /* @__PURE__ */ jsx7("input", { type: "checkbox", ...form.register(`columns.${index}.sortable`) }),
+          /* @__PURE__ */ jsxs9("label", { style: styles.checkboxField, children: [
+            /* @__PURE__ */ jsx10("input", { type: "checkbox", ...form.register(`columns.${index}.sortable`) }),
             "Sortable"
           ] }),
-          /* @__PURE__ */ jsx7(
-            "button",
-            {
-              type: "button",
-              style: styles.button,
-              onClick: () => columnArray.remove(index),
-              disabled: columnArray.fields.length <= 1,
-              children: "Remove"
-            }
-          )
+          /* @__PURE__ */ jsxs9("label", { style: styles.checkboxField, children: [
+            /* @__PURE__ */ jsx10("input", { type: "checkbox", ...form.register(`columns.${index}.hidden`) }),
+            "Hidden"
+          ] })
         ] }, column.id))
       ] }),
-      /* @__PURE__ */ jsxs7("section", { style: styles.section, children: [
-        /* @__PURE__ */ jsxs7("div", { style: styles.sectionHeader, children: [
-          /* @__PURE__ */ jsxs7("div", { children: [
-            /* @__PURE__ */ jsx7("h2", { style: styles.sectionTitle, children: "List Triggers" }),
-            /* @__PURE__ */ jsx7("p", { style: styles.description, children: "Optional API callbacks for list lifecycle events." })
+      /* @__PURE__ */ jsxs9("section", { style: styles.section, children: [
+        /* @__PURE__ */ jsxs9("div", { style: styles.sectionHeader, children: [
+          /* @__PURE__ */ jsxs9("div", { children: [
+            /* @__PURE__ */ jsx10("h2", { style: styles.sectionTitle, children: "List Triggers" }),
+            /* @__PURE__ */ jsx10("p", { style: styles.description, children: "Optional API callbacks for list lifecycle events." })
           ] }),
-          /* @__PURE__ */ jsx7("button", { type: "button", style: styles.button, onClick: () => triggerArray.append(emptyTrigger), children: "Add trigger" })
+          /* @__PURE__ */ jsx10("button", { type: "button", style: styles.button, onClick: () => triggerArray.append(emptyTrigger), children: "Add trigger" })
         ] }),
-        triggerArray.fields.map((trigger, index) => /* @__PURE__ */ jsxs7("div", { style: styles.row, children: [
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Event" }),
-            /* @__PURE__ */ jsx7(
+        triggerArray.fields.map((trigger, index) => /* @__PURE__ */ jsxs9("div", { style: styles.row, children: [
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Event" }),
+            /* @__PURE__ */ jsx10(
               "select",
               {
                 style: styles.input,
@@ -2008,19 +2576,19 @@ function createBuilderDefaultListEditorBody(options) {
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.field, children: [
-            /* @__PURE__ */ jsx7("span", { style: styles.label, children: "Route" }),
-            /* @__PURE__ */ jsx7("input", { style: styles.input, ...form.register(`triggers.${index}.route`) })
+          /* @__PURE__ */ jsxs9("label", { style: styles.field, children: [
+            /* @__PURE__ */ jsx10("span", { style: styles.label, children: "Route" }),
+            /* @__PURE__ */ jsx10("input", { style: styles.input, ...form.register(`triggers.${index}.route`) })
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.checkboxField, children: [
-            /* @__PURE__ */ jsx7("input", { type: "checkbox", ...form.register(`triggers.${index}.enabled`) }),
+          /* @__PURE__ */ jsxs9("label", { style: styles.checkboxField, children: [
+            /* @__PURE__ */ jsx10("input", { type: "checkbox", ...form.register(`triggers.${index}.enabled`) }),
             "Enabled"
           ] }),
-          /* @__PURE__ */ jsxs7("label", { style: styles.checkboxField, children: [
-            /* @__PURE__ */ jsx7("input", { type: "checkbox", ...form.register(`triggers.${index}.blocking`) }),
+          /* @__PURE__ */ jsxs9("label", { style: styles.checkboxField, children: [
+            /* @__PURE__ */ jsx10("input", { type: "checkbox", ...form.register(`triggers.${index}.blocking`) }),
             "Blocking"
           ] }),
-          /* @__PURE__ */ jsx7("button", { type: "button", style: styles.button, onClick: () => triggerArray.remove(index), children: "Remove" })
+          /* @__PURE__ */ jsx10("button", { type: "button", style: styles.button, onClick: () => triggerArray.remove(index), children: "Remove" })
         ] }, trigger.id))
       ] })
     ] });
@@ -2028,8 +2596,8 @@ function createBuilderDefaultListEditorBody(options) {
 }
 
 // src/admin/BuilderDefaultEntityManager.tsx
-import { useMemo as useMemo5, useState as useState6 } from "react";
-import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+import { useMemo as useMemo5, useState as useState7 } from "react";
+import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
 var styles2 = {
   page: {
     display: "grid",
@@ -2125,7 +2693,7 @@ var styles2 = {
 };
 function createBuilderDefaultEntityManagerComponent(deps) {
   return function BuilderDefaultEntityManager() {
-    const [state, setState] = useState6({
+    const [state, setState] = useState7({
       page: 1,
       pageSize: 20,
       search: ""
@@ -2146,16 +2714,16 @@ function createBuilderDefaultEntityManagerComponent(deps) {
       if (!window.confirm(deps.labels.deleteConfirm(entity))) return;
       await remove.mutateAsync(entity.id);
     };
-    return /* @__PURE__ */ jsxs8("section", { style: styles2.page, children: [
-      /* @__PURE__ */ jsxs8("div", { style: styles2.header, children: [
-        /* @__PURE__ */ jsxs8("div", { children: [
-          /* @__PURE__ */ jsx8("h1", { style: styles2.title, children: deps.labels.title }),
-          /* @__PURE__ */ jsx8("p", { style: styles2.description, children: deps.labels.description })
+    return /* @__PURE__ */ jsxs10("section", { style: styles2.page, children: [
+      /* @__PURE__ */ jsxs10("div", { style: styles2.header, children: [
+        /* @__PURE__ */ jsxs10("div", { children: [
+          /* @__PURE__ */ jsx11("h1", { style: styles2.title, children: deps.labels.title }),
+          /* @__PURE__ */ jsx11("p", { style: styles2.description, children: deps.labels.description })
         ] }),
-        deps.createHref ? /* @__PURE__ */ jsx8("a", { href: deps.createHref, style: styles2.primaryButton, children: deps.labels.addLabel }) : null
+        deps.createHref ? /* @__PURE__ */ jsx11("a", { href: deps.createHref, style: styles2.primaryButton, children: deps.labels.addLabel }) : null
       ] }),
-      /* @__PURE__ */ jsxs8("div", { style: styles2.card, children: [
-        /* @__PURE__ */ jsx8("div", { style: styles2.toolbar, children: /* @__PURE__ */ jsx8(
+      /* @__PURE__ */ jsxs10("div", { style: styles2.card, children: [
+        /* @__PURE__ */ jsx11("div", { style: styles2.toolbar, children: /* @__PURE__ */ jsx11(
           "input",
           {
             style: styles2.input,
@@ -2164,21 +2732,21 @@ function createBuilderDefaultEntityManagerComponent(deps) {
             onChange: (event) => setState((current) => ({ ...current, page: 1, search: event.target.value }))
           }
         ) }),
-        /* @__PURE__ */ jsx8("div", { style: styles2.tableWrap, children: /* @__PURE__ */ jsxs8("table", { style: styles2.table, children: [
-          /* @__PURE__ */ jsx8("thead", { children: /* @__PURE__ */ jsxs8("tr", { children: [
-            /* @__PURE__ */ jsx8("th", { style: styles2.th, children: deps.labels.title }),
-            /* @__PURE__ */ jsx8("th", { style: styles2.th, children: "Detail" }),
-            /* @__PURE__ */ jsx8("th", { style: styles2.th, children: "Description" }),
-            /* @__PURE__ */ jsx8("th", { style: { ...styles2.th, textAlign: "right" }, children: "Actions" })
+        /* @__PURE__ */ jsx11("div", { style: styles2.tableWrap, children: /* @__PURE__ */ jsxs10("table", { style: styles2.table, children: [
+          /* @__PURE__ */ jsx11("thead", { children: /* @__PURE__ */ jsxs10("tr", { children: [
+            /* @__PURE__ */ jsx11("th", { style: styles2.th, children: deps.labels.title }),
+            /* @__PURE__ */ jsx11("th", { style: styles2.th, children: "Detail" }),
+            /* @__PURE__ */ jsx11("th", { style: styles2.th, children: "Description" }),
+            /* @__PURE__ */ jsx11("th", { style: { ...styles2.th, textAlign: "right" }, children: "Actions" })
           ] }) }),
-          /* @__PURE__ */ jsx8("tbody", { children: items.map((entity) => /* @__PURE__ */ jsxs8("tr", { children: [
-            /* @__PURE__ */ jsx8("td", { style: styles2.td, children: /* @__PURE__ */ jsx8("a", { href: deps.editHref(entity), children: entity.title }) }),
-            /* @__PURE__ */ jsx8("td", { style: styles2.td, children: deps.getDetail?.(entity) ?? "-" }),
-            /* @__PURE__ */ jsx8("td", { style: styles2.td, children: entity.description || "-" }),
-            /* @__PURE__ */ jsx8("td", { style: styles2.td, children: /* @__PURE__ */ jsxs8("div", { style: styles2.actions, children: [
-              deps.runtimeHref ? /* @__PURE__ */ jsx8("a", { href: deps.runtimeHref(entity), style: styles2.button, children: deps.labels.runtimeLabel }) : null,
-              /* @__PURE__ */ jsx8("a", { href: deps.editHref(entity), style: styles2.button, children: deps.labels.editLabel }),
-              /* @__PURE__ */ jsx8(
+          /* @__PURE__ */ jsx11("tbody", { children: items.map((entity) => /* @__PURE__ */ jsxs10("tr", { children: [
+            /* @__PURE__ */ jsx11("td", { style: styles2.td, children: /* @__PURE__ */ jsx11("a", { href: deps.editHref(entity), children: entity.title }) }),
+            /* @__PURE__ */ jsx11("td", { style: styles2.td, children: deps.getDetail?.(entity) ?? "-" }),
+            /* @__PURE__ */ jsx11("td", { style: styles2.td, children: entity.description || "-" }),
+            /* @__PURE__ */ jsx11("td", { style: styles2.td, children: /* @__PURE__ */ jsxs10("div", { style: styles2.actions, children: [
+              deps.runtimeHref ? /* @__PURE__ */ jsx11("a", { href: deps.runtimeHref(entity), style: styles2.button, children: deps.labels.runtimeLabel }) : null,
+              /* @__PURE__ */ jsx11("a", { href: deps.editHref(entity), style: styles2.button, children: deps.labels.editLabel }),
+              /* @__PURE__ */ jsx11(
                 "button",
                 {
                   type: "button",
@@ -2187,7 +2755,7 @@ function createBuilderDefaultEntityManagerComponent(deps) {
                   children: deps.labels.replicateLabel
                 }
               ),
-              /* @__PURE__ */ jsx8(
+              /* @__PURE__ */ jsx11(
                 "button",
                 {
                   type: "button",
@@ -2200,11 +2768,11 @@ function createBuilderDefaultEntityManagerComponent(deps) {
             ] }) })
           ] }, entity.id)) })
         ] }) }),
-        query.isPending ? /* @__PURE__ */ jsx8("div", { style: styles2.empty, children: "Loading..." }) : null,
-        query.isError ? /* @__PURE__ */ jsx8("div", { style: styles2.empty, children: "Failed to load." }) : null,
-        !query.isPending && !query.isError && items.length === 0 ? /* @__PURE__ */ jsxs8("div", { style: styles2.empty, children: [
-          /* @__PURE__ */ jsx8("strong", { children: deps.labels.emptyTitle }),
-          /* @__PURE__ */ jsx8("div", { children: deps.labels.emptyDescription })
+        query.isPending ? /* @__PURE__ */ jsx11("div", { style: styles2.empty, children: "Loading..." }) : null,
+        query.isError ? /* @__PURE__ */ jsx11("div", { style: styles2.empty, children: "Failed to load." }) : null,
+        !query.isPending && !query.isError && items.length === 0 ? /* @__PURE__ */ jsxs10("div", { style: styles2.empty, children: [
+          /* @__PURE__ */ jsx11("strong", { children: deps.labels.emptyTitle }),
+          /* @__PURE__ */ jsx11("div", { children: deps.labels.emptyDescription })
         ] }) : null
       ] })
     ] });
@@ -2212,9 +2780,9 @@ function createBuilderDefaultEntityManagerComponent(deps) {
 }
 
 // src/admin/BuilderDefaultViewEditorPage.tsx
-import { useEffect as useEffect3 } from "react";
+import { useEffect as useEffect4 } from "react";
 import { useForm as useForm3 } from "react-hook-form";
-import { Fragment, jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
 var styles3 = {
   page: {
     display: "grid",
@@ -2331,7 +2899,7 @@ function createBuilderDefaultViewEditorPage(options) {
         permissionWrite: defaultPermission
       }
     });
-    useEffect3(() => {
+    useEffect4(() => {
       if (viewId && !view.data) return;
       form.reset(
         builderViewEditorValuesFromEntity(
@@ -2362,64 +2930,64 @@ function createBuilderDefaultViewEditorPage(options) {
       }
     });
     if (viewId && view.isPending) {
-      return /* @__PURE__ */ jsx9("div", { style: styles3.state, children: "Loading..." });
+      return /* @__PURE__ */ jsx12("div", { style: styles3.state, children: "Loading..." });
     }
     if (viewId && view.isError) {
-      return /* @__PURE__ */ jsx9("div", { style: styles3.state, children: "Failed to load view." });
+      return /* @__PURE__ */ jsx12("div", { style: styles3.state, children: "Failed to load view." });
     }
-    return /* @__PURE__ */ jsxs9("form", { onSubmit, noValidate: true, style: styles3.page, children: [
-      /* @__PURE__ */ jsxs9("div", { style: styles3.header, children: [
-        /* @__PURE__ */ jsxs9("div", { children: [
-          /* @__PURE__ */ jsx9("h1", { style: styles3.title, children: viewId ? "Edit Dynamic View" : "New Dynamic View" }),
-          /* @__PURE__ */ jsx9("p", { style: styles3.description, children: "Connect a form and list into a runtime screen." })
+    return /* @__PURE__ */ jsxs11("form", { onSubmit, noValidate: true, style: styles3.page, children: [
+      /* @__PURE__ */ jsxs11("div", { style: styles3.header, children: [
+        /* @__PURE__ */ jsxs11("div", { children: [
+          /* @__PURE__ */ jsx12("h1", { style: styles3.title, children: viewId ? "Edit Dynamic View" : "New Dynamic View" }),
+          /* @__PURE__ */ jsx12("p", { style: styles3.description, children: "Connect a form and list into a runtime screen." })
         ] }),
-        /* @__PURE__ */ jsxs9("div", { style: styles3.actions, children: [
-          /* @__PURE__ */ jsx9("a", { href: options.backHref, style: styles3.button, children: "Cancel" }),
-          /* @__PURE__ */ jsx9("button", { type: "submit", disabled: save.isPending, style: styles3.primaryButton, children: save.isPending ? "Saving..." : "Save" })
+        /* @__PURE__ */ jsxs11("div", { style: styles3.actions, children: [
+          /* @__PURE__ */ jsx12("a", { href: options.backHref, style: styles3.button, children: "Cancel" }),
+          /* @__PURE__ */ jsx12("button", { type: "submit", disabled: save.isPending, style: styles3.primaryButton, children: save.isPending ? "Saving..." : "Save" })
         ] })
       ] }),
-      /* @__PURE__ */ jsx9("section", { style: styles3.section, children: /* @__PURE__ */ jsxs9("div", { style: styles3.grid, children: [
-        /* @__PURE__ */ jsxs9("label", { style: styles3.field, children: [
-          /* @__PURE__ */ jsx9("span", { style: styles3.label, children: "Title" }),
-          /* @__PURE__ */ jsx9("input", { style: styles3.input, ...form.register("title", { required: true }) })
+      /* @__PURE__ */ jsx12("section", { style: styles3.section, children: /* @__PURE__ */ jsxs11("div", { style: styles3.grid, children: [
+        /* @__PURE__ */ jsxs11("label", { style: styles3.field, children: [
+          /* @__PURE__ */ jsx12("span", { style: styles3.label, children: "Title" }),
+          /* @__PURE__ */ jsx12("input", { style: styles3.input, ...form.register("title", { required: true }) })
         ] }),
-        /* @__PURE__ */ jsxs9("label", { style: styles3.field, children: [
-          /* @__PURE__ */ jsx9("span", { style: styles3.label, children: "Description" }),
-          /* @__PURE__ */ jsx9("input", { style: styles3.input, ...form.register("description") })
+        /* @__PURE__ */ jsxs11("label", { style: styles3.field, children: [
+          /* @__PURE__ */ jsx12("span", { style: styles3.label, children: "Description" }),
+          /* @__PURE__ */ jsx12("input", { style: styles3.input, ...form.register("description") })
         ] }),
-        /* @__PURE__ */ jsxs9("label", { style: styles3.field, children: [
-          /* @__PURE__ */ jsx9("span", { style: styles3.label, children: "Form" }),
-          /* @__PURE__ */ jsxs9("select", { style: styles3.input, ...form.register("formId"), children: [
-            /* @__PURE__ */ jsx9("option", { value: BUILDER_EDITOR_NONE_VALUE, children: "No form" }),
-            (forms.data ?? []).map((item) => /* @__PURE__ */ jsx9("option", { value: item.id, children: item.title }, item.id))
+        /* @__PURE__ */ jsxs11("label", { style: styles3.field, children: [
+          /* @__PURE__ */ jsx12("span", { style: styles3.label, children: "Form" }),
+          /* @__PURE__ */ jsxs11("select", { style: styles3.input, ...form.register("formId"), children: [
+            /* @__PURE__ */ jsx12("option", { value: BUILDER_EDITOR_NONE_VALUE, children: "No form" }),
+            (forms.data ?? []).map((item) => /* @__PURE__ */ jsx12("option", { value: item.id, children: item.title }, item.id))
           ] })
         ] }),
-        /* @__PURE__ */ jsxs9("label", { style: styles3.field, children: [
-          /* @__PURE__ */ jsx9("span", { style: styles3.label, children: "List" }),
-          /* @__PURE__ */ jsxs9("select", { style: styles3.input, ...form.register("listId"), children: [
-            /* @__PURE__ */ jsx9("option", { value: BUILDER_EDITOR_NONE_VALUE, children: "No list" }),
-            (lists.data ?? []).map((item) => /* @__PURE__ */ jsx9("option", { value: item.id, children: item.title }, item.id))
+        /* @__PURE__ */ jsxs11("label", { style: styles3.field, children: [
+          /* @__PURE__ */ jsx12("span", { style: styles3.label, children: "List" }),
+          /* @__PURE__ */ jsxs11("select", { style: styles3.input, ...form.register("listId"), children: [
+            /* @__PURE__ */ jsx12("option", { value: BUILDER_EDITOR_NONE_VALUE, children: "No list" }),
+            (lists.data ?? []).map((item) => /* @__PURE__ */ jsx12("option", { value: item.id, children: item.title }, item.id))
           ] })
         ] }),
-        showPermissions ? /* @__PURE__ */ jsxs9(Fragment, { children: [
-          /* @__PURE__ */ jsxs9("label", { style: styles3.field, children: [
-            /* @__PURE__ */ jsx9("span", { style: styles3.label, children: "Read permission" }),
-            /* @__PURE__ */ jsxs9("select", { style: styles3.input, ...form.register("permissionRead"), children: [
-              /* @__PURE__ */ jsx9("option", { value: "", children: "Authenticated users" }),
-              options.permissionOptions.map((permission) => /* @__PURE__ */ jsx9("option", { value: permission.value, children: permission.label }, permission.value))
+        showPermissions ? /* @__PURE__ */ jsxs11(Fragment3, { children: [
+          /* @__PURE__ */ jsxs11("label", { style: styles3.field, children: [
+            /* @__PURE__ */ jsx12("span", { style: styles3.label, children: "Read permission" }),
+            /* @__PURE__ */ jsxs11("select", { style: styles3.input, ...form.register("permissionRead"), children: [
+              /* @__PURE__ */ jsx12("option", { value: "", children: "Authenticated users" }),
+              options.permissionOptions.map((permission) => /* @__PURE__ */ jsx12("option", { value: permission.value, children: permission.label }, permission.value))
             ] })
           ] }),
-          /* @__PURE__ */ jsxs9("label", { style: styles3.field, children: [
-            /* @__PURE__ */ jsx9("span", { style: styles3.label, children: "Write permission" }),
-            /* @__PURE__ */ jsxs9("select", { style: styles3.input, ...form.register("permissionWrite"), children: [
-              /* @__PURE__ */ jsx9("option", { value: "", children: "Authenticated users" }),
-              options.permissionOptions.map((permission) => /* @__PURE__ */ jsx9("option", { value: permission.value, children: permission.label }, permission.value))
+          /* @__PURE__ */ jsxs11("label", { style: styles3.field, children: [
+            /* @__PURE__ */ jsx12("span", { style: styles3.label, children: "Write permission" }),
+            /* @__PURE__ */ jsxs11("select", { style: styles3.input, ...form.register("permissionWrite"), children: [
+              /* @__PURE__ */ jsx12("option", { value: "", children: "Authenticated users" }),
+              options.permissionOptions.map((permission) => /* @__PURE__ */ jsx12("option", { value: permission.value, children: permission.label }, permission.value))
             ] })
           ] })
         ] }) : null,
-        /* @__PURE__ */ jsxs9("label", { style: { ...styles3.field, gridColumn: "1 / -1" }, children: [
-          /* @__PURE__ */ jsx9("span", { style: styles3.label, children: "Triggers JSON" }),
-          /* @__PURE__ */ jsx9("textarea", { style: styles3.textarea, ...form.register("triggersText") })
+        /* @__PURE__ */ jsxs11("label", { style: { ...styles3.field, gridColumn: "1 / -1" }, children: [
+          /* @__PURE__ */ jsx12("span", { style: styles3.label, children: "Triggers JSON" }),
+          /* @__PURE__ */ jsx12("textarea", { style: styles3.textarea, ...form.register("triggersText") })
         ] })
       ] }) })
     ] });
@@ -2427,14 +2995,14 @@ function createBuilderDefaultViewEditorPage(options) {
 }
 
 // src/admin/BuilderEditorPage.tsx
-import { useEffect as useEffect4 } from "react";
+import { useEffect as useEffect5 } from "react";
 import {
   FormProvider as FormProvider3,
   useFieldArray,
   useForm as useForm4,
-  useWatch as useWatch2
+  useWatch as useWatch5
 } from "react-hook-form";
-import { jsx as jsx10 } from "react/jsx-runtime";
+import { jsx as jsx13 } from "react/jsx-runtime";
 function createBuilderFormEditorPageComponent(deps) {
   return function BuilderFormEditorPage({ formId }) {
     const Body = deps.Body;
@@ -2448,11 +3016,11 @@ function createBuilderFormEditorPageComponent(deps) {
     const fieldArray = useFieldArray({ control: form.control, name: "fields" });
     const subformArray = useFieldArray({ control: form.control, name: "subforms" });
     const triggerArray = useFieldArray({ control: form.control, name: "triggers" });
-    const fields = useWatch2({ control: form.control, name: "fields" }) ?? [];
-    const subforms = useWatch2({ control: form.control, name: "subforms" }) ?? [];
-    const sourceType = useWatch2({ control: form.control, name: "sourceType" });
-    const sourceTable = useWatch2({ control: form.control, name: "sourceTable" });
-    useEffect4(() => {
+    const fields = useWatch5({ control: form.control, name: "fields" }) ?? [];
+    const subforms = useWatch5({ control: form.control, name: "subforms" }) ?? [];
+    const sourceType = useWatch5({ control: form.control, name: "sourceType" });
+    const sourceTable = useWatch5({ control: form.control, name: "sourceTable" });
+    useEffect5(() => {
       if (formId && !entityQuery.data) return;
       form.reset(builderFormEditorValuesFromEntity(entityQuery.data ?? null, deps.emptyValues));
     }, [entityQuery.data, form, formId]);
@@ -2475,12 +3043,12 @@ function createBuilderFormEditorPageComponent(deps) {
       }
     });
     if (formId && entityQuery.isPending) {
-      return /* @__PURE__ */ jsx10("div", { className: "text-muted-foreground text-sm", children: deps.states.loading });
+      return /* @__PURE__ */ jsx13("div", { className: "text-muted-foreground text-sm", children: deps.states.loading });
     }
     if (formId && entityQuery.isError) {
-      return /* @__PURE__ */ jsx10("div", { className: "text-destructive text-sm", children: deps.states.error });
+      return /* @__PURE__ */ jsx13("div", { className: "text-destructive text-sm", children: deps.states.error });
     }
-    return /* @__PURE__ */ jsx10(FormProvider3, { ...form, children: /* @__PURE__ */ jsx10("form", { onSubmit, noValidate: true, className: "space-y-6", children: /* @__PURE__ */ jsx10(
+    return /* @__PURE__ */ jsx13(FormProvider3, { ...form, children: /* @__PURE__ */ jsx13("form", { onSubmit, noValidate: true, className: "space-y-6", children: /* @__PURE__ */ jsx13(
       Body,
       {
         formId,
@@ -2512,10 +3080,11 @@ function createBuilderListEditorPageComponent(deps) {
       defaultValues: deps.emptyValues
     });
     const columnArray = useFieldArray({ control: form.control, name: "columns" });
+    const orderByArray = useFieldArray({ control: form.control, name: "orderBy" });
     const triggerArray = useFieldArray({ control: form.control, name: "triggers" });
-    const sourceType = useWatch2({ control: form.control, name: "sourceType" });
-    const sourceTable = useWatch2({ control: form.control, name: "sourceTable" });
-    useEffect4(() => {
+    const sourceType = useWatch5({ control: form.control, name: "sourceType" });
+    const sourceTable = useWatch5({ control: form.control, name: "sourceTable" });
+    useEffect5(() => {
       if (listId && !entityQuery.data) return;
       form.reset(builderListEditorValuesFromEntity(entityQuery.data ?? null, deps.emptyValues));
     }, [entityQuery.data, form, listId]);
@@ -2534,17 +3103,18 @@ function createBuilderListEditorPageComponent(deps) {
       }
     });
     if (listId && entityQuery.isPending) {
-      return /* @__PURE__ */ jsx10("div", { className: "text-muted-foreground text-sm", children: deps.states.loading });
+      return /* @__PURE__ */ jsx13("div", { className: "text-muted-foreground text-sm", children: deps.states.loading });
     }
     if (listId && entityQuery.isError) {
-      return /* @__PURE__ */ jsx10("div", { className: "text-destructive text-sm", children: deps.states.error });
+      return /* @__PURE__ */ jsx13("div", { className: "text-destructive text-sm", children: deps.states.error });
     }
-    return /* @__PURE__ */ jsx10(FormProvider3, { ...form, children: /* @__PURE__ */ jsx10("form", { onSubmit, noValidate: true, className: "space-y-6", children: /* @__PURE__ */ jsx10(
+    return /* @__PURE__ */ jsx13(FormProvider3, { ...form, children: /* @__PURE__ */ jsx13("form", { onSubmit, noValidate: true, className: "space-y-6", children: /* @__PURE__ */ jsx13(
       Body,
       {
         listId,
         form,
         columnArray,
+        orderByArray,
         triggerArray,
         sourceType,
         sourceTable,
@@ -2559,10 +3129,11 @@ function createBuilderListEditorPageComponent(deps) {
 }
 
 // src/admin/BuilderAdminPages.tsx
-import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
 var defaultFieldTypeOptions = [
   { value: "text", label: "Text" },
   { value: "textarea", label: "Textarea" },
+  { value: "richtext", label: "Rich text" },
   { value: "number", label: "Number" },
   { value: "money", label: "Money" },
   { value: "select", label: "Select" },
@@ -2673,6 +3244,10 @@ function createBuilderAdminPages({
     required: true,
     hidden: false,
     disabled: false,
+    storage: "s3",
+    contentKind: "image",
+    multiple: false,
+    maxMegabytes: 10,
     placeholder: "",
     optionsText: "",
     optionsMode: "static",
@@ -2707,6 +3282,7 @@ function createBuilderAdminPages({
     key: "name",
     label: "Name",
     sortable: true,
+    hidden: false,
     align: "left"
   };
   const emptyListValues = {
@@ -2715,6 +3291,7 @@ function createBuilderAdminPages({
     sourceType: "none",
     sourceTable: BUILDER_EDITOR_NONE_VALUE,
     apiBasePath: "",
+    orderBy: [],
     columns: [emptyColumn],
     triggers: [],
     version: 0
@@ -2817,14 +3394,14 @@ function createBuilderAdminPages({
         href: viewsPath
       }
     ];
-    return /* @__PURE__ */ jsxs10("section", { style: homeStyles.page, children: [
-      /* @__PURE__ */ jsxs10("div", { children: [
-        /* @__PURE__ */ jsx11("h1", { style: homeStyles.headerTitle, children: "Builder" }),
-        /* @__PURE__ */ jsx11("p", { style: homeStyles.description, children: "Manage dynamic forms, lists, and views." })
+    return /* @__PURE__ */ jsxs12("section", { style: homeStyles.page, children: [
+      /* @__PURE__ */ jsxs12("div", { children: [
+        /* @__PURE__ */ jsx14("h1", { style: homeStyles.headerTitle, children: "Builder" }),
+        /* @__PURE__ */ jsx14("p", { style: homeStyles.description, children: "Manage dynamic forms, lists, and views." })
       ] }),
-      /* @__PURE__ */ jsx11("div", { style: homeStyles.grid, children: items.map((item) => /* @__PURE__ */ jsxs10("a", { href: item.href, style: homeStyles.card, children: [
-        /* @__PURE__ */ jsx11("h2", { style: homeStyles.cardTitle, children: item.title }),
-        /* @__PURE__ */ jsx11("p", { style: homeStyles.description, children: item.description })
+      /* @__PURE__ */ jsx14("div", { style: homeStyles.grid, children: items.map((item) => /* @__PURE__ */ jsxs12("a", { href: item.href, style: homeStyles.card, children: [
+        /* @__PURE__ */ jsx14("h2", { style: homeStyles.cardTitle, children: item.title }),
+        /* @__PURE__ */ jsx14("p", { style: homeStyles.description, children: item.description })
       ] }, item.href)) })
     ] });
   };
@@ -2913,24 +3490,24 @@ function createBuilderAdminPages({
     AdminHomePage,
     AdminFormsPage,
     AdminNewFormPage: function BuilderAdminNewFormPage() {
-      return /* @__PURE__ */ jsx11(FormEditorPage, {});
+      return /* @__PURE__ */ jsx14(FormEditorPage, {});
     },
     AdminEditFormPage: function BuilderAdminEditFormPage({ formId }) {
-      return /* @__PURE__ */ jsx11(FormEditorPage, { formId });
+      return /* @__PURE__ */ jsx14(FormEditorPage, { formId });
     },
     AdminListsPage,
     AdminNewListPage: function BuilderAdminNewListPage() {
-      return /* @__PURE__ */ jsx11(ListEditorPage, {});
+      return /* @__PURE__ */ jsx14(ListEditorPage, {});
     },
     AdminEditListPage: function BuilderAdminEditListPage({ listId }) {
-      return /* @__PURE__ */ jsx11(ListEditorPage, { listId });
+      return /* @__PURE__ */ jsx14(ListEditorPage, { listId });
     },
     AdminViewsPage,
     AdminNewViewPage: function BuilderAdminNewViewPage() {
-      return /* @__PURE__ */ jsx11(ViewEditorPage, {});
+      return /* @__PURE__ */ jsx14(ViewEditorPage, {});
     },
     AdminEditViewPage: function BuilderAdminEditViewPage({ viewId }) {
-      return /* @__PURE__ */ jsx11(ViewEditorPage, { viewId });
+      return /* @__PURE__ */ jsx14(ViewEditorPage, { viewId });
     },
     routes: {
       adminBasePath,
@@ -2948,11 +3525,11 @@ function createBuilderAdminPages({
 }
 
 // src/admin/BuilderEntityManager.tsx
-import { useCallback as useCallback2, useMemo as useMemo6, useState as useState7 } from "react";
-import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+import { useCallback as useCallback2, useMemo as useMemo6, useState as useState8 } from "react";
+import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
 function createBuilderEntityManagerComponent(deps) {
   return function BuilderEntityManager() {
-    const [pendingDelete, setPendingDelete] = useState7(null);
+    const [pendingDelete, setPendingDelete] = useState8(null);
     const state = deps.useDataTableState({ pageSize: 20 });
     const query = deps.hooks.useEntities(state.query);
     const remove = deps.hooks.useDelete();
@@ -2977,8 +3554,8 @@ function createBuilderEntityManagerComponent(deps) {
       state,
       getRowId: (row) => row.id
     });
-    return /* @__PURE__ */ jsxs11("div", { className: "space-y-6", children: [
-      /* @__PURE__ */ jsx12(
+    return /* @__PURE__ */ jsxs13("div", { className: "space-y-6", children: [
+      /* @__PURE__ */ jsx15(
         deps.DataGrid,
         {
           title: deps.labels.title,
@@ -2989,10 +3566,10 @@ function createBuilderEntityManagerComponent(deps) {
           emptyTitle: deps.labels.emptyTitle,
           emptyDescription: deps.labels.emptyDescription,
           onRowClick: deps.navigateToEdit,
-          toolbarExtra: /* @__PURE__ */ jsx12(deps.AddButton, { href: deps.createHref, label: deps.labels.addLabel })
+          toolbarExtra: /* @__PURE__ */ jsx15(deps.AddButton, { href: deps.createHref, label: deps.labels.addLabel })
         }
       ),
-      /* @__PURE__ */ jsx12(
+      /* @__PURE__ */ jsx15(
         deps.DeleteDialog,
         {
           entity: pendingDelete,
@@ -3012,9 +3589,9 @@ function createBuilderEntityManagerComponent(deps) {
 }
 function createBuilderEntityDialogManagerComponent(deps) {
   return function BuilderEntityDialogManager() {
-    const [editing, setEditing] = useState7(null);
-    const [isEditorOpen, setEditorOpen] = useState7(false);
-    const [pendingDelete, setPendingDelete] = useState7(null);
+    const [editing, setEditing] = useState8(null);
+    const [isEditorOpen, setEditorOpen] = useState8(false);
+    const [pendingDelete, setPendingDelete] = useState8(null);
     const state = deps.useDataTableState({ pageSize: 20 });
     const query = deps.hooks.useEntities(state.query);
     const remove = deps.hooks.useDelete();
@@ -3043,8 +3620,8 @@ function createBuilderEntityDialogManagerComponent(deps) {
       state,
       getRowId: (row) => row.id
     });
-    return /* @__PURE__ */ jsxs11("div", { className: "space-y-6", children: [
-      /* @__PURE__ */ jsx12(
+    return /* @__PURE__ */ jsxs13("div", { className: "space-y-6", children: [
+      /* @__PURE__ */ jsx15(
         deps.DataGrid,
         {
           title: deps.labels.title,
@@ -3055,10 +3632,10 @@ function createBuilderEntityDialogManagerComponent(deps) {
           emptyTitle: deps.labels.emptyTitle,
           emptyDescription: deps.labels.emptyDescription,
           onRowClick: openEditor,
-          toolbarExtra: /* @__PURE__ */ jsx12(deps.AddButton, { label: deps.labels.addLabel, onAdd: () => openEditor(null) })
+          toolbarExtra: /* @__PURE__ */ jsx15(deps.AddButton, { label: deps.labels.addLabel, onAdd: () => openEditor(null) })
         }
       ),
-      /* @__PURE__ */ jsx12(
+      /* @__PURE__ */ jsx15(
         deps.EditorDialog,
         {
           open: isEditorOpen,
@@ -3066,7 +3643,7 @@ function createBuilderEntityDialogManagerComponent(deps) {
           onClose: () => setEditorOpen(false)
         }
       ),
-      /* @__PURE__ */ jsx12(
+      /* @__PURE__ */ jsx15(
         deps.DeleteDialog,
         {
           entity: pendingDelete,
@@ -3086,9 +3663,9 @@ function createBuilderEntityDialogManagerComponent(deps) {
 }
 
 // src/admin/BuilderViewDialog.tsx
-import { useEffect as useEffect5 } from "react";
+import { useEffect as useEffect6 } from "react";
 import { FormProvider as FormProvider4, useForm as useForm5 } from "react-hook-form";
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 function createBuilderViewDialogComponent(deps) {
   return function BuilderViewDialog({
     open,
@@ -3103,7 +3680,7 @@ function createBuilderViewDialogComponent(deps) {
       resolver: deps.resolver,
       defaultValues: deps.emptyValues
     });
-    useEffect5(() => {
+    useEffect6(() => {
       if (!open) return;
       form.reset(
         builderViewEditorValuesFromEntity(editing, deps.emptyValues, deps.defaultPermission)
@@ -3118,7 +3695,7 @@ function createBuilderViewDialogComponent(deps) {
         deps.notifications.error(error);
       }
     });
-    return /* @__PURE__ */ jsx13(deps.Shell, { open, editing, onClose, children: /* @__PURE__ */ jsx13(FormProvider4, { ...form, children: /* @__PURE__ */ jsx13("form", { onSubmit, noValidate: true, children: deps.Body({
+    return /* @__PURE__ */ jsx16(deps.Shell, { open, editing, onClose, children: /* @__PURE__ */ jsx16(FormProvider4, { ...form, children: /* @__PURE__ */ jsx16("form", { onSubmit, noValidate: true, children: deps.Body({
       form,
       editing,
       forms,
@@ -3133,7 +3710,7 @@ function createBuilderViewDialogComponent(deps) {
 
 // src/admin/formLayoutEditorState.ts
 import { useMemo as useMemo7 } from "react";
-import { useWatch as useWatch3 } from "react-hook-form";
+import { useWatch as useWatch6 } from "react-hook-form";
 var builderFormLayoutDragDataType = "application/x-winu-builder-layout-field";
 function clampBuilderFormLayoutSpan(span, columns) {
   return Math.max(1, Math.min(columns, span));
@@ -3180,7 +3757,7 @@ function parseBuilderFormLayoutDragPayload(raw) {
   }
 }
 function useBuilderFormLayoutEditor({ form, fields, subforms = [] }) {
-  const layoutGroups = useWatch3({ control: form.control, name: "layoutGroups" }) ?? [];
+  const layoutGroups = useWatch6({ control: form.control, name: "layoutGroups" }) ?? [];
   const layoutItems = useMemo7(
     () => [
       ...fields.map((field) => ({
@@ -3303,7 +3880,7 @@ function useBuilderFormLayoutEditor({ form, fields, subforms = [] }) {
 // src/components/DynamicForm.tsx
 import { useMemo as useMemo8 } from "react";
 import { FormProvider as FormProvider5, useForm as useForm6 } from "react-hook-form";
-import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
 function createDynamicFormComponent(deps) {
   return function DynamicForm({ formId }) {
     const query = deps.hooks.useRuntimeBuilderForm(formId);
@@ -3326,7 +3903,7 @@ function createDynamicFormComponent(deps) {
       }
     });
     if (query.isError) {
-      return /* @__PURE__ */ jsx14(
+      return /* @__PURE__ */ jsx17(
         deps.ErrorState,
         {
           title: "Form \u043D\u044D\u044D\u0433\u0434\u0441\u044D\u043D\u0433\u04AF\u0439",
@@ -3335,16 +3912,16 @@ function createDynamicFormComponent(deps) {
       );
     }
     if (!query.data) return null;
-    return /* @__PURE__ */ jsx14(deps.FormShell, { title: query.data.title, children: /* @__PURE__ */ jsx14(FormProvider5, { ...form, children: /* @__PURE__ */ jsxs12("form", { onSubmit, noValidate: true, className: "space-y-6", children: [
-      /* @__PURE__ */ jsx14(deps.FormFields, { formId, schema: query.data.schema, namePrefix: "values" }),
-      /* @__PURE__ */ jsx14(deps.SubmitButton, { isSaving: save.isPending })
+    return /* @__PURE__ */ jsx17(deps.FormShell, { title: query.data.title, children: /* @__PURE__ */ jsx17(FormProvider5, { ...form, children: /* @__PURE__ */ jsxs14("form", { onSubmit, noValidate: true, className: "space-y-6", children: [
+      /* @__PURE__ */ jsx17(deps.FormFields, { formId, schema: query.data.schema, namePrefix: "values" }),
+      /* @__PURE__ */ jsx17(deps.SubmitButton, { isSaving: save.isPending })
     ] }) }) });
   };
 }
 
 // src/components/DynamicList.tsx
 import { useMemo as useMemo9 } from "react";
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx18 } from "react/jsx-runtime";
 function createDynamicListComponent(deps) {
   return function DynamicList({ listId }) {
     const query = deps.hooks.useRuntimeBuilderList(listId);
@@ -3360,7 +3937,7 @@ function createDynamicListComponent(deps) {
       getRowId: (row) => row.id
     });
     if (query.isError) {
-      return /* @__PURE__ */ jsx15(
+      return /* @__PURE__ */ jsx18(
         deps.ErrorState,
         {
           title: "List \u043D\u044D\u044D\u0433\u0434\u0441\u044D\u043D\u0433\u04AF\u0439",
@@ -3368,7 +3945,7 @@ function createDynamicListComponent(deps) {
         }
       );
     }
-    return /* @__PURE__ */ jsx15(
+    return /* @__PURE__ */ jsx18(
       deps.DataGrid,
       {
         title: query.data?.title ?? "Dynamic List",
@@ -3384,8 +3961,8 @@ function createDynamicListComponent(deps) {
 }
 
 // src/components/DynamicView.tsx
-import { useMemo as useMemo10, useState as useState8 } from "react";
-import { jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
+import { useMemo as useMemo10, useState as useState9 } from "react";
+import { jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
 var interactiveRowTargetSelector = "button,a,input,select,textarea,[role='button'],[role='menuitem'],[data-builder-row-action]";
 function hasClosest(target) {
   return typeof target === "object" && target !== null && "closest" in target && typeof target.closest === "function";
@@ -3397,9 +3974,9 @@ function shouldHandleDynamicViewRowClick(event) {
 }
 function createDynamicViewComponent(deps) {
   return function DynamicView({ viewId }) {
-    const [editing, setEditing] = useState8(null);
-    const [isDialogOpen, setDialogOpen] = useState8(false);
-    const [pendingDelete, setPendingDelete] = useState8(null);
+    const [editing, setEditing] = useState9(null);
+    const [isDialogOpen, setDialogOpen] = useState9(false);
+    const [pendingDelete, setPendingDelete] = useState9(null);
     const viewQuery = deps.hooks.useRuntimeBuilderView(viewId);
     const state = deps.useDataTableState({ pageSize: 20 });
     const entriesQuery = deps.hooks.useBuilderViewEntries(viewId, state.query);
@@ -3428,7 +4005,7 @@ function createDynamicViewComponent(deps) {
       getRowId: (row) => row.id
     });
     if (viewQuery.isError) {
-      return /* @__PURE__ */ jsx16(
+      return /* @__PURE__ */ jsx19(
         deps.ErrorState,
         {
           title: "View \u043D\u044D\u044D\u0433\u0434\u0441\u044D\u043D\u0433\u04AF\u0439",
@@ -3436,8 +4013,8 @@ function createDynamicViewComponent(deps) {
         }
       );
     }
-    return /* @__PURE__ */ jsxs13("div", { className: "space-y-6", children: [
-      /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsxs15("div", { className: "space-y-6", children: [
+      /* @__PURE__ */ jsx19(
         deps.DataGrid,
         {
           title: view?.title ?? "Dynamic View",
@@ -3452,7 +4029,7 @@ function createDynamicViewComponent(deps) {
             setEditing(entry);
             setDialogOpen(true);
           },
-          toolbarExtra: /* @__PURE__ */ jsx16(
+          toolbarExtra: /* @__PURE__ */ jsx19(
             deps.AddButton,
             {
               disabled: !view?.form,
@@ -3464,7 +4041,7 @@ function createDynamicViewComponent(deps) {
           )
         }
       ),
-      view ? /* @__PURE__ */ jsx16(
+      view ? /* @__PURE__ */ jsx19(
         deps.EntryDialog,
         {
           open: isDialogOpen,
@@ -3475,7 +4052,7 @@ function createDynamicViewComponent(deps) {
           isSaving: save.isPending
         }
       ) : null,
-      /* @__PURE__ */ jsx16(
+      /* @__PURE__ */ jsx19(
         deps.DeleteDialog,
         {
           entry: pendingDelete,
@@ -3493,9 +4070,9 @@ function createDynamicViewComponent(deps) {
 }
 
 // src/components/RuntimeEntryDialog.tsx
-import { useEffect as useEffect6, useMemo as useMemo11, useState as useState9 } from "react";
+import { useEffect as useEffect7, useMemo as useMemo11, useRef as useRef8, useState as useState10 } from "react";
 import { FormProvider as FormProvider6, useForm as useForm7 } from "react-hook-form";
-import { jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
 function isDbTableSource(source) {
   return source?.type === "dbTable" && "tableName" in source;
 }
@@ -3519,6 +4096,12 @@ function childRowPayload(row, includeIdentity) {
     ...values
   };
 }
+function hasDraftChange(row) {
+  return row.values._delete === true || row.values._draftNew === true || row.values._draftDirty === true;
+}
+function changedChildPayloads(rows, includeIdentity) {
+  return rows.filter(hasDraftChange).filter((row) => includeIdentity || row.values._delete !== true).map((row) => childRowPayload(row, includeIdentity));
+}
 function createRuntimeEntryDialogComponent(deps) {
   return function RuntimeEntryDialog({
     open,
@@ -3528,7 +4111,8 @@ function createRuntimeEntryDialogComponent(deps) {
     onSave,
     isSaving
   }) {
-    const [draftSubforms, setDraftSubforms] = useState9({});
+    const [draftSubforms, setDraftSubforms] = useState10({});
+    const isSubmittingRef = useRef8(false);
     const compositeCreate = deps.useCreateCompositeEntry?.(view.id);
     const compositeUpdate = deps.useUpdateCompositeEntry?.(view.id);
     const form = useForm7({
@@ -3536,16 +4120,18 @@ function createRuntimeEntryDialogComponent(deps) {
       values: open ? createBuilderEntryDefaultValues(view, editing) : void 0
     });
     const mainTableName = runtimeViewTableName(view);
-    const hasDraftRows = useMemo11(
-      () => Object.values(draftSubforms).some((draft) => draft.rows.length > 0),
+    const hasDraftChanges = useMemo11(
+      () => Object.values(draftSubforms).some((draft) => draft.rows.some(hasDraftChange)),
       [draftSubforms]
     );
-    useEffect6(() => {
+    useEffect7(() => {
       if (open) setDraftSubforms({});
     }, [open]);
     const onSubmit = form.handleSubmit(async (values) => {
+      if (isSubmittingRef.current) return;
+      isSubmittingRef.current = true;
       try {
-        if (!editing && hasDraftRows) {
+        if (!editing && hasDraftChanges) {
           if (!mainTableName) throw new Error("Main form datasource table \u043E\u043B\u0434\u0441\u043E\u043D\u0433\u04AF\u0439");
           if (!compositeCreate) throw new Error("Composite create handler \u0442\u043E\u0445\u0438\u0440\u0443\u0443\u043B\u0430\u0433\u0434\u0430\u0430\u0433\u04AF\u0439 \u0431\u0430\u0439\u043D\u0430");
           await compositeCreate.mutateAsync({
@@ -3554,12 +4140,12 @@ function createRuntimeEntryDialogComponent(deps) {
               ...Object.fromEntries(
                 Object.values(draftSubforms).map((draft) => [
                   draft.dataKey,
-                  draft.rows.filter((row) => row.values._delete !== true).map((row) => childRowPayload(row, false))
+                  changedChildPayloads(draft.rows, false)
                 ])
               )
             }
           });
-        } else if (editing && hasDraftRows) {
+        } else if (editing && hasDraftChanges) {
           if (!mainTableName) throw new Error("Main form datasource table \u043E\u043B\u0434\u0441\u043E\u043D\u0433\u04AF\u0439");
           if (!compositeUpdate) throw new Error("Composite update handler \u0442\u043E\u0445\u0438\u0440\u0443\u0443\u043B\u0430\u0433\u0434\u0430\u0430\u0433\u04AF\u0439 \u0431\u0430\u0439\u043D\u0430");
           await compositeUpdate.mutateAsync({
@@ -3574,7 +4160,7 @@ function createRuntimeEntryDialogComponent(deps) {
                 ...Object.fromEntries(
                   Object.values(draftSubforms).map((draft) => [
                     draft.dataKey,
-                    draft.rows.map((row) => childRowPayload(row, true))
+                    changedChildPayloads(draft.rows, true)
                   ])
                 )
               }
@@ -3587,12 +4173,14 @@ function createRuntimeEntryDialogComponent(deps) {
         deps.notifications.success(editing ? "\u041C\u04E9\u0440 \u0445\u0430\u0434\u0433\u0430\u043B\u0430\u0433\u0434\u043B\u0430\u0430" : "\u041C\u04E9\u0440 \u043D\u044D\u043C\u044D\u0433\u0434\u043B\u044D\u044D");
       } catch (error) {
         deps.notifications.error(deps.notifications.errorMessage(error, "\u0425\u0430\u0434\u0433\u0430\u043B\u0430\u0445\u0430\u0434 \u0430\u043B\u0434\u0430\u0430 \u0433\u0430\u0440\u043B\u0430\u0430"));
+      } finally {
+        isSubmittingRef.current = false;
       }
     });
     const saving = isSaving || Boolean(compositeCreate?.isPending || compositeUpdate?.isPending);
     const extraItems = deps.SubformField && view.form?.schema.subforms?.length ? view.form.schema.subforms.map((subform) => ({
       key: subform.key,
-      render: () => deps.SubformField ? /* @__PURE__ */ jsx17(
+      render: () => deps.SubformField ? /* @__PURE__ */ jsx20(
         deps.SubformField,
         {
           subform,
@@ -3607,7 +4195,7 @@ function createRuntimeEntryDialogComponent(deps) {
         }
       ) : null
     })) : void 0;
-    return /* @__PURE__ */ jsx17(
+    return /* @__PURE__ */ jsx20(
       deps.DialogShell,
       {
         open,
@@ -3615,8 +4203,8 @@ function createRuntimeEntryDialogComponent(deps) {
         title: editing ? "\u041C\u04E9\u0440 \u0437\u0430\u0441\u0430\u0445" : "\u041C\u04E9\u0440 \u043D\u044D\u043C\u044D\u0445",
         description: view.title,
         onClose,
-        children: /* @__PURE__ */ jsx17(FormProvider6, { ...form, children: /* @__PURE__ */ jsxs14("form", { onSubmit, noValidate: true, className: deps.formClassName, children: [
-          view.form ? /* @__PURE__ */ jsx17(
+        children: /* @__PURE__ */ jsx20(FormProvider6, { ...form, children: /* @__PURE__ */ jsxs16("form", { onSubmit, noValidate: true, className: deps.formClassName, children: [
+          view.form ? /* @__PURE__ */ jsx20(
             deps.FormFields,
             {
               formId: view.form.id,
@@ -3627,7 +4215,7 @@ function createRuntimeEntryDialogComponent(deps) {
               extraItems
             }
           ) : null,
-          /* @__PURE__ */ jsx17(deps.Actions, { isSaving: saving, onClose })
+          /* @__PURE__ */ jsx20(deps.Actions, { isSaving: saving, onClose })
         ] }) })
       }
     );
@@ -3714,7 +4302,7 @@ function validateBuilderFrontendSetup(config) {
 // src/index.ts
 var builderUiPackage = {
   name: "@duke333/builder-ui",
-  version: "0.2.2"
+  version: "0.2.4"
 };
 export {
   BUILDER_EDITOR_NONE_VALUE,
@@ -3722,6 +4310,9 @@ export {
   BuilderGrid,
   BuilderProvider,
   BuilderView,
+  ReadyFileField,
+  ReadyRichTextField,
+  RichTextContent,
   builderEditorOptionsToText,
   builderEditorSearchFieldsToText,
   builderEditorTextToOptions,
@@ -3764,9 +4355,11 @@ export {
   getBuilderEditorTriggerRoute,
   nextBuilderFormLayoutGroupId,
   parseBuilderFormLayoutDragPayload,
+  richTextToPlainText,
   serializeBuilderFormLayoutDragPayload,
   shouldHandleDynamicViewRowClick,
   swapBuilderFormLayoutItems,
+  toRichTextDocument,
   useBuilderFormLayoutEditor,
   useBuilderRuntime,
   validateBuilderFrontendSetup