@firecms/core 3.0.0-canary.103 → 3.0.0-canary.105

package/dist/index.es.js

@@ -4,7 +4,7 @@ import React__default, { useRef, useEffect, useContext, useCallback, useMemo, us
 import { SnackbarProvider as SnackbarProvider$1, useSnackbar } from "notistack";
 import hash from "object-hash";
 import { useCreateFormex, Formex, setIn, Field, getIn, useFormex } from "@firecms/formex";
-import { getColorSchemeForSeed, CHIP_COLORS, Tooltip, ErrorIcon, Typography, CircleIcon, FunctionsIcon, iconKeys, coolIconKeys, Icon, IconButton, ContentCopyIcon, OpenInNewIcon, DescriptionIcon, cls, Skeleton, Chip, defaultBorderMixin, KeyboardTabIcon, Checkbox, Markdown, TextareaAutosize, MultiSelect, MultiSelectItem, Select, SelectItem, BooleanSwitch, DateTimeField, paperMixin, ErrorOutlineIcon, EditIcon, Button, RemoveCircleIcon, Menu, MoreVertIcon, MenuItem, CircularProgress, SearchBar, Badge, ArrowUpwardIcon, Popover, FilterListIcon, AssignmentIcon, CenteredView, Label, TextField, ClearIcon, BooleanSwitchWithLabel, useOutsideAlerter, Dialog, DialogContent, DialogActions, FileCopyIcon, ArchiveIcon, DeleteIcon, AddIcon, ExpandablePanel, Card, ArrowForwardIcon, cardMixin, cardClickableMixin, focusedMixin, StarIcon, StarBorderIcon, Collapse, Container, FilterListOffIcon, SearchIcon, LoadingButton, Avatar, DarkModeIcon, LightModeIcon, LogoutIcon, fieldBackgroundHoverMixin, HandleIcon, RemoveIcon, debounce, InfoIcon, CloseIcon, fieldBackgroundMixin, fieldBackgroundDisabledMixin, ArrowDropDownIcon, Paper, ShortTextIcon, SubjectIcon, FormatQuoteIcon, HttpIcon, EmailIcon, FlagIcon, ListIcon, ListAltIcon, NumbersIcon, FormatListNumberedIcon, UploadFileIcon, DriveFolderUploadIcon, LinkIcon, AddLinkIcon, ScheduleIcon, BallotIcon, RepeatIcon, ViewStreamIcon, NotesIcon, Tab, Tabs, Alert, Sheet, useLocaleConfig, MenuIcon, ChevronLeftIcon } from "@firecms/ui";
+import { getColorSchemeForSeed, CHIP_COLORS, Tooltip, ErrorIcon, Typography, CircleIcon, FunctionsIcon, iconKeys, coolIconKeys, Icon, IconButton, ContentCopyIcon, OpenInNewIcon, DescriptionIcon, cls, Skeleton, Chip, defaultBorderMixin, KeyboardTabIcon, Checkbox, Markdown, TextareaAutosize, MultiSelect, MultiSelectItem, Select, SelectItem, BooleanSwitch, DateTimeField, paperMixin, ErrorOutlineIcon, EditIcon, RemoveCircleIcon, Menu, MoreVertIcon, MenuItem, CircularProgress, SearchBar, Badge, ArrowUpwardIcon, Popover, FilterListIcon, Button, AssignmentIcon, CenteredView, Label, TextField, ClearIcon, BooleanSwitchWithLabel, useOutsideAlerter, Dialog, DialogContent, DialogActions, FileCopyIcon, ArchiveIcon, DeleteIcon, AddIcon, ExpandablePanel, Card, ArrowForwardIcon, cardMixin, cardClickableMixin, focusedMixin, StarIcon, StarBorderIcon, Collapse, Container, FilterListOffIcon, SearchIcon, LoadingButton, Avatar, DarkModeIcon, LightModeIcon, LogoutIcon, fieldBackgroundHoverMixin, HandleIcon, RemoveIcon, debounce, InfoIcon, CloseIcon, fieldBackgroundMixin, fieldBackgroundDisabledMixin, ArrowDropDownIcon, Paper, ShortTextIcon, SubjectIcon, FormatQuoteIcon, HttpIcon, EmailIcon, FlagIcon, ListIcon, ListAltIcon, NumbersIcon, FormatListNumberedIcon, UploadFileIcon, DriveFolderUploadIcon, LinkIcon, AddLinkIcon, ScheduleIcon, BallotIcon, RepeatIcon, ViewStreamIcon, NotesIcon, Tab, Tabs, Alert, Sheet, useLocaleConfig, MenuIcon, ChevronLeftIcon } from "@firecms/ui";
 import equal from "react-fast-compare";
 import { Link, useNavigate, useLocation, UNSAFE_NavigationContext, NavLink, Route, Routes } from "react-router-dom";
 import { format } from "date-fns";
@@ -2881,6 +2881,9 @@ function singular(word, amount) {
 function getEntityPreviewKeys(targetCollection, fields, previewProperties, limit = 3) {
   const allProperties = Object.keys(targetCollection.properties);
   let listProperties = previewProperties?.filter((p) => allProperties.includes(p));
+  if (!listProperties && targetCollection.previewProperties) {
+    listProperties = targetCollection.previewProperties?.filter((p) => allProperties.includes(p));
+  }
   if (listProperties && listProperties.length > 0) {
     return listProperties;
   } else {
@@ -7232,12 +7235,14 @@ const TableReferenceFieldSuccess = React__default.memo(
       internalValue && !multiselect && buildSingleReferenceField(),
       internalValue && multiselect && buildMultipleReferenceField(),
       valueNotSet && /* @__PURE__ */ jsxs(
-        Button,
+        EntityPreviewContainer,
         {
+          className: cls(
+            "p-4 text-sm font-medium flex items-center gap-4 uppercase",
+            disabled ? "text-slate-500" : "cursor-pointer text-slate-700 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-gray-800 group-hover:bg-slate-50 dark:group-hover:bg-gray-800"
+          ),
           onClick: handleOpen,
-          size: "small",
-          variant: "outlined",
-          color: "primary",
+          size: "medium",
           children: [
             "Edit ",
             title
@@ -10996,13 +11001,10 @@ function ReferenceSelectionTable({
     textSearchInitialised,
     onTextSearchClick,
     textSearchEnabled
-  } = (
-    // eslint-disable-next-line react-hooks/rules-of-hooks
-    useTableSearchHelper({
-      collection,
-      fullPath
-    })
-  );
+  } = useTableSearchHelper({
+    collection,
+    fullPath
+  });
   return /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full", children: [
     /* @__PURE__ */ jsx("div", { className: "flex-grow", children: entitiesDisplayedFirst && /* @__PURE__ */ jsx(
       EntityCollectionTable,
@@ -14775,6 +14777,7 @@ function ReferenceFieldBindingInternal({
   showError,
   isSubmitting,
   disabled,
+  minimalistView,
   touched,
   autoFocus,
   property,
@@ -14815,7 +14818,7 @@ function ReferenceFieldBindingInternal({
     referenceDialogController.open();
   }, [referenceDialogController]);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
+    !minimalistView && /* @__PURE__ */ jsx(
       LabelWithIcon,
       {
         icon: getIconForProperty(property, "small"),
@@ -14845,15 +14848,17 @@ function ReferenceFieldBindingInternal({
         }
       ),
       !value && /* @__PURE__ */ jsx("div", { className: "justify-center text-left", children: /* @__PURE__ */ jsxs(
-        Button,
+        EntityPreviewContainer,
         {
-          variant: "outlined",
-          color: "primary",
-          disabled: disabled || isSubmitting,
+          className: cls(
+            "p-6 text-sm font-medium flex items-center gap-6",
+            disabled || isSubmitting ? "text-slate-500" : "cursor-pointer text-slate-700 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-gray-800 group-hover:bg-slate-50 dark:group-hover:bg-gray-800"
+          ),
           onClick: onEntryClick,
+          size: "medium",
           children: [
-            "Edit ",
-            property.name
+            /* @__PURE__ */ jsx(EmptyValue, {}),
+            `Edit ${property.name}`.toUpperCase()
           ]
         }
       ) })