@firecms/core 3.0.0-alpha.37 → 3.0.0-alpha.38

package/dist/types/plugins.d.ts

@@ -11,7 +11,7 @@ import { ResolvedProperty } from "./resolved_entities";
  * NOTE: This is a work in progress and the API is not stable yet.
  * @group Core
  */
-export type FireCMSPlugin<PROPS = any, FORM_PROPS = any, EC extends EntityCollection = EntityCollection> = {
+export type FireCMSPlugin<PROPS = any, FORM_PROPS = any, EC extends EntityCollection = EntityCollection, COL_ACTIONS_PROPS = any> = {
     /**
      * Name of the plugin
      */
@@ -34,7 +34,8 @@ export type FireCMSPlugin<PROPS = any, FORM_PROPS = any, EC extends EntityCollec
          * Use this component to add custom actions to the entity collections
          * toolbar.
          */
-        CollectionActions?: React.ComponentType<CollectionActionsProps<any, any, EC>> | React.ComponentType<CollectionActionsProps<any, any, EC>>[];
+        CollectionActions?: React.ComponentType<CollectionActionsProps<any, any, EC> & COL_ACTIONS_PROPS> | React.ComponentType<CollectionActionsProps<any, any, EC> & COL_ACTIONS_PROPS>[];
+        collectionActionsProps?: COL_ACTIONS_PROPS;
     };
     form?: {
         provider?: {

package/dist/ui/Dialog.d.ts

@@ -8,6 +8,7 @@ export type DialogProps = {
     fullScreen?: boolean;
     scrollable?: boolean;
     maxWidth?: keyof typeof widthClasses;
+    modal?: boolean;
 };
 declare const widthClasses: {
     xs: string;
@@ -23,5 +24,5 @@ declare const widthClasses: {
     "7xl": string;
     full: string;
 };
-export declare const Dialog: ({ open, onOpenChange, children, className, fullWidth, fullHeight, fullScreen, scrollable, maxWidth }: DialogProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Dialog: ({ open, onOpenChange, children, className, fullWidth, fullHeight, fullScreen, scrollable, maxWidth, modal }: DialogProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@firecms/core",
-    "version": "3.0.0-alpha.37",
+    "version": "3.0.0-alpha.38",
     "description": "Awesome Firebase/Firestore-based headless open-source CMS",
     "funding": {
         "url": "https://github.com/sponsors/firecmsco"
@@ -48,7 +48,7 @@
         "@date-io/date-fns": "^2.17.0",
         "@fontsource/ibm-plex-mono": "^5.0.8",
         "@fontsource/roboto": "^5.0.8",
-        "@hello-pangea/dnd": "^16.3.0",
+        "@hello-pangea/dnd": "^16.5.0",
         "@material-design-icons/font": "^0.14.13",
         "@radix-ui/react-checkbox": "^1.0.4",
         "@radix-ui/react-collapsible": "^1.0.3",
@@ -69,15 +69,14 @@
         "markdown-it": "^13.0.2",
         "notistack": "^3.0.1",
         "object-hash": "^3.0.0",
-        "react-datepicker": "^4.21.0",
+        "react-datepicker": "^4.24.0",
         "react-dropzone": "^14.2.3",
         "react-fast-compare": "^3.2.2",
         "react-image-file-resizer": "^0.4.8",
         "react-markdown-editor-lite": "^1.3.4",
-        "react-remove-scroll": "^2.5.6",
         "react-transition-group": "^4.4.5",
         "react-use-measure": "^2.1.1",
-        "react-window": "^1.8.9",
+        "react-window": "^1.8.10",
         "tailwind-merge": "^1.14.0",
         "typeface-rubik": "^1.1.13",
         "yup": "^0.32.11"
@@ -103,38 +102,38 @@
         "@testing-library/user-event": "^14.5.1",
         "@types/jest": "^29.5.6",
         "@types/node": "^20.8.9",
-        "@types/object-hash": "^3.0.5",
-        "@types/react": "^18.2.33",
-        "@types/react-dom": "^18.2.14",
-        "@types/react-measure": "^2.0.10",
+        "@types/object-hash": "^3.0.6",
+        "@types/react": "^18.2.45",
+        "@types/react-dom": "^18.2.17",
+        "@types/react-measure": "^2.0.12",
         "@typescript-eslint/eslint-plugin": "^5.62.0",
         "@typescript-eslint/parser": "^5.62.0",
-        "@vitejs/plugin-react": "^4.1.0",
-        "algoliasearch": "^4.20.0",
+        "@vitejs/plugin-react": "^4.2.1",
+        "algoliasearch": "^4.22.0",
         "cross-env": "^7.0.3",
-        "eslint": "^8.52.0",
+        "eslint": "^8.55.0",
         "eslint-config-standard": "^17.1.0",
-        "eslint-plugin-import": "^2.29.0",
+        "eslint-plugin-import": "^2.29.1",
         "eslint-plugin-n": "^15.7.0",
         "eslint-plugin-promise": "^6.1.1",
         "eslint-plugin-react": "^7.33.2",
         "eslint-plugin-react-hooks": "^4.6.0",
-        "firebase": "^10.5.2",
+        "firebase": "^10.7.1",
         "jest": "^29.7.0",
         "npm-run-all": "^4.1.5",
-        "react-router": "^6.17.0",
-        "react-router-dom": "^6.17.0",
+        "react-router": "^6.21.0",
+        "react-router-dom": "^6.21.0",
         "ts-jest": "^29.1.1",
-        "ts-node": "^10.9.1",
+        "ts-node": "^10.9.2",
         "tsd": "^0.28.1",
-        "typescript": "^5.3.0",
-        "vite": "^4.5.0"
+        "typescript": "^5.3.3",
+        "vite": "^4.5.1"
     },
     "files": [
         "dist",
         "src"
     ],
-    "gitHead": "bfe341a3a8e3d2b33d4dc3f48fabc350eccace1b",
+    "gitHead": "bb42f6acf34a0e5225549b0e3ebf9a07b7aedf77",
     "publishConfig": {
         "access": "public"
     }

package/src/components/EntityCollectionView/EntityCollectionViewActions.tsx

@@ -6,6 +6,7 @@ import { CollectionActionsProps, EntityCollection, SelectionController, TableCon
 import { Button, IconButton, Tooltip } from "../../ui";
 import { AddIcon, DeleteIcon } from "../../icons";
 import { toArray } from "../../util/arrays";
+import { ErrorBoundary } from "../ErrorBoundary";
 
 export type EntityCollectionViewActionsProps<M extends Record<string, any>> = {
     collection: EntityCollection<M>;
@@ -102,23 +103,26 @@ export function EntityCollectionViewActions<M extends Record<string, any>>({
         collectionEntitiesCount
     };
 
-    const allActions: React.ComponentType<any>[] = [];
-    allActions.push(...toArray(collection.Actions));
+    const actions = toArray(collection.Actions)
+        .map((Action, i) => (
+            <ErrorBoundary key={`actions_${i}`}>
+                <Action {...actionProps} />
+            </ErrorBoundary>
+        ));
+
     if (plugins) {
         plugins.forEach(plugin => {
             if (plugin.collections?.CollectionActions) {
-                allActions.push(...toArray(plugin.collections?.CollectionActions));
+                actions.push(...toArray(plugin.collections?.CollectionActions)
+                    .map((Action, i) => (
+                        <ErrorBoundary key={`plugin_actions_${i}`}>
+                            <Action {...actionProps} {...plugin.collections?.collectionActionsProps}/>
+                        </ErrorBoundary>
+                    )));
             }
         });
     }
 
-    const actions = <>
-            {allActions.map((Action, i) => (
-                <Action key={`actions_${i}`} {...actionProps} />
-            ))}
-        </>
-    ;
-
     return (
         <>
             {actions}

package/src/preview/property_previews/MapPropertyPreview.tsx

@@ -25,9 +25,6 @@ export function MapPropertyPreview<T extends Record<string, any> = Record<string
 
     const mapProperty = property as ResolvedMapProperty;
 
-    if (propertyKey === "result.suggestions")
-        console.log({ propertyKey, property, value })
-
     if (!mapProperty.properties || Object.keys(mapProperty.properties ?? {}).length === 0) {
         return (
             <KeyValuePreview value={value}/>

package/src/types/plugins.tsx

@@ -13,7 +13,7 @@ import { ResolvedProperty } from "./resolved_entities";
  * NOTE: This is a work in progress and the API is not stable yet.
  * @group Core
  */
-export type FireCMSPlugin<PROPS = any, FORM_PROPS = any, EC extends EntityCollection = EntityCollection> = {
+export type FireCMSPlugin<PROPS = any, FORM_PROPS = any, EC extends EntityCollection = EntityCollection, COL_ACTIONS_PROPS = any> = {
 
     /**
      * Name of the plugin
@@ -41,7 +41,9 @@ export type FireCMSPlugin<PROPS = any, FORM_PROPS = any, EC extends EntityCollec
          * Use this component to add custom actions to the entity collections
          * toolbar.
          */
-        CollectionActions?: React.ComponentType<CollectionActionsProps<any, any, EC>> | React.ComponentType<CollectionActionsProps<any, any, EC>>[];
+        CollectionActions?: React.ComponentType<CollectionActionsProps<any, any, EC> & COL_ACTIONS_PROPS> | React.ComponentType<CollectionActionsProps<any, any, EC> & COL_ACTIONS_PROPS>[];
+
+        collectionActionsProps?: COL_ACTIONS_PROPS;
 
     }
 

package/src/ui/Dialog.tsx

@@ -13,6 +13,7 @@ export type DialogProps = {
     fullScreen?: boolean;
     scrollable?: boolean;
     maxWidth?: keyof typeof widthClasses;
+    modal?: boolean;
 };
 
 const widthClasses = {
@@ -39,7 +40,8 @@ export const Dialog = ({
                            fullHeight,
                            fullScreen,
                            scrollable = true,
-                           maxWidth = "lg"
+                           maxWidth = "lg",
+                           modal = true
                        }: DialogProps) => {
     const [displayed, setDisplayed] = useState(false);
 
@@ -58,10 +60,11 @@ export const Dialog = ({
 
     return (
         <DialogPrimitive.Root open={displayed || open}
+                              modal={modal}
                               onOpenChange={onOpenChange}>
             <DialogPrimitive.Portal>
 
-                <div className={"fixed inset-0 z-40"}>
+                <div className={"fixed inset-0 z-30"}>
 
                     <DialogPrimitive.Overlay
                         className={cn("fixed inset-0 transition-opacity z-20 ease-in-out duration-200 bg-black bg-opacity-50 dark:bg-opacity-60 backdrop-blur-sm ",
@@ -74,7 +77,7 @@ export const Dialog = ({
                     />
 
                     <DialogPrimitive.Content
-                        className={cn("h-full outline-none flex justify-center items-center z-50 opacity-100 transition-all duration-200 ease-in-out")}
+                        className={cn("h-full outline-none flex justify-center items-center z-40 opacity-100 transition-all duration-200 ease-in-out")}
                     >
                         <div
                             className={cn(paperMixin,

package/src/ui/Select.tsx

@@ -179,11 +179,12 @@ export function Select({
             <SelectPrimitive.Portal>
                 <SelectPrimitive.Content
                     position={position}
-                    className="z-50 max-h-[var(--radix-select-content-available-height)] overflow-hidden relative border border-gray-200 dark:border-gray-800 bg-white dark:bg-gray-800 p-2 rounded-lg shadow-lg">
+                    className="z-50 relative overflow-hidden border border-gray-200 dark:border-gray-800 bg-white dark:bg-gray-800 p-2 rounded-lg shadow-lg">
                     <SelectPrimitive.Viewport
-                        className={"p-1 max-h-[var(--radix-select-content-available-height)]"}
+                        className={"p-1"}
                         style={{
-                    }}>
+                            maxHeight: "var(--radix-select-content-available-height)"
+                        }}>
                         {children}
                     </SelectPrimitive.Viewport>
                 </SelectPrimitive.Content>