@firecms/core 3.1.0-canary.1df3b2c → 3.1.0-canary.8958c1b

package/dist/index.umd.js

@@ -785,7 +785,7 @@
     const defaultValues = getDefaultValuesFor(collection.properties);
     const usedValues = values ?? defaultValues;
     const usedPreviousValues = previousValues ?? values ?? defaultValues;
-    const resolvedProperties = Object.entries(collection.properties).map(([key, propertyOrBuilder]) => {
+    const resolvedProperties = Object.entries(collection.properties).filter(([, propertyOrBuilder]) => propertyOrBuilder != null).map(([key, propertyOrBuilder]) => {
       const childResolvedProperty = resolveProperty({
         propertyKey: key,
         propertyOrBuilder,
@@ -824,7 +824,7 @@
     ignoreMissingFields = false,
     ...props
   }) {
-    if (typeof propertyOrBuilder === "object" && "resolved" in propertyOrBuilder) {
+    if (propertyOrBuilder !== null && typeof propertyOrBuilder === "object" && "resolved" in propertyOrBuilder) {
       return propertyOrBuilder;
     }
     let resolvedProperty = null;
@@ -7577,7 +7577,7 @@
               } else {
                 if (property.dataType === "map") {
                   if (typeof value === "object") {
-                    content = /* @__PURE__ */ jsxRuntime.jsx(MapPropertyPreview, { ...props, property });
+                    content = /* @__PURE__ */ jsxRuntime.jsx(MapPropertyPreview, { ...props, value, property });
                   } else {
                     content = buildWrongValueType(propertyKey, property.dataType, value);
                   }
@@ -8461,7 +8461,7 @@
     const handleOpenChange = t4;
     let t5;
     if ($[11] !== disabled || $[12] !== enumValues || $[13] !== internalValue || $[14] !== multiple || $[15] !== onChange || $[16] !== renderValue || $[17] !== small || $[18] !== validValue) {
-      t5 = multiple ? /* @__PURE__ */ jsxRuntime.jsx(ui.MultiSelect, { inputRef: ref, className: "w-full h-full p-0 bg-transparent", position: "item-aligned", disabled, includeClear: false, useChips: false, value: validValue ? internalValue.map(_temp2$b) : [], onValueChange: onChange, onOpenChange: handleOpenChange, children: enumValues?.map((enumConfig) => /* @__PURE__ */ jsxRuntime.jsx(ui.MultiSelectItem, { value: String(enumConfig.id), children: /* @__PURE__ */ jsxRuntime.jsx(EnumValuesChip, { enumKey: enumConfig.id, enumValues, size: small ? "small" : "medium" }) }, enumConfig.id)) }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Select, { inputRef: ref, size: "large", fullWidth: true, className: "w-full h-full p-0 bg-transparent", inputClassName: "focus:ring-0 focus-visible:ring-0 outline-none focus:outline-none focus-visible:outline-none", position: "item-aligned", disabled, padding: false, value: validValue ? internalValue?.toString() : "", onValueChange: onChange, onOpenChange: handleOpenChange, renderValue, children: enumValues?.map((enumConfig_0) => /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: String(enumConfig_0.id), children: /* @__PURE__ */ jsxRuntime.jsx(EnumValuesChip, { enumKey: enumConfig_0.id, enumValues, size: small ? "small" : "medium" }) }, enumConfig_0.id)) });
+      t5 = multiple ? /* @__PURE__ */ jsxRuntime.jsx(ui.MultiSelect, { inputRef: ref, className: "w-full h-full p-0 bg-transparent outline-none", position: "item-aligned", disabled, includeClear: false, useChips: false, value: validValue ? internalValue.map(_temp2$b) : [], onValueChange: onChange, onOpenChange: handleOpenChange, children: enumValues?.map((enumConfig) => /* @__PURE__ */ jsxRuntime.jsx(ui.MultiSelectItem, { value: String(enumConfig.id), children: /* @__PURE__ */ jsxRuntime.jsx(EnumValuesChip, { enumKey: enumConfig.id, enumValues, size: small ? "small" : "medium" }) }, enumConfig.id)) }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Select, { inputRef: ref, size: "large", fullWidth: true, className: "w-full h-full p-0 bg-transparent outline-none [&_button]:ring-0 [&_button]:ring-offset-0", inputClassName: "ring-0 ring-offset-0 focus:ring-0 focus-visible:ring-0 outline-none focus:outline-none focus-visible:outline-none focus-visible:ring-offset-0", position: "item-aligned", disabled, padding: false, value: validValue ? internalValue?.toString() : "", onValueChange: onChange, onOpenChange: handleOpenChange, renderValue, children: enumValues?.map((enumConfig_0) => /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: String(enumConfig_0.id), children: /* @__PURE__ */ jsxRuntime.jsx(EnumValuesChip, { enumKey: enumConfig_0.id, enumValues, size: small ? "small" : "medium" }) }, enumConfig_0.id)) });
       $[11] = disabled;
       $[12] = enumValues;
       $[13] = internalValue;
@@ -9021,7 +9021,7 @@
         openPopup(cellRect);
       }
     }, []);
-    const iconRef = React.useRef();
+    const iconRef = React.useRef(void 0);
     React.useEffect(() => {
       if (iconRef.current && selected) {
         iconRef.current.focus({
@@ -12169,7 +12169,7 @@
         onColumnResize(params_0);
       }
     }, [columns, onColumnResize]);
-    const filterRef = React.useRef();
+    const filterRef = React.useRef(void 0);
     React.useEffect(() => {
       filterRef.current = filterInput;
     }, [filterInput]);
@@ -12281,7 +12281,7 @@
     return tableContent;
   }, equal);
   const SortableCellWrapper = (t0) => {
-    const $ = reactCompilerRuntime.c(15);
+    const $ = reactCompilerRuntime.c(17);
     const {
       columnKey,
       width,
@@ -12309,10 +12309,22 @@
       transform,
       transition
     } = sortable.useSortable(t2);
+    let attrsWithoutTabIndex;
+    if ($[3] !== attributes) {
+      const {
+        tabIndex: _tabIndex,
+        ...t32
+      } = attributes;
+      attrsWithoutTabIndex = t32;
+      $[3] = attributes;
+      $[4] = attrsWithoutTabIndex;
+    } else {
+      attrsWithoutTabIndex = $[4];
+    }
     const t3 = transform ? `translateX(${transform.x}px)` : void 0;
     const t4 = isDragging ? void 0 : transition;
     let t5;
-    if ($[3] !== t3 || $[4] !== t4 || $[5] !== width) {
+    if ($[5] !== t3 || $[6] !== t4 || $[7] !== width) {
       t5 = {
         transform: t3,
         transition: t4,
@@ -12320,34 +12332,34 @@
         maxWidth: width,
         width
       };
-      $[3] = t3;
-      $[4] = t4;
-      $[5] = width;
-      $[6] = t5;
+      $[5] = t3;
+      $[6] = t4;
+      $[7] = width;
+      $[8] = t5;
     } else {
-      t5 = $[6];
+      t5 = $[8];
     }
     const style = t5;
     const t6 = frozen && "sticky left-0 z-10 bg-white dark:bg-surface-950";
     let t7;
-    if ($[7] !== t6) {
+    if ($[9] !== t6) {
       t7 = ui.cls("flex-shrink-0", t6);
-      $[7] = t6;
-      $[8] = t7;
+      $[9] = t6;
+      $[10] = t7;
     } else {
-      t7 = $[8];
+      t7 = $[10];
     }
     let t8;
-    if ($[9] !== attributes || $[10] !== children || $[11] !== setNodeRef || $[12] !== style || $[13] !== t7) {
-      t8 = /* @__PURE__ */ jsxRuntime.jsx("div", { ref: setNodeRef, style, className: t7, ...attributes, children });
-      $[9] = attributes;
-      $[10] = children;
-      $[11] = setNodeRef;
-      $[12] = style;
-      $[13] = t7;
-      $[14] = t8;
+    if ($[11] !== attrsWithoutTabIndex || $[12] !== children || $[13] !== setNodeRef || $[14] !== style || $[15] !== t7) {
+      t8 = /* @__PURE__ */ jsxRuntime.jsx("div", { ref: setNodeRef, style, className: t7, ...attrsWithoutTabIndex, children });
+      $[11] = attrsWithoutTabIndex;
+      $[12] = children;
+      $[13] = setNodeRef;
+      $[14] = style;
+      $[15] = t7;
+      $[16] = t8;
     } else {
-      t8 = $[14];
+      t8 = $[16];
     }
     return t8;
   };
@@ -16250,7 +16262,7 @@
     size = "m"
   }) {
     const authController = useAuthController();
-    useAnalyticsController();
+    const analyticsController = useAnalyticsController();
     useSideEntityController();
     const customizationController = useCustomizationController();
     useNavigationController();
@@ -16277,6 +16289,10 @@
         return;
       }
       if (onClick) {
+        analyticsController.onAnalyticsEvent?.("card_view_entity_click", {
+          path: entity.path,
+          entityId: entity.id
+        });
         onClick(entity);
       }
     };
@@ -17563,7 +17579,7 @@
     return /* @__PURE__ */ jsxRuntime.jsx("div", { style, className: "py-1", "data-is-dragging": isDragging, "data-testid": item.id, onClick: handleClick, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cardClassName, children: [
       usedImageProperty && usedImageValue ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-md overflow-hidden shrink-0 mr-2", children: /* @__PURE__ */ jsxRuntime.jsx(PropertyPreview, { property: usedImageProperty, propertyKey: imagePropertyKey, size: "small", value: usedImageValue, fill: true }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-10 h-10 rounded-md bg-surface-100 dark:bg-surface-800 shrink-0 mr-2 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(IconForView, { collectionOrView: collection, color: "disabled", size: "small" }) }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-sm font-medium", children: titleProperty && titleValue ? /* @__PURE__ */ jsxRuntime.jsx(PropertyPreview, { propertyKey: titlePropertyKey, value: titleValue, property: titleProperty, size: "small" }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-surface-500", children: entity.id }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "line-clamp-2 text-sm font-medium", children: titleProperty && titleValue ? /* @__PURE__ */ jsxRuntime.jsx(PropertyPreview, { propertyKey: titlePropertyKey, value: titleValue, property: titleProperty, size: "small" }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-surface-500", children: entity.id }) }),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs text-surface-500 font-mono truncate", children: entity.id })
       ] }),
       selectionEnabled && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ml-2 shrink-0", onClick: handleCheckboxClick, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Checkbox, { checked: selected ?? false, onCheckedChange: handleSelectionChange, size: "smallest" }) })
@@ -17919,6 +17935,7 @@
     const context = useFireCMSContext();
     const dataSource = useDataSource();
     const sideEntityController = useSideEntityController();
+    const analyticsController = useAnalyticsController();
     const plugins = customizationController.plugins ?? [];
     const [showBackfillDialog, setShowBackfillDialog] = React.useState(false);
     const [backfillLoading, setBackfillLoading] = React.useState(false);
@@ -18034,6 +18051,10 @@
       return plugins.some((plugin) => plugin.collectionView?.onKanbanColumnsReorder);
     }, [plugins]);
     const handleColumnReorder = React.useCallback((newColumns) => {
+      analyticsController.onAnalyticsEvent?.("kanban_column_reorder", {
+        path: fullPath,
+        columnProperty
+      });
       setHasUserReordered(true);
       setLocalColumnsOrder(newColumns);
       plugins.filter((plugin_0) => plugin_0.collectionView?.onKanbanColumnsReorder).forEach((plugin_1) => {
@@ -18045,7 +18066,7 @@
           newColumnsOrder: newColumns
         });
       });
-    }, [plugins, fullPath, parentCollectionIds, collection, columnProperty]);
+    }, [plugins, fullPath, parentCollectionIds, collection, columnProperty, analyticsController]);
     const [missingOrderCount, setMissingOrderCount] = React.useState(0);
     const dataSourceRef = React.useRef(dataSource);
     const collectionRef = React.useRef(collection);
@@ -18157,6 +18178,12 @@
     const handleItemsReorder = React.useCallback(async (items_0, moveInfo) => {
       const entity_2 = items_0.find((item_5) => item_5.id === moveInfo?.itemId)?.entity;
       if (!entity_2) return;
+      analyticsController.onAnalyticsEvent?.("kanban_card_moved", {
+        path: fullPath,
+        entityId: entity_2.id,
+        sourceColumn: moveInfo?.sourceColumn,
+        targetColumn: moveInfo?.targetColumn
+      });
       const isColumnChange = moveInfo && moveInfo.sourceColumn !== moveInfo.targetColumn;
       if (!orderProperty && !isColumnChange) return;
       if (isColumnChange) {
@@ -18194,7 +18221,7 @@
       } catch (e_1) {
         console.error("Error saving entity:", e_1);
       }
-    }, [collection, columnProperty, orderProperty, context, dataSource, calculateNewOrder, boardDataController]);
+    }, [collection, columnProperty, orderProperty, context, dataSource, calculateNewOrder, boardDataController, analyticsController, fullPath]);
     const handleBackfill = React.useCallback(async () => {
       console.log("handleBackfill called", {
         orderProperty
@@ -18203,6 +18230,9 @@
         console.log("No orderProperty, returning");
         return;
       }
+      analyticsController.onAnalyticsEvent?.("kanban_backfill_order", {
+        path: fullPath
+      });
       setBackfillLoading(true);
       try {
         console.log("Fetching all documents from collection...");
@@ -18256,7 +18286,7 @@
       } finally {
         setBackfillLoading(false);
       }
-    }, [orderProperty, fullPath, collection, dataSource, context, boardDataController]);
+    }, [orderProperty, fullPath, collection, dataSource, context, boardDataController, analyticsController]);
     const handleEntityClick = React.useCallback((entity_5) => {
       onEntityClick?.(entity_5);
     }, [onEntityClick]);
@@ -18317,6 +18347,10 @@
         /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "text", onClick: () => setShowBackfillDialog(true), children: "Initialize Order" })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-auto no-scrollbar", children: /* @__PURE__ */ jsxRuntime.jsx(Board, { data: boardItems, columns, columnLabels, columnColors, assignColumn, allowColumnReorder, onColumnReorder: handleColumnReorder, onItemsReorder: handleItemsReorder, ItemComponent, columnLoadingState, onLoadMoreColumn: (column) => boardDataController.loadMoreColumn(column), onAddItemToColumn: (column_0) => {
+        analyticsController.onAnalyticsEvent?.("kanban_new_entity_in_column", {
+          path: fullPath,
+          column: column_0
+        });
         sideEntityController.open({
           path: fullPath,
           collection,
@@ -18341,13 +18375,13 @@
       ] })
     ] });
   }
+  const ALL_VIEW_MODES = ["table", "cards", "kanban"];
   function ViewModeToggle(t0) {
-    const $ = reactCompilerRuntime.c(42);
+    const $ = reactCompilerRuntime.c(36);
     const {
       viewMode: t1,
       onViewModeChange,
-      kanbanEnabled: t2,
-      hasKanbanConfigPlugin: t3,
+      enabledViews: t2,
       size,
       onSizeChanged,
       open,
@@ -18357,14 +18391,13 @@
       onKanbanPropertyChange
     } = t0;
     const viewMode = t1 === void 0 ? "table" : t1;
-    const kanbanEnabled = t2 === void 0 ? false : t2;
-    const hasKanbanConfigPlugin = t3 === void 0 ? false : t3;
+    const enabledViews = t2 === void 0 ? ALL_VIEW_MODES : t2;
     if (!onViewModeChange) {
       return null;
     }
-    let t4;
+    let t3;
     if ($[0] !== viewMode) {
-      t4 = () => {
+      t3 = () => {
         if (viewMode === "kanban") {
           return /* @__PURE__ */ jsxRuntime.jsx(ui.ViewKanbanIcon, { size: "small" });
         }
@@ -18374,14 +18407,14 @@
         return /* @__PURE__ */ jsxRuntime.jsx(ui.ListIcon, { size: "small" });
       };
       $[0] = viewMode;
-      $[1] = t4;
+      $[1] = t3;
     } else {
-      t4 = $[1];
+      t3 = $[1];
     }
-    const getViewModeIcon = t4;
-    let t5;
+    const getViewModeIcon = t3;
+    let t4;
     if ($[2] !== viewMode) {
-      t5 = () => {
+      t4 = () => {
         if (viewMode === "kanban") {
           return "Board";
         }
@@ -18391,177 +18424,151 @@
         return "List";
       };
       $[2] = viewMode;
-      $[3] = t5;
+      $[3] = t4;
     } else {
-      t5 = $[3];
+      t4 = $[3];
     }
-    const getViewModeName = t5;
-    const showKanban = kanbanEnabled || hasKanbanConfigPlugin;
+    const getViewModeName = t4;
     const showSizeSelector = size && onSizeChanged && (viewMode === "table" || viewMode === "cards");
     const showKanbanPropertySelector = viewMode === "kanban" && kanbanPropertyOptions && kanbanPropertyOptions.length > 0 && onKanbanPropertyChange;
+    let t5;
     let t6;
-    let t7;
     if ($[4] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
-      t7 = {
-        value: "table",
-        label: "List",
-        icon: /* @__PURE__ */ jsxRuntime.jsx(ui.ListIcon, { size: "small" })
-      };
-      $[4] = t7;
+      t6 = /* @__PURE__ */ jsxRuntime.jsx(ui.ListIcon, { size: "small" });
+      $[4] = t6;
     } else {
-      t7 = $[4];
+      t6 = $[4];
     }
-    let t8;
-    if ($[5] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
-      t8 = {
+    let t7;
+    if ($[5] !== enabledViews) {
+      const allOptions = [{
+        value: "table",
+        label: "List",
+        icon: t6
+      }, {
         value: "cards",
         label: "Cards",
         icon: /* @__PURE__ */ jsxRuntime.jsx(ui.AppsIcon, { size: "small" })
-      };
-      $[5] = t8;
+      }, {
+        value: "kanban",
+        label: "Board",
+        icon: /* @__PURE__ */ jsxRuntime.jsx(ui.ViewKanbanIcon, { size: "small" })
+      }];
+      t7 = allOptions.filter((option) => enabledViews.includes(option.value));
+      $[5] = enabledViews;
+      $[6] = t7;
     } else {
-      t8 = $[5];
+      t7 = $[6];
     }
-    let options;
-    if ($[6] !== hasKanbanConfigPlugin || $[7] !== kanbanEnabled || $[8] !== showKanban) {
-      options = [t7, t8];
-      if (showKanban) {
-        let t92;
-        if ($[10] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
-          t92 = /* @__PURE__ */ jsxRuntime.jsx(ui.ViewKanbanIcon, { size: "small" });
-          $[10] = t92;
-        } else {
-          t92 = $[10];
-        }
-        const t102 = !kanbanEnabled && !hasKanbanConfigPlugin;
-        let t112;
-        if ($[11] !== t102) {
-          t112 = {
-            value: "kanban",
-            label: "Board",
-            icon: t92,
-            disabled: t102
-          };
-          $[11] = t102;
-          $[12] = t112;
-        } else {
-          t112 = $[12];
-        }
-        options.push(t112);
-      }
-      $[6] = hasKanbanConfigPlugin;
-      $[7] = kanbanEnabled;
-      $[8] = showKanban;
-      $[9] = options;
+    t5 = t7;
+    const viewModeOptions = t5;
+    if (viewModeOptions.length <= 1 && !showSizeSelector) {
+      return null;
+    }
+    let t8;
+    if ($[7] !== getViewModeIcon) {
+      t8 = getViewModeIcon();
+      $[7] = getViewModeIcon;
+      $[8] = t8;
     } else {
-      options = $[9];
+      t8 = $[8];
     }
-    t6 = options;
-    const viewModeOptions = t6;
-    let t9;
-    if ($[13] !== getViewModeIcon) {
-      t9 = getViewModeIcon();
-      $[13] = getViewModeIcon;
-      $[14] = t9;
+    const t9 = getViewModeName();
+    let t10;
+    if ($[9] !== t9) {
+      t10 = /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 text-sm", children: t9 });
+      $[9] = t9;
+      $[10] = t10;
     } else {
-      t9 = $[14];
+      t10 = $[10];
     }
-    const t10 = getViewModeName();
     let t11;
-    if ($[15] !== t10) {
-      t11 = /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 text-sm", children: t10 });
-      $[15] = t10;
-      $[16] = t11;
+    if ($[11] !== t10 || $[12] !== t8) {
+      t11 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Button, { size: "small", children: [
+        t8,
+        t10
+      ] });
+      $[11] = t10;
+      $[12] = t8;
+      $[13] = t11;
     } else {
-      t11 = $[16];
+      t11 = $[13];
     }
     let t12;
-    if ($[17] !== t11 || $[18] !== t9) {
-      t12 = /* @__PURE__ */ jsxRuntime.jsxs(ui.Button, { size: "small", children: [
-        t9,
-        t11
-      ] });
-      $[17] = t11;
-      $[18] = t9;
-      $[19] = t12;
+    if ($[14] !== onViewModeChange || $[15] !== viewMode || $[16] !== viewModeOptions) {
+      t12 = viewModeOptions.length > 1 && /* @__PURE__ */ jsxRuntime.jsx(ui.ToggleButtonGroup, { value: viewMode, onValueChange: onViewModeChange, options: viewModeOptions });
+      $[14] = onViewModeChange;
+      $[15] = viewMode;
+      $[16] = viewModeOptions;
+      $[17] = t12;
     } else {
-      t12 = $[19];
+      t12 = $[17];
     }
     let t13;
-    if ($[20] !== onViewModeChange || $[21] !== viewMode || $[22] !== viewModeOptions) {
-      t13 = /* @__PURE__ */ jsxRuntime.jsx(ui.ToggleButtonGroup, { value: viewMode, onValueChange: onViewModeChange, options: viewModeOptions });
-      $[20] = onViewModeChange;
-      $[21] = viewMode;
-      $[22] = viewModeOptions;
-      $[23] = t13;
-    } else {
-      t13 = $[23];
-    }
-    let t14;
-    if ($[24] !== onSizeChanged || $[25] !== showSizeSelector || $[26] !== size) {
-      t14 = showSizeSelector && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row items-center justify-between gap-2", children: [
+    if ($[18] !== onSizeChanged || $[19] !== showSizeSelector || $[20] !== size) {
+      t13 = showSizeSelector && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row items-center justify-between gap-2", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-sm text-surface-600 dark:text-surface-300", children: [
           /* @__PURE__ */ jsxRuntime.jsx(ui.ViewColumnIcon, { size: "small" }),
           /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Size" })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx(ui.Select, { value: size, size: "small", className: "w-20", onValueChange: (v) => onSizeChanged?.(v), renderValue: _temp$e, children: ["xs", "s", "m", "l", "xl"].map(_temp2$5) })
       ] });
-      $[24] = onSizeChanged;
-      $[25] = showSizeSelector;
-      $[26] = size;
-      $[27] = t14;
+      $[18] = onSizeChanged;
+      $[19] = showSizeSelector;
+      $[20] = size;
+      $[21] = t13;
     } else {
-      t14 = $[27];
+      t13 = $[21];
     }
-    let t15;
-    if ($[28] !== kanbanPropertyOptions || $[29] !== onKanbanPropertyChange || $[30] !== selectedKanbanProperty || $[31] !== showKanbanPropertySelector) {
-      t15 = showKanbanPropertySelector && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row items-center justify-between gap-2", children: [
+    let t14;
+    if ($[22] !== kanbanPropertyOptions || $[23] !== onKanbanPropertyChange || $[24] !== selectedKanbanProperty || $[25] !== showKanbanPropertySelector) {
+      t14 = showKanbanPropertySelector && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-row items-center justify-between gap-2", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-sm text-surface-600 dark:text-surface-300", children: [
           /* @__PURE__ */ jsxRuntime.jsx(ui.ViewKanbanIcon, { size: "small" }),
           /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Group by" })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx(ui.Select, { value: selectedKanbanProperty, size: "small", className: "w-32", onValueChange: (v_1) => onKanbanPropertyChange?.(v_1), renderValue: (v_2) => {
-          const option = kanbanPropertyOptions?.find((o) => o.key === v_2);
-          return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium truncate", children: option?.label ?? v_2 });
+          const option_0 = kanbanPropertyOptions?.find((o) => o.key === v_2);
+          return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium truncate", children: option_0?.label ?? v_2 });
         }, children: kanbanPropertyOptions?.map(_temp3$3) })
       ] });
-      $[28] = kanbanPropertyOptions;
-      $[29] = onKanbanPropertyChange;
-      $[30] = selectedKanbanProperty;
-      $[31] = showKanbanPropertySelector;
-      $[32] = t15;
+      $[22] = kanbanPropertyOptions;
+      $[23] = onKanbanPropertyChange;
+      $[24] = selectedKanbanProperty;
+      $[25] = showKanbanPropertySelector;
+      $[26] = t14;
     } else {
-      t15 = $[32];
+      t14 = $[26];
     }
-    let t16;
-    if ($[33] !== t13 || $[34] !== t14 || $[35] !== t15) {
-      t16 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-3 flex flex-col gap-3 min-w-[240px]", children: [
+    let t15;
+    if ($[27] !== t12 || $[28] !== t13 || $[29] !== t14) {
+      t15 = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-3 flex flex-col gap-3 min-w-[240px]", children: [
+        t12,
         t13,
-        t14,
-        t15
+        t14
       ] });
-      $[33] = t13;
-      $[34] = t14;
-      $[35] = t15;
-      $[36] = t16;
+      $[27] = t12;
+      $[28] = t13;
+      $[29] = t14;
+      $[30] = t15;
     } else {
-      t16 = $[36];
+      t15 = $[30];
     }
-    let t17;
-    if ($[37] !== onOpenChange || $[38] !== open || $[39] !== t12 || $[40] !== t16) {
-      t17 = /* @__PURE__ */ jsxRuntime.jsx(ui.Popover, { open, onOpenChange, modal: true, trigger: t12, children: t16 });
-      $[37] = onOpenChange;
-      $[38] = open;
-      $[39] = t12;
-      $[40] = t16;
-      $[41] = t17;
+    let t16;
+    if ($[31] !== onOpenChange || $[32] !== open || $[33] !== t11 || $[34] !== t15) {
+      t16 = /* @__PURE__ */ jsxRuntime.jsx(ui.Popover, { open, onOpenChange, modal: true, trigger: t11, children: t15 });
+      $[31] = onOpenChange;
+      $[32] = open;
+      $[33] = t11;
+      $[34] = t15;
+      $[35] = t16;
     } else {
-      t17 = $[41];
+      t16 = $[35];
     }
-    return t17;
+    return t16;
   }
-  function _temp3$3(option_0) {
-    return /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: option_0.key, children: option_0.label }, option_0.key);
+  function _temp3$3(option_1) {
+    return /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: option_1.key, children: option_1.label }, option_1.key);
   }
   function _temp2$5(s) {
     return /* @__PURE__ */ jsxRuntime.jsx(ui.SelectItem, { value: s, className: "font-medium text-center", children: s.toUpperCase() }, s);
@@ -19508,6 +19515,7 @@
       console.error(error);
     }, [snackbarController]);
     const pluginActions = [];
+    const pluginBeforeTitle = [];
     const plugins = customizationController.plugins;
     const actionsDisabled = disabled || formex$1.isSubmitting || status === "existing" && !formex$1.dirty || Boolean(disabledProp);
     const parentCollectionIds = navigationController.getParentCollectionIds(path);
@@ -19524,6 +19532,7 @@
         disabled: actionsDisabled
       };
       pluginActions.push(...plugins.map((plugin) => plugin.form?.Actions ? /* @__PURE__ */ jsxRuntime.jsx(plugin.form.Actions, { ...actionProps }, `actions_${plugin.key}`) : null).filter(Boolean));
+      pluginBeforeTitle.push(...plugins.map((plugin_0) => plugin_0.form?.BeforeTitle ? /* @__PURE__ */ jsxRuntime.jsx(plugin_0.form.BeforeTitle, { ...actionProps }, `before_title_${plugin_0.key}`) : null).filter(Boolean));
     }
     const titlePropertyKey = getEntityTitlePropertyKey(resolvedCollection, customizationController.propertyConfigs);
     const title = (formex$1.values && titlePropertyKey ? getValueInPath(formex$1.values, titlePropertyKey) : void 0) ?? collection.singularName ?? collection.name;
@@ -19620,6 +19629,7 @@
     };
     const formRef = React.useRef(null);
     const formView = /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundary, { children: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      pluginBeforeTitle,
       !Builder && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full py-2 flex flex-col items-start my-4 lg:my-6", children: [
         /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { className: "my-4 flex-grow line-clamp-1 " + (collection.hideIdFromForm ? "mb-6" : ""), variant: "h4", children: title ?? collection.singularName ?? collection.name }),
         !entity?.values && initialStatus === "existing" && /* @__PURE__ */ jsxRuntime.jsx(ui.Alert, { color: "warning", size: "small", outerClassName: "w-full mb-4 text-xs", children: "This entity does not exist in the database" }),
@@ -21877,7 +21887,7 @@
                 index,
                 authController
               });
-              Component = configProperty.Field;
+              Component = configProperty?.Field;
             }
           }
         }
@@ -24502,13 +24512,18 @@
       });
     }, [onCollectionModifiedForUser, fullPath, userConfigPersistence]);
     const onViewModeChange = React.useCallback((mode) => {
+      analyticsController.onAnalyticsEvent?.("view_mode_changed", {
+        path: fullPath,
+        from: viewMode,
+        to: mode
+      });
       setViewMode(mode);
       if (userConfigPersistence) {
         onCollectionModifiedForUser(fullPath, {
           defaultViewMode: mode
         });
       }
-    }, [setViewMode, userConfigPersistence, onCollectionModifiedForUser, fullPath]);
+    }, [setViewMode, userConfigPersistence, onCollectionModifiedForUser, fullPath, analyticsController, viewMode]);
     const createEnabled = canCreateEntity(collection, authController, fullPath, null);
     const uniqueFieldValidator = React.useCallback(({
       name,
@@ -24562,24 +24577,26 @@
       propertyConfigs: customizationController.propertyConfigs,
       authController
     }), [collection, fullPath]);
-    const kanbanEnabled = React.useMemo(() => {
-      if (!collection.kanban?.columnProperty) return false;
-      const property_0 = getPropertyInPath(resolvedCollection.properties, collection.kanban.columnProperty);
-      if (!property_0 || !("dataType" in property_0) || property_0.dataType !== "string") return false;
-      return Boolean(property_0.enumValues);
-    }, [collection.kanban?.columnProperty, resolvedCollection.properties]);
-    const hasKanbanConfigPlugin = React.useMemo(() => {
-      return customizationController.plugins?.some((plugin_0) => plugin_0.collectionView?.KanbanSetupComponent) ?? false;
-    }, [customizationController.plugins]);
+    const hasEnumProperty = React.useMemo(() => {
+      const properties = resolvedCollection.properties;
+      return Object.values(properties).some((prop) => prop && prop.dataType === "string" && prop.enumValues);
+    }, [resolvedCollection.properties]);
+    const enabledViews = React.useMemo(() => {
+      const configured = collection.enabledViews ?? ["table", "cards", "kanban"];
+      if (!hasEnumProperty) {
+        return configured.filter((v) => v !== "kanban");
+      }
+      return configured;
+    }, [collection.enabledViews, hasEnumProperty]);
     const kanbanPropertyOptions = React.useMemo(() => {
       const options = [];
-      const properties = resolvedCollection.properties;
-      for (const [key_0, property_1] of Object.entries(properties)) {
-        const prop = property_1;
-        if (prop && prop.dataType === "string" && prop.enumValues) {
+      const properties_0 = resolvedCollection.properties;
+      for (const [key_0, property_0] of Object.entries(properties_0)) {
+        const prop_0 = property_0;
+        if (prop_0 && prop_0.dataType === "string" && prop_0.enumValues) {
           options.push({
             key: key_0,
-            label: prop.name || key_0
+            label: prop_0.name || key_0
           });
         }
       }
@@ -24607,14 +24624,18 @@
         }
       }
     }, [kanbanPropertyOptions, selectedKanbanProperty, getSavedKanbanProperty, collection.kanban?.columnProperty]);
-    const onKanbanPropertyChange = React.useCallback((property_2) => {
-      setSelectedKanbanProperty(property_2);
+    const onKanbanPropertyChange = React.useCallback((property_1) => {
+      analyticsController.onAnalyticsEvent?.("kanban_property_changed", {
+        path: fullPath,
+        property: property_1
+      });
+      setSelectedKanbanProperty(property_1);
       if (userConfigPersistence) {
         onCollectionModifiedForUser(fullPath, {
-          kanbanColumnProperty: property_2
+          kanbanColumnProperty: property_1
         });
       }
-    }, [userConfigPersistence, onCollectionModifiedForUser, fullPath]);
+    }, [userConfigPersistence, onCollectionModifiedForUser, fullPath, analyticsController]);
     const getPropertyFor = React.useCallback(({
       propertyKey: propertyKey_0,
       entity: entity_2
@@ -24726,15 +24747,15 @@
     }, [docsCount, fullPath, breadcrumbs.updateCount]);
     const countFetcher = /* @__PURE__ */ jsxRuntime.jsx(EntitiesCount, { fullPath, collection, filter: tableController.filterValues, sortBy: tableController.sortBy, onCountChange: setDocsCount });
     const buildAdditionalHeaderWidget = React.useCallback(({
-      property: property_3,
+      property: property_2,
       propertyKey: propertyKey_1,
       onHover
     }) => {
       const collection_4 = collectionRef.current;
       if (!customizationController.plugins) return null;
-      return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: customizationController.plugins.filter((plugin_1) => plugin_1.collectionView?.HeaderAction).map((plugin_2, i) => {
-        const HeaderAction = plugin_2.collectionView.HeaderAction;
-        return /* @__PURE__ */ jsxRuntime.jsx(HeaderAction, { onHover, propertyKey: propertyKey_1, property: property_3, fullPath, collection: collection_4, tableController, parentCollectionIds: parentCollectionIds ?? [] }, `plugin_header_action_${i}`);
+      return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: customizationController.plugins.filter((plugin_0) => plugin_0.collectionView?.HeaderAction).map((plugin_1, i) => {
+        const HeaderAction = plugin_1.collectionView.HeaderAction;
+        return /* @__PURE__ */ jsxRuntime.jsx(HeaderAction, { onHover, propertyKey: propertyKey_1, property: property_2, fullPath, collection: collection_4, tableController, parentCollectionIds: parentCollectionIds ?? [] }, `plugin_header_action_${i}`);
       }) });
     }, [customizationController.plugins, fullPath, parentCollectionIds]);
     const addColumnComponentInternal = AddColumnComponent ? function() {
@@ -24752,11 +24773,22 @@
       parentCollectionIds
     });
     const [viewModePopoverOpen, setViewModePopoverOpen] = React.useState(false);
-    const viewModeToggleElement = /* @__PURE__ */ jsxRuntime.jsx(ViewModeToggle, { viewMode, onViewModeChange, kanbanEnabled, hasKanbanConfigPlugin, size: viewMode === "table" ? tableSize : viewMode === "cards" ? cardSize : void 0, onSizeChanged: viewMode === "table" ? onTableSizeChanged : viewMode === "cards" ? setCardSize : void 0, open: viewModePopoverOpen, onOpenChange: setViewModePopoverOpen, kanbanPropertyOptions, selectedKanbanProperty, onKanbanPropertyChange });
+    const viewModeToggleElement = /* @__PURE__ */ jsxRuntime.jsx(ViewModeToggle, { viewMode, onViewModeChange, enabledViews, size: viewMode === "table" ? tableSize : viewMode === "cards" ? cardSize : void 0, onSizeChanged: viewMode === "table" ? onTableSizeChanged : viewMode === "cards" ? setCardSize : void 0, open: viewModePopoverOpen, onOpenChange: setViewModePopoverOpen, kanbanPropertyOptions, selectedKanbanProperty, onKanbanPropertyChange });
+    const pluginErrorView = React.useMemo(() => {
+      const error = tableController.dataLoadingError;
+      if (!error || !customizationController.plugins) return null;
+      for (const plugin_2 of customizationController.plugins) {
+        if (plugin_2.collectionView?.CollectionError) {
+          const CollectionError = plugin_2.collectionView.CollectionError;
+          return /* @__PURE__ */ jsxRuntime.jsx(CollectionError, { path: fullPath, collection, parentCollectionIds, error });
+        }
+      }
+      return null;
+    }, [tableController.dataLoadingError, customizationController.plugins, fullPath, collection, parentCollectionIds]);
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cls("overflow-hidden h-full w-full rounded-md flex flex-col", className), ref: containerRef, children: [
       countFetcher,
       /* @__PURE__ */ jsxRuntime.jsx(CollectionTableToolbar, { loading: tableController.dataLoading, onTextSearch: textSearchEnabled && textSearchInitialised ? tableController.setSearchString : void 0, onTextSearchClick: textSearchEnabled && !textSearchInitialised ? onTextSearchClick : void 0, textSearchLoading, viewModeToggle: viewModeToggleElement, actionsStart: /* @__PURE__ */ jsxRuntime.jsx(EntityCollectionViewStartActions, { parentCollectionIds: parentCollectionIds ?? [], collection, tableController, path: fullPath, relativePath: collection.path, selectionController: usedSelectionController, collectionEntitiesCount: docsCount, resolvedProperties: resolvedCollection.properties }), actions: /* @__PURE__ */ jsxRuntime.jsx(EntityCollectionViewActions, { parentCollectionIds: parentCollectionIds ?? [], collection, tableController, onMultipleDeleteClick, onNewClick, path: fullPath, relativePath: collection.path, selectionController: usedSelectionController, selectionEnabled, collectionEntitiesCount: docsCount }) }),
-      viewMode === "kanban" && (kanbanEnabled || hasKanbanConfigPlugin) ? /* @__PURE__ */ jsxRuntime.jsx(EntityCollectionBoardView, { collection, tableController, fullPath, parentCollectionIds, columnProperty: selectedKanbanProperty, onEntityClick, selectionController: usedSelectionController, selectionEnabled, highlightedEntities: highlightedEntity ? [highlightedEntity] : [], deletedEntities, emptyComponent: canCreateEntities && tableController.filterValues === void 0 && tableController.sortBy === void 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center", children: [
+      tableController.dataLoadingError && pluginErrorView ? pluginErrorView : viewMode === "kanban" && enabledViews.includes("kanban") ? /* @__PURE__ */ jsxRuntime.jsx(EntityCollectionBoardView, { collection, tableController, fullPath, parentCollectionIds, columnProperty: selectedKanbanProperty, onEntityClick, selectionController: usedSelectionController, selectionEnabled, highlightedEntities: highlightedEntity ? [highlightedEntity] : [], deletedEntities, emptyComponent: canCreateEntities && tableController.filterValues === void 0 && tableController.sortBy === void 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center", children: [
         /* @__PURE__ */ jsxRuntime.jsx(ui.Typography, { variant: "subtitle2", children: "So empty..." }),
         /* @__PURE__ */ jsxRuntime.jsxs(ui.Button, { onClick: onNewClick, className: "mt-4", children: [
           /* @__PURE__ */ jsxRuntime.jsx(ui.AddIcon, {}),
@@ -26148,10 +26180,10 @@
       navigationGroupMappings
     } = props;
     const navigate = reactRouterDom.useNavigate();
-    const collectionsRef = React.useRef();
-    const viewsRef = React.useRef();
-    const adminViewsRef = React.useRef();
-    const navigationEntriesOrderRef = React.useRef();
+    const collectionsRef = React.useRef(void 0);
+    const viewsRef = React.useRef(void 0);
+    const adminViewsRef = React.useRef(void 0);
+    const navigationEntriesOrderRef = React.useRef(void 0);
     const [initialised, setInitialised] = React.useState(false);
     const [topLevelNavigation, setTopLevelNavigation] = React.useState(void 0);
     const [navigationLoading, setNavigationLoading] = React.useState(true);
@@ -26856,7 +26888,7 @@
       t2 = $[2];
     }
     React.useEffect(t1, t2);
-    const checkedUserRef = React.useRef();
+    const checkedUserRef = React.useRef(void 0);
     let t3;
     if ($[3] !== authController || $[4] !== authenticator || $[5] !== dataSourceDelegate || $[6] !== disabled || $[7] !== storageSource) {
       t3 = async () => {
@@ -27185,13 +27217,13 @@
       status,
       values
     }) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { className: "self-center", onClick: onClose, children: /* @__PURE__ */ jsxRuntime.jsx(ui.CloseIcon, { size: "small" }) }),
-      allowFullScreen && /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { className: "self-center", onClick: () => {
+      /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { className: "self-center", size: "smallest", onClick: onClose, children: /* @__PURE__ */ jsxRuntime.jsx(ui.CloseIcon, { size: "smallest" }) }),
+      allowFullScreen && /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { className: "self-center", size: "smallest", onClick: () => {
         const key = status === "new" || status === "copy" ? path + "#new" : path + "/" + entityId;
         saveEntityToMemoryCache(key, values);
         if (entityId) navigate(location.pathname);
         else navigate(location.pathname + "#new");
-      }, children: /* @__PURE__ */ jsxRuntime.jsx(ui.OpenInFullIcon, { size: "small" }) })
+      }, children: /* @__PURE__ */ jsxRuntime.jsx(ui.OpenInFullIcon, { size: "smallest" }) })
     ] }), onTabChange: ({
       entityId: entityId_0,
       selectedTab,
@@ -28467,7 +28499,7 @@
         const orderProperty = collection_3?.orderProperty;
         if (orderProperty && (status === "new" || status === "copy")) {
           const orderProp = properties?.[orderProperty];
-          if (orderProp?.disabled === true) {
+          if (orderProp) {
             const currentValue = updatedValues[orderProperty];
             if (currentValue === void 0 || currentValue === null) {
               try {
@@ -29688,14 +29720,19 @@
         return "custom_array";
       } else if (isPropertyBuilder(of)) {
         return "repeat";
-      } else if (of?.dataType === "string" && of.enumValues) {
-        return "multi_select";
-      } else if (of?.dataType === "number" && of.enumValues) {
-        return "multi_number_select";
-      } else if (of?.dataType === "string" && of.storage) {
-        return "multi_file_upload";
-      } else if (of?.dataType === "reference") {
-        return "multi_references";
+      } else if (of) {
+        const ofProperty = of;
+        if (ofProperty.dataType === "string" && ofProperty.enumValues) {
+          return "multi_select";
+        } else if (ofProperty.dataType === "number" && ofProperty.enumValues) {
+          return "multi_number_select";
+        } else if (ofProperty.dataType === "string" && ofProperty.storage) {
+          return "multi_file_upload";
+        } else if (ofProperty.dataType === "reference") {
+          return "multi_references";
+        } else {
+          return "repeat";
+        }
       } else {
         return "repeat";
       }