@firecms/core 3.0.0-beta.2 → 3.0.0-beta.3

package/dist/internal/useBuildDataSource.d.ts

@@ -17,6 +17,10 @@ export declare function useBuildDataSource({ delegate, propertyConfigs, navigati
  * bindings.
  * Also, Firestore references are replaced with {@link EntityReference}
  * @param data
+ * @param buildReference
+ * @param buildGeoPoint
+ * @param buildDate
+ * @param buildDelete
  * @group Firestore
  */
 export declare function cmsToDelegateModel(data: any, buildReference: (reference: EntityReference) => any, buildGeoPoint: (geoPoint: GeoPoint) => any, buildDate: (date: Date) => any, buildDelete: () => any): any;

package/dist/types/entities.d.ts

@@ -43,6 +43,7 @@ export declare class EntityReference<M extends Record<string, any> = any> {
     readonly path: string;
     constructor(id: string, path: string);
     get pathWithId(): string;
+    isEntityReference(): boolean;
 }
 export declare class GeoPoint {
     /**

package/dist/util/index.d.ts

@@ -20,3 +20,4 @@ export * from "./flatten_object";
 export * from "./make_properties_editable";
 export * from "./join_collections";
 export * from "./builders";
+export * from "./useTraceUpdate";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@firecms/core",
   "type": "module",
-  "version": "3.0.0-beta.2",
+  "version": "3.0.0-beta.3",
   "description": "Awesome Firebase/Firestore-based headless open-source CMS",
   "funding": {
     "url": "https://github.com/sponsors/firecmsco"
@@ -37,9 +37,17 @@
     "clean": "rm -rf dist && find ./src -name '*.js' -type f | xargs rm -f",
     "generateIcons": "ts-node --esm src/icons/generateIcons.ts"
   },
+  "exports": {
+    ".": {
+      "import": "./dist/index.es.js",
+      "require": "./dist/index.umd.js",
+      "types": "./dist/src/index.d.ts"
+    },
+    "./package.json": "./package.json"
+  },
   "dependencies": {
-    "@firecms/formex": "^3.0.0-beta.2",
-    "@firecms/ui": "^3.0.0-beta.2",
+    "@firecms/formex": "^3.0.0-beta.3",
+    "@firecms/ui": "^3.0.0-beta.3",
     "@fontsource/ibm-plex-mono": "^5.0.8",
     "@fontsource/roboto": "^5.0.8",
     "@hello-pangea/dnd": "^16.5.0",
@@ -107,7 +115,7 @@
     "dist",
     "src"
   ],
-  "gitHead": "9c3561bc09311f2339bb6fa224c88a62d3b19617",
+  "gitHead": "33cceff5d5bc2a7002cc5a3904b787e70bfb9c6e",
   "publishConfig": {
     "access": "public"
   }

package/src/components/EntityCollectionTable/EntityCollectionRowActions.tsx

@@ -1,5 +1,4 @@
 import React, { MouseEvent, useCallback } from "react";
-import equal from "react-fast-compare"
 
 import { CollectionSize, Entity, EntityAction, EntityCollection, SelectionController } from "../../types";
 import { Checkbox, cn, IconButton, Menu, MenuItem, MoreVertIcon, Skeleton, Tooltip, Typography } from "@firecms/ui";
@@ -14,46 +13,43 @@ import { useFireCMSContext, useLargeLayout } from "../../hooks";
  * @param selectionEnabled
  * @param size
  * @param toggleEntitySelection
- * @param onCopyClicked
- * @param onEditClicked
- * @param onDeleteClicked
  * @param hideId
  * @constructor
  *
  * @group Collection components
  */
-export const EntityCollectionRowActions = React.memo(function EntityCollectionRowActions({
-                                                                                             entity,
-                                                                                             collection,
-                                                                                             fullPath,
-                                                                                             width,
-                                                                                             frozen,
-                                                                                             isSelected,
-                                                                                             selectionEnabled,
-                                                                                             size,
-                                                                                             highlightEntity,
-                                                                                             onCollectionChange,
-                                                                                             unhighlightEntity,
-                                                                                             actions = [],
-                                                                                             hideId,
-                                                                                             selectionController,
-                                                                                         }:
-                                                                                             {
-                                                                                                 entity: Entity<any>,
-                                                                                                 collection?: EntityCollection<any>,
-                                                                                                 fullPath?: string,
-                                                                                                 width: number,
-                                                                                                 frozen?: boolean,
-                                                                                                 size: CollectionSize,
-                                                                                                 isSelected?: boolean,
-                                                                                                 selectionEnabled?: boolean,
-                                                                                                 actions?: EntityAction[],
-                                                                                                 hideId?: boolean,
-                                                                                                 onCollectionChange?: () => void,
-                                                                                                 selectionController?: SelectionController;
-                                                                                                 highlightEntity?: (entity: Entity<any>) => void;
-                                                                                                 unhighlightEntity?: (entity: Entity<any>) => void;
-                                                                                             }) {
+export const EntityCollectionRowActions = function EntityCollectionRowActions({
+                                                                                  entity,
+                                                                                  collection,
+                                                                                  fullPath,
+                                                                                  width,
+                                                                                  frozen,
+                                                                                  isSelected,
+                                                                                  selectionEnabled,
+                                                                                  size,
+                                                                                  highlightEntity,
+                                                                                  onCollectionChange,
+                                                                                  unhighlightEntity,
+                                                                                  actions = [],
+                                                                                  hideId,
+                                                                                  selectionController,
+                                                                              }:
+                                                                                  {
+                                                                                      entity: Entity<any>,
+                                                                                      collection?: EntityCollection<any>,
+                                                                                      fullPath?: string,
+                                                                                      width: number,
+                                                                                      frozen?: boolean,
+                                                                                      size: CollectionSize,
+                                                                                      isSelected?: boolean,
+                                                                                      selectionEnabled?: boolean,
+                                                                                      actions?: EntityAction[],
+                                                                                      hideId?: boolean,
+                                                                                      onCollectionChange?: () => void,
+                                                                                      selectionController?: SelectionController;
+                                                                                      highlightEntity?: (entity: Entity<any>) => void;
+                                                                                      unhighlightEntity?: (entity: Entity<any>) => void;
+                                                                                  }) {
 
     const largeLayout = useLargeLayout();
 
@@ -171,4 +167,4 @@ export const EntityCollectionRowActions = React.memo(function EntityCollectionRo
         </div>
     );
 
-}, equal);
+};

package/src/components/EntityCollectionTable/EntityCollectionTable.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useContext, useMemo, useRef } from "react";
+import React, { useCallback, useMemo, useRef } from "react";
 import equal from "react-fast-compare";
 import { AdditionalFieldDelegate, CollectionSize, Entity, FireCMSContext, User } from "../../types";
 import { PropertyTableCell } from "./PropertyTableCell";
@@ -8,7 +8,6 @@ import { CellRendererParams, VirtualTableColumn } from "../VirtualTable";
 import { getValueInPath } from "../../util";
 import { getRowHeight } from "../VirtualTable/common";
 import { EntityCollectionRowActions } from "./EntityCollectionRowActions";
-import { EntityCollectionTableController } from "../common/types";
 import { CollectionTableToolbar } from "./internal/CollectionTableToolbar";
 import { EntityCollectionTableProps } from "./EntityCollectionTableProps";
 import { EntityTableCell } from "./internal/EntityTableCell";
@@ -111,12 +110,12 @@ export const EntityCollectionTable = React.memo<EntityCollectionTableProps<any>>
 
         const customFieldValidator: CustomFieldValidator | undefined = uniqueFieldValidator;
 
-        const propertyCellRenderer = useCallback(({
-                                                      column,
-                                                      columnIndex,
-                                                      rowData,
-                                                      rowIndex
-                                                  }: CellRendererParams<any>) => {
+        const propertyCellRenderer = ({
+                                          column,
+                                          columnIndex,
+                                          rowData,
+                                          rowIndex
+                                      }: CellRendererParams<any>) => {
 
             const entity: Entity<M> = rowData;
 
@@ -158,7 +157,7 @@ export const EntityCollectionTable = React.memo<EntityCollectionTableProps<any>>
                     }
                 </ErrorBoundary>);
 
-        }, [inlineEditing, size, selectedEntityIds]);
+        };
 
         const additionalCellRenderer = useCallback(({
                                                         column,
@@ -205,30 +204,29 @@ export const EntityCollectionTable = React.memo<EntityCollectionTableProps<any>>
 
         }, [size, selectedEntityIds]);
 
-        const collectionColumns: VirtualTableColumn[] = useMemo(() => {
-                const columnsResult: VirtualTableColumn[] = propertiesToColumns({
-                    properties,
-                    sortable,
-                    forceFilter,
-                    disabledFilter: disabledFilterChange,
-                    AdditionalHeaderWidget
-                });
-
-                const additionalTableColumns: VirtualTableColumn[] = additionalFields
-                    ? additionalFields.map((additionalField) =>
-                        ({
-                            key: additionalField.key,
-                            align: "left",
-                            sortable: false,
-                            title: additionalField.name,
-                            width: additionalField.width ?? 200
-                        }))
-                    : [];
-                return [...columnsResult, ...additionalTableColumns];
-            },
-            [additionalFields, disabledFilterChange, forceFilter, properties, sortable]);
-
-        const idColumn: VirtualTableColumn = useMemo(() => ({
+        const collectionColumns: VirtualTableColumn[] = (() => {
+            const columnsResult: VirtualTableColumn[] = propertiesToColumns({
+                properties,
+                sortable,
+                forceFilter,
+                disabledFilter: disabledFilterChange,
+                AdditionalHeaderWidget
+            });
+
+            const additionalTableColumns: VirtualTableColumn[] = additionalFields
+                ? additionalFields.map((additionalField) =>
+                    ({
+                        key: additionalField.key,
+                        align: "left",
+                        sortable: false,
+                        title: additionalField.name,
+                        width: additionalField.width ?? 200
+                    }))
+                : [];
+            return [...columnsResult, ...additionalTableColumns];
+        })();
+
+        const idColumn: VirtualTableColumn = {
             key: "id_ewcfedcswdf3",
             width: getIdColumnWidth?.() ?? (largeLayout ? 160 : 130),
             title: "ID",
@@ -237,17 +235,17 @@ export const EntityCollectionTable = React.memo<EntityCollectionTableProps<any>>
             headerAlign: "center",
             align: "center",
             AdditionalHeaderWidget: () => additionalIDHeaderWidget
-        }), [getIdColumnWidth, largeLayout])
+        }
 
-        const columns: VirtualTableColumn[] = useMemo(() => [
+        const columns: VirtualTableColumn[] = [
             idColumn,
             ...displayedColumnIds
                 .map((p) => {
                     return collectionColumns.find(c => c.key === p.key);
                 }).filter(Boolean) as VirtualTableColumn[]
-        ], [collectionColumns, displayedColumnIds, idColumn]);
+        ];
 
-        const cellRenderer = useCallback((props: CellRendererParams<any>) => {
+        const cellRenderer = (props: CellRendererParams<any>) => {
             const column = props.column;
             const columns = props.columns;
             const columnKey = column.key;
@@ -287,7 +285,7 @@ export const EntityCollectionTable = React.memo<EntityCollectionTableProps<any>>
                     <ErrorView error={e}/>
                 </EntityTableCell>;
             }
-        }, [additionalFieldsMap, tableRowActionsBuilder, size, additionalCellRenderer, propertyCellRenderer])
+        }
 
         return (
 

package/src/components/EntityCollectionTable/PropertyTableCell.tsx

@@ -24,13 +24,14 @@ import { getPreviewSizeFrom } from "../../preview/util";
 import { isReadOnly } from "../../util";
 
 import { CustomFieldValidator, mapPropertyToYup } from "../../form/validation";
-import { useClearRestoreValue, useFireCMSContext } from "../../hooks";
+import {  useFireCMSContext } from "../../hooks";
 
 import { EntityTableCell } from "./internal/EntityTableCell";
 import { EntityTableCellActions } from "./internal/EntityTableCellActions";
 
 import { getRowHeight } from "../VirtualTable/common";
 import { useSelectableTableController } from "../SelectableTable/SelectableTableContext";
+import { useClearRestoreValue } from "../../form/useClearRestoreValue";
 
 export interface PropertyTableCellProps<T extends CMSType, M extends Record<string, any>> {
     propertyKey: string;

package/src/components/EntityCollectionTable/fields/TableReferenceField.tsx

@@ -96,7 +96,7 @@ export const TableReferenceFieldSuccess = React.memo(
         const valueNotSet = !internalValue || (Array.isArray(internalValue) && internalValue.length === 0);
 
         const buildSingleReferenceField = () => {
-            if (internalValue instanceof EntityReference)
+            if (internalValue && !Array.isArray(internalValue) && internalValue.isEntityReference && internalValue.isEntityReference())
                 return <ReferencePreview
                     onClick={disabled ? undefined : handleOpen}
                     size={getPreviewSizeFrom(size)}

package/src/components/EntityCollectionView/EntityCollectionView.tsx

@@ -433,7 +433,7 @@ export const EntityCollectionView = React.memo(
 
         const largeLayout = useLargeLayout();
 
-        const getActionsForEntity = useCallback(({ entity, customEntityActions }: {
+        const getActionsForEntity = ({ entity, customEntityActions }: {
             entity?: Entity<M>,
             customEntityActions?: EntityAction[]
         }): EntityAction[] => {
@@ -446,7 +446,7 @@ export const EntityCollectionView = React.memo(
             if (customEntityActions)
                 actions.push(...customEntityActions);
             return actions;
-        }, [authController, collection, createEnabled, fullPath]);
+        };
 
         const getIdColumnWidth = useCallback(() => {
             const entityActions = getActionsForEntity({});
@@ -456,12 +456,12 @@ export const EntityCollectionView = React.memo(
             return (largeLayout ? (80 + actionsWidth) : (70 + actionsWidth)) + (collapsedActions.length > 0 ? (largeLayout ? 40 : 30) : 0);
         }, [largeLayout]);
 
-        const tableRowActionsBuilder = useCallback(({
-                                                        entity,
-                                                        size,
-                                                        width,
-                                                        frozen
-                                                    }: {
+        const tableRowActionsBuilder = ({
+                                            entity,
+                                            size,
+                                            width,
+                                            frozen
+                                        }: {
             entity: Entity<any>,
             size: CollectionSize,
             width: number,
@@ -491,7 +491,7 @@ export const EntityCollectionView = React.memo(
                 />
             );
 
-        }, [isEntitySelected, collection, authController, fullPath, selectionEnabled, toggleEntitySelection, createEnabled]);
+        };
 
         const title = <Popover
             open={popOverOpen}

package/src/components/ReferenceWidget.tsx

@@ -9,13 +9,13 @@ import { Button, cn } from "@firecms/ui";
 export type ReferenceWidgetProps<M extends Record<string, any>> = {
     name?: string,
     multiselect?: boolean,
-    value: EntityReference<M> | EntityReference<M>[] | null,
+    value: EntityReference | EntityReference[] | null,
     onReferenceSelected?: (params: {
-        reference: EntityReference<M> | null,
+        reference: EntityReference | null,
         entity: Entity<M> | null
     }) => void,
     onMultipleReferenceSelected?: (params: {
-        references: EntityReference<M>[] | null,
+        references: EntityReference[] | null,
         entities: Entity<M>[] | null
     }) => void,
     path: string,
@@ -113,7 +113,7 @@ export function ReferenceWidget<M extends Record<string, any>>({
                     size={size}/>
             })}
         </div>
-    } else if (value instanceof EntityReference) {
+    } else if (value?.isEntityReference && value?.isEntityReference()) {
         child = <ReferencePreview
             reference={value}
             onClick={onEntryClick}

package/src/components/SelectableTable/filters/ReferenceFilterField.tsx

@@ -60,7 +60,7 @@ export function ReferenceFilterField({
 
     const selectedEntityIds = internalValue
         ? (Array.isArray(internalValue) ? internalValue.map((ref) => {
-            if (!(ref instanceof EntityReference)) {
+            if (!(ref?.isEntityReference && ref?.isEntityReference())) {
                 return null;
             }
             return ref.id;
@@ -74,7 +74,7 @@ export function ReferenceFilterField({
         let newValue = val;
         if (prevOpIsArray !== newOpIsArray) {
             // @ts-ignore
-            newValue = newOpIsArray ? (newValue instanceof EntityReference ? [newValue] : []) : undefined
+            newValue = newOpIsArray ? (newValue?.isEntityReference && newValue?.isEntityReference() ? [newValue] : []) : undefined
         }
 
         setOperation(op);

package/src/components/index.tsx

@@ -31,5 +31,4 @@ export * from "./FireCMSAppBar";
 
 export * from "./ArrayContainer";
 export * from "./ReferenceWidget";
-export * from "./LabelWithIcon";
 export * from "./SearchIconsView";

package/src/core/EntitySidePanel.tsx

@@ -4,7 +4,7 @@ import { EntitySidePanelProps } from "../types";
 import { useNavigationController } from "../hooks";
 
 import { ErrorBoundary } from "../components";
-import { EntityView } from "../internal/EntityView";
+import { EntityView } from "./EntityView";
 import { useSideDialogContext } from "./SideDialogs";
 
 /**

package/src/{internal → core}/EntityView.tsx

@@ -32,8 +32,8 @@ import {
 import { EntityForm } from "../form";
 import { CircularProgress, CloseIcon, cn, defaultBorderMixin, IconButton, Tab, Tabs, Typography } from "@firecms/ui";
 import { EntityFormSaveParams } from "../form/EntityForm";
-import { FORM_CONTAINER_WIDTH } from "./common";
-import { useSideDialogContext } from "../core";
+import { FORM_CONTAINER_WIDTH } from "../internal/common";
+import { useSideDialogContext } from "./index";
 
 const MAIN_TAB_VALUE = "main_##Q$SC^#S6";
 

package/src/core/SideEntityView.tsx

@@ -0,0 +1,38 @@
+import { EntityViewProps } from "./EntityView";
+import { User } from "../types";
+import { useSideDialogContext } from "./SideDialogs";
+import { useSideEntityController } from "../hooks";
+import { FORM_CONTAINER_WIDTH } from "../internal/common";
+
+export type SideEntityViewProps<M extends Record<string, any>> = EntityViewProps<M> & {
+    formWidth?: number | string;
+    onClose?: () => void;
+}
+
+export function SideEntityView<M extends Record<string, any>, UserType extends User>({
+                                                                                         path,
+                                                                                         entityId,
+                                                                                         selectedSubPath,
+                                                                                         copy,
+                                                                                         collection,
+                                                                                         parentCollectionIds,
+                                                                                         onValuesAreModified,
+                                                                                         formWidth,
+                                                                                         onUpdate,
+                                                                                         onClose
+                                                                                     }: SideEntityViewProps<M>) {
+
+    const sideDialogContext = useSideDialogContext();
+    const sideEntityController = useSideEntityController();
+    const resolvedFormWidth: string = typeof formWidth === "number" ? `${formWidth}px` : formWidth ?? FORM_CONTAINER_WIDTH;
+
+    const onCloseHandler = () => {
+        if (onClose) {
+            onClose();
+        } else {
+            sideDialogContext.close();
+        }
+    }
+
+    return <></>;
+}

package/src/core/index.tsx

@@ -10,5 +10,3 @@ export * from "./field_configs";
 
 export * from "./SideDialogs";
 export * from "./NavigationRoutes";
-export * from "./useBuildModeController";
-export * from "./useBuildLocalConfigurationPersistence";

package/src/form/components/index.tsx

@@ -1,2 +1,3 @@
 export * from "./FormikArrayContainer";
 export * from "./FieldHelperText";
+export * from "./LabelWithIcon";

package/src/form/field_bindings/ArrayCustomShapedFieldBinding.tsx

@@ -1,11 +1,10 @@
 import React from "react";
 import { FieldProps } from "../../types";
-import { FieldHelperText } from "../components";
+import { FieldHelperText, LabelWithIcon } from "../components";
 import { PropertyFieldBinding } from "../PropertyFieldBinding";
-import { useClearRestoreValue } from "../../hooks";
 import { ExpandablePanel } from "@firecms/ui";
 import { getIconForProperty } from "../../util";
-import { LabelWithIcon } from "../../components";
+import { useClearRestoreValue } from "../useClearRestoreValue";
 
 /**
  * Array field used for custom

package/src/form/field_bindings/ArrayOfReferencesFieldBinding.tsx

@@ -1,12 +1,13 @@
 import React, { useCallback, useMemo } from "react";
 import { Entity, EntityCollection, EntityReference, FieldProps, ResolvedProperty } from "../../types";
 import { ReferencePreview } from "../../preview";
-import { FieldHelperText, FormikArrayContainer } from "../components";
-import { ErrorView, LabelWithIcon } from "../../components";
+import { FieldHelperText, FormikArrayContainer, LabelWithIcon } from "../components";
+import { ErrorView } from "../../components";
 import { getIconForProperty, getReferenceFrom } from "../../util";
 
-import { useClearRestoreValue, useNavigationController, useReferenceDialog } from "../../hooks";
+import { useNavigationController, useReferenceDialog } from "../../hooks";
 import { Button, ExpandablePanel } from "@firecms/ui";
+import { useClearRestoreValue } from "../useClearRestoreValue";
 
 type ArrayOfReferencesFieldProps = FieldProps<EntityReference[]>;
 

package/src/form/field_bindings/BlockFieldBinding.tsx

@@ -2,15 +2,14 @@ import React, { useCallback, useEffect, useState } from "react";
 
 import { Field, useFormex } from "@firecms/formex";
 
-import { FieldHelperText, FormikArrayContainer } from "../components";
-import { LabelWithIcon } from "../../components";
-import { useClearRestoreValue } from "../../hooks";
+import { FieldHelperText, FormikArrayContainer, LabelWithIcon } from "../components";
 import { PropertyFieldBinding } from "../PropertyFieldBinding";
 import { EnumValuesChip } from "../../preview";
 import { FieldProps, FormContext, PropertyFieldBindingProps, PropertyOrBuilder } from "../../types";
 import { getDefaultValueFor, getIconForProperty, } from "../../util";
 import { DEFAULT_ONE_OF_TYPE, DEFAULT_ONE_OF_VALUE } from "../../util/common";
 import { cn, ExpandablePanel, paperMixin, Select, SelectItem, Typography } from "@firecms/ui";
+import { useClearRestoreValue } from "../useClearRestoreValue";
 
 /**
  * If the `oneOf` property is specified, this fields render each array entry as

package/src/form/field_bindings/DateTimeFieldBinding.tsx

@@ -2,11 +2,11 @@ import React from "react";
 
 import { FieldProps } from "../../types";
 
-import { FieldHelperText } from "../components";
-import { LabelWithIcon } from "../../components";
-import { useClearRestoreValue, useCustomizationController } from "../../hooks";
+import { FieldHelperText, LabelWithIcon } from "../components";
+import { useCustomizationController } from "../../hooks";
 import { getIconForProperty } from "../../util";
 import { DateTimeField } from "@firecms/ui";
+import { useClearRestoreValue } from "../useClearRestoreValue";
 
 type DateTimeFieldProps = FieldProps<Date>;
 

package/src/form/field_bindings/KeyValueFieldBinding.tsx

@@ -1,8 +1,8 @@
 import React, { useEffect, useState } from "react";
-import { DataType, EntityReference, FieldProps, GeoPoint } from "../../types";
+import { DataType, FieldProps, GeoPoint } from "../../types";
 
-import { ArrayContainer, LabelWithIcon } from "../../components";
-import { FieldHelperText } from "../components";
+import { ArrayContainer } from "../../components";
+import { FieldHelperText, LabelWithIcon } from "../components";
 import {
     AddIcon,
     ArrowDropDownIcon,
@@ -546,7 +546,7 @@ function getDataType(value: any): DataType | undefined {
         return "array";
     } else if (value instanceof Date) {
         return "date";
-    } else if (value instanceof EntityReference) {
+    } else if (value?.isEntityReference && value?.isEntityReference()) {
         return "reference";
     } else if (value instanceof GeoPoint) {
         return "geopoint";

package/src/form/field_bindings/MapFieldBinding.tsx

@@ -1,9 +1,9 @@
 import React from "react";
 import { FieldProps, Properties, ResolvedProperties } from "../../types";
 
-import { ErrorBoundary, LabelWithIcon } from "../../components";
+import { ErrorBoundary } from "../../components";
 import { getIconForProperty, isHidden, pick } from "../../util";
-import { FieldHelperText } from "../components";
+import { FieldHelperText, LabelWithIcon } from "../components";
 import { PropertyFieldBinding } from "../PropertyFieldBinding";
 import { ExpandablePanel, InputLabel, Select, SelectItem } from "@firecms/ui";
 

package/src/form/field_bindings/MarkdownFieldBinding.tsx

@@ -4,8 +4,7 @@ import React, { useDeferredValue, useEffect, useRef } from "react";
 import MarkdownIt from "markdown-it";
 import MdEditor, { Plugins } from "react-markdown-editor-lite";
 
-import { FieldHelperText } from "../components";
-import { LabelWithIcon } from "../../components";
+import { FieldHelperText, LabelWithIcon } from "../components";
 import { FieldProps } from "../../types";
 import { getIconForProperty } from "../../util";
 import {

package/src/form/field_bindings/MultiSelectBinding.tsx

@@ -1,12 +1,11 @@
 import React, { useCallback } from "react";
 
 import { EnumType, FieldProps, ResolvedProperty } from "../../types";
-import { FieldHelperText } from "../components";
-import { LabelWithIcon } from "../../components";
-import { useClearRestoreValue } from "../../hooks";
+import { FieldHelperText, LabelWithIcon } from "../components";
 import { EnumValuesChip } from "../../preview";
 import { enumToObjectEntries, getIconForProperty, getLabelOrConfigFrom } from "../../util";
 import { CloseIcon, MultiSelect, MultiSelectItem } from "@firecms/ui";
+import { useClearRestoreValue } from "../useClearRestoreValue";
 
 /**
  * This fields renders a dropdown with multiple selection.

package/src/form/field_bindings/ReadOnlyFieldBinding.tsx

@@ -3,8 +3,8 @@ import React from "react";
 import { Entity, FieldProps } from "../../types";
 
 import { PropertyPreview } from "../../preview";
-import { FieldHelperText } from "../components";
-import { ErrorBoundary, LabelWithIcon } from "../../components";
+import { FieldHelperText, LabelWithIcon } from "../components";
+import { ErrorBoundary } from "../../components";
 import { getIconForProperty } from "../../util";
 import { cn, paperMixin } from "@firecms/ui";