@webiny/app-headless-cms 0.0.0-unstable.78f581c1d2 → 0.0.0-unstable.7be00a75a9

package/admin/plugins/fieldRenderers/ref/advanced/components/AdvancedMultipleReferenceSettings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/plugins/fieldRenderers/ref/advanced/components/AdvancedMultipleReferenceSettings.js","sources":["../../../../../../../src/admin/plugins/fieldRenderers/ref/advanced/components/AdvancedMultipleReferenceSettings.tsx"],"sourcesContent":["import { Bind } from \"@webiny/form\";\nimport React from \"react\";\nimport { Grid, Select } from \"@webiny/admin-ui\";\n\nexport interface MultiRefFieldSettings {\n    newItemPosition: \"first\" | \"last\";\n}\n\nexport const AdvancedMultipleReferenceSettings = () => {\n    return (\n        <>\n            <Grid.Column span={12}>\n                <Bind name={\"renderer.settings.newItemPosition\"} defaultValue={\"last\"}>\n                    <Select\n                        label={\"New item position\"}\n                        description={\"Where should the new items be added?\"}\n                        options={[\n                            { value: \"first\", label: \"Top of the list\" },\n                            { value: \"last\", label: \"Bottom of the list\" }\n                        ]}\n                    />\n                </Bind>\n            </Grid.Column>\n        </>\n    );\n};\n"],"names":["AdvancedMultipleReferenceSettings","Grid","Bind","Select"],"mappings":";;;AAQO,MAAMA,oCAAoC,IACtC,WAAP,GACI,wDACI,oBAACC,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACC,MAAIA;QAAC,MAAM;QAAqC,cAAc;qBAC3D,oBAACC,QAAMA;QACH,OAAO;QACP,aAAa;QACb,SAAS;YACL;gBAAE,OAAO;gBAAS,OAAO;YAAkB;YAC3C;gBAAE,OAAO;gBAAQ,OAAO;YAAqB;SAChD"}

package/admin/plugins/fieldRenderers/ref/advanced/components/AdvancedSingleReferenceField.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { BindComponentRenderProp, CmsModelFieldRendererProps } from "../../../../../../types.js";
+import type { CmsReferenceValue } from "../../../../../../admin/plugins/fieldRenderers/ref/components/types.js";
+interface AdvancedSingleReferenceFieldProps extends CmsModelFieldRendererProps {
+    bind: BindComponentRenderProp<CmsReferenceValue | null>;
+}
+export declare const AdvancedSingleReferenceField: (props: AdvancedSingleReferenceFieldProps) => React.JSX.Element;
+export {};

package/admin/plugins/fieldRenderers/ref/advanced/components/AdvancedSingleReferenceField.js

@@ -0,0 +1,161 @@
+import react, { useCallback, useEffect, useMemo, useState } from "react";
+import { Options } from "./Options.js";
+import { useReferences } from "../hooks/useReferences.js";
+import { Entry } from "./Entry.js";
+import { ReferencesDialog } from "./ReferencesDialog.js";
+import { useModelField, useModelFieldGraphqlContext, useQuery } from "../../../../../hooks/index.js";
+import { useSnackbar } from "@webiny/app-admin";
+import { NewReferencedEntryDialog } from "../../components/NewReferencedEntryDialog.js";
+import { FormComponentErrorMessage, FormComponentLabel, OverlayLoader } from "@webiny/admin-ui";
+import { CanEditField, useFieldEffectiveRules } from "@webiny/app-headless-cms-common";
+import * as __rspack_external__viewsGraphql_js_d6457cb3 from "../../../../../viewsGraphql.js";
+const AdvancedSingleReferenceField = (props)=>{
+    const { bind } = props;
+    const { showSnackbar } = useSnackbar();
+    const { field } = useModelField();
+    const rules = useFieldEffectiveRules(field);
+    const [linkEntryDialogModel, setLinkEntryDialogModel] = useState(null);
+    const [newEntryDialogModel, setNewEntryDialogModel] = useState(null);
+    const [loadedModels, setLoadedModels] = useState([]);
+    const requestContext = useModelFieldGraphqlContext();
+    const { data, loading: loadingModels } = useQuery(__rspack_external__viewsGraphql_js_d6457cb3.LIST_CONTENT_MODELS, {
+        context: requestContext
+    });
+    useEffect(()=>{
+        if (loadingModels || !data?.listContentModels?.data) return;
+        if (data.listContentModels.error) {
+            setLoadedModels([]);
+            showSnackbar(data.listContentModels.error.message);
+            return;
+        }
+        setLoadedModels(data.listContentModels.data);
+    }, [
+        data
+    ]);
+    const onNewRecord = useCallback((modelId)=>{
+        const model = loadedModels.find((model)=>model.modelId === modelId);
+        if (!model) return void console.log(`Cannot find model by modelId "${modelId}".`);
+        setNewEntryDialogModel(model);
+    }, [
+        loadedModels,
+        linkEntryDialogModel
+    ]);
+    const onNewEntryDialogClose = useCallback(()=>{
+        setNewEntryDialogModel(null);
+    }, [
+        linkEntryDialogModel
+    ]);
+    const onExistingRecord = useCallback((modelId)=>{
+        const model = loadedModels.find((model)=>model.modelId === modelId);
+        if (!model) return void console.log(`Cannot find model by modelId "${modelId}".`);
+        setLinkEntryDialogModel(model);
+    }, [
+        loadedModels,
+        linkEntryDialogModel
+    ]);
+    const onLinkEntryDialogClose = useCallback(()=>{
+        setLinkEntryDialogModel(null);
+    }, []);
+    const { entries, loading: loadingEntries } = useReferences({
+        values: bind.value,
+        requestContext
+    });
+    const onRemove = useCallback(()=>{
+        bind.onChange(null);
+    }, [
+        entries
+    ]);
+    const models = useMemo(()=>{
+        if (!loadedModels || !field.settings?.models) return [];
+        return (field.settings?.models || []).map(({ modelId })=>loadedModels.find((model)=>model.modelId === modelId)).filter(Boolean);
+    }, [
+        loadedModels,
+        entries
+    ]);
+    const loading = loadingEntries || loadingModels;
+    const storeValues = useCallback((values)=>{
+        if (values.length > 1) return void console.log("More than one value selected. This should never happen.");
+        if (0 === values.length || !values[0]?.id) return void bind.onChange(null);
+        bind.onChange(values[0]);
+    }, [
+        bind.value,
+        bind.onChange,
+        entries
+    ]);
+    const onNewEntryCreate = useCallback((data)=>{
+        if (!data) return void console.log("Could not store new entry to the reference field. Missing whole entry.");
+        if (!data.id) return void console.log('Could not store new entry to the reference field. Missing "id" value.');
+        if (!data.modelId) return void console.log('Could not store new entry to the reference field. Missing "modelId" value.');
+        storeValues([
+            {
+                id: data.id,
+                modelId: data.modelId
+            }
+        ]);
+    }, [
+        storeValues
+    ]);
+    const initialValue = useMemo(()=>{
+        if (0 === entries.length || 0 === loadedModels.length) return null;
+        const entry = entries[0];
+        if (!entry) return null;
+        const model = loadedModels.find((model)=>model.modelId === entry.model.modelId);
+        if (!model) return null;
+        return {
+            entry,
+            model
+        };
+    }, [
+        entries,
+        loadedModels
+    ]);
+    const { validation } = bind;
+    const { isValid: validationIsValid, message: validationMessage } = validation || {};
+    const invalid = useMemo(()=>false === validationIsValid, [
+        validationIsValid
+    ]);
+    const disabled = !rules.canEdit || rules.disabled;
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "@container"
+    }, /*#__PURE__*/ react.createElement(FormComponentLabel, {
+        text: field.label,
+        invalid: invalid,
+        disabled: disabled
+    }), /*#__PURE__*/ react.createElement("div", {
+        className: "webiny_ref-field-container"
+    }, loading && /*#__PURE__*/ react.createElement(OverlayLoader, {
+        size: "md"
+    }), initialValue && /*#__PURE__*/ react.createElement(Entry, {
+        model: initialValue.model,
+        placement: "singleRefField",
+        index: 0,
+        entry: initialValue.entry,
+        onRemove: onRemove
+    })), /*#__PURE__*/ react.createElement(FormComponentErrorMessage, {
+        text: validationMessage,
+        invalid: invalid,
+        disabled: disabled
+    }), initialValue && /*#__PURE__*/ react.createElement("div", {
+        className: "mb-md"
+    }), /*#__PURE__*/ react.createElement(CanEditField, null, /*#__PURE__*/ react.createElement(Options, {
+        models: models,
+        onNewRecord: onNewRecord,
+        onLinkExistingRecord: onExistingRecord
+    })), newEntryDialogModel && /*#__PURE__*/ react.createElement(NewReferencedEntryDialog, {
+        model: newEntryDialogModel,
+        onClose: onNewEntryDialogClose,
+        onChange: onNewEntryCreate
+    }), linkEntryDialogModel && /*#__PURE__*/ react.createElement(ReferencesDialog, {
+        ...props,
+        multiple: false,
+        values: bind.value ? [
+            bind.value
+        ] : [],
+        contentModel: linkEntryDialogModel,
+        storeValues: storeValues,
+        onDialogClose: onLinkEntryDialogClose
+    }));
+};
+export { AdvancedSingleReferenceField };
+
+//# sourceMappingURL=AdvancedSingleReferenceField.js.map

package/admin/plugins/fieldRenderers/ref/advanced/components/AdvancedSingleReferenceField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/plugins/fieldRenderers/ref/advanced/components/AdvancedSingleReferenceField.js","sources":["../../../../../../../src/admin/plugins/fieldRenderers/ref/advanced/components/AdvancedSingleReferenceField.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport type {\n    BindComponentRenderProp,\n    CmsContentEntry,\n    CmsModelFieldRendererProps,\n    CmsModel\n} from \"~/types.js\";\nimport { Options } from \"./Options.js\";\nimport { useReferences } from \"../hooks/useReferences.js\";\nimport { Entry } from \"./Entry.js\";\nimport { ReferencesDialog } from \"./ReferencesDialog.js\";\nimport { useQuery, useModelFieldGraphqlContext, useModelField } from \"~/admin/hooks/index.js\";\nimport type { ListCmsModelsQueryResponse } from \"~/admin/viewsGraphql.js\";\nimport * as GQL from \"~/admin/viewsGraphql.js\";\nimport { useSnackbar } from \"@webiny/app-admin\";\nimport type { CmsReferenceValue } from \"~/admin/plugins/fieldRenderers/ref/components/types.js\";\nimport { NewReferencedEntryDialog } from \"~/admin/plugins/fieldRenderers/ref/components/NewReferencedEntryDialog.js\";\nimport { FormComponentErrorMessage, FormComponentLabel, OverlayLoader } from \"@webiny/admin-ui\";\nimport { CanEditField, useFieldEffectiveRules } from \"@webiny/app-headless-cms-common\";\n\ninterface AdvancedSingleReferenceFieldProps extends CmsModelFieldRendererProps {\n    bind: BindComponentRenderProp<CmsReferenceValue | null>;\n}\n\nexport const AdvancedSingleReferenceField = (props: AdvancedSingleReferenceFieldProps) => {\n    const { bind } = props;\n    const { showSnackbar } = useSnackbar();\n    const { field } = useModelField();\n    const rules = useFieldEffectiveRules(field);\n\n    const [linkEntryDialogModel, setLinkEntryDialogModel] = useState<CmsModel | null>(null);\n    const [newEntryDialogModel, setNewEntryDialogModel] = useState<CmsModel | null>(null);\n    const [loadedModels, setLoadedModels] = useState<CmsModel[]>([]);\n    const requestContext = useModelFieldGraphqlContext();\n\n    const { data, loading: loadingModels } = useQuery<ListCmsModelsQueryResponse>(\n        GQL.LIST_CONTENT_MODELS,\n        {\n            context: requestContext\n        }\n    );\n\n    useEffect(() => {\n        if (loadingModels || !data?.listContentModels?.data) {\n            return;\n        } else if (data.listContentModels.error) {\n            setLoadedModels([]);\n            showSnackbar(data.listContentModels.error.message);\n            return;\n        }\n        setLoadedModels(data.listContentModels.data);\n    }, [data]);\n\n    const onNewRecord = useCallback(\n        (modelId: string) => {\n            const model = loadedModels.find(model => model.modelId === modelId);\n            if (!model) {\n                console.log(`Cannot find model by modelId \"${modelId}\".`);\n                return;\n            }\n            setNewEntryDialogModel(model);\n        },\n        [loadedModels, linkEntryDialogModel]\n    );\n\n    const onNewEntryDialogClose = useCallback(() => {\n        setNewEntryDialogModel(null);\n    }, [linkEntryDialogModel]);\n\n    const onExistingRecord = useCallback(\n        (modelId: string) => {\n            const model = loadedModels.find(model => model.modelId === modelId);\n            if (!model) {\n                console.log(`Cannot find model by modelId \"${modelId}\".`);\n                return;\n            }\n            setLinkEntryDialogModel(model);\n        },\n        [loadedModels, linkEntryDialogModel]\n    );\n\n    const onLinkEntryDialogClose = useCallback(() => {\n        setLinkEntryDialogModel(null);\n    }, []);\n\n    const { entries, loading: loadingEntries } = useReferences({\n        values: bind.value,\n        requestContext\n    });\n\n    const onRemove = useCallback(() => {\n        bind.onChange(null);\n    }, [entries]);\n\n    const models = useMemo(() => {\n        if (!loadedModels || !field.settings?.models) {\n            return [];\n        }\n\n        return (field.settings?.models || [])\n            .map(({ modelId }) => {\n                return loadedModels.find(model => model.modelId === modelId);\n            })\n            .filter(Boolean) as CmsModel[];\n    }, [loadedModels, entries]);\n\n    const loading = loadingEntries || loadingModels;\n\n    const storeValues = useCallback(\n        (values: CmsReferenceValue[]) => {\n            if (values.length > 1) {\n                console.log(\"More than one value selected. This should never happen.\");\n                return;\n            } else if (values.length === 0 || !values[0]?.id) {\n                bind.onChange(null);\n                return;\n            }\n            bind.onChange(values[0]);\n        },\n        [bind.value, bind.onChange, entries]\n    );\n\n    const onNewEntryCreate = useCallback(\n        (data: CmsContentEntry | null) => {\n            if (!data) {\n                console.log(\n                    `Could not store new entry to the reference field. Missing whole entry.`\n                );\n                return;\n            } else if (!data.id) {\n                console.log(\n                    `Could not store new entry to the reference field. Missing \"id\" value.`\n                );\n                return;\n            } else if (!data.modelId) {\n                console.log(\n                    `Could not store new entry to the reference field. Missing \"modelId\" value.`\n                );\n                return;\n            }\n            storeValues([\n                {\n                    id: data.id,\n                    modelId: data.modelId\n                }\n            ]);\n        },\n        [storeValues]\n    );\n\n    const initialValue = useMemo(() => {\n        if (entries.length === 0 || loadedModels.length === 0) {\n            return null;\n        }\n        const entry = entries[0];\n        if (!entry) {\n            return null;\n        }\n        const model = loadedModels.find(model => model.modelId === entry.model.modelId);\n        if (!model) {\n            return null;\n        }\n        return {\n            entry,\n            model\n        };\n    }, [entries, loadedModels]);\n\n    const { validation } = bind;\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n    const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);\n\n    const disabled = !rules.canEdit || rules.disabled;\n\n    return (\n        <div className={\"@container\"}>\n            <FormComponentLabel text={field.label} invalid={invalid} disabled={disabled} />\n            <div className={\"webiny_ref-field-container\"}>\n                {loading && <OverlayLoader size={\"md\"} />}\n                {initialValue && (\n                    <Entry\n                        model={initialValue.model}\n                        placement=\"singleRefField\"\n                        index={0}\n                        entry={initialValue.entry}\n                        onRemove={onRemove}\n                    />\n                )}\n            </div>\n            <FormComponentErrorMessage\n                text={validationMessage}\n                invalid={invalid}\n                disabled={disabled}\n            />\n            {initialValue && <div className=\"mb-md\" />}\n            <CanEditField>\n                <Options\n                    models={models}\n                    onNewRecord={onNewRecord}\n                    onLinkExistingRecord={onExistingRecord}\n                />\n            </CanEditField>\n\n            {newEntryDialogModel && (\n                <NewReferencedEntryDialog\n                    model={newEntryDialogModel}\n                    onClose={onNewEntryDialogClose}\n                    onChange={onNewEntryCreate}\n                />\n            )}\n\n            {linkEntryDialogModel && (\n                <ReferencesDialog\n                    {...props}\n                    multiple={false}\n                    values={bind.value ? [bind.value] : []}\n                    contentModel={linkEntryDialogModel}\n                    storeValues={storeValues}\n                    onDialogClose={onLinkEntryDialogClose}\n                />\n            )}\n        </div>\n    );\n};\n"],"names":["AdvancedSingleReferenceField","props","bind","showSnackbar","useSnackbar","field","useModelField","rules","useFieldEffectiveRules","linkEntryDialogModel","setLinkEntryDialogModel","useState","newEntryDialogModel","setNewEntryDialogModel","loadedModels","setLoadedModels","requestContext","useModelFieldGraphqlContext","data","loadingModels","useQuery","GQL","useEffect","onNewRecord","useCallback","modelId","model","console","onNewEntryDialogClose","onExistingRecord","onLinkEntryDialogClose","entries","loadingEntries","useReferences","onRemove","models","useMemo","Boolean","loading","storeValues","values","onNewEntryCreate","initialValue","entry","validation","validationIsValid","validationMessage","invalid","disabled","FormComponentLabel","OverlayLoader","Entry","FormComponentErrorMessage","CanEditField","Options","NewReferencedEntryDialog","ReferencesDialog"],"mappings":"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"}

package/admin/plugins/fieldRenderers/ref/advanced/components/Container.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+type ContainerProps = React.HTMLAttributes<HTMLDivElement>;
+declare const Container: ({ children, className, ...props }: ContainerProps) => React.JSX.Element;
+export { Container, type ContainerProps };

package/admin/plugins/fieldRenderers/ref/advanced/components/Container.js

@@ -0,0 +1,9 @@
+import react from "react";
+import { cn } from "@webiny/admin-ui";
+const Container = ({ children, className, ...props })=>/*#__PURE__*/ react.createElement("div", {
+        ...props,
+        className: cn("w-full rounded-md border-sm border-neutral-muted p-sm-extra mt-xs relative", className)
+    }, children);
+export { Container };
+
+//# sourceMappingURL=Container.js.map

package/admin/plugins/fieldRenderers/ref/advanced/components/Container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/plugins/fieldRenderers/ref/advanced/components/Container.js","sources":["../../../../../../../src/admin/plugins/fieldRenderers/ref/advanced/components/Container.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn } from \"@webiny/admin-ui\";\n\ntype ContainerProps = React.HTMLAttributes<HTMLDivElement>;\n\nconst Container = ({ children, className, ...props }: ContainerProps) => {\n    return (\n        <div\n            {...props}\n            className={cn(\n                \"w-full rounded-md border-sm border-neutral-muted p-sm-extra mt-xs relative\",\n                className\n            )}\n        >\n            {children}\n        </div>\n    );\n};\n\nexport { Container, type ContainerProps };\n"],"names":["Container","children","className","props","cn"],"mappings":";;AAKA,MAAMA,YAAY,CAAC,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGC,OAAuB,GACzD,WAAP,GACI,oBAAC;QACI,GAAGA,KAAK;QACT,WAAWC,GACP,8EACAF;OAGHD"}

package/admin/plugins/fieldRenderers/ref/advanced/components/Entries.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import type { CmsReferenceContentEntry } from "../../../../../../admin/plugins/fieldRenderers/ref/components/types.js";
+interface EntriesProps {
+    entries: CmsReferenceContentEntry[];
+    children: (entry: CmsReferenceContentEntry, index: number) => React.ReactNode;
+    loadMore: () => void;
+}
+export declare const Entries: (props: EntriesProps) => React.JSX.Element;
+export {};

package/admin/plugins/fieldRenderers/ref/advanced/components/Entries.js

@@ -0,0 +1,25 @@
+import react, { useCallback } from "react";
+import debounce from "lodash/debounce.js";
+import { ScrollArea } from "@webiny/admin-ui";
+const Entries = (props)=>{
+    const { entries, children, loadMore } = props;
+    const loadMoreOnScroll = useCallback(debounce((position)=>{
+        if (position.top <= 0.9) return;
+        loadMore();
+    }, 500), [
+        entries,
+        loadMore
+    ]);
+    return /*#__PURE__*/ react.createElement(ScrollArea, {
+        className: "max-h-[404px] w-full flex flex-col gap-md",
+        "data-testid": "advanced-ref-field-entries",
+        onScroll: loadMoreOnScroll
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-md"
+    }, entries.map((entry, index)=>/*#__PURE__*/ react.createElement("div", {
+            key: `entry-${entry.id}`
+        }, children(entry, index)))));
+};
+export { Entries };
+
+//# sourceMappingURL=Entries.js.map

package/admin/plugins/fieldRenderers/ref/advanced/components/Entries.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/plugins/fieldRenderers/ref/advanced/components/Entries.js","sources":["../../../../../../../src/admin/plugins/fieldRenderers/ref/advanced/components/Entries.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport debounce from \"lodash/debounce.js\";\nimport type { CmsReferenceContentEntry } from \"~/admin/plugins/fieldRenderers/ref/components/types.js\";\nimport { ScrollArea } from \"@webiny/admin-ui\";\n\ninterface EntriesProps {\n    entries: CmsReferenceContentEntry[];\n    children: (entry: CmsReferenceContentEntry, index: number) => React.ReactNode;\n    loadMore: () => void;\n}\n\nexport const Entries = (props: EntriesProps) => {\n    const { entries, children, loadMore } = props;\n\n    const loadMoreOnScroll = useCallback(\n        debounce(position => {\n            if (position.top <= 0.9) {\n                return;\n            }\n            loadMore();\n        }, 500),\n        [entries, loadMore]\n    );\n\n    return (\n        <ScrollArea\n            className={\"max-h-[404px] w-full flex flex-col gap-md\"}\n            data-testid=\"advanced-ref-field-entries\"\n            onScroll={loadMoreOnScroll}\n        >\n            <div className={\"flex flex-col gap-md\"}>\n                {entries.map((entry, index) => {\n                    return <div key={`entry-${entry.id}`}>{children(entry, index)}</div>;\n                })}\n            </div>\n        </ScrollArea>\n    );\n};\n"],"names":["Entries","props","entries","children","loadMore","loadMoreOnScroll","useCallback","debounce","position","ScrollArea","entry","index"],"mappings":";;;AAWO,MAAMA,UAAU,CAACC;IACpB,MAAM,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,QAAQ,EAAE,GAAGH;IAExC,MAAMI,mBAAmBC,YACrBC,SAASC,CAAAA;QACL,IAAIA,SAAS,GAAG,IAAI,KAChB;QAEJJ;IACJ,GAAG,MACH;QAACF;QAASE;KAAS;IAGvB,OAAO,WAAP,GACI,oBAACK,YAAUA;QACP,WAAW;QACX,eAAY;QACZ,UAAUJ;qBAEV,oBAAC;QAAI,WAAW;OACXH,QAAQ,GAAG,CAAC,CAACQ,OAAOC,QACV,WAAP,GAAO,oBAAC;YAAI,KAAK,CAAC,MAAM,EAAED,MAAM,EAAE,EAAE;WAAGP,SAASO,OAAOC;AAK3E"}

package/admin/plugins/fieldRenderers/ref/advanced/components/Entry.d.ts

@@ -0,0 +1,29 @@
+import React from "react";
+import type { CmsReferenceContentEntry, CmsReferenceValue } from "../../../../../../admin/plugins/fieldRenderers/ref/components/types.js";
+import type { CmsModel } from "../../../../../../types.js";
+interface EntryProps {
+    model: CmsModel;
+    entry: CmsReferenceContentEntry;
+    onChange: (value: CmsReferenceValue) => void;
+    index?: never;
+    disabled?: boolean;
+    selected: boolean;
+    onMoveUp?: never;
+    onMoveDown?: never;
+    onRemove?: never;
+    placement?: string;
+}
+interface EntryPropsWithRemove {
+    onRemove: (entryId: string) => void;
+    disabled?: boolean;
+    model: CmsModel;
+    entry: CmsReferenceContentEntry;
+    index: number;
+    onMoveUp?: (index: number, toTop: boolean) => void;
+    onMoveDown?: (index: number, toBottom: boolean) => void;
+    onChange?: never;
+    selected?: never;
+    placement?: string;
+}
+export declare const Entry: ({ entry, onChange, onRemove, selected, index, onMoveUp: onMoveUpClick, onMoveDown: onMoveDownClick, placement, disabled }: EntryPropsWithRemove | EntryProps) => React.JSX.Element;
+export {};

package/admin/plugins/fieldRenderers/ref/advanced/components/Entry.js

@@ -0,0 +1,119 @@
+import react, { useCallback, useMemo } from "react";
+import { Image } from "./entry/Image.js";
+import { Checkbox, DropdownMenu, IconButton, Tag, Text, TimeAgo, cn } from "@webiny/admin-ui";
+import { ReactComponent } from "@webiny/icons/more_vert.svg";
+import { ReactComponent as open_in_new_svg_ReactComponent } from "@webiny/icons/open_in_new.svg";
+import { ReactComponent as close_svg_ReactComponent } from "@webiny/icons/close.svg";
+import { ReactComponent as arrow_upward_svg_ReactComponent } from "@webiny/icons/arrow_upward.svg";
+import { ReactComponent as arrow_downward_svg_ReactComponent } from "@webiny/icons/arrow_downward.svg";
+import { useRouter } from "@webiny/app";
+import { Routes } from "../../../../../../routes.js";
+const Entry = ({ entry, onChange, onRemove, selected, index, onMoveUp: onMoveUpClick, onMoveDown: onMoveDownClick, placement, disabled = false })=>{
+    const { getLink } = useRouter();
+    const onSelect = useCallback(()=>{
+        if (onChange) onChange({
+            id: entry.id,
+            modelId: entry.model.modelId
+        });
+    }, [
+        onChange,
+        entry.id,
+        entry.model.modelId
+    ]);
+    const onMoveUp = useCallback((ev)=>{
+        if (!onMoveUpClick) return;
+        onMoveUpClick(index, ev.shiftKey);
+    }, [
+        onMoveUpClick,
+        index
+    ]);
+    const onMoveDown = useCallback((ev)=>{
+        if (!onMoveDownClick) return;
+        onMoveDownClick(index, ev.shiftKey);
+    }, [
+        onMoveDownClick,
+        index
+    ]);
+    const entryStatusLabel = entry.status.charAt(0).toUpperCase() + entry.status.slice(1);
+    const entryRevision = useMemo(()=>{
+        const extractedRevision = entry.id.split("#")[1] || "0001";
+        return "v" + Number(extractedRevision).toString();
+    }, [
+        entry.id
+    ]);
+    const folderId = entry.wbyAco_location?.folderId || entry.location?.folderId || "";
+    const link = getLink(Routes.ContentEntries.List, {
+        id: entry.id,
+        modelId: entry.model.modelId,
+        folderId
+    });
+    return /*#__PURE__*/ react.createElement("div", {
+        "data-selected": selected,
+        onClick: onSelect,
+        "data-role": "ref-field-entry",
+        className: cn("flex items-center justify-between gap-md w-full rounded-md bg-neutral-light p-sm-extra pr-lg hover:bg-neutral-dimmed border-md border-transparent data-[selected=true]:border-accent-dimmed", {
+            "hover:cursor-pointer": !!onChange
+        })
+    }, onChange && !disabled ? /*#__PURE__*/ react.createElement("div", null, /*#__PURE__*/ react.createElement(Checkbox, {
+        checked: selected,
+        onChange: ()=>{}
+    })) : null, /*#__PURE__*/ react.createElement("div", {
+        className: "grid grid-cols-[auto_1fr] items-start @lg:items-center gap-lg text-sm text-neutral-muted w-full min-w-0"
+    }, /*#__PURE__*/ react.createElement(Image, {
+        title: entry.title,
+        src: entry.image
+    }), /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col @lg:flex-row @lg:items-center @lg:justify-between gap-sm min-w-0"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "min-w-0"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "truncate"
+    }, entry.model.name), /*#__PURE__*/ react.createElement("div", {
+        title: entry.title,
+        className: "text-md text-neutral-primary font-semibold mb-sm text-ellipsis overflow-hidden whitespace-nowrap block"
+    }, entry.title), /*#__PURE__*/ react.createElement("div", null, /*#__PURE__*/ react.createElement("span", {
+        className: "w-[60px] inline-block"
+    }, "Created:"), /*#__PURE__*/ react.createElement("span", null, entry.createdBy.displayName, ",", " ", /*#__PURE__*/ react.createElement(TimeAgo, {
+        datetime: entry.createdOn
+    })))), /*#__PURE__*/ react.createElement("div", {
+        className: "flex items-center gap-sm shrink-0"
+    }, /*#__PURE__*/ react.createElement(Tag, {
+        content: /*#__PURE__*/ react.createElement(react.Fragment, null, entryStatusLabel, "\xa0", /*#__PURE__*/ react.createElement(Text, {
+            size: "sm",
+            className: "text-neutral-muted"
+        }, "(", entryRevision, ")")),
+        variant: "neutral-base-outline"
+    }), disabled || "multiRef" != placement ? null : /*#__PURE__*/ react.createElement("div", {
+        className: "flex gap-xs"
+    }, /*#__PURE__*/ react.createElement(IconButton, {
+        disabled: !onMoveUpClick,
+        variant: "ghost",
+        size: "sm",
+        icon: /*#__PURE__*/ react.createElement(arrow_upward_svg_ReactComponent, null),
+        onClick: onMoveUp
+    }), /*#__PURE__*/ react.createElement(IconButton, {
+        disabled: !onMoveDownClick,
+        variant: "ghost",
+        size: "sm",
+        icon: /*#__PURE__*/ react.createElement(arrow_downward_svg_ReactComponent, null),
+        onClick: onMoveDown
+    })), disabled ? null : /*#__PURE__*/ react.createElement(DropdownMenu, {
+        trigger: /*#__PURE__*/ react.createElement(IconButton, {
+            variant: "ghost",
+            size: "sm",
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null)
+        })
+    }, /*#__PURE__*/ react.createElement(DropdownMenu.Link, {
+        icon: /*#__PURE__*/ react.createElement(open_in_new_svg_ReactComponent, null),
+        text: "Open in new tab",
+        to: link,
+        target: "_blank"
+    }), onRemove && /*#__PURE__*/ react.createElement(DropdownMenu.Item, {
+        icon: /*#__PURE__*/ react.createElement(close_svg_ReactComponent, null),
+        text: "multiRef" === placement ? "Remove from list" : "Remove",
+        onClick: ()=>onRemove(entry.id)
+    }))))));
+};
+export { Entry };
+
+//# sourceMappingURL=Entry.js.map

package/admin/plugins/fieldRenderers/ref/advanced/components/Entry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/plugins/fieldRenderers/ref/advanced/components/Entry.js","sources":["../../../../../../../src/admin/plugins/fieldRenderers/ref/advanced/components/Entry.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport type {\n    CmsReferenceContentEntry,\n    CmsReferenceValue\n} from \"~/admin/plugins/fieldRenderers/ref/components/types.js\";\nimport { Image } from \"./entry/Image.js\";\nimport type { CmsModel } from \"~/types.js\";\nimport { Tag, TimeAgo, Text, DropdownMenu, IconButton, Checkbox, cn } from \"@webiny/admin-ui\";\nimport { ReactComponent as MoreVertIcon } from \"@webiny/icons/more_vert.svg\";\nimport { ReactComponent as OpenInNewIcon } from \"@webiny/icons/open_in_new.svg\";\nimport { ReactComponent as RemoveIcon } from \"@webiny/icons/close.svg\";\nimport { ReactComponent as ArrowUp } from \"@webiny/icons/arrow_upward.svg\";\nimport { ReactComponent as ArrowDown } from \"@webiny/icons/arrow_downward.svg\";\nimport { useRouter } from \"@webiny/app\";\nimport { Routes } from \"~/routes.js\";\n\ninterface EntryProps {\n    model: CmsModel;\n    entry: CmsReferenceContentEntry;\n    onChange: (value: CmsReferenceValue) => void;\n    index?: never;\n    disabled?: boolean;\n    selected: boolean;\n    onMoveUp?: never;\n    onMoveDown?: never;\n    onRemove?: never;\n    placement?: string;\n}\n\ninterface EntryPropsWithRemove {\n    onRemove: (entryId: string) => void;\n    disabled?: boolean;\n    model: CmsModel;\n    entry: CmsReferenceContentEntry;\n    index: number;\n    onMoveUp?: (index: number, toTop: boolean) => void;\n    onMoveDown?: (index: number, toBottom: boolean) => void;\n    onChange?: never;\n    selected?: never;\n    placement?: string;\n}\n\nexport const Entry = ({\n    entry,\n    onChange,\n    onRemove,\n    selected,\n    index,\n    onMoveUp: onMoveUpClick,\n    onMoveDown: onMoveDownClick,\n    placement,\n    disabled = false\n}: EntryPropsWithRemove | EntryProps) => {\n    const { getLink } = useRouter();\n\n    const onSelect = useCallback(() => {\n        if (onChange) {\n            onChange({\n                id: entry.id,\n                modelId: entry.model.modelId\n            });\n        }\n    }, [onChange, entry.id, entry.model.modelId]);\n\n    const onMoveUp = useCallback(\n        (ev: React.MouseEvent) => {\n            if (!onMoveUpClick) {\n                return;\n            }\n            onMoveUpClick(index, ev.shiftKey);\n        },\n        [onMoveUpClick, index]\n    );\n    const onMoveDown = useCallback(\n        (ev: React.MouseEvent) => {\n            if (!onMoveDownClick) {\n                return;\n            }\n            onMoveDownClick(index, ev.shiftKey);\n        },\n        [onMoveDownClick, index]\n    );\n\n    const entryStatusLabel = entry.status.charAt(0).toUpperCase() + entry.status.slice(1);\n\n    // Did not have `revision` field available in the `getLatestContentEntries`\n    // response, hence the manual extraction from the `id` field.\n    const entryRevision = useMemo(() => {\n        const extractedRevision = entry.id.split(\"#\")[1] || \"0001\";\n\n        // Remove leading zeros for correct padding.\n        return \"v\" + Number(extractedRevision).toString();\n    }, [entry.id]);\n\n    const folderId = entry.wbyAco_location?.folderId || entry.location?.folderId || \"\";\n\n    const link = getLink(Routes.ContentEntries.List, {\n        id: entry.id,\n        modelId: entry.model.modelId,\n        folderId\n    });\n\n    return (\n        <div\n            data-selected={selected}\n            onClick={onSelect}\n            data-role=\"ref-field-entry\"\n            className={cn(\n                \"flex items-center justify-between gap-md w-full rounded-md bg-neutral-light p-sm-extra pr-lg hover:bg-neutral-dimmed border-md border-transparent data-[selected=true]:border-accent-dimmed\",\n                { \"hover:cursor-pointer\": !!onChange }\n            )}\n        >\n            {onChange && !disabled ? (\n                <div>\n                    <Checkbox\n                        checked={selected}\n                        onChange={() => {\n                            // We're not calling the onSelect callback here because\n                            // the parent div already does that on click.\n                        }}\n                    />\n                </div>\n            ) : null}\n            <div\n                className={\n                    \"grid grid-cols-[auto_1fr] items-start @lg:items-center gap-lg text-sm text-neutral-muted w-full min-w-0\"\n                }\n            >\n                <Image title={entry.title} src={entry.image} />\n                <div\n                    className={\n                        \"flex flex-col @lg:flex-row @lg:items-center @lg:justify-between gap-sm min-w-0\"\n                    }\n                >\n                    <div className={\"min-w-0\"}>\n                        <div className={\"truncate\"}>{entry.model.name}</div>\n\n                        <div\n                            title={entry.title}\n                            className={\n                                \"text-md text-neutral-primary font-semibold mb-sm text-ellipsis overflow-hidden whitespace-nowrap block\"\n                            }\n                        >\n                            {entry.title}\n                        </div>\n\n                        <div>\n                            <span className={\"w-[60px] inline-block\"}>Created:</span>\n                            <span>\n                                {entry.createdBy.displayName},{\" \"}\n                                <TimeAgo datetime={entry.createdOn} />\n                            </span>\n                        </div>\n                    </div>\n                    <div className={\"flex items-center gap-sm shrink-0\"}>\n                        <Tag\n                            content={\n                                <>\n                                    {entryStatusLabel}&nbsp;\n                                    <Text size={\"sm\"} className={\"text-neutral-muted\"}>\n                                        ({entryRevision})\n                                    </Text>\n                                </>\n                            }\n                            variant={\"neutral-base-outline\"}\n                        />\n\n                        {!disabled && placement == \"multiRef\" ? (\n                            <div className={\"flex gap-xs\"}>\n                                <IconButton\n                                    disabled={!onMoveUpClick}\n                                    variant={\"ghost\"}\n                                    size={\"sm\"}\n                                    icon={<ArrowUp />}\n                                    onClick={onMoveUp}\n                                />\n                                <IconButton\n                                    disabled={!onMoveDownClick}\n                                    variant={\"ghost\"}\n                                    size={\"sm\"}\n                                    icon={<ArrowDown />}\n                                    onClick={onMoveDown}\n                                />\n                            </div>\n                        ) : null}\n\n                        {!disabled ? (\n                            <DropdownMenu\n                                trigger={\n                                    <IconButton\n                                        variant={\"ghost\"}\n                                        size={\"sm\"}\n                                        icon={<MoreVertIcon />}\n                                    />\n                                }\n                            >\n                                <DropdownMenu.Link\n                                    icon={<OpenInNewIcon />}\n                                    text={\"Open in new tab\"}\n                                    to={link}\n                                    target={\"_blank\"}\n                                />\n\n                                {onRemove && (\n                                    <DropdownMenu.Item\n                                        icon={<RemoveIcon />}\n                                        text={\n                                            placement === \"multiRef\" ? \"Remove from list\" : \"Remove\"\n                                        }\n                                        onClick={() => onRemove(entry.id)}\n                                    />\n                                )}\n                            </DropdownMenu>\n                        ) : null}\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n};\n"],"names":["Entry","entry","onChange","onRemove","selected","index","onMoveUpClick","onMoveDownClick","placement","disabled","getLink","useRouter","onSelect","useCallback","onMoveUp","ev","onMoveDown","entryStatusLabel","entryRevision","useMemo","extractedRevision","Number","folderId","link","Routes","cn","Checkbox","Image","TimeAgo","Tag","Text","IconButton","ArrowUp","ArrowDown","DropdownMenu","MoreVertIcon","OpenInNewIcon","RemoveIcon"],"mappings":"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"}

package/admin/plugins/fieldRenderers/ref/advanced/components/NoEntries.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+interface NoEntriesProps {
+    text?: React.ReactNode;
+}
+declare const NoEntries: ({ text }: NoEntriesProps) => React.JSX.Element;
+export { NoEntries, type NoEntriesProps };

package/admin/plugins/fieldRenderers/ref/advanced/components/NoEntries.js

@@ -0,0 +1,10 @@
+import react from "react";
+import { Text } from "@webiny/admin-ui";
+const NoEntries = ({ text = "No records found." })=>/*#__PURE__*/ react.createElement("div", {
+        className: "flex justify-center px-xl py-md-extra bg-neutral-subtle"
+    }, /*#__PURE__*/ react.createElement(Text, {
+        size: "sm"
+    }, text));
+export { NoEntries };
+
+//# sourceMappingURL=NoEntries.js.map

package/admin/plugins/fieldRenderers/ref/advanced/components/NoEntries.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/plugins/fieldRenderers/ref/advanced/components/NoEntries.js","sources":["../../../../../../../src/admin/plugins/fieldRenderers/ref/advanced/components/NoEntries.tsx"],"sourcesContent":["import React from \"react\";\nimport { Text } from \"@webiny/admin-ui\";\n\ninterface NoEntriesProps {\n    text?: React.ReactNode;\n}\n\nconst NoEntries = ({ text = \"No records found.\" }: NoEntriesProps) => {\n    return (\n        <div className={\"flex justify-center px-xl py-md-extra bg-neutral-subtle\"}>\n            <Text size={\"sm\"}>{text}</Text>\n        </div>\n    );\n};\n\nexport { NoEntries, type NoEntriesProps };\n"],"names":["NoEntries","text","Text"],"mappings":";;AAOA,MAAMA,YAAY,CAAC,EAAEC,OAAO,mBAAmB,EAAkB,GACtD,WAAP,GACI,oBAAC;QAAI,WAAW;qBACZ,oBAACC,MAAIA;QAAC,MAAM;OAAOD"}

package/admin/plugins/fieldRenderers/ref/advanced/components/Options.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import type { CmsModel } from "../../../../../../types.js";
+interface OptionsProps {
+    models: CmsModel[];
+    onNewRecord: (modelId: string) => void;
+    onLinkExistingRecord: (modelId: string) => void;
+}
+export declare const Options: ({ models, onNewRecord, onLinkExistingRecord }: OptionsProps) => React.JSX.Element;
+export {};

package/admin/plugins/fieldRenderers/ref/advanced/components/Options.js

@@ -0,0 +1,63 @@
+import react, { useCallback } from "react";
+import { OptionsModelList } from "./options/OptionsModelList.js";
+import { ReactComponent } from "@webiny/icons/add.svg";
+import { ReactComponent as link_svg_ReactComponent } from "@webiny/icons/link.svg";
+import { Button, DropdownMenu } from "@webiny/admin-ui";
+const CreateNewRecordButton = (props)=>/*#__PURE__*/ react.createElement(Button, {
+        ...props,
+        variant: "tertiary",
+        text: "Create a new record",
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null)
+    });
+const LinkExistingRecordButton = (props)=>/*#__PURE__*/ react.createElement(Button, {
+        ...props,
+        variant: "tertiary",
+        text: "Select an existing record",
+        icon: /*#__PURE__*/ react.createElement(link_svg_ReactComponent, null)
+    });
+const Options = ({ models, onNewRecord, onLinkExistingRecord })=>{
+    const hasMultipleModels = models.length > 1;
+    const onSingleNewRecord = useCallback(()=>{
+        if (0 === models.length || hasMultipleModels) return;
+        onNewRecord(models[0].modelId);
+    }, [
+        models
+    ]);
+    const onSingleExistingRecord = useCallback(()=>{
+        if (0 === models.length || hasMultipleModels) return;
+        onLinkExistingRecord(models[0].modelId);
+    }, [
+        models
+    ]);
+    if (hasMultipleModels) return /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-wrap gap-sm"
+    }, /*#__PURE__*/ react.createElement(DropdownMenu, {
+        trigger: /*#__PURE__*/ react.createElement(Button, {
+            variant: "tertiary",
+            text: "Create a new record",
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null)
+        })
+    }, /*#__PURE__*/ react.createElement(OptionsModelList, {
+        onClick: onNewRecord,
+        models: models
+    })), /*#__PURE__*/ react.createElement(DropdownMenu, {
+        trigger: /*#__PURE__*/ react.createElement(Button, {
+            variant: "tertiary",
+            text: "Select an existing record",
+            icon: /*#__PURE__*/ react.createElement(link_svg_ReactComponent, null)
+        })
+    }, /*#__PURE__*/ react.createElement(OptionsModelList, {
+        onClick: onLinkExistingRecord,
+        models: models
+    })));
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-wrap gap-sm"
+    }, /*#__PURE__*/ react.createElement(CreateNewRecordButton, {
+        onClick: onSingleNewRecord
+    }), /*#__PURE__*/ react.createElement(LinkExistingRecordButton, {
+        onClick: onSingleExistingRecord
+    }));
+};
+export { Options };
+
+//# sourceMappingURL=Options.js.map

package/admin/plugins/fieldRenderers/ref/advanced/components/Options.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin/plugins/fieldRenderers/ref/advanced/components/Options.js","sources":["../../../../../../../src/admin/plugins/fieldRenderers/ref/advanced/components/Options.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport type { CmsModel } from \"~/types.js\";\nimport { OptionsModelList } from \"~/admin/plugins/fieldRenderers/ref/advanced/components/options/OptionsModelList.js\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\nimport { ReactComponent as LinkIcon } from \"@webiny/icons/link.svg\";\nimport { Button, type ButtonProps, DropdownMenu } from \"@webiny/admin-ui\";\n\nconst CreateNewRecordButton = (props: ButtonProps) => {\n    return <Button {...props} variant={\"tertiary\"} text=\"Create a new record\" icon={<AddIcon />} />;\n};\n\nconst LinkExistingRecordButton = (props: ButtonProps) => {\n    return (\n        <Button\n            {...props}\n            variant={\"tertiary\"}\n            text=\"Select an existing record\"\n            icon={<LinkIcon />}\n        />\n    );\n};\n\ninterface OptionsProps {\n    models: CmsModel[];\n    onNewRecord: (modelId: string) => void;\n    onLinkExistingRecord: (modelId: string) => void;\n}\nexport const Options = ({ models, onNewRecord, onLinkExistingRecord }: OptionsProps) => {\n    const hasMultipleModels = models.length > 1;\n    const onSingleNewRecord = useCallback(() => {\n        if (models.length === 0 || hasMultipleModels) {\n            return;\n        }\n        onNewRecord(models[0].modelId);\n    }, [models]);\n\n    const onSingleExistingRecord = useCallback(() => {\n        if (models.length === 0 || hasMultipleModels) {\n            return;\n        }\n        onLinkExistingRecord(models[0].modelId);\n    }, [models]);\n\n    if (hasMultipleModels) {\n        return (\n            <div className={\"flex flex-wrap gap-sm\"}>\n                <DropdownMenu\n                    trigger={\n                        <Button\n                            variant={\"tertiary\"}\n                            text=\"Create a new record\"\n                            icon={<AddIcon />}\n                        />\n                    }\n                >\n                    <OptionsModelList onClick={onNewRecord} models={models} />\n                </DropdownMenu>\n                <DropdownMenu\n                    trigger={\n                        <Button\n                            variant={\"tertiary\"}\n                            text=\"Select an existing record\"\n                            icon={<LinkIcon />}\n                        />\n                    }\n                >\n                    <OptionsModelList onClick={onLinkExistingRecord} models={models} />\n                </DropdownMenu>\n            </div>\n        );\n    }\n\n    return (\n        <div className={\"flex flex-wrap gap-sm\"}>\n            <CreateNewRecordButton onClick={onSingleNewRecord} />\n            <LinkExistingRecordButton onClick={onSingleExistingRecord} />\n        </div>\n    );\n};\n"],"names":["CreateNewRecordButton","props","Button","AddIcon","LinkExistingRecordButton","LinkIcon","Options","models","onNewRecord","onLinkExistingRecord","hasMultipleModels","onSingleNewRecord","useCallback","onSingleExistingRecord","DropdownMenu","OptionsModelList"],"mappings":";;;;;AAOA,MAAMA,wBAAwB,CAACC,QACpB,WAAP,GAAO,oBAACC,QAAMA;QAAE,GAAGD,KAAK;QAAE,SAAS;QAAY,MAAK;QAAsB,oBAAM,oBAACE,gBAAOA;;AAG5F,MAAMC,2BAA2B,CAACH,QACvB,WAAP,GACI,oBAACC,QAAMA;QACF,GAAGD,KAAK;QACT,SAAS;QACT,MAAK;QACL,oBAAM,oBAACI,yBAAQA;;AAUpB,MAAMC,UAAU,CAAC,EAAEC,MAAM,EAAEC,WAAW,EAAEC,oBAAoB,EAAgB;IAC/E,MAAMC,oBAAoBH,OAAO,MAAM,GAAG;IAC1C,MAAMI,oBAAoBC,YAAY;QAClC,IAAIL,AAAkB,MAAlBA,OAAO,MAAM,IAAUG,mBACvB;QAEJF,YAAYD,MAAM,CAAC,EAAE,CAAC,OAAO;IACjC,GAAG;QAACA;KAAO;IAEX,MAAMM,yBAAyBD,YAAY;QACvC,IAAIL,AAAkB,MAAlBA,OAAO,MAAM,IAAUG,mBACvB;QAEJD,qBAAqBF,MAAM,CAAC,EAAE,CAAC,OAAO;IAC1C,GAAG;QAACA;KAAO;IAEX,IAAIG,mBACA,OAAO,WAAP,GACI,oBAAC;QAAI,WAAW;qBACZ,oBAACI,cAAYA;QACT,uBACI,oBAACZ,QAAMA;YACH,SAAS;YACT,MAAK;YACL,oBAAM,oBAACC,gBAAOA;;qBAItB,oBAACY,kBAAgBA;QAAC,SAASP;QAAa,QAAQD;uBAEpD,oBAACO,cAAYA;QACT,uBACI,oBAACZ,QAAMA;YACH,SAAS;YACT,MAAK;YACL,oBAAM,oBAACG,yBAAQA;;qBAIvB,oBAACU,kBAAgBA;QAAC,SAASN;QAAsB,QAAQF;;IAMzE,OAAO,WAAP,GACI,oBAAC;QAAI,WAAW;qBACZ,oBAACP,uBAAqBA;QAAC,SAASW;sBAChC,oBAACP,0BAAwBA;QAAC,SAASS;;AAG/C"}

package/admin/plugins/fieldRenderers/ref/advanced/components/ReferencesDialog.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import type { CmsModelField, CmsModelFieldRendererProps } from "../../../../../../types.js";
+import type { CmsReferenceValue } from "../../../../../../admin/plugins/fieldRenderers/ref/components/types.js";
+interface ReferencesDialogProps extends CmsModelFieldRendererProps {
+    values?: CmsReferenceValue[] | null;
+    field: CmsModelField;
+    onDialogClose: () => void;
+    storeValues: (values: CmsReferenceValue[]) => void;
+    multiple: boolean;
+}
+export declare const ReferencesDialog: (props: ReferencesDialogProps) => React.JSX.Element;
+export {};