@firecms/core 3.0.0-canary.123 → 3.0.0-canary.124

package/dist/index.umd.js

@@ -5177,7 +5177,7 @@
         hover: disabled ? void 0 : hover,
         size,
         children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cls("w-10 h-10 mr-2 shrink-0 grow-0", size === "smallest" ? "my-0.5" : "m-2 self-start"), children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cls("flex w-10 h-10 mr-2 shrink-0 grow-0", size === "smallest" ? "my-0.5" : "m-2 self-start"), children: [
             imageProperty && /* @__PURE__ */ jsxRuntime.jsx(
               PropertyPreview,
               {
@@ -5187,7 +5187,7 @@
                 value: getValueInPath(entity.values, imagePropertyKey)
               }
             ),
-            !imageProperty && /* @__PURE__ */ jsxRuntime.jsx(IconForView, { collectionOrView: collection, size, className: "mr-2" })
+            !imageProperty && /* @__PURE__ */ jsxRuntime.jsx(IconForView, { collectionOrView: collection, size, className: "m-auto" })
           ] }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col flex-grow w-full m-1", children: [
             size !== "smallest" && includeId && (entity ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${size !== "medium" ? "block whitespace-nowrap overflow-hidden truncate" : ""}`, children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -7247,7 +7247,7 @@
           EntityPreviewContainer,
           {
             className: ui.cls(
-              "p-4 text-sm font-medium flex items-center uppercase",
+              "px-4 py-2 text-sm font-medium flex items-center uppercase",
               multiselect ? "gap-4" : "gap-6",
               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"
             ),
@@ -19423,18 +19423,18 @@
       {
         onClick,
         style: {
-          width: !drawerOpen ? "72px" : "280px",
+          width: "100%",
           transition: drawerOpen ? "width 150ms ease-in" : void 0
         },
         className: ({ isActive }) => ui.cls(
-          "rounded-r-lg truncate",
+          "rounded-lg truncate",
           "hover:bg-slate-300 hover:bg-opacity-75 dark:hover:bg-gray-700 dark:hover:bg-opacity-75 text-gray-800 dark:text-gray-200 hover:text-gray-900 hover:dark:text-white",
           "flex flex-row items-center mr-8",
           // "transition-all ease-in-out delay-100 duration-300",
           // drawerOpen ? "w-full" : "w-18",
-          drawerOpen ? "pl-8 h-12" : "pl-6 h-11",
+          drawerOpen ? "pl-4 h-12" : "pl-4 h-11",
           "font-medium text-sm",
-          isActive ? "bg-slate-200 bg-opacity-60 dark:bg-gray-800 dark:bg-opacity-30" : ""
+          isActive ? "bg-slate-200 bg-opacity-60 dark:bg-gray-800 dark:bg-opacity-50" : ""
         ),
         to: url,
         children: [
@@ -19487,11 +19487,11 @@
     const adminViews = navigationEntries.filter((e) => e.type === "admin") ?? [];
     const groupsWithoutAdmin = groups.filter((g) => g !== "Admin");
     const buildGroupHeader = React.useCallback((group) => {
-      if (!drawerOpen) return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-12 w-full" });
+      if (!drawerOpen) return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full" });
       return /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
-          className: "pt-8 pl-6 pr-8 pb-2 flex flex-row items-center",
+          className: "pl-6 pr-8 py-4 flex flex-row items-center",
           children: /* @__PURE__ */ jsxRuntime.jsx(
             ui.Typography,
             {
@@ -19512,28 +19512,38 @@
     };
     return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cls("flex flex-col h-full relative flex-grow w-full", className), style, children: [
       /* @__PURE__ */ jsxRuntime.jsx(DrawerLogo, { logo }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-grow overflow-scroll no-scrollbar", children: groupsWithoutAdmin.map((group) => /* @__PURE__ */ jsxRuntime.jsxs(
-        React.Fragment,
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
         {
-          children: [
-            buildGroupHeader(group),
-            Object.values(navigationEntries).filter((e) => e.group === group).map((view, index) => /* @__PURE__ */ jsxRuntime.jsx(
-              DrawerNavigationItem,
-              {
-                icon: /* @__PURE__ */ jsxRuntime.jsx(IconForView, { collectionOrView: view.collection ?? view.view }),
-                tooltipsOpen,
-                adminMenuOpen,
-                drawerOpen,
-                onClick: () => onClick(view),
-                url: view.url,
-                name: view.name
-              },
-              `navigation_${index}`
-            ))
-          ]
-        },
-        `drawer_group_${group}`
-      )) }),
+          className: "mt-4 flex-grow overflow-scroll no-scrollbar",
+          style: {
+            maskImage: "linear-gradient(to bottom, transparent 0, black 20px, black calc(100% - 20px), transparent 100%)"
+          },
+          children: groupsWithoutAdmin.map((group) => /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              className: "bg-gray-50 dark:bg-gray-800 dark:bg-opacity-30 my-4 rounded-lg ml-4",
+              children: [
+                buildGroupHeader(group),
+                Object.values(navigationEntries).filter((e) => e.group === group).map((view, index) => /* @__PURE__ */ jsxRuntime.jsx(
+                  DrawerNavigationItem,
+                  {
+                    icon: /* @__PURE__ */ jsxRuntime.jsx(IconForView, { collectionOrView: view.collection ?? view.view }),
+                    tooltipsOpen,
+                    adminMenuOpen,
+                    drawerOpen,
+                    onClick: () => onClick(view),
+                    url: view.url,
+                    name: view.name
+                  },
+                  `navigation_${index}`
+                ))
+              ]
+            },
+            `drawer_group_${group}`
+          ))
+        }
+      ),
       adminViews.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
         ui.Menu,
         {