npm - @firecms/core - Versions diffs - 3.0.0-alpha.20 → 3.0.0-alpha.24 - Mend

@firecms/core 3.0.0-alpha.20 → 3.0.0-alpha.24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (52) hide show

package/dist/types/collections.d.ts CHANGED Viewed

@@ -395,6 +395,7 @@ export type TableController<M extends Record<string, any> = any> = {
     checkFilterCombination?: (filterValues: FilterValues<any>, sortBy?: [string, "asc" | "desc"]) => boolean;
     popupCell?: SelectedCellProps<M>;
     setPopupCell?: (popupCell?: SelectedCellProps<M>) => void;
+    onAddColumn?: (column: string) => void;
 };
 export type SelectedCellProps<M extends Record<string, any>> = {
     propertyKey: Extract<keyof M, string>;

package/dist/types/firecms.d.ts CHANGED Viewed

@@ -1,3 +1,4 @@
+import React from "react";
 import { User } from "./user";
 import { AuthController } from "./auth";
 import { DataSource } from "./datasource";
@@ -108,11 +109,6 @@ export type FireCMSProps<UserType extends User> = {
      * Delegate for implementing your auth operations.
      */
     authController: AuthController<UserType>;
-    /**
-     * Optional link builder you can add to generate a button in your entity forms.
-     * The function must return a URL that gets opened when the button is clicked
-     */
-    entityLinkBuilder?: EntityLinkBuilder;
     /**
      * Path under the navigation routes of the CMS will be created. Defaults to `/`.
      * Internally FireCMS uses `react-router` to create the routes, the base path is attached to the
@@ -139,4 +135,17 @@ export type FireCMSProps<UserType extends User> = {
      * Callback used to get analytics events from the CMS
      */
     onAnalyticsEvent?: (event: CMSAnalyticsEvent, data?: object) => void;
+    /**
+     * Optional link builder you can add to generate a button in your entity forms.
+     * The function must return a URL that gets opened when the button is clicked
+     */
+    entityLinkBuilder?: EntityLinkBuilder;
+    components?: {
+        /**
+         * Component to render when a reference is missing
+         */
+        missingReference?: React.ComponentType<{
+            path: string;
+        }>;
+    };
 };

package/dist/types/firecms_context.d.ts CHANGED Viewed

@@ -92,4 +92,12 @@ export type FireCMSContext<UserType extends User = User, AuthControllerType exte
      * You can also define an entity view from the UI.
      */
     entityViews?: EntityCustomView[];
+    components?: {
+        /**
+         * Component to render when a reference is missing
+         */
+        missingReference?: React.ComponentType<{
+            path: string;
+        }>;
+    };
 };

package/dist/types/plugins.d.ts CHANGED Viewed

@@ -84,6 +84,28 @@ export type FireCMSPlugin<PROPS = any, FORM_PROPS = any> = {
             children: React.ReactNode;
         };
     };
+    collectionView?: {
+        /**
+         * Use this method to inject widgets to the entity collections header
+         * @param props
+         */
+        HeaderAction?: React.ComponentType<{
+            property: ResolvedProperty;
+            propertyKey: string;
+            onHover: boolean;
+            fullPath: string;
+            parentPathSegments: string[];
+        }>;
+        /**
+         * If you add this callback to your plugin, an add button will be added to the collection table.
+         * TODO: Only the first plugin that defines this callback will be used, at the moment.
+         */
+        AddColumnComponent?: React.ComponentType<{
+            fullPath: string;
+            parentPathSegments: string[];
+            collection: EntityCollection;
+        }>;
+    };
 };
 /**
  * Props passed to the {@link FireCMSPlugin.homePage.CollectionActions} method.

package/package.json CHANGED Viewed

@@ -1,139 +1,140 @@
 {
-    "name": "@firecms/core",
-    "version": "3.0.0-alpha.20",
-    "description": "Awesome Firebase/Firestore-based headless open-source CMS",
-    "funding": {
-        "url": "https://github.com/sponsors/firecmsco"
+  "name": "@firecms/core",
+  "version": "3.0.0-alpha.24",
+  "description": "Awesome Firebase/Firestore-based headless open-source CMS",
+  "funding": {
+    "url": "https://github.com/sponsors/firecmsco"
+  },
+  "author": "FireCMS",
+  "license": "MIT",
+  "repository": "git@github.com:FireCMSco/firecms.git",
+  "main": "./dist/index.umd.js",
+  "module": "./dist/index.es.js",
+  "types": "./dist/index.d.ts",
+  "source": "src/index.ts",
+  "engines": {
+    "node": ">=14"
+  },
+  "exports": {
+    ".": {
+      "import": "./dist/index.es.js",
+      "require": "./dist/index.umd.js",
+      "types": "./dist/index.d.ts"
     },
-    "author": "FireCMS",
-    "license": "MIT",
-    "repository": "git@github.com:FireCMSco/firecms.git",
-    "main": "./dist/index.umd.js",
-    "module": "./dist/index.es.js",
-    "types": "./dist/index.d.ts",
-    "source": "src/index.ts",
-    "engines": {
-        "node": ">=14"
-    },
-    "exports": {
-        ".": {
-            "import": "./dist/index.es.js",
-            "require": "./dist/index.umd.js",
-            "types": "./dist/index.d.ts"
-        },
-        "./package.json": "./package.json"
-    },
-    "keywords": [
-        "firebase",
-        "cms",
-        "admin",
-        "admin panel",
-        "firebase panel",
-        "firestore",
-        "headless",
-        "headless cms",
-        "content manager"
-    ],
-    "scripts": {
-        "watch": "vite build --watch",
-        "build": "vite build && tsc --emitDeclarationOnly",
-        "prepublishOnly": "run-s build",
-        "createTag": "PACKAGE_VERSION=$(cat package.json | grep version | head -1 | awk -F: '{ print $2 }' | sed 's/[\",]//g' | tr -d '[[:space:]]') && git tag v$PACKAGE_VERSION && git push --tags",
-        "test:lint": "eslint \"src/**\" --quiet",
-        "test": "jest",
-        "generateIcons": "ts-node --esm src/icons/generateIcons.ts"
-    },
-    "dependencies": {
-        "@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",
-        "@material-design-icons/font": "^0.14.13",
-        "@radix-ui/react-checkbox": "^1.0.4",
-        "@radix-ui/react-collapsible": "^1.0.3",
-        "@radix-ui/react-dialog": "^1.0.5",
-        "@radix-ui/react-dropdown-menu": "^2.0.6",
-        "@radix-ui/react-popover": "^1.0.7",
-        "@radix-ui/react-portal": "^1.0.4",
-        "@radix-ui/react-scroll-area": "^1.0.5",
-        "@radix-ui/react-select": "^1.2.2",
-        "@radix-ui/react-switch": "^1.0.3",
-        "@radix-ui/react-tabs": "^1.0.4",
-        "@radix-ui/react-tooltip": "^1.0.7",
-        "cmdk": "^0.2.0",
-        "date-fns": "^2.30.0",
-        "formik": "^2.4.5",
-        "history": "^5.3.0",
-        "js-search": "^2.0.1",
-        "markdown-it": "^13.0.2",
-        "notistack": "^3.0.1",
-        "object-hash": "^3.0.0",
-        "react-datepicker": "^4.21.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-transition-group": "^4.4.5",
-        "react-use-measure": "^2.1.1",
-        "react-window": "^1.8.9",
-        "tailwind-merge": "^1.14.0",
-        "typeface-rubik": "^1.1.13",
-        "yup": "^0.32.11"
-    },
-    "peerDependencies": {
-        "algoliasearch": "^4.13.0",
-        "firebase": "^10.4.0",
-        "react": "^18.2.0",
-        "react-dom": "^18.2.0",
-        "react-router": "^6.2.0",
-        "react-router-dom": "^6.2.0"
-    },
-    "eslintConfig": {
-        "extends": [
-            "react-app",
-            "react-app/jest"
-        ]
-    },
-    "devDependencies": {
-        "@jest/globals": "^29.7.0",
-        "@testing-library/jest-dom": "^5.17.0",
-        "@testing-library/react": "^14.0.0",
-        "@testing-library/user-event": "^14.5.1",
-        "@types/jest": "^29.5.6",
-        "@types/node": "^18.18.7",
-        "@types/object-hash": "^3.0.5",
-        "@types/react": "^18.2.33",
-        "@types/react-dom": "^18.2.14",
-        "@types/react-measure": "^2.0.10",
-        "@typescript-eslint/eslint-plugin": "^5.62.0",
-        "@typescript-eslint/parser": "^5.62.0",
-        "@vitejs/plugin-react": "^4.1.0",
-        "algoliasearch": "^4.20.0",
-        "cross-env": "^7.0.3",
-        "eslint": "^8.52.0",
-        "eslint-config-standard": "^17.1.0",
-        "eslint-plugin-import": "^2.29.0",
-        "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",
-        "jest": "^29.7.0",
-        "npm-run-all": "^4.1.5",
-        "react-router": "^6.17.0",
-        "react-router-dom": "^6.17.0",
-        "ts-jest": "^29.1.1",
-        "ts-node": "^10.9.1",
-        "tsd": "^0.28.1",
-        "typescript": "^5.2.2",
-        "vite": "^4.5.0"
-    },
-    "files": [
-        "dist",
-        "src"
-    ],
-    "gitHead": "7b74c47b5ea9f490bd0ba3d2b479108484a19411",
-    "publishConfig": {
-        "access": "public"
-    }
+    "./package.json": "./package.json"
+  },
+  "keywords": [
+    "firebase",
+    "cms",
+    "admin",
+    "admin panel",
+    "firebase panel",
+    "firestore",
+    "headless",
+    "headless cms",
+    "content manager"
+  ],
+  "scripts": {
+    "watch": "vite build --watch",
+    "build": "vite build && tsc --emitDeclarationOnly",
+    "prepublishOnly": "run-s build",
+    "createTag": "PACKAGE_VERSION=$(cat package.json | grep version | head -1 | awk -F: '{ print $2 }' | sed 's/[\",]//g' | tr -d '[[:space:]]') && git tag v$PACKAGE_VERSION && git push --tags",
+    "test:lint": "eslint \"src/**\" --quiet",
+    "test": "jest",
+    "clean": "rm -rf dist && find ./src -name '*.js' -type f | xargs rm -f",
+    "generateIcons": "ts-node --esm src/icons/generateIcons.ts"
+  },
+  "dependencies": {
+    "@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",
+    "@material-design-icons/font": "^0.14.13",
+    "@radix-ui/react-checkbox": "^1.0.4",
+    "@radix-ui/react-collapsible": "^1.0.3",
+    "@radix-ui/react-dialog": "^1.0.5",
+    "@radix-ui/react-dropdown-menu": "^2.0.6",
+    "@radix-ui/react-popover": "^1.0.7",
+    "@radix-ui/react-portal": "^1.0.4",
+    "@radix-ui/react-scroll-area": "^1.0.5",
+    "@radix-ui/react-select": "^1.2.2",
+    "@radix-ui/react-switch": "^1.0.3",
+    "@radix-ui/react-tabs": "^1.0.4",
+    "@radix-ui/react-tooltip": "^1.0.7",
+    "cmdk": "^0.2.0",
+    "date-fns": "^2.30.0",
+    "formik": "^2.4.5",
+    "history": "^5.3.0",
+    "js-search": "^2.0.1",
+    "markdown-it": "^13.0.2",
+    "notistack": "^3.0.1",
+    "object-hash": "^3.0.0",
+    "react-datepicker": "^4.21.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-transition-group": "^4.4.5",
+    "react-use-measure": "^2.1.1",
+    "react-window": "^1.8.9",
+    "tailwind-merge": "^1.14.0",
+    "typeface-rubik": "^1.1.13",
+    "yup": "^0.32.11"
+  },
+  "peerDependencies": {
+    "algoliasearch": "^4.13.0",
+    "firebase": "^10.4.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-router": "^6.2.0",
+    "react-router-dom": "^6.2.0"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "devDependencies": {
+    "@jest/globals": "^29.7.0",
+    "@testing-library/jest-dom": "^5.17.0",
+    "@testing-library/react": "^14.0.0",
+    "@testing-library/user-event": "^14.5.1",
+    "@types/jest": "^29.5.6",
+    "@types/node": "^18.18.7",
+    "@types/object-hash": "^3.0.5",
+    "@types/react": "^18.2.33",
+    "@types/react-dom": "^18.2.14",
+    "@types/react-measure": "^2.0.10",
+    "@typescript-eslint/eslint-plugin": "^5.62.0",
+    "@typescript-eslint/parser": "^5.62.0",
+    "@vitejs/plugin-react": "^4.1.0",
+    "algoliasearch": "^4.20.0",
+    "cross-env": "^7.0.3",
+    "eslint": "^8.52.0",
+    "eslint-config-standard": "^17.1.0",
+    "eslint-plugin-import": "^2.29.0",
+    "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",
+    "jest": "^29.7.0",
+    "npm-run-all": "^4.1.5",
+    "react-router": "^6.17.0",
+    "react-router-dom": "^6.17.0",
+    "ts-jest": "^29.1.1",
+    "ts-node": "^10.9.1",
+    "tsd": "^0.28.1",
+    "typescript": "^5.2.2",
+    "vite": "^4.5.0"
+  },
+  "files": [
+    "dist",
+    "src"
+  ],
+  "gitHead": "efeb689af20f913978c975c8ab3f91718e43935b",
+  "publishConfig": {
+    "access": "public"
+  }
 }

package/src/components/BooleanSwitch.tsx CHANGED Viewed

@@ -27,7 +27,7 @@ export const BooleanSwitch = React.forwardRef(function BooleanSwitch({
             ref={ref}
             tabIndex={disabled ? -1 : undefined}
             onClick={disabled
-                ? undefined
+                ? (e) => e.preventDefault()
                 : (e) => {
                     e.preventDefault();
                     if (allowIndeterminate) {

package/src/components/BooleanSwitchWithLabel.tsx CHANGED Viewed

@@ -54,12 +54,12 @@ export const BooleanSwitchWithLabel = function BooleanSwitchWithLabel({
             onBlur={onBlur}
             tabIndex={-1}
             className={cn(
-                    !invisible && fieldBackgroundMixin,
+                !invisible && fieldBackgroundMixin,
                 !invisible && (disabled ? fieldBackgroundDisabledMixin : fieldBackgroundHoverMixin),
                 disabled ? "cursor-default" : "cursor-pointer",
                 "rounded-md relative max-w-full justify-between w-full box-border relative inline-flex items-center",
                 !invisible && focus && !disabled ? focusedClasses : "",
-                error ? "text-red-500 dark:text-red-600" : (focus ? "text-primary" : (!disabled ? "text-text-primary dark:text-text-primary-dark" : "text-text-secondary dark:text-text-secondary-dark")),
+                error ? "text-red-500 dark:text-red-600" : (focus && !disabled ? "text-primary" : (!disabled ? "text-text-primary dark:text-text-primary-dark" : "text-text-secondary dark:text-text-secondary-dark")),
                 size === "small" ? "min-h-[40px]" : "min-h-[64px]",
                 size === "small" ? "pl-2" : "pl-4",
                 size === "small" ? "pr-4" : "pr-6",

package/src/components/CircularProgress.tsx CHANGED Viewed

@@ -13,7 +13,7 @@ export function CircularProgress({
     let sizeClasses = "";
     if (size === "small") {
-        sizeClasses = "w-4 h-4 m-1";
+        sizeClasses = "w-4 h-4";
     } else if (size === "medium") {
         sizeClasses = "w-8 h-8 m-1";
     } else {

package/src/components/Select.tsx CHANGED Viewed

@@ -185,18 +185,6 @@ export function Select({
                     </SelectPrimitive.Viewport>
                 </SelectPrimitive.Content>
             </SelectPrimitive.Portal>
-            {/*<SelectPrimitive.Portal>*/}
-            {/*    <SelectPrimitive.Content*/}
-            {/*        className={cn("z-50 relative border border-gray-200 dark:border-gray-800 bg-white dark:bg-gray-800 p-2 rounded-lg shadow-lg ",*/}
-            {/*            // "overflow-auto"*/}
-            {/*        )}*/}
-            {/*        position={position}*/}
-            {/*        align={"center"}>*/}
-            {/*        <SelectPrimitive.Viewport>*/}
-            {/*                {children}*/}
-            {/*        </SelectPrimitive.Viewport>*/}
-            {/*    </SelectPrimitive.Content>*/}
-            {/*</SelectPrimitive.Portal>*/}
         </SelectPrimitive.Root>
     );
 }

package/src/components/TextField.tsx CHANGED Viewed

@@ -89,8 +89,7 @@ export function TextField<T extends string | number>({
         ? <TextareaAutosize
             {...inputProps as any}
             ref={inputRef}
-            placeholder={placeholder}
+            placeholder={!focused && !hasValue ? undefined : placeholder}
             autoFocus={autoFocus}
             rows={rows}
             // onFocus={() => setFocused(true)}
@@ -119,10 +118,10 @@ export function TextField<T extends string | number>({
                 label ? (size === "medium" ? "pt-[28px] pb-2" : "pt-4 pb-2") : "py-2",
                 focused ? "text-text-primary dark:text-text-primary-dark" : "",
                 endAdornment ? "pr-10" : "pr-3",
-                inputClassName,
-                disabled && "border border-transparent outline-none opacity-50 dark:opacity-50 text-gray-800 dark:text-gray-200"
+                disabled && "border border-transparent outline-none opacity-50 dark:opacity-50 text-gray-800 dark:text-gray-200",
+                inputClassName
             )}
-            placeholder={placeholder}
+            placeholder={!focused && !hasValue ? undefined : placeholder}
             autoFocus={autoFocus}
             onFocus={() => setFocused(true)}
             onBlur={() => setFocused(false)}
@@ -150,7 +149,7 @@ export function TextField<T extends string | number>({
                     className={cn(
                         "pointer-events-none absolute",
                         size === "medium" ? "top-1" : "-top-1",
-                        !error ? (focused ? "text-primary" : "text-text-secondary dark:text-text-secondary-dark") : "text-red-500 dark:text-red-600",
+                        !error ? (focused ? "text-primary dark:text-primary" : "text-text-secondary dark:text-text-secondary-dark") : "text-red-500 dark:text-red-600",
                         disabled ? "opacity-50" : "")}
                     shrink={hasValue || focused}
                 >

package/src/components/TextareaAutosize.tsx CHANGED Viewed

@@ -2,6 +2,7 @@ import * as React from "react";
 import { useLayoutEffect } from "react";
 import * as ReactDOM from "react-dom";
 import { debounce } from "../core/util/debounce";
+import { cn } from "./util/cn";
 type State = {
     outerHeightStyle: number;
@@ -102,6 +103,7 @@ export const TextareaAutosize = React.forwardRef(function TextareaAutosize(
             getStyleValue(computedStyle.paddingBottom) + getStyleValue(computedStyle.paddingTop);
         const border =
             getStyleValue(computedStyle.borderBottomWidth) + getStyleValue(computedStyle.borderTopWidth);
+        const minHeight = getStyleValue(computedStyle.minHeight);
         // The height of the inner content
         const innerHeight = sizeReferenceElement.scrollHeight;
@@ -119,10 +121,11 @@ export const TextareaAutosize = React.forwardRef(function TextareaAutosize(
         if (maxRows) {
             outerHeight = Math.min(Number(maxRows) * singleRowHeight, outerHeight);
         }
-        outerHeight = Math.max(outerHeight, singleRowHeight);
+        outerHeight = Math.max(outerHeight, singleRowHeight, minHeight);
         // Take the box sizing into account for applying this value as a style.
-        const outerHeightStyle = outerHeight + (boxSizing === "border-box" ? padding + border : 0);
+        const outerHeightStyle = outerHeight + (!props.ignoreBoxSizing && boxSizing === "border-box" ? padding + border : 0);
         const overflow = Math.abs(outerHeight - innerHeight) <= 1;
         return {
@@ -274,7 +277,7 @@ export const TextareaAutosize = React.forwardRef(function TextareaAutosize(
             />
             <textarea
                 aria-hidden
-                className={props.shadowClassName}
+                className={cn(props.className, props.shadowClassName)}
                 readOnly
                 ref={shadowRef}
                 tabIndex={-1}
@@ -327,8 +330,9 @@ export type TextareaAutosizeProps = Omit<React.InputHTMLAttributes<HTMLTextAreaE
     onResize?: (state: State) => void;
     autoFocus?: boolean;
-}
+    ignoreBoxSizing?: boolean;
+}
 function useForkRef<Instance>(
     ...refs: Array<React.Ref<Instance> | undefined>

package/src/components/index.tsx CHANGED Viewed

@@ -36,3 +36,5 @@ export * from "./Tooltip";
 export * from "./Typography";
 export * from "./Tabs";
 export * from "./Table";
+export * from "./Popover";
+export * from "./Badge";

package/src/core/FireCMS.tsx CHANGED Viewed

@@ -53,7 +53,8 @@ export function FireCMS<UserType extends User>(props: FireCMSProps<UserType>) {
         plugins,
         onAnalyticsEvent,
         fields,
-        entityViews
+        entityViews,
+        components
     } = props;
     useLocaleConfig(locale);
@@ -81,8 +82,9 @@ export function FireCMS<UserType extends User>(props: FireCMSProps<UserType>) {
         plugins,
         onAnalyticsEvent,
         entityViews: entityViews ?? [],
-        fields: fields ?? {}
-    }), [dateTimeFormat, locale, plugins, entityViews, fields]);
+        fields: fields ?? {},
+        components
+    }), [dateTimeFormat, locale, plugins, entityViews, fields, components]);
     if (navigation.navigationLoadingError) {
         return (

package/src/core/components/EntityCollectionTable/EntityCollectionTable.tsx CHANGED Viewed

@@ -102,11 +102,13 @@ export const EntityCollectionTable = React.memo<EntityCollectionTableProps<any>>
                  pageSize = 50,
                  paginationEnabled,
                  checkFilterCombination,
-                 setPopupCell
+                 setPopupCell,
              },
          filterable = true,
          sortable = true,
-         endAdornment
+         endAdornment,
+         additionalHeaderWidget,
+         AddColumnComponent
      }: EntityCollectionTableProps<M>) {
         const largeLayout = useLargeLayout();
@@ -291,7 +293,12 @@ export const EntityCollectionTable = React.memo<EntityCollectionTableProps<any>>
                             custom: {
                                 resolvedProperty: property,
                                 disabled
-                            }
+                            },
+                            additionalHeaderWidget: (onHover) => additionalHeaderWidget?.({
+                                property,
+                                propertyKey: key,
+                                onHover
+                            })
                         };
                     });
@@ -408,6 +415,7 @@ export const EntityCollectionTable = React.memo<EntityCollectionTableProps<any>>
                         }, [selectedEntityIds])}
                         className="flex-grow"
                         endAdornment={endAdornment}
+                        AddColumnComponent={AddColumnComponent}
                     />
                 </div>

package/src/core/components/EntityCollectionTable/EntityCollectionTableProps.tsx CHANGED Viewed

@@ -5,7 +5,9 @@ import {
     Entity,
     FilterValues,
     ResolvedProperties,
-    SelectionController, TableController,
+    ResolvedProperty,
+    SelectionController,
+    TableController,
     User
 } from "../../../types";
 import { OnCellValueChange, UniqueFieldValidator } from "./types";
@@ -117,6 +119,14 @@ export type EntityCollectionTableProps<M extends Record<string, any>,
     endAdornment?: React.ReactNode;
+    additionalHeaderWidget?: (props: {
+        property: ResolvedProperty,
+        propertyKey: string,
+        onHover: boolean,
+    }) => React.ReactNode;
+    AddColumnComponent?: React.ComponentType;
 }
 export type GetPropertyForProps<M extends Record<string, any>> = {