@webiny/app-headless-cms 6.0.0-beta.0 → 6.0.0-rc.1

package/admin/plugins/fieldRenderers/ref/components/useReferences.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","require","_hooks","_graphql","_helpers","useReferences","exports","_ref","bind","field","isMounted","useRef","allEntries","client","useApolloClient","_useState","useState","_useState2","_slicedToArray2","default","search","setSearch","_useState3","_useState4","loading","setLoading","_useState5","_useState6","entries","setEntries","_useState7","_useState8","latestEntries","setLatestEntries","_useState9","_useState10","valueEntries","setValueEntries","requestContext","useModelFieldGraphqlContext","models","settings","modelsHash","join","values","value","searchEntries","_await$client$query","query","SEARCH_CONTENT_ENTRIES","variables","modelIds","map","m","modelId","context","data","collection","convertReferenceEntriesToOptionCollection","content","current","_objectSpread2","useEffect","limit","fetchPolicy","then","_ref2","Object","length","GET_CONTENT_ENTRIES","id","res","latest","reduce","item","entryId","published","existingItem","title","convertReferenceEntryToOption","onChange","useCallback","options","useMemo","defaultOptions"],"sources":["useReferences.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { useApolloClient, useModelFieldGraphqlContext } from \"~/admin/hooks\";\nimport { CmsModelField, CmsModel } from \"~/types\";\nimport {\n    SEARCH_CONTENT_ENTRIES,\n    GET_CONTENT_ENTRIES,\n    CmsEntrySearchQueryResponse,\n    CmsEntrySearchQueryVariables,\n    CmsEntryGetListResponse,\n    CmsEntryGetListVariables,\n    CmsEntryGetEntryVariable\n} from \"./graphql\";\nimport { BindComponentRenderProp } from \"@webiny/form\";\nimport { CmsReferenceContentEntry, OptionItem, OptionItemCollection } from \"./types\";\nimport {\n    convertReferenceEntriesToOptionCollection,\n    convertReferenceEntryToOption\n} from \"~/admin/plugins/fieldRenderers/ref/components/helpers\";\n\ninterface UseReferencesParams {\n    bind: BindComponentRenderProp;\n    field: CmsModelField;\n}\nexport const useReferences = ({ bind, field }: UseReferencesParams) => {\n    const isMounted = useRef(true);\n    const allEntries = useRef<OptionItemCollection>({});\n    const client = useApolloClient();\n    const [search, setSearch] = useState<string>(\"\");\n    const [loading, setLoading] = useState<boolean>(false);\n    const [entries, setEntries] = useState<OptionItemCollection>({});\n    const [latestEntries, setLatestEntries] = useState<OptionItem[]>([]);\n    const [valueEntries, setValueEntries] = useState<OptionItem[]>([]);\n    const requestContext = useModelFieldGraphqlContext();\n\n    const models = (field.settings ? field.settings.models || [] : []) as Pick<\n        CmsModel,\n        \"modelId\"\n    >[];\n    const modelsHash = models.join(\",\");\n    const values: CmsEntryGetEntryVariable[] = bind.value ? bind.value : [];\n\n    const searchEntries = async (): Promise<void> => {\n        if (!search) {\n            return;\n        }\n\n        setLoading(true);\n        const { data } = await client.query<\n            CmsEntrySearchQueryResponse,\n            CmsEntrySearchQueryVariables\n        >({\n            query: SEARCH_CONTENT_ENTRIES,\n            variables: {\n                modelIds: models.map(m => m.modelId),\n                query: search\n            },\n            context: requestContext\n        });\n        setLoading(false);\n\n        const collection = convertReferenceEntriesToOptionCollection(data.content.data);\n\n        allEntries.current = {\n            ...allEntries.current,\n            ...collection\n        };\n\n        setEntries(collection);\n    };\n\n    useEffect(() => {\n        return () => {\n            isMounted.current = false;\n        };\n    }, []);\n\n    useEffect(() => {\n        searchEntries();\n    }, [search]);\n\n    useEffect(() => {\n        client\n            .query<CmsEntrySearchQueryResponse, CmsEntrySearchQueryVariables>({\n                query: SEARCH_CONTENT_ENTRIES,\n                variables: {\n                    modelIds: models.map(m => m.modelId),\n                    limit: 10\n                },\n                /**\n                 * We cannot update this query response in cache after a reference entry being created/deleted,\n                 * which result in cached response being stale, therefore, we're setting the fetchPolicy to \"network-only\" to by passing cache.\n                 */\n                fetchPolicy: \"network-only\",\n                context: requestContext\n            })\n            .then(({ data }) => {\n                if (!isMounted.current) {\n                    return;\n                }\n\n                const collection = convertReferenceEntriesToOptionCollection(data.content.data);\n                setLatestEntries(Object.values(collection));\n                allEntries.current = {\n                    ...collection\n                };\n            });\n    }, [modelsHash]);\n\n    useEffect(() => {\n        if (!values || values.length == 0) {\n            return;\n        }\n\n        setLoading(true);\n\n        client\n            .query<CmsEntryGetListResponse, CmsEntryGetListVariables>({\n                query: GET_CONTENT_ENTRIES,\n                variables: {\n                    /**\n                     * We need make sure nothing else other than modelId and id is passed to entries variable.\n                     */\n                    entries: values.map(value => {\n                        return {\n                            modelId: value.modelId,\n                            id: value.id\n                        };\n                    })\n                },\n                context: requestContext\n            })\n            .then(res => {\n                if (!isMounted.current) {\n                    return;\n                }\n\n                setLoading(false);\n\n                const latest = (res.data.latest.data || []).reduce((collection, item) => {\n                    collection[item.entryId] = item;\n                    return collection;\n                }, {} as Record<string, CmsReferenceContentEntry>);\n\n                const entries = (res.data.published.data || []).reduce((collection, item) => {\n                    const entryId = item.entryId;\n                    const existingItem = latest[entryId];\n                    if (existingItem) {\n                        collection[entryId] = {\n                            ...existingItem,\n                            published: {\n                                id: item.id,\n                                entryId: item.entryId,\n                                title: item.title\n                            }\n                        };\n                        return collection;\n                    }\n                    collection[entryId] = item;\n                    return collection;\n                }, latest);\n\n                // Calculate a couple of props for the Autocomplete component.\n                setValueEntries(Object.values(entries).map(convertReferenceEntryToOption));\n            });\n    }, []);\n\n    /**\n     * onChange callback will update internal component state using the previously loaded entries by IDs.\n     * It will also format the value to store to the DB.\n     */\n    const onChange = useCallback((values: OptionItem[]): void => {\n        setSearch(\"\");\n        setValueEntries(values);\n\n        // Update parent form\n        bind.onChange(\n            values.map(item => ({\n                modelId: item.modelId,\n                id: item.id\n            }))\n        );\n    }, []);\n\n    // Format options for the Autocomplete component.\n    const options = useMemo(() => Object.values(entries), [entries]);\n\n    // Format default options for the Autocomplete component.\n    const defaultOptions = useMemo(() => Object.values(latestEntries), [latestEntries]);\n\n    return {\n        onChange,\n        loading,\n        setSearch,\n        // Selected entries\n        entries: valueEntries,\n        // Options to show when the autocomplete dropdown is visible\n        options: search ? options : defaultOptions || []\n    };\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useCallback","useEffect","useMemo","useRef","useState","useApolloClient","useModelFieldGraphqlContext","SEARCH_CONTENT_ENTRIES","GET_CONTENT_ENTRIES","convertReferenceEntriesToOptionCollection","convertReferenceEntryToOption","useReferences","bind","field","isMounted","allEntries","client","search","setSearch","loading","setLoading","entries","setEntries","latestEntries","setLatestEntries","valueEntries","setValueEntries","requestContext","models","settings","modelsHash","join","values","value","searchEntries","data","query","variables","modelIds","map","m","modelId","context","collection","content","current","limit","fetchPolicy","then","Object","length","id","res","latest","reduce","item","entryId","published","existingItem","title","onChange","options","defaultOptions"],"sources":["useReferences.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { useApolloClient, useModelFieldGraphqlContext } from \"~/admin/hooks/index.js\";\nimport type { CmsModelField, CmsModel } from \"~/types.js\";\nimport type {\n    CmsEntrySearchQueryResponse,\n    CmsEntrySearchQueryVariables,\n    CmsEntryGetListResponse,\n    CmsEntryGetListVariables,\n    CmsEntryGetEntryVariable\n} from \"./graphql.js\";\nimport { SEARCH_CONTENT_ENTRIES, GET_CONTENT_ENTRIES } from \"./graphql.js\";\nimport type { BindComponentRenderProp } from \"@webiny/form\";\nimport type { CmsReferenceContentEntry, OptionItem, OptionItemCollection } from \"./types.js\";\nimport {\n    convertReferenceEntriesToOptionCollection,\n    convertReferenceEntryToOption\n} from \"~/admin/plugins/fieldRenderers/ref/components/helpers.js\";\n\ninterface UseReferencesParams {\n    bind: BindComponentRenderProp;\n    field: CmsModelField;\n}\nexport const useReferences = ({ bind, field }: UseReferencesParams) => {\n    const isMounted = useRef(true);\n    const allEntries = useRef<OptionItemCollection>({});\n    const client = useApolloClient();\n    const [search, setSearch] = useState<string>(\"\");\n    const [loading, setLoading] = useState<boolean>(false);\n    const [entries, setEntries] = useState<OptionItemCollection>({});\n    const [latestEntries, setLatestEntries] = useState<OptionItem[]>([]);\n    const [valueEntries, setValueEntries] = useState<OptionItem[]>([]);\n    const requestContext = useModelFieldGraphqlContext();\n\n    const models = (field.settings ? field.settings.models || [] : []) as Pick<\n        CmsModel,\n        \"modelId\"\n    >[];\n    const modelsHash = models.join(\",\");\n    const values: CmsEntryGetEntryVariable[] = bind.value ? bind.value : [];\n\n    const searchEntries = async (): Promise<void> => {\n        if (!search) {\n            return;\n        }\n\n        setLoading(true);\n        const { data } = await client.query<\n            CmsEntrySearchQueryResponse,\n            CmsEntrySearchQueryVariables\n        >({\n            query: SEARCH_CONTENT_ENTRIES,\n            variables: {\n                modelIds: models.map(m => m.modelId),\n                query: search\n            },\n            context: requestContext\n        });\n        setLoading(false);\n\n        const collection = convertReferenceEntriesToOptionCollection(data.content.data);\n\n        allEntries.current = {\n            ...allEntries.current,\n            ...collection\n        };\n\n        setEntries(collection);\n    };\n\n    useEffect(() => {\n        return () => {\n            isMounted.current = false;\n        };\n    }, []);\n\n    useEffect(() => {\n        searchEntries();\n    }, [search]);\n\n    useEffect(() => {\n        client\n            .query<CmsEntrySearchQueryResponse, CmsEntrySearchQueryVariables>({\n                query: SEARCH_CONTENT_ENTRIES,\n                variables: {\n                    modelIds: models.map(m => m.modelId),\n                    limit: 10\n                },\n                /**\n                 * We cannot update this query response in cache after a reference entry being created/deleted,\n                 * which result in cached response being stale, therefore, we're setting the fetchPolicy to \"network-only\" to by passing cache.\n                 */\n                fetchPolicy: \"network-only\",\n                context: requestContext\n            })\n            .then(({ data }) => {\n                if (!isMounted.current) {\n                    return;\n                }\n\n                const collection = convertReferenceEntriesToOptionCollection(data.content.data);\n                setLatestEntries(Object.values(collection));\n                allEntries.current = {\n                    ...collection\n                };\n            });\n    }, [modelsHash]);\n\n    useEffect(() => {\n        if (!values || values.length == 0) {\n            return;\n        }\n\n        setLoading(true);\n\n        client\n            .query<CmsEntryGetListResponse, CmsEntryGetListVariables>({\n                query: GET_CONTENT_ENTRIES,\n                variables: {\n                    /**\n                     * We need make sure nothing else other than modelId and id is passed to entries variable.\n                     */\n                    entries: values.map(value => {\n                        return {\n                            modelId: value.modelId,\n                            id: value.id\n                        };\n                    })\n                },\n                context: requestContext\n            })\n            .then(res => {\n                if (!isMounted.current) {\n                    return;\n                }\n\n                setLoading(false);\n\n                const latest = (res.data.latest.data || []).reduce(\n                    (collection, item) => {\n                        collection[item.entryId] = item;\n                        return collection;\n                    },\n                    {} as Record<string, CmsReferenceContentEntry>\n                );\n\n                const entries = (res.data.published.data || []).reduce((collection, item) => {\n                    const entryId = item.entryId;\n                    const existingItem = latest[entryId];\n                    if (existingItem) {\n                        collection[entryId] = {\n                            ...existingItem,\n                            published: {\n                                id: item.id,\n                                entryId: item.entryId,\n                                title: item.title\n                            }\n                        };\n                        return collection;\n                    }\n                    collection[entryId] = item;\n                    return collection;\n                }, latest);\n\n                // Calculate a couple of props for the Autocomplete component.\n                setValueEntries(Object.values(entries).map(convertReferenceEntryToOption));\n            });\n    }, []);\n\n    /**\n     * onChange callback will update internal component state using the previously loaded entries by IDs.\n     * It will also format the value to store to the DB.\n     */\n    const onChange = useCallback((values: OptionItem[]): void => {\n        setSearch(\"\");\n        setValueEntries(values);\n\n        // Update parent form\n        bind.onChange(\n            values.map(item => ({\n                modelId: item.modelId,\n                id: item.id\n            }))\n        );\n    }, []);\n\n    // Format options for the Autocomplete component.\n    const options = useMemo(() => Object.values(entries), [entries]);\n\n    // Format default options for the Autocomplete component.\n    const defaultOptions = useMemo(() => Object.values(latestEntries), [latestEntries]);\n\n    return {\n        onChange,\n        loading,\n        setSearch,\n        // Selected entries\n        entries: valueEntries,\n        // Options to show when the autocomplete dropdown is visible\n        options: search ? options : defaultOptions || []\n    };\n};\n"],"mappings":"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","ignoreList":[]}

package/admin/plugins/fieldRenderers/ref/hooks/useNewRefEntry.d.ts

@@ -1,12 +1,12 @@
 import React from "react";
-import { CmsModelField } from "../../../../../types";
+import type { CmsModelField } from "../../../../../types.js";
 interface UseNewRefEntryParams {
     field: CmsModelField;
 }
 interface UseNewRefEntry {
     renderNewEntryModal: boolean;
     refModelId: string;
-    helpText: React.ReactElement;
+    help: React.ReactElement;
 }
 export declare const useNewRefEntry: ({ field }: UseNewRefEntryParams) => UseNewRefEntry;
 export {};

package/admin/plugins/fieldRenderers/ref/hooks/useNewRefEntry.js

@@ -1,25 +1,18 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useNewRefEntry = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireDefault(require("react"));
-var _MissingEntryHelpText = _interopRequireWildcard(require("../components/MissingEntryHelpText"));
-var _useContentEntries = require("../../../../views/contentEntries/hooks/useContentEntries");
-var useNewRefEntry = exports.useNewRefEntry = function useNewRefEntry(_ref) {
-  var field = _ref.field;
-  var models = (field.settings && field.settings.models ? field.settings.models : null) || [];
-  var _models = (0, _slicedToArray2.default)(models, 1),
-    refModelId = _models[0].modelId;
-  var referenceMultipleModels = models.length > 1;
-  var contentEntriesContext = null;
+import React from "react";
+import MissingEntryHelpText, { ReferenceMultipleModelsHelpText } from "../components/MissingEntryHelpText.js";
+import { useContentEntries } from "../../../../views/contentEntries/hooks/useContentEntries.js";
+export const useNewRefEntry = ({
+  field
+}) => {
+  const models = (field.settings && field.settings.models ? field.settings.models : null) || [];
+  const [{
+    modelId: refModelId
+  }] = models;
+  const referenceMultipleModels = models.length > 1;
+  let contentEntriesContext = null;
   try {
-    contentEntriesContext = (0, _useContentEntries.useContentEntries)();
-  } catch (_unused) {
+    contentEntriesContext = useContentEntries();
+  } catch {
     // Means there's no `ContentEntriesContextProvider`, so we must be in model editor "preview".
   }
 
@@ -30,8 +23,8 @@ var useNewRefEntry = exports.useNewRefEntry = function useNewRefEntry(_ref) {
    * And we also don't want to have new ref field Dialog in the preview tab.
    * Therefore, we check for "contentEntriesContext" to know that we're inside preview tab.
    */
-  var renderedInPreviewTab = contentEntriesContext === null;
-  var renderNewEntryModal = false;
+  const renderedInPreviewTab = contentEntriesContext === null;
+  let renderNewEntryModal = false;
   if (renderedInPreviewTab) {
     renderNewEntryModal = false;
   } else if (referenceMultipleModels) {
@@ -40,20 +33,20 @@ var useNewRefEntry = exports.useNewRefEntry = function useNewRefEntry(_ref) {
     renderNewEntryModal = !contentEntriesContext.insideDialog;
   }
   /**
-   * Set "helpText" value.
+   * Set "help" value.
    */
-  var helpText;
+  let help;
   if (referenceMultipleModels) {
-    helpText = /*#__PURE__*/_react.default.createElement(_MissingEntryHelpText.ReferenceMultipleModelsHelpText, null);
+    help = /*#__PURE__*/React.createElement(ReferenceMultipleModelsHelpText, null);
   } else {
-    helpText = /*#__PURE__*/_react.default.createElement(_MissingEntryHelpText.default, {
+    help = /*#__PURE__*/React.createElement(MissingEntryHelpText, {
       refModelId: refModelId
     });
   }
   return {
-    renderNewEntryModal: renderNewEntryModal,
-    refModelId: refModelId,
-    helpText: helpText
+    renderNewEntryModal,
+    refModelId,
+    help
   };
 };
 

package/admin/plugins/fieldRenderers/ref/hooks/useNewRefEntry.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_MissingEntryHelpText","_interopRequireWildcard","_useContentEntries","useNewRefEntry","exports","_ref","field","models","settings","_models","_slicedToArray2","default","refModelId","modelId","referenceMultipleModels","length","contentEntriesContext","useContentEntries","_unused","renderedInPreviewTab","renderNewEntryModal","insideDialog","helpText","createElement","ReferenceMultipleModelsHelpText"],"sources":["useNewRefEntry.tsx"],"sourcesContent":["import React from \"react\";\nimport { CmsModelField } from \"~/types\";\nimport MissingEntryHelpText, {\n    ReferenceMultipleModelsHelpText\n} from \"../components/MissingEntryHelpText\";\nimport { useContentEntries } from \"~/admin/views/contentEntries/hooks/useContentEntries\";\n\ninterface UseNewRefEntryParams {\n    field: CmsModelField;\n}\n\ninterface UseNewRefEntry {\n    renderNewEntryModal: boolean;\n    refModelId: string;\n    helpText: React.ReactElement;\n}\n\nexport const useNewRefEntry = ({ field }: UseNewRefEntryParams): UseNewRefEntry => {\n    const models = (field.settings && field.settings.models ? field.settings.models : null) || [];\n    const [{ modelId: refModelId }] = models;\n    const referenceMultipleModels = models.length > 1;\n\n    let contentEntriesContext = null;\n    try {\n        contentEntriesContext = useContentEntries();\n    } catch {\n        // Means there's no `ContentEntriesContextProvider`, so we must be in model editor \"preview\".\n    }\n\n    /**\n     * We don't wrap the \"ContentEntryForm\" with \"ContentEntriesContextProvider\"\n     * when rendering it inside content model editor's preview tab.\n     *\n     * And we also don't want to have new ref field Dialog in the preview tab.\n     * Therefore, we check for \"contentEntriesContext\" to know that we're inside preview tab.\n     */\n    const renderedInPreviewTab = contentEntriesContext === null;\n\n    let renderNewEntryModal = false;\n\n    if (renderedInPreviewTab) {\n        renderNewEntryModal = false;\n    } else if (referenceMultipleModels) {\n        renderNewEntryModal = false;\n    } else if (contentEntriesContext) {\n        renderNewEntryModal = !contentEntriesContext.insideDialog;\n    }\n    /**\n     * Set \"helpText\" value.\n     */\n    let helpText;\n    if (referenceMultipleModels) {\n        helpText = <ReferenceMultipleModelsHelpText />;\n    } else {\n        helpText = <MissingEntryHelpText refModelId={refModelId} />;\n    }\n\n    return {\n        renderNewEntryModal,\n        refModelId,\n        helpText\n    };\n};\n"],"mappings":";;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,qBAAA,GAAAC,uBAAA,CAAAF,OAAA;AAGA,IAAAG,kBAAA,GAAAH,OAAA;AAYO,IAAMI,cAAc,GAAAC,OAAA,CAAAD,cAAA,GAAG,SAAjBA,cAAcA,CAAAE,IAAA,EAAwD;EAAA,IAAlDC,KAAK,GAAAD,IAAA,CAALC,KAAK;EAClC,IAAMC,MAAM,GAAG,CAACD,KAAK,CAACE,QAAQ,IAAIF,KAAK,CAACE,QAAQ,CAACD,MAAM,GAAGD,KAAK,CAACE,QAAQ,CAACD,MAAM,GAAG,IAAI,KAAK,EAAE;EAC7F,IAAAE,OAAA,OAAAC,eAAA,CAAAC,OAAA,EAAkCJ,MAAM;IAAtBK,UAAU,GAAAH,OAAA,IAAnBI,OAAO;EAChB,IAAMC,uBAAuB,GAAGP,MAAM,CAACQ,MAAM,GAAG,CAAC;EAEjD,IAAIC,qBAAqB,GAAG,IAAI;EAChC,IAAI;IACAA,qBAAqB,GAAG,IAAAC,oCAAiB,EAAC,CAAC;EAC/C,CAAC,CAAC,OAAAC,OAAA,EAAM;IACJ;EAAA;;EAGJ;AACJ;AACA;AACA;AACA;AACA;AACA;EACI,IAAMC,oBAAoB,GAAGH,qBAAqB,KAAK,IAAI;EAE3D,IAAII,mBAAmB,GAAG,KAAK;EAE/B,IAAID,oBAAoB,EAAE;IACtBC,mBAAmB,GAAG,KAAK;EAC/B,CAAC,MAAM,IAAIN,uBAAuB,EAAE;IAChCM,mBAAmB,GAAG,KAAK;EAC/B,CAAC,MAAM,IAAIJ,qBAAqB,EAAE;IAC9BI,mBAAmB,GAAG,CAACJ,qBAAqB,CAACK,YAAY;EAC7D;EACA;AACJ;AACA;EACI,IAAIC,QAAQ;EACZ,IAAIR,uBAAuB,EAAE;IACzBQ,QAAQ,gBAAGzB,MAAA,CAAAc,OAAA,CAAAY,aAAA,CAACvB,qBAAA,CAAAwB,+BAA+B,MAAE,CAAC;EAClD,CAAC,MAAM;IACHF,QAAQ,gBAAGzB,MAAA,CAAAc,OAAA,CAAAY,aAAA,CAACvB,qBAAA,CAAAW,OAAoB;MAACC,UAAU,EAAEA;IAAW,CAAE,CAAC;EAC/D;EAEA,OAAO;IACHQ,mBAAmB,EAAnBA,mBAAmB;IACnBR,UAAU,EAAVA,UAAU;IACVU,QAAQ,EAARA;EACJ,CAAC;AACL,CAAC","ignoreList":[]}
+{"version":3,"names":["React","MissingEntryHelpText","ReferenceMultipleModelsHelpText","useContentEntries","useNewRefEntry","field","models","settings","modelId","refModelId","referenceMultipleModels","length","contentEntriesContext","renderedInPreviewTab","renderNewEntryModal","insideDialog","help","createElement"],"sources":["useNewRefEntry.tsx"],"sourcesContent":["import React from \"react\";\nimport type { CmsModelField } from \"~/types.js\";\nimport MissingEntryHelpText, {\n    ReferenceMultipleModelsHelpText\n} from \"../components/MissingEntryHelpText.js\";\nimport { useContentEntries } from \"~/admin/views/contentEntries/hooks/useContentEntries.js\";\n\ninterface UseNewRefEntryParams {\n    field: CmsModelField;\n}\n\ninterface UseNewRefEntry {\n    renderNewEntryModal: boolean;\n    refModelId: string;\n    help: React.ReactElement;\n}\n\nexport const useNewRefEntry = ({ field }: UseNewRefEntryParams): UseNewRefEntry => {\n    const models = (field.settings && field.settings.models ? field.settings.models : null) || [];\n    const [{ modelId: refModelId }] = models;\n    const referenceMultipleModels = models.length > 1;\n\n    let contentEntriesContext = null;\n    try {\n        contentEntriesContext = useContentEntries();\n    } catch {\n        // Means there's no `ContentEntriesContextProvider`, so we must be in model editor \"preview\".\n    }\n\n    /**\n     * We don't wrap the \"ContentEntryForm\" with \"ContentEntriesContextProvider\"\n     * when rendering it inside content model editor's preview tab.\n     *\n     * And we also don't want to have new ref field Dialog in the preview tab.\n     * Therefore, we check for \"contentEntriesContext\" to know that we're inside preview tab.\n     */\n    const renderedInPreviewTab = contentEntriesContext === null;\n\n    let renderNewEntryModal = false;\n\n    if (renderedInPreviewTab) {\n        renderNewEntryModal = false;\n    } else if (referenceMultipleModels) {\n        renderNewEntryModal = false;\n    } else if (contentEntriesContext) {\n        renderNewEntryModal = !contentEntriesContext.insideDialog;\n    }\n    /**\n     * Set \"help\" value.\n     */\n    let help;\n    if (referenceMultipleModels) {\n        help = <ReferenceMultipleModelsHelpText />;\n    } else {\n        help = <MissingEntryHelpText refModelId={refModelId} />;\n    }\n\n    return {\n        renderNewEntryModal,\n        refModelId,\n        help\n    };\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,OAAOC,oBAAoB,IACvBC,+BAA+B;AAEnC,SAASC,iBAAiB;AAY1B,OAAO,MAAMC,cAAc,GAAGA,CAAC;EAAEC;AAA4B,CAAC,KAAqB;EAC/E,MAAMC,MAAM,GAAG,CAACD,KAAK,CAACE,QAAQ,IAAIF,KAAK,CAACE,QAAQ,CAACD,MAAM,GAAGD,KAAK,CAACE,QAAQ,CAACD,MAAM,GAAG,IAAI,KAAK,EAAE;EAC7F,MAAM,CAAC;IAAEE,OAAO,EAAEC;EAAW,CAAC,CAAC,GAAGH,MAAM;EACxC,MAAMI,uBAAuB,GAAGJ,MAAM,CAACK,MAAM,GAAG,CAAC;EAEjD,IAAIC,qBAAqB,GAAG,IAAI;EAChC,IAAI;IACAA,qBAAqB,GAAGT,iBAAiB,CAAC,CAAC;EAC/C,CAAC,CAAC,MAAM;IACJ;EAAA;;EAGJ;AACJ;AACA;AACA;AACA;AACA;AACA;EACI,MAAMU,oBAAoB,GAAGD,qBAAqB,KAAK,IAAI;EAE3D,IAAIE,mBAAmB,GAAG,KAAK;EAE/B,IAAID,oBAAoB,EAAE;IACtBC,mBAAmB,GAAG,KAAK;EAC/B,CAAC,MAAM,IAAIJ,uBAAuB,EAAE;IAChCI,mBAAmB,GAAG,KAAK;EAC/B,CAAC,MAAM,IAAIF,qBAAqB,EAAE;IAC9BE,mBAAmB,GAAG,CAACF,qBAAqB,CAACG,YAAY;EAC7D;EACA;AACJ;AACA;EACI,IAAIC,IAAI;EACR,IAAIN,uBAAuB,EAAE;IACzBM,IAAI,gBAAGhB,KAAA,CAAAiB,aAAA,CAACf,+BAA+B,MAAE,CAAC;EAC9C,CAAC,MAAM;IACHc,IAAI,gBAAGhB,KAAA,CAAAiB,aAAA,CAAChB,oBAAoB;MAACQ,UAAU,EAAEA;IAAW,CAAE,CAAC;EAC3D;EAEA,OAAO;IACHK,mBAAmB;IACnBL,UAAU;IACVO;EACJ,CAAC;AACL,CAAC","ignoreList":[]}

package/admin/plugins/fieldRenderers/ref/index.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("@webiny/app-headless-cms-common/types").CmsModelFieldRendererPlugin[];
+declare const _default: import("@webiny/app-headless-cms-common/types/index.js").CmsModelFieldRendererPlugin[];
 export default _default;

package/admin/plugins/fieldRenderers/ref/index.js

@@ -1,15 +1,7 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _refInput = _interopRequireDefault(require("./refInput"));
-var _refInputs = _interopRequireDefault(require("./refInputs"));
-var _advanced = require("./advanced");
-var _simple = require("./simple");
-var _default = exports.default = [].concat((0, _toConsumableArray2.default)((0, _advanced.createAdvancedRefRenderer)()), [_refInput.default, _refInputs.default], (0, _toConsumableArray2.default)((0, _simple.createSimpleRefRenderer)()));
+import refInput from "./refInput.js";
+import refInputs from "./refInputs.js";
+import { createAdvancedRefRenderer } from "./advanced/index.js";
+import { createSimpleRefRenderer } from "./simple/index.js";
+export default [...createAdvancedRefRenderer(), refInput, refInputs, ...createSimpleRefRenderer()];
 
 //# sourceMappingURL=index.js.map

package/admin/plugins/fieldRenderers/ref/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_refInput","_interopRequireDefault","require","_refInputs","_advanced","_simple","_default","exports","default","concat","_toConsumableArray2","createAdvancedRefRenderer","refInput","refInputs","createSimpleRefRenderer"],"sources":["index.ts"],"sourcesContent":["import refInput from \"./refInput\";\nimport refInputs from \"./refInputs\";\nimport { createAdvancedRefRenderer } from \"./advanced\";\nimport { createSimpleRefRenderer } from \"./simple\";\n\nexport default [...createAdvancedRefRenderer(), refInput, refInputs, ...createSimpleRefRenderer()];\n"],"mappings":";;;;;;;;AAAA,IAAAA,SAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,SAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA;AAAmD,IAAAI,QAAA,GAAAC,OAAA,CAAAC,OAAA,MAAAC,MAAA,KAAAC,mBAAA,CAAAF,OAAA,EAEhC,IAAAG,mCAAyB,EAAC,CAAC,IAAEC,iBAAQ,EAAEC,kBAAS,OAAAH,mBAAA,CAAAF,OAAA,EAAK,IAAAM,+BAAuB,EAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["refInput","refInputs","createAdvancedRefRenderer","createSimpleRefRenderer"],"sources":["index.ts"],"sourcesContent":["import refInput from \"./refInput.js\";\nimport refInputs from \"./refInputs.js\";\nimport { createAdvancedRefRenderer } from \"./advanced/index.js\";\nimport { createSimpleRefRenderer } from \"./simple/index.js\";\n\nexport default [...createAdvancedRefRenderer(), refInput, refInputs, ...createSimpleRefRenderer()];\n"],"mappings":"AAAA,OAAOA,QAAQ;AACf,OAAOC,SAAS;AAChB,SAASC,yBAAyB;AAClC,SAASC,uBAAuB;AAEhC,eAAe,CAAC,GAAGD,yBAAyB,CAAC,CAAC,EAAEF,QAAQ,EAAEC,SAAS,EAAE,GAAGE,uBAAuB,CAAC,CAAC,CAAC","ignoreList":[]}

package/admin/plugins/fieldRenderers/ref/refInput.d.ts

@@ -1,3 +1,3 @@
-import { CmsModelFieldRendererPlugin } from "../../../../types";
+import type { CmsModelFieldRendererPlugin } from "../../../../types.js";
 declare const plugin: CmsModelFieldRendererPlugin;
 export default plugin;

package/admin/plugins/fieldRenderers/ref/refInput.js

@@ -1,37 +1,27 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = _interopRequireDefault(require("react"));
-var _i18n = require("@webiny/app/i18n");
-var _ContentEntriesAutocomplete = _interopRequireDefault(require("./components/ContentEntriesAutocomplete"));
-var _templateObject, _templateObject2;
-var t = _i18n.i18n.ns("app-headless-cms/admin/fields/ref");
-var plugin = {
+import React from "react";
+import { i18n } from "@webiny/app/i18n/index.js";
+import ContentEntriesAutocomplete from "./components/ContentEntriesAutocomplete.js";
+const t = i18n.ns("app-headless-cms/admin/fields/ref");
+const plugin = {
   type: "cms-editor-field-renderer",
   name: "cms-editor-field-renderer-ref",
   renderer: {
     rendererName: "ref-input",
-    name: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Reference Input"]))),
-    description: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Renders an auto-complete input, allowing selection of a single value."]))),
-    canUse: function canUse(_ref) {
-      var field = _ref.field;
-      return field.type === "ref" && !field.multipleValues;
+    name: t`Reference Input`,
+    description: t`Renders an auto-complete input, allowing selection of a single value.`,
+    canUse({
+      field
+    }) {
+      return field.type === "ref" && !field.list;
     },
-    render: function render(props) {
-      var Bind = props.getBind();
-      return /*#__PURE__*/_react.default.createElement(Bind, null, function (bind) {
-        return /*#__PURE__*/_react.default.createElement(_ContentEntriesAutocomplete.default, Object.assign({}, props, {
-          bind: bind
-        }));
-      });
+    render(props) {
+      const Bind = props.getBind();
+      return /*#__PURE__*/React.createElement(Bind, null, bind => /*#__PURE__*/React.createElement(Bind.ValidationContainer, null, /*#__PURE__*/React.createElement(ContentEntriesAutocomplete, Object.assign({}, props, {
+        bind: bind
+      }))));
     }
   }
 };
-var _default = exports.default = plugin;
+export default plugin;
 
 //# sourceMappingURL=refInput.js.map

package/admin/plugins/fieldRenderers/ref/refInput.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_i18n","_ContentEntriesAutocomplete","_templateObject","_templateObject2","t","i18n","ns","plugin","type","name","renderer","rendererName","_taggedTemplateLiteral2","default","description","canUse","_ref","field","multipleValues","render","props","Bind","getBind","createElement","bind","Object","assign","_default","exports"],"sources":["refInput.tsx"],"sourcesContent":["import React from \"react\";\nimport { CmsModelFieldRendererPlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport ContentEntriesAutocomplete from \"./components/ContentEntriesAutocomplete\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/ref\");\n\nconst plugin: CmsModelFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-ref\",\n    renderer: {\n        rendererName: \"ref-input\",\n        name: t`Reference Input`,\n        description: t`Renders an auto-complete input, allowing selection of a single value.`,\n        canUse({ field }) {\n            return field.type === \"ref\" && !field.multipleValues;\n        },\n        render(props) {\n            const Bind = props.getBind();\n\n            return <Bind>{bind => <ContentEntriesAutocomplete {...props} bind={bind} />}</Bind>;\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,2BAAA,GAAAH,sBAAA,CAAAC,OAAA;AAAiF,IAAAG,eAAA,EAAAC,gBAAA;AAEjF,IAAMC,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,mCAAmC,CAAC;AAEtD,IAAMC,MAAmC,GAAG;EACxCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,+BAA+B;EACrCC,QAAQ,EAAE;IACNC,YAAY,EAAE,WAAW;IACzBF,IAAI,EAAEL,CAAC,CAAAF,eAAA,KAAAA,eAAA,OAAAU,uBAAA,CAAAC,OAAA,wBAAiB;IACxBC,WAAW,EAAEV,CAAC,CAAAD,gBAAA,KAAAA,gBAAA,OAAAS,uBAAA,CAAAC,OAAA,8EAAuE;IACrFE,MAAM,WAAAA,OAAAC,IAAA,EAAY;MAAA,IAATC,KAAK,GAAAD,IAAA,CAALC,KAAK;MACV,OAAOA,KAAK,CAACT,IAAI,KAAK,KAAK,IAAI,CAACS,KAAK,CAACC,cAAc;IACxD,CAAC;IACDC,MAAM,WAAAA,OAACC,KAAK,EAAE;MACV,IAAMC,IAAI,GAAGD,KAAK,CAACE,OAAO,CAAC,CAAC;MAE5B,oBAAOzB,MAAA,CAAAgB,OAAA,CAAAU,aAAA,CAACF,IAAI,QAAE,UAAAG,IAAI;QAAA,oBAAI3B,MAAA,CAAAgB,OAAA,CAAAU,aAAA,CAACtB,2BAAA,CAAAY,OAA0B,EAAAY,MAAA,CAAAC,MAAA,KAAKN,KAAK;UAAEI,IAAI,EAAEA;QAAK,EAAE,CAAC;MAAA,CAAO,CAAC;IACvF;EACJ;AACJ,CAAC;AAAC,IAAAG,QAAA,GAAAC,OAAA,CAAAf,OAAA,GAEaN,MAAM","ignoreList":[]}
+{"version":3,"names":["React","i18n","ContentEntriesAutocomplete","t","ns","plugin","type","name","renderer","rendererName","description","canUse","field","list","render","props","Bind","getBind","createElement","bind","ValidationContainer","Object","assign"],"sources":["refInput.tsx"],"sourcesContent":["import React from \"react\";\nimport type { CmsModelFieldRendererPlugin } from \"~/types.js\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport ContentEntriesAutocomplete from \"./components/ContentEntriesAutocomplete.js\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/ref\");\n\nconst plugin: CmsModelFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-ref\",\n    renderer: {\n        rendererName: \"ref-input\",\n        name: t`Reference Input`,\n        description: t`Renders an auto-complete input, allowing selection of a single value.`,\n        canUse({ field }) {\n            return field.type === \"ref\" && !field.list;\n        },\n        render(props) {\n            const Bind = props.getBind();\n\n            return (\n                <Bind>\n                    {bind => (\n                        <Bind.ValidationContainer>\n                            <ContentEntriesAutocomplete {...props} bind={bind} />\n                        </Bind.ValidationContainer>\n                    )}\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,IAAI,QAAQ,2BAA2B;AAChD,OAAOC,0BAA0B;AAEjC,MAAMC,CAAC,GAAGF,IAAI,CAACG,EAAE,CAAC,mCAAmC,CAAC;AAEtD,MAAMC,MAAmC,GAAG;EACxCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,+BAA+B;EACrCC,QAAQ,EAAE;IACNC,YAAY,EAAE,WAAW;IACzBF,IAAI,EAAEJ,CAAC,iBAAiB;IACxBO,WAAW,EAAEP,CAAC,uEAAuE;IACrFQ,MAAMA,CAAC;MAAEC;IAAM,CAAC,EAAE;MACd,OAAOA,KAAK,CAACN,IAAI,KAAK,KAAK,IAAI,CAACM,KAAK,CAACC,IAAI;IAC9C,CAAC;IACDC,MAAMA,CAACC,KAAK,EAAE;MACV,MAAMC,IAAI,GAAGD,KAAK,CAACE,OAAO,CAAC,CAAC;MAE5B,oBACIjB,KAAA,CAAAkB,aAAA,CAACF,IAAI,QACAG,IAAI,iBACDnB,KAAA,CAAAkB,aAAA,CAACF,IAAI,CAACI,mBAAmB,qBACrBpB,KAAA,CAAAkB,aAAA,CAAChB,0BAA0B,EAAAmB,MAAA,CAAAC,MAAA,KAAKP,KAAK;QAAEI,IAAI,EAAEA;MAAK,EAAE,CAC9B,CAE5B,CAAC;IAEf;EACJ;AACJ,CAAC;AAED,eAAed,MAAM","ignoreList":[]}

package/admin/plugins/fieldRenderers/ref/refInputs.d.ts

@@ -1,3 +1,3 @@
-import { CmsModelFieldRendererPlugin } from "../../../../types";
+import type { CmsModelFieldRendererPlugin } from "../../../../types.js";
 declare const plugin: CmsModelFieldRendererPlugin;
 export default plugin;

package/admin/plugins/fieldRenderers/ref/refInputs.js

@@ -1,44 +1,34 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = _interopRequireDefault(require("react"));
-var _i18n = require("@webiny/app/i18n");
-var _form = require("@webiny/form");
-var _ContentEntriesMultiAutoComplete = _interopRequireDefault(require("./components/ContentEntriesMultiAutoComplete"));
-var _templateObject, _templateObject2;
-var t = _i18n.i18n.ns("app-headless-cms/admin/fields/ref");
-var getKey = function getKey(field, id) {
+import React from "react";
+import { i18n } from "@webiny/app/i18n/index.js";
+import { useForm } from "@webiny/form";
+import ContentEntriesMultiAutocomplete from "./components/ContentEntriesMultiAutoComplete.js";
+const t = i18n.ns("app-headless-cms/admin/fields/ref");
+const getKey = (field, id) => {
   return (id || "unknown") + "." + field.fieldId;
 };
-var plugin = {
+const plugin = {
   type: "cms-editor-field-renderer",
   name: "cms-editor-field-renderer-ref-inputs",
   renderer: {
     rendererName: "ref-inputs",
-    name: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Reference Inputs"]))),
-    description: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Renders an auto-complete input, allowing selection of multiple values."]))),
-    canUse: function canUse(_ref) {
-      var field = _ref.field;
-      return field.type === "ref" && !!field.multipleValues;
+    name: t`Reference Inputs`,
+    description: t`Renders an auto-complete input, allowing selection of multiple values.`,
+    canUse({
+      field
+    }) {
+      return field.type === "ref" && !!field.list;
     },
-    render: function render(props) {
-      var Bind = props.getBind();
-      var form = (0, _form.useForm)();
-      return /*#__PURE__*/_react.default.createElement(Bind, null, function (bind) {
-        return /*#__PURE__*/_react.default.createElement(_ContentEntriesMultiAutoComplete.default, Object.assign({
-          key: getKey(props.field, form.data.id)
-        }, props, {
-          bind: bind
-        }));
-      });
+    render(props) {
+      const Bind = props.getBind();
+      const form = useForm();
+      return /*#__PURE__*/React.createElement(Bind, null, bind => /*#__PURE__*/React.createElement(Bind.ValidationContainer, null, /*#__PURE__*/React.createElement(ContentEntriesMultiAutocomplete, Object.assign({
+        key: getKey(props.field, form.data.id)
+      }, props, {
+        bind: bind
+      }))));
     }
   }
 };
-var _default = exports.default = plugin;
+export default plugin;
 
 //# sourceMappingURL=refInputs.js.map

package/admin/plugins/fieldRenderers/ref/refInputs.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_i18n","_form","_ContentEntriesMultiAutoComplete","_templateObject","_templateObject2","t","i18n","ns","getKey","field","id","fieldId","plugin","type","name","renderer","rendererName","_taggedTemplateLiteral2","default","description","canUse","_ref","multipleValues","render","props","Bind","getBind","form","useForm","createElement","bind","Object","assign","key","data","_default","exports"],"sources":["refInputs.tsx"],"sourcesContent":["import React from \"react\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { useForm } from \"@webiny/form\";\nimport { CmsModelField, CmsModelFieldRendererPlugin } from \"~/types\";\nimport ContentEntriesMultiAutocomplete from \"./components/ContentEntriesMultiAutoComplete\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/ref\");\n\nconst getKey = (field: CmsModelField, id: string | undefined): string => {\n    return (id || \"unknown\") + \".\" + field.fieldId;\n};\n\nconst plugin: CmsModelFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-ref-inputs\",\n    renderer: {\n        rendererName: \"ref-inputs\",\n        name: t`Reference Inputs`,\n        description: t`Renders an auto-complete input, allowing selection of multiple values.`,\n        canUse({ field }) {\n            return field.type === \"ref\" && !!field.multipleValues;\n        },\n        render(props) {\n            const Bind = props.getBind();\n            const form = useForm();\n\n            return (\n                <Bind>\n                    {bind => (\n                        <ContentEntriesMultiAutocomplete\n                            key={getKey(props.field, form.data.id)}\n                            {...props}\n                            bind={bind}\n                        />\n                    )}\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AAEA,IAAAG,gCAAA,GAAAJ,sBAAA,CAAAC,OAAA;AAA2F,IAAAI,eAAA,EAAAC,gBAAA;AAE3F,IAAMC,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,mCAAmC,CAAC;AAEtD,IAAMC,MAAM,GAAG,SAATA,MAAMA,CAAIC,KAAoB,EAAEC,EAAsB,EAAa;EACrE,OAAO,CAACA,EAAE,IAAI,SAAS,IAAI,GAAG,GAAGD,KAAK,CAACE,OAAO;AAClD,CAAC;AAED,IAAMC,MAAmC,GAAG;EACxCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,sCAAsC;EAC5CC,QAAQ,EAAE;IACNC,YAAY,EAAE,YAAY;IAC1BF,IAAI,EAAET,CAAC,CAAAF,eAAA,KAAAA,eAAA,OAAAc,uBAAA,CAAAC,OAAA,yBAAkB;IACzBC,WAAW,EAAEd,CAAC,CAAAD,gBAAA,KAAAA,gBAAA,OAAAa,uBAAA,CAAAC,OAAA,+EAAwE;IACtFE,MAAM,WAAAA,OAAAC,IAAA,EAAY;MAAA,IAATZ,KAAK,GAAAY,IAAA,CAALZ,KAAK;MACV,OAAOA,KAAK,CAACI,IAAI,KAAK,KAAK,IAAI,CAAC,CAACJ,KAAK,CAACa,cAAc;IACzD,CAAC;IACDC,MAAM,WAAAA,OAACC,KAAK,EAAE;MACV,IAAMC,IAAI,GAAGD,KAAK,CAACE,OAAO,CAAC,CAAC;MAC5B,IAAMC,IAAI,GAAG,IAAAC,aAAO,EAAC,CAAC;MAEtB,oBACI/B,MAAA,CAAAqB,OAAA,CAAAW,aAAA,CAACJ,IAAI,QACA,UAAAK,IAAI;QAAA,oBACDjC,MAAA,CAAAqB,OAAA,CAAAW,aAAA,CAAC3B,gCAAA,CAAAgB,OAA+B,EAAAa,MAAA,CAAAC,MAAA;UAC5BC,GAAG,EAAEzB,MAAM,CAACgB,KAAK,CAACf,KAAK,EAAEkB,IAAI,CAACO,IAAI,CAACxB,EAAE;QAAE,GACnCc,KAAK;UACTM,IAAI,EAAEA;QAAK,EACd,CAAC;MAAA,CAEJ,CAAC;IAEf;EACJ;AACJ,CAAC;AAAC,IAAAK,QAAA,GAAAC,OAAA,CAAAlB,OAAA,GAEaN,MAAM","ignoreList":[]}
+{"version":3,"names":["React","i18n","useForm","ContentEntriesMultiAutocomplete","t","ns","getKey","field","id","fieldId","plugin","type","name","renderer","rendererName","description","canUse","list","render","props","Bind","getBind","form","createElement","bind","ValidationContainer","Object","assign","key","data"],"sources":["refInputs.tsx"],"sourcesContent":["import React from \"react\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { useForm } from \"@webiny/form\";\nimport type { CmsModelField, CmsModelFieldRendererPlugin } from \"~/types.js\";\nimport ContentEntriesMultiAutocomplete from \"./components/ContentEntriesMultiAutoComplete.js\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/ref\");\n\nconst getKey = (field: CmsModelField, id: string | undefined): string => {\n    return (id || \"unknown\") + \".\" + field.fieldId;\n};\n\nconst plugin: CmsModelFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-ref-inputs\",\n    renderer: {\n        rendererName: \"ref-inputs\",\n        name: t`Reference Inputs`,\n        description: t`Renders an auto-complete input, allowing selection of multiple values.`,\n        canUse({ field }) {\n            return field.type === \"ref\" && !!field.list;\n        },\n        render(props) {\n            const Bind = props.getBind();\n            const form = useForm();\n\n            return (\n                <Bind>\n                    {bind => (\n                        <Bind.ValidationContainer>\n                            <ContentEntriesMultiAutocomplete\n                                key={getKey(props.field, form.data.id)}\n                                {...props}\n                                bind={bind}\n                            />\n                        </Bind.ValidationContainer>\n                    )}\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,2BAA2B;AAChD,SAASC,OAAO,QAAQ,cAAc;AAEtC,OAAOC,+BAA+B;AAEtC,MAAMC,CAAC,GAAGH,IAAI,CAACI,EAAE,CAAC,mCAAmC,CAAC;AAEtD,MAAMC,MAAM,GAAGA,CAACC,KAAoB,EAAEC,EAAsB,KAAa;EACrE,OAAO,CAACA,EAAE,IAAI,SAAS,IAAI,GAAG,GAAGD,KAAK,CAACE,OAAO;AAClD,CAAC;AAED,MAAMC,MAAmC,GAAG;EACxCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,sCAAsC;EAC5CC,QAAQ,EAAE;IACNC,YAAY,EAAE,YAAY;IAC1BF,IAAI,EAAER,CAAC,kBAAkB;IACzBW,WAAW,EAAEX,CAAC,wEAAwE;IACtFY,MAAMA,CAAC;MAAET;IAAM,CAAC,EAAE;MACd,OAAOA,KAAK,CAACI,IAAI,KAAK,KAAK,IAAI,CAAC,CAACJ,KAAK,CAACU,IAAI;IAC/C,CAAC;IACDC,MAAMA,CAACC,KAAK,EAAE;MACV,MAAMC,IAAI,GAAGD,KAAK,CAACE,OAAO,CAAC,CAAC;MAC5B,MAAMC,IAAI,GAAGpB,OAAO,CAAC,CAAC;MAEtB,oBACIF,KAAA,CAAAuB,aAAA,CAACH,IAAI,QACAI,IAAI,iBACDxB,KAAA,CAAAuB,aAAA,CAACH,IAAI,CAACK,mBAAmB,qBACrBzB,KAAA,CAAAuB,aAAA,CAACpB,+BAA+B,EAAAuB,MAAA,CAAAC,MAAA;QAC5BC,GAAG,EAAEtB,MAAM,CAACa,KAAK,CAACZ,KAAK,EAAEe,IAAI,CAACO,IAAI,CAACrB,EAAE;MAAE,GACnCW,KAAK;QACTK,IAAI,EAAEA;MAAK,EACd,CACqB,CAE5B,CAAC;IAEf;EACJ;AACJ,CAAC;AAED,eAAed,MAAM","ignoreList":[]}

package/admin/plugins/fieldRenderers/ref/{advanced → simple}/components/Loader.d.ts

@@ -1,3 +1,2 @@
 import React from "react";
 export declare const Loader: () => React.JSX.Element;
-export declare const AbsoluteLoader: () => React.JSX.Element;

package/admin/plugins/fieldRenderers/ref/simple/components/Loader.js

@@ -0,0 +1,15 @@
+import React from "react";
+import { OverlayLoader } from "@webiny/admin-ui";
+export const Loader = () => {
+  return /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: "180px"
+    },
+    className: "relative"
+  }, /*#__PURE__*/React.createElement(OverlayLoader, {
+    size: "md",
+    text: "Loading entries..."
+  }));
+};
+
+//# sourceMappingURL=Loader.js.map

package/admin/plugins/fieldRenderers/ref/simple/components/Loader.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","OverlayLoader","Loader","createElement","style","height","className","size","text"],"sources":["Loader.tsx"],"sourcesContent":["import React from \"react\";\nimport { OverlayLoader } from \"@webiny/admin-ui\";\n\nexport const Loader = () => {\n    return (\n        <div style={{ height: \"180px\" }} className={\"relative\"}>\n            <OverlayLoader size={\"md\"} text={\"Loading entries...\"} />\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,aAAa,QAAQ,kBAAkB;AAEhD,OAAO,MAAMC,MAAM,GAAGA,CAAA,KAAM;EACxB,oBACIF,KAAA,CAAAG,aAAA;IAAKC,KAAK,EAAE;MAAEC,MAAM,EAAE;IAAQ,CAAE;IAACC,SAAS,EAAE;EAAW,gBACnDN,KAAA,CAAAG,aAAA,CAACF,aAAa;IAACM,IAAI,EAAE,IAAK;IAACC,IAAI,EAAE;EAAqB,CAAE,CACvD,CAAC;AAEd,CAAC","ignoreList":[]}

package/admin/plugins/fieldRenderers/ref/simple/components/SimpleMultipleRenderer.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import { BindComponentRenderProp, CmsModelField } from "../../../../../../types";
-import { CmsReferenceValue } from "../../components/types";
+import type { BindComponentRenderProp, CmsModelField } from "../../../../../../types.js";
+import type { CmsReferenceValue } from "../../../../../../admin/plugins/fieldRenderers/ref/components/types.js";
 interface SimpleMultipleRendererProps {
     bind: BindComponentRenderProp<CmsReferenceValue[] | undefined | null>;
     field: CmsModelField;

package/admin/plugins/fieldRenderers/ref/simple/components/SimpleMultipleRenderer.js

@@ -1,49 +1,55 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SimpleMultipleRenderer = void 0;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _useContentModels2 = require("./useContentModels");
-var _useReferences = require("./useReferences");
-var _SimpleItems = require("./SimpleItems");
-var SimpleMultipleRenderer = exports.SimpleMultipleRenderer = function SimpleMultipleRenderer(props) {
-  var field = props.field,
-    bind = props.bind;
-  var values = (0, _react.useMemo)(function () {
-    return Array.isArray(bind.value) ? bind.value : [];
+import React, { useMemo } from "react";
+import { useContentModels } from "./useContentModels.js";
+import { useReferences } from "./useReferences.js";
+import { CheckboxGroup } from "@webiny/admin-ui";
+import { Loader } from "./Loader.js";
+export const SimpleMultipleRenderer = props => {
+  const {
+    field,
+    bind
+  } = props;
+  const values = useMemo(() => {
+    return Array.isArray(bind.value) ? bind.value.map(item => item.id) : [];
   }, [bind.value]);
-  var _useContentModels = (0, _useContentModels2.useContentModels)({
-      field: field
-    }),
-    models = _useContentModels.models;
-  var references = (0, _useReferences.useReferences)({
-    models: models
+  const {
+    models
+  } = useContentModels({
+    field
   });
-  var addItem = (0, _react.useCallback)(function (params) {
-    bind.onChange([].concat((0, _toConsumableArray2.default)(values), [params]));
-  }, [bind, values]);
-  var removeItem = (0, _react.useCallback)(function (_ref) {
-    var entryId = _ref.entryId;
-    bind.onChange(values.filter(function (value) {
-      if (!value?.id) {
-        return false;
-      }
-      return value.id.substring(0, entryId.length) !== entryId;
-    }));
-  }, [bind, values]);
-  return /*#__PURE__*/_react.default.createElement(_SimpleItems.SimpleItems, {
-    multiple: true,
-    field: field,
-    values: values,
-    items: references.entries,
-    addItem: addItem,
-    removeItem: removeItem
+  const references = useReferences({
+    models
   });
+  const items = useMemo(() => {
+    if (!references.entries) {
+      return [];
+    }
+    return references.entries.map(entry => ({
+      label: entry.title,
+      value: entry.id
+    }));
+  }, [references]);
+  if (references.loading) {
+    return /*#__PURE__*/React.createElement(Loader, null);
+  }
+  return /*#__PURE__*/React.createElement(CheckboxGroup, Object.assign({}, bind, {
+    label: field.label,
+    description: field.description,
+    note: field.note,
+    hint: field.help,
+    value: values,
+    items: items,
+    onChange: values => {
+      const selectedEntryIds = values.map(value => value.split("#")[0]);
+      const selectedItems = references.entries.filter(entry => selectedEntryIds.includes(entry.entryId));
+      bind.onChange(selectedItems.map(({
+        id,
+        model
+      }) => ({
+        id,
+        modelId: model.modelId
+      })));
+    }
+  }));
 };
 
 //# sourceMappingURL=SimpleMultipleRenderer.js.map

package/admin/plugins/fieldRenderers/ref/simple/components/SimpleMultipleRenderer.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_useContentModels2","_useReferences","_SimpleItems","SimpleMultipleRenderer","exports","props","field","bind","values","useMemo","Array","isArray","value","_useContentModels","useContentModels","models","references","useReferences","addItem","useCallback","params","onChange","concat","_toConsumableArray2","default","removeItem","_ref","entryId","filter","id","substring","length","createElement","SimpleItems","multiple","items","entries"],"sources":["SimpleMultipleRenderer.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport { BindComponentRenderProp, CmsModelField } from \"~/types\";\nimport { CmsReferenceValue } from \"~/admin/plugins/fieldRenderers/ref/components/types\";\nimport { useContentModels } from \"./useContentModels\";\nimport { useReferences } from \"./useReferences\";\nimport { AddItemParams, RemoveItemParams, SimpleItems } from \"./SimpleItems\";\n\ninterface SimpleMultipleRendererProps {\n    bind: BindComponentRenderProp<CmsReferenceValue[] | undefined | null>;\n    field: CmsModelField;\n}\n\nexport const SimpleMultipleRenderer = (props: SimpleMultipleRendererProps) => {\n    const { field, bind } = props;\n\n    const values = useMemo(() => {\n        return Array.isArray(bind.value) ? bind.value : [];\n    }, [bind.value]);\n\n    const { models } = useContentModels({\n        field\n    });\n\n    const references = useReferences({\n        models\n    });\n\n    const addItem = useCallback(\n        (params: AddItemParams) => {\n            bind.onChange([...values, params]);\n        },\n        [bind, values]\n    );\n    const removeItem = useCallback(\n        ({ entryId }: RemoveItemParams) => {\n            bind.onChange(\n                values.filter(value => {\n                    if (!value?.id) {\n                        return false;\n                    }\n                    return value.id.substring(0, entryId.length) !== entryId;\n                })\n            );\n        },\n        [bind, values]\n    );\n\n    return (\n        <SimpleItems\n            multiple={true}\n            field={field}\n            values={values}\n            items={references.entries}\n            addItem={addItem}\n            removeItem={removeItem}\n        />\n    );\n};\n"],"mappings":";;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAGA,IAAAC,kBAAA,GAAAD,OAAA;AACA,IAAAE,cAAA,GAAAF,OAAA;AACA,IAAAG,YAAA,GAAAH,OAAA;AAOO,IAAMI,sBAAsB,GAAAC,OAAA,CAAAD,sBAAA,GAAG,SAAzBA,sBAAsBA,CAAIE,KAAkC,EAAK;EAC1E,IAAQC,KAAK,GAAWD,KAAK,CAArBC,KAAK;IAAEC,IAAI,GAAKF,KAAK,CAAdE,IAAI;EAEnB,IAAMC,MAAM,GAAG,IAAAC,cAAO,EAAC,YAAM;IACzB,OAAOC,KAAK,CAACC,OAAO,CAACJ,IAAI,CAACK,KAAK,CAAC,GAAGL,IAAI,CAACK,KAAK,GAAG,EAAE;EACtD,CAAC,EAAE,CAACL,IAAI,CAACK,KAAK,CAAC,CAAC;EAEhB,IAAAC,iBAAA,GAAmB,IAAAC,mCAAgB,EAAC;MAChCR,KAAK,EAALA;IACJ,CAAC,CAAC;IAFMS,MAAM,GAAAF,iBAAA,CAANE,MAAM;EAId,IAAMC,UAAU,GAAG,IAAAC,4BAAa,EAAC;IAC7BF,MAAM,EAANA;EACJ,CAAC,CAAC;EAEF,IAAMG,OAAO,GAAG,IAAAC,kBAAW,EACvB,UAACC,MAAqB,EAAK;IACvBb,IAAI,CAACc,QAAQ,IAAAC,MAAA,KAAAC,mBAAA,CAAAC,OAAA,EAAKhB,MAAM,IAAEY,MAAM,EAAC,CAAC;EACtC,CAAC,EACD,CAACb,IAAI,EAAEC,MAAM,CACjB,CAAC;EACD,IAAMiB,UAAU,GAAG,IAAAN,kBAAW,EAC1B,UAAAO,IAAA,EAAmC;IAAA,IAAhCC,OAAO,GAAAD,IAAA,CAAPC,OAAO;IACNpB,IAAI,CAACc,QAAQ,CACTb,MAAM,CAACoB,MAAM,CAAC,UAAAhB,KAAK,EAAI;MACnB,IAAI,CAACA,KAAK,EAAEiB,EAAE,EAAE;QACZ,OAAO,KAAK;MAChB;MACA,OAAOjB,KAAK,CAACiB,EAAE,CAACC,SAAS,CAAC,CAAC,EAAEH,OAAO,CAACI,MAAM,CAAC,KAAKJ,OAAO;IAC5D,CAAC,CACL,CAAC;EACL,CAAC,EACD,CAACpB,IAAI,EAAEC,MAAM,CACjB,CAAC;EAED,oBACIX,MAAA,CAAA2B,OAAA,CAAAQ,aAAA,CAAC9B,YAAA,CAAA+B,WAAW;IACRC,QAAQ,EAAE,IAAK;IACf5B,KAAK,EAAEA,KAAM;IACbE,MAAM,EAAEA,MAAO;IACf2B,KAAK,EAAEnB,UAAU,CAACoB,OAAQ;IAC1BlB,OAAO,EAAEA,OAAQ;IACjBO,UAAU,EAAEA;EAAW,CAC1B,CAAC;AAEV,CAAC","ignoreList":[]}
+{"version":3,"names":["React","useMemo","useContentModels","useReferences","CheckboxGroup","Loader","SimpleMultipleRenderer","props","field","bind","values","Array","isArray","value","map","item","id","models","references","items","entries","entry","label","title","loading","createElement","Object","assign","description","note","hint","help","onChange","selectedEntryIds","split","selectedItems","filter","includes","entryId","model","modelId"],"sources":["SimpleMultipleRenderer.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport type { BindComponentRenderProp, CmsModelField } from \"~/types.js\";\nimport type { CmsReferenceValue } from \"~/admin/plugins/fieldRenderers/ref/components/types.js\";\nimport { useContentModels } from \"./useContentModels.js\";\nimport { useReferences } from \"./useReferences.js\";\nimport { CheckboxGroup } from \"@webiny/admin-ui\";\nimport { Loader } from \"./Loader.js\";\n\ninterface SimpleMultipleRendererProps {\n    bind: BindComponentRenderProp<CmsReferenceValue[] | undefined | null>;\n    field: CmsModelField;\n}\n\nexport const SimpleMultipleRenderer = (props: SimpleMultipleRendererProps) => {\n    const { field, bind } = props;\n\n    const values = useMemo(() => {\n        return Array.isArray(bind.value) ? bind.value.map(item => item.id) : [];\n    }, [bind.value]);\n\n    const { models } = useContentModels({\n        field\n    });\n\n    const references = useReferences({\n        models\n    });\n\n    const items = useMemo(() => {\n        if (!references.entries) {\n            return [];\n        }\n\n        return references.entries.map(entry => ({\n            label: entry.title,\n            value: entry.id\n        }));\n    }, [references]);\n\n    if (references.loading) {\n        return <Loader />;\n    }\n\n    return (\n        <CheckboxGroup\n            {...bind}\n            label={field.label}\n            description={field.description}\n            note={field.note}\n            hint={field.help}\n            value={values}\n            items={items}\n            onChange={(values: string[]) => {\n                const selectedEntryIds = values.map(value => value.split(\"#\")[0]);\n                const selectedItems = references.entries.filter(entry =>\n                    selectedEntryIds.includes(entry.entryId)\n                );\n\n                bind.onChange(\n                    selectedItems.map(({ id, model }) => ({\n                        id,\n                        modelId: model.modelId\n                    }))\n                );\n            }}\n        />\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AAGtC,SAASC,gBAAgB;AACzB,SAASC,aAAa;AACtB,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,MAAM;AAOf,OAAO,MAAMC,sBAAsB,GAAIC,KAAkC,IAAK;EAC1E,MAAM;IAAEC,KAAK;IAAEC;EAAK,CAAC,GAAGF,KAAK;EAE7B,MAAMG,MAAM,GAAGT,OAAO,CAAC,MAAM;IACzB,OAAOU,KAAK,CAACC,OAAO,CAACH,IAAI,CAACI,KAAK,CAAC,GAAGJ,IAAI,CAACI,KAAK,CAACC,GAAG,CAACC,IAAI,IAAIA,IAAI,CAACC,EAAE,CAAC,GAAG,EAAE;EAC3E,CAAC,EAAE,CAACP,IAAI,CAACI,KAAK,CAAC,CAAC;EAEhB,MAAM;IAAEI;EAAO,CAAC,GAAGf,gBAAgB,CAAC;IAChCM;EACJ,CAAC,CAAC;EAEF,MAAMU,UAAU,GAAGf,aAAa,CAAC;IAC7Bc;EACJ,CAAC,CAAC;EAEF,MAAME,KAAK,GAAGlB,OAAO,CAAC,MAAM;IACxB,IAAI,CAACiB,UAAU,CAACE,OAAO,EAAE;MACrB,OAAO,EAAE;IACb;IAEA,OAAOF,UAAU,CAACE,OAAO,CAACN,GAAG,CAACO,KAAK,KAAK;MACpCC,KAAK,EAAED,KAAK,CAACE,KAAK;MAClBV,KAAK,EAAEQ,KAAK,CAACL;IACjB,CAAC,CAAC,CAAC;EACP,CAAC,EAAE,CAACE,UAAU,CAAC,CAAC;EAEhB,IAAIA,UAAU,CAACM,OAAO,EAAE;IACpB,oBAAOxB,KAAA,CAAAyB,aAAA,CAACpB,MAAM,MAAE,CAAC;EACrB;EAEA,oBACIL,KAAA,CAAAyB,aAAA,CAACrB,aAAa,EAAAsB,MAAA,CAAAC,MAAA,KACNlB,IAAI;IACRa,KAAK,EAAEd,KAAK,CAACc,KAAM;IACnBM,WAAW,EAAEpB,KAAK,CAACoB,WAAY;IAC/BC,IAAI,EAAErB,KAAK,CAACqB,IAAK;IACjBC,IAAI,EAAEtB,KAAK,CAACuB,IAAK;IACjBlB,KAAK,EAAEH,MAAO;IACdS,KAAK,EAAEA,KAAM;IACba,QAAQ,EAAGtB,MAAgB,IAAK;MAC5B,MAAMuB,gBAAgB,GAAGvB,MAAM,CAACI,GAAG,CAACD,KAAK,IAAIA,KAAK,CAACqB,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;MACjE,MAAMC,aAAa,GAAGjB,UAAU,CAACE,OAAO,CAACgB,MAAM,CAACf,KAAK,IACjDY,gBAAgB,CAACI,QAAQ,CAAChB,KAAK,CAACiB,OAAO,CAC3C,CAAC;MAED7B,IAAI,CAACuB,QAAQ,CACTG,aAAa,CAACrB,GAAG,CAAC,CAAC;QAAEE,EAAE;QAAEuB;MAAM,CAAC,MAAM;QAClCvB,EAAE;QACFwB,OAAO,EAAED,KAAK,CAACC;MACnB,CAAC,CAAC,CACN,CAAC;IACL;EAAE,EACL,CAAC;AAEV,CAAC","ignoreList":[]}

package/admin/plugins/fieldRenderers/ref/simple/components/SimpleSingleRenderer.d.ts

@@ -1,10 +1,9 @@
 import React from "react";
-import { BindComponentRenderProp, CmsModelField } from "../../../../../../types";
-import { CmsReferenceValue } from "../../components/types";
+import type { BindComponentRenderProp, CmsModelField } from "../../../../../../types.js";
+import type { CmsReferenceValue } from "../../../../../../admin/plugins/fieldRenderers/ref/components/types.js";
 interface SimpleSingleRendererProps {
     bind: BindComponentRenderProp<CmsReferenceValue | undefined | null>;
     field: CmsModelField;
-    loadingElement?: JSX.Element;
 }
 export declare const SimpleSingleRenderer: (props: SimpleSingleRendererProps) => React.JSX.Element;
 export {};