@nextlyhq/plugin-form-builder 0.0.2-alpha.34 → 0.0.2-alpha.35

package/dist/TextareaFieldEditor-773G3LNM.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/admin/fields/TextareaFieldEditor.tsx"],"sourcesContent":["/**\n * Textarea Field Editor\n *\n * Editor component for configuring textarea field properties.\n * Includes general settings (label, name, placeholder, rows, required) and\n * validation options (minLength, maxLength).\n *\n * @module admin/fields/TextareaFieldEditor\n * @since 0.1.0\n */\n\n\"use client\";\n\nimport { Input } from \"@nextlyhq/ui\";\n\nimport type { TextareaFormField } from \"../../types\";\n\nimport type { FieldEditorProps } from \"./index\";\n\n// ============================================================================\n// Main Component\n// ============================================================================\n\n/**\n * TextareaFieldEditor - Configure textarea field properties\n *\n * Provides configuration options for:\n * - Label: Display text shown above the field\n * - Field Name: Key used in submission data (auto-formatted)\n * - Placeholder: Hint text shown when field is empty\n * - Help Text: Additional guidance shown below the field\n * - Rows: Number of visible text rows (height)\n * - Required: Whether the field must be filled\n * - Validation: minLength, maxLength, error message\n *\n * @example\n * ```tsx\n * <TextareaFieldEditor\n *   field={textareaField}\n *   allFields={formFields}\n *   onUpdate={(updates) => handleUpdate(updates)}\n * />\n * ```\n */\nexport function TextareaFieldEditor({\n  field,\n  onUpdate,\n}: FieldEditorProps<TextareaFormField>) {\n  // Helper to update validation properties\n  const updateValidation = (key: string, value: unknown) => {\n    onUpdate({\n      validation: {\n        ...field.validation,\n        [key]: value,\n      },\n    });\n  };\n\n  return (\n    <div className=\"textarea-field-editor\">\n      {/* General Settings Section */}\n      <div className=\"textarea-field-editor__section\">\n        <h4 className=\"textarea-field-editor__section-title\">General</h4>\n\n        {/* Label */}\n        <div className=\"textarea-field-editor__field\">\n          <label className=\"textarea-field-editor__label\" htmlFor=\"field-label\">\n            Label\n          </label>\n          <Input\n            id=\"field-label\"\n            type=\"text\"\n            value={field.label || \"\"}\n            onChange={e => onUpdate({ label: e.target.value })}\n            placeholder=\"Enter field label\"\n          />\n        </div>\n\n        {/* Field Name */}\n        <div className=\"textarea-field-editor__field\">\n          <label className=\"textarea-field-editor__label\" htmlFor=\"field-name\">\n            Field Name\n          </label>\n          <Input\n            id=\"field-name\"\n            type=\"text\"\n            value={field.name || \"\"}\n            onChange={e =>\n              onUpdate({\n                name: e.target.value\n                  .replace(/\\s+/g, \"_\")\n                  .replace(/[^a-zA-Z0-9_]/g, \"\")\n                  .toLowerCase(),\n              })\n            }\n            placeholder=\"field_name\"\n            className=\"textarea-field-editor__input--mono\"\n          />\n          <p className=\"textarea-field-editor__hint\">\n            Used as the key in submission data. Only letters, numbers, and\n            underscores.\n          </p>\n        </div>\n\n        {/* Placeholder */}\n        <div className=\"textarea-field-editor__field\">\n          <label\n            className=\"textarea-field-editor__label\"\n            htmlFor=\"field-placeholder\"\n          >\n            Placeholder\n          </label>\n          <Input\n            id=\"field-placeholder\"\n            type=\"text\"\n            value={field.placeholder || \"\"}\n            onChange={e => onUpdate({ placeholder: e.target.value })}\n            placeholder=\"Enter placeholder text\"\n          />\n        </div>\n\n        {/* Help Text */}\n        <div className=\"textarea-field-editor__field\">\n          <label className=\"textarea-field-editor__label\" htmlFor=\"field-help\">\n            Help Text\n          </label>\n          <Input\n            id=\"field-help\"\n            type=\"text\"\n            value={field.helpText || \"\"}\n            onChange={e => onUpdate({ helpText: e.target.value })}\n            placeholder=\"Additional guidance for users\"\n          />\n          <p className=\"textarea-field-editor__hint\">\n            Displayed below the field\n          </p>\n        </div>\n\n        {/* Rows */}\n        <div className=\"textarea-field-editor__field\">\n          <label className=\"textarea-field-editor__label\" htmlFor=\"field-rows\">\n            Rows\n          </label>\n          <Input\n            id=\"field-rows\"\n            type=\"number\"\n            min={2}\n            max={20}\n            value={field.rows ?? 4}\n            onChange={e =>\n              onUpdate({\n                rows: e.target.value ? parseInt(e.target.value, 10) : 4,\n              })\n            }\n            placeholder=\"4\"\n          />\n          <p className=\"textarea-field-editor__hint\">\n            Number of visible text rows (2-20)\n          </p>\n        </div>\n\n        {/* Required */}\n        <div className=\"textarea-field-editor__field textarea-field-editor__field--inline\">\n          <label className=\"textarea-field-editor__checkbox-label\">\n            <input\n              type=\"checkbox\"\n              checked={field.required || false}\n              onChange={e => onUpdate({ required: e.target.checked })}\n              className=\"textarea-field-editor__checkbox\"\n            />\n            <span>Required field</span>\n          </label>\n        </div>\n      </div>\n\n      {/* Validation Section */}\n      <div className=\"textarea-field-editor__section\">\n        <h4 className=\"textarea-field-editor__section-title\">Validation</h4>\n\n        {/* Min/Max Length */}\n        <div className=\"textarea-field-editor__field-row\">\n          <div className=\"textarea-field-editor__field textarea-field-editor__field--half\">\n            <label\n              className=\"textarea-field-editor__label\"\n              htmlFor=\"field-minlength\"\n            >\n              Min Length\n            </label>\n            <Input\n              id=\"field-minlength\"\n              type=\"number\"\n              min={0}\n              value={field.validation?.minLength ?? \"\"}\n              onChange={e =>\n                updateValidation(\n                  \"minLength\",\n                  e.target.value ? parseInt(e.target.value, 10) : undefined\n                )\n              }\n              placeholder=\"0\"\n            />\n          </div>\n          <div className=\"textarea-field-editor__field textarea-field-editor__field--half\">\n            <label\n              className=\"textarea-field-editor__label\"\n              htmlFor=\"field-maxlength\"\n            >\n              Max Length\n            </label>\n            <Input\n              id=\"field-maxlength\"\n              type=\"number\"\n              min={0}\n              value={field.validation?.maxLength ?? \"\"}\n              onChange={e =>\n                updateValidation(\n                  \"maxLength\",\n                  e.target.value ? parseInt(e.target.value, 10) : undefined\n                )\n              }\n              placeholder=\"No limit\"\n            />\n          </div>\n        </div>\n\n        {/* Error Message */}\n        <div className=\"textarea-field-editor__field\">\n          <label className=\"textarea-field-editor__label\" htmlFor=\"field-error\">\n            Error Message\n          </label>\n          <Input\n            id=\"field-error\"\n            type=\"text\"\n            value={field.validation?.errorMessage || \"\"}\n            onChange={e =>\n              updateValidation(\"errorMessage\", e.target.value || undefined)\n            }\n            placeholder=\"Please enter a valid value\"\n          />\n          <p className=\"textarea-field-editor__hint\">\n            Custom message shown when validation fails\n          </p>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport default TextareaFieldEditor;\n"],"mappings":"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","names":[]}

package/dist/admin/index.css

@@ -1,91 +0,0 @@
-/* src/styles/form-builder.css */
-.fb-builder-panel {
-  width: 360px;
-}
-@container content (max-width: 800px) {
-  .fb-builder-shell {
-    flex-direction: column;
-  }
-  .fb-builder-panel {
-    width: 100%;
-    border-left: 0;
-    border-top: 1px solid var(--border);
-  }
-}
-.form-notifications-tab {
-  max-width: 800px;
-}
-.form-notifications-list {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-}
-.form-integration-card {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 16px;
-  padding: 14px 16px;
-  background: var(--card);
-  border: 1px solid var(--border);
-  border-radius: var(--radius);
-  transition: border-color 0.15s ease;
-}
-.form-integration-card:hover {
-  border-color: var(--border-strong);
-}
-.form-integration-card--disabled {
-  opacity: 0.55;
-}
-.form-integration-card-left {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  flex: 1;
-  min-width: 0;
-}
-.form-integration-card-info {
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-  min-width: 0;
-}
-.form-integration-card-name {
-  font-size: 0.9375rem;
-  font-weight: 600;
-  color: var(--foreground);
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-.form-integration-provider-badge {
-  font-size: 0.75rem;
-  color: var(--muted-foreground);
-}
-.form-integration-card-actions {
-  display: flex;
-  gap: 8px;
-  flex-shrink: 0;
-}
-.form-integration-btn {
-  padding: 6px 12px;
-  font-size: 0.75rem;
-  font-weight: 500;
-  color: var(--muted-foreground);
-  background: transparent;
-  border: 1px solid var(--border);
-  border-radius: var(--radius);
-  cursor: pointer;
-  transition: all 0.15s ease;
-}
-.form-integration-btn--edit:hover {
-  color: var(--primary);
-  border-color: var(--primary);
-  background: color-mix(in srgb, var(--primary) 10%, transparent);
-}
-.form-integration-btn--delete:hover {
-  color: var(--destructive);
-  border-color: var(--destructive);
-  background: color-mix(in srgb, var(--destructive) 10%, transparent);
-}
-/*# sourceMappingURL=index.css.map */

package/dist/admin/index.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/styles/form-builder.css"],"sourcesContent":["/**\n * Form Builder styles\n *\n * The builder UI is driven by Tailwind utilities and @nextlyhq/ui components in its\n * React components. This file holds only the few bespoke rules those can't express:\n *   1. The two-pane builder shell (fixed inspector panel; stacks in a narrow panel)\n *   2. Notifications tab: email-integration card list (hover/variant states)\n *\n * Colors read the admin design tokens directly (`var(--token)`), so the UI looks native\n * and inherits dark mode automatically (the admin flips the tokens under `.adminapp.dark`).\n *\n * @module styles/form-builder\n * @since 0.1.0\n */\n\n/* ---------------------------------------------------------- builder shell */\n\n/* Fixed-width inspector panel beside the fluid canvas. */\n.fb-builder-panel {\n  width: 360px;\n}\n\n/* Stack the canvas and inspector when the content panel itself gets narrow\n   (`content` is the admin content-area container). */\n@container content (max-width: 800px) {\n  .fb-builder-shell {\n    flex-direction: column;\n  }\n\n  .fb-builder-panel {\n    width: 100%;\n    border-left: 0;\n    border-top: 1px solid var(--border);\n  }\n}\n\n/* ------------------------------------------------------- notifications tab */\n\n.form-notifications-tab {\n  max-width: 800px;\n}\n\n.form-notifications-list {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n\n/* --------------------------------------------------- email integration cards */\n\n.form-integration-card {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 16px;\n  padding: 14px 16px;\n  background: var(--card);\n  border: 1px solid var(--border);\n  border-radius: var(--radius);\n  transition: border-color 0.15s ease;\n}\n\n.form-integration-card:hover {\n  border-color: var(--border-strong);\n}\n\n.form-integration-card--disabled {\n  opacity: 0.55;\n}\n\n.form-integration-card-left {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n  min-width: 0;\n}\n\n.form-integration-card-info {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  min-width: 0;\n}\n\n.form-integration-card-name {\n  font-size: 0.9375rem;\n  font-weight: 600;\n  color: var(--foreground);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.form-integration-provider-badge {\n  font-size: 0.75rem;\n  color: var(--muted-foreground);\n}\n\n.form-integration-card-actions {\n  display: flex;\n  gap: 8px;\n  flex-shrink: 0;\n}\n\n.form-integration-btn {\n  padding: 6px 12px;\n  font-size: 0.75rem;\n  font-weight: 500;\n  color: var(--muted-foreground);\n  background: transparent;\n  border: 1px solid var(--border);\n  border-radius: var(--radius);\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n\n.form-integration-btn--edit:hover {\n  color: var(--primary);\n  border-color: var(--primary);\n  background: color-mix(in srgb, var(--primary) 10%, transparent);\n}\n\n.form-integration-btn--delete:hover {\n  color: var(--destructive);\n  border-color: var(--destructive);\n  background: color-mix(in srgb, var(--destructive) 10%, transparent);\n}\n"],"mappings":";AAkBA,CAAC;AACC,SAAO;AACT;AAIA,WAAW,QAAQ,CAAC,SAAS,EAAE;AAC7B,GAAC;AACC,oBAAgB;AAClB;AAEA,GAXD;AAYG,WAAO;AACP,iBAAa;AACb,gBAAY,IAAI,MAAM,IAAI;AAC5B;AACF;AAIA,CAAC;AACC,aAAW;AACb;AAEA,CAAC;AACC,WAAS;AACT,kBAAgB;AAChB,OAAK;AACP;AAIA,CAAC;AACC,WAAS;AACT,eAAa;AACb,mBAAiB;AACjB,OAAK;AACL,WAAS,KAAK;AACd,cAAY,IAAI;AAChB,UAAQ,IAAI,MAAM,IAAI;AACtB,iBAAe,IAAI;AACnB,cAAY,aAAa,MAAM;AACjC;AAEA,CAZC,qBAYqB;AACpB,gBAAc,IAAI;AACpB;AAEA,CAAC;AACC,WAAS;AACX;AAEA,CAAC;AACC,WAAS;AACT,eAAa;AACb,OAAK;AACL,QAAM;AACN,aAAW;AACb;AAEA,CAAC;AACC,WAAS;AACT,kBAAgB;AAChB,OAAK;AACL,aAAW;AACb;AAEA,CAAC;AACC,aAAW;AACX,eAAa;AACb,SAAO,IAAI;AACX,eAAa;AACb,YAAU;AACV,iBAAe;AACjB;AAEA,CAAC;AACC,aAAW;AACX,SAAO,IAAI;AACb;AAEA,CAAC;AACC,WAAS;AACT,OAAK;AACL,eAAa;AACf;AAEA,CAAC;AACC,WAAS,IAAI;AACb,aAAW;AACX,eAAa;AACb,SAAO,IAAI;AACX,cAAY;AACZ,UAAQ,IAAI,MAAM,IAAI;AACtB,iBAAe,IAAI;AACnB,UAAQ;AACR,cAAY,IAAI,MAAM;AACxB;AAEA,CAAC,0BAA0B;AACzB,SAAO,IAAI;AACX,gBAAc,IAAI;AAClB,cAAY,UAAU,GAAG,IAAI,EAAE,IAAI,WAAW,GAAG,EAAE;AACrD;AAEA,CAAC,4BAA4B;AAC3B,SAAO,IAAI;AACX,gBAAc,IAAI;AAClB,cAAY,UAAU,GAAG,IAAI,EAAE,IAAI,eAAe,GAAG,EAAE;AACzD;","names":[]}

package/dist/chunk-2LLUO3TV.js

@@ -1,547 +0,0 @@
-// src/components/submissions/SubmissionList.tsx
-import { DataTableView } from "@nextlyhq/plugin-sdk/admin";
-import { useState, useCallback, useMemo } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-function formatValue(value) {
-  if (value === null || value === void 0) return "-";
-  if (Array.isArray(value)) return value.join(", ");
-  if (typeof value === "boolean") return value ? "Yes" : "No";
-  if (value instanceof Date) return value.toLocaleDateString();
-  let str;
-  if (typeof value === "object") {
-    str = JSON.stringify(value);
-  } else {
-    str = String(value);
-  }
-  return str.length > 50 ? str.slice(0, 50) + "..." : str;
-}
-function formatDate(date) {
-  const d = typeof date === "string" ? new Date(date) : date;
-  return d.toLocaleString();
-}
-function SubmissionList({
-  form,
-  submissions,
-  isLoading = false,
-  onStatusChange,
-  onDelete,
-  onBulkDelete,
-  onBulkStatusChange,
-  onExport,
-  onViewDetail
-}) {
-  const [selectedIds, setSelectedIds] = useState(/* @__PURE__ */ new Set());
-  const [filter, setFilter] = useState("all");
-  const [processingIds, setProcessingIds] = useState(/* @__PURE__ */ new Set());
-  const displayFields = useMemo(() => {
-    return form.fields.filter((f) => f.type !== "hidden").slice(0, 3);
-  }, [form.fields]);
-  const filteredSubmissions = useMemo(() => {
-    if (filter === "all") return submissions;
-    return submissions.filter((sub) => sub.status === filter);
-  }, [submissions, filter]);
-  const someSelected = selectedIds.size > 0;
-  const toggleSelect = useCallback((id) => {
-    setSelectedIds((prev) => {
-      const next = new Set(prev);
-      if (next.has(id)) {
-        next.delete(id);
-      } else {
-        next.add(id);
-      }
-      return next;
-    });
-  }, []);
-  const handleStatusChange = useCallback(
-    async (id, status) => {
-      if (!onStatusChange) return;
-      setProcessingIds((prev) => new Set(prev).add(id));
-      try {
-        await onStatusChange(id, status);
-      } finally {
-        setProcessingIds((prev) => {
-          const next = new Set(prev);
-          next.delete(id);
-          return next;
-        });
-      }
-    },
-    [onStatusChange]
-  );
-  const handleDelete = useCallback(
-    async (id) => {
-      if (!onDelete) return;
-      if (!window.confirm("Are you sure you want to delete this submission?")) {
-        return;
-      }
-      setProcessingIds((prev) => new Set(prev).add(id));
-      try {
-        await onDelete(id);
-        setSelectedIds((prev) => {
-          const next = new Set(prev);
-          next.delete(id);
-          return next;
-        });
-      } finally {
-        setProcessingIds((prev) => {
-          const next = new Set(prev);
-          next.delete(id);
-          return next;
-        });
-      }
-    },
-    [onDelete]
-  );
-  const handleBulkDelete = useCallback(async () => {
-    if (!onBulkDelete || selectedIds.size === 0) return;
-    if (!window.confirm(
-      `Are you sure you want to delete ${selectedIds.size} submission(s)?`
-    )) {
-      return;
-    }
-    const ids = Array.from(selectedIds);
-    ids.forEach((id) => setProcessingIds((prev) => new Set(prev).add(id)));
-    try {
-      await onBulkDelete(ids);
-      setSelectedIds(/* @__PURE__ */ new Set());
-    } finally {
-      setProcessingIds(/* @__PURE__ */ new Set());
-    }
-  }, [onBulkDelete, selectedIds]);
-  const handleBulkStatusChange = useCallback(
-    async (status) => {
-      if (!onBulkStatusChange || selectedIds.size === 0) return;
-      const ids = Array.from(selectedIds);
-      ids.forEach((id) => setProcessingIds((prev) => new Set(prev).add(id)));
-      try {
-        await onBulkStatusChange(ids, status);
-        setSelectedIds(/* @__PURE__ */ new Set());
-      } finally {
-        setProcessingIds(/* @__PURE__ */ new Set());
-      }
-    },
-    [onBulkStatusChange, selectedIds]
-  );
-  const columns = useMemo(() => {
-    const base = [
-      {
-        name: "id",
-        header: "ID",
-        cell: ({ row }) => /* @__PURE__ */ jsxs("code", { className: "font-mono text-xs text-muted-foreground", children: [
-          row.id.slice(0, 8),
-          "..."
-        ] })
-      },
-      {
-        name: "status",
-        header: "Status",
-        cell: ({ row }) => /* @__PURE__ */ jsx("span", { className: "inline-flex items-center rounded-none border border-border bg-muted px-2 py-0.5 text-[11px] font-medium capitalize text-foreground", children: row.status })
-      },
-      {
-        name: "submittedAt",
-        header: "Submitted",
-        hideOnMobile: true,
-        cell: ({ row }) => /* @__PURE__ */ jsx("span", { className: "whitespace-nowrap text-sm text-muted-foreground", children: formatDate(row.submittedAt) })
-      }
-    ];
-    const fieldColumns = displayFields.map(
-      (field) => ({
-        name: `field:${field.name}`,
-        header: field.label,
-        hideOnMobile: true,
-        cell: ({ row }) => /* @__PURE__ */ jsx("span", { className: "text-sm", children: formatValue(row.data[field.name]) })
-      })
-    );
-    return [...base, ...fieldColumns];
-  }, [displayFields]);
-  const selection = useMemo(
-    () => ({
-      selectedIds: Array.from(selectedIds),
-      onToggle: (submission) => toggleSelect(submission.id),
-      onToggleAll: (rows, allChecked) => {
-        const ids = rows.map((r) => r.id);
-        setSelectedIds((prev) => {
-          const next = new Set(prev);
-          if (allChecked) ids.forEach((id) => next.delete(id));
-          else ids.forEach((id) => next.add(id));
-          return next;
-        });
-      }
-    }),
-    [selectedIds, toggleSelect]
-  );
-  const rowActions = useCallback(() => {
-    const actions = [];
-    if (onStatusChange) {
-      actions.push(
-        {
-          id: "mark-read",
-          label: "Mark Read",
-          isVisible: (r) => r.status !== "read",
-          isDisabled: (r) => processingIds.has(r.id),
-          onSelect: (r) => void handleStatusChange(r.id, "read")
-        },
-        {
-          id: "archive",
-          label: "Archive",
-          isVisible: (r) => r.status !== "archived",
-          isDisabled: (r) => processingIds.has(r.id),
-          onSelect: (r) => void handleStatusChange(r.id, "archived")
-        }
-      );
-    }
-    if (onDelete) {
-      actions.push({
-        id: "delete",
-        label: "Delete",
-        destructive: true,
-        isDisabled: (r) => processingIds.has(r.id),
-        onSelect: (r) => void handleDelete(r.id)
-      });
-    }
-    return actions;
-  }, [
-    onStatusChange,
-    onDelete,
-    processingIds,
-    handleStatusChange,
-    handleDelete
-  ]);
-  return /* @__PURE__ */ jsxs("div", { className: "submission-list", children: [
-    /* @__PURE__ */ jsxs("div", { className: "submission-list__toolbar", children: [
-      /* @__PURE__ */ jsx("div", { className: "submission-list__filters", children: /* @__PURE__ */ jsxs(
-        "select",
-        {
-          value: filter,
-          onChange: (e) => setFilter(e.target.value),
-          className: "submission-list__filter-select",
-          "aria-label": "Filter by status",
-          children: [
-            /* @__PURE__ */ jsxs("option", { value: "all", children: [
-              "All Submissions (",
-              submissions.length,
-              ")"
-            ] }),
-            /* @__PURE__ */ jsxs("option", { value: "new", children: [
-              "New (",
-              submissions.filter((s) => s.status === "new").length,
-              ")"
-            ] }),
-            /* @__PURE__ */ jsxs("option", { value: "read", children: [
-              "Read (",
-              submissions.filter((s) => s.status === "read").length,
-              ")"
-            ] }),
-            /* @__PURE__ */ jsxs("option", { value: "archived", children: [
-              "Archived (",
-              submissions.filter((s) => s.status === "archived").length,
-              ")"
-            ] })
-          ]
-        }
-      ) }),
-      /* @__PURE__ */ jsxs("div", { className: "submission-list__actions", children: [
-        someSelected && /* @__PURE__ */ jsxs("div", { className: "submission-list__bulk-actions", children: [
-          /* @__PURE__ */ jsxs("span", { className: "submission-list__selected-count", children: [
-            selectedIds.size,
-            " selected"
-          ] }),
-          onBulkStatusChange && /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(
-              "button",
-              {
-                type: "button",
-                onClick: () => void handleBulkStatusChange("read"),
-                className: "submission-list__action-btn",
-                children: "Mark Read"
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              "button",
-              {
-                type: "button",
-                onClick: () => void handleBulkStatusChange("archived"),
-                className: "submission-list__action-btn",
-                children: "Archive"
-              }
-            )
-          ] }),
-          onBulkDelete && /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              onClick: () => void handleBulkDelete(),
-              className: "submission-list__action-btn submission-list__action-btn--danger",
-              children: "Delete"
-            }
-          )
-        ] }),
-        onExport && /* @__PURE__ */ jsxs("div", { className: "submission-list__export-actions", children: [
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              onClick: () => onExport("csv"),
-              className: "submission-list__export-btn",
-              children: "Export CSV"
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              onClick: () => onExport("json"),
-              className: "submission-list__export-btn",
-              children: "Export JSON"
-            }
-          )
-        ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx(
-      DataTableView,
-      {
-        columns,
-        rows: filteredSubmissions,
-        loading: isLoading,
-        selection,
-        rowActions,
-        onRowClick: onViewDetail ? (submission) => onViewDetail(submission) : void 0,
-        registryKey: "form-submissions",
-        ariaLabel: "Form submissions table",
-        emptyMessage: "No submissions found"
-      }
-    ),
-    /* @__PURE__ */ jsxs("div", { className: "submission-list__summary", children: [
-      "Showing ",
-      filteredSubmissions.length,
-      " of ",
-      submissions.length,
-      " submissions"
-    ] })
-  ] });
-}
-
-// src/components/submissions/SubmissionDetail.tsx
-import { useState as useState2, useCallback as useCallback2 } from "react";
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-function safeString(value) {
-  if (typeof value === "object" && value !== null) {
-    return JSON.stringify(value);
-  }
-  return String(value);
-}
-function formatFieldValue(value, field) {
-  if (value === null || value === void 0) return "-";
-  switch (field.type) {
-    case "checkbox":
-      return value ? "Yes" : "No";
-    case "select":
-      if (Array.isArray(value)) {
-        return value.join(", ");
-      }
-      return safeString(value);
-    case "file":
-      if (Array.isArray(value)) {
-        return value.map((v) => safeString(v)).join(", ");
-      }
-      return safeString(value);
-    case "date":
-      if (value instanceof Date) {
-        return value.toLocaleDateString();
-      }
-      if (typeof value === "string") {
-        return new Date(value).toLocaleDateString();
-      }
-      return safeString(value);
-    case "time":
-      return safeString(value);
-    default:
-      return safeString(value);
-  }
-}
-function formatDate2(date) {
-  const d = typeof date === "string" ? new Date(date) : date;
-  return d.toLocaleString();
-}
-var STATUS_OPTIONS = [
-  { value: "new", label: "New" },
-  { value: "read", label: "Read" },
-  { value: "archived", label: "Archived" }
-];
-function SubmissionDetail({
-  form,
-  submission,
-  onStatusChange,
-  onNotesUpdate,
-  onBack,
-  onDelete
-}) {
-  const [isProcessing, setIsProcessing] = useState2(false);
-  const [notes, setNotes] = useState2(
-    submission.notes || ""
-  );
-  const [notesModified, setNotesModified] = useState2(false);
-  const handleStatusChange = useCallback2(
-    async (event) => {
-      if (!onStatusChange) return;
-      const newStatus = event.target.value;
-      setIsProcessing(true);
-      try {
-        await onStatusChange(newStatus);
-      } finally {
-        setIsProcessing(false);
-      }
-    },
-    [onStatusChange]
-  );
-  const handleNotesChange = useCallback2(
-    (event) => {
-      setNotes(event.target.value);
-      setNotesModified(true);
-    },
-    []
-  );
-  const handleNotesSave = useCallback2(async () => {
-    if (!onNotesUpdate || !notesModified) return;
-    setIsProcessing(true);
-    try {
-      await onNotesUpdate(notes);
-      setNotesModified(false);
-    } finally {
-      setIsProcessing(false);
-    }
-  }, [onNotesUpdate, notes, notesModified]);
-  const handleDelete = useCallback2(async () => {
-    if (!onDelete) return;
-    if (!window.confirm("Are you sure you want to delete this submission?")) {
-      return;
-    }
-    setIsProcessing(true);
-    try {
-      await onDelete();
-    } finally {
-      setIsProcessing(false);
-    }
-  }, [onDelete]);
-  const displayFields = form.fields;
-  const data = submission.data;
-  return /* @__PURE__ */ jsxs2("div", { className: "submission-detail", children: [
-    /* @__PURE__ */ jsxs2("div", { className: "submission-detail__header", children: [
-      /* @__PURE__ */ jsxs2("div", { className: "submission-detail__header-left", children: [
-        onBack && /* @__PURE__ */ jsx2(
-          "button",
-          {
-            type: "button",
-            onClick: onBack,
-            className: "submission-detail__back-btn",
-            disabled: isProcessing,
-            children: "\u2190 Back to List"
-          }
-        ),
-        /* @__PURE__ */ jsx2("h2", { className: "submission-detail__title", children: "Submission Details" })
-      ] }),
-      /* @__PURE__ */ jsxs2("div", { className: "submission-detail__header-right", children: [
-        onStatusChange && /* @__PURE__ */ jsxs2("div", { className: "submission-detail__status-control", children: [
-          /* @__PURE__ */ jsx2("label", { htmlFor: "submission-status", children: "Status:" }),
-          /* @__PURE__ */ jsx2(
-            "select",
-            {
-              id: "submission-status",
-              value: submission.status,
-              onChange: (e) => void handleStatusChange(e),
-              disabled: isProcessing,
-              className: "submission-detail__status-select",
-              children: STATUS_OPTIONS.map((option) => /* @__PURE__ */ jsx2("option", { value: option.value, children: option.label }, option.value))
-            }
-          )
-        ] }),
-        onDelete && /* @__PURE__ */ jsx2(
-          "button",
-          {
-            type: "button",
-            onClick: () => void handleDelete(),
-            disabled: isProcessing,
-            className: "submission-detail__delete-btn",
-            children: "Delete"
-          }
-        )
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxs2("div", { className: "submission-detail__id", children: [
-      /* @__PURE__ */ jsx2("span", { className: "submission-detail__id-label", children: "Submission ID:" }),
-      /* @__PURE__ */ jsx2("code", { className: "submission-detail__id-value", children: submission.id })
-    ] }),
-    /* @__PURE__ */ jsxs2("div", { className: "submission-detail__section", children: [
-      /* @__PURE__ */ jsx2("h3", { className: "submission-detail__section-title", children: "Submitted Data" }),
-      /* @__PURE__ */ jsxs2("div", { className: "submission-detail__fields", children: [
-        displayFields.map((field) => /* @__PURE__ */ jsxs2("div", { className: "submission-detail__field", children: [
-          /* @__PURE__ */ jsx2("div", { className: "submission-detail__field-label", children: field.label }),
-          /* @__PURE__ */ jsx2("div", { className: "submission-detail__field-value", children: formatFieldValue(data[field.name], field) })
-        ] }, field.name)),
-        displayFields.length === 0 && /* @__PURE__ */ jsx2("div", { className: "submission-detail__empty", children: "No fields to display" })
-      ] })
-    ] }),
-    onNotesUpdate && /* @__PURE__ */ jsxs2("div", { className: "submission-detail__section", children: [
-      /* @__PURE__ */ jsx2("h3", { className: "submission-detail__section-title", children: "Internal Notes" }),
-      /* @__PURE__ */ jsxs2("div", { className: "submission-detail__notes", children: [
-        /* @__PURE__ */ jsx2(
-          "textarea",
-          {
-            value: notes,
-            onChange: handleNotesChange,
-            placeholder: "Add internal notes about this submission...",
-            disabled: isProcessing,
-            className: "submission-detail__notes-textarea",
-            rows: 4
-          }
-        ),
-        notesModified && /* @__PURE__ */ jsx2(
-          "button",
-          {
-            type: "button",
-            onClick: () => void handleNotesSave(),
-            disabled: isProcessing,
-            className: "submission-detail__notes-save-btn",
-            children: "Save Notes"
-          }
-        )
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxs2("div", { className: "submission-detail__section", children: [
-      /* @__PURE__ */ jsx2("h3", { className: "submission-detail__section-title", children: "Metadata" }),
-      /* @__PURE__ */ jsxs2("div", { className: "submission-detail__metadata", children: [
-        /* @__PURE__ */ jsxs2("div", { className: "submission-detail__metadata-item", children: [
-          /* @__PURE__ */ jsx2("span", { className: "submission-detail__metadata-label", children: "Submitted At:" }),
-          /* @__PURE__ */ jsx2("span", { className: "submission-detail__metadata-value", children: formatDate2(submission.submittedAt) })
-        ] }),
-        submission.ipAddress && /* @__PURE__ */ jsxs2("div", { className: "submission-detail__metadata-item", children: [
-          /* @__PURE__ */ jsx2("span", { className: "submission-detail__metadata-label", children: "IP Address:" }),
-          /* @__PURE__ */ jsx2("span", { className: "submission-detail__metadata-value", children: /* @__PURE__ */ jsx2("code", { children: submission.ipAddress }) })
-        ] }),
-        submission.userAgent && /* @__PURE__ */ jsxs2("div", { className: "submission-detail__metadata-item", children: [
-          /* @__PURE__ */ jsx2("span", { className: "submission-detail__metadata-label", children: "User Agent:" }),
-          /* @__PURE__ */ jsx2("span", { className: "submission-detail__metadata-value submission-detail__metadata-value--truncate", children: submission.userAgent })
-        ] }),
-        /* @__PURE__ */ jsxs2("div", { className: "submission-detail__metadata-item", children: [
-          /* @__PURE__ */ jsx2("span", { className: "submission-detail__metadata-label", children: "Created At:" }),
-          /* @__PURE__ */ jsx2("span", { className: "submission-detail__metadata-value", children: formatDate2(submission.createdAt) })
-        ] }),
-        /* @__PURE__ */ jsxs2("div", { className: "submission-detail__metadata-item", children: [
-          /* @__PURE__ */ jsx2("span", { className: "submission-detail__metadata-label", children: "Updated At:" }),
-          /* @__PURE__ */ jsx2("span", { className: "submission-detail__metadata-value", children: formatDate2(submission.updatedAt) })
-        ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxs2("details", { className: "submission-detail__raw-data", children: [
-      /* @__PURE__ */ jsx2("summary", { className: "submission-detail__raw-data-summary", children: "View Raw JSON Data" }),
-      /* @__PURE__ */ jsx2("pre", { className: "submission-detail__raw-data-content", children: JSON.stringify(submission.data, null, 2) })
-    ] })
-  ] });
-}
-
-export {
-  SubmissionList,
-  SubmissionDetail
-};
-//# sourceMappingURL=chunk-2LLUO3TV.js.map